@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/plus-jakarta-sans-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/plus-jakarta-sans.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --pink:#FF4D8D;--rose:#E84393;--purple:#9B51E0;--violet:#5B2EFF;--ink:#0F0F0F;
  --bg:#FAF8FF;--card:#fff;--line:#ECE7F7;--muted:#6B6880;--soft:#F4F0FF;--ok:#0E9F6E;--warn:#D97706;--bad:#E11D48;
  --brand:linear-gradient(135deg,#FF4D8D 0%,#9B51E0 55%,#5B2EFF 100%);
  --shadow:0 1px 2px rgba(91,46,255,.04),0 8px 24px rgba(91,46,255,.07);
  --r:18px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14.5px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--violet);text-decoration:none}a:hover{color:var(--rose)}
h1,h2,h3{margin:0;letter-spacing:-.01em}h1{font-size:24px}h2{font-size:17px}
.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.muted{color:var(--muted)}.right{text-align:right}.mt{margin-top:16px}.mb{margin-bottom:16px}.nowrap{white-space:nowrap}
.grad-text{background:var(--brand);-webkit-background-clip:text;background-clip:text;color:transparent}

/* shell */
.shell{display:grid;grid-template-columns:268px 1fr;min-height:100vh}
.side{background:#fff;border-right:1px solid var(--line);padding:22px 14px;position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:12px;padding:4px 10px 20px}
.brand b{font-size:17px;display:block;line-height:1.1}.brand small{color:var(--muted);font-size:11.5px}
.nav-h{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#9892B0;padding:14px 12px 6px}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:#3D3A52;font-weight:500}
.nav a:hover{background:var(--soft);color:var(--violet)}
.nav a.on{background:linear-gradient(135deg,rgba(255,77,141,.12),rgba(91,46,255,.12));color:var(--violet);font-weight:650;box-shadow:inset 3px 0 0 var(--rose)}
.main{min-width:0}
.top{display:flex;align-items:center;gap:14px;padding:16px 28px;background:rgba(250,248,255,.85);backdrop-filter:blur(10px);position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line)}
.top .grow{flex:1}.burger{display:none}
.chip{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px 6px 6px;font-weight:600}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px}
.content{padding:26px 28px 60px;max-width:1380px}
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.page-h p{margin:4px 0 0;color:var(--muted)}

/* cards & grid */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:20px}
.card h2{margin-bottom:14px}
.grid{display:grid;gap:18px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g-main{grid-template-columns:2fr 1fr}
.stat{display:flex;gap:14px;align-items:center}
.stat .ic{width:46px;height:46px;border-radius:14px;background:var(--brand);color:#fff;display:grid;place-items:center;box-shadow:0 8px 18px rgba(155,81,224,.35)}
.stat small{color:var(--muted);display:block}.stat b{font-size:22px;letter-spacing:-.02em}
.hero{background:var(--brand);color:#fff;border:0}.hero small,.hero .muted{color:rgba(255,255,255,.8)}.hero .ic{background:rgba(255,255,255,.2);box-shadow:none}

/* buttons & forms */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:10px 16px;border-radius:12px;font:inherit;font-weight:600;cursor:pointer;transition:.15s}
.btn:hover{border-color:var(--purple);color:var(--violet);transform:translateY(-1px)}
.btn.primary{background:var(--brand);color:#fff;border:0;box-shadow:0 8px 20px rgba(155,81,224,.35)}
.btn.primary:hover{color:#fff;filter:brightness(1.05)}
.btn.danger{color:var(--bad)}.btn.sm{padding:6px 10px;border-radius:10px;font-size:13px}.btn.block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
label{display:block;font-weight:600;margin-bottom:6px;font-size:13px}
input,select,textarea{width:100%;font:inherit;padding:10px 13px;border:1px solid #DDD6EF;border-radius:12px;background:#fff;color:var(--ink);outline:none;transition:.15s}
input:focus,select:focus,textarea:focus{border-color:var(--purple);box-shadow:0 0 0 4px rgba(155,81,224,.15)}
input[type=checkbox]{width:auto;accent-color:var(--violet)}
.field{margin-bottom:14px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row>.grow{flex:1;min-width:140px}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 18px}
.err{color:var(--bad);font-size:12.5px;margin-top:4px}
.flash{padding:12px 16px;border-radius:14px;margin-bottom:16px;font-weight:550}
.flash.ok{background:#E8F8F1;color:#07694A;border:1px solid #BFEBD9}.flash.bad{background:#FFEDF2;color:#B3123A;border:1px solid #FFC9D7}

/* table */
.tbl{width:100%;border-collapse:collapse}
.tbl th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#8E88A8;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:13px 12px;border-bottom:1px solid #F3EFFB;vertical-align:middle}
.tbl tr:hover td{background:#FCFAFF}
.scroll{overflow-x:auto}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:650;background:var(--soft);color:var(--violet)}
.badge.ok{background:#E8F8F1;color:#07694A}.badge.bad{background:#FFEDF2;color:#B3123A}.badge.warn{background:#FFF4E0;color:#9A5A00}
.pg{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;width:100%}.pg-info{color:var(--muted);font-size:13px}.pg-links{display:flex;gap:6px}.pg-b{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--line);background:#fff;font-weight:600;font-size:14px;color:var(--ink)}a.pg-b:hover{border-color:var(--brand);color:var(--brand)}.pg-b.cur{background:linear-gradient(135deg,#FF4D8D,#5B2EFF);color:#fff;border:0}.pg-b.dis{opacity:.4}
.pthumb{width:40px;height:40px;border-radius:12px;object-fit:cover;vertical-align:middle;margin-right:10px;box-shadow:0 2px 8px rgba(91,46,255,.18)}
.pager{display:flex;gap:6px;margin-top:16px;flex-wrap:wrap}.pager a,.pager span{padding:6px 12px;border-radius:10px;border:1px solid var(--line);background:#fff}.pager .active span,.pager span[aria-current]{background:var(--brand);color:#fff;border:0}
nav[role=navigation] svg{width:16px;height:16px}

/* bars */
.bars{display:flex;align-items:flex-end;gap:12px;height:190px;padding-top:10px}
.bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.bar i{display:block;width:100%;max-width:44px;border-radius:10px 10px 4px 4px;background:var(--brand);min-height:4px}
.bar small{color:var(--muted);font-size:11.5px}.bar span{font-size:11px;color:var(--muted)}
.meter{height:8px;background:var(--soft);border-radius:99px;overflow:hidden}.meter i{display:block;height:100%;background:var(--brand)}

/* login */
.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.login-art{background:var(--brand);color:#fff;padding:56px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.login-art:before,.login-art:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.1)}
.login-art:before{width:420px;height:420px;right:-120px;top:-100px}.login-art:after{width:300px;height:300px;left:-90px;bottom:-80px}
.login-art h1{font-size:40px;line-height:1.1;max-width:460px;position:relative}.login-art p{max-width:420px;opacity:.9;position:relative}
.login-form{display:grid;place-items:center;padding:32px}.login-form .box{width:100%;max-width:400px}

@media(max-width:1100px){.g4{grid-template-columns:repeat(2,1fr)}.g-main{grid-template-columns:1fr}}
@media(max-width:860px){
  .shell{grid-template-columns:1fr}.side{position:fixed;left:-290px;z-index:20;width:268px;transition:.2s;box-shadow:0 0 40px rgba(0,0,0,.15)}.side.open{left:0}
  .burger{display:inline-flex}.content{padding:20px 16px 60px}.top{padding:12px 16px}.g3,.g2,.form-grid{grid-template-columns:1fr}
  .login{grid-template-columns:1fr}.login-art{display:none}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}.stat b{font-size:19px}.stat .ic{width:40px;height:40px}.card{padding:16px}
}
@media(max-width:560px){.g4{grid-template-columns:1fr}.top{gap:8px}.top .nm{display:none}.chip{padding:4px}.page-h h1{font-size:21px}}
@media print{.side,.top,.btn,.pager,form,.flash{display:none!important}.shell{display:block}.card{box-shadow:none;border:0}.content{padding:0}}

/* ===== v3 admin additions ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.check{display:flex;align-items:flex-start;gap:8px;font-weight:500;margin:0 0 10px;cursor:pointer}.check input{margin-top:3px;flex:none}.check small{display:block}.check.inline{display:inline-flex;margin:0;align-items:center}
.mono,pre.mono,textarea.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px}
pre{background:#F7F4FF;border:1px solid var(--line);border-radius:12px;padding:12px;overflow:auto;margin:6px 0 0}
code{background:var(--soft);border-radius:6px;padding:1px 6px;font-size:12.5px;word-break:break-word}
.flash.warn{background:#FFF4E0;color:#7A4500;border:1px solid #FFE0A8}
.stat .ic.bad{background:linear-gradient(135deg,#FF4D6D,#E11D48);box-shadow:0 8px 18px rgba(225,29,72,.3)}.stat .ic.warn{background:linear-gradient(135deg,#FFB020,#F97316);box-shadow:0 8px 18px rgba(249,115,22,.3)}
.nav-n{margin-left:auto;background:var(--brand);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:1px 8px}
.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs a{padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#3D3A52;font-weight:600}.tabs a.on{background:var(--brand);color:#fff;border:0}.tabs a:hover{color:var(--violet)}.tabs a.on:hover{color:#fff}
.empty{display:grid;justify-items:center;gap:6px;padding:34px 12px;text-align:center}.empty .icon{width:34px;height:34px;color:var(--purple)}.empty p{margin:0;max-width:420px}
.sec-h{margin:26px 0 12px;font-size:17px}.sec-h small{font-weight:500;margin-left:8px}
.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.preset{border:1.5px solid var(--line);border-radius:16px;padding:14px;cursor:pointer;display:grid;gap:4px;margin:0;background:#fff}.preset input{position:absolute;opacity:0;pointer-events:none}.preset.on,.preset:has(input:checked){border-color:var(--purple);background:linear-gradient(135deg,rgba(255,77,141,.07),rgba(91,46,255,.08));box-shadow:0 0 0 3px rgba(155,81,224,.15)}.preset:has(input:focus-visible){outline:2px solid var(--violet);outline-offset:2px}
/* plans */
.plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:16px}
.plan{border:1.5px solid var(--line);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:10px;background:#fff;position:relative}
.plan.cur{border-color:transparent;background:linear-gradient(#fff,#fff) padding-box,var(--brand) border-box;border:2px solid transparent;box-shadow:var(--shadow)}
.plan .pn{font-size:16px}.plan .pp{font-size:26px;font-weight:800;letter-spacing:-.02em;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}.plan .pp small{font-size:13px;font-weight:500;color:var(--muted)}
.plan ul{margin:0;padding:0 0 0 18px;color:#3D3A52;display:grid;gap:5px;flex:1;font-size:13.5px}
/* online orders */
.oo-list{display:grid;gap:14px}.oo{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fff}.oo.st-new{border-color:#FFB3CB;box-shadow:0 0 0 3px rgba(255,77,141,.1)}
.oo header{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.chn{background:var(--brand);color:#fff;border-radius:8px;padding:2px 10px;font-size:12px;font-weight:700}
.oo-body{display:grid;grid-template-columns:1fr 280px;gap:18px}.oo-it{display:grid;grid-template-columns:1fr auto;gap:6px;padding:7px 0;border-bottom:1px dashed var(--line)}.oo-side{display:grid;gap:6px;align-content:start}
.oo footer{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
/* integrations */
.int>summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;flex-wrap:wrap}.int>summary::-webkit-details-marker{display:none}.int>summary:after{content:"▾";margin-left:auto;color:var(--muted)}.int[open]>summary:after{content:"▴"}
.int-n{display:inline-flex;align-items:center;gap:10px;font-size:15px}.int-f{margin-top:16px}.int-foot{margin:6px 0 4px;padding-top:12px;border-top:1px solid var(--line)}
.help{margin-top:14px;background:#FBF9FF;border:1px solid var(--line);border-radius:14px;padding:14px;font-size:13.5px}.help p{margin:6px 0}
/* labels */
.lbl-list{max-height:520px;overflow:auto}.lbl-row{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line)}
.lbl-sheet{display:flex;flex-wrap:wrap;gap:8px}.lbl{border:1px dashed #C9C2DE;border-radius:4px;padding:2mm;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;text-align:center;overflow:hidden;background:#fff;color:#000}
.lbl-sheet.s-50x30 .lbl{width:50mm;height:30mm}.lbl-sheet.s-40x25 .lbl{width:40mm;height:25mm}.lbl-sheet.s-70x40 .lbl{width:70mm;height:40mm}
.lbl-bars{width:100%;height:38%;fill:#000;flex:none}.lbl-name{font-size:8pt;font-weight:600;line-height:1.1;max-height:2.4em;overflow:hidden}.lbl-code{font-size:7pt;font-family:ui-monospace,Menlo,monospace}.lbl-price{font-size:11pt}.lbl-store{font-size:6pt;color:#555}
.s-70x40 .lbl-name{font-size:10pt}.s-70x40 .lbl-price{font-size:15pt}.s-40x25 .lbl-name{font-size:6.5pt}.s-40x25 .lbl-price{font-size:9pt}
/* KDS */
.kds-body{background:#14101F;color:#fff;min-height:100vh}.kds-top{display:flex;align-items:center;gap:14px;padding:12px 20px;background:#1D1730;border-bottom:1px solid #2E2548}.kds-top .brand{padding:0}.kds-top .brand small{color:#A49CC0}.kds-top .btn{background:#2A2142;color:#fff;border-color:#3B3159}.kds-top .grow{flex:1}.kds-stats{color:#CFC8E6;font-weight:600}
.kds-board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:16px 20px;align-items:start}.kds-col h2{font-size:15px;color:#CFC8E6;margin-bottom:10px;display:flex;gap:8px;align-items:center}.kds-col .badge{background:#2E2548;color:#fff}
.kds-list{display:grid;gap:12px}.kds-card{background:#fff;color:var(--ink);border-radius:18px;padding:14px;border-top:6px solid var(--violet);display:grid;gap:10px}.kds-card.warn{border-top-color:#F59E0B}.kds-card.late{border-top-color:#E11D48;animation:pulse 1.6s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 5px rgba(225,29,72,.35)}}
.kds-card header{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.kds-no{font-size:20px}.kds-meta{color:var(--muted);flex:1;font-weight:600}.kds-age{font-weight:800}
.kds-card ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.kds-card li{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:16px}.kds-q{font-weight:800;color:var(--violet)}.kds-mod,.kds-note{grid-column:2;color:#5A5575;font-size:13px}.kds-note{color:#B3123A}
.kds-empty{text-align:center;padding:24px 0;color:#8E88A8}
@media(max-width:860px){.kds-board{grid-template-columns:1fr}.oo-body{grid-template-columns:1fr}.kds-top{flex-wrap:wrap}}
@media print{.no-print,.no-print-grid>.no-print{display:none!important}.lbl-sheet{gap:0}.lbl{border:0;outline:1px dotted #bbb;break-inside:avoid}.page-h{display:none!important}.card{padding:0}}
.sum .badge{align-self:center;height:fit-content;white-space:nowrap}
.preset{position:relative}
.plan ul{align-content:start}
.plan .yr{color:var(--muted);font-size:13px}

/* ===== shared (admin + POS) ===== */
.sum{display:flex;justify-content:space-between;gap:12px;margin:4px 0}.sum.total{font-size:20px;font-weight:800;margin-top:10px}.sum.disc b{color:var(--ok)}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 20px;border-radius:14px;z-index:99;display:none;max-width:90vw;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.kbd{background:rgba(255,255,255,.25);border-radius:6px;padding:0 6px;font-size:11px;font-weight:700}.btn:not(.primary) .kbd{background:var(--soft);color:var(--violet)}
.btn.danger-solid{background:var(--bad);color:#fff;border:0}.bad-t{color:var(--bad);font-weight:700}
.btn:focus-visible,.cat:focus-visible,.prod:focus-visible,.ic-btn:focus-visible,.seg:focus-visible,.opt:focus-visible,.var:focus-visible{outline:3px solid rgba(91,46,255,.45);outline-offset:2px}

/* ===== POS ===== */
.pos-body{background:var(--bg);overflow:hidden}
.pos{display:grid;grid-template-columns:minmax(0,1fr) 400px;height:100vh;height:100dvh}
.pos-l{display:flex;flex-direction:column;min-width:0;min-height:0}
.pos-bar{display:flex;gap:12px;align-items:center;padding:12px 18px;background:#fff;border-bottom:1px solid var(--line)}
.pos-bar .brand{padding:0}.pos-search{flex:1;position:relative;min-width:160px}.pos-search .icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}.pos-search input{padding-left:40px;border-radius:14px}
.pos-actions{display:flex;gap:8px;align-items:center}.pos-actions form{margin:0}.pos-actions .btn{padding:9px 12px;position:relative}.btn.on{border-color:var(--ok);color:var(--ok)}
.dot{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:99px;background:var(--brand);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.sub-banner{padding:9px 18px;font-weight:600;font-size:13px}.sub-banner.warn{background:#FFF4E0;color:#7A4500}.sub-banner.bad{background:#FFEDF2;color:#B3123A}
.cats{display:flex;gap:8px;padding:12px 18px 6px;overflow-x:auto;scrollbar-width:thin}
.cat{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;font-weight:600;cursor:pointer;white-space:nowrap;font:inherit;font-weight:600;color:#3D3A52}
.cat.on{background:var(--brand);color:#fff;border:0}
.prods{flex:1;min-height:0;overflow:auto;padding:12px 18px 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px;align-content:start}
.prod{background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;text-align:left;cursor:pointer;box-shadow:var(--shadow);transition:.15s;font:inherit;display:flex;flex-direction:column;gap:5px;color:var(--ink)}
.prod:hover{transform:translateY(-2px);border-color:var(--purple)}.prod.out{opacity:.55}
.prod .ph{height:96px;border-radius:12px;background:linear-gradient(135deg,rgba(255,77,141,.1),rgba(91,46,255,.1));display:grid;place-items:center;color:var(--violet);font-weight:800;font-size:24px;overflow:hidden;position:relative}
.prod .ph img{width:100%;height:100%;object-fit:cover}.prod .ph.art img{object-fit:contain;padding:6px}
.prod b{font-size:13.5px;line-height:1.25;min-height:34px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.prod .pr{color:var(--violet);font-weight:800}.prod small{color:var(--muted);font-size:11.5px}.prod small.tier{color:#9A5A00;font-weight:600}
.tag{display:inline-block;border-radius:8px;padding:2px 8px;font-size:11px;font-weight:700;background:var(--soft);color:var(--violet)}.tag.promo{background:var(--brand);color:#fff}.tag.warn{background:#FFF4E0;color:#9A5A00}.tag.ok{background:#E8F8F1;color:#07694A}
.ph .tag{position:absolute;top:6px;left:6px;font-size:10.5px}.tag.inl{margin:2px 4px 0 0}
.empty-s{grid-column:1/-1;display:grid;gap:4px;justify-items:center;padding:36px 10px;text-align:center}
.var-list{display:grid;gap:8px;margin:10px 0}.var{display:grid;grid-template-columns:1fr auto;gap:2px 10px;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:12px;font:inherit;cursor:pointer;text-align:left;color:var(--ink)}.var small{grid-column:1/-1}.var:hover{border-color:var(--purple)}.var.out{opacity:.55}
.mod-g{border:0;padding:0;margin:14px 0 0}.mod-g legend{padding:0;margin-bottom:6px}.opt{display:inline-flex;gap:8px;align-items:center;margin:0 8px 8px 0;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:8px 12px;font:inherit;cursor:pointer;color:var(--ink)}.opt small{color:var(--muted)}.opt.on{border-color:var(--violet);background:rgba(91,46,255,.08);font-weight:700}

.cart{background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;height:100vh;height:100dvh}
.cart-h{padding:14px 16px;border-bottom:1px solid var(--line)}.cart-t{font-size:17px}.cart-close{display:none}
.seg-row{display:flex;gap:6px;margin-top:10px}.seg-row[hidden]{display:none}.seg{flex:1;border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:7px 4px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;color:#3D3A52}.seg.on{background:var(--brand);color:#fff;border:0}
.cust-b{justify-content:flex-start;text-align:left;min-width:0}.cust-b>span{display:grid;line-height:1.2}.cust-b small{font-weight:500}
.lines{flex:1;overflow:auto;padding:4px 16px}
.line{display:grid;grid-template-columns:1fr auto;gap:6px 10px;padding:11px 0;border-bottom:1px dashed var(--line)}
.l-main{display:grid;gap:1px;min-width:0}.l-main b{font-size:13.5px}.l-main small{font-size:12px}.l-main .mods{color:#5A5575}.l-main .note{color:#B3123A}
.l-side{text-align:right;display:grid;gap:4px;justify-items:end}.l-side .pend{opacity:.55}
.l-act{display:flex;gap:2px}.ic-btn{width:30px;height:30px;border-radius:9px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:var(--muted)}.ic-btn:hover{background:var(--soft);color:var(--violet)}.ic-btn.danger:hover{background:#FFEDF2;color:var(--bad)}.ic-btn .icon{width:17px;height:17px}
.qty{display:inline-flex;align-items:center;gap:6px;grid-column:1/-1}
.qty button{min-width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:#fff;cursor:pointer;font:inherit;font-weight:800;color:var(--ink)}.qty .q-n{min-width:48px;background:var(--soft);border-color:transparent}
.cart-f{padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#FDFBFF}
.pv-note{min-height:18px;font-size:12px;color:var(--muted)}.pv-note.bad{color:var(--bad);font-weight:600}
.cart-fab{display:none}
.modal{position:fixed;inset:0;background:rgba(15,15,15,.45);display:none;place-items:center;z-index:50;padding:16px}.modal.open{display:grid}
.modal .box{background:#fff;border-radius:24px;padding:22px;width:100%;max-width:480px;max-height:92vh;max-height:92dvh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.3)}.modal .box.wide{max-width:600px}
.modal h2{margin-bottom:6px}.modal h3{font-size:15px}
.pay-row{display:grid;grid-template-columns:140px 1fr 38px;gap:8px;margin:10px 0 6px}.quick{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.hint{min-height:20px;color:#B3123A;font-size:12.5px;font-weight:600;margin-top:6px}
.gw-panel{border:1.5px dashed #CBBFF0;border-radius:16px;padding:12px;margin-bottom:10px;display:grid;gap:10px;background:#FBF9FF}
.qr-box{display:grid;justify-items:center;gap:8px}.qr{background:#fff;padding:6px;border-radius:12px;border:1px solid var(--line);line-height:0}.qr svg{width:min(240px,70vw);height:auto}.qr-str{word-break:break-all;max-height:90px;overflow:auto;display:block}
.tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin:12px 0}.tbl-b{display:grid;gap:3px;justify-items:center;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:12px 6px;font:inherit;cursor:pointer;color:var(--ink)}.tbl-b.occupied{background:#FFF8EA;border-color:#FFD99A}.tbl-b.sel{border-color:var(--violet);box-shadow:0 0 0 3px rgba(91,46,255,.18)}
.cust-list{display:grid;gap:6px;margin:10px 0;max-height:240px;overflow:auto}.cust{display:grid;gap:1px;text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px 12px;font:inherit;cursor:pointer;color:var(--ink)}.cust:hover{border-color:var(--purple)}
.hist{display:grid;gap:6px;margin-top:10px;max-height:60vh;overflow:auto}.hist-row{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;font:inherit;cursor:pointer;color:var(--ink)}.hist-row:hover{border-color:var(--purple)}
.notif{border-left:4px solid var(--purple);background:#FBF9FF;border-radius:10px;padding:8px 12px;margin-bottom:8px;display:grid}.notif.warn{border-color:var(--warn);background:#FFF8EA}.notif.bad{border-color:var(--bad);background:#FFF1F4}.notif small{color:var(--muted)}
.rc-wrap{background:#F4F1FA;border-radius:14px;padding:12px;margin:10px 0;overflow:auto}
.receipt{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:#fff;color:#000;margin:0 auto;padding:10px;line-height:1.35;box-shadow:0 2px 10px rgba(0,0,0,.08)}.receipt.w58{width:58mm}.receipt.w80{width:80mm;font-size:13px}
.receipt hr{border:0;border-top:1px dashed #777;margin:6px 0}.receipt .l{display:flex;justify-content:space-between;gap:8px}.receipt .b{font-weight:800}.receipt .c{text-align:center}.receipt .sm{font-size:11px;color:#333}.receipt .r-logo{display:block;margin:0 auto 4px;filter:grayscale(1) contrast(1.4)}
@media print{body.print-receipt{background:#fff;overflow:visible}body.print-receipt *{visibility:hidden}body.print-receipt #rc,body.print-receipt #rc *{visibility:visible}body.print-receipt #rc{position:absolute;left:0;top:0;box-shadow:none;margin:0;padding:2mm}body.print-receipt #rc.w58{width:58mm}body.print-receipt #rc.w80{width:80mm}body.print-receipt .pos{display:block}}
/* tablet */
@media(max-width:1100px){.pos{grid-template-columns:minmax(0,1fr) 320px}.pos-actions .lbl{display:none}.pos-actions .btn{padding:9px 11px}.prods{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.pos-bar .brand>div{display:none}}
/* ponsel: keranjang jadi lembar bawah */
@media(max-width:760px){
  .pos{grid-template-columns:1fr}.pos-bar{flex-wrap:wrap;gap:8px;padding:10px 12px}.pos-bar .brand{flex:none}.pos-search{order:3;flex:1 1 100%}.pos-actions{margin-left:auto;gap:6px}
  .cats,.prods{padding-left:12px;padding-right:12px}.prods{padding-bottom:90px;grid-template-columns:repeat(2,minmax(0,1fr))}.prod .ph{height:84px}
  .cart{position:fixed;inset:0;z-index:30;height:100dvh;transform:translateY(100%);transition:transform .22s ease;border:0}.cart.open{transform:none}.cart-close{display:inline-flex}
  .cart-fab{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:20;align-items:center;gap:10px;background:var(--brand);color:#fff;border:0;border-radius:16px;padding:14px 18px;font:inherit;font-weight:700;box-shadow:0 12px 30px rgba(91,46,255,.45);cursor:pointer}.cart-fab[hidden]{display:none}.cart-fab b{margin-left:auto}.cart-fab .icon{width:22px;height:22px}
  .pay-row{grid-template-columns:120px 1fr 38px}.modal{padding:0;place-items:end center}.modal .box,.modal .box.wide{max-width:none;border-radius:22px 22px 0 0;max-height:94dvh;padding:18px}
  .tables{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}.toast{bottom:84px}
}
@media(max-width:380px){.prods{grid-template-columns:1fr 1fr;gap:8px}.pos-actions .btn{padding:8px 9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
[hidden]{display:none!important}
.prod .ph img{position:absolute;inset:0}
.pos-bar .brand>div{white-space:nowrap}.pos-bar .brand{flex:none}
.pos-actions .bt{display:none}.pos-actions #shift-label{display:inline}
@media(min-width:1700px){.pos-actions .bt{display:inline}}
@media(max-width:1100px){.pos-bar .brand>div{display:none}}
@media(max-width:1100px){.pos-actions #shift-label{display:none}}

.brand-logo{display:inline-block;vertical-align:middle;flex:none}
.mchips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 6px}
.mchip{border:2px solid transparent;background:#fff;border-radius:16px;padding:0;line-height:0;cursor:pointer;box-shadow:0 1px 4px rgba(15,15,15,.08);transition:transform .12s,box-shadow .12s}
.mchip img{height:34px;width:auto;display:block;border-radius:14px}
.mchip:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(91,46,255,.18)}
.mchip.on{border-color:#9B51E0;box-shadow:0 0 0 3px rgba(155,81,224,.20)}
.mchip:focus-visible{outline:3px solid #5B2EFF;outline-offset:2px}
.mchip[disabled]{opacity:.55;cursor:not-allowed}
.pay-row.nosel{grid-template-columns:1fr 36px}
.int-n .brand-logo{margin-right:8px}
.gw-logos{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:8px 0}
@media(max-width:560px){.mchip img{height:30px}}
.card.inset{box-shadow:none;background:var(--bg);padding:14px}