:root{--bg: #0b1220;--bg-elevated: #131c31;--bg-panel: rgba(19, 28, 49, .72);--border: rgba(148, 163, 184, .16);--border-strong: rgba(148, 163, 184, .32);--text: #e8eefc;--text-dim: #9aa8c2;--accent: #38bdf8;--accent-strong: #0ea5e9;--accent-2: #818cf8;--success: #34d399;--warning: #fbbf24;--danger: #f87171;--radius: 16px;--radius-sm: 12px;--shadow: 0 12px 40px rgba(2, 6, 23, .45);--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;font-family:var(--font)}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.35) transparent}html,body,#root{height:100%;margin:0}body{color:var(--text);-webkit-font-smoothing:antialiased;background:radial-gradient(1000px 520px at 12% -8%,rgba(56,189,248,.14),transparent 60%),radial-gradient(900px 480px at 92% -4%,rgba(129,140,248,.13),transparent 55%),radial-gradient(900px 620px at 50% 112%,rgba(16,185,129,.08),transparent 60%),var(--bg)}::selection{background:#38bdf859}button{font:inherit;cursor:pointer;border:none;border-radius:12px;padding:.65rem 1.2rem;background:linear-gradient(135deg,#38bdf8,#6366f1);color:#fff;font-weight:600;letter-spacing:.01em;box-shadow:0 6px 18px #38bdf838;transition:filter .15s ease,transform .12s ease,box-shadow .15s ease}button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 9px 22px #38bdf84d}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}button.secondary{background:#94a3b81f;color:var(--text);border:1px solid var(--border-strong);box-shadow:none}button.secondary:hover:not(:disabled){border-color:var(--accent);filter:none;box-shadow:none}button.danger{background:linear-gradient(135deg,#fb7185,#ef4444);color:#fff;box-shadow:0 6px 18px #f8717138}input,textarea,select{font:inherit;color:var(--text);background:#02061773;border:1px solid var(--border-strong);border-radius:12px;padding:.65rem .9rem;transition:border-color .15s ease,box-shadow .15s ease}input::placeholder,textarea::placeholder{color:#9aa8c2bf}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #38bdf82e}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}select{cursor:pointer}h1,h2,h3{margin:0 0 .5rem;font-weight:800;letter-spacing:-.01em}h4{font-weight:700}p{margin:.35rem 0;line-height:1.55}hr{border:none;border-top:1px solid var(--border);margin:1rem 0}code{font-family:ui-monospace,Cascadia Mono,Consolas,monospace;background:#38bdf81f;color:var(--accent);padding:.1rem .45rem;border-radius:6px;font-weight:700;letter-spacing:.08em}a{color:var(--accent)}.app-shell{min-height:100%;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1.25rem;border-bottom:1px solid var(--border);background:#0b1220c7;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.app-header.in-match{position:static;backdrop-filter:none;-webkit-backdrop-filter:none;background:#0b1220eb}.app-header .brand{display:flex;align-items:center;gap:.6rem;font-weight:800;color:var(--text);text-decoration:none;font-size:1.02rem;letter-spacing:-.01em}.brand-mark{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:.95rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 4px 14px #38bdf859}.app-header nav{display:flex;gap:.4rem;align-items:center}.app-header nav a{color:var(--text-dim);text-decoration:none;font-size:.92rem;font-weight:600;padding:.35rem .8rem;border-radius:999px;transition:color .15s ease,background .15s ease}.app-header nav a:hover{color:var(--text);background:#94a3b81a}.app-header nav a.active{color:var(--accent);background:#38bdf824}.nick-chip{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-weight:600;color:var(--text);background:#94a3b81f;border:1px solid var(--border);padding:.3rem .7rem;border-radius:999px}.socket-dot{width:9px;height:9px;border-radius:50%;background:var(--danger);box-shadow:0 0 0 3px #f871712e;margin-left:.35rem}.socket-dot.on{background:var(--success);box-shadow:0 0 0 3px #34d3992e}.page{flex:1;width:min(960px,100%);margin:0 auto;padding:1.5rem 1rem 3rem;display:flex;flex-direction:column;gap:1rem}.center-page{display:grid;place-items:center;min-height:100%;padding:1rem}.card{background:var(--bg-panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius);padding:1.35rem 1.4rem;box-shadow:var(--shadow)}.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:.75rem;align-items:stretch}.muted{color:var(--text-dim)}.small{font-size:.85rem}.error-text{color:var(--danger);font-size:.9rem;font-weight:600}.success-text{color:var(--success);font-size:.95rem;font-weight:600}.auth-card{width:min(440px,100%);padding:2rem 1.75rem;text-align:center}.auth-badge{width:58px;height:58px;margin:0 auto .9rem;border-radius:18px;display:grid;place-items:center;font-size:1.6rem;background:linear-gradient(135deg,#38bdf833,#818cf833);border:1px solid rgba(56,189,248,.4);box-shadow:0 8px 24px #38bdf82e}.auth-card .stack{margin-top:1.1rem;text-align:left}.hero{position:relative;overflow:hidden;padding:1.9rem 1.75rem 1.6rem}.hero:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--success))}.hero h1{font-size:clamp(1.45rem,3.4vw,1.95rem)}.hero-kicker{display:inline-block;font-size:.74rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);background:#38bdf81a;border:1px solid rgba(56,189,248,.3);padding:.3rem .7rem;border-radius:999px;margin-bottom:.85rem}.feature-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.chip{font-size:.82rem;font-weight:600;color:var(--text);background:#94a3b81a;border:1px solid var(--border);padding:.4rem .75rem;border-radius:999px}.home-lobby{padding-top:1.15rem}.home-actions{margin-top:.25rem}.lobby-state{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}.room-code{display:inline-block;font-size:1.55rem;letter-spacing:.32em;color:var(--accent);font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-weight:700;text-indent:.32em}.room-input{letter-spacing:.2em;text-transform:uppercase;width:180px}.lobby-actions{display:flex;gap:.75rem;flex-wrap:wrap}.lobby-form .error-text,.lobby-idle .error-text{margin-top:.6rem}.profile-hero{display:flex;align-items:center;gap:1.1rem}.profile-hero h1{margin-bottom:.15rem}.avatar-lg{width:60px;height:60px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:1.6rem;font-weight:800;color:#06121f;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 8px 22px #38bdf84d}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.9rem}.stat-tile{background:#94a3b812;border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem 1.1rem}.stat-label{color:var(--text-dim);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.stat-value{font-size:2.1rem;font-weight:800;line-height:1.25}.stat-value.accent{color:var(--accent)}.score-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}.score-list li{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:.7rem .15rem;border-bottom:1px solid var(--border)}.score-list li:last-child{border-bottom:none}.score-num{font-size:1.1rem;color:var(--accent)}.role-tag{display:inline-block;padding:.18rem .65rem;border-radius:999px;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.role-tag.examiner{color:var(--accent);background:#38bdf824;border:1px solid rgba(56,189,248,.55)}.role-tag.examinee{color:var(--success);background:#34d3991f;border:1px solid rgba(52,211,153,.5)}.match-page{display:flex;flex-direction:column;gap:1rem}.match-header{padding:.85rem 1.1rem}.match-header .row{justify-content:space-between}.match-meta{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;min-width:0}.peer-name{color:var(--text)}.ready-gate{text-align:center;padding:2.4rem 1.5rem}.ready-waiting{color:var(--warning);font-weight:600}.ready-status{display:inline-flex;align-items:center;justify-content:center;gap:.15rem;color:var(--text-dim);font-weight:600;margin:.4rem 0 0}.spinner{width:17px;height:17px;border-radius:50%;border:2.5px solid rgba(56,189,248,.25);border-top-color:var(--accent);animation:spin .8s linear infinite;display:inline-block;margin-right:.5rem}@keyframes spin{to{transform:rotate(360deg)}}.gate-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-top:.4rem}.stepper{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}.step{padding:.32rem .8rem;border-radius:999px;border:1px solid var(--border);background:#94a3b814;color:var(--text-dim);font-size:.82rem;font-weight:700;letter-spacing:.02em}.step.current{background:#38bdf824;border-color:#38bdf88c;color:var(--accent);box-shadow:0 0 0 3px #38bdf814}.step.done{background:#34d3991f;border-color:#34d39973;color:var(--success)}.examiner-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;align-items:start}.control-block,.card-chooser{display:flex;flex-direction:column;gap:.75rem}.card-option{border:1px solid var(--border);border-radius:var(--radius-sm);padding:.8rem .95rem;background:#94a3b80f;transition:border-color .15s ease}.card-option:hover{border-color:#38bdf873}.card-option p{margin:.3rem 0 .65rem}.question-bank section.q-section{border-left:3px solid transparent;padding-left:.75rem;margin:.75rem 0;opacity:.72;transition:opacity .15s ease,border-color .15s ease}.question-bank section.q-section.active{border-left-color:var(--accent);opacity:1}.question-bank h4{margin:0 0 .4rem}.question-bank ol,.question-bank ul{margin:.25rem 0;padding-left:1.2rem}.question-bank li{margin:.25rem 0;color:var(--text-dim);line-height:1.5}.q-card{border:1px solid var(--border);border-radius:var(--radius-sm);padding:.65rem .85rem;margin:.5rem 0;font-size:.92rem;background:#94a3b80d}.cue-card{border:1px solid rgba(56,189,248,.45);border-radius:var(--radius);background:linear-gradient(160deg,#38bdf81a,#818cf814 55%,#131c31eb);padding:1.15rem 1.3rem;box-shadow:var(--shadow)}.cue-card-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}.cue-badge{padding:.28rem .75rem;border-radius:999px;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.cue-badge.prep{background:#38bdf829;color:var(--accent);border:1px solid rgba(56,189,248,.55)}.cue-badge.talk{background:#34d39929;color:var(--success);border:1px solid rgba(52,211,153,.55)}.cue-prompt{margin-top:.8rem;font-size:1.15rem;line-height:1.4}.cue-lead{color:var(--text-dim);margin:.3rem 0}.cue-bullets{margin:.55rem 0;padding-left:1.2rem}.cue-bullets li{margin:.32rem 0;line-height:1.5}.countdown{position:relative;display:inline-grid;place-items:center;width:112px;height:112px}.countdown svg{grid-area:1 / 1}.countdown-track{stroke:var(--border-strong)}.countdown-fill{stroke:var(--accent);transition:stroke-dashoffset .25s linear}.countdown.urgent .countdown-fill{stroke:var(--danger)}.countdown-time{grid-area:1 / 1;font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums}.countdown.urgent .countdown-time{color:var(--danger)}.countdown-label{grid-area:1 / 1;align-self:end;margin-bottom:16px;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)}.examinee-panel,.status-block{display:flex;flex-direction:column;gap:.85rem}.part-chip{align-self:flex-start;padding:.28rem .8rem;border-radius:999px;background:#38bdf81f;border:1px solid rgba(56,189,248,.5);color:var(--accent);font-weight:700;font-size:.85rem}.notice{background:#fbbf241a;border:1px solid rgba(251,191,36,.5);color:var(--warning);border-radius:var(--radius-sm);padding:.7rem .9rem;font-weight:600}.talk-countdown{display:flex;justify-content:center;padding:.35rem 0}.followup-q{background:#818cf81a;border:1px solid rgba(129,140,248,.5);border-radius:var(--radius-sm);padding:.7rem .95rem}.followup-q p{margin:.25rem 0 0;font-weight:600;color:var(--text)}.followup-form{display:flex;flex-direction:column;gap:.5rem;border-top:1px solid var(--border);padding-top:.85rem}.followup-form input{flex:1;min-width:0}.scratchpad{display:flex;flex-direction:column;gap:.5rem;border-top:1px solid var(--border);padding-top:.85rem}.scratchpad textarea{resize:vertical;min-height:110px;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;font-size:.9rem;line-height:1.5}.score-dialog{border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem 1.1rem;background:#94a3b80f}.score-dialog h3{margin-bottom:.25rem}.score-dialog select{min-width:5.5rem;font-size:1.1rem;font-weight:700;color:var(--accent)}.results-view{text-align:center;padding:2.5rem 1.5rem}.results-list{list-style:none;padding:0;margin:1rem auto;max-width:500px;text-align:left;display:flex;flex-direction:column;gap:.6rem}.results-list li{display:flex;justify-content:space-between;gap:1rem;border:1px solid var(--border);border-radius:var(--radius-sm);padding:.75rem .95rem;background:#94a3b812;flex-wrap:wrap}.results-round{color:var(--accent);font-weight:800}.band-big{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.banner-danger{border-color:#f8717173;background:#f8717112;text-align:center;padding:2.5rem 1.5rem}.banner-danger h2{color:var(--danger)}@media(max-width:820px){.examiner-grid{grid-template-columns:1fr}.cue-card-head{justify-content:center}}.match-layout{display:flex;flex-direction:column;gap:1rem}.exam-col{min-width:0}@media(max-width:899px){.video-col{position:sticky;top:0;z-index:10;background:var(--bg);padding-bottom:.25rem}.video-main{max-height:40vh}}@media(max-width:899px)and (max-height:520px){.video-col{position:static}}@media(min-width:900px){.match-layout{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);align-items:start}.video-col{position:sticky;top:1rem}}.video-stage{display:flex;flex-direction:column;gap:.6rem}.video-main{position:relative;aspect-ratio:16 / 10;background:#000;border:1px solid var(--border-strong);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.video-self{position:absolute;right:10px;bottom:10px;width:32%;max-width:170px;min-width:110px;aspect-ratio:4 / 3;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden;box-shadow:0 6px 18px #00000080;z-index:2}.video-tile{position:absolute;top:0;right:0;bottom:0;left:0;background:#000}.video-el{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:block;background:#000}.video-tile.mirror .video-el{transform:scaleX(-1)}.video-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;color:var(--text-dim);font-size:.9rem;text-align:center;padding:1rem;background:linear-gradient(160deg,#111a2e,#0b1220)}.video-placeholder-avatar{width:56px;height:56px;border-radius:50%;background:#94a3b81f;border:1px solid var(--border-strong);display:grid;place-items:center;font-size:1.4rem;font-weight:700;color:var(--accent)}.video-label{position:absolute;left:8px;bottom:8px;background:#0000008c;color:#fff;font-size:.78rem;padding:.2rem .55rem;border-radius:999px;max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;z-index:1;pointer-events:none}.video-badges{position:absolute;top:8px;right:8px;display:flex;gap:.35rem;z-index:1}.badge{font-size:.72rem;padding:.15rem .5rem;border-radius:999px;background:#0009;color:#fff}.badge.warn{background:#f59e0b33;color:var(--warning);border:1px solid rgba(245,158,11,.5)}.video-unblock{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:max-content;height:max-content;padding:.6rem 1.2rem;border-radius:999px;border:1px solid rgba(56,189,248,.6);background:#0b1220eb;color:var(--accent);font-weight:600;font-size:.95rem;cursor:pointer;z-index:3}.media-controls{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.ctl{background:#94a3b81a;border:1px solid var(--border-strong);color:var(--text);padding:.48rem .9rem;border-radius:999px;cursor:pointer;font-size:.86rem;font-family:inherit;font-weight:600;box-shadow:none;transition:border-color .15s ease,background .15s ease,transform .12s ease}.ctl:hover:not(:disabled){border-color:var(--accent);background:#38bdf81f;transform:none;filter:none;box-shadow:none}.ctl.off{color:var(--warning);border-color:#fbbf248c;background:#fbbf2414}.ctl:disabled{opacity:.55;cursor:default}.conn-chip{font-size:.78rem;font-weight:600;padding:.28rem .7rem;border-radius:999px;border:1px solid var(--border-strong);color:var(--text-dim);background:#94a3b812}.conn-chip.ok{color:var(--success);border-color:#34d39980;background:#34d3991a}.conn-chip.busy{color:var(--warning);border-color:#fbbf2480;background:#fbbf2414}.conn-chip.bad{color:var(--danger);border-color:#f8717180;background:#f871711a}.conn-chip.idle{color:var(--text-dim)}.media-error{flex-basis:100%;margin:.2rem 0 0}@media(max-width:820px){.video-main{aspect-ratio:4 / 3}.video-self{width:30%;min-width:96px}}@media(max-width:640px){.app-header{padding:.6rem .8rem}.brand-text{font-size:.95rem}.nick-chip{display:none}.page{padding:1rem .75rem 2.5rem}.card{padding:1.1rem 1rem}.hero{padding:1.4rem 1.1rem 1.2rem}.ready-gate{padding:1.8rem 1rem}.room-code{font-size:1.3rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}