:root{--page:#f4f5ef;--soft:#edf2e7;--wall:#c6d5c4;--wall-line:#bbcebb;--floor:#fcfdf7;--visited:#def0d3;--goal:#fff0b5;--goal-ink:#946000;--error:#fff0df;--track:#d4dec9;--active:#183735;--active-ink:#fff;--loop:#e9e4f7;--condition:#fff0cf}
:root[data-world=forest]{--page:#f5f5eb;--ink:#283c2c;--muted:#65775f;--green:#476e3c;--lime:#e4edc6;--border:#dfe4cf;--paper:#fffff8;--soft:#eff2e3;--wall:#c6d4b6;--wall-line:#bacbaa;--visited:#e0edcb;--active:#334d30}
:root[data-world=workshop]{--page:#f6f2e9;--ink:#283e3d;--muted:#6b7871;--green:#267c72;--lime:#d9eee4;--border:#e2dfd1;--paper:#fffef9;--soft:#eeeee5;--wall:#d4d6c7;--wall-line:#c6ccbc;--visited:#dcefe5;--active:#245c55}
:root[data-world=space]{--page:#eef1fa;--ink:#293655;--muted:#63728e;--green:#5265aa;--lime:#e0e7ff;--border:#d8deee;--paper:#fcfdff;--soft:#eaf0fa;--wall:#c9d2e7;--wall-line:#b8c4df;--floor:#f5f8ff;--visited:#dee6fc;--active:#354978;--track:#cbd5ed}
:root[data-world=ocean]{--page:#eaf5f6;--ink:#164954;--muted:#557c83;--green:#087989;--lime:#d1eff0;--border:#cce2e4;--paper:#faffff;--soft:#e5f1f2;--wall:#b9d9dc;--wall-line:#a5cdd3;--floor:#f4fcfc;--visited:#ccebec;--active:#195d6a;--track:#b7dce0}
:root[data-appearance=dark]{color-scheme:dark;--page:#172422;--ink:#e8f0e9;--muted:#b5c6bd;--paper:#20312e;--border:#3b514b;--soft:#2b403a;--wall:#374b44;--wall-line:#30433c;--floor:#283b34;--visited:#3e6247;--goal:#665127;--goal-ink:#ffe290;--error:#563e2d;--track:#42584c;--lime:#3c563e;--green:#327e66;--active:#37694e;--loop:#423b59;--condition:#50482e}
:root[data-appearance=dark][data-world=workshop]{--page:#202823;--paper:#2a342d;--soft:#354136;--border:#475448;--green:#327e70}
:root[data-appearance=dark][data-world=space]{--page:#141e34;--paper:#1e2b45;--soft:#283957;--border:#3b4f72;--wall:#364963;--wall-line:#2d3d58;--floor:#26364e;--visited:#374f79;--green:#536ab0;--active:#465d92;--lime:#34476e;--track:#3a4b6c}
:root[data-appearance=dark][data-world=ocean]{--page:#102c34;--paper:#193d46;--soft:#234952;--border:#365d67;--wall:#315861;--wall-line:#274b55;--floor:#23434b;--visited:#316875;--green:#197b8b;--active:#276a79;--lime:#295966;--track:#355e67}
body{background:var(--page)}header{padding-top:18px;padding-bottom:18px}.header-tools{display:flex;align-items:center;gap:18px}main{padding-top:20px}.world-hero{position:relative;isolation:isolate;min-height:360px;overflow:hidden;border-radius:24px;margin-bottom:22px;background:#132b32}.world-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.world-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,22,30,.72),rgba(9,22,30,.22) 48%,transparent 75%),linear-gradient(0deg,var(--page),transparent 24%)}.world-copy{position:relative;padding:44px 38px 65px;max-width:580px;color:#fff}.world-copy .eyebrow{color:#dce9de;font-size:10px;letter-spacing:1.6px}.world-copy h1{color:white;margin-top:18px;font-size:clamp(30px,3.3vw,44px);line-height:1.1}.world-copy p{font-size:16px;line-height:1.65;max-width:420px;color:#f0f4f0}.companion{display:inline-block;margin-top:10px;border:1px solid #ffffff55;border-radius:20px;padding:7px 12px;font-size:12px;background:#142e3b60}.world-picker-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.world-picker-heading h2{margin:0;font-size:19px}.world-picker-heading>span{font-size:12px;color:var(--muted)}.world-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.world-choice{display:flex;gap:12px;align-items:center;text-align:left;border:1px solid var(--border);background:var(--paper);color:var(--ink);padding:7px;border-radius:15px;min-width:0}.world-choice[aria-pressed=true]{outline:2px solid var(--green);outline-offset:2px;background:var(--soft)}.world-choice img{width:76px;height:66px;object-fit:cover;object-position:72% center;border-radius:10px;flex-shrink:0}.world-choice[data-world=space] img{object-position:58% center}.world-choice strong{display:block;font-size:13px;line-height:1.35}.world-choice small{font-size:11px;color:var(--muted);display:block;margin-top:4px}.journey-bar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:30px 0 18px}.journey-bar p{font-size:13px;color:var(--muted);margin:5px 0}.journey-progress{min-width:215px;font-size:12px;color:var(--muted)}.journey-progress strong{font-size:19px;color:var(--ink);margin-right:5px}.track{background:var(--track);margin-top:8px}.stage{background:var(--soft);color:var(--ink)}.stage.active{background:var(--active);color:var(--active-ink)}.level,.subtle,.command-button,.instruction,.status,.tour-top button{background:var(--soft);color:var(--ink)}.level.done,.status.success,.instruction.current{background:var(--lime)}.board{background:var(--soft)}.cell{background:var(--floor)}.cell.wall{background:repeating-linear-gradient(135deg,var(--wall),var(--wall) 5px,var(--wall-line) 5px,var(--wall-line) 7px)}.cell.goal{background:var(--goal);color:var(--goal-ink)}.cell.visited:not(.wall){background:var(--visited)}.robot{box-shadow:0 3px 0 var(--active)}.status.error{background:var(--error)}.command-button.loop{background:var(--loop)}.command-button.condition{background:var(--condition)}.speed select,.instruction select{background:var(--paper);color:var(--ink);border-color:var(--border)}.tour-card{background:var(--paper);color:var(--ink)}.tour-top{color:var(--ink)}.text-button,.eyebrow,.section-label{color:var(--green)}[data-appearance=dark] .text-button,[data-appearance=dark] .eyebrow,[data-appearance=dark] .section-label{color:#c2dcca}[data-appearance=dark] .delete{color:#e8c4b3}[data-appearance=dark] .world-copy .eyebrow{color:#dce9de}
@media(max-width:1050px){.world-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.world-copy{max-width:52%;padding:30px 26px 60px}.world-copy p{font-size:14px}.world-hero{min-height:340px}}
@media(max-width:700px){header{gap:8px}.brand{font-size:19px;gap:7px}.header-tools .subtle{font-size:11px;padding:8px}.world-hero{min-height:0;border-radius:18px;background:var(--page);padding-top:205px}.world-art{height:245px;object-position:72% center}.world-shade{height:246px;background:linear-gradient(0deg,var(--page),transparent 50%)}.world-copy{max-width:none;padding:0 14px 6px;color:var(--ink)}.world-copy h1{color:var(--ink);font-size:30px;margin:10px 0}.world-copy p{color:var(--muted);font-size:14px;margin:8px 0}.world-copy .eyebrow{color:var(--muted)!important;font-size:9px}.companion{background:var(--soft);color:var(--ink);border-color:var(--border);margin-top:4px}.world-picker-heading{display:block}.world-picker-heading>span{display:block;margin-top:5px}.world-grid{gap:10px}.world-choice{gap:7px;align-items:flex-start;flex-direction:column;padding:7px}.world-choice img{width:100%;height:70px}.world-choice strong{font-size:12px}.world-choice small{font-size:10px}.world-choice>span{padding:0 3px 3px}.journey-bar{display:block;margin-top:25px}.journey-progress{margin-top:10px}.journey-progress .track{max-width:240px}.world-copy .companion{font-size:11px}}@media(max-width:700px){[data-world=ocean] .world-art{object-position:90% center}}
:root[data-world=forest]{--field-art:url('assets/forest-banner.webp');--obstacle-art:url('assets/field/tree.svg');--face-position:72% 40%;--path-color:#f0eccf;--visited-color:#d6e5a9;--wall-color:#40683d6b}
:root[data-world=workshop]{--field-art:url('assets/workshop-banner.webp');--obstacle-art:url('assets/field/crate.svg');--face-position:68% 34%;--path-color:#f4e7ce;--visited-color:#d9e9c9;--wall-color:#6e533d6b}
:root[data-world=space]{--field-art:url('assets/space-scene.webp');--obstacle-art:url('assets/field/asteroid.svg');--face-position:57% 38%;--path-color:#dce6f6;--visited-color:#bdcff0;--wall-color:#26396585}
:root[data-world=ocean]{--field-art:url('assets/underwater-station-v1.webp');--obstacle-art:url('assets/field/coral.svg');--face-position:91% 50%;--path-color:#d7f0e8;--visited-color:#afe2d7;--wall-color:#14617270}
.board.world-board{background-image:linear-gradient(#ffffff18,#ffffff18),var(--field-art);background-size:cover;background-position:70% center;border:2px solid var(--border);padding:9px;gap:5px}.world-board .cell:not(.wall){background:var(--path-color);box-shadow:inset 0 0 0 1px #ffffff80}.world-board .cell.visited:not(.wall){background:var(--visited-color)}.world-board .cell.wall{background:var(--wall-color);box-shadow:inset 0 0 0 1px #ffffff20}.world-board .cell.wall:after{content:'';width:85%;height:85%;background:var(--obstacle-art) center/contain no-repeat;filter:drop-shadow(0 2px 1px #112b3240)}.world-board .cell.goal{background:#fff1ab;outline:2px solid #dba646;outline-offset:-2px}.goal-icon{width:82%;height:82%;object-fit:contain}.world-board .robot{background:var(--green);inset:3%;box-shadow:0 2px 4px #16363570;border:2px solid white;border-radius:50%;overflow:visible}.actor-face{position:absolute;inset:0;border-radius:50%;background-image:var(--field-art);background-size:900% 300%;background-position:var(--face-position)}.direction{position:absolute;bottom:-4px;right:-4px;display:grid;place-items:center;border-radius:7px;min-width:22px;min-height:22px;width:48%;height:48%;background:#143e48;color:white;border:2px solid white;font-size:clamp(16px,1.6vw,25px);line-height:1;z-index:1}.mini-board .direction{font-size:14px;min-width:18px;min-height:18px}.world-board .cell.goal:has(.robot)>.goal-icon{opacity:.25}[data-appearance=dark] .world-board .cell:not(.wall){box-shadow:inset 0 0 0 1px #00000030}@media(max-width:700px){.board.world-board{padding:6px;gap:4px}.direction{font-size:16px;min-width:18px;min-height:18px}}
.board.world-board{background-size:auto 125%;background-position:left center}.actor-face{background-size:600% 200%}:root[data-world=forest]{--face-position:74% 40%}:root[data-world=workshop]{--face-position:70% 30%}:root[data-world=ocean]{--face-position:94% 50%}
/* Footer follows the selected world in both appearances. */
:root[data-world=forest]{--footer-bg:#334d30}
:root[data-world=workshop]{--footer-bg:#604831}
:root[data-world=space]{--footer-bg:#293b65}
:root[data-world=ocean]{--footer-bg:#195d6a}
:root[data-appearance=dark][data-world=forest]{--footer-bg:#243e29}
:root[data-appearance=dark][data-world=workshop]{--footer-bg:#443626}
:root[data-appearance=dark][data-world=space]{--footer-bg:#202e50}
:root[data-appearance=dark][data-world=ocean]{--footer-bg:#183f48}
footer.info-footer{background:var(--footer-bg,#183f48);color:#f5fbfc}
.levels .level{height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:2px solid transparent;padding:3px;font-size:16px;line-height:1.2}
.levels .level.done{background:#d7efac;color:#243b19;border-color:#8eaf60}
.levels .level.done:after{content:'✓';position:static;display:block;color:#244d17;font-size:19px;font-weight:900;line-height:1}
.levels .level.selected{outline:3px solid #da990c;outline-offset:2px}
.levels .level:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.stage{text-align:left;min-width:0}.stage span{line-height:1.4}.dense-board.world-board{gap:3px;padding:5px}.dense-board .direction{min-width:12px;min-height:12px;font-size:15px;border-width:1px;right:-2px;bottom:-2px}.dense-board .robot{border-width:1px}@media(max-width:700px){.stages{grid-template-columns:repeat(2,minmax(0,1fr))}.stage{min-height:78px}.dense-board.world-board{gap:2px;padding:4px}.dense-board .direction{font-size:11px;min-width:10px;min-height:10px}}

.mobile-game-nav{display:none}
/* Keep mobile text sizing stable; pinch zoom remains available. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,a,input,select,textarea{touch-action:manipulation}
@media(max-width:700px),(pointer:coarse){
 input,select,textarea,#practice-count,#share-link{font-size:16px}
}
@media(max-width:700px){
 header{flex-wrap:wrap}.header-tools{margin-left:auto}
 .workspace{gap:12px}.play-panel,.code-panel{padding:14px}
 .mobile-game-nav{display:flex;position:sticky;top:0;z-index:20;gap:8px;background:var(--page);padding:8px 0;margin:0}
 .mobile-game-nav button{flex:1;min-height:44px;border:1px solid var(--border);font-weight:700}
 #board,.code-panel{scroll-margin-top:68px}
 .level-heading{display:block}.help-buttons{max-width:none;justify-content:flex-start;margin:12px 0}
 .help-buttons button,.command-button,.debug-controls button,.run-row button{min-height:48px}
 .help-buttons button{padding:10px;font-size:13px}
 .levels{grid-template-columns:repeat(4,minmax(0,1fr))}
 .delete{width:44px;height:44px;flex-shrink:0}.instruction{padding:4px 8px}
 .instruction select,.speed select{min-height:44px;font-size:16px}
 .palette{gap:8px}.command-button{padding:10px;font-size:14px;line-height:1.35}
 .program{max-height:220px}.empty{padding:15px 8px}
 .practice-content{grid-template-columns:1fr}.mini-board{max-width:280px}
 .tour-active{padding-bottom:calc(48dvh + 40px)}
 .tour-active .mobile-game-nav{display:none}
 .tour-active #board{max-width:min(100%,42dvh)}
 .tour-card{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100vw - 24px);max-height:45dvh;padding:12px;overscroll-behavior:contain}
 .tour-card h3{font-size:18px;margin:8px 0}.tour-card p{font-size:14px;margin-bottom:10px}
 .tour-card .read-aloud{margin-bottom:10px;min-height:44px;padding:9px 12px;font-size:14px}
 .tour-card .tour-top button{width:44px;height:44px}
 .tour-actions button{min-height:44px}.tour-actions{gap:6px}
 .analytics-notice{bottom:12px;max-height:40dvh}
 .tour-active .analytics-notice{display:none}
}

#mobile-enter,.mobile-field-controls{display:none}
.board-viewport{min-width:0}.mobile-command-dock:empty{display:none}
@media(max-width:700px){
 main{padding:12px 8px}.workspace{gap:10px}.play-panel,.code-panel{padding:12px 8px}
 #mobile-enter{display:block;width:100%;min-height:56px;font-size:17px}
 .mobile-field-controls{display:flex;gap:8px;justify-content:space-between;margin:8px 0}
 .mobile-field-controls button{min-height:48px;font-size:15px;padding:8px 10px}
 #mobile-exit{display:none}.mobile-focused #mobile-exit{display:block}
 .board-viewport{width:100%;overflow:auto;max-height:65dvh;overscroll-behavior:contain;border-radius:14px;scroll-margin-top:64px}
 #board{width:100%;max-width:none;margin:0 auto}
 .board-viewport.enlarged #board{width:var(--zoom-board-size);max-width:none;min-width:100%}
 .board-viewport.enlarged .direction{font-size:20px;min-width:20px;min-height:20px}
 .mobile-command-dock{margin:14px 0;scroll-margin-top:64px}
 .mobile-command-dock .palette{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .mobile-command-dock .command-button{min-height:60px;font-size:17px;padding:10px;line-height:1.3;border:1px solid var(--border)}
 .mobile-command-dock .command-button[data-command=F]{grid-column:1/-1}
 .mobile-command-dock .run-row button{min-height:56px;font-size:17px}
 .muted.small,.code-panel .small{font-size:15px}.mission,.status,#mission{font-size:16px;line-height:1.5}
 .stage strong{font-size:15px}.stage span{font-size:13px}.world-choice strong{font-size:15px}.world-choice small{font-size:13px}
 .mobile-focused>header,.mobile-focused .world-hero,.mobile-focused .world-picker,.mobile-focused .journey-bar,.mobile-focused .stages,.mobile-focused .practice-modes,.mobile-focused .levels-panel,.mobile-focused #mobile-enter,.mobile-focused .mobile-game-nav,.mobile-focused .project-note,.mobile-focused>footer{display:none}
 .mobile-focused main{padding-top:0}.mobile-focused .workspace{margin-top:0}
 .mobile-focused .play-panel{border:0;background:transparent;padding-top:6px}
 .mobile-focused .level-heading h2{font-size:21px;margin:4px 0}
 .mobile-focused #mission{font-size:16px}
 .mobile-focused .help-buttons{margin:8px 0}.mobile-focused .help-buttons button{flex:1;font-size:14px}
 .mobile-focused .code-panel>.section-label,.mobile-focused .code-panel>h2,.mobile-focused .code-panel>p.small{display:none}
 .tour-active #mobile-enter,.tour-active .mobile-field-controls{display:none}
 .tour-active .board-viewport{overflow:visible;max-height:none}
}

.mobile-mission>summary{display:none}@media(max-width:700px){.mobile-focused .mobile-mission>summary{display:list-item;min-height:44px;padding:10px 0;font-size:16px;cursor:pointer}.mobile-mission{margin-bottom:8px}}
.play-entry{margin:0 0 24px;display:flex;align-items:center;gap:18px}
.play-entry #mobile-enter{display:block;min-height:58px;min-width:230px;font-size:19px;padding:14px 26px}
.play-entry p{font-size:15px;margin:0}
.mobile-focused .play-entry,.tour-active .play-entry{display:none}
@media(max-width:700px){.world-hero{margin-bottom:12px}.play-entry{display:block;margin-bottom:24px}.play-entry #mobile-enter{width:100%;min-width:0;min-height:60px;font-size:20px}.play-entry p{margin-top:10px;font-size:15px}}
.victory-field{position:relative;min-width:0}.victory-overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;background:#102e3bc9;border-radius:14px;padding:12px;overflow:auto}.victory-card{text-align:center;background:var(--paper);color:var(--ink);border:2px solid #e7b63e;border-radius:18px;padding:20px;width:min(100%,340px);box-shadow:0 8px 30px #0004}.victory-star{font-size:48px;color:#d79a0d;line-height:1}.victory-card h3{font-size:24px;margin:10px 0}.victory-card p{font-size:16px;margin:8px 0 18px}.victory-card button{width:100%;min-height:56px;font-size:18px}.header-tools{flex-wrap:wrap;gap:8px}@media(max-width:700px){.victory-card{padding:14px}.victory-card h3{font-size:21px}.victory-star{font-size:38px}.victory-card p{margin:8px 0 12px}.victory-card button{font-size:16px}.victory-sound{min-height:44px}}
