:root{--brand:#e23744;--ink:#0f172a}
*{-webkit-tap-highlight-color:transparent}
body{font-family:"DM Sans","Segoe UI",system-ui,sans-serif;background:#f1f5f9;color:#1e293b;padding-top:env(safe-area-inset-top,0px)}
.fw-display,h1,h2,h3{font-family:"Bricolage Grotesque",Georgia,serif;letter-spacing:-.02em}a{color:var(--brand)}.text-brand{color:var(--brand)}
.btn{border-radius:12px;font-weight:600}.btn-primary{--bs-btn-bg:var(--brand);--bs-btn-border-color:var(--brand);--bs-btn-hover-bg:var(--brand);--bs-btn-hover-border-color:var(--brand);--bs-btn-active-bg:var(--brand);--bs-btn-active-border-color:var(--brand);--bs-btn-disabled-bg:var(--brand);--bs-btn-disabled-border-color:var(--brand)}.btn-primary:hover{filter:brightness(.92)}
.card{border:0;border-radius:16px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 8px 24px rgba(15,23,42,.04)}.form-control,.form-select{border-radius:12px}
.side{width:250px;min-height:100vh;height:100vh;position:sticky;top:0;background:linear-gradient(180deg,#0f172a,#1e1b4b);color:#fff;overflow:auto}.side.offcanvas{width:270px;height:auto;position:fixed}
.side a{color:#cbd5e1;text-decoration:none;padding:.6rem .85rem;border-radius:12px;display:block;margin-bottom:2px}.side a.on{background:var(--brand);color:#fff;font-weight:600}.side a:hover:not(.on){background:rgba(255,255,255,.08)}
.topbar{background:#0f172a;position:sticky;top:0;z-index:30}.rl{width:34px;height:34px;border-radius:10px;background:var(--brand);color:#fff;display:inline-grid;place-items:center;object-fit:cover;font-weight:800;flex:none}
.kpi{background:#fff;border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:center;box-shadow:0 1px 3px rgba(15,23,42,.08);border-left:5px solid var(--brand);height:100%}.kpi .ic{font-size:1.6rem}.kpi .v{font:800 1.4rem "Bricolage Grotesque",serif;line-height:1.1}.kpi .l{color:#64748b;font-size:.8rem}
.floor{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.ft{display:flex;flex-direction:column;gap:4px;border-radius:16px;padding:14px;text-decoration:none;color:#0f172a;border:2px solid;min-height:104px;background:#fff}.ft b{font:800 1.15rem "Bricolage Grotesque",serif}.ft small{color:#475569}.fs{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.ft-free{border-color:#86efac;background:#f0fdf4}.ft-free .fs{color:#15803d}.ft-new{border-color:#fbbf24;background:#fffbeb;animation:pulse 1.4s infinite}.ft-new .fs{color:#b45309}.ft-cooking{border-color:#60a5fa;background:#eff6ff}.ft-cooking .fs{color:#1d4ed8}.ft-ready{border-color:#2dd4bf;background:#f0fdfa}.ft-ready .fs{color:#0f766e}.ft-billing{border-color:#c084fc;background:#faf5ff}.ft-billing .fs{color:#7e22ce}
@keyframes pulse{50%{box-shadow:0 0 0 6px rgba(251,191,36,.35)}}.ft-chip{display:inline-block;border-radius:99px;padding:3px 12px;font-size:.76rem;font-weight:700;border:1.5px solid;min-height:0}.legend{display:flex;gap:6px;flex-wrap:wrap}.legend span{padding:2px 10px;border-radius:99px;border:1.5px solid;font-size:.72rem}.lg-free{border-color:#86efac;background:#f0fdf4}.lg-new{border-color:#fbbf24;background:#fffbeb}.lg-cooking{border-color:#60a5fa;background:#eff6ff}.lg-ready{border-color:#2dd4bf;background:#f0fdfa}.lg-billing{border-color:#c084fc;background:#faf5ff}
.kb{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}.kcol{background:#e6ebf2;border-radius:16px;padding:10px;display:flex;flex-direction:column;gap:10px;align-self:start}.kh{display:flex;justify-content:space-between;padding:2px 6px}.kh span{background:#0f172a;color:#fff;border-radius:99px;padding:0 10px;font-size:.8rem}
.ocard{background:#fff;border-radius:14px;padding:12px;border-left:5px solid #94a3b8;box-shadow:0 1px 3px rgba(15,23,42,.08)}.oc-warning{border-color:#f59e0b}.oc-info,.oc-primary{border-color:#3b82f6}.oc-success{border-color:#14b8a6}.oc-danger{border-color:#ef4444}
.bars{display:flex;gap:8px;align-items:flex-end;height:150px}.bars div{flex:1;text-align:center;font-size:.72rem;display:flex;flex-direction:column;justify-content:flex-end;height:100%}.bars i{display:block;background:var(--brand);border-radius:6px 6px 0 0;min-height:2px}.thumb-s{width:44px;height:44px;border-radius:10px;background:#f1ece6;display:inline-grid;place-items:center;object-fit:cover;font-size:1.4rem}
.authbg{min-height:100vh;background:linear-gradient(135deg,#0f172a,#3b0764)}.hero-dark{background:radial-gradient(circle at 80% 10%,#7c2d12,#0f172a 62%)}.step{background:#fff;border-radius:18px;padding:22px;height:100%;box-shadow:0 8px 24px rgba(15,23,42,.06)}
.qcard{background:#fff;color:#0f172a;border-radius:22px;padding:22px;text-align:center;max-width:300px;position:relative;overflow:hidden;border:6px solid #ffb703}.qcard .qrbox{width:100%}.scan{position:absolute;left:0;right:0;height:3px;background:#ffb703;box-shadow:0 0 14px 4px #ffb703;animation:sw 3s ease-in-out infinite}@keyframes sw{0%,100%{top:8%}50%{top:78%}}
.qrbox,.qrd{aspect-ratio:1}.qrbox svg,.qrd svg,#qrprev svg{width:100%;height:100%;display:block}.qrd{width:230px}#qrprev svg{height:auto}.print-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}.tcard{background:#fff;border:2px dashed #cbd5e1;border-radius:16px;padding:16px;text-align:center;break-inside:avoid}
.inv{position:relative;background:#fff;padding:6px}.stamp{position:absolute;top:60px;right:20px;border:4px solid #16a34a;color:#16a34a;font:800 2rem sans-serif;padding:0 14px;border-radius:8px;transform:rotate(-12deg);opacity:.7}
/* customer app */
.cust{background:#e9ebef}.capp{max-width:480px;margin:0 auto;min-height:100vh;background:#fff;position:relative}.capp.hasnav{padding-bottom:84px}
.ahead{background:var(--brand);color:#fff;padding:22px 18px 34px;border-radius:0 0 28px 28px}.ahead h1{font-size:1.5rem;margin:2px 0 6px}.ahead.tall{padding-bottom:40px}
.ib{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;text-decoration:none;font-size:1.2rem;margin-bottom:6px}.ib.float{position:absolute;top:14px;left:14px;z-index:3}
.bnav{position:fixed;left:0;right:0;bottom:0;margin:auto;max-width:480px;background:#fff;display:flex;border-top:1px solid #eee;padding:6px 0 calc(6px + env(safe-area-inset-bottom,0px));z-index:40;box-shadow:0 -4px 20px rgba(0,0,0,.06)}.bnav a{flex:1;text-align:center;text-decoration:none;color:#94a3b8;font-size:.72rem;font-weight:700}.bnav a i{display:block;font-style:normal;font-size:1.35rem}.bnav a.on{color:var(--brand)}
.scanhero{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:-22px;position:relative;background:#fff;border-radius:20px;padding:18px;text-decoration:none;color:#1e293b;box-shadow:0 10px 30px rgba(0,0,0,.14)}.scanhero b{display:block;font:800 1.15rem "Bricolage Grotesque",serif}.scanhero span{color:#64748b;font-size:.85rem}.scanhero i{font-style:normal;font-size:2.2rem;background:var(--brand);border-radius:16px;padding:8px 12px}
.sec{font-size:1.05rem;margin:22px 0 10px}.lo{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1.5px solid #eee;border-radius:16px;padding:14px;text-decoration:none;color:#1e293b;margin-bottom:10px;border-left:5px solid var(--brand)}.lo small{display:block;color:#64748b}
.pill{background:color-mix(in srgb,var(--brand) 14%,#fff);color:var(--brand);border-radius:99px;padding:3px 12px;font-size:.74rem;font-weight:700;white-space:nowrap}.hs{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}.rc{flex:none;width:130px;text-align:center;background:#fff;border:1.5px solid #eee;border-radius:16px;padding:12px;text-decoration:none;color:#1e293b}.rc b{display:block;font-size:.85rem;margin-top:6px}.rc small{color:#64748b}.rc .rl{width:46px;height:46px;border-radius:14px}
.how{display:grid;gap:8px}.how div{display:flex;gap:12px;align-items:center;background:#f8fafc;border-radius:14px;padding:12px}.how span{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;flex:none}
.scanwrap{position:relative;background:#000;aspect-ratio:3/4;max-height:72vh;overflow:hidden}.scanwrap video{width:100%;height:100%;object-fit:cover}.vf{position:absolute;inset:20% 14%;border:3px solid #fff;border-radius:22px;box-shadow:0 0 0 999px rgba(0,0,0,.45)}.scanmsg{position:absolute;left:0;right:0;bottom:12px;text-align:center;color:#fff;font-weight:600;padding:0 16px}
.ordc{background:#fff;border:1.5px solid #eee;border-radius:16px;padding:14px;margin-bottom:12px}.cflash{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:60;max-width:440px;width:calc(100% - 24px);padding:10px 14px;border-radius:12px;font-weight:600;color:#fff}.cflash.ok{background:#16a34a}.cflash.bad{background:#dc2626}.cflash.static{position:static;transform:none;width:auto;margin:0 0 12px}
.mh{background:linear-gradient(160deg,var(--brand),color-mix(in srgb,var(--brand) 60%,#000));color:#fff;padding:16px 16px 22px;border-radius:0 0 28px 28px}.mtop{display:flex;justify-content:space-between;align-items:center}.tchip{background:rgba(255,255,255,.22);color:#fff;border:0;border-radius:99px;padding:6px 14px;font-weight:700}
.rcard{display:flex;gap:14px;align-items:center;margin-top:10px}.rl.big{width:64px;height:64px;border-radius:18px;background:#fff;color:var(--brand);font-size:1.7rem}.rchips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.rchips span{background:rgba(255,255,255,.2);border-radius:99px;padding:2px 10px;font-size:.74rem}
.filters{display:flex;gap:10px;align-items:center;padding:14px 14px 4px;position:sticky;top:0;background:#fff;z-index:20}.srch{flex:1;display:flex;align-items:center;gap:8px;background:#f1f5f9;border-radius:14px;padding:0 12px}.srch input{border:0;background:none;padding:11px 0;width:100%;outline:none}
.vsw{display:flex;align-items:center;gap:6px;font-size:.76rem;font-weight:700;white-space:nowrap;margin:0}.vsw input{display:none}.sw{width:34px;height:20px;border-radius:99px;background:#cbd5e1;position:relative;transition:.2s}.sw:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s}.vsw input:checked+.sw{background:#16a34a}.vsw input:checked+.sw:after{left:16px}
.chips{display:flex;gap:8px;overflow-x:auto;padding:8px 14px;scrollbar-width:none;position:sticky;top:64px;z-index:19;background:#fff}.chips::-webkit-scrollbar{display:none}.chip{border:1.5px solid #e5e7eb;background:#fff;border-radius:99px;padding:6px 14px;white-space:nowrap;font-weight:600;font-size:.88rem}.chip:active{background:var(--brand);color:#fff}
.ch{font-size:1.1rem;margin:20px 14px 0;scroll-margin-top:120px}.ch small{color:#94a3b8;font-weight:500}.dish2{display:flex;justify-content:space-between;gap:14px;padding:18px 14px 30px;border-bottom:1px solid #f1f1f1}.dtext{flex:1;min-width:0}.dn{font-weight:700;line-height:1.25}.dp{font-weight:700;margin-top:2px}.de{color:#64748b;font-size:.78rem}.dd{color:#64748b;font-size:.8rem;margin-top:4px}.dish2.off .dn,.dish2.off .dp{opacity:.45}
.vd{display:inline-block;width:12px;height:12px;border:1.5px solid;margin-right:6px;position:relative;vertical-align:-1px}.vd:after{content:"";position:absolute;inset:2px;border-radius:50%;background:currentColor}.vd.v{color:#2b9348}.vd.n{color:#c1121f}
.dimg{position:relative;width:118px;flex:none}.dimg .ph{width:118px;height:112px;border-radius:16px;background:linear-gradient(135deg,#fef3c7,#fed7aa);display:grid;place-items:center;font-size:2.8rem;overflow:hidden}.dimg img{width:100%;height:100%;object-fit:cover}
.addb2,.qty2,.so2{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);background:#fff;border:1px solid #d4d4d8;border-radius:10px;box-shadow:0 3px 8px rgba(0,0,0,.12)}.addb2{color:#16a34a;padding:6px 26px;font-weight:800;font-size:.85rem;white-space:nowrap}.addb2:disabled{opacity:.4}.so2{color:#dc2626;border-color:#fecaca;padding:5px 16px;font-weight:800;font-size:.8rem;white-space:nowrap}
.qty2{display:flex;align-items:center}.qty2 button{background:none;border:0;color:#16a34a;font-size:1.2rem;font-weight:800;width:30px;height:32px}.qty2 span{min-width:22px;text-align:center;font-weight:800;color:#16a34a}.qty2.inl{position:static;transform:none;box-shadow:none}.inc{position:absolute;left:0;right:0;bottom:-36px;text-align:center;font-size:.7rem;color:#64748b}
.cartbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom,0px));width:calc(100% - 24px);max-width:456px;background:var(--brand);color:#fff;border:0;border-radius:16px;padding:14px 18px;display:flex;justify-content:space-between;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.28);z-index:30}.cartbar.d-none{display:none!important}.cart-sheet{height:auto!important;max-height:88vh;border-radius:22px 22px 0 0;max-width:480px;margin:0 auto}
.prow{display:flex;justify-content:space-between;gap:10px;padding:14px;border:2px solid #eee;border-radius:14px;margin-bottom:8px;cursor:pointer}.prow input{display:none}.prow.on{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 8%,#fff)}.bill{background:#f8fafc;border-radius:14px;padding:12px;margin-top:12px}.bill div{display:flex;justify-content:space-between;padding:2px 0}.bill .g{font-weight:800;border-top:1px dashed #cbd5e1;margin-top:4px;padding-top:6px}
.stage{text-align:center}.stage svg.sv{display:none;width:230px;max-width:70%;margin:auto}.stage[data-s=placed] .sv-placed,.stage[data-s=accepted] .sv-accepted,.stage[data-s=preparing] .sv-preparing,.stage[data-s=ready] .sv-ready,.stage[data-s=served] .sv-served,.stage[data-s=cancelled] .sv-cancel{display:block}
.sv *{transform-box:fill-box;transform-origin:center}.spin{animation:rot 1.4s linear infinite}@keyframes rot{to{transform:rotate(360deg)}}.pop{animation:pop .5s ease-out both}@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}.draw{stroke-dasharray:120;stroke-dashoffset:120;animation:dr .6s .3s ease-out forwards}@keyframes dr{to{stroke-dashoffset:0}}.lid{animation:lid .5s ease-in-out infinite alternate}@keyframes lid{to{transform:translateY(-5px) rotate(-4deg)}}
.steam{fill:none;stroke:#bbb;stroke-width:5;stroke-linecap:round;opacity:0;animation:st 2s ease-in infinite}.s2{animation-delay:.6s}.s3{animation-delay:1.2s}@keyframes st{0%{opacity:0;transform:translateY(10px)}40%{opacity:.9}100%{opacity:0;transform:translateY(-22px)}}.bell{animation:ring .5s ease-in-out infinite alternate;transform-origin:50% 20%}@keyframes ring{from{transform:rotate(-12deg)}to{transform:rotate(12deg)}}
.stepper{display:flex;justify-content:space-between;position:relative;margin:26px 8px}.stepper:before{content:"";position:absolute;top:15px;left:12%;right:12%;height:4px;background:#e8e2dc}.stp{position:relative;text-align:center;flex:1;font-size:.8rem;color:#9a9087}.stp i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e8e2dc;margin:0 auto 4px;font-style:normal;font-weight:800;color:#fff}.stp.done i,.stp.now i{background:var(--brand)}.stp.now i{box-shadow:0 0 0 6px color-mix(in srgb,var(--brand) 25%,transparent)}.stp.done,.stp.now{color:#1d1a17;font-weight:700}
@media print{.side,.topbar,.noprint,.offcanvas,.alert,.bnav,.cflash,#snd{display:none!important}body{background:#fff}main{padding:0!important}.capp{box-shadow:none;max-width:none}.card{box-shadow:none}.tcard{border:1px solid #999}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.draw{stroke-dashoffset:0}}