/* ---------- theme tokens: dark (default) ---------- */
:root{
  --bg:#0D0E0B;
  --dots:rgba(248,203,70,.07);
  --card:#181915;
  --card2:#1F211C;
  --line:#2A2C25;
  --text:#F5F3EA;
  --mute:#A9A597;
  --dim:#6C695F;
  --green:#22B53F;
  --green-d:#0C831F;
  --green-l:rgba(34,181,63,.14);
  --green-btn:rgba(34,181,63,.08);
  --yellow:#F8CB46;
  --yellow-l:rgba(248,203,70,.11);
  --yellow-b:rgba(248,203,70,.35);
  --yellow-t:#F8CB46;
  --mar:#FF9A1F;
  --mar-l:rgba(255,154,31,.13);
  --red:#FF5C68;
  --red-l:rgba(255,92,104,.12);
  --track:#2A2C25;
  --shadow:0 10px 24px -14px rgba(0,0,0,.9);
  --head:#151611;
  --head-t:#F8CB46;
  --head-s:#A9A597;
  --sheet-back:rgba(0,0,0,.6);
  --r:18px;
  color-scheme:dark;
}
/* ---------- light ---------- */
:root[data-theme="light"]{
  --bg:#FFF8E1;
  --dots:rgba(255,138,0,.16);
  --card:#FFFFFF;
  --card2:#FFFDF6;
  --line:#F0E2B6;
  --text:#1D1D1B;
  --mute:#6F6A5C;
  --dim:#A39D8B;
  --green:#0C831F;
  --green-d:#0A6B19;
  --green-l:#EAF7EC;
  --green-btn:#F7FFF8;
  --yellow-l:#FFF1C2;
  --yellow-b:#F3D77A;
  --yellow-t:#7A5C00;
  --mar:#FF8A00;
  --mar-l:#FFF0E0;
  --red:#E23744;
  --red-l:#FFF2F2;
  --track:#F3EAD0;
  --shadow:0 8px 20px -14px rgba(120,90,0,.35);
  --head:#F8CB46;
  --head-t:#1D1D1B;
  --head-s:#5B4A12;
  --sheet-back:rgba(40,30,0,.4);
  color-scheme:light;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0}
body{
  background-color:var(--bg);
  background-image:radial-gradient(circle at 1px 1px,var(--dots) 1.2px,transparent 0);
  background-size:22px 22px;
  color:var(--text);font-family:Poppins,system-ui,-apple-system,"Segoe UI",sans-serif;
  min-height:100dvh;overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
button:disabled{opacity:.3;cursor:default}

/* ---------- header + marigold toran ---------- */
.top{position:sticky;top:0;z-index:5;background:var(--head);border-bottom:2px solid var(--yellow);box-shadow:0 4px 14px -8px rgba(0,0,0,.6)}
.topin{display:flex;align-items:center;justify-content:space-between;max-width:1080px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 10px) 16px 8px}
.brand b{font-size:22px;font-weight:800;letter-spacing:-.5px;display:block;line-height:1.1;color:var(--head-t)}
.brand b:after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);margin-left:3px}
.brand small{font-size:12px;font-weight:500;color:var(--head-s)}
.iconbtn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:#1D1D1B}
.toran{
  position:absolute;left:0;right:0;top:100%;height:34px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='34'%3E%3Cpath d='M0 3 Q28 15 56 3' stroke='%23C9822E' stroke-width='1.6' fill='none'/%3E%3Ccircle cx='14' cy='8' r='5.5' fill='%23FF8A00'/%3E%3Ccircle cx='14' cy='8' r='2.6' fill='%23FFC93C'/%3E%3Ccircle cx='42' cy='8' r='5.5' fill='%23FFB000'/%3E%3Ccircle cx='42' cy='8' r='2.6' fill='%23FF6A00'/%3E%3Cpath d='M28 9 q-4.5 5.5 0 11 q4.5 -5.5 0 -11z' fill='%2322B53F'/%3E%3Cline x1='28' y1='20' x2='28' y2='25' stroke='%23C9822E' stroke-width='1.2'/%3E%3Ccircle cx='28' cy='28' r='3' fill='%23FF4D5A'/%3E%3C/svg%3E") repeat-x;
  filter:drop-shadow(0 2px 4px rgba(255,138,0,.25));
}

/* ---------- layout ---------- */
.view{max-width:1080px;margin:0 auto;padding:42px 16px calc(env(safe-area-inset-bottom) + 96px)}
.view.anim>*{animation:rise .35s ease both}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
.cols{display:block}
@media (min-width:900px){.cols{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;align-items:start}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
h1{font-size:24px;margin:0;font-weight:800;letter-spacing:-.4px}
h2{font-size:16px;font-weight:700;margin:0 0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.mute{color:var(--mute)}.small{font-size:13px}
.row{display:flex;align-items:center;gap:10px}
.between{justify-content:space-between}
.grow{flex:1;min-width:0}
.link{color:var(--green);font-size:13px;font-weight:600;cursor:pointer}

/* ---------- dock ---------- */
.dock{position:fixed;z-index:6;left:0;right:0;bottom:0;display:flex;justify-content:center;
  background:var(--head);border-top:1px solid var(--line);padding:6px 6px calc(env(safe-area-inset-bottom) + 6px);box-shadow:0 -6px 20px -12px rgba(0,0,0,.6)}
.dock button{flex:1;max-width:110px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;color:var(--mute);font-size:11px;font-weight:600;position:relative}
.dock svg{width:22px;height:22px}
.dock button.on{color:var(--yellow)}
:root[data-theme="light"] .dock{background:#fff}
:root[data-theme="light"] .dock button.on{color:var(--green)}
.dock button.on:before{content:"";position:absolute;top:-6px;left:28%;right:28%;height:3px;border-radius:0 0 4px 4px;background:currentColor}

/* ---------- hero (festive banner) ---------- */
.hero{
  display:flex;gap:16px;align-items:center;color:#fff;border:0;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 88% 18%,rgba(255,214,90,.55) 0 3px,transparent 4px),
    radial-gradient(circle at 76% 70%,rgba(255,214,90,.45) 0 2px,transparent 3px),
    radial-gradient(circle at 60% 12%,rgba(255,255,255,.5) 0 2px,transparent 3px),
    radial-gradient(circle at 95% 85%,rgba(255,138,0,.6) 0 3px,transparent 4px),
    radial-gradient(120% 140% at 100% 0%,#1aa333 0%,#0C831F 45%,#085814 100%);
  box-shadow:0 14px 28px -14px rgba(12,131,31,.7);
}
.hero:after{content:"";position:absolute;right:-30px;bottom:-30px;width:120px;height:120px;border-radius:50%;border:14px dotted rgba(248,203,70,.35)}
.hero .greet{font-size:13px;opacity:.85}
.hero h1{color:#fff}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.pill{font-size:12px;font-weight:600;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.18);white-space:nowrap}
.pill.y{background:var(--yellow);color:#3d2f00}
.ringwrap{position:relative;display:grid;place-items:center;flex:none}
.ringwrap .lbl{position:absolute;text-align:center;line-height:1.1}
.ringwrap .lbl b{font-size:22px;display:block;font-weight:800}
.ringwrap .lbl small{font-size:10.5px;opacity:.85}
.ring circle{transition:stroke-dashoffset .8s ease}

/* ---------- now ---------- */
.now{background:var(--yellow-l);border-color:var(--yellow-b)}
.now .k{font-size:12px;font-weight:700;color:var(--yellow-t);text-transform:uppercase;letter-spacing:.6px}
.now .big{font-size:20px;font-weight:700;margin-top:2px}
.bar{height:8px;border-radius:9px;background:var(--track);overflow:hidden;margin-top:8px}
.bar i{display:block;height:100%;border-radius:9px;background:var(--c,var(--green));transition:width .6s}
.now .nx{margin-top:10px;font-size:13.5px;color:var(--mute)}

/* ---------- schedule rows (text only) ---------- */
.trow{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px dashed var(--line)}
.trow:last-child{border-bottom:0}
.tm{width:114px;flex:none;white-space:nowrap;font-size:12px;letter-spacing:-.2px;font-weight:600;color:var(--mute);font-variant-numeric:tabular-nums}
.tt{flex:1;min-width:0;font-weight:600;font-size:14.5px;line-height:1.3;overflow-wrap:anywhere}
.trow.done .tt{color:var(--dim);text-decoration:line-through}
.trow.cur{background:var(--yellow-l);margin:0 -10px;padding:11px 10px;border-radius:12px;border-bottom-color:transparent}
.trow.cur .tm{color:var(--yellow-t)}
.trow.missed .tm{color:var(--red)}
.addb{flex:none;min-width:78px;padding:7px 10px;border-radius:10px;border:1.5px solid var(--green);color:var(--green);background:var(--green-btn);font-weight:700;font-size:12.5px;letter-spacing:.4px}
.addb.on{background:var(--green);color:#fff}
.ed{flex:none;font-size:12.5px;font-weight:600;color:var(--green);padding:6px 10px;border-radius:9px;background:var(--green-l)}
.ed.del{color:var(--red);background:var(--red-l)}

/* ---------- tiles ---------- */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.tile{margin:0;padding:14px}
.tile .k{font-size:12px;font-weight:600;color:var(--mute)}
.tile .v{font-size:22px;font-weight:800;margin-top:2px}
.tile .v small{font-size:12px;color:var(--mute);font-weight:500}
.stepper{display:flex;align-items:center;gap:10px;margin-top:6px}
.stepper button,.qty button{width:32px;height:32px;border-radius:10px;border:1.5px solid var(--green);color:var(--green);font-weight:700;font-size:17px;background:var(--green-btn)}
.stepper b{min-width:40px;text-align:center;font-size:17px}

/* ---------- heatmap ---------- */
.heat{display:grid;grid-template-columns:repeat(14,1fr);gap:5px}
.heat i{aspect-ratio:1;border-radius:5px;background:var(--track)}
.heat i.l1{background:rgba(34,181,63,.25)}.heat i.l2{background:rgba(34,181,63,.5)}.heat i.l3{background:rgba(34,181,63,.78)}.heat i.l4{background:var(--green)}
.heat i.today{outline:2px solid var(--yellow);outline-offset:1px}

/* ---------- date bar ---------- */
.datebar{display:flex;align-items:center;justify-content:space-between;padding:8px;margin-bottom:14px}
.datebar button{width:38px;height:38px;border-radius:12px;font-size:20px;font-weight:700;background:var(--yellow-l);color:var(--yellow-t)}
.datebar div{text-align:center}
.datebar b{display:block;font-size:15px}.datebar small{font-size:12px;color:var(--mute)}

/* ---------- timetable ---------- */
.days{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px;margin:12px 0 14px;scrollbar-width:none}
.days::-webkit-scrollbar{display:none}
.daychip{flex:1 0 auto;min-width:52px;padding:9px 10px;border-radius:12px;text-align:center;background:var(--card);border:1px solid var(--line);font-weight:700;font-size:14px}
.daychip.on{background:var(--yellow);border-color:var(--yellow);color:#1D1D1B;box-shadow:0 6px 14px -8px rgba(248,203,70,.8)}
.daychip.today{position:relative}
.daychip.today:after{content:"";position:absolute;top:5px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--green)}
.ttrow{cursor:pointer}
.ttrow:hover .tt{color:var(--green)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:12px;font-weight:700;font-size:14.5px;background:var(--card2);border:1.5px solid var(--line);transition:transform .12s}
.btn:active{transform:scale(.97)}
.btn.pri{background:var(--green-d);color:#fff;border-color:var(--green-d);box-shadow:0 10px 20px -12px rgba(12,131,31,.9)}
:root[data-theme="light"] .btn.pri{background:var(--green);border-color:var(--green)}
.btn.out{border-color:var(--green);color:var(--green);background:var(--green-btn)}
.btn.warn{border-color:var(--red);color:var(--red);background:var(--red-l)}
.btn.full{width:100%}
.btn.sm{white-space:nowrap;padding:8px 12px;font-size:13px;border-radius:10px}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btns .btn{flex:1}

/* ---------- lists / forms ---------- */
.search{width:100%;padding:12px 14px;border-radius:12px;background:var(--card2);border:1.5px solid var(--line);outline:none;margin-bottom:8px}
.search:focus,.inp:focus,select:focus,textarea:focus{border-color:var(--green)}
.item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px dashed var(--line)}
.item:last-child{border-bottom:0}
.item .n{font-weight:600;font-size:14.5px}
.item .m{font-size:12px;color:var(--mute)}
.foodlist{max-height:360px;overflow-y:auto}
.qty{display:flex;align-items:center;gap:6px}
.qty button{width:28px;height:28px;font-size:15px;border-radius:8px}
.qty b{min-width:26px;text-align:center;font-size:14px}
.tip{background:var(--green-l);border-color:rgba(34,181,63,.35);font-size:14px;line-height:1.5}
.tip b{color:var(--green)}
.chart{width:100%;height:auto;display:block}
.tag{font-size:11px;font-weight:600;padding:2px 8px;border-radius:99px;background:var(--yellow-l);color:var(--yellow-t);margin-left:6px}
textarea,.inp,select{width:100%;padding:11px 13px;border-radius:12px;background:var(--card2);border:1.5px solid var(--line);outline:none;resize:vertical}
select option{background:var(--card)}
input[type="time"]::-webkit-calendar-picker-indicator{filter:var(--pick,invert(.8))}
:root[data-theme="light"]{--pick:none}
label.f{display:block;font-size:12.5px;font-weight:600;color:var(--mute);margin:12px 0 6px}
.quote{font-size:16px;line-height:1.5;font-weight:600;background:linear-gradient(135deg,rgba(248,203,70,.16),rgba(255,154,31,.1));border-color:var(--yellow-b)}
:root[data-theme="light"] .quote{background:linear-gradient(135deg,#FFF1C2,#FFE08A)}
.quote small{display:block;margin-top:6px;font-size:12px;color:var(--yellow-t);font-weight:500}
.stat3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center}
.stat3 div{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:10px 4px}
.stat3 b{display:block;font-size:18px;font-weight:800}
.stat3 small{font-size:11.5px;color:var(--mute)}
.status{display:inline-block;font-size:12.5px;font-weight:700;padding:4px 10px;border-radius:99px}
.status.ok{background:var(--green-l);color:var(--green)}
.status.warn{background:var(--mar-l);color:var(--mar)}
.lines .row{font-size:14px;margin:6px 0}
.ch-goal{stroke:var(--mar)}.ch-goal-t{fill:var(--mar)}
.ch-line{stroke:var(--green)}.ch-dot{fill:var(--card);stroke:var(--green)}
.ch-a0{stop-color:var(--green)}.ch-a1{stop-color:var(--green)}

/* ---------- sheet ---------- */
.sheet{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center}
.sheet[hidden]{display:none}
.sheet-back{position:absolute;inset:0;background:var(--sheet-back);animation:fade .2s both}
.sheet-panel{position:relative;width:min(560px,100%);max-height:90dvh;overflow-y:auto;background:var(--card);border-radius:22px 22px 0 0;
  padding:10px 18px calc(env(safe-area-inset-bottom) + 20px);animation:up .3s ease both;border-top:5px solid var(--yellow)}
@media (min-width:700px){.sheet{align-items:center}.sheet-panel{border-radius:22px}}
.grab{width:44px;height:5px;border-radius:9px;background:var(--line);margin:0 auto 12px}
.sheet h3{margin:0 0 2px;font-size:20px;font-weight:800}
@keyframes up{from{transform:translateY(30px);opacity:0}}
@keyframes fade{from{opacity:0}}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{padding:7px 12px;border-radius:10px;font-size:13.5px;font-weight:600;background:var(--card2);border:1.5px solid var(--line)}
.chip.on{background:var(--yellow);border-color:var(--yellow);color:#1D1D1B}
.seg{display:flex;background:var(--yellow-l);border-radius:12px;padding:4px;gap:4px;margin-top:12px}
.seg button{flex:1;padding:9px 6px;border-radius:9px;font-size:13px;font-weight:600;color:var(--mute)}
.seg button.on{background:var(--yellow);color:#1D1D1B}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.switch{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:12px;background:var(--card2);border:1.5px solid var(--line);margin-top:14px}
.tog{width:46px;height:26px;border-radius:99px;background:var(--line);position:relative;transition:background .2s;flex:none}
.tog:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
.tog.on{background:var(--green)}.tog.on:after{transform:translateX(20px)}

/* ---------- toast & empty ---------- */
.toast{position:fixed;z-index:30;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 84px);
  padding:11px 16px;border-radius:12px;font-size:14px;font-weight:500;display:flex;gap:14px;align-items:center;max-width:calc(100% - 32px);
  background:var(--yellow);color:#1D1D1B;animation:up .25s both;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
:root[data-theme="light"] .toast{background:#1D1D1B;color:#fff}
.toast[hidden]{display:none}
.toast button{color:var(--green-d);font-weight:800}
:root[data-theme="light"] .toast button{color:var(--yellow)}
.empty{text-align:center;padding:22px 10px}
.empty p{color:var(--mute);margin:6px 0 14px}

/* ---------- snap food ---------- */
.snapcard{border-color:var(--yellow-b);background:linear-gradient(160deg,var(--yellow-l),transparent 70%),var(--card)}
.snapcard .btns label{cursor:pointer}
.snapimg{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:14px;margin:12px 0 4px;border:1px solid var(--line)}
.snapwait{display:flex;align-items:center;gap:12px;padding:18px 4px;color:var(--mute);font-weight:500}
.spin{width:22px;height:22px;border-radius:50%;border:3px solid var(--track);border-top-color:var(--yellow);animation:spin .8s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.snaptotal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 6px;text-align:center}
.snaptotal div{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:10px 4px}
.snaptotal b{display:block;font-size:19px;font-weight:800;color:var(--yellow-t)}
.snaptotal small{font-size:11.5px;color:var(--mute)}
.chat{display:flex;flex-direction:column;gap:8px;margin:14px 0 10px;max-height:240px;overflow-y:auto;padding:2px}
.msg{max-width:85%;padding:9px 12px;border-radius:14px;font-size:13.5px;line-height:1.45}
.msg.ai{align-self:flex-start;background:var(--card2);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.user{align-self:flex-end;background:var(--yellow);color:#1D1D1B;font-weight:500;border-bottom-right-radius:4px}
.msg.err{border-color:var(--red);color:var(--red)}
.msg.typing{display:flex;align-items:center;gap:10px;color:var(--mute)}
.msg.typing .spin{width:16px;height:16px;border-width:2px}
.chatin{display:flex;gap:8px;align-items:center}
.chatin .inp{flex:1}
.editbox{background:var(--yellow-l);border:1px solid var(--yellow-b);border-radius:14px;padding:12px;margin:8px 0}
.item .ed{padding:6px 9px}

/* ---------- login ---------- */
#auth[hidden]{display:none}
body.locked .top,body.locked .view,body.locked .dock{display:none}
.authwrap{max-width:420px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 40px) 16px 40px;position:relative}
.authwrap:before{content:"";position:fixed;left:0;right:0;top:0;height:34px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='34'%3E%3Cpath d='M0 3 Q28 15 56 3' stroke='%23C9822E' stroke-width='1.6' fill='none'/%3E%3Ccircle cx='14' cy='8' r='5.5' fill='%23FF8A00'/%3E%3Ccircle cx='14' cy='8' r='2.6' fill='%23FFC93C'/%3E%3Ccircle cx='42' cy='8' r='5.5' fill='%23FFB000'/%3E%3Ccircle cx='42' cy='8' r='2.6' fill='%23FF6A00'/%3E%3Cpath d='M28 9 q-4.5 5.5 0 11 q4.5 -5.5 0 -11z' fill='%2322B53F'/%3E%3Cline x1='28' y1='20' x2='28' y2='25' stroke='%23C9822E' stroke-width='1.2'/%3E%3Ccircle cx='28' cy='28' r='3' fill='%23FF4D5A'/%3E%3C/svg%3E") repeat-x}
.authbrand{text-align:center;margin:16px 0 20px}
.authbrand img{border-radius:16px;box-shadow:0 12px 30px -12px rgba(248,203,70,.6)}
.authbrand h1{margin-top:10px;font-size:30px;color:var(--yellow)}
:root[data-theme="light"] .authbrand h1{color:var(--text)}
.authcard{padding:18px}
.autherr{min-height:20px;margin-top:10px;font-size:13px;font-weight:600;color:var(--red)}
.autherr.info{color:var(--green)}
