﻿:root{--ink:#17213b;--soft:#40506e;--muted:#66738a;--paper:#f3fbff;--line:#cad8ea;--sky:#58b9e8;--leaf:#22a36f;--coral:#f26d5b;--sun:#ffd15c;--violet:#6f64d8;--shadow:0 16px 40px rgba(30,46,82,.13);--pixel:0 4px 0 rgba(23,33,59,.18)}
*{box-sizing:border-box}
html{min-width:320px}
body{min-height:100vh;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(180deg,#eef9ff,#f8fffb 54%,#fff7df);color:var(--ink);letter-spacing:0;font-size:16.5px}
body:before{content:"";position:fixed;inset:0;z-index:-1;background-image:linear-gradient(rgba(23,33,59,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(23,33,59,.055) 1px,transparent 1px);background-size:32px 32px}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.topbar{position:sticky;top:0;z-index:20;min-height:68px;display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 38px;background:rgba(255,255,255,.94);border-bottom:1px solid rgba(23,33,59,.12);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:950}
.brand span{width:38px;height:38px;display:grid;place-items:center;border-radius:8px;background:var(--ink);color:white;box-shadow:4px 4px 0 var(--sun)}
.nav{display:flex;gap:10px;flex-wrap:wrap}
.nav a,.nav button{min-height:40px;border:2px solid var(--ink);border-radius:8px;padding:0 12px;background:#fff;color:var(--ink);font-weight:900;box-shadow:var(--pixel)}
.hero{width:min(1220px,calc(100% - 48px));margin:0 auto;padding:34px 0 14px}
.hero h1{max-width:900px;margin:10px 0;font-size:clamp(2.2rem,4vw,3.25rem);line-height:1.08;text-wrap:balance}
.hero p{max-width:940px;color:var(--muted);font-size:1.06rem;line-height:1.72}
.layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;width:min(1240px,calc(100% - 48px));margin:0 auto;padding:18px 0 52px}
.sidebar,.main-panel,.lesson-panel,.course-card{background:rgba(255,255,255,.94);border:2px solid var(--ink);border-radius:8px;padding:18px;box-shadow:var(--pixel)}
.sidebar{position:sticky;top:86px;align-self:start;max-height:calc(100vh - 100px);overflow:auto}
.sidebar h2{margin:18px 0 8px;font-size:.98rem;color:var(--ink)}
.track-btn,.stage-btn,.lesson-btn{width:100%;min-height:44px;text-align:left;background:#fff;border:2px solid var(--line);border-radius:8px;margin:6px 0;color:var(--soft);font-weight:850;line-height:1.32}
.track-btn strong{font-size:.92rem}
.track-btn small,.stage-btn small{color:var(--muted);line-height:1.4}
.track-btn.active,.stage-btn.active,.lesson-btn.active{background:var(--sun);border-color:var(--ink);color:var(--ink);box-shadow:var(--pixel)}
.lesson-btn.locked{opacity:.68;background:#f4f6fa}
#lessons{max-height:360px;overflow:auto;border:2px solid rgba(23,33,59,.08);border-radius:8px;padding:4px;background:#f8fbff}
.lesson-btn.active{position:sticky;top:0;z-index:2}
.unlock-link{background:var(--sun);border-color:var(--ink);box-shadow:var(--pixel)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:min(1180px,calc(100% - 48px));margin:0 auto;padding:18px 0 52px}
.course-card{position:relative;min-height:300px;display:flex;flex-direction:column;overflow:hidden}
.course-card:before{content:"WORLD";position:absolute;right:16px;top:14px;color:rgba(23,33,59,.16);font-size:.72rem;font-weight:950}
.course-card h3{margin:12px 0;font-size:1.55rem}
.course-card p,.lesson-panel p,.course-card li{color:var(--muted);line-height:1.72}
.course-card .track-btn{margin-top:auto;text-align:center;background:var(--leaf);border-color:var(--ink);color:white;box-shadow:var(--pixel)}
.badge{display:inline-flex;align-items:center;border:2px solid rgba(23,33,59,.16);border-radius:999px;background:#fff;color:#236b63;padding:7px 11px;font-weight:950;font-size:.78rem}
.progress{height:12px;background:#e8eef7;border:2px solid var(--ink);border-radius:999px;overflow:hidden}
.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--leaf),var(--sky),var(--sun));width:20%}
.progress-panel{border:2px solid var(--ink);border-radius:8px;background:#fffdf0;padding:14px;margin-bottom:14px;box-shadow:var(--pixel)}
.progress-panel strong{display:block;margin-bottom:8px}
.learner-pill{display:inline-flex;margin:0 0 9px;border:2px solid rgba(23,33,59,.14);border-radius:999px;background:#fff;padding:6px 10px;color:var(--soft);font-size:.82rem;font-weight:900}
.progress-panel p{margin:8px 0 4px;color:var(--soft);font-weight:850}
.progress-panel small{display:block;color:var(--muted);line-height:1.45}
.mini-link{display:inline-flex;margin-top:10px;border:2px solid var(--line);border-radius:8px;background:#fff;padding:7px 9px;font-weight:900;color:var(--ink)}
.learning-rhythm{border:2px solid var(--ink);border-radius:8px;background:#fff;padding:14px;margin:0 0 16px;box-shadow:var(--pixel)}
.rhythm-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px}
.rhythm-head strong{font-size:1.02rem}
.rhythm-head span{border:2px solid rgba(23,33,59,.12);border-radius:999px;background:#fff6ce;padding:5px 9px;color:#5a4300;font-weight:900;font-size:.78rem;white-space:nowrap}
.learning-rhythm ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.learning-rhythm li{min-height:96px;border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#f8fbff;padding:10px;display:grid;align-content:start;gap:5px}
.learning-rhythm li b{width:26px;height:26px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:8px;background:var(--sun);box-shadow:2px 2px 0 rgba(23,33,59,.16)}
.learning-rhythm li strong{font-size:.92rem;color:var(--ink);line-height:1.2}
.learning-rhythm li span{font-size:.8rem;color:var(--soft);line-height:1.35}
.lesson-workspace{border:2px solid var(--ink);border-radius:8px;background:#f7fffb;padding:14px;margin:0 0 18px;box-shadow:var(--pixel)}
.workspace-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.workspace-head strong,.workspace-head span{display:block}
.workspace-head span{color:var(--muted);font-size:.88rem;font-weight:850;margin-top:2px}
.workspace-head button{min-height:38px;border:2px solid var(--ink);border-radius:8px;background:var(--leaf);color:#fff;font-weight:950;box-shadow:var(--pixel)}
.workspace-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.workspace-grid label{display:grid;gap:6px;color:var(--ink);font-weight:950}
.workspace-grid textarea{min-height:90px;border:2px solid var(--line);border-radius:8px;background:#fff;padding:10px;resize:vertical;line-height:1.45}
.workspace-footer{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.workspace-footer p{margin:0;border:2px solid rgba(23,33,59,.12);border-radius:8px;background:#fff;padding:9px;color:var(--soft);font-weight:850}
.learning-toast{position:fixed;left:50%;bottom:18px;transform:translate(-50%,20px);z-index:50;max-width:min(520px,calc(100% - 32px));border:2px solid var(--ink);border-radius:8px;background:#fffdf0;color:var(--ink);padding:12px 14px;box-shadow:var(--pixel);font-weight:950;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}
.learning-toast.show{opacity:1;transform:translate(-50%,0)}
.premium-coach{border:2px solid var(--ink);border-radius:8px;background:#fffdf0;padding:16px;margin:12px 0 18px;box-shadow:var(--pixel)}
.premium-coach[hidden]{display:none}
.coach-head{display:grid;gap:8px;margin-bottom:12px}
.coach-head strong{font-size:1.08rem;line-height:1.35}
.coach-head p{margin:0;color:var(--soft);line-height:1.6}
.learning-arc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.learning-arc-grid article{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:12px;min-height:118px}
.learning-arc-grid strong{display:block;margin-bottom:6px;color:var(--ink)}
.learning-arc-grid p{margin:0;color:var(--soft);line-height:1.55}
.coach-bottom{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(220px,.8fr);gap:10px}
.coach-bottom>div{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#f0fbff;padding:12px}
.coach-bottom strong{display:block;margin-bottom:6px}
.coach-bottom ol{margin:0;padding-left:22px;color:var(--soft);line-height:1.55}
.coach-bottom p{margin:0;color:var(--soft);line-height:1.55}
.junior-coach{border:2px solid var(--ink);border-radius:8px;background:#fff9e8;padding:16px;margin:12px 0 18px;box-shadow:var(--pixel)}
.junior-coach[hidden]{display:none}
.junior-head{display:grid;gap:8px;margin-bottom:12px}
.junior-head strong{font-size:1.08rem;color:var(--ink);line-height:1.35}
.junior-head p{margin:0;color:var(--soft);font-size:1.04rem;line-height:1.58}
.junior-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0}
.junior-actions button{min-height:42px;border:2px solid var(--ink);border-radius:8px;background:var(--sky);color:#fff;padding:0 12px;font-weight:950;box-shadow:var(--pixel)}
.junior-actions button:nth-child(2){background:var(--leaf)}
.junior-actions span{color:var(--soft);font-size:.9rem;font-weight:850}
.junior-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;list-style:none;margin:12px 0;padding:0}
.junior-steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:start;border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:10px;min-height:92px}
.junior-steps b{width:30px;height:30px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:8px;background:var(--sun);box-shadow:2px 2px 0 rgba(23,33,59,.16)}
.junior-steps span{color:var(--ink);font-weight:900;line-height:1.38}
.junior-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0}
.junior-grid article{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#f7fffb;padding:11px}
.junior-grid strong,.junior-words strong{display:block;color:var(--ink);margin-bottom:5px}
.junior-grid p{margin:0;color:var(--soft);line-height:1.5;font-weight:850}
.junior-words{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border:2px dashed rgba(23,33,59,.18);border-radius:8px;background:#fff;padding:10px}
.junior-words span{display:inline-flex;border:2px solid rgba(23,33,59,.12);border-radius:999px;background:#f8fbff;padding:6px 9px;color:var(--soft);font-size:.86rem;font-weight:850}
.portfolio-examples{border:2px solid var(--ink);border-radius:8px;background:#fffdf0;padding:14px;margin:0 0 18px;box-shadow:var(--pixel)}
.portfolio-examples[hidden]{display:none}
.portfolio-head{display:grid;gap:6px;margin-bottom:12px}
.portfolio-head strong{color:var(--ink);font-size:1.08rem;line-height:1.35}
.portfolio-head p{margin:0;color:var(--soft);line-height:1.55}
.portfolio-example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.portfolio-example-grid article{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:12px}
.portfolio-example-grid strong{display:block;color:var(--ink);line-height:1.3}
.portfolio-example-grid p{margin:7px 0;color:var(--soft);line-height:1.55}
.portfolio-example-grid span{display:block;border-left:4px solid var(--leaf);padding-left:9px;color:#164b3d;font-size:.86rem;font-weight:900;line-height:1.4}
.lesson-panel{display:block}
.lesson-panel h2{margin:12px 0 6px;font-size:clamp(1.7rem,2.6vw,2.25rem);line-height:1.16}
.lesson-panel h3{margin:24px 0 9px;font-size:1.08rem}
.lesson-meta{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.lesson-meta span{display:inline-flex;align-items:center;min-height:34px;border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:6px 10px;color:var(--soft);font-size:.88rem;font-weight:900;line-height:1.35}
.lesson-meta span:first-child{background:#fff6ce;border-color:#e4bd44;color:#5a4300}
.stage-goal,.teach-card,.example-box,.mission-steps,.question-grid{border:2px solid var(--line);border-radius:8px;background:#fff;padding:16px}
.stage-goal{margin:10px 0 14px;background:#fff6ce;border-color:#e4bd44;font-weight:850;color:#5a4300;line-height:1.65}
.milestone-list{margin:10px 0 18px;padding-left:24px;color:var(--soft);line-height:1.65}
.stage-outcome-panel{border:2px solid rgba(23,33,59,.16);border-radius:8px;background:linear-gradient(180deg,#ffffff,#f8fbff);padding:14px;margin:12px 0 18px}
.stage-outcome-head{display:grid;gap:6px}
.stage-outcome-head strong{color:var(--ink);font-size:1.12rem;line-height:1.35}
.stage-outcome-head p{margin:0;color:var(--soft);line-height:1.6}
.stage-outcome-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
.stage-outcome-grid article{border:2px solid rgba(23,33,59,.12);border-radius:8px;background:#fff;padding:10px}
.stage-outcome-grid span,.stage-current-mission span{display:block;color:var(--muted);font-size:.78rem;font-weight:950;text-transform:uppercase;letter-spacing:0}
.stage-outcome-grid p{margin:5px 0 0;color:var(--ink);font-weight:850;line-height:1.45}
.stage-current-mission{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;border:2px dashed rgba(23,33,59,.16);border-radius:8px;background:#fff9e8;padding:10px}
.stage-current-mission strong{color:#6b4b00;text-align:right;line-height:1.35}
.teach-card{background:#eef9ff;border-color:#a8d9ef}
.teach-card strong,.example-box strong{display:block;margin-bottom:6px;color:var(--ink)}
.example-box{margin-top:12px;background:#f6f1ff;border-color:#c8c0f1;color:var(--soft);line-height:1.55}
.mission-steps{margin:10px 0;padding-left:34px;line-height:1.7}
.compact-list{padding-left:24px}
.deep-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0}
.deep-grid .teach-card{margin:0}
.question-grid{display:grid;gap:9px;margin:10px 0 0;padding-left:34px;line-height:1.62}
.code-lab{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:14px}
.code-lab textarea,.answer-box{width:100%;border:2px solid var(--ink);border-radius:8px;padding:12px;background:#fff;box-shadow:inset 0 0 0 3px rgba(88,185,232,.09)}
.code-lab textarea{min-height:280px;font-family:Consolas,"SFMono-Regular",monospace;font-size:.95rem;line-height:1.5}
.preview{background:#12203d;color:#eaf2ff;border:2px solid var(--ink);border-radius:8px;padding:14px;min-height:280px;overflow:auto;box-shadow:var(--pixel)}
.run-evidence{display:grid;gap:8px;margin-top:12px;border:2px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.08);padding:12px;color:#eaf2ff}
.run-evidence strong{display:block;color:#fff}
.run-evidence div{border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:8px;background:rgba(255,255,255,.05)}
.run-evidence span{display:block;color:#ffd15c;font-size:.78rem;font-weight:950}
.run-evidence p{margin:3px 0 0;color:#eaf2ff;line-height:1.45}
.sql-preview-panel{display:grid;gap:12px;color:#eaf2ff}
.sql-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sql-preview-head strong{font-size:1.02rem;color:#fff}
.sql-preview-head span{color:#b9c7e7;font-size:.88rem}
.sql-table-wrap{overflow:auto;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#f8fbff}
.sql-result-table{width:100%;border-collapse:collapse;color:#17213b;font-size:.92rem}
.sql-result-table th,.sql-result-table td{padding:10px 11px;border-bottom:1px solid #d9e3ef;text-align:left;vertical-align:top}
.sql-result-table th{background:#fff6ce;color:#17213b;font-weight:950}
.sql-result-table tr:last-child td{border-bottom:0}
.sql-decision{margin:0;border:2px solid rgba(255,209,92,.42);border-radius:8px;background:rgba(255,246,206,.12);padding:10px;color:#fff;line-height:1.5}
.sql-check-report{white-space:pre-wrap;margin:0;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(0,0,0,.18);padding:10px;color:#eaf2ff;line-height:1.45}
.scratch-preview-panel{display:grid;gap:12px}
.scratch-block-grid{display:grid;gap:8px}
.scratch-block{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:center;border:2px solid rgba(255,255,255,.32);border-radius:8px;padding:8px 10px;color:#17213b;box-shadow:3px 3px 0 rgba(0,0,0,.18)}
.scratch-block b{width:28px;height:28px;display:grid;place-items:center;border:2px solid rgba(23,33,59,.3);border-radius:8px;background:#fff;font-weight:950}
.scratch-block span{font-weight:950;line-height:1.35;overflow-wrap:anywhere}
.scratch-block.event{background:#ffd15c}
.scratch-block.motion{background:#58b9e8;color:#fff}
.scratch-block.looks{background:#b997ff;color:#fff}
.scratch-block.control{background:#f2a34f}
.scratch-block.art{background:#66d29f}
.scratch-block.data{background:#ff8a7a;color:#fff}
.scratch-block.default{background:#f8fbff}
.scratch-milo-check{border:2px solid rgba(255,209,92,.55);border-radius:8px;background:rgba(255,246,206,.14);padding:10px;color:#fff}
.scratch-milo-check strong{display:block;color:#ffd15c;margin-bottom:5px}
.scratch-milo-check p{margin:0;color:#fff;line-height:1.45}
.stage-canvas{height:190px;background:linear-gradient(#b9edff 0,#eaf9ff 50%,#fff0b7 51%,#ffe7a6 100%);border:2px solid rgba(255,255,255,.5);border-radius:8px;position:relative;overflow:hidden}
.stage-canvas:before{content:"";position:absolute;left:0;right:0;bottom:36px;border-top:6px dotted rgba(23,33,59,.22)}
.sprite{position:absolute;left:24px;top:78px;width:48px;height:48px;border:2px solid var(--ink);border-radius:8px;background:var(--coral);display:grid;place-items:center;color:white;font-weight:950;transition:transform .4s;box-shadow:4px 4px 0 rgba(23,33,59,.22)}
.answer-box{min-height:118px;resize:vertical}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.primary,.secondary{min-height:44px;border:2px solid var(--ink);border-radius:8px;padding:0 14px;font-weight:950;box-shadow:var(--pixel)}
.primary{background:var(--leaf);color:white}
.secondary{background:var(--ink);color:white}
.toolbar button:disabled,.quest-button-row-v022 button:disabled{opacity:.46;cursor:not-allowed;filter:saturate(.35);box-shadow:none;transform:none!important}
.submit-status{min-height:24px;color:var(--soft);font-weight:850}
.locked-note{background:#fff6ce;border:2px solid #e4bd44;border-radius:8px;padding:14px;color:#5a4300;font-weight:800}
.child-note{display:flex;align-items:center;gap:10px;background:#dff8e9;border:2px solid #9bd8bd;border-radius:8px;padding:13px;color:#164b3d;font-weight:850}
.voice-coach,.activity-card{border:2px solid var(--ink);border-radius:8px;background:#fff7df;padding:14px;margin:12px 0;box-shadow:var(--pixel)}
.voice-coach p,.activity-card p{margin:8px 0;color:var(--soft);line-height:1.6}
.choice-row{display:flex;gap:10px;align-items:flex-start;margin:10px 0;color:var(--soft);font-weight:850}
.choice-row input{width:auto;margin-top:4px}
.self-check{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}
.self-check .choice-row{margin:0;background:#fff;border:2px solid rgba(23,33,59,.12);border-radius:8px;padding:9px}
.evidence-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}
.evidence-strip>*{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:10px;color:var(--soft);font-weight:850}
.evidence-strip strong{color:var(--ink);background:#fff6ce}
.mini-table{margin:10px 0;font-size:.92rem}
.parent-grid .card{min-height:240px}
.mini-answer{min-height:88px;margin-top:8px}
.error-output{white-space:pre-wrap;color:#ffdfdf;background:#431b28;border:2px solid #ff9baa;border-radius:8px;padding:12px}
.project-gallery{display:grid;gap:10px;margin-top:10px}
.project-gallery article{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff;padding:12px}
.project-gallery article strong{display:block;color:var(--ink)}
.project-gallery article span{display:block;margin:3px 0 8px;color:var(--muted);font-size:.82rem;font-weight:850}
.project-gallery article p{margin:0 0 8px;color:var(--soft)}
.project-gallery pre{max-height:150px;overflow:auto;margin:0;border-radius:8px;background:#10213e;color:#eaf2ff;padding:10px;white-space:pre-wrap}
.answer-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 10px}
.answer-guide-grid article{border:2px solid rgba(23,33,59,.12);border-radius:8px;background:#fff;padding:11px}
.answer-guide-grid span{display:block;color:var(--muted);font-size:.78rem;font-weight:900}
.answer-guide-grid strong{display:block;margin-top:4px;color:var(--ink);line-height:1.45}
.outcome-band{width:min(1180px,calc(100% - 48px));margin:18px auto 34px;border:2px solid var(--ink);border-radius:8px;background:rgba(255,255,255,.95);padding:20px;box-shadow:var(--pixel)}
.outcome-band.compact{margin-top:0}
.outcome-head{display:grid;gap:8px;margin-bottom:16px}
.outcome-head h2{margin:0;font-size:clamp(1.65rem,2.6vw,2.25rem);line-height:1.16}
.outcome-head p{max-width:980px;margin:0;color:var(--soft);line-height:1.72}
.outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.outcome-card{display:flex;min-height:310px;flex-direction:column;border:2px solid var(--line);border-radius:8px;background:#fff;padding:16px}
.outcome-card h3{margin:12px 0 8px;font-size:1.28rem}
.outcome-card p{margin:0 0 12px;color:var(--soft);line-height:1.65}
.outcome-card .parent-promise{border-top:2px dashed rgba(23,33,59,.12);padding-top:10px;color:#314c68;font-weight:780}
.outcome-card .track-btn{margin-top:auto;text-align:center;background:var(--ink);border-color:var(--ink);color:#fff}
.outcome-programming{border-color:#98d7f0;background:#f0fbff}
.outcome-chinese{border-color:#d8c8ff;background:#fbf8ff}
.outcome-ontario{border-color:#9bd8bd;background:#f1fff7}
.evidence-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.evidence-row span{display:inline-flex;min-height:34px;align-items:center;border:2px solid rgba(23,33,59,.14);border-radius:999px;background:#fff;padding:5px 10px;color:var(--soft);font-size:.82rem;font-weight:900;line-height:1.3}
.learning-loop{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.learning-loop article{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fff7df;padding:14px}
.learning-loop span{display:inline-grid;width:30px;height:30px;place-items:center;border:2px solid var(--ink);border-radius:8px;background:var(--sun);font-weight:950;box-shadow:3px 3px 0 rgba(23,33,59,.14)}
.learning-loop strong{display:block;margin:10px 0 6px}
.learning-loop p{margin:0;color:var(--soft);line-height:1.58}
.outcome-promise-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}
.outcome-promise-card{border:2px solid rgba(23,33,59,.14);border-radius:8px;background:#fffdf4;padding:14px}
.outcome-promise-card strong{display:block;color:var(--ink)}
.outcome-promise-card p{margin:8px 0 0;color:var(--soft);line-height:1.65}
.member-bridge{background:#f1fff7;border-color:#a8ddc1}
.outcome-route-panel{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,.7fr);gap:14px;margin-bottom:14px}
.outcome-route-panel>div,.outcome-stage{border:2px solid var(--line);border-radius:8px;background:#fff;padding:14px}
.outcome-route-panel strong,.outcome-stage strong{display:block;color:var(--ink);font-size:1rem}
.outcome-route-panel p,.outcome-stage p{margin:8px 0;color:var(--soft);line-height:1.65}
.outcome-checks{margin:8px 0 0;padding-left:22px;color:var(--soft);line-height:1.65}
.outcome-stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.outcome-stage{background:#f8fbff}
.outcome-stage em{display:block;margin-top:8px;border:2px solid rgba(255,201,80,.7);border-radius:8px;background:#fff9e8;padding:8px;color:#6b4b00;font-style:normal;font-weight:900;line-height:1.45}
.outcome-stage span{display:block;margin-top:8px;border-left:4px solid var(--leaf);padding-left:10px;color:#164b3d;font-weight:850;line-height:1.5}
.reference-note{border-top:2px dashed rgba(23,33,59,.16);padding-top:10px;font-size:.9rem}
select,input,textarea{font:inherit}
select{width:100%;border:2px solid var(--ink);border-radius:8px;padding:10px;background:#fff}
audio{width:100%;margin-top:8px}
.course-map-shell{width:min(1240px,calc(100% - 48px));margin:10px auto 8px;border:2px solid var(--ink);border-radius:8px;background:rgba(255,255,255,.96);box-shadow:var(--soft-shadow);padding:18px}
.course-map-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
.course-map-head h2{margin:8px 0 6px;font-size:clamp(1.45rem,2.4vw,2.1rem);line-height:1.14}
.course-map-head p{max-width:800px;margin:0;color:var(--soft);line-height:1.62}
.course-map-head>strong{min-width:110px;text-align:center;border:2px solid rgba(23,33,59,.16);border-radius:8px;background:#fff6ce;padding:10px;color:#5a4300;box-shadow:var(--pixel)}
.course-level-grid{display:grid;gap:12px}
.course-level{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px;align-items:start;border:2px solid rgba(23,33,59,.1);border-radius:8px;background:#f8fbff;padding:12px}
.course-level h3{margin:0;border:2px solid var(--ink);border-radius:8px;background:var(--sun);padding:10px;text-align:center;box-shadow:var(--pixel);font-size:.95rem}
.course-module-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.course-module-row.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.course-module-card{min-height:160px;text-align:left;border:2px solid var(--line);border-radius:8px;background:#fff;padding:13px;color:var(--ink);box-shadow:none;display:flex;flex-direction:column;gap:8px;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.course-module-card:hover{transform:translateY(-2px);border-color:var(--ink);box-shadow:var(--pixel)}
.course-module-card.active{border-color:var(--ink);background:#fff9e8;box-shadow:var(--pixel)}
.course-module-card span{width:max-content;max-width:100%;border:2px solid rgba(23,33,59,.12);border-radius:999px;background:#eef9ff;padding:4px 8px;color:#236b63;font-size:.76rem;font-weight:950}
.course-module-card strong{font-size:1rem;line-height:1.25}
.course-module-card p{margin:0;color:var(--soft);line-height:1.45;font-size:.9rem}
.course-module-card em{margin-top:auto;color:var(--muted);font-style:normal;font-size:.78rem;font-weight:900}
.lesson-focus-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0 16px;padding:8px;border:2px solid rgba(23,33,59,.1);border-radius:8px;background:#f8fbff}
.lesson-focus-tabs button{min-height:46px;border:2px solid var(--line);border-radius:8px;background:#fff;color:var(--soft);font-weight:950;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:none}
.lesson-focus-tabs button b{width:24px;height:24px;display:grid;place-items:center;border:2px solid currentColor;border-radius:8px;background:#fff6ce}
.lesson-focus-tabs button.active{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:var(--pixel)}
.lesson-focus-tabs button.active b{background:var(--sun);color:var(--ink)}
@media(max-width:940px){
  .topbar{align-items:flex-start;flex-direction:column;padding:12px 18px}
  .hero,.layout,.cards,.outcome-band,.course-map-shell{width:min(100% - 24px,1180px)}
  .layout,.code-lab,.cards,.deep-grid,.outcome-grid,.learning-loop,.outcome-promise-grid,.outcome-route-panel,.outcome-stage-grid,.stage-outcome-grid,.portfolio-example-grid,.learning-arc-grid,.coach-bottom,.learning-rhythm ol,.workspace-grid,.workspace-footer,.junior-steps,.junior-grid,.scratch-block-grid{grid-template-columns:1fr}
  .course-level,.course-module-row,.course-module-row.four,.lesson-focus-tabs{grid-template-columns:1fr}
  .course-map-head{display:grid}
  .stage-current-mission{align-items:flex-start;flex-direction:column}
  .stage-current-mission strong{text-align:left}
  .self-check,.evidence-strip,.answer-guide-grid{grid-template-columns:1fr}
  .sidebar{position:static;max-height:none}
  #lessons{max-height:260px}
  .hero h1{font-size:2.45rem}
}

/* v0.1.6 learning surface: a quest cockpit for self-study. */
:root{
  --cream:#fff9e8;
  --paper-2:#f7fffb;
  --ring:0 0 0 4px rgba(255,209,92,.38);
  --soft-shadow:0 22px 54px rgba(18,32,61,.13);
}

body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}

body:before{
  background-image:
    linear-gradient(rgba(23,33,59,.048) 1px,transparent 1px),
    linear-gradient(90deg,rgba(23,33,59,.048) 1px,transparent 1px),
    radial-gradient(circle at 18% 12%,rgba(255,209,92,.18),transparent 22%),
    radial-gradient(circle at 88% 20%,rgba(242,109,91,.12),transparent 20%);
  background-size:32px 32px,32px 32px,100% 100%,100% 100%;
}

.topbar{
  box-shadow:0 10px 24px rgba(18,32,61,.06);
}

.brand span{
  position:relative;
}

.brand span:after{
  content:"";
  position:absolute;
  right:-5px;
  top:-5px;
  width:10px;
  height:10px;
  border:2px solid var(--ink);
  border-radius:8px;
  background:var(--coral);
}

.hero{
  position:relative;
  isolation:isolate;
}

.hero:after{
  content:"";
  position:absolute;
  right:0;
  bottom:12px;
  width:min(360px,34vw);
  height:12px;
  border-radius:8px;
  background:repeating-linear-gradient(90deg,var(--sun) 0 22px,var(--leaf) 22px 44px,var(--sky) 44px 66px,var(--coral) 66px 88px);
  opacity:.72;
}

.sidebar,.main-panel,.lesson-panel,.course-card,.outcome-band,.progress-panel{
  box-shadow:var(--soft-shadow);
}

.sidebar{
  background:
    linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,253,240,.96));
}

.sidebar h2{
  display:flex;
  align-items:center;
  gap:8px;
}

.sidebar h2:before{
  content:"";
  width:10px;
  height:10px;
  border-radius:8px;
  border:2px solid var(--ink);
  background:var(--sun);
}

.track-btn,.stage-btn,.lesson-btn{
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}

.track-btn:hover,.stage-btn:hover,.lesson-btn:hover{
  transform:translateY(-1px);
  border-color:var(--ink);
}

.track-btn.active,.stage-btn.active,.lesson-btn.active{
  position:relative;
}

.track-btn.active:before,.stage-btn.active:before,.lesson-btn.active:before{
  content:"";
  position:absolute;
  left:-2px;
  top:10px;
  bottom:10px;
  width:6px;
  border-radius:0 8px 8px 0;
  background:var(--coral);
}

.lesson-panel{
  position:relative;
  background:rgba(255,255,255,.96);
}

.lesson-panel:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:10px;
  border-radius:6px 0 0 6px;
  background:linear-gradient(180deg,var(--leaf),var(--sky),var(--sun),var(--coral));
}

.lesson-panel>*{
  margin-left:8px;
}

.badge{
  box-shadow:0 3px 0 rgba(18,32,61,.08);
}

.badge:before{
  content:"";
  width:8px;
  height:8px;
  border:2px solid currentColor;
  border-radius:8px;
  background:var(--sun);
}

.stage-goal{
  background:linear-gradient(180deg,#fffdf0,#fff6ce);
}

.teach-card,.example-box,.activity-card,.voice-coach{
  position:relative;
  overflow:hidden;
}

.teach-card:before,.example-box:before,.activity-card:before,.voice-coach:before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:6px;
  background:linear-gradient(90deg,var(--sky),var(--leaf),var(--sun));
}

.example-box:before{
  background:linear-gradient(90deg,var(--violet),var(--sky));
}

.activity-card:before,.voice-coach:before{
  background:linear-gradient(90deg,var(--sun),var(--coral));
}

.code-lab textarea{
  background:#fbfdff;
}

.preview{
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),transparent),
    #12203d;
}

.stage-canvas{
  box-shadow:inset 0 -22px 0 rgba(255,209,92,.28);
}

.sprite{
  border-radius:8px;
}

.toolbar .primary,.toolbar .secondary,.toolbar .ghost,.primary,.secondary{
  transition:transform .15s ease,box-shadow .15s ease;
}

.toolbar .primary:hover,.toolbar .secondary:hover,.toolbar .ghost:hover,.primary:hover,.secondary:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 0 rgba(23,33,59,.18);
}

button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none;
  box-shadow:var(--ring),var(--pixel);
}

@media(max-width:940px){
  .hero:after{display:none}
  .lesson-panel:before{width:6px}
  .lesson-panel>*{margin-left:4px}
}

/* v0.1.65 learning UI pass: less clutter, clearer world select, Scratch Lab as visual entry. */
.quest-map-v065 .v065-learn-hero,
.programming-v065 .v065-programming-hero{
  border-bottom:2px dashed rgba(23,33,59,.14);
}
.hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
.hero-actions a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:2px solid var(--ink);
  border-radius:8px;
  padding:0 14px;
  font-weight:950;
  box-shadow:var(--pixel);
}
.hero-actions .primary{background:var(--leaf);color:#fff}
.hero-actions .secondary{background:var(--ink);color:#fff}
.v065-world-select{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.v065-world-select .course-card{
  min-height:340px;
}
.v065-feature-course{
  background:linear-gradient(180deg,#fff,#fff8df);
}
.v065-feature-course:before{
  content:"START";
  color:rgba(23,33,59,.18);
}
.v065-learning-contract .learning-loop{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.v065-updates-hero{
  padding-top:18px;
  padding-bottom:0;
}
.programming-v065 .course-map-shell{
  margin-top:16px;
}
.programming-v065 .lesson-panel{
  overflow:hidden;
}
@media(max-width:1120px){
  .v065-world-select,
  .v065-learning-contract .learning-loop{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:700px){
  .v065-world-select,
  .v065-learning-contract .learning-loop{
    grid-template-columns:1fr;
  }
}

/* v0.1.66 student clean-up: keep learning pages focused on doing the next task. */
.quest-map-v066 .v066-clean-hero,
.programming-v066 .v066-clean-hero{
  padding-bottom:10px;
  border-bottom:2px dashed rgba(23,33,59,.12);
}
.quest-map-v066 .v066-clean-hero h1,
.programming-v066 .v066-clean-hero h1{
  max-width:760px;
}
.quest-map-v066 .v066-clean-hero p,
.programming-v066 .v066-clean-hero p{
  max-width:780px;
}
.v066-world-select{
  grid-template-columns:repeat(4,minmax(0,1fr));
  padding-top:12px;
}
.v066-world-select .course-card{
  min-height:280px;
}
.v066-start-card{
  background:linear-gradient(180deg,#fff,#fff8df);
}
.programming-v066 #stageOutcomePanel,
.programming-v066 #learningRhythm,
.programming-v066 #lessonWorkspace,
.programming-v066 #premiumCoach,
.programming-v066 #portfolioExamples,
.programming-v066 .lesson-focus-tabs,
.programming-v066 #pathProgressPanel a[href="/parent/"]{
  display:none!important;
}
.programming-v066 .v066-compact-map{
  padding:16px;
}
.programming-v066 .course-map-head{
  margin-bottom:0;
}
.programming-v066 .course-map-head p{
  max-width:720px;
}
.programming-v066 .course-level-grid{
  display:none;
}
.v066-learning-layout{
  padding-top:8px;
}
.v066-student-sidebar h2{
  margin-top:14px;
}
.v066-student-lesson .teach-card,
.v066-student-lesson .example-box{
  margin-top:12px;
}
.v066-student-lesson .deep-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.v066-student-lesson .lesson-meta span{
  font-size:.84rem;
}
.v066-student-lesson #lessonGoal{
  color:var(--ink);
  font-weight:850;
}
@media(max-width:1120px){
  .v066-world-select{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:700px){
  .v066-world-select,
  .v066-student-lesson .deep-grid{
    grid-template-columns:1fr;
  }
}

/* v0.3.3 quest learning desk: keep every teaching page close to the Python quest UI. */
.learning-quest-page{
  min-height:100vh;
  background:linear-gradient(180deg,#070b18 0%,#0d1628 56%,#f3f7fb 56%,#f8fbff 100%);
  color:#f7fbff;
}
.learning-quest-page .site-header{
  min-height:66px;
  z-index:120;
}
.learning-quest-main{
  padding:0 0 44px;
}
.learning-quest-title{
  margin-top:22px;
  padding:18px 24px;
}
.learning-quest-title h1{
  font-size:clamp(1.85rem,3vw,3.1rem);
}
.learning-map-drawer{
  width:min(1180px,calc(100% - 40px));
  margin:14px auto 0;
  border:2px solid #31405f;
  border-radius:8px;
  background:#101829;
  color:#f7fbff;
  overflow:hidden;
}
.learning-map-drawer summary{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 16px;
  color:#ffcf34;
  font-weight:1000;
  cursor:pointer;
  list-style:none;
}
.learning-map-drawer summary::-webkit-details-marker{
  display:none;
}
.learning-map-drawer summary::after{
  content:"+";
  color:#f7fbff;
}
.learning-map-drawer[open] summary::after{
  content:"-";
}
.learning-map-drawer .course-map-shell,
.learning-map-drawer .outcome-band{
  width:auto;
  margin:0 16px 16px;
  border-color:#31405f;
  background:#0b1120;
  color:#f7fbff;
  box-shadow:none;
}
.learning-map-drawer .course-map-head h2,
.learning-map-drawer .course-map-head p,
.learning-map-drawer .course-card p,
.learning-map-drawer .outcome-band p{
  color:#d6e0ef;
}
.learning-map-drawer .course-level-grid{
  display:none;
}
.learning-quest-shell{
  width:min(1180px,calc(100% - 40px));
  margin:16px auto 0;
  padding:0;
  grid-template-columns:minmax(280px,.72fr) minmax(560px,1.28fr);
  gap:14px;
  align-items:start;
}
.learning-quest-menu{
  position:sticky;
  top:84px;
  max-height:calc(100vh - 102px);
  overflow:auto;
  padding:18px;
  border-color:#31405f;
  background:#101829;
  color:#f7fbff;
  box-shadow:none;
}
.learning-quest-menu h2{
  margin:18px 0 8px;
  color:#f7fbff;
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:0;
}
.learning-quest-menu .track-btn,
.learning-quest-menu .stage-btn,
.learning-quest-menu .lesson-btn{
  min-height:46px;
  border-color:#31405f;
  background:#0b1120;
  color:#d6e0ef;
  box-shadow:none;
}
.learning-quest-menu .track-btn small,
.learning-quest-menu .stage-btn small{
  color:#9fb0c8;
}
.learning-quest-menu .track-btn.active,
.learning-quest-menu .stage-btn.active,
.learning-quest-menu .lesson-btn.active{
  border-color:#ffcf34;
  background:#ffcf34;
  color:#101829;
  box-shadow:none;
}
.learning-quest-menu #lessons{
  border-color:#31405f;
  background:#070b16;
}
.learning-quest-stage{
  min-height:640px;
  display:block;
  padding:18px;
  border-color:#31405f;
  background:#101829;
  color:#f7fbff;
  box-shadow:none;
}
.learning-quest-stage .lesson-panel{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:#f7fbff;
  box-shadow:none;
}
.learning-quest-stage .lesson-panel h2{
  margin-top:14px;
  color:#f7fbff;
  font-size:clamp(1.75rem,3vw,2.65rem);
}
.learning-quest-stage .lesson-panel h3,
.learning-quest-stage .teach-card strong,
.learning-quest-stage .example-box strong{
  color:#f7fbff;
}
.learning-quest-stage .lesson-panel p,
.learning-quest-stage .mission-steps,
.learning-quest-stage .question-grid,
.learning-quest-stage .milestone-list{
  color:#d6e0ef;
}
.learning-quest-stage .stage-goal,
.learning-quest-stage .teach-card,
.learning-quest-stage .example-box,
.learning-quest-stage .mission-steps,
.learning-quest-stage .question-grid,
.learning-quest-stage .learning-rhythm,
.learning-quest-stage .lesson-workspace,
.learning-quest-stage .progress-panel{
  border-color:#31405f;
  background:#0b1120;
  box-shadow:none;
}
.learning-quest-stage .stage-goal{
  color:#ffe58a;
  background:#151d26;
  border-color:#ffcf34;
}
.learning-quest-stage .lesson-meta span{
  border-color:#31405f;
  background:#0b1120;
  color:#c9d6e8;
}
.learning-quest-stage .lesson-meta span:first-child{
  border-color:#ffcf34;
  background:#151d26;
  color:#ffe58a;
}
.learning-quest-stage .code-lab{
  grid-template-columns:minmax(260px,.96fr) minmax(300px,1.04fr);
  gap:14px;
  align-items:stretch;
}
.learning-quest-stage .code-lab textarea,
.learning-quest-stage .answer-box,
.learning-quest-stage input{
  border-color:#34466a;
  background:#070b16;
  color:#f7fbff;
}
.learning-quest-stage .preview{
  min-height:260px;
  border-color:#34466a;
  background:#0b1120;
  color:#f7fbff;
}
.learning-quest-stage .toolbar{
  margin-top:14px;
}
.learning-quest-stage .toolbar .primary,
.learning-quest-stage .toolbar .secondary,
.learning-quest-stage .toolbar .ghost{
  box-shadow:none;
}
.learning-quest-stage .toolbar .primary{
  background:#ffcf34;
  color:#101829;
}
.learning-quest-stage .toolbar .secondary,
.learning-quest-stage .toolbar .ghost{
  border-color:#31405f;
  background:#101829;
  color:#f7fbff;
}
.learning-quest-stage .locked-note{
  border-color:#ffcf34;
  background:#151d26;
  color:#ffe58a;
}
.learning-quest-stage audio{
  width:100%;
  margin:10px 0;
}
/* v0.3.3 clean mission page: path choice belongs on the student desk, not inside the lesson. */
.clean-mission-page-v033 .learning-map-drawer,
.clean-mission-page-v033 .course-map-shell,
.clean-mission-page-v033 .learning-quest-menu,
.clean-mission-page-v033 .stage-outcome-panel,
.clean-mission-page-v033 [data-route-outcomes]{
  display:none!important;
}

.clean-mission-page-v033 .learning-quest-shell{
  grid-template-columns:minmax(0,1fr);
  width:min(1120px,calc(100% - 48px));
}

.clean-mission-page-v033 .learning-quest-stage{
  grid-column:1;
}

.clean-mission-page-v033 .learning-quest-title{
  width:min(1120px,calc(100% - 48px));
}

.clean-mission-page-v033 .learning-quest-title p{
  max-width:760px;
}

.clean-mission-page-v033 .lesson-panel{
  max-width:100%;
}
@media(max-width:1120px){
  .learning-quest-shell{
    grid-template-columns:1fr;
  }
  .learning-quest-menu{
    position:static;
    max-height:none;
  }
}
@media(max-width:760px){
  .learning-quest-title,
  .learning-quest-stage,
  .learning-quest-menu{
    padding:14px;
  }
  .learning-quest-stage .code-lab{
    grid-template-columns:1fr;
  }
}

/* v0.3.5 student-desk learning skin: all learning worlds share the Student Desk UI. */
.learning-quest-page{
  --quest-ink:#172033;
  --quest-line:#1f2c44;
  --quest-sky:#dff4ff;
  --quest-grass:#d9f6dc;
  --quest-sun:#ffcf34;
  --quest-mint:#2fa878;
  --quest-paper:#fffdf6;
  --quest-soft:#607089;
  min-height:100vh;
  background:linear-gradient(180deg,#f3fbff 0%,#fffdf6 52%,#f7fff4 100%);
  color:var(--quest-ink);
}

.learning-quest-main{
  padding:42px 0 56px;
}

.learning-quest-title{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
  padding:28px 32px;
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:rgba(255,255,255,.92);
  color:var(--quest-ink);
  box-shadow:6px 6px 0 rgba(31,44,68,.12);
}

.learning-quest-title h1{
  color:var(--quest-ink);
  text-shadow:none;
}

.learning-quest-title p{
  max-width:780px;
  color:var(--quest-soft);
}

.learning-quest-title aside{
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:var(--quest-sun);
  color:var(--quest-ink);
  box-shadow:4px 4px 0 rgba(31,44,68,.16);
}

.learning-quest-title aside span,
.learning-quest-title aside strong{
  color:var(--quest-ink);
}

.learning-map-drawer{
  border:2px solid var(--quest-line);
  background:rgba(255,255,255,.92);
  color:var(--quest-ink);
  box-shadow:6px 6px 0 rgba(31,44,68,.12);
}

.learning-map-drawer summary{
  color:var(--quest-ink);
}

.learning-map-drawer summary::after{
  color:var(--quest-ink);
}

.learning-map-drawer .course-map-shell,
.learning-map-drawer .outcome-band{
  border-color:rgba(31,44,68,.18);
  background:#fffdf6;
  color:var(--quest-ink);
  box-shadow:none;
}

.learning-map-drawer .course-map-head h2,
.learning-map-drawer .course-map-head p,
.learning-map-drawer .course-card p,
.learning-map-drawer .outcome-band p{
  color:var(--quest-soft);
}

.learning-quest-shell{
  width:min(1180px,calc(100% - 40px));
  margin:18px auto 0;
  gap:18px;
}

.learning-quest-menu,
.learning-quest-stage{
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:rgba(255,255,255,.92);
  color:var(--quest-ink);
  box-shadow:6px 6px 0 rgba(31,44,68,.12);
}

.learning-quest-menu h2{
  color:var(--quest-ink);
}

.learning-quest-menu .track-btn,
.learning-quest-menu .stage-btn,
.learning-quest-menu .lesson-btn{
  border:2px solid rgba(31,44,68,.18);
  background:#fffdf6;
  color:var(--quest-ink);
  box-shadow:none;
}

.learning-quest-menu .track-btn small,
.learning-quest-menu .stage-btn small{
  color:var(--quest-soft);
}

.learning-quest-menu .track-btn.active,
.learning-quest-menu .stage-btn.active,
.learning-quest-menu .lesson-btn.active{
  border-color:var(--quest-line);
  background:var(--quest-sun);
  color:var(--quest-ink);
}

.learning-quest-menu #lessons{
  border-color:rgba(31,44,68,.18);
  background:#fff;
}

.learning-quest-stage{
  min-height:640px;
  padding:22px;
}

.learning-quest-stage .lesson-panel{
  background:transparent;
  color:var(--quest-ink);
}

.learning-quest-stage .lesson-panel h2,
.learning-quest-stage .lesson-panel h3,
.learning-quest-stage .teach-card strong,
.learning-quest-stage .example-box strong{
  color:var(--quest-ink);
}

.learning-quest-stage .lesson-panel p,
.learning-quest-stage .mission-steps,
.learning-quest-stage .question-grid,
.learning-quest-stage .milestone-list{
  color:var(--quest-soft);
}

.learning-quest-stage .stage-goal,
.learning-quest-stage .teach-card,
.learning-quest-stage .example-box,
.learning-quest-stage .mission-steps,
.learning-quest-stage .question-grid,
.learning-quest-stage .learning-rhythm,
.learning-quest-stage .lesson-workspace,
.learning-quest-stage .progress-panel,
.voice-coach,
.child-note,
.self-check{
  border:2px solid rgba(31,44,68,.16);
  border-radius:8px;
  background:#fffdf6;
  color:var(--quest-ink);
  box-shadow:none;
}

.learning-quest-stage .stage-goal{
  border-color:var(--quest-line);
  background:#fff7cf;
  color:var(--quest-ink);
}

.learning-quest-stage .lesson-meta span{
  border:2px solid rgba(31,44,68,.18);
  background:#fff;
  color:var(--quest-soft);
}

.learning-quest-stage .lesson-meta span:first-child{
  border-color:var(--quest-line);
  background:var(--quest-sun);
  color:var(--quest-ink);
}

.learning-quest-stage .code-lab{
  gap:16px;
}

.learning-quest-stage .code-lab textarea,
.learning-quest-stage .answer-box,
.learning-quest-stage input{
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:#172033;
  color:#fff;
  box-shadow:none;
}

.learning-quest-stage .preview{
  min-height:260px;
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:linear-gradient(180deg,#dff4ff 0%,#dff4ff 62%,#d9f6dc 63%,#d9f6dc 100%);
  color:var(--quest-ink);
}

.learning-quest-stage .toolbar .primary,
.learning-quest-stage .toolbar .secondary,
.learning-quest-stage .toolbar .ghost{
  border:2px solid var(--quest-line);
  border-radius:8px;
  color:var(--quest-ink);
  box-shadow:4px 4px 0 rgba(31,44,68,.16);
}

.learning-quest-stage .toolbar .primary{
  background:var(--quest-sun);
}

.learning-quest-stage .toolbar .secondary,
.learning-quest-stage .toolbar .ghost{
  background:#fff;
}

.learning-quest-stage .locked-note{
  border:2px solid var(--quest-line);
  border-radius:8px;
  background:#fff7cf;
  color:var(--quest-ink);
}

.clean-mission-page-v033 .learning-quest-title{
  width:min(1120px,calc(100% - 48px));
}

.clean-mission-page-v033 .learning-quest-shell{
  width:min(1120px,calc(100% - 48px));
}

@media(max-width:760px){
  .learning-quest-main{
    padding:22px 0 36px;
  }
  .learning-quest-title,
  .learning-quest-stage,
  .learning-quest-menu{
    width:calc(100% - 28px);
    padding:16px;
  }
  .clean-mission-page-v033 .learning-quest-title,
  .clean-mission-page-v033 .learning-quest-shell{
    width:calc(100% - 28px);
  }
}

/* v0.3.6 compact coding mission: only brief, runner, and step checks. */
.mission-compact-v036 .learning-quest-main{
  padding:22px 0 42px;
}
.mission-compact-v036 .learning-quest-shell{
  width:auto;
  margin:0;
}
.mission-compact-v036 .learning-quest-title,
.mission-compact-v036 .learning-map-drawer,
.mission-compact-v036 .course-map-shell,
.mission-compact-v036 .learning-quest-menu,
.mission-compact-v036 #pathProgressPanel,
.mission-compact-v036 #learningRhythm,
.mission-compact-v036 #lessonWorkspace,
.mission-compact-v036 #stageOutcomePanel,
.mission-compact-v036 #portfolioExamples,
.mission-compact-v036 #premiumCoach,
.mission-compact-v036 #juniorCoach,
.mission-compact-v036 #voiceMissionCoach,
.mission-compact-v036 .lesson-focus-tabs,
.mission-compact-v036 .lesson-meta,
.mission-compact-v036 .deep-grid,
.mission-compact-v036 .example-box,
.mission-compact-v036 .teach-card:not(.quest-compact-rule-v036),
.mission-compact-v036 .answer-box{
  display:none!important;
}
.mission-compact-v036 .quest-compact-bar-v036,
.mission-compact-v036 .quest-compact-shell-v036{
  width:min(1180px,calc(100% - 40px));
  margin-left:auto;
  margin-right:auto;
}
.mission-compact-v036 .quest-compact-shell-v036{
  display:grid!important;
  grid-template-columns:minmax(240px,.72fr) minmax(420px,1.22fr) minmax(250px,.78fr)!important;
  align-items:stretch!important;
  gap:16px!important;
}
.mission-compact-v036 .quest-compact-brief-v036 #lessonGoal{
  margin:12px 0 0;
  color:#607089;
}
.mission-compact-v036 .quest-compact-rule-v036 #lessonTeach{
  margin-top:6px;
}
.mission-compact-v036 .locked-note[hidden]{
  display:none!important;
}
.mission-compact-v036 .locked-note{
  margin-top:14px;
}
.mission-compact-v036 .code-card-v022 textarea{
  min-height:240px;
  background:#172033;
  color:#fff;
}
.mission-compact-v036 .quest-compact-run-v036 label{
  color:#172033!important;
  text-shadow:none!important;
  opacity:1!important;
}
.mission-compact-v036 .preview{
  min-height:230px;
  margin:0;
  padding:14px;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:linear-gradient(180deg,#dff4ff 0%,#dff4ff 58%,#d9f6dc 59%,#d9f6dc 100%);
  color:#172033;
  box-shadow:none;
}
.mission-compact-v036 .preview pre,
.mission-compact-v036 #consoleOut{
  margin:12px 0 0;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#172033;
  color:#fff6cf;
  padding:12px;
  white-space:pre-wrap;
}
.mission-compact-v036 .run-evidence{
  display:none;
}
.mission-compact-v036 .quest-compact-steps-v036{
  margin:0;
  padding-left:22px;
  color:#607089;
  line-height:1.5;
}
.mission-compact-v036 .quest-compact-steps-v036 li{
  margin:0 0 8px;
  font-weight:850;
}
.mission-compact-v036 .quest-checklist-v022{
  margin-top:4px;
}
.mission-compact-v036 .quest-checklist-v022 li{
  display:block!important;
  min-height:58px;
  padding:12px 14px 12px 48px!important;
  border-color:#1f2c44!important;
  background:#fff;
  color:#172033!important;
  text-shadow:none!important;
  opacity:1!important;
}
.mission-compact-v036 .quest-checklist-v022 li strong,
.mission-compact-v036 .quest-checklist-v022 li span{
  color:inherit!important;
  text-shadow:none!important;
  opacity:1!important;
}
.mission-compact-v036 .quest-checklist-v022 li.done{
  background:#ebf8dd;
  color:#172033!important;
}
.mission-compact-v036 .submit-status{
  margin:0;
  color:#607089;
  font-weight:850;
}

/* v0.5.9.5 compact Chinese mission: story, voice practice, and checks only. */
.chinese-mission-compact-v071 .voice-mission-card-v071{
  display:grid;
  gap:12px;
  min-height:100%;
  padding:16px;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#fff;
}
.chinese-mission-compact-v071 .voice-phrase-v071{
  margin:0;
  padding:20px 16px;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#fff7cf;
  color:#172033;
  font-size:1.35rem;
  font-weight:900;
  line-height:1.55;
  text-align:center;
}
.chinese-mission-compact-v071 #recordingPrompt{
  margin:0;
  color:#607089;
  line-height:1.55;
}
.chinese-mission-compact-v071 .voice-mission-card-v071 audio{
  width:100%;
  min-height:42px;
}
.chinese-mission-compact-v071 .record-status-v071{
  min-height:44px;
  margin:0;
  padding:10px 12px;
  border-left:5px solid #48b98b;
  background:#eefaf5;
  color:#294c43;
  line-height:1.45;
}
.chinese-mission-compact-v071 .voice-checks-v071{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:14px;
}
.chinese-mission-compact-v071 .voice-checks-v071 .choice-row{
  display:grid;
  grid-template-columns:20px 1fr;
  align-items:start;
  gap:9px;
  margin:0;
  padding:10px;
  border:2px solid #1f2c44;
  border-radius:6px;
  background:#fff;
  color:#172033;
  font-weight:800;
  line-height:1.4;
}
.chinese-mission-compact-v071 .voice-checks-v071 input{
  width:18px;
  height:18px;
  margin:1px 0 0;
  accent-color:#2d9b72;
}
.chinese-mission-compact-v071 .quest-button-row-v022{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
@media(max-width:700px){
  .chinese-mission-compact-v071 .quest-button-row-v022{grid-template-columns:1fr}
  .chinese-mission-compact-v071 .voice-phrase-v071{font-size:1.15rem}
}

/* v0.6.0 heritage Chinese literacy missions: reading and writing are the core evidence. */
.chinese-literacy-compact-v060 .literacy-mission-card-v060{
  display:grid;
  gap:11px;
  min-height:100%;
  padding:16px;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#fff;
}
.chinese-literacy-compact-v060 .literacy-reading-v060{
  margin:0;
  padding:18px 16px;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#fff7cf;
  color:#172033;
  font-size:1.3rem;
  font-weight:900;
  line-height:1.65;
}
.chinese-literacy-compact-v060 .literacy-reading-prompt-v060,
.chinese-literacy-compact-v060 .literacy-writing-prompt-v060{
  margin:0;
  color:#42526b;
  line-height:1.5;
}
.chinese-literacy-compact-v060 .literacy-answer-label-v060{
  margin-top:3px;
  color:#172033!important;
  font-weight:950;
}
.mission-compact-v036.chinese-literacy-compact-v060 .literacy-answer-v060{
  display:block!important;
  min-height:126px;
  resize:vertical;
  border:2px solid #1f2c44;
  border-radius:8px;
  padding:12px 13px;
  background:#f7fbff;
  color:#172033;
  font-size:1.05rem;
  line-height:1.6;
  box-shadow:inset 0 0 0 3px rgba(88,185,232,.1);
}
.mission-compact-v036.chinese-literacy-compact-v060 .literacy-answer-v060:focus{
  outline:3px solid rgba(255,207,52,.8);
  outline-offset:2px;
}
.chinese-literacy-compact-v060 .literacy-hint-v060{
  display:block;
  min-height:20px;
  color:#607089;
  line-height:1.45;
}
.chinese-literacy-compact-v060 .quest-button-row-v022{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:2px 0 0;
}
.chinese-literacy-compact-v060 .quest-button-row-v022 button{
  min-width:0;
  padding:8px 10px;
  line-height:1.25;
}
.chinese-literacy-compact-v060 .literacy-status-v060{
  min-height:48px;
  margin:0;
  padding:10px 12px;
  border-left:5px solid #58b9e8;
  background:#eef8ff;
  color:#29485c;
  font-weight:800;
  line-height:1.45;
}
.chinese-literacy-compact-v060 .literacy-status-v060.passed{
  border-left-color:#2d9b72;
  background:#eefaf5;
  color:#245545;
}
.chinese-literacy-compact-v060 .literacy-status-v060.needs-work{
  border-left-color:#e39b22;
  background:#fff7df;
  color:#654510;
}
.chinese-literacy-compact-v060 .literacy-checks-v060{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:14px;
}
.chinese-literacy-compact-v060 .literacy-checks-v060 .choice-row{
  display:grid;
  grid-template-columns:20px 1fr;
  align-items:start;
  gap:9px;
  margin:0;
  padding:10px;
  border:2px solid #1f2c44;
  border-radius:6px;
  background:#fff;
  color:#172033;
  font-weight:800;
  line-height:1.4;
}
.chinese-literacy-compact-v060 .literacy-checks-v060 input{
  width:18px;
  height:18px;
  margin:1px 0 0;
  accent-color:#2d9b72;
}
.chinese-literacy-compact-v060 .quest-compact-steps-v036 li{
  padding:7px 8px;
  border-left:4px solid #ccd5e2;
  background:#f7f9fc;
  color:#526179;
  transition:background .15s ease,border-color .15s ease;
}
.chinese-literacy-compact-v060 .quest-compact-steps-v036 li.done{
  border-left-color:#2d9b72;
  background:#ebf8dd;
  color:#172033;
}
@media(max-width:700px){
  .chinese-literacy-compact-v060 .quest-button-row-v022{grid-template-columns:1fr}
  .chinese-literacy-compact-v060 .literacy-reading-v060{font-size:1.12rem;padding:14px}
}
@media(max-width:720px){
  .mission-compact-v036 .quest-compact-bar-v036,
  .mission-compact-v036 .quest-compact-shell-v036{
    width:calc(100% - 28px);
  }
}
@media(max-width:900px){
  .mission-compact-v036 .quest-compact-shell-v036{
    grid-template-columns:1fr!important;
  }
}

/* v0.5.7 runtime evidence and Scratch mission workspace. */
.scratch-mission-editor-v057{
  position:relative;
  isolation:isolate;
  contain:paint;
  width:100%;
  height:330px;
  overflow:hidden;
  border:2px solid #1f2c44;
  border-radius:8px;
  background:#f7fbff;
}
.scratch-mission-editor-v057[hidden]{display:none!important}
.scratch-mission-editor-v057 .blocklyToolboxDiv{background:#f7f9ff;border-right:1px solid #cbd5e1}
.scratch-mission-editor-v057 .blocklyTreeLabel{font:800 12px/1.2 system-ui,sans-serif;color:#172033}
.scratch-mission-editor-v057 .blocklyMainBackground{stroke:none!important}
.scratch-fallback-note-v057{padding:10px 12px;background:#fff7cf;color:#172033;font-weight:800}
.scratch-fallback-stack-v057{display:grid;gap:8px;padding:14px;overflow:auto;max-height:276px}
.scratch-fallback-block-v057{padding:10px 12px;border:2px solid #1f2c44;border-radius:6px;color:#fff;font-weight:850;cursor:grab;background:#3f8bd8}
.scratch-fallback-block-v057.event{background:#e0a51d}
.scratch-fallback-block-v057.looks{background:#7b61d1}
.scratch-fallback-block-v057.control{background:#e28b21}
.scratch-fallback-block-v057.data{background:#c34fa0}

.runtime-empty-v057{min-height:200px;display:grid;place-content:center;text-align:center;gap:8px;color:#42526b}
.runtime-empty-v057>span{width:54px;height:54px;display:grid;place-items:center;margin:auto;border:2px solid #1f2c44;border-radius:8px;background:#172033;color:#ffd447;font:900 20px/1 ui-monospace,monospace}
.runtime-empty-v057>strong{font-size:18px;color:#172033}
.runtime-empty-v057 p{margin:0}
.runtime-error-v057{min-height:200px;padding:18px;border:2px solid #9e2f3f;border-radius:8px;background:#fff3f4;color:#641c29}
.runtime-error-v057>span{display:inline-block;padding:4px 8px;border-radius:5px;background:#9e2f3f;color:#fff;font-size:12px;font-weight:900;text-transform:uppercase}
.runtime-error-v057>strong{display:block;margin:12px 0 8px;font-size:18px}
.runtime-error-v057 ol{margin:0;padding-left:22px}
.runtime-error-v057 li{margin:7px 0}
.runtime-error-v057 li b{margin-right:8px}
.runtime-result-v057{display:grid;gap:10px;color:#172033}
.runtime-result-v057>header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.runtime-result-v057>header>div{display:grid;gap:5px}
.runtime-result-v057>header strong{font-size:18px}
.runtime-mode-v057,.runtime-status-v057{display:inline-flex;width:max-content;padding:4px 7px;border:1px solid #1f2c44;border-radius:5px;background:#fff;font-size:10px;font-weight:900;text-transform:uppercase}
.runtime-status-v057{background:#dff5d8;color:#1f5c36;border-color:#2d7a4e}
.runtime-visual-v057{min-height:112px;padding:12px;border:2px solid #1f2c44;border-radius:8px;background:#fff}
.runtime-terminal-v057{max-height:170px;overflow:auto!important;margin:0!important;font-size:12px!important}
.runtime-memory-v057,.runtime-inventory-v057,.runtime-metrics-v057,.runtime-evidence-grid-v057{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px}
.runtime-memory-v057>div,.runtime-inventory-v057>div,.runtime-metrics-v057>span,.runtime-evidence-grid-v057>div{min-height:58px;padding:9px;border:2px solid #1f2c44;border-radius:6px;background:#f7f9ff;display:grid;gap:5px}
.runtime-memory-v057 span,.runtime-metrics-v057 span,.runtime-evidence-grid-v057 span{font-size:10px;font-weight:900;text-transform:uppercase;color:#607089}
.runtime-memory-v057 strong,.runtime-inventory-v057 strong{overflow-wrap:anywhere}
.runtime-inventory-v057>div{background:#fff7cf}
.runtime-inventory-v057>div>span{width:22px;height:22px;display:grid;place-items:center;border-radius:4px;background:#172033;color:#fff;font-size:10px}
.runtime-flow-v057{display:flex;align-items:center;gap:8px;overflow-x:auto;padding:8px 2px}
.runtime-flow-v057>div{min-width:88px;padding:10px 8px;border:2px solid #1f2c44;border-radius:6px;background:#eef7ff;text-align:center}
.runtime-flow-v057>div:not(:last-child)::after{content:'>';margin-left:18px;color:#e14f5d;font-weight:900}
.runtime-flow-v057 span{display:block;font-size:10px;color:#607089}
.runtime-evidence-grid-v057>div.ready{background:#e8f8df;border-color:#2d7a4e}
.runtime-evidence-grid-v057>div.missing{background:#fff3d2;border-color:#bb7a12}
.runtime-robot-v057{display:grid;gap:10px}
.robot-track-v057{height:58px;border-bottom:6px solid #4f9a63;background:linear-gradient(#bce8ff 0 58%,#e9f7dc 58%)}
.robot-unit-v057{display:grid;place-items:center;width:48px;height:40px;transform:translate(58px,14px);border:2px solid #1f2c44;border-radius:6px;background:#ffd447;color:#172033;font:900 11px/1 system-ui}
.runtime-console-icon-v057{width:58px;height:58px;display:grid;place-items:center;margin:auto;border-radius:8px;background:#172033;color:#ffd447;font:900 20px/1 ui-monospace,monospace}
.scratch-speech-v057{position:absolute;top:14px;right:14px;max-width:68%;padding:8px 10px;border:2px solid #1f2c44;border-radius:8px;background:#fff;color:#172033;font-weight:850;line-height:1.3}
.scratch-speech-v057::after{content:'';position:absolute;right:18px;bottom:-8px;width:12px;height:12px;border-right:2px solid #1f2c44;border-bottom:2px solid #1f2c44;background:#fff;transform:rotate(45deg)}

@media(max-width:1100px) and (min-width:901px){
  .mission-compact-v036 .quest-compact-shell-v036{grid-template-columns:minmax(210px,.68fr) minmax(370px,1.2fr) minmax(210px,.68fr)!important;gap:12px!important}
  .mission-compact-v036 .quest-compact-bar-v036,.mission-compact-v036 .quest-compact-shell-v036{width:calc(100% - 24px)}
  .mission-compact-v036 .quest-checklist-v022 li{padding:10px 10px 10px 40px!important}
}

/* v0.5.8 QA fixes: gated submissions, lesson-specific visuals, and stable Scratch drag. */
.runtime-locked-v058{min-height:230px;display:grid;place-content:center;gap:10px;padding:24px;text-align:center;color:#172033}
.runtime-locked-v058>span{display:grid;place-items:center;width:54px;height:54px;margin:auto;border:2px solid #1f2c44;border-radius:8px;background:#ffd447;font-weight:950}
.runtime-locked-v058>strong{font-size:1.15rem}
.runtime-locked-v058 p{max-width:420px;margin:0;color:#607089;line-height:1.5}
.locked-note p{margin:8px 0 14px;line-height:1.45}
.locked-note .primary{width:100%}
.runtime-status-v057.partial{border-color:#b97816;background:#fff2c9;color:#714600}
.runtime-status-v057.passed{border-color:#2d7a4e;background:#dff5d8;color:#1f5c36}
.runtime-story-v058{display:grid;gap:8px}
.runtime-story-v058>div{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:9px;min-height:46px;padding:8px 10px;border:2px solid #1f2c44;border-radius:6px;background:#f7f9ff}
.runtime-story-v058 span{display:grid;place-items:center;width:24px;height:24px;border-radius:4px;background:#172033;color:#ffd447;font-size:11px;font-weight:950}
.runtime-story-v058 strong{overflow-wrap:anywhere;font-size:.88rem}
.runtime-game-scene-v058{position:relative;min-height:120px;overflow:hidden;border-bottom:8px solid #4f9a63;background:linear-gradient(#bce8ff 0 62%,#e9f7dc 62%)}
.runtime-player-v058{position:absolute;left:18%;bottom:10px;display:grid;place-items:center;width:48px;height:48px;border:2px solid #1f2c44;border-radius:8px;background:#ff6b5f;color:#fff;font-weight:950;box-shadow:4px 4px 0 rgba(31,44,68,.16)}
.runtime-scene-message-v058{position:absolute;top:12px;right:12px;max-width:62%;padding:8px 10px;border:2px solid #1f2c44;border-radius:7px;background:#fff;font-size:.82rem;font-weight:850}
.runtime-web-v058{display:grid;gap:10px}
.runtime-web-v058 iframe{width:100%;height:240px;border:2px solid #1f2c44;border-radius:8px;background:#fff}
.scratch-mission-editor-v057{touch-action:none;overscroll-behavior:contain}
.scratch-mission-editor-v057 .blocklySvg{touch-action:none}
.scratch-fallback-block-v057.dragging{opacity:.7;transform:scale(.98)}
.scratch-stage-v058{position:relative;overflow:hidden}
.scratch-stage-data-v058{position:absolute;left:10px;top:10px;display:flex;gap:6px;z-index:2}
.scratch-stage-data-v058 span{padding:4px 7px;border:1px solid #1f2c44;border-radius:5px;background:rgba(255,255,255,.9);font:850 11px/1.2 ui-monospace,monospace}
.scratch-sprite-v058{transition:transform .6s ease;background:#ff6b5f}

.literacy-reading-check-v061{display:grid;gap:8px;margin:14px 0;padding:12px;border:1px solid #31415f;border-radius:7px;background:#111b30}
.literacy-reading-check-v061[hidden],.literacy-handwriting-v061[hidden]{display:none}
.quest-button-row-v022 button[hidden]{display:none}
.literacy-reading-check-v061 legend{padding:0 6px;color:#ffd447;font-weight:900}
.literacy-reading-check-v061 p{margin:0;color:#f5f7fb}
.literacy-reading-options-v061{display:flex;flex-wrap:wrap;gap:8px}
.literacy-reading-options-v061 button{min-height:38px}
.literacy-mini-status-v061{min-height:1.35em;color:#aebbd2;font-size:.84rem;font-weight:750}
.literacy-mini-status-v061.passed{color:#6ee7a8}
.literacy-mini-status-v061.needs-work{color:#ff9b8f}
.literacy-handwriting-v061{display:grid;gap:9px;margin:14px 0;padding:12px;border:1px solid #31415f;border-radius:7px;background:#f7fbff;color:#172036}
.literacy-handwriting-v061>div:first-child{display:flex;justify-content:space-between;gap:12px}
.literacy-handwriting-v061 canvas{display:block;width:100%;height:150px;border:2px dashed #7083a3;border-radius:6px;background:#fff;touch-action:none;cursor:crosshair}
.literacy-handwriting-v061.disabled{opacity:.55;pointer-events:none}
.locked-note a{display:inline-block;margin-top:8px;color:#172036;font-weight:950;text-decoration:underline}
.literacy-locked-preview-v061 .learning-quest-shell{grid-template-columns:minmax(0,760px);justify-content:center}
.literacy-locked-preview-v061 .chinese-literacy-run-v060,.literacy-locked-preview-v061 .quest-compact-check-v036{display:none}
.literacy-locked-preview-v061 .quest-compact-brief-v036>.quest-chip-v022,.literacy-locked-preview-v061 #lessonStory,.literacy-locked-preview-v061 .quest-compact-goal-v040,.literacy-locked-preview-v061 .quest-compact-rule-v036{display:none}

@media(max-width:700px){
  .quest-header-v022{min-height:0!important;display:grid!important;grid-template-columns:1fr auto!important;align-items:center!important;gap:8px!important;padding:8px 12px!important}
  .quest-header-v022 .brand{min-width:0}
  .quest-header-v022 .brand strong{font-size:.86rem;white-space:nowrap}
  .quest-header-v022 .brand{grid-column:1;grid-row:1}
  .quest-header-v022 nav{grid-column:1 / -1;display:flex!important;width:100%;gap:6px;overflow-x:auto;flex-wrap:nowrap;padding:2px 0 4px}
  .quest-header-v022 nav a{min-height:34px;flex:0 0 auto;padding:0 9px;font-size:.75rem}
  .quest-header-v022 .header-actions{gap:6px;flex-wrap:nowrap}
  .quest-header-v022 .header-actions{grid-column:2;grid-row:1}
  .quest-header-v022 .header-actions .solid{display:inline-flex;min-height:38px;padding:0 8px;font-size:.72rem}
  .quest-header-v022 .lang-toggle{padding:8px 10px}
  .mission-compact-v036 .quest-compact-bar-v036{padding:12px 14px;margin-bottom:10px}
  .mission-compact-v036 .quest-compact-bar-v036 aside{display:none}
  .mission-track-strip-v038{gap:8px;margin-bottom:10px;padding:9px 10px}
  .mission-track-strip-v038>div:first-child{display:none}
  .mission-track-buttons-v038{width:100%;padding-bottom:4px}
  .mission-track-buttons-v038:empty{display:none}
  .mission-track-strip-v038{grid-template-columns:1fr!important}
  .mission-lesson-controls-v038{width:100%!important;justify-content:space-between}
  .mission-lesson-controls-v038 span{flex:1}
  .mission-track-pill-v038{min-width:92px;padding:8px 10px}
  .mission-track-pill-v038 span{display:none}
  .mission-fun-hud-v041{margin-bottom:10px;padding:10px}
  .mission-reward-v041 em{display:none}
  .mission-compact-v036 .quest-compact-shell-v036{gap:10px}
  .mission-compact-v036 .quest-compact-brief-v036,.mission-compact-v036 .quest-compact-run-v036,.mission-compact-v036 .quest-compact-check-v036{padding:14px}
  .mission-compact-v036 .quest-compact-brief-v036{max-height:none;overflow:visible}
  .scratch-mission-editor-v057{height:360px}
  .literacy-reading-options-v061{display:grid;grid-template-columns:1fr}
  .literacy-handwriting-v061 canvas{height:130px}
}

/* v0.6.9 keep Chinese reading and writing text inside its frames. */
.chinese-literacy-compact-v060 .literacy-mission-card-v060,
.chinese-literacy-compact-v060 .literacy-mission-card-v060 *{min-width:0}
.chinese-literacy-compact-v060 .literacy-reading-v060,
.chinese-literacy-compact-v060 .literacy-reading-prompt-v060,
.chinese-literacy-compact-v060 .literacy-writing-prompt-v060,
.chinese-literacy-compact-v060 .quest-compact-steps-v036 li,
.chinese-literacy-compact-v060 .literacy-checks-v060 .choice-row{overflow-wrap:anywhere;word-break:normal}
.chinese-literacy-compact-v060 .literacy-reading-check-v061{margin:14px 0;padding:12px;overflow:hidden}
.chinese-literacy-compact-v060 .literacy-reading-title-v070{width:max-content;max-width:100%;margin:0 0 2px;padding:7px 10px;border:1px solid #445473;border-radius:5px;background:#1b2740;color:#ffd447;font-weight:900;line-height:1.15;white-space:normal}
.chinese-literacy-compact-v060 .literacy-reading-options-v061 button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.chinese-literacy-compact-v060 .literacy-handwriting-v061>div:first-child{align-items:flex-start;flex-wrap:wrap}
.chinese-literacy-compact-v060 .literacy-handwriting-v061>div:first-child span{margin-left:auto;overflow-wrap:anywhere}
@media(max-width:700px){
  .chinese-literacy-compact-v060 .literacy-reading-v060{line-height:1.55}
}
