:root{--accent: #3b6ef0;--accent-ink: #ffffff;--accent-2: #6d9bff;--accent-strong: #2f5fe0;--slate: #1b2733;--slate-2: #33414f;--good: #0f9e7c;--warn: #c08a2e;--bad: #c0463f;--bg: #eceef1;--surface: #ffffff;--surface-2: #f4f5f7;--ink: #161d24;--ink-2: #5b626b;--ink-3: #99a1ab;--line: #dce0e5;--radius: 14px;--radius-sm: 9px;--shadow-sm: 0 1px 2px rgba(20, 30, 40, .04), 0 4px 14px rgba(20, 30, 40, .05);--shadow-md: 0 2px 6px rgba(20, 30, 40, .06), 0 18px 50px rgba(20, 30, 40, .11);--shadow-lg: 0 30px 80px rgba(20, 30, 40, .2);--maxw: 1200px;--font-display: "Fraunces Variable", Georgia, "Times New Roman", serif;--font-body: "IBM Plex Sans Variable", -apple-system, system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;--fg: var(--ink);--muted: var(--ink-2);--link: var(--accent);--border: var(--line);color-scheme:light}.dark{--bg: #0f1620;--surface: #18222e;--surface-2: #1f2a37;--ink: #eef1f4;--ink-2: #aab4bf;--ink-3: #74808c;--line: #2a3643;--slate: #131b25;--slate-2: #33414f;--accent-strong: #6d9bff;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--ink-3)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:var(--accent)}.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}@media(max-width:640px){.container{padding:0 16px}}.section{padding:72px 0}@media(max-width:768px){.section{padding:48px 0}}.page{max-width:860px;margin:0 auto;padding:2rem 24px 4rem}@media(max-width:640px){.page{padding:1.5rem 16px 3rem}}h1{font-size:clamp(34px,5.4vw,60px);line-height:1.08;letter-spacing:-.02em;font-weight:500;font-family:var(--font-display)}h2{font-size:clamp(24px,3.4vw,38px);line-height:1.12;letter-spacing:-.015em;font-weight:500;font-family:var(--font-display)}h3{font-size:clamp(18px,2vw,23px);line-height:1.3;letter-spacing:-.01em;font-weight:500;font-family:var(--font-display)}.eyebrow{font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-family:var(--font-mono)}.lead{font-size:clamp(17px,2vw,21px);color:var(--ink-2);line-height:1.5}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:12px 22px;border-radius:var(--radius-sm);background:var(--accent);color:#fff;font-weight:600;font-size:15px;border:none;cursor:pointer;box-shadow:0 4px 18px #3b6ef047;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s;text-decoration:none}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 26px #3b6ef061}.btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:12px 22px;border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink);font-weight:600;font-size:15px;border:1px solid var(--line);cursor:pointer;transition:background .2s,transform .2s;text-decoration:none}.btn-ghost:hover{background:var(--line);transform:translateY(-1px)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink-2);font-size:13px;font-weight:500;border:1px solid var(--line);cursor:pointer;transition:border-color .15s,color .15s,background .15s;user-select:none}.chip:hover{border-color:var(--accent);color:var(--accent)}.chip.active{background:var(--accent);color:#fff;border-color:var(--accent)}.pill-good{display:inline-flex;align-items:center;padding:2px 10px;border-radius:99px;background:#0f9d6b1f;color:var(--good);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}.pill-bad{display:inline-flex;align-items:center;padding:2px 10px;border-radius:99px;background:#dc26261a;color:var(--bad);font-size:12px;font-weight:600}.pill-neutral{display:inline-flex;align-items:center;padding:2px 10px;border-radius:99px;background:var(--surface-2);color:var(--ink-2);font-size:12px;font-weight:500}.tier{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;padding:0 7px;border-radius:7px;color:#fff;font-weight:700;font-size:12px;font-family:var(--font-mono)}.tier-S{background:linear-gradient(135deg,#2f5fe0,#6d9bff)}.tier-A{background:linear-gradient(135deg,#22c55e,#4ade80)}.tier-B{background:linear-gradient(135deg,#f59e0b,#fbbf24)}.tier-C{background:linear-gradient(135deg,#fb923c,#f97316)}.tier-D{background:linear-gradient(135deg,#ef4444,#f87171)}.tier-F{background:linear-gradient(135deg,#6b7280,#9ca3af)}.stars{color:#f59e0b;letter-spacing:-.5px}.stars .empty{color:var(--line)}.navbar{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}.navbar.scrolled{border-bottom-color:var(--line);box-shadow:0 1px 0 var(--line),0 4px 20px #0c0c0d0f}body:has(dialog[open]) .navbar,body:has(dialog[open]) .compare-bar{visibility:hidden}.data-table{width:100%;border-collapse:collapse;font-size:14px}.data-table th{text-align:left;padding:10px 14px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);border-bottom:1px solid var(--line);white-space:nowrap;user-select:none}.data-table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle;font-variant-numeric:tabular-nums}.data-table tr:hover td{background:var(--surface-2)}.data-table tr:last-child td{border-bottom:none}dialog{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);background:var(--surface);color:var(--ink);width:min(680px,92vw);max-height:88vh;padding:0}dialog::backdrop{background:#0b0b0c99;backdrop-filter:blur(8px)}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:99px;background:var(--line);outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 0 3px #3b6ef033;border:2px solid var(--surface)}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--surface)}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:fadeUp .5s cubic-bezier(.2,.8,.2,1) both}.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,.8,.2,1),transform .6s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}.fade-up-2{animation:fadeUp .5s .15s cubic-bezier(.2,.8,.2,1) both}@keyframes float{0%,to{transform:translateY(0) rotate(0)}33%{transform:translateY(-8px) rotate(-2deg)}66%{transform:translateY(-4px) rotate(1deg)}}@keyframes float2{0%,to{transform:translateY(0) rotate(13deg)}50%{transform:translateY(-12px) rotate(11deg)}}@keyframes float3{0%,to{transform:translateY(0) rotate(-13deg)}50%{transform:translateY(-6px) rotate(-15deg)}}.card-float-1{animation:float 6s ease-in-out infinite}.card-float-2{animation:float2 7s ease-in-out infinite}.card-float-3{animation:float3 8s ease-in-out infinite}.card-face{border-radius:18px;position:relative;overflow:hidden;box-shadow:var(--shadow-md);user-select:none}.card-face:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,transparent 50%,rgba(0,0,0,.1) 100%);pointer-events:none;mix-blend-mode:soft-light}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}
