:root{
  --bg:#0c0e14; --bg-2:#151824; --bg-3:#1c2030;
  --line:#272c3c; --line-soft:rgba(255,255,255,.08);
  --text:#e9e7de; --text-dim:#9aa0b4;
  --linux:#e08b3d; --linux-dim:#3a2a1c;
  --windows:#4f8fd1; --windows-dim:#1c2a3a;
  --mint:#52d1a6; --coral:#ef6a63; --gold:#f2c14e; --cyan:#5fd7e0; --violet:#b39bff;
  --radius-s:8px; --radius-m:14px; --radius-l:22px;
  --shadow: 0 12px 30px rgba(0,0,0,.4);
  --term-bg:#0b0d12; --term-bar-bg:#151821; --term-text:#e9e7de; --term-text-dim:#9aa0b4;
  --term-prompt:#6c9ef5; --term-ok:#9be29c; --term-err:#f0958f;
}
:root[data-theme="light"]{
  --bg:#f4f0e4; --bg-2:#ffffff; --bg-3:#efe9d8;
  --text:#181a1f; --text-dim:#5a5e70; --line:#e2ddc9; --line-soft:rgba(0,0,0,.08);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#f4f0e4; --bg-2:#ffffff; --bg-3:#efe9d8;
    --text:#181a1f; --text-dim:#5a5e70; --line:#e2ddc9; --line-soft:rgba(0,0,0,.08);
  }
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--bg); color:var(--text); font-family:'Inter',sans-serif; min-height:100vh; -webkit-font-smoothing:antialiased;}
.mono{font-family:'JetBrains Mono',monospace;}
#app{max-width:480px;margin:0 auto;min-height:100vh;position:relative;padding-bottom:90px;}
.screen{display:none;padding:20px 18px 8px;animation:fadein .35s ease;}
.screen.active{display:block;}
@keyframes fadein{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){.screen{animation:none;}}

.statusbar{position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:14px; padding:12px 18px; background:var(--bg); border-bottom:1px solid var(--line-soft);}
.stat{display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text-dim);}
.stat b{color:var(--text); font-weight:700;}
.energy-bar-wrap{flex:1; height:8px; background:var(--bg-3); border-radius:99px; overflow:hidden;}
.energy-bar{height:100%; background:linear-gradient(90deg,var(--gold),#f7d97a); border-radius:99px; transition:width .4s ease;}

h1,h2,h3{font-family:'Space Grotesk',sans-serif; margin:0 0 8px; line-height:1.15;}
p{line-height:1.55; color:var(--text-dim); margin:0 0 14px;}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:15px 18px; border-radius:var(--radius-m); border:none; font-weight:700; font-size:15px; cursor:pointer; transition:transform .12s ease;}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--mint); color:#08251c;}
.btn-outline{background:transparent; border:1.5px solid var(--line); color:var(--text);}
.btn-gold{background:var(--gold); color:#3a2a05;}
.btn-cyan{background:var(--cyan); color:#052226;}
.btn:disabled{opacity:.4; cursor:not-allowed;}
.card{background:var(--bg-2); border:1px solid var(--line-soft); border-radius:var(--radius-l); padding:20px;}
.tag{display:inline-block; font-size:11.5px; font-weight:600; padding:4px 10px; border-radius:99px;}
.tag-linux{background:var(--linux-dim); color:var(--linux);}
.tag-windows{background:var(--windows-dim); color:var(--windows);}
.tag-cyan{background:rgba(95,215,224,.15); color:var(--cyan);}
.tag-gold{background:rgba(242,193,78,.15); color:var(--gold);}
.tag-mint{background:rgba(82,209,166,.15); color:var(--mint);}
.tag-coral{background:rgba(239,106,99,.15); color:var(--coral);}
.tag-violet{background:rgba(179,155,255,.15); color:var(--violet);}
.backlink{display:inline-flex; align-items:center; gap:6px; background:none; border:none; color:var(--text-dim); font-size:13.5px; font-weight:600; cursor:pointer; padding:0 0 16px;}

.hero-term{background:var(--term-bg); border-radius:var(--radius-l); padding:18px; border:1px solid var(--line-soft); margin-bottom:18px;}
.hero-term .dots{display:flex; gap:6px; margin-bottom:12px;}
.hero-term .dots span{width:9px; height:9px; border-radius:50%;}
.hero-term .dots span:nth-child(1){background:var(--coral);} .hero-term .dots span:nth-child(2){background:var(--gold);} .hero-term .dots span:nth-child(3){background:var(--mint);}
.hero-term .line{font-size:13.5px; color:var(--term-ok); margin-bottom:4px;}
.hero-term .line .prompt{color:var(--term-prompt);}
.hero-term .caret{display:inline-block; width:7px; height:14px; background:var(--term-ok); vertical-align:middle; animation:blink 1s step-end infinite;}
@keyframes blink{50%{opacity:0;}}
.track-pick{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px;}
.track-card{border-radius:var(--radius-m); padding:16px 14px; border:1.5px solid var(--line); background:var(--bg-2); cursor:pointer; text-align:left;}
.track-card.selected{border-color:var(--mint);}
.track-card .icon{font-size:22px; margin-bottom:8px; display:block;}
.track-card b{display:block; font-size:14.5px;}
.track-card span{font-size:12px; color:var(--text-dim);}

.progress-dots{display:flex; gap:6px; margin-bottom:18px;}
.progress-dots i{flex:1; height:4px; border-radius:99px; background:var(--bg-3);}
.progress-dots i.done{background:var(--mint);}
.qopt{display:block; width:100%; text-align:left; padding:14px 16px; margin-bottom:10px; border-radius:var(--radius-m); border:1.5px solid var(--line); background:var(--bg-2); color:var(--text); font-size:14.5px; cursor:pointer;}
.qopt.correct{border-color:var(--mint); background:rgba(82,209,166,.16);}
.qopt.wrong{border-color:var(--coral); background:rgba(239,106,99,.14);}
.qopt:disabled{cursor:default;}

/* ---------- GLOBE ---------- */
.tabs{display:flex; gap:8px; margin-bottom:16px;}
.tab{flex:1; padding:10px; border-radius:var(--radius-s); text-align:center; font-weight:700; font-size:13.5px; border:1.5px solid var(--line); background:var(--bg-2); cursor:pointer; color:var(--text-dim);}
.tab.active-linux{border-color:var(--linux); color:var(--linux); background:var(--linux-dim);}
.tab.active-windows{border-color:var(--windows); color:var(--windows); background:var(--windows-dim);}
.globe-wrap{position:relative; border-radius:var(--radius-l); overflow:hidden; border:1px solid var(--line-soft); margin-bottom:14px;
  background:radial-gradient(ellipse at 50% 30%, #16203a 0%, #060810 75%);}
.globe-hint{position:absolute; bottom:10px; left:0; right:0; text-align:center; font-size:11px; color:var(--text-dim); pointer-events:none; opacity:.75;}
#globe-svg{display:block; width:100%; height:auto; touch-action:none; cursor:grab; transform-origin:50% 50%;}
#globe-svg:active{cursor:grabbing;}
@keyframes globeZoomPulse{0%{transform:scale(1);}50%{transform:scale(1.22);}100%{transform:scale(1);}}
#globe-svg.zoom-pulse{animation:globeZoomPulse .5s ease; transform-origin:var(--zoom-ox,50%) var(--zoom-oy,50%);}
.marker-label{font-family:'Space Grotesk',sans-serif; font-weight:700; pointer-events:none;}
.country-row{display:flex; align-items:center; gap:12px; padding:12px 4px; border-bottom:1px solid var(--line-soft); cursor:pointer;}
.country-row:last-child{border-bottom:none;}
.country-row .flag{font-size:20px; width:26px; text-align:center;}
.country-row b{display:block; font-size:13.5px;}
.country-row span{font-size:12px; color:var(--text-dim);}
.country-row .lockic{margin-left:auto; opacity:.5;}

/* ---------- country modal ---------- */
.overlay{position:fixed; inset:0; background:rgba(6,8,13,.78); display:none; align-items:flex-end; justify-content:center; z-index:50;}
.overlay.show{display:flex;}
.overlay.center{align-items:center; padding:24px;}
.sheet{background:var(--bg-2); border-radius:22px 22px 0 0; padding:22px 20px 26px; max-width:480px; width:100%; border:1px solid var(--line-soft); border-bottom:none;}
.modal{background:var(--bg-2); border-radius:var(--radius-l); padding:26px 22px; max-width:380px; width:100%; text-align:center; border:1px solid var(--line-soft);}
.modal .big{font-size:40px; margin-bottom:10px;}

/* ---------- chapter intro ---------- */
.chapter-hero{display:flex; align-items:center; gap:12px; margin-bottom:18px;}
.chapter-hero .emoji{font-size:34px;}
.cmd-row{display:flex; align-items:center; gap:12px; padding:11px 0; border-bottom:1px solid var(--line-soft);}
.cmd-row:last-child{border-bottom:none;}
.cmd-row .num{width:22px; height:22px; border-radius:50%; background:var(--bg-3); color:var(--text-dim); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cmd-row code{font-family:'JetBrains Mono',monospace; font-size:13px; background:var(--bg-3); padding:2px 7px; border-radius:5px;}
.stage-card{margin-bottom:14px;}
.stage-card.locked{opacity:.5;}

/* ---------- terminal ---------- */
.term-window{background:var(--term-bg); border-radius:var(--radius-m); border:1px solid var(--line-soft); overflow:hidden; margin:16px 0;}
.term-bar{display:flex; align-items:center; gap:6px; padding:10px 12px; background:var(--term-bar-bg); border-bottom:1px solid var(--line-soft);}
.term-bar span{width:9px; height:9px; border-radius:50%;}
.term-bar span:nth-child(1){background:var(--coral);} .term-bar span:nth-child(2){background:var(--gold);} .term-bar span:nth-child(3){background:var(--mint);}
.term-bar b{margin-left:8px; font-size:12px; color:var(--term-text-dim); font-weight:500;}
.term-body{padding:14px 14px 16px; font-family:'JetBrains Mono',monospace; font-size:13.5px;}
.term-out{color:var(--term-ok); white-space:pre-wrap; margin-bottom:10px; min-height:18px;}
.term-out.err{color:var(--term-err);}
.term-in{display:flex; align-items:center; gap:8px; background:#0f131a; border-radius:8px; padding:10px 12px; border:1px solid var(--line-soft);}
.term-in .p{color:var(--term-prompt); flex-shrink:0;}
.term-in input{flex:1; background:none; border:none; outline:none; color:var(--term-text); font-family:'JetBrains Mono',monospace; font-size:13.5px;}
.term-in input::placeholder{color:var(--term-text-dim); opacity:.7;}
.feedback{border-radius:var(--radius-s); padding:12px 14px; font-size:13.5px; margin-top:10px; display:none;}
.feedback.show{display:block;}
.feedback.ok{background:rgba(82,209,166,.12); color:var(--mint);}
.feedback.bad{background:rgba(239,106,99,.12); color:var(--coral);}
.example-box{background:var(--bg-3); border-left:3px solid var(--cyan); border-radius:8px; padding:12px 14px; font-size:13px; margin-bottom:14px;}
.example-box b{color:var(--cyan); display:block; margin-bottom:4px; font-size:11px; text-transform:uppercase; letter-spacing:.4px;}
.hint-box{background:var(--bg-3); border-left:3px solid var(--gold); border-radius:8px; padding:12px 14px; font-size:13px; margin-bottom:14px; font-style:italic;}
.hint-box b{color:var(--gold); font-style:normal; display:block; margin-bottom:4px; font-size:11px; text-transform:uppercase; letter-spacing:.4px;}
.lesson-progress{display:flex; gap:3px; margin-bottom:14px;}
.lesson-progress i{flex:1; height:5px; border-radius:99px; background:var(--bg-3);}
.lesson-progress i.done{background:var(--mint);}
.lesson-progress i.current{background:var(--cyan);}
.review-banner{display:flex; align-items:center; gap:10px; background:rgba(242,193,78,.12); border-radius:var(--radius-m); padding:12px 14px; margin-bottom:14px; font-size:13px; color:var(--gold); font-weight:600;}
.combo-steps{display:flex; gap:8px; margin-bottom:14px;}
.combo-steps .cstep{flex:1; text-align:center; padding:8px; border-radius:8px; background:var(--bg-3); font-size:11.5px; font-weight:700; color:var(--text-dim);}
.combo-steps .cstep.active{background:rgba(179,155,255,.18); color:var(--violet);}
.combo-steps .cstep.done{background:rgba(82,209,166,.15); color:var(--mint);}

.bottom-nav{position:fixed; bottom:0; left:0; right:0; z-index:20; background:var(--bg-2); border-top:1px solid var(--line-soft);}
.bottom-nav-inner{max-width:480px; margin:0 auto; display:flex;}
.nav-btn{flex:1; padding:11px 2px 9px; text-align:center; background:none; border:none; color:var(--text-dim); font-size:10.5px; cursor:pointer;}
.nav-btn .ic{display:block; font-size:18px; margin-bottom:2px;}
.nav-btn.active{color:var(--mint);}

.info-row{display:flex; gap:12px; align-items:flex-start; padding:12px 0; border-bottom:1px solid var(--line-soft);}
.info-row:last-child{border-bottom:none;}
.info-row .ic{font-size:18px; width:24px; text-align:center;}
.info-row div b{display:block; font-size:13.5px; color:var(--text);}
.info-row div span{font-size:12.5px; color:var(--text-dim); line-height:1.5;}

.plan-card{border:1.5px solid var(--line); border-radius:var(--radius-l); padding:18px; margin-bottom:14px;}
.plan-card.featured{border-color:var(--gold);}
.plan-price{font-size:30px; font-weight:700; font-family:'Space Grotesk',sans-serif;}
.plan-price span{font-size:14px; color:var(--text-dim); font-weight:500;}
.plan-sub{font-size:12px; color:var(--text-dim); margin-bottom:12px;}
.badge-save{display:inline-block; background:var(--gold); color:#3a2a05; font-size:11px; font-weight:700; padding:3px 9px; border-radius:99px; margin-bottom:8px;}

.game-progress{display:flex; gap:6px; margin-bottom:20px;}
.game-progress i{flex:1; height:6px; border-radius:99px; background:var(--bg-3);}
.game-progress i.done{background:var(--mint);}
:root{--bg:#0c171b;--bg-2:#13252b;--bg-3:#1b3037;--line:#2b4248;--line-soft:#24383e;--text:#f2f1e7;--text-dim:#a5babd;--mint:#b9edab;--cyan:#b9edab;--gold:#eacb8b;--linux:#b9edab;--windows:#99cde5;--linux-dim:#253c2c;--windows-dim:#223a46;--radius-l:18px;--term-bg:#081318;--ease-out:cubic-bezier(.23,1,.32,1)}
body{background:var(--bg);font-family:Inter,system-ui,sans-serif}h1,h2,h3{font-family:Inter,system-ui,sans-serif;letter-spacing:-.045em}button,input{font:inherit}button{touch-action:manipulation}button:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
#app{max-width:1120px;padding:0 30px 100px}.winux-brand{display:flex;align-items:center;gap:10px;padding:24px 0;font-weight:700;font-size:23px;letter-spacing:-1px}.winux-brand .brandmark{background:var(--mint);color:var(--bg);border-radius:10px;padding:7px 10px;font-family:monospace;letter-spacing:-3px}.winux-brand .brand-note{margin-left:auto;color:var(--text-dim);font-size:12px;letter-spacing:0;font-weight:400}
.statusbar{position:static;background:transparent;padding:14px 0;margin:0 0 26px;gap:24px}.energy-bar-wrap{max-width:120px}.stat{white-space:nowrap}.screen{padding:0;animation:none}#screen-home,#screen-quiz,#screen-quizresult,#screen-chapter,#screen-lesson,#screen-energy,#screen-game,#screen-account,#screen-paywall,#screen-expert{max-width:640px;margin:20px auto}.btn{border-radius:12px;transition:transform 140ms var(--ease-out);padding:15px 18px}.btn-primary,.btn-cyan{background:var(--mint);color:#11241a}.btn-outline{border-width:1px}.card{box-shadow:none}.example-box,.hint-box{border-left:0;padding:18px;border:1px solid var(--line);border-radius:12px}
.map-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0 0 26px}.eyebrow{font:11px 'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:2px;color:var(--mint);margin-bottom:12px}.map-heading h1{font-size:42px;line-height:1.05;margin-bottom:10px}.map-heading p{font-size:14px;margin:0}.tabs{margin:0;min-width:285px;gap:4px;padding:4px;background:var(--bg-2);border-radius:12px}.tab{border:0;border-radius:8px;font-size:12px;padding:12px}.tab.active-linux{background:var(--mint);color:#12251b}.tab.active-windows{background:var(--windows);color:#112532}
.world-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:28px;align-items:start}.globe-wrap{background:radial-gradient(ellipse at center,#213a40 0%,#102126 58%,#0c171b 75%);border:none;overflow:visible;position:relative;margin:0}.globe-wrap::after{content:'';display:block;width:56%;height:8px;position:absolute;bottom:23px;left:22%;background:#071114;border-radius:50%;filter:blur(8px)}#globe-svg{position:relative;z-index:1}.globe-hint{bottom:0;opacity:1;font-family:monospace;color:var(--text-dim);font-size:11px}.globe-kicker{position:absolute;top:10px;left:10px;color:var(--text-dim);font:11px monospace;letter-spacing:1px}.marker-label{font-family:Inter,sans-serif;font-weight:600;paint-order:stroke;stroke:#102126;stroke-width:3px;stroke-linejoin:round}
.journey-panel{padding:0;border:0;background:transparent}.journey-title{display:flex;align-items:center;justify-content:space-between;padding:8px 0 18px}.journey-title b{font-size:15px}.journey-title span{font:11px monospace;color:var(--text-dim)}.country-row{position:relative;display:flex;text-align:left;width:100%;color:var(--text);background:transparent;border:0;padding:16px 0;gap:14px;min-height:72px;border-bottom:1px solid var(--line-soft)}.country-row .route-number{height:33px;width:33px;display:grid;place-items:center;flex-shrink:0;font:12px monospace;border-radius:50%;color:var(--text-dim);border:1px solid var(--line)}.country-row.available .route-number{background:var(--mint);color:#12251b;border-color:var(--mint)}.country-row b{font-size:14px;margin-bottom:5px}.country-row span{font-size:12px;line-height:1.5}.country-row:disabled{cursor:default;opacity:.5}.route-label{font:10px monospace;color:var(--mint);margin-left:auto;white-space:nowrap}.route-progress{display:flex;gap:3px}.route-progress i{width:12px;height:4px;border-radius:4px;background:var(--line)}.route-progress i.done{background:var(--mint)}
.next-lesson{margin-top:24px;border-radius:16px;background:var(--bg-2);padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px}.next-lesson h2{font-size:20px;letter-spacing:-.025em}.next-lesson p{margin:0;font-size:12px}.next-lesson .btn{width:auto;min-width:155px}.next-lesson .eyebrow{font-size:10px;margin-bottom:8px}.bottom-nav{background:var(--bg);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.bottom-nav-inner{max-width:700px}.nav-btn{padding:16px 6px;font-size:12px;min-height:58px}.nav-btn .ic{display:inline;margin-right:6px;font-size:14px}.nav-btn.active{color:var(--mint)}.nav-btn{transition:color 140ms ease}.term-in{gap:6px;padding:12px 8px}.term-in input{min-width:0;font-size:16px}.term-in .p{font-size:11px}.modal,.sheet{box-shadow:0 24px 70px #0005}.sheet{max-width:520px}.sheet .term-window{margin:16px 0}.hero-term{padding:24px;background:#081318}#screen-home h1{font-size:44px!important}.hero-term .caret{animation:none}.track-card{border-radius:14px}.track-card.selected{background:var(--linux-dim)}.track-card .icon{font-size:18px}.chapter-hero{margin-bottom:26px}.stage-card{padding:24px}.tag{font-family:monospace}
@media(hover:hover) and (pointer:fine){.country-row.available:hover b{color:var(--mint)}.nav-btn:hover{color:var(--text)}}
@media(max-width:700px){#app{padding:0 18px 90px}.winux-brand{padding:18px 0;font-size:21px}.brand-note{display:none}.statusbar{gap:16px;margin-bottom:20px}.map-heading{display:block;margin-bottom:12px}.map-heading h1{font-size:32px}.tabs{margin-top:20px;min-width:0}.world-layout{grid-template-columns:1fr;gap:20px}.globe-wrap{max-width:430px;width:100%;margin:auto}.journey-title{padding-top:12px}.next-lesson{align-items:stretch;flex-direction:column;margin:12px 0 0}.next-lesson .btn{width:100%}.nav-btn .ic{display:block;margin:0 0 5px}.nav-btn{font-size:10px;padding:10px 2px}.energy-bar-wrap{max-width:65px}.country-row{padding:15px 0}.screen{margin-top:0!important}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Website palette: warm paper and forest, distinct from the native dark theme. */
:root.web-theme{--bg:#f4f4ec;--bg-2:#fff;--bg-3:#e9ede5;--text:#203932;--text-dim:#68796e;--line:#d8e0d3;--line-soft:#20393218;--mint:#b9e26c;--cyan:#247665;--gold:#d8b456;--linux-dim:#eee8d9;--windows-dim:#dce9e8;--shadow:0 12px 30px #20393215;--term-text:#e9e7de;--term-prompt:#b9e26c}
body{background:radial-gradient(ellipse at 12% 8%,#e4edd6,transparent 55%),var(--bg)}
.more-wrap{position:relative;flex:1}.more-wrap>.nav-btn{width:100%}.more-menu{position:absolute;right:0;bottom:calc(100% + 12px);width:210px;padding:8px;background:var(--bg-2);border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 40px #20393225;transform-origin:bottom right}.more-menu[hidden]{display:none}.more-menu button{display:block;width:100%;padding:15px;text-align:left;border:0;background:transparent;color:var(--text);font:600 16px Inter,sans-serif;border-radius:10px;cursor:pointer}.more-menu button:hover{background:var(--bg-3)}
.screen{animation-duration:180ms}.nav-btn{font-size:14px}p{font-size:16px}.card p,.info-row span{font-size:14px;line-height:1.6}.globe-wrap{background:radial-gradient(circle,#e6eedc,#f4f4ec);border-radius:30px;border:1px solid var(--line)}.globe-hint{color:var(--text-dim)}.hero-term{color:#e9e7de}.term-in input{color:#e9e7de}.term-in .p{color:#b9e26c}.task-prompt{font-size:18px;font-weight:600;color:var(--text)}.activity-meta{display:flex;align-items:center;justify-content:space-between;font-size:14px}.activity-progress{appearance:none;width:100%;height:10px;margin:18px 0 28px;border:0;border-radius:20px;overflow:hidden}.activity-progress::-webkit-progress-bar{background:var(--bg-3)}.activity-progress::-webkit-progress-value{background:var(--mint)}.activity-progress::-moz-progress-bar{background:var(--mint)}.activity-finish{text-align:center;max-width:520px;margin:30px auto}.finish-mark{display:grid;place-items:center;background:var(--mint);width:90px;height:90px;border-radius:50%;font-size:48px;margin:0 auto 28px}.leaderboard-list{padding-left:25px}.leaderboard-list li{padding:16px 4px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;font-size:14px}.leaderboard-consent{display:flex;gap:12px;align-items:flex-start;margin:22px 0;font-size:14px;line-height:1.5}.leaderboard-consent input{width:20px;height:20px;flex-shrink:0;accent-color:#247665}.service-message{margin-top:16px;padding:14px;background:var(--bg-3);border-radius:12px}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #247665;outline-offset:4px}.bottom-nav{box-shadow:0 -4px 24px #20393208}#screen-lesson,#screen-projects,#screen-energy,#screen-account,#screen-help,#screen-paywall,#screen-game,#screen-leaderboard{max-width:680px;margin-left:auto;margin-right:auto}.backlink{font-size:14px}
@media(max-width:700px){.nav-btn{font-size:12px}.more-wrap .nav-btn{padding:10px 2px}.nav-btn .ic{font-size:16px}.map-heading h1{font-size:32px}.card{padding:20px}.more-menu{width:200px}.bottom-nav-inner{padding:0 8px}}

.web-theme .eyebrow,.web-theme .nav-btn.active{color:#247665}.web-theme .brandmark{color:#203932}

/* Keep navigation in its own row instead of overlaying the lesson content. */
.web-theme #app{display:flex;flex-direction:column;height:100vh;height:100dvh;min-height:0;padding-bottom:0;overflow:hidden}
.web-theme .winux-brand,.web-theme .statusbar{flex-shrink:0}
.web-theme .screen{flex:1;min-height:0;width:100%;overflow-y:auto;overflow-x:hidden;padding-bottom:28px;scroll-padding-bottom:28px}
.web-theme .bottom-nav{position:relative;inset:auto;flex-shrink:0;margin-top:auto;padding-bottom:env(safe-area-inset-bottom,0px)}
.web-theme .bottom-nav-inner{width:100%}
.web-theme #screen-home{max-width:680px;margin-inline:auto}
@media(max-width:700px){.web-theme #app{padding-bottom:0}.web-theme .statusbar{margin-bottom:12px}.web-theme .nav-btn{min-height:60px}.web-theme .screen{padding-bottom:24px}}