@font-face {
  font-family: 'Anybody';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("fonts/anybody-i-x.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Anybody';
  font-style: italic;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("fonts/anybody-i-l.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Anybody';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("fonts/anybody-n-x.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Anybody';
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("fonts/anybody-n-l.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Atkinson Hyperlegible Next';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/atkinsonhyperlegiblenext-i-x.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Atkinson Hyperlegible Next';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/atkinsonhyperlegiblenext-i-l.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Atkinson Hyperlegible Next';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/atkinsonhyperlegiblenext-n-x.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Atkinson Hyperlegible Next';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/atkinsonhyperlegiblenext-n-l.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root{
  --paper:#f1ede3;
  --paper-2:#e8e2d3;
  --paper-3:#ddd5c2;
  --ink:#1d1b20;
  --ink-2:#4b4750;
  --ink-3:#77727a;
  --blue:#3255a4;
  --blue-2:#25407e;
  --orange:#ff6c2f;
  --yellow:#ffe800;
  --display:"Anybody","Arial Narrow",Impact,sans-serif;
  --text:"Atkinson Hyperlegible Next","Atkinson Hyperlegible",system-ui,sans-serif;
  --code:ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;
  --pad:clamp(18px,4.5vw,64px);
  --max:1280px;
  --spring:cubic-bezier(.34,1.56,.64,1);
  --out:cubic-bezier(.16,1,.3,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.11 0 0 0 0 0.1 0 0 0 0 0.12 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--paper) var(--grain);color:var(--ink);font:400 17.5px/1.6 var(--text);-webkit-font-smoothing:antialiased}
img,svg,canvas{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--ink);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;transition:background-size .35s var(--out),color .2s}
a:hover{background-size:100% 100%;color:var(--paper)}
a:hover *{color:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:800;font-stretch:72%;line-height:.92;letter-spacing:-.01em}
code{font-family:var(--code);font-size:.88em;background:var(--paper-2);padding:1px 5px}
::selection{background:var(--yellow);color:var(--ink)}
.skip{position:absolute;left:12px;top:-60px;z-index:400;background:var(--yellow);color:var(--ink);padding:8px 14px;font-weight:700}
.skip:focus{top:12px}
main{display:block}
.eyebrow{margin:0;font-size:15px;font-weight:600;color:var(--blue)}

.btn{--shadow:var(--orange);position:relative;display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--ink);background:var(--ink);color:var(--paper);padding:14px 22px;font-family:var(--display);font-weight:800;font-size:17px;font-stretch:90%;letter-spacing:.005em;cursor:pointer;box-shadow:5px 5px 0 var(--shadow);transition:transform .25s var(--spring),box-shadow .25s var(--spring),background .2s;background-image:none}
.btn span{display:inline-block;transition:font-stretch .35s var(--out),transform .35s var(--spring)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--shadow);color:var(--paper);background-size:auto}
.btn:hover span{font-stretch:118%}
.btn:active{transform:translate(5px,5px);box-shadow:0 0 0 var(--shadow);transition-duration:.08s}
.btn-line{background:transparent;color:var(--ink);--shadow:var(--blue)}
.btn-line:hover{background:var(--paper);color:var(--ink)}
.btn-orange{background:var(--orange);color:var(--ink);--shadow:var(--ink)}
.btn-orange:hover{color:var(--ink)}
.btn-sm{padding:9px 14px;font-size:14.5px;box-shadow:3px 3px 0 var(--shadow)}
.btn-sm:hover{box-shadow:5px 5px 0 var(--shadow)}
.btn:disabled{cursor:default;background:var(--blue);color:var(--paper);--shadow:var(--ink);transform:none}
.btn:disabled span{font-stretch:100%}

.bar{position:sticky;top:0;z-index:100;display:flex;align-items:center;gap:22px;padding:12px var(--pad);background:var(--paper);border-bottom:2px solid var(--ink)}
.brand{display:flex;align-items:center;gap:10px;background:none;font-family:var(--display);font-weight:900;font-stretch:80%;font-size:26px;letter-spacing:-.01em;line-height:1}
.brand:hover{color:var(--ink)}
.brand-mark{width:30px;height:24px}
.brand-mark rect{transform-origin:bottom;transform-box:fill-box;transition:transform .4s var(--spring)}
.brand:hover .brand-mark rect:nth-child(1){transform:scaleY(1.5)}
.brand:hover .brand-mark rect:nth-child(2){transform:scaleY(1.2)}
.brand:hover .brand-mark rect:nth-child(3){transform:scaleY(1.7)}
.brand:hover .brand-mark rect:nth-child(4){transform:scaleY(.75)}
.bar-nav{display:flex;gap:22px;margin-left:auto}
.bar-nav a{font-weight:600;font-size:15.5px;padding:2px 0;background-size:0 2px;background-position:0 100%}
.bar-nav a:hover{color:var(--ink);background-size:100% 2px}
.bar-clock{font-variant-numeric:tabular-nums;font-weight:700;font-size:14px;color:var(--ink-2);padding:4px 9px;border:1.5px solid var(--ink-3)}

.hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,5vw,72px);align-items:center;max-width:var(--max);margin:0 auto;padding:clamp(44px,7vw,96px) var(--pad) clamp(40px,5vw,64px)}
.hero-h{font-size:clamp(3.4rem,7.4vw,7rem);font-stretch:62%;font-weight:900;margin:20px 0 26px;line-height:.86;letter-spacing:-.015em}
.hero-h span{display:block}
.hero-h2{color:var(--blue);text-shadow:.045em .035em 0 var(--orange);animation:register 4.5s ease-in-out infinite}
@keyframes register{0%,100%{text-shadow:.045em .035em 0 var(--orange)}50%{text-shadow:.02em .055em 0 var(--orange)}}
.hero-lead{margin:0;font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.55;max-width:46ch;color:var(--ink-2)}
.hero-act{display:flex;flex-wrap:wrap;gap:18px;margin-top:32px}
.hero-safe{margin:28px 0 0;font-size:15px;color:var(--ink-2);max-width:52ch;padding-left:14px;border-left:3px solid var(--yellow)}

.app{position:relative;width:100%;background:var(--paper);border:2px solid var(--ink);box-shadow:10px 10px 0 var(--blue)}
.app-title{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 14px;background:var(--ink);color:var(--paper);font-family:var(--display);font-weight:700;font-stretch:90%;font-size:15px}
.app-tag{font-family:var(--text);font-weight:600;font-size:12.5px;color:var(--yellow)}
.app-body{display:grid;grid-template-columns:118px minmax(0,1fr);min-height:370px}
.app-tabs{display:flex;flex-direction:column;border-right:2px solid var(--ink);background:var(--paper-2)}
.app-tabs button{position:relative;text-align:left;border:0;border-bottom:1.5px solid var(--paper-3);background:transparent;padding:13px 14px;font-family:var(--display);font-weight:700;font-stretch:88%;font-size:17px;cursor:pointer;transition:background .2s,padding .3s var(--out)}
.app-tabs button:hover{background:var(--paper);padding-left:20px}
.app-tabs button[aria-selected="true"]{background:var(--yellow);padding-left:20px}
.app-tabs button[aria-selected="true"]::after{content:"";position:absolute;right:-2px;top:0;bottom:0;width:2px;background:var(--yellow)}
.app-panel{padding:16px 18px 18px;min-width:0;animation:panel .45s var(--out)}
@keyframes panel{from{opacity:0;transform:translateX(10px)}}
.app-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px;font-family:var(--display);font-weight:800;font-stretch:80%;font-size:22px;line-height:1}
.scan{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.scan li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"b e" "s e";column-gap:12px;padding:9px 2px;border-bottom:1.5px dashed var(--paper-3);transition:background .4s}
.scan b{grid-area:b;font-size:15px}
.scan span{grid-area:s;font-size:13.5px;color:var(--ink-2)}
.imp{grid-area:e;align-self:center;font-style:normal;font-weight:700;font-size:12.5px;padding:2px 8px;border:1.5px solid var(--ink)}
.imp-3{background:var(--orange)}
.imp-2{border-color:var(--blue);color:var(--blue)}
.imp-1{color:var(--ink-2);border-color:var(--ink-3)}
.scan li.is-done{background:linear-gradient(90deg,rgba(50,85,164,.12),transparent)}
.scan li.is-done span{color:var(--blue)}
.scan li.is-done span::after{content:" ✓ done";font-weight:700}
.scan li.is-done{animation:stamp .5s var(--spring)}
@keyframes stamp{40%{transform:scale(1.025)}}
.app-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}
.app-note{margin:8px 0 0;font-size:12.5px;color:var(--ink-3)}
.app-foot .app-note{margin:0}
.app-legend{display:flex;align-items:center;gap:6px;font-family:var(--text);font-size:12.5px;font-weight:600;color:var(--ink-2)}
.app-legend i{width:16px;height:4px;margin-left:8px}
.lg-b{background:var(--orange)}
.lg-a{background:var(--blue)}
.graph{width:100%;height:auto;background:var(--paper-2);border:1.5px solid var(--ink)}
.app-stats{display:grid;grid-template-columns:repeat(3,1fr);border:1.5px solid var(--ink);border-top:0}
.app-stats p{margin:0;padding:8px 10px;display:grid}
.app-stats p + p{border-left:1.5px solid var(--ink)}
.app-stats b{font-family:var(--display);font-stretch:72%;font-size:17px;font-weight:800;white-space:nowrap}
.app-stats span{font-size:12px;color:var(--ink-2)}
.backups{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.backups li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"b btn" "s btn";column-gap:12px;padding:12px 2px;border-bottom:1.5px dashed var(--paper-3)}
.backups b{grid-area:b}
.backups span{grid-area:s;font-size:13.5px;color:var(--ink-2)}
.backups .btn{grid-area:btn;align-self:center}

.strip{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--paper-2);overflow:hidden;position:relative}
.strip-run{display:flex;align-items:flex-end;gap:5px;height:120px;width:max-content;padding:0 5px;animation:roll 60s linear infinite}
.strip:hover .strip-run{animation-play-state:paused}
@keyframes roll{to{transform:translateX(-50%)}}
.strip-run i{position:relative;width:9px;height:100%;flex:none}
.strip-run i::before,.strip-run i::after{content:"";position:absolute;left:0;right:0;bottom:0;mix-blend-mode:multiply}
.strip-run i::before{height:var(--b);background:var(--orange)}
.strip-run i::after{height:var(--a);background:var(--blue);left:2px;right:2px;mix-blend-mode:normal;box-shadow:0 0 0 1px var(--paper-2)}
.strip-key{position:absolute;right:var(--pad);top:10px;margin:0;font-size:12.5px;font-weight:600;background:var(--paper);border:1.5px solid var(--ink);padding:3px 9px}
.k-b,.k-a{display:inline-flex;align-items:center;gap:6px;margin-right:8px}
.k-b::before,.k-a::before{content:"";width:10px;height:10px;background:var(--orange)}
.k-a::before{background:var(--blue)}

.proof{max-width:var(--max);margin:0 auto;padding:clamp(56px,8vw,104px) var(--pad) 0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:center}
.proof-fig{position:relative;margin:0;display:flex;align-items:baseline;gap:.08em;font-family:var(--display);font-weight:900;font-stretch:58%;font-size:clamp(5.5rem,14vw,12rem);line-height:.8}
.proof-fig::before{content:"";position:absolute;right:-6%;top:-18%;width:62%;aspect-ratio:1;border-radius:50%;z-index:-1;background:radial-gradient(circle,var(--yellow) 32%,transparent 34%) 0 0/9px 9px}
.pf-a{color:var(--orange)}
.pf-arrow{font-weight:400;font-stretch:100%;font-size:.45em;color:var(--ink-3)}
.pf-b{color:var(--blue)}
.proof-fig small{font-size:.22em;font-stretch:90%;font-weight:700;color:var(--ink-2);margin-left:.15em}
.proof-txt p{margin:0;font-size:clamp(1.05rem,1.4vw,1.25rem);max-width:48ch;color:var(--ink-2)}
.proof-txt a{font-weight:700}

.how{max-width:var(--max);margin:0 auto;padding:clamp(72px,10vw,136px) var(--pad) 0;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,80px)}
.how-h{position:sticky;top:110px;align-self:start;font-size:clamp(3.4rem,8vw,7.4rem);font-stretch:58%;font-weight:900}
.how-steps article{padding:26px 0 30px;border-top:2px solid var(--ink)}
.how-steps article:last-child{border-bottom:2px solid var(--ink)}
.how-steps h3{font-size:clamp(2rem,3.6vw,3rem);color:var(--blue);transition:font-stretch .5s var(--out),color .3s}
.how-steps article:hover h3{font-stretch:110%;color:var(--orange)}
.how-steps p{margin:12px 0 0;max-width:56ch;color:var(--ink-2)}

.tools,.changes,.specs,.faq{max-width:var(--max);margin:0 auto;padding:clamp(72px,10vw,136px) var(--pad) 0}
.tools h2,.changes h2,.specs h2,.faq h2{font-size:clamp(2.6rem,6vw,5rem);font-stretch:62%;font-weight:900;margin-bottom:28px}
.tool-table{width:100%;border-collapse:collapse;border-top:2px solid var(--ink)}
.tool-table thead th{text-align:left;font-size:13px;font-weight:700;color:var(--ink-3);padding:10px 12px 10px 0;border-bottom:1.5px solid var(--ink)}
.tool-table tbody th{text-align:left;vertical-align:top;padding:18px 16px 18px 0;font-family:var(--display);font-weight:800;font-stretch:80%;font-size:22px;line-height:1.05;white-space:nowrap;width:28%}
.tool-table td{vertical-align:top;padding:18px 16px 18px 0;color:var(--ink-2)}
.tool-table tbody tr{border-bottom:1.5px dashed var(--paper-3);transition:background .25s}
.tool-table tbody tr:hover{background:rgba(255,232,0,.35)}
.ink{display:inline-block;width:12px;height:12px;margin-right:12px;vertical-align:.08em}
.ink-o{background:var(--orange)}
.ink-b{background:var(--blue)}
.ink-y{background:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--ink)}
.where{white-space:nowrap;font-size:14px;font-weight:700;color:var(--ink)!important}
.try{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:28px;padding:18px 20px;border:2px solid var(--ink);background:var(--paper-2)}
.try-h{margin:0;font-family:var(--display);font-weight:800;font-stretch:80%;font-size:20px}
.seg{display:inline-flex;border:2px solid var(--ink)}
.seg button{border:0;background:var(--paper);padding:8px 14px;font-weight:700;font-size:14.5px;cursor:pointer;transition:background .2s,color .2s}
.seg button + button{border-left:2px solid var(--ink)}
.seg button:hover{background:var(--yellow)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.preset-out{margin:0;font-weight:600;color:var(--blue);flex:1 1 280px;animation:panel .4s var(--out)}

.changes{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:start}
.changes > *,.patch > *,.how > *,.hero > *,.proof > *{min-width:0}
.changes-copy > p{margin:0;color:var(--ink-2);max-width:44ch}
.never{list-style:none;margin:28px 0 0;padding:0;border-top:2px solid var(--ink)}
.never li{position:relative;padding:12px 0 12px 34px;border-bottom:1.5px dashed var(--paper-3);font-weight:600}
.never li::before{content:"";position:absolute;left:4px;top:50%;width:16px;height:16px;margin-top:-8px;background:linear-gradient(45deg,transparent 42%,var(--orange) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--orange) 42% 58%,transparent 58%)}
.never li::after{content:"Never";position:absolute;right:0;top:12px;font-size:12.5px;font-weight:700;color:var(--orange)}
.never-note{margin:14px 0 0!important;font-size:15px}
.never-note a{font-weight:700}
.diff{margin:0;border:2px solid var(--ink);background:var(--paper);box-shadow:10px 10px 0 var(--orange)}
.diff figcaption{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:9px 14px;background:var(--ink);color:var(--paper);font-family:var(--code);font-size:13px}
.diff figcaption span{color:var(--yellow);font-family:var(--text);font-weight:600}
.diff pre{margin:0;padding:12px 0;overflow-x:auto;font-family:var(--code);font-size:14px;line-height:1.75}
.diff code{display:block;background:none;padding:0;font-size:inherit}
.diff code span{display:block;padding:0 16px 0 40px;position:relative;white-space:pre}
.diff code span::before{position:absolute;left:16px;font-weight:700}
.ctx{color:var(--ink-3)}
.del{background:rgba(255,108,47,.16);color:#8a2c0b}
.del::before{content:"−";color:var(--orange)}
.add{background:rgba(50,85,164,.14);color:var(--blue-2)}
.add::before{content:"+";color:var(--blue)}

.patch{max-width:var(--max);margin:clamp(72px,10vw,136px) auto 0;padding:0 var(--pad);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:start}
.ticket-card{position:relative;background:var(--blue);color:var(--paper);padding:26px 28px 24px}
.tc-perf{position:relative;height:0;margin:0 -28px 18px;border:0;border-top:2px dashed rgba(241,237,227,.5)}
.tc-perf::before,.tc-perf::after{content:"";position:absolute;top:-13px;width:24px;height:24px;border-radius:50%;background:var(--paper)}
.tc-perf::before{left:-12px}
.tc-perf::after{right:-12px}
.tc-top{display:flex;justify-content:space-between;margin:0 0 14px;font-weight:700;font-size:14px;color:var(--yellow)}
.ticket-card h2{font-size:clamp(2.4rem,4.6vw,3.6rem);font-stretch:66%;font-weight:900}
.tc-count{display:flex;align-items:flex-end;gap:14px;margin:18px 0 24px}
.tc-count b{font-family:var(--display);font-weight:900;font-stretch:60%;font-size:clamp(4.4rem,9vw,7rem);line-height:.8;color:var(--yellow)}
.tc-count span{font-weight:600;max-width:16ch;line-height:1.3}
.tc-fine{margin:0;font-size:14px;color:#dbe2f4}
.tc-fine b{color:#fff;font-variant-numeric:tabular-nums}
.patches{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.patches li{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:18px 0;border-bottom:1.5px dashed var(--paper-3)}
.patches time{font-weight:700;font-size:14px;color:var(--blue);padding-top:3px;font-variant-numeric:tabular-nums}
.patches b{font-family:var(--display);font-weight:800;font-stretch:80%;font-size:22px;line-height:1.05}
.patches p{margin:4px 0 0;color:var(--ink-2);font-size:16px}

.spec-list{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:28px}
.spec-list div{padding:16px 0 18px;border-top:2px solid var(--ink)}
.spec-list dt{font-weight:700;font-size:14px;color:var(--blue)}
.spec-list dd{margin:4px 0 0;font-size:17px}
.faq-list{border-top:2px solid var(--ink);max-width:920px}
.qa{border-bottom:1.5px solid var(--ink)}
.qa summary{list-style:none;cursor:pointer;position:relative;padding:20px 48px 20px 0;font-family:var(--display);font-weight:800;font-stretch:82%;font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.1;transition:color .2s}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--blue)}
.qa summary::before,.qa summary::after{content:"";position:absolute;right:8px;top:50%;width:20px;height:3px;background:var(--ink);transition:transform .35s var(--spring),background .2s}
.qa summary::after{transform:rotate(90deg)}
.qa[open] summary::after{transform:rotate(0)}
.qa[open] summary::before{background:var(--orange)}
.qa p{margin:0 0 22px;color:var(--ink-2);max-width:70ch}

.beta{max-width:var(--max);margin:clamp(72px,10vw,136px) auto 0;padding:clamp(28px,4vw,56px);background:var(--orange);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;border:2px solid var(--ink);position:relative}
.beta::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(29,27,32,.13) 30%,transparent 32%) 0 0/8px 8px;-webkit-mask:linear-gradient(115deg,transparent 45%,#000);mask:linear-gradient(115deg,transparent 45%,#000);pointer-events:none}
.beta-copy{position:relative}
.beta h2{font-size:clamp(2.8rem,6vw,5.4rem);font-stretch:60%;font-weight:900;margin-bottom:18px}
.beta-copy p{margin:0;max-width:44ch;font-size:17.5px}
.beta-form{position:relative;display:grid;gap:14px;background:var(--paper);border:2px solid var(--ink);padding:clamp(20px,3vw,28px);box-shadow:8px 8px 0 var(--ink)}
.beta-form h2{font-size:2rem;font-stretch:70%;margin-bottom:2px}
.beta-form label{display:grid;gap:5px;font-size:14px;font-weight:700}
.beta-form input,.beta-form select,.beta-form textarea{border:2px solid var(--ink);background:#fbf9f4;padding:11px 12px;font-weight:400;border-radius:0;transition:box-shadow .2s var(--out)}
.beta-form input:focus,.beta-form select:focus,.beta-form textarea:focus{outline:0;box-shadow:4px 4px 0 var(--blue)}
.beta-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.beta-form .check{display:block;font-weight:400;font-size:14.5px;line-height:1.5}
.beta-form .check input{margin:0 8px 0 0;vertical-align:-3px;accent-color:var(--blue);width:16px;height:16px}
.beta-form .btn{justify-self:start;margin-top:4px}
.form-note{margin:0;font-size:13px;color:var(--ink-3)}

.is-doc main{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.page-head{padding:clamp(48px,7vw,96px) 0 clamp(28px,4vw,44px);max-width:900px}
.page-head h1{font-size:clamp(3rem,7vw,6rem);font-stretch:60%;font-weight:900;margin:14px 0 18px}
.page-head p{margin:0;color:var(--ink-2);font-size:18.5px;max-width:58ch}
.page-head a{font-weight:700}
.page-date{margin-top:10px!important;font-size:14px!important;color:var(--ink-3)!important}
.page-404 h1{color:var(--blue);text-shadow:.04em .03em 0 var(--orange)}
.doc{display:grid;grid-template-columns:230px minmax(0,760px);gap:clamp(28px,5vw,80px)}
.doc-toc{position:sticky;top:96px;align-self:start}
.doc-toc p{margin:0 0 8px;font-weight:700;font-size:14px;color:var(--ink-3)}
.doc-toc ol{margin:0;padding-left:20px;display:grid;gap:6px;font-size:15px}
.doc-toc li::marker{color:var(--orange);font-weight:700}
.doc-toc a{background-size:0 1.5px}
.doc-toc a:hover{background-size:100% 100%}
.doc-body section{padding:0 0 26px;margin-bottom:26px;border-bottom:1.5px dashed var(--paper-3)}
.doc-body h2{font-size:clamp(1.8rem,2.8vw,2.3rem);font-stretch:72%;margin-bottom:12px}
.doc-body p,.doc-body li{color:var(--ink-2)}
.doc-body p{margin:0 0 .7em}
.doc-body ul{margin:0;padding-left:22px;display:grid;gap:6px}
.doc-body li::marker{color:var(--blue)}
.doc-body a{font-weight:700}
.tbl{width:100%;border-collapse:collapse;font-size:15px;border-top:2px solid var(--ink)}
.tbl th,.tbl td{text-align:left;padding:10px 10px 10px 0;border-bottom:1.5px dashed var(--paper-3);overflow-wrap:anywhere}
.tbl th{font-size:13px;color:var(--ink-3)}
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
.lanes{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.lanes li{display:grid;grid-template-columns:96px 1fr;grid-template-areas:"c b" "c s";column-gap:16px;padding:16px 0;border-bottom:1.5px dashed var(--paper-3);overflow-wrap:anywhere}
.lanes b{grid-area:b;font-size:17px}
.lanes small{grid-area:s;color:var(--ink-3);font-size:14px}
.chip{grid-area:c;align-self:start;justify-self:start;font-weight:700;font-size:13px;padding:3px 8px;border:1.5px solid var(--ink);background:var(--paper)}
.chip-o{background:var(--orange)}
.chip-b{background:var(--blue);color:var(--paper);border-color:var(--blue)}
.chip-y{background:var(--yellow)}
.chip-k{background:var(--ink);color:var(--paper)}
.contact .beta-form{box-shadow:8px 8px 0 var(--blue)}

.foot{margin-top:clamp(72px,10vw,136px);background:var(--ink);color:#cfc9be}
.foot-top{max-width:var(--max);margin:0 auto;padding:56px var(--pad) 32px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}
.foot-logo{margin:0 0 14px;font-family:var(--display);font-weight:900;font-stretch:62%;font-size:clamp(3rem,6vw,4.6rem);line-height:.85;color:var(--paper)}
.foot-logo span{color:var(--orange)}
.foot-brand p:last-child{margin:0;max-width:36ch}
.foot h2{font-family:var(--text);font-stretch:100%;font-size:14px;font-weight:700;color:var(--yellow);margin-bottom:12px}
.foot nav{display:grid;gap:8px;align-content:start}
.foot a{color:var(--paper);justify-self:start;background-size:0 1.5px}
.foot a:hover{color:var(--ink);background-size:100% 100%;background-image:linear-gradient(var(--yellow),var(--yellow))}
.foot button{justify-self:start;border:0;background:none;padding:0;color:var(--yellow);cursor:pointer;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.foot address{font-style:normal;line-height:1.7}
.foot-legal{max-width:var(--max);margin:0 auto;padding:18px var(--pad) 30px;border-top:1px solid #3a373d;font-size:13px;color:#9a948a}

.consent{position:fixed;left:20px;bottom:20px;z-index:300;width:min(390px,calc(100vw - 28px));background:var(--paper);border:2px solid var(--ink);box-shadow:8px 8px 0 var(--blue);padding:18px 18px 16px;font-size:15px;animation:drop .6s var(--spring) both}
@keyframes drop{from{opacity:0;transform:translateY(30px) rotate(-1.5deg)}}
.consent[hidden]{display:none}
.consent p{margin:0 0 12px;color:var(--ink-2)}
.consent .consent-h{font-family:var(--display);font-weight:800;font-stretch:80%;font-size:24px;line-height:1;color:var(--ink)}
.consent a{font-weight:700}
.consent-sw{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-weight:700;cursor:pointer}
.consent-sw input{position:absolute;opacity:0;width:1px;height:1px}
.consent-sw span{position:relative;width:44px;height:24px;border:2px solid var(--ink);background:var(--paper-2);flex:none;transition:background .2s}
.consent-sw span::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;background:var(--ink);transition:transform .35s var(--spring)}
.consent-sw input:checked + span{background:var(--yellow)}
.consent-sw input:checked + span::after{transform:translateX(20px);background:var(--blue)}
.consent-sw input:focus-visible + span{outline:3px solid var(--blue);outline-offset:2px}
.consent-act{display:flex;gap:14px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
.consent-act > button:first-child{border:0;background:none;padding:4px 0;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .how-steps article,.tool-table tbody tr,.never li,.patches li,.spec-list div,.qa,.diff,.ticket-card{animation:rise linear both;animation-timeline:view();animation-range:entry 5% entry 45%}
    @keyframes rise{from{opacity:0;transform:translateY(28px)}}
    .proof-fig .pf-b{animation:grow linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
    @keyframes grow{from{font-stretch:40%;opacity:.2}}
  }
}

@media (max-width:1100px){
  .bar-nav{display:none}
  .bar-clock{margin-left:auto}
  .hero{grid-template-columns:1fr}
  .app{max-width:720px}
  .how{grid-template-columns:1fr}
  .how-h{position:static}
  .changes,.patch{grid-template-columns:1fr}
  .beta{grid-template-columns:1fr;margin-left:var(--pad);margin-right:var(--pad)}
  .foot-top{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .proof-fig::before{right:2%}
  .proof{grid-template-columns:1fr}
  .spec-list{grid-template-columns:1fr 1fr}
  .tool-table thead{display:none}
  .tool-table,.tool-table tbody,.tool-table tr,.tool-table th,.tool-table td{display:block;width:auto}
  .tool-table tbody tr{padding:16px 0}
  .tool-table tbody th,.tool-table td{padding:0 0 6px;white-space:normal}
  .doc{grid-template-columns:1fr}
  .doc-toc{position:static}
  .contact{grid-template-columns:1fr}
}
@media (max-width:600px){
  body{font-size:16.5px}
  .bar{gap:12px;padding-top:10px;padding-bottom:10px}
  .bar-clock{display:none}
  .bar .btn-sm{margin-left:auto}
  .brand{font-size:22px}
  .hero{padding-top:36px}
  .hero-h{font-size:clamp(3.2rem,19vw,4.8rem)}
  .hero-act{gap:14px}
  .app{box-shadow:6px 6px 0 var(--blue)}
  .app-body{grid-template-columns:1fr;min-height:0}
  .app-tabs{flex-direction:row;border-right:0;border-bottom:2px solid var(--ink)}
  .app-tabs button{flex:1;text-align:center;border-bottom:0;padding:10px 6px}
  .app-tabs button + button{border-left:1.5px solid var(--paper-3)}
  .app-tabs button:hover,.app-tabs button[aria-selected="true"]{padding-left:6px}
  .app-tabs button[aria-selected="true"]::after{display:none}
  .app-tag{display:none}
  .app-panel{padding:14px}
  .app-stats b{font-size:15px}
  .strip-run{height:84px}
  .proof-fig::before{right:0;width:56%}
  .strip-key{left:var(--pad);right:auto;top:6px;font-size:11.5px}
  .spec-list{grid-template-columns:1fr}
  .seg{display:flex;width:100%}
  .seg button{flex:1;padding:8px 6px;font-size:13.5px}
  .try{padding:16px}
  .patches li{grid-template-columns:1fr;gap:4px}
  .beta-row{grid-template-columns:1fr}
  .beta{margin-left:12px;margin-right:12px;padding:24px 18px}
  .beta-form{box-shadow:5px 5px 0 var(--ink)}
  .diff{box-shadow:6px 6px 0 var(--orange)}
  .diff pre{font-size:12.5px}
  .foot-top{grid-template-columns:1fr}
  .lanes li{grid-template-columns:1fr;grid-template-areas:"c" "b" "s";row-gap:6px}
  .consent{left:12px;bottom:12px;box-shadow:5px 5px 0 var(--blue)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
