:root{--green:#58b52b;--green-dark:#46931f;--ink:#3c4640;--muted:#929a95;--line:#e7ebe5;--blue:#1cb0f6;--font:ui-rounded,'SF Pro Rounded',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff;font:15px/1.55 var(--font);-webkit-font-smoothing:antialiased}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid #1cb0f6;outline-offset:4px}button:disabled{cursor:default}button{touch-action:manipulation}h1,h2,p{margin-top:0}h1{font-size:29px;line-height:1.35;letter-spacing:-.8px}h2{font-size:19px;line-height:1.4}p{line-height:1.8}svg{display:block}button{transition:background .15s,transform .15s,box-shadow .15s}.loading{padding:15vh;text-align:center}.sidebar{width:238px;position:fixed;inset:0 auto 0 0;border-right:2px solid var(--line);padding:36px 20px;display:flex;flex-direction:column;background:#fff;z-index:5}.brand{display:flex;align-items:center;gap:9px;text-align:left;padding:0 9px 36px;font-size:25px;font-weight:900;letter-spacing:1px;color:#58a932}.brand>span{font-size:37px}.brand small{display:block;color:#a6b29d;font-size:9px;letter-spacing:1.1px;margin-top:3px}.sidebar nav{display:grid;gap:13px}.nav-item{display:flex;align-items:center;gap:17px;width:100%;padding:11px 13px;border:2px solid transparent;border-radius:13px;font-size:16px;letter-spacing:.6px;color:#778078;text-align:left}.nav-item:hover{background:#f8faf6}.nav-item.active{background:#edf7e8;border-color:#c5e5b1;color:#58a333}.nav-icon{width:28px;font-size:29px;line-height:1;text-align:center;font-weight:900;color:#9da7b4;text-shadow:0 2px #e2e6ea}.nav-icon.learn{color:#72b737}.nav-icon.practice{color:#c086e7}.nav-icon.book{color:#51b6e1}.nav-icon.quests{color:#f5b331}.nav-icon.profile{color:#f8a06e}.nav-item i{font-size:11px;font-style:normal;background:#f88169;color:#fff;border-radius:20px;padding:0 5px;margin-left:auto}.sidebar-bottom{margin-top:auto}.small-corn{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:22px 0 14px;font-size:11px;color:#a3ac9b}.small-corn b{font-weight:500;color:#7c8972}.tiny{font-size:10px;color:#adb4a8;text-align:center}.workspace{margin-left:238px}.topbar{height:94px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 auto;padding:0 44px;border-bottom:1px solid #f0f2ee;max-width:1270px}.course-selector{display:flex;align-items:center;gap:13px;font-size:14px}.python-mark{display:grid;place-items:center;width:34px;height:30px;background:#e9f3fc;color:#398fc7;font-weight:850;position:relative;border-radius:8px;font-family:monospace;border-bottom:4px solid #f6cb4b}.chevron{font-size:20px;color:#acb3ad;margin-left:10px}.stats{display:flex;align-items:center;gap:28px}.stats button{display:flex;align-items:center;gap:8px;font-size:16px}.stats button:nth-child(1){color:#f29739}.stats button:nth-child(2){color:#d9ad29}.stats button:nth-child(3){color:#1cb0f6}.stats span{font-size:23px}.stats .sound{color:#a0a99e;font-size:23px}.layout{display:grid;grid-template-columns:minmax(360px,620px) 292px;gap:42px;max-width:1140px;padding:32px 44px 60px;margin:0 auto}.eyebrow{font-size:11px;font-weight:600;color:#9ba692;letter-spacing:.6px;display:flex;justify-content:space-between;margin-bottom:18px}.eyebrow>span{letter-spacing:0;font-weight:400;color:#a0a79b}.unit-banner{background:var(--unit);border-radius:16px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 23px;color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--unit),#000 13%)}.unit-select{padding:0;font-size:11px;font-weight:750;color:#ffffffc9;letter-spacing:1.1px}.unit-select>span{padding-left:7px}.unit-banner h1{font-size:25px;letter-spacing:0;margin:7px 0 5px;font-weight:850}.unit-banner p{font-size:12px;margin:0;color:#ffffffd9}.guide-button{border:2px solid #ffffff60;box-shadow:0 3px 0 #00000012;display:flex;align-items:center;gap:8px;border-radius:11px;padding:10px 12px;white-space:nowrap;font-weight:750;font-size:19px}.guide-button span{font-size:12px}.guide-button:hover{background:#ffffff22}.path-intro{display:flex;align-items:center;justify-content:center;gap:10px;margin:31px 0 3px;font-size:12px}.path-intro>span{font-size:10px;font-weight:800;color:#7fad60;background:#eff6e8;padding:3px 7px;border-radius:5px;letter-spacing:1px}.path-intro b{font-size:12px;font-weight:600;color:#89937e}.path-intro small{font-size:11px;color:#aeb7a6;margin-left:6px}.learning-path{position:relative;height:600px;max-width:550px;margin:auto}.path-dots{position:absolute;left:calc(50% - 65px);top:100px;width:150px;height:310px;border:9px dotted #f0f2eb;border-left:0;transform:rotate(-20deg);border-radius:48%}.path-stop{position:absolute;display:flex;align-items:center;flex-direction:column;z-index:2}.path-stop>strong{font-size:13px;margin-top:14px;color:#77826d}.path-stop>small{font-size:10px;color:#a7afa0;margin-top:3px}.stop-0{left:calc(50% - 67px);top:57px}.stop-1{left:calc(50% - 152px);top:222px}.stop-2{left:calc(50% - 70px);top:389px}.level{width:83px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--unit);color:#fff;box-shadow:0 8px 0 color-mix(in srgb,var(--unit),#000 18%),0 12px 0 7px #f3f7ee;border:8px solid #ffffff35;position:relative}.level.current:before{content:'';position:absolute;inset:-15px;border:4px solid #d5ecc3;border-bottom-color:transparent;border-radius:50%}.level:hover{transform:translateY(-3px)}.level:active{transform:translateY(6px);box-shadow:0 2px 0 color-mix(in srgb,var(--unit),#000 18%)}.level.locked{background:#e9ece4;color:#bdc5b5;box-shadow:0 7px 0 #d5dbce,0 12px 0 7px #fafbf7;border-color:#ffffff35}.level.done{background:#f4c73d;box-shadow:0 7px 0 #d9a72c;color:white}.start-bubble{position:absolute;top:-45px;background:white;border:2px solid #e6eddf;color:#58a932;font-weight:800;font-size:12px;border-radius:11px;padding:7px 13px;white-space:nowrap;animation:bob 2.8s ease-in-out infinite}.start-bubble:after{content:'';position:absolute;width:9px;height:9px;background:#fff;border-bottom:2px solid #e6eddf;border-right:2px solid #e6eddf;transform:rotate(45deg);left:45%;bottom:-7px}.path-character{position:absolute;left:calc(50% + 57px);top:174px;transform:rotate(5deg)}.path-character>.corn{animation:bob 3.5s ease-in-out infinite}.path-character>div{font-size:11px;text-align:center;color:#a5ac99;line-height:1.7;margin-top:7px;transform:rotate(-5deg)}.sprout{position:absolute;color:#c6d9af;font-size:22px}.sprout.one{left:-14px;top:70px}.sprout.two{right:0;top:1px;font-size:15px}.path-code{position:absolute;top:405px;left:40px;font:700 33px monospace;color:#e1e8d6;transform:rotate(-9deg)}.path-code small{display:block;font-size:8px;letter-spacing:1px;margin-top:7px}.chest{position:absolute;top:514px;left:calc(50% + 37px);font-size:43px;filter:saturate(.5)}.chest span{display:block;font-size:10px;color:#a9b39a;margin-top:3px}.next-unit{display:flex;align-items:center;gap:16px;color:#a3ad99;font-size:12px;margin:0 0 22px;white-space:nowrap}.line{height:2px;background:#edf0e8;flex:1}.next-preview{border:2px solid #edf0e8;border-radius:14px;display:flex;width:100%;align-items:center;padding:17px 20px;gap:18px;text-align:left;background:#fdfefa}.next-preview>span:first-child{width:42px;height:42px;background:#eff4e9;color:#c0cdb1;font-size:27px;display:grid;place-items:center;border-radius:10px}.next-preview b{font-size:13px;color:#98a58c}.next-preview p{font-size:11px;color:#b1baa6;margin:4px 0 0}.next-preview>span:last-child{margin-left:auto;color:#b3bfaa;font-size:23px}.path-footnote{text-align:center;font-size:10px;color:#b0b8a8;margin-top:28px}.rightbar{padding-top:36px;display:grid;align-content:start;gap:22px}.side-card{border:2px solid var(--line);border-radius:17px;padding:22px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-head h2{margin:0;font-size:17px}.card-head>button{font-size:10px;white-space:nowrap;color:#48a7d2;font-weight:800;padding:0}.quest-line{display:flex;align-items:center;gap:17px;margin-top:25px}.quest-icon{font-size:33px;width:34px;text-align:center}.quest-line>div{flex:1}.quest-line b{font-size:12px;font-weight:650}.progress-track{height:12px;overflow:hidden;border-radius:30px;background:#ecefe8}.progress-track>div{height:100%;background:#89cd42;border-radius:30px;transition:width .3s}.quest-line .progress-track{margin-top:8px;height:11px}.quest-line small{display:block;text-align:center;font-size:9px;color:#a1aa96;line-height:1.2;margin-top:4px}.streak-card p{font-size:11px;color:#9ba38e;margin:13px 0 18px}.week{display:flex;justify-content:space-between;gap:6px}.week>div{text-align:center}.week small{font-size:10px;color:#a9b29f}.week span{display:grid;place-items:center;background:#f0f2eb;width:25px;height:25px;border-radius:50%;color:#c9d1be;margin-top:7px;font-size:21px}.week .lit{background:#ffa632;color:#fff;font-size:14px}.streak-note{display:block;font-size:10px;color:#99a48c;text-align:center;margin-top:16px;font-weight:500}.journey{background:#fafcf6;border-color:#e7eddc}.mini-tag{color:#8fab6b;font-size:9px;font-weight:700;letter-spacing:1px}.journey h2{font-size:17px;margin:10px 0}.journey p{font-size:11px;color:#9ba78b;line-height:1.9}.mini-route{display:flex;justify-content:space-between;font-size:10px;margin:17px 0 23px;color:#7b955e;align-items:center}.mini-route span{border:1px solid #e2ead5;background:#fff;padding:4px 9px;border-radius:5px}.mini-route i{font-style:normal;color:#bfcaaf}.outline{display:inline-flex;align-items:center;justify-content:center;border:2px solid #e1e8d9;box-shadow:0 3px 0 #e1e8d9;border-radius:10px;min-height:39px;padding:8px 15px;font-size:12px;font-weight:750;color:#7b985f;background:#fff}.outline:hover{background:#f7faf3}.journey .outline{width:100%;font-size:11px}.right-footer{text-align:center;color:#b0b8a9;font-size:10px;line-height:2.3}.right-footer span{font-size:9px}.mobile-nav{display:none}.page-heading{padding-top:8px;margin-bottom:30px}.page-heading h1{margin-bottom:12px;font-size:27px}.page-heading p{font-size:13px;color:#8c9784}.practice-hero{display:flex;align-items:center;gap:25px;background:#f0f8e8;padding:20px 24px;border-radius:20px;margin:30px 0}.practice-hero h2{font-size:19px}.practice-hero p{font-size:12px;color:#8d9e7c;margin:0}.feature-list{display:grid;gap:17px}.feature-list>button,.book-list>button{display:flex;align-items:center;gap:20px;padding:23px;border:2px solid var(--line);border-bottom-width:4px;border-radius:16px;text-align:left}.feature-list>button:hover,.book-list>button:hover{background:#f9fbf6}.feature-list>button>span{font-size:38px}.feature-list h2,.book-list h2{margin:0 0 5px;font-size:17px}.feature-list p,.book-list p{font-size:12px;color:#99a18f;margin:0}.feature-list>button>b,.book-list>button>b{margin-left:auto;font-size:25px;color:#b6bfa9}.book-list{display:grid;gap:13px}.book-list>button{padding:16px 19px;gap:17px;width:100%}.book-list>button>span{padding:9px 12px;border-radius:10px;color:white;font-weight:800}.book-list h2{font-size:15px}.text-link{display:inline-block;color:#299ed0;font-size:13px;margin-top:24px}.quests-hero{text-align:center;background:#fffae9;border-radius:18px;padding:25px}.quests-hero>span{font-size:45px}.quests-hero h2{margin:10px 0 3px}.quests-hero p{margin:0;color:#baa878;font-size:12px}.quest-full{display:flex;align-items:center;gap:18px;border-bottom:2px solid var(--line);padding:25px 4px}.quest-full>span{font-size:35px}.quest-full>div{flex:1}.quest-full h2{font-size:16px;margin-bottom:5px}.quest-full p{font-size:12px;color:#9ba58f;margin-bottom:13px}.quest-full small{font-size:10px;color:#aab19f}.quest-full>b{font-size:25px;color:#79b33d}.quests-hero~.primary{margin-top:25px}.primary{background:#58b52b;border:0;border-bottom:4px solid #41921d;color:#fff;padding:12px 27px;border-radius:12px;font-size:14px;font-weight:800;letter-spacing:.5px;min-height:48px}.primary:hover{background:#64c136}.primary:active{transform:translateY(3px);border-bottom-width:1px}.primary:disabled{background:#e8ece4;border-color:#dce2d7;color:#abb5a2;transform:none}.profile-hero{text-align:center;padding:15px 0 22px}.profile-hero .corn{margin:auto}.profile-hero h1{font-size:25px;margin:20px 0 9px}.profile-hero p{font-size:13px;color:#9ca58f}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--line);border-radius:16px;padding:20px 5px}.profile-stats>div{text-align:center;border-right:1px solid var(--line)}.profile-stats>div:last-child{border:0}.profile-stats b{display:block;font-size:25px;color:#80b946}.profile-stats span{font-size:11px;color:#98a28c}.section-title{margin-top:30px}.badges{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:28px}.badge{border:2px solid var(--line);border-radius:16px;padding:25px 15px;text-align:center;filter:grayscale(1);opacity:.55}.badge.earned{filter:none;opacity:1;border-color:#d5e8bd;background:#fafdf5}.badge>span{display:block;font-size:41px;margin-bottom:12px}.badge p{font-size:11px;margin:7px 0;color:#8f9c81}.badge small{font-size:10px;color:#6c9e3d}.muted{font-size:12px;color:#9ba58f;line-height:1.8}.side-card>.muted{margin-bottom:0;margin-top:16px}dialog{padding:0;border:2px solid #e6ebdf;border-radius:22px;color:var(--ink);width:560px;max-width:calc(100% - 30px);max-height:90dvh;box-shadow:0 20px 80px #2d411f20}dialog::backdrop{background:#28342666;backdrop-filter:blur(4px)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:22px 26px;border-bottom:2px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}.modal-head h2{margin:0;font-size:21px}.modal-head p{font-size:12px;color:#9ba58e;margin:5px 0 0}.modal-head button{font-size:30px;color:#a6b09b;line-height:1}.unit-list{display:grid;gap:10px;padding:20px}.unit-list>button{display:flex;align-items:center;gap:15px;text-align:left;border:2px solid var(--line);border-radius:12px;padding:13px}.unit-list>button.selected{background:#f1f8e9;border-color:#b9da94}.unit-list>button>span{color:#fff;border-radius:9px;min-width:36px;text-align:center;padding:5px}.unit-list small{display:block;color:#9ba58f;font-size:10px;margin-top:3px}.unit-list em{margin-left:auto;font-size:12px;color:#aab39f;font-style:normal}.guide-content{padding:27px}.guide-content>p{font-size:14px;color:#7e8e70}.guide-content video{width:100%;border-radius:13px;background:#f4f7ee}.guide-content h1{font-size:26px}.flow{display:flex;align-items:center;gap:7px;margin:26px 0;flex-wrap:wrap}.flow>span{flex:1;text-align:center;background:#f1f8e9;border:1px solid #dce9cf;padding:14px 8px;border-radius:10px;min-width:78px;font-size:12px;color:#709253;font-weight:650}.flow>i{font-style:normal;color:#b5c6a5}.exit-confirm{padding:32px;text-align:center}.exit-confirm>.corn{margin:auto}.exit-confirm h2{margin-top:18px}.exit-confirm p{font-size:13px;color:#95a086}.exit-confirm>.primary{width:100%;margin-top:12px}.exit-confirm>.plain{display:block;margin:15px auto 0}.plain{font-size:12px;font-weight:650;color:#9aa88e;padding:8px}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);padding:12px 22px;max-width:90vw;white-space:normal;color:#fff;background:#3e5135;box-shadow:0 4px 20px #0002;border-radius:13px;z-index:100;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-size:13px;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}.lesson-screen{min-height:100dvh;padding-bottom:140px}.lesson-top{max-width:1050px;margin:auto;display:flex;align-items:center;gap:25px;padding:40px 32px}.lesson-top>button{font-size:30px;color:#acb5a4;line-height:1}.lesson-top>.progress-track{flex:1;height:17px}.lesson-top>span{display:flex;align-items:center;gap:8px;font-size:23px;white-space:nowrap}.lesson-top b{font-size:12px;color:#9fac90}.lesson-body{max-width:760px;margin:35px auto;padding:0 30px}.lesson-kicker{font-size:12px;color:#9eae8d;letter-spacing:1px;font-weight:700;margin:0 0 20px;display:flex;justify-content:space-between}.lesson-body h1{font-size:28px;margin-bottom:24px}.lesson-title{display:flex;gap:35px;align-items:center}.lesson-title>div{flex:1}.lesson-title p{font-size:15px;color:#839273;margin-bottom:0}.lesson-title .corn{flex-shrink:0}.lesson-video{width:100%;max-height:285px;background:#f5f8ef;border-radius:15px}.lesson-footer{position:fixed;bottom:0;left:0;right:0;border-top:2px solid var(--line);background:#fff;z-index:6}.lesson-footer>div{max-width:1000px;min-height:115px;display:flex;align-items:center;justify-content:space-between;gap:30px;margin:auto;padding:23px 35px}.lesson-footer .primary{min-width:150px;flex-shrink:0}.lesson-footer.good{background:#eaf8d9;border-color:#eaf8d9}.lesson-footer.bad{background:#fff0eb;border-color:#fff0eb}.lesson-footer.bad .primary{background:#ff775b;border-color:#d75843}.feedback{max-width:640px}.feedback strong{font-size:21px;color:#58a62b}.bad .feedback strong{color:#e96d52}.feedback p{font-size:13px;margin:6px 0 0;color:#78985d}.bad .feedback p{color:#b37b67}.question-code{font:16px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;background:#f7f9f4;border:2px solid #e8edde;border-radius:14px;padding:23px;color:#597641;white-space:pre-wrap}.question-friend{display:flex;align-items:center;gap:22px;margin:8px 0 25px}.question-friend>span{font-size:14px;border:2px solid var(--line);border-radius:15px;padding:17px 24px;color:#8c9b7f}.options{display:grid;gap:13px;margin-top:26px}.option{display:flex;align-items:center;gap:18px;text-align:left;border:2px solid #e5eadd;border-bottom-width:4px;border-radius:13px;padding:17px 20px;min-height:70px}.option>span{border:2px solid #e7ecdf;border-radius:7px;min-width:28px;height:28px;display:grid;place-items:center;font-size:12px;color:#a7b19b}.option>b{font-size:15px;font-weight:600;overflow-wrap:anywhere}.option:hover:not(:disabled){background:#f7faf3}.option.selected{background:#e8f6fd;border-color:#85cfee;color:#199ed7}.option.selected>span{border-color:#96d5ef;color:#3aaddb}.option.correct{background:#eff9e3;border-color:#add66f;color:#67a02f}.option.incorrect{background:#fff0eb;border-color:#fca18e;color:#d56f57}.code-editor{border:2px solid #e4eadc;border-radius:14px;overflow:hidden}.editor-title{display:flex;justify-content:space-between;gap:15px;padding:14px 18px;background:#f5f8f0;border-bottom:1px solid #e5eadf}.editor-title>span{font:13px ui-monospace,SFMono-Regular,monospace;color:#708760}.editor-title small{font-size:10px;color:#a4ae99}#code-input{display:block;border:0;resize:vertical;min-height:260px;width:100%;padding:19px 22px;background:#fcfdf9;color:#3e5732;font:13px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:4;outline-offset:-3px}.editor-actions{padding:12px 16px;display:flex;align-items:center;flex-wrap:wrap;gap:12px;background:#fff;border-top:1px solid #e9ede1}.editor-actions .primary{font-size:12px;min-height:37px;padding:7px 15px;border-radius:8px}.editor-actions .outline{font-size:11px;min-height:32px}.editor-actions>span{margin-left:auto;font-size:10px;color:#9ca890}.output-label{padding:11px 19px 0;font-size:10px;letter-spacing:1px;background:#f5f7f1;color:#9aa78e}#code-output{margin:0;min-height:110px;max-height:240px;overflow:auto;padding:13px 19px 20px;background:#f5f7f1;color:#5c7847;font:12px/1.8 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere}#code-task{color:#8a987c;font-size:13px}.completion{text-align:center;position:relative;padding:12px 0}.completion>.corn{margin:auto}.completion h1{color:#75ad32;margin:25px 0 12px;font-size:28px}.completion>p{font-size:14px;color:#9aa68c}.confetti{position:absolute;top:30px;left:50%;transform:translateX(-50%);font-size:35px;color:#f6c13a;letter-spacing:25px;white-space:nowrap;pointer-events:none}.confetti span{display:inline-block;margin:0 65px;color:#96ce5f}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:35px}.result-stats>div{border:2px solid #e4edd7;border-radius:15px;overflow:hidden}.result-stats span{display:block;background:#f3f8e9;font-size:12px;padding:8px;color:#9bae80}.result-stats b{display:block;padding:18px 5px;font-size:18px;color:#86a857}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}[hidden]{display:none!important}
@media(min-width:1500px){.layout{gap:58px;padding-top:42px}.unit-banner{padding:25px}.learning-path{height:625px}.rightbar{gap:25px}}
@media(max-width:1190px){.sidebar{width:200px;padding:30px 12px}.brand{font-size:22px;padding-bottom:35px}.brand>span{font-size:30px}.workspace{margin-left:200px}.layout{padding:28px;gap:25px;grid-template-columns:minmax(320px,1fr) 265px}.topbar{padding:0 30px}.stats{gap:20px}.side-card{padding:19px}.guide-button{padding:8px}.unit-banner{padding:20px}.unit-banner h1{font-size:23px}.path-character{left:calc(50% + 45px)}.path-code{left:12px}.eyebrow>span{display:none}}
@media(max-width:1020px){.sidebar{width:90px;padding:26px 10px}.brand{padding:0 7px 35px}.brand>div,.nav-item>b,.sidebar-bottom,.nav-item i{display:none}.nav-item{justify-content:center;padding:13px 8px}.sidebar nav{gap:22px}.workspace{margin-left:90px}.layout{padding:28px;gap:24px}.topbar{height:83px}.path-character>.corn{width:105px;height:auto}.path-character{left:calc(50% + 35px)}.path-stop.stop-1{left:calc(50% - 134px)}}
@media(max-width:820px){.layout{display:block;max-width:650px;padding:28px 32px}.rightbar{display:none}.topbar{padding:0 28px}.stats{gap:17px}.learning-path{max-width:520px}.path-character>.corn{width:123px}.path-character{left:calc(50% + 57px)}.path-code{left:40px}.eyebrow>span{display:block}.guide-button span{display:inline}.unit-banner h1{font-size:25px}}
@media(max-width:600px){.sidebar{display:none}.workspace{margin-left:0}.topbar{height:71px;padding:0 19px;gap:8px;position:sticky;top:0;background:#fff;z-index:5;border-bottom:2px solid #eff2e9}.course-selector{gap:7px}.course-selector>b{font-size:11px}.course-selector .chevron{display:none}.python-mark{width:29px;height:27px;font-size:12px}.stats{gap:12px}.stats button{gap:3px;font-size:12px}.stats span{font-size:18px}.stats .sound{display:none}.layout{padding:21px 20px 105px}.eyebrow{font-size:10px;margin-bottom:15px}.eyebrow>span{display:none}.unit-banner{padding:18px;border-radius:14px;gap:12px}.unit-banner h1{font-size:23px}.unit-select{font-size:10px;letter-spacing:.4px}.unit-banner p{font-size:10px}.guide-button{font-size:18px;padding:9px;border-radius:9px}.guide-button span{display:none}.path-intro{gap:7px;margin-top:28px}.path-intro b{font-size:11px}.path-intro small{font-size:10px}.path-intro>span{font-size:9px;padding:3px 5px}.learning-path{height:590px}.path-character{left:calc(50% + 36px);top:180px}.path-character>.corn{width:105px}.path-character>div{font-size:10px}.path-stop.stop-1{left:calc(50% - 142px)}.path-code{left:8px;font-size:28px}.path-stop>strong{font-size:12px}.path-stop>small{font-size:9px}.chest{font-size:39px;left:calc(50% + 22px)}.chest span{font-size:9px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:8;background:#fff;border-top:2px solid var(--line);padding:7px 10px calc(7px + env(safe-area-inset-bottom));justify-content:space-around}.mobile-nav button{display:flex;align-items:center;flex-direction:column;font-size:10px;color:#a0aa95;gap:1px;min-width:50px;padding:3px 9px;border-radius:10px}.mobile-nav button>span{font-size:23px;font-weight:750;line-height:1.3}.mobile-nav button.active{color:#62a936;background:#f0f7e7}.next-preview{padding:14px;gap:12px}.next-preview p{font-size:10px}.next-unit{font-size:11px;gap:10px}.page-heading h1{font-size:25px}.page-heading p{font-size:12px}.practice-hero{padding:18px;gap:15px}.practice-hero>.corn{width:80px;height:auto;flex-shrink:0}.practice-hero h2{font-size:16px}.practice-hero p{font-size:11px}.feature-list>button{padding:20px 16px;gap:14px}.feature-list h2{font-size:16px}.feature-list p{font-size:11px}.book-list h2{font-size:14px}.profile-stats b{font-size:22px}.profile-stats span{font-size:10px}.lesson-top{padding:23px 18px;gap:13px}.lesson-top>button{font-size:25px}.lesson-top>span{font-size:20px}.lesson-top b{font-size:10px}.lesson-top>.progress-track{height:14px}.lesson-body{margin:25px auto;padding:0 22px}.lesson-body h1{font-size:24px}.lesson-title{gap:15px}.lesson-title .corn{width:75px;height:auto}.lesson-title p{font-size:13px}.lesson-kicker{font-size:10px;margin-bottom:18px}.flow{gap:5px;margin:22px 0}.flow>span{font-size:10px;padding:12px 6px;min-width:60px}.flow>i{font-size:11px}.lesson-video{max-height:240px}.lesson-footer>div{min-height:100px;padding:17px 20px calc(17px + env(safe-area-inset-bottom));gap:16px;flex-wrap:wrap}.lesson-footer>div>.muted{display:none}.lesson-footer .primary{width:100%}.lesson-screen{padding-bottom:200px}.feedback strong{font-size:18px}.feedback p{font-size:12px;line-height:1.65}.option{padding:15px;gap:13px;min-height:66px}.option>b{font-size:13px}.question-friend{gap:15px}.question-friend>span{padding:13px 17px;font-size:12px}.question-code{font-size:14px;padding:19px}.editor-title small{font-size:9px}#code-input{padding:16px 14px;font-size:12px;min-height:290px}.editor-actions{padding:12px;gap:8px}.editor-actions>span{font-size:9px}.result-stats{gap:9px}.result-stats b{font-size:14px;padding:15px 2px}.result-stats span{font-size:10px}.completion>.corn{width:130px;height:auto}.completion h1{font-size:24px}.completion>p{font-size:12px}.confetti{letter-spacing:15px;font-size:25px}.confetti span{margin:0 50px}.modal-head{padding:19px}.modal-head h2{font-size:19px}.guide-content{padding:22px}.guide-content h1{font-size:24px}.guide-content>p{font-size:13px}#toast{bottom:90px;min-width:260px;font-size:12px}.in-lesson #toast{bottom:140px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep secondary instructions readable on white and pale surfaces. */
.path-stop>small,.path-character>div,.path-footnote,.muted,.page-heading p,.feature-list p,.book-list p,.streak-card p,.journey p,.right-footer,.quest-line small,.streak-note{color:#77846a}.path-intro b,.path-intro small,.eyebrow,.eyebrow>span{color:#7e8b72}.right-footer span{color:#829077}.next-preview b{color:#7b9067}.next-preview p{color:#889877}.lesson-title p,#code-task{color:#6e805f}
.instant-answer-hint{color:#859475;font-size:13px;font-weight:650}.option.correct{animation:answer-pop .24s ease-out}.option.incorrect{animation:answer-shake .23s ease-in-out}.lesson-footer.good .feedback,.lesson-footer.bad .feedback{animation:feedback-in .18s ease-out}@keyframes answer-pop{50%{transform:scale(1.012)}}@keyframes answer-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes feedback-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.instant-answer-hint{display:block;text-align:center;width:100%;font-size:12px}}
/* Python workbench: the same warm paper and green accents as the learning path. */
.code-editor{border-color:#dfe9d4;border-radius:17px;box-shadow:0 4px 0 #eff3e8}.editor-title{align-items:center;background:#f2f7e9;padding:13px 17px}.editor-file,.editor-heading-actions{display:flex;align-items:center;gap:10px}.editor-file{font:12px ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:600;color:#5e794b}.file-glyph{background:#e3efd4;color:#6e9c44;border-radius:7px;padding:3px 5px;font-size:10px}.file-dot{width:5px;height:5px;border-radius:50%;background:#93bb69}.editor-heading-actions small{color:#889879;font-size:10px}.editor-heading-actions>button{font-size:14px;color:#759355;padding:4px 7px;border:1px solid #dce7cd;border-radius:7px;background:#fbfdf7}.editor-heading-actions>button>span{font-size:10px;margin-left:3px}.editor-toolbar{display:flex;gap:5px;align-items:center;padding:8px 12px;background:#fff;border-bottom:1px solid #e9efdf}.editor-toolbar button{padding:5px 9px;font-size:13px;line-height:1.5;border:1px solid transparent;border-radius:7px;color:#7b8f68}.editor-toolbar button:hover:not(:disabled),.editor-toolbar button[aria-pressed=true]{background:#f0f7e5;border-color:#dce9cb;color:#609535}.editor-toolbar button span{font-size:11px}.editor-toolbar button:first-child{color:#6d9e3e;font-weight:700;background:#f6faef;font-size:11px}.editor-toolbar button:disabled{opacity:.35}.toolbar-divider{height:15px;background:#e4ebdb;width:1px;margin:0 3px}#editor-help{margin-left:auto;border:1px solid #e0e8d6;border-radius:50%;width:24px;height:24px;padding:0;font-size:12px}#code-editor-mount{min-width:0;max-width:100%;overflow:hidden}.editor-position{display:flex;justify-content:space-between;gap:15px;background:#f8faf4;border-top:1px solid #e9efdf;padding:8px 17px;font-size:10px;color:#91a080}.editor-position i{font-style:normal;margin:0 7px;color:#c0cbb4}.editor-actions{padding:14px 16px;gap:9px}.editor-actions .primary{min-height:39px;padding:8px 18px;font-size:12px}.editor-file-actions{display:flex;gap:4px;margin-left:auto}.editor-file-actions .plain{font-size:10px;padding:5px 7px}.run-shortcut{font-size:9px;color:#a4af96}.console-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#f4f7ee;border-top:1px solid #e3ebd8;padding:12px 17px 0;font-size:10px;color:#879b73}.console-heading>div{display:flex;align-items:center;gap:7px;font-weight:700}.console-dot{width:5px;height:5px;border-radius:50%;background:#9bb77e}#runtime-status{font-weight:400;font-size:10px;text-align:right}#code-output{background:#f4f7ee;color:#597346;min-height:105px;max-height:225px;font-size:12px;padding:14px 17px 20px}#error-jump{display:block;width:100%;background:#fff0e9;color:#b76d51;font:11px/1.7 var(--font);text-align:left;padding:10px 17px;overflow-wrap:anywhere}.editor-note{font-size:10px;margin-top:17px}.editor-symbols{display:none}.shortcut-list{padding:22px 26px}.shortcut-list>p{color:#8a9c77;font-size:12px}.shortcut-list>div{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 0;font-size:12px}.shortcut-list kbd{font:10px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;background:#f4f8ed;color:#749352;border:1px solid #e0e9d4;border-radius:5px;padding:4px 7px;text-align:right}.editor-expanded{overflow:hidden}.code-editor.expanded{position:fixed;inset:18px;z-index:20;display:flex;flex-direction:column;background:#fff;box-shadow:0 0 0 50px #f0f4e9;border-radius:16px}.expanded #code-editor-mount{flex:1;min-height:100px}.expanded .cm-editor{height:100%}.expanded .cm-scroller{min-height:0!important;max-height:none!important;height:100%}.expanded .editor-title,.expanded .editor-toolbar,.expanded .editor-actions,.expanded .editor-position,.expanded .console-heading{flex-shrink:0}.expanded #code-output{min-height:70px;max-height:20vh;flex-shrink:0}.expanded .editor-symbols{flex-shrink:0}.cm-panel input[type=checkbox]{accent-color:#7aae45}.cm-panel input:focus-visible{outline:2px solid #a6cc80;outline-offset:1px}
@media(max-width:600px){.editor-title{padding:11px 12px}.editor-file{gap:7px;font-size:11px}.editor-heading-actions{gap:7px}.editor-heading-actions small{font-size:9px}.editor-toolbar{padding:7px 8px;gap:3px}.editor-toolbar button{padding:5px 7px}.editor-toolbar button span{font-size:10px}.editor-position{padding:7px 12px;font-size:9px}.editor-symbols{display:flex;gap:5px;padding:7px 10px;background:#fff;border-top:1px solid #e6ecdd;overflow-x:auto}.editor-symbols>button{border:1px solid #e0e9d4;background:#f7faf1;border-bottom-width:2px;border-radius:6px;color:#7b9565;min-width:28px;white-space:nowrap;font:11px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;padding:4px 6px}.editor-actions{padding:11px;gap:6px}.editor-actions .primary{font-size:11px;min-height:37px;padding:7px 12px}.editor-file-actions .plain{font-size:9px;padding:5px}.run-shortcut{display:none}.editor-note{font-size:10px}.console-heading{padding:11px 12px 0;font-size:9px}#runtime-status{font-size:9px}#code-output{font-size:11px;padding:12px;min-height:95px}.code-editor.expanded{inset:6px;border-radius:12px}.expanded .editor-title{padding:10px 12px}.shortcut-list{padding:18px}.shortcut-list>div{font-size:11px}.shortcut-list kbd{font-size:9px}.cm-editor{font-size:12px!important}.cm-scroller{min-height:250px!important;max-height:370px!important}.cm-content{min-height:250px!important}.cm-panel.cm-search{line-height:2.5!important}.cm-tooltip-autocomplete ul{max-width:280px!important}.cm-completionInfo{max-width:180px!important}}

/* Use the console background for the breathing room above the traceback. */
.console-heading:has(+ #error-jump:not([hidden])){padding-bottom:10px}
.expanded #error-jump{flex-shrink:0}

/* CodeMirror positions the bubble and its pointer against the error line. */
.error-hint-line[hidden]{display:none}
.cm-editor .cm-tooltip.error-hint{display:grid;grid-template-columns:32px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:10px;width:min(440px,calc(100vw - 70px));padding:10px 12px;background:#fffdf1;color:#41451f;border:1px solid #e1dfa9;border-radius:14px;box-shadow:0 4px 0 #eae8cb,0 9px 22px #515e231a;font-family:var(--font)}
.cm-editor .error-hint.cm-tooltip-above .cm-tooltip-arrow::before{border-top-color:#e1dfa9}
.cm-editor .error-hint.cm-tooltip-above .cm-tooltip-arrow::after{border-top-color:#fffdf1}
.cm-editor .error-hint.cm-tooltip-below .cm-tooltip-arrow::before{border-bottom-color:#e1dfa9}
.cm-editor .error-hint.cm-tooltip-below .cm-tooltip-arrow::after{border-bottom-color:#fffdf1}
.error-hint-bulb{width:32px;height:32px}
.error-hint-content{display:flex;flex-direction:column;min-height:0}
.error-hint-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:27px;flex-shrink:0;font-size:14px}
.error-hint-line{border:0;border-radius:7px;padding:4px 8px;background:#eaf1d5;color:#40621a;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.error-hint-line:hover{background:#ddeabf}
.error-hint-content p{margin:2px 0 7px;font-size:14px;line-height:1.55;min-height:0;overflow-y:auto;overscroll-behavior:contain;white-space:pre-line;overflow-wrap:anywhere}
.error-hint-dismiss{align-self:flex-end;flex-shrink:0;padding:4px 12px;min-height:32px;border:1px solid #bed4a3;border-radius:9px;background:#f3f8e8;color:#416327;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.error-hint-dismiss:hover{background:#e7f0d4}
.error-hint button:focus-visible{outline:2px solid #4d772c;outline-offset:1px}
@media(max-width:600px){
 #code-editor-mount:has(.error-hint){overflow:visible}
 .cm-editor .cm-tooltip.error-hint{padding:8px 10px}
 .error-hint-content p{font-size:13px}
}