:root {
  color-scheme: light;
  --paper: #f4efe6;
  --plate: #e9dfd0;
  --ink: #211e1c;
  --muted: #5e5550;
  --brick: #9a3026;
  --brick-hover: #7e281f;
  --line: #c8bcb0;
  --white: #fffaf2;
  --width: 1220px;
  font-family: Geist, "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  scrollbar-gutter: stable;
}
@font-face {
  font-family: Geist;
  src: url("/assets/else-geist.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; }
main { flex: 1; }
[hidden] { display: none !important; }
button, input { font: inherit; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--brick); }
:focus-visible { outline: 2px solid var(--brick); outline-offset: 4px; }
::selection { background: #edd0ba; color: var(--ink); }
.skip { position: fixed; z-index: 10; top: 12px; left: 12px; padding: 12px; background: var(--white); }
.skip:not(:focus) { clip-path: inset(50%); }

.site-header, .shell { width: min(calc(100% - 80px), var(--width)); margin-inline: auto; }
.site-header, .footer-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-header { min-height: 86px; }
.brand { display: inline-flex; align-items: center; gap: 9px; font-size: 25px; font-weight: 750; letter-spacing: -.035em; }
.brand img { display: block; }
.site-header nav { display: flex; align-items: center; gap: 28px; font-size: 14px; font-weight: 620; }
.site-header nav a[aria-current] { color: var(--brick); }
.site-header .nav-action { padding: 10px 17px; border: 1px solid var(--line); border-radius: 4px; }
.site-header .nav-action:hover { border-color: var(--brick); background: #f2e3d7; }
.site-footer { background: #151312; color: var(--paper); font-size: 14px; }
.site-footer a:hover { color: #f0aa98; }
.site-footer :focus-visible { outline-color: #f0aa98; }
.footer-row { min-height: 116px; }
.footer-row > span { color: #c8bab1; }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -.035em; }
h1 { margin-bottom: 19px; font-size: clamp(52px, 8vw, 104px); line-height: .97; font-weight: 750; }
h2 { font-size: clamp(38px, 5vw, 65px); line-height: 1.01; font-weight: 710; }
h3 { font-size: 22px; line-height: 1.14; }
p { line-height: 1.59; color: var(--muted); }
.hero { padding: clamp(44px, 7vw, 106px) 0 35px; }
.hero-copy { display: grid; grid-template-columns: 1.55fr 1fr; gap: 55px; align-items: end; padding-bottom: 50px; }
.hero-copy h1 { margin-bottom: 0; }
.hero-copy p, .lede { max-width: 46ch; font-size: 18px; margin-bottom: 20px; }
.action { display: inline-grid; min-height: 48px; place-items: center; border: 1px solid transparent; border-radius: 4px; background: var(--brick); padding: 10px 21px; font-weight: 680; color: var(--white); cursor: pointer; }
.action:hover { background: var(--brick-hover); color: var(--white); }
.action:disabled { opacity: .66; cursor: wait; }
.hero-plate img { display: block; width: 100%; height: auto; border: 1px solid #382e29; }
.plate-caption { display: grid; grid-template-columns: 1fr 1fr; margin-top: 12px; color: var(--muted); font-size: 14px; font-weight: 600; }
.plate-caption span { text-align: center; }
.work-sequence, .questions { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); gap: clamp(30px, 9vw, 140px); padding-block: clamp(65px, 9vw, 125px); align-items: start; }
.work-sequence h2, .questions h2, .lookup-layout h2 { margin-bottom: 19px; }
.work-sequence > div p, .lookup-layout p { max-width: 42ch; }
.sequence { list-style: none; margin: 0; padding: 0; counter-reset: lookup; }
.sequence li { counter-increment: lookup; position: relative; padding: 0 0 23px 55px; margin-bottom: 16px; }
.sequence li:last-child { margin-bottom: 0; padding-bottom: 0; }
.sequence li::before { content: counter(lookup, decimal-leading-zero); position: absolute; left: 0; top: 0; color: var(--brick); font-size: 14px; font-weight: 720; font-variant-numeric: tabular-nums; }
.sequence h3, .sequence p { margin-bottom: 6px; }
.lookup-band { background: var(--plate); padding-block: clamp(70px, 9vw, 130px); padding-inline: 1px; }
.lookup-layout { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: clamp(28px, 8vw, 115px); }
.network-list { margin: 0; border-top: 1px solid #bcae9e; }
.network-list > div { padding: 22px 0; border-bottom: 1px solid #bcae9e; }
.network-list dt { font-size: clamp(24px, 3.5vw, 44px); font-weight: 700; letter-spacing: -.035em; }
.network-list dd { margin: 4px 0 0; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 14px; }
.network-list dd span, .network-title > span { font-variant-numeric: tabular-nums; }
.accordion { border-top: 1px solid var(--line); padding-top: 3px; }
.accordion details { border-bottom: 1px solid var(--line); }
.accordion summary, .token-options summary { list-style: none; position: relative; cursor: pointer; font-weight: 680; }
.accordion summary::-webkit-details-marker, .token-options summary::-webkit-details-marker { display: none; }
.accordion summary { min-height: 59px; padding: 17px 43px 17px 0; display: flex; align-items: center; }
.accordion summary::before, .accordion summary::after, .token-options summary::before, .token-options summary::after { content: ""; position: absolute; right: 14px; top: 50%; width: 13px; height: 2px; background: currentColor; transform: translateY(-50%); }
.accordion summary::after, .token-options summary::after { transform: translateY(-50%) rotate(90deg); }
.accordion details[open] > summary::after, .token-options[open] > summary::after { visibility: hidden; }
.accordion summary:hover, .token-options summary:hover { color: var(--brick); }
.accordion p { margin-bottom: 19px; padding-right: 34px; }

.workspace { max-width: 990px; padding: 63px 0 107px; }
.workspace h1 { font-size: clamp(45px, 6vw, 78px); }
.workspace form { margin-top: 38px; background: var(--white); padding: clamp(18px, 4vw, 40px); border: 1px solid var(--line); border-radius: 12px; }
.label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 7px; }
label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 690; }
.label-row label { margin-bottom: 0; }
.quiet-link, .guide-copy li a, .explorer, .token-result a { color: var(--brick); font-weight: 650; }
.quiet-link:hover, .guide-copy li a:hover, .explorer:hover, .token-result a:hover { color: var(--brick-hover); }
button.quiet-link { background: transparent; border: 0; padding: 4px 0; cursor: pointer; font-size: 13px; }
input { width: 100%; min-width: 0; min-height: 48px; padding: 10px 14px; border: 1px solid #aa9c8d; border-radius: 4px; color: var(--ink); background: #fcf8f0; caret-color: var(--brick); }
input::placeholder { color: #6e6259; }
input[aria-invalid] { border-color: var(--brick); }
.address-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.field-error { min-height: 19px; margin: 4px 0 0; color: var(--brick); font-size: 13px; }
.token-options { margin-top: 7px; border-top: 1px solid var(--line); }
.token-options summary { padding: 15px 42px 0 0; min-height: 46px; }
.token-options summary::before, .token-options summary::after { top: calc(50% + 7px); right: 5px; }
.token-options > p { margin: 10px 0 16px; }
.balance-grid, .token-inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#lookup-status { min-height: 24px; margin: 17px 0; }
.workspace:not(.guide) #results h2 { font-size: 38px; margin-bottom: 9px; }
.checked { overflow-wrap: anywhere; margin: 0 0 20px; }
.balance-card { display: flex; flex-direction: column; min-height: 238px; padding: clamp(18px, 3vw, 29px); border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.balance-card[data-chain="bsc"] { background: #25211f; color: var(--paper); border-color: #25211f; }
.balance-card[data-chain="bsc"] :focus-visible { outline-color: #f0aa98; }
.balance-card[data-chain="bsc"] :is(.balance-label, .evidence, .exact-amount, .network-title > span) { color: #d7c8be; }
.balance-card[data-chain="bsc"] :is(.explorer, .token-result a) { color: #ffc4ad; }
.balance-card[data-state="unavailable"] .amount { color: var(--brick); }
.balance-card[data-chain="bsc"][data-state="unavailable"] .amount { color: #ffc4ad; }
.network-title { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.network-title h3 { margin-bottom: 0; }
.network-title > span { color: var(--muted); font-size: 13px; font-weight: 650; }
.amount { margin: 21px 0 6px; color: inherit; font-size: clamp(26px, 4vw, 44px); line-height: 1.12; font-weight: 700; letter-spacing: -.035em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.exact-amount { margin: 0 0 6px; font-size: 13px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.balance-label, .evidence { margin: 0; font-size: 14px; }
.evidence { margin: 4px 0 14px; }
.token-result { padding: 13px 0; border-top: 1px solid var(--line); }
.balance-card[data-chain="bsc"] .token-result { border-top-color: #776a62; }
.token-result p { margin-bottom: 4px; color: inherit; font-weight: 650; overflow-wrap: anywhere; }
.code, code { font-family: ui-monospace, monospace; overflow-wrap: anywhere; }
.code { font-size: 13px; }
.explorer { display: inline-block; margin-top: auto; padding-top: 6px; font-size: 14px; }
.app-note { margin-top: 50px; padding-top: 20px; border-top: 1px solid var(--line); }
.app-note p { margin-top: 4px; }

.guide { max-width: 1050px; }
.guide h1 { margin-bottom: 13px; }
.guide-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: clamp(28px, 7vw, 102px); margin-top: 42px; }
.guide-index { display: grid; gap: 11px; align-self: start; font-size: 14px; font-weight: 630; }
.guide-index a { display: block; padding: 5px 0; }
.guide-copy section { max-width: 68ch; margin-bottom: 36px; scroll-margin-top: 24px; }
.guide-copy h2 { font-size: 32px; margin-bottom: 10px; }
.guide-copy ul { padding-left: 20px; line-height: 1.8; }
.result-guide { margin: 22px 0; }
.result-guide > div { margin-bottom: 13px; }
.result-guide dt { font-weight: 680; }
.result-guide dd { margin: 2px 0 0; color: var(--muted); line-height: 1.55; }

@media (max-width: 820px) {
  .site-header, .shell { width: calc(100% - 46px); }
  .hero-copy, .work-sequence, .questions, .lookup-layout { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .hero-copy { padding-bottom: 30px; }
  .workspace { padding-top: 49px; }
  .guide-layout { grid-template-columns: 150px minmax(0, 1fr); }
}
@media (max-width: 555px) {
  .site-header, .shell { width: calc(100% - 36px); }
  .site-header { min-height: 67px; gap: 12px; }
  .site-header nav { gap: 13px; font-size: 13px; }
  .site-header nav a[href="#how"] { display: none; }
  .site-header .nav-action { padding: 7px 9px; }
  .hero-copy h1 { font-size: clamp(47px, 12vw, 65px); }
  .balance-grid, .token-inputs, .address-row, .guide-layout { grid-template-columns: minmax(0, 1fr); }
  .guide-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide-layout { margin-top: 31px; }
  .footer-row { min-height: 132px; align-items: flex-start; flex-direction: column; justify-content: center; gap: 8px; }
}
