:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#1d2527;font-synthesis:none;text-rendering:optimizelegibility;background:#f6f7f1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,a{font:inherit}button{cursor:pointer}.app-shell{grid-template-columns:332px minmax(0,1fr);min-height:100vh;display:grid}.workspace{width:100%;min-width:0;padding:32px}.sidebar{color:#f6f7f1;background:#172321;flex-direction:column;gap:22px;height:100vh;padding:28px 20px;display:flex;position:sticky;top:0;overflow-y:auto}.brand-block{align-items:center;gap:14px;display:flex}.brand-mark{color:#fff8ea;background:#f05d4f;border:1px solid #ffffff2e;border-radius:8px;place-items:center;width:48px;height:48px;display:grid}.brand-block h1{letter-spacing:0;margin:3px 0 0;font-size:1.45rem;line-height:1.1}.eyebrow{color:#94d2bd;letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:.72rem;font-weight:800}.progress-panel{background:#ffffff0f;border:1px solid #ffffff1f;border-radius:8px;gap:12px;padding:16px;display:grid}.progress-panel>div:first-child{color:#dce8df;justify-content:space-between;align-items:center;font-size:.9rem;display:flex}.progress-panel strong{color:#fff;font-size:1.05rem}.progress-track{background:#ffffff1f;border-radius:999px;height:8px;overflow:hidden}.progress-track div{border-radius:inherit;background:#f6c85f;height:100%;transition:width .18s}.lesson-list{gap:8px;display:grid}.lesson-select-panel{display:none}.lesson-select-panel label{color:#94d2bd;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;font-weight:900}.lesson-select-panel select{appearance:none;color:#fff;background:linear-gradient(45deg,#0000 50%,#f6c85f 50%) calc(100% - 20px) 21px/6px 6px no-repeat,linear-gradient(135deg,#f6c85f 50%,#0000 50%) calc(100% - 14px) 21px/6px 6px no-repeat,#243935;border:1px solid #94d2bd73;border-radius:8px;width:100%;min-height:48px;padding:0 42px 0 13px;font-weight:800}.lesson-link{color:#dbe6df;text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;grid-template-columns:22px 1fr;gap:10px;width:100%;min-height:66px;padding:12px;display:grid}.lesson-link:hover{background:#ffffff12}.lesson-link.active{color:#fff;background:#243935;border-color:#94d2bd73}.lesson-state{color:#94d2bd;place-items:start center;padding-top:3px;display:grid}.lesson-link strong,.lesson-link em{letter-spacing:0;font-style:normal;display:block}.lesson-link strong{color:#f6c85f;font-size:.82rem}.lesson-link em{color:inherit;margin-top:4px;font-size:.94rem;line-height:1.35}.lesson-header{margin-bottom:18px}.lesson-hero{background:linear-gradient(135deg,#94d2bd7a,#f6c85f3d),#fffdf7;border:1px solid #d9dfd5;border-radius:8px;align-content:center;min-height:260px;padding:34px;display:grid}.lesson-meta{flex-wrap:wrap;gap:8px;margin-bottom:18px;display:flex}.lesson-meta span{color:#38514b;letter-spacing:0;background:#ffffffa3;border:1px solid #cdd7cb;border-radius:999px;padding:7px 10px;font-size:.78rem;font-weight:800}.lesson-hero h2{color:#172321;letter-spacing:0;max-width:760px;margin:0;font-size:clamp(2rem,4vw,4.8rem);line-height:.98}.lesson-hero p{color:#3d4b4b;max-width:720px;margin:22px 0 0;font-size:1.08rem;line-height:1.65}.tab-bar{z-index:5;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f6f7f1eb;border:1px solid #d9dfd5;border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:18px;padding:8px;display:grid;position:sticky;top:0}.tab-button{color:#53615d;background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;gap:8px;min-height:44px;font-weight:800;display:flex}.tab-button:hover,.tab-button.active{color:#fff;background:#172321}.content-grid{gap:18px;display:grid}.panel{background:#ffffffbd;border:1px solid #d9dfd5;border-radius:8px;padding:26px}.wide{width:100%}.section-title{justify-items:start;gap:6px;margin-bottom:18px;display:grid}.section-title span{color:#f05d4f;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;font-weight:900}.section-title h2{color:#172321;letter-spacing:0;margin:0;font-size:1.08rem;line-height:1.35}.lead{color:#53615d;white-space:pre-wrap;max-width:900px;margin:0;font-size:1.02rem;line-height:1.7}.feature-grid{gap:12px;display:grid}.feature-card{background:#fffdf7;border:1px solid #e1e5dc;border-radius:8px;min-height:132px;padding:18px}.feature-card h4{color:#172321;letter-spacing:0;margin:0 0 10px;font-size:1rem}.feature-card p{color:#53615d;white-space:pre-wrap;margin:0;line-height:1.7}.detail-list{gap:18px;display:grid}.detail-group h3{color:#2e4b45;margin:0 0 12px;font-size:1.06rem}.detail-group ul,.checklist{gap:10px;margin:0;padding:0;list-style:none;display:grid}.detail-group li,.checklist li{color:#384743;background:#fffdf7;border:1px solid #e1e5dc;border-radius:8px;padding:13px 14px 13px 40px;line-height:1.55;position:relative}.detail-group li:before{content:"";background:#94d2bd;border-radius:50%;width:8px;height:8px;position:absolute;top:19px;left:17px}.checklist li{align-items:center;gap:11px;padding-left:14px;display:flex}.checklist svg{color:#2f9b73;flex:none}.code-frame{color:#f5f1e8;background:#101817;border:1px solid #0f1817;border-radius:8px;overflow:hidden}.code-example-list{gap:18px;display:grid}.code-example{gap:12px;display:grid}.code-example-copy{gap:6px;display:grid}.code-example-copy h3{color:#172321;letter-spacing:0;margin:0;font-size:1rem}.code-example-copy p{color:#53615d;max-width:860px;margin:0;line-height:1.7}.code-toolbar{color:#94d2bd;text-transform:uppercase;background:#172321;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;min-height:42px;padding:0 14px;font-size:.78rem;font-weight:800;display:flex}.code-toolbar button{color:#fff8ea;background:0 0;border:1px solid #ffffff1f;border-radius:6px;place-items:center;width:32px;height:32px;display:grid}.code-toolbar button:hover{background:#ffffff1a}pre{margin:0;padding:20px;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.92rem;line-height:1.7;overflow-x:auto}code{color:#f5f1e8}.code-token.comment{color:#7f9189}.code-token.string{color:#f6c85f}.code-token.keyword{color:#94d2bd}.code-token.component{color:#f05d4f}.code-token.number{color:#8ecae6}.code-token.punctuation{color:#c9d6cf}.primary{color:#fff;background:#2f9b73;border:0;border-radius:8px;justify-content:center;align-items:center;min-height:46px;margin-top:18px;padding:0 18px;font-weight:900;display:inline-flex}.primary.done{color:#fff;cursor:default;background:#a5ada8}@media (width<=980px){.app-shell{grid-template-columns:1fr}.sidebar{height:auto;padding:22px;position:relative}.lesson-list{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace{padding:22px}}@media (width<=680px){.lesson-list{display:none}.lesson-select-panel{gap:9px;display:grid}.workspace{padding:16px}.lesson-hero,.panel{padding:18px}.lesson-hero{min-height:220px}.lesson-hero h2{font-size:2.1rem;line-height:1.05}.section-title{justify-content:start;display:grid}}