:root { color-scheme: dark; --canvas:#101111; --panel:#1e2020; --panel-raised:#262828; --line:#303332; --ink:#f6f7f3; --muted:#9a9f9a; --mint:#a8e5bf; color:var(--ink); background:var(--canvas); }
body { background:radial-gradient(ellipse at 100% 0,#30201d42,transparent 430px),var(--canvas); min-height:100dvh; }
.shell { max-width:920px; padding-left:28px; padding-right:28px; padding-bottom:calc(116px + env(safe-area-inset-bottom)); }
.shell header { padding:24px 0 14px; }
.brand { color:var(--ink); gap:10px; font-size:29px; letter-spacing:-1.2px; }
.brand img { background:#b9e4c3; border-radius:14px; padding:4px; width:39px; height:39px; }
.brand small { display:none; }
.local { color:#b9c0b9; background:#252928; font-size:10px; line-height:1.4; max-width:110px; }
.shell h1,.shell h2,.shell h3 { font-family:system-ui,-apple-system,sans-serif; color:var(--ink); }
.shell h1 { font-weight:650; }
.shell .eyebrow,.shell .muted,.shell .meal p,.shell .row small { color:var(--muted); }
.shell footer { display:none; }
#notice { color:var(--mint); padding-top:0; min-height:0; font-size:12px; }
#notice:not(:empty) { padding:10px 0; }
#notice button { color:var(--mint); }
.weekly-home { margin-top:14px; }
.week-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.week-heading h1 { font-size:14px; letter-spacing:0; margin:0; font-weight:600; }
.week-heading h1 span { color:var(--muted); font-weight:400; margin-left:5px; }
.week-controls { display:flex; align-items:center; gap:2px; }
.week-controls button { min-width:34px; min-height:38px; padding:7px; background:transparent; color:#bfc5bf; font-size:20px; font-weight:400; }
.week-controls [data-today] { font-size:11px; padding:8px 5px; }
.date-strip { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; margin-bottom:21px; }
.date-day { display:flex; flex-direction:column; align-items:center; gap:9px; min-height:94px; padding:10px 3px 5px; border-radius:18px; color:#9ea49e; background:transparent; font-weight:400; }
.date-day > span { font-size:11px; }
.date-day strong { display:grid; place-items:center; height:37px; width:37px; border-radius:50%; border:1px dashed #4b504c; font-size:16px; font-weight:500; color:#e6e9e2; }
.date-day i { width:4px; height:4px; border-radius:50%; background:transparent; }
.date-day.has-dinner i { background:var(--mint); }
.date-day.selected { background:#292c2a; color:#fff; }
.date-day.selected strong { border:1px solid var(--mint); background:#a8e5bf0a; color:var(--mint); }
.day-dinner { display:flex; justify-content:space-between; align-items:center; gap:18px; background:var(--panel); border:1px solid #ffffff03; border-radius:25px; padding:25px; min-height:196px; }
.micro-label { font-size:9px; font-weight:500; letter-spacing:1.3px; color:#a3aba1; margin:0 0 10px; }
.day-dinner-copy { flex:1; min-width:0; }
.day-dinner h2 { font-size:26px; letter-spacing:-.8px; line-height:1.2; font-weight:600; margin:0 0 9px; overflow-wrap:anywhere; }
.day-dinner-copy > p:not(.micro-label) { font-size:11px; line-height:1.6; color:var(--muted); margin:0; }
.day-actions { display:flex; gap:8px; margin-top:19px; flex-wrap:wrap; align-items:center; }
.soft-button { display:inline-flex; justify-content:center; align-items:center; gap:15px; color:#14221a; background:var(--mint); padding:10px 13px; min-height:40px; font-size:11px; border-radius:10px; font-weight:650; }
.soft-button svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.8; }
.quiet-button { background:transparent; color:#d3d9d0; font-size:11px; font-weight:450; padding:9px 2px; min-height:40px; }
.dinner-ring { background:conic-gradient(var(--mint) var(--progress),#303431 0); width:116px; height:116px; padding:6px; border-radius:50%; flex-shrink:0; }
.dinner-ring > div { height:100%; border-radius:50%; background:var(--panel); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.dinner-ring img { width:38px; height:38px; background:#b9e4c3; border-radius:50%; padding:4px; margin-bottom:3px; }
.dinner-ring strong { font-size:18px; line-height:1; font-weight:550; }
.dinner-ring small { font-size:11px; font-weight:400; color:#989f95; }
.dinner-ring span { font-size:5.5px; letter-spacing:.7px; color:#999f94; margin-top:5px; }
.dashboard-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:13px; }
.dashboard-stats button { text-align:left; padding:17px; border-radius:21px; background:var(--panel); color:var(--ink); min-width:0; }
.dashboard-stats strong { font-size:25px; font-weight:550; line-height:1.2; letter-spacing:-.8px; }
.dashboard-stats small { color:#828b80; font-size:13px; font-weight:400; letter-spacing:0; }
.dashboard-stats button > span { display:block; font-size:11px; color:#a5aca1; font-weight:400; margin-top:4px; }
.stat-icon { display:grid; place-items:center; width:45px; height:45px; border-radius:50%; border:5px solid #313532; margin:17px auto 0; }
.stat-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.mint { color:var(--mint); }.peach { color:#e8b4a0; }.lavender { color:#b9b0eb; }
.home-chat { margin-top:24px; padding:22px; background:var(--panel); border:1px solid #303731; border-radius:24px; }
.chat-heading { display:flex; justify-content:space-between; align-items:center; }
.ai-label { display:flex; align-items:center; gap:5px; font-size:8px; font-weight:650; letter-spacing:1.1px; color:var(--mint); }
.ai-label svg { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.6; }
.chat-heading h2 { margin:8px 0 0; font-size:25px; font-weight:600; letter-spacing:-.8px; }
.chat-date { color:#a5afa1; background:#2c332d; border-radius:20px; padding:7px 10px; font-size:10px; }
.chat-help { color:#9ba497; font-size:11px; line-height:1.6; margin:11px 0 15px; }
.chat-composer { display:flex; align-items:flex-end; gap:8px; background:#141715; border:1px solid #3b453c; border-radius:16px; padding:10px; }
.chat-composer textarea { margin:0; padding:5px; background:transparent; border:0; resize:vertical; min-height:45px; max-height:180px; font-size:13px; line-height:1.5; color:#eef3e9; flex:1; min-width:0; }
.chat-composer textarea::placeholder { color:#717d6c; }
.chat-composer button { width:35px; height:35px; min-height:35px; border-radius:50%; padding:8px; background:var(--mint); color:#122219; flex-shrink:0; }
.chat-composer button svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.chat-bottom { display:flex; align-items:center; justify-content:space-between; gap:9px; margin-top:9px; }
.chat-bottom > span { color:#8d9987; font-size:9px; line-height:1.5; }
.chat-bottom .quiet-button { min-height:25px; padding:2px; color:var(--mint); }
#home-chat-status { font-size:12px; line-height:1.7; color:#b6d7b7; background:#28332a; padding:12px; border-radius:12px; margin:12px 0 0; }
#home-chat-status.chat-error { color:#efb5a8; background:#382a26; }
[hidden] { display:none !important; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.unscheduled-link { color:#b8c7b0; font-size:11px; font-weight:400; background:none; line-height:1.6; text-align:left; width:100%; padding:17px 3px; display:flex; gap:14px; justify-content:space-between; }
.bottom-nav { left:50%; right:auto; width:min(620px,calc(100% - 26px)); transform:translateX(-50%); bottom:calc(12px + env(safe-area-inset-bottom)); border:1px solid #3b3e3a; background:#202322f5; border-radius:38px; padding:6px; box-shadow:0 5px 30px #0009; backdrop-filter:blur(14px); }
.bottom-nav-inner { gap:2px; }
.bottom-nav button { border-radius:30px; color:#8f978d; min-height:62px; padding:9px 2px; }
.bottom-nav button.active { color:#f1f5ec; background:#363b35; }
.bottom-nav button[data-tab='profile'] .nav-icon { width:25px; height:25px; border-radius:50%; background:#94cdaa; color:#183b29; display:grid; place-items:center; padding:5px; }
.bottom-nav button[data-tab='profile'] svg { width:16px; height:16px; }
.bottom-nav svg { width:21px; height:21px; }
.bottom-nav b { background:var(--mint); border-color:#202322; color:#183b29; }
.profile-page { padding-top:8px; }
.profile-page > h1 { font-size:32px; letter-spacing:-1px; margin:13px 0 25px; }
.profile-identity { display:flex; align-items:center; gap:18px; background:var(--panel); border-radius:24px; padding:24px; }
.profile-avatar { display:grid; place-items:center; width:68px; height:68px; border-radius:50%; background:linear-gradient(140deg,#a8e5bf,#5fbb98); color:#174732; flex-shrink:0; }
.profile-avatar svg { fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; width:35px; height:35px; }
.profile-identity .micro-label { color:var(--mint); font-size:8px; letter-spacing:1px; margin:0 0 6px; }
.profile-identity h2 { font-size:23px; font-weight:600; letter-spacing:-.6px; margin:0; }
.profile-identity > div > p:last-child { color:#8e9b8a; font-size:12px; margin:6px 0 0; }
.profile-group-label { font-size:13px; font-weight:450; margin:28px 0 12px; color:#9da596 !important; }
.profile-group { background:var(--panel); border-radius:22px; padding:0 19px; overflow:hidden; }
.profile-row { display:flex; align-items:center; gap:13px; padding:21px 0; min-height:68px; background:none; color:#e6eae0; border-radius:0; width:100%; text-align:left; font-size:14px; font-weight:450; }
.profile-row + .profile-row { border-top:1px solid #2b302a; }
.profile-row > svg:first-child { width:21px; height:21px; stroke:#bec9b7; }
.profile-row > svg { fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.profile-row > svg:last-child { margin-left:auto; width:17px; height:17px; color:#727c6b; }
.profile-row span { flex:1; }
.profile-local-note { color:#8e9a88; font-size:11px; line-height:1.7; margin:22px 3px 0; }
.settings-back { display:flex; gap:8px; align-items:center; background:transparent; color:#adbda3; padding:10px 0; font-size:13px; font-weight:450; }
.settings-card { background:var(--panel); border-color:var(--line); }
.sign-out { color:#efa99d; }
.view-title { font-size:29px; }
.view-title span { color:#919b8a; }
.secondary { color:#c2d9b4; border-color:#44513c; }
button:not(.welcome-retry):focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline-color:#a8e5bf; }
.shell .meal,.proposal { background:var(--panel); border-color:var(--line); border-radius:20px; }
.meal-top { color:#a8b29f; }
.meal h3 { font-size:23px; letter-spacing:-.5px; }
.meal .actions { border-color:#333b2e; }
.meal .actions button,.row button { color:#c2d4b7; }
.empty { color:#a7b19e; background:#20271e; border:1px solid #323d2a; border-radius:20px; }
.empty h3 { color:#eaf1e3; }
.row { border-color:#30382a; }
input,select,textarea { background:#191f17; color:#eaf1e3; border-color:#3c4833; }
input[type=checkbox] { accent-color:#a8e5bf; }
.order-note,#connection { background:#273022; color:#b8c9aa; }
.proposal summary { color:#bdd8ac; }
dialog { background:#181d16; color:#eaf1e3; border-color:#3b4631; border-radius:22px; }
dialog h2 { font-family:system-ui,sans-serif; font-size:24px; font-weight:600; }
dialog::backdrop { background:#050a04bb; backdrop-filter:blur(5px); }
dialog .muted { color:#9fac95; }
.dialog-head button,#ai-result { color:#c3ddb0; }
#formerror { color:#efada0; }
#draft-error { color:#efada0; font-size:13px; line-height:1.6; }
dialog button:not(.secondary):not(.dialog-head button):not(.text-button),.itemform > button,.schedule-actions > button:first-child { background:#a8e5bf; color:#173820; }
.draft-date { display:block; color:#c1d4b2; font-size:11px; margin-bottom:5px; }
.proposal .row { border-color:#35402d; }
@media(min-width:760px) {
  body[data-screen='home'] #content { display:grid; grid-template-columns:1.12fr 1fr; column-gap:24px; align-items:start; }
  .weekly-home { grid-row:1 / span 2; }
  .home-chat { margin-top:14px; }
  .unscheduled-link { grid-column:2; }
  .profile-page { max-width:600px; margin:auto; }
}
@media(max-width:700px) {
  .shell { padding-left:max(20px,env(safe-area-inset-left)); padding-right:max(20px,env(safe-area-inset-right)); }
  .shell header { padding:20px 0 9px; }
  .brand { font-size:28px; gap:8px; }
  .brand img { width:34px; height:34px; border-radius:11px; }
  .local { max-width:93px; font-size:8px; padding:7px 10px; }
  .weekly-home { margin-top:11px; }
  .week-heading { margin-bottom:8px; }
  .week-heading h1 { font-size:12px; }
  .week-controls button { min-height:38px; min-width:30px; }
  .week-controls [data-today] { font-size:10px; }
  .date-strip { gap:3px; margin-bottom:14px; }
  .date-day { min-height:80px; padding:7px 0 3px; gap:6px; border-radius:16px; }
  .date-day > span { font-size:10px; }
  .date-day strong { width:33px; height:33px; font-size:15px; }
  .day-dinner { min-height:165px; padding:18px 17px; gap:12px; border-radius:23px; }
  .micro-label { font-size:8px; letter-spacing:1px; }
  .day-dinner h2 { font-size:22px; letter-spacing:-.7px; }
  .day-dinner-copy > p:not(.micro-label) { font-size:10px; }
  .day-actions { margin-top:13px; gap:8px; }
  .soft-button { padding:9px 10px; min-height:38px; font-size:10px; gap:7px; }
  .quiet-button { font-size:10px; min-height:38px; }
  .dinner-ring { width:90px; height:90px; padding:5px; }
  .dinner-ring img { width:28px; height:28px; margin-bottom:4px; }
  .dinner-ring strong { font-size:16px; }
  .dinner-ring small { font-size:10px; }
  .dinner-ring span { font-size:4.5px; margin-top:4px; }
  .dashboard-stats { gap:10px; margin-top:12px; }
  .dashboard-stats button { padding:13px; border-radius:19px; }
  .dashboard-stats strong { font-size:22px; }
  .dashboard-stats button > span { font-size:10px; margin-top:3px; }
  .stat-icon { margin-top:10px; width:35px; height:35px; border-width:4px; }
  .stat-icon svg { width:16px; height:16px; }
  .home-chat { margin-top:16px; padding:18px; border-radius:23px; }
  .chat-heading h2 { font-size:25px; }
  .chat-help { font-size:10px; margin-top:10px; }
  .chat-composer textarea { font-size:16px; min-height:48px; }
  .chat-bottom > span { font-size:8px; }
  .bottom-nav { padding:5px; border-radius:34px; }
  .bottom-nav button { min-height:59px; font-size:9px; gap:5px; }
  .bottom-nav svg { width:20px; height:20px; }
  .profile-page > h1 { font-size:31px; margin:15px 0 23px; }
  .profile-identity { padding:22px 20px; gap:16px; }
  .profile-identity h2 { font-size:22px; }
  .profile-avatar { width:61px; height:61px; }
  .profile-group-label { font-size:12px; margin:24px 0 12px; }
  .profile-row { min-height:66px; font-size:13px; }
  .profile-group { padding:0 19px; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }
