:root{--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, monospace;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-subtle: #f8fafc;--color-surface: #ffffff;--color-surface-subtle: #f8fafc;--color-surface-elevated: #ffffff;--color-text: #0f172a;--color-text-secondary: #475569;--color-text-muted: #64748b;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-success: #10b981;--color-success-subtle: #ecfdf5;--color-warning: #f59e0b;--color-danger: #ef4444}body{font-family:var(--font-ui);color:var(--color-text);background-color:#fafafa;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.011em}.hero-dot-pattern{background-color:#0b0f19;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:24px 24px}.transparency-grid{background-color:#f8fafc;background-image:linear-gradient(45deg,#e2e8f0 25%,transparent 25%),linear-gradient(-45deg,#e2e8f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e2e8f0 75%),linear-gradient(-45deg,transparent 75%,#e2e8f0 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}h1,h2,h3,h4{letter-spacing:-.022em}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#f1f5f9}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}input[type=range]{accent-color:#3b82f6}*:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}.comparator-container{touch-action:none;-webkit-user-select:none;user-select:none}