:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f3f5ff;font-synthesis:none;text-rendering:optimizelegibility;background:#080a12;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(at 10% 20%,#11222755,#0000 40%),#080a12;min-width:0;margin:0}a{color:inherit;text-decoration:none}a:hover{color:#a5e8df}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible,canvas:focus-visible{outline-offset:5px;outline:2px solid #9bedc8}.wrap{width:min(1260px,100% - 80px);margin-inline:auto}.skip-link{z-index:5;color:#101a15;background:#9bedc8;padding:12px;position:absolute;top:-60px;left:20px}.skip-link:focus{top:10px}.page-header{border-bottom:1px solid #26303c;justify-content:space-between;align-items:center;gap:20px;min-height:85px;display:flex}.brand{letter-spacing:-.5px;white-space:nowrap;font-size:19px;font-weight:500}.brand span{color:#9bedc8}.page-header nav,.page-footer nav{color:#b3c0d1;flex-wrap:wrap;gap:24px;font-size:13px;display:flex}.page-header nav a{align-items:center;min-height:44px;display:inline-flex}.page-header [data-demo-return]{color:#d5ff70;font-weight:600}.lesson-layout{grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);grid-template-areas:"intro scene""guide scene";align-items:start;gap:28px 50px;padding-block:48px;display:grid}.lesson-intro{grid-area:intro}.eyebrow{color:#9bedc8;letter-spacing:.08em;text-transform:uppercase;margin:0 0 15px;font:11px/1.6 ui-monospace,monospace}h1{letter-spacing:-1.8px;margin:0 0 18px;font-size:clamp(34px,3.4vw,48px);font-weight:500;line-height:1.08}.intro{color:#aeb6ca;max-width:440px;margin:0;font-size:16px;line-height:1.7}.scene-panel{background:#101621;border:1px solid #334152;border-radius:12px;grid-area:scene;min-width:0;overflow:hidden}.scene-topbar{border-bottom:1px solid #283140;justify-content:space-between;gap:16px;padding:15px 18px;font-size:12px;display:flex}.scene-status{color:#9bedc8;font-size:11px}#scene-shell{width:100%;height:clamp(360px,42vw,540px)}#scene-shell canvas{outline-offset:-5px;width:100%;height:100%;display:block}.scene-actions{border-top:1px solid #283140;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;display:flex}.scene-actions p{color:#a9b6c9;margin:0;font-size:11px}.scene-actions>div{flex-wrap:wrap;gap:8px;display:flex}.scene-actions button{color:#dce6f4;background:#192333;border:1px solid #3a495d;border-radius:6px;padding:10px 12px;font-size:12px}.scene-actions button:hover{color:#9bedc8;border-color:#9bedc8}.metrics{border-top:1px solid #283140;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:17px 18px;display:grid}.metrics dt{color:#8d9bb0;margin-bottom:6px;font-size:10px}.metrics dd{color:#dce6f4;margin:0;font:13px ui-monospace,monospace}.lesson-guide{grid-area:guide}h2{margin:0 0 17px;font-size:18px;font-weight:500}.try-list{color:#a9b6c9;margin:0;padding:0 0 0 18px;font-size:13px;line-height:1.75}.try-list li{margin-bottom:14px;padding-left:6px}.try-list li::marker{color:#9bedc8}.try-list strong{color:#e0e8f3;font-weight:500}kbd{color:#dce6f4;border:1px solid #3a495d;border-radius:3px;padding:1px 4px;font-size:11px}.scene-parts{border-block:1px solid #283140;margin-top:22px;padding-block:18px}.scene-parts summary{cursor:pointer;color:#c5dfd4;font-size:13px;line-height:1.5}.scene-parts dl{margin:18px 0 0;font-size:12px;line-height:1.7}.scene-parts dl>div+div{margin-top:12px}.scene-parts dt{color:#dce6f4;font-weight:500}.scene-parts dd{color:#a9b6c9;margin:2px 0 0}.next-link{color:#c5f5df;background:#102820;border:1px solid #3a6356;border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:9px 14px;margin-top:24px;padding:18px;font-size:14px;display:grid}.next-link span{color:#84bbab;text-transform:uppercase;letter-spacing:.08em;grid-column:1/-1;font:10px ui-monospace,monospace}.next-link b{font-size:18px;font-weight:400}.next-link:hover{background:#17382c}.page-footer{color:#8d9bb0;border-top:1px solid #26303c;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding-block:25px 30px;font-size:11px;display:flex}.page-footer nav{font-size:11px}@media (width<=1000px){.wrap{width:calc(100% - 48px)}.lesson-layout{grid-template-columns:minmax(260px,.9fr) minmax(0,1.1fr);column-gap:28px}.intro{font-size:15px}#scene-shell{height:400px}.scene-actions{flex-direction:column;align-items:flex-start}}@media (width<=760px){.page-header{min-height:68px}.page-header nav{gap:17px;font-size:12px}.brand{font-size:17px}.lesson-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro""scene""guide";row-gap:24px;padding-block:26px 36px}h1{letter-spacing:-1.3px;margin-bottom:12px;font-size:34px}.eyebrow{margin-bottom:10px;font-size:10px}.intro{max-width:570px;font-size:14px;line-height:1.65}#scene-shell{height:330px}.scene-actions{flex-direction:row;align-items:center}.try-list{font-size:14px}}@media (width<=430px){.wrap{width:calc(100% - 32px)}.page-header{gap:10px}.brand{font-size:15px}.page-header nav{gap:12px;font-size:11px}h1{font-size:31px}#scene-shell{height:300px}.scene-actions,.scene-topbar,.metrics{padding-inline:14px}.scene-actions{gap:13px}.scene-actions>div{width:100%}.scene-actions button{flex:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}
