:root{--ink: #0e0c13;--ink-2: #17141f;--ink-3: #221d2c;--line: #3a3146;--paper: #f1e6cf;--muted: #a69bb0;--lacquer: #b4231f;--lacquer-2: #7d1714;--gold: #e6b742;--gold-2: #a8812a;--jade: #3fbf7f;--me: var(--gold);--f-display: "Bungee", "Impact", "Arial Black", sans-serif;--f-body: "Rubik", system-ui, "Segoe UI", sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 70% -10%,rgba(180,35,31,.22),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(230,183,66,.1),transparent 60%),var(--ink);color:var(--paper);font:15px/1.5 var(--f-body)}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.05;z-index:0;background:radial-gradient(circle at 50% 100%,transparent 14px,var(--gold) 15px,transparent 16px,transparent 22px,var(--gold) 23px,transparent 24px) 0 0 / 48px 24px}button,input{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}[hidden]{display:none!important}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;border:0;border-radius:6px;padding:.75em 1.2em;text-decoration:none;font-weight:700;letter-spacing:.02em}.btn-gold{background:linear-gradient(180deg,#f4cf6a,var(--gold) 45%,var(--gold-2));color:#2a1a05;box-shadow:0 2px #5d4512,inset 0 1px #ffffff80}.btn-gold:hover{filter:brightness(1.08)}.btn-ghost{background:transparent;border:1.5px solid var(--gold-2);color:var(--gold)}.btn-ghost:hover{background:#e6b74214}.btn.big{font-size:1.15rem;padding:.9em 1.6em}.eyebrow{margin:0;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}.lobby{position:relative;z-index:1;min-height:100%;display:grid;place-items:center;padding-block:32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}.lobby-card{width:min(440px,100%);background:linear-gradient(180deg,var(--ink-2),var(--ink));border:1px solid var(--line);border-top:4px solid var(--lacquer);border-radius:10px;padding:28px 24px 22px;display:grid;gap:16px;box-shadow:0 30px 80px #00000080}.emblem{width:64px;height:64px;margin:-60px auto 0;border-radius:50%;background:conic-gradient(from 0deg,var(--lacquer),var(--gold),var(--lacquer),var(--gold),var(--lacquer));border:3px solid var(--ink);box-shadow:0 0 0 2px var(--gold-2);animation:spin 6s linear infinite;-webkit-mask:radial-gradient(circle,transparent 9px,#000 10px);mask:radial-gradient(circle,transparent 9px,#000 10px)}@keyframes spin{to{transform:rotate(360deg)}}.brand{margin:0;text-align:center;font:400 2.6rem/.95 var(--f-display);color:var(--gold);text-shadow:0 3px 0 var(--lacquer-2),0 0 24px rgba(230,183,66,.25)}.brand span{font-size:.62em;color:var(--paper);letter-spacing:.08em}.tagline{margin:0;text-align:center;color:var(--muted)}.field{display:grid;gap:6px}.field span,.elements legend{font-size:.8rem;color:var(--muted)}input:not([type]),#code,#name{background:var(--ink);border:1.5px solid var(--line);border-radius:6px;padding:.7em .9em;width:100%}input:not([type]):focus,#code:focus,#name:focus{border-color:var(--gold-2);outline:none}.elements{border:0;padding:0;margin:0;display:grid;gap:8px}.element-pick{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.el-opt{display:grid;justify-items:center;gap:4px;padding:8px 2px;background:var(--ink);border:1.5px solid var(--line);border-radius:8px;font-size:.72rem;color:var(--muted)}.el-opt[aria-pressed=true]{border-color:var(--c);color:var(--paper);background:color-mix(in srgb,var(--c) 14%,var(--ink))}.lobby-actions{display:grid;gap:10px}.join-row{display:grid;grid-template-columns:1fr auto;gap:8px}#code{text-transform:uppercase;letter-spacing:.2em;font-weight:700}.lobby-msg{margin:0;min-height:1.5em;text-align:center;color:var(--gold);font-size:.9rem}.ninja{--c: var(--gold);width:30px;height:30px;border-radius:50%;position:relative;flex:none;background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--c) 85%,#fff) 0,var(--c) 55%,color-mix(in srgb,var(--c) 55%,#000) 100%);box-shadow:inset 0 -3px #00000040}.ninja:before{content:"";position:absolute;left:18%;right:18%;top:38%;height:26%;background:#f2d9b8;border-radius:40% 40% 45% 45%}.ninja:after{content:"";position:absolute;left:32%;right:32%;top:46%;height:10%;background:radial-gradient(circle at 15% 50%,#111 45%,transparent 50%),radial-gradient(circle at 85% 50%,#111 45%,transparent 50%)}body:has(.room:not([hidden])){overflow:hidden}.room{position:relative;z-index:1;height:100dvh;overflow:hidden}.stage{height:100%;display:grid;grid-template-columns:minmax(0,1fr) 360px}.theater{min-width:0;min-height:0;display:flex;flex-direction:column;gap:10px;padding-block:14px;padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:14px;background:#07060a}.screen{flex:1;min-height:0;container-type:size;display:grid;place-items:center}.frame{position:relative;width:min(100cqw,100cqh * 16 / 9);aspect-ratio:16 / 9;max-width:100%;background:#000;border-radius:6px;overflow:hidden;border:2px solid var(--gold-2);box-shadow:0 0 0 3px #07060a,0 0 0 4px var(--lacquer-2),0 0 60px #b4231f40}.side{min-width:0;min-height:0;display:flex;flex-direction:column;gap:12px;padding:14px max(14px,env(safe-area-inset-right,0px)) 14px 14px;background:linear-gradient(180deg,var(--lacquer-2) 0,var(--ink-2) 150px,var(--ink-2));border-left:3px solid var(--gold-2)}.side-head{display:grid;gap:10px}.brand-slot{display:grid;justify-items:center;gap:4px}.logo{display:block;max-width:100%;max-height:72px;object-fit:contain}.logo-lg{max-height:110px;margin:0 auto}.brand-slot .logo+.brand-sm,.lobby-card .logo+.brand{display:none}.brand-sm{font:400 1.7rem/1 var(--f-display);color:var(--gold);text-align:center;text-shadow:0 3px 0 #3d0b0a,0 0 18px rgba(230,183,66,.35);-webkit-text-stroke:1px #5d1210}.brand-sm span{display:block;color:var(--paper);font-size:.5em;letter-spacing:.3em;-webkit-text-stroke:0;margin-top:4px}.room-code{display:flex;align-items:baseline;justify-content:center;gap:8px;background:#00000059;border:1px solid rgba(230,183,66,.5);border-radius:6px;padding:7px 12px}.room-code:hover{border-color:var(--gold)}.room-code small{color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.12em}.room-code b{font:400 1.1rem/1 var(--f-display);color:var(--gold);letter-spacing:.1em}.room-code em{font-style:normal;font-size:.75rem;color:var(--paper);opacity:.8}@media (max-width: 900px){.stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}.theater{padding:0;gap:6px}.screen{flex:none;container-type:normal;display:block}.frame{width:100%;border-radius:0;border-width:0 0 2px}.now{padding:0 max(14px,env(safe-area-inset-left,0px))}.now h2{font-size:1.1rem}.side{border-left:0;border-top:3px solid var(--gold-2);padding-top:10px;background:var(--ink-2)}.brand-slot{display:none}}.frame:fullscreen{border:0;border-radius:0;aspect-ratio:auto}.video,.video iframe,#yt{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.click-layer{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer}.panel-over{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;text-align:center;padding:24px;background:radial-gradient(circle at 50% 40%,#5a1210,#0e0c13 75%)}.frame:has(#external:not([hidden])) .controls,.frame:has(#external:not([hidden])) .click-layer{display:none}.panel-inner{max-width:460px;display:grid;gap:10px}.panel-inner h2{margin:0;font:400 1.4rem/1.15 var(--f-display);color:var(--gold);text-wrap:balance}.panel-inner p{margin:0;color:var(--muted)}.panel-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:6px}.panel-over.tap{gap:10px;align-content:center;background:#0e0c13d1}.panel-over.tap p{margin:0;color:var(--muted)}.controls{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;background:linear-gradient(180deg,transparent,rgba(14,12,19,.85) 45%);transition:opacity .25s}.frame.idle .controls{opacity:0}.frame.idle{cursor:none}.seek{position:relative;height:18px;display:grid;align-items:center}.seek-track{position:relative;height:5px;border-radius:3px;background:#f1e6cf2e}.seek:hover .seek-track{height:7px}.seek-buf{position:absolute;inset:0 auto 0 0;background:#f1e6cf40;border-radius:inherit}.seek-fill{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--lacquer),var(--me));border-radius:inherit}.seek-knob{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;transform:rotate(45deg);background:var(--me);border:2px solid var(--ink);box-shadow:0 0 10px var(--me)}#seekInput{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;cursor:pointer;margin:0}.ctl-row{display:flex;align-items:center;gap:6px;margin-top:6px}.ic{background:none;border:0;width:36px;height:36px;border-radius:50%;font-size:1.1rem;line-height:1;display:inline-grid;place-items:center;position:relative;color:var(--paper)}.ic small{position:absolute;font-size:.5rem;font-weight:700}.ic:hover{background:#f1e6cf1a;color:var(--gold)}.play{width:46px;height:46px;border:0;display:grid;place-items:center;clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);background:linear-gradient(180deg,#f4cf6a,var(--gold) 50%,var(--gold-2))}.play:hover{filter:brightness(1.1)}.i-play{width:0;height:0;border-left:14px solid #2a1a05;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}.i-pause{width:14px;height:16px;border-left:5px solid #2a1a05;border-right:5px solid #2a1a05}.time{font-variant-numeric:tabular-nums;font-size:.85rem;color:var(--paper);margin-left:6px;white-space:nowrap}.spacer{flex:1}.vol{display:flex;align-items:center;gap:4px}.vol input{width:80px;accent-color:var(--gold)}@media (max-width: 560px){.vol,#backBtn,#fwdBtn{display:none}}.toasts{position:absolute;top:12px;left:12px;display:grid;gap:6px;pointer-events:none}.toast{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:20px;background:#0e0c13d1;border:1px solid var(--line);font-size:.85rem;animation:toast 4s forwards}.toast .ninja{width:22px;height:22px}@keyframes toast{0%{opacity:0;transform:translateY(-6px)}8%,85%{opacity:1;transform:none}to{opacity:0}}.now{display:grid;gap:2px;flex:none}.now h2{margin:0;font:400 1.35rem/1.15 var(--f-display);color:var(--paper);text-wrap:balance}.last-action{margin:0;color:var(--muted);font-size:.85rem;min-height:1.3em}.card{background:#0e0c1399;border:1px solid var(--line);border-radius:10px;padding:12px 14px;flex:none}.card h3{margin:0 0 10px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}.members{list-style:none;margin:0;padding:0;display:grid;gap:8px}.members li{display:flex;align-items:center;gap:10px}.members .who{flex:1;min-width:0}.members .who b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.members .who small{color:var(--muted);font-size:.75rem}.members .tag{font-size:.7rem;padding:2px 8px;border-radius:10px;border:1px solid var(--line);color:var(--muted)}.members .tag.lead{border-color:var(--gold-2);color:var(--gold)}.list-card{flex:1;min-height:0;display:flex;flex-direction:column;padding-bottom:4px}.list-head{display:flex;justify-content:space-between;align-items:baseline}.progress-txt{font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums}.list{flex:1;min-height:0;overflow-y:auto;margin:0 -14px;padding:0 6px 8px;scrollbar-color:var(--line) transparent}.members{max-height:112px;overflow-y:auto}.grp{margin-top:4px}.grp>summary{list-style:none;cursor:pointer;position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;gap:8px;align-items:center;padding:8px;background:#141119;border-bottom:1px solid var(--line);font-weight:700;font-size:.85rem}.grp>summary::-webkit-details-marker{display:none}.grp>summary .cnt{font-weight:400;color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums;white-space:nowrap}.grp.current>summary{color:var(--gold)}.ep{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:0;border-radius:6px;padding:7px 8px;color:var(--paper)}.ep:hover{background:var(--ink-3)}.ep .mark{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:.7rem;color:transparent}.ep.watched .mark{background:var(--jade);border-color:var(--jade);color:var(--ink)}.ep .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem}.ep.watched .t{color:var(--muted)}.ep .ext{font-size:.65rem;padding:1px 6px;border-radius:8px;border:1px solid var(--line);color:var(--muted)}.ep.active{background:color-mix(in srgb,var(--lacquer) 30%,var(--ink-2));box-shadow:inset 3px 0 0 var(--gold)}.ep.active .t{color:var(--gold);font-weight:700}@media (prefers-reduced-motion: reduce){.emblem,.toast{animation:none}}