/* Information-page-only reading scale. Original headings, surfaces and disclosures stay intact. */
:is(.page-base--how-it-works, .page-base--backing) {
  --max: 1200px;
  --gutter: 24px;
  --info-surface: linear-gradient(180deg, rgba(17, 26, 44, .9), rgba(11, 17, 30, .94));
  --info-border: rgba(0, 212, 255, .22);
  --info-body: 18px;
  --info-card-title: 24px;
  --info-value: 18px;
  --info-note: 14px;
  --info-ink: #e2e9f2;
  --info-muted: #b8c9da;
  font-size: 16px;
  line-height: normal;
}
:is(.page-base--how-it-works, .page-base--backing) .page {
  background: radial-gradient(800px 400px at 50% 0%, rgba(32, 148, 243, .07), transparent 70%), #0b111e;
}
:is(.page-base--how-it-works, .page-base--backing) #main {
  background: radial-gradient(rgba(0, 212, 255, .05) 1px, transparent 1.4px) 15px 15px / 30px 30px;
}
:is(.page-base--how-it-works, .page-base--backing) h1 {
  font-size: clamp(40px, 5.4vw, 66px);
  line-height: 1.04;
  letter-spacing: -.02em;
  font-weight: 900;
}
:is(.page-base--how-it-works, .page-base--backing) h2 {
  font-size: clamp(30px, 3.6vw, 44px);
  line-height: 1.1;
  letter-spacing: -.015em;
  font-weight: 900;
}
:is(.page-base--how-it-works, .page-base--backing) h3 {
  font-size: var(--info-card-title);
  line-height: 1.3;
  letter-spacing: -.02em;
  font-weight: 700;
}
/* The guide's card headings are H2s semantically, not larger section titles. */
.page-base--how-it-works .base-guide-intro h2 {
  margin-bottom: var(--s-2);
  font-size: var(--info-card-title);
  line-height: 1.3;
  letter-spacing: -.02em;
  font-weight: 700;
}
:is(.page-base--how-it-works, .page-base--backing) :is(.base-section-heading p, .base-faq-intro p, .base-intro, .base-document-note, .base-steps p, .base-choice__card p, .base-data-card > p, .base-safeguards > div > p, .base-safeguard-list p, .base-controls-note p, .base-empty-state p, .base-notice p, .base-faq details p) {
  max-width: 68ch;
  color: var(--info-ink);
  font-size: var(--info-body);
  line-height: 1.65;
  letter-spacing: normal;
}
:is(.page-base--how-it-works, .page-base--backing) :is(.base-guide-intro > .base-wrap > .base-section-heading p, .base-lede) {
  font-size: var(--info-body);
  line-height: 1.65;
  font-weight: 400;
  letter-spacing: normal;
}
:is(.page-base--how-it-works, .page-base--backing) :is(.base-section-label, .base-eyebrow) {
  color: #00d4ff;
  font-size: var(--info-note);
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: .16em;
}
:is(.page-base--how-it-works, .page-base--backing) .base-section-label { gap: 14px; }
:is(.page-base--how-it-works, .page-base--backing) .base-section-label::after { background: linear-gradient(90deg, rgba(0, 212, 255, .45), transparent); }
:is(.page-base--how-it-works, .page-base--backing) .base-section-label > span:last-child { color: var(--info-muted); font-size: var(--info-note); }
:is(.page-base--how-it-works, .page-base--backing) .base-section { padding: 96px 0; border-bottom: 1px solid rgba(0, 212, 255, .08); }
:is(.page-base--how-it-works, .page-base--backing) .base-section--soft { background: radial-gradient(700px 360px at 50% 100%, rgba(0, 212, 255, .06), transparent 70%); }
:is(.page-base--how-it-works, .page-base--backing) .base-section-heading { gap: 48px; }
:is(.page-base--how-it-works, .page-base--backing) .base-section-heading p { max-width: 62ch; }
:is(.page-base--how-it-works, .page-base--backing) .base-text-link { font-size: 16px; font-weight: 600; }
:is(.page-base--how-it-works, .page-base--backing) main :is(.btn, .btn-ghost) {
  font-size: 16px;
  line-height: normal;
  font-weight: 700;
  letter-spacing: normal;
  padding: 15px 28px;
  border-radius: 12px;
}
:is(.page-base--how-it-works, .page-base--backing) main .btn { background: var(--cta); box-shadow: 0 0 34px rgba(32, 148, 243, .45); }
:is(.page-base--how-it-works, .page-base--backing) main .btn:hover { background: var(--cta-hover); box-shadow: 0 0 56px rgba(32, 148, 243, .7); }

/* The original trust-card surface, reused for information rather than a purchase action. */
:is(.page-base--how-it-works, .page-base--backing) :is(.base-info-panel, .base-data-card, .base-backing-panel, .base-choice__card, .base-routes) {
  min-width: 0;
  padding: 24px;
  background: var(--info-surface);
  border: 1px solid var(--info-border);
  border-radius: 20px;
  box-shadow: var(--elev-3), var(--keyline), 0 0 50px rgba(32, 148, 243, .1) inset;
}
.base-info-process { margin-bottom: 32px; }
.base-info-process .base-steps { margin: 24px 0 0; }
.base-info-process .base-guide-actions { margin: 28px 0 0; }
.base-info-process .base-steps li { min-width: 0; }
:is(.page-base--how-it-works, .page-base--backing) .base-step-number {
  background: rgba(32, 148, 243, .12);
  border-color: rgba(0, 212, 255, .22);
  font-size: var(--info-note);
}
.base-info-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: center; }
.page-base--backing .base-document-hero { padding-top: 64px; padding-bottom: 64px; }
.base-info-hero .base-intro { max-width: none; margin-bottom: 0; }
.base-info-hero h1 { max-width: 8ch; }
.base-info-hero .base-lede { margin-bottom: 0; }
:is(.page-base--how-it-works, .page-base--backing) .base-document-section { padding-top: 64px; }
:is(.page-base--how-it-works, .page-base--backing) .base-document-note { max-width: 68ch; }
:is(.page-base--how-it-works, .page-base--backing) .base-notice {
  padding: 24px;
  border-radius: 20px;
  border-color: rgba(0, 212, 255, .22);
  background: var(--info-surface);
}
:is(.page-base--how-it-works, .page-base--backing) .base-notice > strong { font-size: var(--info-body); line-height: 1.5; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-card__head { align-items: flex-start; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-card__head :is(img, .base-square) { margin-top: 4px; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list { font-size: var(--info-note); line-height: 1.6; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list dt { color: var(--info-muted); font-weight: 500; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list dd { color: #fff; font-size: var(--info-value); line-height: 1.6; font-weight: 550; letter-spacing: normal; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list dd a { font-size: inherit; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-live__note, .base-live__status, .base-choice__note, .base-backing-foot p, .base-unavailable, .base-routes figcaption, .base-routes__note) { font-size: var(--info-note); line-height: 1.65; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-choice__card a, .base-transparency-link, .base-routes__list li) { font-size: 16px; line-height: 1.6; }
:is(.page-base--how-it-works, .page-base--backing) .base-table { font-size: var(--info-value); line-height: 1.6; background: rgba(8, 14, 26, .78); }
:is(.page-base--how-it-works, .page-base--backing) .base-table caption { color: var(--info-muted); font-size: var(--info-note); line-height: 1.65; }
:is(.page-base--how-it-works, .page-base--backing) .base-controls-note { border-color: var(--info-border); background: var(--info-surface); }
.page-base--backing .base-live__bar .base-quote-button { width: auto; min-height: 48px; padding: 12px 22px; background: var(--cta); border-color: var(--cta); color: #fff; font-size: 16px; font-weight: 700; }
.page-base--backing .base-live__bar .base-quote-button:hover:not(:disabled) { background: var(--cta-hover); border-color: var(--cta-hover); }

/* Keep supporting disclosures readable too, including shared components on these routes only. */
:is(.page-base--how-it-works, .page-base--backing) :is(.base-contract p, .base-contract__label a, .base-small-label, .base-routes__title, .base-routes__note, .base-network-label, .base-policy-badge, .base-ratio-side p, .base-ratio-center p, .base-ratio-center strong, .base-safeguard-list article > span, .base-back, .base-status, .base-disclaimer p, .base-formula > span:last-child, .base-history > summary, .base-footer-notes p, .footer__tagline, .footer__links a, .footer__base a, .base-continuity > a) {
  font-size: var(--info-note);
  line-height: 1.65;
}
:is(.page-base--how-it-works, .page-base--backing) :is(.base-contract p, .base-routes__note, .base-disclaimer p, .base-footer-notes p, .footer__tagline) { color: var(--info-muted); }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-verify > summary, .base-verify__body > p, .base-swap-resources > p, .base-swap-resources h2 > span, .base-swap-resources__grid a, .base-swap-resources__grid small, .base-copy-status) { font-size: var(--info-note); line-height: 1.65; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-verify__body > p, .base-swap-resources > p, .base-swap-resources h2 > span, .base-swap-resources__grid small) { color: var(--info-muted); }
:is(.page-base--how-it-works, .page-base--backing) .base-swap-resources h2 { flex-wrap: wrap; font-size: var(--info-value); line-height: 1.5; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-contract__address code, .base-routes__addr) { font-size: var(--info-value); line-height: 1.6; overflow-wrap: anywhere; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-contract p code, .base-data-card > p code, .base-footer-notes code) { font-size: 1em; overflow-wrap: anywhere; }
:is(.page-base--how-it-works, .page-base--backing) .base-contract p + p { margin-top: 12px; }
:is(.page-base--how-it-works, .page-base--backing) .base-contract__address { align-items: flex-start; margin: 16px 0; }
:is(.page-base--how-it-works, .page-base--backing) .base-continuity p { font-size: var(--info-body); line-height: 1.65; color: var(--info-ink); max-width: 68ch; }
:is(.page-base--how-it-works, .page-base--backing) .base-continuity strong { font-size: var(--info-value); line-height: 1.5; }
:is(.page-base--how-it-works, .page-base--backing) .base-continuity { align-items: flex-start; }
:is(.page-base--how-it-works, .page-base--backing) :is(.base-notice p + p, .base-controls-note p + p) { margin-top: 16px; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list > div { padding-top: 20px; padding-bottom: 20px; }
:is(.page-base--how-it-works, .page-base--backing) .base-unavailable { white-space: normal; }
.page-base--backing .base-live__list dd a { font-size: inherit; line-height: inherit; }
.page-base--backing .base-live__warning { font-size: var(--info-body); line-height: 1.65; }
.page-base--backing .base-coverage--historical::after { font-size: var(--info-note); }
.page-base--backing .base-table th, .page-base--backing .base-table td { padding: 20px 24px; vertical-align: top; overflow-wrap: anywhere; }
.page-base--backing .base-table td { color: var(--info-ink); }
.page-base--backing .base-table thead th { color: var(--info-muted); font-size: var(--info-note); }
.page-base--backing .base-table tbody th { color: #fff; font-weight: 550; }
.page-base--backing .base-table--supply { table-layout: fixed; }
.page-base--backing .base-table--supply thead th:first-child { width: 28%; }
.page-base--backing .base-table--supply thead th:nth-child(2) { width: 37%; }
.page-base--backing .base-formula p { font-size: var(--info-value); line-height: 1.65; }

/* Each original SVG gets its own IDs, so multiple helices never share a mask or gradient. */
.base-info-conduit--guide-steps { --base-helix-flow: url(#tlcFlow-guide-steps); }
.base-info-conduit--guide-backing { --base-helix-flow: url(#tlcFlow-guide-backing); }
.base-info-conduit--guide-faq { --base-helix-flow: url(#tlcFlow-guide-faq); }
.base-info-conduit--backing-header { --base-helix-flow: url(#tlcFlow-backing-header); }
.base-info-conduit { max-width: 760px; margin: 0 auto 22px; pointer-events: none; }
.base-info-conduit .trust__conduit { margin: -6px 0 14px; }
.base-info-conduit .trust__conduit svg { width: 100%; height: auto; max-height: 96px; }
.base-info-conduit :is(.tlc-front, .tlc-back, .tlc-rungs line) { stroke: var(--base-helix-flow); }
.base-info-conduit .tlc-gate--integrated .tlc-join { fill: none; stroke: var(--base-helix-flow); stroke-width: 1.5; stroke-linecap: round; opacity: .55; }
.base-info-conduit .tlc-gate--integrated .tlc-mark { opacity: .92; }
.base-info-conduit--guide-backing { margin-top: 24px; margin-bottom: 16px; }
.base-info-conduit--guide-faq { margin-top: 24px; }

/* Native details retain keyboard operation and work without JavaScript. */
.page-base--how-it-works .base-faq-layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; }
.page-base--how-it-works .base-faq-intro p { max-width: 40ch; }
.page-base--how-it-works .base-faq { display: grid; gap: 10px; min-width: 0; }
.page-base--how-it-works .base-faq details { min-width: 0; border: 1px solid rgba(0, 212, 255, .14); border-radius: 13px; background: rgba(8, 14, 26, .78); }
.page-base--how-it-works .base-faq details:hover, .page-base--how-it-works .base-faq details[open] { border-color: rgba(0, 212, 255, .4); }
.page-base--how-it-works .base-faq summary { min-height: 68px; padding: 20px 24px; color: #fff; font-size: var(--info-body); font-weight: 600; line-height: 1.5; }
.page-base--how-it-works .base-faq details p { margin: 0; padding: 0 20px 20px; overflow-wrap: anywhere; }
.page-base--how-it-works .base-faq p code { font-size: .875em; }

@media (max-width: 979px) {
  :is(.page-base--how-it-works, .page-base--backing) .base-swap-resources__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .base-info-hero { grid-template-columns: 1fr; gap: 28px; }
  .base-info-hero h1 { max-width: none; }
  .page-base--how-it-works .base-faq-layout { grid-template-columns: 1fr; gap: 32px; }
  .page-base--how-it-works .base-faq-intro { max-width: 620px; }
  .page-base--how-it-works .base-faq-intro p { max-width: none; }
  .page-base--how-it-works .base-faq-intro .base-info-conduit { max-width: 420px; margin-left: 0; }
  :is(.page-base--how-it-works, .page-base--backing) .base-data-list > div { grid-template-columns: 1fr; gap: 6px; }
  :is(.page-base--how-it-works, .page-base--backing) .base-data-list dd { text-align: left; }
}
@media (max-width: 720px) {
  :is(.page-base--how-it-works, .page-base--backing) { --gutter: 16px; --info-body: 16px; --info-card-title: 20px; --info-value: 16px; }
  :is(.page-base--how-it-works, .page-base--backing) h1 { font-size: clamp(28px, 7.6vw, 38px); line-height: 1.1; }
  :is(.page-base--how-it-works, .page-base--backing) h2 { font-size: clamp(24px, 6.4vw, 32px); }
  :is(.page-base--how-it-works, .page-base--backing) :is(.base-section-label, .base-eyebrow) { letter-spacing: .12em; }
  :is(.page-base--how-it-works, .page-base--backing) .base-section { padding: 56px 0; }
  .page-base--backing .base-document-hero { padding-top: 34px; padding-bottom: 44px; }
  :is(.page-base--how-it-works, .page-base--backing) .base-document-section { padding-top: 44px; }
  :is(.page-base--how-it-works, .page-base--backing) .base-section-heading { gap: 24px; }
  :is(.page-base--how-it-works, .page-base--backing) :is(.base-info-panel, .base-data-card, .base-backing-panel, .base-choice__card, .base-routes, .base-notice) { padding: 18px 15px; }
  .base-info-conduit .trust__conduit svg { max-height: 64px; }
  .page-base--how-it-works .base-faq summary { padding: 18px; }
  .page-base--how-it-works .base-faq details p { padding: 0 16px 18px; }
  .base-info-process .base-steps { grid-template-columns: 1fr; gap: 24px; }
  .base-info-process .base-steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 0 16px; padding-top: 20px; }
  .base-info-process .base-step-number { grid-row: 1 / 3; margin-bottom: 0; }
  .base-info-process .base-steps :is(h2, h3) { margin-bottom: 8px; }
  .base-info-process .base-guide-actions { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
  .base-info-process .base-guide-actions .btn { width: 100%; }
  .base-info-process .base-guide-actions .base-text-link { justify-content: center; }
}
@media (max-width: 380px) {
  :is(.page-base--how-it-works, .page-base--backing) h1 { font-size: 27px; }
}

/* A local reading rail; the primary navigation and other routes remain untouched. */
:is(.page-base--how-it-works, .page-base--backing) { --info-anchor: 84px; }
:is(.page-base--how-it-works, .page-base--backing) :target { scroll-margin-top: var(--info-anchor); }
.base-info-nav { position: sticky; top: 0; z-index: 40; border-bottom: 1px solid rgba(0, 212, 255, .14); background: #0b111e; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.base-info-nav__inner { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 32px; min-height: 64px; }
.base-info-nav__title { color: #ecf4fb; font-size: var(--info-note); font-weight: 650; letter-spacing: .015em; }
.base-info-nav__links { display: flex; align-items: center; gap: 4px; min-width: 0; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--rail-left, 0px), #000 calc(100% - var(--rail-right, 0px)), transparent); mask-image: linear-gradient(90deg, transparent, #000 var(--rail-left, 0px), #000 calc(100% - var(--rail-right, 0px)), transparent); }
.base-info-nav__links::-webkit-scrollbar { width: 0; height: 0; }
.base-info-nav a { flex: none; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 13px; color: var(--info-muted); font-size: var(--info-note); font-weight: 550; white-space: nowrap; }
.base-info-nav__links a { position: relative; }
.base-info-nav__links a::after { position: absolute; right: 13px; bottom: 3px; left: 13px; height: 2px; background: transparent; content: ''; }
.base-info-nav__links a[aria-current] { color: #fff; }
.base-info-nav__links a[aria-current]::after { background: #00d4ff; box-shadow: 0 0 12px rgba(0, 212, 255, .35); }
.base-info-nav a:hover { color: #7ae5ff; }
.base-info-nav a.base-info-nav__exit { gap: 10px; padding-right: 0; color: #6edcff; }
.base-info-nav a:focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; border-radius: 8px; }

/* More structured reading surfaces, using the existing reference type and card tokens. */
.page-base--how-it-works .base-guide-intro { padding-top: 72px; }
.page-base--how-it-works .base-guide-intro > .base-wrap > .base-section-heading { align-items: flex-start; }
.page-base--how-it-works .base-guide-intro .base-status { margin-top: 12px; min-height: 28px; padding: 0 12px; }
.base-info-process .base-steps { gap: 16px; }
.base-info-process .base-steps li { padding: 20px 18px; border: 1px solid rgba(0, 212, 255, .12); border-radius: 12px; background: rgba(6, 13, 24, .4); }
.base-info-process .base-steps li:hover { border-color: rgba(0, 212, 255, .32); }
.base-info-process .base-step-number { margin-bottom: 22px; background: linear-gradient(145deg, rgba(32, 148, 243, .18), rgba(0, 212, 255, .03)); }
.base-info-process .base-steps :is(h2, h3) { min-height: 0; }
.base-info-process .base-guide-actions { border-top: 1px solid rgba(0, 212, 255, .12); padding-top: 24px; }
.page-base--how-it-works .base-choice { border-top: 0; padding-top: 4px; gap: 20px; }
.page-base--how-it-works .base-choice__card { display: flex; flex-direction: column; align-items: flex-start; }
.page-base--how-it-works .base-choice__card a { margin-top: auto; padding-top: 12px; }
.page-base--how-it-works .base-routes__grid { gap: 48px; }
.page-base--how-it-works .base-routes__column + .base-routes__column { border-left: 1px solid rgba(0, 212, 255, .14); padding-left: 32px; }
.page-base--how-it-works .base-routes__list li { background: rgba(6, 13, 24, .45); border-color: rgba(0, 212, 255, .15); padding: 16px 18px; }
.page-base--how-it-works .base-safeguard-list { padding: 28px; border: 1px solid var(--info-border); border-radius: 20px; background: var(--info-surface); }
.page-base--how-it-works .base-transparency-grid { gap: 24px; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-card__head { padding-bottom: 20px; margin-bottom: 4px; border-bottom: 1px solid rgba(0, 212, 255, .16); }
:is(.page-base--how-it-works, .page-base--backing) .base-data-card__head h3 { margin-bottom: 0; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-list > div:first-child { border-top: 0; }
:is(.page-base--how-it-works, .page-base--backing) .base-data-card .base-data-list dd { font-size: var(--info-value); font-weight: 550; line-height: 1.6; }
.page-base--backing .base-document-hero { padding-top: 36px; }
.page-base--backing .base-info-hero { align-items: start; }
.page-base--backing .base-info-hero h1 { margin-top: 18px; }
.page-base--backing .base-notice { border-left: 3px solid #c4ac79; background: linear-gradient(115deg, rgba(77, 65, 37, .14), rgba(11, 17, 30, .94)); }
.page-base--backing .base-document-section { padding-bottom: 24px; }
.page-base--backing .base-live__bar { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px; align-items: center; margin: 28px 0 20px; padding: 20px 24px; border: 1px solid var(--info-border); border-radius: 16px; background: var(--info-surface); }
.page-base--backing .base-live__status { margin: 0; max-width: 64ch; }
.page-base--backing .base-live__list { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 0; border: 0; background: none; }
.page-base--backing .base-live__list > div { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; grid-column: span 2; min-width: 0; min-height: 126px; padding: 22px; border: 1px solid rgba(0, 212, 255, .13); border-radius: 14px; background: rgba(8, 14, 26, .78); }
.page-base--backing .base-live__list > div:nth-child(n+4) { grid-column: span 3; }
.page-base--backing .base-live__list dt { font-size: var(--info-note); line-height: 1.6; }
.page-base--backing .base-live__list dd { width: 100%; color: #e8f4ff; text-align: left; font-size: var(--info-value); font-weight: 550; line-height: 1.6; }
.page-base--backing .base-live__list > div:nth-child(-n+3) dd { font-size: 24px; letter-spacing: -.02em; }
.page-base--backing .base-live__list .base-live__value { font-size: inherit; }
.page-base--backing .base-live__list .base-live__note { margin-top: 8px; color: var(--info-muted); font-size: var(--info-note); font-weight: 400; }
.page-base--backing .base-live__list [data-live="readAt"] { font-size: var(--info-note); }
.page-base--backing .base-live > .base-document-note:last-child { margin-top: 24px; }
.page-base--backing .base-controls-note { box-shadow: none; border-left: 3px solid #6895b8; border-radius: 16px; }
.page-base--backing .base-formula { padding: 28px; border-color: var(--info-border); border-radius: 20px; background: var(--info-surface); }
.page-base--backing .base-formula + .base-document-note { margin-top: 20px; }
.page-base--backing .base-empty-state { border-style: solid; border-color: var(--info-border); border-radius: 20px; background: var(--info-surface); }
.page-base--backing .base-table-scroll { border-color: var(--info-border); border-radius: 16px; scrollbar-color: #31516a #0b1422; }
.page-base--backing .base-table tbody tr:nth-child(even) { background: rgba(21, 37, 57, .25); }
.page-base--backing .base-table tbody tr:hover { background: rgba(32, 148, 243, .05); }

/* Search is progressive enhancement: all native answers are visible without this script. */
.page-base--how-it-works .base-faq-layout { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 64px; }
.page-base--how-it-works .base-faq-intro { position: sticky; top: 96px; }
.base-faq-content { min-width: 0; }
.base-faq-controls { margin: 0 0 20px; }
.base-faq-search { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 5px 8px 5px 18px; border: 1px solid rgba(0, 212, 255, .24); border-radius: 13px; background: rgba(8, 14, 26, .85); color: #7f9fb6; }
.base-faq-search:focus-within { border-color: #00d4ff; box-shadow: 0 0 0 3px rgba(0, 212, 255, .08); }
.base-faq-search > svg { flex: none; }
.base-faq-search input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: #fff; font: inherit; font-size: var(--info-body); }
.base-faq-search input::placeholder { color: var(--info-muted); opacity: 1; }
.base-faq-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.base-faq-clear { flex: none; width: 44px; height: 44px; border: 0; border-radius: 8px; color: #c6dbe9; background: transparent; font-size: 24px; cursor: pointer; }
.base-faq-clear:disabled { opacity: .3; cursor: default; }
.base-faq-clear:not(:disabled):hover { background: rgba(32, 148, 243, .1); }
.base-faq-topics { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.base-faq-topics button { min-height: 44px; padding: 10px 14px; border: 1px solid rgba(125, 161, 191, .16); border-radius: 9px; background: transparent; color: var(--info-muted); font: inherit; font-size: var(--info-note); font-weight: 550; cursor: pointer; }
.base-faq-topics button[aria-pressed="true"] { background: rgba(32, 148, 243, .12); border-color: rgba(0, 212, 255, .35); color: #8eeaff; }
.base-faq-topics button:hover { border-color: #398ba9; color: #fff; }
.page-base--how-it-works .base-faq-count { margin: 16px 0 0; color: var(--info-muted); font-size: var(--info-note); line-height: 1.5; }
.page-base--how-it-works .base-faq { gap: 12px; }
.page-base--how-it-works .base-faq details { background: rgba(8, 14, 26, .55); }
.page-base--how-it-works .base-faq details[open] { background: var(--info-surface); }
.page-base--how-it-works .base-faq summary { display: grid; grid-template-columns: 24px minmax(0, 1fr) 14px; gap: 12px; align-items: start; padding: 24px; }
.page-base--how-it-works .base-faq summary::before { content: attr(data-number); color: var(--info-muted); font-family: var(--mono); font-size: var(--info-note); line-height: 1.9; }
.page-base--how-it-works .base-faq summary::after { margin-top: 5px; }
.page-base--how-it-works .base-faq details[open] summary::before { color: #00d4ff; }
.page-base--how-it-works .base-faq details p { padding-left: 60px; padding-right: 32px; padding-bottom: 24px; }
.page-base--how-it-works .base-faq details p + p { padding-top: 0; }
.base-faq-empty { padding: 32px 24px; text-align: center; border: 1px solid var(--info-border); border-radius: 16px; background: var(--info-surface); }
.page-base--how-it-works .base-faq-empty p { margin: 0 0 8px; color: #fff; font-size: 17px; font-weight: 600; }
.base-faq-empty > span { color: #a4b8cb; font-size: 14px; }
.base-faq-empty button { display: flex; justify-content: center; gap: 12px; min-height: 44px; margin: 16px auto 0; padding: 8px; border: 0; color: #7be4ff; background: transparent; font: inherit; font-size: 14px; cursor: pointer; }
.base-faq-content button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

@media (max-width: 1100px) {
  .base-info-nav__inner { gap: 20px; }
  .base-info-process .base-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .base-info-process .base-steps :is(h2, h3) { min-height: 0; }
  .page-base--how-it-works .base-faq-layout { gap: 36px; }
  :is(.page-base--how-it-works, .page-base--backing) .base-transparency-grid { grid-template-columns: 1fr; }
  .page-base--how-it-works .base-safeguards { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 979px) {
  .page-base--how-it-works .base-faq-layout { grid-template-columns: 1fr; }
  .page-base--how-it-works .base-faq-intro { position: static; max-width: 680px; }
  .page-base--backing .base-info-hero { gap: 32px; }
  .page-base--backing .base-info-hero h1 { margin-top: 0; }
  .page-base--how-it-works .base-routes__grid { grid-template-columns: 1fr; }
  .page-base--how-it-works .base-routes__column + .base-routes__column { padding-left: 0; padding-top: 24px; border-left: 0; border-top: 1px solid var(--info-border); }
}
@media (max-width: 720px) {
  :is(.page-base--how-it-works, .page-base--backing) { --info-anchor: 120px; }
  .base-info-nav__inner { grid-template-columns: minmax(0, 1fr) auto; gap: 0 16px; padding-top: 6px; padding-bottom: 4px; }
  .base-info-nav__links { grid-row: 2; grid-column: 1 / -1; }
  .base-info-nav a { padding-right: 12px; padding-left: 12px; }
  .base-info-nav__links a:first-child { padding-left: 0; }
  .base-info-nav__links a:first-child::after { left: 0; }
  .base-info-nav a.base-info-nav__exit { grid-row: 1; grid-column: 2; min-height: 44px; }
  .page-base--how-it-works .base-guide-intro { padding-top: 40px; }
  .page-base--how-it-works .base-guide-intro .base-status { margin-top: 0; }
  .base-info-process .base-steps { grid-template-columns: 1fr; gap: 12px; }
  .base-info-process .base-steps li { grid-template-columns: 32px minmax(0, 1fr); gap: 0 14px; padding: 18px 14px; }
  .base-info-process .base-step-number { width: 32px; height: 32px; margin: 0; }
  .base-info-process .base-step-number { grid-row: 1; }
  .base-info-process .base-steps :is(h2, h3) { align-self: center; margin: 0; }
  .base-info-process .base-steps p { grid-column: 1 / -1; margin: 12px 0 0; }
  .page-base--how-it-works .base-choice { gap: 14px; }
  .page-base--how-it-works .base-routes__grid { gap: 32px; }
  .page-base--how-it-works .base-routes__column + .base-routes__column { padding-left: 0; padding-top: 24px; border-left: 0; border-top: 1px solid var(--info-border); }
  .page-base--how-it-works .base-safeguard-list { padding: 22px 18px; }
  .page-base--backing .base-live__bar { grid-template-columns: 1fr; gap: 16px; padding: 18px; }
  .page-base--backing .base-live__bar button { width: 100%; }
  .page-base--backing .base-live__list { grid-template-columns: 1fr; gap: 10px; }
  .page-base--backing .base-live__list > div, .page-base--backing .base-live__list > div:nth-child(n+4) { grid-column: auto; min-height: 104px; padding: 18px; gap: 12px; }
  .page-base--backing .base-live__list > div:nth-child(-n+3) dd { font-size: 22px; }
  .page-base--backing .base-formula { padding: 24px 16px; }
  .base-faq-search { gap: 10px; padding-left: 14px; }
  .base-faq-topics { gap: 6px; }
  .base-faq-topics button { padding: 10px 12px; }
  .page-base--how-it-works .base-faq summary { grid-template-columns: 20px minmax(0, 1fr) 12px; gap: 10px; padding: 18px 16px; }
  .page-base--how-it-works .base-faq details p { padding-left: 18px; padding-right: 18px; }
  /* Explicit table/row/cell roles preserve semantics when the supply rows stack. */
  .page-base--backing .base-table--supply { display: block; min-width: 0; }
  .page-base--backing .base-table--supply caption { display: block; padding: 18px; }
  .page-base--backing .base-table--supply thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .page-base--backing .base-table--supply tbody { display: block; }
  .page-base--backing .base-table--supply tbody tr { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 22px 18px; border-top: 1px solid var(--info-border); }
  .page-base--backing .base-table--supply tbody :is(th, td) { display: block; width: auto; padding: 0; border: 0; }
  .page-base--backing .base-table--supply tbody th { font-size: var(--info-card-title); line-height: 1.4; }
  .page-base--backing .base-table--supply td::before { display: block; margin-bottom: 4px; color: var(--info-muted); font-size: var(--info-note); font-weight: 500; content: attr(data-label); }
}
@media (max-width: 480px) {
  :is(.page-base--how-it-works, .page-base--backing) .base-swap-resources__grid { grid-template-columns: minmax(0, 1fr); }
}