/* ---- from lunch.html <style id="css-core"> ---- */

@font-face{font-family:'Walone';font-style:normal;font-weight:400;font-display:swap;src:url('/walone-400.ttf') format('truetype');}
@font-face{font-family:'Walone';font-style:normal;font-weight:700;font-display:swap;src:url('/walone-700.ttf') format('truetype');}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
/* design tokens (founder's premium pass, 2026-09-16 — direction "အရောင်တစ်ခု"):
   colour 60/30/10 — white ground, soft surfaces, and ONE accent used only on a real action;
   text is never pure black; five type steps; four radii; 8pt spacing; one soft shadow. */
:root{--bg:#ffffff;--soft:#f5f4f1;--line:#ecebe7;
      --ink:#1a1a1a;--mut:#6b6862;--ink-3:#a5a29b;--acc:#0a5aff;--err:#b42318;
      --t1:32px;--t2:20px;--t3:16px;--t4:13.5px;--t5:11.5px;--tn:25px;
      --s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;
      --r0:12px;--r1:16px;--r2:20px;--r3:28px;--rp:999px;
      --e1:0 10px 30px rgba(0,0,0,.05);--e2:0 16px 40px rgba(0,0,0,.10);
      --m-ink:#3a3631;--m-body:#ffffff;--m-top:#e6e1d7;--m-sh:rgba(0,0,0,.1);
      /* surfaces, kept separate from the text colour so dark mode can move them independently:
         --inv  a high-contrast chip/button (ink in light, near-white in dark)
         --elev a raised dark panel (the pass, the nav pill) — in dark it lifts off the page instead of inverting
         --card a raised light panel · --strip the code strip inside the pass · --navon the active nav chip */
      --inv:#1a1a1a;--inv-fg:#ffffff;--elev:#1a1a1a;--elev-fg:#ffffff;--card:#ffffff;
      --strip:#ffffff;--strip-fg:#1a1a1a;--navon:#ffffff;--navon-fg:#1a1a1a;--hdr:rgba(255,255,255,.92);
      color-scheme:light dark;}
/* dark mode: follows the phone, and an explicit choice on <html data-theme> always wins */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
      --bg:#121211;--soft:#1c1b19;--line:#2c2b27;
      --ink:#f2f1ee;--mut:#a09d96;--ink-3:#75726b;--acc:#4c86ff;--err:#ff7a6e;
      --inv:#f2f1ee;--inv-fg:#121211;--elev:#232220;--elev-fg:#f2f1ee;--card:#1f1e1b;
      --strip:#2e2d29;--strip-fg:#f2f1ee;--navon:#e9e7e2;--navon-fg:#121211;--hdr:rgba(18,18,17,.92);
      --e1:0 10px 30px rgba(0,0,0,.45);--e2:0 16px 40px rgba(0,0,0,.6);
      --m-ink:#a09d96;--m-body:#232220;--m-top:#3a3631;--m-sh:rgba(0,0,0,.45);}}
:root[data-theme="dark"]{
      --bg:#121211;--soft:#1c1b19;--line:#2c2b27;
      --ink:#f2f1ee;--mut:#a09d96;--ink-3:#75726b;--acc:#4c86ff;--err:#ff7a6e;
      --inv:#f2f1ee;--inv-fg:#121211;--elev:#232220;--elev-fg:#f2f1ee;--card:#1f1e1b;
      --strip:#2e2d29;--strip-fg:#f2f1ee;--navon:#e9e7e2;--navon-fg:#121211;--hdr:rgba(18,18,17,.92);
      --e1:0 10px 30px rgba(0,0,0,.45);--e2:0 16px 40px rgba(0,0,0,.6);
      --m-ink:#a09d96;--m-body:#232220;--m-top:#3a3631;--m-sh:rgba(0,0,0,.45);}
html{background:var(--bg);}
body{font-family:'Walone','Inter',-apple-system,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);}
.num{font-family:'Inter',-apple-system,'Segoe UI',Roboto,sans-serif;font-variant-numeric:tabular-nums;}
.my{letter-spacing:normal!important;}
[hidden]{display:none!important;}
img{max-width:100%;display:block;}
svg{display:block;}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit;}
input,textarea,select{font:inherit;color:inherit;}
a{color:inherit;text-decoration:none;}
.brandlogo{display:inline-block;height:20px;width:92px;background-image:url('/logo-black.png');background-size:contain;background-repeat:no-repeat;background-position:left center;flex:none;}
.mascot{display:block;overflow:visible;color:var(--m-ink);}
:root[data-theme="dark"] .brandlogo{background-image:url('/logo-white.png');}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .brandlogo{background-image:url('/logo-white.png');}}
:root[data-theme="dark"] #boot img{filter:invert(1) brightness(1.7);}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) #boot img{filter:invert(1) brightness(1.7);}}
.wrap{width:100%;max-width:640px;margin:0 auto;padding:0 18px;}
@media(min-width:900px){.wrap.wide{max-width:1120px;padding:0 28px;}}
.hdr{position:sticky;top:0;z-index:50;background:var(--hdr);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top);}
.hdr .row{display:flex;align-items:center;gap:12px;height:56px;}
.hdr .ttl{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:380px){.hdr .ttl{display:none;}}
.hdr .nav{margin-left:auto;display:flex;gap:14px;align-items:center;}
.hdr .nav a,.hdr .nav button{font-size:13.5px;color:var(--mut);padding:6px 2px;white-space:nowrap;}
.hdr .nav a:active,.hdr .nav a.on{color:var(--ink);}
.hdr .back{width:40px;height:40px;margin-left:-10px;border-radius:999px;display:flex;align-items:center;justify-content:center;color:var(--ink);flex:none;}
.hdr .back svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--inv);color:var(--inv-fg);border-radius:var(--rp);padding:12px 22px;font-size:16px;font-weight:500;min-height:48px;}
/* the ONLY accent in the app: the ticket action and the nav's centre button (10% of the 60/30/10) */
.btn.a{background:var(--acc);color:#fff;}
.btn.g{background:transparent;color:var(--ink);border:1px solid var(--line);}
.btn.d{background:transparent;color:var(--err);border:1px solid #f0c9c4;}
.btn.w{width:100%;padding:14px;}
.btn:disabled{opacity:.5;}
.btn .spin{border-color:rgba(127,127,127,.45);border-top-color:currentColor;}
.btn.g .spin,.btn.d .spin{border-color:var(--line);border-top-color:var(--ink);}
.lnk{color:var(--mut);font-size:13.5px;padding:6px 0;display:inline-block;}
.lnk:active{color:var(--ink);}
.lnk.sm{font-size:13.5px;}
.field{margin:16px 0;}
.field label{display:block;font-size:11.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:7px;}
.field input,.field textarea,.field select,.login input,.login select{width:100%;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:16px;outline:none;-webkit-appearance:none;appearance:none;}
.field input:focus,.field textarea:focus,.login input:focus,.login select:focus{border-color:var(--ink);}
/* strict monochrome: never the UA (Android orange) focus ring — ink border + 1px ink halo instead */
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible,.login input:focus-visible,.login select:focus-visible,.man input:focus-visible,.srch input:focus-visible,.sact form input:focus-visible{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink);}
.man input:focus,.sact form input:focus{border-color:var(--ink);}
.field textarea{min-height:70px;resize:vertical;}
.err{color:var(--err);font-size:13.5px;margin:8px 0;min-height:20px;}
.err:empty{display:none;}
.note{color:var(--mut);font-size:13.5px;margin-top:6px;line-height:1.6;}
.notice{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:12px 15px;font-size:13.5px;line-height:1.65;margin:0 0 18px;}
.empty{text-align:center;padding:50px 20px;color:var(--mut);}
.empty h2{font-size:20px;color:var(--ink);margin:10px 0 6px;font-weight:700;}
.spin{display:inline-block;width:15px;height:15px;border:2px solid var(--line);border-top-color:var(--ink);border-radius:50%;animation:sp .7s linear infinite;vertical-align:-2px;}
@keyframes sp{to{transform:rotate(360deg);}}
.pulse{animation:pul 1.4s ease-in-out infinite;}
@keyframes pul{0%,100%{opacity:.15}50%{opacity:1}}
#boot{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .25s;}
#moved{display:block;background:#1f5eff;color:#fff;text-align:center;font-size:14px;font-weight:600;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;text-decoration:none;}
#netbar{position:fixed;top:0;left:0;right:0;z-index:9998;background:var(--inv);color:var(--inv-fg);text-align:center;font-size:13.5px;padding:calc(8px + env(safe-area-inset-top)) 14px 8px;font-weight:500;line-height:1.5;}
body.nb{padding-top:var(--nb,38px);}body.nb .hdr{top:var(--nb,38px);}
#offbar{position:sticky;top:0;z-index:49;height:32px;background:var(--soft);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 18px;font-size:13.5px;color:var(--mut);cursor:pointer;}
#offbar .n{margin-left:auto;color:var(--ink);}
/* login / enter */
.login{max-width:400px;margin:0 auto;padding:40px 0 60px;}
.login h1{font-size:20px;font-weight:700;margin-bottom:6px;line-height:1.35;}
.login .sub{color:var(--mut);font-size:13.5px;margin-bottom:24px;line-height:1.65;}
.login input,.login select{margin-bottom:12px;}
.login input.code{font-family:'Inter',-apple-system,'Segoe UI',Roboto,monospace;letter-spacing:.14em;text-transform:uppercase;font-size:20px;text-align:center;}
.login .links{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:22px;text-align:center;}
.login .links .lnk{min-height:44px;display:inline-flex;align-items:center;justify-content:center;}
.login .lb{display:block;font-size:11.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin:2px 0 7px;}
.pw{position:relative;}.pw input{padding-right:70px;}
.pwt{position:absolute;right:6px;top:6px;height:34px;padding:0 12px;border-radius:12px;font-size:13.5px;color:var(--ink);background:transparent;}
.login select{width:100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;}
.steps{counter-reset:s;margin:18px 0;}
.steps div{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.6;}
.steps div:before{counter-increment:s;content:counter(s);flex:none;width:26px;height:26px;border-radius:999px;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:700;font-family:'Inter',sans-serif;}
/* banner */
.banner{display:flex;align-items:center;gap:12px;padding:16px 0 12px;border-bottom:1px solid var(--line);}
.banner .bn{font-size:20px;font-weight:700;line-height:1.35;}
.banner .be{font-size:13.5px;color:var(--mut);}
.banner .lnk{margin-left:auto;flex:none;font-size:13.5px;}
/* week / day rows */
.sec{margin:22px 0 8px;display:flex;align-items:baseline;gap:10px;}
.sec h2{font-size:16px;font-weight:700;}
.sec .sub{font-size:11.5px;color:var(--mut);margin-left:auto;}
.dayrow{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);min-height:64px;}
.dayrow .d{line-height:1.25;}
.dayrow .d .dw{font-size:11.5px;color:var(--mut);}
.dayrow .d .dd{font-size:16px;font-weight:700;}
.dayrow .dish{font-size:16px;line-height:1.5;word-break:break-word;}
.dayrow .st{font-size:13.5px;color:var(--mut);margin-top:2px;line-height:1.5;}
.dayrow .ctl{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.dayrow.off .dish{color:var(--mut);}
.tick{width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none;}
.tick i{width:26px;height:26px;border:1.5px solid var(--ink);border-radius:12px;display:flex;align-items:center;justify-content:center;background:transparent;transition:background .12s;}
.tick svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;display:none;}
.tick.on i{background:var(--inv);}
.tick.on svg{display:block;}
.tick:disabled i,.tick.dis i{border-color:var(--line);}
.tick.pend i{border-color:var(--mut);opacity:.7;}
.tick.pend svg{display:block;stroke:var(--mut);}
.chipb{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ink);border-radius:999px;padding:6px 12px;font-size:13.5px;line-height:1.3;min-height:32px;white-space:nowrap;}
.chipb.mute{border-color:var(--line);color:var(--mut);}
.chipb svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0;}
.tile{border:1px solid var(--line);border-radius:16px;padding:12px 10px;text-align:center;}
.tile .v{font-size:25px;font-weight:700;line-height:1.2;}
.tile .k{font-size:11.5px;color:var(--mut);margin-top:3px;}
.bannerTop{background:var(--inv);color:var(--inv-fg);border-radius:12px;padding:12px 15px;font-size:13.5px;line-height:1.6;margin:14px 0;display:flex;gap:10px;align-items:flex-start;}
.bannerTop button{margin-left:auto;flex:none;color:#fff;opacity:.8;font-size:13.5px;}
/* slip */
.slip{max-width:360px;margin:18px auto;border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden;position:relative;}
.slip .top{padding:18px 20px 14px;}
.slip .meal{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);}
.slip .nm{font-size:20px;font-weight:700;line-height:1.3;margin-top:4px;}
.slip .sub{font-size:13.5px;color:var(--mut);margin-top:2px;}
.slip .dish{font-size:16px;margin-top:10px;line-height:1.5;}
.slip .perf{border-top:2px dashed var(--line);position:relative;margin:0 -1px;}
.slip .perf:before,.slip .perf:after{content:'';position:absolute;top:-9px;width:16px;height:16px;border-radius:999px;background:var(--bg);border:1px solid var(--line);}
.slip .perf:before{left:-9px;border-left-color:transparent;}
.slip .perf:after{right:-9px;border-right-color:transparent;}
.slip .bot{padding:18px 20px 20px;text-align:center;}
.qr{width:240px;height:240px;margin:0 auto;background:#fff;}
.qr svg{width:240px;height:240px;}
.code{font-family:'Inter',-apple-system,'Segoe UI',Roboto,monospace;font-size:25px;letter-spacing:.18em;font-weight:500;line-height:1.3;word-break:break-all;}
.slip .code{margin-top:12px;}
.slip .hint{font-size:13.5px;color:var(--mut);margin-top:8px;line-height:1.6;}
/* the QR is alive: the kitchen is told that a still picture never pulses (2026-10-19) */
.slip .live{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--mut);margin-top:8px;line-height:1.5;}
.slip .live i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--acc);animation:livedot 1.6s ease-in-out infinite;}
@keyframes livedot{0%,100%{opacity:1}50%{opacity:.2}}
.slip.eaten .qr{opacity:.25;filter:grayscale(1);}
.slip.eaten .band{position:absolute;left:-40px;right:-40px;top:58%;transform:rotate(-14deg);background:var(--inv);color:var(--inv-fg);text-align:center;font-size:20px;font-weight:700;padding:10px 0;letter-spacing:.02em;}
/* sheet + toast */
#sheet{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;}
#sheet .bg{position:absolute;inset:0;background:rgba(0,0,0,.35);}
#sheet .pan{position:relative;width:100%;max-width:520px;background:var(--card);border-radius:28px 28px 0 0;padding:20px 20px calc(20px + env(safe-area-inset-bottom));animation:up .18s ease-out;}
@keyframes up{from{transform:translateY(30px);opacity:.6}to{transform:none;opacity:1}}
#sheet h3{font-size:16px;font-weight:700;line-height:1.4;}
#sheet .body{font-size:16px;color:var(--mut);margin-top:8px;line-height:1.65;}
#sheet .acts{display:flex;flex-direction:column;gap:10px;margin-top:18px;}
#toast{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:300;background:var(--inv);color:var(--inv-fg);font-size:13.5px;padding:12px 20px;border-radius:999px;max-width:calc(100% - 36px);text-align:center;box-shadow:var(--e2);}
@media print{body>*{display:none!important;}#print{display:block!important;}}

/* ---- from lunch.html <style id="css-a"> ---- */

/* css-a (2026-09-16, founder picked direction A for ပင်မ + လက်မှတ်, direction C for ဆိုင်များ):
   a real bottom tab bar, a "pass" hero for today, a week strip, and the slip restyled as an ink boarding
   pass. Appended only — earlier blocks are untouched, so .dayrow / .chipb / #rate keep their rules. */
/* NOTE: the class is .tabbar, never .tabs — css-chef already owns .tabs for the pill row inside a page.
   Founder's pick 2026-09-16: a FLOATING dark pill, with the one accent button in the middle. */
.tabbar{position:fixed;left:20px;right:20px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:60;height:64px;
        background:var(--elev);border-radius:var(--rp);display:flex;align-items:center;justify-content:space-between;padding:0 8px;box-shadow:var(--e2);}
.tabbar a{flex:1;min-width:0;height:52px;border-radius:var(--rp);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);}
.tabbar a.on{background:var(--navon);color:var(--navon-fg);}
.tabbar a.mid{flex:none;width:56px;height:56px;background:var(--acc);color:#fff;}
.tabbar a.mid.off{background:rgba(255,255,255,.14);color:rgba(255,255,255,.5);}
.tabbar svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.tabbar a.on svg{stroke-width:2.1;}
.tabbar a.mid svg{width:25px;height:25px;stroke-width:2.2;}
.tabbar a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}   /* labels are read by screen readers only — the pill has no room */
body.tb #app{padding-bottom:110px;}
body.tb #toast{bottom:calc(104px + env(safe-area-inset-bottom));}
.hdr .av{margin-left:auto;width:36px;height:36px;border-radius:999px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:600;color:var(--ink);flex:none;}
/* home — greeting, one big title, today's pass, quiet rows (founder's direction "အရောင်တစ်ခု") */
.greet{display:flex;align-items:center;gap:var(--s4);padding-top:var(--s5);}
.greet .av{width:48px;height:48px;border-radius:var(--rp);background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;flex:none;}
.greet .gx{min-width:0;}
.greet .bell{position:relative;margin-left:auto;width:46px;height:46px;flex:none;border-radius:var(--rp);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);}
.greet .bell svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.greet .bell .nd{position:absolute;right:11px;top:11px;width:9px;height:9px;border-radius:var(--rp);background:var(--acc);border:2px solid var(--bg);}
.greet .gn{font-size:16px;font-weight:600;line-height:1.35;}
.greet .gs{font-size:13.5px;color:var(--mut);line-height:1.35;}
h1.hh{font-size:var(--t1);font-weight:700;line-height:1.2;letter-spacing:-.025em;margin-top:var(--s6);}
.pass{margin-top:var(--s5);background:var(--elev);color:var(--elev-fg);border-radius:var(--r3);padding:22px;display:block;}
.pass .prow{display:flex;align-items:center;gap:var(--s2);}
.pass .tm{margin-left:auto;font-size:11.5px;font-weight:600;opacity:.65;white-space:nowrap;}
.pass .dish{font-size:20px;font-weight:600;line-height:1.5;margin-top:var(--s4);}
.pass .pb{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s5);background:var(--strip);color:var(--strip-fg);border-radius:var(--r2);padding:12px 14px;}
.pass .qs{width:48px;height:48px;flex:none;}
.pass .qs svg{width:100%;height:100%;}
.pass .kk{font-size:11.5px;color:var(--mut);line-height:1.3;}
.pass .cd{font-size:16px;font-weight:600;letter-spacing:.12em;margin-top:2px;}
.pass .ar{margin-left:auto;flex:none;color:var(--mut);}
.pass .ar svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.pass .pill{background:rgba(255,255,255,.14);color:#fff;}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:var(--rp);font-size:11.5px;font-weight:600;line-height:1;padding:7px 12px;white-space:nowrap;}
.pill.soft{background:var(--soft);color:var(--ink);}
.pill.out{border:1px solid var(--line);color:var(--mut);}
.pill svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;}
.quiet{margin-top:var(--s5);border:1px solid var(--line);border-radius:var(--r3);padding:22px;}
.quiet .qt{font-size:16px;font-weight:600;line-height:1.4;}
.quiet .dish{font-size:16px;line-height:1.55;margin-top:var(--s3);}
.quiet .hint{font-size:13.5px;color:var(--mut);line-height:1.6;margin-top:var(--s2);}
/* the row control: buy = the accent pill, bought = an ink circle */
.tkc{width:44px;height:44px;border-radius:var(--rp);display:flex;align-items:center;justify-content:center;flex:none;}
.tkc.on{background:var(--inv);}
.tkc.on svg{width:18px;height:18px;stroke:var(--inv-fg);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;}
.tkc.pend{border:1px solid var(--line);}
.tkc.pend svg{width:18px;height:18px;stroke:var(--mut);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.btn.tk{min-height:44px;padding:0 20px;font-size:13.5px;font-weight:600;}
/* the ဆိုင်များ invitation at the foot of the home screen */
/* the date in a week row becomes a tile, so the row reads as one object */
.dayrow{min-height:76px;}
.dayrow .d{width:52px;height:52px;border-radius:var(--r1);background:var(--soft);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15;}
.dayrow .d .dw{font-size:11.5px;color:var(--mut);max-width:48px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dayrow .d .dd{font-size:16px;font-weight:700;}
.dayrow.off .d{opacity:.55;}
.shopcta{display:flex;align-items:center;gap:var(--s4);background:var(--soft);border-radius:var(--r3);padding:20px 20px 20px 22px;margin-top:var(--s6);}
.shopcta .t{font-size:16px;font-weight:600;line-height:1.4;}
.shopcta .s{font-size:13.5px;color:var(--mut);line-height:1.5;margin-top:2px;}
.shopcta .go{width:44px;height:44px;border-radius:var(--rp);background:var(--inv);display:flex;align-items:center;justify-content:center;flex:none;margin-left:auto;}
.shopcta .go svg{width:19px;height:19px;stroke:var(--inv-fg);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
/* the slip is the pass at full size — the class names are unchanged so #rate and the tests still apply */
.slip{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:var(--r3);max-width:360px;margin:var(--s4) auto;box-shadow:var(--e1);}
.slip .top{padding:24px 24px 20px;text-align:center;}
.slip .meal{color:#fff;background:var(--acc);border-radius:var(--rp);display:inline-block;padding:7px 14px;font-size:11.5px;font-weight:600;letter-spacing:0;text-transform:none;}
.slip .nm{font-size:20px;font-weight:600;margin-top:var(--s4);}
.slip .sub{color:var(--mut);font-size:13.5px;}
.slip .dish{font-size:16px;margin-top:var(--s3);color:var(--mut);}
.slip .perf{border-top:1px dashed var(--line);}
.slip .perf:before,.slip .perf:after{background:var(--bg);border:0;}
.slip .bot{padding:var(--s6) 24px 26px;}
.slip .qr{width:212px;height:212px;}
.slip .qr svg{width:100%;height:100%;}
.slip .code{letter-spacing:.16em;font-size:var(--tn);font-weight:700;}
.slip .hint{color:var(--mut);}
.slip .band{background:var(--inv);color:var(--inv-fg);}
.slip.eaten .qr{opacity:.3;}
.scanok{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;background:var(--inv);color:var(--inv-fg);animation:scok .25s ease-out;}
.scanok>div{text-align:center;}
.scanok .ck{display:block;font-size:88px;line-height:1;font-weight:700;}
.scanok b{display:block;font-size:28px;margin:var(--s3) 0 6px;}
.scanok .num{font-size:18px;opacity:.75;}
/* founder 2026-10-02: a reminder under "Scan complete" that the rating card waits on the slip */
.scanok .rt{display:block;margin-top:var(--s4);font-size:18px;font-weight:600;}
@keyframes scok{from{transform:scale(.9);opacity:0}to{transform:none;opacity:1}}
.pmeta{display:flex;align-items:center;gap:var(--s3);background:var(--soft);border-radius:var(--r2);padding:14px 18px;margin:0 auto var(--s3);max-width:360px;width:100%;}
.pmeta svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.pmeta .l1{font-size:13.5px;line-height:1.5;}
.pmeta .l2{font-size:11.5px;color:var(--mut);line-height:1.5;}
@media (prefers-reduced-motion:no-preference){
  .btn,.tick,.chipb,.scard,.tabbar a,.iconb,.sact,.lnk,.dayrow .ctl .btn{transition:transform .12s ease,background-color .12s ease,border-color .12s ease,opacity .12s ease;}
  .btn:active,.chipb:active,.scard:active,.iconb:active,.sact:active,.pass:active,.quiet:active{transform:scale(.96);}
  .tick:active{transform:scale(.9);}
  .tabbar a:active{transform:scale(.88);}
}

/* ---- from lunch.html <style id="css-shop"> ---- */

/* css-shop — the "ဆိုင်များ" tab (benefits directory merged in 2026-09-16); appended only */
.pf{text-align:center;padding-top:var(--s10);}
.pf .av.big{position:relative;width:96px;height:96px;margin:0 auto;border-radius:var(--rp);background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700;overflow:visible;color:var(--ink);}
.pf .av.big img{width:96px;height:96px;border-radius:var(--rp);object-fit:cover;}
.pf .av.big .cam{position:absolute;right:-2px;bottom:-2px;width:32px;height:32px;border-radius:var(--rp);background:var(--acc);border:3px solid var(--bg);display:flex;align-items:center;justify-content:center;}
.pf .av.big .cam svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.pfa{margin-top:var(--s3);display:flex;gap:var(--s4);justify-content:center;}
.greet .av img,.hdr .av img{width:100%;height:100%;border-radius:var(--rp);object-fit:cover;}
.greet .av,.hdr .av{overflow:hidden;}
.pf .nm{font-size:20px;font-weight:600;line-height:1.35;margin-top:var(--s4);}
.pf .sb{font-size:13.5px;color:var(--mut);margin-top:2px;}
.pf .em{font-size:13.5px;color:var(--ink-3);margin-top:2px;overflow-wrap:anywhere;}
/* NOTE: .plink, never .prow — .pass .prow is the status row inside today's pass */
.plink{display:flex;align-items:center;gap:var(--s4);background:var(--soft);border-radius:var(--r2);padding:16px 18px;margin-top:var(--s8);}
.plink .t{font-size:16px;font-weight:600;line-height:1.4;}
.plink .s{font-size:13.5px;color:var(--mut);line-height:1.5;margin-top:2px;}
.plink .go{margin-left:auto;flex:none;color:var(--ink-3);}
.plink .go svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.pfout{margin-top:var(--s8);padding-bottom:var(--s6);}
.thm{margin-top:var(--s8);padding-top:var(--s5);border-top:1px solid var(--line);}
.thm .tl{font-size:11.5px;color:var(--mut);}
.thm .chips{padding-top:var(--s3);}
.lang{display:flex;gap:var(--s2);padding-top:var(--s3);}
.lang.c{justify-content:center;margin-top:var(--s6);}
.ttlrow{display:flex;align-items:baseline;gap:var(--s3);padding-top:var(--s6);}
.ttlrow h1{flex:1;min-width:0;}
.ttlrow .lnk{flex:none;}
.srch{margin:var(--s5) 0 0;}
.srch input{width:100%;height:56px;padding:0 20px;border:1px solid var(--line);border-radius:var(--rp);background:var(--bg);font-size:16px;}
.chips{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s4) 0 2px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.chips::-webkit-scrollbar{display:none;}
.chip{flex:none;border:1px solid var(--line);border-radius:var(--rp);padding:0 18px;min-height:44px;display:inline-flex;align-items:center;font-size:13.5px;color:var(--mut);}
.chip.on{background:var(--inv);border-color:var(--inv);color:var(--inv-fg);font-weight:500;}
/* the directory grid — two dense columns, the discount as a white badge on the cover */
.sgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s3);margin-top:var(--s5);}
@media(min-width:620px){.sgrid{grid-template-columns:repeat(3,minmax(0,1fr));}}
.scard{display:block;}
.scard .ph{position:relative;height:150px;border-radius:var(--r2);background:var(--soft);overflow:hidden;}
.scard .ph img{width:100%;height:100%;object-fit:cover;}
.scard .noimg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.scard .noimg svg{width:24px;height:24px;stroke:var(--ink-3);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.6;}
.scard .badge{position:absolute;right:10px;top:10px;border:0;margin:0;background:#fff;color:var(--ink);border-radius:var(--rp);padding:5px 11px;font-size:11.5px;font-weight:700;max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:var(--e1);}
.scard .bd{padding:10px 2px 0;}
.scard .nm{font-size:16px;font-weight:600;line-height:1.4;overflow-wrap:anywhere;}
.scard .ad{color:var(--mut);font-size:13.5px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.scard .bd{min-width:0;}
.scover{margin:14px 0 0;border-radius:16px;overflow:hidden;background:var(--soft);}
.scover img{width:100%;max-height:260px;object-fit:cover;}
.snm{font-size:20px;font-weight:700;line-height:1.35;margin-top:14px;}
.sdisc{margin-top:10px;border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-size:16px;background:var(--soft);}
.snote{margin-top:10px;font-size:13.5px;line-height:1.6;color:var(--ink);}
.snote .nk{display:block;font-size:11.5px;color:var(--mut);}
.sacts{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.sact{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:12px;padding:10px 14px;font-size:13.5px;min-height:44px;}
.sact svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.sinfo{display:flex;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);}
.sinfo>svg{width:16px;height:16px;flex:none;margin-top:4px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:var(--mut);}
.sinfo .k{font-size:11.5px;color:var(--mut);}
.sinfo .v{font-size:16px;line-height:1.6;}
.smenuh{margin-top:22px;font-size:13.5px;color:var(--mut);}
.smenu{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:8px;}
.smenu img{width:100%;border-radius:12px;background:var(--soft);}
.sfb{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);}
.sfb .fbh{font-size:16px;font-weight:500;}
.sfb .fbsub{font-size:13.5px;color:var(--mut);margin-top:2px;line-height:1.55;}
.sfb textarea{width:100%;min-height:86px;margin-top:10px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:var(--bg);resize:vertical;}
.sfb .fbthx{font-size:13.5px;line-height:1.6;}
#lb{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;padding:18px;}
#lb img{max-width:100%;max-height:100%;object-fit:contain;}
#lb .x{position:absolute;top:calc(env(safe-area-inset-top) + 10px);right:14px;width:44px;height:44px;color:#fff;font-size:32px;line-height:1;}
/* admin: shop rows + editor (lunch-shopadmin.js) */
.srow{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);}
.srow .th{width:54px;height:40px;flex:none;border-radius:12px;background:var(--soft);object-fit:cover;}
.srow .tx{flex:1;min-width:0;}
.srow .tx .n{font-size:16px;font-weight:500;line-height:1.4;}
.srow .tx .a{font-size:11.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.srow .rt{display:flex;gap:4px;flex:none;}
.iconb{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:12px;}
.iconb svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.sbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:16px 0 6px;}
.sbar .t{font-size:16px;font-weight:700;}
.sbar .sp{flex:1;}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:8px;}
.thumb{position:relative;border-radius:12px;overflow:hidden;background:var(--soft);}
.thumb img{width:100%;aspect-ratio:1/1;object-fit:cover;}
.thumb .x{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:999px;background:rgba(17,17,17,.82);color:#fff;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;}
.fbgrp{margin-top:18px;}
.fbgrp .gh{font-size:13.5px;font-weight:500;border-bottom:1px solid var(--line);padding-bottom:6px;}
.fbitem{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line);}
.fbitem .tx{font-size:13.5px;line-height:1.6;}
.fbitem .mt{font-size:11.5px;color:var(--mut);margin-top:3px;}