:root{--bg:#EAF6FF;--surface:#FFFFFF;--ink:#17324E;--slate:#3F5C7A;--blue:#2D6FA3;--blue-deep:#1F4E75;--teal:#167B77;--teal-wash:#DFF3F1;--amber:#B45309;--amber-bright:#F2A93B;--amber-wash:#FDECD1;--line:#CFE7F7;--navy-dark:#17324E;--navy-darker:#0C1F33;--radius-lg:22px;--radius-md:14px;--radius-sm:9px;--shadow: 0 10px 28px rgba(23,50,78,.12)}*{box-sizing:border-box}body{margin:0;font-family:Sarabun,sans-serif;background:radial-gradient(circle at 1px 1px,rgba(45,111,163,.08) 1px,transparent 0) 0 0/22px 22px,var(--bg);color:var(--ink);-webkit-text-size-adjust:100%}h1,h2,h3,.display{font-family:Mitr,sans-serif;margin:0}p{margin:0}button{font-family:inherit}.page{min-height:100dvh;display:flex;justify-content:center;padding:16px 14px calc(28px + env(safe-area-inset-bottom))}.screen{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:24px 20px 26px;align-self:flex-start}.shop-line{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--slate);font-weight:600;margin-bottom:18px}.shop-line .dot{width:7px;height:7px;background:var(--teal);border-radius:50%;flex:none}.shop-line .dot.closed{background:var(--slate)}.screen-title{font-size:19px;margin-bottom:4px}.screen-sub{color:var(--slate);font-size:13px;margin-bottom:22px}.field-label{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:8px;display:block}.field-hint{font-size:11.5px;color:var(--slate);font-weight:400}.name-input{width:100%;border:2px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;font-family:Sarabun;font-size:16px;color:var(--ink);margin-bottom:20px;background:#fff}.name-input:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--amber)}.people-pills{display:flex;gap:7px;margin-bottom:24px;flex-wrap:wrap}.pill{border:2px solid var(--line);background:#fff;border-radius:12px;padding:10px 0;width:52px;font-weight:700;color:var(--slate);cursor:pointer;transition:.15s;font-size:14px}.pill:hover{border-color:#9fc6e6}.pill.selected{border-color:var(--amber);background:var(--amber-wash);color:var(--amber)}.pill:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.btn-primary{background:var(--amber);color:#fff;border:none;border-radius:999px;padding:15px 22px;font-weight:700;font-size:15px;width:100%;cursor:pointer;box-shadow:0 8px 18px #b4530952;transition:background .15s ease,transform .1s ease}.btn-primary:hover:not(:disabled){background:#94420a}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.btn-primary:disabled{background:#b9c6d2;box-shadow:none;cursor:not-allowed}.btn-ghost{background:transparent;border:2px dashed #9fc6e6;color:var(--blue);border-radius:999px;padding:11px 20px;font-weight:600;font-size:13px;cursor:pointer;width:100%}.btn-ghost:hover{background:var(--bg)}.btn-ghost:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.queue-status-note{margin-top:18px;background:var(--bg);border:1px dashed #9fc6e6;border-radius:var(--radius-sm);padding:10px 12px;font-size:12px;color:var(--slate);text-align:center}.tag-wrap{display:flex;justify-content:center;padding-top:14px}.queue-tag{position:relative;width:172px;margin:30px auto 6px;background:linear-gradient(180deg,#fff,#fbf6ec);border:2px solid var(--ink);border-radius:8px 8px 30px 30px;padding:24px 14px 18px;text-align:center;box-shadow:0 12px 22px #17324e2e;transform-origin:top center;animation:swing 1.6s ease-out 1}.queue-tag:before{content:"";position:absolute;top:-24px;left:50%;width:2px;height:24px;background:var(--slate);transform:translate(-50%)}.queue-tag:after{content:"";position:absolute;top:-32px;left:50%;width:11px;height:11px;border:2px solid var(--slate);border-radius:50%;transform:translate(-50%);background:var(--bg)}.tag-hole{width:15px;height:15px;border-radius:50%;border:2px solid var(--ink);background:var(--bg);margin:0 auto 10px}.tag-number{font-family:Mitr;font-size:42px;font-weight:700;color:var(--blue);line-height:1}.tag-label{font-size:11px;color:var(--slate);letter-spacing:.06em;margin-top:6px;font-weight:600}@keyframes swing{0%{transform:rotate(-9deg)}25%{transform:rotate(7deg)}50%{transform:rotate(-4deg)}75%{transform:rotate(2deg)}to{transform:rotate(0)}}.tag-caption{text-align:center;font-size:13.5px;font-weight:600;margin:14px 0 20px}.tag-caption span{color:var(--slate);font-weight:400}.status-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px;margin-bottom:14px}.status-card .headline{font-weight:700;font-size:14.5px;display:flex;align-items:center;gap:8px}.status-card .headline .flame{color:var(--amber)}.status-card .sub{color:var(--slate);font-size:12.5px;margin-top:6px;line-height:1.6}.almost-alert{background:linear-gradient(160deg,var(--amber),#8F4108);border-radius:var(--radius-md);padding:26px 18px;text-align:center;color:#fff;box-shadow:0 14px 26px #b4530959;animation:pulseAlert 1.8s ease-in-out infinite}@keyframes pulseAlert{0%,to{box-shadow:0 14px 26px #b4530959}50%{box-shadow:0 18px 34px #b453098c}}.almost-alert .bell{font-size:34px;display:block;margin-bottom:8px}.almost-alert .headline{font-family:Mitr;font-size:20px;font-weight:600}.almost-alert .sub{font-size:13px;margin-top:8px;opacity:.95;line-height:1.6}.ghost-note{text-align:center;font-size:11.5px;color:var(--slate);margin-bottom:14px;opacity:.75}.buzz-note{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11.5px;color:var(--slate);margin-top:16px}.notice{text-align:center;padding:18px 6px}.notice .emoji{font-size:38px;display:block;margin-bottom:10px}.notice h2{font-size:18px;margin-bottom:8px}.notice p{color:var(--slate);font-size:13.5px;line-height:1.7}.notice .actions{margin-top:20px}.form-error{background:#fdecec;border:1px solid #F3C0C0;color:#8a2020;border-radius:var(--radius-sm);padding:10px 12px;font-size:12.5px;margin-bottom:14px;line-height:1.6}.skeleton{background:linear-gradient(90deg,var(--bg),#F5FAFF,var(--bg));background-size:200% 100%;animation:shimmer 1.2s linear infinite;border-radius:var(--radius-sm)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.page-wide{max-width:960px;margin:0 auto;padding:20px 16px calc(50px + env(safe-area-inset-bottom))}.dash-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.dash-topbar .brand{font-family:Mitr;font-weight:600;color:var(--blue);font-size:15px}.dash-topbar .who{font-size:12px;color:var(--slate)}.link-btn{background:none;border:none;color:var(--blue);font-weight:600;font-size:12.5px;cursor:pointer;text-decoration:underline;padding:4px}.link-btn:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.dash-wrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}.dash-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding:20px 24px;border-bottom:1px solid var(--line)}.dash-shop{display:flex;align-items:center;gap:10px}.dash-shop .mark{width:38px;height:38px;border-radius:10px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-family:Mitr;font-weight:700;flex:none}.dash-shop h3{font-size:16px}.dash-shop p{font-size:12px;color:var(--slate)}.toggle-row{display:flex;align-items:center;gap:10px}.toggle-label{font-size:13px;font-weight:600;color:var(--slate)}.switch{position:relative;width:46px;height:26px;flex:none}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;top:0;right:0;bottom:0;left:0;background:#c9d8e6;border-radius:999px;cursor:pointer;transition:.2s}.slider:before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px #0000004d}.switch input:checked+.slider{background:var(--teal)}.switch input:checked+.slider:before{transform:translate(20px)}.switch input:focus-visible+.slider{outline:2px solid var(--amber);outline-offset:2px}.dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.stat-cell{background:#fff;padding:16px 24px}.stat-cell .num{font-family:Mitr;font-size:24px;color:var(--blue)}.stat-cell .lbl{font-size:12px;color:var(--slate);margin-top:2px}.dash-actions{padding:18px 24px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--line)}.btn-call{background:var(--amber);color:#fff;border:none;border-radius:999px;padding:13px 24px;font-weight:700;font-size:14px;cursor:pointer;box-shadow:0 6px 14px #b453094d;transition:background .15s}.btn-call:hover:not(:disabled){background:#94420a}.btn-call:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.btn-call:disabled{background:#b9c6d2;box-shadow:none;cursor:not-allowed}.multi-badge{font-size:11.5px;background:var(--teal-wash);color:var(--teal);padding:5px 10px;border-radius:999px;font-weight:700}.queue-table{padding:6px 12px 18px;overflow-x:auto}.qrow-head,.qrow{display:grid;grid-template-columns:64px 1fr 78px 96px 1.4fr;gap:10px;align-items:center;padding:12px;font-size:13.5px}.qrow-head{color:var(--slate);font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.03em}.qrow{border-radius:var(--radius-sm);transition:background .3s}.qrow.serving{background:var(--amber-wash)}.qrow-num{font-family:Mitr;font-weight:700;color:var(--ink)}.qrow.serving .qrow-num{color:var(--amber)}.qrow-name{font-weight:600}.qrow-name .anon{color:var(--slate);font-weight:400}.qrow-people,.qrow-time{color:var(--slate)}.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:700}.badge.waiting{background:var(--bg);color:var(--slate)}.badge.serving{background:var(--amber);color:#fff}.badge.done{background:var(--teal-wash);color:var(--teal)}.badge.skipped,.badge.noshow{background:#eee;color:#767676}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.mini-btn{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;color:var(--blue);cursor:pointer}.mini-btn:hover:not(:disabled){background:var(--bg)}.mini-btn:focus-visible{outline:2px solid var(--amber);outline-offset:1px}.mini-btn:disabled{opacity:.5;cursor:not-allowed}.mini-btn.danger{color:#a03a34;border-color:#f0d6d4}.flash{animation:flashRow .6s ease}@keyframes flashRow{0%,to{filter:none}50%{filter:brightness(1.15)}}.dash-empty{text-align:center;color:var(--slate);font-size:13.5px;padding:26px 10px}.dash-settings{border-top:1px solid var(--line);padding:14px 24px;display:flex;flex-direction:column;gap:14px}.setting-row{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--slate);flex-wrap:wrap}.setting-row .grow{flex:1;min-width:180px}.minutes-input{width:74px;border:2px solid var(--line);border-radius:var(--radius-sm);padding:7px 10px;font-family:Sarabun;font-size:14px;color:var(--ink)}.minutes-input:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--amber)}.tv-link{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--blue);text-decoration:none;border:2px dashed #9fc6e6;border-radius:999px;padding:8px 14px}.tv-link:hover{background:var(--bg)}.tv-link:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:var(--ink);color:#fff;padding:11px 18px;border-radius:999px;font-size:13px;font-weight:600;box-shadow:var(--shadow);z-index:100;max-width:92vw;text-align:center}@media (max-width:760px){.qrow-head,.qrow{grid-template-columns:52px 1fr 56px}.qrow-head span:nth-child(4),.qrow-head span:nth-child(5),.qrow>.qrow-time,.qrow>.qrow-status{display:none}.qrow>.row-actions{display:flex;grid-column:1/-1;margin-top:8px}.qrow:not(.serving)>.qrow-status{display:block;grid-column:1/-1;margin-top:6px}.dash-stats{grid-template-columns:1fr 1fr}.stat-cell:nth-child(3){display:none}}.demo-wrap{max-width:820px}.demo-head{text-align:center;margin-bottom:20px}.demo-mark{border-radius:12px;margin-bottom:10px}.demo-head h1{font-size:26px;color:var(--blue)}.demo-lead{color:var(--slate);font-size:14.5px;margin-top:10px;line-height:1.8}.demo-card{padding:22px;margin-bottom:18px}.demo-h2{font-size:17px;margin-bottom:12px}.demo-roles{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}.demo-role{flex:1;min-width:180px;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-md);padding:14px;display:flex;flex-direction:column;gap:3px}.demo-role .ic{font-size:24px}.demo-role b{font-size:14.5px}.demo-role span:last-child{font-size:12.5px;color:var(--slate);line-height:1.6}.demo-cta{width:100%;font-size:16px;padding:16px}.demo-shopline{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--line)}.demo-shopname{font-family:Mitr;font-size:18px;font-weight:600}.demo-sub{font-size:12.5px;color:var(--slate);margin-top:2px}.demo-grid{display:flex;gap:22px;flex-wrap:wrap;align-items:flex-start}.demo-qr{flex:0 0 220px;text-align:center}.demo-qr .qr{width:200px;height:200px;display:block;margin:0 auto;border:1px solid var(--line);border-radius:12px}.demo-qrnote{font-size:12.5px;color:var(--slate);margin-top:10px;line-height:1.6}.demo-links{flex:1;min-width:250px;display:flex;flex-direction:column;gap:10px}.demo-btn{display:block;text-decoration:none;border:2px solid var(--line);border-radius:var(--radius-md);padding:13px 16px;font-weight:700;font-size:14.5px;color:var(--ink);background:#fff}.demo-btn span{display:block;font-weight:400;font-size:12px;color:var(--slate);margin-top:3px}.demo-btn:hover{border-color:#9fc6e6;background:var(--bg)}.demo-btn:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.demo-btn.primary{border-color:var(--amber);background:var(--amber-wash);color:var(--amber)}.demo-btn.primary span{color:#8a5a2b}.demo-btn.primary:hover{background:#fbe0bc}.demo-steps{margin:0;padding-left:22px;font-size:14px;line-height:1.9;color:var(--ink)}.demo-steps li{margin-bottom:8px}.demo-steps b{color:var(--blue-deep)}@media (max-width:640px){.demo-grid{flex-direction:column}.demo-qr{flex:1;width:100%}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0c1f3399;display:flex;align-items:flex-start;justify-content:center;padding:24px 14px;overflow-y:auto;z-index:200}.modal{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow);width:100%;max-width:520px;padding:20px}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.modal-head h2{font-size:17px}.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.modal-actions .btn-call{flex:1;min-width:150px}.poster{border:2px solid var(--ink);border-radius:var(--radius-md);padding:26px 22px;text-align:center;background:#fff}.poster .brand-mark{display:block;margin:0 auto 12px;border-radius:10px}.poster .shop{font-family:Mitr;font-size:20px;font-weight:600;color:var(--ink)}.poster .branch{font-size:13px;color:var(--slate);margin-top:2px}.poster .headline{font-family:Mitr;font-size:30px;font-weight:700;color:var(--blue);margin:14px 0 4px;line-height:1.2}.poster .sub{font-size:14px;color:var(--slate);margin-bottom:16px}.poster .qr{width:230px;height:230px;margin:0 auto;display:block}.poster .url{font-family:Sarabun;font-size:12px;color:var(--slate);word-break:break-all;margin-top:12px;padding:8px 10px;background:var(--bg);border-radius:var(--radius-sm)}.poster .steps{display:flex;gap:8px;justify-content:center;margin-top:16px;flex-wrap:wrap}.poster .step{flex:1;min-width:96px;background:var(--bg);border-radius:var(--radius-sm);padding:10px 8px}.poster .step .n{font-family:Mitr;font-weight:700;color:#fff;background:var(--blue);width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 6px;font-size:12px}.poster .step .t{font-size:11.5px;color:var(--ink);font-weight:600;line-height:1.5}.poster .brandline{margin-top:18px;padding-top:12px;border-top:1px dashed var(--line);font-size:11.5px;color:var(--slate)}.poster .brandline strong{color:var(--blue);font-weight:700}@media print{@page{size:A4 portrait;margin:14mm}body{background:#fff}.page-wide,.dash-topbar,.dash-wrap,.toast,.modal-head,.modal-actions{display:none!important}.modal-backdrop{position:static;background:none;padding:0;display:block;overflow:visible}.modal{max-width:none;box-shadow:none;padding:0;border-radius:0}.poster{border:none;padding:0}.poster .qr{width:300px;height:300px}.poster .headline{font-size:38px}}.tv-page{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 0%,#1c3a56 0%,var(--navy-dark) 45%,var(--navy-darker) 100%);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4vh 4vw;overflow:hidden}.tv-shop{position:absolute;top:3vh;left:3vw;font-size:clamp(13px,1.6vw,20px);font-weight:700;letter-spacing:.04em;color:#bee3f8;text-align:left}.tv-shop .dot{color:var(--amber-bright)}.tv-shop .branch{display:block;font-weight:400;font-size:.8em;color:#9fc6e6;margin-top:2px}.tv-eyebrow{font-size:clamp(14px,1.8vw,22px);color:#9fc6e6;font-weight:600;letter-spacing:.08em}.tv-number{font-family:Mitr;font-weight:700;font-size:clamp(72px,18vh,220px);color:var(--amber-bright);line-height:1;margin:1vh 0 .5vh;text-shadow:0 0 40px rgba(242,169,59,.45);animation:tvPulse 2.2s ease-in-out infinite}@keyframes tvPulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.tv-number.calling{animation:tvCall .7s ease 3}@keyframes tvCall{0%,to{transform:scale(1);filter:none}50%{transform:scale(1.1);filter:brightness(1.25)}}.tv-name{font-size:clamp(20px,3.4vh,40px);font-weight:600;color:#eaf6ff}.tv-people{font-size:clamp(12px,1.8vh,20px);color:#9fc6e6;margin-top:.5vh}.tv-next{display:flex;gap:1.4vw;margin-top:4vh;flex-wrap:wrap;justify-content:center}.tv-next-item{background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:1.2vh 2vw;min-width:88px}.tv-next-item .n{font-family:Mitr;font-size:clamp(20px,3.2vh,36px);color:#fff}.tv-next-item .l{font-size:clamp(10px,1.3vh,14px);color:#9fc6e6;margin-top:2px}.tv-footnote{margin-top:3vh;font-size:clamp(11px,1.4vh,15px);color:#6f93b3}.tv-idle{font-size:clamp(22px,4vh,46px);font-family:Mitr;color:#bee3f8}.tv-fs{position:absolute;top:3vh;right:3vw;background:transparent;border:2px solid var(--amber-bright);color:var(--amber-bright);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;cursor:pointer;opacity:.55}.tv-fs:hover{opacity:1;background:#f2a93b1f}.tv-fs:focus-visible{outline:2px solid #fff;outline-offset:2px;opacity:1}.tv-offline{position:absolute;bottom:3vh;left:50%;transform:translate(-50%);background:#b45309e6;color:#fff;border-radius:999px;padding:8px 18px;font-size:13px;font-weight:700}@media (prefers-reduced-motion:reduce){.tv-number,.tv-number.calling{animation:none}}@media (prefers-reduced-motion:reduce){.queue-tag,.almost-alert,.skeleton,.flash{animation:none}}