:root { color-scheme: dark; --bg:#161616; --panel:#1b1b1b; --border:#363636; --text:#ececec; --muted:#b0b0b0; --accent:#9CC6E0; --link:#76b5ff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif; }
@media (prefers-color-scheme:light) { :root { color-scheme:light; --bg:#fff; --panel:#f7f7f7; --border:#d9d9d9; --text:#171717; --muted:#555; --accent:#2B6A8F; --link:#2563eb; } }
* { box-sizing:border-box; } body { margin:0; background:var(--bg); color:var(--text); line-height:1.7; font-size:16px; } a { color:var(--link); text-underline-offset:4px; } a:hover { text-decoration:underline; } a:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
header,footer { max-width:1200px; margin:auto; padding:24px 36px; display:flex; align-items:center; gap:24px; flex-wrap:wrap; } header { border-bottom:1px solid var(--border); } nav { display:flex; gap:20px; align-items:center; flex-wrap:wrap; } header nav { margin-left:auto; } header a,footer a { color:var(--text); text-decoration:none; font-size:14px; } .brand { display:flex; align-items:center; gap:10px; font-weight:650; font-size:20px; letter-spacing:-.04em; } .brand svg { flex:none; color:var(--text); } .cta { background:#9CC6E0; color:#0F172A; border:1px solid #0F172A; border-radius:8px; padding:9px 15px; font-weight:600; box-shadow:0 0 0 1px rgba(156,198,224,.2),0 0 14px rgba(156,198,224,.2); transition:box-shadow .18s ease; } .cta:hover,.cta:focus-visible { box-shadow:0 0 0 1px rgba(156,198,224,.35),0 0 18px rgba(156,198,224,.35); text-decoration:none; }
main { max-width:1000px; margin:0 auto; padding:64px 36px 80px; } .eyebrow { color:var(--accent); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; } h1 { font-size:clamp(34px,5vw,56px); letter-spacing:-.055em; line-height:1.1; font-weight:600; margin:14px 0 24px; } .lede { font-size:20px; color:var(--muted); max-width:760px; } h2 { margin:42px 0 12px; font-size:24px; letter-spacing:-.03em; line-height:1.3; } h3 { font-size:18px; } p,li { overflow-wrap:anywhere; } section { scroll-margin-top:24px; } .banner { border:1px solid #b68538; border-radius:10px; padding:16px 20px; background:var(--panel); margin:24px 0; } .banner strong { display:block; } .muted,footer { color:var(--muted); } .cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:30px 0; } .card { padding:24px; background:var(--panel); border:1px solid var(--border); border-radius:14px; } .card h2 { margin:0 0 16px; font-size:20px; } .price { font-size:32px; font-weight:600; letter-spacing:-.04em; } .table-scroll { overflow-x:auto; border:1px solid var(--border); border-radius:10px; margin:24px 0; } table { border-collapse:collapse; width:100%; font-size:14px; } th,td { text-align:left; vertical-align:top; padding:14px; border-bottom:1px solid var(--border); min-width:125px; } th { background:var(--panel); } code { background:var(--panel); padding:3px 6px; border-radius:4px; } footer { border-top:1px solid var(--border); font-size:13px; padding-bottom:40px; } footer nav { gap:16px; } .skip { position:absolute; left:16px; top:-100px; } .skip:focus { top:8px; background:var(--bg); }
@media(max-width:640px) { header,footer { padding:20px; gap:16px; } header nav { margin-left:0; gap:14px; } main { padding:36px 20px 56px; } .lede { font-size:18px; } .cards { grid-template-columns:1fr; } h2 { font-size:22px; } }
.docs-topics { border-block:1px solid var(--border); padding:18px 0; margin:32px 0; font-size:14px; } main section[id] { scroll-margin-top:24px; } li + li { margin-top:8px; }