@font-face{font-family:'IBM Plex Sans Condensed';src:url('/assets/fonts/IBMPlexSansCondensed-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Condensed';src:url('/assets/fonts/IBMPlexSansCondensed-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Condensed';src:url('/assets/fonts/IBMPlexSansCondensed-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans Condensed';src:url('/assets/fonts/IBMPlexSansCondensed-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/assets/fonts/IBMPlexMono-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/assets/fonts/IBMPlexMono-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
/* Vitalsign tokens — generated from tokens.json. Do not edit by hand. */
:root {
  --bg-000: #000000;
  --bg-100: #05080A;
  --bg-200: #0C0F12;
  --bg-300: #141A20;
  --line-100: #1C2228;
  --line-200: #26303A;
  --ink-100: #E8EDF2;
  --ink-200: #A9B4BF;
  --ink-300: #8A96A3;
  --brand: #3FD0FF;
  --brand-ink: #00222E;
  --state-protected: #22E07A;
  --state-protected-ink: #03150A;
  --state-idle: #3A4654;
  --state-idle-line: #5B6B7C;
  --state-idle-ink: #C9D3DD;
  --state-warn: #FFB21E;
  --state-warn-ink: #1E1300;
  --state-fail: #FF3D3D;
  --state-fail-ink: #1A0303;
  --meter-on: #E8EDF2;
  --meter-off: #1C2228;
  --meter-threshold: #3FD0FF;
  --focus: #3FD0FF;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 96px;
  --radius-xs: 1px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-full: 999px;
  --dur-beat: 1100ms;
  --dur-sweep: 2200ms;
  --dur-blink: 1000ms;
  --dur-fast: 120ms;
  --size-pulse-w: 500px;
  --size-pulse-h: 520px;
  --size-key: 72px;
  --size-control: 52px;
  --size-mark-min: 16px;
  --font-sans: "IBM Plex Sans Condensed", "Arial Narrow", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
}
.display-hero { font-family: var(--font-sans); font-size: 72px; line-height: 1; font-weight: 700; letter-spacing: 0; }
.state-xl { font-family: var(--font-sans); font-size: 40px; line-height: 1; font-weight: 700; letter-spacing: 0.06em; }
.title { font-family: var(--font-sans); font-size: 24px; line-height: 28px; font-weight: 700; letter-spacing: 0.02em; }
.wordmark { font-family: var(--font-sans); font-size: 24px; line-height: 1; font-weight: 600; letter-spacing: 0.2em; }
.label { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.12em; }
.body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.sub { font-family: var(--font-sans); font-size: 14px; line-height: 18px; font-weight: 500; }
.readout-xl { font-family: var(--font-mono); font-size: 40px; line-height: 44px; font-weight: 500; }
.readout-md { font-family: var(--font-mono); font-size: 18px; line-height: 24px; font-weight: 500; }
.readout-sm { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 400; }

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg-000);color:var(--ink-100);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-sans);font-size:17px;line-height:1.55;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:var(--brand)}a:hover{color:#9BE6FF}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
img,svg{display:block;max-width:100%}
h1,h2,h3{margin:0;line-height:1.05;letter-spacing:.01em}
p{margin:0;color:var(--ink-200)}
.wrap{max-width:1200px;margin:0 auto;padding-inline:32px;width:100%}
.mono{font-family:var(--font-mono)}
.kicker{font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:.18em;color:var(--brand);text-transform:uppercase}
.lbl{font-weight:600;font-size:13px;letter-spacing:.14em;color:var(--ink-300);text-transform:uppercase}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:var(--brand);color:var(--brand-ink);padding:8px 12px;border-radius:6px;z-index:9}
/* ---------- header / footer ---------- */
.site-header{border-bottom:1px solid var(--line-100)}
.site-header .wrap{min-height:68px;padding-block:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.brand-link img{height:30px;width:auto}
.nav{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.nav a{text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.12em;color:var(--ink-200);padding:8px 0;text-transform:uppercase}
.nav a[aria-current="page"]{color:var(--ink-100);box-shadow:inset 0 -2px 0 var(--brand)}
.nav a.pill{height:40px;display:inline-flex;align-items:center;padding:0 18px;border-radius:999px;background:var(--brand);color:var(--brand-ink);box-shadow:none}
.site-footer{border-top:1px solid var(--line-100);margin-top:96px}
.site-footer .wrap{padding-top:40px;padding-bottom:48px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px}
.site-footer .cols{display:flex;gap:48px;flex-wrap:wrap;font-size:15px}
.site-footer .cols div{display:flex;flex-direction:column;gap:8px}
.site-footer .cols a{color:var(--ink-200);text-decoration:none}.site-footer .cols a:hover{color:var(--ink-100)}
.site-footer small{color:var(--ink-300);font-size:13px}
/* ---------- buttons, cards ---------- */
.btn{height:52px;display:inline-flex;align-items:center;padding:0 24px;border-radius:10px;font-weight:700;font-size:16px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:2px solid var(--brand);background:var(--brand);color:var(--brand-ink);transition:background var(--dur-fast)}
.btn:hover{background:#7FE0FF;border-color:#7FE0FF;color:var(--brand-ink)}
.btn.ghost{background:transparent;color:var(--ink-100);border-color:var(--line-200)}.btn.ghost:hover{background:var(--bg-200)}
.btn-row{display:flex;gap:12px;flex-wrap:wrap}
.card{background:var(--bg-200);border:1px solid var(--line-100);border-radius:10px;padding:24px;display:flex;flex-direction:column;gap:12px}
.card h3{font-size:21px}
.grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.section{padding-top:96px;display:flex;flex-direction:column;gap:24px}
.section h2{font-size:40px}
.lead{font-size:19px}
.hero{padding-top:96px;display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.hero-copy{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:24px}
.hero h1{font-size:clamp(48px,7vw,72px);line-height:1}
.hero-art{flex:0 1 500px;min-width:0}
.tags{display:flex;gap:10px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.tags li{height:36px;display:inline-flex;align-items:center;padding:0 14px;border-radius:999px;border:1px solid var(--line-200);font-weight:600;font-size:14px;letter-spacing:.1em;color:var(--state-idle-ink)}
.works{display:flex;gap:28px;flex-wrap:wrap;border-top:1px solid var(--line-100);border-bottom:1px solid var(--line-100);padding:22px 0;list-style:none;margin:0}
.works li{font-family:var(--font-mono);font-size:14px;color:var(--ink-200)}
.cta{border:1px solid var(--line-200);border-radius:14px;padding:48px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px}
.lockup{height:56px;width:auto;align-self:flex-start}
/* ---------- state chips ---------- */
.chip{height:30px;border-radius:6px;display:inline-flex;align-items:center;gap:8px;padding:0 10px;font-weight:700;font-size:14px;letter-spacing:.08em;align-self:flex-start}
.s-p{background:var(--state-protected);color:var(--state-protected-ink)}
.s-n{background:var(--bg-000);color:var(--state-idle-ink);box-shadow:inset 0 0 0 2px var(--state-idle-line)}
.s-w{background:var(--state-warn);color:var(--state-warn-ink)}
.s-f{background:var(--state-fail);color:var(--state-fail-ink)}
.g{width:14px;height:14px;flex-shrink:0}
/* ---------- Pulse window illustration ---------- */
.pulse{width:100%;max-width:500px;min-height:520px;background:var(--bg-000);border:1px solid var(--line-200);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;font-size:14px}
.pulse-head{height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line-100);font-weight:600;font-size:16px;letter-spacing:.1em}
.pulse-head span:first-child{display:flex;align-items:center;gap:8px;letter-spacing:.22em}
.pulse-head img{width:22px;height:22px}
.pulse-tabs{height:34px;flex-shrink:0;display:flex;gap:22px;padding:0 16px;font-weight:600;font-size:13px;letter-spacing:.12em;color:var(--ink-300);border-bottom:1px solid var(--line-100)}
.pulse-tabs span{display:flex;align-items:center}.pulse-tabs .on{color:var(--ink-100);box-shadow:inset 0 -2px 0 var(--brand)}
.banner{margin:10px 16px 0;height:84px;border-radius:10px;display:flex;align-items:center;gap:16px;padding:0 20px}
.banner b{display:block;font-size:38px;line-height:1;letter-spacing:.06em}
.banner small{font-size:14px;font-weight:500}
.banner .g{width:32px;height:32px}
.trace{margin:10px 16px 0;height:72px;border-radius:10px;background:var(--bg-100);border:1px solid var(--bg-300);overflow:hidden}
.trace svg{width:100%;height:100%}
.meters{margin:12px 16px 0;display:flex;flex-direction:column;gap:12px}
.meter-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px}
.meter-top span:first-child{font-weight:600;letter-spacing:.12em;color:var(--ink-200)}
.meter-top span:last-child{font-family:var(--font-mono);font-size:12px;color:var(--ink-200)}
.meter-row{display:flex;align-items:center;gap:12px;margin-top:5px}
.meter{flex:1;height:16px;display:flex;gap:2px;align-items:flex-end}
.meter i{flex:1;height:62%;border-radius:1px;background:var(--meter-off)}.meter i.on{background:var(--meter-on)}.meter i.th{height:100%;background:var(--meter-threshold)}
.meter-row output{width:78px;text-align:right;font-family:var(--font-mono);font-weight:500;font-size:18px}
.pulse-btns{display:flex;gap:10px;margin:14px 16px 0}
.pulse-btns span{flex:1;height:52px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px;letter-spacing:.12em;background:var(--bg-200);color:var(--state-idle-ink);border:2px solid var(--line-200)}
.pulse-btns .quiet{color:var(--ink-300)}.pulse-btns .inv{background:var(--ink-100);color:var(--bg-000);border-color:var(--ink-100)}
.pulse-foot{margin-top:auto;height:30px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-top:1px solid var(--line-100);font-family:var(--font-mono);font-size:11px;color:var(--ink-300)}
@keyframes sweep{from{stroke-dashoffset:200}to{stroke-dashoffset:0}}
@keyframes blink{0%,55%{opacity:1}56%,100%{opacity:.35}}
@keyframes beat{0%,100%{transform:scale(1)}12%{transform:scale(1.35)}24%{transform:scale(1)}}
.sweep{stroke-dasharray:100 100;animation:sweep var(--dur-sweep) linear infinite}
.blink{animation:blink var(--dur-blink) steps(1,end) infinite}
.beat{animation:beat var(--dur-beat) ease-out infinite;transform-origin:center}
@media (prefers-reduced-motion:reduce){.sweep,.blink,.beat{animation:none}}
/* ---------- pricing ---------- */
.plans{display:flex;flex-wrap:wrap;gap:20px}
.plan{flex:1 1 320px;min-width:0;background:var(--bg-200);border:1px solid var(--line-100);border-radius:14px;padding:32px;display:flex;flex-direction:column;gap:18px}
.plan.featured{border-color:var(--brand)}
.plan .tag{align-self:flex-start;height:26px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;border:1px solid var(--brand);color:var(--brand);font-weight:600;font-size:12px;letter-spacing:.12em}
.plan h2{font-size:28px;letter-spacing:.06em}
.price{display:flex;align-items:baseline;gap:8px}.price b{font-family:var(--font-mono);font-weight:500;font-size:44px}.price span{color:var(--ink-300);font-size:15px}
.ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ticks li{display:flex;gap:10px;font-size:15px;color:var(--state-idle-ink)}
.ticks li::before{content:"";flex-shrink:0;width:16px;height:16px;margin-top:3px;background:no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8 L6.5 11.5 L13 4.5' fill='none' stroke='%233FD0FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.plan .btn{margin-top:auto;align-self:flex-start}
details{border-top:1px solid var(--line-100);padding:18px 0}details:last-child{border-bottom:1px solid var(--line-100)}
summary{cursor:pointer;font-weight:600;font-size:18px}details p{padding-top:10px;font-size:15px}
/* ---------- specs, tables ---------- */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:14px 16px 14px 0;border-top:1px solid var(--line-100);vertical-align:top;font-size:15px}
th{font-weight:600;font-size:13px;letter-spacing:.12em;color:var(--ink-300);text-transform:uppercase;white-space:nowrap}
td{color:var(--state-idle-ink)}
/* ---------- docs ---------- */
.docs{padding-top:48px;display:flex;flex-wrap:wrap;gap:48px}
.docs-nav{flex:1 1 220px;display:flex;flex-direction:column;gap:24px}
.docs-nav div{display:flex;flex-direction:column;gap:6px}
.docs-nav a{text-decoration:none;color:var(--ink-200);font-size:15px;padding:4px 0 4px 12px}
.docs-nav a[aria-current="page"]{color:var(--ink-100);box-shadow:inset 2px 0 0 var(--brand)}
.docs-nav .soon{color:var(--ink-300);font-size:15px;padding:4px 0 4px 12px}
article{flex:999 1 560px;min-width:0;max-width:760px;display:flex;flex-direction:column;gap:24px}
article h1{font-size:48px}article h2{font-size:28px;margin-top:16px}
.crumb{font-family:var(--font-mono);font-size:12px;color:var(--ink-300)}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px;counter-reset:s}
.steps li{display:flex;gap:16px;counter-increment:s}
.steps li::before{content:counter(s);flex-shrink:0;width:32px;height:32px;border-radius:6px;background:var(--bg-200);border:1px solid var(--line-200);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:14px;color:var(--brand)}
.steps b{display:block;font-size:18px;margin-bottom:4px}.steps p{font-size:15px}
.note{border:1px solid var(--state-warn);border-radius:10px;padding:16px 18px;display:flex;gap:12px}
.note svg{flex-shrink:0;width:22px;height:20px}
pre{margin:0;background:var(--bg-100);border:1px solid var(--line-100);border-radius:10px;padding:16px 18px;overflow-x:auto;font-family:var(--font-mono);font-size:14px;line-height:1.6;color:var(--state-idle-ink)}
pre .c{color:var(--ink-300)}
.pager{display:flex;justify-content:space-between;border-top:1px solid var(--line-100);padding-top:20px;flex-wrap:wrap;gap:12px}
.pager a{text-decoration:none}
@media (max-width:640px){.wrap{padding-inline:20px}.hero{padding-top:48px}.pulse{min-height:0}.pulse-foot{padding-block:8px}.section{padding-top:64px}.section h2{font-size:32px}.cta{padding:28px}article h1{font-size:36px}}
