.host-home { max-width:760px; margin:40px auto; padding:0 24px 48px; }
.hero { text-align:center; padding:28px 0; }
.hero h1 { font-size:clamp(32px,4vw,46px); }
.hero p { max-width:560px; margin:16px auto 0; color:var(--muted); font-size:16px; line-height:1.7; }
.stack { display:flex; flex-direction:column; gap:12px; margin-top:24px; }
.host-home > .stack { max-width:100%; }
.dashboard-home { max-width:960px; }
.dashboard-home .hero { text-align:left; padding-bottom:32px; }
.dashboard-home .hero p { margin-left:0; }
.dashboard-actions { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.action-card { text-align:left; padding:28px; border-radius:14px; border:1px solid var(--line); background:#fff; color:var(--text); box-shadow:var(--shadow); }
.action-card:hover { border-color:#7bb8ad; background:#fcfefd; }
.action-card .action-icon { display:grid; place-items:center; width:44px; height:44px; background:#eaf5f1; color:var(--cyan); border-radius:12px; font-size:24px; margin-bottom:26px; }
.action-card strong { display:block; font-size:20px; font-weight:650; letter-spacing:-.03em; }
.action-card p { color:var(--muted); font-size:14px; margin:10px 0 24px; line-height:1.6; }
.action-link { color:var(--cyan); font-size:13px; font-weight:650; }
.home-note { margin-top:28px; font-size:13px; color:var(--muted); }
.quiz-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px; border:1px solid var(--line); background:white; border-radius:12px; min-width:0; }
.quiz-row h3 { overflow-wrap:anywhere; margin-bottom:5px; }
.row-actions { display:flex; gap:8px; flex-wrap:wrap; }
.q-card { margin:16px 0; }
.q-card header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; font-weight:600; }
.options-edit { display:grid; gap:10px; }
.opt-line { display:grid; grid-template-columns:24px minmax(0,1fr); align-items:center; gap:10px; }
.opt-line input[type=radio] { width:18px; height:18px; accent-color:var(--cyan); }
.editor-note { font-size:13px; color:var(--muted); margin:10px 0; }
.lobby-shell { max-width:1180px; margin:36px auto; padding:0 24px 40px; }
.lobby-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:28px; }
.lobby-heading h1 { font-size:32px; }
.lobby-heading p { margin-top:8px; color:var(--muted); font-size:14px; }
.status-chip { display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border:1px solid #c9e4da; background:#eaf5f1; color:#25735d; border-radius:999px; font-size:12px; font-weight:600; white-space:nowrap; }
.status-chip::before { content:''; width:6px; height:6px; background:#239675; border-radius:50%; }
.lobby-grid { display:grid; grid-template-columns:340px minmax(0,1fr); gap:24px; align-items:stretch; }
.pin-box { text-align:center; padding:28px; }
.pin-box h2 { font-size:18px; }
.pin-box > .muted { font-size:13px; margin-top:8px; }
.pin-box .pin { margin:20px 0; color:var(--text); }
.qr-wrap { background:#f7f9fb; padding:16px; border-radius:12px; border:1px solid #edf1f5; }
.pin-box img.qr { width:180px; height:180px; max-width:100%; padding:6px; background:white; display:block; margin:0 auto; border-radius:6px; }
.qr-caption { font-size:12px; color:var(--muted); margin-top:12px; }
.join-link { display:block; color:var(--cyan); font-size:12px; overflow-wrap:anywhere; margin:18px 0; line-height:1.6; }
.join-help { border-top:1px solid var(--line); padding-top:16px; margin-top:20px; font-size:12px; line-height:1.6; color:var(--muted); text-align:left; }
.players-panel { padding:0; display:flex; flex-direction:column; overflow:hidden; }
.players-header { padding:24px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:12px; }
.players-header h2 { font-size:18px; display:flex; align-items:center; gap:10px; }
.player-capacity { font-size:12px; color:var(--muted); }
.player-area { flex:1; padding:24px; min-height:260px; display:flex; flex-direction:column; }
.player-empty { flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:34px 16px; }
.empty-icon { width:60px; height:60px; border-radius:50%; display:grid; place-items:center; background:#f1f5f9; color:#8d9aad; margin-bottom:18px; }
.empty-icon svg { width:28px; height:28px; }
.player-empty h3 { font-size:16px; }
.player-empty p { font-size:13px; color:var(--muted); max-width:280px; margin-top:10px; line-height:1.7; }
.player-pills { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.pill { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:9px; background:var(--bg2); min-width:0; }
.pill span { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pill button { background:transparent; color:var(--muted); border:0; border-radius:6px; min-width:30px; min-height:30px; font-size:18px; }
.pill button:hover { background:#ffe8ec; color:var(--danger); }
.lobby-footer { padding:20px 24px; background:#fafbfc; border-top:1px solid var(--line); }
.lobby-footer > p { font-size:12px; color:var(--muted); margin-bottom:16px; }
.lobby-footer .host-actions { margin:0; justify-content:flex-start; }
.host-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:24px; }
.live { max-width:1100px; margin:40px auto; padding:0 24px 40px; text-align:center; }
.big-timer { font-size:clamp(44px,8vw,88px); font-weight:650; letter-spacing:-.05em; color:var(--text); margin:20px 0; line-height:1.2; font-variant-numeric:tabular-nums; }
.progress-label { color:var(--muted); font-size:15px; margin:20px 0; }
.pair-list { display:grid; gap:10px; max-width:820px; margin:24px auto; text-align:left; }
.pair-row { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:16px; background:#fff; border:1px solid var(--line); border-radius:10px; padding:18px 20px; }
.pair-row .name { overflow-wrap:anywhere; font-weight:600; }
.pair-row .right { text-align:right; }
.bracket { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:28px auto; text-align:left; }
.match-card { padding:20px; background:#fff; border:1px solid var(--line); border-radius:12px; margin-bottom:16px; }
.match-card .muted { font-size:12px; margin-bottom:12px; }
.match-card .slot { display:flex; justify-content:space-between; gap:12px; padding:12px; margin-top:8px; background:var(--bg2); border-radius:6px; overflow-wrap:anywhere; }
.match-card .winner { background:#eaf5f1; color:var(--cyan); }
.podium { display:flex; justify-content:center; align-items:flex-end; gap:12px; min-height:260px; margin:32px 0; }
.place { width:28%; max-width:200px; text-align:center; }
.place .nick { font-size:15px; font-weight:600; margin-bottom:12px; overflow-wrap:anywhere; }
.place .block { border-radius:10px 10px 0 0; padding:24px 8px; display:flex; align-items:flex-end; justify-content:center; }
.place.first .block { height:170px; background:#e9d6a6; color:#6e5114; }
.place.second .block { height:125px; background:#dfe6ee; color:#475569; }
.place.third .block { height:95px; background:#ead6cb; color:#795d4e; }
#confetti { position:fixed; inset:0; pointer-events:none; z-index:5; }
.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.toggle { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px; background:var(--bg2); border:1px solid var(--line); border-radius:10px; }
.toggle input { width:18px; height:18px; accent-color:var(--cyan); }
.how { font-size:14px; color:var(--muted); line-height:1.8; }
.how strong { display:block; margin-bottom:8px; }
@media(max-width:820px) { .lobby-grid { grid-template-columns:290px minmax(0,1fr); gap:16px; } .pin-box { padding:22px; } .pin { font-size:42px; } .player-pills { grid-template-columns:1fr; } }
@media(max-width:640px) { .lobby-shell { margin:24px auto; padding:0 16px 24px; } .lobby-heading { align-items:flex-start; } .lobby-heading h1 { font-size:26px; } .lobby-heading p { max-width:220px; } .status-chip { font-size:11px; padding:6px 9px; } .lobby-grid { grid-template-columns:minmax(0,1fr); } .pin-box .pin { font-size:46px; } .qr-wrap { max-width:260px; margin:auto; } .player-area { min-height:240px; } .host-home { margin:28px auto; padding:0 18px 32px; } .settings-grid,.dashboard-actions,.bracket { grid-template-columns:minmax(0,1fr); } .quiz-row { flex-direction:column; align-items:stretch; } .player-pills { grid-template-columns:repeat(2,minmax(0,1fr)); } .players-header,.player-area,.lobby-footer { padding:20px; } }
@media(max-width:360px) { .player-pills { grid-template-columns:1fr; } }

.settings-grid > .field:nth-child(3) { grid-column: 1 / -1; }