:root{--color-bg: #fafafa;--color-bg-alt: #f0f0f0;--color-surface: #ffffff;--color-border: #e0e0e0;--color-border-subtle: #ececec;--color-text: #1a1a1a;--color-text-secondary: #555;--color-text-muted: #888;--color-accent: #2563eb;--color-accent-light: #dbeafe;--color-accent-dark: #1d4ed8;--color-accent-subtle: #eff6ff;--color-success: #16a34a;--color-success-bg: #f0fdf4;--color-warn: #d97706;--color-error: #ef4444;--color-error-bg: #fef2f2;--heatmap-cold: #f0f4ff;--heatmap-warm: #3b82f6;--heatmap-hot: #1e3a5f;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;--font-mono: "JetBrains Mono", "SF Mono", "Fira Code", monospace;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--space-3xl: 4rem;--space-4xl: 6rem;--container-max: 1120px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--nav-height: 56px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .03);--shadow-md: 0 2px 4px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .06);--shadow-lg: 0 4px 8px rgba(0, 0, 0, .04), 0 8px 24px rgba(0, 0, 0, .08);--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.45, 0, .55, 1);--duration-fast: .12s;--duration-normal: .2s;--duration-slow: .35s;color-scheme:light}@media(prefers-color-scheme:dark){:root{--color-bg: #0f0f10;--color-bg-alt: #1a1a1c;--color-surface: #18181b;--color-border: #2e2e32;--color-border-subtle: #232326;--color-text: #ededef;--color-text-secondary: #a1a1a6;--color-text-muted: #6e6e76;--color-accent: #60a5fa;--color-accent-light: #1e3a5f;--color-accent-dark: #93bbfd;--color-accent-subtle: #172554;--color-success: #4ade80;--color-success-bg: #052e16;--color-warn: #fbbf24;--color-error: #f87171;--color-error-bg: #450a0a;--heatmap-cold: #1a1d2e;--heatmap-warm: #3b82f6;--heatmap-hot: #93c5fd;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .2), 0 1px 1px rgba(0, 0, 0, .15);--shadow-md: 0 2px 4px rgba(0, 0, 0, .2), 0 4px 12px rgba(0, 0, 0, .25);--shadow-lg: 0 4px 8px rgba(0, 0, 0, .2), 0 8px 24px rgba(0, 0, 0, .3);color-scheme:dark}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-height) + var(--space-md));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}body{font-family:var(--font-sans);font-size:16px;line-height:1.6;color:var(--color-text);background:var(--color-bg)}.skip-link{position:fixed;top:-100%;left:var(--space-md);z-index:200;padding:var(--space-sm) var(--space-md);background:var(--color-accent);color:#fff;font-size:.875rem;font-weight:500;border-radius:var(--radius-sm);text-decoration:none;opacity:0;transition:opacity var(--duration-fast),top var(--duration-fast)}.skip-link:focus{top:var(--space-md);opacity:1}h1,h2,h3{font-family:var(--font-serif);font-weight:700;line-height:1.25;letter-spacing:-.01em}h1{font-size:3rem}h2{font-size:1.75rem;margin-bottom:var(--space-lg)}h3{font-size:1.15rem;margin-bottom:var(--space-sm)}p{margin-bottom:var(--space-md)}code{font-family:var(--font-mono);font-size:.875em;background:var(--color-bg-alt);padding:.15em .4em;border-radius:var(--radius-sm)}em{font-style:italic}strong{font-weight:600}a{color:var(--color-accent);text-decoration:none;transition:color var(--duration-fast)}a:hover{color:var(--color-accent-dark)}a:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:2px}ol,ul{margin-bottom:var(--space-md);padding-left:var(--space-xl)}li{margin-bottom:var(--space-xs)}sub,sup{font-size:.7em}.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-xl)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:start}.nav{position:sticky;top:0;z-index:100;background:#fafafae0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border);transition:box-shadow var(--duration-normal)}@media(prefers-color-scheme:dark){.nav{background:#0f0f10e0}}.nav.scrolled{box-shadow:var(--shadow-sm)}.nav-inner{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-xl);height:var(--nav-height);display:flex;align-items:center;justify-content:space-between}.nav-logo{display:flex;align-items:center;gap:var(--space-sm);font-weight:600;font-size:1.05rem;color:var(--color-text);transition:opacity var(--duration-fast)}.nav-logo:hover{opacity:.8;color:var(--color-text)}.nav-logo-symbol{font-family:var(--font-serif);font-size:1.4rem;font-weight:700;color:var(--color-accent);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--color-accent-subtle);border-radius:var(--radius-sm)}.nav-links{display:flex;gap:var(--space-lg);font-size:.875rem;font-weight:500}.nav-links a{color:var(--color-text-secondary);position:relative;padding:var(--space-xs) 0;transition:color var(--duration-fast)}.nav-links a:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:2px;background:var(--color-accent);transform:scaleX(0);transform-origin:center;transition:transform var(--duration-normal) var(--ease-out)}.nav-links a:hover,.nav-links a.active{color:var(--color-accent)}.nav-links a.active:after{transform:scaleX(1)}.nav-toggle{display:none;background:none;border:none;padding:var(--space-sm);cursor:pointer;color:var(--color-text);line-height:0}.nav-toggle svg{width:22px;height:22px}@media(max-width:768px){.nav-toggle{display:block}.nav-links{position:fixed;inset:var(--nav-height) 0 0 0;flex-direction:column;background:var(--color-bg);padding:var(--space-xl);gap:var(--space-md);font-size:1rem;transform:translate(100%);transition:transform var(--duration-slow) var(--ease-out);z-index:99}.nav-links.open{transform:translate(0)}.nav-links a:after{display:none}}.hero{padding:var(--space-4xl) 0 var(--space-3xl);text-align:center;border-bottom:1px solid var(--color-border);background:radial-gradient(ellipse 80% 50% at 50% -20%,var(--color-accent-subtle) 0%,transparent 70%)}.hero-badge{display:inline-block;font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:var(--color-accent);background:var(--color-accent-light);padding:.35em .9em;border-radius:100px;margin-bottom:var(--space-lg);letter-spacing:.02em;border:1px solid var(--color-accent);border-color:#2563eb26}@media(prefers-color-scheme:dark){.hero-badge{border-color:#60a5fa33}}.hero-title{font-size:3.5rem;letter-spacing:-.02em;margin-bottom:var(--space-md);background:linear-gradient(135deg,var(--color-text) 0%,var(--color-text-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:1.15rem;color:var(--color-text-secondary);max-width:640px;margin:0 auto var(--space-lg);line-height:1.7}.hero-meta{font-size:.875rem;color:var(--color-text-muted)}.hero-status{display:inline-flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-lg);font-family:var(--font-mono);font-size:.8rem;color:var(--color-text-muted);padding:var(--space-xs) var(--space-md);background:var(--color-surface);border:1px solid var(--color-border-subtle);border-radius:100px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--color-success);flex-shrink:0}.status-dot.loading{background:var(--color-warn);animation:pulse 1.2s ease-in-out infinite}.status-dot.error{background:var(--color-error)}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}.section{padding:var(--space-4xl) 0}.section-alt{background:var(--color-surface);border-top:1px solid var(--color-border-subtle);border-bottom:1px solid var(--color-border-subtle)}.section-label{font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:var(--color-accent);margin-bottom:var(--space-sm);letter-spacing:.05em}.section-intro{font-size:1.05rem;color:var(--color-text-secondary);max-width:700px;margin-bottom:var(--space-2xl)}.section .container{opacity:0;transform:translateY(16px);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}.section .container.visible{opacity:1;transform:translateY(0)}.equation{font-family:var(--font-serif);font-size:1.15rem;font-style:italic;text-align:center;padding:var(--space-md) var(--space-lg);margin:var(--space-md) 0;background:var(--color-bg);border-left:3px solid var(--color-accent);border-radius:var(--radius-sm)}.section-alt .equation{background:var(--color-bg-alt)}.insight{padding:var(--space-md) var(--space-lg);background:var(--color-accent-subtle);border-radius:var(--radius-md);border-left:3px solid var(--color-accent);font-size:.95rem}.callout{padding:var(--space-lg);background:var(--color-bg-alt);border-radius:var(--radius-md);border:1px solid var(--color-border);margin-top:var(--space-2xl);font-size:.95rem;line-height:1.7}.section-alt .callout{background:var(--color-bg)}.diagram{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);text-align:center}.diagram-title{font-family:var(--font-mono);font-size:.8rem;font-weight:500;color:var(--color-text-muted);margin-bottom:var(--space-md);text-transform:uppercase;letter-spacing:.08em}.diagram-caption{font-size:.8rem;color:var(--color-text-muted);margin-top:var(--space-md);line-height:1.5}canvas{display:block;margin:0 auto;max-width:100%}.algo-steps{display:flex;flex-direction:column;gap:var(--space-lg)}.algo-step{display:flex;gap:var(--space-lg);padding:var(--space-lg);background:var(--color-bg);border-radius:var(--radius-md);border:1px solid var(--color-border-subtle);transition:border-color var(--duration-fast),box-shadow var(--duration-fast)}.algo-step:hover{border-color:var(--color-border);box-shadow:var(--shadow-sm)}.algo-step-num{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--color-accent);color:#fff;font-family:var(--font-mono);font-weight:600;font-size:.85rem;border-radius:50%}.algo-step-content{flex:1;min-width:0}.algo-step-content p{font-size:.95rem;color:var(--color-text-secondary)}.algo-step-content .equation{font-size:1rem;text-align:left}.demo-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);box-shadow:var(--shadow-sm)}.demo-controls{display:flex;flex-direction:column;gap:var(--space-xl);margin-bottom:var(--space-xl)}.control-group{display:flex;flex-direction:column;gap:var(--space-sm)}.control-group>label{font-weight:600;font-size:.9rem}.control-row{display:flex;gap:var(--space-md);flex-wrap:wrap}.control{display:flex;flex-direction:column;gap:var(--space-xs)}.control-label{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted)}.control-hint{font-size:.85rem;color:var(--color-text-muted);margin-bottom:var(--space-xs)}select{font-family:var(--font-mono);font-size:.85rem;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text);cursor:pointer;transition:border-color var(--duration-fast)}select:hover{border-color:var(--color-text-muted)}select:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.btn{font-family:var(--font-sans);font-size:.85rem;font-weight:500;padding:.55em 1.2em;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;transition:background var(--duration-fast),border-color var(--duration-fast),box-shadow var(--duration-fast);user-select:none}.btn:hover{background:var(--color-bg-alt);border-color:var(--color-text-muted)}.btn:active{transform:scale(.98)}.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-primary:hover{background:var(--color-accent-dark);border-color:var(--color-accent-dark)}.btn-primary:active{transform:scale(.98)}.slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;background:var(--color-border);border-radius:3px;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--color-accent);border:2px solid var(--color-surface);box-shadow:var(--shadow-md);border-radius:50%;cursor:pointer;transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast)}.slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:var(--shadow-lg)}.slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--color-accent-light)}.slider::-moz-range-thumb{width:18px;height:18px;background:var(--color-accent);border:2px solid var(--color-surface);box-shadow:var(--shadow-md);border-radius:50%;cursor:pointer}.slider::-moz-range-thumb:hover{transform:scale(1.15)}.slider::-moz-range-track{height:6px;background:var(--color-border);border-radius:3px;border:none}.slider-labels{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:.7rem;color:var(--color-text-muted);margin-top:var(--space-xs)}.demo-results{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-lg)}.result-card{background:var(--color-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--duration-fast),box-shadow var(--duration-fast)}.result-card:hover{border-color:var(--color-border);box-shadow:var(--shadow-sm)}.result-card-wide{grid-column:1 / -1}.result-card-header{font-family:var(--font-mono);font-size:.75rem;font-weight:500;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border-subtle);background:var(--color-surface)}.result-card-body{padding:var(--space-md)}.result-card-footer{font-size:.8rem;color:var(--color-text-muted);padding:var(--space-sm) var(--space-md);border-top:1px solid var(--color-border-subtle);line-height:1.5}.training-panel{display:flex;flex-direction:column;gap:var(--space-xl)}.training-controls{display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap;padding:var(--space-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.training-stats{display:flex;gap:var(--space-lg);margin-left:auto}.stat{display:flex;flex-direction:column;align-items:center;min-width:60px}.stat-label{font-family:var(--font-mono);font-size:.7rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.stat-value{font-family:var(--font-mono);font-size:1.1rem;font-weight:600;color:var(--color-text);font-variant-numeric:tabular-nums}.training-viz{display:flex;flex-direction:column;gap:var(--space-lg)}.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl)}.comparison-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);text-align:center;transition:border-color var(--duration-fast),box-shadow var(--duration-fast)}.comparison-card:hover{box-shadow:var(--shadow-sm)}.comparison-card h3{font-family:var(--font-serif)}.comparison-card .equation{margin:var(--space-md) 0}.comparison-card ul{text-align:left;font-size:.9rem;color:var(--color-text-secondary);list-style:none;padding:0}.comparison-card ul li{padding:var(--space-xs) 0}.comparison-card ul li:before{content:"—";margin-right:var(--space-sm);color:var(--color-text-muted)}.comparison-card-highlight{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent),var(--shadow-md);position:relative}.comparison-card-highlight:before{content:"Recommended";position:absolute;top:-.6em;left:var(--space-lg);font-family:var(--font-mono);font-size:.7rem;font-weight:500;color:var(--color-accent);background:var(--color-surface);padding:0 var(--space-sm);letter-spacing:.04em}.footer{padding:var(--space-2xl) 0;border-top:1px solid var(--color-border);text-align:center;font-size:.85rem;color:var(--color-text-secondary)}.footer-sub{font-size:.8rem;color:var(--color-text-muted);margin-top:var(--space-xs)}.footer a{color:var(--color-accent)}.model-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xs) var(--space-md);font-size:.85rem}.model-info-key{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted)}.model-info-val{font-family:var(--font-mono);font-weight:500;font-variant-numeric:tabular-nums}.toast-container{position:fixed;bottom:var(--space-xl);right:var(--space-xl);z-index:150;display:flex;flex-direction:column;gap:var(--space-sm);pointer-events:none}.toast{pointer-events:auto;font-family:var(--font-sans);font-size:.875rem;padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);color:var(--color-text);max-width:360px;opacity:0;transform:translateY(8px) scale(.97);animation:toast-in var(--duration-normal) var(--ease-out) forwards}.toast.toast-exit{animation:toast-out var(--duration-fast) ease-in forwards}.toast-error{border-color:var(--color-error);background:var(--color-error-bg)}.toast-success{border-color:var(--color-success);background:var(--color-success-bg)}@keyframes toast-in{to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toast-out{to{opacity:0;transform:translateY(8px) scale(.97)}}.canvas-empty-state{display:flex;align-items:center;justify-content:center;min-height:160px;color:var(--color-text-muted);font-size:.85rem;font-family:var(--font-mono);letter-spacing:.02em}.col-text{font-size:.95rem}.hidden{display:none!important}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media(max-width:768px){.two-col,.comparison-grid,.demo-results{grid-template-columns:1fr}h1{font-size:2rem}h2{font-size:1.5rem}.hero-title{font-size:2.5rem}.section{padding:var(--space-3xl) 0}.hero{padding:var(--space-3xl) 0 var(--space-2xl)}.container{padding:0 var(--space-md)}.training-controls{flex-direction:column;align-items:stretch}.training-stats{margin-left:0;justify-content:center}.algo-step{flex-direction:column;gap:var(--space-md)}.toast-container{right:var(--space-md);left:var(--space-md);bottom:var(--space-md)}.toast{max-width:100%}}@media(max-width:480px){.hero-title{font-size:2rem}.control-row{flex-direction:column}}