#root{min-height:100svh}body{margin:0}:root{--color-bg:#0a0a0f;--color-surface:#12121a;--color-surface-hover:#1a1a25;--color-border:#1e1e2e;--color-text:#e4e4e7;--color-text-muted:#71717a;--color-text-heading:#fafafa;--color-primary:#f97316;--color-primary-hover:#fb923c;--color-primary-muted:#f9731626;--color-primary-border:#f973164d;--color-success:#22c55e;--color-success-bg:#22c55e1f;--color-warning:#eab308;--color-warning-bg:#eab3081f;--color-danger:#ef4444;--color-danger-bg:#ef44441f;--color-info:#3b82f6;--color-info-bg:#3b82f61f;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--shadow-sm:0 1px 2px #0006;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 24px #00000080}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}a{color:var(--color-primary);text-decoration:none}a:hover{color:var(--color-primary-hover)}.loading{min-height:100vh;color:var(--color-text-muted);justify-content:center;align-items:center;font-size:1.25rem;display:flex}.app-layout{min-height:100vh;display:flex}.sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);z-index:100;flex-direction:column;width:260px;padding:1.5rem 0;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.sidebar-brand{border-bottom:1px solid var(--color-border);align-items:center;gap:.5rem;margin-bottom:1rem;padding:0 1.25rem 1.5rem;display:flex}.sidebar-brand-icon{background:var(--color-primary);border-radius:var(--radius-sm);color:#fff;justify-content:center;align-items:center;width:32px;height:32px;font-size:.9rem;font-weight:800;display:flex}.sidebar-brand h1{color:var(--color-text-heading);font-size:1.15rem;font-weight:700}.sidebar-nav{flex-direction:column;gap:2px;padding:0 .75rem;list-style:none;display:flex}.sidebar-nav a{border-radius:var(--radius-md);color:var(--color-text-muted);align-items:center;gap:.75rem;padding:.6rem .75rem;font-size:.9rem;font-weight:500;transition:all .15s;display:flex}.sidebar-nav a:hover{background:var(--color-surface-hover);color:var(--color-text)}.sidebar-nav a.active{background:var(--color-primary-muted);color:var(--color-primary);font-weight:600}.sidebar-nav-icon{text-align:center;flex-shrink:0;width:24px;font-size:1.15rem}.main-content{flex:1;min-height:100vh;margin-left:260px;padding:2rem 2.5rem}.page-header{margin-bottom:2rem}.page-header h2{color:var(--color-text-heading);margin-bottom:.25rem;font-size:1.75rem;font-weight:700}.page-header p{color:var(--color-text-muted);font-size:.95rem}.landing{max-width:1200px;margin:0 auto;padding:0 1.5rem}.landing-nav{justify-content:space-between;align-items:center;padding:1.5rem 0;display:flex}.landing-logo{color:var(--color-text-heading);align-items:center;gap:.5rem;font-size:1.25rem;font-weight:800;display:flex}.landing-logo-icon{background:var(--color-primary);border-radius:var(--radius-sm);color:#fff;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;font-weight:800;display:flex}.landing-nav-links{gap:2rem;list-style:none;display:flex}.landing-nav-links a{color:var(--color-text-muted);font-size:.9rem;font-weight:500}.landing-nav-links a:hover{color:var(--color-text)}.hero{text-align:center;padding:5rem 0 4rem}.hero h1{background:linear-gradient(135deg,#f97316,#fb923c,#fbbf24);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:3.5rem;font-weight:800;line-height:1.15}.tagline{color:var(--color-text);margin-bottom:.5rem;font-size:1.35rem}.subtitle{color:var(--color-text-muted);max-width:560px;margin-bottom:2.5rem;margin-left:auto;margin-right:auto;font-size:1.05rem}.hero-buttons{justify-content:center;gap:1rem;display:flex}.cta-button{background:var(--color-primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;border:none;padding:.8rem 2rem;font-size:1rem;font-weight:600;transition:background .2s}.cta-button:hover{background:var(--color-primary-hover)}.cta-button-secondary{color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;background:0 0;padding:.8rem 2rem;font-size:1rem;font-weight:600;transition:all .2s}.cta-button-secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.features{padding:4rem 0}.features h2{text-align:center;color:var(--color-text-heading);margin-bottom:1rem;font-size:2rem}.features>p{text-align:center;color:var(--color-text-muted);max-width:500px;margin-bottom:3rem;margin-left:auto;margin-right:auto}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;display:grid}.feature-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.75rem;transition:border-color .2s,transform .2s}.feature-card:hover{border-color:var(--color-primary-border);transform:translateY(-2px)}.feature-icon{margin-bottom:.75rem;font-size:1.75rem;display:block}.feature-card h3{color:var(--color-text-heading);margin-bottom:.4rem;font-size:1.1rem}.feature-card p{color:var(--color-text-muted);font-size:.875rem;line-height:1.5}.metrics-callout{flex-wrap:wrap;justify-content:center;gap:4rem;padding:4rem 0;display:flex}.metric{text-align:center}.metric-value{color:var(--color-primary);font-size:3rem;font-weight:800;display:block}.metric-label{color:var(--color-text-muted);font-size:.9rem}.pricing-section{padding:4rem 0}.pricing-section h2{text-align:center;color:var(--color-text-heading);margin-bottom:3rem;font-size:2rem}.pricing-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;max-width:1000px;margin:0 auto;display:grid}.pricing-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;padding:2rem;display:flex}.pricing-card.featured{border-color:var(--color-primary);position:relative}.pricing-badge{background:var(--color-primary);color:#fff;border-radius:999px;padding:.2rem 1rem;font-size:.75rem;font-weight:600;position:absolute;top:-12px;left:50%;transform:translate(-50%)}.pricing-card h3{color:var(--color-text-heading);margin-bottom:.5rem;font-size:1.25rem}.pricing-price{color:var(--color-text-heading);margin-bottom:.25rem;font-size:2.5rem;font-weight:800}.pricing-price span{color:var(--color-text-muted);font-size:1rem;font-weight:400}.pricing-desc{color:var(--color-text-muted);margin-bottom:1.5rem;font-size:.875rem}.pricing-features{flex:1;margin-bottom:1.5rem;list-style:none}.pricing-features li{color:var(--color-text-muted);padding:.35rem 0;font-size:.875rem}.pricing-features li:before{content:"✓";color:var(--color-primary);margin-right:.5rem;font-weight:700}.footer{text-align:center;border-top:1px solid var(--color-border);color:var(--color-text-muted);padding:3rem 0;font-size:.875rem}.footer-links{justify-content:center;gap:2rem;margin-bottom:1rem;list-style:none;display:flex}.footer-links a{color:var(--color-text-muted);font-size:.85rem}.footer-links a:hover{color:var(--color-text)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.5rem}.card-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.card-header h3{color:var(--color-text-heading);font-size:1rem;font-weight:600}.badge{border-radius:999px;align-items:center;padding:.2rem .65rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-danger{background:var(--color-danger-bg);color:var(--color-danger)}.badge-info{background:var(--color-info-bg);color:var(--color-info)}.badge-muted{color:var(--color-text-muted);background:#71717a26}.badge-primary{background:var(--color-primary-muted);color:var(--color-primary)}.progress-bar{background:var(--color-border);border-radius:999px;height:8px;overflow:hidden}.progress-bar-fill{border-radius:999px;height:100%;transition:width .4s}.progress-bar-fill.orange{background:var(--color-primary)}.progress-bar-fill.green{background:var(--color-success)}.progress-bar-fill.yellow{background:var(--color-warning)}.progress-bar-fill.red{background:var(--color-danger)}.progress-bar-fill.blue{background:var(--color-info)}.data-table{border-collapse:collapse;width:100%}.data-table th{text-align:left;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--color-border);padding:.75rem 1rem;font-size:.8rem;font-weight:600}.data-table td{border-bottom:1px solid var(--color-border);padding:.75rem 1rem;font-size:.9rem}.data-table tbody tr:hover{background:var(--color-surface-hover)}.tab-list{border-bottom:1px solid var(--color-border);gap:0;margin-bottom:1.5rem;display:flex}.tab-button{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:.75rem 1.25rem;font-size:.9rem;font-weight:500;transition:all .15s}.tab-button:hover{color:var(--color-text)}.tab-button.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:.85rem;font-weight:700;display:flex}.checklist-item{border-bottom:1px solid var(--color-border);align-items:flex-start;gap:.75rem;padding:.85rem 0;display:flex}.checklist-item:last-child{border-bottom:none}.checklist-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--color-primary);cursor:pointer;flex-shrink:0;margin-top:2px}.checklist-item-content{flex:1}.checklist-item-title{color:var(--color-text);font-size:.9rem;font-weight:500}.checklist-item-title.completed{color:var(--color-text-muted);text-decoration:line-through}.checklist-item-meta{color:var(--color-text-muted);margin-top:.15rem;font-size:.8rem}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem;display:grid}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.25rem 1.5rem}.stat-card-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.35rem;font-size:.8rem}.stat-card-value{color:var(--color-text-heading);font-size:1.75rem;font-weight:700}.stat-card-sub{color:var(--color-text-muted);margin-top:.15rem;font-size:.8rem}.quiz-question{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:1rem;padding:1.5rem}.quiz-question h4{color:var(--color-text-heading);margin-bottom:1rem;font-size:.95rem;font-weight:600}.quiz-option{border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;align-items:center;gap:.6rem;margin-bottom:.5rem;padding:.5rem .75rem;font-size:.875rem;transition:all .15s;display:flex}.quiz-option:hover{border-color:var(--color-primary-border);background:var(--color-primary-muted)}.quiz-option.selected{border-color:var(--color-primary);background:var(--color-primary-muted)}.quiz-option.correct{border-color:var(--color-success);background:var(--color-success-bg)}.quiz-option.incorrect{border-color:var(--color-danger);background:var(--color-danger-bg)}.quiz-option input[type=radio]{accent-color:var(--color-primary)}.walkthrough-step{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:1rem;padding:1.5rem}.walkthrough-step.active{border-color:var(--color-primary)}.walkthrough-step-header{align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.walkthrough-step-number{background:var(--color-primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:.8rem;font-weight:700;display:flex}.walkthrough-step-number.done{background:var(--color-success)}.walkthrough-step-path{color:var(--color-primary);background:var(--color-primary-muted);border-radius:var(--radius-sm);padding:.2rem .5rem;font-family:Fira Code,JetBrains Mono,monospace;font-size:.85rem}.walkthrough-code{border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-muted);background:#0d0d14;margin:.75rem 0;padding:1rem;font-family:Fira Code,JetBrains Mono,monospace;font-size:.8rem;line-height:1.6;overflow-x:auto}.bar-chart{align-items:flex-end;gap:1.5rem;height:200px;padding:1rem 0;display:flex}.bar-chart-item{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;height:100%;display:flex}.bar-chart-bar{border-radius:var(--radius-sm) var(--radius-sm) 0 0;width:100%;max-width:48px;transition:height .4s}.bar-chart-label{color:var(--color-text-muted);text-align:center;margin-top:.5rem;font-size:.75rem}.bar-chart-value{color:var(--color-text);margin-bottom:.35rem;font-size:.8rem;font-weight:600}.milestone-phase{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);margin-bottom:1.25rem;padding:1.5rem}.milestone-phase-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.milestone-phase-title{align-items:center;gap:.75rem;display:flex}.milestone-phase-title h3{color:var(--color-text-heading);font-size:1.1rem;font-weight:600}.milestone-goals{list-style:none}.milestone-goals li{align-items:center;gap:.5rem;padding:.4rem 0;font-size:.875rem;display:flex}.milestone-check{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;font-size:.7rem;display:flex}.milestone-check.done{background:var(--color-success-bg);color:var(--color-success)}.milestone-check.pending{color:var(--color-text-muted);background:#71717a26}.mentor-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.mentor-card-header{align-items:center;gap:1rem;display:flex}.mentor-card-info h4{color:var(--color-text-heading);font-size:1rem;font-weight:600}.mentor-card-info p{color:var(--color-text-muted);font-size:.8rem}.mentor-skills{flex-wrap:wrap;gap:.4rem;display:flex}.mentor-skill-tag{background:var(--color-primary-muted);color:var(--color-primary);border-radius:999px;padding:.15rem .5rem;font-size:.75rem;font-weight:500}.mentor-match-score{background:var(--color-primary-muted);border-radius:var(--radius-md);align-items:center;gap:.5rem;padding:.75rem;display:flex}.mentor-match-score-value{color:var(--color-primary);font-size:1.25rem;font-weight:700}.mentor-match-score-label{color:var(--color-text-muted);font-size:.8rem}.select-control{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);cursor:pointer;padding:.5rem .75rem;font-size:.875rem}.select-control:focus{border-color:var(--color-primary);outline:none}.btn{border-radius:var(--radius-md);cursor:pointer;border:none;align-items:center;gap:.4rem;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:all .15s;display:inline-flex}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-outline{border:1px solid var(--color-border);color:var(--color-text);background:0 0}.btn-outline:hover{border-color:var(--color-primary);color:var(--color-primary)}.score-circle{border:3px solid var(--color-border);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 1rem;display:flex}.score-circle.pass{border-color:var(--color-success)}.score-circle.fail{border-color:var(--color-danger)}.score-circle-value{font-size:1.5rem;font-weight:700;line-height:1}.score-circle-label{color:var(--color-text-muted);font-size:.65rem}@media (width<=768px){.sidebar{display:none}.main-content{margin-left:0;padding:1.5rem 1rem}.hero h1{font-size:2.5rem}.metrics-callout{gap:2rem}.stat-grid{grid-template-columns:repeat(2,1fr)}.bar-chart{gap:.75rem}}
