body { min-height:100vh; overflow-x:hidden; } body::before,body::after { background:radial-gradient(circle,rgba(70,99,91,.3),transparent 67%); content:""; filter:blur(12px); height:680px; pointer-events:none; position:fixed; width:680px; z-index:-1; } body::before { left:-260px; top:-280px; } body::after { background:radial-gradient(circle,rgba(180,116,62,.2),transparent 67%); bottom:-380px; right:-320px; }
.app-shell { margin:auto; max-width:1480px; min-height:100vh; padding:0 42px; } .app-bar { align-items:center; border-bottom:1px solid var(--line); display:flex; height:78px; justify-content:space-between; } .wordmark { align-items:center; display:inline-flex; font:500 .88rem var(--mono); gap:10px; letter-spacing:.03em; text-decoration:none; } .wordmark span { align-items:center; border:1px solid var(--signal); color:var(--signal-pale); display:inline-flex; font-size:.62rem; height:26px; justify-content:center; letter-spacing:.08em; width:26px; }
.app-status,.utility-nav,.site-footer { color:var(--paper-soft); font:.68rem var(--mono); letter-spacing:.04em; } .app-status { align-items:center; display:flex; gap:7px; } .app-status i { background:var(--green); border-radius:50%; box-shadow:0 0 0 3px rgba(185,198,161,.08); height:6px; width:6px; } .utility-nav { display:flex; gap:18px; } .utility-nav a { text-decoration:none; } .utility-nav a:hover { color:var(--signal-pale); }
.lobby-view { display:grid; gap:clamp(72px,12vw,180px); padding:clamp(70px,11vw,156px) 0 70px; } .lobby-hero { animation:rise .75s both cubic-bezier(.2,.7,.2,1); max-width:800px; } .lobby-hero h1 { font:500 clamp(4.4rem,12vw,10.5rem)/.83 var(--serif); letter-spacing:-.075em; margin:18px 0 30px; } .lobby-hero em { color:var(--signal-pale); font-weight:inherit; } .hero-copy { color:var(--paper-soft); font-size:clamp(1rem,1.7vw,1.25rem); line-height:1.65; margin:0; max-width:525px; }
.hero-rule { align-items:center; border-top:1px solid var(--line); display:flex; gap:16px; margin-top:52px; max-width:390px; padding-top:13px; } .hero-rule span { color:var(--signal-pale); font:500 1.35rem var(--mono); } .hero-rule p { color:var(--paper-soft); font:.62rem/1.4 var(--mono); letter-spacing:.06em; margin:0; text-transform:uppercase; }
.section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:23px; } .section-heading h2 { font:500 clamp(1.8rem,4vw,3.3rem)/1 var(--serif); letter-spacing:-.05em; margin:8px 0 0; } .quiet-copy { color:var(--paper-soft); font:.68rem var(--mono); margin:0; }.rooms-grid { display:grid; gap:1px; grid-template-columns:repeat(3,1fr); }.room-tile { background:rgba(22,29,31,.7); min-width:0; padding:12px; transition:background .3s ease,transform .3s ease; }.room-tile:hover { background:rgba(41,51,53,.9); transform:translateY(-4px); }
.tile-art { aspect-ratio:16 / 9; background:linear-gradient(135deg,#2e3c37,#14191b); overflow:hidden; position:relative; }.tile-art img { height:100%; object-fit:cover; opacity:.78; width:100%; }.tile-state { background:var(--ink); bottom:9px; color:var(--paper); font:.58rem var(--mono); left:9px; padding:6px 7px; position:absolute; }.tile-state.playing::before { background:var(--green); border-radius:50%; content:""; display:inline-block; height:5px; margin:0 5px 1px 0; width:5px; }.tile-body { padding:18px 4px 6px; }.tile-body h3 { font:500 1.5rem/1.05 var(--serif); letter-spacing:-.04em; margin:8px 0 10px; }.tile-copy { color:var(--paper-soft); display:-webkit-box; font-size:.81rem; line-height:1.55; margin:0; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.tile-foot { align-items:center; color:var(--signal-pale); display:flex; font:.62rem var(--mono); gap:4px; margin:18px 0 0; }.tile-foot svg { height:13px; width:13px; }
.empty-state { border-left:1px solid var(--signal); color:var(--paper-soft); padding:18px 20px; }.empty-state p { color:var(--paper); font:500 1.5rem var(--serif); margin:0 0 5px; }.empty-state span { font-size:.82rem; }.empty-state code { color:var(--signal-pale); font-family:var(--mono); }
.room-view { padding:24px 0 56px; }.watch-stage { min-height:clamp(340px,52vw,720px); position:relative; }.backdrop { background-position:center; background-size:cover; filter:blur(42px) saturate(.65); height:83%; inset:-80px 5% auto; opacity:.36; position:absolute; }.backdrop::after { background:linear-gradient(180deg,rgba(13,17,19,.03),var(--ink) 90%); content:""; inset:0; position:absolute; }.stage-header { align-items:center; display:flex; justify-content:space-between; padding:0 0 22px; position:relative; }.stage-header p,.back-link { color:var(--paper-soft); font:.65rem var(--mono); margin:0; text-decoration:none; }.back-link { align-items:center; display:flex; gap:7px; }.back-link svg { transform:rotate(180deg); }.back-link:hover { color:var(--signal-pale); }
.player-shell { background:#050708; box-shadow:0 35px 90px rgba(0,0,0,.4); margin:auto; max-width:1210px; overflow:hidden; position:relative; }.player-shell:fullscreen { display:grid; place-items:center; width:100%; }.player-shell:fullscreen iframe { max-height:100vh; }.player-chrome { align-items:center; color:var(--paper-soft); display:flex; font:.58rem var(--mono); justify-content:space-between; left:0; letter-spacing:.08em; padding:12px 14px; position:absolute; right:0; text-transform:uppercase; top:0; z-index:2; }.bare-icon { background:transparent; border:0; color:var(--paper); display:grid; padding:4px; place-items:center; }.bare-icon svg { height:17px; width:17px; }.player-shell iframe { aspect-ratio:16 / 9; border:0; display:block; position:relative; width:100%; z-index:1; }.player-shade { background:linear-gradient(180deg,rgba(0,0,0,.36),transparent 17%); inset:0; pointer-events:none; position:absolute; z-index:1; }
.room-layout { display:grid; gap:clamp(34px,6vw,84px); grid-template-columns:minmax(0,1.5fr) minmax(310px,.6fr); margin:clamp(36px,6vw,80px) auto 0; max-width:1210px; }.title-sheet { align-items:start; display:grid; gap:24px; grid-template-columns:116px 1fr; }.poster-frame { aspect-ratio:2 / 3; background:var(--ink-soft); }.poster-frame img { height:100%; object-fit:cover; width:100%; }.title-copy h1 { font:500 clamp(2.5rem,5vw,5.3rem)/.92 var(--serif); letter-spacing:-.065em; margin:12px 0 15px; }.metadata { color:var(--signal-pale); font:.68rem var(--mono); margin:0; }.overview { color:var(--paper-soft); font-size:.92rem; line-height:1.7; margin:24px 0; max-width:620px; }.room-note { border-top:1px solid var(--line); color:var(--paper-soft); display:flex; font-size:.76rem; gap:9px; max-width:600px; padding-top:12px; }.room-note svg { color:var(--signal-pale); flex:none; margin-top:2px; }.room-note p { margin:0; }
.control-desk { border-left:1px solid var(--line); padding-left:clamp(22px,3vw,42px); }.desk-heading { align-items:start; display:flex; justify-content:space-between; }.desk-heading h2 { font:500 3rem/1 var(--mono); letter-spacing:-.08em; margin:9px 0 0; }.playback-state { border:1px solid var(--line); color:var(--paper-soft); font:.58rem var(--mono); padding:7px; }.playback-state.is-playing { border-color:rgba(185,198,161,.5); color:var(--green); }.progress-track { background:rgba(242,238,231,.13); height:2px; margin:27px 0 9px; overflow:hidden; }.progress-track i { background:var(--signal); display:block; height:100%; transition:width 1s linear; width:4%; }.sync-status,.key-hint { color:var(--paper-soft); font:.62rem/1.5 var(--mono); margin:0; }.control-cluster { align-items:center; display:flex; gap:9px; margin:26px 0; }.icon-control,.play-control { align-items:center; background:transparent; border:1px solid var(--line); color:var(--paper); display:inline-flex; height:43px; justify-content:center; transition:background .2s ease,border-color .2s ease; width:43px; }.icon-control:hover { border-color:var(--signal-pale); }.play-control { background:var(--signal); border-color:var(--signal); color:var(--ink); height:53px; width:53px; }.play-control:hover { background:var(--signal-pale); }.icon-control svg { height:18px; width:18px; }.play-control svg { fill:currentColor; height:21px; stroke-width:1.4; width:21px; }.desk-footer { border-top:1px solid var(--line); display:grid; gap:9px; padding-top:20px; }.desk-footer label { color:var(--paper-soft); font:.61rem var(--mono); }.desk-footer select { appearance:none; background:var(--ink-soft); border:1px solid var(--line); border-radius:0; color:var(--paper); padding:10px; }.text-button { align-items:center; background:transparent; border:0; color:var(--signal-pale); display:flex; font:.65rem var(--mono); gap:7px; margin-top:7px; padding:5px 0; text-align:left; }.text-button svg { height:15px; width:15px; }.key-hint { border-top:1px solid var(--line); margin-top:19px; padding-top:14px; }.site-footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; padding:18px 0 28px; } @keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

button:disabled,select:disabled { cursor:not-allowed; opacity:.38; }
.is-discord-activity .app-shell { max-width:none; padding:0 24px; }
.is-discord-activity .app-bar,.is-discord-activity .site-footer,.is-discord-activity .stage-header { display:none; }
.is-discord-activity .room-view { padding-top:0; }
.is-discord-activity .watch-stage { min-height:0; }
.is-discord-activity .player-shell,.is-discord-activity .room-layout { max-width:none; }
.is-discord-activity .room-layout { margin-top:34px; }
.catalog-panel { border-top:1px solid var(--line); display:grid; gap:12px; margin-top:22px; padding-top:20px; }
.episode-list,.dub-list { display:flex; flex-wrap:wrap; gap:6px; }
.episode-choice,.dub-choice { background:transparent; border:1px solid var(--line); color:var(--paper-soft); font:.62rem var(--mono); min-height:31px; padding:7px 9px; transition:border-color .2s ease,background .2s ease,color .2s ease; }
.episode-choice:hover,.dub-choice:hover { border-color:var(--signal-pale); color:var(--paper); }
.episode-choice.is-active,.dub-choice.is-active { background:var(--signal); border-color:var(--signal); color:var(--ink); }
.dub-choice { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }