/* BingoBloom 2026: inclusive, context-aware visual system */
:root{--accent:#ae4d8b;--accent-deep:#873a75;--soft:#f9e9f3;--wash:#fdf7fc;--ink:#282438;--sub:#615d70;--line:#e8dfea;--card:#ffffff;--highlight:#f3d9eb;--secondary:#9b75bf}
body[data-scene=travel]{--accent:#177f85;--accent-deep:#11656b;--soft:#dff5f0;--wash:#f1fcfa;--highlight:#c3e9e3;--secondary:#468ba8}
body[data-scene=classroom]{--accent:#477f58;--accent-deep:#2e6440;--soft:#e7f2df;--wash:#f8fcf3;--highlight:#d4eabf;--secondary:#8c9c5d}
body[data-scene=party]{--accent:#8850b5;--accent-deep:#653b8d;--soft:#f0e8fa;--wash:#fbf8ff;--highlight:#dfcdf4;--secondary:#bd72a9}
body[data-scene=friends]{--accent:#bb5670;--accent-deep:#934258;--soft:#ffebe7;--wash:#fff9f7;--highlight:#f8d6d1;--secondary:#c88689}
body[data-scene=goals]{--accent:#a64f94;--accent-deep:#84387a;--soft:#f5e7f5;--wash:#fcf8fd;--highlight:#e9d4f1;--secondary:#9c78c4}
body{background:var(--wash)!important;color:var(--ink)!important;transition:background-color .35s,color .35s}
.topline{background:linear-gradient(90deg,var(--accent),var(--secondary))!important}
header,.panel,.feature,.template,.footer{background:var(--card)!important;border-color:var(--line)!important}
.brand,.hero h1 em,.section-title,.step{color:var(--accent-deep)!important}
.links,.hero p,.section-intro,.feature p,.faq p,.muted,.hint,.stat,.faq details,.footer{color:var(--sub)!important}
.cta,.btn:not(.secondary),.mode.active,.style-chip.selected{background:var(--accent)!important;border-color:var(--accent)!important;color:white!important;box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 17%,transparent)!important}
.btn.secondary,.template.active{background:var(--soft)!important;color:var(--accent-deep)!important;border-color:var(--line)!important}
.eyebrow,.pills span,.template,.field,.mode,.style-chip,.challenge-metrics>div{background:var(--soft)!important;color:var(--ink)!important;border-color:var(--line)!important}
.field:focus-visible,.template:focus-visible,.cell:focus-visible,.btn:focus-visible{outline:3px solid var(--accent)!important;outline-offset:2px}
.template.active{box-shadow:inset 0 0 0 1px var(--accent)!important}
.quickstart,.player-toolbar,.play-challenges{background:linear-gradient(115deg,var(--soft),var(--wash))!important;color:var(--ink)!important;border-color:var(--line)!important}
.quickstart p,.challenge-help,.challenge-metrics small{color:var(--sub)!important}
.bingo-card{background:linear-gradient(145deg,var(--soft),var(--wash),var(--highlight))!important;border:1px solid var(--line)!important;color:var(--ink)!important;box-shadow:0 14px 32px #2e233016!important}
.bingo-head b,.challenge-metrics strong{color:var(--accent-deep)!important}
.bingo-sub,.card-foot{color:var(--sub)!important}
.cell{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--ink)!important}
.cell.checked{background:var(--highlight)!important;color:var(--accent-deep)!important}.cell.checked:after{color:var(--accent-deep)!important}.cell.free{background:var(--soft)!important;color:var(--accent-deep)!important}
.progress{background:var(--soft)!important}.progress div{background:linear-gradient(90deg,var(--secondary),var(--accent))!important}
.result-banner{background:var(--highlight)!important;color:var(--accent-deep)!important;border-color:var(--line)!important}
.adaptive-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;margin:12px auto 18px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 6px 24px #2e23300a}
.adaptive-bar label{margin:0;color:var(--ink);font-size:13px}.adaptive-bar select{border:1px solid var(--line);background:var(--soft);border-radius:10px;padding:8px 12px;color:var(--ink);font:inherit;max-width:100%}.adaptive-hint{font-size:12px;color:var(--sub)}.adaptive-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
@media(prefers-color-scheme:dark){body:not([data-appearance=light]){--wash:#181922;--ink:#f6f1f7;--sub:#c3bacc;--line:#44404d;--card:#252531;--soft:#342c3d;--highlight:#49374f}} 
body[data-appearance=dark]{--wash:#181922;--ink:#f6f1f7;--sub:#c3bacc;--line:#44404d;--card:#252531;--soft:#342c3d;--highlight:#49374f}
body[data-appearance=light]{--wash:#fcf8fd;--ink:#282438;--sub:#615d70;--line:#e8dfea;--card:#fff;--soft:#f5e7f5;--highlight:#e9d4f1}
body[data-scene=travel][data-appearance=light]{--wash:#f1fcfa;--soft:#dff5f0;--highlight:#c3e9e3}
body[data-scene=classroom][data-appearance=light]{--wash:#f8fcf3;--soft:#e7f2df;--highlight:#d4eabf}
body[data-scene=party][data-appearance=light]{--wash:#fbf8ff;--soft:#f0e8fa;--highlight:#dfcdf4}
body[data-scene=friends][data-appearance=light]{--wash:#fff9f7;--soft:#ffebe7;--highlight:#f8d6d1}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(max-width:580px){.adaptive-bar{align-items:flex-start}.adaptive-hint{flex-basis:100%}.adaptive-controls{width:100%}.adaptive-controls select{flex:1;min-width:0}}
@media print{body{--wash:#fff!important;--ink:#222!important;--card:#fff!important;--soft:#fff!important;--highlight:#eee!important}.adaptive-bar{display:none!important}}
/* Preserve each theme even when the user explicitly chooses light mode. */
body[data-scene=goals][data-appearance=light]{--wash:#fcf8fd;--soft:#f5e7f5;--highlight:#e9d4f1}
body[data-scene=friends][data-appearance=light]{--wash:#fff9f7;--soft:#ffebe7;--highlight:#f8d6d1}

/* Homepage only: airy mint green and cream. Game theme colors still change after a theme is chosen. */
body[data-home="true"]{--accent:#5f9f83;--accent-deep:#3b6657;--secondary:#98c9b3;--soft:#e8f5ee;--wash:#f3fbf7;--highlight:#d8ece2;--ink:#2d463d;--sub:#61786f;--line:#d7e8df;--card:#fbfefc}
body[data-home="true"][data-appearance="light"]{--accent:#5f9f83;--accent-deep:#3b6657;--secondary:#98c9b3;--soft:#e8f5ee;--wash:#f3fbf7;--highlight:#d8ece2;--ink:#2d463d;--sub:#61786f;--line:#d7e8df;--card:#fbfefc}
body[data-home="true"]:not([data-appearance="dark"]) header{background:linear-gradient(100deg,#ecf8f2,#f8fcfa)!important;border-color:#d8e9e1!important}
body[data-home="true"]:not([data-appearance="dark"]) .hero{background:radial-gradient(ellipse at 78% 8%,#d8efe6,transparent 57%),linear-gradient(145deg,#f8fcfa,#edf8f3);border-radius:24px;margin-top:16px;padding-inline:18px}
@media(prefers-color-scheme:dark){body[data-home="true"]:not([data-appearance="light"]){--wash:#181922;--ink:#f6f1f7;--sub:#c3bacc;--line:#44404d;--card:#252531;--soft:#342c3d;--highlight:#49374f}}
body[data-home="true"][data-appearance="dark"]{--wash:#181922;--ink:#f6f1f7;--sub:#c3bacc;--line:#44404d;--card:#252531;--soft:#342c3d;--highlight:#49374f}