:root{--ground: #E8EDE9;--column: #DAE3DC;--ticket: #FFFFFF;--ink: #13201A;--muted: #4A5B53;--rail: #B7C6BC;--accent: #0A6B47;--accent-hover: #0C7C54;--accent-ink: #FFFFFF;--accent-soft: #CFE6DA;--alert: #B4301B;--alert-ink: #FFFFFF;--alert-soft: #F9E1DB;--alert-text: #8A2412;--pad: 1;--r: 12px;--r-btn: 10px;--r-chip: 99px;--ease-out: cubic-bezier(.23, 1, .32, 1);--font: "Sarabun", "Noto Sans Thai", system-ui, -apple-system, "Segoe UI", sans-serif;--base: 16px;color-scheme:light}:root[data-theme=dark]{--ground: #0E1512;--column: #16211C;--ticket: #1D2B25;--ink: #E8F1EC;--muted: #A2B6AB;--rail: #405449;--accent: #3CCB8E;--accent-hover: #55D9A2;--accent-ink: #04210F;--accent-soft: #1E4435;--alert: #FF6B55;--alert-ink: #230A05;--alert-soft: #3B1E19;--alert-text: #FFB8AA;color-scheme:dark}:root[data-theme=contrast]{--ground: #000000;--column: #0B0B0B;--ticket: #000000;--ink: #FFFFFF;--muted: #E3E3E3;--rail: #8C8C8C;--accent: #FFD400;--accent-hover: #FFE45C;--accent-ink: #000000;--accent-soft: #3A3300;--alert: #FF4A3D;--alert-ink: #000000;--alert-soft: #2A0A07;--alert-text: #FFB3AC;color-scheme:dark}:root[data-theme=blue]{--ground: #E7EDF5;--column: #D5DFEC;--ticket: #FFFFFF;--ink: #0F1B2D;--muted: #44546A;--rail: #B4C2D4;--accent: #1F5FBF;--accent-hover: #2A6FD6;--accent-ink: #FFFFFF;--accent-soft: #CFDDF3}:root[data-theme=amber]{--ground: #F3EBDD;--column: #E6DAC5;--ticket: #FFFDF8;--ink: #2A1A0E;--muted: #66503B;--rail: #C9B79C;--accent: #A8561A;--accent-hover: #BE6624;--accent-ink: #FFFFFF;--accent-soft: #F1D9BF}:root[data-theme=mono]{--ground: #EDEDED;--column: #DEDEDE;--ticket: #FFFFFF;--ink: #111111;--muted: #4D4D4D;--rail: #B0B0B0;--accent: #161616;--accent-hover: #333333;--accent-ink: #FFFFFF;--accent-soft: #D4D4D4;--alert: #B00020;--alert-soft: #F6DADF;--alert-text: #7A0016}:root[data-pad=tight]{--pad: .7}:root[data-pad=roomy]{--pad: 1.4}:root[data-radius=square]{--r: 0px;--r-btn: 0px;--r-chip: 0px}:root[data-radius=round]{--r: 22px;--r-btn: 99px;--r-chip: 99px}*{box-sizing:border-box}html{--size: 1;font-size:calc(var(--base) * var(--size))}@media (min-width: 1600px){:root{--base: 20px}}@media (min-width: 2400px){:root{--base: 28px}}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font);font-size:1rem;line-height:1.4;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;caret-color:var(--accent)}::selection{background:var(--accent-soft);color:var(--ink)}button{font:inherit;color:inherit}h1,h2,p,dl,dd,ul{margin:0}ul{padding:0;list-style:none}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}*{scrollbar-width:thin;scrollbar-color:var(--rail) transparent}.app{height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;padding-top:env(safe-area-inset-top,0px)}@media (min-width: 900px){.app[data-panel=open]{padding-right:24rem}}.bar{grid-row:1;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:1.5rem;padding:calc(.9rem * var(--pad)) calc(1rem * var(--pad)) calc(.6rem * var(--pad))}.brand h1{font-size:1.5rem;font-weight:800;line-height:1.1;letter-spacing:-.01em}.brand p{color:var(--muted);font-size:.9rem;font-weight:500}.counts{display:flex;gap:.5rem}.counts>div{background:var(--ticket);border-radius:var(--r);padding:calc(.35rem * var(--pad)) calc(.9rem * var(--pad));display:flex;align-items:baseline;gap:.6rem}.counts dt{color:var(--muted);font-size:.95rem;font-weight:600}.counts dd{font-size:1.75rem;font-weight:800;line-height:1.1}.counts .is-late{background:var(--alert);color:var(--alert-ink)}.counts .is-late dt{color:var(--alert-ink)}.clock{font-size:2.25rem;font-weight:800;letter-spacing:-.01em;min-width:4.4ch;text-align:right}.scroller{grid-row:3;overflow-x:auto;overflow-y:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0}.stations,.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,.7fr);gap:calc(.75rem * var(--pad));padding:0 calc(1rem * var(--pad));min-width:0}.stations{padding-top:.35rem;padding-bottom:.5rem}.station{position:relative;display:flex;align-items:center;gap:.6rem;min-width:0}.station:after{content:"";position:absolute;left:1.4rem;right:calc(-.75rem * var(--pad) - .3rem);top:50%;height:4px;margin-top:-2px;background:var(--accent);z-index:0}.station:last-child:after{display:none}.station>*{position:relative;z-index:1}.stop-mark{width:1.1rem;height:1.1rem;border-radius:50%;background:var(--accent);border:3px solid var(--ground);box-sizing:content-box;flex:none}.s-name{background:var(--ground);padding-right:.5rem;font-size:1.25rem;font-weight:800;letter-spacing:-.005em;white-space:nowrap}.s-count{background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:.95rem;min-width:1.7rem;height:1.7rem;padding:0 .4rem;border-radius:99px;display:grid;place-items:center}.board{padding-bottom:calc(.75rem * var(--pad));min-height:0}.col{background:var(--column);border-radius:calc(var(--r) + 2px);padding:calc(.6rem * var(--pad));overflow-y:auto;min-height:0;overscroll-behavior:contain}.col-list{display:grid;gap:calc(.6rem * var(--pad));align-content:start}.empty{color:var(--muted);font-size:.95rem;font-weight:500;padding:.4rem .3rem}.ticket{background:var(--ticket);border-radius:var(--r);padding:calc(.75rem * var(--pad)) calc(.85rem * var(--pad)) calc(.85rem * var(--pad));display:grid;gap:calc(.6rem * var(--pad));transition:opacity .18s var(--ease-out),transform .18s var(--ease-out)}@starting-style{.ticket,.done{opacity:0;transform:translateY(8px)}}.t-head{display:flex;align-items:center;gap:.75rem}.room{font-size:2.75rem;font-weight:800;line-height:1;letter-spacing:-.02em}.t-meta{min-width:0;display:grid;gap:.15rem;margin-left:auto;text-align:right}.guest{color:var(--muted);font-size:.95rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.due{font-size:1.05rem;font-weight:700;white-space:nowrap}.due.late{background:var(--alert);color:var(--alert-ink);border-radius:calc(var(--r) * .65);padding:.1rem .55rem;justify-self:end;font-weight:800}.ticket.is-late{outline:3px solid var(--alert);outline-offset:-3px}.allergy{background:var(--alert-soft);color:var(--alert-text);border-radius:calc(var(--r) * .65);padding:.35rem .6rem;font-size:1.05rem;font-weight:600}.allergy b{font-weight:800;text-transform:uppercase;letter-spacing:.02em;margin-right:.35rem}.lines{display:grid;gap:calc(.5rem * var(--pad))}.lines li{display:grid;grid-template-columns:1.9rem minmax(0,1fr);gap:.4rem;align-items:baseline}.qty{font-size:1.15rem;font-weight:800}.dish{display:grid;min-width:0}.en{font-size:1.15rem;font-weight:700;line-height:1.2}.th{font-size:1rem;font-weight:500;color:var(--muted)}.opts{font-size:.95rem;font-weight:600;color:var(--accent)}.t-foot{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;color:var(--muted);font-size:.9rem;font-weight:600}.total{color:var(--ink);font-size:1.1rem;font-weight:800}.t-step{display:none}.route{display:flex;align-items:center;padding:.15rem .1rem}.stop{width:.7rem;height:.7rem;border-radius:50%;border:2px solid var(--rail);background:var(--ticket);flex:none;transition:background-color .2s ease,border-color .2s ease}.stop.done{background:var(--accent);border-color:var(--accent)}.stop.now{width:1.15rem;height:1.15rem;background:var(--accent);border-color:var(--accent)}.seg{flex:1;height:3px;background:var(--rail);transition:background-color .2s ease}.seg.on{background:var(--accent)}.btn{min-height:3rem;border:0;border-radius:var(--r-btn);background:var(--accent);color:var(--accent-ink);font-size:1.1rem;font-weight:800;cursor:pointer;transition:transform .14s var(--ease-out),background-color .14s ease;touch-action:manipulation}.btn:active{transform:scale(.97)}@media (hover: hover) and (pointer: fine){.btn:hover{background:var(--accent-hover)}}.col.is-done .col-list{gap:calc(.4rem * var(--pad))}.done{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.6rem;align-items:baseline;background:var(--ticket);border-radius:calc(var(--r) * .85);padding:calc(.5rem * var(--pad)) calc(.7rem * var(--pad));transition:opacity .18s var(--ease-out),transform .18s var(--ease-out)}.room-s{font-size:1.3rem;font-weight:800}.done-guest{color:var(--muted);font-size:.95rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.done-at{color:var(--muted);font-size:.95rem;font-weight:700}.demo{grid-row:4;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem 1rem calc(.5rem + env(safe-area-inset-bottom,0px));color:var(--muted);font-size:.9rem;font-weight:500}.demo-controls{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}.speed{display:inline-flex;gap:.25rem}.chip{min-height:2.25rem;padding:0 .85rem;border:0;border-radius:var(--r-chip);background:var(--column);font-weight:700;font-size:.9rem;cursor:pointer;transition:transform .14s var(--ease-out),background-color .14s ease;touch-action:manipulation}.chip:active{transform:scale(.97)}.chip.on,.chip[aria-pressed=true],.chip[aria-expanded=true]{background:var(--accent);color:var(--accent-ink)}@media (hover: hover) and (pointer: fine){.chip:hover:not(.on):not([aria-pressed=true]):not([aria-expanded=true]){background:var(--accent-soft)}}.tabs{display:none;grid-row:2}.sp{position:fixed;top:0;right:0;bottom:0;width:min(24rem,100vw);z-index:40;display:flex;flex-direction:column;background:var(--ticket);color:var(--ink);box-shadow:0 0 2rem #0000002e;transform:translate(100%);visibility:hidden;transition:transform .22s var(--ease-out),visibility 0s linear .22s}.sp.open{transform:none;visibility:visible;transition:transform .22s var(--ease-out),visibility 0s}.sp-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1rem .4rem}.sp-head h2{font-size:1.25rem;font-weight:800}.sp-body{overflow-y:auto;padding:.5rem 1rem 1rem;display:grid;gap:1.1rem;align-content:start;flex:1}.sp-foot{display:flex;gap:.5rem;justify-content:space-between;padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom,0px))}.sp-group{border:0;padding:0;margin:0;min-width:0}.sp-group legend{font-weight:800;font-size:.95rem;margin-bottom:.4rem;padding:0;display:flex;justify-content:space-between;width:100%}.sp-group legend output{color:var(--muted);font-weight:700}.sp-choices{display:flex;flex-wrap:wrap;gap:.4rem}.sp-opt{min-height:2.5rem;padding:0 .8rem;border:0;border-radius:var(--r-chip);background:var(--column);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;text-align:left;transition:transform .14s var(--ease-out),background-color .14s ease;touch-action:manipulation}.sp-opt:active{transform:scale(.97)}.sp-opt.on{background:var(--accent);color:var(--accent-ink)}@media (hover: hover) and (pointer: fine){.sp-opt:hover:not(.on){background:var(--accent-soft)}}.sp-group:disabled .sp-opt{opacity:.4;cursor:not-allowed}.sp-group:has(.font-opt) .sp-choices{flex-direction:column}.sp-group:has(.font-opt) .sp-opt{width:100%;border-radius:var(--r-btn);padding:.35rem .8rem}.font-opt{display:grid;line-height:1.25}.font-opt span{font-weight:500;font-size:.95rem;opacity:.85}.sw{display:inline-flex;border-radius:6px;overflow:hidden;box-shadow:inset 0 0 0 1px #00000040;flex:none}.sw i{width:.7rem;height:1.1rem;display:block}.sp-size{display:flex;gap:.6rem;align-items:center}.sp-size input[type=range]{flex:1;accent-color:var(--accent);min-height:2.5rem}.sp-note{color:var(--muted);font-size:.9rem;margin-top:-.6rem}:root[data-style=bold] .ticket{padding-top:0;overflow:hidden}:root[data-style=bold] .t-head{margin:0 calc(-.85rem * var(--pad));padding:calc(.6rem * var(--pad)) calc(.85rem * var(--pad));background:var(--accent);color:var(--accent-ink)}:root[data-style=bold] .t-head .guest,:root[data-style=bold] .t-head .due{color:var(--accent-ink)}:root[data-style=bold] .ticket.is-late{outline:0}:root[data-style=bold] .ticket.is-late .t-head{background:var(--alert);color:var(--alert-ink)}:root[data-style=bold] .ticket.is-late .t-head .guest,:root[data-style=bold] .ticket.is-late .t-head .due{color:var(--alert-ink)}:root[data-style=bold] .due.late{background:#ffffff40}:root[data-style=wireframe]{--ground: #FFFFFF;--column: transparent;--ticket: #FFFFFF;--ink: #1A1A1A;--muted: #5E5E5E;--rail: #9A9A9A;--accent: #1A1A1A;--accent-hover: #EDEDED;--accent-ink: #FFFFFF;--accent-soft: #EDEDED;--alert: #1A1A1A;--alert-ink: #FFFFFF;--alert-soft: transparent;--alert-text: #1A1A1A;color-scheme:light}:root[data-style=wireframe] .col{border:1.5px dashed var(--rail)}:root[data-style=wireframe] .ticket,:root[data-style=wireframe] .done,:root[data-style=wireframe] .counts>div{border:1.5px solid var(--ink)}:root[data-style=wireframe] .counts .is-late{background:transparent;color:var(--ink);border:3px double var(--ink)}:root[data-style=wireframe] .counts .is-late dt{color:var(--ink)}:root[data-style=wireframe] .ticket.is-late{outline:3px double var(--ink)}:root[data-style=wireframe] .due.late{background:transparent;color:var(--ink);border:2px solid var(--ink)}:root[data-style=wireframe] .allergy{border:2px solid var(--ink)}:root[data-style=wireframe] .opts{color:var(--ink);font-style:italic}:root[data-style=wireframe] .btn{background:transparent;color:var(--ink);border:2px solid var(--ink)}@media (hover: hover) and (pointer: fine){:root[data-style=wireframe] .btn:hover{background:#ededed}}:root[data-style=wireframe] .chip,:root[data-style=wireframe] .sp-opt{background:transparent;border:1.5px solid var(--ink)}:root[data-style=wireframe] .chip.on,:root[data-style=wireframe] .chip[aria-pressed=true],:root[data-style=wireframe] .chip[aria-expanded=true],:root[data-style=wireframe] .sp-opt.on{background:var(--ink);color:#fff}:root[data-style=wireframe] .sp{border-left:2px solid var(--ink);box-shadow:none;background:#fff}:root[data-style=wireframe] .seg{background:none;height:0;border-top:2px dashed var(--rail)}:root[data-style=wireframe] .seg.on{border-top:2px solid var(--ink)}:root[data-style=wireframe] .stop{background:transparent;border-color:var(--ink)}:root[data-style=wireframe] .stop.done,:root[data-style=wireframe] .stop.now{background:var(--ink)}:root[data-style=wireframe] .station:after{background:none;height:0;border-top:2px dashed var(--ink)}:root[data-style=wireframe] .s-count{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}:root[data-style=wireframe] .stop-mark{background:var(--ink)}:root[data-theme=contrast] .ticket,:root[data-theme=contrast] .done{border:2px solid var(--ink)}:root[data-theme=contrast] .col{border:2px solid var(--rail)}:root[data-layout=queue] .stations,:root[data-layout=queue] .tabs{display:none}:root[data-layout=queue] .scroller{grid-template-rows:minmax(0,1fr);overflow-x:hidden}:root[data-layout=queue] .board.queue{display:block;overflow-y:auto;padding-top:calc(.6rem * var(--pad))}:root[data-layout=queue] .queue .col+.col{margin-top:calc(.75rem * var(--pad))}:root[data-layout=queue] .queue .col{display:block;overflow:visible}.queue-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:calc(.6rem * var(--pad));align-items:start}:root[data-layout=queue] .t-step{display:inline-block;color:var(--accent);font-weight:800;font-size:1rem}:root[data-style=wireframe][data-layout=queue] .t-step{color:var(--ink)}.q-title{font-size:1.1rem;font-weight:800;display:flex;gap:.6rem;align-items:center;margin-bottom:.5rem}@media (max-width: 1199px){:root[data-layout=board] .stations,:root[data-layout=board] .board{grid-template-columns:repeat(5,minmax(18rem,1fr))}:root[data-layout=board] .scroller{scroll-snap-type:x proximity}.col,.station{scroll-snap-align:start}}@media (max-width: 719px){:root{--base: 16px}.bar{grid-template-columns:1fr auto;gap:.5rem 1rem;padding:.7rem .8rem .4rem}.brand h1{font-size:1.25rem}.clock{grid-column:2;grid-row:1;font-size:1.6rem}.counts{grid-column:1 / -1;grid-row:2}.counts>div{flex:1;justify-content:space-between;padding:.3rem .75rem}.counts dd{font-size:1.5rem}:root[data-layout=board] .tabs{display:flex;gap:.4rem;padding:.3rem .8rem .5rem;overflow-x:auto}.tabs button{flex:none;min-height:2.75rem;padding:0 .9rem;border:0;border-radius:var(--r-chip);background:var(--column);font-weight:700;cursor:pointer}.tabs button.on{background:var(--accent);color:var(--accent-ink)}:root[data-style=wireframe] .tabs button{background:transparent;border:1.5px solid var(--ink)}:root[data-style=wireframe] .tabs button.on{background:var(--ink);color:#fff}.tabs .n{margin-left:.3rem;font-weight:800}:root[data-layout=board] .stations{display:none}:root[data-layout=board] .scroller{overflow-x:hidden;grid-template-rows:minmax(0,1fr)}:root[data-layout=board] .board{grid-template-columns:minmax(0,1fr);padding:0 .8rem .6rem}:root[data-layout=board] .col{display:none}:root[data-layout=board] .col.on{display:block}.room{font-size:2.4rem}.demo{flex-direction:column;align-items:stretch;gap:.4rem;padding:.4rem .8rem calc(.5rem + env(safe-area-inset-bottom,0px))}.demo p{display:none}.demo-controls{justify-content:space-between}.sp{top:auto;left:0;width:auto;max-height:78dvh;border-radius:18px 18px 0 0;transform:translateY(100%)}.sp.open{transform:none}}@media (prefers-reduced-motion: reduce){.ticket,.done{transition:opacity .18s ease}@starting-style{.ticket,.done{transform:none}}.btn,.chip,.sp-opt{transition:background-color .14s ease}.btn:active,.chip:active,.sp-opt:active{transform:none}.sp,.sp.open{transition:opacity .12s ease,visibility 0s;transform:none;opacity:0}.sp.open{opacity:1}}@media (prefers-contrast: more){:root{--muted: #26352E;--rail: #7E9186}}.signin{min-height:100dvh;display:grid;place-items:center;padding:1.5rem 1rem}.signin form{width:min(24rem,100%);display:grid;gap:.9rem;background:var(--ticket);border-radius:calc(var(--r) + 4px);padding:1.6rem}.signin h1{font-size:1.6rem;font-weight:800;letter-spacing:-.01em}.si-sub{color:var(--muted);font-weight:500;margin-top:-.5rem}.signin label{display:grid;gap:.3rem;font-weight:700;font-size:.95rem}.signin input{min-height:3rem;padding:0 .8rem;border:2px solid var(--rail);border-radius:var(--r-btn);background:var(--ground);color:var(--ink);font:inherit;font-size:1rem}.signin input:focus-visible{border-color:var(--accent);outline-offset:0}.si-error{background:var(--alert-soft);color:var(--alert-text);border-radius:calc(var(--r) * .65);padding:.5rem .7rem;font-weight:700}.btn:disabled{opacity:.6;cursor:progress}.si-demo{justify-self:center}.banner{position:fixed;left:50%;bottom:3.5rem;transform:translate(-50%);z-index:30;max-width:min(34rem,calc(100vw - 2rem));background:var(--alert);color:var(--alert-ink);border-radius:var(--r-btn);padding:.6rem 1rem;font-weight:700;box-shadow:0 .5rem 1.5rem #00000040}.banner.info{background:var(--ink);color:var(--ground)}.note{color:var(--muted);font-size:.9rem;font-weight:600}select.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:.85rem}@media (pointer: coarse),(max-width: 1199px){.chip,.sp-opt,select.chip{min-height:max(44px,2.5rem)}.btn{min-height:max(48px,3rem)}.tabs button{min-height:max(44px,2.75rem)}.sp-size input[type=range]{min-height:44px}}@media (max-height: 520px) and (orientation: landscape){.bar{grid-template-columns:1fr auto auto;gap:.75rem;padding:.4rem .8rem .3rem}.brand h1{font-size:1.1rem}.brand p{display:none}.counts{grid-column:auto;grid-row:auto}.counts>div{flex:none;padding:.15rem .6rem}.counts dd{font-size:1.2rem}.clock{grid-column:auto;grid-row:auto;font-size:1.3rem}:root[data-layout=board] .tabs{padding:.1rem .8rem .3rem}.demo{flex-direction:row;align-items:center;padding:.25rem .8rem calc(.25rem + env(safe-area-inset-bottom,0px))}.demo-controls{justify-content:flex-end;flex-wrap:nowrap;overflow-x:auto}.chip,.sp-opt,select.chip{min-height:40px}.room{font-size:2rem}.sp{max-height:100dvh}.ticket .btn{position:sticky;bottom:.25rem}}@media (max-width: 359px){.bar{padding-left:.6rem;padding-right:.6rem}.counts{gap:.3rem}.counts dt{font-size:.85rem}:root[data-layout=board] .board,:root[data-layout=board] .tabs{padding-left:.6rem;padding-right:.6rem}.signin form{padding:1.2rem}}