:root{--color-navy:#0a2b57;--color-teal:#20b7a7;--color-teal-dark:#087c78;--color-cream:#fffaf0;--color-sky:#dff4ff;--color-yellow:#ffd244}.color-theme{background:#eef9ff}.color-theme .game-header,.color-theme .color-game-intro,.color-theme .color-settings-form{width:min(1320px,100% - 40px)}.color-game-intro{align-items:center}.color-title-icon{color:var(--color-navy);background:#fff0a8}.color-title-icon svg{fill:#fff;stroke:currentColor;stroke-width:5px;stroke-linecap:round;stroke-linejoin:round}.color-settings-form{margin:0 auto 80px}.color-picture-section{background:#fff;border:1px solid #c8deea;border-radius:8px;margin:10px 0 28px;padding:24px;box-shadow:0 16px 38px #1e42571a}.color-picture-grid{border:0;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0 0 28px;padding:0;display:grid}.color-picture-choice{min-width:0;color:var(--color-navy);cursor:pointer;background:#f8fcff;border:3px solid #b9d1df;border-radius:10px;grid-template-rows:auto auto;transition:border-color .16s,box-shadow .16s,transform .16s;display:grid;position:relative;overflow:hidden}.color-picture-choice:hover{border-color:var(--color-teal);transform:translateY(-2px);box-shadow:0 12px 28px #153d5524}.color-picture-choice:has(input:focus-visible){outline:4px solid var(--color-yellow);outline-offset:3px}.color-picture-choice:has(input:checked){border-color:var(--color-teal);box-shadow:0 0 0 5px color-mix(in srgb, var(--color-teal) 23%, transparent)}.color-picture-choice input{opacity:0;width:1px;height:1px;position:absolute}.color-picture-preview{background:#edf8ff;border-bottom:1px solid #d5e7ef;place-items:center;padding:12px;display:grid}.color-picture-caption{gap:3px;padding:12px 14px 14px;display:grid}.color-picture-caption strong{letter-spacing:0;font-size:1.05rem}.color-picture-caption small{color:var(--ink-soft);font-size:.82rem}.color-mini-grid{--mini-cols:9;--mini-rows:6;width:100%;aspect-ratio:var(--mini-cols) / var(--mini-rows);grid-template-columns:repeat(var(--mini-cols), 1fr);grid-template-rows:repeat(var(--mini-rows), 1fr);border-radius:6px;display:grid;overflow:hidden;box-shadow:0 0 0 2px #c6dfe9}.color-mini-region-picture{aspect-ratio:3/2;background:#fff;border-radius:6px;width:100%;display:block;overflow:hidden;box-shadow:0 0 0 2px #c6dfe9}.color-music-choice{margin-top:22px}.button-color{color:#fff;background:var(--color-teal-dark)}.button-color:hover{background:#066864}.button-color svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:20px}.range-scale{color:#0a2b57d9;justify-content:space-between;font-size:.72rem;font-weight:700;display:flex}.color-play-screen{z-index:40;background:var(--color-sky);position:fixed;inset:0;overflow:hidden}.color-play-screen[hidden]{display:none}.color-play-screen>video{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.color-game-board{color:var(--color-navy);isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;background:#dff4ff;grid-template-rows:62px 68px minmax(0,1fr);grid-template-columns:minmax(0,1fr);gap:8px;padding:10px 18px 12px;display:grid;position:absolute;inset:0}.color-play-hud{z-index:10;pointer-events:none;grid-template-columns:minmax(140px,1fr) minmax(190px,auto) minmax(300px,1fr);align-items:start;gap:12px;display:grid}.color-hud-stats,.color-hud-actions{align-items:center;gap:7px;display:flex}.color-hud-actions{justify-content:flex-end}.color-hud-stat{color:#fff;background:#082b4de0;border:1px solid #ffffff47;border-radius:8px;min-width:72px;padding:6px 10px;box-shadow:0 4px 12px #0826432e}.color-hud-stat span{color:#cceaff;letter-spacing:0;text-transform:uppercase;font-size:.59rem;font-weight:850;display:block}.color-hud-stat strong{font-variant-numeric:tabular-nums;margin-top:1px;font-size:1.22rem;line-height:1;display:block}.color-hud-title{text-align:center;background:#fff;border:3px solid #70c6e9;border-radius:8px;min-width:190px;padding:7px 22px;box-shadow:0 4px 12px #08264321}.color-hud-title span{color:var(--color-teal-dark);letter-spacing:0;text-transform:uppercase;font-size:.57rem;font-weight:900;display:block}.color-hud-title strong{text-overflow:ellipsis;white-space:nowrap;font-size:1.08rem;line-height:1.2;display:block;overflow:hidden}.color-icon-button{color:#fff;min-width:78px;height:44px;font:inherit;pointer-events:auto;cursor:pointer;background:#082b4de6;border:2px solid #ffffff52;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:.78rem;font-weight:850;display:inline-flex;box-shadow:0 4px 12px #0826432e}.color-icon-button:hover,.color-icon-button:focus-visible{background:#116196}.color-icon-button:focus-visible{outline:4px solid var(--color-yellow);outline-offset:2px}.color-icon-button svg{fill:none;stroke:currentColor;stroke-width:2.3px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px}.color-tracking-pill{box-sizing:border-box;color:#fff;pointer-events:none;background:#082b4de6;border:2px solid #ffffff52;border-radius:8px;align-items:center;gap:8px;min-width:142px;height:44px;margin:0;padding:0 12px;display:flex}.color-tracking-pill>strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;line-height:1;overflow:hidden}.color-tracking-pill>span{background:#ff8d92;border:2px solid #ffffffc7;border-radius:50%;flex:none;width:12px;height:12px;box-shadow:0 0 0 4px #ff8d922e}.color-tracking-pill.is-tracking>span{background:#60d5a8;box-shadow:0 0 0 4px #60d5a833}.color-target-card{z-index:5;justify-content:center;place-self:center;align-items:center;gap:var(--target-gap);--target-swatch:58px;--target-gap:13px;background:var(--color-cream);border:4px solid var(--color-teal);border-radius:8px;min-height:60px;padding:8px 26px;display:flex;box-shadow:0 7px #08706b2e,0 12px 24px #0a2b571f}.color-target-card[hidden]{display:none}.color-find-label{color:var(--color-teal-dark);letter-spacing:0;font-size:.82rem;font-weight:950}.color-target-swatch{width:var(--target-swatch);height:var(--target-swatch);box-shadow:0 0 0 3px var(--color-navy);border:4px solid #fff;border-radius:50%;place-items:center;display:grid}.color-target-number{z-index:1;color:#22415c;text-align:center;paint-order:stroke fill;-webkit-text-stroke:.16em #fff;text-shadow:0 2px #10345440;margin-left:calc(-1 * (var(--target-swatch) + var(--target-gap)));width:var(--target-swatch);font-family:"Baloo 2",Fredoka,ui-rounded,SF Pro Rounded,Arial Rounded MT Bold,Comic Sans MS,Trebuchet MS,system-ui,sans-serif;font-size:2.3rem;font-weight:900;line-height:1}.color-target-name{letter-spacing:0;white-space:nowrap;font-size:clamp(1.2rem,2.4vw,1.8rem);font-weight:950}.color-grid-stage{z-index:2;place-items:center;min-width:0;min-height:0;padding:4px;display:grid;position:relative}.color-grid{--grid-cols:12;--grid-rows:8;width:min(100%, calc(100vw - 24px), calc((100vh - 320px) * (var(--grid-cols) / var(--grid-rows))));aspect-ratio:var(--grid-cols) / var(--grid-rows);grid-template-columns:repeat(var(--grid-cols), 1fr);grid-template-rows:repeat(var(--grid-rows), 1fr);background:#fff;border:4px solid #9fc7dc;border-radius:10px;gap:1px;margin-bottom:100px;padding:3px;display:grid;box-shadow:0 14px 34px #0a2b5729}.color-grid.is-region-picture{aspect-ratio:3/2;background:#fff;width:min(100%,100vw - 24px,150vh - 480px);padding:4px;display:block}.color-region-svg{border-radius:5px;width:100%;height:100%;display:block;overflow:hidden}.color-region.color-grid-cell{display:initial;cursor:pointer;transform-box:fill-box;transform-origin:50%;background:0 0;border:0;outline:none}.color-region-shape{fill:#fffdf8;stroke:#24465e;stroke-width:8px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:fill .28s,filter .18s}.color-region:hover .color-region-shape,.color-region:focus-visible .color-region-shape{filter:drop-shadow(0 0 8px #ffd244e6);stroke:#0a2b57;stroke-width:12px}.color-region.is-painted .color-region-shape{fill:var(--cell-color)}.color-region .color-grid-cell-number{dominant-baseline:middle;text-anchor:middle;stroke:#fff;stroke-width:8px;stroke-linejoin:round;paint-order:stroke fill;font-size:38px}.color-region-ink{pointer-events:none;fill:#24465e}.color-region-ink .is-stroke{fill:none;stroke:#24465e;stroke-width:8px;stroke-linecap:round;vector-effect:non-scaling-stroke}.color-region .color-grid-dwell-ring{fill:none;stroke:var(--color-teal-dark);stroke-width:10px;stroke-linecap:round;stroke-dasharray:var(--dwell-progress,0) 1;opacity:0;transform-box:fill-box;transform-origin:50%;inset:auto;transform:rotate(-90deg);-webkit-mask:none;mask:none}.color-region.is-dwelling{transform:none}.color-region.is-dwelling .color-grid-dwell-ring{opacity:1}.color-region.is-hint-glow .color-region-shape,.color-region.is-hint-pulse .color-region-shape{filter:drop-shadow(0 0 12px #ffd244)}.color-grid-cell{min-width:0;min-height:0;color:var(--color-navy);outline-offset:-2px;cursor:pointer;background:#f3f8fb;border:none;place-items:center;padding:0;transition:background-color .18s;display:grid;position:relative;container-type:size}.color-grid-cell:focus-visible{z-index:3;outline:3px solid var(--color-yellow)}.color-grid-cell-number{z-index:1;color:#2a4d68;letter-spacing:-.02em;paint-order:stroke fill;-webkit-text-stroke:.16em #fff;text-shadow:0 .06em #10345438;pointer-events:none;-webkit-user-select:none;user-select:none;font-family:"Baloo 2",Fredoka,ui-rounded,SF Pro Rounded,Arial Rounded MT Bold,Comic Sans MS,Trebuchet MS,system-ui,sans-serif;font-size:clamp(.7rem,2.4vmin,2rem);font-weight:900;line-height:1}@supports (container-type:size){.color-grid-cell-number{font-size:62cqmin}}.color-grid-cell.is-painted{background:var(--cell-color);cursor:default;box-shadow:inset 0 0 0 2px #ffffff8c,inset 0 -3px 5px #00000024}.color-grid-cell.is-painted .color-grid-cell-number{opacity:0;-webkit-text-stroke-width:0;text-shadow:none}#color-voice[aria-pressed=false] .color-voice-waves,#color-voice[aria-pressed=true] .color-voice-muted{display:none}.color-grid-cell.is-freshly-painted{animation:.42s cubic-bezier(.34,1.56,.64,1) both color-cell-pop}.color-grid-dwell-ring{background:conic-gradient(var(--color-teal-dark) calc(var(--dwell-progress,0) * 360deg), transparent 0);opacity:0;pointer-events:none;border-radius:50%;transition:opacity .14s;position:absolute;inset:6%;-webkit-mask:radial-gradient(farthest-side,#0000 78%,#000 80%);mask:radial-gradient(farthest-side,#0000 78%,#000 80%)}.color-grid-cell.is-dwelling{z-index:2;transform:scale(1.18)}.color-grid-cell.is-dwelling .color-grid-dwell-ring{opacity:1}.color-grid-cell.is-incorrect{animation:.42s color-cell-shake}.color-grid-cell.is-hint-glow{box-shadow:0 0 0 3px var(--color-yellow) inset;animation:1.4s ease-in-out infinite color-hint-glow-pulse}.color-grid-cell.is-hint-pulse{z-index:2;animation:1s ease-in-out infinite color-hint-cell-pulse}.color-hint-area{z-index:1;border:3px dashed var(--color-yellow);opacity:0;pointer-events:none;background:#ffd2441f;border-radius:10px;transition:opacity .2s,left .2s,top .2s,width .2s,height .2s;position:absolute}.color-hint-area.is-active{opacity:1}.color-cursor{z-index:25;pointer-events:none;width:64px;height:64px;position:fixed;transform:translate(-50%,-50%)}.color-cursor[hidden]{display:none}.color-cursor-ring{box-shadow:0 0 0 4px var(--color-teal), 0 8px 20px #0827444d;border:5px solid #fff;border-radius:50%;position:absolute;inset:0}.color-cursor-dot{background:var(--color-teal-dark);border-radius:50%;width:14px;height:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.color-help-button{z-index:10;color:#fff;font:inherit;cursor:pointer;background:#e8752f;border:none;border-radius:999px;align-items:center;gap:8px;padding:10px 22px;font-size:.95rem;font-weight:850;display:inline-flex;position:absolute;bottom:56px;left:50%;transform:translate(-50%);box-shadow:0 6px 16px #e8752f59}.color-help-button:hover,.color-help-button:focus-visible{background:#d1651f}.color-help-button:focus-visible{outline:4px solid var(--color-yellow);outline-offset:2px}.color-help-button svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.color-support-message{z-index:4;color:#fff;background:var(--color-navy);text-align:center;border:2px solid #ffffff59;border-radius:8px;min-width:min(620px,76vw);padding:8px 20px;font-size:clamp(.9rem,1.7vw,1.12rem);font-weight:780;line-height:1.2;position:absolute;bottom:10px;left:50%;transform:translate(-50%);box-shadow:0 5px 14px #0a2b572e}.color-confetti{z-index:20;pointer-events:none;position:absolute;inset:0;overflow:hidden}.color-completion{z-index:30;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;background:#07244294;place-items:center;padding:24px;display:grid;position:absolute;inset:0}.color-completion[hidden]{display:none}.color-completion-card{width:min(540px,92vw);color:var(--color-navy);background:var(--color-cream);border:5px solid var(--color-teal);text-align:center;border-radius:8px;padding:clamp(24px,4vw,42px);animation:.46s ease-out both color-completion-in;box-shadow:0 18px 46px #00000042}.color-completion-card h2{letter-spacing:0;margin:7px 0 10px;font-size:clamp(2rem,5vw,3.5rem)}.color-completion-card>p:not(.eyebrow){color:#3f5d73;font-size:1.08rem}.color-completion-stars{color:#ffc928;letter-spacing:0;text-shadow:0 3px #d48b00;font-size:2.2rem;display:block}.color-completion-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px;display:flex}.color-confetti-piece{top:-24px;left:var(--x);background:var(--color);opacity:0;width:12px;height:22px;transform:rotate(var(--turn));border-radius:2px;display:block;position:absolute}.color-confetti.is-active .color-confetti-piece{animation:color-confetti-fall 2.5s ease-in var(--delay) both}.color-grid-stage.is-revealing .color-grid{animation:.9s ease-out both color-grid-reveal}.color-grid-stage.is-revealing[data-reveal=launch] .color-grid{animation-name:color-grid-reveal-launch}.color-grid-stage.is-revealing[data-reveal=bubbles] .color-grid{animation-name:color-grid-reveal-bubbles}.color-grid-stage.is-revealing[data-reveal=stomp] .color-grid{animation-name:color-grid-reveal-stomp}@keyframes color-cell-pop{0%{transform:scale(.55)}60%{transform:scale(1.16)}to{transform:scale(1)}}@keyframes color-cell-shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}@keyframes color-hint-glow-pulse{0%,to{box-shadow:0 0 0 3px var(--color-yellow) inset}50%{box-shadow:inset 0 0 0 3px #0000}}@keyframes color-hint-cell-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.22)}}@keyframes color-grid-reveal{0%{filter:brightness();transform:scale(.97)}40%{filter:brightness(1.12);transform:scale(1.02)}to{filter:brightness();transform:scale(1)}}@keyframes color-grid-reveal-launch{0%{transform:translateY(0)scale(1)}45%{transform:translateY(-18px)scale(1.03)}to{transform:translateY(0)scale(1)}}@keyframes color-grid-reveal-bubbles{0%{filter:brightness();transform:translateY(0)scale(1)}50%{filter:brightness(1.08);transform:translateY(-6px)scale(1.015)}to{filter:brightness();transform:translateY(0)scale(1)}}@keyframes color-grid-reveal-stomp{0%,to{transform:translateY(0)}20%{transform:translateY(6px)}35%{transform:translateY(0)}50%{transform:translateY(4px)}65%{transform:translateY(0)}}@keyframes color-completion-in{0%{opacity:0;transform:translateY(22px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes color-confetti-fall{0%{opacity:0;transform:translateY(-20px) rotate(var(--turn))}12%{opacity:1}to{opacity:0;transform:translateY(640px) rotate(calc(var(--turn) + 200deg))}}@media (prefers-reduced-motion:reduce){.color-picture-choice,.color-grid-cell,.color-cursor,.color-hint-area{transition:none}.color-grid-cell.is-freshly-painted,.color-grid-cell.is-incorrect,.color-grid-cell.is-hint-glow,.color-grid-cell.is-hint-pulse,.color-completion-card,.color-confetti.is-active .color-confetti-piece,.color-grid-stage.is-revealing .color-grid{animation-duration:1ms!important}}@media (width<=720px){.color-play-hud{grid-template-columns:1fr;justify-items:center;gap:6px}.color-hud-actions{justify-content:center}}.game-page.color-theme{--theme:var(--color-teal);--theme-dark:#066864;--theme-soft:#dcf4f1;--theme-bright:var(--color-teal)}.game-page.color-theme .eyebrow{color:var(--theme-dark)}.player-home .color-picture-section{box-shadow:none;background:0 0;border:0;margin:0;padding:0}.player-home .color-picture-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:0}.range-row{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 14px;display:grid}.range-row>span{gap:2px;display:grid}.range-row>span small{color:var(--ink-soft);font-size:.86rem}.range-row output{color:var(--theme-dark);font-weight:850}.range-row input,.range-row .range-scale{grid-column:1/-1}.range-row input{width:100%;accent-color:var(--theme-dark)}
