:root{color:#233046;font-synthesis:none;background:#f7f8fc;font-family:system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{margin:0}header{background:#fff;border-bottom:1px solid #e4e7ef;align-items:center;gap:18px;height:72px;padding:0 max(24px,50vw - 550px);display:flex}.brand{color:#5843c4;white-space:nowrap;font-size:1.4rem;font-weight:800;text-decoration:none}.brand span{color:#24314b}.surface{color:#687389;border-left:1px solid #ddd;padding-left:18px}.account{align-items:center;gap:12px;margin-left:auto;display:flex}main{max-width:1100px;margin:0 auto;padding:48px 24px}h1{letter-spacing:-.04em;margin:0 0 12px;font-size:clamp(2rem,5vw,3rem)}h2{margin:0 0 15px;font-size:1.35rem}p{line-height:1.6}.muted{color:#647088}.eyebrow{color:#6e55dc;letter-spacing:.1em;text-transform:uppercase;font-size:.75rem;font-weight:750}.grid{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px;margin-top:28px;display:grid}.card{background:#fff;border:1px solid #e5e7f1;border-radius:16px;padding:24px;box-shadow:0 8px 30px #24314b08}.card a{color:#5843c4;font-weight:700}.stack{gap:15px;display:grid}.field{gap:6px;font-size:.9rem;font-weight:650;display:grid}input{width:100%;font:inherit;border:1px solid #cdd2df;border-radius:8px;padding:11px}button,.button{color:#fff;font:inherit;cursor:pointer;background:#634dd7;border:0;border-radius:8px;padding:11px 17px;font-weight:700;text-decoration:none;display:inline-block}.quiet{color:#5843c4;background:0 0}.error{color:#a3233b;background:#fff0f2;border-radius:8px;padding:12px}.success{color:#176742;background:#e9f8ef;border-radius:8px;padding:12px}.lesson{white-space:pre-wrap;overflow-wrap:anywhere;font-family:inherit;line-height:1.7}.lessons{margin:0;padding:0;list-style:none}.lessons li{border-bottom:1px solid #eef0f5;padding:14px 0}.login{max-width:420px;margin:5vh auto}.login h1{font-size:2.2rem}@media (width<=600px){header{gap:9px;padding:0 16px}.surface{padding-left:9px;font-size:.8rem}.account span{display:none}main{padding:30px 16px}}.lesson-content{color:#34415a;overflow-wrap:anywhere;margin-top:28px;padding:clamp(24px,5vw,48px);line-height:1.75}.lesson-content>:first-child{margin-top:0}.lesson-content h2,.lesson-content h3{color:#24314b;letter-spacing:-.02em;line-height:1.3}.lesson-content h2{border-top:1px solid #e9ebf3;margin:2.5rem 0 1rem;padding-top:1.6rem;font-size:clamp(1.2rem,3vw,1.5rem)}.lesson-content h3{margin:1.8rem 0 .7rem;font-size:1.1rem}.lesson-content p{margin:1rem 0}.lesson-content ul,.lesson-content ol{margin:1rem 0;padding-left:1.5rem}.lesson-content li{margin:.45rem 0;padding-left:.3rem}.lesson-content li::marker{color:#7056d8}.lesson-content strong{color:#283550}.lesson-content code{color:#5943b0;background:#f0edfc;border-radius:5px;padding:.12em .35em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}.lesson-content pre{color:#eef2ff;background:#20283a;border-radius:12px;margin:1.4rem 0;padding:20px 22px;line-height:1.6;overflow-x:auto}.lesson-content pre code{color:inherit;white-space:pre;background:0 0;padding:0;font-size:.88rem}.lesson-content blockquote{color:#4f427c;background:#f6f4ff;border-left:4px solid #8a75e6;margin:1.3rem 0;padding:.4rem 1rem}.lesson-content table{border-collapse:collapse;display:block;overflow-x:auto}.lesson-content th,.lesson-content td{border:1px solid #e5e7f1;padding:.6rem}.lesson-steps{margin-top:28px}.lesson-progress{color:#647088;justify-content:space-between;margin-bottom:8px;font-size:.9rem;font-weight:700;display:flex}.lesson-steps progress{appearance:none;background:#e7e5f4;border:0;border-radius:8px;width:100%;height:8px;display:block;overflow:hidden}.lesson-steps progress::-webkit-progress-bar{background:#e7e5f4}.lesson-steps progress::-webkit-progress-value{background:#6e55dc;border-radius:8px}.lesson-steps progress::-moz-progress-bar{background:#6e55dc;border-radius:8px}.lesson-steps .lesson-content{margin-top:18px}.lesson-navigation{justify-content:space-between;align-items:center;gap:16px;margin:18px 0 28px;display:flex}.lesson-previous{color:#5843c4;background:#eeeafa}.lesson-previous:disabled{opacity:.5;cursor:not-allowed}.challenge{margin:24px 0}.challenge pre{color:#eef2ff;white-space:pre-wrap;overflow-wrap:anywhere;background:#20283a;border-radius:10px;padding:14px 18px;font:14px/1.6 ui-monospace,monospace}button:disabled{opacity:.55;cursor:not-allowed}.language-picker{color:#647088;align-items:center;gap:5px;margin-left:auto;font-size:.8rem;display:flex}.language-picker select{max-width:100px;font:inherit;border:1px solid #cdd2df;border-radius:6px;padding:5px}.language-picker button{padding:6px;font-size:.8rem}.account{margin-left:0}@media (width<=600px){.language-picker label{clip:rect(0,0,0,0);width:1px;height:1px;position:absolute;overflow:hidden}.language-picker button{padding:4px}.brand{font-size:1.1rem}header{gap:6px}}.translation-notice{color:#694d10;background:#fff6df;border-radius:8px;padding:12px 16px}.language-picker select{appearance:none;color:#4f3caa;cursor:pointer;background:#f4f1ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235843c4' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 10px center no-repeat;border:1px solid #d7d4ed;border-radius:10px;min-width:116px;max-width:none;padding:9px 32px 9px 12px;font-size:.85rem;font-weight:700}.language-picker select:focus-visible{outline-offset:2px;outline:3px solid #a997f3}.language-picker select:disabled{opacity:.6;cursor:wait}.language-error{z-index:2;color:#a3233b;background:#fff0f2;border-radius:8px;padding:8px;position:absolute;top:64px;right:24px}@media (width<=600px){.language-picker select{width:98px;min-width:0;padding-left:8px}.surface{display:none}}
