:root{
--bg-canvas:#F7F7F7; --bg-surface:#F8F8F9; --bg-card:transparent;
--border:#E7E7EA; --stroke:rgba(16,17,22,0.153);
--text-primary:#0D0D0D; --text-secondary:#525258; --text-muted:#62626B;
--accent:#4B8DF8; --accent-hover:#70A7FF; --accent-deep:#1E4FC0;
--bg:var(--bg-canvas); --card:var(--bg-card); --card2:var(--bg-surface);
--line:var(--border); --line2:#DEDEE2;
--t1:var(--text-primary); --t2:var(--text-secondary); --t3:var(--text-muted);
--accent-dim:var(--accent-deep); --ok:#34C87A;
--max:1480px; --nav-h:66px; --radius:2px;
}
*{box-sizing:border-box}
html{scroll-padding-top:12px}
body{margin:0;background:var(--bg);color:var(--t1);
font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;
-webkit-font-smoothing:antialiased;overflow-x:clip}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
p{margin:0 0 16px;color:var(--text-secondary)}
.eyebrow{font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary);margin:0 0 14px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* The bar scrolls with the page. Relative, not static: the phone menu is
position:absolute and top:100%, and a static bar is not its containing
block, so the panel opened against the viewport. */
nav{position:relative;z-index:50;background:var(--bg-surface);
border-bottom:1px solid var(--border)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:var(--nav-h);gap:16px}
nav img{height:22px;width:auto;display:block}
.brand{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
gap:8px;min-height:44px;color:inherit;text-decoration:none}
.brand:hover{color:inherit;text-decoration:none}
.brand img{height:20px;width:auto;display:block}
.tagline{margin:0;color:var(--t2);font:500 11px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
letter-spacing:.01em}
@media(min-width:800px){
.brand{flex-direction:row;align-items:center;gap:10px}
.brand img{height:22px}
.tagline{font-size:13px}
}
.hero{padding:88px 0 36px}
.hero-logo{height:46px;width:auto;display:block}
.hero-tagline{margin:36px 0 28px;color:var(--t1);font:600 clamp(18px,2vw,22px)/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
letter-spacing:-.02em}
@media(max-width:799px){
.hero-tagline{margin:56px 0 40px}
}
.hero h1{font-size:clamp(34px,5vw,58px);line-height:1.08;letter-spacing:-.035em;
margin:0 0 28px;font-weight:650;max-width:16em;color:var(--t1)}
.hero .stamp a{color:var(--t2)}
.band{padding:84px 0;border-top:1px solid var(--line)}
#connect .wrap{border:1px solid var(--stroke);background:transparent;
border-radius:var(--radius);padding:32px 28px 28px;margin-inline:auto;
width:100%;max-width:var(--max)}
.outlinebox{max-width:640px;margin:0 auto;border:1px solid var(--stroke);background:transparent;
border-radius:var(--radius);padding:28px 28px 24px}
.signupform{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.signupform label{color:var(--t1);font-weight:600;font-size:15px}
.signuprow{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.signuprow input[type="email"]{flex:1 1 220px;min-width:0;width:100%;min-height:52px;
background:transparent;color:var(--t1);border:1px solid var(--stroke);border-radius:var(--radius);
padding:14px 16px;font:16px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;
-webkit-appearance:none;appearance:none}
.signuprow input[type="email"]::placeholder{color:var(--text-muted)}
.signuprow input[type="email"]:focus{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}
.signuprow .btn{min-height:52px;padding:14px 22px}
.signupstatus{margin:0;color:var(--text-secondary);font-size:15px;line-height:1.45}
.signupnote{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.5}
.consent{display:flex;align-items:flex-start;gap:10px;margin:0;color:var(--text-secondary);
font-weight:400;font-size:16px;line-height:1.45}
.consent input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--accent)}
.downloadready{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:18px}
.downloadready[hidden]{display:none}
.downloadready .btn{min-height:52px;padding:14px 22px;font-size:16px}
.checksum{margin:0;color:var(--text-secondary);font-size:13px;line-height:1.45;overflow-wrap:anywhere;max-width:100%}
.checksum a{color:var(--text-secondary)}
.checksum code{display:block;max-width:100%;border:0;background:none;padding:0;border-radius:0;font:13px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;word-break:break-all;white-space:normal}
.downloadnote{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.5;max-width:62ch}
.signupencourage{margin:0 0 12px;color:var(--text-secondary);font-size:16px;line-height:1.45}
.skipoffer{margin:16px 0 0;font-size:14px;line-height:1.45}
.skipoffer a{color:var(--text-muted);font-weight:400}
.skipoffer a:hover{color:var(--text-secondary)}
.shotgrid{display:grid;grid-template-columns:1fr;gap:16px;margin:0}
.shotgrid figure{margin:0;min-width:0}
.shotgrid img{display:block;width:100%;max-width:100%;height:auto;border:1px solid var(--stroke);
border-radius:var(--radius);background:var(--bg-surface)}
.shotgrid figcaption{margin:8px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.4}
@media(min-width:720px){
.shotgrid{grid-template-columns:1fr 1fr}
}
.shotopen{display:block;width:100%;margin:0;padding:0;border:0;background:transparent;
color:inherit;font:inherit;cursor:zoom-in;text-align:inherit}
.shotopen:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.lightbox{box-sizing:border-box;margin:0;padding:16px;border:0;width:100%;max-width:none;
height:100%;max-height:none;background:transparent;color:var(--t1)}
.lightbox[open]{display:flex;align-items:center;justify-content:center}
.lightbox::backdrop{background:rgba(255,255,255,0.88)}
.lightbox-panel{display:flex;flex-direction:column;align-items:stretch;gap:12px;
width:min(100%,1920px);max-height:100%;min-height:0}
.lightbox-bar{display:flex;justify-content:flex-end}
.lightbox-close,.lightbox-prev,.lightbox-next{min-width:44px;min-height:44px;padding:10px 16px;
border:1px solid var(--stroke);border-radius:var(--radius);background:var(--bg-surface);
color:var(--t1);font:inherit;font-size:16px;line-height:1.2;cursor:pointer}
.lightbox-close:focus-visible,.lightbox-prev:focus-visible,.lightbox-next:focus-visible,
.lightbox-stage:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.lightbox-stage{flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;
touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch}
.lightbox-stage img{display:block;width:auto;height:auto;max-width:100%;max-height:min(78vh,78dvh);
margin:0 auto;object-fit:contain;touch-action:pinch-zoom}
.lightbox-nav{display:flex;justify-content:space-between;gap:12px;width:100%}
.lightbox-caption{margin:0;color:var(--text-secondary);font-size:16px;line-height:1.4;text-align:center}
@media(max-width:640px){
.lightbox{padding:12px}
}
@media(max-width:480px){
.outlinebox{padding:22px 18px 18px}
}
/* Phone widths stack the button under the field. flex-basis is the height in
a column, so the desktop 220px basis must not carry over or the field
becomes a tall block. 16px type keeps iOS from zooming on focus. */
@media(max-width:430px){
.signupbox{padding:16px 16px 14px;width:100%;max-width:100%}
.signuprow{flex-direction:column;align-items:stretch;width:100%;max-width:100%}
.signuprow input[type="email"]{flex:0 1 auto;width:100%;max-width:100%;height:46px;min-height:46px;
padding:0 12px;font-size:16px;line-height:1.25}
.signuprow .btn{width:100%;height:46px;min-height:46px;padding:0 16px;font-size:16px}
.downloadready{width:100%;max-width:100%}
.downloadready .btn{width:100%;height:46px;min-height:46px;padding:0 16px;font-size:16px}
}
.band h2{font-size:clamp(28px,3.2vw,40px);line-height:1.12;letter-spacing:-.03em;
margin:0 0 18px;font-weight:650;max-width:16em}
.band .lead{font-size:18.5px;line-height:1.55;max-width:62ch;color:var(--t2)}
.highlights{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;
gap:12px;width:100%;max-width:100%;margin:32px auto 0;padding:0;list-style:none}
.highlights li{margin:0;flex:1 1 100%;width:100%;max-width:100%;min-width:0;
background:transparent;border:1px solid var(--stroke);border-radius:var(--radius);
padding:22px 22px 20px}
.highlights strong{display:block;color:var(--t1);font-size:16px;font-weight:650;letter-spacing:-.02em;margin:0 0 6px}
.highlights span{display:block;color:var(--t2);font-size:14.5px;line-height:1.45}
article .highlights{margin:32px 0;padding:0}
article .highlights li{margin:0;color:inherit}
@media(min-width:720px){
.highlights li{flex:0 1 calc((100% - 12px) / 2 - 1px);width:calc((100% - 12px) / 2 - 1px);
max-width:calc((100% - 12px) / 2 - 1px)}
}
@media(min-width:1080px){
.highlights li{flex:0 1 calc((100% - 24px) / 3 - 1px);width:calc((100% - 24px) / 3 - 1px);
max-width:calc((100% - 24px) / 3 - 1px)}
}
.actions{display:flex;flex-wrap:wrap;gap:8px 28px;margin:32px 0 0;align-items:center}
.actions a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
.connect-links{display:flex;flex-wrap:wrap;gap:8px 28px;margin:8px 0 0}
.connect-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:17px}
nav .wrap>a:first-child{display:flex;align-items:center;min-height:44px;padding-right:8px}
.navlinks{display:flex;gap:22px;align-items:center}
.navlinks a{color:var(--t2);font-size:14.5px}
.navlinks a:hover{color:var(--t1);text-decoration:none}
.navlinks a.here,.navlinks a[aria-current="page"]{color:var(--t1);font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;
background:var(--accent);color:#0D0D0D;font-weight:600;font-size:15px;
padding:11px 18px;min-height:44px;border-radius:var(--radius);border:0}
.btn:hover{background:var(--accent-hover);text-decoration:none;color:#0D0D0D}
/* The one button in the nav is also a .navlinks a, and that selector outranks
.btn, so the label was rendering in the muted link color on top of the blue
-- worst in the mobile sheet, where the button is full width. */
.navlinks a.navcta,.navlinks a.navcta:hover{color:#0D0D0D;font-weight:600}
.navcta{margin-left:4px;padding:8px 14px;font-size:14px;min-height:40px}
.navtoggle{display:none;width:44px;height:44px;padding:0;border:0;background:none;
color:var(--t1);cursor:pointer;align-items:center;justify-content:center}
.navtoggle span{position:relative}
.navtoggle span,.navtoggle span::before,.navtoggle span::after{display:block;width:20px;
height:1.5px;border-radius:1px;background:currentColor;
transition:transform .18s ease,background-color .18s ease}
.navtoggle span::before,.navtoggle span::after{content:"";position:absolute;left:0}
.navtoggle span::before{top:-6px}
.navtoggle span::after{top:6px}
.navtoggle[aria-expanded="true"] span{background:transparent}
.navtoggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.navtoggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
@media(max-width:1100px){
.navtoggle:not([hidden]){display:flex}
.navlinks{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;
align-items:stretch;gap:0;padding:6px 0 12px;background:var(--bg-surface);
border-bottom:1px solid var(--border);box-shadow:0 12px 28px rgba(0,0,0,.35)}
.navlinks.open{display:flex}
.navlinks a{display:flex;align-items:center;min-height:44px;padding:0 28px;font-size:16px}
.navlinks a.navcta{margin:8px 28px 4px;justify-content:center}
}
header.doc{padding:64px 0 30px;border-bottom:1px solid var(--line)}
header.doc h1{font-size:clamp(30px,4.4vw,46px);line-height:1.08;letter-spacing:-.035em;
margin:0 0 18px;font-weight:700;max-width:22ch}
header.doc .lead{font-size:19px;color:var(--t2);max-width:64ch;margin:0}
.stamp{margin-top:22px;font:600 12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.06em;color:var(--text-secondary)}
/* Line two of the stamp is attribution, not facts, so it sits tight under line
one rather than starting a new block. Labels use --text-secondary so small
type stays at WCAG AA against the canvas. */
.stamp.credit{margin-top:6px}
main{padding:0 0 40px}
/* ---- search ---------------------------------------------------------- */
.searchbar{padding:30px 0 8px}
.searchfield{position:relative;max-width:640px}
.searchfield input{width:100%;background:transparent;color:var(--t1);
border:1px solid var(--stroke);border-radius:var(--radius);padding:15px 17px;min-height:52px;
font:16px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif;
-webkit-appearance:none;appearance:none}
.searchfield input::placeholder{color:var(--text-muted)}
.searchfield input:focus{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}
.searchhint{font-size:13.5px;color:var(--text-secondary);margin:12px 0 0;max-width:70ch}
.searchhint code{font-size:12.5px}
.status{font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;
text-transform:uppercase;color:var(--text-secondary);margin:26px 0 0}
/* Filters, not decoration. They were rounded chips, which read as a toy next to
a page of technical prose: now a plain index line, marked as active by a rule
under the word. */
.chips{display:flex;flex-wrap:wrap;gap:2px 20px;margin:18px 0 0;padding:0;list-style:none}
.chips button{font:600 12.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.06em;background:none;border:0;border-bottom:1px solid transparent;
color:var(--t2);border-radius:0;padding:10px 0;min-height:40px;cursor:pointer}
.chips button:hover{color:var(--t1);border-bottom-color:var(--line2)}
.chips button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.chips button[aria-pressed="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.chips .count{color:var(--text-muted);font-weight:500}
.chips button[aria-pressed="true"] .count{color:var(--accent)}
/* ---- article cards --------------------------------------------------- */
/* A card is read in one order: what kind of entry it is, what it is called,
what it found, then, on a rule at the foot, the conditions it came from and
when it was written. The conditions used to be repeated twice, once as an
accent line above the title and again as a row of rounded tags, which is what
made a list of six entries look like a list of thirty. */
.cards{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;
gap:14px;width:100%;max-width:100%;margin:26px auto 0;padding:0;list-style:none}
.cards li{margin:0;flex:1 1 100%;width:100%;max-width:100%;min-width:0}
@media(min-width:840px){
.cards{gap:18px}
.cards li{flex:0 1 calc((100% - 18px) / 2 - 1px);width:calc((100% - 18px) / 2 - 1px);
max-width:calc((100% - 18px) / 2 - 1px)}
}
.cardlink{display:block;background:transparent;border:1px solid var(--stroke);
border-radius:var(--radius);padding:26px 28px 20px;color:inherit;
transition:border-color .2s ease}
.cardlink:hover{border-color:rgba(75,141,248,.4);text-decoration:none}
.cardlink h2{font-size:22px;line-height:1.25;letter-spacing:-.022em;margin:0 0 10px;
font-weight:700;color:var(--t1)}
.cardlink:hover h2{color:var(--accent-hover)}
.cardlink p.desc{color:var(--t2);font-size:15px;margin:0 0 16px;max-width:72ch}
.snippet{display:none;font:12.5px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;
color:var(--t2);background:transparent;border:1px solid var(--stroke);
border-radius:var(--radius);padding:11px 13px;margin:0 0 16px;overflow-wrap:anywhere}
.snippet mark{background:rgba(75,141,248,.22);color:#0D0D0D;border-radius:2px;padding:0 2px}
.cardfoot{display:flex;flex-wrap:wrap;gap:4px 24px;justify-content:space-between;
align-items:baseline;margin:18px 0 0;padding:14px 0 0;border-top:1px solid var(--line)}
.cardsig{font:600 11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;
text-transform:uppercase;color:var(--t2);margin:0;max-width:60ch}
.tagblock{border-top:1px solid var(--line);margin:36px 0 0;padding:22px 0 0}
.taglabel{font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;
text-transform:uppercase;color:var(--text-muted);margin:0 0 10px}
.taglist{display:flex;flex-wrap:wrap;gap:2px 18px;margin:0;padding:0;list-style:none}
.taglist li{font:600 11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;
text-transform:uppercase;color:var(--text-secondary);margin:0;overflow-wrap:anywhere}
.cardmeta{font:11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;
text-transform:uppercase;color:var(--text-muted);margin:0;white-space:nowrap}
.empty{display:none;border:1px dashed var(--stroke);border-radius:var(--radius);
padding:34px 28px;margin:26px 0 0}
.empty p{margin:0;color:var(--t2)}
.empty p+p{margin-top:10px;color:var(--t3);font-size:14.5px}
/* ---- prose ----------------------------------------------------------- */
article{padding:34px 0 0}
article h2{font-size:26px;line-height:1.22;letter-spacing:-.022em;margin:44px 0 14px;font-weight:700}
article h3{font-size:17.5px;margin:30px 0 8px;font-weight:600;letter-spacing:-.01em}
article h2:first-child{margin-top:0}
article p,article li{max-width:70ch}
article ul,article ol{margin:0 0 16px;padding-left:24px}
article li{margin:0 0 10px;color:var(--text-secondary)}
article li strong,article p strong{color:var(--t1);font-weight:600}
code{font:.875em/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
background:transparent;border:1px solid var(--stroke);border-radius:2px;
padding:1px 5px;color:#0D0D0D;overflow-wrap:anywhere;word-break:break-word}
pre.block{background:transparent;border:1px solid var(--stroke);border-radius:var(--radius);
padding:16px 18px;margin:0 0 18px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;max-width:100%}
pre.block code{background:none;border:0;padding:0;font-size:13.5px;
white-space:pre;overflow-wrap:normal;word-break:normal;color:#0D0D0D}
.callout{border:1px solid var(--stroke);border-left:3px solid var(--accent);
background:transparent;
border-radius:var(--radius);padding:22px 24px;margin:0 0 20px}
.callout p:last-child{margin-bottom:0}
.calloutlabel{font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;
text-transform:uppercase;color:var(--accent);margin:0 0 10px}
/* ---- observed environment ------------------------------------------- */
.env{background:transparent;border:1px solid var(--stroke);border-radius:var(--radius);
padding:8px 24px;margin:0 0 26px}
.env dl{margin:0;display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:0}
.env dt{font:600 11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;
text-transform:uppercase;color:var(--text-secondary);padding:14px 16px 14px 0;
border-top:1px solid var(--line);overflow-wrap:anywhere}
.env dd{margin:0;padding:14px 0;border-top:1px solid var(--line);color:var(--text-secondary);
font:13.5px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;
word-break:break-word;min-width:0}
.env dt:first-of-type,.env dl>dt:first-child+dd{border-top:0}
@media(max-width:640px){
.env dl{grid-template-columns:1fr}
.env dt{padding:16px 0 2px}
.env dd{padding:0 0 16px;border-top:0}
.env dt:first-of-type{border-top:0}
}
/* ---- evidence review ------------------------------------------------- */
/* Deliberately quieter than .callout: an evidence block is not a takeaway,
it is a label on the sentence next to it. Same library, different kind of
entry -- not a different website. */
.evidence{background:transparent;border:1px solid var(--stroke);
border-left:3px solid var(--line2);border-radius:var(--radius);padding:18px 20px;margin:26px 0;
/* The text inside is capped at 70ch like every other paragraph. Without a cap
on the card itself it stretched the full column and sat two-thirds empty. */
max-width:76ch}
.evidence.ev-test{border-left-color:var(--ok)}
.evidence.ev-government{border-left-color:var(--accent)}
/* Plain prose. No card, no border: this reads as part of the entry, because it
is part of the entry. Only the lead-in marks it as a limit rather than a
finding. */
.unverified{margin:26px 0;max-width:70ch}
.unverifiedlead{font:700 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.16em;text-transform:uppercase;color:var(--t2);margin:0 0 8px}
.evidence p:last-child,.unverified p:last-child{margin-bottom:0}
.evlabel{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;margin:0 0 12px}
.evname{font:700 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;
text-transform:uppercase;color:var(--t1)}
.ev-test .evname{color:var(--ok)}
.ev-government .evname{color:var(--accent)}
/* Small gloss sits on the canvas. --t2 clears 7:1 there. --t3 clears 4.5:1. */
.evgloss{font-size:13px;color:var(--t2)}
.typetag{display:block;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 12px}
.verified{font:600 12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;
color:var(--t2);margin:0 0 16px}
.verified strong{color:var(--t1);font-weight:700}
/* A review can declare eighteen products. Joined inline they wrapped mid-chip,
splitting the border across two lines, and the separators disappeared into
the chips. As flex items they wrap between values and never inside one. */
.chipset{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.chipset code{display:block;max-width:100%}
.stampkey{color:var(--t2)}
/* ORCID iD in the byline. The mark is inline SVG: the site loads nothing
third-party, and an iD without its mark is not recognizable as one. */
.orcid{display:inline-flex;align-items:center;gap:5px;color:var(--t2);
text-decoration:none;border-bottom:1px solid transparent}
.orcid:hover,.orcid:focus-visible{color:var(--t1);border-bottom-color:var(--line)}
.orcid svg{width:13px;height:13px;flex:none;vertical-align:-1px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;
overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.factbox{border-top:1px solid var(--line);margin:44px 0 0;padding:26px 0 0}
.factbox h2{font-size:18px;margin:0 0 16px}
.factbox dl{margin:0}
.factbox dt{font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;
text-transform:uppercase;color:var(--text-secondary);margin:20px 0 8px}
.factbox dt:first-of-type{margin-top:0}
.factbox dd{margin:0}
.related{border-top:1px solid var(--line);margin:40px 0 0;padding:26px 0 0}
.related h2{font-size:18px;margin:0 0 16px}
.backlink{display:inline-block;font:600 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
letter-spacing:.06em;color:var(--t2);padding:14px 0}
.disclaimer{border:1px solid var(--stroke);background:transparent;border-radius:var(--radius);
padding:24px 26px;margin:30px 0 0}
.disclaimer p{margin:0;color:var(--t2);font-size:14.5px;max-width:76ch}
.disclaimer p+p{margin-top:10px}
footer{flex-shrink:0;border-top:1px solid var(--border);padding:56px 0 44px;
color:var(--text-secondary);font-size:14.5px;background:var(--bg-surface)}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:36px 24px;align-items:start}
.fbrand{display:flex;flex-direction:column;gap:22px;max-width:38ch}
.fbrand>.brand{margin-bottom:14px}
.fbrand>a{display:inline-flex;align-items:flex-end;min-height:44px;width:fit-content}
.fbrand img{height:26px;width:auto;display:block}
.fbrand p{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.6}
.fdisclaimer{color:var(--text-secondary)}
.fmail{margin-top:4px}
.fcol{display:flex;flex-direction:column}
.flabel{font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;
text-transform:uppercase;color:var(--text-secondary);margin:0 0 8px}
.fcol a{display:block;padding:12px 0;color:var(--text-secondary);font-size:14.5px;line-height:1.35}
.fcol a:hover{color:var(--t1);text-decoration:none}
.fbot{border-top:1px solid var(--border);margin-top:40px;padding-top:22px;display:flex;
justify-content:space-between;align-items:center;gap:6px 24px;flex-wrap:wrap}
.fbot p{margin:0;color:var(--text-secondary);font-size:14px}
.fbot a{color:var(--text-primary)}
.fbot a:hover{color:var(--accent);text-decoration:none}
@media(max-width:820px){
.fgrid{grid-template-columns:1fr 1fr;gap:32px 24px}
.fbrand{grid-column:1/-1;max-width:none}
}
@media(max-width:480px){
.fgrid{grid-template-columns:1fr;gap:26px}
.fbot{flex-direction:column;align-items:flex-start}
}
:root{--edge:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.03) 45%,rgba(255,255,255,.02));--edge2:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.06) 45%,rgba(255,255,255,.03));--fill:linear-gradient(180deg,rgba(16,17,22,0.012),rgba(16,17,22,0.005));--fill2:linear-gradient(180deg,rgba(16,17,22,0.017),rgba(16,17,22,0.007));--ease:cubic-bezier(.2,.7,.2,1);--glow:radial-gradient(50% 40% at 50% 0%,rgba(75,141,248,.05),transparent 62%)}
#navsentinel{position:absolute;top:8px;left:0;width:1px;height:1px;pointer-events:none}
nav{background:transparent;border-bottom-color:transparent;transition:background-color .2s ease,border-color .2s ease}
nav.scrolled{background:rgba(255,255,255,0.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(16,17,22,0.054)}
@media(max-width:1100px){.navlinks{background:rgba(255,255,255,0.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}
body{font-size:17px;line-height:1.65;background:radial-gradient(80% 40% at 50% 0%,rgba(16,17,22,0.017),transparent 52%),radial-gradient(50% 42% at 80% 58%,rgba(75,141,248,.08),transparent 60%),linear-gradient(180deg,#F9F9FA,#F4F4F6 20%,#EFF0F6 48%,#F5F5F7 76%,#F7F7F9)}
.hero,header.doc,footer{position:relative;overflow:visible}
.hero,header.doc{background:transparent}
.hero{padding:40px 0 36px}
header.doc{padding-top:48px}
.hero::before,.tooltop::before{content:"";position:absolute;left:0;right:0;top:0;height:320px;pointer-events:none;background:radial-gradient(60% 50% at 50% 0%,rgba(16,17,22,0.025),transparent 70%)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--glow)}
footer{background:transparent;border-top:1px solid rgba(16,17,22,0.045);padding:36px 0 24px}
.fgrid{gap:16px 28px}
.fbrand{gap:12px}
.fcol a{padding:6px 0}
.fbot{border-top:0;margin-top:14px;padding-top:0;background:none}
main .band:last-child{padding-bottom:8px}
.hero-tagline{margin:14px 0 12px}
@media(max-width:799px){.hero-tagline{margin:14px 0 12px}}
.hero h1{margin:0 0 16px}
.herosplit,.split{display:grid;gap:22px}
@media(min-width:900px){
.herosplit{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:36px;align-items:center}
.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center}
.split>#connect{align-self:stretch}
}
.servicelist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.servicecard{display:block;padding:14px 16px 13px;border-radius:12px;color:inherit}
.servicecard:hover{text-decoration:none}
.svcmark{display:block;width:26px;height:26px;margin:0 0 8px;fill:none;stroke:currentColor;stroke-width:1.5;color:#0D0D0D}
.servicecard h2{margin:0 0 4px;font-size:1.02rem;line-height:1.2;letter-spacing:-.02em;font-weight:650;color:#0D0D0D}
.servicecard p{margin:0;color:var(--t2);font-size:14px;line-height:1.4}
.frame{margin:0;padding:12px;border-radius:12px}
.frame img{display:block;width:100%;height:auto;border-radius:8px}
.frame figcaption{margin:10px 2px 0;color:var(--t2);font-size:13.5px;line-height:1.45}
.split>#connect{min-width:0}
.split>#connect .wrap{max-width:none;margin:0;height:100%}
#connect h2{font-size:clamp(1.45rem,2vw,1.8rem);max-width:none}
.hero .wrap,header.doc .wrap,footer .wrap{position:relative;z-index:1}
.hero h1,.band h2,header.doc h1{color:#0D0D0D}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
.hero h1,header.doc h1{background:linear-gradient(180deg,#fff 35%,rgba(255,255,255,.55));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.band h2{background:linear-gradient(180deg,#fff 20%,rgba(255,255,255,.62));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
}
.hero h1,header.doc h1{line-height:1.28;padding-bottom:.24em}
.hero h1{font-size:clamp(2.15rem,4.2vw,3.25rem);font-weight:650;letter-spacing:-.025em}
.band h2{font-size:clamp(1.6rem,2.4vw,2.15rem);line-height:1.22;letter-spacing:-.02em;padding-bottom:.14em}
.band{padding:56px 0;border-top:0}
.ruleline{display:block;height:1px;margin:0 0 20px;background:linear-gradient(90deg,transparent,rgba(16,17,22,0.042),transparent);transform-origin:left center}
.btn{background:#fff;color:#141416;border-radius:8px;min-height:48px;padding:12px 20px;transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.btn:hover{background:#fff;color:#141416;text-decoration:none;box-shadow:0 0 4px rgba(255,255,255,.06),0 2px 16px rgba(255,255,255,.12),0 4px 32px rgba(255,255,255,.16)}
.cardlink,.highlights li,.outlinebox,.toolcard,.servicecard,.frame,#connect .wrap,.featurelist li{border-radius:12px;border:1px solid rgba(16,17,22,0.063);background:rgba(16,17,22,0.01);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.toolcard{padding:28px 28px 22px}
.glowaccent{background:var(--glow) padding-box,var(--fill) padding-box,var(--edge) border-box}
.downloadready{width:100%;padding:16px;border-radius:8px;border:1px solid transparent;background:linear-gradient(180deg,rgba(16,17,22,0.017),rgba(16,17,22,0.007)) padding-box,var(--edge) border-box}
.checksum{position:relative;overflow:hidden;padding:12px 14px;border-radius:8px;border:1px solid transparent;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.16)) padding-box,var(--edge) border-box}
.checksum::after{content:"";position:absolute;inset:0 auto 0 0;width:38%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(16,17,22,0.098),transparent);transform:translateX(-120%)}
.toolwide{max-width:var(--max);margin:0 auto;padding:0 28px}
@keyframes navin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes risein{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes sheen{to{transform:translateX(280%)}}
html.motion-ok nav{animation:navin .4s var(--ease)}
html.motion-ok :is(.hero-tagline,header.doc .eyebrow){animation:risein .6s var(--ease) both}
html.motion-ok .servicelist li{animation:risein .6s var(--ease) .12s both}
html.motion-ok :is(.hero h1,header.doc h1){animation:risein .6s var(--ease) .07s both}
html.motion-ok :is(.hero .stamp,header.doc .lead){animation:risein .6s var(--ease) .14s both}
html.motion-ok header.doc .stamp{animation:risein .6s var(--ease) .21s both}
.hero-logo,nav img,.brand img{animation:none}
html.motion-ok .rv{opacity:0;transform:translate3d(0,10px,0)}
html.motion-ok .rv.shown{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--rvd,0s)}
html.motion-ok .ruleline{transform:scaleX(0)}
html.motion-ok .ruleline.drawn{transform:scaleX(1);transition:transform .7s var(--ease)}
@media (hover:hover) and (pointer:fine){
:is(.cardlink,.highlights li,.toolcard,.exhibit,.servicecard){transition:background-color .18s ease,border-color .18s ease}
:is(.cardlink,.highlights li,.outlinebox,.servicecard,.featurelist li):hover{background:rgba(16,17,22,0.017)}
}
@media(max-width:640px){.band{padding:40px 0}.wrap,.toolwide{padding-left:20px;padding-right:20px}}
@media (prefers-reduced-motion:reduce){
:is(.hero-tagline,.hero h1,.hero .stamp,.servicelist li,header.doc .eyebrow,header.doc h1,header.doc .lead,header.doc .stamp,nav,.ruleline,.checksum::after,[data-reveal],.rv){animation:none;transition:none;transform:none;opacity:1}
}
.cards{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:stretch;justify-content:stretch}
.cards li{display:flex;width:auto;max-width:none;min-width:0;flex:none}
.cards li[hidden]{display:none}
.cards .cardlink{display:flex;flex-direction:column;width:100%;height:100%;min-width:0;overflow:hidden;overflow-wrap:anywhere}
.cards .cardlink h2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;font-size:1.15rem;font-weight:650;letter-spacing:-.02em;line-height:1.25;min-height:2.5em;max-height:2.5em;margin:0 0 10px;background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#0D0D0D;-webkit-text-fill-color:#0D0D0D}
.cards .cardlink:hover h2{color:var(--accent-hover);-webkit-text-fill-color:var(--accent-hover)}
.cards .cardlink p.desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;overflow-wrap:anywhere;line-height:1.45;min-height:4.35em;max-height:4.35em;margin:0;max-width:none}
.cards .typetag,.cards .cardmeta,.cards .cardsig{overflow-wrap:anywhere;max-width:100%}
.cards .cardfoot{margin-top:auto;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;overflow:hidden}
.cards .cardfoot .typetag{margin:0}
.cards .cardmeta{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:3em;max-height:3em}
.cards .cardsig{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:3em;max-height:3em}
@media(min-width:768px){
.cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.featurecards{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(min-width:1024px){
.cards{grid-template-columns:repeat(3,minmax(0,1fr))}
}
article{overflow-wrap:anywhere}
article img,article svg,article video{max-width:100%;height:auto}
article table{display:block;max-width:100%;overflow-x:auto;overflow-y:hidden}
.toc{margin:0 0 28px;padding:0 0 16px;border-bottom:1px solid rgba(16,17,22,0.054)}
.toclabel{margin:0;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.toc ol{margin:10px 0 0;padding-left:1.2em}
.toc li{margin:0 0 6px}
.toc a{overflow-wrap:anywhere}
.neighbors{display:grid;gap:12px;margin:28px 0 0}
.neighbor{display:flex;flex-direction:column;gap:4px;min-width:0;overflow-wrap:anywhere;padding:14px 16px;border:1px solid rgba(16,17,22,0.063);border-radius:12px;color:inherit}
.neighbor:hover{text-decoration:none;background:rgba(16,17,22,0.014)}
.neighborlabel{font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.featurelist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.featurelist li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 12px;align-items:start;padding:14px 16px}
.featurelist svg{grid-row:span 2;width:26px;height:26px;margin-top:2px;fill:none;stroke:currentColor;stroke-width:1.5;color:#0D0D0D}
.featurelist h2{margin:0;font-size:1rem;line-height:1.25;letter-spacing:-.01em;font-weight:650;color:#0D0D0D;background:none;-webkit-text-fill-color:#0D0D0D}
.featurelist p{margin:0;color:var(--t2);font-size:14px;line-height:1.45;overflow-wrap:anywhere}
@media(min-width:768px){.neighbors{grid-template-columns:1fr 1fr}}
.navsignin{display:inline-flex;align-items:center;min-height:44px;padding:0 2px 0 8px;color:var(--t1);font-size:14px;font-weight:600;white-space:nowrap;flex:none}
.navsignin:hover{color:var(--accent);text-decoration:none}
/* The menu copy stays out of the desktop row. On a phone the bar copy sits
between the logo and the menu button, because the link row is taken out of
flow. Once the menu script runs, the bar copy hides and this control is a
row inside the menu instead. */
.navsignin-menu{display:none}
button.btn{font:inherit;cursor:pointer}
button.textbtn{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;border:0;background:transparent;color:var(--t2);font:600 15px/1.2 inherit;cursor:pointer}
button.textbtn:hover{color:var(--t1)}
.accountactions{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin:22px 0 0}
.confirmbox{margin-top:16px;padding:16px 18px;border:1px solid rgba(16,17,22,0.063);border-radius:12px}
.accountrow{display:flex;align-items:flex-start;gap:12px;min-height:44px;margin:18px 0}
.accountrow input{width:20px;height:20px;margin-top:2px;accent-color:var(--accent)}
[data-download-gate][hidden],#account-signed-in[hidden],#account-signed-out[hidden],#account-delete-confirm[hidden],[data-subscribe-signed-out][hidden],[data-subscribe-signed-in][hidden]{display:none}
.tooldownloads{display:flex;flex-direction:column;gap:0;max-width:640px;margin:28px 0 8px}
.tooldownloads .outlinebox{margin:0;max-width:none}
.tooldownloads h2{margin:0 0 14px;font-size:1.15rem;line-height:1.25;letter-spacing:-.02em;font-weight:650;background:none;-webkit-text-fill-color:#0D0D0D;color:#0D0D0D}
.tooldownloads .downloadready{width:100%;margin:0;padding:0;border:0;border-radius:0;background:none}
.stayupdated{margin:40px 0 0;padding:28px 0 0;border:0;border-top:1px solid rgba(16,17,22,0.063);border-radius:0;background:none;box-shadow:none}
.stayupdated h2{margin:0 0 12px;font-size:1.02rem;line-height:1.3;letter-spacing:-.01em;font-weight:600;color:var(--t2);background:none;-webkit-text-fill-color:var(--t2)}
.downloadgate .btn,.downloadready .downloadbtn{width:auto;max-width:100%;height:auto;min-height:44px;padding:10px 18px;align-self:flex-start;font-size:14.5px}
.stayupdated .signupform>.btn{width:100%;max-width:100%;height:auto;min-height:52px}
.downloadbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:auto;max-width:100%;height:auto;min-height:44px;padding:10px 18px;line-height:1.2;text-align:center;white-space:normal;align-self:flex-start}
.downloadname{display:block;font-size:16px;font-weight:650;line-height:1.2}
.downloadmeta{display:block;margin-top:1px;font-size:12.5px;font-weight:500;letter-spacing:.02em;line-height:1.3;color:rgba(20,20,22,.62)}
.checksum{display:flex;flex-direction:column;align-items:stretch;gap:6px;width:100%;max-width:100%;box-sizing:border-box;overflow:visible;padding:12px 14px;border:1px solid rgba(16,17,22,0.072);border-radius:8px;background:rgba(0,0,0,.22);word-break:break-all;overflow-wrap:anywhere}
.checksum::after{content:none;display:none}
.checksumlabel{font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.checksum a,.checksum code{display:block;width:100%;max-width:100%;box-sizing:border-box;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--t2);overflow-wrap:anywhere;word-break:break-all;white-space:normal}
.stayupdated .signupform{margin-top:4px}
.stayupdated .signuprow{width:100%}
.stayupdated .signuprow input[type="email"]{width:100%;max-width:100%;flex:1 1 auto}
.stayupdated .consent{width:100%;max-width:none;margin:0}
.signupform>.btn{align-self:stretch;min-height:48px}
.signupform .consent{font-weight:400;align-items:flex-start}
.alertline{margin:0;max-width:62ch;color:var(--t2);font-size:16px;line-height:1.5}
.alertline a{font-weight:600}
article .toollist{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:14px;max-width:640px}
.toollist .toolentry{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:0;padding:22px 22px 20px;border:1px solid rgba(16,17,22,0.072);border-radius:12px;background:#F3F3F4;color:var(--t2);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.toolentry h2{margin:0;font-size:1.25rem;line-height:1.25;letter-spacing:-.02em;font-weight:650;color:#0D0D0D;background:none;-webkit-text-fill-color:#0D0D0D}
.toolentry p{margin:0;max-width:46em;color:var(--t2);font-size:16px;line-height:1.45}
.toolentry .btn{margin-top:8px;min-height:48px}
.toolstatus{margin:0 0 2px;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.toollist .toolplanned{background:transparent;border-color:rgba(16,17,22,0.045)}
.toolplanned h2{font-weight:600;color:var(--t2);-webkit-text-fill-color:var(--t2)}
.toollink{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;color:var(--t2);font-size:15px;font-weight:600}
.toollink:hover{color:var(--t1);text-decoration:none}
.toolnote{margin:18px 0 0;max-width:62ch;color:var(--t3);font-size:15px;line-height:1.5}
article .toolnote{margin-top:22px}
@media(max-width:430px){
.downloadgate .btn,.downloadready .downloadbtn,.signupform>.btn,.toolentry .btn{width:100%;height:auto;min-height:52px;padding:12px 16px}
.downloadready .downloadbtn{white-space:normal}
.toollist .toolentry{padding:18px 16px 16px}
}
/* Article pages scroll as one document. A clipped header, a transformed
title, or background-clip on the title paints the heading on its own
layer, and the body text then scrolls across it. */
body.articlepage{overflow-x:clip}
body.articlepage nav{background:#F8F8F9;border-bottom:1px solid var(--border)}
body.articlepage header.doc{margin-top:0;overflow:visible;padding-top:48px}
html.motion-ok body.articlepage header.doc :is(.eyebrow,h1,.lead,.stamp){animation:none;transform:none;opacity:1}
body.articlepage header.doc h1{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#0D0D0D;-webkit-text-fill-color:#0D0D0D}
.figopen{display:block;width:100%;margin:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:zoom-in;text-align:inherit}
.figopen:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.figopen img{display:block;width:100%;height:auto}
.lightbox-tools{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.lightbox-stage.is-panning{cursor:grabbing}
.lightbox-stage{cursor:grab}
@media(max-width:1100px){
nav.hasmenu .navsignin-bar{display:none}
nav.hasmenu .navlinks .navsignin-menu{display:flex;align-items:center;justify-content:center;margin:10px 20px 8px;padding:0 16px;min-height:44px;border:1px solid rgba(16,17,22,0.126);border-radius:8px;color:#0D0D0D;font-size:16px;font-weight:600}
nav.hasmenu .navlinks .navsignin-menu:hover{color:#0D0D0D;text-decoration:none;background:rgba(16,17,22,0.021)}
}
.accountstack{display:flex;flex-direction:column;gap:16px;max-width:none;margin:4px 0 32px}
.accountcard{margin:0;padding:22px 22px 20px;border:1px solid rgba(16,17,22,0.072);border-radius:12px;background:#F3F3F4}
.accountcard h2{margin:0 0 8px;font-size:1.15rem;line-height:1.25;letter-spacing:-.02em;font-weight:650;color:#0D0D0D;background:none;-webkit-text-fill-color:#0D0D0D}
.accountlead{margin:0 0 16px;color:var(--t2);font-size:15px;line-height:1.5}
.accountfield{display:flex;flex-direction:column;align-items:stretch;gap:6px;margin:0 0 14px}
.accountfield label{color:#0D0D0D;font-weight:600;font-size:14px}
.accountfield input{width:100%;min-height:48px;padding:0 14px;border-radius:8px;border:1px solid rgba(16,17,22,0.099);background:rgba(0,0,0,.25);color:#0D0D0D;font:16px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif}
.accountfield input:focus{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}
.accountcard .btn{margin-top:2px}
.accountcard form+form{margin-top:18px;padding-top:18px;border-top:1px solid rgba(16,17,22,0.045)}
.accountrow span strong{display:block;color:#0D0D0D;font-weight:650}
.accountrow .accounthelp{margin:2px 0 0}
.preferencerow{margin-top:8px;padding-top:14px;border-top:1px solid rgba(16,17,22,0.045)}
.preferencerow strong{display:block;color:#0D0D0D;font-size:16px;font-weight:650}
.accounthelp{display:block;margin:4px 0 8px;color:var(--t2);font-size:14px;line-height:1.45;font-weight:400}
.accountlinks{display:flex;flex-direction:column}
.accountlinks a{display:flex;align-items:center;min-height:48px;border-top:1px solid rgba(16,17,22,0.045);color:#0D0D0D;font-weight:600}
.accountlinks a:hover{color:var(--accent);text-decoration:none}
.accountcard .accountactions{margin-top:4px}
#account-profile-status,#account-status{min-height:1.4em}
@media(max-width:430px){
.accountcard{padding:18px 16px 16px}
.accountcard .btn{width:100%}
}
/* design: near-black */
/* A tab with a session paints its signed-in state once. Until devi-auth.js
has run, the sign-in control and the Account body stay invisible rather
than showing "Sign in" first. If the script never runs they appear anyway. */
html.devi-boot .navsignin,html.devi-boot .dashpage main{visibility:hidden;animation:deviboot 0s 1.5s forwards}
@keyframes deviboot{to{visibility:visible}}
:root{--bg-canvas:#FBFBFB;--bg-surface:#FBFBFB;--bg-card:#F8F8F9;--border:rgba(16,17,22,0.036);--line:rgba(16,17,22,0.036);--line2:rgba(16,17,22,0.063);--stroke:rgba(16,17,22,0.063);--hair:rgba(16,17,22,0.036);--hair2:rgba(16,17,22,0.063);--field:rgba(255,255,255,.38);--panel:#F8F8F9;--panel-hover:#F6F6F7;--text-muted:#5E5E67;--t3:#5E5E67;--max:1480px;--radius:10px;--accent-blue:#4B8DF8;--accent-purple:#8B77EE;--accent-gradient:linear-gradient(90deg,var(--accent-blue),var(--accent-purple));--accent-gradient-down:linear-gradient(180deg,var(--accent-blue),var(--accent-purple));--accent-gradient-hover:linear-gradient(90deg,#70A7FF,#9A86F4);--accent-ring:#6B82F3}
html{background:#FBFBFB}
body{background:#FBFBFB;font-size:16px;line-height:1.65;text-rendering:optimizeLegibility}
.wrap{padding:0 32px}
@media(min-width:1440px){.wrap,.toolwide{padding-left:40px;padding-right:40px}}
@media(min-width:1600px){.wrap,.toolwide{padding-left:48px;padding-right:48px}}
.hero::before,.hero::after,.tooltop::before{content:none;display:none}
nav,body.articlepage nav{background:#FBFBFB;border-bottom:1px solid transparent}
nav.scrolled,body.articlepage nav{background:#FBFBFB;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid var(--hair)}
/* The bar scrolls away on every page, including articles. It stays
relative so the phone menu has a containing block. A static bar let the
absolutely positioned panel resolve top:100% against the viewport, so it
opened below the fold and under the article. */
body.articlepage nav{position:relative;z-index:50}
.navlinks{gap:26px}
.navlinks a{font-size:14px;font-weight:500;color:#525258;letter-spacing:-.005em}
.navlinks a.here,.navlinks a[aria-current="page"]{color:#0D0D0D;font-weight:500}
.navsignin-bar{min-height:36px;margin-left:8px;padding:0 14px;border:1px solid var(--hair2);border-radius:8px;font-size:14px;font-weight:500;color:#0D0D0D;transition:border-color .15s ease,background-color .15s ease}
.navsignin-bar:hover{color:#0D0D0D;border-color:rgba(16,17,22,0.126);background:rgba(16,17,22,0.014)}
@media(max-width:1100px){
.navlinks{gap:0;background:#FBFBFB;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-bottom:1px solid var(--hair);padding:8px 0 16px}
.navlinks a{padding:0 32px;font-size:16px}
nav.hasmenu .navlinks .navsignin-menu{margin:12px 32px 4px;border-color:var(--hair2);border-radius:8px}
}
.hero{padding:104px 0 48px}
.hero h1{font-size:clamp(2.4rem,5vw,3.9rem);line-height:1.08;letter-spacing:-.04em;font-weight:650;padding-bottom:.12em;margin:0 0 22px;max-width:14em}
.herolead{max-width:34em;margin:0 0 34px;color:#525258;font-size:clamp(17px,1.5vw,19px);line-height:1.6}
.heroactions{display:flex;flex-wrap:wrap;gap:12px;margin:0}
@media(min-width:900px){.herosplit{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:64px;align-items:end}}
header.doc{padding:72px 0 36px;border-bottom:1px solid var(--hair)}
body.articlepage header.doc{padding-top:64px}
header.doc h1{font-size:clamp(2.2rem,4.4vw,3.3rem);line-height:1.1;letter-spacing:-.035em;padding-bottom:.1em;margin:0 0 18px}
header.doc .lead{font-size:18px;line-height:1.6;color:#525258;max-width:60ch}
.eyebrow,.taglabel,.toclabel,.flabel{font:500 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;color:#5E5E67}
.eyebrow{margin:0 0 18px}
.ruleline{display:none}
.band{padding:64px 0}
main>.band+.band{border-top:1px solid var(--hair)}
main .band:last-child{padding-bottom:64px}
.band h2{font-size:clamp(1.85rem,3vw,2.6rem);line-height:1.15;letter-spacing:-.032em;margin:0 0 20px;max-width:18em}
.band .lead{font-size:17.5px;line-height:1.65;color:#525258;max-width:60ch}
.band .lead p{color:#525258}
.split{gap:32px}
@media(min-width:900px){.split{gap:64px;align-items:start}}
.actions{gap:8px 28px;margin:28px 0 0}
.actions a,.connect-links a{font-weight:500}
.actions a::after{content:" \2192";display:inline-block;margin-left:6px;transition:transform .15s ease}
.actions a:hover{text-decoration:none;color:var(--accent-hover)}
.actions a:hover::after{transform:translateX(2px)}
.btn{min-height:44px;padding:10px 18px;border:1px solid #FAFAFA;border-radius:8px;background:#FAFAFA;color:#0A0A0B;font-size:14.5px;font-weight:600;letter-spacing:-.005em;transition:background-color .15s ease,border-color .15s ease}
.btn:hover{background:#E4E4E7;border-color:#E4E4E7;color:#0A0A0B;box-shadow:none}
.btn.btnghost{background:transparent;color:#0D0D0D;border:1px solid var(--hair2)}
.btn.btnghost:hover{background:rgba(16,17,22,0.017);border-color:rgba(16,17,22,0.126);color:#0D0D0D}
.cardlink,.highlights li,.outlinebox,.toolcard,.servicecard,.frame,#connect .wrap,.featurelist li,.neighbor,.confirmbox,.toollist .toolentry,.accountcard{background:var(--panel);border:1px solid var(--hair);border-radius:12px;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
.toollist .toolplanned{background:transparent;border-color:var(--hair)}
@media (hover:hover) and (pointer:fine){
:is(.cardlink,.highlights li,.outlinebox,.servicecard,.featurelist li,.neighbor){transition:background-color .15s ease,border-color .15s ease}
:is(.cardlink,.servicecard,.neighbor):hover{background:var(--panel-hover);border-color:var(--hair2)}
:is(.highlights li,.outlinebox,.featurelist li):hover{background:var(--panel)}
}
.servicelist{gap:12px}
.servicecard{padding:20px 22px 18px}
.svcmark{width:22px;height:22px;margin:0 0 14px;color:#525258;stroke-width:1.4}
.servicecard h2{font-size:15.5px;font-weight:600;letter-spacing:-.01em;margin:0 0 4px}
.servicecard p{font-size:14px;line-height:1.5;color:#525258}
.featurelist{gap:12px}
.featurelist li{padding:20px 22px;gap:4px 14px}
.featurelist svg{width:22px;height:22px;color:#525258;stroke-width:1.4}
.featurelist h2{font-size:15.5px;font-weight:600;margin:0;max-width:none}
.featurelist li{position:relative}
.featurelist h2 a{color:#0D0D0D;-webkit-text-fill-color:#0D0D0D;text-decoration:none}
.featurelist h2 a::after{content:"";position:absolute;inset:0;border-radius:12px}
.featurelist h2 a:focus-visible{outline:none}
.featurelist h2 a:focus-visible::after{outline:2px solid var(--accent-ring);outline-offset:2px}
.featurelist li:has(a):hover{background:var(--panel-hover);border-color:var(--hair2)}
#connect .wrap,.outlinebox{padding:36px 34px 32px}
#connect h2{font-size:clamp(1.4rem,2vw,1.7rem);letter-spacing:-.025em}
.cards{gap:16px}
.cards .cardlink{padding:26px 26px 20px}
.cards .cardlink h2{font-size:1.1rem;font-weight:600;letter-spacing:-.015em}
.cards .cardlink:hover h2{color:#0D0D0D;-webkit-text-fill-color:#0D0D0D}
.cardfoot{border-top:1px solid var(--hair)}
.typetag{color:var(--accent-blue)}
.signuprow input[type="email"],.searchfield input,.accountfield input{background:#FBFBFB;border:1px solid var(--field);border-radius:8px}
.signuprow input[type="email"]:focus,.searchfield input:focus,.accountfield input:focus{outline:none;outline-offset:0;box-shadow:none;border:2px solid transparent;background:linear-gradient(#FBFBFB,#FBFBFB) padding-box,var(--accent-gradient) border-box;background-origin:padding-box,border-box;background-clip:padding-box,border-box}
.checksum{background:#FBFBFB;border:1px solid var(--hair2);border-radius:8px}
code{border-color:var(--hair2);border-radius:5px;background:rgba(16,17,22,0.01)}
pre.block{background:#F9F9FA;border-color:var(--hair2);border-radius:10px}
pre.block code{background:none}
.callout,.disclaimer,.env,.evidence{background:var(--panel);border-color:var(--hair);border-radius:12px}
.callout{border-left:2px solid var(--accent)}
.evidence{border-left:2px solid var(--line2)}
.evidence.ev-test{border-left-color:var(--ok)}
.evidence.ev-government{border-left-color:var(--accent)}
article{padding:48px 0 0}
article h2{font-size:clamp(1.4rem,2.2vw,1.65rem);line-height:1.25;letter-spacing:-.025em;margin:56px 0 16px;font-weight:650;color:#0D0D0D}
article h2:first-child{margin-top:0}
article h3{font-size:17px;font-weight:600;color:#0D0D0D}
article p,article li{color:#525258;line-height:1.75;max-width:70ch}
article li::marker{color:#6E6E78}
.toc{border-bottom-color:var(--hair)}
.backlink{color:#525258;padding:28px 0 0}
main{padding:0 0 64px}
footer{background:#FBFBFB;border-top:1px solid var(--hair);padding:72px 0 40px;font-size:14px}
.fgrid{gap:40px 32px}
.fbrand{gap:14px}
.fbrand>.brand{margin-bottom:6px}
.fbrand p{color:#5E5E67;font-size:13.5px;line-height:1.6}
.tagline{color:#525258}
.flabel{margin:0 0 14px;color:#0D0D0D;letter-spacing:.1em}
.fcol a{padding:12px 0;color:#5E5E67;font-size:14px}
.fcol a:hover{color:#0D0D0D}
.fbot{margin-top:56px;padding-top:24px;border-top:1px solid var(--hair)}
.fbot p{color:#5E5E67;font-size:13.5px}
.fbot a{color:#525258}
.fbot a:hover{color:#0D0D0D}
@media(max-width:820px){.fgrid{gap:36px 24px}}
@media(max-width:640px){
.wrap,.toolwide{padding-left:20px;padding-right:20px}
.hero{padding:56px 0 40px}
.herolead{margin-bottom:28px}
.heroactions .btn{flex:1 1 auto}
header.doc{padding:44px 0 32px}
.band,main .band:last-child{padding:64px 0}
#connect .wrap,.outlinebox{padding:26px 22px 22px}
footer{padding:56px 0 32px}
.navlinks a{padding:0 20px}
nav.hasmenu .navlinks .navsignin-menu{margin:12px 20px 4px}
}
/* Accent. Same blue as before, then a close purple. One run across the
words: blue on the first, purple on the last, including where a line
wraps. Slice is the default. A block or inline-block paints that run
across the box, so a short last line stays blue; those labels keep the
gradient on an inline .accenttext. Headlines keep their white fade.
Fills stay flat.
text-decoration must stay none in every state: glyphs use a transparent
fill so an underline paints as a row of underscores on :hover/:active.
Use :is() (not :where()) so these rules beat a:hover{text-decoration:underline}
site-wide — :where() zeroes specificity and the global underline won on
non-hub pages. Hover/active must keep background-clip:text or the fill
vanishes into an empty flash. */
:is(main) :is(p):not(.checksum) > a:is(:not(.btn,.backlink)),
:is(main) :is(li) > a:is(:not(.servicecard,.cardlink,.btn)),
.actions a,.connect-links a,.accountlinks a,.typetag>.accenttext,.calloutlabel>.accenttext,.ev-government .accenttext,
.chips button[aria-pressed="true"],.summarylist a,.preferencerow>a,.mention,.toc a,
.spec td a,.facts dd > a,.cardmeta dd > a,.osline a{
color:var(--accent-blue);
background-image:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;
-webkit-text-fill-color:transparent;
-webkit-box-decoration-break:slice;box-decoration-break:slice;
text-decoration:none}
:is(main) :is(p):not(.checksum) > a:is(:not(.btn,.backlink)):is(:link,:visited,:hover,:active,:focus),
:is(main) :is(li) > a:is(:not(.servicecard,.cardlink,.btn)):is(:link,:visited,:hover,:active,:focus),
.actions a:is(:link,:visited,:hover,:active,:focus),
.connect-links a:is(:link,:visited,:hover,:active,:focus),
.accountlinks a:is(:link,:visited,:hover,:active,:focus),
.summarylist a:is(:link,:visited,:hover,:active,:focus),
.preferencerow>a:is(:link,:visited,:hover,:active,:focus),
.toc a:is(:link,:visited,:hover,:active,:focus),
.mention:is(:link,:visited,:hover,:active,:focus),
.spec td a:is(:link,:visited,:hover,:active,:focus),
.facts dd > a:is(:link,:visited,:hover,:active,:focus),
.cardmeta dd > a:is(:link,:visited,:hover,:active,:focus),
.osline a:is(:link,:visited,:hover,:active,:focus){
text-decoration:none}
.typetag,.calloutlabel,.ev-government .evname{width:fit-content;max-width:100%}
.accenttext{display:inline}
:is(main) :is(p):not(.checksum,.actions) > a:is(:not(.btn,.backlink)):is(:hover,:active),
:is(main) :is(li) > a:is(:not(.servicecard,.cardlink,.btn)):is(:hover,:active),
.toc a:is(:hover,:active),
.summarylist a:is(:hover,:active),
.preferencerow>a:is(:hover,:active),
.spec td a:is(:hover,:active),
.facts dd > a:is(:hover,:active),
.cardmeta dd > a:is(:hover,:active),
.osline a:is(:hover,:active){
text-decoration:none;
background-image:var(--accent-gradient-hover),var(--accent-gradient-hover);
background-repeat:no-repeat;
background-size:100% 1px,auto auto;
background-position:0 100%,0 0;
-webkit-background-clip:border-box,text;background-clip:border-box,text}
.actions a:is(:hover,:active),.connect-links a:is(:hover,:active),.accountlinks a:is(:hover,:active){
text-decoration:none;
background-image:var(--accent-gradient-hover);
-webkit-background-clip:text;background-clip:text;
-webkit-text-fill-color:transparent}
.checksum a,.checksum code{-webkit-text-fill-color:currentColor;background-clip:border-box;-webkit-background-clip:border-box}
.chips button[aria-pressed="true"]{border-bottom:1px solid transparent;border-image:var(--accent-gradient) 1}
.chips button[aria-pressed="true"] .count{-webkit-text-fill-color:transparent}
.callout,.evidence.ev-government{position:relative;border-left-color:transparent}
.callout::before{content:"";position:absolute;left:-2px;top:14px;bottom:14px;width:2px;border-radius:2px;background:var(--accent-gradient-down);pointer-events:none}
.evidence.ev-government::before{content:"";position:absolute;left:-3px;top:14px;bottom:14px;width:3px;border-radius:2px;background:var(--accent-gradient-down);pointer-events:none}
:focus-visible{outline:2px solid var(--accent-ring);outline-offset:2px}
.consent input,.accountrow input{accent-color:var(--accent-ring)}
.snippet mark{background:linear-gradient(90deg,color-mix(in srgb,var(--accent-blue) 24%,transparent),color-mix(in srgb,var(--accent-purple) 24%,transparent));color:#0D0D0D}
/* Insights is two sides. Each side is a column of short cards once there is room. */
.insightsides{display:grid;gap:36px;margin:8px 0 0}
.insightside h2{margin:0 0 8px;font-size:clamp(26px,3vw,34px);letter-spacing:-.03em;line-height:1.1}
.insightside h2 a{color:#0D0D0D;text-decoration:none}
.insightside h2 a:hover{color:var(--accent-hover)}
.insightside .sidelead{margin:0;max-width:38ch;color:#525258;font-size:16px;line-height:1.45}
.insightside .sidecount{margin:12px 0 0}
.insightside .sidenote{margin:18px 0 0;color:#525258}
.insightside[hidden]{display:none}
.insightsides .cards{grid-template-columns:minmax(0,1fr);margin-top:18px}
.insightsides .cards .cardlink p.desc{-webkit-line-clamp:2;min-height:0;max-height:none}
.featurecards .cardlink p.desc{-webkit-line-clamp:2;min-height:2.9em;max-height:2.9em}
@media(min-width:900px){
.insightsides{grid-template-columns:1fr 1fr;gap:28px 40px;align-items:start}
}
.mission{margin:0 0 12px;font-weight:700;font-size:clamp(1.35rem,2.6vw,1.9rem);letter-spacing:-.03em;line-height:1.15;color:#0D0D0D}
/* Number band: its own section, two stats, one link each. The panel keeps to
the content width with rounded corners (the owner, Oct 24): a near-black
surface and a soft gradient edge, so it reads as a section without a color shift. */
.statband{margin:clamp(8px,2vw,24px) 0 0;padding:clamp(24px,4vw,48px) 0}
.statpanel{padding:clamp(40px,6vw,72px) clamp(20px,4vw,48px);border:1px solid transparent;border-radius:16px;
background:radial-gradient(60% 120% at 50% 0%,rgba(107,130,243,.05),transparent 70%) padding-box,linear-gradient(#F9F9FA,#F9F9FA) padding-box,
linear-gradient(135deg,rgba(75,141,248,.32),rgba(16,17,22,0.028) 45%,rgba(139,119,238,.32)) border-box}
/* Why DEVI exists is a statement, not a box: larger type on a gradient rule. */
.statement{position:relative;padding-left:clamp(20px,3vw,32px)}
.statement::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:3px;background:var(--accent-gradient-down)}
.statement .lead{max-width:44ch;color:#1F1F23;font-size:clamp(1.2rem,2.1vw,1.6rem);line-height:1.45;letter-spacing:-.01em}
/* Join the discussion is a call to action: one card, an icon, a line, one button. */
.ctacard{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px 24px;align-items:start;max-width:680px;padding:28px 32px;border-radius:16px;
border:1px solid rgba(16,17,22,0.063);background:#F8F8F9}
.ctaicon{width:52px;height:52px;padding:12px;border-radius:12px;border:1px solid var(--hair2);fill:none;stroke:#35353D;stroke-width:1.5;stroke-linejoin:round;
background:linear-gradient(135deg,rgba(75,141,248,.14),rgba(139,119,238,.14))}
.ctacard .eyebrow{margin:0 0 6px}
.ctacard h2{margin:0 0 4px;font-size:clamp(1.4rem,2vw,1.75rem)}
.ctatext p:last-child{margin:0;color:#525258;font-size:16px;line-height:1.5}
.ctacard .btn{grid-column:2;justify-self:start;white-space:nowrap}
@media(max-width:700px){.ctacard{grid-template-columns:minmax(0,1fr);padding:24px 20px}.ctacard .btn{grid-column:auto;width:100%}}
.numband{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));list-style:none;margin:0 auto;padding:0;max-width:960px}
.numband li{display:flex;justify-content:center;min-width:0}
.numband li+li{border-left:1px solid var(--hair2)}
/* .statband raises these over the gradient-text rule for links in main. */
.statband .numband a,.statband .numband a:hover,.statband .numband a:focus-visible{display:flex;flex-direction:column;align-items:center;gap:10px;min-height:44px;padding:4px 24px;border-radius:10px;
text-align:center;color:#35353D;text-decoration:none;background:none;-webkit-text-fill-color:currentColor}
.numband a:focus-visible{outline:2px solid var(--accent-ring);outline-offset:6px}
.numband .num{font-weight:700;font-size:clamp(3.6rem,8vw,5.6rem);line-height:1;letter-spacing:-.04em;padding-bottom:.06em;
color:#0F49BD;background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.numband .numlabel{color:#35353D;font-size:16px;line-height:1.35}
.numband .numcta{margin-top:6px;color:#0F49BD;font-size:15px;font-weight:600;line-height:1.3}
.numband .numcta span{display:inline-block;margin-left:4px;transition:transform .2s ease}
.numband a:hover .numcta,.numband a:focus-visible .numcta{color:#0F48BD}
.numband a:hover .numcta span,.numband a:focus-visible .numcta span{transform:translateX(4px)}
@media (prefers-reduced-motion: reduce){.numband .numcta span{transition:none}}
@media (forced-colors: active){.numband .num{-webkit-text-fill-color:currentColor;background:none;color:CanvasText}}
.numnote{margin:10px 0 0;color:#5E5E67;font-size:12.5px}
.audience{display:grid;gap:16px;list-style:none;margin:18px 0 0;padding:0}
.audience>li{border:1px solid var(--hair);border-radius:12px;background:#F8F8F9;padding:26px 24px 18px}
.audience h2{margin:0 0 10px;font-size:1.35rem;letter-spacing:-.02em;color:#0D0D0D}
.audience p{margin:0 0 12px;color:#525258}
.viewswitch{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px}
.viewswitch a{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--hair2);border-radius:8px;color:#525258;text-decoration:none;font-size:14.5px;line-height:1.3}
.viewswitch a[aria-current="page"]{color:#0D0D0D;border-color:transparent;background:linear-gradient(#F8F8F9,#F8F8F9) padding-box,var(--accent-gradient) border-box}
.viewswitch a:hover{color:#0D0D0D}
.getstarted pre{margin-top:14px}
@media(max-width:480px){
.getstarted .actions{flex-direction:column;align-items:flex-start;gap:8px;margin-top:20px}
.getstarted .actions a{min-height:44px;justify-content:flex-start;white-space:nowrap}
}
@media(min-width:800px){.audience{grid-template-columns:1fr 1fr;align-items:stretch}}
@media(max-width:560px){.numband{grid-template-columns:minmax(0,1fr)}.numband li{padding:28px 0}.numband li:first-child{padding-top:0}.numband li:last-child{padding-bottom:0}.numband li+li{border-left:0;border-top:1px solid var(--hair2)}}
@media (forced-colors: active){
:where(main) :where(p) > a,:where(main) :where(li) > a,.actions a,.connect-links a,.typetag>.accenttext,.calloutlabel>.accenttext,.ev-government .accenttext,.chips button[aria-pressed="true"],.summarylist a,.preferencerow>a,.mention,.toc a,.spec td a,.facts dd > a,.cardmeta dd > a,.osline a{
background-image:none;-webkit-text-fill-color:currentColor;color:LinkText;border-image:none}
.callout::before,.evidence.ev-government::before{background:LinkText}
}
/* tool status */
.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px 2px 6px;border-radius:999px;font-size:12px;font-weight:600;
line-height:20px;white-space:nowrap;border:1px solid #DBDBDF;color:#47463C;background:#F8F8F9}
.chip svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chip-pending{color:#0F54BD;background:#EBF2F9;border-color:transparent}
.chip-approved{color:#2CA02C;background:#F2F5F2;border-color:transparent}
.chip-denied{color:#B61616;background:#F8EDED;border-color:transparent}
.chip-revoked{color:#5E5E67;text-decoration:line-through}
.accessrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 8px}
/* motion */
.hero{isolation:isolate}
.heroglow{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 62%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 62%,transparent)}
.heroglow i{position:absolute;left:50%;top:-8%;width:min(1180px,150vw);height:min(720px,120vw);margin-left:calc(min(1180px,150vw) / -2);
transition:transform 1.6s cubic-bezier(.2,.7,.2,1);will-change:transform}
.heroglow i::before{content:"";position:absolute;inset:0;border-radius:50%;
background:radial-gradient(closest-side at 42% 50%,rgba(75,141,248,.16),rgba(75,141,248,.05) 55%,transparent),radial-gradient(closest-side at 64% 46%,rgba(139,119,238,.12),transparent 70%);
animation:glowdrift 52s ease-in-out infinite alternate}
@keyframes glowdrift{0%{transform:translate3d(-7%,0,0) scale(1)}50%{transform:translate3d(3%,6%,0) scale(1.06)}100%{transform:translate3d(8%,-2%,0) scale(1)}}
[data-count]{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){.heroglow i::before{animation:none}.heroglow i{transition:none;transform:none!important}}
@media print{.rv{opacity:1!important;transform:none!important}.heroglow{display:none}}
/* header: light */
html[data-theme="light"] nav,html[data-theme="light"] nav.scrolled,html[data-theme="light"] body.articlepage nav{background:#ffffff;
-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid #e6e5e1;color-scheme:light}
html[data-theme="light"] nav.scrolled{box-shadow:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.06)}
html[data-theme="light"] nav img,html[data-theme="light"] nav .brand img{filter:invert(1)}
html[data-theme="light"] .navlinks a{color:#52514e}
html[data-theme="light"] .navlinks a:hover,html[data-theme="light"] .navlinks a.here,
html[data-theme="light"] .navlinks a[aria-current="page"]{color:#0b0b0b}
html[data-theme="light"] .navsignin,html[data-theme="light"] .navsignin:hover{color:#0b0b0b;background:none;
-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor}
html[data-theme="light"] .navsignin-bar{border-color:#d6d5d0}
html[data-theme="light"] .navsignin-bar:hover{border-color:#8f8e89;background:#f3f4f6}
html[data-theme="light"] .navtoggle{color:#0b0b0b}
html[data-theme="light"] nav a:focus-visible,html[data-theme="light"] nav button:focus-visible{outline:2px solid #2a78d6;outline-offset:2px}
@media(max-width:1100px){
html[data-theme="light"] .navlinks{background:#ffffff;border-bottom:1px solid #e6e5e1;box-shadow:0 8px 16px rgba(16,24,40,.08)}
html[data-theme="light"] nav.hasmenu .navlinks .navsignin-menu{color:#0b0b0b;border-color:#d6d5d0}
html[data-theme="light"] nav.hasmenu .navlinks .navsignin-menu:hover{color:#0b0b0b;background:#f3f4f6}
}
.searchfield input:focus,.accountfield input:focus{outline:none;border-color:transparent;
background:linear-gradient(var(--bg-surface),var(--bg-surface)) padding-box,var(--accent-gradient) border-box;
box-shadow:0 0 0 4px rgba(139,119,238,.16)}
:focus-visible{outline-color:var(--accent-purple)}
.chips button[aria-pressed="true"]{color:var(--text-primary);border-bottom-color:transparent;
background-image:var(--accent-gradient);background-size:100% 2px;background-position:bottom;background-repeat:no-repeat}
.chips button[aria-pressed="true"] .count{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.cardlink:hover{border-color:transparent;
background:linear-gradient(var(--bg-surface),var(--bg-surface)) padding-box,var(--accent-gradient) border-box}
.cardlink:hover h2,.cards .cardlink:hover h2,.insightside h2 a:hover,.actions a:hover{
background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.snippet mark{background:linear-gradient(90deg,rgba(75,141,248,.28),rgba(139,119,238,.28));color:#0D0D0D}
.callout,.evidence.ev-government{position:relative;border-left-color:var(--stroke)}
.callout::before,.evidence.ev-government::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;
border-radius:12px 0 0 12px;background:var(--accent-gradient-down)}
.callout .calloutlabel,.ev-government .evname{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.fbot a:hover,.navsignin:hover,.accountlinks a:hover{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
::selection{background:rgba(139,119,238,.35)}
input[type=checkbox],input[type=radio]{accent-color:var(--accent-purple)}