:root{--bg: #07090f;--panel: rgba(255, 255, 255, .05);--line: rgba(255, 255, 255, .14);--text: #e6ecf5;--muted: #8b98ac;--accent: #0DD4F2;--good: #4ade80;--font: Inter, system-ui, -apple-system, Segoe UI, sans-serif;--poster-w: clamp(190px, 21vw, 460px);--card-rail-w: clamp(64px, 11vh, 140px);--card-zone-w: clamp(44px, 6.5vh, 90px);--inspect-h: 84vh}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);user-select:none;-webkit-user-select:none;cursor:default;overscroll-behavior:none}#app{height:100vh;height:100dvh;display:flex;flex-direction:column;touch-action:none}.hdr{display:flex;align-items:center;gap:20px;padding:1.4vh 2vw;border-bottom:1px solid var(--line)}.l8{--l8-size: clamp(34px, 5.2vh, 64px);display:flex;align-items:center;flex:none}.l8__mark{height:var(--l8-size);width:auto;display:block}.l8__title,.l8__tag{font-family:Barlow,Arial Narrow,Arial,sans-serif;white-space:nowrap;color:var(--text)}.l8__title{padding-left:calc(var(--l8-size) * .2);font-weight:500;font-size:calc(var(--l8-size) * .44);line-height:1;letter-spacing:-.005em}.l8__tag{padding-left:calc(var(--l8-size) * .2);font-weight:400;font-size:max(10px,calc(var(--l8-size) * .2));line-height:1.2;margin-top:calc(var(--l8-size) * .05);letter-spacing:.01em;color:var(--muted)}.hdr__rule{width:1px;align-self:stretch;margin:.4vh 0;background:var(--line);flex:none}.hdr__title{font-size:clamp(16px,2.1vh,30px);font-weight:700;letter-spacing:.01em}.hdr__title span{color:var(--accent)}.hdr__sub{font-size:clamp(11px,1.4vh,17px);color:var(--muted);margin-top:2px}.hdr__spacer{flex:1}.pill{display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-size:clamp(11px,1.4vh,16px);color:var(--muted);white-space:nowrap}.pill__dot{width:9px;height:9px;border-radius:50%;background:#ef4444;transition:background .2s}.pill--live .pill__dot{background:var(--good);box-shadow:0 0 10px var(--good)}.pill--live{color:var(--text)}.pill--btn{font-family:var(--font);cursor:pointer;color:var(--accent);border-color:#0dd4f280;transition:background .15s}.pill--btn:hover{background:#0dd4f229}.pill[hidden]{display:none}.cam{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#000;line-height:0}.cam canvas{display:block;width:clamp(140px,13vh,240px);height:auto}.board{flex:1;display:flex;gap:2vw;padding:2vh 2vw;min-height:0}.poster{display:flex;flex-direction:column;gap:1vh;min-height:0;flex:0 0 var(--poster-w)}.poster img{flex:1;min-height:0;width:100%;object-fit:contain;object-position:top;border-radius:8px;box-shadow:0 14px 40px #0009}.poster__cap{font-size:clamp(10px,1.3vh,15px);color:var(--muted);text-align:center}.zones{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2vw;min-width:0}.zone{display:flex;flex-direction:column;align-items:center;gap:1vh;padding:1.2vh 1vh;border-radius:12px;border:2px dashed var(--line);background:var(--panel);transition:background .15s,border-color .15s,transform .15s}.zone--hot{background:#0dd4f229;border-color:var(--accent);border-style:solid;transform:scale(1.02)}.zone__hdr{width:100%;padding:.9vh 8px;border-radius:8px;text-align:center;font-size:clamp(11px,1.5vh,18px);font-weight:700;color:#fff;line-height:1.2}.zone__dots{display:grid;grid-template-columns:repeat(4,1.5vh);grid-template-rows:repeat(5,1.5vh);gap:.5vh;flex:0 0 auto}.zone__dot{border-radius:50%}.zone__dot--on{background:#fff}.zone__dot--off{border:1px dashed rgba(255,255,255,.22)}.zone__cards{display:flex;flex-wrap:wrap;gap:.8vh;justify-content:center;align-content:flex-start;flex:1}.card{position:relative;display:flex;flex-direction:column;align-items:center;gap:.5vh;padding:.7vh;border-radius:8px;background:#ffffff12;border:1px solid transparent;transition:transform .12s,border-color .12s,background .12s}.card img{width:var(--card-w);height:calc(var(--card-w) * 1.32);object-fit:cover;object-position:top;background:#fff;border-radius:4px}.card span{font-size:clamp(9px,1.25vh,14px);color:var(--text);text-align:center;max-width:var(--card-w);line-height:1.25}.card--hot{border-color:var(--accent);background:#0dd4f224;transform:scale(1.05)}.card--held{opacity:.25}.card--rail{--card-w: var(--card-rail-w)}.card--zone{--card-w: var(--card-zone-w)}.rail{display:flex;align-items:center;justify-content:center;gap:1.2vw;padding:1.4vh 2vw;border-top:1px solid var(--line);background:#0a0a0fb3;min-height:16vh;transition:background .15s}.rail--hot{background:#0dd4f21a}.rail__empty{color:var(--muted);font-size:clamp(12px,1.6vh,18px)}.cursor,.ghost{position:fixed;pointer-events:none}.ghost{z-index:9001}.cursor{z-index:9550;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;border:4px solid var(--accent);background:#0dd4f21a;box-shadow:0 0 22px #0dd4f280;transition:width .09s,height .09s,margin .09s,border-color .09s,background .09s}.cursor--pinch{width:30px;height:30px;margin:-15px 0 0 -15px;border-color:var(--good);background:#4ade8047;box-shadow:0 0 22px #4ade8099}.cursor--hidden{display:none}.cursor__fill{position:absolute;inset:4px;border-radius:50%;background:#0dd4f28c;transform:scale(0);transform-origin:center;transition:transform .06s linear}.cursor--pinch .cursor__fill{display:none}.inspect{position:fixed;inset:0;z-index:9200;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4vh;padding:3vh;background:#07090fd1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:inspectIn .14s ease-out}.inspect--gone{display:none}.inspect img{height:var(--inspect-h);max-width:88vw;width:auto;object-fit:contain;background:#fff;border-radius:6px;box-shadow:0 26px 70px #000000e6}.inspect__cap{font-size:clamp(13px,2vh,26px);font-weight:600;color:var(--text);text-shadow:0 2px 8px rgba(0,0,0,.9)}@keyframes inspectIn{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.ghost{transform:translate(-50%,-50%) rotate(-3deg) scale(1.12)}.ghost .card{background:#0dd4f233;box-shadow:0 18px 44px #000c}.veil{position:fixed;inset:0;z-index:9500;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.4vh;text-align:center;background:#07090fed;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:4vh}.veil--gone{display:none}.veil h1{font-size:clamp(26px,6vh,76px);margin:0;font-weight:800;letter-spacing:-.02em}.veil h1 span{color:var(--accent)}.veil p{font-size:clamp(14px,2.4vh,30px);color:var(--muted);margin:0;max-width:24ch;line-height:1.5}.veil__hand{font-size:clamp(50px,12vh,150px);animation:wave 1.6s ease-in-out infinite}@keyframes wave{0%,to{transform:rotate(-12deg)}50%{transform:rotate(14deg)}}.veil__pin{font-size:clamp(50px,14vh,170px);font-weight:800;letter-spacing:.18em;color:var(--good)}.veil__hint{font-size:clamp(11px,1.6vh,18px);color:var(--muted)}.tour{position:fixed;inset:0;z-index:9500;pointer-events:none}.tour--gone{display:none}.tour__spot{position:fixed;border-radius:14px;box-shadow:0 0 0 200vmax #07090fd6;outline:3px solid var(--accent);transition:left .45s ease,top .45s ease,width .45s ease,height .45s ease,box-shadow .4s ease,outline-color .3s}.tour__spot--none{outline-color:transparent}.tour--go .tour__spot{box-shadow:0 0 0 200vmax #07090f00}.tour__card{position:fixed;width:min(540px,calc(100vw - 32px));padding:2.4vh 2.6vh 2vh;border-radius:16px;background:#101826;border:1px solid rgba(13,212,242,.5);box-shadow:0 24px 60px #000000b3;pointer-events:auto;transition:left .45s ease,top .45s ease}.tour__step{font-size:clamp(11px,1.4vh,15px);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}.tour__text{font-size:clamp(16px,2.5vh,30px);line-height:1.4;margin-top:1vh}.tour__text b{color:#fff}.tour__status{margin-top:1.2vh;font-size:clamp(13px,1.9vh,22px);font-weight:600;color:var(--muted)}.tour__status:empty{display:none}.tour__status--ok{color:var(--good)}.tour__bar{margin-top:1.8vh;height:4px;border-radius:2px;background:var(--line);overflow:hidden}.tour__fill{height:100%;width:0;background:var(--accent)}.tour__actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:1.4vh}.tour__next{font-size:clamp(11px,1.5vh,16px);color:var(--muted)}.tour__btn{font-family:var(--font);font-size:clamp(13px,1.7vh,19px);color:var(--accent);background:transparent;border:1px solid rgba(13,212,242,.5);border-radius:999px;min-height:44px;padding:1vh 2.6vh;cursor:pointer;pointer-events:auto}.tour__btn:hover{background:#0dd4f229}.tour__ready,.tour__count,.tour__choose,.tour--choose .tour__card{display:none}.tour--choose .tour__choose{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4vh;text-align:center;padding:4vh}.tour__options{display:flex;gap:3vw;flex-wrap:wrap;justify-content:center}.tour__option{display:flex;flex-direction:column;align-items:center;gap:1.2vh;width:clamp(220px,26vw,420px);padding:4vh 2vw;font-family:var(--font);color:var(--text);cursor:pointer;pointer-events:auto;background:#101826;border:2px solid rgba(13,212,242,.5);border-radius:20px;box-shadow:0 24px 60px #0009;transition:background .15s,border-color .15s,transform .15s}.tour__option:hover,.tour__option--hot{background:#0dd4f229;border-color:var(--accent);transform:scale(1.03)}.tour__icon{font-size:clamp(44px,9vh,110px);line-height:1}.tour__option b{font-size:clamp(20px,3.4vh,42px)}.tour__option small{font-size:clamp(12px,1.8vh,20px);color:var(--muted)}.tour--steps .tour__card{display:block}.tour--ready .tour__card,.tour--count .tour__card{display:none}.tour--ready .tour__ready{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.4vh;text-align:center;padding:4vh}.tour__title{font-size:clamp(30px,7vh,90px);font-weight:800;letter-spacing:-.02em}.tour__ready p{font-size:clamp(14px,2.4vh,30px);color:var(--muted);margin:0}.tour__start{font-family:var(--font);font-size:clamp(22px,4.5vh,56px);font-weight:800;color:#04111a;background:var(--accent);border:0;border-radius:999px;padding:2.2vh 9vh;cursor:pointer;pointer-events:auto;box-shadow:0 0 40px #0dd4f28c;animation:startPulse 1.6s ease-in-out infinite}@keyframes startPulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.tour__hint{font-size:clamp(12px,1.8vh,20px);color:var(--muted)}.tour--count .tour__count{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(80px,30vh,360px);font-weight:800;color:var(--accent);text-shadow:0 0 60px rgba(13,212,242,.6)}.tour__count--pop{animation:countPop .9s ease-out both}@keyframes countPop{0%{transform:scale(1.6);opacity:0}25%{transform:scale(1);opacity:1}to{transform:scale(.92);opacity:.85}}.pill--timing{color:var(--text);border-color:var(--accent);font-weight:700;font-variant-numeric:tabular-nums}.pill--go{animation:timerGo 1.4s ease-out}@keyframes timerGo{0%{transform:scale(1);box-shadow:0 0 #0dd4f2b3}30%{transform:scale(1.35)}to{transform:scale(1);box-shadow:0 0 0 22px #0dd4f200}}.veil__build{position:absolute;bottom:2vh;right:2vw;font-size:clamp(10px,1.2vh,13px);color:var(--muted);opacity:.6}.veil--congrats{background:radial-gradient(ellipse at 75% 65%,rgba(0,194,243,.45) 0%,transparent 50%),radial-gradient(ellipse at 20% 30%,rgba(43,0,250,.4) 0%,transparent 50%),radial-gradient(ellipse at 50% 90%,rgba(13,121,242,.35) 0%,transparent 50%),linear-gradient(135deg,#420df2,#2b00fa 30%,#0d79f2,#00c2f3);-webkit-backdrop-filter:none;backdrop-filter:none;overflow:hidden}.congrats__text{position:relative;z-index:5;text-align:center;opacity:0;transition:opacity 1.5s ease}.congrats__title{font-size:clamp(3rem,8vw,6rem);font-weight:800;color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.3);margin-bottom:16px}.congrats__sub{font-size:clamp(1.2rem,3vw,2rem);font-weight:300;color:#ffffffe6;text-shadow:0 2px 10px rgba(0,0,0,.2)}.congrats__pinlabel{margin-top:4vh;font-size:clamp(.8rem,1.6vh,1.1rem);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#ffffffb3}.congrats__pin{font-size:clamp(3rem,11vh,8rem);font-weight:800;letter-spacing:.18em;color:#fff;text-shadow:0 4px 24px rgba(0,0,0,.35)}.congrats__time{margin-top:2vh;font-size:clamp(.9rem,2vh,1.4rem);font-weight:300;color:#ffffffd9}.congrats__reset{position:absolute;bottom:4vh;left:50%;transform:translate(-50%);z-index:15;padding:10px 26px;border-radius:999px;cursor:pointer;border:1px solid rgba(255,255,255,.35);background:#ffffff1a;font-size:clamp(.9rem,1.8vh,1.2rem);color:#ffffffd9;transition:background .2s,color .2s}.congrats__reset:hover{background:#ffffff38;color:#fff}.hud{position:fixed;left:12px;bottom:12px;z-index:9600;display:none;padding:10px 14px;border-radius:8px;background:#000000d1;border:1px solid var(--line);font:12px/1.6 ui-monospace,monospace;color:var(--good);white-space:pre}.hud--on{display:block}@font-face{font-family:Barlow;font-style:normal;font-display:swap;font-weight:400;src:url(/demo/assets/barlow-vietnamese-400-normal-Dpl4UHAZ.woff2) format("woff2"),url(/demo/assets/barlow-vietnamese-400-normal-BFeobeCK.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Barlow;font-style:normal;font-display:swap;font-weight:400;src:url(/demo/assets/barlow-latin-ext-400-normal-HxX4XjxC.woff2) format("woff2"),url(/demo/assets/barlow-latin-ext-400-normal-CvBsJvxq.woff) format("woff");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:Barlow;font-style:normal;font-display:swap;font-weight:400;src:url(/demo/assets/barlow-latin-400-normal-qiz4-Cze.woff2) format("woff2"),url(/demo/assets/barlow-latin-400-normal-fsAxiSwU.woff) format("woff");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}@font-face{font-family:Barlow;font-style:normal;font-display:swap;font-weight:500;src:url(/demo/assets/barlow-vietnamese-500-normal-zTViEIzf.woff2) format("woff2"),url(/demo/assets/barlow-vietnamese-500-normal-GNfB7rCE.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Barlow;font-style:normal;font-display:swap;font-weight:500;src:url(/demo/assets/barlow-latin-ext-500-normal-DOaysfXq.woff2) format("woff2"),url(/demo/assets/barlow-latin-ext-500-normal-CJPcKP2Q.woff) format("woff");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:Barlow;font-style:normal;font-display:swap;font-weight:500;src:url(/demo/assets/barlow-latin-500-normal-BPAOfeC8.woff2) format("woff2"),url(/demo/assets/barlow-latin-500-normal-C1h8hMer.woff) format("woff");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}