/* Sitewide skin (variant E): AskSwarm tokens + minimal header */
:root{--white:#FFF8F8;--as-paper:#F5EEEE;--as-ink:#1F1A23;--purple:#CC91F0;--purple-s:#9E5ECF;--as-pink:#FFB0C2;--pink-s:#FF87A6;--yellow:#FFB500;--yellow-s:#FF9100;--green:#93F091;--green-s:#4FCD4C;--slate:#4D617D;
--st-lav:#CC91F0;--st-lav-sh:#9E5ECF;--st-pink:#FFB0C2;--st-pink-sh:#FF87A6;--st-yellow-sh:#FF9100;--vio:#9E5ECF;--violet:#9E5ECF;--bone3:#4D617D;--bone-4:#4D617D}
html,body{background:#F5EEEE}
.hero::after{display:none}
.reveal{opacity:1!important;transform:none!important}
/* minimal header: logo, 5 links, one pill CTA */
.hdr{background:#F5EEEE!important;border-bottom:2px solid #1F1A23!important}
.hdr .kbtn{display:none!important}
.nav{margin-left:auto}
.nav a{font-weight:700}
@media (min-width:1041px){
 .mnav.open{display:block;position:fixed;top:72px;right:max(20px,calc(50vw - 600px));left:auto;width:340px;z-index:59;background:#FFF8F8;border:2px solid #1F1A23;border-radius:24px;padding:10px 20px 20px;box-shadow:8px 8px 0 #9E5ECF}
 .mnav.open a{display:flex;justify-content:space-between;padding:12px 2px;border-bottom:2px solid #1F1A23;font:700 17px var(--s)}
 .mnav.open a:last-of-type{border-bottom:0}
 .mnav.open a span{font:12px var(--m);color:#4D617D;align-self:center}
 .mnav.open .btn{width:100%;margin-top:16px;justify-content:center}}
/* AskSwarm skin */
.door,.card,.step,.cmp,.quick3 a{border:2px solid #1F1A23!important;border-radius:32px!important}
.door::after,.card::after,.step::after,.quick3 a::after{border-radius:32px!important;transform:translate(10px,10px)!important}
.door h3,.card h3,.step h3,.quick3 b{font-family:"Battlefin",Impact,sans-serif!important;font-weight:900!important;letter-spacing:0!important}
.who,.door .who,.card .l,.step .n,.eb,.lapps-l,.l-f,.src,.lapps small,.proof small,.fact em{color:#4D617D}
.eb,.hero .eb{background:#1F1A23!important;color:#FFF8F8!important;border-radius:999px!important;font-family:var(--m)!important;letter-spacing:.08em}
.btn{border:2px solid #1F1A23!important;border-radius:999px!important;font-weight:700}
.btn-p{background:#FFB0C2!important;color:#1F1A23!important}
.btn-g{background:#FFF8F8!important;color:#1F1A23!important}
.go{text-decoration:none!important}
.proof b{color:#1F1A23}
.proof{background:transparent}
.fact b,.fact strong{color:#FFB500!important}
.facts{background:#1F1A23!important;border-radius:28px!important;border:2px solid #1F1A23}
.qc-note{background:#FFB500;border:2px solid #1F1A23;border-radius:24px;padding:18px 22px;box-shadow:8px 8px 0 #FF9100;max-width:none!important;color:#1F1A23!important}
.qc-note a{color:#1F1A23!important;text-decoration:underline}
.lapps li a{border:2px solid #1F1A23!important;background:#FFF8F8}
.lnk{color:#1F1A23!important;font-weight:700;border-bottom:2px solid #1F1A23}
body.home main section.light,body.home main section.dark:not(.hero):not(.cta){background:#F5EEEE!important;background-image:none!important}
.cmp .me{background:#CC91F0!important}
.ftr{background:#1F1A23!important}

/* header: chromia.com layout (logo | centred nav with dropdowns | CTA) */
html,body{overflow-x:clip}
.hdr .wrap{display:grid!important;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.hdr .brand{justify-self:start}
.hdr .hdr-r{justify-self:end;margin:0!important}
.hdr .nav{margin:0!important;display:flex;align-items:center;gap:4px;justify-self:center}
.hdr .nav>a,.hdr .dd>a{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:999px;font:700 14.5px var(--s);color:#1F1A23;opacity:1}
.hdr .nav>a:hover,.hdr .dd:hover>a,.hdr .dd:focus-within>a,.hdr .nav a[aria-current],.hdr .dd.is-cur>a{background:#FFF8F8;box-shadow:inset 0 0 0 2px #1F1A23}
.hdr .nav a[aria-current]::before,.hdr .nav>a::after,.hdr .dd-p a::after{display:none!important}
.hdr .dd{position:relative}
.hdr .dd>a::after{content:"";position:static!important;inset:auto!important;left:auto!important;bottom:auto!important;background:none!important;border-radius:0!important;opacity:1!important;width:6px;height:6px;border:solid currentColor;border-width:0 1.8px 1.8px 0;transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.hdr .dd:hover>a::after,.hdr .dd:focus-within>a::after{transform:translateY(2px) rotate(-135deg);margin-left:2px}
.hdr .dd-p{position:absolute;left:50%;top:100%;transform:translateX(-50%);padding-top:10px;display:none;z-index:70}
.hdr .dd:hover .dd-p,.hdr .dd:focus-within .dd-p{display:block}
.hdr .dd-p::before{content:"";position:absolute;inset:10px 0 0;background:#FFF8F8;border:2px solid #1F1A23;border-radius:20px;box-shadow:6px 6px 0 #9E5ECF;z-index:-1}
.hdr .dd-p a{display:block;min-width:180px;padding:10px 18px;font:700 14.5px var(--s);color:#1F1A23;white-space:nowrap;position:relative}
.hdr .dd-p a:first-child{margin-top:8px}.hdr .dd-p a:last-child{margin-bottom:8px}
.hdr .dd-p a:hover,.hdr .dd-p a[aria-current]{color:#9E5ECF}
.hdr .nav-docs i{margin-left:2px}
.hdr .hdr-r .btn-sm::after{content:"\2192";position:static;inset:auto;background:none;transform:none;margin-left:8px;border-radius:0;z-index:auto}
.hdr .hdr-r .btn-sm{box-shadow:4px 4px 0 #FF87A6}
.hdr .menu-b{display:none!important}
@media (max-width:1040px){.hdr .wrap{grid-template-columns:1fr auto}.hdr .nav{display:none!important}.hdr .menu-b{display:inline-flex!important}}
/* chromia.com IA: button-triggered groups */
.hdr .dd-t{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:999px;font:700 14.5px var(--s);color:#1F1A23;background:none;border:0;cursor:pointer}
.hdr .dd-t::after{content:"";width:6px;height:6px;border:solid currentColor;border-width:0 1.8px 1.8px 0;transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.hdr .dd:hover>.dd-t,.hdr .dd:focus-within>.dd-t,.hdr .dd.is-cur>.dd-t{background:#FFF8F8;box-shadow:inset 0 0 0 2px #1F1A23}
.hdr .dd:hover>.dd-t::after,.hdr .dd:focus-within>.dd-t::after{transform:translateY(2px) rotate(-135deg)}
.hdr .dd-p{background:none;border:0;margin-top:0;min-width:0}
.hdr .dd-h{display:block;position:relative;padding:12px 18px 2px;font:400 11.5px var(--m);text-transform:uppercase;letter-spacing:.08em;color:#4D617D}
.hdr .dd-p hr{position:relative;border:0;border-top:2px solid rgba(31,26,35,.15);margin:6px 14px}
.hdr .dd-p a i{margin-left:4px;font-style:normal}
.hdr .dd-p::before{content:"";position:absolute;inset:10px 0 0;background:#FFF8F8;border:2px solid #1F1A23;border-radius:20px;box-shadow:6px 6px 0 #9E5ECF;z-index:-1}
.mnav .mn-h{display:block;margin:22px 0 4px;font:400 12px var(--m);text-transform:uppercase;letter-spacing:.08em;color:#4D617D;border:0}
.mnav .mn-s{display:block;margin:10px 0 0;font:400 11px var(--m);text-transform:uppercase;letter-spacing:.08em;color:#4D617D}
@media (min-width:1041px){.mnav.open .mn-h{margin-top:12px}}
.hdr .nav .dd-p{padding:10px 0 0;margin-top:0}
.hdr .nav .dd-p::before{top:10px;bottom:0;left:0;right:0;height:auto}
.hdr .nav .dd-p>:nth-child(1){margin-top:8px}.hdr .nav .dd-p>:last-child{margin-bottom:8px}
.hdr .nav .dd-p a{padding:9px 18px;border-radius:0;min-width:200px}
.hdr .nav .dd-p a:hover{background:none;color:#9E5ECF}
/* spacing audit fixes: every bordered section/card keeps air around its content */
main>section:not(.pad){padding-bottom:clamp(40px,5vw,72px)}
main>section>.wrap>:last-child,main>section>.wrap>:last-child>:last-child{margin-bottom:0}
.lapps{padding-bottom:4px}
.lapps small,.src,p.src,.lapps-src{display:block;margin-top:14px}
.lx-od{padding:14px 18px!important}
.lx-outline{padding:18px 22px!important}
details:not(.qc-list):not(.lx-od){padding-top:14px;padding-bottom:14px}
.ca{padding-top:14px!important;padding-bottom:14px!important}
.qc-bar,.qc-ex{padding-top:14px;padding-bottom:14px}
.st-eyebrow,.pill,.eb{padding-left:max(14px,1em);padding-right:max(14px,1em)}
main>section:not([class]){padding-top:clamp(32px,4vw,56px)}
.xtw caption,.cx-wrap caption,.st-table-wrap caption,table caption{padding:12px 16px}
.xtw>:last-child:not(table),.xtw p{padding:14px 18px;margin:0}
.xsnap{padding-top:14px!important;padding-bottom:14px!important}
.tabs{padding:6px!important}
.bar{padding-top:14px!important;padding-bottom:14px!important}

/* eyebrow "-- " prefix: readable on the ink pill */
html .sh .eb::before,html .light .sh .eb::before{color:var(--pink,#ffb0c2);opacity:1}
/* token flow diagram: labels fit their boxes, edge strokes not clipped */
.vis .vd .t-sm{font-size:12px;letter-spacing:0}
.vis svg{overflow:visible}
/* audit fixes */
:root:not([data-theme=dark]) :is(.viz,.vis,.anc) svg text.h{fill:#1f1a23!important}
:root:not([data-theme=dark]) :is(.viz,.vis,.anc) svg text.s{fill:#5c5466!important}
.ledger{max-width:100%;min-width:0}
.ledger .l-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
@media (max-width:640px){.xsf input{flex:none!important;height:48px!important;width:100%}}
th img.thl{display:inline-block!important;vertical-align:-3px}
:root:not([data-theme=dark]) .xsnap b{color:#8f5f00!important}
.sim-kpis{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media (max-width:640px){.sim-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.term .cm,.cb .cm,pre .cm{color:#b8adc2}
/* decorative hex peeks from behind the card corner instead of covering corner labels */
.vis::after,.viz::after{z-index:-1!important;top:-30px!important;right:-28px!important}
.vis,.viz{isolation:auto}
/* home 3-step flow: one panel style, captions inside the column, no bleed */
.flow .step{background:transparent!important;border-radius:0!important;box-shadow:none!important;min-width:0}
.flow .step+.step{border-left:2px solid rgba(31,26,35,.12)}
.flow .sig-cap{display:block;margin-top:12px;padding:0 2px}
.flow .viz{max-width:100%;min-width:0}
.flow .viz .row{flex-wrap:wrap}
.flow .lock span{white-space:normal}
@media (max-width:760px){.flow .step+.step{border-left:0;border-top:2px solid rgba(31,26,35,.12)}}
[data-theme=dark] .flow .step+.step{border-color:#3a3042}

/* hero ledger: drop the hash and txs columns when the card is narrow so status always fits */
@media (max-width:1700px){.ledger th:nth-child(4),.ledger td:nth-child(4),.ledger th:nth-child(5),.ledger td:nth-child(5){display:none}}
@media (max-width:420px){.ledger th,.ledger td{padding-left:8px;padding-right:8px}.ledger td:nth-child(2){max-width:150px;overflow:hidden;text-overflow:ellipsis}}
/* anchoring diagram: the svg itself carries .anc, so the shared text rules missed it */
:root:not([data-theme=dark]) svg.anc text.h{fill:#1f1a23!important}
:root:not([data-theme=dark]) svg.anc text:is(.s,.t){fill:#5c5466!important}
/* learn "More courses"/"Quick guides": no card around the bordered summary */
details:has(>summary.lx-more){border:0!important;box-shadow:none!important;background:none!important;padding:0!important}
/* source notes sit clear of the sticker shadow above them */
:is(p,div).src,.v-src{margin-top:28px!important}
/* newsletter popup (newsletter.js), from main's newsletter-popup */
.nlp{position:fixed;z-index:60;right:32px;bottom:32px;width:320px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:24px;background:var(--st-card,#fff8f8);color:#1f1a23;border:2px solid #1f1a23;border-radius:24px;box-shadow:6px 6px 0 #1f1a23;transform:translateX(calc(100% + 48px));opacity:0;transition:transform .35s,opacity .35s}
.nlp.in{transform:none;opacity:1}
@media (max-width:767px){.nlp{right:16px;bottom:16px}}
.nlp h4{margin:0 0 12px;padding-right:40px;font:400 26px/1.05 "Battlefin",Impact,sans-serif}
.nlp p{margin:0 0 16px;font-size:16px;line-height:1.4}
.nlp-x{position:absolute;top:20px;right:20px;width:32px;height:32px;border:0;border-radius:50%;background:#1f1a23;color:#fff8f8;font-size:20px;line-height:32px;cursor:pointer;transition:transform .3s}
.nlp-x:hover{transform:rotate(90deg)}
.nlp input[type=email]{width:100%;box-sizing:border-box;padding:12px 0;border:0;border-bottom:1.5px solid #706a70;background:transparent;color:inherit;font:inherit;outline:none}
.nlp input.on,.nlp input:focus{border-color:#7d42ab}
.nlp input::placeholder{color:#6b6474}
.nlp-msg{display:block;min-height:20px;margin:8px 0 16px;font-size:14px}
.nlp-msg.err{color:#b42f2f}
.nlp-row{display:flex;gap:8px}
.nlp-row button{flex:1;height:44px;border-radius:999px;font:700 15px inherit;font-family:inherit;cursor:pointer}
.nlp-no{border:0;background:none;color:#5c5466}
.nlp-no:hover{color:#1f1a23}
.nlp-go{border:2px solid #1f1a23;background:#ff7ea3;color:#1f1a23;box-shadow:3px 3px 0 #1f1a23}
.nlp-go:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
:root[data-theme=dark] .nlp{background:#221b29;color:#f5eeee;border-color:#6b5a7c;box-shadow:6px 6px 0 #000}
:root[data-theme=dark] .nlp-x{background:#f5eeee;color:#1f1a23}
:root[data-theme=dark] .nlp-no{color:#cdc4cc}:root[data-theme=dark] .nlp-no:hover{color:#fff}
:root[data-theme=dark] .nlp input::placeholder{color:#a99cb2}
:root[data-theme=dark] .nlp-msg.err{color:#ff8a8a}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .nlp{background:#221b29;color:#f5eeee;border-color:#6b5a7c;box-shadow:6px 6px 0 #000}:root:not([data-theme=light]) .nlp-x{background:#f5eeee;color:#1f1a23}:root:not([data-theme=light]) .nlp-no{color:#cdc4cc}:root:not([data-theme=light]) .nlp input::placeholder{color:#a99cb2}:root:not([data-theme=light]) .nlp-msg.err{color:#ff8a8a}}
/* plain-words step rows: wrap inside narrow cards instead of spilling out */
.step .viz .row{flex-wrap:wrap;row-gap:6px;min-width:0;max-width:100%}
.step .viz .row>span{min-width:0;overflow-wrap:anywhere}
