:root{--bg:#101522;--side:#151d2d;--panel:#192337;--panel2:#202d43;--text:#f1f5fc;--muted:#9aa9bd;--line:#2d3b52;--accent:#9b8cff;--accent2:#6b8cff;--green:#62d6a2;--red:#ff7187;--shadow:0 18px 55px #0002}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}body.light{--bg:#f4f6fb;--side:#fff;--panel:#fff;--panel2:#eef1f8;--text:#20283a;--muted:#68758a;--line:#dce2ed;--shadow:0 15px 45px #29395a12}button,input,select,textarea{font:inherit}button{cursor:pointer}.layout{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:var(--side);border-right:1px solid var(--line);padding:25px 16px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;padding:0 9px 34px;color:var(--text);text-decoration:none;font-size:19px;font-weight:900;letter-spacing:1.7px}.brand-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff}.accent,.gradient{color:var(--accent)}.nav-label{padding:0 11px 9px;margin:8px 0 2px;color:var(--muted);font-size:9px;letter-spacing:1.8px;font-weight:800}.sidebar nav{display:grid;gap:5px;margin-bottom:17px}.nav{border:0;background:transparent;color:var(--muted);padding:11px 12px;border-radius:9px;text-align:left;display:flex;gap:13px;align-items:center;font-weight:650}.nav span{font-size:12px}.nav:hover,.nav.active{background:var(--panel2);color:var(--text)}.nav.active{box-shadow:inset 3px 0 var(--accent)}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:16px 5px 0}.user-chip{display:flex;align-items:center;gap:10px}.avatar{width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;font-weight:800}.user-chip div:last-child{display:grid}.user-chip small,.privacy-note{color:var(--muted);font-size:10px}.privacy-note{display:block;margin:12px 0 0}.main{margin-left:245px;min-height:100vh}.topbar{height:70px;position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(13px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;color:var(--muted);font-size:12px}.top-actions{display:flex;align-items:center;gap:12px}.pill,.tag{border:1px solid var(--line);border-radius:20px;padding:7px 11px;font-size:10px}.pill b{color:var(--text)}.icon-btn{border:1px solid var(--line);border-radius:9px;width:36px;height:36px;background:var(--panel);color:var(--text)}.mobile-only{display:none}.content{max-width:1280px;padding:34px 38px 65px;margin:auto}.page{display:none;animation:fade .2s ease}.page.active{display:block}@keyframes fade{from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none}}.hero{min-height:260px;padding:36px 44px;border:1px solid var(--line);border-radius:18px;background:radial-gradient(circle at 80% 50%,#8272ff2b,transparent 28%),linear-gradient(115deg,var(--panel),var(--panel2));display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:850;color:var(--accent)}h1{font-size:clamp(32px,4vw,46px);line-height:1.08;letter-spacing:-1.5px;margin:12px 0}.hero p,.page-heading p{color:var(--muted);max-width:620px}.hero-mark{font-size:86px;font-weight:950;color:#fff;background:linear-gradient(135deg,#a18aff,#607cff);width:155px;height:155px;border-radius:42px;display:grid;place-items:center;box-shadow:0 20px 55px #6b70d944;transform:rotate(7deg);margin-right:6%}.hero-mark span{font-size:9px;letter-spacing:4px;margin-top:-45px}.btn{border:0;border-radius:9px;padding:10px 15px;font-weight:750;transition:.15s}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.primary{background:linear-gradient(110deg,var(--accent),var(--accent2));color:#fff}.secondary{background:var(--panel2);border:1px solid var(--line);color:var(--text)}.ghost{background:transparent;border:1px solid var(--line);color:var(--muted)}.danger{background:#ff71871a;color:var(--red);border:1px solid #ff718744}.section-title,.card-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.section-title{margin:29px 0 14px}.section-title h2,.card h3{margin:0 0 4px}.section-title p,.card-head p{margin:0;color:var(--muted);font-size:11px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:19px;margin-bottom:14px;box-shadow:var(--shadow)}.metric small{display:block;color:var(--muted);font-size:9px;letter-spacing:1px;font-weight:800}.metric strong{display:inline-block;font-size:29px;margin:9px 5px 0 0}.metric>span{font-size:10px;color:var(--muted)}.columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.card-head{margin-bottom:15px}.card-head h3{font-size:14px}.tag{color:var(--muted);font-size:8px;letter-spacing:1px}.purple{color:var(--accent)}.muted{color:var(--muted);font-size:11px}.text-btn{border:0;background:transparent;color:var(--accent);font-size:11px;font-weight:750}.empty{padding:18px 5px;color:var(--muted);font-size:11px;text-align:center}.page-heading{margin:7px 0 24px}.page-heading h1{margin:8px 0}.filters{padding:17px}.mode-tabs{display:flex;gap:5px;margin-bottom:18px}.mode-tabs button{border:1px solid var(--line);background:var(--panel2);color:var(--muted);padding:9px 14px;border-radius:8px;font-size:11px}.mode-tabs button.selected{background:#9b8cff20;color:var(--text);border-color:#9b8cff77}.filter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.filter-grid label,.settings-card label{display:grid;gap:6px;color:var(--muted);font-size:10px;font-weight:700}.filter-grid select,.settings-card input{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px;color:var(--text);outline:none}.paragraph-actions{display:flex;align-items:center;gap:9px;margin-top:15px;flex-wrap:wrap}.paragraph-actions .muted{margin-left:auto}.session-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:14px;align-items:start}.typing-panel{padding:21px}.session-top{display:flex;justify-content:space-between;align-items:start}.session-top h3{font-size:15px;margin:8px 0}.passage{font-size:18px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere;min-height:130px;margin:20px 0;color:var(--muted)}.passage .correct{color:var(--green)}.passage .incorrect{color:var(--red);background:#ff71871b;border-radius:2px}.passage .current{border-left:2px solid var(--accent);margin-left:-2px}.typing-panel textarea{width:100%;resize:vertical;min-height:112px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:13px;color:var(--text);line-height:1.6;outline:none}.typing-panel textarea:focus{border-color:var(--accent)}.typing-footer{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:10px;margin:8px 0 13px}.live-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.live-metrics div{padding:10px;background:var(--panel2);border-radius:8px}.live-metrics small{display:block;color:var(--muted);font-size:8px;letter-spacing:1px}.live-metrics b{display:block;font-size:19px;margin-top:3px}.tips-panel h3{font-size:14px}.tips-panel>p{color:var(--muted);font-size:11px;line-height:1.7}.tip-line{display:flex;gap:10px;border-top:1px solid var(--line);padding:13px 0}.tip-line>span{color:var(--accent);font-size:19px}.tip-line div{display:grid;gap:3px}.tip-line small{color:var(--muted);font-size:10px;line-height:1.5}.result{margin-top:14px;padding:14px;border-radius:10px;background:#62d6a211;border:1px solid #62d6a244}.result.hidden{display:none}.result strong{font-size:20px}.mission-stages{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.stage-card{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:15px;text-align:left;color:var(--text)}.stage-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.stage-card.locked{opacity:.48}.stage-card b{display:block;margin:8px 0 4px}.stage-card small{color:var(--muted);font-size:10px}.stage-progress{height:5px;background:var(--panel2);border-radius:5px;margin-top:12px;overflow:hidden}.stage-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}.mission-detail{margin-top:15px}.mission-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.mission-row{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--panel2)}.mission-row button{margin-left:auto}.mission-number{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:#9b8cff22;color:var(--accent);font-weight:800}.mission-row small{display:block;color:var(--muted);font-size:9px}.training-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.training-card h3{margin:9px 0}.training-card p{color:var(--muted);font-size:11px;min-height:32px}.training-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#9b8cff20;color:var(--accent);font-size:21px}.note{margin-top:16px}.note p{color:var(--muted);font-size:11px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:11px}th,td{text-align:left;padding:11px 8px;border-bottom:1px solid var(--line);white-space:nowrap}th{color:var(--muted)}.settings-card{max-width:650px}.settings-card label{max-width:350px}.setting-actions{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.upload-label{display:inline-flex;align-items:center;cursor:pointer}.upload-label input{display:none}.settings-card hr{border:0;border-top:1px solid var(--line);margin:20px 0}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--panel2);border:1px solid var(--line);padding:11px 16px;border-radius:10px;box-shadow:var(--shadow);z-index:50;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.metrics{grid-template-columns:repeat(2,1fr)}.session-grid{grid-template-columns:1fr}.tips-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.tips-panel h3,.tips-panel>p{grid-column:1/-1}.mission-stages{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.mobile-only{display:block}.topbar{padding:0 15px}.content{padding:22px 15px 45px}.hero{padding:25px;min-height:220px}.hero-mark{width:90px;height:90px;font-size:55px;border-radius:25px;margin:0}.hero-mark span{display:none}.columns{grid-template-columns:1fr}.filter-grid{grid-template-columns:repeat(2,1fr)}.mission-list{grid-template-columns:1fr}.tips-panel{display:block}}@media(max-width:440px){.metrics{gap:8px}.metric{padding:13px}.metric strong{font-size:24px}.hero-mark{display:none}.live-metrics{grid-template-columns:repeat(2,1fr)}.filter-grid{grid-template-columns:1fr}.mission-stages{grid-template-columns:1fr}.mode-tabs button{flex:1;padding:8px 7px}}

/* Language Academy */
.academy-controls{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:15px;align-items:end}.academy-controls label{display:grid;gap:7px;color:var(--muted);font-size:11px;font-weight:700}.academy-controls select{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:11px;color:var(--text)}.academy-progress{font-size:11px}.academy-progress .stage-progress{margin-top:9px}.academy-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:14px;align-items:start}.academy-lesson-list{display:grid;gap:7px}.academy-lesson-item{border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:11px;border-radius:8px;text-align:left}.academy-lesson-item.active{border-color:var(--accent);background:#9b8cff18}.academy-lesson-item small{display:block;color:var(--muted);margin-top:4px}.academy-word{border:1px solid var(--line);background:var(--panel2);border-radius:11px;padding:15px;margin:12px 0}.academy-word-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.academy-native{font-size:27px;font-weight:800}.academy-roman{color:var(--accent);font-size:13px;margin-top:5px}.academy-meaning{font-size:13px;margin-top:7px}.academy-note{font-size:11px;color:var(--muted);line-height:1.6;margin-top:7px}.academy-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.academy-quiz{border-top:1px solid var(--line);margin-top:20px;padding-top:17px}.academy-choice{display:block;width:100%;text-align:left;margin:7px 0;padding:11px;border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:8px}.academy-choice:disabled{opacity:.75}.academy-feedback{font-size:12px;margin-top:10px;min-height:18px}.academy-lesson h2{margin-top:4px}.academy-empty{color:var(--muted);font-size:12px;line-height:1.7}@media(max-width:760px){.academy-layout{grid-template-columns:1fr}.academy-controls{grid-template-columns:1fr}.academy-lesson-list{grid-template-columns:repeat(2,1fr)}}

/* Interactive Keyboard Trainer */
.kt-controls{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:12px;align-items:center}.kt-controls label{display:grid;gap:7px;color:var(--muted);font-size:11px;font-weight:700}.kt-controls select{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:11px;color:var(--text)}.kt-mode-tabs{display:flex;gap:6px;flex-wrap:wrap}.kt-mode-tabs button{border:1px solid var(--line);background:var(--panel2);color:var(--muted);padding:9px 12px;border-radius:8px;font-size:11px}.kt-mode-tabs button.selected{border-color:var(--accent);background:#9b8cff20;color:var(--text)}.kt-mode-description{grid-column:1/-1;color:var(--muted);font-size:11px}.kt-workspace{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:14px;align-items:start}.kt-target-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.kt-target-head h2{font-size:17px;margin:8px 0 3px}.kt-target-head p{font-size:11px;color:var(--muted);margin:0}.kt-target{width:76px;height:76px;display:grid;place-items:center;border-radius:17px;background:#9b8cff20;border:1px solid #9b8cff66;color:var(--accent);font-size:30px;font-weight:850}.kt-progress{height:7px;background:var(--panel2);border-radius:8px;overflow:hidden;margin:19px 0 7px}.kt-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .15s}.kt-counts{font-size:10px;color:var(--muted);text-align:right}.kt-keyboard-wrap{overflow-x:auto;padding:17px 0 10px}.kt-keyboard{min-width:490px;display:grid;gap:7px}.kt-row{display:flex;justify-content:center;gap:6px}.kt-key{min-width:35px;height:39px;border:1px solid var(--line);border-radius:7px;background:var(--panel2);color:var(--text);font-weight:750;box-shadow:0 3px 0 var(--line);transition:background .1s,border-color .1s;position:relative}.kt-key::after{content:"";position:absolute;left:5px;right:5px;bottom:3px;height:3px;border-radius:3px;background:var(--finger,var(--muted));opacity:.85}.kt-key.lp,.kt-finger-legend .lp{--finger:#e879a8}.kt-key.lr,.kt-finger-legend .lr{--finger:#e8a45e}.kt-key.lm,.kt-finger-legend .lm{--finger:#e5d36b}.kt-key.li,.kt-finger-legend .li{--finger:#75c99b}.kt-key.ri,.kt-finger-legend .ri{--finger:#65c9d2}.kt-key.rm,.kt-finger-legend .rm{--finger:#72a8e8}.kt-key.rr,.kt-finger-legend .rr{--finger:#a68be8}.kt-key.rp,.kt-finger-legend .rp{--finger:#df8bd5}.kt-key.next{outline:2px solid var(--accent);background:#9b8cff35;transform:translateY(-2px)}.kt-key.pressed{background:#62d6a244;border-color:var(--green)}.kt-key.wrong{background:#ff718744;border-color:var(--red)}.kt-wide{min-width:75px;font-size:10px}.kt-bottom{margin-top:2px}.kt-finger-legend{display:flex;flex-wrap:wrap;gap:9px 13px;border-top:1px solid var(--line);padding-top:13px}.kt-finger-legend span{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:9px}.kt-finger-legend i{width:9px;height:9px;border-radius:50%;background:var(--finger)}.kt-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:17px;color:var(--muted);font-size:10px}.kt-side h3{margin-top:0}.kt-side ol{padding-left:18px;color:var(--muted);font-size:11px;line-height:1.8}.kt-note,.kt-physical-note{padding:11px;border-radius:9px;background:var(--panel2);color:var(--muted);font-size:10px;line-height:1.7;margin-top:12px}.kt-physical-note{border:1px solid var(--line);background:transparent}@media(max-width:900px){.kt-workspace{grid-template-columns:1fr}.kt-controls{grid-template-columns:1fr}}@media(max-width:560px){.kt-keyboard{min-width:440px}.kt-key{min-width:29px;height:36px}.kt-mode-tabs button{flex:1}.kt-target{width:62px;height:62px}}


/* Interactive two-hand finger coach */
.kt-hand-guide{margin:20px 0 14px;padding:16px;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:16px;background:rgba(7,18,34,.28)}
.kt-hand-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}
.kt-hand-heading strong{font-size:.95rem}.kt-hand-heading span,.kt-hand-label,.kt-hand-tip{font-size:.76rem;color:var(--muted,#9eafc5)}
.kt-hands{display:flex;justify-content:center;gap:clamp(24px,8vw,90px);align-items:end;flex-wrap:wrap}
.kt-hand{display:flex;flex-direction:column;align-items:center;gap:8px}
.kt-hand-label{letter-spacing:.12em;font-weight:700}
.kt-hand-shape{position:relative;width:190px;height:150px;display:flex;align-items:flex-end;justify-content:center;gap:5px;padding-bottom:8px}
.kt-finger{display:block;width:25px;height:68px;border-radius:16px 16px 10px 10px;position:relative;z-index:2;opacity:.58;transform-origin:bottom center;transition:filter .16s,opacity .16s,transform .16s,box-shadow .16s}
.kt-finger.lp{background:#e58ba9;height:48px}.kt-finger.lr{background:#e9ad58;height:67px}.kt-finger.lm{background:#e5d45d;height:79px}.kt-finger.li{background:#72d7ad;height:72px}
.kt-finger.ri{background:#55cbd0;height:72px}.kt-finger.rm{background:#63b8ec;height:79px}.kt-finger.rr{background:#9ca8f2;height:67px}.kt-finger.rp{background:#d6a0e8;height:48px}
.kt-finger.thumb{width:31px;height:48px;transform:rotate(48deg);margin:0 0 0 2px}
.kt-palm{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:138px;height:69px;border-radius:25px 25px 35px 35px;background:linear-gradient(145deg,#54718d,#304a65);border:1px solid rgba(255,255,255,.15);z-index:1}
.kt-hand-shape .active-finger{opacity:1;filter:brightness(1.35);transform:translateY(-9px) scale(1.08);box-shadow:0 0 0 3px rgba(255,255,255,.75),0 0 22px currentColor}
.kt-finger.thumb.active-finger{transform:rotate(48deg) translateY(-8px) scale(1.08)}
.kt-hand-tip{text-align:center;margin:12px 0 0}
@media(max-width:560px){.kt-hand-heading{align-items:flex-start;flex-direction:column}.kt-hand-shape{transform:scale(.84);margin:-8px -12px}}

.resource-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.resource-link{display:flex;flex-direction:column;gap:7px;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);text-decoration:none;min-height:104px}
.resource-link:hover{border-color:var(--accent);transform:translateY(-1px)}
.resource-link span{font-size:11px;color:var(--muted)}
details{border-top:1px solid var(--line);padding:13px 2px}
details summary{cursor:pointer;font-weight:700}
details p{color:var(--muted);font-size:12px;max-width:850px}
@media(max-width:900px){.resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.resource-grid{grid-template-columns:1fr}}

/* Multilingual phonetic typing lab */
.ml-controls{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:14px;align-items:end}.ml-controls label,.ml-label{display:grid;gap:7px;color:var(--muted);font-size:11px;font-weight:700}.ml-controls select,.ml-panel textarea,.ml-panel input{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:12px;color:var(--text);font:inherit}.ml-tabs{display:flex;gap:7px;flex-wrap:wrap}.ml-tabs button{padding:10px 13px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--muted)}.ml-tabs button.selected{border-color:var(--accent);color:var(--text);background:#9b8cff20}.ml-panel{margin-top:14px}.ml-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.ml-panel-head h2{font-size:19px;margin:0 0 5px}.ml-panel-head p{font-size:12px;color:var(--muted);margin:0 0 16px}.ml-panel textarea{resize:vertical;min-height:85px;margin:8px 0 13px;font-size:16px;line-height:1.6}.ml-panel textarea#mlOutput{font-size:23px}.ml-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:4px 0 17px}.ml-actions .muted{font-size:10px}.ml-disclaimer{border-top:1px solid var(--line);padding-top:13px;color:var(--muted);font-size:11px;line-height:1.7}.ml-candidates{font-size:11px;color:var(--muted);margin:5px 0 12px}.ml-lesson-layout{display:grid;grid-template-columns:230px 1fr;gap:16px}.ml-lesson-list{display:grid;gap:7px}.ml-lesson-item{padding:11px;text-align:left;border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--text)}.ml-lesson-item.active{border-color:var(--accent);background:#9b8cff20}.ml-course-progress{font-size:11px;color:var(--muted);margin-top:15px}.ml-course-progress .stage-progress{margin-top:8px}.ml-lesson-body h2{margin:10px 0}.ml-lesson-body p{font-size:13px;color:var(--muted)}.ml-rule{padding:15px;border:1px solid var(--line);border-radius:10px;background:var(--panel2);font-size:14px;line-height:1.8;margin:15px 0}.ml-lesson-body input{margin:9px 0 12px}.ml-lesson-result{padding:13px;border-radius:9px;background:var(--panel2);display:grid;gap:5px;margin:10px 0 14px}.ml-lesson-result small{color:var(--muted)}.ml-lesson-result strong{font-size:24px}.ml-feedback{font-size:11px;color:var(--muted);margin-left:8px}.ml-lesson-body .ml-actions{margin-top:18px}@media(max-width:760px){.ml-controls{grid-template-columns:1fr}.ml-lesson-layout{grid-template-columns:1fr}.ml-lesson-list{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* KEYFORGE theme collection */
body[data-theme="electric"]{--bg:#101b2c;--side:#13243a;--panel:#1b3048;--panel2:#29425d;--text:#f5fbff;--muted:#b2c5d8;--line:#35516c;--accent:#ffd43b;--accent2:#20c7e8;--green:#76df9d;--red:#ff7585}
body[data-theme="pink"]{--bg:#fff0f7;--side:#ffe1ef;--panel:#fff8fc;--panel2:#ffd5e8;--text:#51243e;--muted:#94647f;--line:#f2bdd8;--accent:#ed4f9b;--accent2:#a66bea;--green:#3aaf82;--red:#d84b70;--shadow:0 18px 55px #a33c7118}
body[data-theme="hero"]{--bg:#111a31;--side:#172443;--panel:#1d2d50;--panel2:#293e68;--text:#f7f8ff;--muted:#b1bdd7;--line:#3a4d75;--accent:#ff4655;--accent2:#2589ff;--green:#68d7aa;--red:#ff6578}
body[data-theme="block"]{--bg:#17251d;--side:#1d3024;--panel:#263b2c;--panel2:#344d38;--text:#f0f7e9;--muted:#b3c4ad;--line:#49634a;--accent:#8bd450;--accent2:#d6a85c;--green:#a4df69;--red:#e97862}
body[data-theme="cyber"]{--bg:#100d20;--side:#19132c;--panel:#211a39;--panel2:#30234d;--text:#f5efff;--muted:#b8a9d1;--line:#483663;--accent:#c16cff;--accent2:#26e6e0;--green:#4ce0b2;--red:#ff6b9c}
body[data-theme="galaxy"]{--bg:#111329;--side:#191b3b;--panel:#22264b;--panel2:#30345f;--text:#f3f1ff;--muted:#b5b2d5;--line:#414675;--accent:#a78bfa;--accent2:#67b7ff;--green:#69d6b1;--red:#ff7e9b}
.theme-section{margin:26px 0}.theme-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:13px}
.theme-card{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;padding:11px;text-align:left;display:grid;gap:6px;transition:border-color .18s,transform .18s,box-shadow .18s}
.theme-card:hover{transform:translateY(-2px);border-color:var(--accent)}
.theme-card.selected{border:2px solid var(--accent);padding:10px;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 17%,transparent)}
.theme-card b{font-size:13px}.theme-card small{font-size:11px;color:var(--muted)}
.theme-preview{height:72px;border-radius:9px;padding:10px;display:flex;gap:6px;align-items:flex-end;overflow:hidden}
.theme-preview i{display:block;border-radius:5px 5px 2px 2px;height:34px;flex:1;opacity:.95}
.theme-preview i:nth-child(2){height:48px}.theme-preview i:nth-child(3){height:25px}
.preview-dark{background:#101522}.preview-dark i{background:#9b8cff}
.preview-light{background:#f4f6fb}.preview-light i{background:#8b79e8}
.preview-electric{background:#101b2c}.preview-electric i{background:#ffd43b}.preview-electric i:nth-child(2){background:#20c7e8}
.preview-pink{background:#ffe1ef}.preview-pink i{background:#ed4f9b}.preview-pink i:nth-child(2){background:#a66bea}
.preview-hero{background:#111a31}.preview-hero i{background:#ff4655}.preview-hero i:nth-child(2){background:#2589ff}
.preview-block{background:#17251d}.preview-block i{background:#8bd450}.preview-block i:nth-child(2){background:#d6a85c}
.preview-cyber{background:#100d20}.preview-cyber i{background:#c16cff}.preview-cyber i:nth-child(2){background:#26e6e0}
.preview-galaxy{background:#111329}.preview-galaxy i{background:#a78bfa}.preview-galaxy i:nth-child(2){background:#67b7ff}
@media(max-width:560px){.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-card{padding:9px}.theme-preview{height:60px}}

/* KEYFORGE game arena, RPG progression and feedback */
.game-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px;margin:18px 0}
.game-choice{display:flex;flex-direction:column;gap:7px;text-align:left;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--text);cursor:pointer}
.game-choice b{font-size:14px}.game-choice small{color:var(--muted);font-size:12px}.game-choice.selected{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}
.game-console{padding:22px}.game-topline{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.game-topline h2{margin:10px 0 5px}.game-topline p{margin:0;color:var(--muted)}
.game-stats{display:flex;gap:16px}.game-stats span{display:flex;flex-direction:column;min-width:54px}.game-stats small{font-size:10px;color:var(--muted)}.game-stats b{font-size:20px}
.game-target{margin:22px 0;padding:22px;border-radius:14px;background:var(--surface,rgba(120,130,160,.10));font-size:clamp(18px,2.4vw,25px);line-height:1.7;letter-spacing:.02em;overflow-wrap:anywhere}
.game-input-label{display:block;font-size:12px;font-weight:700;margin:8px 0}.game-console textarea,.feedback-card textarea,.feedback-card input,.feedback-card select{width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:inherit;box-sizing:border-box}.game-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}.game-result{margin-top:18px;padding:16px;border-radius:14px;background:var(--surface,rgba(120,130,160,.10))}
.memory-prompt{margin:12px 0;padding:14px;border:1px dashed var(--accent);border-radius:12px;font-weight:700}
.feedback-card{max-width:760px;padding:22px}.feedback-card form{display:grid;gap:16px}.feedback-card label{display:grid;gap:7px;font-weight:650}.feedback-card .muted{font-size:12px;line-height:1.6}
.rpg-columns{margin:18px 0}.rpg-card{overflow:hidden}.rpg-emblem{font-size:32px;color:var(--accent)}.xp-track{height:10px;border-radius:99px;background:var(--line);overflow:hidden;margin:12px 0 8px}.xp-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),#a78bfa);border-radius:inherit;transition:width .3s}
.achievement-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.achievement{font-size:11px;padding:7px 9px;border-radius:99px;background:var(--line);color:var(--muted)}.achievement.earned{color:var(--text);background:color-mix(in srgb,var(--accent) 16%,var(--panel))}
.daily-quest{padding:12px 0;color:var(--muted);font-size:13px}
@media(max-width:650px){.game-topline{display:block}.game-stats{margin-top:16px;justify-content:space-between}.game-console{padding:15px}.game-target{padding:15px;font-size:17px}}

/* Original KEYFORGE theme mascots */
.theme-mascot{display:flex;align-items:center;gap:8px;margin:9px 0 3px;min-height:32px}
.theme-mascot i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-style:normal;font-size:21px;background:rgba(255,255,255,.10);box-shadow:0 3px 10px rgba(0,0,0,.12)}
.theme-mascot small{font-size:11px;font-weight:700;color:var(--muted)}
.mascot-electric i{background:#fff0a6}.mascot-pink i{background:#ffe0f0}.mascot-hero i{background:#d9e7ff}.mascot-block i{background:#d9efc9}.mascot-cyber i{background:#d8d0ff}.mascot-galaxy i{background:#e4ddff}.mascot-light i{background:#fff0bd}.mascot-dark i{background:#d5d8e8}
.training-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.training-card{min-height:190px;display:flex;flex-direction:column;align-items:flex-start}
.training-card .btn{margin-top:auto}

/* Arcade arena and mascot collection */
#arcadeCanvas{display:block;width:100%;height:auto;max-height:360px;border:1px solid rgba(130,170,230,.28);border-radius:16px;background:#111a32;margin:18px 0 12px}
.arcade-target-row{display:flex;gap:10px;align-items:center;padding:10px 14px;margin:10px 0 14px;border-radius:12px;background:rgba(120,160,230,.10)}
.arcade-target-row span{font-weight:800;letter-spacing:.04em;color:var(--accent,#8fc5ff)}
#gameInput{width:100%;font:inherit;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.game-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:10px;margin:18px 0}
.game-choice{display:flex;flex-direction:column;gap:6px;text-align:left;min-height:82px;padding:13px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);cursor:pointer}
.game-choice b{font-size:.95rem}.game-choice small{color:var(--muted);line-height:1.35}
.game-choice.selected{border-color:var(--accent,#83b9ff);box-shadow:0 0 0 2px rgba(110,160,255,.16)}
.game-stats{display:flex;gap:14px;flex-wrap:wrap}.game-stats span{display:flex;flex-direction:column;min-width:48px}.game-stats small{font-size:.68rem;color:var(--muted)}
.mascot-collection{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:12px;margin-top:16px}
.mascot-card{display:flex;align-items:center;flex-direction:column;gap:7px;text-align:center;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);min-width:0}
.mascot-card img{width:86px;height:86px;object-fit:contain}.mascot-card b{font-size:.88rem}.mascot-card small{font-size:.72rem;color:var(--muted)}
.mascot-card.active{border-color:var(--accent,#83b9ff);box-shadow:0 0 0 2px rgba(110,160,255,.18)}
.mascot-card.locked img{filter:grayscale(.8);opacity:.55}.mascot-state{font-size:.72rem;font-weight:800;color:var(--accent,#83b9ff)}
.locked-label{font-size:.67rem;color:var(--muted)}.mascot-select{font-size:.75rem;padding:7px 10px}
.mascot-reward-note{margin-top:12px;color:var(--muted);font-size:.88rem}
.theme-mascot-art{width:48px;height:48px;object-fit:contain;vertical-align:middle}
@media(max-width:640px){.game-topline{align-items:flex-start;gap:12px;flex-direction:column}.game-stats{width:100%;justify-content:space-between}}

/* Overview companion and clearer game arena layout */
.home-mascot-card{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 20px;padding:20px 24px;background:linear-gradient(115deg,rgba(72,122,200,.20),rgba(151,105,220,.14));border:1px solid rgba(130,160,220,.24)}
.home-mascot-card img{display:block;width:132px;height:132px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,0,0,.2));flex:none}
.home-mascot-copy{min-width:0}.home-mascot-copy h3{font-size:1.35rem;margin:7px 0}.home-mascot-copy p{color:var(--muted);margin:4px 0 14px}
.game-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:20px 0}
.game-choice{min-height:100px;padding:16px;border-radius:15px;border:1px solid var(--line);background:var(--panel);color:var(--text);transition:transform .16s,border-color .16s,box-shadow .16s}
.game-choice:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.12)}
.game-choice.selected{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent)}
.game-choice b{font-size:1rem}.game-choice small{font-size:.8rem;line-height:1.45}
@media(max-width:600px){.home-mascot-card{padding:15px}.home-mascot-card img{width:92px;height:92px}.game-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}

.mission-celebration{display:flex;align-items:center;gap:14px;padding:14px;margin-bottom:14px;border-radius:14px;background:linear-gradient(110deg,rgba(255,198,75,.18),rgba(117,104,220,.16));animation:missionPop .45s ease-out}.mission-celebration img{width:82px;height:82px;object-fit:contain;animation:mascotBounce .8s ease-in-out infinite alternate}.mission-celebration p{margin:4px 0 0;color:var(--muted)}@keyframes mascotBounce{from{transform:translateY(2px) rotate(-4deg)}to{transform:translateY(-7px) rotate(4deg)}}@keyframes missionPop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
/* Game arena visual polish */
#arcadeCanvas{display:block;width:100%;height:auto;min-height:220px;border:1px solid var(--line);border-radius:16px;background:#10182d;box-shadow:inset 0 0 40px rgba(65,120,210,.12)}
.arcade-target-row{display:flex;align-items:center;gap:10px;margin:14px 0 8px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.arcade-target-row span{font-weight:800;letter-spacing:.04em;color:var(--accent)}
#gameInput{width:100%;box-sizing:border-box;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:600 17px system-ui;outline-offset:3px}
#gameInput:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}

/* Immersive arcade cabinet */
.game-console.game-open{position:fixed!important;inset:12px!important;z-index:9999!important;width:auto!important;max-width:none!important;height:calc(100vh - 24px);overflow-y:auto;padding:clamp(14px,2vw,28px)!important;background:var(--panel);box-shadow:0 24px 90px rgba(0,0,0,.55);border:1px solid var(--line)}
body.game-overlay-open{overflow:hidden}
.game-console.game-open #arcadeCanvas{width:100%;height:min(53vh,620px);min-height:300px;object-fit:fill;border-radius:18px}
.game-console.game-open .game-topline{align-items:center;gap:18px}.game-exit{white-space:nowrap;flex:none}
.game-mascot-stage{display:flex;align-items:center;gap:18px;padding:12px 16px;margin:12px 0;border-radius:18px;background:linear-gradient(110deg,rgba(78,135,220,.16),rgba(150,100,220,.13));border:1px solid var(--line)}
.game-mascot-avatar{position:relative;flex:none;width:106px;height:106px;display:grid;place-items:center}.game-mascot-avatar img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.2));animation:mascotIdle 2.3s ease-in-out infinite}
.game-mascot-avatar img.mascot-react{animation:mascotReact .55s ease}.mascot-status-dot{position:absolute;right:8px;bottom:12px;width:12px;height:12px;border-radius:50%;background:#46d58a;box-shadow:0 0 0 4px rgba(70,213,138,.16)}
.game-mascot-dialog{min-width:0;flex:1}.game-mascot-dialog>b{font-size:1.05rem}.game-mascot-dialog>p{margin:5px 0 10px;min-height:24px}.mascot-chat-row{display:flex;gap:8px;flex-wrap:wrap}.mascot-chat-row input{flex:1;min-width:160px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);font:inherit}.game-mascot-dialog>small{display:block;margin-top:7px;font-size:.72rem}
@keyframes mascotIdle{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}@keyframes mascotReact{0%{transform:scale(1) rotate(0)}35%{transform:scale(1.18) rotate(-9deg)}70%{transform:scale(.96) rotate(8deg)}100%{transform:scale(1) rotate(0)}}
@media(max-width:700px){.game-console.game-open{inset:5px!important;height:calc(100vh - 10px);padding:12px!important}.game-console.game-open #arcadeCanvas{height:42vh;min-height:230px}.game-mascot-stage{gap:10px;padding:10px}.game-mascot-avatar{width:76px;height:76px}.game-exit{font-size:.75rem;padding:8px}.game-stats{gap:8px}}

/* KEYFORGE companion chat and full-screen arcade controls */
.home-mascot-card{display:grid;grid-template-columns:minmax(180px,1fr) 150px minmax(260px,1.25fr);align-items:center;gap:22px}
.home-mascot-card>img{grid-column:2;grid-row:1;width:142px;height:142px;animation:mascotIdle 2.5s ease-in-out infinite}
.home-mascot-chat{grid-column:3;grid-row:1;min-width:0;padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(10,18,35,.10)}
.home-mascot-speech{min-height:42px;margin-bottom:10px;font-weight:650;line-height:1.45}
.home-mascot-chat .mascot-chat-row input{min-width:100px}
.game-difficulty-label{display:flex;flex-direction:column;gap:4px;min-width:105px;font-size:.75rem;color:var(--muted);font-weight:700}
.game-difficulty-label select{padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:inherit}
.game-console.game-open{inset:0!important;width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;border:0!important;padding:clamp(12px,2vw,26px)!important;display:flex;flex-direction:column;gap:8px}
.game-console.game-open #arcadeCanvas{height:clamp(340px,57vh,720px);max-height:none;min-height:340px;flex:1 1 auto;width:100%;}
.game-console.game-open .game-mascot-stage{flex:0 0 auto;max-height:145px}
.game-console.game-open .game-topline{flex:0 0 auto}
.game-console.game-open .arcade-target-row{flex:0 0 auto}
.game-console.game-open #gameInput{flex:0 0 auto}
.game-console.game-open:fullscreen{overflow-y:auto;background:var(--panel)}
@media(max-width:850px){.home-mascot-card{grid-template-columns:1fr 100px}.home-mascot-card>img{grid-column:2;grid-row:1;width:96px;height:96px}.home-mascot-chat{grid-column:1/-1;grid-row:2}.game-console.game-open #arcadeCanvas{height:48vh;min-height:250px}.game-console.game-open .game-mascot-stage{max-height:none}}
@media(max-width:560px){.game-console.game-open .game-topline{flex-wrap:wrap}.game-console.game-open .game-stats{order:3;width:100%}.game-console.game-open #arcadeCanvas{height:42vh;min-height:220px}.game-difficulty-label{min-width:90px}.home-mascot-chat .mascot-chat-row input{min-width:100%;}}

/* Arcade feedback and game feel polish */
.game-console.game-open #arcadeCanvas{background:#080d1c;box-shadow:0 18px 55px rgba(0,0,0,.34),inset 0 0 60px rgba(89,155,255,.18);transition:transform .06s linear;}
.game-console.game-open .arcade-target-row{background:linear-gradient(100deg,rgba(79,139,255,.13),rgba(91,220,174,.10));border-color:color-mix(in srgb,var(--accent) 45%,var(--line));}
.game-console.game-open #gameInput{font-size:clamp(18px,2vw,25px);letter-spacing:.04em;padding:16px 18px;box-shadow:0 8px 28px rgba(0,0,0,.12);}
.game-console.game-open #gameInput:focus{animation:inputPulse 1.6s ease-in-out infinite;}
@keyframes inputPulse{0%,100%{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 14%,transparent)}50%{box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 24%,transparent)}}
.game-console.game-open .game-stats span{min-width:66px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(127,150,190,.08)}
.game-console.game-open .game-stats b{font-size:1.35rem;font-variant-numeric:tabular-nums}

/* Arcade art presentation upgrade */
.game-console.game-open #arcadeCanvas{height:clamp(430px,66vh,820px)!important;min-height:430px!important;max-height:none!important;border:1px solid rgba(160,205,255,.34);border-radius:22px;box-shadow:0 24px 70px rgba(0,0,0,.48),inset 0 0 90px rgba(105,170,255,.18);}
.game-console.game-open{background:linear-gradient(145deg,rgba(10,15,32,.98),rgba(20,24,48,.98));}
.game-console.game-open .game-topline{padding:12px 16px;border-radius:16px;background:linear-gradient(110deg,rgba(75,104,160,.2),rgba(30,40,72,.32));}
@media(max-width:850px){.game-console.game-open #arcadeCanvas{height:55vh!important;min-height:300px!important}}

/* KEYFORGE Brain Training + Adventure expansion */
.legacy-games-hidden{display:none!important}.feature-launch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}.feature-launch{border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text);padding:22px;text-align:left;display:grid;gap:8px;cursor:pointer;transition:transform .2s,border-color .2s}.feature-launch:hover{transform:translateY(-3px);border-color:var(--accent)}.feature-launch>span{font-size:32px}.feature-launch b{font-size:19px}.feature-launch small,.feature-launch i{color:var(--muted);font-style:normal}.brain-score-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}.brain-score-strip .card{padding:18px}.brain-score-strip small{display:block;color:var(--muted);font-size:11px;letter-spacing:.08em}.brain-score-strip strong{font-size:30px}.brain-game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.brain-game-card{min-height:360px;display:flex;flex-direction:column;gap:12px}.brain-icon{font-size:34px}.brain-game-card h3{margin:0}.brain-game-card p{color:var(--muted);min-height:58px}.memory-display,.pattern-question,.scramble-word{border:1px solid var(--line);background:var(--surface,rgba(120,130,160,.08));border-radius:14px;min-height:74px;display:grid;place-items:center;font-size:27px;font-weight:800;letter-spacing:.12em;padding:12px}.memory-pad,.pattern-answers{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.memory-pad button,.pattern-answers button{min-height:48px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);font-size:20px;cursor:pointer}.memory-pad button.lit{background:var(--accent);color:#fff;box-shadow:0 0 24px rgba(120,100,255,.45)}.pattern-answers button{font-size:16px}.brain-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:auto}.brain-actions .muted{font-size:12px}.brain-game-card input{width:100%;padding:13px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text)}.daily-challenge-list{display:grid;gap:8px;margin:12px 0}.daily-challenge-item{display:flex;gap:9px;align-items:center;color:var(--muted);font-size:13px}.daily-challenge-item.done{color:var(--accent)}.adventure-banner{display:flex;justify-content:space-between;align-items:center;overflow:hidden;background:linear-gradient(115deg,rgba(93,78,210,.22),rgba(31,153,167,.12))}.adventure-banner h2{font-size:28px;margin:8px 0}.adventure-hero-art{font-size:100px;filter:drop-shadow(0 12px 20px rgba(0,0,0,.25))}.adventure-progress{height:10px;width:min(480px,70vw);background:rgba(130,130,150,.2);border-radius:20px;overflow:hidden;margin:18px 0 8px}.adventure-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#8b72ff,#38c9c0);border-radius:20px}.adventure-world-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.world-card{border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--panel);position:relative;overflow:hidden}.world-card.locked{opacity:.58;filter:saturate(.55)}.world-card .world-art{font-size:42px}.world-card h3{margin:12px 0 6px}.world-card p{color:var(--muted);font-size:13px;min-height:40px}.world-card .world-lock{font-size:12px;color:var(--muted)}@media(max-width:900px){.brain-game-grid{grid-template-columns:1fr 1fr}.adventure-world-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.feature-launch-grid,.brain-game-grid,.brain-score-strip,.adventure-world-grid{grid-template-columns:1fr}.adventure-banner{align-items:flex-start}.adventure-hero-art{font-size:58px}}

/* Global scrolling fix: keep the document scrollable on desktop and mobile. */
html{min-height:100%;overflow-y:auto!important;scrollbar-gutter:stable;}
body{min-height:100%;height:auto!important;overflow-x:hidden;overflow-y:auto!important;}
body.game-overlay-open{overflow-y:auto!important;}
.sidebar{max-height:100vh;overflow-y:auto;overscroll-behavior:contain;}
.main{min-height:100vh;}
.content{min-height:calc(100vh - 70px);padding-bottom:90px;}
.game-console.game-open{overflow-y:auto!important;overscroll-behavior:contain;}

.academy-course-note{color:var(--muted);font-size:12px;font-weight:700;padding:11px 0}


/* KEYFORGE mobile-first usability refinements */
@media (max-width: 760px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; }
  .sidebar { width:min(86vw,310px); padding:18px 14px; box-shadow:18px 0 45px #0004; }
  .topbar { min-height:60px; height:60px; gap:10px; padding:0 12px; }
  .topbar #crumb { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .top-actions { gap:7px; }
  .pill { padding:6px 8px; white-space:nowrap; }
  .content { width:100%; padding:18px 12px 38px; }
  .hero { gap:14px; padding:20px 17px; border-radius:14px; }
  .hero h1 { font-size:clamp(29px,8vw,38px); }
  .card { padding:15px; border-radius:12px; }
  .filter-grid { grid-template-columns:1fr; }
  .mode-tabs { display:grid; grid-template-columns:1fr 1fr; }
  .mode-tabs button { min-height:42px; }
  .session-grid { grid-template-columns:minmax(0,1fr); }
  .typing-panel { padding:14px; min-width:0; }
  .session-top { gap:8px; flex-wrap:wrap; }
  .passage { font-size:17px; line-height:1.8; overflow-wrap:anywhere; word-break:normal; }
  .typing-panel textarea, .game-console textarea, input, select, button { max-width:100%; }
  .typing-panel textarea { min-height:125px; font-size:16px; }
  .live-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .paragraph-actions { align-items:stretch; }
  .paragraph-actions button { flex:1 1 auto; min-height:42px; }
  .paragraph-actions .muted { flex:1 0 100%; margin-left:0; }
  .academy-lesson-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .academy-lesson-item { min-width:0; overflow-wrap:anywhere; }
  .mission-row { flex-wrap:wrap; }
  .mission-row button { margin-left:auto; }
  .table-wrap { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .game-console.game-open { overflow-y:auto!important; }
}
@media (max-width: 420px) {
  .topbar { padding:0 9px; }
  .top-actions .pill { font-size:9px; }
  .content { padding-left:9px; padding-right:9px; }
  .hero { padding:17px 14px; }
  .hero p, .page-heading p { font-size:12px; }
  .academy-lesson-list { grid-template-columns:1fr; }
  .academy-native { font-size:23px; }
  .game-picker { grid-template-columns:1fr 1fr; }
  .brain-score-strip { grid-template-columns:1fr 1fr; }
}
@media (hover:none) and (pointer:coarse) {
  button, .nav, select, .typing-panel textarea { touch-action:manipulation; }
  .btn, .nav, .mode-tabs button, .academy-lesson-item { min-height:42px; }
}

.mobile-menu-overlay{position:fixed;inset:0;z-index:15;border:0;padding:0;background:rgba(4,9,18,.58);cursor:pointer}


/* Friendly mascot conversation panel */
.mascot-chat-log{display:flex;flex-direction:column;gap:8px;max-height:190px;min-height:76px;overflow-y:auto;padding:2px 3px 8px;scrollbar-width:thin}
.mascot-bubble{max-width:92%;padding:10px 12px;border-radius:14px;line-height:1.45;font-size:.92rem;overflow-wrap:anywhere}
.mascot-bot{align-self:flex-start;background:rgba(113,143,205,.16);border:1px solid rgba(130,160,220,.18);border-bottom-left-radius:5px}
.mascot-user{align-self:flex-end;background:rgba(116,92,205,.22);border:1px solid rgba(150,125,225,.24);border-bottom-right-radius:5px}
.home-mascot-chat .mascot-chat-row{margin-top:6px}
.home-mascot-chat .mascot-chat-row input{min-width:100px}
@media(max-width:560px){.mascot-chat-log{max-height:160px}.mascot-bubble{max-width:96%;font-size:.88rem}.home-mascot-chat .mascot-chat-row input{min-width:100%;}}