:root{--bg: #f4f7fb;--surface: #ffffff;--surface-alt: #edf2fb;--text: #162033;--muted: #5d6a82;--brand: #b07219;--brand-strong: #7a4e0f;--accent: #5382a1;--danger: #c62828;--success: #1b8a5a;--shadow: 0 22px 45px rgba(20, 35, 62, .12);--radius-lg: 20px;--radius-sm: 12px}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Space Grotesk,Segoe UI,sans-serif;background:radial-gradient(circle at 18% 10%,#ffe9c2 0%,transparent 35%),radial-gradient(circle at 85% 75%,#cfe3f7 0%,transparent 40%),var(--bg);color:var(--text);padding:2rem 1rem 4rem}.bg-orb{position:fixed;border-radius:50%;filter:blur(30px);opacity:.25;pointer-events:none;z-index:0}.orb-a{width:260px;height:260px;background:#f89820;top:-60px;left:-50px}.orb-b{width:280px;height:280px;background:#5382a1;right:-40px;bottom:50px}.app-shell{max-width:1200px;margin:0 auto;display:grid;gap:1.25rem;position:relative;z-index:1}.content-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:1rem;align-items:start}.content-main{display:grid;gap:1rem}.lesson-sidebar{position:sticky;top:1rem;max-height:calc(100vh - 2rem);overflow:auto}.lesson-nav{margin-top:.9rem;display:grid;gap:.45rem}.lesson-nav-item{width:100%;text-align:left;border:1px solid #d0dced;background:#fff;color:var(--text);border-radius:12px;padding:.6rem .75rem;cursor:pointer;font:inherit;display:grid;gap:.2rem}.lesson-nav-item strong{font-size:.86rem;color:var(--brand-strong)}.lesson-nav-item span{font-size:.85rem}.lesson-nav-item.active{border-color:var(--brand);background:#fdf1de}.lesson-nav-item.completed strong:after{content:" done";color:var(--success);font-weight:700;margin-left:.35rem}.card{background:color-mix(in srgb,var(--surface) 90%,white 10%);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:1.25rem;border:1px solid rgba(0,0,0,.05);animation:slideUp .5s ease both}@keyframes slideUp{0%{transform:translateY(18px);opacity:0}to{transform:translateY(0);opacity:1}}h1,h2,h3,h4{margin:0 0 .5rem;line-height:1.2}h1{font-size:clamp(1.8rem,5vw,2.7rem)}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--brand);font-weight:700;margin:0 0 .4rem;font-size:.75rem}.subtitle{color:var(--muted);margin:.2rem 0 0}.hero{display:grid;grid-template-columns:1.8fr 1fr;gap:1rem}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.stats-grid article{background:var(--surface-alt);border-radius:var(--radius-sm);padding:.75rem;text-align:center}.stats-grid h2,.score-headline,.timer-wrap h3{font-family:JetBrains Mono,monospace}.stats-grid h2{font-size:1.4rem;margin-bottom:.25rem}.stats-grid p,.progress-wrap p,.timer-wrap p,.breakdown-card p{margin:0;color:var(--muted);font-size:.88rem}.hint{margin:.8rem 0 0;color:var(--muted);font-size:.92rem}.btn{border:none;padding:.8rem 1rem;border-radius:12px;cursor:pointer;transition:transform .14s ease,filter .14s ease;font:inherit;font-weight:600}.btn:hover{transform:translateY(-1px);filter:brightness(1.02)}.btn:focus-visible,.answer-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn-primary{background:var(--brand);color:#fff}.btn-secondary{background:#dde8f9;color:#1e2a3f}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.lesson-head,.quiz-head{display:flex;justify-content:space-between;gap:1rem}.meta-tag{margin:0 0 .4rem;display:inline-block;padding:.3rem .6rem;border-radius:999px;background:#fdf1de;color:#7a4e0f;font-size:.78rem;font-weight:700}.timer-wrap{text-align:right;min-width:100px}.timer-wrap h3{font-size:1.4rem}.progress-wrap{margin:1rem 0}.progress-bar{width:100%;height:10px;border-radius:999px;background:#dde6f2;overflow:hidden}.progress-fill{height:100%;width:0;background:linear-gradient(90deg,#b07219,#5382a1);transition:width .25s ease}.lesson-layout{display:grid;grid-template-columns:1fr;gap:1rem}.code-examples{display:grid;grid-template-columns:1fr;gap:.8rem}.lesson-copy,.code-card,.quiz-panel,.breakdown-card,.missed-item{background:var(--surface-alt);border-radius:16px;padding:1rem}.lesson-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem 1rem}.lesson-points p{margin:0;line-height:1.55}.code-card-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;font-size:.88rem;color:var(--muted);margin-bottom:.75rem}.code-card-actions{display:flex;align-items:center;gap:.6rem}.copy-code-btn{display:inline-flex;align-items:center;gap:.35rem;border:1px solid #bfd0e8;background:#f7fbff;color:#234;border-radius:10px;padding:.3rem .55rem;cursor:pointer;font:inherit;font-size:.78rem;font-weight:600;line-height:1;transition:background .14s ease,border-color .14s ease,color .14s ease}.copy-code-btn:hover{background:#ecf5ff;border-color:#93afd4}.copy-code-btn.copied{background:#e8f8f0;border-color:#9ccfb1;color:#1d6b44}.copy-code-btn.copy-failed{background:#fdeced;border-color:#f0b6bc;color:#8a2a34}.code-block{margin:0;padding:1rem;border-radius:14px;background:#152238;color:#f4f7fb;overflow-x:auto;font-family:JetBrains Mono,monospace;font-size:.9rem;line-height:1.55}.code-block .tok-comment{color:#8aa2c4;font-style:italic}.code-block .tok-string{color:#f7cb68}.code-block .tok-keyword{color:#7cd0ff;font-weight:600}.code-block .tok-type{color:#9bf2b1}.code-block .tok-number{color:#ff9ca6}.code-block .tok-preproc{color:#d9b3ff}.quiz-panel{margin-top:1rem}.answer-list{display:grid;gap:.7rem;margin-top:.9rem}.answer-btn{border:1px solid #ced7e7;background:#fff;color:var(--text);border-radius:12px;text-align:left;padding:.75rem;cursor:pointer;font:inherit}.answer-btn.selected{border-color:var(--brand);background:#fdf1de}.answer-btn.correct{border-color:var(--success);background:#e8f8f0}.answer-btn.wrong{border-color:var(--danger);background:#fdeced}.feedback{margin-top:.9rem;border-radius:12px;padding:.8rem;font-size:.95rem}.feedback.good{background:#e8f8f0;color:#1a6a47}.feedback.bad{background:#fdeced;color:#822929}.quiz-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}.score-headline{font-size:clamp(1.4rem,3vw,2.1rem);color:var(--brand-strong)}.category-breakdown,.missed-list{margin-top:1rem;display:grid;gap:.75rem}.category-breakdown{grid-template-columns:repeat(2,minmax(0,1fr))}.missed-item{background:#fff7ec;border:1px solid #ffd8a8}.success-item{background:#edf9f1;border-color:#b9e7ca}.missed-item p{margin:.35rem 0}.hidden{display:none}.site-footer{max-width:980px;margin:1rem auto 0;text-align:center;color:var(--muted);font-size:.9rem;position:relative;z-index:1}.site-footer p{margin:0}@media (max-width: 820px){.hero,.lesson-layout,.lesson-points,.code-examples,.category-breakdown,.content-grid{grid-template-columns:1fr}.lesson-sidebar{position:static;max-height:none}.lesson-head,.quiz-head{flex-direction:column}.timer-wrap{text-align:left}}
