:root{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;font-optical-sizing:auto;color:#29312f;background:#f5f5f1;font-size:14px;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{height:100%;width:100%;margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;touch-action:manipulation}button:active{transform:scale(.97)}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #477c6e;outline-offset:3px}button:hover:not(:disabled){color:#376e5e}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:-.025em}button,a{transition:background .16s,color .16s}.app{height:100dvh;width:100%;display:flex;overflow:hidden}.rail{width:64px;flex-shrink:0;display:flex;align-items:center;flex-direction:column;padding:19px 8px;background:#e9ece6}.brand{width:36px;height:36px;border-radius:11px;background:#344d43;color:#faf8ed;text-decoration:none;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:600;letter-spacing:-2px}.brand span{font-size:17px;margin:0 0 7px 2px}.rail nav{display:grid;gap:12px;width:100%;margin-top:35px}.rail nav button{height:59px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#7b847d;font-size:9px}.rail nav button.active{background:#dbe3d9;color:#385e4d}.rail-foot{margin-top:auto;font-size:10px;color:#8c958a;letter-spacing:2px}.workspace{flex:1;min-width:0;min-height:0;display:grid;grid-template-rows:64px minmax(0,1fr) 101px 20px;gap:12px;padding:0 22px}header{display:flex;align-items:center;gap:18px;min-width:0}.wordmark{font-size:22px;font-weight:650;letter-spacing:1px;color:#344238}.header-separator{height:19px;width:1px;background:#d7dcd4}.header-title{font-size:14px;font-weight:500;color:#4b574e}.header-right{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:11px;color:#7d877e}.header-right i{width:5px;height:5px;border-radius:50%;background:#6b9180}.header-right span{margin-left:18px;font:10px ui-monospace,monospace;color:#9aa197}main{position:relative;display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,23vw,340px);gap:20px;min-height:0;min-width:0}.stage{position:relative;overflow:hidden;min-height:0;min-width:0;border-radius:16px;background:#eeece5;box-shadow:inset 0 0 0 1px #dadcd255}.canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0}.stage-heading{position:absolute;left:24px;right:24px;top:22px;z-index:3;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.stage-heading h1{font-size:20px;font-weight:580;color:#424d43;line-height:1.25}.stage-heading p{font-size:11px;color:#879084;margin-top:6px}.stage-heading>span{font-size:10px;color:#90978b;padding-top:4px}.stage-controls{position:absolute;bottom:19px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:3}.zoom-control{display:flex;align-items:center;padding:5px;gap:2px;border:1px solid #ffffffaa;border-radius:11px;background:#fbfcf7c9;-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);box-shadow:0 3px 12px #25382c0c}.zoom-control button{width:30px;height:28px;display:grid;place-items:center;border-radius:7px;color:#64766a}.zoom-control button:hover{background:#e6ebe2}.zoom-control>span{font:10px ui-monospace,monospace;width:40px;text-align:center;color:#68786c;font-variant-numeric:tabular-nums}.zoom-control>i{height:16px;width:1px;background:#d6ddd1;margin:0 4px}.stage-hint{font-size:10px;color:#8b9588}.wire-legend{position:absolute;bottom:74px;left:22px;z-index:3;display:flex;flex-direction:column;gap:8px;background:#f9faf5de;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:10px;padding:12px 14px;box-shadow:0 2px 12px #29382e08;pointer-events:none;border:1px solid #ffffff88}.wire-legend>span{display:flex;align-items:center;gap:8px;font-size:10px;color:#596b5e}.wire-legend>span>i{width:17px;height:5px;border-radius:3px}.wire-legend .legend-heading{font-size:10px;font-weight:600;color:#485d4f;margin-bottom:2px}.legend-heading small{font-size:8px;font-weight:400;color:#96a08e;margin-left:6px}.wire-legend .empty-pin{color:#91998e}.wire-legend .empty-pin>i{background:none!important;border:1px dashed #9fa89a;height:6px}.inspector{display:flex;flex-direction:column;min-width:0;min-height:0;gap:16px;padding-top:2px}.focus-card{min-height:158px;padding:17px 18px 14px;border-radius:14px;background:#fcfdfa;box-shadow:0 2px 12px #243a2b06;border:1px solid #e5e9df;flex-shrink:0;transition:border-color .15s,background .15s}.focus-card.has-focus{background:#fcfff9;border-color:#b4cabc}.focus-eyebrow{display:flex;justify-content:space-between;font-size:9px;line-height:1.3;color:#93a08e;letter-spacing:.02em}.focus-eyebrow span:first-child{color:#64806b}.focus-card h2{font-size:18px;font-weight:600;line-height:1.35;margin:10px 0 8px;white-space:normal}.focus-card p{font-size:11px;color:#636e62;line-height:1.7;min-height:36px}.focus-foot{display:flex;justify-content:space-between;gap:8px;font-size:8px;color:#98a28f;margin-top:12px}.focus-foot span:first-child{color:#758c75;letter-spacing:.015em}.tabs{display:flex;gap:21px;padding:0 3px;border-bottom:1px solid #e2e6dd;flex-shrink:0}.tabs button{font-size:11px;color:#929b8a;padding:0 0 11px;position:relative}.tabs button.selected{color:#476550;font-weight:600}.tabs button.selected:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;border-radius:2px;background:#60836b}.tabs small{font-size:9px;margin-left:4px;color:#97a58c}.panel-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c9d3bf transparent;padding:0 4px}.panel-body h3{font-size:16px;font-weight:560;margin:1px 0 10px}.description{font-size:11px;line-height:1.85;color:#6e7868}.module-facts{display:flex;justify-content:space-between;font-size:10px;padding:11px 0 3px;color:#93a082}.module-facts b{font-weight:500;color:#6d825f}.steps{list-style:none;margin:20px 0 22px;padding:0;display:grid;gap:17px}.steps li{display:flex;gap:13px;align-items:flex-start;font-size:11px;color:#697e5b}.steps li>span{font:9px ui-monospace,monospace;color:#9eac8d;padding-top:2px}.steps small{display:block;font-size:10px;color:#788571;margin-top:5px;line-height:1.5}.primary{width:100%;height:39px;background:#456b54;color:#f4f7ef;display:flex;align-items:center;gap:9px;padding:0 12px;border-radius:9px;font-size:11px;flex-shrink:0}.primary svg:last-child{margin-left:auto}.primary:hover:not(:disabled){background:#365d44;color:#fff}.connection-note{font-size:9px;line-height:1.6;color:#9ba98c;margin-top:8px;text-align:center}.readout-panel{border-radius:12px;background:#edf1e7;padding:14px 15px;flex-shrink:0}.readout-header{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#647c54}.readout-header small{font-size:8px;color:#9aaa89;margin-left:8px}.readout-header>div{display:flex;gap:4px}.readout-header button{display:grid;place-items:center;padding:4px;border-radius:5px;color:#839774}.readout-header button:hover{background:#e2e9d9}.readout{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 12px}.readout>div>small{font-size:9px;color:#91a17b}.readout strong{display:block;font-size:32px;font-weight:350;line-height:1.2;letter-spacing:-.04em;color:#5b7b4f;font-variant-numeric:tabular-nums}.readout strong span{font-size:11px;margin-left:5px;letter-spacing:0}.readout svg{width:125px;height:43px}.readout-foot{border-top:1px solid #dce5d1;padding-top:9px;display:flex;align-items:center;font-size:8px;color:#90a17a;gap:5px}.readout-foot i{height:4px;width:4px;background:#a6b398;border-radius:50%}.readout-foot i.live{background:#7ea269}.readout-foot span{margin-left:auto;color:#a4b191}.leader-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden;z-index:5;pointer-events:none;opacity:0;transition:opacity .12s}.leader-overlay.visible{opacity:1}.leader-overlay path{fill:none;stroke:#65a392;stroke-width:1;stroke-dasharray:3 5;opacity:.75}.leader-overlay circle{fill:#f7fbf4;stroke:#5a9c8a;stroke-width:1.8}.experiments{display:flex;flex-direction:column;min-height:0;gap:10px}.experiment-heading{display:flex;align-items:center;justify-content:space-between}.experiment-heading h3{font-size:12px;font-weight:550;color:#687e57}.experiment-heading>span{font-size:9px;color:#a0ad8e}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;flex:1;min-height:0}.experiment-card{display:flex;align-items:center;gap:13px;text-align:left;border-radius:10px;background:#eef1e8;padding:12px 15px;border:1px solid transparent;min-width:0}.experiment-card>svg:first-child{flex-shrink:0;color:#94a47e}.experiment-card>span{display:flex;align-items:baseline;gap:10px;min-width:0}.experiment-card small{font:8px ui-monospace,monospace;color:#a2af8d}.experiment-card strong{font-size:12px;font-weight:500;color:#70865a;white-space:nowrap}.experiment-card>svg:last-child{margin-left:auto;color:#a4b18c;flex-shrink:0}.experiment-card.chosen{background:#e5ecdc;border-color:#bbcdb0}.experiment-card.chosen strong,.experiment-card.chosen>svg:first-child{color:#507546}.experiment-card:hover{background:#e7eddf}.module-list{display:grid;gap:2px}.module-list button{display:flex;gap:10px;align-items:center;text-align:left;width:100%;padding:11px 3px;border-radius:6px;font-size:11px}.module-list button:hover{background:#edf2e7}.module-list small{font:8px ui-monospace,monospace;color:#a1ae8f}.module-list svg{margin-left:auto;color:#a3b090}.lesson-row{display:flex;gap:13px;align-items:center;text-align:left;width:100%;padding:16px 0;border-bottom:1px solid #e0e7d7;font-size:11px}.lesson-row>small{font:10px ui-monospace,monospace;color:#a4b090}.lesson-row em{display:block;font-size:9px;font-style:normal;color:#99aa85;margin-top:5px}.lesson-row svg{margin-left:auto}footer{display:flex;align-items:center;justify-content:space-between;color:#a4ad99;font-size:8px;letter-spacing:.03em}.fallback{display:grid;place-content:center;height:100%;gap:20px;text-align:center}.fallback h2{font-size:18px}.fallback button{padding:10px;background:#e5ecde;border-radius:8px}@media(max-width:1250px){.workspace{padding:0 16px;gap:10px;grid-template-rows:58px minmax(0,1fr) 94px 18px}main{gap:15px;grid-template-columns:minmax(0,1fr) 282px}.rail{width:57px}.inspector{gap:13px}.focus-card{padding:14px;min-height:150px}.focus-card h2{font-size:17px}.stage-heading{left:18px;top:18px}.experiment-card{gap:9px;padding:10px}.experiment-card>span{gap:7px}.experiment-card strong{font-size:11px}.readout-panel{padding:12px}.steps{gap:13px;margin:16px 0}}@media(max-height:760px){.workspace{grid-template-rows:52px minmax(0,1fr) 82px 16px;gap:8px}.focus-card{padding:12px 14px;min-height:135px}.focus-card h2{font-size:16px;margin:8px 0 5px}.focus-card p{font-size:10px;min-height:32px}.focus-foot{margin-top:8px}.inspector{gap:11px}.readout-panel{padding:10px 12px}.readout{margin:5px 0 7px}.readout strong{font-size:27px}.readout-foot{padding-top:6px}.stage-heading{top:17px}.stage-heading h1{font-size:18px}.steps{gap:11px;margin:13px 0}.experiment-card{padding:8px 12px}.experiment-heading>span{display:none}}@media(max-width:1000px){.workspace{grid-template-rows:54px minmax(0,1fr) 90px 18px;padding:0 12px;gap:9px}.rail{width:50px;padding:15px 6px}.brand{width:32px;height:32px;font-size:19px}.rail nav{margin-top:25px}.rail nav button{font-size:8px}main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(175px,.38fr);gap:12px}.inspector{display:grid;grid-template-columns:minmax(0,1fr) 180px;grid-template-rows:minmax(0,1fr);gap:12px;overflow:hidden;padding:0}.focus-card{grid-column:1;grid-row:1;min-height:0;overflow:auto}.focus-card h2{font-size:17px}.focus-card p{font-size:11px}.tabs,.panel-body{display:none}.readout-panel{grid-column:2;grid-row:1;display:flex;flex-direction:column;justify-content:space-between}.readout-header small{display:none}.readout svg{width:66px}.readout strong{font-size:27px}.readout-foot{flex-wrap:wrap}.readout-foot span{margin-left:0}.stage-heading{top:17px;left:20px}.stage-heading h1{font-size:18px}.stage-heading p{font-size:10px}.stage-controls{bottom:15px;left:16px;right:16px}.stage-hint{font-size:9px}.wire-legend{bottom:65px;left:18px;padding:10px;gap:6px}.wire-legend .legend-heading{font-size:9px}.wire-legend>span{font-size:9px}.experiment-card>svg:first-child{width:18px}.experiment-card>span{display:block}.experiment-card small{display:none}.experiment-card strong{font-size:11px}.experiment-card{gap:8px}.experiment-card>svg:last-child{display:none}.header-right span{display:none}.header-title{font-size:12px}.wordmark{font-size:21px}.focus-card:after{content:""}.leader-overlay path{opacity:.55}}@media(max-width:560px){.workspace{padding:0 8px;gap:8px;grid-template-rows:48px minmax(0,1fr) 76px 15px}.rail{width:42px;padding:12px 4px}.brand{width:29px;height:29px;font-size:18px;border-radius:9px}.rail nav button{height:53px;font-size:7px}.rail nav{gap:8px;margin-top:22px}.rail nav svg{width:18px}.header-title{font-size:10px}.wordmark{font-size:18px}header{gap:11px}.header-right{font-size:9px;gap:5px}.header-separator{height:15px}main{grid-template-rows:minmax(0,1fr) 190px;gap:9px}.inspector{grid-template-columns:minmax(0,1fr) 106px;gap:8px}.focus-card{padding:12px 11px}.focus-card h2{font-size:15px}.focus-card p{font-size:10px;line-height:1.7}.focus-eyebrow{font-size:8px}.focus-foot{font-size:7px;flex-direction:column;gap:6px;margin-top:10px}.readout-panel{padding:10px}.readout-header{font-size:9px;flex-wrap:wrap;gap:8px}.readout svg{display:none}.readout strong{font-size:25px}.readout-header button{padding:3px}.readout-foot{font-size:7px}.stage-heading{left:14px;right:14px;top:15px}.stage-heading h1{font-size:16px}.stage-heading p{font-size:9px}.stage-heading>span{font-size:8px}.stage-controls{left:12px;right:12px;bottom:12px}.stage-hint{display:none}.zoom-control{padding:3px}.zoom-control button{width:26px;height:26px}.zoom-control>span{font-size:9px;width:35px}.wire-legend{bottom:57px;left:13px;gap:5px;padding:8px;background:#f9faf5c9}.wire-legend .legend-heading{display:none}.wire-legend>span{font-size:8px}.wire-legend i{width:12px}.experiment-card{padding:7px 4px;justify-content:center;gap:4px;border-radius:8px}.experiment-card>svg:first-child{display:none}.experiment-card strong{font-size:9px}.cards{gap:5px}.experiment-heading h3{font-size:11px}.experiment-heading>span{display:none}.experiments{gap:8px}footer{font-size:7px;letter-spacing:0}.leader-overlay circle{r:3px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}button:active{transform:none}}@media(prefers-reduced-transparency:reduce){.zoom-control,.wire-legend{background:#f8faf5;-webkit-backdrop-filter:none;backdrop-filter:none}}@media(prefers-contrast:more){:root{color:#162319}.focus-card,.zoom-control,.wire-legend{background:#fff;border:1px solid #71816b}.description,.focus-card p,.steps small{color:#475c3c}}.compact-connect{display:none}@media(max-width:1000px){.stage-hint{display:none}.compact-connect{display:flex;align-items:center;gap:6px;padding:10px 12px;border-radius:9px;background:#456b54;color:#fff;font-size:10px;box-shadow:0 3px 12px #25382c12}.inspector.browsing .focus-card{display:none}.inspector.browsing .panel-body{display:block;grid-row:1;grid-column:1}.module-list{display:grid;grid-template-columns:1fr 1fr;gap:4px}.module-list button{font-size:10px;padding:9px 3px}}@media(max-width:1000px){.inspector>.primary{display:none}}.focus-card .wire-legend{position:static;display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 13px;margin-top:12px;padding:10px 0 0;border:0;border-top:1px solid #e3e9df;border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.focus-card .wire-legend .legend-heading{display:none}.focus-card .wire-legend>span{font-size:8px;gap:5px}.focus-card .wire-legend>span>i{width:11px;height:4px}.stage-controls{-webkit-user-select:none;user-select:none}.canvas-wrap canvas{touch-action:none}.canvas-wrap canvas[data-dragging=true]{cursor:grabbing!important}.wire-legend .empty-pin>i{background:#a4a8ab!important;border:0}.zoom-control{flex-shrink:0}@media(max-width:560px){.stage-controls{flex-wrap:wrap;gap:6px}.stage-controls .compact-connect{padding:8px;font-size:9px;margin-left:auto}.zoom-control>i{margin:0 2px}}.course-app .workspace{grid-template-rows:56px minmax(0,1fr) 100px 18px;gap:10px}.course-app main{grid-template-columns:minmax(0,1fr) clamp(340px,30vw,430px);gap:18px}.course-app .header-right .course-progress{display:inline;margin-left:0;font-size:11px;color:#6a7c70}.course-app .stage-heading{top:20px}.stage-lesson-number{font:9px ui-monospace,monospace;letter-spacing:.15em;color:#879183;margin-bottom:7px}.course-app .stage-heading h1{font-size:21px}.course-app .stage-heading p{font-size:11px}.stage-module-tags{position:absolute;left:22px;bottom:72px;z-index:3;display:flex;gap:6px;align-items:center;font-size:10px}.stage-module-tags>span{color:#879081;margin-right:3px}.stage-module-tags button{padding:6px 9px;border:1px solid #d4dace;background:#f6f7f0e8;border-radius:6px;color:#6e7b6c}.stage-module-tags button.active{background:#e4ece1;border-color:#9eb5a4;color:#456c56}.scene-demo-controls{display:flex;align-items:center;gap:5px}.scene-demo-controls button{display:flex;align-items:center;gap:6px;padding:10px;border-radius:9px;background:#456b54;color:#f5f7f0;font-size:10px}.course-app .course-inspector{display:flex;flex-direction:column;gap:10px;min-height:0;overflow:visible;padding:0}.course-app .focus-card{min-height:96px;max-height:128px;padding:12px 15px;overflow:auto;border-radius:12px}.course-app .focus-card h2{font-size:14px;margin:6px 0 4px;line-height:1.3}.course-app .focus-card p{font-size:10px;line-height:1.65;min-height:0}.course-app .focus-eyebrow{font-size:9px}.course-panels{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1.25fr) minmax(145px,.9fr);gap:10px}.mobile-pane-switch{display:none}.guide-card{min-height:0;display:flex;flex-direction:column;border:1px solid #dfe4da;border-radius:12px;overflow:hidden;background:#fafbf6}.guide-context{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px 8px;color:#8a9482;font-size:9px;flex-shrink:0}.guide-context>span:first-child{color:#6f7e69}.module-switch{display:flex;gap:6px;padding:0 14px 9px;flex-shrink:0;flex-wrap:wrap}.module-switch button{font-size:10px;padding:5px 8px;background:#eef1e8;color:#8a9481;border-radius:5px;border:1px solid transparent}.module-switch button[aria-pressed=true]{border-color:#b9c9b3;background:#e5edde;color:#456b51}.module-switch .back-to-lesson{display:flex;align-items:center;gap:4px}.guide-tabs{display:flex;gap:20px;padding:0 15px;border-bottom:1px solid #e1e6db;flex-shrink:0}.guide-tabs button{position:relative;padding:6px 0 10px;font-size:12px;color:#89927f}.guide-tabs button[aria-selected=true]{color:#385d48;font-weight:600}.guide-tabs button[aria-selected=true]:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;border-radius:2px;background:#5c8065}.guide-body{padding:16px;overflow:auto;min-height:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cbd5c1 transparent}.guide-body:focus-visible{outline:2px solid #8baa96;outline-offset:-3px;border-radius:4px}.section-kicker{font-size:8px;letter-spacing:.055em;color:#9aa38e;margin-bottom:8px}.guide-body h2{font-size:20px;font-weight:600;line-height:1.3;margin-bottom:8px;color:#334f3e}.guide-intro{font-size:12px;line-height:1.75;color:#65745e}.principle{font-size:11px;line-height:1.8;color:#7d8873;margin-top:10px}.learning-objective{margin:16px 0;padding:11px 12px;border-left:2px solid #a6b99a;background:#eef2e7;border-radius:0 6px 6px 0}.learning-objective>span{font-size:9px;color:#7d9271;font-weight:600}.learning-objective p{font-size:11px;line-height:1.8;margin-top:4px;color:#627358}.lesson-steps{list-style:none;padding:0;margin:14px 0;display:grid;gap:6px}.lesson-steps button{display:flex;align-items:flex-start;gap:10px;width:100%;padding:10px;text-align:left;border-radius:8px;border:1px solid transparent}.lesson-steps button.active{background:#eef3e7;border-color:#d9e2cf}.step-index{display:grid;place-items:center;min-width:21px;height:21px;border:1px solid #d4deca;border-radius:50%;font:9px ui-monospace,monospace;color:#8da17b}.lesson-steps button.active .step-index{background:#5d7d57;color:#fff;border-color:#5d7d57}.lesson-steps strong{font-size:11px;line-height:21px;font-weight:550;color:#5b7050}.lesson-steps small{display:block;font-size:10px;line-height:1.8;margin-top:4px;color:#7b8870}.lesson-steps svg:last-child{flex-shrink:0;margin-left:auto;margin-top:4px;color:#99a78c}.knowledge-check{border:0;border-top:1px solid #e0e7d6;margin:18px 0 0;padding:12px 0 0;min-width:0}.knowledge-check legend{font-size:11px;line-height:1.6;padding:0 0 8px;color:#5b7050;font-weight:550}.knowledge-check label{display:flex;align-items:center;gap:7px;border:1px solid #e1e7d8;border-radius:6px;padding:9px;margin-bottom:6px;font-size:10px;color:#819071;cursor:pointer;line-height:1.6}.knowledge-check label.chosen{background:#e9f0e0;border-color:#afc29a;color:#4e7142}.knowledge-check input{accent-color:#5c8250;flex-shrink:0;margin:0}.knowledge-check p{font-size:10px;line-height:1.8;padding:9px;border-radius:6px}.answer-correct{background:#eaf2e1;color:#58784a}.answer-retry{background:#f3eddf;color:#8a7955}.learning-note{font-size:9px;line-height:1.8;color:#9ca68b;margin-top:12px}.pin-map{display:flex;gap:12px;margin:17px 0}.socket-drawing{position:relative;display:flex;flex-direction:column;justify-content:space-around;flex-shrink:0;width:38px;padding:7px 5px;background:#d2cfc1;border:1px solid #b5b2a3;border-radius:4px;box-shadow:inset 4px 0 #e0ddcf}.socket-drawing>i{position:absolute;left:-4px;top:43%;width:5px;height:22px;border-radius:2px;background:#bdbbac}.socket-drawing>span{display:grid;place-items:center;background:#444b44;border-left:3px solid;width:25px;height:21px;border-radius:2px;color:#e9e7da;font:9px ui-monospace,monospace}.pin-rows{flex:1;min-width:0;display:grid;gap:5px}.pin-rows button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 7px;background:#f1f3eb;border:1px solid #e5e9de;border-radius:5px}.pin-rows button:hover{background:#e7eee0;border-color:#b5c8a7}.pin-rows i{width:14px;height:4px;border-radius:2px;flex-shrink:0}.pin-rows b{display:block;font:11px ui-monospace,monospace;color:#4b6352}.pin-rows small{display:block;font-size:9px;color:#91a084;margin-top:3px}.pin-rows em{font-size:9px;color:#7b8a6d;font-style:normal;margin-left:auto;max-width:48%;line-height:1.5}.pin-note{padding:10px 12px;border-radius:7px;background:#f0eee2;color:#8b8262;font-size:10px;line-height:1.8}.numbering-key{margin:15px 0;font-size:10px;color:#7d8b70}.numbering-key b{font-weight:550}.numbering-key p{margin-top:6px;line-height:1.9;color:#8d997f}.source-note{font-size:9px;line-height:1.75;color:#98a28d;margin-top:14px}.source-file{font:9px/1.7 ui-monospace,monospace;overflow-wrap:anywhere;color:#87957b;margin-top:6px}.inline-action{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:10px;padding:9px 12px;border-radius:6px;color:#4c6f45;background:#e6eedc}.example-option{display:block;width:100%;border:1px solid #e0e6d7;background:#f4f6ee;border-radius:8px;text-align:left;padding:13px;margin:12px 0}.example-option.active{border-color:#a9bf9a;background:#edf3e5}.example-option>div{display:flex;align-items:center;gap:8px;color:#617e50}.example-option strong{font-size:12px;font-weight:550}.example-option>div>svg:last-child{margin-left:auto}.example-option p{font-size:11px;line-height:1.7;color:#7a8b6c;margin:8px 0}.example-option small{font-size:10px;line-height:1.8;color:#95a285;display:block}.spec-list{margin:12px 0}.spec-list>div{display:grid;grid-template-columns:40% 1fr;gap:12px;border-bottom:1px solid #e5eadd;padding:11px 0;font-size:10px;line-height:1.7}.spec-list dt{color:#8e9b80}.spec-list dd{margin:0;color:#5e7752}.spec-list dd.unverified{color:#9c9271}.content-pending{margin:15px 0;padding:15px;border:1px dashed #d5dfc8;border-radius:8px;font-size:11px;color:#91a080;line-height:1.8}.content-pending h3{font-size:12px;font-weight:550;margin-bottom:6px}.lesson-code{display:flex;flex-direction:column;min-height:0;overflow:hidden;border:1px solid #dce4d4;border-radius:12px;background:#f8faf3}.code-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px 10px;flex-shrink:0}.code-heading h3{font-size:12px;font-weight:600;color:#536e48}.code-heading h3>span{font:8px ui-monospace,monospace;color:#99a58a;margin-left:8px}.code-heading p{font-size:9px;color:#8b9c7a;margin-top:4px}.code-actions{display:flex;gap:5px}.code-actions button{display:grid;place-items:center;border-radius:5px;padding:6px;color:#8d9d7a}.code-actions button:hover{background:#e7efdd;color:#5c7d49}.code-lines{margin:0;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 0;font:10px/1.8 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;-moz-tab-size:4;tab-size:4;color:#4b6054;background:#f0f3e9;scrollbar-width:thin;scrollbar-color:#c4d1b8 transparent}.code-lines code{display:block;min-width:max-content}.code-line{display:flex;min-width:100%;padding-right:16px;border-left:2px solid transparent}.code-line.highlighted{background:#e3edda;border-left-color:#92b17b}.line-number{display:inline-block;flex-shrink:0;width:37px;padding-right:12px;text-align:right;-webkit-user-select:none;user-select:none;color:#a9b19b;font-size:9px}.syntax-comment{color:#99a18c}.syntax-keyword{color:#72608c}.syntax-string{color:#8c7446}.syntax-number{color:#b0844e}.code-footer{padding:8px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:#99a88a;font-size:8px;flex-shrink:0}.code-footer button{display:flex;align-items:center;gap:3px;font-size:9px;color:#708b5f}.lesson-navigation{min-height:0;display:flex;flex-direction:column;gap:8px}.lesson-navigation-heading{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.lesson-navigation-heading h3{font-size:12px;font-weight:550;color:#6c805c}.lesson-navigation-heading h3>span{margin-left:12px;font:9px ui-monospace,monospace;color:#a4ae94}.lesson-navigation-heading>div{display:flex;gap:3px}.lesson-navigation-heading button{display:grid;place-items:center;width:23px;height:22px;border:1px solid #dce4d3;border-radius:5px;color:#8ba074}.lesson-cards{display:flex;gap:12px;overflow-x:auto;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:#c4d1b8 transparent}.lesson-cards>button{flex:1;min-width:250px;display:flex;align-items:center;gap:14px;padding:12px 16px;text-align:left;border:1px solid #e0e6d7;border-radius:10px;background:#eef2e7}.lesson-cards>button.active{background:#e5eddc;border-color:#afc39f}.lesson-number{font:19px ui-monospace,monospace;font-weight:300;color:#a4b68f}.lesson-cards strong{display:block;font-size:13px;font-weight:550;color:#647f50}.lesson-cards small{display:block;font-size:9px;margin-top:5px;color:#94a481}.lesson-status{display:flex;align-items:center;gap:4px;margin-left:auto;font-size:9px;color:#8ba276;white-space:nowrap}.lesson-cards>button>svg{color:#a4b791;flex-shrink:0}.code-dialog,.catalog-dialog{padding:0;width:min(850px,calc(100vw - 36px));max-height:84dvh;border:1px solid #d6dfcd;border-radius:16px;background:#fafcf5;color:#344d3c;box-shadow:0 24px 100px #22372933;overflow:hidden}.code-dialog[open],.catalog-dialog[open]{display:flex;flex-direction:column}.code-dialog::backdrop,.catalog-dialog::backdrop{background:#263c3566;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;padding:22px 24px 13px;gap:12px;flex-shrink:0}.dialog-heading span{font:9px ui-monospace,monospace;letter-spacing:.1em;color:#9eab8e}.dialog-heading h2{font-size:22px;font-weight:550;margin-top:7px}.dialog-heading button{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:#829672;background:#eef3e7}.dialog-source{font:10px/1.7 ui-monospace,monospace;color:#829571;padding:0 24px;overflow-wrap:anywhere;flex-shrink:0}.dialog-tip{padding:10px 24px 16px;font-size:11px;color:#91a07d;line-height:1.7;flex-shrink:0}.code-dialog .code-lines{font-size:12px;padding:14px 0}.code-dialog .line-number{width:46px;font-size:10px}.dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 24px;font-size:10px;color:#92a27e;flex-shrink:0}.dialog-footer button{display:flex;align-items:center;gap:7px;font-size:11px;padding:10px 14px;background:#527546;border-radius:7px;color:#f4f9ee}.catalog-dialog{width:min(620px,calc(100vw - 36px))}.catalog-body{min-height:0;overflow:auto;padding:0 24px 24px;scrollbar-width:thin}.catalog-body>p{font-size:11px;color:#91a27d;line-height:1.8;margin-bottom:16px}.catalog-modules{display:grid;grid-template-columns:1fr 1fr;gap:7px}.catalog-modules button{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #e0e8d5;background:#f1f6e9;padding:12px;border-radius:7px}.catalog-modules small{font:9px ui-monospace,monospace;color:#a8b896}.catalog-modules strong{font-size:11px;font-weight:500;color:#6d8959}.catalog-modules em{display:block;font-size:9px;font-style:normal;color:#a0b18b;margin-top:4px}.catalog-modules svg{margin-left:auto;color:#98b184}.catalog-lesson{display:flex;align-items:center;gap:16px;text-align:left;border:1px solid #dce6cf;border-radius:9px;padding:16px;margin-bottom:10px;width:100%;background:#eef4e5}.catalog-lesson>span{font:22px ui-monospace,monospace;color:#a8bc91}.catalog-lesson h3{font-size:14px;font-weight:550;color:#6a8956}.catalog-lesson p{font-size:11px;color:#95a782;line-height:1.8;margin-top:5px}.catalog-lesson svg{flex-shrink:0;color:#a9bc93}@media(min-width:1500px){.course-app .workspace{grid-template-rows:64px minmax(0,1fr) 108px 20px}.course-panels{grid-template-rows:minmax(0,1.35fr) minmax(190px,.8fr)}.guide-body{padding:20px}.guide-intro{font-size:13px}.code-lines,.course-app .focus-card p{font-size:11px}}@media(max-height:760px)and (min-width:1001px){.course-app .workspace{grid-template-rows:50px minmax(0,1fr) 88px 16px;gap:8px}.course-app .focus-card{min-height:84px;max-height:100px;padding:10px 13px}.course-panels{grid-template-rows:minmax(0,1.3fr) minmax(150px,.8fr);gap:8px}.guide-context{padding-top:8px}.guide-body{padding:12px 14px}.code-heading{padding:9px 12px 7px}}@media(max-width:1000px){.course-app .workspace{grid-template-rows:50px minmax(0,1fr) 92px 16px;gap:8px}.course-app main{grid-template-columns:1fr;grid-template-rows:minmax(200px,1fr) minmax(260px,.86fr);gap:10px}.course-app .course-inspector{display:flex;flex-direction:row;gap:10px;min-height:0;overflow:hidden}.course-app .focus-card{width:170px;flex-shrink:0;max-height:none;min-height:0;padding:13px}.course-panels{display:flex;flex-direction:column;min-width:0;gap:7px}.mobile-pane-switch{display:flex;gap:5px;flex-shrink:0}.mobile-pane-switch button{font-size:10px;padding:5px 9px;border-radius:5px;color:#9aaa89;background:#eef3e6}.mobile-pane-switch button.active{background:#dfead4;color:#5e804b}.guide-card,.lesson-code{flex:1}.course-panels[data-mobile-pane=guide] .lesson-code,.course-panels[data-mobile-pane=code] .guide-card{display:none}.guide-context{padding:7px 12px}.module-switch{padding-bottom:5px}.guide-tabs{gap:22px}.guide-tabs button{font-size:11px;padding:4px 0 7px}.guide-body{padding:12px}.guide-body h2{font-size:17px}.course-app .stage-heading{top:14px}.course-app .stage-heading h1{font-size:18px}.stage-module-tags{bottom:62px;left:16px;font-size:9px}.stage-module-tags button{padding:4px 7px}.course-app .stage-controls{bottom:13px}.course-app .stage-hint{display:none}.course-app .focus-eyebrow{gap:8px;flex-wrap:wrap}.lesson-cards>button{min-width:230px}.lesson-status{font-size:8px}.lesson-cards strong{font-size:12px}}@media(max-width:560px){.course-app .workspace{grid-template-rows:46px minmax(0,1fr) 83px 14px;gap:7px}.course-app main{grid-template-rows:minmax(190px,1fr) minmax(280px,.95fr);gap:8px}.course-app .header-right .course-progress{font-size:8px}.header-right>svg{display:none}.course-app .course-inspector{flex-direction:column;gap:6px}.course-app .focus-card{width:100%;height:57px;min-height:57px;max-height:57px;padding:7px 10px;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:8px;overflow:hidden}.course-app .focus-eyebrow{grid-column:2;grid-row:1;font-size:7px}.course-app .focus-eyebrow>span:last-child{display:none}.course-app .focus-card h2{grid-column:1;grid-row:1;font-size:12px;margin:0;line-height:1.5}.course-app .focus-card p{grid-column:1/-1;grid-row:2;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.mobile-pane-switch{position:absolute;right:0;top:0}.course-panels{position:relative;padding-top:29px}.mobile-pane-switch button{font-size:9px;padding:5px 8px}.guide-context{font-size:8px;padding:7px 10px 5px}.module-switch{padding:0 10px 4px}.module-switch button{font-size:9px;padding:3px 6px}.guide-tabs{padding:0 10px;gap:22px}.guide-tabs button{font-size:10px}.guide-body{padding:10px}.guide-intro{font-size:11px}.principle{font-size:10px}.course-app .stage-heading{left:13px;right:13px;top:13px}.course-app .stage-heading h1{font-size:16px}.course-app .stage-heading p{font-size:9px}.stage-lesson-number{font-size:8px;margin-bottom:5px}.course-app .stage-controls{left:10px;right:10px;gap:5px;flex-wrap:wrap;bottom:10px}.scene-demo-controls{margin-left:auto}.scene-demo-controls button{font-size:8px;padding:8px;gap:4px}.stage-module-tags{bottom:56px;left:11px;gap:5px;font-size:8px}.stage-module-tags button{font-size:8px}.stage-module-tags>span{display:none}.lesson-navigation{gap:5px}.lesson-navigation-heading h3{font-size:10px}.lesson-navigation-heading h3>span{font-size:8px;margin-left:7px}.lesson-cards{gap:7px}.lesson-cards>button{padding:8px 10px;gap:10px;min-width:235px}.lesson-number{font-size:16px}.lesson-cards strong{font-size:11px}.lesson-cards small{font-size:8px}.lesson-cards>button>svg{width:12px}.lesson-status{font-size:8px}.code-heading{padding:8px 10px}.code-lines{font-size:9px}.code-footer{padding:6px 9px}.catalog-modules{grid-template-columns:1fr}.dialog-heading{padding:15px}.dialog-heading h2{font-size:18px}.dialog-source,.dialog-tip{padding-left:15px;padding-right:15px}.dialog-footer{padding:12px 15px;flex-wrap:wrap}.code-dialog .code-lines{font-size:10px}.pin-map{gap:7px}.pin-rows button{gap:6px;padding:8px 5px}.pin-rows em{font-size:8px}.pin-rows b{font-size:10px}}@media(prefers-reduced-transparency:reduce){.code-dialog::backdrop,.catalog-dialog::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background:#263c3599}}@media(prefers-contrast:more){.guide-intro,.principle,.guide-body p,.code-heading p,.source-note,.lesson-cards small{color:#465d3c}.guide-card,.lesson-code{border-color:#8a9e7b}}.reset-reading{font-size:10px;color:#8d9b7d;border-bottom:1px solid #cbd8bd;margin:0 0 14px;padding:0 0 3px}.course-app .workspace{grid-template-columns:minmax(0,1fr)}.lesson-navigation,.lesson-cards,.course-panels{min-width:0}
