:root{--ink:#000;--muted:#6b6b6b;--line:#ececec;--blue:#0099ff}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,"Satoshi",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}.wrap{max-width:1000px;margin:0 auto;padding:0 24px}
header.nav{position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);z-index:10}
header.nav .wrap{display:flex;justify-content:space-between;align-items:center;height:72px}
.logo{font-weight:800;font-size:1.15rem;color:var(--ink);letter-spacing:-.03em}
nav{display:flex;align-items:center;gap:28px}nav a{color:#222;font-weight:500;font-size:.95rem}nav a:hover{color:#000}
.pill{display:inline-block;background:var(--blue);color:#fff!important;font-weight:600;padding:10px 20px;border-radius:999px;font-size:.95rem;transition:filter .2s}.pill:hover{filter:brightness(1.08)}
.hero{padding:88px 0 40px}.eyebrow{font-size:.9rem;font-weight:600;color:var(--muted)}
h1{font-size:clamp(2.6rem,6.5vw,4.6rem);line-height:1.02;letter-spacing:-.045em;font-weight:800;margin:.25em 0 .35em}
h2{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.04em;font-weight:800;line-height:1.1;margin:0 0 .6em}
h3{font-weight:700;letter-spacing:-.02em;font-size:1.1rem;margin:14px 0 2px;line-height:1.3}
.lead{font-size:1.15rem;color:var(--muted);max-width:640px}
.btn{display:inline-block;padding:11px 22px;border-radius:999px;font-weight:600;background:var(--blue);color:#fff;margin:16px 10px 0 0}
.btn.alt{background:#f3f3f3;color:#000}section{padding:64px 0}
.grid{display:grid;gap:40px 24px;grid-template-columns:repeat(3,1fr)}.grid.two{grid-template-columns:1.2fr 1fr;gap:48px}
@media(max-width:860px){.grid{grid-template-columns:repeat(2,1fr)}.grid.two{grid-template-columns:1fr}}
@media(max-width:560px){.grid{grid-template-columns:1fr}nav a:not(.pill){display:none}.hero{padding-top:56px}}
.card p{color:var(--muted);font-size:.93rem;margin:4px 0}.panel{background:#f7f7f7;border-radius:12px;padding:28px}
.thumb{aspect-ratio:16/10;border-radius:12px;position:relative;overflow:hidden;display:grid;place-items:center;transition:transform .3s}
.card:hover .thumb{transform:scale(1.015)}
.g1{background:radial-gradient(at 20% 20%,#5ab0ff,transparent 55%),radial-gradient(at 80% 30%,#8a5cff,transparent 55%),radial-gradient(at 60% 90%,#ff7ac6,transparent 55%),#3b6cff}
.g2{background:radial-gradient(at 15% 80%,#ff9a3c,transparent 55%),radial-gradient(at 85% 20%,#ff4f81,transparent 55%),radial-gradient(at 50% 50%,#ffd36b,transparent 60%),#ff6a3d}
.g3{background:radial-gradient(at 80% 80%,#00d4ff,transparent 55%),radial-gradient(at 20% 20%,#a855f7,transparent 55%),radial-gradient(at 70% 10%,#f472b6,transparent 50%),#4f46e5}
.thumb:after{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 0 120%,rgba(255,255,255,.12) 0 2px,transparent 2px 22px)}
.mock{position:relative;z-index:1;width:64%;background:rgba(255,255,255,.92);border-radius:8px;padding:10px;box-shadow:0 12px 30px rgba(0,0,0,.18)}
.mock i{display:block;height:7px;border-radius:4px;background:#e5e5e5;margin:6px 0}.mock i:first-child{width:40%;background:#111;height:9px}.mock i:nth-child(2){width:85%}.mock i:nth-child(3){width:65%}
.mock b{display:inline-block;width:34%;height:12px;border-radius:99px;background:var(--blue);margin-top:4px}
.date{font-size:.85rem;color:var(--muted)}.metricline{font-weight:700;color:#000}
.tag{display:inline-block;font-size:.78rem;font-weight:600;background:#f1f1f1;color:#333;padding:4px 11px;border-radius:99px;margin:0 6px 6px 0}
.ph{background:#fff4c2;color:#7a5200;padding:0 4px;border-radius:4px;font-weight:600}
.timeline{padding-left:18px}.timeline li{margin-bottom:10px}.muted{color:var(--muted)}
.toTop{position:fixed;right:20px;bottom:20px;background:#fff;color:#000;border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.08);padding:8px 16px;border-radius:999px;font-size:.85rem;font-weight:600;z-index:20}
footer{padding:40px 0;color:var(--muted);font-size:.9rem}
table{width:100%;border-collapse:collapse}td,th{padding:14px 4px;border-bottom:1px solid var(--line);text-align:left}th{font-size:.85rem;color:var(--muted);font-weight:600}
.lockup{display:flex;align-items:center;gap:14px;margin-bottom:28px;font-weight:800;font-size:1.25rem;letter-spacing:-.03em}
.lockup .x{color:var(--muted);font-weight:400;font-size:1.4rem}.lockup img{height:36px;width:auto;max-width:180px;object-fit:contain}
.lockup .cname{display:none}.lockup img.fail{display:none}.lockup img.fail+.cname{display:inline}
