.palette-picker{display:flex;gap:16px;align-items:center;justify-content:center;padding:10px 20px;background:var(--canvas,var(--cream));color:var(--deep);border-bottom:1px solid currentColor;font:700 13px 'Nunito Sans',sans-serif}.palette-picker select{min-height:38px;padding:6px 32px 6px 12px;border:1px solid currentColor;border-radius:2px;background:transparent;color:inherit;font:inherit}.palette-picker span{font-weight:400}.playing .palette-picker{display:none}@media(max-width:600px){.palette-picker{gap:10px;justify-content:space-between;padding:9px 16px}.palette-picker span{display:none}.palette-picker select{max-width:180px}}

/* Supplied category photography retains its full composition. */
.category-art:has(img[src*="/faceoff/"]),.board-art:has(img[src*="/faceoff/"]){background:#000!important}
.category-art img[src*="/faceoff/"]{object-fit:contain;object-position:center;width:100%;height:100%}
.board-art img[src*="/faceoff/"]{object-fit:contain!important;object-position:center}
/* Team setup stays on the page canvas in every palette. */
.team-form .team-panel,.team-form .team-panel:nth-child(2){background:transparent;border:0;border-top:1px solid color-mix(in srgb,var(--deep) 25%,transparent);box-shadow:none}


/* Open board groups and individually spaced scoring controls. */
.board .board-category{background:transparent;padding:0;box-shadow:none;border:0;column-gap:9px}
.board .board-card{margin:0}
.board .point-stack{gap:9px}
.board .points{border:0!important;border-radius:2px!important}
.question-wrap>.scoreboard{background:transparent;padding:0;justify-content:flex-start;gap:24px;align-self:start}
.question-wrap .score-team{background:var(--deep);padding:20px 12px;gap:20px;min-height:180px;justify-content:center}
.question-wrap .score-title{gap:18px}
.question-wrap .score-title h2,.question-wrap .score-team.turn .score-title h2{background:transparent;color:var(--cream);margin:0;padding:0 4px}
.question-wrap .score-team.turn{border-top:3px solid var(--action,var(--cream))}
.question-wrap .score-counter{justify-content:center;gap:18px}
.question-wrap .score-counter button{width:28px;height:28px}
.question-wrap .score-helps{gap:12px;justify-content:center}
.question-card{display:grid;grid-template-columns:minmax(130px,30%) minmax(0,1fr);align-items:center;gap:30px;padding:30px}
.question-illustration{width:100%;height:240px;display:grid;place-items:center;overflow:hidden}
.question-illustration img{width:100%;height:100%;object-fit:contain}
.question-illustration .sprite-art{width:100%;aspect-ratio:1;display:block}
.question-illustration>svg{width:75%;height:75%;color:var(--blue)}
.question-copy{min-width:0}.question-copy h1{margin:0}.question-copy .answer{margin-top:24px}
@media(max-width:900px){.question-wrap{grid-template-columns:minmax(0,1fr) 175px}.question-card{gap:18px;padding:22px;grid-template-columns:minmax(90px,28%) minmax(0,1fr)}.question-illustration{height:180px}}
@media(max-width:600px){.board .board-category{column-gap:5px}.board .point-stack{gap:6px}.question-wrap>.scoreboard{width:100%;margin:18px 0 0;gap:14px;align-self:stretch}.question-wrap .score-team{padding:17px 6px;min-height:170px}.question-wrap .score-counter{gap:10px}.question-wrap .score-helps{gap:7px}.question-card{display:flex;flex-direction:column;gap:20px;padding:24px 20px}.question-illustration{height:135px;width:150px}.question-illustration .sprite-art{width:135px}.question-copy h1{font-size:25px}}
.question-illustration .sprite-art{width:min(100%,240px);height:auto;aspect-ratio:1}@media(max-width:900px){.question-illustration .sprite-art{max-width:180px}}@media(max-width:600px){.question-illustration .sprite-art{max-width:135px}}
/* Presentation stage: question above a large centered visual. */
.question-wrap .question-card{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;min-height:clamp(520px,70dvh,850px);padding:30px 36px;gap:26px}
.question-card .question-copy{order:0;width:100%;text-align:center;flex:none}
.question-card .question-copy h1{max-width:950px;margin:0 auto;font-size:clamp(25px,2.7vw,38px);line-height:1.2}
.question-card .question-illustration{order:1;flex:1;min-height:300px;height:clamp(300px,43dvh,560px);width:100%;max-width:850px;overflow:hidden}
.question-card .question-illustration img{width:100%;height:clamp(300px,43dvh,560px);object-fit:contain}
.question-card .question-illustration .sprite-art{width:clamp(280px,40dvh,520px);max-width:100%;height:auto;aspect-ratio:1}
.question-card .question-copy .answer{margin:18px auto 0;padding-top:14px}
.question-wrap .question-notice:empty{display:none}
.question-wrap .question-actions{margin:18px 0 0}
@media(max-width:600px){.question-wrap .question-card{min-height:480px;padding:24px 18px;gap:22px}.question-card .question-copy h1{font-size:25px}.question-card .question-illustration{min-height:260px;height:300px;max-width:100%}.question-card .question-illustration img{height:300px}.question-card .question-illustration .sprite-art{width:280px;max-width:100%}}
/* Fill the action row and balance the score rail against the question stage. */
.question-wrap .question-actions{display:flex;width:100%;justify-content:stretch}
.question-wrap .question-actions>.button{width:100%;min-height:62px;justify-content:center}
.question-wrap>.scoreboard{align-self:stretch;display:grid;grid-template-rows:repeat(2,minmax(0,1fr));align-items:stretch;gap:24px}
.question-wrap .score-team{height:100%;min-height:180px;justify-content:center;gap:24px}
@media(max-width:600px){.question-wrap>.scoreboard{grid-template-rows:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.question-wrap .score-team{min-height:200px;gap:20px}.question-wrap .question-actions>.button{min-height:58px}}
@media(min-width:601px){.question-wrap>.scoreboard{grid-template-columns:minmax(0,1fr)}}
/* Spacious power-ups with scores above the panel midpoint. */
.question-wrap .score-team{gap:34px;padding:24px 10px 38px}
.question-wrap .score-title{gap:16px}
.question-wrap .score-helps{display:grid;grid-template-columns:repeat(3,44px);gap:12px;justify-content:center;width:100%}
.question-wrap .score-helps button{width:44px;height:48px;border-radius:3px;padding:10px;border-width:1px}
.question-wrap .score-helps button svg{width:24px;height:24px}
.question-wrap .score-helps button:enabled:hover{transform:none;background:color-mix(in srgb,var(--cream) 15%,var(--deep))}
@media(min-width:601px) and (max-width:900px){.question-wrap .score-helps{grid-template-columns:repeat(3,42px);gap:8px}.question-wrap .score-helps button{width:42px;height:46px}}
@media(max-width:600px){.question-wrap .score-team{gap:26px;padding:22px 8px 26px}.question-wrap .score-helps{grid-template-columns:repeat(3,minmax(0,44px));gap:7px}.question-wrap .score-helps button{width:100%;height:44px;padding:8px}.question-wrap .score-helps button svg{width:22px;height:22px}}
/* Larger power-up targets and a wider score rail. */
@media(min-width:901px){.question-wrap{grid-template-columns:minmax(0,1fr) 238px}}
.question-wrap .score-helps{grid-template-columns:repeat(3,60px);gap:12px}
.question-wrap .score-helps button{width:60px;height:64px;padding:14px;font-size:24px}
.question-wrap .score-helps button svg{width:30px;height:30px}
@media(min-width:601px) and (max-width:900px){.question-wrap{grid-template-columns:minmax(0,1fr) 210px}.question-wrap .score-helps{grid-template-columns:repeat(3,54px);gap:10px}.question-wrap .score-helps button{width:54px;height:58px;padding:11px}}
@media(max-width:600px){.question-wrap .score-helps{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.question-wrap .score-helps button{width:100%;height:54px;padding:7px;font-size:22px}.question-wrap .score-helps button svg{width:26px;height:26px}}
/* One continuous playing surface, without light header/footer bands. */
body.playing,.playing .game-nav,.playing .game-wrap.game-board,.playing .game-wrap:not(.game-board),.playing .game-board .scoreboard{background:var(--blue);color:var(--cream)}
.playing .game-nav{border-bottom:1px solid color-mix(in srgb,var(--cream) 22%,transparent)}
.playing .game-nav .brand,.playing .game-nav h1,.playing .game-nav nav a,.playing .game-nav nav button{color:var(--cream)}
.playing .game-board .scoreboard{border-top:1px solid color-mix(in srgb,var(--cream) 22%,transparent)}
.playing .game-board .score-counter strong,.playing .game-board .score-counter button,.playing .game-board .score-helps button{color:var(--cream)}
.playing .game-board .score-counter button,.playing .game-board .score-helps button{border-color:color-mix(in srgb,var(--cream) 65%,transparent);background:transparent}
.playing .game-board .score-title h2{background:transparent;color:var(--cream)}
.playing .game-board .score-team.turn .score-title h2{background:var(--deep);color:var(--cream)}
.playing .board-status{color:var(--cream)}
.playing .board .points:not(:disabled){color:var(--deep)}
/* Light navigation with a bottom scoreboard continuous with the board. */
.playing .game-nav{background:var(--canvas,var(--cream));color:var(--deep);border-bottom:1px solid color-mix(in srgb,var(--deep) 22%,transparent)}
.playing .game-nav .brand,.playing .game-nav h1,.playing .game-nav nav a,.playing .game-nav nav button{color:var(--deep)}
/* Join category artwork and its caption into a single visual card. */
.playing .board .board-card{background:var(--wash,var(--cream));overflow:hidden}
.playing .board .board-art{background:var(--wash,var(--cream))}
.playing .board .board-card h2{background:var(--wash,var(--cream))!important;color:var(--deep)!important;margin:0;min-height:42px;padding:10px 5px;border:0}
@media(max-width:600px){.playing .board .board-card h2{min-height:40px;padding:7px 3px;font-size:12px}}
/* Center the title on the page, independent of unequal side controls. */
.playing .game-nav{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);position:relative}
.playing .game-nav h1{grid-column:2;grid-row:1;text-align:center;margin:0;min-width:0;overflow-wrap:anywhere}
.playing .game-nav nav{grid-column:1;grid-row:1;justify-self:start}
.playing .game-nav .turn-pill{grid-column:3;grid-row:1;justify-self:end;margin-right:70px}
.playing .game-nav .brand{grid-column:3;grid-row:1;justify-self:end}
@media(max-width:760px){.playing .game-nav{grid-template-columns:1fr auto auto;gap:12px;padding:12px}.playing .game-nav h1{grid-column:1/-1;grid-row:1;text-align:center}.playing .game-nav nav{grid-column:1;grid-row:2}.playing .game-nav .turn-pill{grid-column:2;grid-row:2;margin:0}.playing .game-nav .brand{grid-column:3;grid-row:2}}
/* A balanced match desk: scores lead, named power-ups sit alongside. */
.playing .game-board .scoreboard{padding:20px 5vw;gap:0;align-items:stretch}
.playing .game-board .score-team{justify-content:space-between;gap:24px;padding:0 32px;min-width:0;align-items:center}
.playing .game-board .score-team+ .score-team{border-left:1px solid color-mix(in srgb,var(--cream) 30%,transparent)}
.playing .game-board .score-title{min-width:140px;gap:8px;flex:1}
.playing .game-board .score-title h2,.playing .game-board .score-team.turn .score-title h2{background:transparent;padding:0;text-align:center;font-size:18px;line-height:1.3;border-radius:0}
.playing .game-board .score-team.turn .score-title h2{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.playing .game-board .score-counter{justify-content:center;gap:12px}
.playing .game-board .score-counter strong{font-size:42px;min-width:88px;font-variant-numeric:tabular-nums}
.playing .game-board .score-counter button{width:32px;height:32px;border-radius:2px;font-size:22px}
.playing .game-board .score-helps{gap:8px}
.playing .game-board .score-helps button{width:72px;height:72px;padding:9px 4px;display:flex;flex-direction:column;justify-content:center;gap:7px;border-radius:2px;border-width:1px;background:color-mix(in srgb,var(--cream) 8%,transparent)}
.playing .game-board .score-helps button svg{width:26px;height:26px}
.playing .game-board .score-helps button span{display:block;font:700 10px/1.15 'Nunito Sans',sans-serif;text-align:center}
.playing .game-board .score-helps button:disabled{opacity:.5}
.playing .game-board .score-helps button:enabled:hover{background:var(--cream);color:var(--deep);transform:none}
@media(max-width:1100px){.playing .game-board .scoreboard{padding:18px 20px}.playing .game-board .score-team{padding:0 18px;gap:16px}.playing .game-board .score-helps button{width:58px;height:68px}}
@media(max-width:760px){.playing .game-board .scoreboard{padding:18px 10px}.playing .game-board .score-team{flex-direction:column;padding:0 10px;gap:16px}.playing .game-board .score-title{width:100%;min-width:0}.playing .game-board .score-title h2{font-size:15px}.playing .game-board .score-counter strong{font-size:34px;min-width:65px}.playing .game-board .score-counter{gap:8px}.playing .game-board .score-helps{width:100%;justify-content:center;gap:6px}.playing .game-board .score-helps button{width:clamp(40px,14vw,64px);height:64px}.playing .game-board .score-helps button span{font-size:9px}}