:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);background:var(--background);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,select,textarea{font:inherit}button{cursor:pointer}.app{min-height:100vh;background:linear-gradient(180deg,#071814 0,color-mix(in srgb,var(--background) 92%,white) 520px);color:var(--text)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px clamp(18px,4vw,48px);border-bottom:1px solid rgba(255,255,255,.1);background:#071814d1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0;z-index:4}.brand{font-weight:800;font-size:1.35rem;color:#fff}.tagline{color:#ffffffad;font-size:.88rem}.steps{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.top-status{display:flex;align-items:center;gap:8px;margin-left:auto}.top-status span{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:7px 10px;border-radius:8px;color:#ffffffe0;background:#ffffff14;border:1px solid rgba(255,255,255,.1);font-weight:800;font-size:.84rem}.step,.theme-choice,.secondary-button{border:1px solid rgba(15,23,42,.12);background:var(--surface);color:var(--text);border-radius:8px;min-height:38px;padding:8px 12px}.step{text-transform:capitalize;background:#ffffff14;border-color:#ffffff1a;color:#ffffffbd}.step.active,.theme-choice.selected,.choice.selected{border-color:var(--primary);color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent)}.step.active{background:#fff}.hero-band{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:22px;padding:18px clamp(18px,4vw,48px);background:linear-gradient(90deg,#071814f5,#071814c2),var(--hero-image);color:#fff;overflow:hidden;position:relative}.hero-band:after{content:"";position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent)}.hero-copy{max-width:760px}.eyebrow{margin:0 0 10px;color:color-mix(in srgb,var(--accent) 90%,white);font-weight:800;text-transform:uppercase;font-size:.76rem}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(1.85rem,2.8vw,2.85rem);line-height:1.06;margin-bottom:10px;max-width:760px}.hero-copy p:last-child,.panel p,.flow-panel p,.course-card p{color:var(--muted);line-height:1.6}.hero-copy p:last-child{color:#ffffffc2;max-width:700px;font-size:.94rem;margin-bottom:0}.hero-side{display:grid;grid-template-columns:1fr;gap:12px}.learning-strip{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px clamp(18px,4vw,48px);background:linear-gradient(90deg,#071814f0,#071814d1),var(--hero-image);color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}.learning-strip>div:first-child{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px}.learning-strip strong{font-size:1rem}.learning-strip span{color:#ffffffad;font-size:.88rem}.theme-panel,.panel,.flow-panel,.course-card,.lesson-copy,.runner{background:color-mix(in srgb,var(--surface) 94%,transparent);border:1px solid rgba(15,23,42,.1);border-radius:8px;box-shadow:0 24px 60px #0f172a1a}.theme-panel,.panel,.flow-panel,.lesson-copy,.runner{padding:18px}.theme-list,.chips,.button-row,.choice-row{display:flex;flex-wrap:wrap;gap:10px}.theme-choice{display:inline-flex;align-items:center;gap:8px}.theme-choice span{width:14px;height:14px;border-radius:99px}.theme-panel-compact{display:flex;align-items:center;gap:10px;padding:8px;background:#ffffff1a;border-color:#ffffff24;box-shadow:none}.theme-panel-compact .panel-title{color:#ffffffd1;margin:0}.theme-panel-compact .theme-list{gap:6px}.theme-panel-compact .theme-choice{min-height:32px;padding:6px 8px;background:#ffffff1a;border-color:#ffffff1f;color:#ffffffd1}.theme-panel-compact .theme-choice.selected{background:#fff;color:var(--primary)}.workspace{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);align-items:start;gap:14px;padding:14px clamp(18px,4vw,48px) 48px}.main-panel{min-width:0}.path-sidebar{position:sticky;top:88px;background:color-mix(in srgb,var(--surface) 94%,transparent);border:1px solid rgba(15,23,42,.1);border-radius:8px;box-shadow:0 18px 44px #0f172a14;padding:12px}.path-sidebar-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 4px 10px;color:var(--muted);font-size:.82rem;font-weight:800;text-transform:uppercase}.path-sidebar-header strong{color:var(--primary)}.saved-level{display:grid;gap:2px;margin:0 2px 12px;padding:10px;border-radius:8px;background:color-mix(in srgb,var(--primary) 7%,white);border:1px solid color-mix(in srgb,var(--primary) 14%,transparent)}.saved-level span{color:var(--muted);font-size:.72rem;font-weight:900;text-transform:uppercase}.saved-level strong{color:var(--text);font-size:.88rem;line-height:1.25}.saved-level small{color:var(--muted);line-height:1.3}.curriculum-tree,.tree-children,.lesson-list{display:grid;gap:6px}.tree-language{display:grid;gap:8px}.tree-language-title{display:flex;align-items:center;gap:8px;color:var(--text);padding:7px 6px}.tree-language-title strong{font-size:1rem}.tree-children{margin-left:8px;padding-left:10px;border-left:1px solid rgba(15,23,42,.1)}.course-toggle,.module-toggle,.lesson-link{width:100%;text-align:left;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text)}.course-toggle,.module-toggle{display:grid;grid-template-columns:18px minmax(0,1fr);gap:7px;align-items:start;padding:9px 8px}.course-toggle:hover,.module-toggle:hover,.lesson-link:not(:disabled):hover{background:color-mix(in srgb,var(--primary) 6%,white);border-color:color-mix(in srgb,var(--primary) 18%,transparent)}.course-toggle span,.module-toggle span,.lesson-link span:last-child{display:grid;gap:2px;min-width:0}.course-toggle strong,.module-toggle strong,.lesson-link strong{font-size:.92rem;line-height:1.25}.course-toggle small,.module-toggle small,.lesson-link small{color:var(--muted);font-size:.75rem;line-height:1.25}.module-toggle{padding:8px}.module-toggle strong{font-size:.86rem}.chevron{margin-top:2px;color:var(--muted);transition:transform .15s ease}.chevron.open{transform:rotate(90deg);color:var(--primary)}.lesson-list{list-style:none;margin:2px 0 8px;padding:0}.module-outline{display:grid;gap:6px}.lesson-link{display:grid;grid-template-columns:24px minmax(0,1fr);gap:8px;min-height:48px;padding:7px 8px}.lesson-link.current{background:color-mix(in srgb,var(--primary) 9%,white);border-color:color-mix(in srgb,var(--primary) 30%,transparent);box-shadow:inset 3px 0 0 var(--primary)}.lesson-link.complete .lesson-state{background:color-mix(in srgb,var(--primary) 14%,white);color:var(--primary)}.lesson-link.locked{color:color-mix(in srgb,var(--muted) 72%,white);cursor:not-allowed;opacity:.62}.lesson-state{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;background:#0f172a14;color:var(--muted)}.project-list{display:grid;gap:5px;margin:0 0 8px 4px}.project-row,.next-course-card{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:6px;min-height:34px;padding:6px 8px;border-radius:8px;color:var(--muted);background:#0f172a0a;font-size:.78rem}.project-row span{color:var(--text);font-weight:700}.project-row small{text-transform:capitalize}.project-row.locked{opacity:.62}.quiz-row{margin-left:4px;color:var(--primary);background:color-mix(in srgb,var(--primary) 7%,white)}.next-course-card{grid-template-columns:1fr;margin:6px 0;color:var(--primary);font-weight:800}.compact-panel{box-shadow:none}.compact-panel h3{margin-bottom:4px}.compact-panel p{margin-bottom:10px}.panel-title,.panel-heading{display:flex;align-items:center;gap:10px;color:var(--primary);font-weight:800;margin-bottom:16px}.panel-heading h2{margin:0;color:var(--text);font-size:1.28rem}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}.stats div{background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 10%,white),#fff);border-radius:8px;padding:14px;border:1px solid color-mix(in srgb,var(--primary) 12%,transparent)}.stats strong{display:block;font-size:1.55rem}.stats span,.muted{color:var(--muted)}.progress-track{height:10px;background:#0f172a14;border-radius:99px;overflow:hidden;margin-bottom:16px}.progress-track div{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent))}.badge-list{display:grid;gap:10px}.badge{display:flex;align-items:center;gap:8px;color:var(--primary);font-weight:700}.chips span{border-radius:8px;background:color-mix(in srgb,var(--secondary) 10%,white);color:var(--secondary);padding:7px 9px;font-size:.82rem;font-weight:700}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}.select-field{display:grid;gap:8px;color:var(--muted);font-weight:700}.select-field select{border:1px solid rgba(15,23,42,.14);border-radius:8px;min-height:44px;padding:0 12px;background:#fff;color:var(--text)}.onboarding-panel{min-height:460px;display:grid;align-content:start}.onboarding-progress{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-bottom:22px}.onboarding-progress span{height:7px;border-radius:99px;background:#0f172a1a}.onboarding-progress span.filled{background:linear-gradient(90deg,var(--primary),var(--secondary))}.question-body{max-width:780px;font-size:1.04rem}.option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 22px}.option-card{display:grid;gap:8px;min-height:132px;text-align:left;border:1px solid rgba(15,23,42,.12);border-radius:8px;background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--primary) 4%,white));color:var(--text);padding:18px;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.option-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primary) 42%,transparent);box-shadow:0 18px 38px #0f172a1a}.option-card.selected{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 15%,transparent)}.option-card strong{font-size:1.04rem}.option-card span{color:var(--muted);line-height:1.45}.theme-option i{width:28px;height:28px;border-radius:99px;box-shadow:inset 0 0 0 6px #ffffff5c}.onboarding-actions{justify-content:flex-end}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;border-radius:8px;padding:10px 16px;color:#fff;background:linear-gradient(135deg,var(--primary),var(--secondary));font-weight:800;box-shadow:0 14px 32px color-mix(in srgb,var(--primary) 28%,transparent)}.course-card{padding:22px;background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--primary) 5%,white))}.course-card h2{font-size:2rem;margin-bottom:10px}.reason{border-left:4px solid var(--accent);padding-left:12px}.course-card li{margin-bottom:8px}.question{border:1px solid rgba(15,23,42,.12);border-radius:8px;padding:16px;margin:14px 0}.question legend{padding:0 8px;font-weight:800}.choice{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:9px 12px;border:1px solid rgba(15,23,42,.12);border-radius:8px;background:#fff}.result{display:grid;gap:6px;margin-top:14px;padding:14px;border-radius:8px;background:color-mix(in srgb,var(--accent) 12%,white);color:var(--text)}.result.success{background:color-mix(in srgb,var(--primary) 12%,white)}.lesson-layout{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(440px,1.28fr);gap:14px}.lesson-image{min-height:82px;border-radius:8px;margin-bottom:12px;background:linear-gradient(135deg,rgba(255,255,255,.36),transparent),var(--lesson-image);border:1px solid rgba(15,23,42,.08)}.inline-code{background:var(--code-bg);color:#d1fae5;padding:16px;border-radius:8px;overflow:auto}.runner textarea{width:100%;min-height:300px;resize:vertical;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:var(--code-bg);color:#e5e7eb;padding:18px;margin:12px 0;font-family:Cascadia Code,Fira Code,Consolas,monospace;font-size:.98rem;line-height:1.6}.save-panel{max-width:720px}.wide{max-width:420px}.auth-form{display:grid;gap:12px;max-width:360px;margin-bottom:14px}.auth-form input{font:inherit;min-height:44px;padding:10px 14px;border:1px solid rgba(15,23,42,.14);border-radius:8px;background:#fff;color:var(--text)}@media(max-width:980px){.topbar,.hero-band,.workspace,.lesson-layout,.option-grid{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.top-status{margin-left:0;flex-wrap:wrap}.learning-strip{align-items:flex-start;flex-direction:column}.workspace{padding-top:18px}.path-sidebar{position:static}}@media(max-width:640px){.form-grid,.stats{grid-template-columns:1fr}.steps{justify-content:flex-start}h1{font-size:2.15rem}}