/* Umvion · luminous technology theme. Game state colours stay semantic. */
:root,body,body.dark{color-scheme:dark;--text:#e9f6ff;--bg:#091727;--surface:#102438;--muted:#9db8cb;--line:#234055;--primary:#58dcf2;color:var(--text);background-color:#050d19}
body,body.dark{background:radial-gradient(ellipse at 15% 5%,#0f394950,transparent 45%),radial-gradient(ellipse at 90% 90%,#13396255,transparent 50%),repeating-linear-gradient(90deg,transparent 0 79px,#75deff04 80px),#050d19;background-attachment:fixed}
.app,body.dark .app{max-width:620px;background:linear-gradient(160deg,#0c1e30,#081421 70%);border:1px solid #264b61;box-shadow:0 0 0 5px #0e28301f,0 30px 90px #0008,0 0 70px #27d9ef09;border-radius:28px}
header{border-bottom:1px solid #203b4e;margin-bottom:20px;background:#091a2caa}
.brand{color:#ebfaff;font-size:24px;letter-spacing:.3px;gap:7px}.brand-logo{width:52px;height:52px;object-fit:contain;border-radius:0;filter:drop-shadow(0 0 8px #43e0f64d);margin-right:5px}.beta{color:#70b6cb}.icon{background:#10283b;border-color:#2c5268;color:#b8dfed;min-width:36px}
h1,h2{color:#e9f7ff}h1{letter-spacing:-.7px}.label{color:#77c9de;font-size:10px;letter-spacing:.18em}.welcome{color:#afc5d6}.local-note,.session-help,footer,footer span{color:#9bb6ca}
:is(body,body.dark) .progression-panel{background:linear-gradient(110deg,#103447,#102339);border:1px solid #326379;border-radius:20px;box-shadow:inset 0 1px 0 #b3efff0d,0 0 22px #17bed408}.profile-entry strong{color:#e0f8ff}.profile-entry small{color:#a8cfdf}.profile-entry>b{color:#6edcef}.study-avatar{filter:drop-shadow(0 3px 8px #0005)}
progress{appearance:none;-webkit-appearance:none;border:0;background:#071521;border-radius:8px;overflow:hidden;height:7px}progress::-webkit-progress-bar{background:#071521}progress::-webkit-progress-value{background:linear-gradient(90deg,#287ba0,#66ebf5);border-radius:8px}progress::-moz-progress-bar{background:linear-gradient(90deg,#287ba0,#66ebf5)}
.social-panel{border-radius:18px;background:#0b1e2f;border-color:#203c52}.test-label{background:#263027;border:1px solid #4b5340;color:#d2c594;font-size:9px;letter-spacing:.04em}.social-nav{gap:7px}.social-nav button,.periods button{color:#a5d9e9;background:#10283b;border-color:#294e65;border-radius:10px}.social-nav button:hover,.periods button:hover{background:#173d52;border-color:#5fcddd}.periods button.selected{background:#235668;color:#e7fdff;border-color:#68dff0}
.hero{background:radial-gradient(circle at 94% 5%,#43dcf527,transparent 45%),linear-gradient(120deg,#14394e,#0f263d);border:1px solid #38718a;box-shadow:inset 0 1px 0 #a3efff18,0 10px 40px #0002;border-radius:20px}.hero:before{content:'';position:absolute;width:200px;height:200px;border:1px solid #59d7eb1a;border-radius:50%;right:-85px;top:-90px;box-shadow:0 0 0 18px #59d7eb07,0 0 0 40px #59d7eb05;pointer-events:none}.hero .label{color:#76d9e8}.hero h2{color:#edfaff;font-size:29px;max-width:400px}.hero p{color:#b4cfdd}.mini-symbols span{background:#0a203080;border:1px solid #2e6276;color:#82e6f0;border-radius:9px}
.primary,.hero .primary,.umvion-welcome .primary{background:linear-gradient(105deg,#63e6ec,#4bbbdc);color:#052133;box-shadow:0 3px 18px #32cbe21a,inset 0 1px 0 #dcffff80;border:1px solid #8beef155;border-radius:12px;font-weight:750}.primary:hover{filter:brightness(1.08)}.secondary{background:#112c3f;border-color:#2d556b;color:#c3e3ef}.text-button{color:#72dded}.back{color:#b1cfdd}.pill{background:#10283a;border-color:#2b4d63;color:#b4cfdd}
.stats{padding:19px 8px;background:#0b2032;border:1px solid #203d54;border-radius:16px}.stat strong{color:#dff8ff}.stat span{color:#9cbbcf}.section-head h2{color:#d9f2ff}.section-head span{color:#9ebacf}
.mode-list{grid-template-columns:1fr 1fr;gap:10px}.mode-card{position:relative;background:linear-gradient(130deg,#132d42,#0d2033);border:1px solid #284b62;border-radius:15px;padding:15px 12px;gap:11px;min-width:0;transition:border-color .15s,transform .15s}.mode-card:hover{border-color:#58c7dd;box-shadow:0 0 20px #39cfe90d}.mode-card strong{font-size:14px;line-height:1.35}.mode-card small{color:#9fbcd0;font-size:11px;line-height:1.5}.mode-card .chevron{font-size:16px}.mode-card>span:nth-child(2){min-width:0;flex:1}.mode-card .mode-icon{width:40px;height:44px;font-size:21px;border-radius:11px}
:is(body,body.dark) .mode-icon{background:linear-gradient(135deg,#194658,#163049);color:#82eff3;border:1px solid #38728a;box-shadow:inset 0 0 12px #69d9ef08}.mode-card[data-mode=memory] .mode-icon,.mode-card[data-mode=pairs] .mode-icon,.mode-card[data-mode=route] .mode-icon{color:#ffd18b;background:#40352a;border-color:#806446}.mode-card[data-mode=meaning] .mode-icon,.mode-card[data-mode=spelling] .mode-icon,.mode-card[data-mode=english] .mode-icon{color:#c9c1ff;background:#2c3150;border-color:#575b8f}.mode-locked{opacity:1;background:#0a1b2a;border-color:#1c384d}.mode-locked strong,.mode-locked small{color:#8ca6b9}.mode-locked .mode-icon{filter:saturate(.4);opacity:.7}.mode-locked .chevron{font-size:11px;color:#a4b8c8}
.question-label,.round-meta,.feedback{color:#b5d0df}.timer{color:#91edf6}.progress span{background:#20374c}.progress .done{background:linear-gradient(90deg,#2ea9ce,#7eebf6);box-shadow:0 0 8px #50ddec28}.equation{color:#e1faff;text-shadow:0 0 35px #5fe1f017}.answer{background:#112d42;border-color:#33566e;color:#e4f7ff;box-shadow:inset 0 1px 0 #baf8ff09;font-size:clamp(17px,4.8vw,29px);padding:12px;overflow-wrap:anywhere}.answer:hover:not(:disabled){border-color:#66dcea}.answer:disabled{opacity:1}.answer:disabled:not(.good):not(.bad){color:#8ba5b9;background:#0b2133}.tile{background:#102b3e;border-color:#31546a;color:#e4f7ff}
:is(body,body.dark) .tile.picked{background:#16485c;border-color:#69e3ed;color:#b3fbff}:is(body,body.dark) .tile.lit{background:#e3ad54;border-color:#ffdba0;color:#142335;box-shadow:0 0 20px #edbe5040}.tile.found{background:#0b2730;color:#70998e;border-color:#284c4a}.answer.good,.tile.good{background:#113f37!important;border-color:#5fdbaf!important;color:#b6ffdf!important}.answer.bad,.tile.bad{background:#492632!important;border-color:#f2849c!important;color:#ffccda!important}
:is(body,body.dark) .daily-tag{background:#153c50;color:#9beafa;border:1px solid #2b627b}:is(body,body.dark) .score-circle{border-color:#183b50;border-top-color:#78eaf3;border-right-color:#36bdd4;box-shadow:0 0 30px #47dfeb0a}.score-circle strong{color:#d5faff}.pause-card,.result-stats,.history-row,.friend-row{background:#0f273b;border-color:#2a4b63}.leader-row.you{background:#154053;color:#d4f7ff}.server-saved,.level-up{background:#153b35;border:1px solid #2e6e60;color:#aeebd0}#social-error{color:#ffa2b6}.day-column>div{background:linear-gradient(#72e8ef,#2386ab)}
:is(body,body.dark) .avatar-choice{background:#10293d;border-color:#294b60;border-radius:16px}:is(body,body.dark) .avatar-choice:hover{background:#173b50}:is(body,body.dark) .avatar-choice.selected{background:#194758;border-color:#82eff0;box-shadow:0 0 14px #45d3e21a}.avatar-choice small{color:#c0d7e4}.profile-summary{background:#102d3f;padding:20px;border:1px solid #2c5d73;border-radius:20px}.level-stop{border-color:#2b4d64}.level-stop small{color:#9ebbcf}:is(body,body.dark) .level-stop>b{background:#153749;color:#b0eaf5}:is(body,body.dark) .level-stop.current{background:#12394b;border-color:#74e5ee}:is(body,body.dark) .level-stop.passed>b{background:#1c4c48;color:#b2f5dd}#profile-locale{border-color:#315a71;background:#10283c;color:#d9edf8}
.difficulty-steps{border-color:#2a4c61}.difficulty-steps b{background:#164354;color:#a8f3fb}.pattern{background:#092032;border:1px solid #2b5268}.pattern>span{background:#153248;border-color:#31526b}.pattern>span.filled{background:#64dce7;border-color:#98f5fa}:is(body,body.dark) .sudoku .tile.given{background:#183348;color:#9cbdcf}:is(body,body.dark) .sudoku .tile.active-cell{background:#21546b;box-shadow:inset 0 0 0 3px #63dce6}.sudoku .tile{border-color:#33516b}.sudoku .tile:nth-child(4n+2){border-right-color:#a6c8d8}.sudoku .tile:nth-child(n+5):nth-child(-n+8){border-bottom-color:#a6c8d8}
.clock-face{fill:#10283a;stroke:#38637a}.clock-tick{stroke:#739bb1}.clock-tick.major{stroke:#b0d5e6}.clock-number{fill:#d9f3ff}:is(body,body.dark) .clock-minute{stroke:#edfaff}.clock-hour,.clock-pin{stroke:#b3a1ff;fill:#b3a1ff}.clock-legend{color:#abc8da}
/* Preserve the task colours themselves; a neutral light field keeps them readable. */
.color-word{background:#e8f0f4;border:1px solid #95b7c9;border-radius:16px;margin:18px 0}.color-noise{color:#baadde}:is(body,body.dark) .rectangles .tile{background:#e8f0f4;border-color:#a7bece}:is(body,body.dark) .rectangles .tile.picked{background:#d5f3f6;outline-color:#057486}.chess-board{border-color:#426b80;box-shadow:0 0 25px #2aaec60d}.chess-square.picked{box-shadow:inset 0 0 0 4px #236694}.chess-square small{font-size:9px}
dialog{background:#102437;border-color:#3b697f;box-shadow:0 20px 90px #0009}dialog::backdrop{background:#020b16b8}.comparison th{color:#aacbda}input:not([type=checkbox]){background:#0a2032;border-color:#31596f}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b6f5ff;outline-offset:3px}
.umvion-welcome{background:radial-gradient(ellipse at 50% 25%,#10425370,transparent 55%),linear-gradient(165deg,#0d2337,#061321);border:1px solid #315e73;box-shadow:0 0 80px #15a9c311;max-width:620px;position:relative;isolation:isolate}.umvion-welcome:before{content:'';position:absolute;inset:18px;border:1px solid #35657940;border-radius:22px;pointer-events:none;z-index:-1}.welcome-orbit{width:min(68vw,290px)}.welcome-orbit img{filter:drop-shadow(0 0 24px #22c8e230)}.welcome-eyebrow{color:#92e7f2;font-size:10px;letter-spacing:.21em}.umvion-welcome h1{letter-spacing:1px;font-weight:750}.welcome-slogan{color:#c5ecf5}.welcome-facts span{background:#0d2d3f;border-color:#366076;color:#bee8f2}.welcome-footnote{color:#9fbfce}
@media(max-width:600px){.app,body.dark .app{max-width:100%;margin:0;border:0;border-radius:0;min-height:100dvh}.mode-list{grid-template-columns:1fr}.mode-card{padding:16px;gap:14px}.mode-card .mode-icon{width:48px;height:48px}.mode-card strong{font-size:15px}.mode-card small{font-size:12px}.umvion-welcome{border:0;border-radius:0;min-height:100svh}.umvion-welcome:before{inset:12px}header{padding:16px 20px}#content{padding:6px 20px 24px}.brand-logo{width:46px;height:46px}.details{flex-wrap:wrap}.section-head{gap:8px}.hero h2{font-size:27px}}
@media(max-height:700px){.welcome-orbit{width:180px}.umvion-welcome h1{font-size:44px}.welcome-slogan{font-size:18px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Cyber-scientific surface: fine etched grid, circuit traces and soft light. */
:is(body,body.dark){background-color:#040e19;background-image:radial-gradient(ellipse at 12% 5%,#087d8d26,transparent 50%),radial-gradient(ellipse at 88% 80%,#2d427b30,transparent 50%),repeating-linear-gradient(0deg,transparent 0 39px,#48afc20a 39px 40px),repeating-linear-gradient(90deg,transparent 0 39px,#48afc20a 39px 40px);background-attachment:fixed}
:is(body,body.dark) .app,.umvion-welcome{background-color:#081928;background-image:radial-gradient(ellipse at 50% 0,#17637b33,transparent 55%),repeating-linear-gradient(0deg,transparent 0 3px,#6ba4b903 3px 4px),repeating-linear-gradient(90deg,transparent 0 63px,#7cc9dc06 63px 64px);border-color:#2c586b;box-shadow:0 24px 100px #0008,0 0 60px #31d4e20c}
.umvion-welcome:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.25;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 360 360'%3E%3Cg fill='none' stroke='%234fb8ce' stroke-width='.6'%3E%3Cpath d='M0 40h38l26 26v62l36 36h35M360 300h-46l-30-30v-78l-42-42h-30M0 280h28l36-36v-20M360 60h-36l-40 40v24'/%3E%3Ccircle cx='135' cy='164' r='3'/%3E%3Ccircle cx='212' cy='150' r='3'/%3E%3Ccircle cx='64' cy='224' r='3'/%3E%3C/g%3E%3C/svg%3E")}
.hero{border:1px solid #408095;box-shadow:inset 0 1px 0 #93f2ff12}.hero h2{max-width:none}.hero p{max-width:440px}.hero .primary{width:100%}.mode-card{min-height:104px}.mode-card>span:nth-child(2){flex:1;min-width:0}.mode-card small{line-height:1.5}.mode-card:hover{transform:translateY(-2px);border-color:#72d9e7!important}.brand-logo{object-fit:contain;background:transparent!important;border-radius:0!important}.welcome-orbit img{background:transparent!important}.welcome-orbit{margin-bottom:12px}.welcome-facts{flex-wrap:wrap;justify-content:center}
.boot-loader{width:min(320px,100%);margin:22px auto}.boot-loader progress{width:100%;height:7px;border-radius:8px;overflow:hidden;background:#163345;accent-color:#7ce9f3}.boot-loader progress::-webkit-progress-bar{background:#163345}.boot-loader progress::-webkit-progress-value{background:linear-gradient(90deg,#298fa9,#91f5f7);box-shadow:0 0 14px #5de1ee}.boot-loader small{display:block;margin-top:10px;color:#a7cbd9;font-size:12px}
#content label{display:block;color:#bcd7e4;font-size:14px;margin:16px 0 9px}#content input:not([type=checkbox]):not([type=range]),#content select{width:100%;padding:13px;border-radius:12px;border:1px solid #365e73;background:#0b2233;color:#e5f4f9;font:inherit;margin-top:8px}#content input[type=range]{display:block;width:100%;accent-color:#62dfea;margin:14px 0}#content .toggle{display:flex;align-items:center;gap:10px}#content input[type=checkbox]{accent-color:#64e0ea;width:18px;height:18px}
.avatar-library{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.avatar-choice{padding:6px;min-width:0;overflow:hidden}.avatar-choice .study-avatar{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:11px}.avatar-choice small{display:block;font-size:10px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;margin:6px 0 2px}.avatar-choice.selected{outline:2px solid #92f4f2;outline-offset:2px}.profile-entry .study-avatar{width:60px;height:60px;object-fit:cover;border-radius:15px;flex-shrink:0}.avatar-pages{display:flex;justify-content:center;align-items:center;gap:22px;margin:18px 0 28px}.avatar-pages button{min-width:52px;padding:9px}.level-map{margin-top:28px;padding:18px;border:1px solid #30566b;border-radius:14px}.level-map summary{cursor:pointer;color:#aeeef6}.social-nav{gap:7px}.social-nav button{padding:9px 11px}.friend-row h2{font-size:20px}.friend-row small{line-height:1.6}#save-settings{display:block;width:100%;margin-top:24px}
@media(max-width:600px){.avatar-library{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.mode-card{min-height:92px}.section-head{align-items:flex-start}.section-head span{text-align:right;max-width:125px}.welcome-facts{gap:7px}.umvion-welcome{padding-left:26px;padding-right:26px}}
@media(prefers-reduced-motion:reduce){.mode-card:hover{transform:none}}
#settings-back{display:block;margin:0 0 22px}#settings-back+.label{display:block}.level-map small{color:#a3c6d7}
/* User-supplied background stays fixed while the content scrolls. */
:is(body,body.dark).has-game-background{background-image:linear-gradient(#040d1b32,#040d1b64),var(--game-background);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed}
:is(body,body.dark).has-game-background .app{background-color:#06142590;background-image:linear-gradient(135deg,#102d4738,#06132168)}
:is(body,body.dark).has-game-background .umvion-welcome{background-color:#06142548;background-image:linear-gradient(135deg,#102d4720,#06132158)}
.has-game-background .umvion-welcome:after{opacity:.1}
.has-game-background .mode-card,.has-game-background .friend-row,.has-game-background .progression-panel{background-color:#0b2236ee}
.clock-period-box{fill:#19394f;stroke:#75e5ef;stroke-width:1}.clock-period{fill:#c8f8ff;font-size:17px;font-weight:800;letter-spacing:1px}.topline{flex-wrap:wrap;gap:12px}.exit-session{margin-left:auto;color:#ffbcb5}.player-statistics{width:100%;margin-bottom:20px;padding:14px}.personal-stats{margin-top:22px}.personal-table{overflow-x:auto;margin-bottom:24px}.personal-table table{min-width:520px}.personal-table small{display:block;margin-top:5px;color:#a4c6d8}.personal-table th{font-size:12px}#balanced-start{margin-top:20px}#leave-between{margin-top:14px}
.profile-summary.personal-summary{display:block}.personal-summary h2{margin:12px 0 8px}.personal-summary p{margin:8px 0 16px}.personal-summary progress{display:block;width:100%}
.analog-clock{filter:drop-shadow(0 8px 8px #0005)}.analog-clock .clock-face{fill:url(#dial-paper);stroke:#444e55;stroke-width:2}.analog-clock .clock-number{fill:#20252b;font:600 19px Georgia,serif}.analog-clock .clock-tick{stroke:#55544f}.analog-clock .clock-tick.major{stroke:#25292d;stroke-width:2.5}:is(body,body.dark) .analog-clock .clock-hour{fill:#222a31;stroke:#222a31;stroke-width:1}:is(body,body.dark) .analog-clock .clock-minute{fill:#28323c;stroke:#28323c;stroke-width:1}:is(body,body.dark) .analog-clock .clock-pin{fill:#b1bbc1;stroke:#313b44;stroke-width:2}.analog-clock .clock-period-box{fill:#c2ccc1;stroke:#303a40}.analog-clock .clock-period{fill:#24312a;font-family:monospace}.board.rectangles{width:100%;max-width:480px;margin:20px auto;gap:6px}.board.rectangles .tile{aspect-ratio:1;min-height:0;height:auto;padding:0;font-size:23px;border-radius:9px}@media(max-width:400px){.board.rectangles{gap:4px}.board.rectangles .tile{font-size:20px;border-radius:6px}}

.board.attention{width:100%;max-width:500px;margin:20px auto;gap:8px}.board.attention .tile{aspect-ratio:1;height:auto;min-height:0;padding:0;font-size:clamp(17px,4vw,28px);font-variant-numeric:tabular-nums}@media(max-width:400px){.board.attention{gap:5px}}

.color-label{display:inline-block}.color-word{overflow:hidden}.color-noise{text-align:center;line-height:1.6}

/* Focused game screen: controls replace the brand header. */
.app:has(.session-toolbar)>header,.app:has(.pause-card)>header{display:none}
.app:has(.session-toolbar){overflow:visible;margin-top:0;min-height:100dvh}
.session-toolbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;margin:0 -25px 18px;padding:14px 25px;background:#0b2033f5;border-bottom:1px solid #31536c;border-radius:24px 24px 0 0}
.session-toolbar .timer{margin-right:auto;font-size:23px;font-variant-numeric:tabular-nums;white-space:nowrap}
.session-toolbar button{min-height:44px;padding:10px 16px;border-radius:11px;font-weight:700;border:1px solid #42637a;background:#15354b;color:#e1f5ff;white-space:nowrap}
.session-toolbar .exit-session{margin-left:0;background:#713c45;border-color:#c77b84;color:#fff}
.session-toolbar .exit-session:hover{background:#884b56}.session-toolbar button:focus-visible{outline:3px solid #7feaff;outline-offset:3px}
.session-mode{margin-bottom:12px}.session-toolbar+.session-mode+.game-head{margin-top:0}
@media(max-width:600px){.session-toolbar{margin-left:-20px;margin-right:-20px;padding:12px 20px;border-radius:0;padding-top:max(12px,env(safe-area-inset-top))}}
@media(max-width:360px){.session-toolbar{gap:7px}.session-toolbar button{padding:10px 12px}.session-toolbar .timer{font-size:21px}}
.board.attention{max-width:clamp(270px,calc(100svh - 290px),500px)}

.session-toolbar{display:grid;grid-template-columns:1fr auto 1fr}.session-logo{width:54px;height:54px;object-fit:contain;justify-self:start}.session-toolbar .timer{margin:0;justify-self:center}.session-toolbar .session-pause{justify-self:end}.pause-help,.pause-audio{text-align:left;padding:16px;border:1px solid #34546b;border-radius:14px;margin:18px 0;background:#0d263a}.pause-help h3,.pause-audio h3{margin-top:0}.pause-audio .secondary{width:100%;margin:5px 0}.pause-audio [aria-pressed="true"]{border-color:#63cdd6;background:#174d59;color:#e9ffff}.pause-card #exit{border:1px solid #bd7780;background:#713c45;color:#fff}.pause-card{padding-top:20px}

.board.attention.compact-numbers{max-width:320px}.no-active-hint .tile.active-cell{box-shadow:none!important;background:var(--surface)!important}.board.attention:has(> :nth-child(64)) .tile{font-size:clamp(11px,2.6vw,18px)}

.equation.long-equation{font-size:clamp(23px,5vw,34px);line-height:1.6;overflow-wrap:anywhere}

/* Lighter glass panels and a consistent interface type scale. */
:root{font-family:Inter,'Segoe UI',system-ui,sans-serif}button,input,select{font-family:inherit}
.app,body.dark .app{background:linear-gradient(160deg,rgba(12,30,48,.66),rgba(8,20,33,.60));backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
:is(body,body.dark) .progression-panel{background:linear-gradient(110deg,#10344799,#10233988)}
.social-panel{background:#0b1e2f88}.hero{background:radial-gradient(circle at 94% 5%,#43dcf51c,transparent 45%),linear-gradient(120deg,#14394e99,#0f263d77)}
.mode-card,.practice-entry{background:#102c3f88;border:1px solid #45718488;border-radius:18px}
.practice-entry{padding:22px;margin:22px 0}.practice-entry p{margin:8px 0 20px;color:#c0d6e3;font-size:16px;line-height:1.6}
.hero h2,.practice-entry h2{font-size:26px;font-weight:700;line-height:1.25;letter-spacing:-.4px;max-width:none}.hero p{max-width:none;font-size:16px;line-height:1.6;margin:14px 0 24px}
.primary,.secondary,.hero .primary,.text-button,.back{font-family:inherit;font-size:16px;font-weight:600;letter-spacing:0;line-height:1.35}
.hero .primary{display:block;text-align:center}.mode-card strong{font-size:17px;font-weight:600}.mode-card small{font-size:14px;line-height:1.45}.chevron,.profile-entry>b{display:none}.mode-card{grid-template-columns:auto 1fr}
.session-toolbar{background:#0b2033d9}.pause-help,.pause-audio{background:#0d263a99}.secondary{background:#112c3faa}.hero:before{opacity:.45}
:is(body,body.dark).has-game-background .app{background:linear-gradient(145deg,#0b253b66,#06132170);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

.back{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 17px;border:1px solid #5a8da6;border-radius:12px;background:#17374bcc;color:#e3f6ff;font-weight:600;text-decoration:none;margin-bottom:12px}.back:hover{background:#24516add}.back:focus-visible{outline:3px solid #77e9f3;outline-offset:3px}
#practice-tier{appearance:none;-webkit-appearance:none;padding-right:52px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cpath d='m4 6 5 5 5-5' fill='none' stroke='%23c4ecf5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 20px center;background-size:18px}
:is(body,body.dark) .memory .tile.memory-color-0{background:#3184e6;color:#fff;border-color:#a7d4ff;box-shadow:inset 0 0 12px #ffffff22;opacity:1}
:is(body,body.dark) .memory .tile.memory-color-1{background:#f09a35;color:#201408;border-color:#ffe0a6;opacity:1}
:is(body,body.dark) .memory .tile.memory-color-2{background:#db5ba3;color:#fff;border-color:#ffd1ee;opacity:1}
:is(body,body.dark) .memory .tile.memory-color-3{background:#2fa976;color:#fff;border-color:#a9ffda;opacity:1}
/* Cyber-scientific palette for every exercise surface. */
#question-area{--game-panel:#0b2033;--game-line:#35647c;--game-ink:#e0f7ff;--game-cyan:#59e3f2;--game-violet:#b69cff}
#question-area .tile,#question-area .answer{background:linear-gradient(145deg,#123347e8,#091b2be8);border-color:var(--game-line);color:var(--game-ink);box-shadow:inset 0 1px 0 #abf8ff12,0 3px 12px #0002}
#question-area .tile:hover:not(:disabled),#question-area .answer:hover:not(:disabled){border-color:#72eaf4;box-shadow:inset 0 0 18px #4de1ee10,0 0 12px #42dbea20}
#question-area .tile:focus-visible,#question-area .answer:focus-visible{outline:2px solid #a8f6ff;outline-offset:3px}
#question-area .tile.picked{background:linear-gradient(145deg,#155e75,#143852);border-color:#67eff9;color:#e1fdff;box-shadow:inset 0 0 0 2px #6eeaf14d,0 0 16px #37dce22b;outline-color:#75edf7}
#question-area .tile.lit{background:linear-gradient(145deg,#2ac9e4,#17819f);border-color:#b3fbff;color:#041b28;box-shadow:0 0 24px #3cdeec60,inset 0 0 15px #e7ffff28}
#question-area .tile.found{background:#0a202b;color:#709fae;border-color:#294954;box-shadow:none}
#question-area .answer.good,#question-area .tile.good{background:#103d37!important;border-color:#55ecbd!important;color:#c6ffea!important;box-shadow:0 0 16px #55ecbd24!important}
#question-area .answer.bad,#question-area .tile.bad{background:#40233d!important;border-color:#ff739e!important;color:#ffd4e2!important;box-shadow:0 0 16px #ff739e20!important}
#question-area .answer:disabled:not(.good):not(.bad){background:#0a2030;color:#8facbf;box-shadow:none}
#question-area .pattern{background:#071c2d;border-color:#396179;box-shadow:inset 0 0 14px #59e3f20a}
#question-area .pattern>span{background:#123448;border-color:#28556b}
#question-area .pattern>span.filled{background:linear-gradient(135deg,#97f6ff,#34bedb);border-color:#b9fcff;box-shadow:0 0 5px #4ee3f546}
#question-area.no-pattern-grid .pattern span:not(.filled){background:transparent;border-color:transparent}
#question-area .color-word{background:linear-gradient(140deg,#102b42,#091c30);border:1px solid #3b6884;box-shadow:inset 0 0 28px #327bc313,0 0 20px #50d4f009;border-radius:18px}
#question-area .color-label{text-shadow:0 0 14px currentColor}#question-area .color-noise{color:#acb8e6}
#question-area .rectangles .tile{background:linear-gradient(140deg,#143249,#0a1d30);border-color:#355b77;text-shadow:0 0 7px currentColor}
#question-area .rectangles .tile.picked{background:#19475a;outline:3px solid #9af7ff;outline-offset:-3px}
#question-area .sudoku{border-color:#5898ad}#question-area .sudoku .tile.given{background:#153c4f;color:#93cadc}
#question-area .sudoku .tile.active-cell{background:#1a5267;box-shadow:inset 0 0 0 3px #78ecf4}
#question-area .sudoku .tile:nth-child(4n+2){border-right-color:#70b7ca}#question-area .sudoku .tile:nth-child(n+5):nth-child(-n+8){border-bottom-color:#70b7ca}
#question-area .chess-board{border-color:#3b6e87;box-shadow:0 0 24px #38cddd1a}
#question-area .chess-square{background:#4b7b92}#question-area .chess-square.dark-square{background:#163548}
#question-area .chess-square.white-piece span{color:#efffff;text-shadow:0 1px 2px #00111d,1px 0 2px #00111d,-1px 0 2px #00111d}
#question-area .chess-square.black-piece span{color:#c3acf7;text-shadow:0 1px 2px #130a26}
#question-area .chess-square small{color:#d0e9ef}#question-area .chess-square.hint-piece{background:#356878}
#question-area .chess-square.picked{box-shadow:inset 0 0 0 3px #8cf6ff}#question-area .chess-square.good{background:#28685a}#question-area .chess-square.bad{background:#81405d}
#question-area .analog-clock .clock-face{fill:#0c2536;stroke:#659bb1}#question-area .analog-clock .clock-number{fill:#def9ff}
#question-area .analog-clock .clock-tick{stroke:#80aabd}#question-area .analog-clock .clock-tick.major{stroke:#c5eef6}
#question-area .analog-clock .clock-hour{fill:#70e8f4;stroke:#70e8f4}#question-area .analog-clock .clock-minute{fill:#eefcff;stroke:#eefcff}
#question-area .analog-clock .clock-pin{fill:#bdcbec;stroke:#376e86}#question-area .analog-clock .clock-period-box{fill:#102f43;stroke:#5495ae}#question-area .analog-clock .clock-period{fill:#a6f2f7}
#question-area .memory .tile.memory-color-0{background:linear-gradient(145deg,#1b4877,#102949);color:#73b7ff;border-color:#66acff;box-shadow:inset 0 0 18px #4a9cff22,0 0 12px #4a9cff28;opacity:1}
#question-area .memory .tile.memory-color-1{background:linear-gradient(145deg,#744e23,#392b20);color:#ffbf6c;border-color:#f8ac56;box-shadow:inset 0 0 18px #ffb04a22,0 0 12px #ffb04a28;opacity:1}
#question-area .memory .tile.memory-color-2{background:linear-gradient(145deg,#713250,#351e36);color:#ff8dd2;border-color:#f781ca;box-shadow:inset 0 0 18px #fa71c022,0 0 12px #fa71c028;opacity:1}
#question-area .memory .tile.memory-color-3{background:linear-gradient(145deg,#1b634f,#11332f);color:#66f0b3;border-color:#5be7ab;box-shadow:inset 0 0 18px #46e3a222,0 0 12px #46e3a228;opacity:1}
#question-area .weight-equations,#question-area .sum-target{color:#cbf5ff}#question-area .sum-target strong{color:#79e9f5}
/* Explicit selector beats the generic select background shorthand. */
#content #practice-tier{appearance:none;-webkit-appearance:none;cursor:pointer;min-height:54px;padding-right:68px;border-color:#548ba3;background-color:#0b2233;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36'%3E%3Crect x='1' y='1' width='34' height='34' rx='9' fill='%2319475c' stroke='%2355c8de'/%3E%3Cpath d='m10 14 8 8 8-8' fill='none' stroke='%2394f4ff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:34px 34px}
#content #practice-tier:hover{border-color:#79e8f2}#content #practice-tier:focus-visible{outline:2px solid #92f4ff;outline-offset:3px}

/* Expanded catalogue and calm, aligned game chrome. */
#content:has(.hero)>h1,#content:has(.hero)>.welcome,#content:has(.hero)>.label{text-align:center;display:block}
#content:has(.hero)>h1{font-size:clamp(28px,5vw,42px);line-height:1.18;letter-spacing:-.025em;margin:22px auto 16px;max-width:650px}
#content .hero{text-align:center}#content .hero h2{line-height:1.25}#content .hero p{max-width:540px;margin:16px auto 24px}
#content .session-logo{width:88px;height:88px;object-fit:contain}#content .session-toolbar{min-height:92px;padding-block:0}
#question-area .chess-square small{display:none}#question-area .chess-square.white-piece{color:#fff}#question-area .chess-square.black-piece{color:#080a0c}#question-area .chess-square{background:#8aacb6}#question-area .chess-square.light{background:#c1dbe0}#question-area .chess-square span{filter:none;text-shadow:0 1px 2px #10202e55}
#question-area .expanded-sudoku{width:min(100%,540px);max-width:540px;gap:2px}#question-area .expanded-sudoku .tile{min-height:0;aspect-ratio:1;padding:0;font-size:clamp(16px,4vw,25px);border:1px solid #5e96a555;border-radius:4px}#question-area .expanded-sudoku .tile.block-left{border-left:3px solid #73e7ed}#question-area .expanded-sudoku .tile.block-top{border-top:3px solid #73e7ed}#question-area .sudoku-pad{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}#question-area .sudoku-pad button{min-width:42px;padding:10px}
#question-area .expansion-board{width:min(100%,560px);max-width:560px;gap:4px;margin:20px auto}#question-area .expansion-board .tile{aspect-ratio:1;min-height:0;padding:0;font-size:clamp(16px,4vw,24px);border-radius:6px}#question-area .expansion-board .revealed{background:#143946;color:#9ef5ec;opacity:1}#question-area .group-tile{color:#092b3e;border:1px solid #ffffff77;text-shadow:none}#question-area .frame-center{background:#34becf;color:#041d32;font-weight:800;opacity:1}#question-area .weight-equations{line-height:1.8;font-size:clamp(20px,4vw,30px)}.pause-card .stack{margin:20px 0}.pause-audio{margin-top:24px}
@media(max-width:520px){#content .session-logo{width:74px;height:74px}#content .session-toolbar{min-height:78px}#question-area .expansion-board{gap:3px}}

#question-area .chess-square:not(.dark-square){background:#c1dbe0}#question-area .chess-square.dark-square{background:#759ba7}#question-area .white-piece span{color:#fff;-webkit-text-stroke:.5px #264754}#question-area .black-piece span{color:#080a0c;-webkit-text-stroke:0}

#question-area .expanded-sudoku .tile:nth-child(n){border-right:1px solid #5e96a555;border-bottom:1px solid #5e96a555}#question-area .expanded-sudoku{width:min(100%,480px)}

#question-area .chess-square.white-piece span{color:#fff;text-shadow:0 1px 2px #10202e;-webkit-text-stroke:.5px #264754}#question-area .chess-square.black-piece span{color:#080a0c;text-shadow:none;-webkit-text-stroke:0}

#question-area .expansion-board,#question-area .expanded-sudoku{width:min(100%,max(280px,calc(100dvh - 350px)),500px)}

/* Clean, saturated colour tiles. Geometry remains sharp at every board size. */
#question-area .expansion-board:has(.group-tile){gap:5px;padding:7px;border:1px solid #6fd7ef38;border-radius:12px;background:#041323aa;box-shadow:inset 0 1px 0 #c2f8ff12}
#question-area .expansion-board .group-tile{background:linear-gradient(180deg,#ffffff12,transparent 36%,#0000000a),var(--group-color);border:1px solid #ffffff55;border-radius:5px;box-shadow:inset 0 1px 0 #ffffff42,inset 0 -2px 0 #00000020,0 1px 2px #00000040;filter:none;backdrop-filter:none;transition:transform .12s ease,box-shadow .12s ease;overflow:hidden}
#question-area .expansion-board .group-tile:disabled{box-shadow:none;border-color:transparent;pointer-events:none}
@media(hover:hover){#question-area .expansion-board .group-tile:not(:disabled):hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 #ffffff70,0 0 0 2px #e7fbff99,0 3px 5px #00000050}}
#question-area .expansion-board .group-tile:focus-visible{outline:3px solid #fff;outline-offset:1px}
#question-area .expansion-board .group-tile:not(:disabled):active{transform:scale(.96)}
@media(prefers-reduced-motion:reduce){#question-area .expansion-board .group-tile{transition:none}}

/* Preview the connected group, never a single tile. */
@media(hover:hover){#question-area .expansion-board .group-tile:not(:disabled):hover{transform:none;box-shadow:inset 0 1px 0 #ffffff42,inset 0 -2px 0 #00000020,0 1px 2px #00000040}}
#question-area .expansion-board .group-tile.group-preview:not(:disabled){filter:brightness(1.18);border-color:#fff;box-shadow:inset 0 0 0 2px #ffffffbd,0 0 7px #c4faff6b;transform:translateY(-1px)}
#question-area .mines-board .mine-tile{touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:linear-gradient(145deg,#21465a,#102b3e);border:1px solid #52889d;box-shadow:inset 0 1px 0 #b7eefa35,inset 0 -2px 0 #020b1355;color:#66e5f4;font-weight:800}
#question-area .mines-board .mine-tile.revealed{background:#b8d4dd;border:1px solid #749ca9;box-shadow:none;opacity:1}
#question-area .mines-board [data-count="1"]{color:#064ae4}#question-area .mines-board [data-count="2"]{color:#08752a}#question-area .mines-board [data-count="3"]{color:#db202c}#question-area .mines-board [data-count="4"]{color:#171771}#question-area .mines-board [data-count="5"]{color:#791b23}#question-area .mines-board [data-count="6"]{color:#00777b}#question-area .mines-board [data-count="7"]{color:#141c23}#question-area .mines-board [data-count="8"]{color:#5d6670}
#question-area .mines-board .mine-hit{background:#281f34;color:#ff5574;border-color:#ff5574;opacity:1}.cyber-mine{display:block;width:70%;height:70%;margin:auto}.mine-help{text-align:center;font-size:13px;color:#b4dbe5}

/* The game background is a viewport-sized layer, independent of page length. */
:is(body,body.dark).has-game-background:has(.session-toolbar,.pause-card){background:#050e1b;isolation:isolate}
body.has-game-background:has(.session-toolbar,.pause-card)::before{content:'';position:fixed;top:0;left:50%;transform:translateX(-50%);width:min(100vw,620px);height:100vh;height:100dvh;background-image:linear-gradient(#040d1b25,#040d1b55),var(--game-background);background-size:cover;background-position:center;background-repeat:no-repeat;pointer-events:none;z-index:-1}
/* Bevelled solid blocks: lit top and left edges, shaded lower face. */
#question-area .expansion-board .group-tile{background:linear-gradient(150deg,#ffffff30,transparent 38%,#00000016 75%,#00000030),var(--group-color);border:1px solid #ffffff65;border-radius:7px;box-shadow:inset 3px 3px 0 #ffffff45,inset -3px -4px 0 #00000036,inset 0 0 0 1px #ffffff20,0 3px 0 #020b13,0 5px 6px #00000065;position:relative}
#question-area .group-tile::after{content:'';position:absolute;inset:5px;border:1px solid #ffffff24;border-radius:3px;pointer-events:none}
@media(hover:hover){#question-area .expansion-board .group-tile:not(:disabled):hover{box-shadow:inset 3px 3px 0 #ffffff45,inset -3px -4px 0 #00000036,inset 0 0 0 1px #ffffff20,0 3px 0 #020b13,0 5px 6px #00000065}}
#question-area .expansion-board .group-tile.group-preview:not(:disabled){box-shadow:inset 3px 3px 0 #ffffff70,inset -3px -4px 0 #00000036,inset 0 0 0 2px #ffffffb0,0 3px 0 #020b13,0 0 10px #a5f3ff75;transform:translateY(-1px)}
#question-area .expansion-board .group-tile:disabled{box-shadow:none}#question-area .group-tile:disabled::after{display:none}
.mine-counter strong{font-variant-numeric:tabular-nums;color:#a2f5fa;font-size:24px}.mine-counter small{display:block;margin-top:5px;color:#9bbcca;font-size:12px}
#question-area .mines-board .mine-tile.revealed:not(:disabled){cursor:pointer}#question-area .mines-board .mine-tile.revealed:not(:disabled):active{box-shadow:inset 0 0 0 2px #26cce0}

/* Larger portraits, image-only picker and clearer brand mark. */
.profile-entry .study-avatar{width:100px;height:100px;flex:0 0 100px;object-fit:contain}.profile-entry>span{min-width:0}.profile-entry strong{overflow-wrap:anywhere}
.profile-summary .study-avatar{width:132px;height:132px;object-fit:contain}
#content .avatar-library{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}#content .avatar-choice{min-width:0;padding:5px;aspect-ratio:1;display:grid;place-items:center}#content .avatar-choice .study-avatar{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}#content .avatar-choice small{display:none}
.brand .brand-logo{width:80px;height:80px;margin-right:7px}#content .session-logo{width:108px;height:108px}#content .session-toolbar{min-height:112px}
@media(max-width:520px){.profile-entry .study-avatar{width:88px;height:88px;flex-basis:88px}#content .avatar-library{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.brand .brand-logo{width:72px;height:72px}#content .session-logo{width:94px;height:94px}#content .session-toolbar{min-height:98px}}

.avatar-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:16px 0}.avatar-categories button{min-width:0;padding:12px 6px;font-size:14px}.avatar-categories button.selected{background:#1c5365;border-color:#7eeaf4;color:#efffff;box-shadow:inset 0 -3px 0 #65e1ed}.avatar-pages{margin-top:16px}@media(max-width:520px){.avatar-categories{grid-template-columns:repeat(2,minmax(0,1fr))}}

.avatar-setting{display:flex;align-items:center;gap:18px;margin:22px 0}.avatar-setting .study-avatar{width:104px;height:104px;object-fit:contain;display:block}.avatar-setting #change-avatar{flex:1;min-width:0;padding:14px 10px}#avatar-picker{margin-bottom:24px;padding-top:6px}#avatar-picker[hidden]{display:none!important}

.profile-line .player-id{display:block;margin-top:6px;font-size:13px;font-weight:500;color:#9cc9dc;letter-spacing:.06em}.player-id strong{font-variant-numeric:tabular-nums;letter-spacing:.08em}

/* Translucent scientific glass tiles; retain color and group outlines. */
#question-area .expansion-board:has(.group-tile){background:#04132340}
#question-area .expansion-board .group-tile{background:linear-gradient(145deg,#ffffff25,transparent 42%,#00152522),color-mix(in srgb,var(--group-color) 58%,transparent);backdrop-filter:blur(2px);border-color:#c5f8ff70;box-shadow:inset 2px 2px 0 #ffffff36,inset -2px -3px 0 #00132040,0 2px 4px #0006}
#question-area .board.clearing-rectangles{width:min(100%,430px);gap:4px;margin:12px auto}
#question-area .clearing-rectangles .rectangle-tile{aspect-ratio:1;border-radius:5px;background:linear-gradient(145deg,#ffffff25,#00152525),color-mix(in srgb,var(--rect-color) 75%,transparent);border:1px solid #c8faff65;box-shadow:inset 1px 1px 0 #ffffff35;padding:0;min-height:0}
#question-area .clearing-rectangles .rectangle-tile.picked{outline:3px solid #fff;outline-offset:-3px}
#question-area .clearing-rectangles .rectangle-tile.rect-preview{filter:brightness(1.3)}
.mode-card.mode-locked{opacity:.55}
