.matching-settings{border:1px solid var(--line,#456176);border-radius:16px;padding:22px;background:linear-gradient(135deg,#62d6ea0c,#ffd07809);margin:10px 0}.matching-settings legend{font-weight:800;padding:0 8px}.matching-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.matching-kinds{border:0;padding:16px 0 0;margin:0;display:flex;flex-wrap:wrap;gap:10px}.matching-kinds legend{font-size:.9rem;padding:10px 0}.matching-kinds label{display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid var(--line,#456176);border-radius:24px;font-size:.9rem;cursor:pointer}.matching-kinds input{width:16px;height:16px;margin:0;accent-color:#35bfd5}.matching-host{display:block!important;grid-column:1/-1;width:100%;min-width:0}.matching-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}.matching-column{display:grid;gap:12px;min-width:0}.matching-column h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#9db9c9);margin:4px 0 8px}.matching-slot,.matching-piece{color:inherit;font:inherit;text-align:left;overflow-wrap:anywhere;border:1px solid var(--line,#456176);border-radius:12px;min-height:106px;padding:16px;background:var(--surface-raised,#192e43);display:flex;align-items:center;gap:10px;transition:border-color .15s,background .15s,transform .15s;position:relative}.matching-slot{flex-wrap:wrap;border-left:3px solid #52cce0}.matching-slot strong{flex:1;min-width:0}.matching-piece{cursor:grab;touch-action:none}.matching-piece>span:last-child{min-width:0}.matching-piece:hover:not(:disabled),.matching-piece.is-selected{border-color:#ffce78;background:#ffd07818;box-shadow:0 0 0 2px #ffd07830}.matching-slot.is-over{border-color:#ffce78;transform:scale(1.015)}.matching-number{display:grid;place-items:center;border-radius:50%;width:28px;height:28px;flex:none;background:#5edcf326;color:#65dcee;font-weight:800}.matching-placeholder{display:block;width:100%;font-size:.75rem;opacity:.6}.matching-linked{width:100%;font-size:.88rem;color:#8ce9be}.matching-slot.is-matched{border-color:#52b58d;background:#39a77a16;opacity:1}.matching-piece.is-used{opacity:.25;cursor:default}.matching-handle{color:#ffd078;font-size:1.4rem;flex:none}.matching-status{font-weight:800;color:var(--accent,#ffcd73);margin:0 0 8px}.matching-instructions{font-size:.9rem;line-height:1.5;opacity:.78;margin:0 0 20px}.matching-review{padding:14px 0;border-bottom:1px solid var(--line,#456176)}.matching-review summary{cursor:pointer;font-weight:700}.matching-review-pair{display:grid;grid-template-columns:20px minmax(0,1fr) 20px minmax(0,1.2fr);gap:8px;padding:12px 0;font-size:.9rem;overflow-wrap:anywhere}.matching-review-pair small{grid-column:2/-1;opacity:.7}.matching-mistake{font-size:.85rem;color:#ff9b9b}.matching-ok{color:#67d49e}.matching-round-result{font-size:1.3rem;font-weight:800;color:#ffd078}.matching-ghost{position:fixed;pointer-events:none!important;z-index:9999;transform:translate(-50%,-60%);opacity:.85;box-shadow:0 8px 30px #0006}.matching-host[aria-busy=true]{pointer-events:none}.matching-slot:focus-visible,.matching-piece:focus-visible{outline:3px solid #ffce78;outline-offset:3px}.answers.matching-host{display:block;min-height:520px}.mode-card[data-mode=matching] .mode-icon{font-size:2rem}.mode-picker:has([data-mode=matching]){grid-template-columns:repeat(2,minmax(0,1fr))}.spectator-screen.is-matching{display:flex!important;flex-direction:column!important}.spectator-screen.is-matching .spectator-answers{display:block!important;flex:1;min-height:0;overflow:auto}.spectator-screen.is-matching .spectator-question{min-height:0;height:auto;padding:0;margin:8px 0;font-size:1rem}.spectator-screen.is-matching .matching-slot,.spectator-screen.is-matching .matching-piece{min-height:86px;font-size:.8rem;padding:9px}.spectator-screen.is-matching .matching-grid{gap:10px}.spectator-screen.is-matching .spectator-review{overflow:auto}.matching-admin-list{display:grid;gap:10px}.matching-admin-row{padding:16px;border:1px solid var(--line,#456176);border-radius:12px;display:flex;gap:12px;align-items:center;justify-content:space-between}.matching-admin-row>div{min-width:0;overflow-wrap:anywhere}.matching-admin-row p{margin:5px 0}.matching-admin-form{margin:20px 0}.matching-admin-form textarea{width:100%;min-height:100px}.matching-admin-form .field{min-width:0}.matching-admin-form input,.matching-admin-form select{width:100%}[data-theme=light] .matching-slot,[data-theme=light] .matching-piece{background:#f1f6fb;color:#123049}[data-theme=light] .matching-linked{color:#146243}[data-theme=light] .matching-status,[data-theme=light] .matching-round-result{color:#8c5100}[data-theme=light] .matching-mistake{color:#a51c2d}[data-theme=light] .matching-number{color:#07566a}@media(max-width:600px){.matching-grid{gap:10px}.matching-column{gap:10px}.matching-slot,.matching-piece{padding:10px;min-height:116px;font-size:.9rem}.matching-handle{display:none}.matching-settings{padding:14px}.matching-settings-grid{gap:10px}.matching-column h3{font-size:.7rem;letter-spacing:0}.matching-number{width:22px;height:22px;font-size:.75rem}.matching-admin-row{align-items:flex-start}.answers.matching-host{min-height:580px}}@media(prefers-reduced-motion:reduce){.matching-slot,.matching-piece{transition:none}}

.matching-slot.is-error,.matching-piece.is-error{border-color:#f27b88;background:#b9384824}.matching-round-result{animation:matching-reveal .4s ease-out}.matching-grid{animation:matching-reveal .25s ease-out}@keyframes matching-reveal{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.matching-round-result,.matching-grid{animation:none}}
@media(max-width:600px){.challenges-page .game-heading{flex-wrap:wrap;gap:12px}.challenges-page .game-heading>div{min-width:0;max-width:100%}.challenges-page .game-heading h1{overflow-wrap:anywhere}.matching-slot strong{hyphens:auto}}
.challenges-page .mode-card>span:last-child{min-width:0;max-width:100%;overflow-wrap:anywhere}.matching-settings,.matching-kinds{min-width:0}.matching-settings-grid select{min-width:0;max-width:100%}@media(max-width:600px){.challenges-page .mode-card strong{font-size:1rem}.challenges-page .mode-description{font-size:.8rem}}
@media(max-width:600px){.challenges-page .mode-card[data-mode=matching] strong{font-size:.82rem;letter-spacing:-.02em;white-space:nowrap}}
@media(max-width:359px){.challenges-page .mode-card[data-mode=matching] strong{font-size:.72rem}}
/* Readable observation: solo uses the whole board; duels keep both screens visible. */
.observer-page .watch-board.is-solo .watch-standings{grid-template-columns:minmax(0,1fr)}
.spectator-screen.is-matching .spectator-answers{overscroll-behavior:contain;scrollbar-width:thin}
.spectator-screen.is-matching .matching-column h3{overflow-wrap:anywhere;font-size:11px;letter-spacing:.025em}
.spectator-screen.is-matching .matching-slot{align-content:start}
.spectator-screen.is-matching .matching-slot strong{flex-basis:100%}
.spectator-screen.is-matching .matching-handle,.spectator-screen.is-matching .matching-placeholder{display:none}
.spectator-screen.is-matching .matching-number{width:20px;height:20px;font-size:11px}
.spectator-screen.is-matching .matching-instructions{font-size:12px;line-height:1.45}
.spectator-screen.is-matching .matching-status{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.spectator-expand{display:block;padding:6px 8px;margin-top:7px;min-height:36px;border:1px solid var(--line,#456176);border-radius:6px;background:var(--panel-2,#192e43);color:var(--text,#eef5ff);font-family:inherit;font-size:12px;font-weight:600;line-height:1.3;cursor:pointer}
.spectator-expand:focus-visible{outline:2px solid #ffce78;outline-offset:3px}
.observer-page .watch-board .spectator-grid.has-focused-player{grid-template-columns:minmax(0,1fr)}
.spectator-grid.has-focused-player>.spectator-player-screen:not(.is-focused-player){display:none!important}
@container(max-width:500px){.spectator-screen.is-matching .matching-slot,.spectator-screen.is-matching .matching-piece{padding:7px 5px;font-size:12px;line-height:1.5}.spectator-screen.is-matching .matching-grid{gap:6px}.spectator-screen.is-matching .matching-column h3{font-size:10px}.spectator-screen.is-matching .matching-column{gap:8px}.spectator-expand{font-size:11px}}

.spectator-screen.is-matching.is-review .spectator-answers{display:none!important}
.spectator-screen.is-matching.is-review .spectator-review{flex:1}
/* Override the two-player grid when the spectator explicitly enlarges a screen. */
.observer-page .watch-board .watch-player-screen.spectator-grid.has-focused-player{grid-template-columns:minmax(0,1fr)}
.spectator-screen.is-matching .matching-slot:disabled,.spectator-screen.is-matching .matching-piece:disabled{opacity:1;filter:none;cursor:default}
.spectator-screen.is-matching .matching-piece.is-used:disabled{opacity:.6}
.spectator-screen.is-matching .matching-review-pair{grid-template-columns:16px minmax(0,1fr);gap:5px}
.spectator-screen.is-matching .matching-review-pair>span:nth-child(3){display:none}
.spectator-screen.is-matching .matching-review-pair>span:nth-child(4){grid-column:2}
@media(max-width:600px){#section-matching>.section-head{flex-direction:column;align-items:stretch}#section-matching>.section-head>div{min-width:0}#matching-admin-new{align-self:flex-start;max-width:100%;white-space:normal}#matching-admin-filter .field{flex:1 1 140px;min-width:0}#matching-admin-filter input,#matching-admin-filter select{min-width:0;max-width:100%}}
.matching-admin-form input[type=checkbox]{width:18px;max-width:none;vertical-align:middle;margin-right:8px}
/* Small spectator cards reserve their space for the associations themselves. */
.spectator-screen.is-matching .matching-instructions,.spectator-screen.is-matching .spectator-question{display:none}
.spectator-screen.is-matching .matching-status{font-size:12px;line-height:1.4;margin-bottom:10px}
.observer-page .watch-board .spectator-screen.is-matching .spectator-screen-head{min-height:0}