:root {
  --ink: #111; --paper: #f3eee3; --blue: #3d7eff; --pink: #ff4fa3; --yellow: #ffe14a;
  --ok: #0a7a45; --bad: #b00020; --tap: 44px; --safe-b: env(safe-area-inset-bottom, 0px);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.4 "Helvetica Neue", Arial, sans-serif; -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body { padding: env(safe-area-inset-top) env(safe-area-inset-right) var(--safe-b) env(safe-area-inset-left); }
h1 { font-size: clamp(1.5rem, 6vw, 2.4rem); line-height: 1.1; margin: .5rem 0; }
h2 { font-size: 1.15rem; margin: .25rem 0 .5rem; }
h3 { font-size: 1rem; margin: .75rem 0 .35rem; }
button, input, select { font: inherit; }
button { cursor: pointer; touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 8px; top: 8px; background: #fff; padding: .5rem; z-index: 9; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.bar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .55rem .75rem; background: #111; color: #fff; }
.brand { letter-spacing: .08em; }
.bar a { color: #fff; }
.supply { font-size: .9rem; }

main { max-width: 1180px; margin: 0 auto; padding: .75rem .75rem 2rem; }
.lede { max-width: 40rem; margin: .25rem 0 .5rem; }
.facts { margin: .25rem 0; }
.hold { font-size: .9rem; margin: .25rem 0; }
.status { min-height: 1.2em; margin: .35rem 0; }
.status.bad { color: var(--bad); }
.status.ok { color: var(--ok); }
.hint, .fine { font-size: .88rem; opacity: .85; }
.row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .5rem 0; }

.btn { min-height: var(--tap); border: 2px solid var(--ink); background: var(--yellow); color: #111; padding: .5rem 1rem; font-weight: 700; }
.btn.ghost { background: #fff; }
.btn.pink { background: var(--pink); color: #fff; }
.btn.big { width: 100%; font-size: 1.1rem; min-height: 54px; }
.btn.small { min-height: var(--tap); font-size: .9rem; padding: .3rem .8rem; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn[aria-disabled="true"].off { background: #d9d4c7; color: #333; border-style: dashed; cursor: help; }
.btn.busy { cursor: progress; position: relative; }
.btn.busy::after { content: ""; display: inline-block; width: .9em; height: .9em; margin-left: .5em; vertical-align: -.1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
a.btn { display: inline-flex; align-items: center; text-decoration: none; }

.grid { list-style: none; margin: .5rem 0; padding: 0; display: grid; gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid button { display: block; width: 100%; padding: .3rem; border: 2px solid var(--ink); background: #fff; text-align: left; }
.grid button[aria-pressed="true"] { outline: 4px solid var(--pink); outline-offset: 0; }
.grid img, .grid .ph { display: block; width: 100%; aspect-ratio: 3 / 4; background: #ddd; object-fit: cover; }
.grid .t { display: block; font-size: .8rem; margin-top: .25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.grid .gone { opacity: .45; }
.grid .tag { font-size: .75rem; font-weight: 700; }

.detail { display: grid; gap: .75rem; grid-template-columns: minmax(0, 1fr); margin-top: .75rem; border-top: 2px solid var(--ink); padding-top: .75rem; }
.preview { background: #fff; border: 2px solid var(--ink); }
.preview svg { display: block; width: 100%; height: auto; cursor: crosshair; }
.quote { font-style: italic; margin: 0 0 .25rem; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chips button { min-height: var(--tap); min-width: 88px; border: 2px solid var(--ink); color: #111; font-weight: 700; padding: 0 .6rem; text-shadow: 0 0 3px #fff; }
.chips button[aria-checked="true"] { outline: 3px solid #111; outline-offset: 2px; }
.mintbox { margin-top: 1rem; background: #fff; border: 2px solid var(--ink); padding: .75rem; }
.mintbox a { font-weight: 700; }
.dev { font-size: .85rem; background: #fff7c2; border: 1px dashed #111; padding: .4rem .5rem; }

.popover { border: 2px solid var(--ink); padding: 1rem; max-width: min(92vw, 420px); }
.popover::backdrop { background: rgb(0 0 0 / .35); }
.palette { display: grid; grid-template-columns: repeat(5, 1fr); gap: .4rem; }
.palette button { aspect-ratio: 1; min-height: var(--tap); border: 2px solid var(--ink); }
.palette button[aria-checked="true"] { outline: 3px solid var(--blue); outline-offset: 2px; }

@media (min-width: 720px) {
  .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .detail { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; }
}
@media (min-width: 1080px) { .grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* token page */
.token { display: grid; gap: .75rem; grid-template-columns: minmax(0, 1fr); }
.token img { display: block; width: 100%; height: auto; border: 2px solid var(--ink); background: #fff; }
.pill { display: inline-block; padding: .15rem .55rem; border: 2px solid var(--ink); background: #fff; font-weight: 700; }
.pill.revealed { background: var(--yellow); }
@media (min-width: 720px) { .token { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* admin */
.kpis { display: grid; gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: .5rem 0; }
.kpi { background: #fff; border: 2px solid var(--ink); padding: .5rem; }
.kpi b { display: block; font-size: 1.25rem; }
.kpi span { font-size: .8rem; }
.panel { background: #fff; border: 2px solid var(--ink); padding: .75rem; margin: .75rem 0; overflow-x: auto; }
.alert { background: #ffe1e1; border: 2px solid var(--bad); padding: .5rem .75rem; margin: .5rem 0; }
table { border-collapse: collapse; width: 100%; font-size: .88rem; }
th, td { text-align: left; padding: .35rem .4rem; border-bottom: 1px solid #ccc; vertical-align: top; }
td img { width: 48px; height: 64px; object-fit: cover; border: 1px solid #111; }
.field { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; margin: .35rem 0; }
.field input { min-height: 40px; border: 2px solid var(--ink); padding: 0 .5rem; width: 12rem; }
@media (min-width: 720px) { .kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* gallery */
.nav { display: flex; gap: .9rem; font-size: .95rem; margin-right: auto; margin-left: .75rem; }
.nav a { text-decoration: none; }
.nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 3px; }
.filters { margin: .5rem 0; }
.filters button { background: #fff; min-width: 0; }
.filters button[aria-checked="true"] { background: var(--yellow); }
.gallery li { position: relative; }
.gallery .card { display: block; padding: .3rem; border: 2px solid var(--ink); background: #fff; color: inherit; text-decoration: none; }
.gallery .card:focus-visible, .gallery .card:hover { outline: 4px solid var(--pink); outline-offset: 0; }
.gallery img, .gallery .ph { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; background: #ddd; object-fit: cover; }
.gallery .badge { position: absolute; top: .6rem; left: .6rem; font-size: .72rem; font-weight: 700; padding: .1rem .4rem; border: 2px solid var(--ink); background: #fff; }
.gallery .badge.revealed { background: var(--yellow); }
@media (min-width: 640px) { .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 960px) { .gallery { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* ---------- v3: banner, info, how, badges, a11y, dark ---------- */
.banner { display: flex; align-items: center; gap: .5rem; padding: .45rem .5rem .45rem .9rem; background: var(--yellow); color: #111; border-bottom: 2px solid var(--ink); font-size: .95rem; }
.banner p { margin: 0; flex: 1; }
.banner a { color: #111; font-weight: 700; }
.banner-x, .info-x { min-width: var(--tap); min-height: var(--tap); border: 0; background: transparent; color: inherit; font-size: 1.5rem; line-height: 1; }
.hrow { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; }
.hrow h2, .hrow h3 { margin: 0; }
.hrow .btn.big { flex: 1; }
button.info { width: var(--tap); height: var(--tap); flex: none; padding: 0; border: 0; background: transparent; color: inherit; font: italic 700 .95rem/1 Georgia, serif; position: relative; vertical-align: middle; }
button.info::before { content: ""; position: absolute; inset: 11px; border: 2px solid currentColor; border-radius: 50%; }
button.info[aria-expanded="true"]::before { background: var(--yellow); border-color: #111; }
button.info[aria-expanded="true"] { color: #111; }
.info-pop { position: absolute; z-index: 20; width: min(320px, calc(100vw - 16px)); background: #fff; color: #111; border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); padding: .25rem .75rem .75rem; }
.info-pop p { margin: .25rem 0 0; }
.info-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
@media (max-width: 599px) {
  .info-pop { position: fixed; left: 0 !important; right: 0; bottom: 0; top: auto !important; width: auto; border-width: 2px 0 0; box-shadow: 0 -4px 0 var(--ink); padding-bottom: calc(.75rem + var(--safe-b)); }
}
.facts { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .15rem; }
.fact { display: inline-flex; align-items: center; gap: .1rem; padding-right: .6rem; }
.fact .info { margin-left: -.2rem; }
.how { margin: 1rem 0; background: #fff; border: 2px solid var(--ink); padding: .5rem 1rem .75rem; }
.how h2 { margin-top: .5rem; }
.steps { margin: 0; padding-left: 1.3rem; display: grid; gap: .45rem; }
.steps li { max-width: 48rem; }
.badges { position: absolute; top: .6rem; left: .6rem; right: .6rem; display: flex; flex-wrap: wrap; gap: .25rem; pointer-events: none; }
.gallery .badges .badge { position: static; }
.badge { display: inline-block; font-size: .72rem; font-weight: 700; padding: .1rem .4rem; border: 2px solid var(--ink); background: #fff; color: #111; }
.badge.revealed { background: var(--yellow); }
.badge.premint { background: #111; color: #fff; }
.badge.public { background: #dfe9ff; }
.legend { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .35rem; margin: .35rem 0; }
.legend .badge { font-size: .8rem; }
.gallery .sub { display: block; font-size: .75rem; opacity: .85; margin-top: .1rem; }
.gallery .t { display: block; font-size: .85rem; margin-top: .25rem; }
.gallery .market { display: flex; align-items: center; justify-content: center; min-height: var(--tap); margin-top: .25rem; border: 2px solid var(--ink); background: #fff; color: #111; font-weight: 700; font-size: .85rem; text-decoration: none; }
.gallery .market:hover, .gallery .market:focus-visible { background: var(--yellow); }
.links { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem; }
.links a { min-height: var(--tap); display: inline-flex; align-items: center; }
.art-col img { aspect-ratio: 3 / 4; height: auto; }
.nav a { display: inline-flex; align-items: center; min-height: var(--tap); }
.bar { padding-top: max(.55rem, env(safe-area-inset-top)); }
img { max-width: 100%; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media (prefers-color-scheme: dark) {
  :root { --ink: #f0ebe0; --paper: #15140f; }
  html, body { background: var(--paper); color: var(--ink); }
  .grid button, .preview, .mintbox, .how, .panel, .kpi, .gallery .card, .token img, .popover { background: #24221c; color: var(--ink); }
  .btn { color: #111; border-color: #111; }
  .btn.ghost { background: #f0ebe0; }
  .bar { background: #000; }
  a { color: #9cc1ff; }
  .banner a, .badge, .gallery .market { color: #111; }
  .badge.premint { background: #f0ebe0; color: #111; }
  .gallery .market { background: #f0ebe0; }
  .status.bad { color: #ff8a9b; }
  .status.ok { color: #6fdc9f; }
  .dev { color: #111; }
  .chips button { color: #111; }
  .filters button { background: #f0ebe0; }
  .btn[aria-disabled="true"].off { background: #4a463c; color: #f0ebe0; border-color: #f0ebe0; }
  .pill { background: #24221c; }
  .pill.revealed { color: #111; }
}
.nav a { min-width: var(--tap); justify-content: center; padding: 0 .25rem; }
.about { font-size: .88rem; gap: 0 .1rem; margin: .1rem 0 .3rem; }
.about span:not([data-info]) { margin-left: .35rem; }

/* ---------- v4: stats, editions, window controls, cleaner type ---------- */
:root { --muted: #5b564b; --line: #d8d1c1; --card: #fff; --radius: 10px; }
body { font: 16px/1.5 "Helvetica Neue", Arial, sans-serif; }
h1 { letter-spacing: -.01em; margin: .75rem 0 .5rem; }
h2 { font-size: 1.25rem; letter-spacing: -.005em; }
h3 { font-size: .95rem; margin: 0; }
.lede { color: inherit; font-size: 1.02rem; max-width: 42rem; }
.eyebrow { display: inline-block; margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.sub { margin: .15rem 0 .5rem; font-size: .88rem; color: var(--muted); }
button.info { font-size: 0; }
button.info::after { content: "i"; position: absolute; inset: 0; display: grid; place-items: center; font: italic 700 .95rem/1 Georgia, serif; }

/* header stats: a definition row of pills */
.stats { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0 .25rem; padding: 0; }
.stat { display: flex; flex-direction: column; min-width: 9.5rem; padding: .45rem .5rem .5rem .8rem; background: var(--card); border: 2px solid var(--ink); border-radius: var(--radius); }
.stat dt { display: flex; align-items: center; justify-content: space-between; margin: 0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.stat dt button.info { margin: -12px -10px -12px 0; }
.stat dd { margin: 0; font-size: 1.05rem; font-weight: 700; }
.stat-sub { font-weight: 400; font-size: .9rem; color: var(--muted); }
@media (max-width: 479px) { .stat { flex: 1 1 100%; flex-direction: row; align-items: center; justify-content: space-between; gap: .5rem; } .stat dt { order: 0; } }

/* banner */
.banner { font-size: .92rem; line-height: 1.35; }
.banner p { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .6rem; }
.banner-v { opacity: .85; }

/* editions */
.editions { list-style: none; padding: 0; margin: .5rem 0 .25rem; display: grid; gap: .4rem; }
.editions li { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
.badge { border-radius: 999px; padding: .12rem .55rem; }
.badge.physical { background: var(--yellow); color: #111; }
.how { border-radius: var(--radius); padding: .75rem 1.1rem 1rem; }
.steps { gap: .6rem; }

/* window controls */
.controls { display: grid; gap: .9rem; align-content: start; }
.controls h2 { margin: .1rem 0 0; }
.group { display: grid; gap: .35rem; }
.group .hrow { gap: .1rem; }
.sets { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .5rem; }
.sets button { display: flex; align-items: center; gap: .55rem; min-height: 56px; padding: .35rem .55rem; border: 2px solid var(--ink); border-radius: var(--radius); background: var(--card); color: var(--ink); text-align: left; text-shadow: none; font-weight: 400; }
.sets button[aria-checked="true"] { outline: 0; box-shadow: 0 0 0 3px var(--pink); }
.sets button[aria-checked="true"] .chip-name::after { content: " ✓"; }
.sw { flex: none; display: grid; grid-template-columns: repeat(3, 10px); gap: 3px; padding: 6px 5px; border-radius: 6px; border: 1px solid rgb(0 0 0 / .25); }
.sw-win { width: 10px; height: 18px; border: 1px solid rgb(0 0 0 / .35); }
.chip-text { display: grid; line-height: 1.2; min-width: 0; }
.chip-name { font-weight: 700; font-size: .95rem; }
.chip-hex { font: .72rem/1.3 ui-monospace, Menlo, monospace; color: var(--muted); }
.seg { display: inline-flex; flex-wrap: wrap; gap: .35rem; }
.seg button { min-height: 40px; padding: .3rem .75rem; border: 2px solid var(--ink); border-radius: 999px; background: var(--card); color: var(--ink); font-size: .9rem; }
.seg button[aria-checked="true"] { background: var(--ink); color: var(--paper); }
.row.tight { margin: 0; }
.status.tip:not(:empty) { padding: .5rem .7rem; border-left: 4px solid var(--blue); background: #eaf1ff; color: #111; border-radius: 0 6px 6px 0; }
.mintbox { border-radius: var(--radius); display: grid; gap: .4rem; margin-top: .25rem; }
.mintbox .fine { margin: 0; }
.facts-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 1rem; font-size: .88rem; }
.facts-list li { display: inline-flex; align-items: center; }
.preview { border-radius: 4px; overflow: hidden; }
.grid button { border-radius: 6px; }

/* gallery key and token */
.legend { list-style: none; padding: 0; display: grid; gap: .25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.legend li { display: flex; align-items: center; gap: .4rem; }
.legend-v { font-size: .85rem; color: var(--muted); }
.gallery .t span { display: block; }
.caption { margin: .5rem 0; padding: .5rem .8rem; border-left: 3px solid var(--line); }
.caption blockquote { margin: .2rem 0 0; font-style: italic; }
.market-btn { background: #2081e2; color: #fff; border-color: #2081e2; border-radius: 8px; justify-content: center; }
.market-btn:hover, .market-btn:focus-visible { background: #1868b7; }
@media (max-width: 599px) { .token .row { flex-wrap: nowrap; } .market-btn, #print { flex: 1; justify-content: center; } }
@media (prefers-color-scheme: dark) {
  :root { --muted: #b9b2a3; --line: #4a463c; --card: #24221c; }
  .sets button, .seg button, .stat { color: var(--ink); }
  .seg button[aria-checked="true"] { background: var(--ink); color: #111; }
  .status.tip:not(:empty) { background: #1d2a44; color: var(--ink); }
  .market-btn { color: #fff; border-color: #2081e2; }
}
/* header: OpenSea link, top right */
.bar { flex-wrap: nowrap; }
.supply { font-size: .85rem; opacity: .85; white-space: nowrap; }
.os-link { display: inline-flex; align-items: center; gap: .4rem; min-height: 36px; padding: .2rem .7rem .2rem .45rem; border-radius: 999px; background: #fff; color: #111 !important; font-size: .85rem; font-weight: 700; text-decoration: none; white-space: nowrap; flex: none; }
.os-link .os-mark { color: #2081e2; flex: none; }
.os-link:hover, .os-link:focus-visible { background: #e8f1fc; }
.os-short { display: none; }
@media (max-width: 899px) { .os-long { display: none; } .os-short { display: inline; } .bar .supply { display: none; } }
img.xe { display: inline-block; width: 1.25em; height: 1.25em; vertical-align: -.25em; margin-right: .15em; }
.site-foot { max-width: 1180px; margin: 1rem auto 0; padding: 1rem .75rem 1.5rem; border-top: 1px solid var(--line); text-align: center; font-size: .9rem; color: var(--muted); }
.site-foot p { margin: .15rem 0; }
.site-foot a { color: inherit; font-weight: 700; }
/* wallet picker */
.wallet-list { list-style: none; margin: .5rem 0; padding: 0; display: grid; gap: .4rem; }
.wallet-opt { display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 52px; padding: .4rem .7rem; border: 2px solid var(--ink); border-radius: var(--radius); background: var(--card); color: var(--ink); text-align: left; font-weight: 700; }
.wallet-opt small { display: block; font-weight: 400; color: var(--muted); }
.wallet-opt:hover, .wallet-opt:focus-visible { box-shadow: 0 0 0 3px var(--pink); }
.wallet-opt img { border-radius: 6px; }
.wallet-dot { width: 28px; height: 28px; border-radius: 6px; background: #f6851b; flex: none; }
.wallet-dot.wc { background: #3b99fc; }
.wallet-line { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin: 0; font-size: .9rem; }
/* gallery key v2: tidy aligned cards, badges never wrap */
.legend { list-style: none; margin: .75rem 0; padding: 0; display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.legend .key { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .6rem; min-height: 52px; padding: .3rem .3rem .3rem .6rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.legend .badge { white-space: nowrap; font-size: .78rem; }
.legend .key-note { font-size: .85rem; color: var(--muted); line-height: 1.3; }
.gallery .badge { white-space: normal; }
.tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin: .25rem 0 .75rem; }
.tabs button { min-height: 44px; min-width: 8.5rem; padding: .3rem 1rem; border: 2px solid var(--ink); border-radius: 999px; background: var(--card); color: var(--ink); font-weight: 700; font-size: .92rem; outline: 0; }
.tabs button[aria-checked="true"] { background: var(--ink); color: var(--paper); box-shadow: none; }
.tabs button:focus-visible { box-shadow: 0 0 0 3px var(--blue); }
.tabs button .xe { vertical-align: -3px; margin-right: .35rem; }
.tabs button { white-space: nowrap; }
@media (max-width: 479px) { .tabs { display: grid; grid-template-columns: 1fr 1fr; } .tabs button { min-width: 0; padding: .3rem .5rem; } }
@media (prefers-color-scheme: dark) { .tabs button[aria-checked="true"] { color: #111; } }

/* History page */
.history .toc { display: flex; flex-wrap: wrap; gap: .35rem .9rem; margin: .5rem 0 0; font-weight: 600; }
.history .hsec { max-width: 52rem; margin: 2rem 0 0; }
.history .hsec p { max-width: 42rem; }
.history .links { display: flex; flex-wrap: wrap; gap: .5rem; }
.history .small { font-size: .85rem; opacity: .8; }
.history .legend .key-note { white-space: normal; }
.cards3 { list-style: none; padding: 0; margin: .75rem 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.cards3 a { display: flex; flex-direction: column; gap: .2rem; color: inherit; text-decoration: none; border: 2px solid var(--ink); background: var(--card); padding: .4rem; }
.cards3 img, .history figure img { display: block; width: 100%; height: auto; }
.cards3 span { font-size: .85rem; text-decoration: underline; }
.history .split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.history .steps { margin: 0; padding-left: 1.25rem; display: grid; gap: .4rem; }
.history .pair { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.history .pair figcaption { grid-column: 1 / -1; font-size: .85rem; }
.history .flow { list-style: none; padding: 0; margin: .75rem 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; align-items: start; }
.history .flow figure { margin: 0; border: 2px solid var(--ink); background: var(--card); }
.history .flow figure img { max-height: 26rem; object-fit: cover; object-position: top; }
.history .flow figcaption { padding: .5rem .6rem .6rem; font-size: .92rem; }
.history .flow li.text { grid-column: 1 / -1; border-left: 4px solid var(--ink); padding: .1rem 0 .1rem .9rem; }
.history .flow li.text p { margin: .35rem 0; }
.history .choices { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1rem; margin: .5rem 0 0; }
.history .choices dt { font-weight: 700; }
.history .choices dd { margin: 0; max-width: 40rem; }
@media (max-width: 639px) {
  .cards3 { grid-template-columns: 1fr 1fr; }
  .cards3 li:last-child { grid-column: 1 / -1; max-width: calc(50% - .375rem); }
  .history .split { grid-template-columns: 1fr; }
  .history .choices { grid-template-columns: 1fr; gap: .15rem; }
  .history .choices dd { margin-bottom: .6rem; }
}
/* three nav links + the OpenSea button on small phones */
@media (max-width: 420px) {
  .bar { gap: .3rem; padding-left: .5rem; padding-right: .5rem; }
  .nav { gap: .2rem; margin-left: .35rem; font-size: .9rem; }
  .nav a { min-width: 0; padding: 0 .3rem; }
}
@media (max-width: 340px) { .bar .os-short { display: none; } .os-link { padding: .2rem .45rem; } }

/* magenta "pick a premint or mint blind" line */
.banner.pick { background: #a3005f; color: #fff; padding: .55rem .9rem; }
.banner.pick p { display: block; }
.banner.pick a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.banner.pick a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
#pick { scroll-margin-top: 1rem; }