:root{color-scheme:dark;--bg: #08070c;--bg-2: #0d0b14;--panel: #141019;--panel-2: #1c1726;--elev: #221c30;--border: #2c2740;--border-soft: rgba(255, 255, 255, .06);--text: #f3f1f8;--muted: #948caa;--accent: #8b5cf6;--accent-strong: #a78bfa;--accent-dim: rgba(139, 92, 246, .14);--accent-2: #8b5cf6;--danger: #f2545b;--good: #1ed760;--radius: 14px;--radius-sm: 10px;--ring: 0 0 0 3px var(--accent-dim)}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{background:radial-gradient(1100px 520px at 50% -10%,rgba(139,92,246,.12),transparent 70%),var(--bg)}::selection{background:#8b5cf659;color:#fff}:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--radius-sm)}.app{max-width:880px;margin:0 auto;padding:32px 20px 80px;position:relative;z-index:0}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.title-wrap{display:flex;align-items:center;gap:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.app-icon{width:42px;height:42px;border-radius:12px;box-shadow:0 8px 24px -8px #8b5cf680;display:block}.title{font-size:26px;font-weight:800;letter-spacing:-.03em}.title span{color:var(--accent)}.rating-pill{background:var(--panel);border:1px solid var(--border-soft);border-radius:999px;padding:7px 8px;font-variant-numeric:tabular-nums;font-weight:600}.rating-pill small{color:var(--muted);font-weight:400;margin-right:6px}.card{background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 120px),var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:26px;box-shadow:0 1px #ffffff08 inset,0 24px 60px -32px #000c}.player-wrap{position:relative;background:#000;border-radius:12px;overflow:hidden;aspect-ratio:16 / 9;margin-bottom:16px}.player-wrap video{width:100%;height:100%;object-fit:cover}.player-cover{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#1a1f2e,#0d0f14);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px}.timer-bar{height:7px;background:var(--bg-2);border:1px solid var(--border-soft);border-radius:999px;overflow:hidden;margin-bottom:16px}.timer-bar>div{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-strong));box-shadow:0 0 12px -2px var(--accent);transition:width .1s linear}.input-row{position:relative}input[type=text]{width:100%;background:var(--bg-2);border:1px solid var(--border);color:var(--text);font-size:15px;padding:13px 15px;border-radius:var(--radius-sm);outline:none;transition:border-color .15s ease,box-shadow .15s ease}input[type=text]::placeholder{color:var(--muted)}input[type=text]:focus{border-color:var(--accent);box-shadow:var(--ring)}.autocomplete{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--panel-2);border:1px solid var(--border);border-radius:10px;max-height:280px;overflow-y:auto;z-index:10}.autocomplete .item{padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--border)}.autocomplete .item:last-child{border-bottom:none}.autocomplete .item:hover,.autocomplete .item.active{background:#7c5cff26}.autocomplete .year{color:var(--muted);font-size:12px;margin-left:6px}.button-row{display:flex;gap:10px;margin-top:16px}.img-btn-row{align-items:center;justify-content:center}.img-btn-row.solo{justify-content:center}.img-btn{flex:0 0 auto;display:block;width:clamp(120px,15vw,160px);aspect-ratio:2.5 / 1;padding:0;background:none;border:none;cursor:pointer;transition:transform .14s ease,filter .14s ease;filter:drop-shadow(0 5px 10px rgba(0,0,0,.4))}.img-btn img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.img-btn:hover:not(:disabled){transform:scale(1.08);z-index:1;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--accent) 60%,transparent)) drop-shadow(0 12px 20px rgba(0,0,0,.5))}.img-btn:active:not(:disabled){transform:scale(.97)}.img-btn:disabled{opacity:.45;cursor:not-allowed;filter:drop-shadow(0 4px 8px rgba(0,0,0,.35)) grayscale(.15)}.img-btn-row.solo .img-btn{width:clamp(150px,20vw,200px)}button{flex:1;background:var(--accent);color:#fff;border:1px solid transparent;border-radius:var(--radius-sm);padding:13px 16px;font-size:15px;font-weight:700;letter-spacing:.01em;cursor:pointer;transition:transform .06s ease,filter .15s ease,background .15s ease,border-color .15s ease}button:hover:not(:disabled){filter:brightness(1.08)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:not-allowed}button.secondary{background:var(--panel-2);border:1px solid var(--border);color:var(--text)}button.secondary:hover:not(:disabled){border-color:var(--accent);filter:none;background:var(--elev)}button.danger{background:transparent;color:var(--danger);border:1px solid var(--border)}button.danger:hover:not(:disabled){border-color:var(--danger);background:#f2545b1a;filter:none}.result{margin-top:16px;padding:16px;border-radius:12px;background:var(--panel-2);border:1px solid var(--border)}.result.correct{border-color:var(--good)}.result.wrong{border-color:var(--danger)}.result h3{margin:0 0 8px}.result .delta-pos{color:var(--good)}.result .delta-neg{color:var(--danger)}.result .answer{font-size:18px;font-weight:600}.result-body{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.result-info{flex:1;min-width:0}.result-yuzu-wrap{position:relative;flex-shrink:0;margin-right:12px;width:140px;align-self:flex-start}.result-yuzu{display:block;width:100%;height:auto;max-height:150px;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 6px 16px rgba(0,0,0,.35))}.result-yuzu-bubble{position:absolute;top:-8px;right:100%;width:72%;max-height:50%;height:auto;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.3))}@media (max-width: 720px){.result-yuzu-wrap{width:96px;margin-right:8px}.result-yuzu{max-height:110px}.result-yuzu-bubble{top:-6px;right:100%;width:78%;max-height:48%}}.history{margin-top:32px;background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:18px 18px 6px}.history h3{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em;margin:0 0 10px}.history-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 12px;margin-bottom:4px;border:1px solid color-mix(in srgb,var(--rank, var(--accent)) 28%,transparent);border-left:3px solid color-mix(in srgb,var(--rank, var(--accent)) 80%,transparent);font-size:14px;border-radius:8px;background:linear-gradient(90deg,color-mix(in srgb,var(--rank, var(--accent)) 20%,var(--panel)),color-mix(in srgb,var(--rank, var(--accent)) 7%,var(--panel)))}.history-row:last-child{margin-bottom:0}.history-row:hover{background:linear-gradient(90deg,color-mix(in srgb,var(--rank, var(--accent)) 30%,var(--panel)),color-mix(in srgb,var(--rank, var(--accent)) 12%,var(--panel)))}.lb-ava{flex-shrink:0;width:32px;height:32px;border-radius:50%;object-fit:cover;border:1.5px solid color-mix(in srgb,var(--rank, var(--accent)) 50%,transparent);background:var(--panel-2)}.history-row .name{flex:1;min-width:0;color:color-mix(in srgb,var(--rank, var(--accent)) 70%,#ffffff);font-weight:700}.history-row .meta{color:#ffffffb3;font-variant-numeric:tabular-nums;font-size:13px}.footer-note{margin-top:24px;color:var(--muted);font-size:12px;text-align:center}.footer-note a{color:var(--muted)}.notice{background:var(--accent-dim);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);color:var(--text);border-radius:var(--radius-sm);padding:11px 14px;margin-bottom:16px;font-size:14px;text-align:center}.vs-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px}.vs-side{flex:1}.vs-side:last-child{text-align:right}.vs-label{color:var(--muted);font-size:11px;letter-spacing:.08em}.vs-name{font-weight:700;font-size:16px}.vs-elo{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}.vs-mid{color:var(--muted);font-size:13px;white-space:nowrap}.player-cover.tap-to-play{cursor:pointer;font-size:18px;font-weight:700;color:var(--text);background:linear-gradient(135deg,#2a2150,#0d0f14)}.player-cover.tap-to-play:hover{color:var(--accent)}.player-cover.countdown{font-size:64px;font-weight:800;color:var(--text);letter-spacing:.05em}.pulse{color:var(--text);font-size:18px;font-weight:600;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.45}50%{opacity:1}}.opp-status{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-size:13px;color:var(--muted);margin-bottom:10px;text-align:center}.rematch{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}.rematch-q{font-weight:600;margin-bottom:6px}.vote-state{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;white-space:pre-wrap}.result .year{color:var(--muted);font-weight:400;font-size:14px}.rating-pill{display:flex;align-items:center;gap:6px}.rating-pill .avatar{width:22px;height:22px;border-radius:50%;object-fit:cover}.rating-pill .signout{flex:none;background:transparent;border:none;color:var(--muted);font-size:14px;padding:0 2px;margin-left:4px;cursor:pointer}.rating-pill .signout:hover{color:var(--danger)}.av-bar{display:flex;align-items:center;gap:8px;margin-bottom:12px}.av-btn{flex:none;background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer}.av-btn.on{background:var(--accent);border-color:var(--accent);color:#fff}.av-peer{color:var(--muted);font-size:12px;margin-left:auto}.player-wrap .player-cam{position:absolute;top:0;right:0;bottom:0;left:0}.player-wrap .cam-remote{width:100%;height:100%;object-fit:cover;background:#000}.player-wrap .cam-remote.empty{background:#0d0f14}.player-wrap .cam-local{position:absolute;right:10px;bottom:10px;width:26%;max-width:160px;height:auto;border-radius:8px;border:1px solid var(--border);background:#000;object-fit:cover;transform:scaleX(-1)}.player-wrap .dub-float{position:absolute;top:10px;left:10px;margin-left:0}.name-editor{max-width:360px;margin:18px auto 0;text-align:left}.name-editor label{display:block;color:var(--muted);font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}.name-row,.invite-row{display:flex;gap:8px}.name-row input,.invite-row input{flex:1;min-width:0}.name-row button,.invite-row button{flex:none;width:auto;padding:0 16px}.invite-row{max-width:460px;margin:16px auto 0}.volume-row{display:flex;align-items:center;gap:10px;margin-bottom:16px}.volume-row .vol-icon{cursor:pointer;font-size:18px;-webkit-user-select:none;user-select:none;line-height:1}.volume-row input[type=range]{flex:1;accent-color:var(--accent);cursor:pointer}.volume-row .vol-pct{color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;min-width:34px;text-align:right}.dub-badge{display:inline-block;margin-left:10px;padding:2px 8px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em}.hero{text-align:center;padding:40px 16px 36px}.hero-title{font-size:52px;font-weight:800;letter-spacing:-.03em;line-height:1}.hero-title span{color:var(--accent)}.hero-sub{margin-top:14px;color:var(--muted);font-size:17px;font-weight:500}.hero-note{margin-top:16px;color:var(--muted);font-size:13px}.gsign{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:auto;margin:28px auto 0;padding:12px 22px;background:#fff;color:#1f2533;border:none;border-radius:999px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 6px 20px #7c5cff40;transition:transform .08s ease,box-shadow .2s ease}.gsign:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 26px #7c5cff66}.gsign:disabled{opacity:.6;cursor:progress}.gsign-g{width:18px;height:18px}.guest-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:fit-content;margin:12px auto 0;padding:12px 22px;background:var(--accent);color:#fff;border:none;border-radius:999px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 6px 20px #8b5cf659;transition:transform .08s ease,box-shadow .2s ease,filter .14s ease;flex:none}.guest-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 26px #8b5cf680;filter:brightness(1.06)}.guest-btn:disabled{opacity:.55;cursor:not-allowed}.avatar-fallback{display:inline-flex;align-items:center;justify-content:center;background:var(--panel-2);color:var(--text);font-weight:700}.rating-pill .pill-info{display:flex;flex-direction:column;line-height:1.2}.rating-pill .pill-name{font-size:13px;font-weight:600}.rank-badge{font-size:11px;font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}.lb-title{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;vertical-align:middle;background:var(--rank, var(--accent));color:#0a0712;border:1px solid color-mix(in srgb,var(--rank, var(--accent)) 55%,#000);box-shadow:0 1px 8px -2px color-mix(in srgb,var(--rank, var(--accent)) 70%,transparent)}.lb-title-king{background:linear-gradient(180deg,#ffe89e,#f5b301);color:#2a1e00;border-color:#f5b301;box-shadow:0 0 14px -3px #f5b301}.lb-title-block{display:inline-block;margin:8px 0 0}.vs-card{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0 0 16px;overflow:hidden;border-radius:var(--radius);background:linear-gradient(180deg,color-mix(in srgb,var(--rank, var(--accent)) 18%,var(--panel)),color-mix(in srgb,var(--rank, var(--accent)) 8%,#0a0810));border:1px solid color-mix(in srgb,var(--rank, var(--accent)) 72%,transparent);box-shadow:0 18px 40px -28px #000000e6;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6)}.vs-rankbar{width:100%;padding:3px 8px 6px;min-height:70px;background:transparent;border-bottom:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column;align-items:center}.vs-eyebrow{color:#ffffffc7;font-size:10px;letter-spacing:.16em;flex-shrink:0}.vs-rankname{color:var(--rank, var(--accent));font-size:14px;font-weight:800;letter-spacing:.01em;text-align:center;word-spacing:9999px;line-height:1.15;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-shadow:0 0 16px color-mix(in srgb,var(--rank, var(--accent)) 75%,transparent),0 1px 3px rgba(0,0,0,.7)}.vs-ava-wrap{width:56px;height:56px;border-radius:50%;padding:2px;background:var(--rank, var(--accent));margin:14px 0 4px;box-shadow:0 0 16px -2px color-mix(in srgb,var(--rank, var(--accent)) 75%,transparent)}.vs-ava{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;font-size:22px}.vs-card .vs-name{font-weight:700;font-size:15px;text-align:center;color:#fff}.vs-card .vs-elo{color:#ffffffd9;font-size:13px;font-variant-numeric:tabular-nums}.match-stage{position:relative;display:flex;align-items:stretch;justify-content:center;gap:12px;margin-bottom:12px;overflow:hidden;border-radius:16px}.stage-side{flex:0 0 132px;display:flex}.stage-side .vs-card{flex:1;width:100%;justify-content:center;padding-bottom:12px}.stage-center{flex:1 1 auto;min-width:0}.stage-center .player-wrap{margin-bottom:0}.round-tag{text-align:center;color:var(--muted);font-size:12px;letter-spacing:.06em;margin:0 0 14px;min-height:1em}.match-stage.curtained{gap:0}.match-stage.curtained .stage-side{flex-basis:50%}.match-stage.curtained .stage-center{opacity:0}.match-stage.curtained .stage-left .vs-card{border-right-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}.match-stage.curtained .stage-right .vs-card{border-left-color:transparent;border-top-left-radius:0;border-bottom-left-radius:0}.match-stage:not(.curtained){transition:gap .8s cubic-bezier(.76,0,.24,1) .4s}.match-stage:not(.curtained) .stage-side{transition:flex-basis .8s cubic-bezier(.76,0,.24,1) .4s}.match-stage:not(.curtained) .stage-center{transition:opacity .8s cubic-bezier(.76,0,.24,1) .4s}.match-stage:not(.curtained) .stage-left .vs-card{transition:border-right-color .8s cubic-bezier(.76,0,.24,1) .4s,border-top-right-radius .8s cubic-bezier(.76,0,.24,1) .4s,border-bottom-right-radius .8s cubic-bezier(.76,0,.24,1) .4s}.match-stage:not(.curtained) .stage-right .vs-card{transition:border-left-color .8s cubic-bezier(.76,0,.24,1) .4s,border-top-left-radius .8s cubic-bezier(.76,0,.24,1) .4s,border-bottom-left-radius .8s cubic-bezier(.76,0,.24,1) .4s}@media (max-width: 620px){.match-stage{gap:7px}.stage-side{flex-basis:92px}.stage-side .vs-rankname{font-size:12px}.stage-side .vs-ava-wrap{width:40px;height:40px}.stage-side .vs-card .vs-name{font-size:12px}}.lobby-id{margin-bottom:18px}.lobby-ava{position:relative;width:84px;height:84px;margin:0 auto;border-radius:50%;cursor:pointer;padding:3px;background:var(--accent)}.lobby-ava img,.lobby-ava .avatar-fallback{width:100%;height:100%;border-radius:50%;object-fit:cover;font-size:32px}.lobby-ava-edit{position:absolute;right:0;bottom:0;width:26px;height:26px;border-radius:50%;background:var(--panel-2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:13px}.lobby-ava:hover .lobby-ava-edit{color:var(--accent)}.link-btn{flex:none;width:auto;background:none;border:none;color:var(--muted);font-size:13px;text-decoration:underline;cursor:pointer;margin:22px auto 0;display:block}.link-btn:hover{color:var(--accent)}.stats{margin-top:18px;text-align:left;border-top:1px solid var(--border);padding-top:16px}.stats-aki{display:block;margin:0 auto 12px;width:clamp(140px,28vh,220px);height:auto;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 8px 18px rgba(0,0,0,.32))}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stat{background:var(--panel-2);border:1px solid var(--border);border-radius:12px;padding:12px 8px;text-align:center}.stat-n{display:block;font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}.stat-l{display:block;color:var(--muted);font-size:11px;margin-top:2px}.stats h3{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin:18px 0 8px}.muted-row{color:var(--muted);font-size:14px;padding:8px 0}.match-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px}.match-row:last-child{border-bottom:none}.m-res{flex:none;width:46px;text-align:center;font-size:11px;font-weight:800;border-radius:6px;padding:3px 0}.m-res.win{background:#4ec9b02e;color:var(--good)}.m-res.loss{background:#ff6b6b29;color:var(--danger)}.m-res.draw{background:#ffbf2429;color:#fbbf24}.m-res.nc{background:#ffffff14;color:#ffffff8c}.m-anime{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.m-opp{color:var(--muted);font-size:12px}.match-row .delta-pos{color:var(--good);font-variant-numeric:tabular-nums}.match-row .delta-neg{color:var(--danger);font-variant-numeric:tabular-nums}.rankup-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#08090db8;animation:fade-in .25s ease;cursor:pointer}.rankup-card{text-align:center;padding:36px 56px;border-radius:20px;background:radial-gradient(circle at 50% 0%,rgba(124,92,255,.25),var(--panel));border:1px solid var(--rank, var(--accent));box-shadow:0 0 60px -10px var(--rank, var(--accent));animation:rankup-pop .6s cubic-bezier(.16,1,.3,1)}.rankup-label{color:var(--muted);font-size:14px;letter-spacing:.34em;font-weight:700}.rankup-name{font-size:40px;font-weight:800;margin:8px 0 6px;letter-spacing:-.02em;animation:rankup-glow 1.4s ease-in-out infinite alternate}.rankup-sub{color:var(--muted);font-size:12px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes rankup-pop{0%{transform:scale(.6) translateY(20px);opacity:0}60%{transform:scale(1.06);opacity:1}to{transform:scale(1)}}@keyframes rankup-glow{0%{filter:brightness(1);text-shadow:0 0 0 transparent}to{filter:brightness(1.25);text-shadow:0 0 22px var(--rank, var(--accent))}}.user-menu{position:relative;flex:none}.user-menu .rating-pill{flex:none;width:auto;display:flex;align-items:center;gap:8px;cursor:pointer;background:var(--panel);color:var(--text);border:1px solid var(--border-soft);border-radius:999px;padding:6px 12px 6px 7px;font-weight:600}.user-menu .rating-pill:hover:not(:disabled){filter:none;background:var(--panel-2);border-color:color-mix(in srgb,var(--accent) 45%,var(--border-soft))}.pill-caret{color:var(--muted);font-size:11px;margin-left:2px}.menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40}.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:41;min-width:196px;display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--panel);border:1px solid var(--border-soft);border-radius:12px;box-shadow:0 20px 48px -18px #000000d9}.user-dropdown button{flex:none;width:100%;text-align:left;background:transparent;color:var(--text);border:none;border-radius:8px;padding:10px 12px;font-size:14px;font-weight:600;cursor:pointer}.user-dropdown button:hover:not(:disabled){filter:none;background:var(--panel-2)}.user-dropdown .dd-danger{color:var(--danger)}.user-dropdown .dd-danger:hover:not(:disabled){background:#f2545b1f}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:#040308b8}.modal{width:100%;max-width:460px;max-height:86vh;overflow-y:auto;background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:22px;box-shadow:0 30px 70px -26px #000000d9}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.modal-head h3{margin:0;font-size:18px}.modal-x{flex:none;width:32px;height:32px;padding:0;border-radius:8px;background:var(--panel-2);border:1px solid var(--border-soft);color:var(--muted);cursor:pointer;font-size:13px}.modal-x:hover:not(:disabled){filter:none;color:var(--text);background:var(--elev)}.profile-ava{display:flex;justify-content:center;margin-bottom:18px}.modal .name-editor{margin:0}.lobby{text-align:center;padding:8px 0 4px}.lobby-ava-ro{cursor:default}.play-stage{display:flex;flex-direction:column;align-items:center;margin:6px auto 0}.play-stage .nyalea{display:block;width:clamp(220px,30vh,330px);height:auto;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 0 32px rgba(139,92,246,.36)) drop-shadow(0 14px 22px rgba(0,0,0,.45))}.play-actions{display:flex;align-items:center;justify-content:center;gap:0;margin-top:-4px}.play-art{flex:none;width:auto;margin:0;padding:0;background:none;border:none;cursor:pointer;transition:transform .14s ease,filter .14s ease;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}.play-art img{display:block;height:clamp(56px,8.1vh,92px);width:auto}.play-art:hover:not(:disabled){transform:scale(1.07);z-index:1;filter:drop-shadow(0 0 24px color-mix(in srgb,var(--accent) 60%,transparent)) drop-shadow(0 12px 20px rgba(0,0,0,.5))}.play-art:disabled{opacity:.5;cursor:not-allowed}.queue-screen{text-align:center;padding:6px 0 24px}.queue-figure{position:relative;width:clamp(320px,58vh,520px);aspect-ratio:1920 / 1320;margin:0 auto}.invite-hina-wrap{position:relative;display:block;margin:20px auto 8px;width:clamp(220px,30vh,330px)}.invite-hina{display:block;width:100%;height:auto;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 0 22px rgba(245,158,11,.22)) drop-shadow(0 10px 18px rgba(0,0,0,.35))}.invite-hina-bubble{position:absolute;top:-4%;right:-14%;width:56%;height:auto;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 4px 12px rgba(0,0,0,.38))}@media (max-width: 720px){.invite-hina-bubble{right:-8%;top:-2%;width:52%}}.queue-figure .qm{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .45s ease;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 0 26px rgba(139,92,246,.3)) drop-shadow(0 12px 20px rgba(0,0,0,.4))}.queue-figure .qm.on{opacity:1}.found-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:55;display:flex;align-items:center;justify-content:center;padding:16px;background:#08070cc7;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);transform:translateY(0);transition:transform .5s cubic-bezier(.45,0,.25,1);will-change:transform}.found-overlay.lift{transform:translateY(-100%)}.side-midori{position:fixed;top:clamp(180px,28vh,360px);left:calc((100vw - 880px)/4);transform:translate(-50%,-50%);width:clamp(110px,calc((100vw - 880px)/2 - 80px),200px);height:auto;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;z-index:30;filter:drop-shadow(0 8px 18px rgba(0,0,0,.4)) drop-shadow(0 0 22px rgba(74,222,128,.2));animation:midoriFadeIn .6s ease-out both}@media (max-width: 1220px){.side-midori{display:none}}@keyframes midoriFadeIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.yui-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:54;display:flex;align-items:center;justify-content:center;padding:24px;background:#08070c73;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);pointer-events:none;animation:yuiFlash .75s ease-out both}.yui-figure{display:block;width:clamp(220px,36vh,380px);height:auto;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 0 24px rgba(94,158,230,.28)) drop-shadow(0 14px 24px rgba(0,0,0,.45))}@keyframes yuiFlash{0%{opacity:0}20%{opacity:1}to{opacity:0}}.found-figure{position:relative;width:clamp(320px,58vh,520px);aspect-ratio:1920 / 1320}.found-figure .found-kitsune{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 0 30px rgba(139,92,246,.32)) drop-shadow(0 14px 24px rgba(0,0,0,.45))}.found-bubble{position:absolute;top:8%;right:70%;width:26%;height:auto;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 6px 14px rgba(0,0,0,.4));animation:bubblePop .45s cubic-bezier(.34,1.56,.64,1) both}@keyframes bubblePop{0%{transform:scale(.4) rotate(-10deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.queue-cancel{display:block;margin:14px auto 0;flex:none;width:auto;padding:0;background:none;border:none;cursor:pointer;transition:transform .14s ease,filter .14s ease;filter:drop-shadow(0 6px 12px rgba(0,0,0,.4))}.queue-cancel img{display:block;width:clamp(110px,13vh,150px);height:auto}.queue-cancel:hover:not(:disabled){filter:drop-shadow(0 0 16px color-mix(in srgb,var(--danger) 55%,transparent)) drop-shadow(0 8px 14px rgba(0,0,0,.5));transform:scale(1.06)}.queue-cancel.is-hidden{visibility:hidden;pointer-events:none}
