:root {
  --ink: #183b35;
  --muted: #6d7d76;
  --paper: #f8f6ef;
  --card: #fffdf8;
  --line: #e4e5db;
  --green: #1f6656;
  --green-2: #dcece3;
  --lime: #dff168;
  --orange: #f39a5b;
  --orange-pale: #fbe1cf;
  --red: #c94e43;
  --yellow: #d49e24;
  --shadow: 0 15px 40px rgba(30, 71, 59, .08);
  --radius: 24px;
}
* { box-sizing: border-box; }
html { background: var(--paper); color: var(--ink); font-family: "Noto Sans JP", sans-serif; }
body { margin: 0; min-height: 100vh; background:
  radial-gradient(circle at 92% 2%, rgba(223,241,104,.22), transparent 22rem), var(--paper); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
.app-shell { max-width: 1180px; margin: auto; min-height: 100vh; padding-bottom: 100px; }
.topbar { height: 82px; padding: 16px clamp(18px,4vw,48px); display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; gap: 12px; border: 0; background: none; align-items: center; text-align: left; cursor: pointer; }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: var(--ink); color: var(--lime); font: 700 23px "Noto Serif JP"; transform: rotate(-4deg); }
.brand strong { display:block; font: 700 18px "Noto Serif JP"; letter-spacing:.04em; }
.brand small { display:block; color:var(--muted); margin-top:2px; font-size:10px; }
.top-actions{display:flex;align-items:center;gap:9px}.install-app-button{height:44px;border:0;border-radius:14px;background:var(--ink);color:white;padding:0 15px;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px}.install-app-button span{color:var(--lime);font:700 18px "DM Sans"}.install-app-button b{font-weight:700}.install-app-button:hover{background:var(--green)}
.icon-button { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: rgba(255,255,255,.75); cursor:pointer; font-weight:700; letter-spacing:2px; }
main { padding: 8px clamp(18px,4vw,48px) 40px; }
.page-enter { animation: enter .28s ease both; }
@keyframes enter { from { opacity:0; transform: translateY(8px); } }
.eyebrow { color:var(--green); font-size:12px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; margin-bottom:8px; }
h1,h2,h3,p { margin-top:0; }
h1 { font: 700 clamp(30px,5vw,54px)/1.25 "Noto Serif JP"; letter-spacing:-.02em; margin-bottom:12px; }
h2 { font:700 clamp(22px,3vw,32px)/1.4 "Noto Serif JP"; }
h3 { font-size:16px; }
.lead { color:var(--muted); line-height:1.9; max-width:680px; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:14px; margin:34px 0 16px; }
.section-head h2,.section-head p { margin-bottom:0; }
.text-button { border:0; background:none; color:var(--green); font-weight:700; cursor:pointer; padding:8px; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(260px,.75fr); gap:18px; }
.today-card { min-height:345px; border-radius:32px; background:var(--ink); color:white; padding:clamp(26px,4vw,44px); position:relative; overflow:hidden; box-shadow:var(--shadow); }
.today-card::before,.today-card::after { content:""; position:absolute; border-radius:50%; }
.today-card::before { width:240px;height:240px;background:var(--lime);right:-100px;top:-80px;opacity:.92; }
.today-card::after { width:190px;height:190px;border:1px solid rgba(255,255,255,.15);right:50px;bottom:-110px; }
.today-card .date { color:#bcd3cb; font-weight:600; }
.today-card h1 { max-width:620px; margin:30px 0 8px; font-size:clamp(34px,5vw,64px); position:relative; z-index:1; }
.today-card .meal-sub { color:#d4dfda; font-size:16px; }
.hero-actions { display:flex; gap:10px; flex-wrap:wrap; position:absolute; left:clamp(26px,4vw,44px); bottom:32px; z-index:2; }
.btn { border:0; border-radius:14px; padding:13px 18px; font-weight:700; cursor:pointer; transition:.2s ease; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:var(--lime); color:var(--ink); }
.btn-dark { background:var(--ink); color:white; }
.btn-soft { background:var(--green-2); color:var(--green); }
.btn-white { background:white; color:var(--ink); }
.btn-outline { border:1px solid var(--line); background:transparent; }
.btn-danger { color:var(--red); background:#fbe8e5; }
.stats-stack { display:grid; gap:14px; }
.stat-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow); min-height:104px; }
.stat-card .label { color:var(--muted); font-size:12px; display:flex; align-items:center; justify-content:space-between; }
.stat-card strong { display:block; font:700 30px "DM Sans"; margin-top:8px; }
.stat-card .mini { font-size:12px; color:var(--muted); margin-left:6px; }
.progress { height:7px; border-radius:8px; background:#e7e7df; overflow:hidden; margin-top:12px; }
.progress i { display:block;height:100%;background:var(--orange);border-radius:inherit; }
.quick-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px; }
.quick-card { border:1px solid var(--line); background:var(--card); border-radius:22px; padding:20px; min-height:135px; text-align:left; cursor:pointer; box-shadow:var(--shadow); position:relative; overflow:hidden; }
.quick-card:hover { border-color:#aac6bc; }
.quick-card .quick-icon { width:42px;height:42px;border-radius:14px;background:var(--green-2);display:grid;place-items:center;font-size:20px;margin-bottom:18px; }
.quick-card strong { display:block; font-size:15px; }
.quick-card small { display:block; color:var(--muted); margin-top:6px; }
.tip-banner { display:flex; gap:20px; align-items:center; background:var(--orange-pale); padding:24px; border-radius:24px; margin-top:16px; }
.tip-number { flex:0 0 58px; height:58px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:white;font:700 18px "DM Sans"; }
.tip-banner p { margin:4px 0 0; color:#765036; line-height:1.7; }
.page-heading { display:flex; align-items:start; justify-content:space-between; gap:20px; margin-bottom:24px; }
.week-switch { display:flex; gap:6px;background:#e9eadf;border-radius:16px;padding:5px; }
.week-switch button { border:0;background:none;border-radius:12px;padding:10px 14px;cursor:pointer;font-weight:700;color:var(--muted); }
.week-switch button.is-active { background:var(--card);color:var(--ink);box-shadow:0 3px 12px rgba(0,0,0,.06); }
.meal-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.55fr);gap:20px; }
.meal-list { display:grid; gap:10px; }
.meal-row { display:grid;grid-template-columns:70px 1fr auto;gap:16px;align-items:center;background:var(--card);border:1px solid var(--line);padding:17px;border-radius:20px;cursor:pointer;text-align:left; }
.meal-row.is-today { border-color:var(--green); box-shadow:inset 4px 0 var(--green); }
.meal-row .day { text-align:center; color:var(--muted);font-size:12px; }
.meal-row .day strong { display:block;color:var(--ink);font:700 22px "DM Sans"; }
.meal-row h3 { margin:0 0 5px; }
.meal-row p { margin:0;color:var(--muted);font-size:12px; }
.meal-row .arrow { width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--green-2); }
.side-panel { background:var(--ink);color:white;border-radius:26px;padding:24px;height:max-content;position:sticky;top:18px; }
.side-panel h3 { font:700 22px "Noto Serif JP"; }
.side-panel p {color:#bad0c8;line-height:1.8;font-size:13px;}
.control-card { background:rgba(255,255,255,.08);padding:15px;border-radius:16px;margin:12px 0; }
.control-card label {display:flex;justify-content:space-between;align-items:center;font-size:13px;}
.switch { appearance:none;width:44px;height:25px;background:#71867f;border-radius:20px;position:relative;cursor:pointer; }
.switch::after {content:"";position:absolute;width:19px;height:19px;background:white;border-radius:50%;top:3px;left:3px;transition:.2s;}
.switch:checked{background:var(--lime)} .switch:checked::after{left:22px}
.toolbar { display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:18px; }
.search { flex:1; min-width:220px; position:relative; }
.search input,.field input,.field select,.field textarea { width:100%;border:1px solid var(--line);background:var(--card);border-radius:14px;padding:13px 14px;color:var(--ink);outline:none; }
.search input {padding-left:42px;}
.search::before {content:"⌕";position:absolute;left:15px;top:10px;font-size:20px;color:var(--muted);}
.chips {display:flex;gap:7px;overflow:auto;padding-bottom:3px;}
.chip {white-space:nowrap;border:1px solid var(--line);background:var(--card);border-radius:30px;padding:9px 13px;cursor:pointer;font-size:12px;font-weight:600;}
.chip.is-active{background:var(--ink);color:white;border-color:var(--ink)}
.inventory-grid {display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.category-card {background:var(--card);border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:var(--shadow);}
.category-title {display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;}
.category-title h3{margin:0}.category-title small{color:var(--muted)}
.stock-list {display:grid;gap:8px;}
.stock-item {width:100%;border:0;background:#f4f3ec;border-radius:14px;padding:12px;display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:10px;text-align:left;cursor:pointer;}
.stock-dot{width:11px;height:11px;border-radius:50%;background:#55a276}.stock-item.low .stock-dot{background:var(--yellow)}.stock-item.none .stock-dot{background:var(--red)}
.stock-item span{font-weight:600;font-size:13px}.stock-item small{color:var(--muted)}
.legend {display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-bottom:16px;}.legend i{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:5px;}
.shopping-layout {display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.55fr);gap:20px;}
.shop-group {background:var(--card);border:1px solid var(--line);border-radius:24px;padding:18px;margin-bottom:14px;}
.shop-group-head {display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}.shop-group-head h3{margin:0}.shop-group-head small{color:var(--muted)}
.check-row {display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:11px 4px;border-top:1px solid #ecece5;}
.check-row:first-of-type{border-top:0}.check-row input{width:20px;height:20px;accent-color:var(--green)}
.check-row.is-checked .item-main{text-decoration:line-through;color:#9aa49f}.item-main strong{font-size:14px}.item-main small{display:block;color:var(--muted);margin-top:3px}.urgent{color:var(--red);font-size:11px;font-weight:700}
.small-delete{border:0;background:none;color:#a0aaa5;cursor:pointer;font-size:18px;padding:5px}
.summary-panel{background:var(--green-2);border-radius:24px;padding:22px;height:max-content;position:sticky;top:18px}.summary-panel h3{font:700 21px "Noto Serif JP"}.summary-line{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #c7ddd1;font-size:13px}.summary-line strong{font-family:"DM Sans"}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.more-card{border:1px solid var(--line);background:var(--card);border-radius:22px;padding:24px;text-align:left;cursor:pointer;min-height:160px;box-shadow:var(--shadow)}.more-card span{font-size:26px}.more-card h3{margin:25px 0 6px}.more-card p{color:var(--muted);font-size:12px;line-height:1.7;margin:0}
.more-card.featured-tool{background:var(--ink);color:white;border-color:var(--ink)}.more-card.featured-tool p{color:#bad0c8}.more-card.featured-tool span{color:var(--lime)}
.memo-category-chips{margin-bottom:20px;flex-wrap:wrap}.life-note-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.life-note-card{border:1px solid var(--line);background:var(--card);border-radius:22px;padding:20px;text-align:left;cursor:pointer;box-shadow:var(--shadow);min-height:220px;position:relative;transition:.2s ease}.life-note-card:hover{transform:translateY(-3px);border-color:#a9c8bc}.life-note-icon,.inline-note-icon{width:44px;height:44px;border-radius:14px;background:var(--green-2);color:var(--green);display:grid;place-items:center;font:700 17px "Noto Serif JP"}.life-note-category{position:absolute;top:22px;right:18px;color:var(--muted);font-size:10px;font-weight:700}.life-note-card h3{margin:25px 0 8px}.life-note-card p{color:var(--muted);font-size:12px;line-height:1.7;min-height:42px}.life-note-card small{display:flex;justify-content:space-between;align-items:center;color:var(--green);font-weight:700;margin-top:18px}.life-note-card small b{font-size:20px}.life-note-notice{margin-top:22px}.inline-note-icon{display:inline-grid;margin-right:12px;vertical-align:middle}.modal-description{font-size:13px;margin:10px 0 0}.life-note-editor{min-height:420px;line-height:1.85;resize:vertical}
.recipe-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.recipe-card{border:1px solid var(--line);background:var(--card);border-radius:22px;padding:20px;text-align:left;cursor:pointer;box-shadow:var(--shadow)}.recipe-art{height:130px;border-radius:17px;background:linear-gradient(135deg,#e1edda,#f6ddb9);display:grid;place-items:center;font-size:54px;margin-bottom:16px}.recipe-card p{color:var(--muted);font-size:12px}.recipe-meta{display:flex;gap:8px;flex-wrap:wrap}.tag{font-size:10px;background:var(--green-2);color:var(--green);border-radius:20px;padding:5px 8px}
.modal-layer{position:fixed;inset:0;background:rgba(16,43,37,.5);backdrop-filter:blur(5px);z-index:50;display:none;align-items:flex-end;justify-content:center;padding:20px}.modal-layer.is-open{display:flex}.modal{background:var(--paper);width:min(680px,100%);max-height:90vh;overflow:auto;border-radius:28px;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.22);animation:modalIn .25s ease}.modal.wide{width:min(900px,100%)}@keyframes modalIn{from{opacity:0;transform:translateY(24px)}}
.modal-head{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:20px}.modal-head h2{margin:0}.modal-close{border:1px solid var(--line);background:white;width:38px;height:38px;border-radius:50%;cursor:pointer}.fields{display:grid;gap:14px}.field label{display:block;font-size:12px;font-weight:700;margin-bottom:7px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px;flex-wrap:wrap}
.recipe-detail-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px}.big-art{min-height:250px;border-radius:24px;background:linear-gradient(135deg,#e4edd4,#f6d8b7);display:grid;place-items:center;font-size:90px}.ingredient-list{list-style:none;padding:0}.ingredient-list li{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:10px 0}.steps{counter-reset:step;list-style:none;padding:0}.steps li{counter-increment:step;display:grid;grid-template-columns:30px 1fr;gap:10px;margin:13px 0;line-height:1.7}.steps li::before{content:counter(step);width:26px;height:26px;border-radius:50%;background:var(--ink);color:white;display:grid;place-items:center;font:700 12px "DM Sans"}
.memo-list,.expense-list{display:grid;gap:10px;margin-top:18px}.memo-item,.expense-item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;display:grid;grid-template-columns:1fr auto;gap:12px}.memo-item p,.expense-item p{margin:4px 0 0;color:var(--muted);font-size:12px}.notice{padding:16px;border-radius:16px;background:#fff5d8;color:#6f5c24;font-size:13px;line-height:1.7}.toast{position:fixed;z-index:80;left:50%;bottom:100px;transform:translate(-50%,20px);background:var(--ink);color:white;padding:12px 18px;border-radius:30px;font-size:13px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}
.install-hero{background:var(--ink);color:white;border-radius:22px;padding:22px;display:flex;gap:17px;align-items:center;margin-bottom:18px}.install-hero-icon{width:68px;height:68px;border-radius:19px;background:var(--lime);display:grid;place-items:center;color:var(--ink);font:700 34px "Noto Serif JP";flex:0 0 auto}.install-hero h3{margin:0 0 5px;font:700 20px "Noto Serif JP"}.install-hero p{margin:0;color:#c5d7d0;font-size:12px;line-height:1.7}.install-guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.install-guide-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px}.install-guide-card h3{margin-bottom:14px}.install-steps{list-style:none;padding:0;margin:0;counter-reset:install}.install-steps li{counter-increment:install;display:grid;grid-template-columns:28px 1fr;gap:9px;margin:12px 0;font-size:13px;line-height:1.6}.install-steps li::before{content:counter(install);width:25px;height:25px;border-radius:50%;background:var(--green-2);color:var(--green);display:grid;place-items:center;font:700 11px "DM Sans"}
.bottom-nav{position:fixed;z-index:40;bottom:16px;left:50%;transform:translateX(-50%);width:min(610px,calc(100% - 24px));background:rgba(24,59,53,.96);backdrop-filter:blur(16px);border-radius:22px;padding:8px;display:grid;grid-template-columns:repeat(5,1fr);box-shadow:0 18px 50px rgba(17,47,40,.24)}
.nav-item{border:0;background:none;color:#a9bcb5;border-radius:15px;padding:7px 3px;cursor:pointer;position:relative}.nav-item span{display:block;font:700 20px "DM Sans";height:23px}.nav-item small{font-size:9px;font-weight:700}.nav-item.is-active{background:rgba(255,255,255,.1);color:var(--lime)}.nav-item b{position:absolute;top:3px;right:19%;min-width:17px;height:17px;padding:0 4px;border-radius:10px;background:var(--orange);color:white;font:700 10px/17px "DM Sans"}
.empty{text-align:center;padding:45px 20px;color:var(--muted)}.empty span{display:block;font-size:38px;margin-bottom:12px}
@media(max-width:820px){.hero-grid,.meal-layout,.shopping-layout{grid-template-columns:1fr}.stats-stack{grid-template-columns:repeat(3,1fr)}.stat-card{min-height:auto}.stat-card strong{font-size:22px}.quick-grid{grid-template-columns:repeat(2,1fr)}.side-panel,.summary-panel{position:static}.recipe-grid,.life-note-grid{grid-template-columns:repeat(2,1fr)}.more-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.topbar{height:70px}.brand small{display:none}.install-app-button{width:42px;padding:0;justify-content:center;border-radius:50%}.install-app-button b{display:none}main{padding-top:2px}.today-card{min-height:360px}.today-card::before{width:190px;height:190px}.stats-stack{grid-template-columns:1fr}.stat-card{display:grid;grid-template-columns:1fr auto;align-items:center}.stat-card .progress{grid-column:1/-1}.quick-card{min-height:120px;padding:16px}.inventory-grid,.recipe-grid,.more-grid,.life-note-grid{grid-template-columns:1fr}.page-heading{display:block}.page-heading .week-switch{margin-top:16px}.week-switch{overflow:auto}.meal-row{grid-template-columns:55px 1fr auto;padding:14px;gap:10px}.form-row,.recipe-detail-grid,.install-guide-grid{grid-template-columns:1fr}.big-art{min-height:180px}.modal-layer{padding:8px}.modal{padding:20px;border-radius:24px}.bottom-nav{bottom:8px}.hero-actions{right:26px}.hero-actions .btn{flex:1}.tip-banner{align-items:flex-start}.tip-number{flex-basis:46px;height:46px}.life-note-card{min-height:190px}.life-note-editor{min-height:360px}}
@media(display-mode:standalone){.install-app-button{display:none}}