:root{--bg: #0b1020;--bg-2: #121a33;--panel: #161f3d;--line: #26325c;--text: #e8ecf8;--muted: #8f9bc2;--gold: #fbbf24;--gold-2: #f59e0b;--green: #22c55e;--blue: #3b82f6;--red: #ef4444;--radius: 16px;font-family:Sarabun,Kanit,system-ui,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{background:var(--bg);-webkit-font-smoothing:antialiased}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.display{height:100vh;height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 40%,#1b2650 0%,var(--bg) 70%);overflow:hidden;-webkit-user-select:none;user-select:none;font-family:Kanit,Sarabun,sans-serif}.display-main{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2vh 3vw}.display-label{margin:0 0 1vh;font-weight:500;letter-spacing:.04em;font-size:clamp(1.6rem,min(6vh,4.5vw),4.5rem);color:#cbd5f5}.display-numbers{display:flex;align-items:center;justify-content:center;gap:.18em;font-weight:700;line-height:.95;font-size:min(72vh,calc(92vw / (.6 * var(--digits, 3) + .76)));font-variant-numeric:tabular-nums;color:var(--gold);text-shadow:0 0 .12em rgba(251,191,36,.35),0 .04em 0 #b45309}.display-numbers .dash{color:#fde68a;opacity:.8;font-weight:500}.display-waiting{font-size:clamp(2.5rem,min(12vh,7vw),9rem);font-weight:600;color:var(--text)}.pop{animation:pop .7s cubic-bezier(.2,1.4,.4,1),glow 2.4s ease-out}@keyframes pop{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes glow{0%,30%,60%{filter:brightness(1.5)}15%,45%,to{filter:brightness(1)}}.display-footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:1.4vh 2.5vw;border-top:1px solid var(--line);background:#080c1a99;font-size:clamp(.9rem,2.2vh,1.6rem);color:var(--muted)}.display-footer .status{justify-self:end;display:flex;align-items:center;gap:.8rem}.display-footer .prev{color:#aab4d6}.dot{display:inline-block;width:.6em;height:.6em;border-radius:50%;background:var(--red);vertical-align:middle}.dot.on{background:var(--green);box-shadow:0 0 .5em var(--green)}.icon-btn{background:none;border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:.1em .45em}.sound-gate{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:min(90vw,520px);height:fit-content;display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:2rem;border-radius:var(--radius);border:1px solid var(--line);background:#121a33f0;color:var(--text);font-size:1.4rem;box-shadow:0 20px 60px #00000080}.sound-gate-icon{font-size:3rem}.sound-gate small{color:var(--muted);font-size:.95rem}.voice-warn{position:fixed;top:1rem;left:50%;transform:translate(-50%);background:#422006;color:#fde68a;padding:.5rem 1rem;border-radius:10px;font-size:.95rem}.admin,.admin-login{min-height:100vh;background:var(--bg)}.admin{max-width:760px;margin:0 auto;padding:1.5rem 16px 3rem}.admin h1{font-family:Kanit,sans-serif;font-weight:600;font-size:1.5rem;margin:0}.admin h2{font-family:Kanit,sans-serif;font-weight:500;font-size:1.1rem;margin:0 0 .8rem}.muted{color:var(--muted)}.small{font-size:.9rem}.center{text-align:center}.error{color:#fca5a5;margin:0}.link{color:var(--muted);text-align:center;font-size:.95rem}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem}.admin-login{display:grid;place-items:center;padding:16px}.login-card{width:min(100%,380px);display:flex;flex-direction:column;gap:1rem;text-align:center}.login-card h1{font-family:Kanit,sans-serif;margin:0}.login-card p{margin:0}.pin-input{font:inherit;font-size:2rem;text-align:center;letter-spacing:.4em;padding:.6rem;border-radius:12px;border:1px solid var(--line);background:var(--bg-2);color:var(--text);outline:none}.pin-input:focus{border-color:var(--gold)}.admin-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap;margin-bottom:1.25rem}.admin-header p{margin:.3rem 0 0}.header-actions{display:flex;gap:.5rem;flex-wrap:wrap}.btn{border:1px solid transparent;border-radius:12px;padding:.7rem 1.1rem;color:var(--text);background:var(--bg-2);text-decoration:none;font-weight:500;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .08s,filter .15s}.btn:not(:disabled):active{transform:scale(.97)}.btn:not(:disabled):hover{filter:brightness(1.12)}.btn-block{width:100%}.btn-primary{background:var(--gold);color:#1a1300;font-weight:600}.btn-ghost{border-color:var(--line);background:transparent;font-size:.95rem;padding:.5rem .9rem}.btn-outline{border-color:var(--line);background:transparent}.btn-outline.danger{color:#fca5a5}.btn-danger{background:var(--red);color:#fff}.preview{text-align:center;margin-bottom:1rem}.preview-label{margin:0;color:var(--muted)}.preview-now{margin:.2rem 0 0;font-family:Kanit,sans-serif;font-weight:700;font-size:clamp(3rem,12vw,5.5rem);color:var(--gold);line-height:1.1;font-variant-numeric:tabular-nums}.preview-now small{font-size:.3em;font-weight:500;color:#cbd5f5;vertical-align:middle}.preview-now.idle{font-size:2rem;color:var(--muted);font-weight:500}.controls{display:grid;grid-template-columns:1fr 2fr;gap:.8rem;margin-bottom:.8rem}.controls.secondary{grid-template-columns:1fr 1fr}.btn-next,.btn-prev{min-height:140px;border-radius:var(--radius)}.btn-next{background:linear-gradient(160deg,var(--green),#15803d);color:#fff}.btn-prev{background:var(--bg-2);border-color:var(--line)}.btn-title{font-family:Kanit,sans-serif;font-size:1.7rem;font-weight:600}.btn-next .btn-title{font-size:2.2rem}.btn-sub{font-size:1.05rem;opacity:.9;margin-top:.2rem}.controls.secondary .btn{min-height:56px}.notice{background:#3b2a06;color:#fde68a;padding:.7rem 1rem;border-radius:10px;margin:.5rem 0}.history{margin-top:1.5rem}.history ul{list-style:none;margin:0;padding:0;max-height:340px;overflow:auto}.history li{display:grid;grid-template-columns:7rem 6rem 1fr;gap:.5rem;padding:.45rem 0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}.history li:last-child{border-bottom:0}.h-time{color:var(--muted)}.h-act{font-weight:500}.a-next{color:#86efac}.a-prev{color:#93c5fd}.a-reset{color:#fca5a5}.a-announce{color:#fde68a}@media (max-width: 520px){.controls{grid-template-columns:1fr}.controls .btn-next{order:-1}.btn-next,.btn-prev{min-height:110px}.history li{grid-template-columns:6rem 5rem 1fr;font-size:.95rem}.display-footer{grid-template-columns:1fr auto}.display-footer .clock{display:none}}