:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, Menlo, monospace;--bg-page:#faf9f5;--bg-surface:#fff;--bg-muted:#f4f3ed;--bg-subtle:#efece4;--bg-dark:#121316;--bg-dark-surface:#18191d;--text-primary:#121316;--text-secondary:#4b4f58;--text-muted:#737887;--text-light:#9499a8;--text-on-dark:#f5f5f7;--text-muted-dark:#9e9ea7;--accent-blue:#2563eb;--accent-blue-hover:#1d4ed8;--accent-blue-light:#eff6ff;--accent-blue-border:#bfdbfe;--status-success:#16a34a;--status-success-bg:#f0fdf4;--status-success-border:#bbf7d0;--status-warning:#d97706;--status-warning-bg:#fffbeb;--status-error:#dc2626;--border-subtle:#e6e4dd;--border-light:#edede8;--border-dark:#27282d;--shadow-xs:0 1px 2px #12131608;--shadow-sm:0 1px 3px #1213160d, 0 1px 2px #12131608;--shadow-md:0 4px 16px -2px #1213160d, 0 2px 6px -1px #12131608;--shadow-lg:0 12px 32px -4px #12131612, 0 4px 12px -2px #1213160a;--shadow-panel:0 20px 40px -10px #12131614;--radius-xs:4px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--container-max:1200px;--nav-height:68px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-sans);background-color:var(--bg-page);color:var(--text-primary);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{background-color:var(--bg-page);color:var(--text-primary);margin:0;padding:0;font-size:15px;line-height:1.55}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text-primary);letter-spacing:-.025em;font-weight:700;line-height:1.2}p{color:var(--text-secondary);line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,textarea,select{font-family:inherit;font-size:14px}code,pre{font-family:var(--font-mono)}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 24px}.section-padding{padding:96px 0}@media (width<=768px){.section-padding{padding:64px 0}}.section-header{margin-bottom:48px}.section-label{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--accent-blue);background:var(--accent-blue-light);border:1px solid var(--accent-blue-border);border-radius:var(--radius-sm);align-items:center;gap:6px;margin-bottom:12px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.section-title{color:var(--text-primary);letter-spacing:-.03em;margin-bottom:14px;font-size:36px;font-weight:700}.section-description{color:var(--text-secondary);max-width:640px;font-size:17px;line-height:1.6}.btn-primary{background:var(--text-primary);color:#fff;border-radius:var(--radius-sm);box-shadow:var(--shadow-xs);border:1px solid var(--text-primary);justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:500;transition:all .15s;display:inline-flex}.btn-primary:hover{background:#27272a;border-color:#27272a;transform:translateY(-1px)}.btn-accent{background:var(--accent-blue);color:#fff;border-radius:var(--radius-sm);border:1px solid var(--accent-blue);justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:500;transition:all .15s;display:inline-flex;box-shadow:0 1px 2px #2563eb33}.btn-accent:hover{background:var(--accent-blue-hover);border-color:var(--accent-blue-hover);transform:translateY(-1px)}.btn-secondary{background:var(--bg-surface);color:var(--text-primary);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);box-shadow:var(--shadow-xs);justify-content:center;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:500;transition:all .15s;display:inline-flex}.btn-secondary:hover{background:var(--bg-muted);border-color:#d6d3cb}.btn-subtle{color:var(--text-secondary);border-radius:var(--radius-xs);align-items:center;gap:6px;padding:6px 10px;font-size:14px;font-weight:500;transition:color .15s;display:inline-flex}.btn-subtle:hover{color:var(--text-primary);background:var(--bg-muted)}.card-clean{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-xs);transition:border-color .15s,box-shadow .15s}.card-clean:hover{box-shadow:var(--shadow-sm);border-color:#d6d3cb}.dark-panel{border-radius:var(--radius-md);color:#e2e4e9;font-family:var(--font-mono);box-shadow:var(--shadow-md);background:#141518;border:1px solid #26272d;overflow:hidden}.dark-panel-header{color:#8c91a0;background:#191b1f;border-bottom:1px solid #26272d;justify-content:space-between;align-items:center;padding:10px 16px;font-size:12px;display:flex}.badge-demo{color:#92400e;font-size:12px;font-weight:600;font-family:var(--font-mono);background:#fef3c7;border:1px solid #fde68a;border-radius:999px;align-items:center;gap:6px;padding:3px 8px;display:inline-flex}.badge-live{color:#166534;font-size:12px;font-weight:600;font-family:var(--font-mono);background:#dcfce7;border:1px solid #bbf7d0;border-radius:999px;align-items:center;gap:6px;padding:3px 8px;display:inline-flex}.pulse-dot{background:currentColor;border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite pulse-op}@keyframes pulse-op{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.85)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#d8d6ce;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#bfbcb2}