:root { color-scheme: dark; --ink:#e7edf8; --muted:#9fb0c8; --panel:#13223a; --line:#2b4262; --accent:#61d3b0; --accent-ink:#05251e; --code:#091524; }
* { box-sizing:border-box; } body { margin:0; min-width:320px; background:radial-gradient(circle at 0 0,#18385b 0,transparent 36rem),#09111e; color:var(--ink); font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.shell { width:min(1080px,calc(100% - 32px)); margin:0 auto; padding:72px 0 48px; } .hero { max-width:760px; margin-bottom:30px; } h1 { margin:0 0 16px; font-size:clamp(2.4rem,6vw,4.75rem); letter-spacing:-.055em; line-height:1; } h2 { margin:0; font-size:1.4rem; letter-spacing:-.02em; } .lead { color:var(--muted); font-size:1.08rem; max-width:690px; } .eyebrow { margin:0 0 8px; color:var(--accent); font-size:.73rem; font-weight:800; letter-spacing:.13em; } .card { padding:26px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(145deg,rgba(22,39,65,.96),rgba(13,26,45,.96)); box-shadow:0 24px 70px rgba(0,0,0,.2); } .install-card { margin-bottom:18px; } .card-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; } .pill { padding:4px 9px; border-radius:999px; background:var(--accent); color:var(--accent-ink); font-weight:800; font-size:.8rem; } .grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:18px; } pre { overflow:auto; margin:16px 0 10px; padding:16px; border:1px solid #27415f; border-radius:11px; background:var(--code); color:#d6ffe9; font:500 .88rem/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; white-space:pre-wrap; } code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; } a { color:#8be8ca; text-underline-offset:3px; } dl { margin:20px 0 0; } dl div { display:grid; grid-template-columns:105px 1fr; gap:12px; padding:10px 0; border-top:1px solid rgba(159,176,200,.16); } dt { color:var(--muted); } dd { margin:0; overflow-wrap:anywhere; } ul { margin:14px 0 0; padding-left:20px; } li + li { margin-top:7px; } .note { color:var(--muted); margin-bottom:0; } .text-link { display:inline-block; margin-top:4px; } footer { padding:32px 0 0; color:var(--muted); font-size:.9rem; } @media (max-width:720px) { .shell { padding-top:42px; } .grid { grid-template-columns:1fr; } .card { padding:20px; } dl div { grid-template-columns:1fr; gap:3px; } }
