/* ==========================================================================
   PeptideCOACheck — "analytical readout" design system
   Archivo (display + text, variable wdth/wght) + IBM Plex Mono (data). Both OFL, self-hosted.
   One signal colour (chromatogram orange) on ink + paper. Semantic pass / caution / fail.
   Motion: transform + opacity only; everything is disabled under prefers-reduced-motion.
   ========================================================================== */
@font-face{font-family:"Archivo";src:url(/assets/fonts/archivo-var.woff2) format("woff2");font-weight:400 800;font-stretch:100% 125%;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/plexmono-regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/plexmono-semibold.woff2) format("woff2");font-weight:600;font-display:swap}
/* metric-matched fallbacks keep text the same size before the web fonts arrive (no layout shift) */
@font-face{font-family:"Archivo Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:98.7%;ascent-override:89%;descent-override:21.3%;line-gap-override:0%}
@font-face{font-family:"Plex Mono Fallback";src:local("Courier New"),local("Liberation Mono"),local("Menlo");size-adjust:100%;ascent-override:102.5%;descent-override:27.5%;line-gap-override:0%}

:root{
  --paper:#f3f1ea;--paper-2:#e9e6dc;--panel:#fbfaf6;--field:#fffefa;
  --ink:#141618;--ink-2:#34383d;--muted:#565b58;--rule:#d3cfc2;--rule-2:#a9a596;
  --grid-minor:rgba(20,22,24,.045);--grid-major:rgba(20,22,24,.085);
  --signal:#ff5a1a;--signal-ink:#b03a07;--signal-soft:rgba(255,90,26,.14);
  --pass:#136c3a;--pass-bg:#e3f0e6;--warn:#8a5a00;--warn-bg:#f6ecd2;--fail:#b3261e;--fail-bg:#f7e1dd;--info:#24539e;--info-bg:#e2e9f4;
  --on-ink:#f3f1ea;--sig-on-ink:#ff6a2b;--on-ink-2:#cfcdc4;
  --sans:"Archivo","Archivo Fallback",system-ui,sans-serif;
  --mono:"Plex Mono","Plex Mono Fallback",ui-monospace,monospace;
  --ease:cubic-bezier(.2,.75,.15,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --hdr:64px;
  color-scheme:light;
}
:root[data-theme=dark]{
  --paper:#0f1112;--paper-2:#15181a;--panel:#171a1c;--field:#1b1f21;
  --ink:#eceae3;--ink-2:#c9c7bf;--muted:#9da39f;--rule:#2c3134;--rule-2:#4a5054;
  --grid-minor:rgba(236,234,227,.035);--grid-major:rgba(236,234,227,.07);
  --signal:#ff6a2b;--signal-ink:#ff8d57;--signal-soft:rgba(255,106,43,.18);
  --pass:#5fd08f;--pass-bg:#13261b;--warn:#f0b54a;--warn-bg:#2a2210;--fail:#ff7b6b;--fail-bg:#2d1714;--info:#8db4ff;--info-bg:#152033;
  --on-ink:#0f1112;--sig-on-ink:#a83505;--on-ink-2:#3a3e42;color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){
    --paper:#0f1112;--paper-2:#15181a;--panel:#171a1c;--field:#1b1f21;
    --ink:#eceae3;--ink-2:#c9c7bf;--muted:#9da39f;--rule:#2c3134;--rule-2:#4a5054;
    --grid-minor:rgba(236,234,227,.035);--grid-major:rgba(236,234,227,.07);
    --signal:#ff6a2b;--signal-ink:#ff8d57;--signal-soft:rgba(255,106,43,.18);
    --pass:#5fd08f;--pass-bg:#13261b;--warn:#f0b54a;--warn-bg:#2a2210;--fail:#ff7b6b;--fail-bg:#2d1714;--info:#8db4ff;--info-bg:#152033;
    --on-ink:#0f1112;--sig-on-ink:#a83505;--on-ink-2:#3a3e42;color-scheme:dark;
  }
}

/* ---------------------------------------------------------------- base */
*,*:before,*:after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font-family:var(--sans);font-size:1.02rem;line-height:1.62;color:var(--ink);background-color:var(--paper);
  background-image:linear-gradient(var(--grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--grid-major) 1px,transparent 1px),
    linear-gradient(var(--grid-minor) 1px,transparent 1px),linear-gradient(90deg,var(--grid-minor) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;background-position:-1px -1px;
  font-synthesis-weight:none;text-rendering:optimizeLegibility;overflow-wrap:break-word}
::selection{background:var(--signal);color:#141618}
img,svg{max-width:100%;height:auto}
a{color:var(--signal-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ink);text-decoration-color:var(--signal)}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;border-radius:1px}
h1,h2,h3{font-family:var(--sans);line-height:1.08;letter-spacing:-.015em;margin:2.2rem 0 .8rem;font-weight:750;font-stretch:112%;text-wrap:balance}
h1{font-size:clamp(2.05rem,4.4vw,3.15rem);font-weight:800;margin-top:.6rem;letter-spacing:-.025em}
h2{font-size:clamp(1.45rem,2.6vw,1.95rem)}
h3{font-size:1.14rem;font-stretch:106%;letter-spacing:-.005em}
p{margin:0 0 1rem}
code,.mono{font-family:var(--mono);font-size:.92em}
sub,sup{font-size:.7em;line-height:0}
strong,b{font-weight:680}
.wrap{max-width:1220px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.narrow{max-width:800px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--paper);padding:10px 14px;font-family:var(--mono);font-size:.85rem;text-decoration:none}
.skip:focus{top:10px}
#main:focus{outline:0}
.eyebrow{font-family:var(--mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 .7rem;display:flex;align-items:center;gap:.7em;flex-wrap:wrap}
.eyebrow:before{content:"";width:18px;height:2px;background:var(--signal);flex:none}
.eyebrow-id{color:var(--ink);font-weight:600}
.lede{font-size:clamp(1.08rem,1.6vw,1.22rem);line-height:1.55;color:var(--ink-2);max-width:62ch}
.small{font-size:.86rem;color:var(--muted)}

/* animated underline for content links */
.prose a:not(.btn),.crumbs a,.byline a,.site-footer a,.sources a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat,linear-gradient(var(--signal),var(--signal)) 0 100%/0 2px no-repeat;transition:background-size .35s var(--ease),color .2s}
.prose a:not(.btn):hover,.crumbs a:hover,.byline a:hover,.site-footer a:hover,.sources a:hover{background-size:100% 1px,100% 2px}

/* ---------------------------------------------------------------- header */
.site-header{position:sticky;top:0;z-index:50;height:var(--hdr);pointer-events:none;view-transition-name:site-header}
.hdr-bg{position:absolute;inset:0;background:color-mix(in srgb,var(--paper) 97%,transparent);border-bottom:1px solid var(--ink);transform-origin:50% 0;transition:transform .35s var(--ease),box-shadow .35s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hdr{position:relative;height:var(--hdr);display:flex;align-items:center;gap:18px;transition:transform .35s var(--ease)}
.hdr>*{pointer-events:auto}
.site-header.scrolled .hdr-bg{transform:scaleY(.84);box-shadow:0 1px 0 var(--ink),0 12px 24px -18px rgba(0,0,0,.5)}
.site-header.scrolled .hdr{transform:translateY(-5px)}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-weight:760;font-stretch:118%;font-size:1.04rem;letter-spacing:-.01em;white-space:nowrap;flex:none}
.brand:hover{color:var(--ink)}
.brand-mark{flex:none;transition:transform .5s var(--ease)}
.site-header.scrolled .brand-mark{transform:scale(.86)}
.brand:hover .brand-mark{transform:rotate(60deg)}
.brand b,.brand-foot b{color:var(--signal-ink);font-weight:800}
.g-ink-fill{fill:var(--ink)}.g-paper-stroke{stroke:var(--paper)}.g-sig-fill{fill:var(--signal)}
.site-nav{display:flex;gap:2px;margin-left:auto;align-items:center}
.site-nav a{position:relative;font-family:var(--mono);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);text-decoration:none;padding:8px 9px;white-space:nowrap}
.site-nav a:after{content:"";position:absolute;left:9px;right:9px;bottom:3px;height:2px;background:var(--signal);transform:scaleX(0);transform-origin:0 50%;transition:transform .3s var(--ease)}
.site-nav a:hover{color:var(--ink)}
.site-nav a:hover:after,.site-nav a[aria-current=page]:after{transform:scaleX(1)}
.site-nav a[aria-current=page]{color:var(--ink);font-weight:600}
.site-nav .theme-toggle-nav{display:none}
.hdr-actions{display:flex;align-items:center;gap:8px;flex:none}
.hdr-shop{display:inline-flex;align-items:stretch;height:40px;text-decoration:none;color:var(--on-ink);background:var(--ink);font-weight:650;font-size:.88rem;line-height:1;white-space:nowrap;border:1px solid var(--ink);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.hdr-shop>span{display:flex;align-items:center}
.hdr-shop:hover{color:var(--on-ink);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--signal)}
.hdr-shop:active{transform:none;box-shadow:none}
.hdr-ad{font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;background:var(--signal);color:#141618;padding:0 7px}
.hdr-shop-txt{padding:0 11px 0 10px}
.hdr-verb{margin-right:.28em}
.hdr-code{font-family:var(--mono);font-size:.72rem;font-weight:400;letter-spacing:.04em;text-transform:uppercase;padding:0 10px;border-left:1px dashed color-mix(in srgb,var(--on-ink) 45%,transparent)}
.hdr-code b{color:var(--sig-on-ink);font-weight:600;margin-left:.4em}
.theme-toggle,.nav-toggle{height:40px;min-width:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--ink);border:1px solid var(--ink);font:600 .74rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;padding:0 10px;transition:background .2s,color .2s}
.theme-toggle{padding:0}
.theme-toggle:hover,.nav-toggle:hover{background:var(--ink);color:var(--paper)}
.theme-toggle svg{transition:transform .5s var(--ease)}
.theme-toggle:hover svg{transform:rotate(180deg)}
.nav-toggle{display:none}
.nav-close-nojs,html.js .nav-nojs{display:none!important}
html:not(.js) .theme-toggle{display:none!important}
.nav-bars,.nav-bars:before,.nav-bars:after{display:block;width:16px;height:1.6px;background:currentColor;transition:transform .3s var(--ease),opacity .2s}
.nav-bars{position:relative}
.nav-bars:before,.nav-bars:after{content:"";position:absolute;left:0}
.nav-bars:before{top:-5px}.nav-bars:after{top:5px}
.nav-toggle[aria-expanded=true] .nav-bars{background:transparent}
.nav-toggle[aria-expanded=true] .nav-bars:before{transform:translateY(5px) rotate(45deg)}
.nav-toggle[aria-expanded=true] .nav-bars:after{transform:translateY(-5px) rotate(-45deg)}
@media (min-width:1181px) and (max-width:1380px){.hdr-shop .hdr-code{display:none}}
@media (max-width:1180px){
  .nav-toggle{display:inline-flex}
  .hdr-actions{margin-left:auto}
  .hdr-actions>.theme-toggle{display:none}
  .site-nav{position:absolute;left:0;right:0;top:calc(var(--hdr) - 1px);margin:0;flex-direction:column;align-items:stretch;gap:0;background:var(--paper);border-bottom:1px solid var(--ink);padding:8px clamp(16px,4vw,40px) 18px;counter-reset:nav;
    visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .22s,transform .3s var(--ease),visibility 0s .3s;box-shadow:0 24px 40px -28px rgba(0,0,0,.45)}
  .site-nav.open{visibility:visible;opacity:1;transform:none;transition:opacity .22s,transform .3s var(--ease)}
  .site-nav a{font-family:var(--sans);font-size:1.18rem;font-stretch:112%;font-weight:650;letter-spacing:-.01em;text-transform:none;padding:12px 0 12px 44px;border-bottom:1px solid var(--rule);color:var(--ink)}
  .site-nav a:before{counter-increment:nav;content:counter(nav,decimal-leading-zero);position:absolute;left:0;top:50%;transform:translateY(-50%);font:400 .74rem var(--mono);color:var(--muted)}
  .site-nav a:after{left:44px;right:auto;width:40px;bottom:8px}
  /* No-JS fallback: the "Menu" link targets #site-nav and :target opens the panel */
  html:not(.js) .nav-toggle:not(.nav-nojs){display:none}
  html:not(.js) .site-nav:target{visibility:visible;opacity:1;transform:none;transition:none}
  html:not(.js) .nav-close-nojs{display:block!important;margin-top:14px;font:400 .8rem var(--mono);text-transform:uppercase;letter-spacing:.1em;padding:12px 0!important;border-bottom:0!important}
  .site-nav a.nav-close-nojs:before{content:none}
  .site-nav .theme-toggle-nav{display:flex;justify-content:flex-start;gap:10px;margin-top:14px;width:max-content;padding:0 14px}
}
@media (max-width:680px){.hdr-shop .hdr-code{display:none}}
@media (max-width:560px){.nav-toggle .nav-label{display:none}.nav-toggle{padding:0}}
@media (max-width:460px){.brand{font-size:.9rem;gap:6px;letter-spacing:-.02em}.brand-mark{width:24px;height:24px}.hdr{gap:8px}.hdr-actions{gap:6px}.hdr-shop-txt{padding:0 8px}.hdr-ad{padding:0 5px}}
@media (min-width:381px) and (max-width:540px){.hdr-shop .hdr-verb{display:none}}
@media (max-width:380px){.brand span{display:none}}

/* reading progress */
.read-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;pointer-events:none}
.read-progress span{display:block;height:100%;background:var(--signal);transform:scaleX(0);transform-origin:0 50%}

/* ---------------------------------------------------------------- buttons, chips, pills */
.btn{--mx:0px;--my:0px;display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:46px;padding:.7rem 1.2rem;border:1px solid var(--ink);font:650 .98rem/1.1 var(--sans);font-stretch:108%;text-decoration:none;cursor:pointer;color:var(--ink);background:transparent;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s,color .2s;transform:translate(var(--mx),var(--my))}
.btn .arr{display:inline-block;transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn[href="#checker"]:hover .arr{transform:translateY(3px)}
.btn-primary{background:var(--ink);color:var(--on-ink)}
.btn-primary:hover{color:var(--on-ink);transform:translate(calc(var(--mx) - 2px),calc(var(--my) - 2px));box-shadow:4px 4px 0 var(--signal)}
.btn-ghost:hover{background:var(--ink);color:var(--on-ink)}
.btn:active{transform:translate(var(--mx),var(--my));box-shadow:none}
.btn-lg{min-height:54px;padding:.85rem 1.5rem;font-size:1.05rem}
.prose>.btn{margin:.4rem 0 1.4rem}
.chip{font:600 .72rem/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--ink);background:transparent;color:var(--ink);padding:8px 10px;cursor:pointer;transition:background .2s,color .2s}
.chip:hover{background:var(--ink);color:var(--paper)}
.chip-plain{border-style:dashed}
.pill{display:inline-block;font:600 .7rem/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;padding:4px 6px 3px;border:1.5px solid currentColor;vertical-align:.12em;white-space:nowrap}
.pill-pass{color:var(--pass);background:var(--pass-bg)}
.pill-warn{color:var(--warn);background:var(--warn-bg)}
.pill-fail{color:var(--fail);background:var(--fail-bg)}
.pill-info{color:var(--info);background:var(--info-bg)}

/* spec-panel registration marks (used on panels and boxes) */
.reg{position:relative}
.readout,.tool,.aff-box,.cta-box,.fingerprint,.figure-wrap{--rm:var(--rule-2)}
.readout:before,.tool:before,.aff-box:before,.cta-box:before{content:"";position:absolute;inset:-7px;pointer-events:none;
  background:linear-gradient(var(--rm),var(--rm)) 0 6px/13px 1px,linear-gradient(var(--rm),var(--rm)) 6px 0/1px 13px,
  linear-gradient(var(--rm),var(--rm)) 100% 6px/13px 1px,linear-gradient(var(--rm),var(--rm)) calc(100% - 6px) 0/1px 13px,
  linear-gradient(var(--rm),var(--rm)) 0 calc(100% - 6px)/13px 1px,linear-gradient(var(--rm),var(--rm)) 6px 100%/1px 13px,
  linear-gradient(var(--rm),var(--rm)) 100% calc(100% - 6px)/13px 1px,linear-gradient(var(--rm),var(--rm)) calc(100% - 6px) 100%/1px 13px;background-repeat:no-repeat}

/* ---------------------------------------------------------------- SVG graphics (shared classes) */
.g-grid{stroke:var(--grid-major);stroke-width:1;fill:none}
.g-grid-major{stroke:color-mix(in srgb,var(--ink) 14%,transparent);stroke-width:1;fill:none}
.g-axis{stroke:var(--ink);stroke-width:1.2;fill:none}
.g-tick text,text.g-tick,.g-tick{font-family:var(--mono);font-size:10px;letter-spacing:.04em;fill:var(--muted)}
.g-tick .g-strong,.g-strong{fill:var(--ink);font-weight:600}
.g-head{fill:var(--ink)!important;font-weight:600;letter-spacing:.1em}
.g-trace{fill:none;stroke:var(--signal);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.g-trace.thin{stroke-width:1.4}
.g-area{fill:var(--signal);opacity:.1}
.g-leader{stroke:var(--ink);stroke-width:1;fill:none}
.g-peaklabel text{font-family:var(--mono);font-size:10.5px;fill:var(--muted)}
.g-peaklabel .g-big{font-size:14px;font-weight:600;fill:var(--ink)}
.g-scan{stroke:var(--signal);stroke-width:1;stroke-dasharray:3 3;fill:none}
.g-reg{stroke:var(--rule-2);stroke-width:1;fill:none}
.g-inset-bg{fill:var(--panel);stroke:var(--rule-2);stroke-width:1}
.g-bar{fill:var(--ink)}
.g-stick{stroke:var(--signal);stroke-width:3;fill:none}
.g-comp{fill:var(--ink)}.g-comp-h{fill:var(--rule-2)}.g-comp-n{fill:var(--signal)}.g-comp-o{fill:var(--ink-2);opacity:.6}.g-comp-s,.g-comp-p,.g-comp-cu{fill:var(--warn)}

/* ---------------------------------------------------------------- hero */
.hero{position:relative;padding:clamp(28px,5vw,64px) 0 0;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(28px,5vw,72px);align-items:start}
.hero h1{font-size:clamp(2.7rem,7.2vw,6.1rem);line-height:.9;letter-spacing:-.035em;font-stretch:125%;font-weight:800;text-transform:uppercase;margin:.25rem 0 1.4rem}
.hero h1 span{display:block}
.hero h1 em{font-style:normal;font-weight:420;font-stretch:100%;letter-spacing:-.04em;color:var(--signal-ink)}
.hero .lede{margin-bottom:1.6rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:2rem}
.hero-points{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink);max-width:620px}
.hero-points li{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:.7rem 0;border-bottom:1px solid var(--rule);font-size:.96rem;color:var(--ink-2)}
.hp-k{font:600 .72rem/1.9 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--signal-ink)}
.readout{position:relative;background:var(--panel);border:1px solid var(--ink);margin-top:6px}
.readout-bar{display:flex;flex-wrap:wrap;gap:4px 16px;justify-content:space-between;font:400 .7rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:9px 12px;border-bottom:1px solid var(--ink)}
.readout-bar b{color:var(--ink);font-weight:600}
.ro-live{display:flex;align-items:center;gap:7px}
.ro-live i{width:7px;height:7px;background:var(--signal);border-radius:50%;animation:blink 1.4s steps(2,jump-none) infinite}
.readout-chrom{display:block;width:100%;height:auto}
.readout-low{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);border-top:1px solid var(--rule)}
.readout-ms-wrap{padding:10px 8px 4px 10px;border-right:1px solid var(--rule)}
.readout-ms{display:block;width:100%;height:auto}
.ro-h{font:400 .66rem/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 2px}
.readout-vals{margin:0;display:grid;align-content:stretch}
.readout-vals div{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 12px;border-bottom:1px solid var(--rule)}
.readout-vals div:last-child{border-bottom:0}
.readout-vals dt{font:400 .66rem/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.readout-vals dd{margin:0;font:600 1.02rem/1 var(--mono);font-variant-numeric:tabular-nums}
.readout-plot{position:relative}
.readout-stamp{position:absolute;right:4%;top:50%;display:flex;align-items:center;gap:6px;margin:0;font:600 .78rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pass);border:2px solid currentColor;padding:7px 10px;background:var(--panel);transform:rotate(-5deg)}
.readout-note{margin:0;padding:7px 12px;border-top:1px solid var(--rule);font:400 .66rem/1.4 var(--mono);color:var(--muted);letter-spacing:.02em}
.ticker{margin-top:clamp(36px,5vw,64px);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);background:var(--ink);color:var(--on-ink);overflow:hidden;white-space:nowrap;font:400 .78rem/1 var(--mono);letter-spacing:.05em}
.ticker-track{display:inline-flex;padding:11px 0}
.ticker span{padding:0 22px;border-right:1px solid color-mix(in srgb,var(--paper) 25%,transparent)}
.ticker b{font-weight:600;color:var(--sig-on-ink);margin-right:.6em;text-transform:uppercase}
.ticker i{font-style:normal;opacity:.6;margin-left:.35em}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.readout{max-width:640px}}
@media (max-width:480px){.readout-low{grid-template-columns:1fr}.readout-ms-wrap{border-right:0;border-bottom:1px solid var(--rule)}.readout-stamp{font-size:.66rem;padding:5px 7px}.hero-points li{grid-template-columns:56px 1fr}}

/* ---------------------------------------------------------------- checker: instrument panel */
#checker{padding-top:clamp(40px,6vw,72px);padding-bottom:12px}
.tool{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);background:var(--panel);border:1px solid var(--ink);align-items:start}
.tool-form{padding:clamp(18px,2.6vw,30px)}
.tool-head{margin-bottom:8px}
.panel-id{display:flex;justify-content:space-between;font:400 .68rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 .9rem;padding-bottom:.7rem;border-bottom:1px solid var(--ink)}
.panel-id span:first-child{color:var(--ink);font-weight:600}
.tool-head h2{margin:.2rem 0 .8rem;font-size:clamp(1.5rem,2.4vw,1.9rem)}
.examples{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:400 .74rem var(--mono);color:var(--muted);letter-spacing:.04em}
fieldset{border:0;border-top:1px solid var(--rule);margin:18px 0 0;padding:14px 0 0;min-width:0}
legend{font:600 .76rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);padding:0 10px 0 0;float:left;width:100%;margin-bottom:12px}
legend+*{clear:both}
.legend-sub{font-weight:400;color:var(--muted);text-transform:none;letter-spacing:.02em}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
@media (max-width:560px){.grid2{grid-template-columns:1fr}}
label{display:flex;flex-direction:column;gap:6px;font-size:.9rem;font-weight:600;color:var(--ink)}
label em{font-weight:400;font-style:normal;color:var(--muted);font-size:.82rem}
input,select{width:100%;min-height:44px;font:400 1rem var(--sans);color:var(--ink);background:var(--field);border:1px solid var(--rule-2);border-radius:2px;padding:9px 11px;transition:border-color .2s,box-shadow .2s}
input[inputmode=decimal],input[type=date],#batch{font-family:var(--mono);font-size:.95rem}
input:hover,select:hover{border-color:var(--ink)}
input:focus,input:focus-within,select:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px var(--signal-soft),inset 3px 0 0 var(--signal)}
input:focus-visible,select:focus-visible{outline:2px solid var(--signal);outline-offset:1px}
.inline{display:flex}
.inline input{border-right:0}
.inline select{width:auto;flex:none;font-family:var(--mono)}
.hint{font-weight:400;font-size:.8rem;color:var(--muted)}
.ref{font:400 .78rem/1.4 var(--mono);color:var(--signal-ink);min-height:1.1em}
label.check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;margin-top:14px}
label.check input,.flags input{width:18px;height:18px;min-height:0;flex:none;margin:2px 0 0;accent-color:var(--ink)}
details.optional{border-top:1px solid var(--rule);margin-top:18px;padding-top:12px}
details.optional summary{cursor:pointer;font:600 .76rem/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;list-style:none;display:flex;align-items:center;gap:10px}
details.optional summary::-webkit-details-marker{display:none}
details.optional summary:before{content:"+";display:inline-grid;place-items:center;width:18px;height:18px;border:1px solid var(--ink);font-size:.9rem;transition:transform .3s var(--ease)}
details.optional[open] summary:before{transform:rotate(45deg)}
details.optional .grid2{margin-top:14px}
.flags{display:grid;grid-template-columns:1fr;border-top:1px solid var(--rule)}
.flags label{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;font-size:.9rem;padding:9px 6px;border-bottom:1px solid var(--rule);cursor:pointer;transition:background .15s}
.flags label:hover{background:var(--paper-2)}
.flags label:has(input:checked){background:var(--fail-bg)}
.flags label.sev-fail span:after{content:" serious";font:600 .64rem var(--mono);color:var(--fail);text-transform:uppercase;letter-spacing:.08em;margin-left:.3em}
.btn-run{width:100%;margin-top:22px}
.privacy-note{display:flex;align-items:center;justify-content:center;gap:7px;font:400 .74rem/1.4 var(--mono);color:var(--muted);margin:12px 0 0;text-align:center}

.results{position:sticky;top:calc(var(--hdr) + 12px);max-height:calc(100vh - var(--hdr) - 24px);overflow:auto;border-left:1px solid var(--ink);padding:clamp(18px,2.6vw,30px);background:var(--paper-2);min-height:420px;overscroll-behavior:contain}
.results:focus{outline:0}
@media (max-width:960px){.tool{grid-template-columns:1fr}.results{position:relative;top:0;max-height:none;border-left:0;border-top:1px solid var(--ink);min-height:0}}
.idle{display:flex;flex-direction:column;gap:6px;border:1px solid var(--rule-2);background:var(--panel);padding:10px;margin-bottom:18px}
.idle svg{width:100%;height:auto;display:block}
.idle-line{fill:none;stroke:var(--signal);stroke-width:1.6;stroke-dasharray:6 300;animation:idle 2.6s linear infinite}
.idle span{font:400 .7rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.idle span:after{content:"_";animation:blink 1s steps(2,jump-none) infinite}
.results-empty h2{margin:.2rem 0 .8rem;font-size:1.3rem}
.results-empty .checks li{font-size:.94rem}

/* verdict + gauge */
.verdict{position:relative;display:grid;grid-template-columns:150px 1fr;gap:16px 20px;align-items:center;padding:0 0 18px;border-bottom:1px solid var(--ink);margin-bottom:6px}
.verdict .eyebrow{margin-bottom:.3rem;padding-right:118px}
.verdict h2{margin:0 0 .4rem;font-size:clamp(1.35rem,2.2vw,1.7rem)}
.verdict p{margin:0 0 .7rem;font-size:.95rem;color:var(--ink-2)}
.verdict.pass{--v:var(--pass)}.verdict.warn{--v:var(--warn)}.verdict.fail{--v:var(--fail)}
.verdict h2{color:var(--v)}
.v-gauge svg{display:block;width:150px;height:auto}
.gz{fill:none;stroke-width:9}
.gz-fail{stroke:var(--fail)}.gz-warn{stroke:var(--warn)}.gz-pass{stroke:var(--pass)}
.g-ticks{stroke:var(--ink);stroke-width:1}
.needle{transform-origin:75px 78px;transform:rotate(var(--a));transition:transform .75s cubic-bezier(.3,1.5,.5,1)}
.needle path{stroke:var(--ink);stroke-width:2.2;stroke-linecap:round}
.needle circle{fill:var(--ink)}
.v-stamp{position:absolute;right:0;top:0;font:600 .7rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--v);border:2px solid currentColor;padding:6px 8px;transform:rotate(4deg)}
.counts{display:flex;flex-wrap:wrap;gap:6px}
.counts .pill{font-size:.72rem;padding:5px 7px 4px}
.counts b{font-variant-numeric:tabular-nums}
@media (max-width:520px){.verdict .eyebrow{padding-right:0}.verdict{grid-template-columns:1fr}.v-gauge svg{width:132px}.v-stamp{position:static;justify-self:start;order:-1}}
.rsec h3{font:600 .76rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:22px 0 4px;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.item{display:grid;grid-template-columns:68px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--rule)}
.item .ic{align-self:start;justify-self:start;font:600 .64rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;border:1.5px solid currentColor;padding:5px 5px 4px;min-width:58px;text-align:center;transform:rotate(-2deg)}
.item.pass .ic{color:var(--pass);background:var(--pass-bg)}.item.warn .ic{color:var(--warn);background:var(--warn-bg)}
.item.fail .ic{color:var(--fail);background:var(--fail-bg)}.item.info .ic{color:var(--info);background:var(--info-bg)}
.item strong{display:block;font-size:.95rem;margin-bottom:2px}
.item p{margin:0;font-size:.88rem;color:var(--ink-2)}
.result-actions{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 10px}
.result-actions .btn{min-height:40px;font-size:.88rem;padding:.5rem .9rem}
.results .aff-box{margin-top:18px}
/* analysis sequence (classes set by app.js; skipped for reduced motion) */
.scanline{display:none}
.results.run{overflow:hidden}
.results.run .scanline{display:block;position:absolute;left:0;right:0;top:0;height:2px;background:var(--signal);box-shadow:0 0 0 1px var(--signal-soft),0 0 18px 4px var(--signal-soft);z-index:3;animation:sweep .62s var(--ease-io) both;pointer-events:none}
.results.run>*:not(.scanline):not(.skip-anim){animation:fadeUp .36s var(--ease) both;animation-delay:var(--d,0ms)}
.results.run .item{animation:rowIn .3s var(--ease) both;animation-delay:var(--d,0ms)}
.results.run .item .ic{animation:stampIn .32s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--d,0ms) + 90ms)}
.results.run .v-stamp{animation:stampIn .35s cubic-bezier(.3,1.6,.5,1) both;animation-delay:520ms}
.skip-anim{position:absolute;right:10px;top:10px;z-index:4;font:600 .66rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--ink);color:var(--paper);border:0;padding:6px 8px;cursor:pointer;display:none}
.results.run .skip-anim{display:block}

/* ---------------------------------------------------------------- content pages */
.crumbs{font:400 .74rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-top:22px}
.crumbs a{color:var(--muted)}
.byline{font:400 .76rem/1.5 var(--mono);color:var(--muted);letter-spacing:.02em;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);padding:8px 0;margin:0 0 1.4rem}
.byline a{color:var(--ink-2)}
.prose{padding-bottom:40px}
.pg-article .prose{counter-reset:sec}
.pg-article .prose>h2{counter-increment:sec;position:relative;padding-top:1rem;border-top:1px solid var(--rule)}
.pg-article .prose>h2:before{content:"§" counter(sec,decimal-leading-zero);display:block;font:400 .72rem/1 var(--mono);letter-spacing:.12em;color:var(--signal-ink);margin-bottom:.6rem}
.prose p,.prose li{max-width:70ch}
.prose ul,.prose ol{padding-left:1.3rem}
.prose li{margin:.35rem 0}
.prose ol>li::marker{font-family:var(--mono);font-size:.85em;color:var(--signal-ink)}
.prose ul:not([class])>li::marker{color:var(--signal)}
ul.checks{list-style:none;padding:0;margin:0 0 1.2rem}
ul.checks li{position:relative;padding:.6rem 0 .6rem 1.9rem;border-bottom:1px solid var(--rule);margin:0}
ul.checks li:before{content:"";position:absolute;left:2px;top:.95rem;width:11px;height:6px;border-left:2px solid var(--pass);border-bottom:2px solid var(--pass);transform:rotate(-45deg)}
.flags-list{list-style:none;padding:0}
.flags-list li{position:relative;padding:.55rem 0 .55rem 1.9rem;border-bottom:1px solid var(--rule);margin:0}
.flags-list li:before,.flags-list li:after{content:"";position:absolute;left:3px;top:1.05rem;width:13px;height:2px;background:var(--fail);transform:rotate(45deg)}
.flags-list li:after{transform:rotate(-45deg)}
.toc{border:1px solid var(--ink);background:var(--panel);padding:14px 18px;margin:1.4rem 0}
.toc p{font:600 .74rem var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .4rem}
.toc ol,.toc ul{margin:0}
.callout{border:1px solid var(--rule-2);border-left:4px solid var(--signal);background:var(--panel);padding:14px 18px;margin:1.3rem 0}
.callout p:last-child{margin:0}
.cta-box{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 22px;background:var(--ink);color:var(--on-ink);padding:22px 24px;margin:2rem 0;--rm:var(--ink)}
.cta-box p{margin:0;max-width:46ch}
.cta-box .btn-primary{background:var(--signal);color:#141618;border-color:var(--signal)}
.cta-box .btn-primary:hover{color:#141618;box-shadow:4px 4px 0 var(--on-ink)}
.formula{font-family:var(--mono)}
svg.figure{display:block;width:100%;height:auto;border:1px solid var(--rule-2);background:var(--panel);margin:1rem 0 1.2rem}
.table-scroll{overflow-x:auto;margin:1rem 0 1.4rem;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
table.data{width:100%;border-collapse:collapse;font-size:.92rem}
table.data th,table.data td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--rule);vertical-align:top}
table.data tr:last-child td,table.data tr:last-child th{border-bottom:0}
table.data thead th{font:600 .7rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:var(--paper-2);border-bottom:1px solid var(--ink)}
table.data .num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
table.data tbody tr{transition:background .15s}
table.data tbody tr:hover{background:var(--panel)}
table.kv th{width:36%;font:400 .76rem/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
td.seq{font-family:var(--mono);font-size:.82rem;word-break:break-all}
.guide-list{list-style:none;padding:0;margin:0 0 1.6rem;border-top:1px solid var(--ink);counter-reset:g}
.guide-list li{position:relative;margin:0;padding:14px 0 14px 52px;border-bottom:1px solid var(--rule);counter-increment:g;max-width:none;transition:background .2s}
.guide-list li:before{content:counter(g,decimal-leading-zero);position:absolute;left:6px;top:17px;font:400 .76rem var(--mono);color:var(--muted)}
.guide-list li:hover{background:var(--panel)}
.prose .guide-list a{font-weight:700;font-stretch:110%;font-size:1.08rem;color:var(--ink)}
.guide-list p{margin:.2rem 0 0;font-size:.92rem;color:var(--muted)}
.protocol{list-style:none;padding:0;margin:1rem 0 2rem;border-top:1px solid var(--ink)}
.protocol li{display:grid;grid-template-columns:56px minmax(0,1fr) 92px;gap:18px;padding:20px 0;border-bottom:1px solid var(--rule);margin:0;max-width:none}
.proto-n{font:400 1.6rem/1 var(--mono);color:var(--signal-ink)}
.protocol h3{margin:0 0 .4rem}
.protocol p{margin:0;font-size:.96rem}
.proto-spec{font:600 .9rem/1.35 var(--mono);text-align:right;color:var(--ink);border-left:1px solid var(--rule);padding-left:12px}
@media (max-width:600px){.protocol li{grid-template-columns:40px minmax(0,1fr)}.proto-spec{display:none}.proto-n{font-size:1.2rem}}

/* fingerprint (peptide pages) */
.fingerprint{position:relative;margin:1.6rem 0 2rem;border:1px solid var(--ink);background:var(--panel)}
.fingerprint svg{display:block;width:100%;height:auto}
.fingerprint figcaption{font:400 .72rem/1.5 var(--mono);color:var(--muted);padding:9px 12px;border-top:1px solid var(--rule)}
.fp-id{display:inline-block;color:var(--ink);font-weight:600;margin-right:.8em;letter-spacing:.06em}
.fingerprint .g-tick text{font-size:11px}
.fingerprint .g-stick{stroke-width:4}

/* peptide index */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1px;background:var(--ink);border:1px solid var(--ink);margin:1.5rem 0 2.4rem}
.pcard{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto;gap:4px 10px;padding:14px 14px 12px;background:var(--panel);text-decoration:none;color:var(--ink);transition:background .2s}
.pcard:hover{background:var(--paper);color:var(--ink)}
.pcard:after{content:"";position:absolute;inset:6px;border:1px solid var(--signal);opacity:0;transform:scale(1.04);transition:opacity .25s,transform .35s var(--ease);pointer-events:none}
.pcard:hover:after,.pcard:focus-visible:after{opacity:1;transform:none}
.pname{font-weight:720;font-stretch:112%;font-size:1.02rem;grid-column:1/-1}
.pmw{font:600 1.05rem/1.1 var(--mono);font-variant-numeric:tabular-nums}
.pmw i{font-style:normal;font-weight:400;color:var(--muted);font-size:.8em}
.pform{font:400 .72rem/1.3 var(--mono);color:var(--muted);grid-column:1}
.spark{grid-column:2;grid-row:2/4;align-self:end;fill:var(--ink);width:64px;height:26px;transition:fill .2s}
.pcard:hover .spark{fill:var(--signal)}

/* FAQ */
.faq-wrap{margin-top:2.4rem}
details.faq{border-top:1px solid var(--rule)}
details.faq:last-child{border-bottom:1px solid var(--rule)}
details.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:14px 0;font-weight:650;font-stretch:106%}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after{content:"+";flex:none;font:400 1.2rem/1 var(--mono);color:var(--signal-ink);transition:transform .3s var(--ease)}
details.faq[open] summary:after{transform:rotate(45deg)}
details.faq p{margin:0 0 16px;color:var(--ink-2)}
.sources{margin-top:2.4rem;border-top:1px solid var(--ink);padding-top:.4rem}
.sources h2{font:600 .78rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;margin:1rem 0 .8rem}
.pg-article .prose .sources h2:before{content:none}
.sources ul{padding-left:1.1rem;font-size:.9rem}
.sources li{margin:.3rem 0}

/* ---------------------------------------------------------------- affiliate: source spec card */
.aff-box{position:relative;border:1px solid var(--ink);background:var(--panel);margin:2.2rem 0;padding:0}
.aff-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 14px;border-bottom:1px solid var(--ink);background:var(--ink);color:var(--on-ink)}
.aff-tag{margin:0;font:400 .76rem/1.2 var(--mono);letter-spacing:.03em}
.aff-tag span{background:var(--signal);color:#141618;font-weight:600;padding:3px 6px;margin-right:6px}
.aff-ref{font:400 .66rem var(--mono);letter-spacing:.12em;opacity:.7}
.aff-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0}
.aff-main{padding:18px 20px 6px}
.aff-title{margin:0 0 .6rem;font-size:1.35rem}
.aff-code{font-family:var(--mono);font-weight:600;background:var(--signal-soft);color:var(--ink);padding:1px 6px;border:1px dashed var(--signal-ink)}
.aff-spec{margin:0;border-left:1px solid var(--rule)}
.aff-spec div{padding:10px 16px;border-bottom:1px solid var(--rule)}
.aff-spec div:last-child{border-bottom:0}
.aff-spec dt{font:400 .66rem/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.aff-spec dd{margin:2px 0 0;font-weight:650;font-size:.95rem}
.aff-spec dd.mono{font:600 1.1rem var(--mono);letter-spacing:.08em;color:var(--signal-ink)}
.aff-actions{display:flex;flex-wrap:wrap;gap:10px;padding:14px 20px;border-top:1px solid var(--rule)}
.aff-disclosure{margin:0;padding:10px 20px 14px;font-size:.8rem;color:var(--muted);border-top:1px dashed var(--rule-2)}
.copy-code.copied{background:var(--pass);border-color:var(--pass);color:var(--paper)}
@media (max-width:640px){.aff-body{grid-template-columns:1fr}.aff-spec{border-left:0;border-top:1px solid var(--rule)}.aff-actions .btn{flex:1 1 100%}}

/* ---------------------------------------------------------------- footer */
.site-footer{position:relative;margin-top:56px;background:var(--ink);color:var(--on-ink-2);padding:48px 0 26px;font-size:.92rem;overflow:hidden}
.foot-motif{position:absolute;right:-30px;top:-10px;width:420px;height:auto;fill:none;stroke:color-mix(in srgb,var(--on-ink) 14%,transparent);stroke-width:1.2;pointer-events:none}
.foot-motif circle{fill:var(--signal);stroke:none;opacity:.7}
.site-footer .wrap{position:relative}
.site-footer a{color:var(--on-ink)}
.site-footer a:hover{color:var(--sig-on-ink)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;padding-bottom:22px;border-bottom:1px solid color-mix(in srgb,var(--on-ink) 18%,transparent)}
.foot-grid>div>a{display:block;width:max-content;max-width:100%;margin:.28rem 0}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr}}
.brand-foot{font-weight:800;font-stretch:120%;font-size:1.3rem;color:var(--on-ink);margin-bottom:.6rem}
.site-footer .brand-foot b{color:var(--sig-on-ink)}
.foot-h{font:600 .72rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--sig-on-ink);margin:0 0 .6rem}
.foot-peps{font:400 .78rem/1.9 var(--mono);padding:16px 0;border-bottom:1px solid color-mix(in srgb,var(--on-ink) 18%,transparent);margin:0}
.disclaimer{font-size:.8rem;margin:16px 0 8px;max-width:110ch}
.copy{font:400 .74rem var(--mono);margin:0;opacity:.75}
.to-top{position:fixed;right:16px;bottom:16px;z-index:40;width:44px;height:44px;display:grid;place-items:center;background:var(--ink);color:var(--paper);border:1px solid var(--paper);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .25s,transform .3s var(--ease)}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{color:var(--sig-on-ink)}

/* ---------------------------------------------------------------- motion */
.reveal-pre{opacity:0;transform:translateY(18px)}
.reveal-in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .7s var(--ease);transition-delay:var(--rd,0ms)}
.magnetic{will-change:transform}
@media (prefers-reduced-motion:no-preference){
  .draw{stroke-dasharray:1;animation:draw 1.9s var(--ease-io) .25s both}
  .scan{animation:scan 1.9s var(--ease-io) .25s both}
  .late{animation:fadeIn .5s ease 1.9s both}
  .readout .g-bar{transform-box:fill-box;transform-origin:50% 100%;animation:rise .45s var(--ease) both;animation-delay:calc(var(--i) * 45ms + 1.1s)}
  .readout-stamp{animation:stampIn .4s cubic-bezier(.3,1.6,.5,1) 2.2s both}
  .ticker-track{animation:ticker 80s linear infinite}
  .ticker:hover .ticker-track{animation-play-state:paused}
  .fingerprint .g-stick{animation:fadeIn .5s ease both;animation-delay:calc(var(--i) * 90ms + .2s)}
  .fingerprint .g-bar{transform-box:fill-box;transform-origin:50% 100%;animation:rise .5s var(--ease) both;animation-delay:calc(var(--i) * 50ms + .3s)}
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vtOut .22s ease both}
  ::view-transition-new(root){animation:vtIn .34s var(--ease) both}
}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes scan{0%{transform:translateX(0);opacity:1}92%{opacity:1}100%{transform:translateX(494px);opacity:0}}
@keyframes fadeIn{from{opacity:0}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}}
@keyframes rowIn{from{opacity:0;transform:translateX(-10px)}}
@keyframes rise{from{transform:scaleY(0)}}
@keyframes stampIn{0%{opacity:0;transform:scale(1.8) rotate(-8deg)}100%{opacity:1}}
@keyframes sweep{0%{transform:translateY(0);opacity:1}85%{opacity:1}100%{transform:translateY(560px);opacity:0}}
@keyframes ticker{to{transform:translateX(-50%)}}
@keyframes blink{50%{opacity:0}}
@keyframes idle{to{stroke-dashoffset:-306}}
@keyframes vtOut{to{opacity:0;transform:translateY(-6px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(8px)}}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.001ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal-pre{opacity:1;transform:none}
  .idle-line{stroke-dasharray:none}
}

/* ---------------------------------------------------------------- print */
@media print{
  body{background:#fff;color:#000}
  .site-header,.site-footer,.aff-box,.tool-form,.to-top,.read-progress,.ticker,.skip-anim,.result-actions{display:none!important}
  .tool{display:block;border:0}.tool:before{display:none}
  .results{position:static;max-height:none;border:0;background:#fff}
  .hero,.readout{display:none}
}