:root{--bg-primary:#0d0d0d;--bg-secondary:#141416;--bg-tertiary:#1a1a1e;--bg-hover:#222226;--border:#2a2a2e;--text-primary:#e8e8e8;--text-secondary:#888890;--text-tertiary:#5c5c62;--accent:#7c5cfc;--accent-dim:#5a3fc8;--accent-glow:#7c5cfc26;--green:#4ade80;--orange:#fb923c;--red:#f87171;--blue:#60a5fa;--diagram-box:#1e1e24;--diagram-outline:#2e2e36;--diagram-cpu:#60a5fa;--diagram-gpu:#4ade80;--diagram-lopu:#7c5cfc;--diagram-cpu-dim:#60a5fa33;--diagram-gpu-dim:#4ade8033;--diagram-lopu-dim:#7c5cfc33;--diagram-cache:#fbbf24;--diagram-mem:#f87171;--diagram-text:#a0a0aa;--diagram-text-bright:#e8e8e8;--diagram-laser:#ef4444;--diagram-orange:#fb923c;--diagram-cache-dim:#fbbf2433;--diagram-mem-dim:#f8717133;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", monospace;--sidebar-width:280px;--navbar-height:56px}[data-theme=light]{--bg-primary:#fafafa;--bg-secondary:#f5f5f5;--bg-tertiary:#eee;--bg-hover:#e5e5e5;--border:#d4d4d8;--text-primary:#1a1a1a;--text-secondary:#52525b;--text-tertiary:#a1a1aa;--accent:#6d4aff;--accent-dim:#5a3fc8;--accent-glow:#6d4aff1a;--diagram-box:#e8e8ee;--diagram-outline:#c8c8d0;--diagram-text:#6b6b76;--diagram-text-bright:#1a1a1a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}a{color:var(--accent);text-decoration:none}a:hover{opacity:.85}code,pre{font-family:var(--font-mono)}button{font-family:var(--font-sans);cursor:pointer;color:inherit;background:0 0;border:none}.app-layout{min-height:100vh;display:flex}.app-layout.has-sidebar{padding-left:var(--sidebar-width)}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border);z-index:100;flex-direction:column;height:100vh;display:flex;position:fixed;top:0;left:0;overflow-y:auto}.sidebar-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px;display:flex}.sidebar-brand{color:var(--text-primary);font-size:1.1rem;font-weight:600}.sidebar-brand:hover{opacity:.9}.sidebar-actions{align-items:center;gap:8px;display:flex}.theme-btn{background:var(--bg-tertiary);width:36px;height:36px;color:var(--text-secondary);border-radius:8px;justify-content:center;align-items:center;font-size:1.1rem;transition:all .15s;display:flex}.theme-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.sidebar-nav{flex:1;padding:12px 8px;overflow-y:auto}.chapter-group{margin-bottom:4px}.chapter-header{color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:10px;width:100%;padding:10px 12px;font-size:.875rem;font-weight:500;transition:all .15s;display:flex}.chapter-header:hover{background:var(--bg-hover)}.chapter-header.active{background:var(--accent-glow);color:var(--accent)}.chapter-header .icon{text-align:center;flex-shrink:0;width:20px;font-size:1rem}.chapter-subpages{padding-left:32px}.subpage-link{color:var(--text-secondary);border-radius:6px;padding:6px 12px;font-size:.8125rem;transition:all .15s;display:block}.subpage-link:hover{background:var(--bg-hover);color:var(--text-primary)}.subpage-link.active{color:var(--accent);background:var(--accent-glow)}.chapter-badge{background:var(--bg-tertiary);color:var(--text-tertiary);border-radius:4px;margin-left:auto;padding:2px 6px;font-size:.65rem}.chapter-badge.soon{color:var(--orange);background:#fb923c1a}.main-content{flex:1;width:100%;min-width:0;padding:40px 56px}.navbar{height:var(--navbar-height);border-bottom:1px solid var(--border);background:var(--bg-primary);justify-content:space-between;align-items:center;padding:0 32px;display:flex}.navbar-brand{color:var(--text-primary);font-size:1.1rem;font-weight:600}.navbar-links{align-items:center;gap:24px;display:flex}.navbar-link{color:var(--text-secondary);font-size:.875rem;font-weight:500;transition:color .15s}.navbar-link:hover{color:var(--text-primary)}.page-container{max-width:960px;margin:0 auto;padding:40px 32px}.hero{text-align:center;padding:80px 0 60px}.hero-badge{background:var(--accent-glow);color:var(--accent);border-radius:20px;align-items:center;gap:6px;margin-bottom:24px;padding:6px 14px;font-size:.8rem;font-weight:500;display:inline-flex}.hero h1{letter-spacing:-.02em;margin-bottom:20px;font-size:3.2rem;font-weight:700;line-height:1.15}.hero h1 .highlight{color:var(--accent)}.hero p{color:var(--text-secondary);max-width:640px;margin:0 auto 32px;font-size:1.1rem;line-height:1.7}.hero-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.btn{border-radius:10px;align-items:center;gap:8px;padding:12px 24px;font-size:.9rem;font-weight:500;transition:all .15s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-dim)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-hover)}.stats-row{flex-wrap:wrap;justify-content:center;gap:48px;padding:40px 0;display:flex}.stat-item{text-align:center}.stat-value{color:var(--text-primary);font-size:2rem;font-weight:700;font-family:var(--font-mono)}.stat-label{color:var(--text-tertiary);margin-top:4px;font-size:.8rem}.comparison-grid{grid-template-columns:repeat(3,1fr);gap:20px;margin:40px 0;display:grid}.compare-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:28px;transition:all .2s}.compare-card:hover{border-color:var(--accent);transform:translateY(-2px)}.compare-card.cpu{border-top:3px solid var(--blue)}.compare-card.gpu{border-top:3px solid var(--green)}.compare-card.lopu{border-top:3px solid var(--accent)}.compare-card h3{align-items:center;gap:8px;margin-bottom:12px;font-size:1.2rem;font-weight:600;display:flex}.compare-card .specs{padding:0;list-style:none}.compare-card .specs li{color:var(--text-secondary);border-bottom:1px solid var(--border);justify-content:space-between;padding:6px 0;font-size:.85rem;display:flex}.compare-card .specs li:last-child{border-bottom:none}.compare-card .specs .label{color:var(--text-tertiary)}.compare-card .specs .value{color:var(--text-primary);font-weight:500}.section{padding:60px 0}.section-title{letter-spacing:-.01em;margin-bottom:16px;font-size:1.8rem;font-weight:700}.section-subtitle{color:var(--text-secondary);max-width:600px;margin-bottom:32px;font-size:1rem}.curriculum-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}.curriculum-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:24px;transition:all .15s}.curriculum-card:hover{border-color:var(--accent);cursor:pointer}.curriculum-card .act-label{text-transform:uppercase;letter-spacing:.05em;color:var(--accent);margin-bottom:8px;font-size:.7rem;font-weight:600}.curriculum-card h4{margin-bottom:8px;font-size:1.1rem;font-weight:600}.curriculum-card p{color:var(--text-secondary);font-size:.85rem;line-height:1.6}.curriculum-card .topic-list{margin-top:16px;padding:0;list-style:none}.curriculum-card .topic-list li{color:var(--text-secondary);align-items:center;gap:8px;padding:4px 0;font-size:.8rem;display:flex}.curriculum-card .topic-list .status{border-radius:4px;margin-left:auto;padding:2px 6px;font-size:.65rem}.curriculum-card .topic-list .status.ready{color:var(--green);background:#4ade801a}.curriculum-card .topic-list .status.soon{color:var(--orange);background:#fb923c1a}.chapter-page{padding:0}.chapter-page h1{letter-spacing:-.01em;margin-bottom:12px;font-size:2.2rem;font-weight:700}.chapter-page .subtitle{color:var(--text-secondary);margin-bottom:40px;font-size:1rem}.chapter-page h2{margin-top:40px;margin-bottom:16px;font-size:1.4rem;font-weight:600}.chapter-page h3{margin-top:28px;margin-bottom:12px;font-size:1.1rem;font-weight:600}.chapter-page p{color:var(--text-secondary);margin-bottom:16px;font-size:.95rem;line-height:1.8}.chapter-page ul,.chapter-page ol{margin:12px 0 20px;padding-left:24px}.chapter-page li{color:var(--text-secondary);margin-bottom:6px;font-size:.95rem;line-height:1.7}.chapter-page .callout{background:var(--bg-tertiary);border-left:3px solid var(--accent);color:var(--text-secondary);border-radius:0 8px 8px 0;margin:24px 0;padding:16px 20px;font-size:.9rem}.chapter-page .callout strong{color:var(--text-primary)}.chapter-page table{border-collapse:collapse;width:100%;margin:24px 0;font-size:.85rem}.chapter-page th,.chapter-page td{text-align:left;border-bottom:1px solid var(--border);padding:10px 14px}.chapter-page th{color:var(--text-primary);background:var(--bg-tertiary);font-weight:600}.chapter-page td{color:var(--text-secondary)}.chapter-page code{background:var(--bg-tertiary);border-radius:4px;padding:2px 6px;font-size:.85em}.chapter-page pre{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;margin:16px 0;padding:16px 20px;overflow-x:auto}.chapter-page pre code{background:0 0;padding:0;font-size:.8rem;line-height:1.6}.chapter-page .metric-highlight{background:var(--accent-glow);color:var(--accent);font-family:var(--font-mono);border-radius:4px;padding:2px 8px;font-size:.85em;font-weight:500;display:inline-block}.coming-soon{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:60vh;padding:80px 40px;display:flex}.coming-soon .icon{margin-bottom:20px;font-size:3rem}.coming-soon h2{margin-bottom:12px;font-size:1.8rem;font-weight:700}.coming-soon p{color:var(--text-secondary);max-width:480px;line-height:1.7}.comp-table{border-collapse:collapse;width:100%;margin:24px 0;font-size:.85rem}.comp-table th,.comp-table td{border:1px solid var(--border);text-align:left;padding:12px 16px}.comp-table th{background:var(--bg-tertiary);color:var(--text-primary);font-weight:600}.comp-table td:first-child{color:var(--text-primary);white-space:nowrap;font-weight:500}.comp-table td{color:var(--text-secondary)}.comp-table .winner{color:var(--green);font-weight:500}.comp-table .loser{color:var(--red)}.chapter-nav{border-top:1px solid var(--border);justify-content:space-between;margin-top:60px;padding-top:24px;display:flex}.chapter-nav a{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:4px;padding:12px 16px;transition:all .15s;display:flex}.chapter-nav a:hover{border-color:var(--accent);background:var(--bg-hover)}.chapter-nav .nav-label{color:var(--text-tertiary);font-size:.75rem}.chapter-nav .nav-title{color:var(--text-primary);font-size:.9rem;font-weight:500}.chapter-nav a:only-child{margin-left:auto}.site-footer{text-align:center;color:var(--text-tertiary);border-top:1px solid var(--border);padding:24px 32px;font-size:.8rem}@keyframes diagram-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes diagram-pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes diagram-flow{0%{stroke-dashoffset:20px}to{stroke-dashoffset:0}}.diagram-container{animation:.5s ease-out diagram-fade-in}.diagram-flow-line{stroke-dasharray:4 4;animation:.8s linear infinite diagram-flow}.diagram-pulse{animation:2s ease-in-out infinite diagram-pulse}@media (width<=768px){.sidebar{display:none}.app-layout.has-sidebar{padding-left:0}.main-content{padding:24px 16px}.hero h1{font-size:2rem}.comparison-grid,.curriculum-grid{grid-template-columns:1fr}.stats-row{gap:24px}}
