@font-face{font-family:Barlow;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/barlow-latin-ext-400-normal-HxX4XjxC.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/barlow-latin-400-normal-qiz4-Cze.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Barlow;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/barlow-latin-ext-500-normal-DOaysfXq.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/barlow-latin-500-normal-BPAOfeC8.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Barlow;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/barlow-latin-ext-600-normal-B8NK_A3D.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/barlow-latin-600-normal-DILqtrty.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-ext-500-normal-BXdp1BvY.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-500-normal-G0uxJNrM.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-ext-600-normal-BkQ9hN72.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:600;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-600-normal-BkLiAYu4.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-ext-700-normal-BhgEo64M.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Barlow Semi Condensed;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/barlow-semi-condensed-latin-700-normal-BpqDG8I9.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/jetbrains-mono-latin-ext-400-normal-Bc8Ftmh3.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/jetbrains-mono-latin-400-normal-V6pRDFza.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/jetbrains-mono-latin-ext-500-normal-Cut-4mMH.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/jetbrains-mono-latin-500-normal-BWZEU5yA.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg:#f8f1e6;--bg-deep:#f2e8da;--card:#fffbf6;--card-soft:#fffbf5f2;--panel:#fbf6eeb8;--code-bg:#fffcf8;--line:#e5d8c5;--line-strong:#d6c6af;--line-soft:#efe6d8;--navy:#0f2239;--navy-2:#1b2c44;--ink:#5b6168;--muted:#6e7277;--faint:#a49a8c;--accent:#f86b1d;--accent-deep:#dc5812;--accent-soft:#fdecdd;--green:#27a689;--track:#e9dfd1;--kw:#2c5f9e;--fn:#dc6a2a;--num:#3a6aa6;--str:#3b9450;--gutter:#aea79e;--shadow:0 10px 26px -20px #6e4e2673;--sans:"Barlow", system-ui, sans-serif;--cond:"Barlow Semi Condensed", "Barlow", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;margin:0;overflow:hidden}body{font-family:var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:geometricprecision}.loader{z-index:1000;background:var(--bg);place-items:center;transition:opacity .5s,visibility 0s linear .5s;display:grid;position:fixed;inset:0}.loader:before{content:"";background-image:linear-gradient(90deg,#d6c6af4d 1px,#0000 1px),linear-gradient(#d6c6af4d 1px,#0000 1px);background-position:50%;background-size:28px 28px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000 0,#0000 62%);mask-image:radial-gradient(circle,#000 0,#0000 62%)}.loader.is-done{opacity:0;visibility:hidden;pointer-events:none}.loader-inner{flex-direction:column;align-items:center;padding:0 16px;display:flex;position:relative}.loader-logo,.brand-logo{width:88px;height:70px}.loader-logo .waves,.brand-logo .waves{fill:none;stroke:var(--accent);stroke-width:8.5px;stroke-linecap:round}.loader-logo .dot,.brand-logo .dot{fill:var(--accent)}.loader-title{font-family:var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--navy);white-space:nowrap;margin:16px 0 0;font-size:30px;font-weight:700;line-height:32px}.loader-title span,.brand-text h1 span{color:var(--accent)}.loader-track{background:var(--track);border-radius:4px;width:220px;height:8px;margin-top:22px;position:relative;overflow:hidden}.loader-fill{transform-origin:0;background:linear-gradient(#fb7d33,#f0611a);transition:transform .45s cubic-bezier(.2,.8,.2,1);position:absolute;inset:0;transform:scaleX(.04)}.loader-shine{background:linear-gradient(90deg,#fff0,#ffffff80,#fff0);width:36%;animation:1.4s cubic-bezier(.4,0,.2,1) infinite loader-shine;position:absolute;top:0;bottom:0;left:0}@keyframes loader-shine{0%{transform:translate(-100%)}to{transform:translate(300%)}}.loader-step{min-height:18px;font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;color:var(--faint);white-space:nowrap;margin:12px 0 0;font-size:13.5px;font-weight:500;line-height:18px}.loader.is-failed .loader-track{display:none}.loader.is-failed .loader-step{max-width:340px;font-family:var(--sans);letter-spacing:0;text-transform:none;white-space:normal;text-align:center;color:var(--ink);font-size:15px;line-height:22px}.noscript{text-align:center;max-width:520px;margin-top:22px}.noscript p{color:var(--ink);margin:0;font-size:16px;line-height:24px}.noscript-lessons{text-align:left;color:var(--muted);margin:18px 0 0;padding:0;font-size:14.5px;line-height:21px;list-style:none}.noscript-lessons li+li{margin-top:6px}.noscript-lessons b{font-family:var(--cond);letter-spacing:.03em;color:var(--navy);font-weight:600}@media (prefers-reduced-motion:reduce){.loader{transition-duration:10ms}.loader-shine{display:none}}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}h1,h2,h3,p,ul,ol{margin:0;padding:0}ul,ol{list-style:none}svg{display:block}.artboard{transform-origin:0 0;background:radial-gradient(120% 90% at 40% 45%, #fffcf6b3, transparent 60%), var(--bg);width:1672px;height:941px;position:absolute;top:0;left:0;overflow:hidden}html.is-loading #app{visibility:hidden}.scenery{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.scenery path{fill:none;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round}.scenery .frame{stroke:var(--line);stroke-width:1.5px}.scenery .teal path{stroke:#93bcb2}.scenery .teal-soft path{stroke:#bcd6cd}.scenery .hill path{stroke:#6f9fa6}.scenery .ochre path{stroke:#e3b46a}.scenery .orange path{stroke:#f59a5b}.scenery .cactus path{stroke:#93c19b;stroke-width:5px}.scenery .ring-o circle,.scenery .ring-n circle{fill:none;stroke-width:1.6px}.scenery .ring-o circle{stroke:#f59a5b}.scenery .ring-n circle{stroke:#3e5068;stroke-width:1.4px}.scenery .sun circle{fill:#fdd27f}.scenery .dot-teal circle{fill:#78b8aa}.scenery .dots circle{fill:#ddd1c0}.scenery .dots-o circle{fill:#f4ad78}.scenery .dots-t circle{fill:#8dbdb3}.sidebar{background:var(--bg);width:104px;box-shadow:inset -1.5px 0 0 var(--line-soft);z-index:2;position:absolute;top:98px;bottom:0;left:0}.side-nav li{width:86px;position:absolute;left:9px}.side-nav li:first-child{top:8px}.side-nav li:nth-child(2){top:100px}.side-nav li:nth-child(3){top:192px}.side-nav li:nth-child(4){top:284px}.side-nav li:nth-child(5){top:376px}.side-nav li:nth-child(6){top:468px}.side-nav svg{fill:none;width:32px;height:32px;stroke:var(--navy-2);stroke-width:2.1px;stroke-linejoin:round;stroke-linecap:round;transition:stroke .2s,fill .2s}.side-nav svg .fill,.side-nav svg.fill{fill:var(--navy-2);stroke:none}.brand{z-index:2;align-items:center;gap:38px;display:flex;position:absolute;top:18px;left:32px}.brand-logo{flex:none}.brand-text h1{font-family:var(--cond);letter-spacing:.025em;text-transform:uppercase;color:var(--navy);font-size:48px;font-weight:700;line-height:50px}.brand-text p{font-family:var(--cond);letter-spacing:.3em;text-transform:uppercase;color:#7c7e7d;white-space:nowrap;margin-top:3px;font-size:16.5px;font-weight:500;line-height:20px}.brand-text p i{margin:0 .35em 0 .1em;font-style:normal}.stage-note{border:1.5px solid var(--line);background:var(--card-soft);text-align:center;z-index:3;border-radius:14px;width:min(380px,100% - 32px);padding:20px 22px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.stage-note b{font-family:var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--navy);font-size:17px;font-weight:700}.stage-note p{color:var(--ink);margin:8px 0 0;font-size:15px;line-height:22px}.stage.no-webgl #board-canvas,.stage.no-webgl .viewbar{display:none}.stage{z-index:1;position:absolute;inset:0 500px 140px 72px}#board-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.leaders{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:hidden}.leaders path{fill:none;stroke:var(--c,var(--accent));stroke-width:2px;stroke-dasharray:5.5 4.5;stroke-linecap:butt}.leaders .dot-anchor{fill:var(--c,var(--accent));stroke:#fffdf9;stroke-width:2.4px}.leaders .dot-halo{fill:var(--c,var(--accent));fill-opacity:.22;stroke:none;transform-box:fill-box;transform-origin:50%;animation:2.8s ease-out infinite halo}@keyframes halo{0%{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(2.1)}}.rig{width:0;height:0;position:absolute;top:calc(50% + 70px);left:calc(50% + 10px)}.callout{left:var(--x);top:var(--y);width:var(--w);border:1.5px solid var(--line);background:var(--card-soft);box-shadow:var(--shadow), 0 1px 0 #fffc inset;border-radius:13px;gap:16px;padding:17px 14px 15px 16px;display:flex;position:absolute}.callout.has-dot:after{content:"";background:var(--c);width:11px;height:11px;box-shadow:0 0 0 2px var(--card);border-radius:50%;position:absolute}.callout.has-dot[data-side=bottom]:after{left:calc(var(--at) - 7px);bottom:-7px}.callout.has-dot[data-side=top]:after{left:calc(var(--at) - 7px);top:-7px}.callout.has-dot[data-side=left]:after{top:calc(var(--at) - 7px);left:-7px}.callout.has-dot[data-side=right]:after{top:calc(var(--at) - 7px);right:-7px}.callout-icon{fill:none;width:36px;height:36px;stroke:var(--navy);stroke-width:2.2px;stroke-linejoin:round;stroke-linecap:round;flex:none;margin-top:2px}.callout-icon.tall{height:56px;margin-top:0}.callout-icon.wide{width:40px}.callout-icon .fill{fill:var(--navy);stroke:none}.callout h3{font-family:var(--cond);letter-spacing:.025em;text-transform:uppercase;color:var(--navy);font-size:18.5px;font-weight:700;line-height:22px}.callout p{color:#666d73;margin-top:3px;font-size:15.6px;font-weight:400;line-height:20px}.status{border:1.5px solid var(--line);background:var(--card-soft);width:486px;height:80px;box-shadow:var(--shadow);z-index:2;border-radius:14px;align-items:center;display:flex;position:absolute;top:16px;right:18px;overflow:hidden}.progress-card{border-right:1.5px solid var(--line);flex:none;align-items:center;gap:24px;width:290px;height:100%;padding:0 22px;display:flex}.progress-icon{fill:none;width:44px;height:44px;stroke:var(--navy-2);stroke-width:2.1px;stroke-linejoin:round;flex:none}.progress-body{flex:1}.progress-label{font-family:var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--navy);font-size:17.5px;font-weight:700;display:block}.progress-row{align-items:center;gap:14px;margin-top:6px;display:flex}.progress-track{background:var(--track);border-radius:6px;flex:1;height:12px;overflow:hidden}.progress-fill{background:linear-gradient(#fb7d33,#f0611a);border-radius:6px;height:100%;display:block}.progress-count{font-family:var(--cond);letter-spacing:.04em;color:var(--navy);font-size:20px;font-weight:700}.clock{font-family:var(--mono);letter-spacing:.06em;color:#8a857e;flex-direction:column;gap:2px;padding-left:22px;font-size:16.5px;line-height:23px;display:flex}.status-cactus{width:28px;height:47px;position:absolute;bottom:2px;right:16px}.status-cactus path,.side-desert path{fill:none;stroke-linecap:round;stroke-linejoin:round}.status-cactus .cactus{stroke:#b2cfaa;stroke-width:5.5px}.status-cactus .cactus-shade{stroke:#9dc196;stroke-width:1.4px}.info-card{border:1.5px solid var(--line);background:var(--panel);z-index:2;border-radius:16px;width:486px;height:405px;position:absolute;top:112px;right:18px}.tabs{align-items:flex-end;gap:34px;height:50px;padding:0 0 0 26px;display:flex}.tabs button{height:40px;font-family:var(--cond);letter-spacing:.04em;text-transform:uppercase;color:#85898c;font-size:17.5px;font-weight:500;position:relative}.tabs button.is-active{color:var(--navy);font-weight:700}.info-body{border:1.5px solid var(--line);background:var(--card);border-radius:13px;padding:17px 0 0 22px;position:absolute;inset:58px 8px 7px;overflow:hidden}.expand{width:28px;height:28px;position:absolute;top:20px;right:16px}.expand svg{fill:none;stroke:#6d737a;stroke-width:1.8px;width:28px;height:28px}.expand .fill{fill:#6d737a;stroke:none}.info-body h2{font-family:var(--cond);letter-spacing:.02em;text-transform:uppercase;color:var(--navy);font-size:28px;font-weight:700;line-height:32px}.lede{color:#5f656b;max-width:390px;margin-top:7px;font-size:17.5px;line-height:23.5px}.features{gap:8px;margin-top:14px;display:grid}.features li{color:#5f656b;align-items:center;gap:24px;min-height:47px;font-size:16.6px;line-height:21px;display:flex}.feature-icon{border:1.5px solid var(--line);background:#fdf9f3;border-radius:11px;flex:none;place-items:center;width:50px;height:47px;display:grid}.feature-icon svg{fill:none;width:29px;height:29px;stroke:var(--navy-2);stroke-width:2.1px;stroke-linecap:round;stroke-linejoin:round}.feature-icon .fill{fill:var(--navy-2);stroke:none}.code-card{border:1.5px solid var(--line);background:var(--panel);z-index:2;border-radius:16px;width:486px;height:256px;padding:0 9px 9px;position:absolute;top:527px;right:18px}.code-card header{justify-content:space-between;align-items:center;height:58px;padding-left:17px;display:flex}.code-card h2{font-family:var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--navy);margin-top:1px;font-size:19px;font-weight:700}.code-actions{z-index:1;align-items:center;gap:9px;display:flex;position:relative}.btn-ghost,.btn-run{border-radius:10px;place-items:center;width:44px;height:40px;display:grid}.btn-ghost{border:1.5px solid var(--line);background:var(--card)}.btn-ghost svg{fill:none;width:21px;height:21px;stroke:var(--navy-2);stroke-width:2px}.btn-run{background:linear-gradient(#fb7d33,#f0611a);width:46px;box-shadow:0 5px 12px -6px #f0611ab3}.btn-run svg{fill:#fff;width:22px;height:22px}.code{border:1.5px solid var(--line);background:var(--code-bg);height:188px;font-family:var(--mono);color:var(--navy);background:linear-gradient(90deg, transparent 41px, var(--line-soft) 41px, var(--line-soft) 42.5px, transparent 42.5px) no-repeat, var(--code-bg);scrollbar-width:thin;scrollbar-color:#e0d3c1 transparent;border-radius:12px;margin:0;padding:11px 0 0;font-size:15.6px;font-weight:500;line-height:23px;transition:opacity .18s;position:relative;overflow:auto}.code.is-out{opacity:0}.code code{font:inherit;min-width:max-content;padding-bottom:10px;padding-right:14px;display:block}.code .line{display:block}.code .ln{text-align:right;width:27px;color:var(--gutter);margin-right:25px;display:inline-block}.code .kw{color:var(--kw)}.code .fn{color:var(--fn)}.code .id{color:var(--navy)}.code .num{color:var(--num)}.lessons{z-index:2;position:absolute;bottom:28px;left:122px}.lessons h2{font-family:var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--navy);margin:0 0 12px 6px;font-size:21px;font-weight:700}.lesson-list{gap:14px;display:flex}.lesson{width:calc(var(--w) * 1px);border:1.5px solid var(--line);background:var(--card-soft);cursor:pointer;border-radius:13px;align-items:center;height:86px;padding:0 18px 0 12px;transition:border-color .25s,box-shadow .25s,transform .25s,background .25s;display:flex;position:relative}.lesson:hover{border-color:var(--line-strong);transform:translateY(-2px);box-shadow:0 8px 16px -10px #6e4e2666}.lesson:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.lesson.is-active{border:2px solid var(--accent);box-shadow:0 6px 16px -10px #f0611a73}.lesson-thumb{width:calc(var(--tw) * 1px);object-fit:contain;opacity:0;flex:none;height:78px;margin-right:2px}.lesson-thumb.is-ready{opacity:1}.lesson-title{font-family:var(--cond);letter-spacing:.03em;text-transform:uppercase;color:#3c4657;text-align:center;white-space:nowrap;flex:1;font-size:16px;font-weight:500;line-height:22px}.lesson.is-active .lesson-title{color:var(--navy);font-weight:700}.stage{cursor:default;touch-action:none;-webkit-user-select:none;user-select:none}.stage.is-pointing{cursor:pointer}.stage[data-drag=pan],.stage[data-drag=touch]{cursor:grabbing}.stage[data-drag=rotate]{cursor:ew-resize}.callout{cursor:pointer;transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1),border-color .2s,box-shadow .2s}.callout:hover,.callout:focus-visible{border-color:var(--line-strong);outline:none;box-shadow:0 14px 28px -18px #6e4e268c}.callout.is-hidden{opacity:0;pointer-events:none;transform:translateY(10px)scale(.97)}.callout.is-leaving{opacity:0;pointer-events:none;transition-duration:.3s;transform:translateY(-8px)scale(.97)}.callout code,.info-content code,.steps code{font-family:var(--mono);color:var(--accent-deep);background:var(--accent-soft);border-radius:5px;padding:.05em .35em;font-size:.86em}.callout code{color:var(--c);background:#0000000a;background:color-mix(in srgb, var(--c) 11%, transparent)}.rig.is-free .callout,.rig.is-off .callout{opacity:0;pointer-events:none;transform:scale(.96)}.leader-set{transition:opacity .4s}.leader-set.is-hidden{opacity:0}.leader-set.is-hidden .hotspot{pointer-events:none}.leaders .leader path{transition:opacity .35s,stroke-width .2s}.leaders.is-free .leader path{opacity:0}.leaders.is-off{opacity:0;pointer-events:none}.leaders .leader.is-hot path{stroke-width:2.8px}.leaders .hotspot{pointer-events:all;cursor:pointer}.leaders .hotspot.is-passive{pointer-events:none}.leaders .dot-hit{fill:#0000;stroke:none}.leaders .leader.is-hot .dot-anchor{stroke-width:3.4px}.tags{pointer-events:none;position:absolute;inset:0;overflow:hidden}.tag{border:1.5px solid var(--line);background:var(--card-soft);font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:var(--navy);white-space:nowrap;opacity:0;pointer-events:none;border-radius:8px;align-items:center;gap:6px;padding:4px 10px 4px 8px;font-size:13px;font-weight:700;transition:opacity .3s;display:flex;position:absolute;top:0;left:0;box-shadow:0 4px 10px -8px #6e4e2680}.tag:before{content:"";background:var(--c,var(--accent));border-radius:50%;flex:none;width:8px;height:8px}.tags.is-free .tag:not(.is-hidden){opacity:1;pointer-events:auto}.tags.is-off .tag{opacity:0!important;pointer-events:none!important}.tag:hover{border-color:var(--c,var(--accent))}.readout{background:var(--navy);color:#f8f1e4;font-family:var(--mono);white-space:nowrap;opacity:0;border-radius:999px;padding:3px 9px;font-size:13.5px;font-weight:500;transition:opacity .25s;position:absolute;top:0;left:0;box-shadow:0 4px 10px -6px #18213d99}.readout.is-on{opacity:1}.tip{border:1.5px solid var(--line);pointer-events:none;opacity:0;z-index:3;background:#fffbf5f7;border-radius:11px;max-width:240px;padding:9px 12px 10px;transition:opacity .15s;position:absolute;top:0;left:0;box-shadow:0 10px 22px -14px #6e4e268c}.tip.is-on{opacity:1}.tip b{font-family:var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--navy);font-size:15px;font-weight:700;display:block}.tip span{color:#5c6066;margin-top:2px;font-size:14px;line-height:18px;display:block}.viewbar{border:1.5px solid var(--line);background:var(--card-soft);box-shadow:var(--shadow);z-index:2;border-radius:13px;align-items:center;gap:2px;padding:4px;display:flex;position:absolute;bottom:9px;left:calc(50% + 168px);transform:translate(-50%)}.viewbar button{border-radius:9px;place-items:center;width:34px;height:32px;transition:background .15s;display:grid}.viewbar button:hover{background:#f86b1d17}.viewbar button:focus-visible{outline:2px solid var(--accent)}.viewbar svg{fill:none;width:19px;height:19px;stroke:var(--navy-2);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.viewbar .compass svg{width:22px;height:22px}.viewbar .compass circle{stroke-width:1.6px}.compass-needle{transform-origin:12px 12px;transform-box:view-box}.compass-needle .fill{fill:var(--accent);stroke:none}.compass-needle path:not(.fill){fill:var(--navy-2);stroke:none}.viewbar .sch-toggle[aria-pressed=true]{background:#f86b1d1c}.viewbar .sch-toggle[aria-pressed=true] svg{stroke:var(--accent-deep)}.viewbar .sch-toggle:disabled{opacity:.35;cursor:default}.viewbar .sch-toggle:disabled:hover{background:0 0}.viewbar.is-away .compass{background:#f86b1d21;animation:2.4s ease-in-out infinite nudge}@keyframes nudge{0%,to{box-shadow:0 0 #f86b1d00}50%{box-shadow:0 0 0 3px #f86b1d40}}.viewbar-sep{background:var(--line);width:1px;height:20px;margin:0 3px}.view-hint{background:var(--navy);color:#f6eee0;font-family:var(--cond);letter-spacing:.04em;white-space:nowrap;pointer-events:none;border-radius:999px;padding:4px 10px;font-size:13px;font-weight:600;transition:opacity .5s,transform .5s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.view-hint.is-gone{opacity:0;transform:translate(-50%)translateY(4px)}.sidebar{z-index:6}.side-nav a{border:1.5px solid #0000;border-radius:15px;flex-direction:column;justify-content:center;align-items:center;gap:7px;height:86px;text-decoration:none;transition:background .2s,border-color .2s,box-shadow .2s;display:flex;position:relative}.side-label{font-family:var(--sans);color:#686b6c;white-space:nowrap;font-size:14.5px;font-weight:500;line-height:17px;transition:color .2s}.side-nav a:hover{background:#fffbf5b3}:is(.side-nav li.is-on a,.side-nav:not(:has(li.is-on)) li.is-active a){border-color:var(--line);background:var(--card);box-shadow:var(--shadow)}:is(.side-nav li.is-on .side-label,.side-nav:not(:has(li.is-on)) li.is-active .side-label){color:#c24d0e}:is(.side-nav li.is-on svg,.side-nav:not(:has(li.is-on)) li.is-active svg){stroke:var(--accent)}:is(.side-nav li.is-on svg.fill,.side-nav li.is-on svg .fill,.side-nav:not(:has(li.is-on)) li.is-active svg.fill,.side-nav:not(:has(li.is-on)) li.is-active svg .fill){fill:var(--accent)}.side-nav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.side-desert{pointer-events:none;width:104px;height:220px;position:absolute;bottom:0;left:0}.side-desert .hill{fill:#f8a467}.side-desert .sand{fill:#fde2bf}.side-desert .cactus{stroke:#93c19b;stroke-width:8px}.side-desert .cactus-shade{stroke:#7fb08a;stroke-width:1.8px}.flyout{left:116px;top:var(--top,140px);border:1.5px solid var(--line);z-index:7;opacity:0;pointer-events:none;background:#fffbf5fa;border-radius:15px;width:304px;max-height:560px;padding:14px 12px 12px;transition:opacity .22s,transform .3s cubic-bezier(.2,.8,.2,1);position:absolute;overflow:auto;transform:translate(-10px);box-shadow:0 18px 40px -22px #6e4e268c}.flyout.is-open{opacity:1;pointer-events:auto;transform:none}.flyout header{border-bottom:1.5px solid var(--line-soft);justify-content:space-between;align-items:baseline;margin-bottom:6px;padding:0 6px 10px;display:flex}.flyout h2{font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:var(--navy);font-size:18px;font-weight:700}.flyout header span{font-family:var(--cond);letter-spacing:.04em;color:var(--muted);font-size:14px;font-weight:600}.fly-list{gap:2px;display:grid}.fly-list button,.fly-list label{text-align:left;cursor:pointer;border-radius:10px;align-items:center;gap:12px;width:100%;padding:8px 6px;transition:background .15s;display:flex}.fly-list button:hover,.fly-list label:hover{background:#f86b1d0f}.fly-list button.is-current{background:#f86b1d1a}.fly-num{border:1.5px solid var(--line);width:30px;height:30px;font-family:var(--cond);color:var(--navy);background:var(--card);border-radius:9px;flex:none;place-items:center;font-size:15px;font-weight:700;display:grid}.fly-num svg{fill:none;width:17px;height:17px;stroke:var(--green);stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}.fly-text{flex:1;min-width:0}.fly-text b{font-family:var(--cond);letter-spacing:.04em;text-transform:uppercase;color:var(--navy);font-size:15px;font-weight:700;display:block}.fly-text small{color:#6a6e74;font-size:13.5px;line-height:17px;display:block}.fly-action{align-items:center;gap:12px;padding:8px 6px;display:flex}.fly-list .fly-mini{border:1.5px solid var(--line);width:auto;font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:var(--navy);background:var(--card);border-radius:8px;flex:none;padding:5px 11px;font-size:13.5px;font-weight:600}.fly-list .fly-mini.is-done{color:var(--green);border-color:color-mix(in srgb, var(--green) 40%, var(--line))}.ref-list li{border-bottom:1px dashed var(--line-soft);align-items:center;gap:12px;padding:7px 6px;display:flex}.ref-list li:last-child{border-bottom:0}.ref-keys{flex:none;gap:4px;display:flex}.ref-keys kbd{border:1.5px solid var(--line);background:var(--card);min-width:26px;height:26px;font-family:var(--mono);color:var(--navy);border-bottom-width:3px;border-radius:7px;place-items:center;padding:0 6px;font-size:12.5px;font-weight:500;display:grid}.switch input{opacity:0;pointer-events:none;position:absolute}.switch-track{background:#e2d6c5;border-radius:999px;flex:none;width:38px;height:22px;transition:background .2s;position:relative}.switch-track span{background:#fffaf2;border-radius:50%;width:16px;height:16px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #00000040}.switch input:checked+.switch-track{background:var(--accent)}.switch input:checked+.switch-track span{transform:translate(16px)}.switch input:focus-visible+.switch-track{outline:2px solid var(--navy);outline-offset:2px}.fly-reset{border:1.5px solid var(--line);font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:#a0533f;border-radius:9px;margin:10px 6px 2px;padding:7px 12px;font-size:14px;font-weight:600}.fly-reset:hover{background:#e0523f14}.info-card.is-expanded{z-index:4;background:#faf4ebfa;height:671px}.code-card{transition:opacity .3s}.info-card{transition:height .45s cubic-bezier(.2,.8,.2,1),opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1)}.info-card.is-covered{opacity:0;pointer-events:none;transform:translateY(-6px)scale(.985)}.code-card{flex-direction:column;transition:top .45s cubic-bezier(.2,.8,.2,1),height .45s cubic-bezier(.2,.8,.2,1),background .3s,opacity .3s;display:flex}.code-card.is-expanded{z-index:4;background:#faf4ebfa;height:671px;top:112px}.code-card header{flex:none}.code-wrap{flex:1;min-height:0}.code-wrap .code{font-variant-ligatures:none;font-feature-settings:"calt" 0, "liga" 0;height:100%}.code-card.is-covered{opacity:0;pointer-events:none}.tabs button{transition:color .2s}.tabs button:hover{color:var(--navy)}.tabs button:after{content:"";background:var(--accent);opacity:0;border-radius:3px;height:5px;transition:left .3s,right .3s,opacity .2s;position:absolute;bottom:-3px;left:50%;right:50%}.tabs button.is-active:after{opacity:1;left:-10px;right:-10px}.tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.expand{z-index:1;border-radius:6px}.expand:hover svg{stroke:var(--navy)}.info-content{scrollbar-width:thin;scrollbar-color:#e0d3c1 transparent;height:100%;padding:0 24px 18px 0;transition:opacity .18s,transform .3s;overflow-y:auto}.info-content.is-out{opacity:0;transform:translateY(6px)}.info-content h2{padding-right:36px}.info-content .sub{color:var(--muted);margin-top:4px;font-size:15.5px}.pin-table{border-collapse:collapse;color:#5f656b;width:100%;margin-top:12px;font-size:14.5px;line-height:18px}.pin-table th{text-align:left;font-family:var(--cond);letter-spacing:.07em;text-transform:uppercase;color:var(--faint);padding:0 6px 6px 0;font-size:12.5px;font-weight:700}.pin-table td{border-top:1.5px solid var(--line-soft);vertical-align:top;padding:8px 8px 8px 0}.pin-table td:first-child{white-space:nowrap}.pin-table td:nth-child(2){color:var(--navy);font-weight:500}.schematic-card{border:1.5px solid var(--line);background:var(--card);width:184px;height:126px;box-shadow:var(--shadow);z-index:2;border-radius:13px;flex-direction:column;padding:4px 6px 6px;display:flex;position:absolute;bottom:30px;right:26px}.schematic-card[hidden]{display:none}.schematic-card.is-resizing{-webkit-user-select:none;user-select:none}.schematic-card:not(.is-inline){cursor:grab;touch-action:none}.schematic-card.is-moving{cursor:grabbing;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow), 0 10px 26px #1e243429}.sch-head{flex:none;align-items:center;gap:5px;height:18px;display:flex}.sch-grip{cursor:nwse-resize;touch-action:none;border-radius:6px;place-items:center;width:20px;height:20px;margin:-2px 0 0 -3px;display:grid}.sch-grip svg{fill:none;width:11px;height:11px;stroke:var(--faint);stroke-width:1.6px;stroke-linecap:round}.sch-grip:hover,.sch-grip:focus-visible,.is-resizing .sch-grip{background:var(--accent-soft);outline:none}.sch-grip:hover svg,.sch-grip:focus-visible svg,.is-resizing .sch-grip svg{stroke:var(--accent-deep)}.sch-close{cursor:pointer;border-radius:6px;place-items:center;width:20px;height:20px;margin:-2px -3px 0 auto;display:grid}.sch-close svg{fill:none;width:9px;height:9px;stroke:var(--faint);stroke-width:1.8px;stroke-linecap:round}.sch-close:hover,.sch-close:focus-visible{background:var(--accent-soft);outline:none}.sch-close:hover svg,.sch-close:focus-visible svg{stroke:var(--accent-deep)}.is-inline .sch-close{display:none}.sch-head h2{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-family:var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-size:11px;font-weight:700;overflow:hidden}.sch-view{flex:1;min-height:0;transition:opacity .18s}.sch-view.is-out{opacity:0}.sch-view svg{width:100%;height:100%;display:block}.sch-notes{display:none}.schematic-card.is-inline{width:auto;min-width:0;height:auto;box-shadow:none;border-radius:16px;grid-area:schematic;padding:14px 16px 16px;position:relative;bottom:auto;right:auto}.is-inline .sch-grip{display:none}.is-inline .sch-head{height:auto;margin-bottom:10px}.is-inline .sch-head h2{letter-spacing:.03em;color:var(--navy);font-size:19px}.is-inline .sch-view svg{height:auto}.is-inline .sch-notes{display:block}.sch-notes p{color:var(--muted);margin-top:8px;font-size:14px;line-height:19px}.schematic text{font-family:var(--cond);fill:var(--ink);font-size:11.5px}.schematic .sch-m{fill:var(--muted);font-size:11px}.schematic .sch-b{letter-spacing:.02em;fill:var(--navy);font-size:12.5px;font-weight:700}.schematic .sch-esp-name{font-size:14px}.schematic .sch-pin{fill:var(--navy);font-size:11.5px;font-weight:600}.schematic .sch-pwr{fill:#d64a3a;font-size:11px;font-weight:700}.schematic .sch-s{fill:var(--navy);font-size:11px;font-weight:700}.schematic .sch-g{letter-spacing:.08em;text-transform:uppercase;fill:var(--faint);font-size:10px;font-weight:600}.schematic .sch-bg{fill:var(--card)}.schematic .sch-box{fill:#fff;stroke:#24324a;stroke-width:1.6px}.schematic .sch-esp{fill:#f6f1e9;stroke:#24324a;stroke-width:1.8px}.schematic .sch-group{fill:none;stroke:var(--faint);stroke-width:1.2px;stroke-dasharray:4 3}.pin-table code{font-family:var(--mono);color:var(--navy);background:0 0;padding:0;font-size:13px;font-weight:500}.wire-dot{background:var(--c);vertical-align:-1px;border-radius:50%;width:10px;height:10px;margin-right:7px;display:inline-block;box-shadow:0 0 0 1.5px #141a2cbf}.steps{counter-reset:step;gap:10px;margin-top:12px;display:grid}.steps li{color:#5f656b;min-height:28px;padding-left:40px;font-size:16px;line-height:21px;position:relative}.steps li:before{counter-increment:step;content:counter(step);border:1.5px solid var(--line);width:27px;height:27px;font-family:var(--cond);color:var(--navy);background:#fdf9f3;border-radius:9px;place-items:center;font-size:14px;font-weight:700;display:grid;position:absolute;top:-2px;left:0}.spec-grid{grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 0;display:grid}.spec-grid div{border:1.5px solid var(--line-soft);background:#fdf8f1;border-radius:11px;padding:9px 11px}.spec-grid dt{font-family:var(--cond);letter-spacing:.07em;text-transform:uppercase;color:var(--faint);font-size:12.5px;font-weight:600}.spec-grid dd{color:var(--navy);margin:2px 0 0;font-size:15.5px;font-weight:500}.code-wrap{border-radius:9px;position:relative;overflow:hidden}.btn-ghost,.btn-run{transition:transform .15s,background .2s,border-color .2s}.btn-ghost:hover{border-color:var(--line-strong)}.btn-expand svg{width:19px;height:19px}.btn-expand svg .fill{fill:var(--navy-2);stroke:none}.btn-ghost.is-done svg{stroke:var(--green);stroke-width:2.6px}.btn-run:hover{transform:translateY(-1px)}.btn-run:active,.btn-ghost:active{transform:translateY(1px)}.btn-run svg .fill{fill:#fff}.btn-run.is-busy{background:linear-gradient(#f7b04a,#ee9a2a)}.btn-run.is-busy svg{animation:.9s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.4}}.code-card[data-state=running] .btn-run{background:linear-gradient(#e65a45,#cf4532);box-shadow:0 5px 12px -6px #cf4532b3}.code-card{--console-h:92px}.console{height:var(--console-h);border-top:1.5px solid var(--line);font-family:var(--mono);background:#fbf4ea;flex-direction:column;font-size:13px;transition:transform .4s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(102%)}.console.is-open{transform:none}.console-grip{z-index:1;cursor:ns-resize;touch-action:none;height:11px;position:absolute;top:-6px;left:0;right:0}.console-grip:after{content:"";opacity:.7;background:#d9cbb6;border-radius:2px;width:34px;height:4px;margin-left:-17px;transition:opacity .15s,background .15s;position:absolute;top:3px;left:50%}.console-grip:hover:after,.console-grip:focus-visible:after{opacity:1;background:#c2b097}.code-card.is-sizing .console-grip:after{opacity:1;background:var(--accent)}.console-grip:focus-visible{outline:none}.console-head{cursor:ns-resize;touch-action:none}.code-card.is-sizing,.code-card.is-sizing *{-webkit-user-select:none;user-select:none;cursor:ns-resize!important}.code-card.is-sizing .console{transition:none}html.compact .console-grip{display:none}html.compact .console-head{cursor:auto;touch-action:auto}.console-head{border-bottom:1px solid var(--line-soft);align-items:center;gap:8px;height:26px;padding:0 6px 0 12px;display:flex}.console-dot{background:#b5aa99;border-radius:50%;width:8px;height:8px}.code-card[data-state=running] .console-dot{background:var(--green);box-shadow:0 0 0 3px #27a68933}.code-card[data-state=uploading] .console-dot{background:#f0a53a;animation:.6s ease-in-out infinite pulse}.console-title{font-family:var(--cond);letter-spacing:.07em;text-transform:uppercase;color:var(--navy);font-size:12.5px;font-weight:700}.console-status{font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);flex:1;font-size:12.5px;font-weight:600}.console-close{border-radius:5px;place-items:center;width:22px;height:22px;display:grid}.console-close:hover{background:#24304a14}.console-close svg{fill:none;width:14px;height:14px;stroke:var(--navy-2);stroke-width:2.2px;stroke-linecap:round}.console-lines{color:#3d4250;scrollbar-width:none;flex:1;min-height:0;padding:5px 12px;line-height:18px;overflow:auto}.console-lines div:last-child{color:var(--navy);font-weight:500}.lesson-done{border:1.5px solid #d6ccbe;border-radius:50%;place-items:center;width:21px;height:21px;transition:background .3s,border-color .3s;display:grid;position:absolute;top:8px;right:10px}.lesson-done svg{fill:none;stroke:#fff;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;opacity:0;width:14px;height:14px;transition:opacity .2s}.lesson.is-done .lesson-done{border-color:var(--green);background:var(--green);width:25px;height:25px;box-shadow:0 0 0 2.5px var(--bg);top:-9px;right:9px}.lesson.is-done.is-active .lesson-done{border-color:var(--accent);background:var(--accent)}.lesson.is-done .lesson-done svg{opacity:1}.lesson.just-done{animation:.7s celebrate}.lesson.just-done .lesson-done{animation:.5s cubic-bezier(.3,1.6,.5,1) badge-pop}@keyframes celebrate{30%{transform:translateY(-5px)scale(1.02)}}@keyframes badge-pop{0%{transform:scale(.4)}}.lesson .lesson-thumb{transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .4s}.lesson:hover .lesson-thumb{transform:scale(1.06)rotate(-2deg)}.lesson-title{transition:color .25s}.progress-fill{transition:width .8s cubic-bezier(.2,.8,.2,1)}.reduce-motion *,.reduce-motion :before,.reduce-motion :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.stage[data-hand=slide],.stage[data-hand=knob]{cursor:grab}.stage[data-hand=press]{cursor:pointer}.stage[data-drag=part]{cursor:grabbing}.insp-lines{pointer-events:none;z-index:3;width:100%;height:100%;position:absolute;inset:0;overflow:hidden}.insp-leader{opacity:0;transition:opacity .2s}.insp-leader.is-on{opacity:1}.insp-leader.is-away{opacity:0}.insp-leader path{fill:none;stroke:var(--accent);stroke-width:1.8px;stroke-dasharray:5 4}.insp-leader .dot-end{fill:#fff3ea;stroke:var(--accent);stroke-width:2.6px}.inspector{border:1.5px solid var(--line);z-index:4;opacity:0;visibility:hidden;pointer-events:none;cursor:default;background:#fffbf5fa;border-radius:14px;width:292px;padding:14px 14px 14px 16px;transition:opacity .18s,visibility 0s linear .18s;position:absolute;top:0;left:0;box-shadow:0 18px 34px -22px #6e4e2699,inset 0 1px #ffffffb3}.inspector .insp-head,.inspector .insp-desc{cursor:grab;touch-action:none}.inspector.is-on{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .18s;animation:.34s cubic-bezier(.2,.8,.2,1) insp-in}@keyframes insp-in{0%{opacity:0;translate:0 6px;scale:.95}}.insp-head{justify-content:space-between;align-items:flex-start;gap:10px;display:flex}.insp-head h3{font-family:var(--cond);letter-spacing:.035em;text-transform:uppercase;color:var(--navy);font-size:18px;font-weight:700;line-height:22px}.insp-close{border-radius:7px;flex:none;place-items:center;width:28px;height:28px;margin:-4px -4px 0 0;transition:background .15s;display:grid}.insp-close:hover{background:#24304a12}.insp-close svg{fill:none;width:16px;height:16px;stroke:var(--navy-2);stroke-width:2.2px;stroke-linecap:round}.insp-desc{color:#5c6066;margin-top:6px;font-size:14.5px;line-height:19px}.insp-rows{gap:12px;margin-top:10px;display:grid}.insp-row{border-top:1px dashed var(--line);border-radius:2px;padding-top:10px}.insp-row.is-pulse{animation:1s row-pulse}@keyframes row-pulse{0%{background:#f86b1d2e;box-shadow:0 0 0 6px #f86b1d2e}to{background:0 0;box-shadow:0 0 0 6px #0000}}.insp-row label,.insp-label{font-family:var(--cond);letter-spacing:.05em;text-transform:uppercase;color:#4b505c;justify-content:space-between;align-items:baseline;gap:8px;font-size:14px;font-weight:600;display:flex}.insp-row output{font-family:var(--mono);letter-spacing:0;text-transform:none;color:var(--navy);font-size:13.5px;font-weight:500}.insp-note{color:#6a6e74;margin-top:6px;font-size:13.5px;line-height:17px}.inspector input[type=range]{appearance:none;cursor:pointer;--fill:50%;background:0 0;width:100%;height:22px;margin:4px 0 0;display:block}.inspector input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--accent,var(--accent)) var(--fill), var(--track) var(--fill));border-radius:3px;height:6px}.inspector input[type=range]::-moz-range-track{background:var(--track);border-radius:3px;height:6px}.inspector input[type=range]::-moz-range-progress{background:var(--accent,var(--accent));border-radius:3px;height:6px}.inspector input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:2.5px solid var(--accent,var(--accent));background:#fdf8ef;border-radius:50%;width:18px;height:18px;margin-top:-6px;transition:transform .15s;box-shadow:0 1px 3px #18213d40}.inspector input[type=range]::-moz-range-thumb{border:2.5px solid var(--accent,var(--accent));background:#fdf8ef;border-radius:50%;width:13px;height:13px;box-shadow:0 1px 3px #18213d40}.inspector input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}.inspector input[type=range]:focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:4px}.seg{flex-wrap:wrap;gap:6px;margin-top:7px;display:flex}.seg button{border:1.5px solid var(--line);background:var(--card);font-family:var(--cond);letter-spacing:.03em;color:#4b505c;border-radius:9px;padding:5px 11px 4px;font-size:14.5px;font-weight:600;transition:background .15s,border-color .15s,color .15s}.seg button:hover{border-color:var(--line-strong)}.seg button.is-on{border-color:var(--navy);background:var(--navy);color:#fbf5ea}.seg button:focus-visible,.swatch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.swatches{gap:9px;margin-top:8px;display:flex}.swatch{background:radial-gradient(circle at 35% 30%, #ffffff8c, transparent 55%), var(--c);border-radius:50%;width:26px;height:26px;transition:transform .15s,box-shadow .15s;box-shadow:inset 0 0 0 1.5px #18213d59}.swatch:hover{transform:scale(1.1)}.swatch.is-on{box-shadow:0 0 0 1.5px #18213d59 inset, 0 0 0 2.5px #fbf6ed, 0 0 0 4.5px var(--accent)}.is-swatch .insp-note{display:none}.insp-row .insp-switch{cursor:pointer;text-transform:none;letter-spacing:.01em;justify-content:flex-start;align-items:center;gap:10px;font-size:15px}.insp-switch input{opacity:0;pointer-events:none;position:absolute}.insp-switch .track{background:#e2d6c5;border-radius:999px;flex:none;width:34px;height:20px;transition:background .2s;position:relative}.insp-switch .knob{background:#fffaf2;border-radius:50%;width:14px;height:14px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #00000040}.insp-switch input:checked+.track{background:var(--accent)}.insp-switch input:checked+.track .knob{transform:translate(14px)}.insp-switch input:focus-visible+.track{outline:2px solid var(--navy);outline-offset:2px}.code .param{font:inherit;letter-spacing:inherit;line-height:inherit;color:#c4530f;background:#f86b1d1a;border-radius:4px;margin:0 1px;padding:0 3px;transition:background .15s;box-shadow:inset 0 -1.5px #f86b1d99}.code .param:hover,.code .param.is-marked{background:#f86b1d38}.code .param.is-marked{box-shadow:inset 0 0 0 1.5px #f86b1dbf}.code .param:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.code .param.is-flash{animation:.9s param-flash}@keyframes param-flash{0%{color:#fbf6ed;background:#f86b1d8c}}.code .line.is-new{animation:1.4s line-flash}@keyframes line-flash{0%{background:#f0a53a47}to{background:#f0a53a00}}.code .str{color:#3f8a4f}.code .cm{color:var(--faint);font-style:italic}.lessons{right:18px}.lesson-list{scrollbar-width:none;--fade-l:0px;--fade-r:0px;-webkit-mask-image:linear-gradient(90deg, transparent, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent);-webkit-mask-image:linear-gradient(90deg, transparent, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent);mask-image:linear-gradient(90deg, transparent, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent);margin:-12px 44px -12px 50px;padding:12px 10px 12px 4px;scroll-padding:0 30px;overflow:auto hidden}.lesson-list::-webkit-scrollbar{display:none}.lessons.can-left .lesson-list{--fade-l:60px}.lessons.can-right .lesson-list{--fade-r:60px}.lesson{flex:none}.lesson-step{z-index:1;border:1.5px solid var(--line);background:var(--card);border-radius:50%;place-items:center;width:40px;height:40px;transition:opacity .2s,border-color .15s;display:none;position:absolute;bottom:23px;box-shadow:0 8px 16px -9px #6e4e2680}.lessons.can-scroll .lesson-step{display:grid}.lesson-step:disabled{opacity:.45;box-shadow:none;cursor:default}.lesson-step svg{fill:none;width:20px;height:20px;stroke:var(--navy-2);stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}.lesson-step:not(:disabled):hover{border-color:var(--line-strong)}.lesson-step:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.lesson-step.prev{left:0}.lesson-step.next{right:0}.credit{border:1.5px solid var(--line);background:var(--card);box-shadow:var(--shadow);color:var(--navy);border-radius:12px;align-items:center;gap:12px;padding:9px 16px 9px 13px;text-decoration:none;transition:border-color .2s,background .2s;display:inline-flex}a.credit:hover{border-color:var(--line-strong);background:#fff}a.credit:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.credit-x{width:19px;height:19px;fill:var(--navy-2);flex:none}.credit-rule{background:var(--line);flex:none;align-self:stretch;width:1.5px}.credit-text{white-space:nowrap;flex-direction:column;gap:2px;display:flex}.credit-text small{font-family:var(--cond);letter-spacing:.16em;text-transform:uppercase;color:#7d7264;font-size:11.5px;font-weight:600;line-height:13px}.credit-text b{font-family:var(--cond);letter-spacing:.03em;color:var(--navy);font-size:15.5px;font-weight:700;line-height:18px}.credit-side{flex-direction:column;gap:12px;width:47px;padding:15px 0 14px;position:absolute;bottom:24px;left:12px}.credit-side .credit-text{writing-mode:vertical-rl;flex-direction:column;align-items:flex-start;gap:3px;transform:rotate(180deg)}.credit-side .credit-rule{align-self:center;width:20px;height:1.5px}.app-foot{display:none}html.compact,html.compact body{height:auto;min-height:100%}html.compact{overflow:hidden auto}html.compact body{overflow:clip visible}html.compact .artboard{width:auto;height:auto;min-height:100dvh;padding:14px 12px calc(78px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand status""stage stage""lessons lessons""info info""code code""schematic schematic""foot foot";align-items:center;gap:14px;display:grid;position:relative;overflow:visible;transform:none}html.compact .scenery{display:none}html.compact .brand{grid-area:brand;align-items:center;gap:14px;min-width:0;position:static}html.compact .brand-logo{width:46px;height:37px}html.compact .brand-text{min-width:0}html.compact .brand-text h1{white-space:nowrap;font-size:27px;line-height:29px}html.compact .brand-text p{letter-spacing:.2em;margin-top:1px;font-size:11.5px;line-height:14px}html.compact .status{border-radius:12px;grid-area:status;width:auto;height:56px;position:static}html.compact .progress-card{gap:12px;width:196px;padding:0 12px}html.compact .status-cactus{display:none}html.compact .progress-icon{width:28px;height:28px}html.compact .progress-label{font-size:14px}html.compact .progress-row{gap:9px;margin-top:2px}html.compact .progress-track{height:10px}html.compact .progress-count{font-size:15px}html.compact .clock{gap:1px;padding:0 14px;font-size:13px;line-height:17px}html.compact .stage{border:1.5px solid var(--line);background:radial-gradient(90% 80% at 50% 45%,#fffcf6cc,#0000 70%),#faf4ebb3;border-radius:16px;grid-area:stage;height:clamp(300px,58vh,660px);position:relative;inset:auto;overflow:hidden}html.compact .rig,html.compact .view-hint{display:none}html.compact .viewbar{bottom:8px;left:50%}html.compact .viewbar .sch-toggle,html.compact .viewbar .sch-sep{display:none}html.compact .inspector{overscroll-behavior:contain;width:min(420px,100% - 20px);max-height:56%;padding:12px 14px 10px;overflow-y:auto}html.compact .inspector .insp-head,.inspector .insp-desc{cursor:grab;touch-action:none}.inspector.is-dragging,.inspector.is-dragging *{cursor:grabbing;-webkit-user-select:none;user-select:none}.inspector.is-on{animation-name:insp-up}@keyframes insp-up{0%{opacity:0;translate:0 14px}}html.compact .insp-desc{font-size:14px;line-height:18px}html.compact .insp-rows{gap:9px;margin-top:8px}html.compact .insp-row{padding-top:8px}html.compact .lessons{grid-area:lessons;min-width:0;position:relative;inset:auto}html.compact .lessons h2{margin-bottom:8px;font-size:16px}html.compact .lesson-list{margin:-12px 30px -12px 34px}html.compact .lesson{width:calc(var(--w) * .8px);height:74px;padding:0 12px 0 8px}html.compact .lesson-thumb{width:calc(var(--tw) * .8px);height:64px}html.compact .lesson-title{font-size:13.5px;line-height:18px}html.compact .lesson-step{width:30px;height:30px;bottom:22px}html.compact .lesson-step svg{width:17px;height:17px}html.compact .info-card,html.compact .code-card{width:auto;min-width:0;height:auto;position:relative;inset:auto}html.compact .info-card{grid-area:info}html.compact .info-card.is-expanded,html.compact .code-card.is-expanded{height:auto;top:auto}html.compact .expand,html.compact .btn-expand{display:none}html.compact .tabs{scrollbar-width:none;gap:22px;padding:0 14px;overflow-x:auto}html.compact .tabs::-webkit-scrollbar{display:none}html.compact .tabs button{flex:none;font-size:15.5px}html.compact .info-body{margin:10px 3px 3px;padding:14px 16px 4px;position:relative;inset:auto}html.compact .info-content{height:auto;padding-right:0;overflow:visible}html.compact .info-body h2{font-size:21px;line-height:26px}html.compact .lede{max-width:none;font-size:16px;line-height:22px}html.compact .features li{gap:16px;font-size:15px;line-height:20px}html.compact .feature-icon{width:44px;height:42px}html.compact .feature-icon svg{width:26px;height:26px}html.compact .pin-table{font-size:13.5px}html.compact .code-card{grid-area:code}html.compact .code-card header{padding-left:14px}html.compact .code-wrap .code{height:auto;max-height:440px;font-size:14.5px;line-height:21px}html.compact .code-card:not([data-state=idle]) .code-wrap{padding-bottom:var(--console-h)}html.compact .app-foot{flex-wrap:wrap;grid-area:foot;justify-content:space-between;align-items:center;gap:10px 16px;padding:6px 2px 0;display:flex}html.compact .sidebar{width:auto;height:calc(66px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -1.5px 0 var(--line), 0 -12px 26px -20px #6e4e2680;z-index:20;background:#fbf6eef7;position:fixed;inset:auto 0 0;overflow:visible}html.compact .credit-side,html.compact .side-desert{display:none}html.compact .side-nav{justify-content:space-around;align-items:center;max-width:600px;height:66px;margin:0 auto;display:flex}html.compact .side-nav li{width:auto;position:static}html.compact .side-nav a{border-radius:12px;gap:3px;width:60px;height:56px}html.compact .side-nav a svg{width:24px;height:24px}html.compact .side-label{font-size:10.5px;line-height:12px}html.compact .flyout{top:auto;left:10px;right:10px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:21;width:auto;max-width:560px;max-height:min(70vh,560px);margin:0 auto;position:fixed;transform:translateY(10px)}html.compact .flyout.is-open{transform:none}@media (width<=600px){html.compact .artboard{grid-template-columns:minmax(0,1fr);grid-template-areas:"brand""status""stage""lessons""info""code""schematic""foot";row-gap:12px}html.compact .progress-card{flex:1;width:auto}html.compact .brand-text h1{font-size:20px}html.compact .tabs{gap:18px}html.compact .tabs button{font-size:14.5px}}@media (orientation:landscape) and (height<=600px){html.compact .artboard{padding:8px calc(10px + env(safe-area-inset-right)) 14px calc(72px + env(safe-area-inset-left));grid-template-rows:repeat(6,auto) 1fr;grid-template-columns:minmax(0,1.5fr) minmax(250px,1fr);grid-template-areas:"stage brand""stage status""stage lessons""stage info""stage code""stage schematic""stage foot";align-items:start;gap:12px 14px}html.compact .stage{height:calc(100dvh - 16px);min-height:240px;position:sticky;top:8px}html.compact .brand{gap:10px}html.compact .brand-logo{width:36px;height:29px}html.compact .brand-text h1{font-size:21px;line-height:23px}html.compact .brand-text p{font-size:10px}html.compact .status{width:100%;height:50px}html.compact .progress-card{flex:1;width:auto}html.compact .sidebar{width:calc(62px + env(safe-area-inset-left));height:auto;padding:0 0 0 env(safe-area-inset-left);background:var(--bg);box-shadow:inset -1.5px 0 0 var(--line-soft);inset:0 auto 0 0}html.compact .side-nav{flex-direction:column;justify-content:center;gap:4px;height:100%;margin:0}html.compact .side-nav a{width:48px;height:46px}html.compact .side-label{display:none}html.compact .flyout{left:calc(72px + env(safe-area-inset-left));width:320px;max-height:calc(100dvh - 16px);margin:0;top:8px;bottom:auto;right:auto;transform:translate(-10px)}}@media (orientation:landscape) and (height<=600px) and (width<=720px){html.compact .clock,html.compact .brand-text p{display:none}}html.compact .tag{padding:3px 7px 3px 6px;font-size:11.5px}.code .line{transition:background .12s,box-shadow .12s}.code .line.is-running{box-shadow:inset 3px 0 0 var(--accent);background:#f86b1d24}.code .line.is-running .ln{color:var(--accent-deep)}html:not(.compact) .code-card:not([data-state=idle]) .code code{padding-bottom:calc(var(--console-h) + 4px)}html.is-rtl :is(.info-content,.callout,.inspector,.flyout,.tip,.tag,.lesson-title,.sch-notes,.loader-inner,.view-hint,.readout,.stage-note){direction:rtl}html.is-rtl :is(.info-content,.callout,.inspector,.flyout,.sch-notes) code{direction:ltr;unicode-bidi:isolate}html.is-rtl .inspector input[type=range]{direction:ltr}html.is-rtl .console-lines>div{unicode-bidi:plaintext}html:is([lang=ar],[lang=he],[lang=hi]) body *{letter-spacing:normal!important}html:is([lang=ar],[lang=he],[lang=hi]) .console-lines{font-family:var(--sans)}
