@font-face { font-family:"Manrope"; src:url("/fonts/manrope.woff2") format("woff2"); font-weight:400 800; font-style:normal; font-display:swap; }
@font-face { font-family:"Instrument Serif"; src:url("/fonts/instrument-serif.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Instrument Serif"; src:url("/fonts/instrument-serif-italic.woff2") format("woff2"); font-weight:400; font-style:italic; font-display:swap; }

:root {
  color-scheme: light;
  --paper: #f1eee5;
  --paper-deep: #e8e3d8;
  --surface: #faf8f2;
  --ink: #171613;
  --ink-soft: #25231e;
  --muted: #676154;
  --rule: rgb(23 22 19 / 17%);
  --rule-strong: rgb(23 22 19 / 70%);
  --orange: #f04b25;
  --orange-light: #ff7653;
  --orange-text: #a9361d;
  --green: #164c3a;
  --green-soft: #dce8df;
  --yellow-soft: #f2e7ca;
  --display: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --body: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --serif: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --mono: "DejaVu Sans Mono", Consolas, monospace;
  --content: 1240px;
  --ease-out: cubic-bezier(.2, .75, .25, 1);
  font-family: var(--body);
  scroll-behavior: smooth;
  scroll-padding-top: 94px;
  background: var(--paper);
  color: var(--ink);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #171613;
  --paper-deep: #211f1a;
  --surface: #24221d;
  --ink: #f1eee5;
  --ink-soft: #e1ddd2;
  --muted: #aaa397;
  --rule: rgb(241 238 229 / 18%);
  --rule-strong: rgb(241 238 229 / 70%);
  --green: #9dc8ac;
  --green-soft: #263a30;
  --yellow-soft: #403822;
  --orange-text: #ff8b70;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-size: 15px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--orange); color: #171613; }
a { color: inherit; }
button { color: inherit; font: inherit; }
svg { display: block; }

:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 12px;
  left: 12px;
  transform: translateY(-160%);
  padding: 10px 14px;
  background: var(--ink);
  color: var(--paper);
}

.skip-link:focus { transform: translateY(0); }

.scroll-progress {
  position: fixed;
  z-index: 60;
  top: 0;
  left: 0;
  width: var(--scroll-progress, 0%);
  height: 3px;
  background: var(--orange);
  pointer-events: none;
  transition: width 100ms linear;
}

.notice-bar {
  display: flex;
  min-height: 31px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 5px 16px;
  background: var(--ink);
  color: var(--paper);
  font: 700 9px/1.4 var(--mono);
  letter-spacing: .11em;
  text-align: center;
  text-transform: uppercase;
}

.notice-dot,
.status-pulse,
.meta-dot {
  position: relative;
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--orange);
}

.status-pulse::after {
  position: absolute;
  inset: -4px;
  border: 1px solid currentColor;
  border-radius: inherit;
  color: var(--orange);
  content: "";
  animation: pulse 2.4s ease-out infinite;
}

@keyframes pulse {
  0% { transform: scale(.65); opacity: .7; }
  100% { transform: scale(1.7); opacity: 0; }
}

.topbar {
  position: sticky;
  z-index: 50;
  top: 0;
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 10px max(28px, calc((100vw - var(--content)) / 2));
  border-bottom: 1px solid var(--rule);
  background: color-mix(in srgb, var(--paper) 93%, transparent);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  font: 750 20px/1 var(--display);
  letter-spacing: -.075em;
  text-decoration: none;
}

.brand-mark { width: 31px; height: 31px; }
.brand-logo { display:block; width:139px; height:32px; object-fit:contain; flex-shrink:0; }
.brand-logo-dark { display:none; }
:root[data-theme="dark"] .brand-logo-light { display:none; }
:root[data-theme="dark"] .brand-logo-dark { display:block; }
.brand-lockup { display:block; }
.app-brand .brand-lockup small { margin-left:43px; }
.footer-brand .brand-logo { width:122px; height:28px; }
@media(max-width:560px) { .brand-logo { width:122px; height:28px; }.app-brand .brand-lockup small { margin-left:38px; font-size:7px; } }
.brand-mark path { fill: none; stroke: var(--ink); stroke-width: 2.2; }
.brand-mark circle { fill: var(--orange); }
.brand-light { margin-left: 4px; font-weight: 450; letter-spacing: -.065em; }

.primary-nav,
.topbar-actions {
  display: flex;
  align-items: center;
}

.primary-nav { gap: clamp(16px, 2.5vw, 34px); }
.nav-link {
  position: relative;
  padding: 9px 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  transition: color 180ms ease;
}

.nav-link::after {
  position: absolute;
  right: 0;
  bottom: 3px;
  left: 0;
  height: 1px;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--orange);
  content: "";
  transition: transform 220ms var(--ease-out);
}

.nav-link:hover,
.nav-link.is-active { color: var(--ink); }
.nav-link:hover::after,
.nav-link.is-active::after { transform: scaleX(1); }

.topbar-actions { gap: 13px; }
.header-launch { display:inline-flex; flex-shrink:0; align-items:center; justify-content:center; gap:12px; min-height:42px; padding:10px 15px; border:1px solid transparent; background:var(--orange); color:#171613; font:750 12px/1.2 var(--body); text-decoration:none; white-space:nowrap; transition:background-color .2s,box-shadow .2s; }
.header-launch svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; transition:transform .2s; }
.header-launch:hover { background:var(--ink); color:var(--paper); box-shadow:3px 3px 0 var(--orange); }
.header-launch:hover svg { transform:translate(2px,-2px); }
.header-launch:focus-visible { outline:2px solid var(--orange-text); outline-offset:4px; }
@media(prefers-reduced-motion:reduce) { .header-launch,.header-launch svg { transition:none; }.header-launch:hover svg { transform:none; } }
.version-tag {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--muted);
  font: 700 9px/1.3 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}

.theme-toggle {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--rule);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: transform 250ms var(--ease-out), background-color 200ms ease, border-color 200ms ease;
}

.theme-toggle:hover { transform: rotate(-12deg); background: var(--surface); }
.theme-icon { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.theme-icon-sun { display: none; }
:root[data-theme="dark"] .theme-icon-moon { display: none; }
:root[data-theme="dark"] .theme-icon-sun { display: block; }

main { overflow: clip; }
.hero {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 87% 45%, rgb(240 75 37 / 7%), transparent 34%),
    var(--paper);
}

.hero::before {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  width: 43%;
  height: 100%;
  border-left: 1px solid var(--rule);
  background-image: linear-gradient(var(--rule) 1px, transparent 1px), linear-gradient(90deg, var(--rule) 1px, transparent 1px);
  background-position: -1px -1px;
  background-size: 48px 48px;
  content: "";
  opacity: .28;
  mask-image: linear-gradient(90deg, transparent, black 45%);
}

.hero-grid {
  display: grid;
  width: min(var(--content), 100%);
  min-height: 630px;
  grid-template-columns: minmax(0, 1.08fr) minmax(430px, .92fr);
  align-items: center;
  gap: clamp(44px, 6vw, 80px);
  margin: 0 auto;
  padding: 86px 30px 72px;
}

.hero-copy-column { position: relative; z-index: 1; }
.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 21px;
  color: var(--muted);
  font: 700 9px/1.4 var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}

.eyebrow-line { display: inline-block; width: 19px; height: 1px; background: var(--orange); }

h1,
h2,
h3,
h4,
p { margin-top: 0; }

h1 {
  max-width: 710px;
  margin-bottom: 26px;
  font: 760 clamp(58px, 6.25vw, 90px)/.91 var(--display);
  letter-spacing: -.083em;
  text-wrap: balance;
}

h1 em,
h2 em {
  color: var(--orange);
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -.065em;
}

.hero-copy {
  max-width: 480px;
  margin-bottom: 27px;
  color: var(--muted);
  font-size: clamp(16px, 1.5vw, 18px);
  line-height: 1.65;
}

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 19px; }
.button {
  display: inline-flex;
  min-height: 47px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 11px 16px;
  border: 1px solid transparent;
  font: 700 10px/1.2 var(--mono);
  letter-spacing: .035em;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform 200ms var(--ease-out), background-color 200ms ease, color 200ms ease, border-color 200ms ease;
}

.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--orange); color: #171613; }
.button-primary:hover { background: var(--ink); color: var(--paper); }
.text-link { display: inline-flex; min-height: 44px; align-items: center; color: var(--muted); font-size: 12px; font-weight: 650; text-decoration: none; }
.text-link span { display: inline-block; margin-left: 5px; color: var(--orange-text); transition: transform 180ms ease; }
.text-link:hover span { transform: translate(3px, 3px); }

.hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 19px;
  margin-top: 42px;
  color: var(--muted);
  font: 700 9px/1.5 var(--mono);
  letter-spacing: .065em;
  text-transform: uppercase;
}

.hero-meta span { display: inline-flex; align-items: center; gap: 8px; }
.hero-meta .meta-dot { width: 6px; height: 6px; }

.visual-panel {
  position: relative;
  min-height: 436px;
  padding: 21px 23px 15px;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 13%);
  background:
    radial-gradient(ellipse at 85% 72%, rgb(240 75 37 / 18%), transparent 40%),
    #191815;
  box-shadow: 0 30px 90px rgb(24 22 18 / 15%);
  color: #f1eee5;
  animation: panel-arrive 750ms var(--ease-out) both;
}

@keyframes panel-arrive {
  from { transform: translateY(22px) scale(.985); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}

.visual-panel::after {
  position: absolute;
  right: -79px;
  bottom: -129px;
  width: 280px;
  height: 280px;
  border: 1px solid rgb(240 75 37 / 24%);
  border-radius: 50%;
  content: "";
  animation: orbit 25s linear infinite;
}

@keyframes orbit { to { transform: rotate(360deg); } }
.visual-panel-top,
.visual-panel-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #aaa397;
  font: 700 8px/1.4 var(--mono);
  letter-spacing: .08em;
}

.panel-kicker { display: inline-flex; align-items: center; gap: 9px; }
.panel-code { color: var(--orange-light); }
.visual-amount { margin: 42px 0 10px; }
.visual-label { display: block; margin-bottom: 12px; color: #aaa397; font-size: 11px; }
.visual-amount strong { display: block; font: 650 clamp(25px, 3vw, 36px)/1.08 var(--display); letter-spacing: -.055em; }
.visual-amount em { color: var(--orange-light); font-family: var(--serif); font-weight: 500; }

.flow-visual {
  position: relative;
  display: grid;
  height: 127px;
  grid-template-columns: 58px minmax(28px, 1fr) 58px minmax(28px, 1fr) 58px;
  align-items: center;
  margin-top: 15px;
}

.flow-node {
  position: relative;
  z-index: 2;
  display: grid;
  justify-items: center;
  gap: 7px;
  color: #d6d1c7;
  font: 700 8px/1.2 var(--mono);
  text-align: center;
  text-transform: uppercase;
}

.node-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgb(241 238 229 / 24%);
  border-radius: 50%;
  background: #22201c;
}

.node-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: #f1eee5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}

.protocol-node .node-icon { border-color: var(--orange); background: var(--orange); }
.protocol-node .node-icon svg { stroke: #171613; }
.flow-route { position: relative; height: 2px; margin-top: -20px; background: rgb(241 238 229 / 20%); }
.route-label { position: absolute; bottom: 9px; left: 50%; width: max-content; transform: translateX(-50%); color: #aaa397; font: 7px/1.3 var(--mono); white-space: nowrap; }
.route-line { position: absolute; inset: 0; overflow: hidden; }
.route-line i { display: block; width: 18px; height: 100%; background: var(--orange); animation: travel 2.4s ease-in-out infinite; }
.reserve-route .route-line i { animation-delay: 1.2s; }
@keyframes travel { 0% { transform: translateX(-20px); opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateX(100px); opacity: 0; } }

.reserve-orbit {
  position: absolute;
  right: 21%;
  bottom: 7px;
  display: flex;
  width: 87px;
  height: 30px;
  align-items: center;
  justify-content: center;
  border: 1px dashed rgb(240 75 37 / 64%);
  border-radius: 50%;
  color: #ff987f;
  font: 7px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: rotate(-8deg);
}

.reserve-orbit i { position: absolute; top: -3px; right: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--orange); }
.visual-caption { display: flex; align-items: start; gap: 9px; padding: 11px 0 13px; border-top: 1px solid rgb(241 238 229 / 12%); }
.caption-mark { color: var(--orange-light); font: 16px/1 var(--serif); }
.visual-caption p { margin: 0; color: #aaa397; font-size: 10px; }
.visual-caption strong { color: #f1eee5; font-weight: 650; }
.visual-panel-bottom { padding-top: 12px; border-top: 1px solid rgb(241 238 229 / 12%); font-size: 7px; }
.visual-panel-bottom span:last-child { color: #ff987f; text-align: right; }

.hero-bottom {
  display: flex;
  max-width: var(--content);
  justify-content: space-between;
  margin: 0 auto;
  padding: 15px 30px;
  border-top: 1px solid var(--rule);
  color: var(--muted);
  font: 700 8px/1.4 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.hero-bottom a { display: inline-flex; min-height: 32px; align-items: center; color: var(--ink); text-decoration: none; }
.hero-bottom a span { color: var(--orange-text); }

.page-section {
  width: min(var(--content), 100%);
  margin: 0 auto;
  padding: 116px 30px 105px;
  scroll-margin-top: 78px;
}

.principle-section,
.status-section { border-top: 1px solid var(--rule); }
.section-heading { max-width: 800px; margin-bottom: 44px; }
.section-heading .eyebrow { margin-bottom: 18px; }
h2 {
  margin-bottom: 18px;
  font: 730 clamp(43px, 6vw, 73px)/.97 var(--display);
  letter-spacing: -.075em;
  text-wrap: balance;
}

.section-intro { max-width: 650px; margin-bottom: 0; color: var(--muted); font-size: 16px; }
.principle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.principle-card { position: relative; min-height: 390px; padding: 23px 27px 22px; overflow: hidden; border: 1px solid var(--rule); background: var(--surface); }
.principle-card-dark { background: #171613; color: #f1eee5; }
.principle-card-accent { background: var(--orange); color: #171613; }
.principle-card-top { display: flex; justify-content: space-between; font: 700 9px/1.3 var(--mono); letter-spacing: .1em; }
.principle-card-dark .principle-card-top { color: #aaa397; }
.principle-graphic { position: relative; display: flex; height: 144px; align-items: center; margin: 5px 0 8px; }
.graphic-circle,.graphic-square { z-index: 1; display: grid; width: 56px; height: 56px; flex: 0 0 auto; place-items: center; border: 1px solid currentColor; border-radius: 50%; }
.graphic-circle svg { width: 23px; height: 23px; fill: none; stroke: var(--orange-light); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.graphic-line { width: min(36%, 132px); height: 1px; background: currentColor; opacity: .5; }
.graphic-square { width: 46px; height: 46px; border-radius: 4px; background: var(--orange); }
.graphic-square::after { width: 17px; height: 17px; border: 1px solid #171613; border-radius: 50%; content: ""; }
.graphic-reserve { justify-content: center; }
.reserve-ring { position: absolute; width: 124px; height: 124px; border: 1px solid rgb(23 22 19 / 46%); border-radius: 50%; animation: orbit 24s linear infinite; }
.reserve-ring::after { position: absolute; top: 12px; right: 17px; width: 7px; height: 7px; border-radius: 50%; background: #171613; content: ""; }
.reserve-ring-inner { width: 88px; height: 88px; animation-direction: reverse; animation-duration: 18s; }
.reserve-ring-inner::after { top: auto; right: auto; bottom: 6px; left: 13px; width: 5px; height: 5px; background: #fff3e8; }
.graphic-reserve svg { z-index: 1; width: 31px; height: 31px; fill: none; stroke: #171613; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.5; }
.principle-card h3 { max-width: 430px; margin-bottom: 8px; font: 700 23px/1.12 var(--display); letter-spacing: -.045em; }
.principle-card p { max-width: 490px; margin-bottom: 18px; color: var(--muted); font-size: 13px; }
.principle-card-dark p { color: #aaa397; }
.principle-card-accent p { color: #171613; }
.card-footnote { display: inline-flex; align-items: center; gap: 8px; font: 700 8px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.card-footnote::before { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); content: ""; }
.disclaimer-strip { display: flex; align-items: center; gap: 13px; margin-top: 16px; padding: 15px 18px; border: 1px solid var(--rule); }
.disclaimer-icon { display: grid; width: 24px; height: 24px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--ink); color: var(--paper); font: 700 12px/1 var(--mono); }
.disclaimer-strip p { margin: 0; color: var(--muted); font-size: 12px; }
.disclaimer-strip strong { color: var(--ink); }

.flow-section { border-top: 1px solid var(--rule); }
.section-heading-row { display: grid; grid-template-columns: 1fr minmax(260px, .7fr); align-items: end; gap: 50px; max-width: none; }
.section-heading-row .section-intro { padding-bottom: 7px; }
.journey-list { margin: 0; padding: 0; list-style: none; }
.journey-step {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  gap: 23px;
  min-height: 113px;
  padding: 20px 2px;
  border-top: 1px solid var(--rule);
  transition: padding 220ms var(--ease-out), background-color 200ms ease;
}

.journey-step:last-child { border-bottom: 1px solid var(--rule); }
.journey-step:hover { padding-right: 12px; padding-left: 12px; background: var(--surface); }
.journey-index { align-self: start; padding-top: 4px; color: var(--orange-text); font: 700 12px/1.4 var(--mono); }
.journey-role { display: block; margin-bottom: 6px; color: var(--muted); font: 700 8px/1.3 var(--mono); letter-spacing: .1em; }
.journey-copy h3 { margin-bottom: 4px; font: 700 18px/1.2 var(--display); letter-spacing: -.035em; }
.journey-copy p { max-width: 640px; margin-bottom: 0; color: var(--muted); font-size: 12px; }
.journey-status { padding: 6px 9px; border: 1px solid var(--rule); font: 700 8px/1.2 var(--mono); letter-spacing: .04em; white-space: nowrap; }
.status-local { border-color: rgb(22 76 58 / 28%); background: var(--green-soft); color: var(--green); }
.status-progress { border-color: rgb(240 75 37 / 35%); background: rgb(240 75 37 / 9%); color: var(--orange-text); }
.flow-outcome { display: flex; align-items: center; gap: 15px; max-width: 730px; margin: 26px 0 0 auto; padding: 15px 18px; background: var(--paper-deep); }
.outcome-symbol { color: var(--orange); font: 23px/1 var(--serif); }
.flow-outcome p { margin: 0; color: var(--muted); font-size: 12px; }
.flow-outcome strong { color: var(--ink); }

.feature-section {
  width: 100%;
  max-width: none;
  padding: 112px max(30px, calc((100vw - var(--content)) / 2)) 105px;
  background: var(--paper-deep);
}

.feature-heading { display: grid; max-width: var(--content); grid-template-columns: 1fr minmax(280px, .72fr); align-items: end; gap: 58px; margin: 0 auto 34px; }
.feature-heading h2 { margin-bottom: 0; }
.feature-heading-note { max-width: 430px; padding-bottom: 5px; }
.map-label { display: inline-block; margin-bottom: 11px; padding: 5px 7px; background: var(--ink); color: var(--paper); font: 700 8px/1.3 var(--mono); letter-spacing: .07em; }
.feature-heading-note p { margin: 0; color: var(--muted); font-size: 12px; }
.map-legend { display: flex; flex-wrap: wrap; gap: 12px 23px; max-width: var(--content); margin: 0 auto 42px; padding: 14px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.map-legend span { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font: 700 8px/1.4 var(--mono); letter-spacing: .035em; text-transform: uppercase; }
.legend-dot { display: inline-block; width: 7px; height: 7px; border: 1px solid var(--muted); border-radius: 50%; }
.legend-done { border-color: var(--green); background: var(--green); }
.legend-core { border-color: var(--orange); background: var(--orange); }
.legend-progress { border: 2px solid var(--orange); }
.legend-planned { background: transparent; }

.feature-filter-row { display: flex; max-width: var(--content); align-items: center; justify-content: space-between; gap: 18px; margin: -20px auto 28px; }
.feature-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.feature-filter { display: inline-flex; min-height: 34px; align-items: center; gap: 8px; padding: 6px 9px; border: 1px solid var(--rule); background: transparent; color: var(--muted); font: 700 8px/1.2 var(--mono); cursor: pointer; transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms var(--ease-out); }
.feature-filter:hover { transform: translateY(-1px); border-color: var(--rule-strong); color: var(--ink); }
.feature-filter.is-active { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.feature-filter:focus-visible { outline-offset: 3px; }
.feature-filter [data-filter-count] { color: var(--orange-text); font-size: 7px; }
.feature-filter.is-active [data-filter-count] { color: var(--paper); }
.feature-results { margin: 0; color: var(--muted); font: 700 8px/1.5 var(--mono); text-align: right; }
.feature-card[hidden],
.feature-track[hidden] { display: none; }

.feature-track { display: grid; max-width: var(--content); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 auto 44px; }
.track-heading { display: flex; grid-column: 1 / -1; align-items: baseline; gap: 13px; padding: 4px 0 8px; }
.track-heading > span:first-child { color: var(--orange-text); font: 700 10px/1.2 var(--mono); }
.track-heading h3 { margin: 0; font: 700 17px/1.2 var(--display); letter-spacing: -.035em; }
.track-heading > span:last-child { margin-left: auto; color: var(--muted); font: 700 8px/1.2 var(--mono); letter-spacing: .08em; }

.feature-card {
  display: grid;
  min-height: 271px;
  grid-template-columns: 35px minmax(0, 1fr);
  gap: 14px;
  padding: 21px 21px 0;
  border: 1px solid var(--rule);
  background: var(--paper);
  transition: transform 250ms var(--ease-out), box-shadow 250ms ease, border-color 200ms ease, background-color 220ms ease, color 220ms ease;
}

.feature-card:hover { transform: translateY(-4px); border-color: var(--rule-strong); box-shadow: 0 15px 35px rgb(23 22 19 / 7%); }
.feature-card-index { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.feature-card-index > span:first-child { color: var(--orange-text); font: 700 11px/1.3 var(--mono); }
.feature-state { display: inline-block; padding: 4px 5px; border: 1px solid var(--rule); color: var(--muted); font: 700 7px/1.2 var(--mono); text-transform: uppercase; white-space: nowrap; writing-mode: vertical-rl; }
.state-done { border-color: rgb(22 76 58 / 32%); color: var(--green); }
.state-core { border-color: rgb(240 75 37 / 45%); color: var(--orange-text); }
.state-progress { border-color: var(--orange); color: var(--orange-text); }
.state-gated { border-color: var(--rule); color: var(--muted); }
.feature-card-body { min-width: 0; }
.feature-route { display: block; margin-bottom: 12px; overflow-wrap: anywhere; color: var(--muted); font: 700 8px/1.4 var(--mono); letter-spacing: .06em; }
.feature-card h4 { margin-bottom: 8px; color: var(--ink); font: 700 19px/1.13 var(--display); letter-spacing: -.04em; }
.feature-card p { max-width: 520px; margin-bottom: 14px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.feature-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.feature-tags span { padding: 4px 6px; border: 1px solid var(--rule); color: var(--muted); font: 700 7px/1.2 var(--mono); letter-spacing: .02em; }
.feature-card-footer { display: flex; grid-column: 1 / -1; align-items: center; justify-content: space-between; gap: 12px; margin: 3px -21px 0; padding: 10px 21px; border-top: 1px solid var(--rule); color: var(--muted); font: 700 7px/1.3 var(--mono); letter-spacing: .045em; text-transform: uppercase; }
.feature-card-footer span:first-child { color: var(--ink); }
.feature-card-gated { background: color-mix(in srgb, var(--paper) 60%, var(--paper-deep)); }
.operations-track { margin-bottom: 28px; }
.map-note { display: flex; max-width: var(--content); align-items: start; gap: 12px; margin: 0 auto; padding: 16px 18px; border: 1px dashed var(--rule-strong); }
.map-note-icon { display: grid; width: 20px; height: 20px; flex: 0 0 auto; place-items: center; border: 1px solid var(--rule-strong); border-radius: 50%; font: 700 10px/1 var(--serif); }
.map-note p { margin: 0; color: var(--muted); font-size: 11px; }
.map-note strong { color: var(--ink); }

.documentation-section { width: 100%; max-width: none; padding-right: max(30px, calc((100vw - var(--content)) / 2)); padding-left: max(30px, calc((100vw - var(--content)) / 2)); border-top: 1px solid var(--rule); }
.documentation-heading { display: grid; max-width: var(--content); grid-template-columns: 1fr minmax(280px, .75fr); align-items: end; gap: 54px; margin: 0 auto 30px; }
.documentation-heading h2 { margin-bottom: 0; }
.documentation-intro p { margin-bottom: 17px; color: var(--muted); font-size: 13px; }
.docs-open-link { min-height: 41px; font-size: 8px; }
.docs-frame-wrap { max-width: var(--content); margin: 0 auto; border: 1px solid var(--rule-strong); background: var(--surface); }
.docs-frame-bar { display: flex; min-height: 43px; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 13px; border-bottom: 1px solid var(--rule); color: var(--muted); font: 700 8px/1.35 var(--mono); letter-spacing: .06em; }
.docs-frame-bar > span { display: inline-flex; align-items: center; gap: 8px; }
.docs-frame-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); }
.docs-frame-bar a { color: var(--ink); text-decoration: none; white-space: nowrap; }
.docs-frame-bar a:hover { color: var(--orange-text); }
.docs-frame { display: block; width: 100%; height: min(84vh, 1050px); min-height: 690px; border: 0; background: var(--paper); }
.docs-host-note { max-width: var(--content); margin: 11px auto 0; color: var(--muted); font-size: 10px; }

.status-section { padding-top: 110px; }
.status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.status-card { position: relative; min-height: 239px; padding: 21px; border: 1px solid var(--rule); background: var(--surface); }
.status-card-number { display: block; margin-bottom: 19px; color: var(--orange-text); font: 700 11px/1.2 var(--mono); }
.status-badge { display: inline-block; margin-bottom: 11px; padding: 4px 6px; font: 700 7px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.badge-local { background: var(--green-soft); color: var(--green); }
.badge-progress { background: rgb(240 75 37 / 11%); color: var(--orange-text); }
.status-card h3 { margin-bottom: 8px; font: 700 19px/1.15 var(--display); letter-spacing: -.035em; }
.status-card p { margin-bottom: 0; color: var(--muted); font-size: 11px; }
.status-card-progress { border-color: rgb(240 75 37 / 47%); }
.status-card-progress::after { position: absolute; top: 0; right: 0; width: 35px; height: 3px; background: var(--orange); content: ""; }
.not-yet { display: grid; grid-template-columns: minmax(210px, .75fr) 1.25fr; align-items: center; gap: 25px; margin-top: 14px; padding: 21px 23px; background: var(--ink); color: var(--paper); }
.not-yet-label { display: block; margin-bottom: 8px; color: var(--orange-light); font: 700 8px/1.3 var(--mono); letter-spacing: .08em; }
.not-yet h3 { margin: 0; font: 650 19px/1.15 var(--display); letter-spacing: -.035em; }
.not-yet ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.not-yet li { padding: 6px 8px; border: 1px solid rgb(241 238 229 / 27%); color: #c3beb4; font: 700 8px/1.3 var(--mono); }

.roadmap-section { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: clamp(45px, 9vw, 120px); border-top: 1px solid var(--rule); }
.roadmap-heading .eyebrow { margin-bottom: 18px; }
.roadmap-heading h2 { margin-bottom: 18px; }
.roadmap-heading > p:last-child { max-width: 370px; color: var(--muted); font-size: 13px; }
.roadmap-list { position: relative; margin: 0; padding: 0; list-style: none; }
.roadmap-list::before { position: absolute; top: 24px; bottom: 24px; left: 18px; width: 1px; background: var(--rule); content: ""; }
.roadmap-item { position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: 13px; padding: 16px 0; border-top: 1px solid var(--rule); }
.roadmap-item:last-child { border-bottom: 1px solid var(--rule); }
.roadmap-step { z-index: 1; display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid var(--rule); border-radius: 50%; background: var(--paper); color: var(--muted); font: 700 9px/1 var(--mono); }
.is-current .roadmap-step { border-color: var(--orange); background: var(--orange); color: #171613; }
.roadmap-item h3 { margin: 2px 0 5px; font: 700 15px/1.25 var(--display); letter-spacing: -.025em; }
.roadmap-item p { max-width: 430px; margin: 0; color: var(--muted); font-size: 11px; }
.roadmap-state { display: inline-block; grid-column: 2; margin-top: 8px; color: var(--muted); font: 700 7px/1.3 var(--mono); letter-spacing: .08em; }
.is-current .roadmap-state { color: var(--orange-text); }

.closing-section {
  position: relative;
  isolation: isolate;
  padding: 96px 24px 92px;
  overflow: hidden;
  background: var(--ink);
  color: var(--paper);
  text-align: center;
}

.closing-orbit { position: absolute; z-index: -1; top: 50%; left: 50%; width: 440px; height: 440px; transform: translate(-50%, -50%); border: 1px solid rgb(241 238 229 / 12%); border-radius: 50%; }
.closing-orbit::before,.closing-orbit::after { position: absolute; inset: 36px; border: 1px solid rgb(241 238 229 / 9%); border-radius: 50%; content: ""; }
.closing-orbit::after { inset: 91px; }
.closing-orbit span { position: absolute; top: 51px; right: 70px; width: 10px; height: 10px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 30px var(--orange); }
.closing-orbit i { position: absolute; right: 94px; bottom: 48px; width: 5px; height: 5px; border-radius: 50%; background: #f1eee5; }
.closing-section .eyebrow { justify-content: center; color: #aaa397; }
.closing-section h2 { position: relative; max-width: 760px; margin: 0 auto 18px; font-size: clamp(44px, 7vw, 78px); }
.closing-section h2 em { color: var(--orange-light); }
.closing-section > p:not(.eyebrow) { max-width: 490px; margin: 0 auto 24px; color: #aaa397; font-size: 13px; }
.button-light { border-color: rgb(241 238 229 / 45%); color: var(--paper); }
.button-light:hover { border-color: var(--orange); background: var(--orange); color: #171613; }
.footer { display: flex; min-height: 83px; align-items: center; justify-content: space-between; gap: 18px; max-width: var(--content); margin: 0 auto; padding: 15px 30px; }
.footer-brand { font-size: 16px; }
.footer-brand .brand-mark { width: 25px; height: 25px; }
.footer > p { margin: 0; color: var(--muted); font: 700 8px/1.5 var(--mono); letter-spacing: .04em; text-align: center; text-transform: uppercase; }
.back-to-top { color: var(--muted); font: 700 8px/1.3 var(--mono); text-decoration: none; text-transform: uppercase; }
.back-to-top:hover { color: var(--orange-text); }

.motion-ready [data-reveal] {
  transform: translateY(20px);
  opacity: 0;
  transition: transform 650ms var(--ease-out), opacity 650ms ease;
}

.motion-ready [data-reveal].is-visible { transform: translateY(0); opacity: 1; }
.feature-track > .feature-card:nth-of-type(3n) { transition-delay: 60ms; }
.feature-track > .feature-card:nth-of-type(3n + 1) { transition-delay: 110ms; }
body,
.hero,
.topbar,
.principle-card,
.status-card,
.disclaimer-strip,
.not-yet,
.footer { transition: background-color 220ms ease, color 220ms ease, border-color 220ms ease; }

.back-to-top { display: inline-flex; min-height: 32px; align-items: center; }
h2 em { color: var(--orange-text); }
.closing-section { background: #171613; color: #f1eee5; }
.closing-section .text-link { color: #d0cabe; }
.closing-section .button-light { color: #f1eee5; }
.not-yet { background: #171613; color: #f1eee5; }

.product-section { border-top: 1px solid var(--rule); }
.product-heading { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(230px, .8fr); gap: 40px; align-items: end; margin-bottom: 30px; }
.product-heading h2 { margin-bottom: 0; }
.product-heading > p { margin: 0 0 6px; color: var(--muted); font-size: 14px; }
.product-card-grid, .trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.product-card, .pool-comparison > article, .trust-grid > article { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; padding: 24px; border: 1px solid var(--rule); background: var(--surface); }
.product-index { margin-bottom: 25px; color: var(--orange-text); font: 700 10px/1.4 var(--mono); }
.product-card h3, .pool-comparison h3 { margin: 0 0 12px; font-size: 21px; line-height: 1.25; letter-spacing: -.025em; }
.product-card p, .pool-comparison p, .trust-grid p { margin: 0 0 22px; color: var(--muted); font-size: 13px; }
.product-status { display: inline-flex; min-height: 26px; align-items: center; padding: 5px 8px; border: 1px solid var(--rule); font: 700 9px/1.4 var(--mono); }
.product-card .product-status { margin-top: auto; }
.product-footnote { margin: 20px 0 0; color: var(--muted); font-size: 12px; }
.pool-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pool-comparison .product-status { margin-bottom: 20px; }
.pool-comparison a { display: inline-flex; min-height: 32px; align-items: center; gap: 8px; margin-top: auto; font-size: 12px; text-underline-offset: 4px; }
.pool-section .notice-inline { display: grid; gap: 5px; margin-top: 16px; padding: 16px; border-left: 3px solid var(--orange-text); background: var(--yellow-soft); color: var(--ink); font-size: 12px; }
.trust-grid strong { margin-bottom: 12px; font-size: 16px; }
.trust-grid p { margin-bottom: 0; }
.trust-section > .text-link { margin-top: 18px; }
.ecosystem-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ecosystem-list > span { display: grid; gap: 7px; padding: 18px; border: 1px solid var(--rule); color: var(--muted); font-size: 12px; }
.ecosystem-list strong { color: var(--ink); font-size: 15px; }
.developer-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.developer-links > a { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 5px 12px; min-height: 100px; padding: 20px; border: 1px solid var(--rule); background: var(--surface); text-decoration: none; }
.developer-links > a:hover { border-color: var(--orange-text); }
.developer-links > a > span { grid-row: span 2; color: var(--orange-text); font: 700 11px/1.5 var(--mono); }
.developer-links strong { font-size: 15px; }
.developer-links small { color: var(--muted); font-size: 12px; }

@media (max-width: 900px) {
  .topbar { flex-wrap: wrap; }
  .primary-nav { order: 3; width: 100%; overflow-x: auto; }
  .hero .hero-grid { grid-template-columns: 1fr; }
  .hero::before { top: 45%; width: 100%; height: 55%; border-top: 1px solid var(--rule); border-left: 0; }
  .product-heading { grid-template-columns: 1fr; gap: 18px; }
  .product-card-grid, .trust-grid { grid-template-columns: 1fr; }
  .ecosystem-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .pool-comparison, .developer-links { grid-template-columns: 1fr; }
  .product-card, .pool-comparison > article, .trust-grid > article { padding: 20px; }
}

@media (max-width: 1020px) {
  .topbar { gap: 18px; padding-right: 22px; padding-left: 22px; }
  .primary-nav { gap: 17px; }
  .version-tag { display: none; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr); gap: 38px; padding-right: 25px; padding-left: 25px; }
  h1 { font-size: clamp(58px, 8vw, 82px); }
  .page-section { padding-right: 25px; padding-left: 25px; }
  .feature-section { padding-right: 25px; padding-left: 25px; }
  .footer { padding-right: 25px; padding-left: 25px; }
}

@media (max-width: 760px) {
  :root { scroll-padding-top: 124px; }
  .topbar { min-height: 66px; flex-wrap: wrap; gap: 0 14px; padding: 8px 18px 0; }
  .brand { font-size: 18px; }
  .brand-mark { width: 27px; height: 27px; }
  .topbar-actions { margin-left: auto; }
  .theme-toggle { width: 34px; height: 34px; }
  .primary-nav { order: 3; width: calc(100% + 36px); gap: 22px; margin: 3px -18px 0; padding: 0 18px; overflow-x: auto; border-top: 1px solid var(--rule); scrollbar-width: none; }
  .primary-nav::-webkit-scrollbar { display: none; }
  .nav-link { flex: 0 0 auto; padding: 10px 0 11px; font-size: 11px; }
  .hero-grid { min-height: auto; grid-template-columns: 1fr; gap: 43px; padding: 67px 22px 40px; }
  .hero::before { top: 45%; width: 100%; height: 55%; border-top: 1px solid var(--rule); border-left: 0; }
  h1 { max-width: 600px; font-size: clamp(58px, 13vw, 88px); }
  .hero-copy { max-width: 540px; }
  .hero-meta { margin-top: 28px; }
  .visual-panel { width: min(100%, 520px); min-height: 405px; justify-self: center; padding-right: 19px; padding-left: 19px; }
  .hero-bottom { padding-right: 22px; padding-left: 22px; }
  .page-section { padding: 82px 22px 76px; }
  .section-heading-row,.feature-heading,.documentation-heading { grid-template-columns: 1fr; gap: 18px; }
  .feature-section { padding: 83px 22px 76px; }
  .documentation-section { padding-right: 22px; padding-left: 22px; }
  .docs-frame { height: 78vh; min-height: 620px; }
  .feature-heading { margin-bottom: 27px; }
  .feature-heading-note { max-width: 560px; }
  .map-legend { gap: 10px 16px; margin-bottom: 32px; }
  .feature-filter-row { align-items: flex-start; flex-direction: column; gap: 10px; margin-top: -14px; }
  .feature-results { text-align: left; }
  .feature-track { gap: 10px; }
  .feature-card { min-height: 285px; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; padding: 17px 15px 0; }
  .feature-card-footer { margin-right: -15px; margin-left: -15px; padding-right: 15px; padding-left: 15px; }
  .feature-card h4 { font-size: 17px; }
  .feature-tags span { font-size: 6.5px; }
  .roadmap-section { grid-template-columns: 1fr; gap: 27px; }
  .footer { padding-right: 22px; padding-left: 22px; }
}

@media (max-width: 560px) {
  .notice-bar { min-height: 29px; gap: 6px; font-size: 7px; letter-spacing: .075em; }
  .topbar { padding-right: 15px; padding-left: 15px; }
  .primary-nav { width: calc(100% + 30px); gap: 19px; margin-right: -15px; margin-left: -15px; padding-right: 15px; padding-left: 15px; }
  .hero-grid { padding: 54px 19px 33px; }
  .hero .eyebrow { font-size: 8px; }
  h1 { margin-bottom: 19px; font-size: clamp(53px, 13vw, 72px); }
  .hero-copy { font-size: 15px; }
  .hero-actions { align-items: flex-start; gap: 13px; }
  .button { min-height: 43px; padding: 10px 12px; font-size: 8px; }
  .text-link { align-self: center; font-size: 10px; }
  .hero-meta { gap: 9px 14px; font-size: 7px; }
  .visual-panel { min-height: 377px; padding: 17px 15px 13px; }
  .visual-amount { margin-top: 34px; }
  .visual-amount strong { font-size: 28px; }
  .flow-visual { height: 116px; grid-template-columns: 47px minmax(17px, 1fr) 47px minmax(17px, 1fr) 47px; }
  .node-icon { width: 38px; height: 38px; }
  .node-icon svg { width: 17px; height: 17px; }
  .flow-node { font-size: 7px; }
  .route-label { font-size: 6px; }
  .reserve-orbit { right: 17%; bottom: 2px; width: 76px; height: 26px; font-size: 6px; }
  .visual-panel-bottom { font-size: 6px; }
  .hero-bottom { padding-right: 19px; padding-left: 19px; font-size: 7px; }
  .page-section { padding: 72px 19px 66px; }
  h2 { font-size: clamp(40px, 10.4vw, 58px); }
  .section-intro { font-size: 14px; }
  .section-heading { margin-bottom: 31px; }
  .principle-grid { grid-template-columns: 1fr; gap: 10px; }
  .principle-card { min-height: 350px; padding: 20px; }
  .principle-graphic { height: 120px; }
  .principle-card h3 { font-size: 21px; }
  .disclaimer-strip { align-items: flex-start; padding: 13px; }
  .journey-step { grid-template-columns: 32px minmax(0, 1fr); gap: 11px; padding: 17px 0; }
  .journey-status { grid-column: 2; justify-self: start; margin-top: -4px; }
  .journey-copy h3 { font-size: 16px; }
  .flow-outcome { align-items: flex-start; margin-top: 18px; padding: 13px; }
  .feature-section { padding: 72px 19px 65px; }
  .documentation-section { padding: 72px 19px 65px; }
  .docs-frame-bar { align-items: flex-start; font-size: 7px; }
  .docs-frame-bar a { max-width: 126px; text-align: right; white-space: normal; }
  .docs-frame { height: 78vh; min-height: 560px; }
  .map-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 8px; }
  .map-legend span { font-size: 7px; }
  .feature-filters { gap: 5px; }
  .feature-filter { min-height: 32px; gap: 5px; padding: 5px 7px; font-size: 7px; }
  .feature-results { font-size: 7px; }
  .track-heading { flex-wrap: wrap; gap: 9px; padding-bottom: 3px; }
  .track-heading h3 { font-size: 15px; }
  .track-heading > span:last-child { width: 100%; margin-left: 22px; font-size: 7px; }
  .feature-track { grid-template-columns: 1fr; gap: 9px; margin-bottom: 34px; }
  .feature-card { min-height: 0; grid-template-columns: 33px minmax(0, 1fr); padding: 17px 17px 0; }
  .feature-card-index { gap: 9px; }
  .feature-card-index > span:first-child { font-size: 10px; }
  .feature-state { font-size: 7px; }
  .feature-route { margin-bottom: 9px; font-size: 7px; }
  .feature-card h4 { font-size: 18px; }
  .feature-card p { font-size: 11px; }
  .feature-tags span { font-size: 7px; }
  .feature-card-footer { margin-right: -17px; margin-left: -17px; padding-right: 17px; padding-left: 17px; }
  .map-note { padding: 13px; }
  .status-grid { grid-template-columns: 1fr; gap: 9px; }
  .status-card { min-height: 0; padding: 17px; }
  .status-card-number { margin-bottom: 12px; }
  .not-yet { grid-template-columns: 1fr; gap: 14px; padding: 17px; }
  .not-yet h3 { font-size: 17px; }
  .not-yet li { font-size: 7px; }
  .roadmap-section { gap: 20px; }
  .roadmap-item { grid-template-columns: 33px minmax(0, 1fr); gap: 10px; }
  .roadmap-list::before { left: 16px; }
  .roadmap-step { width: 33px; height: 33px; }
  .roadmap-item h3 { font-size: 14px; }
  .closing-section { padding: 78px 20px 73px; }
  .closing-section h2 { font-size: clamp(41px, 11vw, 60px); }
  .closing-section > p:not(.eyebrow) { font-size: 12px; }
  .closing-orbit { width: 340px; height: 340px; }
  .footer { min-height: 0; flex-wrap: wrap; padding: 16px 19px; }
  .footer > p { order: 3; width: 100%; text-align: left; }
  .footer-brand { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* Backstop identity: expressive local type, architectural space and purposeful motion. */
@view-transition { navigation:auto; }
::view-transition-old(root) { animation:bs-page-out 160ms ease both; }
::view-transition-new(root) { animation:bs-page-in 320ms cubic-bezier(.2,.75,.25,1) both; }
@keyframes bs-page-out { to { opacity:0; transform:translateY(-5px); } }
@keyframes bs-page-in { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:none; } }
.hero-grid { min-height:735px; grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr); gap:60px; padding-top:90px; padding-bottom:85px; }
.hero-copy-column { padding-bottom:16px; }
.hero h1 { font-size:clamp(64px,6.1vw,94px); font-weight:750; letter-spacing:-.072em; line-height:.98; }
.hero-line { display:block; overflow:hidden; padding:.13em .08em .19em; margin:-.13em -.08em -.19em; }
.hero-line>span,.hero-line>em { display:block; }
.hero h1 em { font-size:1em; font-weight:500; line-height:1; letter-spacing:-.065em; }
h2 em,.page-heading h1 em { font-weight:400; }
.hero-copy { max-width:440px; margin-top:28px; font-size:16px; line-height:1.85; }
.hero .eyebrow { font-size:9px; letter-spacing:.11em; }
.hero-actions { margin-top:32px; }
.hero-art-wrap { position:relative; padding:44px 0 36px; isolation:isolate; }
.reserve-halo { position:absolute; z-index:-1; width:112%; aspect-ratio:1; top:50%; left:50%; border:1px solid var(--orange-text); border-radius:50%; transform:translate(-50%,-50%) rotate(-24deg); opacity:.6; }
.reserve-halo::before { position:absolute; inset:25px; border:1px dashed var(--rule-strong); border-radius:50%; content:""; }
.reserve-halo::after { position:absolute; inset:66px; border:1px solid var(--rule); border-radius:50%; content:""; }
.reserve-halo>span { position:absolute; top:15%; left:2%; padding:5px 8px; background:var(--paper); color:var(--orange-text); font:600 8px/1.4 var(--mono); letter-spacing:.1em; }
.reserve-halo>i { position:absolute; right:9%; top:16%; width:9px; height:9px; background:var(--orange); border-radius:50%; }
.hero-art-wrap .visual-panel { min-height:440px; border:1px solid #494238; border-radius:3px; background:#191815; box-shadow:12px 18px 0 color-mix(in srgb,var(--ink) 8%,transparent),0 28px 70px rgb(23 22 19 / 14%); transform:perspective(1000px) translateY(calc(-1 * var(--hero-lift,0px))) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) rotate(-3deg); transition:transform .45s cubic-bezier(.2,.75,.25,1),box-shadow .45s; animation:none; }
.hero-art-wrap .visual-panel::after { content:none; }
.visual-panel .visual-amount strong { font-family:var(--display); font-size:clamp(27px,2.6vw,37px); line-height:1.13; letter-spacing:-.05em; }
.visual-panel .visual-amount em { font-family:var(--serif); font-size:1em; font-weight:500; }
.visual-panel .visual-label { color:#b9b2a6; font:500 10px/1.6 var(--mono); }
.visual-panel .visual-panel-top { padding-bottom:14px; border-bottom:1px solid #39352d; }
.visual-panel .visual-panel-bottom { margin-top:18px; padding-top:15px; border-top:1px dashed #4c453a; }
.art-axis { display:flex; justify-content:space-between; gap:14px; padding-top:32px; color:var(--muted); font:500 8px/1.5 var(--mono); letter-spacing:.07em; }
.hero-bottom { padding-top:20px; padding-bottom:20px; }
.experience-ready .hero-line>span,.experience-ready .hero-line>em { animation:bs-type-rise 850ms cubic-bezier(.16,1,.3,1) both; }
.experience-ready .hero-line:nth-child(2)>em { animation-delay:100ms; }
.experience-ready .hero-line:nth-child(3)>span { animation-delay:190ms; }
.experience-ready .hero-art-wrap { animation:bs-art-arrive 1100ms cubic-bezier(.16,1,.3,1) 150ms both; }
/* The two independent financial paths share one visual language. */
.protocol-canvas { display:block; width:100%; overflow:visible; color:#f1eee5; }
.protocol-canvas path,.protocol-canvas circle,.protocol-canvas rect { fill:none; stroke:currentColor; stroke-width:1.5; }
.protocol-canvas .circuit-grid { stroke:#37342e; stroke-width:.5; }
.protocol-canvas .circuit-wire { stroke:#716a5e; }
.protocol-canvas .circuit-dashed { stroke-dasharray:3 5; }
.protocol-canvas .circuit-node>circle:first-child { fill:#24211c; stroke:#b8afa0; }
.protocol-canvas text { fill:#ded7ca; text-anchor:middle; font:600 10px var(--body); letter-spacing:1.1px; }
.protocol-canvas .circuit-label { fill:#bdb4a6; font-size:8px; }
.protocol-canvas .reserve-scanner { stroke:#f04b25; stroke-width:2; stroke-dasharray:24 16 2 16; transform-origin:250px 190px; animation:bs-reserve-scan 16s linear infinite; }
.protocol-canvas .reserve-seal { fill:#24211c; stroke:#a79d8d; }
.protocol-canvas .reserve-lock { color:#f1eee5; }
.protocol-canvas .lock-shackle { transform-origin:243px 185px; transform:translateY(-5px) rotate(-18deg); transition:transform .65s cubic-bezier(.2,.8,.2,1); }
.protocol-canvas .reserve-tick { stroke:#a9d6b9; stroke-width:3; stroke-dasharray:40; stroke-dashoffset:40; opacity:0; transition:stroke-dashoffset .65s,opacity .3s; }
.protocol-canvas .circuit-energy { stroke:#ff805b; stroke-width:4; stroke-linecap:round; stroke-dasharray:14 500; stroke-dashoffset:500; opacity:0; }
.protocol-canvas .refund-label { fill:#a9d6b9; font-size:8px; opacity:.4; transition:opacity .3s; }
[data-flow-phase="reserve"] .reserve-energy { opacity:1; animation:bs-energy 1.7s linear infinite; }
[data-flow-phase="payment"] .payment-energy { opacity:1; animation:bs-energy 2.2s linear infinite; }
[data-flow-phase="refund"] .refund-energy { opacity:1; stroke:#a9d6b9; animation:bs-energy 2.2s linear infinite; }
[data-flow-phase="refund"] .refund-label { opacity:1; }
[data-flow-phase="protected"] .reserve-lock { opacity:0; }
[data-flow-phase="protected"] .reserve-tick { opacity:1; stroke-dashoffset:0; }
[data-flow-phase="reserve"] .lock-shackle,[data-flow-phase="payment"] .lock-shackle,[data-reserved="true"] .lock-shackle { transform:none; }
[data-flow-phase="idle"] .reserve-scanner,[data-reserved="false"] .reserve-scanner { opacity:.3; }
.protocol-illustration { margin-top:15px; }
.protocol-illustration .protocol-canvas { margin:-6px 0 -12px; }
.sequence-caption { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:9px 14px; padding-top:9px; border-top:1px solid #474036; }
.sequence-caption>span { color:#ff987b; font:600 9px var(--mono); }
.sequence-caption>strong { color:#f1eee5; font:500 11px/1.5 var(--body); }
.sequence-rail { grid-column:1/-1; display:flex; gap:5px; }
.sequence-rail i { flex:1; height:2px; background:#4e453a; }
[data-flow-phase="reserve"] .sequence-rail i:nth-child(1),[data-flow-phase="payment"] .sequence-rail i:nth-child(2),[data-flow-phase="protected"] .sequence-rail i:nth-child(3),[data-flow-phase="refund"] .sequence-rail i:nth-child(4) { background:#ff805b; }
.illustration-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:27px; color:var(--muted); font:600 8px var(--mono); }
.motion-toggle { min-height:32px; padding:6px 10px; border:1px solid var(--rule-strong); background:transparent; color:var(--ink); font:600 10px var(--body); cursor:pointer; }
.motion-toggle:hover { border-color:var(--orange-text); color:var(--orange-text); }
.motion-toggle:focus-visible { outline:2px solid var(--orange-text); outline-offset:3px; }
.motion-paused .protocol-canvas * { animation-play-state:paused!important; }
.brand img.brand-mark,.app-brand img.brand-mark,.footer-brand img.brand-mark { flex-shrink:0; border:0; border-radius:0; }
@keyframes bs-energy { from { stroke-dashoffset:500; } to { stroke-dashoffset:0; } }
@keyframes bs-reserve-scan { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) {
 .protocol-canvas * { animation:none!important; transition:none!important; }
 .protocol-canvas .circuit-energy { stroke-dasharray:none; stroke-dashoffset:0; stroke-width:2; }
}
@keyframes bs-type-rise { from { opacity:0; transform:translateY(105%) rotate(2deg); } to { opacity:1; transform:none; } }
@keyframes bs-art-arrive { from { opacity:0; transform:translate(24px,22px) scale(.96); } to { opacity:1; transform:none; } }
.motion-pending { opacity:0; transform:translateY(22px); }
.motion-arrived { animation:bs-section-arrive 650ms cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms) both; }
@keyframes bs-section-arrive { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:none; } }
.has-scrolled .topbar { box-shadow:0 8px 24px rgb(23 22 19 / 5%); }
.product-card,.pool-comparison>article,.trust-grid>article,.developer-links>a { transition:border-color .22s,box-shadow .22s,background-color .22s; }
.product-card:hover,.pool-comparison>article:hover,.trust-grid>article:hover { border-color:var(--orange-text); box-shadow:inset 0 3px 0 var(--orange); }
.developer-links>a:hover { background:var(--paper-deep); }
.product-heading { margin-bottom:40px; }
.product-index { letter-spacing:.1em; }
.product-card h3 { font-weight:650; letter-spacing:-.04em; }
.ecosystem-list>span { position:relative; overflow:hidden; }
.ecosystem-list>span::after { position:absolute; right:13px; top:12px; content:"\2197"; color:var(--orange-text); transition:transform .25s; }
.ecosystem-list>span:hover::after { transform:translate(2px,-2px); }
.button { position:relative; overflow:hidden; transition:transform .2s cubic-bezier(.2,.75,.25,1),box-shadow .2s,background-color .2s,color .2s; }
.button-primary:hover { box-shadow:0 7px 0 -3px color-mix(in srgb,var(--orange-text) 45%,transparent); }
.button:active:not(:disabled) { transform:translateY(1px); box-shadow:none; }
@media(max-width:1020px) {
 .hero .hero-grid { grid-template-columns:1fr; min-height:auto; gap:38px; padding-top:68px; }
 .hero-copy-column { max-width:650px; }.hero h1 { font-size:clamp(62px,10vw,88px); }
 .hero-art-wrap { width:min(490px,85%); justify-self:center; }.hero-art-wrap .visual-panel { min-height:410px; }
 .hero::before { width:100%; height:55%; top:45%; border-left:0; }
}
@media(max-width:560px) {
 .hero .hero-grid { padding:52px 20px 34px; gap:20px; }
 .hero h1 { font-size:clamp(53px,12.8vw,70px); letter-spacing:-.065em; }
 .hero-copy { font-size:14px; line-height:1.8; margin-top:24px; }
 .hero-art-wrap { width:92%; padding-top:40px; }.hero-art-wrap .visual-panel { min-height:380px; }
 .visual-panel .visual-amount strong { font-size:27px; }.art-axis { font-size:7px; }
 .hero .eyebrow { font-size:7px; }.hero-actions { margin-top:24px; }
}
@media(prefers-reduced-motion:reduce) {
 .experience-ready .hero-line>span,.experience-ready .hero-line>em,.experience-ready .hero-art-wrap,.motion-arrived { animation:none!important; }
 .motion-pending { opacity:1; transform:none; }.hero-art-wrap .visual-panel { transform:rotate(-3deg); }
 ::view-transition-old(root),::view-transition-new(root),::view-transition-group(*) { animation:none!important; }
}