/* Layout: sticky top bar; Tables map is home; tapping a table opens its bill (drink grid + running bill). Counter-first, touch-sized. */
:root{--bg:#14110f;--card:#211c18;--card2:#2b241f;--line:#3a3029;--tx:#f3ece4;--mut:#a09286;--gold:#e0a538;--ok:#3fb27f;--bad:#e5534b;--open:#2a2214;--late:#2d1918;color-scheme:dark}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%}
button{background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:11px 14px;cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
button.pri{background:var(--gold);color:#1b1307;border-color:var(--gold);font-weight:700}
button.ok{background:var(--ok);border-color:var(--ok);color:#06210f;font-weight:700}
button.dng{color:var(--bad);border-color:#5a2a27}
button:disabled{opacity:.4;cursor:not-allowed}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);border-bottom:1px solid var(--line);display:flex;gap:6px;overflow-x:auto;padding-block:8px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));align-items:center}
.top .brand{font-weight:800;color:var(--gold);white-space:nowrap;margin-right:4px}
.top button{white-space:nowrap;padding:8px 12px}
.top button.on{background:var(--gold);color:#1b1307;border-color:var(--gold);font-weight:700}
.wrap{padding-block:10px 40px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1100px;margin:0 auto}
.row{display:flex;gap:8px;align-items:center}.row>*{flex:1;min-width:0}.row>.fix{flex:none}
.chips{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px}
.chip{flex:none;padding:8px 12px;border-radius:999px;background:var(--card);border:1px solid var(--line);white-space:nowrap}
.chip.on{background:var(--gold);color:#1b1307;border-color:var(--gold);font-weight:700}
.zone{margin:14px 0 6px;color:var(--mut);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:12px;border-radius:12px;background:var(--card);border:1px solid var(--line);min-height:96px;min-width:0}
.tile b{font-size:15px}
.tile .seats{color:var(--mut);font-size:12px;font-weight:400}
.tile .meta{font-size:12px;color:var(--mut)}
.tile .amt{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.tile.open{border-color:var(--gold);background:var(--open)}
.tile.late{border-color:var(--bad);background:var(--late)}
.warnchip{font-size:11px;background:var(--gold);color:#1b1307;border-radius:999px;padding:2px 8px;font-weight:700}
.pos{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.pos{grid-template-columns:minmax(0,1fr) 390px;align-items:start}#cart{position:sticky;top:calc(60px + env(safe-area-inset-top,0px))}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.pc{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;min-width:0}
.pc h4{margin:0 0 2px;font-size:14px}.pc small{color:var(--mut)}
.pc .vs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.pc .vs button{flex:1 1 auto;padding:9px 8px;font-size:13px}
.pc .vs button b{display:block;color:var(--gold);font-variant-numeric:tabular-nums}
.pc.out{opacity:.45}
.low{color:var(--bad)}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px;min-width:0}
.card h3{margin:0 0 8px;font-size:15px}
.note{border:1px solid var(--gold);background:var(--open);border-radius:10px;padding:9px 12px;margin-bottom:10px;font-size:13px}
.rh{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin:12px 0 2px}
.rh.new{color:var(--gold)}
.line{display:flex;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.line:last-child{border:0}.line .n{flex:1;min-width:0}.line .q{display:flex;gap:6px;align-items:center}
.line .q button{padding:4px 11px;font-size:18px}
.tot{display:flex;justify-content:space-between;font-size:20px;font-weight:800;padding:10px 0;font-variant-numeric:tabular-nums}
.mut{color:var(--mut)}.r{text-align:right}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}td,th{padding:8px 6px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}th{color:var(--mut);font-weight:600}
td.n,th.n{text-align:right}
.kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}
@media(min-width:700px){.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.kpi small{color:var(--mut);display:block}.kpi b{font-size:20px;font-variant-numeric:tabular-nums}
.kpis3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.bigbtn{padding:18px 10px;font-size:16px;font-weight:700}
#modal{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;align-items:flex-end;justify-content:center;z-index:20}
#modal.show{display:flex}
#modal .box{background:var(--card);border-radius:18px 18px 0 0;width:100%;max-width:560px;max-height:92vh;overflow:auto;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px))}
@media(min-width:700px){#modal{align-items:center}#modal .box{border-radius:18px}}
.box h3{margin:0 0 12px}.box label{display:block;color:var(--mut);font-size:12px;margin:10px 0 4px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:#000;border:1px solid var(--line);padding:11px 16px;border-radius:10px;z-index:30;max-width:90%;color:var(--tx)}
.toast.err{border-color:var(--bad);color:#ffb4ae}
#login{max-width:380px;margin:10vh auto;padding-inline:16px}
#login h1{color:var(--gold);margin:0 0 8px}
.rc{background:#fff;color:#111;font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;padding:14px;max-width:300px;margin:0 auto 10px;border-radius:4px}
.rc .c{text-align:center}.rc hr{border:0;border-top:1px dashed #111}.rc .l{display:flex;justify-content:space-between;gap:8px}
.pin{display:flex;gap:10px;justify-content:center;margin:12px 0}.pin i{width:16px;height:16px;border-radius:50%;border:2px solid var(--mut)}.pin i.f{background:var(--gold);border-color:var(--gold)}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:300px;margin:0 auto}.keypad button{padding:18px 0;font-size:22px;font-weight:700}
.names{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:12px 0}
.cut{border:0;border-top:2px dashed #111;margin:18px -6px 24px;position:relative;overflow:visible}.cut::after{content:"\2702  tear here: kitchen";position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:#fff;padding:0 6px;font-size:10px;white-space:nowrap}
.rc .big{font-size:15px;font-weight:700}.rc .nt{padding-left:14px;font-style:italic}
.tag{font-size:11px;border-radius:999px;padding:1px 8px;border:1px solid var(--line);color:var(--mut)}.tag.comp{color:var(--ok);border-color:var(--ok)}
.line .acts{display:flex;gap:4px}.line .acts button{padding:3px 8px;font-size:12px}
.neg{color:var(--bad);font-weight:700}
.sub{display:flex;justify-content:space-between;color:var(--mut);padding:2px 0;font-variant-numeric:tabular-nums}