:root{--paper:#fbfcf6;--ink:#243c32;--muted:#758177;--green:#2c7959;--mint:#e6efd9;--line:#e3e7db;--yellow:#f9df8d;--radius:24px;--shadow:0 12px 38px #233d3209}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;font-size:14px;line-height:1.65}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8cbfa7;outline-offset:4px}button{color:inherit}::selection{background:#d8eeb7}h1,h2,h3,h4,p{margin-top:0}h1,h2,h3{letter-spacing:-.035em}h2{font-size:32px;line-height:1.4;margin-bottom:10px}h3{font-size:20px}small{font-size:12px}svg{max-width:100%}.header{height:90px;background:#fbfcf6f2;border-bottom:1px solid #e6e9de;position:sticky;top:0;z-index:30;backdrop-filter:blur(18px)}.nav-wrap{max-width:1240px;padding:0 38px;height:100%;margin:auto;display:flex;align-items:center;gap:32px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:21px;font-weight:800;white-space:nowrap;letter-spacing:-.8px}.brand small{display:block;font-size:8px;font-family:'Nunito',sans-serif;letter-spacing:1.7px;margin-top:-3px;font-weight:800}.brand-icon{background:#dfebc9;border-radius:13px;width:40px;height:43px;display:grid;place-items:center;font:900 23px 'Nunito',sans-serif;position:relative;transform:rotate(-5deg);border:1px solid #cbdcb1}.brand-icon span{position:absolute;right:1px;top:-8px;font-size:19px;color:#d29c38}.header nav{display:flex;gap:27px;align-items:center;margin:auto;font-size:13px;font-weight:600}.header nav a{position:relative;white-space:nowrap;padding:32px 0}.header nav a.active{color:var(--green)}.header nav a.active:after{content:'';position:absolute;bottom:22px;left:30%;width:40%;height:3px;background:var(--green);border-radius:3px}.tiny-dot,.status-dot{display:inline-block;width:6px;height:6px;background:#8ba954;border-radius:50%;vertical-align:middle;margin-left:3px}.nav-cta{border:1px solid #ccd7c4;border-radius:10px;padding:9px 15px;font-weight:600;white-space:nowrap;font-size:12px}.nav-cta span{margin-left:15px}.menu-button{display:none}.container{max-width:1164px;margin:auto}.section{padding:65px 0}.section-top{display:flex;align-items:end;justify-content:space-between;margin-bottom:27px}.section-top p,.subtitle{color:var(--muted);margin-bottom:0}.eyebrow{display:flex;align-items:center;gap:8px;font:800 10px 'Nunito',sans-serif;letter-spacing:2.2px;color:var(--green);margin-bottom:16px}.eyebrow .line{width:24px;height:2px;background:currentColor}.pill{border:1px solid #dce4d2;background:#f4f8e9;display:inline-flex;align-items:center;padding:5px 11px;gap:6px;border-radius:50px;font-size:11px;font-weight:600}.pill.yellow{background:#fcf1ce;border-color:#eddfae;color:#7b6731}.pill.pink{background:#f6e7ed;border-color:#ead7df;color:#a17086}.text-link{font-size:12px;font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;gap:12px}.text-link:hover{color:var(--green)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:white;border:1px solid #d7dfcf;border-radius:11px;padding:13px 22px;font-size:13px;font-weight:700;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 5px 12px #243c3210}.btn.primary{background:var(--green);color:white;border-color:var(--green);box-shadow:0 6px 12px #2c795915}.btn.lemon{background:var(--yellow);border-color:#e8ce7f}.btn.small{padding:8px 13px;font-size:12px;border-radius:9px}.btn.ghost{background:transparent}.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.icon-button{background:none;border:0;padding:6px;font-size:20px;line-height:1}.text-button{background:none;border:0;padding:0;text-align:left}.muted{color:var(--muted)}.hero{position:relative;overflow:hidden;padding:74px 0 50px;background:radial-gradient(ellipse at 85% 45%,#eff3df 0,transparent 43%)}.hero-inner{display:grid;grid-template-columns:1.02fr 1fr;align-items:center;gap:45px}.hello-tag{display:inline-flex;align-items:center;gap:8px;background:#eef4e3;border:1px solid #dce7cd;padding:5px 12px;border-radius:30px;margin-bottom:20px;font-size:11px;letter-spacing:.8px}.hero h1{font-size:49px;line-height:1.42;font-weight:800;letter-spacing:-2px;margin-bottom:18px}.hero h1 .highlight{color:var(--green);position:relative;z-index:1}.hero h1 .highlight:after{content:'';position:absolute;left:0;bottom:3px;background:#dce9be;z-index:-1;width:100%;height:14px;border-radius:50% 20% 10% 40%;transform:rotate(-1deg)}.hero-description{color:#7c8479;line-height:1.95;font-size:14px;margin-bottom:27px}.hero-actions .btn{padding:14px 22px}.hero-note{margin-top:20px;display:flex;align-items:center;gap:16px;font-size:10px;color:#87907f}.hero-note span{display:flex;align-items:center;gap:5px}.hero-note b{font-size:12px;color:#6b8b59}.hero-art{position:relative;min-height:390px}.hero-art svg{width:100%;height:390px;overflow:visible}.float-label{position:absolute;border:1px solid #e1e5d5;background:#fffffff2;border-radius:11px;padding:8px 14px;box-shadow:0 5px 15px #1c3e2b08;font-size:11px;font-weight:700;transform:rotate(-7deg);top:24px;left:30px}.float-label.second{top:auto;bottom:23px;left:auto;right:8px;transform:rotate(7deg)}.float-label i{font-style:normal;margin-right:5px}.marquee-line{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;background:#f4f6ed}.benefits{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;color:#737e6b}.benefits span{display:flex;gap:10px;align-items:center}.benefits b{color:#374d3c;font-weight:600;font-size:12px}.benefits i{font-size:19px;font-style:normal}.learning{background:#fbfcf6}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.course-card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 5px 15px #263e3203;transition:transform .2s,box-shadow .2s}.course-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.course-art{height:166px;position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;border-bottom:1px solid #e8e9df}.course-art.green{background:#e9efdd}.course-art.yellow{background:#faf1d9}.course-art.purple{background:#edeaf3}.course-art .pill{position:absolute;top:15px;left:16px;z-index:2;font-size:9px;background:#ffffffb0;border-color:#ffffffb0;padding:3px 9px}.course-art svg{height:130px;width:80%;margin-top:22px;transition:transform .4s}.course-card:hover .course-art svg{transform:rotate(-3deg) scale(1.05)}.course-info{padding:23px}.course-info .lesson-num{font:800 9px 'Nunito',sans-serif;letter-spacing:1.8px;color:#87957c;display:block;margin-bottom:7px}.course-info h3{font-size:18px;margin-bottom:8px;letter-spacing:-.4px}.course-info p{font-size:11px;color:#899082;line-height:1.85;min-height:40px;margin-bottom:18px}.course-meta{border-top:1px solid #eef0e9;padding-top:14px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#83907d}.round-arrow{width:26px;height:26px;display:grid;place-items:center;border:1px solid #e0e6d9;background:#f9fbf5;border-radius:50%;font-size:15px;color:var(--ink)}.code-section{background:#f0f3e9;border-top:1px solid #e7ebdf;border-bottom:1px solid #e7ebdf;padding:58px 0}.code-demo{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:center}.code-demo h2{font-size:32px}.code-demo p{font-size:12px;color:#84907d;line-height:1.9;max-width:340px}.check-list{list-style:none;margin:20px 0 25px;padding:0;display:grid;gap:10px;font-size:11px;color:#607558}.check-list li:before{content:'✓';margin-right:10px;background:#e0eace;border-radius:50%;padding:2px 4px;color:#65844b;font-size:8px}.code-window{background:#fff;border:1px solid #dbe2d1;border-radius:16px;box-shadow:0 10px 30px #1e39270b;overflow:hidden;transform:rotate(1deg)}.window-bar{padding:12px 18px;border-bottom:1px solid #e8ebdf;display:flex;align-items:center;gap:6px;font-size:10px;color:#929c8c}.window-bar i{width:7px;height:7px;display:inline-block;border-radius:50%;background:#ecc4b3}.window-bar i:nth-child(2){background:#eddb9b}.window-bar i:nth-child(3){background:#b6d6ad}.window-bar span{margin:auto}.window-bar b{font-size:9px;color:#7b8c6c;font-weight:400}.demo-body{padding:22px 24px}.code-text{font:12px/2 'SFMono-Regular',Consolas,monospace;white-space:pre-wrap;margin:0;color:#3b4942}.c-comment{color:#91a18b}.c-string{color:#b57d40}.c-keyword{color:#a16da2}.c-builtin{color:#4e9074}.demo-output{border-radius:8px;background:#f4f7ee;margin-top:15px;padding:12px 16px;font:11px/1.8 monospace;white-space:pre-wrap;min-height:45px}.demo-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:9px;color:#91a184}.play-cards{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}.feature-card{border-radius:20px;overflow:hidden;padding:28px 30px;position:relative;min-height:210px;background:#eee9f4;border:1px solid #e1dbea;display:flex;align-items:center}.feature-card.lemon{background:#fcf2d8;border-color:#eee2c4}.feature-card h3{font-size:22px;margin-bottom:8px}.feature-card p{font-size:11px;color:#8b8092;max-width:230px;margin-bottom:23px;line-height:1.85}.feature-card.lemon p{color:#9a8961}.feature-card .mini-art{font-size:72px;transform:rotate(-10deg);position:absolute;right:34px;bottom:33px;filter:drop-shadow(0 8px 0 #544d6c0c)}.feature-card .mini-badge{display:inline-block;font-size:9px;letter-spacing:1px;padding:3px 7px;background:#ffffff80;border-radius:5px;margin-bottom:12px}.journey{margin-top:55px;background:#e8efda;border:1px solid #dbe4c9;border-radius:20px;padding:34px 38px;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative}.journey h3{font-size:23px;margin:0 0 5px}.journey p{margin:0;font-size:11px;color:#7b8d68}.journey .deco{font-size:43px;position:absolute;right:300px;top:29px;transform:rotate(15deg)}footer{max-width:1164px;margin:auto;border-top:1px solid #e2e6da;padding:35px 0 25px;display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:25px;align-items:start}footer .brand{font-size:18px}footer .brand-icon{width:31px;height:34px;font-size:19px}footer p{font-size:11px;color:#86917d;line-height:1.9}footer p small{font-size:9px}footer>div{display:flex;gap:18px;font-size:10px;justify-content:end;color:#6e7e65}footer .footer-note{grid-column:1/-1;font-size:9px;letter-spacing:1px;color:#a1aa97;border-top:1px solid #e9ece1;padding-top:15px;text-align:center}.page-head{text-align:center;padding:54px 0 35px}.page-head .eyebrow{justify-content:center}.page-head h1{font-size:40px;line-height:1.4;margin-bottom:13px}.page-head p{color:var(--muted);font-size:13px}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 28px;justify-content:center}.tab{background:white;border:1px solid var(--line);border-radius:30px;padding:8px 18px;color:#788470;font-size:12px}.tab.active{background:var(--green);color:#fff;border-color:var(--green)}.progress-banner{background:#eef4e4;border:1px solid #dfe8d2;border-radius:17px;padding:20px 25px;display:flex;gap:20px;align-items:center;margin-bottom:28px}.progress-banner p{margin:0;font-size:12px}.progress-track{margin-left:auto;width:180px;max-width:35%;height:6px;background:#dce4cf;border-radius:5px;overflow:hidden}.progress-track div{height:100%;background:#80a65e;transition:width .3s}.catalog{padding-bottom:65px}.catalog .course-grid{grid-template-columns:repeat(3,1fr)}.lesson-layout{display:grid;grid-template-columns:250px 1fr;gap:35px;padding:35px 0 70px}.lesson-nav{border:1px solid var(--line);border-radius:17px;padding:20px;background:white;align-self:start;position:sticky;top:110px}.lesson-nav h4{font-size:12px;color:var(--muted);font-weight:500}.lesson-nav button{display:block;border:0;background:none;text-align:left;width:100%;padding:9px 10px;border-radius:8px;font-size:12px}.lesson-nav button.active{background:#edf4e4;color:var(--green)}.article{background:#fff;border:1px solid var(--line);border-radius:22px;padding:38px;min-width:0}.article h1{font-size:31px}.article p{color:#72806b;line-height:2}.article h3{margin-top:30px;font-size:18px}.article pre{background:#f4f7ef;border:1px solid #e4e9db;border-radius:12px;padding:20px;overflow:auto;color:#3e654d;font:12px/1.9 monospace}.callout{background:#fff6dc;border:1px solid #eddfb2;border-radius:12px;padding:17px 20px;color:#8a794d;font-size:12px;margin:22px 0}.callout strong{display:block;margin-bottom:4px}.nb-layout{display:grid;grid-template-columns:230px 1fr;gap:22px;padding:30px 0 60px;min-height:75vh}.nb-sidebar{background:#f1f4e9;border:1px solid #e0e6d5;border-radius:17px;padding:18px;align-self:start;position:sticky;top:112px}.nb-sidebar h3{font-size:14px;display:flex;align-items:center;justify-content:space-between}.nb-files{margin:18px -7px}.nb-file{display:flex;align-items:center;gap:7px;padding:10px;border-radius:10px;cursor:pointer;font-size:11px;position:relative}.nb-file>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.nb-file:hover,.nb-file.active{background:white}.nb-file .remove{font-size:15px;border:0;background:none;color:#a1ab99;padding:0 3px}.sidebar-tip{border-top:1px solid #dce3d0;font-size:10px;color:#8e9b80;padding-top:18px;line-height:1.9;margin-top:22px}.nb-content{min-width:0}.nb-titlebar{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}.nb-titlebar input{font-size:23px;font-weight:700;width:60%;min-width:160px;border:0;background:none;color:var(--ink);padding:3px 0}.save-state{font-size:10px;color:#8a9a7f;margin-left:auto}.nb-toolbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:13px 0 20px}.nb-toolbar .btn{font-size:11px;padding:7px 11px}.kernel-state{font-size:10px;color:#839578;margin-left:auto;display:flex;align-items:center;gap:6px}.kernel-state:before{content:'';width:6px;height:6px;border-radius:50%;background:#89a65d}.notebook-intro{background:#eaf1de;border:1px dashed #cfdcbb;border-radius:14px;padding:17px 20px;margin:0 0 20px;color:#6d815e;font-size:11px}.notebook-intro strong{font-size:13px;display:block;color:#395833;margin-bottom:4px}.cell{background:#fff;border:1px solid #dfe5d7;border-radius:13px;margin-bottom:18px;overflow:hidden;position:relative;transition:border-color .2s}.cell:focus-within{border-color:#91b17a;box-shadow:0 0 0 2px #91b17a13}.cell-header{padding:9px 14px;background:#f9faf5;border-bottom:1px solid #e9ede2;display:flex;gap:9px;align-items:center;font-size:10px;color:#91a082}.cell-header label{font-family:monospace}.cell-header select{border:0;background:none;color:#84927a;font-size:10px}.cell-header .right{margin-left:auto;display:flex;align-items:center;gap:12px}.cell-header button{border:0;background:none;font-size:11px;color:#4d8254;padding:2px 6px}.cell-header button.delete-cell{color:#a2a99a;font-size:15px}.editor-wrap{position:relative;display:flex;min-height:110px;background:#fff;font-family:'SFMono-Regular',Consolas,monospace;font-size:12px;line-height:1.9}.line-numbers{padding:17px 0;width:40px;flex-shrink:0;text-align:right;color:#b5bead;line-height:22.8px;font-size:11px;user-select:none}.editor{position:relative;min-width:0;flex:1}.editor pre,.editor textarea{margin:0;padding:17px 17px 17px 13px;white-space:pre;overflow:auto;tab-size:4;font:12px/22.8px 'SFMono-Regular',Consolas,monospace;letter-spacing:0;text-align:left;min-height:110px;width:100%;border:0;word-break:normal;overflow-wrap:normal}.editor pre{position:absolute;top:0;left:0;pointer-events:none;height:100%;color:#52674f;overflow:hidden}.editor textarea{display:block;background:transparent;color:transparent;caret-color:#285b3b;resize:vertical;position:relative;outline:none!important;min-height:110px;-webkit-text-fill-color:transparent}.editor textarea::selection{background:#a9ce9d55}.syn-comment{color:#a1aa96}.syn-string{color:#b98340}.syn-keyword{color:#9c70a9}.syn-number{color:#cc895a}.syn-builtin{color:#3e927a}.completions{position:absolute;z-index:12;left:20px;top:50px;max-height:190px;overflow:auto;border:1px solid #d7e2cd;border-radius:9px;background:#fff;box-shadow:0 10px 25px #20352e1c;min-width:190px}.completions button{display:block;border:0;background:none;width:100%;text-align:left;padding:6px 12px;font:11px monospace}.completions button:hover,.completions button.selected{background:#eaf3e0}.cell-output{border-top:1px solid #e9ede3;background:#fbfcf8;padding:14px 19px;font:11px/1.85 'SFMono-Regular',Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:600px;overflow:auto;display:none}.cell-output.visible{display:block}.cell-output.error{background:#fff6f2;color:#b66c55}.cell-output img{max-width:100%;display:block;background:white;border-radius:6px}.cell-output .output-label{font-size:9px;color:#8b9c7d;margin-bottom:7px}.markdown-edit{display:block;width:100%;border:0;background:#fffdf8;padding:20px;min-height:100px;font-size:13px;color:#728168;resize:vertical}.add-cell{width:100%;border:1px dashed #d9e1cd;background:#f7f9f1;border-radius:11px;padding:11px;color:#819175;font-size:11px}.stdin{display:flex;gap:8px;align-items:center;font-size:11px;color:#87967b;margin:5px 0 15px}.stdin input{flex:1;min-width:0;border:1px solid #dfe4d7;border-radius:8px;background:#fff;padding:7px 10px;font-size:11px}.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;padding-bottom:55px}.game-card{border:1px solid var(--line);border-radius:20px;padding:28px;background:white;position:relative;overflow:hidden}.game-card .game-icon{font-size:45px;display:inline-block;background:#eff4e3;border-radius:17px;width:80px;height:80px;line-height:80px;text-align:center;margin-bottom:22px;transform:rotate(-5deg)}.game-card:nth-child(2) .game-icon{background:#f8edd2}.game-card:nth-child(3) .game-icon{background:#efe9f4}.game-card:nth-child(4) .game-icon{background:#f7e8e6}.game-card h3{margin-bottom:8px}.game-card p{color:#8a957f;font-size:12px;max-width:330px;min-height:43px}.game-card .difficulty{position:absolute;right:25px;top:25px}.game-controls{margin-top:17px;background:#f5f7ef;padding:15px;border-radius:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.game-controls label{font-size:11px;color:#819071}.game-controls input{max-width:200px;accent-color:var(--green)}.game-controls input[type=text]{padding:6px 9px;border:1px solid #d8e0cc;border-radius:5px;background:#fff;max-width:100%}.install-layout{max-width:930px;margin:auto;padding-bottom:65px}.os-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}.os-tab{border:1px solid var(--line);background:white;padding:22px;border-radius:15px;display:flex;align-items:center;gap:14px;text-align:left}.os-tab.active{border:1.5px solid #83a36a;background:#f0f5e8;box-shadow:0 0 0 3px #eef4e3}.os-tab b{font-size:16px;display:block}.os-tab small{font-size:10px;color:#8a977f;display:block}.os-icon{font-size:29px}.install-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:33px}.step-title{display:flex;gap:12px;align-items:center;margin-bottom:12px;font-size:16px;font-weight:700}.step-number{width:26px;height:26px;background:#e5efd6;border:1px solid #d5e1c4;color:#6b8b54;display:grid;place-items:center;border-radius:8px;font-size:12px;font-family:'Nunito',sans-serif}.install-panel p{font-size:12px;color:#829075}.install-step+.install-step{margin-top:31px;padding-top:25px;border-top:1px solid #edf0e7}.command-box{position:relative;background:#f4f7ef;border:1px solid #e2e9da;border-radius:11px;padding:19px 95px 19px 20px;font:11px/1.9 monospace;overflow-wrap:anywhere;color:#4c6846}.command-box pre{white-space:pre-wrap;margin:0;font:inherit}.command-box button{position:absolute;right:10px;top:12px;border:1px solid #d7e2cb;background:white;border-radius:7px;padding:5px 10px;font:10px sans-serif}.arch-select{display:flex;gap:12px;align-items:center;font-size:11px;color:#879879;margin:14px 0}.arch-select select{padding:7px 13px;border:1px solid #dce4d1;border-radius:8px;background:#fff;color:#59734b}.download-row{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:16px}.download-row small{color:#99a08e;font-size:10px}.install-panel details{font-size:11px;color:#89977e;margin-top:17px;line-height:1.9}.install-panel summary{cursor:pointer;color:#688356}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}.faq-grid details{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px 20px;font-size:12px}.faq-grid summary{font-weight:600;cursor:pointer}.faq-grid p{font-size:11px;color:#87937c;margin-top:13px;line-height:1.9}.faq-grid code{overflow-wrap:anywhere}.empty{text-align:center;color:#8c9b80;padding:35px}.empty .emoji{font-size:45px}#toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#314e3f;color:#f7f9ef;padding:12px 23px;border-radius:12px;box-shadow:0 6px 30px #18332322;font-size:12px;transition:all .25s;z-index:110;max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #dde4d2;border-radius:22px;padding:35px;max-width:540px;width:90%;color:var(--ink);background:var(--paper);box-shadow:0 20px 100px #24372d22}dialog::backdrop{background:#243b3155;backdrop-filter:blur(4px)}dialog h2{font-size:23px;margin-bottom:20px}dialog p{font-size:12px;color:#7a8c6d;line-height:1.9}.modal-close{position:absolute;right:13px;top:11px;color:#9ba58f}.modal-input{width:100%;padding:10px;border:1px solid #d6e0ca;background:white;border-radius:9px;margin:12px 0;font-size:11px}.skip{position:absolute;left:10px;top:-60px;z-index:100;background:var(--green);color:white;padding:10px}.skip:focus{top:10px}.back-link{display:inline-block;font-size:12px;margin-top:25px;color:#7a9267}.loading-dot{animation:pulse 1s ease-in-out infinite alternate}@keyframes pulse{to{opacity:.4}}@media(min-width:1400px){.container{max-width:1164px}.hero{padding-top:88px;padding-bottom:65px}.hero h1{font-size:54px}.hero-art svg{height:410px}.hero-art{min-height:410px}}@media(max-width:1240px){.container,footer{margin-left:5%;margin-right:5%}.nav-wrap{padding:0 5%;gap:20px}.header nav{gap:20px}.hero h1{font-size:44px}.hero-inner{gap:25px}.hero-art{min-height:350px}.hero-art svg{height:350px}.hero-description{font-size:12px}}@media(max-width:1000px){.nav-cta{display:none}.header nav{margin-left:auto;margin-right:0;gap:18px}.brand{font-size:19px}.hero h1{font-size:37px}.hero-inner{gap:15px}.hero-actions .btn{font-size:11px;padding:12px 17px}.hero-note{gap:9px;font-size:9px}.float-label{font-size:9px}.hero-art,.hero-art svg{height:320px;min-height:320px}.code-demo{gap:35px}.course-info{padding:18px}.course-info h3{font-size:16px}.benefits{font-size:10px}.benefits b{font-size:10px}.section{padding:50px 0}.feature-card .mini-art{right:20px;font-size:55px}.feature-card p{max-width:185px}.journey .deco{display:none}.nb-layout{grid-template-columns:190px 1fr}.nb-titlebar input{font-size:20px}.catalog .course-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.header{height:71px}.nav-wrap{gap:15px}.brand{font-size:19px}.brand-icon{width:35px;height:38px;font-size:22px}.brand small{font-size:7px}.menu-button{display:block;margin-left:auto}.header nav{display:none;position:absolute;left:0;right:0;top:70px;background:var(--paper);padding:18px 6%;box-shadow:0 10px 20px #30473412;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid var(--line)}.header nav.open{display:flex}.header nav a{padding:12px}.header nav a.active:after{display:none}.header nav a.active{background:#edf3e3;border-radius:8px}.hero{padding:37px 0 24px}.hero-inner{grid-template-columns:1fr;gap:5px}.hero-copy{text-align:center}.hello-tag{font-size:9px;margin-bottom:18px}.hero h1{font-size:39px;letter-spacing:-1.8px;margin-bottom:14px}.hero-description{font-size:12px;line-height:1.9;max-width:310px;margin:0 auto 23px}.hero-description br{display:none}.hero-actions{justify-content:center}.hero-actions .btn{font-size:12px;padding:13px 19px}.hero-note{justify-content:center;font-size:9px;gap:14px;margin-top:16px}.hero-art{width:100%;max-width:450px;margin:12px auto 0;min-height:310px}.hero-art svg{height:310px}.float-label{top:9px;left:10px}.float-label.second{bottom:15px;right:5px}.benefits{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px}.marquee-line{padding:19px 0}.benefits span{font-size:9px;gap:8px}.benefits b{font-size:10px}.benefits i{font-size:17px}.section{padding:38px 0}.eyebrow{font-size:8px;letter-spacing:1.8px;margin-bottom:10px}h2{font-size:26px}.section-top{margin-bottom:20px}.section-top p{font-size:11px}.section-top .text-link{font-size:10px;gap:7px}.course-grid{grid-template-columns:1fr;gap:16px}.course-card{display:grid;grid-template-columns:116px 1fr;border-radius:15px}.course-art{height:100%;border:0;border-right:1px solid #e7eadd;min-height:178px}.course-art .pill{top:12px;left:9px;font-size:8px;padding:2px 7px}.course-art svg{width:150px;max-width:160%;height:100px;position:relative;left:0;margin-top:18px}.course-info{padding:17px}.course-info .lesson-num{font-size:8px;margin-bottom:4px}.course-info h3{font-size:16px;margin-bottom:5px}.course-info p{font-size:10px;min-height:0;margin-bottom:12px}.course-meta{padding-top:9px;font-size:9px}.round-arrow{width:22px;height:22px;font-size:12px}.code-section{padding:36px 0}.code-demo{grid-template-columns:1fr;gap:27px}.code-demo h2{font-size:26px}.code-demo p{max-width:100%;font-size:11px}.check-list{display:flex;flex-wrap:wrap;gap:7px 15px;margin:15px 0 20px;font-size:10px}.code-window{transform:rotate(.5deg)}.demo-body{padding:18px}.code-text{font-size:11px}.play-cards{grid-template-columns:1fr;gap:16px}.feature-card{padding:24px;min-height:200px}.feature-card h3{font-size:22px}.feature-card .mini-art{right:27px;font-size:70px;bottom:30px}.feature-card p{max-width:205px}.journey{margin-top:28px;padding:26px;display:block;text-align:center}.journey h3{font-size:22px}.journey .btn{margin-top:20px}footer{grid-template-columns:1fr;gap:17px;padding-top:28px}footer p{margin:0}footer>div{justify-content:start}footer .footer-note{text-align:left}.page-head{padding:35px 0 20px}.page-head h1{font-size:29px}.page-head p{font-size:11px}.tabs{gap:6px;margin:16px 0 23px}.tab{padding:7px 12px;font-size:10px}.progress-banner{padding:15px;gap:10px}.progress-banner p{font-size:10px}.progress-track{width:90px}.catalog .course-grid{grid-template-columns:1fr}.lesson-layout{grid-template-columns:1fr;gap:20px;padding-top:20px}.lesson-nav{position:static;padding:13px;display:flex;overflow:auto;gap:7px;align-items:center;scrollbar-width:thin}.lesson-nav h4{display:none}.lesson-nav button{white-space:nowrap;width:auto;font-size:10px}.article{padding:23px;border-radius:16px}.article h1{font-size:25px}.article p{font-size:12px}.article pre{font-size:10px;padding:14px}.nb-layout{grid-template-columns:1fr;padding-top:20px;gap:18px}.nb-sidebar{position:static;padding:15px}.nb-sidebar h3{margin-bottom:9px}.nb-files{margin:8px 0;display:flex;overflow:auto;gap:5px;max-height:110px}.nb-file{padding:7px 9px;min-width:145px;max-width:200px}.sidebar-tip{display:none}.nb-sidebar>.actions .btn{font-size:10px;padding:5px 10px}.nb-titlebar input{font-size:21px;width:65%}.nb-toolbar{gap:5px;padding-bottom:14px}.nb-toolbar .btn{font-size:10px;padding:7px 9px}.kernel-state{margin-left:0;font-size:9px}.notebook-intro{padding:13px;font-size:10px}.notebook-intro strong{font-size:12px}.editor pre,.editor textarea{font-size:12px;line-height:22.8px}.game-grid{grid-template-columns:1fr;gap:16px}.game-card{padding:23px}.game-card p{font-size:11px}.game-card h3{font-size:21px}.os-tabs{gap:8px}.os-tab{padding:14px 8px;display:block;text-align:center;border-radius:12px}.os-icon{font-size:23px}.os-tab b{font-size:12px}.os-tab small{font-size:8px}.install-panel{padding:20px;border-radius:16px}.step-title{font-size:14px;gap:9px}.install-panel p{font-size:11px}.command-box{padding:46px 13px 15px;font-size:10px}.command-box button{top:9px}.faq-grid{grid-template-columns:1fr;gap:10px}.faq-grid details{font-size:11px}.download-row{gap:10px}.download-row .btn{font-size:11px}.nb-sidebar h3 .icon-button{font-size:18px}dialog{padding:28px 23px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}@media(max-width:370px){.hero h1{font-size:34px}.hero-note{gap:8px}.course-card{grid-template-columns:95px 1fr}.section-top .text-link{max-width:85px;white-space:normal}.hero-actions .btn{padding:12px 14px}}
/* V1.2 learning trail and interactive playground */
.learning-summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:32px 38px;border:1px solid #dbe4ca;border-radius:22px;background:linear-gradient(115deg,#edf3e0,#faf8e9);margin-bottom:22px}.learning-summary h2{font-size:28px;margin:9px 0}.learning-summary p{font-size:12px;color:var(--muted);line-height:1.9;margin-bottom:17px}.growth-counter{min-width:180px;text-align:center}.growth-counter strong{font-size:55px;color:var(--green);line-height:1.3}.growth-counter strong small{font-size:20px;color:#8c9b80}.growth-counter>span{display:block;font-size:12px;margin:8px 0 14px}.growth-counter .progress-track{width:100%;height:7px}.stage-trail{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;margin:25px 0}.stage-stop{display:flex;align-items:center;flex-direction:column;gap:8px;background:#fffef9;border:1px solid var(--line);border-radius:15px;padding:17px 7px;cursor:pointer;transition:.2s}.stage-stop:hover,.stage-stop.active{border-color:#90ac75;background:#f0f5e5;transform:translateY(-2px)}.stage-number{display:grid;place-items:center;background:#e7eeda;color:#6a8755;font-size:13px;width:32px;height:32px;border-radius:50%}.stage-stop strong{font-size:11px;font-weight:600;line-height:1.5;text-align:center}.stage-stop small{font-size:10px;color:#8b9580}.learning-tools{display:flex;gap:12px;align-items:center;margin:25px 0 8px}.course-search{display:flex;gap:12px;align-items:center;flex:1;border:1px solid var(--line);background:#fffefa;border-radius:12px;padding:0 15px}.course-search>span{font-size:24px;color:#8e9f7d}.course-search input{width:100%;border:0;padding:13px 0;outline:none;background:transparent;min-width:0;font:inherit;font-size:12px}.learning-tools select,#game-level{padding:12px;border:1px solid var(--line);border-radius:10px;background:#fffef9;font:inherit;font-size:12px;max-width:100%}.result-count{font-size:11px;color:#8b9580;margin:14px 0}.empty-state{padding:45px;background:#f3f5ed;border-radius:16px;text-align:center;font-size:13px}.course-credit{padding:24px 0;margin:22px 0 35px;border-top:1px solid var(--line);font-size:11px;line-height:1.9;color:#7f8b73}.course-credit a,.reading-list a{color:#6f8b59;text-decoration:underline;text-underline-offset:3px}.lesson-kicker{display:flex;gap:10px;align-items:center;justify-content:space-between;color:#8d9883;font-size:11px}.article h1{margin:20px 0 12px}.article .lesson-lead{font-size:14px;line-height:1.9}.objectives{background:#f0f5e6;border-radius:14px;padding:21px;margin:23px 0;font-size:13px}.objectives ul{margin:12px 0 0;padding-left:19px;line-height:2}.prerequisite{font-size:11px!important}.prerequisite a{color:#76945e}.article .lesson-section-title{font-size:19px;padding-top:28px;border-top:1px solid var(--line);margin:30px 0 20px}.knowledge-block h3{font-size:16px;display:flex;gap:11px;align-items:center}.knowledge-block h3 span{font-size:12px;color:#92a47f;font-weight:400}.knowledge-block p{line-height:2;margin-bottom:24px}.article .lesson-code{line-height:1.85;font-size:12px}.expected-result{background:#f6f0dc;border:1px solid #e9dfbf;border-radius:14px;padding:19px;margin:22px 0;font-size:13px}.expected-result p{margin:9px 0 0;font-size:12px}.exercise-card{border:1px solid #ddd6e7;background:#f8f5fa;border-radius:16px;padding:24px}.exercise-card h3{font-size:18px}.solution{border-top:1px solid #e2daea;margin-top:18px;padding-top:16px}.solution summary,.reading-list summary{cursor:pointer;font-size:12px;color:#8b789a}.solution pre{max-height:420px;overflow:auto}.challenge-card{background:#edf2e4;padding:20px;border-radius:14px;font-size:13px;margin:20px 0}.challenge-card p{margin-bottom:0}.reading-list{margin:23px 0;font-size:12px}.reading-list a{display:block;margin-top:12px}.lesson-finish{margin:28px 0}.lesson-finish p{font-size:10px;color:#8b9580;margin-top:12px}.lesson-pagination{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:22px;font-size:12px;color:#789267}.lesson-pagination a{max-width:48%}.lesson-pagination a:last-child{text-align:right}.lesson-pagination span{display:block;font-size:11px;margin-top:8px;color:#8a9381}.lesson-layout{align-items:start}.article,.lesson-layout>*{min-width:0}.lesson-nav{max-height:75vh;overflow:auto}.food-lab{display:grid;grid-template-columns:1.1fr 1fr;gap:35px;background:linear-gradient(120deg,#f8f1d7,#f6f3e5 48%,#edf1df);border:1px solid #e5ddc3;padding:38px;border-radius:25px;position:relative;overflow:hidden}.food-copy h2{font-size:34px;line-height:1.35;margin:14px 0}.food-copy>p{font-size:12px;line-height:1.9;color:#8d886e}.food-controls{display:flex;gap:10px;margin:23px 0 16px}.food-controls label{display:flex;flex-direction:column;gap:8px;flex:1;font-size:11px;color:#8a866d;min-width:0}.food-controls select{width:100%;padding:10px 7px;border:1px solid #ded6bb;border-radius:9px;background:#fffdf4;font:inherit;color:#6e725c}.food-custom{font-size:11px;color:#827e6c}.food-custom summary{cursor:pointer;margin-bottom:12px}.food-custom label{display:block;line-height:1.7}.food-custom textarea{width:100%;padding:12px;border:1px solid #ded6bb;border-radius:9px;margin-top:9px;font:inherit;resize:vertical;background:#fffdf6}.food-note{display:block;font-size:9px;line-height:1.8;color:#a19a81;margin-top:16px}.food-machine{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#fffdf5bb;border:1px solid #fffef2;border-radius:20px;padding:26px;text-align:center;box-shadow:0 12px 25px #8d83530b}.food-dice{font-size:63px;width:90px;height:90px;display:grid;place-items:center;background:#f1df9b;border-radius:22px;color:#7a7953;transform:rotate(-9deg);box-shadow:4px 6px 0 #e5d397;line-height:1}.food-dice.rolling{animation:dice-roll .18s linear infinite}.food-result>span{font-size:9px;letter-spacing:1.4px;color:#a79b70}.food-result>strong{font-size:25px;display:block;color:#756f47;margin:10px 0;overflow-wrap:anywhere}.food-result>p{font-size:11px;color:#9a937c;margin:0}.food-machine .text-button{font-size:11px;color:#8b9176}.food-history{font-size:10px;color:#a39b85;line-height:1.7;margin:0;overflow-wrap:anywhere}.game-section-head{margin:45px 0 25px;align-items:center}.game-card-top{display:flex;align-items:center;justify-content:space-between}.game-card-top .game-icon{margin:0 0 12px}.game-card-top .pill{font-size:10px}.game-knowledge{font-size:10px;color:#8c9a7a;display:block;margin:12px 0 17px}.game-actions{margin-top:18px;gap:8px}.game-challenge{border-top:1px solid var(--line);padding-top:15px;margin-top:19px;font-size:11px}.game-challenge summary{cursor:pointer;color:#83936e}.game-challenge p{margin-top:12px!important}.game-challenge a{color:#809764}.game-controls input[type=number]{width:100%;padding:10px;border:1px solid var(--line);background:#fffef9;border-radius:8px;color:inherit}.game-card{display:flex;flex-direction:column}.game-card>p{flex:1}.game-controls{margin-top:0}.play-dialog h2{font-size:25px;margin:13px 0 18px}.play-dialog>p{font-size:12px;line-height:1.9}.play-dialog small{display:block;color:#8a9480;font-size:10px;margin:12px 0}.play-dialog .actions{margin:18px 0;gap:8px}.pixel-grid{display:grid;grid-template-columns:repeat(var(--grid-size),minmax(0,1fr));gap:3px;max-width:390px;width:100%;margin:20px auto;background:#edf1e6;border:5px solid #edf1e6;border-radius:10px}.pixel{border:0;border-radius:3px;aspect-ratio:1;min-width:0;min-height:0;padding:0;background:#fffef8;cursor:pointer;font-size:17px}.pixel.wall{background:#87937e}.pixel.path{background:#d5e5b9}.pixel.endpoint{background:#f3dfa5}.pixel.alive{background:#8dad6f}.pixel:focus-visible{outline:2px solid #9b78b8;outline-offset:0}.pixel:hover{box-shadow:inset 0 0 0 2px #c8bc9b}.play-code-footer{display:flex;gap:15px;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:20px;margin-top:24px;font-size:11px}.play-code-footer .text-link{font-size:11px}.number-lock{font-size:52px;line-height:1;text-align:center;color:#80955e;background:#edf3e1;border-radius:18px;padding:25px;margin:18px 0}#guess-form>label{font-size:12px}#guess-value{min-width:0;width:130px;padding:12px;border:1px solid var(--line);border-radius:10px;font:inherit}.guess-history{color:#8d9d79;font-size:12px}.pack-items{display:grid;grid-template-columns:1fr 1fr;gap:9px}.pack-item{padding:18px 10px;border:1px solid var(--line);border-radius:12px;background:#fffdf6;cursor:pointer;color:#748066}.pack-item strong,.pack-item span{display:block}.pack-item span{margin-top:7px;font-size:10px;color:#99a18e}.pack-item.selected{border-color:#9bb47a;background:#edf4e0}.pack-score{border-radius:10px;background:#edf2e6;padding:15px;margin:17px 0;font-size:13px}.pack-score.overloaded{background:#f6e1d9;color:#aa6c56}.doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.door{border:2px solid #e4dcc4;border-radius:15px;background:#faf4e3;padding:18px 5px;font-size:10px;color:#8c8164;cursor:pointer}.door>span{display:block;font-size:48px;margin-bottom:12px}.door.selected{border-color:#94ae79;background:#edf4e0}.door:disabled{opacity:1;cursor:default}.game-grid{align-items:stretch}.game-card .actions .btn{white-space:normal}dialog{max-height:90vh;overflow:auto;width:min(620px,92vw)}@keyframes dice-roll{50%{transform:rotate(15deg) translateY(-5px)}}
@media(max-width:1000px){.stage-trail{grid-template-columns:repeat(4,minmax(0,1fr))}.food-lab{padding:27px;gap:22px}.food-copy h2{font-size:29px}.food-controls{gap:6px}.food-result>strong{font-size:22px}.food-machine{padding:20px}}
@media(max-width:760px){.learning-summary{padding:22px;gap:18px;align-items:flex-start}.learning-summary h2{font-size:22px}.learning-summary p{font-size:11px}.learning-summary p br{display:none}.growth-counter{min-width:80px;max-width:90px;padding-top:10px}.growth-counter strong{font-size:36px}.growth-counter strong small{font-size:13px}.growth-counter>span{font-size:9px}.stage-trail{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:18px 0}.stage-stop{padding:12px 5px;gap:6px}.stage-stop strong{font-size:9px}.stage-stop small{font-size:8px}.stage-number{width:27px;height:27px;font-size:11px}.learning-tools{flex-wrap:wrap;gap:8px}.course-search{flex-basis:100%}.learning-tools select{flex:1;font-size:11px}.learning-tools .btn{font-size:10px}.lesson-nav{max-height:none}.article .lesson-lead{font-size:12px}.article .lesson-section-title{font-size:17px}.knowledge-block h3{font-size:15px}.objectives{padding:17px;font-size:12px}.exercise-card{padding:18px}.exercise-card h3{font-size:16px}.article .lesson-code{font-size:10px}.lesson-kicker{font-size:9px}.lesson-pagination{font-size:11px}.lesson-pagination span{font-size:10px}.food-lab{grid-template-columns:1fr;gap:23px;padding:23px;border-radius:20px}.food-copy h2{font-size:29px}.food-copy>p br{display:none}.food-machine{padding:24px 17px}.food-dice{width:75px;height:75px;font-size:52px}.food-result>strong{font-size:24px}.game-section-head{margin:33px 0 20px;display:block}.game-section-head h2{font-size:24px}#game-level{margin-top:15px;font-size:11px;padding:9px}.play-dialog h2{font-size:21px}.play-code-footer{align-items:flex-start;flex-direction:column}.play-dialog .btn{font-size:11px;padding:10px 12px}.pixel-grid{gap:2px;border-width:4px}.life-grid .pixel{border-radius:2px}.pixel{font-size:14px}.door>span{font-size:39px}.doors{gap:8px}.door{font-size:9px}.pack-item{padding:15px 8px}}