
:root{color-scheme:dark;--bg:#090e1a;--panel:#121b2c;--line:#29384c;--ink:#eff5ff;--muted:#a1b0c5;--lime:#c6fa70;--gold:#ffdc85;--blue:#8ecaff;--purple:#b1a0ff;--pink:#ff92b0;font-family:Inter,"Segoe UI",Tahoma,Arial,sans-serif;font-synthesis:none;line-height:1.5;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0,#14352f66,transparent 48%),radial-gradient(ellipse at 90% 35%,#3b285c3b,transparent 46%),linear-gradient(#ffffff02 1px,transparent 1px),linear-gradient(90deg,#ffffff02 1px,transparent 1px);background-size:auto,auto,40px 40px,40px 40px;min-height:100dvh}button,input,summary{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button,a,summary,input{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}h1,h2,h3,p{margin:0}h1{font-size:28px;letter-spacing:-.045em;line-height:1.15}svg{flex-shrink:0;vertical-align:middle}button{color:inherit}em{font-style:normal}button,summary{touch-action:manipulation}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:fixed;top:-100px;left:12px;z-index:30;padding:12px;background:var(--lime);color:#112019}.skip-link:focus{top:10px}
.app-shell{max-width:1120px;margin:0 auto;padding:0 20px 22px}.masthead{height:86px;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{display:flex;align-items:center;gap:9px;background:none;border:0;padding:0;font:bold 19px/1.1 Consolas,monospace;letter-spacing:-1px}.brand img{filter:drop-shadow(0 0 10px #72bbff44)}.brand em{color:var(--lime)}.header-controls{display:flex;align-items:center;gap:10px}.language-switch{display:flex;gap:3px;padding:4px;background:#121c2a;border:1px solid #29364a;border-radius:12px}.language-switch button{border:0;background:none;min-height:36px;min-width:42px;padding:5px 9px;border-radius:7px;font-size:12px;font-weight:800;color:#9daec1}.language-switch button[aria-pressed="true"]{color:#121e17;background:var(--lime)}.sound-toggle{position:relative;display:grid;place-items:center;background:#121c2a;border:1px solid #29364a;border-radius:12px;width:44px;height:44px;font-size:23px;color:var(--muted)}.sound-toggle.enabled{color:var(--lime)}.sound-slash{width:23px;height:2px;background:currentColor;transform:rotate(-45deg);position:absolute;border:1px solid #121c2a}.sound-slash[hidden]{display:none}
.run-bar{display:flex;justify-content:space-between;align-items:center;margin:11px 0 14px;min-height:28px}.run-title{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.15em}.run-score{display:flex;gap:8px;align-items:center}.xp-pill,.combo-pill{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600}.xp-pill{color:var(--gold)}.xp-pill strong{font:800 17px Consolas,monospace}.combo-pill{padding:4px 9px;background:#423251;border:1px solid #674d77;border-radius:6px;color:#e8beff}.route{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}.route-stop{display:flex;gap:10px;align-items:center;min-height:49px;border:1px solid #273448;border-radius:9px;background:#111b29;color:#a0b0c4;padding:8px 12px;font-size:12px;font-weight:700}.route-icon{display:flex;align-items:center}.route-number{margin-inline-start:auto;color:#607288;font:12px Consolas,monospace}.route-stop.active{background:#263629;border-color:#74984c;color:var(--lime);box-shadow:inset 0 -2px 0 #405d2b}.route-stop.done .route-icon{color:var(--lime)}.route-stop.done:not(.active){background:#14271f;border-color:#284a36;color:#a6cfa5}
.game-frame{display:grid;grid-template-columns:1.18fr 1fr;border:1px solid #34435b;border-radius:18px;overflow:clip;background:var(--panel);box-shadow:0 20px 80px #0005}.arena-column{min-width:0;background:#0b1721;display:flex;flex-direction:column;position:relative;border-inline-end:1px solid var(--line)}.world-heading{display:flex;align-items:center;gap:10px;padding:17px 18px;font-size:12px;font-weight:700;border-bottom:1px solid #253646;background:#101e2c}.world-tag{font:10px/1.5 Consolas,monospace;color:var(--lime);padding:3px 5px;border:1px solid #3f5548;background:#1f3329}.online-dot{width:6px;height:6px;background:var(--lime);border-radius:50%;margin-inline-start:auto;box-shadow:0 0 8px #c6fa7099}.arena-caption{display:flex;gap:8px;align-items:center;justify-content:center;padding:18px 12px;font-size:11px;color:#9fb6c3;background:#0c1923}.caption-dot{width:5px;height:5px;background:#7ed9bf;border-radius:50%}
.scene{position:relative;aspect-ratio:16/11;width:100%;overflow:hidden;isolation:isolate;direction:ltr;margin-block:auto;background:#113124;min-height:260px}.battle-world{position:absolute;inset:0;overflow:hidden;transform-origin:center}.backdrop{width:100%;height:100%;object-fit:fill;image-rendering:pixelated;display:block;filter:saturate(.95) brightness(.88)}.atmosphere{position:absolute;inset:0;background:linear-gradient(#061c3266,transparent 32%,transparent 67%,#05111c44);pointer-events:none}.scene[data-encounter="1"] .atmosphere{background:linear-gradient(#311a555c,transparent 50%,#25103525)}.scene[data-encounter="2"] .atmosphere{background:linear-gradient(#53472740,transparent 55%,#061b1540)}.actor{position:absolute;aspect-ratio:1;z-index:3;pointer-events:none;overflow:visible}.actor-hero{width:34%;bottom:15%;left:6%;filter:drop-shadow(0 5px 0 #04252055)}.actor-enemy{width:31%;bottom:17%;left:50%;filter:drop-shadow(0 5px 0 #04252055)}.sprite-paint{width:100%;height:100%;background-image:url('assets/characters.png');background-size:200% 100%;background-repeat:no-repeat;image-rendering:pixelated}.hero-paint{background-position:left center;transform-origin:50% 78%;animation:hero-idle 1.6s ease-in-out infinite}.enemy-paint{background-position:right center;transform-origin:50% 78%;animation:enemy-idle 1.2s ease-in-out infinite}.battle-playing .sprite-paint{animation:none}.enemy-defeated .enemy-paint{opacity:0;animation:none}.hero-hurt .hero-paint{transform:translateX(-12%) rotate(-24deg);opacity:.7;animation:none;filter:sepia(.3)}.gate-shutter{position:absolute;left:79.15%;top:43.7%;width:10.05%;height:29.2%;display:flex;overflow:hidden;z-index:1;clip-path:polygon(0 100%,0 26%,4% 26%,4% 18%,10% 18%,10% 12%,20% 12%,20% 7%,31% 7%,31% 3%,69% 3%,69% 7%,80% 7%,80% 12%,90% 12%,90% 18%,96% 18%,96% 26%,100% 26%,100% 100%)}.gate-leaf{width:50%;height:100%;background-image:url('assets/gate-door.svg');background-size:200% 100%;background-repeat:no-repeat}.gate-leaf-left{background-position:left center}.gate-leaf-right{background-position:right center}.gate-open .gate-leaf-left{transform:translateX(-103%)}.gate-open .gate-leaf-right{transform:translateX(103%)}.crystal-light{position:absolute;left:65.5%;top:45.5%;width:4.4%;height:11.3%;background:#caffad;clip-path:polygon(50% 0,88% 48%,70% 89%,50% 100%,24% 87%,10% 48%);opacity:0;z-index:2}.crystal-charged .crystal-light{opacity:.7;filter:brightness(1.6)}.energy-orb{position:absolute;width:7%;aspect-ratio:1;left:30%;top:55%;background:#eaff99;border:3px solid #bcfc79;box-shadow:0 0 0 5px #8dffe344,0 0 28px #d4ff9d;border-radius:30%;opacity:0;z-index:4}.battle-pulse{position:absolute;left:var(--impact-x,62%);top:54%;width:18%;aspect-ratio:1;background:#fff9c1;clip-path:polygon(50% 0,61% 31%,89% 12%,70% 43%,100% 50%,69% 61%,89% 89%,60% 70%,50% 100%,39% 69%,10% 90%,30% 59%,0 50%,31% 39%,10% 11%,41% 31%);opacity:0;z-index:5}.particles{position:absolute;inset:0;pointer-events:none;z-index:5}.particles i{position:absolute;left:64%;top:57%;width:6px;height:6px;background:var(--gold);opacity:0}.particles i:nth-child(2n){background:#b9ff9b}.particles i:nth-child(3n){background:#9bdcff}.fireflies{position:absolute;inset:0;pointer-events:none;z-index:1}.fireflies i{position:absolute;width:3px;height:3px;background:#e4ffb2;box-shadow:0 0 9px #caffaa;left:calc(10% + var(--i)*12%);top:calc(35% + var(--i)*4%);animation:firefly 3.6s ease-in-out infinite;animation-delay:calc(var(--i)*-.7s)}
.fighter-hud{position:absolute;top:17px;z-index:6;background:#071721db;padding:8px 10px;border:1px solid #8ac8b54d;border-radius:5px;min-width:100px}.fighter-hud>span{font:700 10px/1.3 Consolas,Tahoma,monospace;letter-spacing:.06em;color:#d9f4dd}.hero-hud{left:14px}.enemy-hud{right:14px;border-color:#d394cb55}.enemy-hud>span{color:#f4c2e2}.energy-meter{display:flex;gap:3px;margin-top:5px}.energy-meter i{width:23px;height:5px;background:var(--lime);box-shadow:0 0 5px #c6fa7055}.hero-hurt .energy-meter i:last-child{background:#6f404b;box-shadow:none}.enemy-meter{height:5px;background:#542b51;margin-top:5px;min-width:76px}.enemy-meter i{display:block;height:100%;background:#ef9edf;transition:width .6s}.scene-bottom{position:absolute;bottom:0;left:0;right:0;padding:12px 15px;background:linear-gradient(transparent,#05141cef);z-index:6;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#d9f8d2;font:700 10px/1.5 Consolas,Tahoma,monospace;letter-spacing:.03em}.scene-bottom>span:first-child{display:flex;gap:7px;align-items:center}.scene-crystals{display:flex;gap:8px;padding:3px}.scene-crystals i{width:9px;height:9px;background:#42615d;transform:rotate(45deg);border:1px solid #66857d}.scene-crystals i.lit{background:var(--gold);border-color:#fff0b6;box-shadow:0 0 13px #ffe19280}.battle-banner{position:absolute;top:30%;left:50%;transform:translateX(-50%) rotate(-3deg);z-index:7;font:900 clamp(15px,2.2vw,26px)/1.15 Consolas,Tahoma,monospace;color:#fff4b6;text-shadow:2px 3px 0 #172d1f,-1px -1px 0 #172d1f;white-space:nowrap;text-align:center;pointer-events:none}.battle-banner small{display:block;font-size:14px;color:var(--lime);margin-top:7px;letter-spacing:.05em}.battle-banner-lost{color:#ffd1dd;text-shadow:2px 3px 0 #4d1a33}.battle-playing .battle-banner{animation:reward-pop .6s cubic-bezier(.2,1.6,.4,1) both}
.play-panel{padding:30px;min-width:0;background:linear-gradient(140deg,#172338,#111a2b)}.eyebrow{font-size:10px;letter-spacing:.13em;color:var(--lime);font-weight:800;text-transform:uppercase}.welcome-panel{display:flex;flex-direction:column;justify-content:center;min-height:490px;padding:38px}.welcome-heading{font-size:clamp(34px,3.8vw,49px);letter-spacing:-.055em;margin-top:16px;line-height:1.08}.welcome-heading em{color:var(--lime)}.welcome-copy{font-size:14px;line-height:1.75;color:#b3c0d3;margin-top:17px;max-width:34em}.welcome-chips{display:flex;gap:17px;margin:25px 0 27px;color:#c1cfdd;font-size:12px}.welcome-chips>span{display:flex;gap:7px;align-items:center}.welcome-chips svg{color:var(--purple)}.button{min-height:52px;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:1px solid transparent;border-radius:9px;padding:12px 16px;font-size:15px;font-weight:800;position:relative;transition:transform .15s,filter .15s;box-shadow:0 4px 0 #415528}.button:hover:not(:disabled){filter:brightness(1.09);transform:translateY(-2px)}.button:active:not(:disabled){transform:translateY(3px);box-shadow:none}.button-gold,.button-success{background:var(--lime);color:#172419;border-color:#e0ffac}.button-primary{background:var(--blue);color:#152333;border-color:#c3e6ff;box-shadow:0 4px 0 #37536e}.button:disabled{background:#2b3a48;border-color:#3d4b59;color:#8e9baa;box-shadow:none}.small-note{display:flex;align-items:center;justify-content:center;gap:7px;color:#9eafc0;font-size:11px;margin-top:16px}.owned-badge{font-size:12px;color:var(--gold);display:flex;justify-content:center;align-items:center;gap:7px;margin-top:20px}.encounter-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.live-tag{font-size:9px;color:var(--muted);display:flex;gap:4px;align-items:center}.mission-line{color:#a6b7cb;font-size:12px;line-height:1.6;margin-top:8px}.micro-lesson{display:grid;grid-template-columns:37px 1fr;gap:10px;background:#21332e;border:1px solid #3c5140;border-radius:10px;padding:11px;margin:18px 0 17px}.mentor-avatar{background:#182b25;border:1px solid #527549;width:37px;height:37px;border-radius:8px;overflow:hidden}.mentor-avatar>div{width:77px;height:77px;background:url('assets/characters.png') left center/200% 100%;transform:translate(-40px,-15px)}.micro-label{font-size:10px;font-weight:800;color:var(--lime)}.micro-label>span{color:#a4b99f;font-weight:500}.micro-lesson p{font-size:12px;line-height:1.6;margin-top:4px;color:#dfebdc}.example-details{margin-top:6px}.example-details summary{font-size:11px;color:#b9d99a;cursor:pointer;min-height:28px;padding:3px 0;text-decoration:underline;text-underline-offset:3px}.example-details .code-card{margin-top:7px}.example-details p{font-size:11px}.question-block h2{font-size:14px;font-weight:600;line-height:1.45;margin:18px 0 9px}.code-card{border:1px solid #344355;background:#090f1c;border-radius:8px;overflow:hidden;direction:ltr;text-align:left}.code-header{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;background:#0d1522;border-bottom:1px solid #222f40;font:9px Consolas,monospace;letter-spacing:.14em;color:#91a8c0}.code-dots{display:flex;gap:4px}.code-dots i{width:4px;height:4px;border-radius:50%;background:#55647a}.code-dots i:first-child{background:#ff93a5}.code-dots i:nth-child(2){background:#e9ca80}.code-dots i:last-child{background:#a9d888}.code-card pre{padding:11px 13px;margin:0;overflow:auto;font:14px/1.75 Consolas,"Courier New",monospace;color:#e2eaff}.code-line{display:block;min-width:max-content}.line-number{display:inline-block;width:18px;margin-right:12px;color:#516781;font-size:11px;user-select:none}.code-number{color:var(--gold)}.code-function{color:var(--lime)}.code-operator{color:var(--purple)}.inline-code{font-family:Consolas,monospace;direction:ltr;unicode-bidi:isolate;color:#d8f5ff}.output{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #304438;background:#14271e;padding:8px 12px;font-size:11px;color:#aecaaf}.output code{color:var(--lime);font-size:13px}.answer-instruction{display:flex;align-items:center;gap:5px;color:#b3c1d2;font-size:10px;margin:15px 0 9px}.answer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.answer{min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1px solid #4a547b;background:#26304e;border-radius:8px;color:#f5f4ff;box-shadow:0 4px 0 #111628;font:800 23px Consolas,monospace;transition:background .15s,transform .15s}.answer svg{color:#8f9bc3;opacity:.65}.answer:hover:not(:disabled){background:#394d6d;border-color:var(--blue);transform:translateY(-3px)}.answer:active:not(:disabled){transform:translateY(3px);box-shadow:none}.answer:disabled{opacity:.45}.answer.is-correct{background:#294830;border:2px solid var(--lime);color:var(--lime);opacity:1;box-shadow:0 3px 0 #111b14}.answer.is-wrong{background:#4c2940;border:2px solid var(--pink);color:#ffbfd3;opacity:1}.answer.is-correct svg,.answer.is-wrong svg{color:inherit;opacity:1}.feedback{margin:17px 0 15px;border-inline-start:3px solid;padding:10px 12px;background:#192d23;border-radius:3px 8px 8px 3px}.feedback.is-correct{border-color:var(--lime)}.feedback.is-wrong{background:#342333;border-color:var(--pink)}.feedback-top{display:flex;justify-content:space-between;align-items:center;gap:9px}.feedback h3{display:flex;gap:6px;align-items:center;font-size:14px;color:var(--lime)}.feedback.is-wrong h3{color:var(--pink)}.feedback p{font-size:12px;color:#cedbd4;line-height:1.65;margin-top:5px}.xp-reward{font:800 15px Consolas,monospace;color:var(--gold);white-space:nowrap}.bonus-label{font-size:8px;letter-spacing:.06em;color:#b5d799;font-weight:800;display:block;margin-top:6px}.challenge-help{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px}.challenge-help>span{font-size:9px;color:#8f9db1;max-width:52%;text-align:end}.text-button{display:inline-flex;align-items:center;gap:5px;min-height:44px;border:0;background:none;color:#b8c8e1;font-size:11px;padding:6px 0;text-decoration:underline;text-underline-offset:3px}.text-button:disabled{opacity:.4}.hint-panel{border:1px solid #60573c;background:#302d25;border-radius:8px;padding:11px;margin-top:14px;font-size:12px;color:#ebdbba}.hint-panel p{margin-top:5px}.completion-panel{text-align:center;display:flex;flex-direction:column;justify-content:center}.completion-panel>.eyebrow{margin:17px 0 10px}.completion-panel h1{font:900 38px/1.1 Consolas,Tahoma,monospace;color:var(--lime)}.completion-panel .text-button{justify-content:center;margin-top:8px}.medal{width:82px;height:82px;border:2px solid #bfa768;background:linear-gradient(135deg,#5b4e2e,#282c2a);box-shadow:0 6px 0 #080f19,0 0 40px #f4d0801f;border-radius:20px;display:grid;place-items:center;color:var(--gold);margin:0 auto;transform:rotate(-7deg)}.medal svg{transform:rotate(7deg)}.score-grid{display:grid;grid-template-columns:1fr 1fr;margin:23px 0;border:1px solid #3b4560;border-radius:10px;padding:13px 0;background:#172238}.score-grid>div{display:flex;flex-direction:column;gap:4px}.score-grid>div+div{border-inline-start:1px solid #3b4560}.score-grid strong{font:800 27px Consolas,monospace;color:var(--gold)}.score-grid small{font-size:17px;color:#8f9eb4}.score-grid span{font-size:11px;color:#afc0d6}.earned-badge{display:flex;align-items:center;gap:12px;text-align:start;margin-bottom:23px;padding:11px 12px;background:#253226;border:1px solid #47513a;border-radius:10px;color:var(--lime)}.earned-badge span{display:flex;flex-direction:column;gap:2px;flex:1}.earned-badge small{font-size:9px;color:#b2bba7}.earned-badge strong{font-size:13px}.app-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#8d9bb0;font-size:10px;padding:13px 1px 0}.app-footer>span{display:flex;align-items:center;gap:5px}.motion-control{min-height:44px;display:flex;align-items:center;gap:6px;cursor:pointer}.motion-control input{accent-color:var(--lime);width:14px;height:14px}.storage-notice{padding:12px;background:#352d25;border:1px solid #675c41;font-size:12px;margin-top:15px;border-radius:8px}.loading-shell,.error-card{text-align:center;max-width:450px;padding:25vh 25px 30px;margin:0 auto;color:var(--muted)}.loading-crystal{font-size:45px;color:var(--lime)}.error-card .button{margin-top:20px}.noscript-message{padding:20px;text-align:center}
@keyframes hero-idle{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3%) rotate(1deg)}}@keyframes enemy-idle{0%,100%{transform:translateY(0) scaleX(1)}50%{transform:translateY(-2%) scaleX(1.04)}}@keyframes firefly{0%,100%{opacity:.15;transform:translate(0,0)}50%{opacity:.85;transform:translate(9px,-18px)}}@keyframes reward-pop{from{opacity:0;transform:translateX(-50%) scale(.4) rotate(-8deg)}to{opacity:1;transform:translateX(-50%) scale(1) rotate(-3deg)}}
[dir="rtl"] .directional{transform:scaleX(-1)}[dir="rtl"] .brand{font-family:Tahoma,Arial,sans-serif;letter-spacing:0;font-size:19px}[dir="rtl"] h1{letter-spacing:0}[dir="rtl"] .eyebrow,[dir="rtl"] .run-title{letter-spacing:0}[dir="rtl"] .welcome-heading{font-size:clamp(32px,3.7vw,45px);line-height:1.35}[dir="rtl"] .battle-banner{font-family:Tahoma,sans-serif;font-weight:900;letter-spacing:0}[dir="rtl"] .bonus-label{font-size:10px}[dir="rtl"] .micro-lesson p{line-height:1.8}
@media(max-width:760px){.app-shell{max-width:520px;padding:0 13px 14px}.masthead{height:71px}.brand{font-size:17px}.brand img{width:24px}.header-controls{gap:7px}.run-bar{margin:2px 0 10px}.route{gap:5px;margin-bottom:12px}.route-stop{padding:7px 9px;min-height:42px;font-size:11px;gap:6px}.route-number{font-size:10px}.game-frame{display:flex;flex-direction:column;border-radius:13px}.arena-column{border:0}.world-heading{padding:10px 12px;font-size:11px;gap:8px}.world-tag{font-size:9px}.scene{aspect-ratio:16/10;min-height:220px}.arena-caption{display:none}.play-panel{padding:21px 19px;border-top:1px solid #384c52}.welcome-panel{min-height:0;padding:24px}.welcome-heading{font-size:38px;margin-top:12px}.welcome-copy{margin-top:12px;font-size:13px}.welcome-chips{margin:20px 0;font-size:11px}.fighter-hud{top:12px;min-width:85px;padding:6px 8px}.fighter-hud>span{font-size:9px}.hero-hud{left:12px}.enemy-hud{right:12px}.energy-meter i{width:19px;height:4px}.enemy-meter{min-width:63px;height:4px}.scene-bottom{font-size:9px;padding:10px 12px}.battle-banner{font-size:20px;top:29%}.battle-banner small{font-size:13px}.encounter-heading{margin-bottom:8px}.play-panel h1{font-size:25px}.mission-line{font-size:11px;margin-top:6px}.micro-lesson{margin:13px 0;padding:9px;gap:8px}.micro-lesson p{font-size:11px}.question-block h2{font-size:13px;margin:13px 0 8px}.answer{min-height:56px;font-size:23px}.completion-panel{padding:27px 22px}.completion-panel h1{font-size:35px}.combo-pill{font-size:10px}.game-frame[data-screen="challenge"] .arena-column{position:relative}.app-footer{font-size:9px}.live-tag{font-size:8px}.code-card pre{font-size:13px;padding:9px 11px}}
@media(max-width:350px){.app-shell{padding-inline:9px}.brand{font-size:15px;gap:5px}.brand img{width:20px}.sound-toggle{width:38px;height:40px}.language-switch button{min-width:34px;padding:5px 7px}.header-controls{gap:5px}.play-panel{padding:18px 15px}.route-stop{padding:7px;font-size:10px;gap:5px}.route-number{display:none}.scene{min-height:200px}.battle-banner{font-size:18px}.live-tag{display:none}.welcome-heading{font-size:32px}.answer-grid{gap:7px}.micro-lesson{grid-template-columns:1fr}.mentor-avatar{display:none}.fighter-hud{min-width:78px}.challenge-help>span{font-size:8px}[dir="rtl"] .brand{font-size:16px}.world-heading{font-size:10px}}
[data-reduced-motion="true"] *,[data-reduced-motion="true"] *::before,[data-reduced-motion="true"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){html:not([data-reduced-motion="false"]) *,html:not([data-reduced-motion="false"]) *::before,html:not([data-reduced-motion="false"]) *::after{animation:none!important;transition:none!important}}

@media(max-width:760px){.game-frame[data-screen="challenge"] .world-heading{display:none}.challenge-panel .mission-line{display:none}.challenge-panel .micro-lesson{margin-top:12px}}

.micro-lesson p{font-size:13px}.micro-label{font-size:11px}.feedback p{font-size:13px}.answer-instruction{font-size:11px}@media(max-width:760px){.question-block h2{font-size:14px}.code-card pre{font-size:14px}}

.motion-notice{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 12px;background:#252940;color:#c1c9e3;font-size:10px}.motion-notice button{display:flex;gap:5px;align-items:center;min-height:36px;border:0;background:none;color:var(--lime);font-size:11px;font-weight:700;padding:4px 0}

/* Living forest and battle effects. All effects inherit the motion preference. */
.sun-rays{position:absolute;inset:-15% -10%;background:repeating-linear-gradient(115deg,transparent 0 15%,#e6ffb913 16% 19%,transparent 22% 34%);transform-origin:70% 0;animation:sun-sway 9s ease-in-out infinite;pointer-events:none;z-index:1}
.forest-mist{position:absolute;left:-20%;bottom:23%;width:140%;height:18%;background:radial-gradient(ellipse at 30% 70%,#c1f5f824,transparent 58%),radial-gradient(ellipse at 76% 55%,#e8ffda22,transparent 52%);animation:mist-drift 12s ease-in-out infinite;pointer-events:none;z-index:2}
.falling-leaves,.portal-motes,.hero-echoes,.dizzy-stars,.projectile-trail,.shock-rings,.landing-dust,.enemy-smoke,.loot-crystals,.victory-confetti{position:absolute;inset:0;pointer-events:none}
.falling-leaves{z-index:2;overflow:hidden}.falling-leaves i{position:absolute;left:calc(5% + var(--i)*17%);top:-12%;width:7px;height:4px;background:#bce984;border-radius:0 70% 0 70%;opacity:0;animation:leaf-fall 8s linear infinite;animation-delay:calc(var(--i)*-1.3s)}.falling-leaves i:nth-child(2n){background:#e9cb75;width:5px;height:7px;animation-duration:10s}
.actor-shadow{position:absolute;left:18%;bottom:13%;width:69%;height:9%;border-radius:50%;background:#031b2070;transform-origin:center;animation:shadow-breathe 1.8s ease-in-out infinite}.actor-enemy .actor-shadow{left:30%;width:49%;bottom:15%}.actor-enemy{animation:enemy-prowl 4.5s ease-in-out infinite}.battle-playing .actor-enemy,.battle-playing .actor-shadow,.enemy-defeated .actor-enemy{animation:none}.enemy-defeated .actor-enemy .actor-shadow{opacity:0}
.hero-paint{animation:python-ready 2.6s ease-in-out infinite}.enemy-paint{animation:bug-ready 1.5s ease-in-out infinite}.battle-playing .sprite-paint{animation:none}.hero-hurt .hero-paint,.enemy-defeated .enemy-paint{animation:none}
.charge-aura{position:absolute;width:37%;aspect-ratio:1;left:57%;top:33%;border:3px solid #daffaf;border-radius:50%;opacity:0;box-shadow:0 0 19px #c3ff7980,inset 0 0 16px #c3ff7980;z-index:3}.charge-aura::before,.charge-aura::after{content:"";position:absolute;inset:-35%;border:2px dashed #b8ffe9;border-radius:50%;transform:rotate(28deg)}.charge-aura::after{inset:20%;border:0;background:#f3ffd0;box-shadow:0 0 10px #fffbd5;clip-path:polygon(50% 0,65% 35%,100% 50%,65% 65%,50% 100%,35% 65%,0 50%,35% 35%)}
.hero-echoes i{position:absolute;inset:0;background:url('assets/characters.png') left center/200% 100%;image-rendering:pixelated;filter:brightness(1.8) sepia(.4) hue-rotate(80deg);opacity:0}.dizzy-stars{left:52%;top:25%;width:40%;height:23%;opacity:0}.hero-hurt .dizzy-stars{opacity:1}.dizzy-stars i{position:absolute;width:10px;height:10px;background:#ffe7a0;clip-path:polygon(50% 0,62% 34%,100% 38%,71% 62%,81% 100%,50% 78%,18% 100%,29% 62%,0 38%,38% 34%);animation:dizzy-orbit 1.5s linear infinite;animation-delay:calc(var(--i)*-.5s)}
.projectile-trail,.shock-rings,.loot-crystals{z-index:5}.projectile-trail i{position:absolute;left:30%;top:55%;width:7%;height:3%;background:#dfffaa;box-shadow:0 0 10px #dfffaa88;border-radius:50%;opacity:0}.shock-rings i{position:absolute;left:62%;top:51%;width:17%;aspect-ratio:1;border:3px solid #e5ffd0;border-radius:50%;opacity:0;box-shadow:0 0 12px #d6ffc750}.shock-rings i:nth-child(2){border-width:1px}
.landing-dust{z-index:2}.landing-dust i{position:absolute;left:30%;top:73%;width:6%;height:3%;background:#b6d5b685;border-radius:50%;opacity:0}.enemy-smoke{z-index:4}.enemy-smoke i{position:absolute;left:62%;top:59%;width:9%;aspect-ratio:1;background:#cf99e9;border:2px solid #f1c6ff;border-radius:40%;opacity:0}.loot-crystals i{position:absolute;width:11px;height:15px;background:linear-gradient(135deg,#fff6bd 45%,#efb84d 46%);clip-path:polygon(50% 0,100% 45%,70% 90%,50% 100%,20% 83%,0 45%);opacity:0}
.portal-halo{position:absolute;left:76%;top:39%;width:17%;height:38%;border:3px solid #ffdf8477;box-shadow:0 0 22px #ffe08d66,inset 0 0 14px #ffc05c55;border-radius:50%;opacity:0;z-index:1}.gate-open .portal-halo{opacity:.75;animation:portal-breathe 2.6s ease-in-out infinite}.portal-motes{z-index:2;opacity:0}.gate-open .portal-motes{opacity:1}.portal-motes i{position:absolute;left:calc(78% + var(--i)*2%);top:73%;width:3px;height:6px;background:#fff0ab;box-shadow:0 0 7px #ffe8a0;animation:portal-rise 2.3s linear infinite;animation-delay:calc(var(--i)*-.38s)}
.crystal-charged .crystal-light{animation:crystal-hum 2.4s ease-in-out infinite}.battle-playing .crystal-light{animation:none}.gate-open:not(.battle-playing) .hero-paint{animation:victory-hop .7s ease-in-out 3,python-ready 2.6s 2.1s ease-in-out infinite}.battle-playing .battle-banner{animation-delay:.55s}.battle-playing .battle-banner small{animation:loot-label .5s .9s both}
.completion-panel{position:relative;overflow:hidden;isolation:isolate}.completion-panel>*:not(.victory-confetti){position:relative;z-index:2}.victory-confetti{overflow:hidden;z-index:1}.scene>.victory-confetti{z-index:5}.victory-confetti i{position:absolute;left:calc(var(--i)*5.8%);top:-12%;width:6px;height:11px;background:#ddff92;opacity:0;animation:confetti-fall 2.8s cubic-bezier(.2,.5,.5,1) 2;animation-delay:calc(var(--i)*.07s)}.victory-confetti i:nth-child(3n){background:#eab5ff}.victory-confetti i:nth-child(3n+1){background:#ffdf8b}.victory-confetti i:nth-child(2n){width:9px;height:6px;animation-duration:2.3s}
.completion-panel .medal{animation:medal-reveal .7s cubic-bezier(.2,1.6,.4,1) both}.completion-panel .score-grid{animation:panel-reveal .45s .25s both}.completion-panel .earned-badge{animation:panel-reveal .45s .45s both}.app-shell[data-reward="true"] .xp-pill{animation:score-pop .55s .8s both}.combo-pill{animation:score-pop .4s both}.feedback{animation:panel-reveal .25s ease-out both}.micro-lesson{animation:panel-reveal .3s ease-out both}.route-stop.active .route-icon{animation:checkpoint-pulse 2.5s ease-in-out infinite}
@keyframes sun-sway{0%,100%{transform:rotate(-2deg);opacity:.5}50%{transform:rotate(3deg);opacity:.9}}
@keyframes mist-drift{0%,100%{transform:translateX(-4%);opacity:.5}50%{transform:translateX(5%);opacity:.85}}
@keyframes leaf-fall{0%{transform:translate(0,-10px) rotate(0deg);opacity:0}10%{opacity:.7}50%{transform:translate(-25px,140px) rotate(170deg);opacity:.65}100%{transform:translate(20px,450px) rotate(340deg);opacity:0}}
@keyframes python-ready{0%,100%{transform:translateY(0) scale(1)}25%{transform:translateY(-2%) rotate(2deg) scale(1.02,.99)}65%{transform:translateY(1%) rotate(-1deg) scale(.98,1.02)}}
@keyframes bug-ready{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3%) rotate(-3deg) scale(1.04,.97)}}
@keyframes enemy-prowl{0%,100%{transform:translateX(0)}45%,55%{transform:translateX(-8%)}}
@keyframes shadow-breathe{0%,100%{transform:scaleX(1);opacity:.7}50%{transform:scaleX(.88);opacity:.45}}
@keyframes dizzy-orbit{0%{transform:translate(0,6px) scale(.75);opacity:.6}25%{transform:translate(18px,0) scale(1);opacity:1}50%{transform:translate(35px,7px) scale(.75);opacity:.6}75%{transform:translate(17px,15px) scale(1);opacity:1}100%{transform:translate(0,6px) scale(.75);opacity:.6}}
@keyframes portal-breathe{0%,100%{transform:scale(.94);opacity:.45}50%{transform:scale(1.04);opacity:.8}}
@keyframes portal-rise{from{transform:translateY(0) scale(.6);opacity:0}25%{opacity:1}to{transform:translateY(-95px) scale(.2);opacity:0}}
@keyframes crystal-hum{0%,100%{opacity:.4;filter:brightness(1.2)}50%{opacity:.8;filter:brightness(1.7)}}
@keyframes victory-hop{0%,100%{transform:translateY(0) rotate(0deg)}20%{transform:scale(1.08,.94)}50%{transform:translateY(-13%) rotate(5deg) scale(.97,1.03)}80%{transform:scale(1.05,.96)}}
@keyframes confetti-fall{0%{transform:translate(0,0) rotate(0deg);opacity:0}8%{opacity:1}85%{opacity:.9}100%{transform:translate(35px,640px) rotate(560deg);opacity:0}}
@keyframes medal-reveal{from{opacity:0;transform:scale(.3) rotate(-35deg)}to{opacity:1;transform:scale(1) rotate(-7deg)}}
@keyframes panel-reveal{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes score-pop{0%,100%{transform:scale(1)}45%{transform:scale(1.18);color:#efffa8}}
@keyframes checkpoint-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@keyframes loot-label{from{opacity:0;transform:translateY(12px) scale(.7)}to{opacity:1;transform:translateY(0) scale(1)}}
/* Keep decorative particles hidden when motion is disabled, including mid-battle. */
[data-reduced-motion="true"] .falling-leaves,[data-reduced-motion="true"] .forest-mist,[data-reduced-motion="true"] .portal-motes,[data-reduced-motion="true"] .victory-confetti,[data-reduced-motion="true"] .dizzy-stars{display:none}

.scene.scene-sleeping *,.scene.scene-sleeping *::before,.scene.scene-sleeping *::after{animation-play-state:paused!important}

/* Course map and the first print() adventure. */
/* The ravine uses its own bridge scene and repair states. */
/* Question formats share the same one-tap arcade controls. */
.question-kind{display:inline-block;font-size:10px;font-weight:800;color:var(--blue);border:1px solid #42617a;background:#142735;border-radius:5px;padding:3px 7px;margin-top:14px}
.question-kind+h2{margin-top:8px}
.code-blank{color:var(--gold);background:#69562966;border-bottom:2px solid var(--gold);padding:0 4px}
.target-output{border:1px solid #64784c;border-inline-start:3px solid var(--lime);background:#182c25;border-radius:7px;padding:10px 13px;margin-top:10px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.target-output>span{font-size:11px;color:#bfdaad}
.target-output pre{margin:0;color:#e7ffd5;font:700 17px/1.5 Consolas,monospace;text-align:start;white-space:pre-wrap;overflow-wrap:anywhere}
.answer-grid-code{grid-template-columns:minmax(0,1fr);gap:8px}
.answer-grid-code .answer{flex-direction:row;justify-content:space-between;gap:12px;padding:11px 14px;min-height:52px;font-size:14px}
.answer-grid-code .answer bdi{white-space:pre-wrap;text-align:start;line-height:1.5;overflow-wrap:anywhere;font-family:Consolas,monospace}
.answer-grid-code .answer svg{flex-shrink:0;width:14px}
@media(max-width:350px){.answer-grid-code .answer{font-size:12px;padding:10px 11px}.target-output{gap:10px}.target-output>span{font-size:10px}}

/* Forest Guardian: the final five-encounter battle. */
.route{grid-template-columns:repeat(var(--route-steps,3),minmax(0,1fr))}
.guardian-scene{background:#191c34}
.guardian-scene .backdrop{filter:none}
.guardian-scene .actor-hero{width:32%;bottom:23%;left:3%}
.guardian-scene .actor-shadow{bottom:16%}
.guardian-actor{position:absolute;left:55%;bottom:26%;width:30%;aspect-ratio:240/260;z-index:3}
.guardian-paint{position:relative;display:block;width:100%;height:100%;image-rendering:pixelated;transform-origin:50% 93%;filter:hue-rotate(155deg) saturate(1.4);animation:guardian-breathe 2.8s ease-in-out infinite}
.guardian-shadow{position:absolute;bottom:0;left:5%;width:90%;height:9%;background:#091d2b88;border-radius:50%}
.guardian-shield{position:absolute;inset:-8% -12% -4%;border:3px solid #f19aca88;clip-path:polygon(25% 0,75% 0,100% 25%,100% 70%,75% 100%,25% 100%,0 70%,0 25%);background:linear-gradient(130deg,#b373dc26,transparent 55%,#ffafdf20);box-shadow:inset 0 0 22px #c675bc55;animation:guardian-shield 3s ease-in-out infinite}
.guardian-runes{position:absolute;left:-22%;right:-22%;top:-15%;height:17%}
.guardian-runes i{position:absolute;left:calc(var(--i)*22%);top:calc(10% + var(--i)*2%);width:9%;aspect-ratio:1;border:2px solid #ffb2dd;transform:rotate(45deg);box-shadow:0 0 13px #e691cd66;background:#643e77;animation:rune-hover 2.7s ease-in-out infinite;animation-delay:calc(var(--i)*-.4s)}
.guardian-runes i.broken{opacity:0;animation:none}
.guardian-hud{right:12px;min-width:135px;border-color:#be81cb80}
.guardian-hud>span{color:#f8c0e4;font-size:9px}
.guardian-health{display:flex;direction:ltr;gap:4px;margin-top:5px}
.guardian-health i{height:7px;flex:1;background:#f7a6d9;box-shadow:0 0 6px #e881ba55}
.guardian-health i.broken{background:#283344;box-shadow:none;transform:scaleY(.55)}
.guardian-hud small{display:block;font-size:9px;color:#cfb8d4;margin-top:3px}
.guardian-phase{position:absolute;right:14px;top:88px;z-index:6;font:700 9px/1.4 Consolas,Tahoma,monospace;letter-spacing:.05em;color:#ffc297;padding:3px 6px;background:#351c3599;border:1px solid #e0987955}
.guardian-enraged .guardian-shield{border-color:#ffb58d;background:linear-gradient(140deg,#cb797e38,transparent);animation-duration:1.7s}
.guardian-enraged .guardian-paint{animation-duration:1.5s}
.guardian-enraged .guardian-health i:not(.broken){background:#ffc28f}
.shrine-glow{position:absolute;left:58%;top:37%;width:22%;height:40%;background:radial-gradient(ellipse,#c997fa50,transparent 65%);animation:guardian-shield 4s ease-in-out infinite}
.guardian-dawn{position:absolute;inset:0;background:linear-gradient(145deg,#c0eaae77,transparent 55%,#a6ee7340);opacity:0}
.guardian-orb{position:absolute;width:6%;aspect-ratio:1;top:53%;opacity:0;z-index:5;border:2px solid #fff8d6;box-shadow:0 0 0 4px #f4eaff33,0 0 20px #e9cbff;clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}
.guardian-impact{position:absolute;top:48%;width:15%;aspect-ratio:1;border:3px solid #e8ffc2;border-radius:50%;opacity:0;z-index:5;translate:-35% 0}
.guardian-shards,.guardian-thorns,.guardian-blossoms{position:absolute;inset:0;pointer-events:none;z-index:4}
.guardian-shards i{position:absolute;left:70%;top:53%;width:8px;height:11px;background:#e1acec;opacity:0;clip-path:polygon(20% 0,100% 20%,70% 100%,0 65%)}
.guardian-shards i:nth-child(3n){background:#ebffb5}
.guardian-thorns i{position:absolute;left:calc(23% + var(--i)*10%);bottom:26%;width:7%;height:17%;background:linear-gradient(#f3b7d9,#735386);transform-origin:bottom;opacity:0;clip-path:polygon(45% 0,65% 45%,85% 25%,100% 100%,0 100%,18% 45%,34% 65%)}
.guardian-blossoms i{position:absolute;left:calc(7% + var(--i)*7%);top:calc(68% - var(--i)*2%);width:6px;height:9px;background:#dafba4;opacity:0;clip-path:polygon(50% 0,100% 35%,70% 100%,0 65%)}
.guardian-restored .guardian-shield,.guardian-restored .guardian-runes{opacity:0;animation:none}
.guardian-restored .guardian-paint{filter:none;animation:guardian-breathe 4s ease-in-out infinite}
.guardian-restored .guardian-dawn{opacity:.7}
.guardian-restored .shrine-glow{background:radial-gradient(ellipse,#dcff9755,transparent 65%)}
.guardian-restored .guardian-blossoms i{animation:guardian-petal 5s ease-out infinite;animation-delay:calc(var(--i)*-.5s)}
.guardian-restored .hero-paint{animation:victory-hop .8s ease-in-out 3,python-ready 2.6s 2.4s ease-in-out infinite}
.guardian-scene.battle-playing .guardian-paint,.guardian-scene.battle-playing .guardian-shield,.guardian-scene.battle-playing .guardian-runes i{animation:none}
.guardian-scene .battle-banner{white-space:normal;width:94%;top:29%;font-size:clamp(15px,2vw,25px)}
.course-results{background:#0e2025;border:1px solid #52765c;border-radius:10px;padding:16px 10px;margin-bottom:20px}
.course-results h2{color:#d5efb9;font-size:12px;margin-bottom:12px}
.course-results>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.course-results p{display:flex;flex-direction:column;gap:4px}
.course-results strong{font:bold 22px/1.3 Consolas,Tahoma,monospace;color:var(--gold)}
.course-results span{font-size:10px;color:#b0c7bb}
.champion-panel .medal{color:var(--gold);box-shadow:0 0 45px #e1cf4530}
.champion-panel h1{font-size:clamp(28px,3.5vw,40px)}
@keyframes guardian-breathe{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3%) rotate(1deg)}}
@keyframes guardian-shield{0%,100%{opacity:.4}50%{opacity:.8}}
@keyframes rune-hover{0%,100%{transform:translateY(0) rotate(45deg)}50%{transform:translateY(-8px) rotate(60deg)}}
@keyframes guardian-petal{0%{opacity:0;transform:translate(0,20px) rotate(0deg)}20%{opacity:.8}100%{opacity:0;transform:translate(20px,-120px) rotate(180deg)}}
@media(max-width:760px){.boss-route{gap:4px}.boss-route .route-stop{flex-direction:column;justify-content:center;padding:6px 2px;gap:4px;font-size:10px;min-width:0}.boss-route .route-number{display:none}.boss-route .route-icon svg{width:14px;height:14px}.guardian-hud{min-width:118px;padding:6px 7px}.guardian-hud>span{font-size:8px}.guardian-hud small{font-size:8px}.guardian-health{gap:3px}.guardian-health i{height:5px}.guardian-phase{top:76px;font-size:8px}.guardian-scene .battle-banner{font-size:18px;top:30%}.guardian-runes i{border-width:1px}}
@media(max-width:350px){.guardian-hud{min-width:112px;right:8px}.guardian-scene .hero-hud{left:8px;min-width:68px}.guardian-scene .energy-meter i{width:14px}.guardian-scene .battle-banner{font-size:16px;top:32%}.guardian-phase{top:69px;right:9px;font-size:7px}.guardian-scene .scene-crystals{gap:5px}.guardian-scene .scene-crystals i{width:7px;height:7px}.guardian-scene .scene-bottom{font-size:8px}.course-results{padding-inline:8px}.course-results span{font-size:9px}}
[data-reduced-motion="true"] .guardian-blossoms{display:none}

.bridge-scene{background:#143340}
.bridge-scene .backdrop{filter:none}
.bridge-scene .actor-hero{width:28%;bottom:21%;left:-3%}
.bridge-scene .actor-shadow{bottom:20%;opacity:.5}
.bridge-hud{right:12px;min-width:94px;border-color:#ccac6d70}
.bridge-hud>span{color:#ffe1a0}
.bridge-hud small{display:block;color:#d6e3d2;font-size:8px;margin-top:4px}
.bridge-progress{display:flex;gap:4px;margin-top:5px}
.bridge-progress i{height:5px;flex:1;background:#4d5146;border:1px solid #7a7a59}
.bridge-progress i.built{background:#dcf48f;border-color:#e9fbb1;box-shadow:0 0 7px #d5f08966}
.ravine-water{position:absolute;left:47%;top:51%;width:6%;height:49%;opacity:.25;background:repeating-linear-gradient(0deg,transparent 0 20px,#d7fff0 21px 25px,transparent 26px 55px);animation:river-flow 2.7s linear infinite;pointer-events:none}
.ravine-mist{position:absolute;left:21%;bottom:-9%;width:65%;height:41%;background:radial-gradient(ellipse,#aad3ce3d,transparent 64%);animation:mist-drift 10s ease-in-out infinite;pointer-events:none}
.bridge-structure{position:absolute;left:23%;top:71%;width:54%;height:10%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;z-index:2}
.bridge-section{position:relative}
.plank-slots{position:absolute;inset:0 0 50%;border:1px dashed #b7d2bf70;background:#173a4559;border-radius:2px}
.bridge-section.pending .plank-slots{border-color:#f1d599;background:#ddbb5612}
.bridge-section.failed .plank-slots{border-color:#e98a78;background:repeating-linear-gradient(135deg,#e36f5520 0 4px,transparent 4px 10px)}
.bridge-section.built .plank-slots{opacity:0}
.planks{position:relative;display:grid;grid-template-columns:repeat(var(--planks),minmax(0,1fr));height:50%;gap:2px}
.plank{position:relative;display:block;opacity:0;background:linear-gradient(#efd29c 0 15%,#a9804e 16% 50%,#bd955d 51% 73%,#84613e 74%);border:1px solid #624e36;box-shadow:0 4px 0 #483c2e;transform-origin:center}
.plank::before,.plank::after{content:"";position:absolute;top:25%;width:2px;height:2px;background:#584a36;left:15%}
.plank::after{left:auto;right:15%;top:auto;bottom:20%}
.bridge-section.built .plank{opacity:1}
.bridge-rope{position:absolute;left:-2px;right:-2px;top:62%;height:2px;background:#586557;opacity:.35}
.bridge-section.built .bridge-rope{background:#c9af76;opacity:1;box-shadow:0 2px 0 #463e2d}
.bridge-post{position:absolute;bottom:25%;width:1.6%;height:14%;background:linear-gradient(90deg,#614e37 0 30%,#af8e59 31% 65%,#775a3b 66%);border-top:3px solid #d4b27a;z-index:3}
.bridge-post-left{left:21.5%}.bridge-post-right{left:77%}
.damaged-plank{position:absolute;top:68.5%;width:7%;height:3%;background:linear-gradient(130deg,#a16c48 0 39%,#2c2926 40% 44%,#9a6846 45% 57%,#342622 58% 64%,#b4744a 65%);border:1px solid #513d2e;box-shadow:0 3px 0 #2c2624;z-index:3;opacity:0}
.damaged-plank-one{left:44%;margin-top:-2px}.damaged-plank-two{left:51%;margin-top:3px}
.bridge-scene[data-repaired="1"] .damaged-plank{opacity:1}
.loose-plank{position:absolute;top:70.5%;width:6%;height:3%;opacity:0;background:linear-gradient(135deg,#d0a165 0 45%,#4d352b 46% 53%,#ae7951 54%);border:1px solid #e5b57a;z-index:4}
.wood-chips i{position:absolute;top:72%;width:7px;height:4px;background:#e8c285;opacity:0;z-index:4;pointer-events:none}
.bridge-ring{position:absolute;top:68%;width:28px;height:28px;border:2px solid #e4f9ae;border-radius:50%;opacity:0;pointer-events:none;z-index:4}
.bridge-complete .bridge-structure{filter:drop-shadow(0 0 5px #e0d88c66)}
.bridge-scene .battle-banner{font-size:clamp(15px,2vw,23px);max-width:95%}
@keyframes river-flow{from{background-position:0 0}to{background-position:0 55px}}
@media(max-width:350px){.bridge-hud{min-width:80px;padding:5px 6px}.bridge-hud small{font-size:7px}.bridge-scene .battle-banner{font-size:16px}.planks{gap:1px}.plank{border-width:0}.bridge-structure{gap:2px}}

.answer-prose{font-family:inherit}
.mentor-avatar{position:relative}.mentor-avatar>div{position:absolute;left:0;top:0}
.scene[data-scene="crystal-glade"] .backdrop{filter:hue-rotate(22deg) saturate(.85) brightness(.8)}
.scene[data-scene="crystal-glade"] .atmosphere{background:linear-gradient(#442c7933,transparent 60%,#16383f55)}
.scene[data-scene="crystal-glade"] .forest-mist{background:radial-gradient(ellipse at 30% 70%,#91e7ff42,transparent 58%),radial-gradient(ellipse at 76% 55%,#caabff38,transparent 52%)}
.crystal-grove{position:absolute;inset:0;z-index:2;pointer-events:none;filter:drop-shadow(0 0 6px #75deff88)}
.crystal-grove i{position:absolute;bottom:24%;left:3%;width:5%;height:17%;background:linear-gradient(105deg,#3d6683 0 28%,#8dedff 29% 49%,#edfaff 50% 54%,#5683a5 55% 77%,#375276 78%);clip-path:polygon(50% 0,100% 32%,85% 87%,50% 100%,15% 87%,0 32%);opacity:.8;transform-origin:50% 100%;animation:crystal-shimmer 3s ease-in-out infinite;animation-delay:calc(var(--i)*-.6s)}
.crystal-grove i:nth-child(2){left:23%;height:11%;width:3.5%;bottom:28%}.crystal-grove i:nth-child(3){left:48%;height:13%;width:4%;bottom:27%}.crystal-grove i:nth-child(4){left:66%;height:18%;bottom:25%}.crystal-grove i:nth-child(5){left:93%;height:14%;width:4%}
@keyframes crystal-shimmer{0%,100%{opacity:.6;filter:brightness(.9)}50%{opacity:1;filter:brightness(1.25)}}
.next-mascot{position:relative}.next-mascot i{position:absolute;left:0;top:0}
.course-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:28px;align-items:start;margin:20px 0 8px}.map-intro{position:sticky;top:22px;padding:27px 8px 15px 0}.map-intro h1{font-size:clamp(32px,3.7vw,46px);line-height:1.14;margin:14px 0 17px;letter-spacing:-.05em}.map-intro h1 em{color:var(--lime)}.map-copy{color:#b2c3d6;font-size:14px;line-height:1.85;max-width:38em}.course-stats{display:flex;align-items:center;gap:23px;margin:24px 0 15px;color:#bacbdb;font-size:12px}.course-stats>span{display:flex;align-items:center;gap:7px}.course-stats svg{color:var(--gold)}.course-stats strong{font:800 23px Consolas,monospace;color:#f8e5ae}.course-progress{font-size:11px;color:#a8bfcb}.course-progress-track{height:6px;background:#233846;border-radius:10px;overflow:hidden;margin-top:9px}.course-progress-track i{display:block;height:100%;background:linear-gradient(90deg,#70d6ac,var(--lime));border-radius:10px;transition:width .4s}
.next-adventure{display:grid;grid-template-columns:67px 1fr;gap:14px;align-items:center;margin-top:25px;padding:20px;border:1px solid #476144;background:linear-gradient(130deg,#263a29,#162c29);border-radius:16px;box-shadow:0 9px 30px #050e1533}.next-adventure .eyebrow{font-size:9px;letter-spacing:.1em}.next-adventure h2{font-size:18px;line-height:1.35;margin-top:4px}.next-adventure p:not(.eyebrow){font-size:12px;color:#b8cbb2;margin-top:5px}.next-adventure>.button{grid-column:1/-1;min-height:49px;font-size:14px;margin-top:3px}.next-mascot{width:67px;height:67px;overflow:hidden;border:1px solid #4b6949;border-radius:14px;background:radial-gradient(#314e3e,#14281e)}.next-mascot i{display:block;width:124px;height:124px;background:url('assets/characters.png') left center/200% 100%;transform:translate(-52px,-19px);animation:map-mascot 2.8s ease-in-out infinite;image-rendering:pixelated}.badge-cabinet{margin-top:29px}.badge-cabinet h2{font-size:10px;letter-spacing:.12em;color:#9cacbf}.badge-cabinet>p{color:#849bac;font-size:12px;margin-top:11px}.badge-collection{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}.collected-badge{display:inline-flex;align-items:center;gap:8px;color:#efd59b;border:1px solid #746144;border-radius:10px;padding:10px 12px;background:#312e24;font-size:12px}.practice-note{display:flex;align-items:flex-start;gap:9px;font-size:11px;line-height:1.7;color:#8fa6b9;margin-top:25px}.practice-note svg{margin-top:2px;color:var(--purple)}
.world-map{position:relative;isolation:isolate;overflow:hidden;border:1px solid #3b544e;border-radius:21px;background:linear-gradient(160deg,#091d21bd,#10232bee 65%,#101b2ded),url('assets/forest-background.png') center/cover;box-shadow:0 20px 60px #0004}.world-map::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#defd921f 1px,transparent 2px);background-size:31px 37px;z-index:-1}.map-world-label{display:flex;align-items:center;gap:10px;padding:19px 23px;background:#101f2acf;border-bottom:1px solid #345047;font-size:12px}.map-world-label>svg{margin-inline-start:auto;color:#9dc383}.map-trail{position:absolute;left:0;top:67px;width:100%;height:calc(100% - 85px);pointer-events:none;z-index:-1;overflow:visible}.map-trail path{fill:none;stroke:#91b78455;stroke-width:3;stroke-dasharray:5 9;stroke-linecap:round}.map-stops{list-style:none;margin:0;padding:15px 0 21px}.map-stop{display:flex;align-items:center;gap:18px;min-height:166px;padding:11px 23px}.map-stop:nth-child(even){flex-direction:row-reverse}.map-node{position:relative;flex:0 0 67px;width:67px;height:67px;border:2px solid #55665c;border-radius:18px;display:grid;place-items:center;color:#a1b6ae;background:linear-gradient(140deg,#31433d,#172c2c);box-shadow:0 7px 0 #0a1d23,0 9px 0 #516256,0 10px 24px #0006}.map-node b{position:absolute;inset-inline-end:-6px;bottom:-8px;min-width:23px;height:23px;background:#152520;border:1px solid #5a7461;border-radius:7px;display:grid;place-items:center;font:700 12px Consolas,monospace;color:#cddbbe}.node-orbit{position:absolute;inset:-8px;border:1px dashed transparent;border-radius:23px;pointer-events:none}.map-level-card{flex:1;min-width:0;padding:14px 16px;background:#111f2beb;border:1px solid #31454f;border-radius:12px;box-shadow:0 4px 0 #06131c66}.map-level-meta{display:flex;align-items:center;gap:7px;justify-content:space-between;font-size:9px;color:#8da5b6;margin-bottom:6px}.level-status{font-size:9px;font-weight:700;color:#b6c7c3;text-align:end}.map-level-card h2{font-size:19px;line-height:1.3;letter-spacing:-.03em}.level-topic{color:#9fb6c7;font-size:12px;margin-top:5px}.map-level-card .button{min-height:43px;font-size:12px;padding:9px 11px;margin-top:11px;box-shadow:0 3px 0 #243b46}.level-progress-note{display:flex;justify-content:space-between;gap:7px;flex-wrap:wrap;font-size:9px;color:#b6d09f;margin-top:10px}.level-progress-note>span{color:var(--gold)}.lock-reason{color:#94a5b6;font-size:10px;line-height:1.75;margin-top:10px}.lock-reason>span{color:#c0ab7e}.is-available .map-node{border-color:#c7ef8b;color:#d7ff94;background:linear-gradient(140deg,#597546,#234032);box-shadow:0 7px 0 #183b2c,0 9px 0 #7fa256,0 0 28px #b2ec5229}.is-available .node-orbit{border-color:#b6e17c88;animation:map-beacon 3s ease-in-out infinite}.is-available .map-level-card{border-color:#647d49;background:linear-gradient(125deg,#243b2eef,#142928f5)}.is-available .level-status{color:var(--lime)}.is-completed .map-node{color:#cafa96;border-color:#78a665;background:linear-gradient(135deg,#426b3d,#1c3f2a)}.is-completed .level-status{color:#bde99c}.is-completed .map-level-card{border-color:#426047}.is-practice .map-node{color:#decdff;border-color:#9684c3;background:linear-gradient(135deg,#524168,#27344c)}.is-practice .level-status{color:#cdb6ff}.is-practice .map-level-card{border-color:#675778}.is-upcoming .map-node{color:#f3d58f;border-color:#b49a62;background:linear-gradient(135deg,#595035,#2d3028)}.is-upcoming .level-status{color:var(--gold)}.is-upcoming .map-level-card{border-color:#7a6946}.is-locked .map-node{color:#718a90;border-color:#405359;background:#1c2d33}.is-locked .map-level-card{background:#14222de6;border-color:#2a3c4a}.is-locked h2{color:#b0c0cd}
.level-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-5px 0 3px}.level-nav>.text-button{color:var(--lime);font-size:12px}.level-nav>span{color:#95a9c0;font-size:11px;text-align:end}.next-level-reward{display:flex;align-items:flex-start;gap:11px;text-align:start;padding:13px;border:1px solid #687646;background:#2c3827;border-radius:10px;margin:0 0 20px;color:var(--lime)}.next-level-reward>div{display:flex;flex-direction:column;gap:4px}.next-level-reward small{font-size:9px;letter-spacing:.06em}.next-level-reward strong{font-size:15px;color:#e8f3d7}.next-level-reward p{font-size:11px;line-height:1.7;color:#b5c5aa}.completion-panel>.button+.button{margin-top:12px}.answer-grid-text{grid-template-columns:repeat(2,minmax(0,1fr))}.answer-grid-text .answer{min-height:64px;flex-direction:row;gap:9px;padding:10px;font-size:16px}.answer-grid-text .answer bdi{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.4}.answer-grid-text .answer svg{width:13px}.code-string{color:#e9c287}.output code{white-space:pre-wrap;text-align:start}.scene[data-scene="forest-dawn"] .backdrop{filter:saturate(.95) brightness(1.04)}.scene[data-scene="forest-dawn"] .atmosphere{background:linear-gradient(#e9dc7226,transparent 60%,#15382222)}
[dir="rtl"] .map-trail{transform:scaleX(-1)}[dir="rtl"] .map-intro h1{letter-spacing:0;line-height:1.4}[dir="rtl"] .map-level-card h2{letter-spacing:0}[dir="rtl"] .map-level-meta{font-size:11px}[dir="rtl"] .level-status{font-size:10px}[dir="rtl"] .map-intro .eyebrow{letter-spacing:0}[dir="rtl"] .map-intro{padding-inline:0 8px}
@keyframes map-beacon{0%,100%{transform:scale(.97);opacity:.5}50%{transform:scale(1.06);opacity:1}}
@keyframes map-mascot{0%,100%{transform:translate(-52px,-19px) rotate(-2deg)}50%{transform:translate(-52px,-23px) rotate(2deg)}}
@media(max-width:760px){.course-layout{display:flex;flex-direction:column;gap:24px;margin:8px 0}.map-intro{position:static;padding:13px 7px 0;width:100%}.map-intro h1{font-size:34px;margin:10px 0 13px}.map-copy{font-size:13px;line-height:1.8}.course-stats{margin:18px 0 13px;gap:25px}.next-adventure{padding:16px;margin-top:19px;gap:11px;grid-template-columns:59px 1fr}.next-mascot{width:59px;height:59px}.next-adventure h2{font-size:17px}.badge-cabinet{margin-top:20px}.badge-cabinet>p{font-size:11px}.practice-note{font-size:11px;margin-top:17px}.world-map{width:100%;border-radius:15px}.map-world-label{padding:15px 15px;font-size:11px}.map-stops{padding-top:10px}.map-stop{gap:13px;padding:11px 13px;min-height:164px}.map-node{flex-basis:57px;width:57px;height:57px;border-radius:14px}.map-node>svg{width:23px}.node-orbit{inset:-6px;border-radius:19px}.map-level-card{padding:12px}.map-level-card h2{font-size:16px}.level-topic{font-size:11px}.map-level-meta{font-size:8px;gap:5px;align-items:flex-start}.level-status{font-size:8px}.map-level-card .button{min-height:44px;font-size:11px;padding:8px 9px}.map-level-card .button svg{width:14px}.level-progress-note{font-size:8px;gap:4px}.lock-reason{font-size:10px}.level-nav{gap:6px;margin-top:-6px}.level-nav>.text-button{font-size:11px}.level-nav>span{font-size:9px;max-width:55%}.answer-grid-text .answer{font-size:15px;min-height:62px}.collected-badge{font-size:11px;padding:8px 10px}.badge-cabinet h2{font-size:9px}}
@media(max-width:350px){.map-intro h1{font-size:30px}.map-intro{padding-inline:3px}.map-stop{padding-inline:10px;gap:10px}.map-node{flex-basis:47px;width:47px;height:47px;border-radius:12px}.map-node>svg{width:21px}.map-level-card{padding:10px}.map-level-card h2{font-size:15px}.map-level-meta{flex-wrap:wrap}.map-level-meta .level-status{text-align:start}.map-world-label{padding:13px 12px;font-size:10px}.map-world-label .world-tag{font-size:8px}.level-nav>.text-button{font-size:10px}}
