:root{--bg:#07080c;--panel:#0e1118d1;--line:#ffffff1a;--text:#e8ecf4;--muted:#93a0b4;--accent:#22d3ee;--accent-ink:#052b32;--warn:#fbbf24;--radius:14px;--safe-b:env(safe-area-inset-bottom,0px);--dock-h:92px}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-text-size-adjust:100%;overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;margin:0;font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#css3d,#gl{position:fixed;inset:0}#css3d{z-index:0}#gl{z-index:1}#gl canvas{display:block}#css3d iframe{pointer-events:none;border:0}#hud{z-index:2;pointer-events:none;position:fixed;inset:0}#hud>*{pointer-events:auto}.topbar{background:linear-gradient(#07080cd9,#07080c00);align-items:center;gap:12px;padding:12px 14px;display:flex;position:absolute;top:0;left:0;right:0}.brand{letter-spacing:.2px;font-size:17px;font-weight:700}.brand span{color:var(--accent)}.room-tag{color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:12px}.room-tag.offline{color:var(--warn);border-color:#fbbf2459}.topbar .spacer{flex:1}.dock{padding:10px 12px calc(10px + var(--safe-b));background:linear-gradient(#07080c00,#07080ce6);align-items:center;gap:8px;display:flex;position:absolute;bottom:0;left:0;right:0}.dock .grow{flex:1;min-width:0}input[type=text],input[type=url]{width:100%;color:var(--text);border:1px solid var(--line);border-radius:var(--radius);font:inherit;background:#ffffff0f;outline:none;padding:11px 13px}input:focus{border-color:#22d3ee8c}input::placeholder{color:var(--muted)}button{font:inherit;color:var(--text);border:1px solid var(--line);border-radius:var(--radius);cursor:pointer;white-space:nowrap;background:#ffffff12;padding:11px 15px;font-weight:600}button:hover{background:#ffffff1f}button:active{transform:translateY(1px)}button.primary{background:var(--accent);color:var(--accent-ink);border-color:#0000}button.primary:hover{filter:brightness(1.08)}button.icon{padding:11px 13px}button:disabled{opacity:.45;cursor:default}.chat{right:12px;bottom:calc(var(--dock-h) + 14px + var(--safe-b));pointer-events:none;flex-direction:column;gap:6px;width:min(320px,46vw);max-height:44vh;display:flex;position:absolute}.chat-log{flex-direction:column;justify-content:flex-end;gap:5px;display:flex;overflow:hidden}.chat-line{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;padding:6px 10px;font-size:13px;animation:.22s ease-out rise}.chat-line b{color:var(--accent);font-weight:600}.chat-line.sys{color:var(--muted);font-style:italic}@keyframes rise{0%{opacity:0;transform:translateY(6px)}}.stick{left:18px;bottom:calc(var(--dock-h) + 14px + var(--safe-b));border:1px solid var(--line);background:#ffffff0a;border-radius:50%;width:118px;height:118px;display:none;position:absolute}.stick.on{display:block}.stick .knob{background:#22d3ee47;border:1px solid #22d3ee99;border-radius:50%;width:46px;height:46px;margin:-23px 0 0 -23px;position:absolute;top:50%;left:50%}.gate{z-index:3;background:radial-gradient(90% 70% at 50% 40%,#0d1620 0%,#05060a 75%);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.gate-card{text-align:center;width:min(380px,100%)}.gate h1{letter-spacing:-.5px;margin:0 0 6px;font-size:34px}.gate h1 span{color:var(--accent)}.gate p{color:var(--muted);margin:0 0 22px;font-size:14px}.gate .field{text-align:left;margin-bottom:10px}.gate label{color:var(--muted);margin:0 0 5px 3px;font-size:12px;display:block}.gate button.primary{width:100%;padding:13px;font-size:16px}.gate .hint{color:var(--muted);margin-top:14px;font-size:12px;line-height:1.5}.hidden{display:none!important}.nameplate{border:1px solid var(--line);white-space:nowrap;pointer-events:none;background:#07080cb3;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:600}@media (max-width:560px){.chat{width:54vw;max-height:32vh;bottom:70px}.gate h1{font-size:28px}}.now-playing{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin:0 0 5px 4px;font-size:12px;overflow:hidden}.queue{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:16px;flex-direction:column;gap:8px;width:min(340px,86vw);max-height:min(62vh,520px);padding:12px;display:none;position:absolute;top:58px;left:12px}.queue.open{display:flex}.queue-head{justify-content:space-between;align-items:center;display:flex}.queue-note{color:var(--muted);font-size:11.5px;line-height:1.4}.queue-list{flex-direction:column;gap:6px;display:flex;overflow-y:auto}.queue-empty{color:var(--muted);margin:6px 2px;font-size:13px;line-height:1.5}.queue-row{background:#ffffff0a;border:1px solid #0000;border-radius:11px;align-items:center;gap:9px;padding:8px 9px;display:flex}.queue-row:hover{border-color:var(--line)}.queue-ord{text-align:center;width:20px;color:var(--muted);flex:none;font-size:12px;font-weight:700}.queue-meta{flex:1;min-width:0}.queue-title{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:13.5px;font-weight:600;overflow:hidden}.queue-by{color:var(--muted);font-size:11.5px}button.vote{flex-direction:column;flex:none;align-items:center;gap:1px;padding:5px 9px;font-size:12px;font-weight:700;line-height:1.1;display:flex}button.vote span{opacity:.8;font-size:10px}button.vote.on{color:var(--accent);background:#22d3ee21;border-color:#22d3ee80}button.ghost{color:var(--muted);background:0 0;border-color:#0000}button.ghost:hover{color:var(--text);background:#ffffff14}button.skip{width:100%;font-size:13px}.chatbar{left:12px;right:12px;bottom:calc(var(--dock-h) + 10px + var(--safe-b));max-width:340px;position:absolute}.chatbar input{background:var(--panel);padding:9px 12px;font-size:13.5px}#toast{text-align:center;color:#fde68a;opacity:0;pointer-events:none;background:#201408f0;border:1px solid #fbbf2466;border-radius:12px;max-width:min(420px,90vw);padding:10px 15px;font-size:13.5px;transition:opacity .2s,transform .2s;position:absolute;top:64px;left:50%;transform:translate(-50%,-12px)}#toast.show{opacity:1;transform:translate(-50%)}@media (max-width:720px){.queue{width:auto;max-height:56vh;left:8px;right:8px}.chat{width:auto;left:8px;right:8px;bottom:calc(var(--dock-h) + 112px + var(--safe-b));max-height:24vh}.chatbar{max-width:none;right:12px}.topbar{gap:8px;padding:10px}.brand{font-size:15px}.topbar button{padding:9px 11px;font-size:13px}#viewer-tag{display:none}}@media (max-height:460px){.chat{display:none}.chatbar{bottom:calc(72px + var(--safe-b));max-width:260px;right:auto}.queue{max-height:70vh;top:50px}.stick{width:92px;height:92px;bottom:calc(76px + var(--safe-b))}.stick .knob{width:38px;height:38px;margin:-19px 0 0 -19px}}body.touch .chatbar{left:152px}body.touch .chat{bottom:calc(var(--dock-h) + 64px + var(--safe-b))}@media (max-height:460px){body.touch .chatbar{left:124px}}button.room-tag.invite{color:var(--muted);border:1px solid var(--line);background:0 0;border-radius:999px;align-items:center;gap:6px;padding:4px 11px;font-size:12px;font-weight:500;display:inline-flex}button.room-tag.invite:hover{color:var(--text);border-color:#22d3ee73}button.room-tag.invite .invite-icon{color:var(--accent);font-size:11px}button.room-tag.invite.mute-invite .invite-icon{display:none}button.room-tag.offline{color:var(--warn);border-color:#fbbf2459}.reactions{right:12px;bottom:calc(var(--dock-h) + 58px + var(--safe-b));flex-direction:column;gap:6px;display:flex;position:absolute}button.react{background:var(--panel);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;width:44px;height:44px;padding:0;font-size:21px;line-height:1}button.react:hover{background:#ffffff24}.colors{flex-wrap:wrap;gap:8px;display:flex}button.swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:32px;height:32px;padding:0}button.swatch:hover{transform:scale(1.1)}button.swatch.on{border-color:var(--text);box-shadow:0 0 0 2px var(--bg), 0 0 0 4px currentColor}@media (max-width:720px){button.react{width:38px;height:38px;font-size:18px}}@media (max-height:460px){.reactions{right:12px;bottom:calc(var(--dock-h) + 8px + var(--safe-b));flex-direction:row}}.look{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:16px;flex-direction:column;gap:8px;width:min(290px,86vw);max-height:min(70vh,560px);padding:12px;display:none;position:absolute;top:58px;left:12px;overflow-y:auto}.look.open{display:flex}.look-head{justify-content:space-between;align-items:center;display:flex}.look-head strong{font-size:13px}.pick-list{flex-direction:column;gap:5px;display:flex}button.pick{text-align:left;background:#ffffff0a;border:1px solid #0000;border-radius:11px;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:8px 10px;display:flex}button.pick:hover{border-color:var(--line)}button.pick.on{background:#22d3ee1f;border-color:#22d3ee80}button.pick.on .pick-ten{color:var(--accent)}.pick-ten{font-size:13.5px;font-weight:600}.pick-mota{color:var(--muted);font-size:11.5px;font-weight:400}@media (max-width:720px){.look{width:auto;max-height:56vh;left:8px;right:8px}}.now-row{align-items:baseline;gap:10px;margin:0 0 4px 4px;display:flex}.now-row .now-playing{flex:1;min-width:0;margin:0}.now-time{color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.2px;flex:none;font-size:11.5px}.bar{background:#ffffff17;border-radius:999px;height:3px;margin:0 4px 7px;overflow:hidden}.bar-fill{background:linear-gradient(90deg, var(--accent), #7dd3fc);border-radius:999px;width:0;height:100%;transition:width .5s linear}a.tai-app{color:var(--accent);border:1px solid #22d3ee59;border-radius:999px;margin-top:16px;padding:9px 16px;font-size:13px;font-weight:600;text-decoration:none;display:inline-block}a.tai-app:hover{background:#22d3ee1a}a.tai-app span{color:var(--muted);font-weight:400}button.skip.on{color:var(--accent);background:#22d3ee21;border-color:#22d3ee80}.seatmap{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:16px;flex-direction:column;gap:10px;width:min(360px,92vw);max-height:min(72vh,580px);padding:12px;display:none;position:absolute;top:58px;left:12px;overflow:auto}.seatmap.open{display:flex}.seat-count{color:var(--muted);margin-left:auto;margin-right:8px;font-size:11.5px}.screen-hint{text-align:center;letter-spacing:3px;color:var(--accent-ink);background:linear-gradient(90deg, transparent, var(--accent), transparent);border-radius:4px;padding:3px 0;font-size:10.5px;font-weight:700}.seat-grid{flex-direction:column;gap:4px;display:flex}.seat-row{align-items:center;gap:3px;display:flex}.seat-rowlabel{width:14px;color:var(--muted);text-align:center;flex:none;font-size:10.5px;font-weight:700}.seat-aisle{flex:none;width:10px}button.seat-cell{min-width:0;height:22px;color:var(--muted);background:#ffffff0f;border:1px solid #0000;border-radius:5px;flex:1;padding:0;font-size:9.5px;font-weight:600;line-height:22px}button.seat-cell:hover{color:var(--text);background:#ffffff29}button.seat-cell.taken{color:#fca5a5;cursor:not-allowed;background:#ef444438;border-color:#ef444466}button.seat-cell.mine{background:var(--accent);color:var(--accent-ink);border-color:#0000}.seat-legend{color:var(--muted);flex-wrap:wrap;gap:12px;font-size:11px;display:flex}.seat-legend span{align-items:center;gap:5px;display:inline-flex}.seat-legend i.sw{border-radius:3px;width:11px;height:11px;display:inline-block}.sw.free{background:#ffffff24}.sw.taken{background:#ef444473}.sw.mine{background:var(--accent)}@media (max-width:720px){.seatmap{width:auto;max-height:62vh;left:8px;right:8px}}.brand{white-space:nowrap}.topbar button i.ic{font-size:16px;font-style:normal;line-height:1;display:none}@media (max-width:720px){.topbar{gap:6px}.topbar button .lbl{display:none}.topbar button i.ic{display:inline-block}.topbar button{padding:9px 12px}#room-tag{text-overflow:ellipsis;max-width:92px;overflow:hidden}.chat{right:60px}body.touch .chat{left:150px}}@media (max-width:420px){#room-tag{max-width:62px}.topbar{padding:10px 8px}}.rotate{z-index:4;text-align:center;background:radial-gradient(85% 70% at 50% 45%,#0d1620 0%,#05060a 78%);place-items:center;padding:28px;display:none;position:absolute;inset:0}.rotate.on{display:grid}.rotate-card{max-width:320px}.rotate h2{margin:22px 0 8px;font-size:21px}.rotate p{color:var(--muted);margin:0 0 22px;font-size:14px;line-height:1.55}.rotate-phone{border:2.5px solid var(--accent);border-radius:11px;place-items:center;width:62px;height:104px;margin:0 auto;animation:2.1s ease-in-out infinite nghieng;display:grid}.rotate-arrow{color:var(--accent);font-size:25px}@keyframes nghieng{0%,42%{transform:rotate(0)}62%,88%{transform:rotate(-90deg)}to{transform:rotate(0)}}body.tap-trung .reactions,body.tap-trung .stick,body.tap-trung .dock{display:none}body.tap-trung .chat{bottom:16px}body.tap-trung .chatbar{bottom:calc(16px + var(--safe-b))}.nowbox{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:14px;width:min(300px,62vw);padding:10px 12px 11px;position:absolute;top:54px;left:12px}.nowbox-slogan{letter-spacing:1.6px;text-transform:uppercase;color:var(--accent);opacity:.85;margin-bottom:5px;font-size:10.5px}.nowbox-title{-webkit-line-clamp:2;overflow-wrap:anywhere;word-break:break-word;-webkit-box-orient:vertical;font-size:13.5px;font-weight:600;line-height:1.35;display:-webkit-box;overflow:hidden}.nowbox-meta{color:var(--muted);align-items:baseline;gap:8px;margin-top:4px;font-size:11.5px;display:flex}.nowbox-meta>span:first-child{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.nowbox{max-height:132px;overflow:hidden}.nowbox-left{font-variant-numeric:tabular-nums;color:var(--accent);flex:none;font-weight:600}.nowbox .bar{margin:8px 0 0}.brand em.ver{color:var(--muted);letter-spacing:.3px;margin-left:5px;font-size:10px;font-style:normal;font-weight:500}.seatmap,.look{top:150px}body.tap-trung .nowbox{display:none}@media (max-width:720px){.nowbox{width:min(230px,56vw);padding:8px 10px 9px;top:50px}.nowbox-slogan{display:none}.nowbox-title{-webkit-line-clamp:1;font-size:12.5px}.seatmap,.look{top:124px}}@media (max-height:460px){.seatmap,.look{max-height:calc(100vh - 134px);top:118px}}.dongtac{left:12px;bottom:calc(var(--dock-h) + 58px + var(--safe-b));gap:6px;display:flex;position:absolute}.dongtac button{background:var(--panel);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:50%;width:42px;height:42px;padding:0;font-size:19px;line-height:1}.dongtac button:hover{background:#ffffff24}body.touch .dongtac{bottom:calc(var(--dock-h) + 150px + var(--safe-b))}body.tap-trung .dongtac{display:none}@media (max-width:720px){.dongtac button{width:36px;height:36px;font-size:16px}}label.gat{color:var(--text);cursor:pointer;align-items:center;gap:8px;padding:6px 2px;font-size:12.5px;display:flex}label.gat input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent)}label.gat.vol{gap:10px}label.gat.vol span{color:var(--muted);flex:none}label.gat.vol input[type=range]{accent-color:var(--accent);flex:1;min-width:0}label.gat.vol em{text-align:right;width:26px;color:var(--muted);font-variant-numeric:tabular-nums;flex:none;font-style:normal}#dongtac button.on{background:var(--accent)}