:root{--bg: #eef8fa;--bg-subtle: #ffffff;--surface: #e9f4f6;--surface-hover: #ddeef2;--surface-active: #cfe6eb;--border: #d8eaee;--border-strong: #afd2da;--glass: rgba(255, 255, 255, .72);--text: #0c2f38;--text-muted: #52757f;--text-faint: #7f9ea7;--green: #2f9e68;--green-strong: #248a58;--green-soft: #e8f6ee;--red: #dc3d43;--red-strong: #c32b31;--red-soft: #fdecec;--mine: #f5a524;--mine-soft: #fff5e0;--mine-text: #8a5300;--other: #cf9a4e;--other-soft: #f8f0e1;--other-text: #7d5a1e;--accent: #0e7490;--accent-hover: #155e75;--accent-soft: #dff3f8;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-6: 24px;--sp-8: 32px;--r-sm: 6px;--r-md: 12px;--r-lg: 20px;--r-full: 9999px;--shadow-sm: 0 1px 2px rgba(8, 62, 78, .06);--shadow-md: 0 6px 16px rgba(8, 62, 78, .08);--shadow-lg: 0 20px 48px -12px rgba(8, 62, 78, .2);--dur-fast: .1s;--dur-base: .2s;--ease-out: cubic-bezier(.16, 1, .3, 1);--fs-xs: 12px;--fs-sm: 14px;--fs-base: 16px;--fs-lg: 20px;--fs-xl: 24px;--fs-2xl: 30px;--header-h: 56px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:radial-gradient(1100px 560px at 85% -8%,rgba(125,226,245,.2),transparent 62%),radial-gradient(900px 520px at 8% 108%,rgba(45,212,191,.14),transparent 60%),linear-gradient(180deg,#f4fcfd,#e9f5f8);background-color:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic UI,Meiryo,sans-serif;font-size:var(--fs-base);line-height:1.7}h1,h2,h3{line-height:1.3;margin:0}.num{font-variant-numeric:tabular-nums}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);font:inherit;font-size:var(--fs-sm);font-weight:600;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;text-decoration:none;transition:background var(--dur-fast),border-color var(--dur-fast),transform var(--dur-fast)}button:hover:not(:disabled):not(.buzzer),.button:hover{background:var(--surface-hover);border-color:var(--border-strong)}button:active:not(:disabled):not(.buzzer){transform:translateY(1px)}button:disabled{color:var(--text-faint);background:var(--bg-subtle);cursor:not-allowed}button.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover:not(:disabled),.button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}button.danger{color:var(--red-strong);border-color:var(--border-strong)}button.danger:hover:not(:disabled){background:var(--red-soft);border-color:var(--red)}.icon-button{padding:var(--sp-2);width:36px;height:36px;font-size:var(--fs-base);background:transparent;border-color:transparent}input,select{padding:var(--sp-2) var(--sp-3);font:inherit;font-size:var(--fs-sm);color:var(--text);background:#fff;border:1px solid var(--border-strong);border-radius:var(--r-sm)}label{display:block;font-size:var(--fs-sm);color:var(--text-muted)}label input,label select{display:block;margin-top:var(--sp-1);width:100%}.error{margin:var(--sp-2) 0 0;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-sm);color:var(--red-strong);background:var(--red-soft);border:1px solid var(--red);border-radius:var(--r-sm)}.hint{color:var(--text-muted);font-size:var(--fs-sm)}.card{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-4)}.page{max-width:480px;margin:0 auto;padding:var(--sp-8) var(--sp-4)}.page h1{font-size:var(--fs-2xl);margin-bottom:var(--sp-2)}.page form{display:flex;flex-direction:column;gap:var(--sp-4);margin-top:var(--sp-6)}.page form button[type=submit]{padding:var(--sp-3) var(--sp-4);font-size:var(--fs-base)}.top-page{text-align:center;padding-top:16vh}.top-page h1{font-size:56px;letter-spacing:.14em;background:linear-gradient(135deg,#0891b2 20%,#14b8a6 80%);-webkit-background-clip:text;background-clip:text;color:transparent}.top-page .tagline{margin:var(--sp-3) 0 var(--sp-2);font-size:var(--fs-lg);color:var(--text);letter-spacing:.06em}.top-page .lead{color:var(--text-muted);font-size:var(--fs-sm);margin-bottom:var(--sp-8)}.top-page .button.primary{width:100%;padding:var(--sp-3) var(--sp-4);font-size:var(--fs-base)}.top-page .divider{margin:var(--sp-6) 0 var(--sp-4);color:var(--text-faint);font-size:var(--fs-sm)}.top-page form{flex-direction:row;gap:var(--sp-2)}.top-page form input{flex:1;text-align:center;font-size:var(--fs-lg);letter-spacing:.15em;text-transform:uppercase}.status-page{padding-top:20vh;text-align:center;color:var(--text-muted)}.room{display:flex;flex-direction:column;height:100%}.topbar{flex:0 0 auto;display:flex;align-items:center;gap:var(--sp-3);height:var(--header-h);padding:0 var(--sp-4);background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm);z-index:1}.topbar .room-code{font-size:var(--fs-lg);font-weight:700;letter-spacing:.08em}.topbar .spacer{flex:1}.badge{padding:2px var(--sp-2);font-size:var(--fs-xs);font-weight:600;color:var(--text-muted);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-full);white-space:nowrap}.host-chip{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-1) var(--sp-1) var(--sp-3);font-size:var(--fs-sm);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-full);white-space:nowrap}.host-chip.vacant{border-color:var(--mine);background:var(--mine-soft);color:var(--mine-text)}.host-chip .label{color:var(--text-muted);font-size:var(--fs-xs)}.host-chip button{padding:2px var(--sp-3);font-size:var(--fs-xs);border-radius:var(--r-full)}.me-chip{font-size:var(--fs-sm);color:var(--text-muted);white-space:nowrap}.room-main{flex:1 1 auto;overflow-y:auto;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-4)}.room-main-inner{width:100%;max-width:900px;margin:0 auto;display:flex;flex-direction:column;gap:var(--sp-4)}.controller{flex:0 0 auto;padding:var(--sp-3) var(--sp-4);background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border-top:1px solid var(--border);box-shadow:0 -2px 12px #083e4e0f}.controller-inner{width:100%;max-width:900px;margin:0 auto}.active-banner{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-4);background:var(--other-soft);border:1px solid var(--other);border-radius:var(--r-md)}.active-banner .who{font-size:var(--fs-base);font-weight:600;color:var(--other-text)}.active-banner .label{font-size:var(--fs-xs);color:var(--other-text)}.active-banner.is-mine{padding:var(--sp-4);background:var(--mine-soft);border:2px solid var(--mine);animation:buzz-in .6s var(--ease-out)}.active-banner.is-mine .who{font-size:var(--fs-2xl);font-weight:800;color:var(--mine-text)}.active-banner.is-mine .label{font-size:var(--fs-sm);font-weight:700;color:var(--mine-text)}@keyframes buzz-in{0%{box-shadow:0 0 #f5a5248c}to{box-shadow:0 0 0 22px #f5a52400}}.section-title{font-size:var(--fs-xs);font-weight:700;letter-spacing:.08em;color:var(--text-faint);text-transform:uppercase}.queue{list-style:none;margin:var(--sp-2) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.queue li{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-sm);box-shadow:var(--shadow-sm)}.queue li.is-active{border-color:var(--other);background:var(--other-soft)}.queue li.is-active.is-mine{border-color:var(--mine);background:var(--mine-soft);font-weight:700}.queue li.is-wrong{color:var(--text-faint)}.queue li.is-wrong .name{text-decoration:line-through}.queue .order{width:22px;height:22px;display:grid;place-items:center;font-size:var(--fs-xs);font-weight:700;background:var(--surface);border-radius:var(--r-full)}.queue li.is-active .order{background:var(--other);color:#fff}.queue li.is-active.is-mine .order{background:var(--mine);color:#fff}.queue .name{flex:1}.queue .tag{font-size:var(--fs-xs);color:var(--red-strong)}.delay-tag{font-size:var(--fs-xs);color:var(--other-text)}.score-card .board-answer-row{padding:var(--sp-1) var(--sp-2);background:var(--surface);border-radius:var(--r-sm)}.score-card .board-answer{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.score-card .board-answer-row.is-preview{background:transparent;border:1px dashed var(--border-strong)}.score-card .vacant{color:var(--text-faint)}.score-card .board-status{margin-left:auto;flex-shrink:0;padding:2px var(--sp-2);font-size:var(--fs-xs);font-weight:700;border-radius:var(--r-full);white-space:nowrap}.score-card .board-status.is-written{color:#fff;background:var(--accent);border:1px solid var(--accent)}.score-card .board-status.is-blank{color:var(--text-faint);background:transparent;border:1px dashed var(--border-strong)}.score-card .mark{margin-left:auto;flex-shrink:0;font-weight:700}.score-card .mark.is-correct{color:var(--green-strong)}.score-card .mark.is-wrong{color:var(--red-strong)}.score-card.is-board-correct{border-left-color:var(--green)}.score-card.is-board-wrong{border-left-color:var(--red)}.board-writer{display:flex;gap:var(--sp-2);margin-top:var(--sp-2)}.board-writer input{flex:1}.buzzer.is-compact{min-height:72px;height:72px}.empty{color:var(--text-faint);font-size:var(--fs-sm)}.answer-banner{flex:0 0 auto;display:flex;align-items:baseline;gap:var(--sp-3);padding:var(--sp-2) var(--sp-4);background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border-bottom:1px solid var(--border);border-left:4px solid var(--green);box-shadow:var(--shadow-sm)}.answer-banner .label{flex:0 0 auto;font-size:var(--fs-xs);font-weight:700;letter-spacing:.08em;color:var(--green-strong)}.answer-banner .text{font-size:var(--fs-lg);font-weight:700;overflow-wrap:anywhere}.answer-controls{margin-bottom:var(--sp-2)}.answer-form{display:flex;gap:var(--sp-2)}.answer-form input{flex:1;min-width:0}.answer-candidate{display:flex;align-items:baseline;justify-content:flex-start;gap:var(--sp-2);width:100%;margin-bottom:var(--sp-2);padding:var(--sp-2) var(--sp-3);text-align:left;background:var(--accent-soft);border:1px dashed var(--border-strong);border-radius:var(--r-md)}.answer-candidate .label{flex:0 0 auto;font-size:var(--fs-xs);font-weight:700;color:var(--accent)}.answer-candidate .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.answer-clipboard-blocked{margin:0 0 var(--sp-2);font-size:var(--fs-xs)}.answer-candidate .key-hint{flex:0 0 auto;margin-left:auto;padding:1px 7px;border-radius:5px;background:var(--surface);border:1px solid var(--border-strong);font-family:inherit;font-size:var(--fs-xs);font-weight:700;color:var(--text-muted)}.answer-banner a.text{color:inherit;text-decoration:none}.answer-banner a.text:hover{text-decoration:underline}.answer-log{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.answer-log li{display:flex;align-items:baseline;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);background:var(--surface);border-radius:var(--r-sm);border-left:3px solid var(--green)}.answer-log .meta{flex:0 0 auto;display:flex;gap:var(--sp-2);font-size:var(--fs-xs);color:var(--text-muted)}.answer-log .text{font-weight:700;overflow-wrap:anywhere}.score-card .buzz-rank{flex:0 0 auto;padding:0 6px;border-radius:var(--r-sm);font-size:var(--fs-xs);font-weight:700;color:var(--other-text);background:var(--other-soft);border:1px solid var(--other)}.score-card .buzz-rank.is-first{color:var(--mine-text);background:var(--mine-soft);border-color:var(--mine)}.score-card .rest-edit{font-size:var(--fs-xs);color:var(--text-muted);flex-shrink:0}.judge-flash-correct{animation:judge-flash-green .9s ease-out}.judge-flash-wrong{animation:judge-flash-red .9s ease-out}@keyframes judge-flash-green{0%{background:var(--green-soft);border-color:var(--green);box-shadow:0 0 0 3px var(--green),0 0 24px var(--green)}to{box-shadow:0 0 0 0 transparent}}@keyframes judge-flash-red{0%{background:var(--red-soft);border-color:var(--red);box-shadow:0 0 0 3px var(--red),0 0 24px var(--red)}to{box-shadow:0 0 0 0 transparent}}.buzzer{display:block;width:100%;height:min(34vh,260px);padding:var(--sp-4);font-size:var(--fs-xl);font-weight:700;letter-spacing:.12em;color:#fff;background:linear-gradient(135deg,#0891b2 10%,#14b8a6 90%);border:none;border-radius:var(--r-lg);cursor:pointer;box-shadow:0 6px #0b6a80,0 10px 20px #083e4e40;transition:transform 80ms ease-out,box-shadow 80ms ease-out,background var(--dur-fast);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.buzzer:hover{background:linear-gradient(135deg,#0e7490 10%,#0f9e8a 90%)}.buzzer:active{transform:translateY(4px);box-shadow:0 2px #0b6a80,0 4px 10px #083e4e40}.buzzer[aria-disabled=true]{background:var(--surface);color:var(--text-muted);font-size:var(--fs-lg);border:1px solid var(--border-strong);box-shadow:none;transform:none;cursor:not-allowed}.buzzer.is-pressed{background:var(--other);color:#fff;box-shadow:0 6px #9c6f26,0 10px 20px #083e4e26}.buzzer.has-right{background:var(--mine);color:#4a2c00;font-size:var(--fs-2xl);box-shadow:0 6px #c07e12,0 10px 24px #f5a52466;animation:buzz-in .6s var(--ease-out)}.judge-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2)}.judge-row:not(:last-child){margin-bottom:var(--sp-3)}.judge-row button{height:64px;font-size:var(--fs-base);border-radius:var(--r-md)}.judge-row button:disabled{opacity:.4;cursor:not-allowed}.judge-row .correct{background:var(--green);border-color:var(--green);color:#fff}.judge-row .correct:hover:not(:disabled){background:var(--green-strong);border-color:var(--green-strong)}.judge-row .wrong{background:var(--red);border-color:var(--red);color:#fff}.judge-row .wrong:hover:not(:disabled){background:var(--red-strong);border-color:var(--red-strong)}.judge-row .next{background:var(--accent);border-color:var(--accent);color:#fff}.judge-row .next:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.judge-row .key-hint{display:inline-block;margin-left:var(--sp-1);padding:1px 7px;border-radius:5px;background:#ffffff40;border:1px solid rgba(255,255,255,.45);font-family:inherit;font-size:var(--fs-sm);font-weight:700;line-height:1.4;vertical-align:1px}.dot{width:8px;height:8px;border-radius:var(--r-full);background:var(--text-faint)}.dot.open{background:var(--green-strong)}@media(max-width:560px){.judge-row{grid-template-columns:repeat(2,1fr)}}.score-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--sp-2);margin-top:var(--sp-2)}.score-card{display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-3);background:var(--bg-subtle);border:1px solid var(--border);border-left:3px solid var(--border);border-radius:var(--r-sm)}.score-card{box-shadow:var(--shadow-sm)}.score-card.is-active{border-color:var(--other);border-left-color:var(--other);background:var(--other-soft)}.score-card.is-active.is-mine{border-color:var(--mine);border-left-color:var(--mine);background:var(--mine-soft)}.score-card.is-resting{border-left-color:var(--red)}.rest-tag{font-size:var(--fs-xs);padding:1px var(--sp-2);color:#fff;background:var(--red);border-radius:var(--r-full);white-space:nowrap}.score-card.is-won{border-left-color:var(--green)}.score-card.is-lost{border-left-color:var(--red);color:var(--text-faint)}.score-card .row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2)}.score-card .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-card .value{flex:1;font-size:var(--fs-xl);font-weight:700}.score-card .ox{flex:1;display:flex;gap:var(--sp-2);font-size:var(--fs-lg);font-weight:700}.score-card .ox .o{color:var(--green-strong)}.score-card .ox .x{color:var(--red-strong)}.score-card .state{font-size:var(--fs-xs);padding:2px var(--sp-2);border-radius:var(--r-full)}.score-card .state.won{background:var(--green);color:#fff}.score-card .state.lost{background:var(--red);color:#fff}.score-card .state.locked{color:var(--text-muted);background:var(--surface);border:1px solid var(--border-strong)}.score-card .offline{font-size:var(--fs-xs);color:var(--text-faint)}.stepper{display:flex;gap:2px}.stepper button{width:24px;height:24px;padding:0;font-size:var(--fs-xs);border-radius:var(--r-sm)}.aql-teams{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-2)}@media(max-width:720px){.aql-teams{grid-template-columns:1fr}}.aql-team{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--sp-3);box-shadow:var(--shadow-sm)}.aql-team-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-2)}.aql-team-head h3{font-size:var(--fs-base);color:var(--text-muted)}.aql-team-head .score{font-size:var(--fs-2xl);font-weight:700;color:var(--accent)}.aql-team.is-winner .aql-team-head .score{color:var(--green-strong)}.gauge{height:6px;margin:var(--sp-2) 0 var(--sp-3);background:var(--surface);border-radius:var(--r-full);overflow:hidden}.gauge-fill{height:100%;background:linear-gradient(90deg,#22b8cf,var(--accent));border-radius:var(--r-full);transition:width var(--dur-base) var(--ease-out)}.aql-team.is-winner .gauge-fill{background:var(--green)}.aql-seats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.aql-seat{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2);border-radius:var(--r-sm);background:var(--surface)}.aql-seat.is-active{background:var(--other-soft);box-shadow:inset 0 0 0 1px var(--other)}.aql-seat.is-active.is-mine{background:var(--mine-soft);box-shadow:inset 0 0 0 2px var(--mine)}.aql-seat.is-resting{opacity:.55}.aql-seat .no{width:20px;font-size:var(--fs-sm);font-weight:700;color:var(--text-faint);text-align:center}.aql-seat .members{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-sm)}.aql-seat .vacant{color:var(--text-faint);font-style:italic}.aql-seat .pt{font-weight:700;font-size:var(--fs-base)}.aql-seat .miss{color:var(--red-strong);font-size:var(--fs-sm);letter-spacing:-1px}.aql-seat .resting-tag{font-size:var(--fs-xs);padding:1px var(--sp-2);background:var(--red);color:#fff;border-radius:var(--r-full)}.result-banner{padding:var(--sp-3) var(--sp-4);text-align:center;font-size:var(--fs-lg);font-weight:700;color:var(--green-strong);background:var(--green-soft);border:1px solid var(--green);border-radius:var(--r-md)}.seat-picker{padding:var(--sp-4);background:var(--bg-subtle);border:1px solid var(--accent);border-radius:var(--r-md)}.seat-picker h2{font-size:var(--fs-lg);margin-bottom:var(--sp-1)}.seat-picker-teams{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-3)}@media(max-width:560px){.seat-picker-teams{grid-template-columns:1fr}}.seat-picker-team h3{font-size:var(--fs-sm);color:var(--text-muted);margin-bottom:var(--sp-2)}.seat-picker-team ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.seat-picker-team button{width:100%;justify-content:space-between;padding:var(--sp-3);font-weight:500}.seat-picker-team .no{font-weight:700;white-space:nowrap}.seat-picker-team .members{color:var(--text-muted);font-size:var(--fs-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-picker-team button.mine{border-color:var(--accent);background:var(--accent-soft)}.watching{margin:0;padding:var(--sp-4);text-align:center;font-size:var(--fs-sm);color:var(--text-muted);background:var(--bg);border:1px dashed var(--border-strong);border-radius:var(--r-md)}.my-seat{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--text-muted)}.modal{padding:0;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 64px);color:var(--text);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}.modal::backdrop{background:#d4ebf08c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-4);border-bottom:1px solid var(--border)}.modal-head h2{font-size:var(--fs-base)}.modal-body{padding:var(--sp-4);overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp-6)}.modal-section h3{font-size:var(--fs-sm);color:var(--text-muted);margin-bottom:var(--sp-2)}.field-row{display:flex;gap:var(--sp-3);align-items:flex-start;flex-wrap:wrap}.field-row label{flex:0 0 auto}.field-row label input{width:72px}.field-row select{flex:1;min-width:160px}.member-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-1)}.member-list li{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2);background:var(--surface);border-radius:var(--r-sm);font-size:var(--fs-sm)}.member-list .name{flex:1}.member-list select{width:auto;font-size:var(--fs-xs);padding:var(--sp-1) var(--sp-2)}.chat-fab{position:fixed;right:14px;bottom:88px;width:52px;height:52px;padding:0;display:grid;place-items:center;font-size:22px;color:#fff;background:var(--accent);border:none;border-radius:var(--r-full);box-shadow:var(--shadow-md);z-index:5}button.chat-fab:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.chat-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;display:flex;align-items:center;justify-content:center;font-size:var(--fs-xs);font-weight:700;color:#fff;background:var(--red);border-radius:var(--r-full)}.chat-panel{position:fixed;right:14px;bottom:88px;width:min(320px,calc(100vw - 28px));height:min(440px,60vh);display:flex;flex-direction:column;background:var(--glass);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;z-index:5}.chat-close{position:absolute;top:2px;right:2px;z-index:1;width:30px;height:30px;color:var(--text-muted)}.chat-list{flex:1 1 auto;overflow-y:auto;padding:34px var(--sp-3) var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-2)}.chat-msg{max-width:85%;align-self:flex-start;padding:var(--sp-1) var(--sp-3);font-size:var(--fs-sm);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--r-md)}.chat-msg.is-mine{align-self:flex-end;background:var(--accent-soft);border-color:var(--border-strong)}.chat-msg .chat-name{display:block;font-size:var(--fs-xs);color:var(--text-muted)}.chat-msg .chat-text{word-break:break-word;white-space:pre-wrap}.chat-error{margin:0 var(--sp-3)}.chat-input{display:flex;gap:var(--sp-2);padding:var(--sp-2);border-top:1px solid var(--border);background:var(--bg-subtle)}.chat-input input{flex:1;min-width:0}.flavor{display:block;font-size:var(--fs-xs);font-weight:400;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.intro-member{display:inline-flex;align-items:center;gap:var(--sp-1);margin-right:var(--sp-2)}.handicap-badge{padding:0 5px;font-size:var(--fs-xs);color:var(--accent);background:var(--accent-soft);border:1px solid var(--border-strong);border-radius:var(--r-sm)}.topbar .brand{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;margin-left:var(--sp-2)}.topbar .brand-logo{font-size:17px;font-weight:700;letter-spacing:.12em;background:linear-gradient(135deg,#0891b2 20%,#14b8a6 80%);-webkit-background-clip:text;background-clip:text;color:transparent}.topbar .brand-code{font-size:var(--fs-xs);color:var(--text-muted);letter-spacing:.12em}.chance-toggle{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-sm);color:var(--text-muted);cursor:pointer}.chance-toggle input{width:auto;margin:0;accent-color:var(--accent)}.check-inline-row{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-sm);color:var(--text-muted)}.check-inline-row label{display:inline-flex;align-items:center;gap:var(--sp-1)}.check-inline-row input{width:auto;margin:0}.check-row{display:flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-3);font-size:var(--fs-sm);color:var(--text);cursor:pointer}.check-row input{display:inline-block;width:auto;margin:0;accent-color:var(--accent)}.user-settings-fields{display:flex;flex-direction:column;gap:var(--sp-3)}.user-settings-fields input[type=range]{width:100%;padding:0;border:none;accent-color:var(--accent)}.team-name-fields{display:flex;gap:var(--sp-3);flex-wrap:wrap}.team-name-fields label{flex:1 1 180px}.team-name-fields label input{width:100%}.section-title.with-action{display:flex;align-items:center;justify-content:space-between}.mini-button{padding:1px 10px;font-size:var(--fs-xs);font-weight:500}@media(min-width:720px){.buzzer{width:50%;margin:0 auto;height:min(17vh,132px)}}.controller{margin:0 var(--sp-3) var(--sp-3);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:0 -6px 24px #083e4e1f,var(--shadow-lg)}.board-columns{display:grid;gap:var(--sp-4)}@media(min-width:1000px){.room-main-inner{max-width:1240px}.board-columns{grid-template-columns:340px minmax(0,1fr);align-items:start}.board-columns.is-single{grid-template-columns:minmax(0,1fr)}}.chat-time{margin-left:var(--sp-2);color:var(--text-faint);font-size:var(--fs-xs)}.queue .diff{color:var(--text-muted);font-size:var(--fs-xs)}.reach-tag{padding:1px 8px;font-size:var(--fs-xs);font-weight:700;color:var(--mine-text);background:var(--mine-soft);border:1px solid var(--mine);border-radius:var(--r-full)}.handicap-badge.ep{color:var(--mine-text);background:var(--mine-soft);border-color:var(--mine)}.check-row.ep-check{display:inline-flex;margin:0 0 0 var(--sp-1)}.badge-button{cursor:pointer}.host-chip{padding-right:var(--sp-3)}.host-chip:has(button){padding-right:var(--sp-1)}@media(max-width:620px){.topbar{flex-wrap:wrap;height:auto;min-height:var(--header-h);padding-top:var(--sp-2);padding-bottom:var(--sp-2);row-gap:var(--sp-1)}}.chat-flow{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:4}.chat-flow-item{position:absolute;display:flex;gap:var(--sp-2);align-items:baseline;padding:4px 12px;white-space:nowrap;font-size:var(--fs-sm);color:var(--text);background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:var(--r-full);box-shadow:var(--shadow-md)}.chat-flow-name{font-weight:700;color:var(--accent)}.chat-flow-item.is-vertical{bottom:160px;left:calc(4% + var(--lane) * 32%);max-width:30%;transform-origin:bottom center;animation:chat-flow-up 4s ease-out forwards}.chat-flow-item.is-vertical .chat-flow-text{overflow:hidden;text-overflow:ellipsis}@keyframes chat-flow-up{0%{transform:translateY(0) scaleY(.2);opacity:0}10%{transform:translateY(0) scaleY(1);opacity:1}60%{opacity:1}to{transform:translateY(-38vh) scaleY(1);opacity:0}}.chat-flow-item.is-horizontal{top:calc(72px + var(--lane) * 40px);left:100%;animation:chat-flow-across 7s linear forwards}@keyframes chat-flow-across{0%{transform:translate(0)}to{transform:translate(calc(-100vw - 100%))}}
