@font-face{font-family:Cinzel;src:url(/fonts/cinzel-var.woff2) format("woff2-variations");font-weight:400 900;font-style:normal;font-display:swap}@font-face{font-family:Alegreya;src:url(/fonts/alegreya-var.woff2) format("woff2-variations");font-weight:400 900;font-style:normal;font-display:swap}@font-face{font-family:Alegreya;src:url(/fonts/alegreya-var-italic.woff2) format("woff2-variations");font-weight:400 900;font-style:italic;font-display:swap}@font-face{font-family:Cutive Mono;src:url(/fonts/cutive-mono.woff2) format("woff2");font-weight:400;font-display:swap}:root{--bg: #0c0805;--panel: rgba(34, 24, 16, .74);--panel-border: rgba(255, 226, 184, .11);--text: #f4e9d8;--text-dim: rgba(244, 233, 216, .56);--accent: #e0a94e;--accent-2: #c25a2a;--accent-3: #7d9b7a;--radius: 16px;--font: "Alegreya", Georgia, "Times New Roman", serif;--font-display: "Cinzel", "Alegreya", Georgia, serif;--font-mono: "Cutive Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--cut: 12px;--cut-sm: 7px;--edge: rgba(224, 169, 78, .36);--edge-soft: rgba(255, 232, 196, .16)}.hx{position:relative;isolation:isolate;--shape: polygon( var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut) );clip-path:var(--shape);background:none;border:none;border-radius:0}.hx:before,.hx:after{content:"";position:absolute;clip-path:var(--shape);pointer-events:none}.hx:before{inset:0;background:var(--edge-soft);z-index:-2;transition:background .16s ease}.hx:after{inset:1px;background:var(--fill, linear-gradient(180deg, rgba(52, 36, 22, .78), rgba(18, 12, 7, .9)));z-index:-1}.hx-sm{--cut: var(--cut-sm)}.hx-frame:after{background-image:linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),var(--fill, linear-gradient(180deg, rgba(52, 36, 22, .78), rgba(18, 12, 7, .9)));background-repeat:no-repeat;background-position:right 0 top 0,right 0 top 0,left 0 bottom 0,left 0 bottom 0,0 0;background-size:22px 2px,2px 22px,22px 2px,2px 22px,auto}.hx-live:before{background:var(--edge)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased}body{font-size:17px;line-height:1.35}.num,.leaderboard .pts,.people-list .score,.seek .times,.playlist .dur,.combo,#room-code{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}h1,h2,h3,.btn,.ctl-btn,.seg-btn,.tab,.door-txt b{font-family:var(--font-display)}#app{height:100dvh;position:relative}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}input{font-family:inherit}.landing{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(60% 50% at 20% 15%,rgba(194,90,42,.22),transparent 60%),radial-gradient(50% 45% at 85% 80%,rgba(255,47,185,.16),transparent 60%),radial-gradient(45% 40% at 70% 20%,rgba(224,169,78,.1),transparent 55%),var(--bg);overflow-y:auto;padding:24px}.landing-card{width:min(430px,100%);display:flex;flex-direction:column;gap:22px;animation:rise .5s cubic-bezier(.2,.9,.3,1)}@keyframes rise{0%{opacity:0;transform:translateY(18px)}}.logo{font-size:clamp(2.6rem,7vw,3.4rem);font-weight:800;letter-spacing:-.03em;line-height:1;text-align:center}.logo .ball{display:inline-block;animation:spin 6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.logo-gradient{background:linear-gradient(92deg,var(--accent),var(--accent-3) 55%,var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{text-align:center;color:var(--text-dim);font-size:1.02rem;line-height:1.5}.glass{position:relative;isolation:isolate;--shape: polygon( var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut) );clip-path:var(--shape);border:none;border-radius:0;background:none;backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px) saturate(1.35)}.glass:before,.glass:after{content:"";position:absolute;clip-path:var(--shape);pointer-events:none}.glass:before{inset:0;background:var(--edge-soft);z-index:-2;transition:background .16s ease}.glass:after{inset:1px;background:var(--fill, linear-gradient(180deg, rgba(55, 38, 23, .76), rgba(18, 12, 7, .9)));z-index:-1}.glass{filter:drop-shadow(0 10px 26px rgba(0,0,0,.5))}.landing-form{padding:26px;display:flex;flex-direction:column;gap:16px}.field label{display:block;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:7px}.field input{width:100%;padding:13px 15px;border-radius:0;clip-path:polygon(var(--cut-sm) 0,100% 0,100% calc(100% - var(--cut-sm)),calc(100% - var(--cut-sm)) 100%,0 100%,0 var(--cut-sm));border:1px solid var(--panel-border);background:#00000059;color:var(--text);font-size:1rem;outline:none;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #e0a94e26}.field input.code{text-transform:uppercase;letter-spacing:.35em;font-weight:700;text-align:center}.char-stage{position:relative;width:100%;height:340px;margin:4px 0 10px;border-radius:16px;background:radial-gradient(ellipse 60% 42% at 50% 78%,rgba(194,90,42,.28),transparent 70%),linear-gradient(180deg,#ffffff0a,#00000040);border:1px solid rgba(255,255,255,.08);overflow:hidden}.char-stage canvas{display:block;width:100%;height:100%}@media(max-height:700px){.char-stage{height:210px}}.btn-custom{padding:8px 14px;font-size:13px;align-self:flex-start}.custom-panel{display:grid;gap:14px;padding:12px 14px;border-radius:12px;background:#ffffff08;border:1px solid rgba(255,255,255,.07)}.custom-panel.hidden{display:none}.swatches{display:flex;gap:10px;flex-wrap:wrap}.swatch{width:34px;height:34px;border-radius:50%;border:2px solid transparent;transition:transform .12s,border-color .12s,box-shadow .12s}.swatch:hover{transform:scale(1.12)}.swatch.active{border-color:#fff;box-shadow:0 0 14px currentColor;transform:scale(1.12)}.btn{position:relative;isolation:isolate;padding:14px 22px;border-radius:0;font-family:var(--font-display);font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;--shape: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));clip-path:var(--shape);transition:transform .16s ease,filter .16s ease,color .16s ease}.btn:before,.btn:after{content:"";position:absolute;clip-path:var(--shape);pointer-events:none;transition:background .16s ease}.btn:before{inset:0;background:var(--edge-soft);z-index:-2}.btn:after{inset:1px;background:var(--fill, rgba(255, 255, 255, .05));z-index:-1}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(1px);filter:brightness(.88);transition-duration:.06s}.btn-primary{--fill: linear-gradient(160deg, var(--accent), var(--accent-3));--edge-soft: var(--accent);color:#0a0603;filter:drop-shadow(0 0 18px rgba(224,169,78,.35))}.btn-primary:hover{filter:drop-shadow(0 0 30px rgba(224,169,78,.6))}.btn-primary:active{filter:drop-shadow(0 0 10px rgba(224,169,78,.3)) brightness(.9)}.btn-ghost{color:var(--text);--fill: rgba(255, 255, 255, .05)}.btn-ghost:hover{--edge-soft: var(--edge);--fill: rgba(224, 169, 78, .08)}.divider{display:flex;align-items:center;gap:12px;color:var(--text-dim);font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--panel-border)}.landing-foot{text-align:center;font-size:.82rem;color:var(--text-dim);line-height:1.6}.room{position:absolute;inset:0}.room canvas.stage{position:absolute;inset:0;width:100%;height:100%;display:block}.hud{position:absolute;inset:0;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))}.hud>*{pointer-events:auto}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;pointer-events:none}.hud-top>*{pointer-events:auto}.room-pill{display:flex;align-items:center;gap:10px;padding:9px 15px;--cut: var(--cut-sm);font-weight:700;font-size:.95rem;letter-spacing:.14em;transition:filter .16s}.room-pill .dot{width:8px;height:8px;transform:rotate(45deg);background:var(--accent);box-shadow:0 0 8px var(--accent);animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.4}}.room-pill small{color:var(--text-dim);font-weight:500;letter-spacing:0}.leaderboard{min-width:210px;padding:11px 13px 12px;font-size:.94rem}.leaderboard h3{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:8px}.leaderboard ol{list-style:none;display:flex;flex-direction:column;gap:5px}.leaderboard li{display:flex;align-items:center;gap:8px;padding:3px 7px;background:#ffffff09;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}.leaderboard li:first-child{background:linear-gradient(90deg,#e0a94e2e,#e0a94e05);box-shadow:inset 2px 0 0 var(--accent)}.leaderboard .who{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:130px}.leaderboard .pts{font-variant-numeric:tabular-nums;color:var(--text-dim)}.leaderboard .medal{width:18px;text-align:center}.hud-bottom{display:flex;flex-direction:column;gap:12px;align-items:center;pointer-events:none}.hud-bottom>*{pointer-events:auto}.now-playing{display:flex;align-items:center;gap:10px;padding:8px 16px;--cut: var(--cut-sm);font-size:.95rem;max-width:min(480px,90vw)}.now-playing .eq{display:flex;gap:2.5px;align-items:flex-end;height:14px}.now-playing .eq i{width:3px;background:var(--accent);border-radius:0;animation:eq .9s ease-in-out infinite}.now-playing .eq i:nth-child(2){animation-delay:.22s;background:var(--accent-3)}.now-playing .eq i:nth-child(3){animation-delay:.45s;background:var(--accent-2)}@keyframes eq{0%,to{height:4px}50%{height:14px}}.now-playing.paused .eq i{animation-play-state:paused;height:4px}.now-playing .title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.energy-wrap{display:flex;align-items:center;gap:10px}.energy-label{font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:#e0a94eb3;text-shadow:0 0 12px rgba(224,169,78,.35)}@media(max-width:640px){.energy-label{display:none}}.energy{position:relative;width:min(320px,55vw);height:16px;padding:2px;border-radius:0;overflow:hidden;--cut: 5px;--fill: rgba(0, 0, 0, .55)}.energy .fill{position:relative;height:100%;width:0%;border-radius:0;background:linear-gradient(90deg,var(--accent),var(--accent-3) 62%,var(--accent-2));transition:width .12s linear}.energy .fill:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 11px,rgba(10,6,3,.85) 11px 14px)}.combo{font-weight:700;font-size:1.05rem;min-width:56px;padding:3px 8px;text-align:center;color:var(--accent);text-shadow:0 0 12px var(--accent);--cut: 5px;--edge-soft: rgba(224, 169, 78, .35);--fill: rgba(0, 0, 0, .5);transition:transform .15s,color .15s}.combo.hot{color:var(--accent-2);text-shadow:0 0 14px var(--accent-2);transform:scale(1.15)}.controls-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center}.react-btn{font-size:1.3rem;width:44px;height:42px;--cut: var(--cut-sm);display:grid;place-items:center;transition:transform .16s,filter .16s}.react-btn:hover{transform:translateY(-3px);filter:drop-shadow(0 0 16px rgba(255,47,185,.45))}.react-btn:active{transform:translateY(1px);filter:brightness(.85);transition-duration:.06s}.ctl-btn{height:42px;padding:0 16px;--cut: var(--cut-sm);font-family:var(--font-display);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.09em;display:flex;align-items:center;gap:8px;transition:transform .16s,filter .16s,color .16s}.ctl-btn:active{transform:translateY(1px);filter:brightness(.85);transition-duration:.06s}.ctl-btn.primary{--fill: linear-gradient(160deg, var(--accent), var(--accent-3));--edge-soft: var(--accent);color:#0a0603}.ctl-btn.danger{color:#ff7a7a}.hud svg{flex-shrink:0;vertical-align:middle}.leaderboard h3,.deck-head h3{display:flex;align-items:center;gap:6px}.room-pill .pill-share{color:var(--text-dim);margin-left:2px;transition:color .15s}.room-pill:hover .pill-share{color:var(--accent)}.vol svg{color:var(--text-dim)}.ctl-btn.icon-only{padding:0 12px;justify-content:center}.playlist .pl-num{display:inline-flex;align-items:center;justify-content:center;width:16px;flex-shrink:0}.deck{width:min(560px,calc(100vw - 24px));padding:16px;display:flex;flex-direction:column;gap:12px}.deck-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.deck-head h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--accent)}.dropzone{border:2px dashed rgba(255,255,255,.18);border-radius:0;padding:18px;text-align:center;color:var(--text-dim);font-size:.95rem;transition:border-color .15s,background .15s;cursor:pointer}.dropzone:hover,.dropzone.over{border-color:var(--accent);background:#e0a94e0f;color:var(--text)}.playlist{list-style:none;max-height:130px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}.playlist li{padding:8px 12px;border-radius:0;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);font-size:.94rem;display:flex;gap:10px;align-items:center;cursor:pointer;transition:background .12s}.playlist li:hover{background:#ffffff12}.playlist li.current{background:#e0a94e1f;color:var(--accent);font-weight:600}.playlist .dur{margin-left:auto;color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:.8rem}.transport{display:flex;align-items:center;gap:12px}.transport .t-btn{width:44px;height:44px;border-radius:0;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);display:grid;place-items:center;font-size:1.15rem;background:#ffffff12;transition:background .16s,transform .16s,filter .16s}.transport .t-btn:hover{background:#e0a94e24;transform:translateY(-1px)}.transport .t-btn:active{transform:translateY(1px);filter:brightness(.85);transition-duration:.06s}.transport .t-btn.play{background:linear-gradient(160deg,var(--accent),var(--accent-3));color:#0a0603;width:52px;height:52px;font-size:1.3rem;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}.seek{flex:1;display:flex;flex-direction:column;gap:4px}.seek input[type=range],.vol input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:32px;background:none;cursor:pointer;outline:none}.seek input[type=range]::-webkit-slider-runnable-track,.vol input[type=range]::-webkit-slider-runnable-track{height:6px;background:#0000008c;box-shadow:inset 0 0 0 1px #e0a94e2e}.seek input[type=range]::-moz-range-track,.vol input[type=range]::-moz-range-track{height:6px;background:#0000008c;box-shadow:inset 0 0 0 1px #e0a94e2e}.seek input[type=range]::-webkit-slider-thumb,.vol input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:18px;margin-top:-6px;border:none;border-radius:0;clip-path:polygon(3px 0,100% 0,100% calc(100% - 3px),calc(100% - 3px) 100%,0 100%,0 3px);background:linear-gradient(180deg,var(--accent),var(--accent-3));box-shadow:0 0 12px #e0a94e99;transition:transform .12s,box-shadow .12s}.seek input[type=range]::-moz-range-thumb,.vol input[type=range]::-moz-range-thumb{width:10px;height:18px;border:none;border-radius:0;background:linear-gradient(180deg,var(--accent),var(--accent-3));box-shadow:0 0 12px #e0a94e99}.seek input[type=range]:active::-webkit-slider-thumb,.vol input[type=range]:active::-webkit-slider-thumb{transform:scaleY(1.15);box-shadow:0 0 20px #e0a94ee6}.seek input[type=range]:focus-visible::-webkit-slider-thumb,.vol input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--accent),0 0 20px #e0a94eb3}.seek .times{display:flex;justify-content:space-between;font-size:.72rem;color:var(--text-dim);font-variant-numeric:tabular-nums}.vol{display:flex;align-items:center;gap:8px;width:110px;color:var(--text-dim)}.selfview{position:absolute;right:14px;bottom:190px;width:150px;border-radius:0;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);overflow:hidden;border:1px solid var(--panel-border);background:#000;transition:opacity .2s;z-index:12}.selfview{cursor:zoom-in;transition:width .25s cubic-bezier(.2,.9,.3,1)}.selfview.large{width:min(480px,calc(100vw - 28px));cursor:zoom-out}.selfview.at-door{width:min(340px,calc(50vw - 20px));right:20px;bottom:auto;top:50%;transform:translateY(-50%);clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px);border-color:#e0a94e66;box-shadow:0 24px 60px #0000008c,0 0 40px #e0a94e2e;transition:width .35s cubic-bezier(.2,.9,.3,1),box-shadow .35s}@media(max-width:640px){.selfview.at-door{width:min(200px,calc(100vw - 32px));top:16%;transform:none}}.selfview video{width:100%;display:block;transform:scaleX(-1)}.selfview .pose-debug{position:absolute;inset:0;width:100%;height:100%;transform:scaleX(-1);pointer-events:none}.selfview .cam-label{position:absolute;left:8px;bottom:6px;font-size:.68rem;color:#fffc;text-shadow:0 1px 3px #000}.pip{position:absolute;left:14px;bottom:190px;width:172px;height:208px;border-radius:0;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);border:1px solid var(--panel-border);box-shadow:0 6px 24px #0006,inset 0 0 0 1px #ffffff0d;overflow:hidden;pointer-events:none;z-index:20}.pip.hidden{display:none}.pip-label{position:absolute;left:8px;top:6px;font-size:.68rem;color:#ffffffd9;text-shadow:0 1px 3px #000}.pip-close{position:absolute;right:6px;top:6px;display:grid;place-items:center;width:22px;height:22px;padding:0;border:none;border-radius:0;clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px);background:#00000059;color:#fff;cursor:pointer;pointer-events:auto}.pip-close:hover{background:#0009}@media(max-width:640px){.pip{width:128px;height:156px;bottom:150px}}.toast-zone{position:absolute;top:74px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;z-index:30}.toast{padding:10px 18px;--cut: var(--cut-sm);font-size:.95rem;box-shadow:inset 2px 0 0 var(--accent);animation:toast-in .25s cubic-bezier(.2,.9,.3,1)}@keyframes toast-in{0%{opacity:0;transform:translateY(-10px)}}.update-pill{position:absolute;bottom:20px;left:50%;transform:translate(-50%);z-index:45;display:flex;align-items:center;gap:9px;padding:11px 20px;--cut: var(--cut-sm);font-family:var(--font-display);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;color:var(--text);cursor:pointer;--edge-soft: rgba(224, 169, 78, .6);filter:drop-shadow(0 0 20px rgba(224,169,78,.28));animation:toast-in .3s cubic-bezier(.2,.9,.3,1)}.update-pill:hover{--edge-soft: var(--accent)}.update-dot{width:9px;height:9px;transform:rotate(45deg);background:var(--accent);box-shadow:0 0 8px var(--accent);animation:update-pulse 1.4s ease-in-out infinite}@keyframes update-pulse{50%{opacity:.35}}.announce-banner{position:absolute;top:0;left:50%;transform:translate(-50%);z-index:44;max-width:min(680px,calc(100vw - 24px));padding:9px 22px;border-top:none;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px));font-family:var(--font);font-size:.94rem;color:var(--text);text-align:center;--edge-soft: rgba(194, 90, 42, .6);filter:drop-shadow(0 6px 18px rgba(194,90,42,.25));animation:toast-in .3s cubic-bezier(.2,.9,.3,1)}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#0d0804d1;backdrop-filter:blur(8px);z-index:40}.overlay-card{width:min(420px,calc(100vw - 40px));padding:30px;text-align:center;display:flex;flex-direction:column;gap:16px;--cut: 18px;animation:rise .4s cubic-bezier(.2,.9,.3,1)}.overlay-card h2{font-family:var(--font-display);font-size:1.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.overlay-card p{color:var(--text-dim);line-height:1.55;font-size:.95rem}.hidden{display:none!important}@media(max-width:640px){.leaderboard{display:none}.selfview{width:104px;bottom:230px}.deck{padding:12px}}@media(max-width:720px){.deck{max-height:calc(100dvh - 300px);overflow-y:auto;overscroll-behavior:contain}}.chat-panel{position:absolute;right:12px;bottom:120px;width:320px;max-width:calc(100vw - 24px);max-height:min(46vh,420px);padding:12px 14px;display:flex;flex-direction:column;gap:8px;z-index:40}.chat-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.chat-head h3{display:flex;align-items:center;gap:6px;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim)}.chat-head .ctl-btn{height:30px;padding:0 6px}.chat-list{list-style:none;overflow-y:auto;display:flex;flex-direction:column;gap:6px;font-size:.88rem;line-height:1.35;flex:1 1 auto;min-height:0;overscroll-behavior:contain}.chat-list li{display:flex;gap:6px;align-items:baseline;word-break:break-word}.chat-list li b{font-weight:700;flex-shrink:0;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-list li b:after{content:":";opacity:.5}.chat-list li.mine b{color:var(--accent)}.chat-form{display:flex;gap:6px}.chat-form input{flex:1 1 auto;min-width:0;height:40px;padding:0 12px;border-radius:0;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);background:#00000047;border:1px solid var(--panel-border);color:var(--text);font:inherit;font-size:.95rem}.chat-form input:focus{outline:none;border-color:var(--accent)}.chat-form .ctl-btn{height:40px;padding:0 12px}.chat-panel.cooling .chat-form .ctl-btn{opacity:.45;pointer-events:none}.chat-badge{position:absolute;top:-5px;right:-3px;min-width:18px;height:18px;padding:0 5px;border-radius:0;clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);background:var(--accent-2);color:#fff;font-family:var(--font-mono);font-size:.7rem;font-weight:700;line-height:18px;text-align:center;box-shadow:0 0 12px #ff2fb999}#btn-chat{position:relative}.ctl-btn.active{--edge-soft: var(--accent);--fill: rgba(224, 169, 78, .16);color:var(--accent)}@media(max-width:720px){.chat-panel{top:64px;bottom:auto;width:calc(100vw - 24px);max-height:34vh}}@media(max-width:720px){.hud:has(.deck:not(.hidden))~.chat-panel{max-height:15vh}}.chat-tabs{display:flex;gap:4px}.chat-tabs .tab{display:flex;align-items:center;gap:5px;height:32px;padding:0 11px;border-radius:0;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);font-family:var(--font-display);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);background:#ffffff0a;box-shadow:inset 0 -2px #ffffff12;transition:color .15s,background .15s,box-shadow .15s}.chat-tabs .tab:hover{color:var(--text);background:#ffffff14}.chat-tabs .tab.active{color:var(--text);background:#e0a94e1a;box-shadow:inset 0 -2px 0 var(--accent)}.chat-tabs .tab small{opacity:.6;font-size:.68rem}.people-list{list-style:none;overflow-y:auto;display:flex;flex-direction:column;gap:4px;font-size:.88rem;flex:1 1 auto;min-height:0;overscroll-behavior:contain}.people-list li{display:flex;align-items:center;gap:7px}.people-list .dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px currentColor}.people-list b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.people-list .you,.people-list .dj{font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:1px 6px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%);flex-shrink:0}.people-list .you{background:#ffffff1f;color:var(--text-dim)}.people-list .dj{background:#e0a94e2e;color:var(--accent)}.people-list .score{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--text-dim);font-size:.8rem}.seg{display:flex;gap:6px}.seg-btn{flex:1 1 0;padding:10px;border-radius:0;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);font-family:var(--font-display);font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);background:#ffffff0d;border:1px solid transparent;transition:color .15s,background .15s,border-color .15s}.seg-btn:hover{color:var(--text)}.seg-btn.active{color:var(--text);background:#e0a94e1f;border-color:#e0a94e73}#dr-title{margin-top:8px}.rooms-open{margin-top:14px;padding:12px 14px;border-radius:var(--radius);text-align:left}.rooms-open h3{display:flex;align-items:center;justify-content:space-between;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:8px}.rooms-open h3 button{color:var(--text-dim);font-size:.95rem;line-height:1;padding:2px 6px;border-radius:8px}.rooms-open h3 button:hover{color:var(--accent);background:#ffffff14}.rooms-open ul{list-style:none;display:flex;flex-direction:column;gap:6px;max-height:190px;overflow-y:auto}.room-row{width:100%;display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:0;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);background:#ffffff0d;color:var(--text);font-size:.94rem;text-align:left;transition:background .15s}.room-row:hover{background:#ffffff1a}.room-row b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-row .badge{font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:2px 7px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%);flex-shrink:0}.room-row .badge.event{background:#c25a2a38;color:#e8cfa0}.room-row .badge.live{background:#ff2fb92e;color:#ff8ad4}.room-row .count{margin-left:auto;color:var(--text-dim);font-size:.78rem;white-space:nowrap}.room-vis{font-family:var(--font-display);font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:1px 6px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%);margin-left:2px}.room-vis.private{background:#ffffff1f;color:var(--text-dim)}.room-vis.public{background:#e0a94e2e;color:var(--accent)}.people-list .host{font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:1px 6px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%);background:#c25a2a38;color:#e8cfa0;flex-shrink:0}.people-list .muted{font-family:var(--font-display);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:1px 6px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%);background:#ffffff1a;color:#ff9c9c;flex-shrink:0}.people-list .mod{color:var(--text-dim);padding:3px;border-radius:8px;display:flex;align-items:center;flex-shrink:0;transition:color .15s,background .15s}.people-list .mod:hover{color:var(--text);background:#ffffff1a}.people-list .mod.danger:hover{color:#ff7a7a;background:#ff7a7a1f}.people-list .mod+.mod{margin-left:0}.welcome{position:absolute;left:50%;bottom:6%;transform:translate(-50%);z-index:35;transition:opacity .5s ease,transform .5s ease}.welcome.gone{opacity:0;transform:translate(-50%) translateY(18px) scale(.97);pointer-events:none}.door{position:relative;isolation:isolate;width:min(520px,calc(100vw - 28px));padding:20px 22px 18px;--cut: 18px;--shape: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));clip-path:var(--shape);border-radius:0;display:flex;flex-direction:column;gap:14px;border:none;backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25);animation:door-in .55s cubic-bezier(.2,.9,.3,1)}.door:after{content:"";position:absolute;inset:1px;clip-path:var(--shape);background:linear-gradient(180deg,#2e1f12d9,#140d08ed);background-image:linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(180deg,#2e1f12d9,#140d08ed);background-repeat:no-repeat;background-position:right 0 top 0,right 0 top 0,left 0 bottom 0,left 0 bottom 0,0 0;background-size:34px 2px,2px 34px,34px 2px,2px 34px,auto;pointer-events:none;z-index:-1}@keyframes door-in{0%{opacity:0;transform:translateY(22px) scale(.96)}}.door-glow{position:absolute;inset:0;clip-path:var(--shape);background:linear-gradient(115deg,var(--accent),rgba(255,255,255,.16) 34%,rgba(255,255,255,.16) 66%,var(--accent-2));opacity:.9;pointer-events:none;z-index:-2;animation:door-sheen 7s ease-in-out infinite}@keyframes door-sheen{50%{filter:hue-rotate(40deg);opacity:.55}}@media(prefers-reduced-motion:reduce){.door-glow,.door{animation:none}}.door-eyebrow{font-family:var(--font-display);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.26em;color:#e0a94ebf;text-shadow:0 0 16px rgba(224,169,78,.45)}.door-led{display:inline-block;width:7px;height:7px;margin-right:9px;vertical-align:1px;transform:rotate(45deg);background:var(--accent);box-shadow:0 0 10px var(--accent);animation:pulse 2s infinite}@media(prefers-reduced-motion:reduce){.door-led{animation:none}}.door-gear{display:grid;grid-template-columns:1fr 1fr;gap:10px}.door-btn{position:relative;isolation:isolate;display:flex;align-items:center;gap:11px;padding:12px 14px;--cut: 10px;--shape: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));clip-path:var(--shape);border-radius:0;border:none;text-align:left;color:var(--text);transition:transform .16s,filter .16s}.door-btn:before,.door-btn:after{content:"";position:absolute;clip-path:var(--shape);pointer-events:none;transition:background .16s}.door-btn:before{inset:0;background:#ffffff1f;z-index:-2}.door-btn:after{inset:1px;background:#ffffff0d;z-index:-1}.door-btn:hover{transform:translateY(-1px)}.door-btn:hover:before{background:var(--edge)}.door-btn:hover:after{background:#e0a94e12}.door-btn:active{transform:translateY(1px);filter:brightness(.88);transition-duration:.06s}.door-btn.on:before{background:#e0a94ebf}.door-btn.on:after{background:#e0a94e1c}.door-btn.on{filter:drop-shadow(0 0 20px rgba(224,169,78,.28))}.door-btn.busy{opacity:.55;pointer-events:none}.door-ico{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:0;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);background:#00000059;color:var(--text-dim);transition:color .16s,background .16s}.door-btn.on .door-ico{color:var(--accent);background:#e0a94e24;text-shadow:0 0 12px var(--accent)}.door-txt{display:flex;flex-direction:column;gap:1px;min-width:0}.door-txt b{font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em}.door-txt small{font-size:.74rem;color:var(--text-dim)}.door-btn.on .door-txt small{color:var(--accent)}.door-privacy{padding:9px 12px;border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);border-left:2px solid rgba(224,169,78,.55);background:#e0a94e0d;color:#f2eeffc7;font-size:.86rem;line-height:1.45}.welcome-form{display:flex;gap:10px;align-items:center}.welcome-form input{flex:1 1 auto;min-width:0;height:48px;padding:0 18px;border-radius:0;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);border:1px solid rgba(255,255,255,.12);background:#0000006b;color:var(--text);font:inherit;font-size:1.05rem;letter-spacing:.03em;outline:none;transition:border-color .15s,box-shadow .15s}.welcome-form input::placeholder{color:#f2eeff61}.welcome-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #e0a94e29}.welcome-form .btn{padding:0 28px;height:48px;--cut: 10px;flex-shrink:0}@media(max-width:560px){.door-gear{grid-template-columns:1fr}.door{padding:16px 16px 14px}}.hud.hud-away{opacity:0;pointer-events:none;transform:translateY(10px)}.hud{transition:opacity .45s ease,transform .45s ease}.hud.hud-away~.chat-panel{opacity:0;pointer-events:none}.room:before,.room:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1}.room:before{background:radial-gradient(ellipse 78% 72% at 50% 48%,transparent 55%,rgba(8,5,2,.55))}.room:after{background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,.5) 0 .6px,transparent .6px);background-size:3px 3px;opacity:.055;mix-blend-mode:overlay}.hud{z-index:10}.room-pill{font-family:var(--font-display);font-size:.88rem}.room-pill:hover{--edge-soft: var(--edge);filter:drop-shadow(0 0 20px rgba(224,169,78,.3))}.leaderboard h3,.deck-head h3,.chat-head h3{font-family:var(--font-display);font-weight:700;font-size:.66rem;letter-spacing:.22em;color:#e0a94ecc;padding-bottom:7px;border-bottom:1px solid rgba(224,169,78,.16)}.leaderboard li:first-child .who{font-weight:700}.leaderboard:after,.deck:after,.chat-panel:after{background-image:linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),linear-gradient(var(--edge),var(--edge)),var(--fill, linear-gradient(180deg, rgba(55, 38, 23, .76), rgba(18, 12, 7, .9)));background-repeat:no-repeat;background-position:right 0 top 0,right 0 top 0,left 0 bottom 0,left 0 bottom 0,0 0;background-size:24px 2px,2px 24px,24px 2px,2px 24px,auto}.leaderboard li:first-child .pts{color:var(--accent);text-shadow:0 0 10px rgba(224,169,78,.55)}.leaderboard .pts{font-weight:700}.energy .fill{box-shadow:0 0 16px #e0a94ea6}.ctl-btn:hover{--edge-soft: var(--edge);--fill: rgba(224, 169, 78, .09);transform:translateY(-1px);filter:drop-shadow(0 0 18px rgba(224,169,78,.22))}.ctl-btn.primary:hover{--fill: linear-gradient(160deg, var(--accent), var(--accent-3));filter:drop-shadow(0 0 26px rgba(224,169,78,.5))}.ctl-btn.danger:hover{--edge-soft: rgba(255, 122, 122, .6);--fill: rgba(255, 122, 122, .12);filter:drop-shadow(0 0 18px rgba(255,122,122,.25))}.react-btn:hover{--edge-soft: rgba(255, 47, 185, .65);--fill: rgba(255, 47, 185, .12)}.transport .t-btn.play{filter:drop-shadow(0 0 24px rgba(224,169,78,.5))}
