:root {
  color-scheme: light;
  --paper: #f0ede4;
  --ink: #272921;
  --muted: #66665b;
  --copper: #965638;
  --line: #c5c2b6;
  --gutter: clamp(1.25rem, 4.2vw, 5rem);
  --ease: cubic-bezier(.22, 1, .36, 1);
  font-family: "Avenir Next", Avenir, sans-serif;
  font-synthesis: none;
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }
body, h1, p { margin: 0; }
body { min-width: 280px; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; }
a { color: inherit; }
button { border: 0; border-radius: 0; }
button:enabled { cursor: pointer; }
:focus-visible { outline: 2px solid var(--copper); outline-offset: 6px; }
::selection { background: var(--ink); color: var(--paper); }
[hidden] { display: none !important; }

.landing { max-width: 1800px; min-height: 100svh; margin: auto; padding: 0 var(--gutter); display: flex; flex-direction: column; }
.masthead { display: flex; justify-content: space-between; align-items: center; min-height: 91px; gap: 1.5rem; border-bottom: 1px solid var(--line); font-size: .75rem; }
.masthead p { margin-left: auto; }
.wordmark { display: inline-flex; align-items: baseline; gap: .12em; font-family: "Iowan Old Style", Baskerville, "Times New Roman", serif; font-size: 2.5rem; line-height: 1; letter-spacing: -.08em; text-decoration: none; }
.wordmark-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--copper); }
.edition { padding-left: clamp(2rem, 7vw, 9rem); color: var(--muted); }
.domain-selector { display: flex; align-items: center; gap: 2.5rem; margin-top: 1.5rem; }
.domain-selector button { position: relative; display: flex; align-items: center; gap: .8rem; background: transparent; min-height: 48px; padding: .6rem 0; font-size: .875rem; color: var(--muted); }
.domain-selector button::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform 300ms var(--ease); }
.domain-selector button[aria-pressed="true"] { color: var(--ink); }
.domain-selector button[aria-pressed="true"]::after { transform: scaleX(1); }
.domain-selector button:hover { color: var(--ink); }
.selector-number { font-size: .625rem; color: var(--copper); }
.selector-mark { margin-left: 1rem; opacity: 0; transition: opacity 200ms var(--ease), transform 300ms var(--ease); transform: translate(-3px, 3px); }
.domain-selector button[aria-pressed="true"] .selector-mark { opacity: 1; transform: translate(0, 0); }

.hero { flex: 1; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: center; gap: 1rem; min-height: 365px; padding: clamp(2rem, 3.5vh, 3rem) 0; }
.hero-copy { position: relative; z-index: 1; }
.domain-address { margin-bottom: clamp(1.3rem, 2.5vh, 2rem); color: var(--muted); font-size: .75rem; line-height: 1.4; overflow-wrap: anywhere; }
.domain-title { font-family: "Iowan Old Style", Baskerville, "Times New Roman", serif; font-size: clamp(5rem, 10.5vw, 11.8rem); font-weight: 400; line-height: .84; letter-spacing: -.066em; word-spacing: .08em; }
.title-line { display: block; }
.title-line + .title-line { margin-top: .035em; }
.domain-suffix { margin-left: .12em; font-size: .38em; letter-spacing: -.035em; }
.domain-title.is-chinese { font-size: clamp(3rem, 6.9vw, 7.8rem); line-height: .92; }
.title-small { display: block; margin-bottom: .55em; font-family: "Avenir Next", Avenir, sans-serif; font-size: .2em; font-weight: 500; letter-spacing: -.015em; word-spacing: normal; }
.title-end { margin-top: .15em; font-size: .65em; }
.orbit-art { justify-self: end; width: min(100%, 44vh, 440px); text-align: center; color: var(--copper); }
.orbit-sculpture { display: block; width: 100%; overflow: visible; }
.orbit-system { stroke: currentColor; stroke-width: .65; transform-origin: 220px 220px; animation: orbital-turn 60s linear infinite; }
.outer-orbit { opacity: .55; }
.orbit-axis { opacity: .35; }
.orbit-satellite { transform-origin: 220px 220px; animation: orbital-turn 26s linear infinite; fill: currentColor; }
.orbit-core { fill: var(--paper); stroke: currentColor; stroke-width: .65; }
.orbit-number { fill: var(--ink); font-family: "Iowan Old Style", Baskerville, "Times New Roman", serif; font-size: 32px; }
.orbit-ticks { stroke: currentColor; stroke-width: .6; }
.orbit-caption { display: block; margin-top: -1rem; font-size: .6875rem; letter-spacing: .02em; color: var(--muted); }

.purchase-row { display: flex; justify-content: space-between; align-items: end; gap: 2rem; padding: 1.25rem 0 2.15rem; }
.price-label { display: flex; align-items: baseline; gap: 1.25rem; margin-bottom: .65rem; font-size: .8125rem; }
.payment-asset { color: var(--muted); font-size: .6875rem; }
.price { font-size: clamp(3.5rem, 6.5vw, 7.3125rem); font-weight: 500; letter-spacing: -.07em; line-height: 1; font-variant-numeric: tabular-nums; }
.purchase-action { width: min(100%, 345px); padding-bottom: .2rem; }
.purchase-button { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%; min-height: 66px; padding: 1.2rem 1.5rem; background: var(--ink); color: var(--paper); font-size: .9375rem; text-align: left; transition: transform 180ms var(--ease); }
.purchase-button svg { flex-shrink: 0; transition: transform 300ms var(--ease); }
.purchase-button:hover svg { transform: translate(3px, -3px); }
.purchase-button:active { transform: translateY(1px); }
.purchase-button:disabled { opacity: .5; cursor: not-allowed; }
.purchase-note { margin-top: .8rem; font-size: .6875rem; color: var(--muted); text-align: right; }
.price-timeline { position: relative; display: flex; align-items: center; gap: 1.3rem; min-height: 73px; border-top: 1px solid var(--line); font-size: .6875rem; }
.timeline-label { display: flex; align-items: center; gap: .8rem; }
.timeline-label svg { color: var(--copper); }
.timeline-copy { display: flex; flex-direction: column; gap: .2rem; }
.price-rule { color: var(--muted); font-size: .625rem; white-space: nowrap; }
.next-price { display: flex; align-items: baseline; gap: .6rem; color: var(--muted); }
.next-price time::before { content: "· "; }
.timeline-rule { flex: 1; height: 1px; background: var(--line); margin-left: .5rem; }
.sale-scope { color: var(--muted); white-space: nowrap; }
.offers { flex-shrink: 0; }
.offers summary { display: flex; align-items: center; gap: .8rem; min-height: 44px; cursor: pointer; list-style: none; }
.offers summary::-webkit-details-marker { display: none; }
.offers summary:hover > :first-child { text-decoration: underline; text-underline-offset: .3em; }
.offers-toggle { font-size: 1.25rem; font-weight: 400; transition: transform 200ms var(--ease); }
.offers[open] .offers-toggle { transform: rotate(45deg); }
.offers-panel { position: absolute; z-index: 4; bottom: calc(100% + .75rem); right: 0; width: min(27rem, 100%); padding: 1.5rem; background: var(--paper); border: 1px solid var(--line); border-top: 2px solid var(--ink); }
.offers-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.offers-heading h2 { margin: 0; font-size: 1rem; font-weight: 500; letter-spacing: -.025em; }
.offers-preview-label { font-size: .5625rem; letter-spacing: .055em; color: var(--copper); }
.offers-empty { margin: 1.75rem 0 .5rem; color: var(--muted); font-size: .8125rem; }
.offers-table { width: 100%; border-collapse: collapse; text-align: left; font-size: .8125rem; }
.offers-table th { padding: 0 0 .6rem; font-weight: 400; font-size: .625rem; color: var(--muted); }
.offers-table td { padding: .75rem 0; border-top: 1px solid var(--line); }
.offers-table th:last-child, .offers-table td:last-child { text-align: right; }
.offers-table td:first-child { font-variant-numeric: tabular-nums; }
.offers-table td:not(:first-child) { color: var(--muted); font-size: .6875rem; }
.offers-disclaimer { margin-top: 1rem; color: var(--muted); font-size: .6875rem; line-height: 1.5; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: absolute; z-index: 3; top: 1rem; left: var(--gutter); padding: .75rem; background: var(--ink); color: var(--paper); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.no-script { padding: 1rem 0; max-width: 45rem; font-size: .875rem; line-height: 1.5; }

@keyframes orbital-turn { to { transform: rotate(360deg); } }
@keyframes enter { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: no-preference) {
  .hero-copy { animation: enter 650ms var(--ease) both; }
  .purchase-row { animation: enter 650ms 90ms var(--ease) both; }
}

@media (min-width: 1100px) and (max-height: 760px) {
  .masthead { min-height: 72px; }
  .domain-selector { margin-top: .6rem; }
  .hero { min-height: 285px; padding: 1.25rem 0; }
  .domain-title { font-size: min(10vw, 23vh); }
  .domain-title.is-chinese { font-size: min(6.9vw, 16vh); }
  .orbit-art { width: min(100%, 330px); }
  .purchase-row { padding-bottom: 1.25rem; }
  .price { font-size: 5.5rem; }
  .price-timeline { min-height: 60px; }
}

@media (min-width: 761px) and (max-width: 1099px) {
  .hero { min-height: 340px; }
  .orbit-art { width: min(100%, 36vh, 360px); }
}

@media (max-width: 760px) {
  .masthead { min-height: 78px; font-size: .6875rem; }
  .wordmark { font-size: 2.2rem; }
  .edition { display: none; }
  .domain-selector { gap: 1.5rem; justify-content: space-between; margin-top: .75rem; }
  .domain-selector button { gap: .5rem; font-size: .75rem; }
  .selector-mark { margin-left: .15rem; }
  .hero { grid-template-columns: 1fr; min-height: 330px; padding: 2.5rem 0 2rem; position: relative; }
  .hero-copy { padding-bottom: 1.8rem; }
  .domain-address { font-size: .625rem; max-width: 100%; }
  .domain-title { font-size: clamp(4.5rem, 16.5vw, 7.5rem); }
  .domain-title.is-chinese { font-size: clamp(3.5rem, 12.7vw, 5.75rem); }
  .title-small { font-size: .24em; }
  .orbit-art { position: absolute; width: 122px; right: -12px; bottom: -7px; z-index: 0; }
  .orbit-caption { display: none; }
  .orbit-number { font-size: 34px; }
  .purchase-row { align-items: stretch; flex-direction: column; gap: 1.65rem; padding-top: 0; padding-bottom: 1.6rem; }
  .price { font-size: clamp(3.5rem, 13.7vw, 6rem); }
  .purchase-action { width: 100%; }
  .purchase-button { min-height: 60px; }
  .purchase-note { text-align: left; }
  .price-timeline { display: grid; grid-template-columns: 1fr minmax(0, 1fr); align-items: center; gap: .5rem; padding: .9rem 0; font-size: .625rem; }
  .timeline-label { gap: .5rem; }
  .timeline-label svg { width: 24px; }
  .timeline-rule { display: none; }
  .sale-scope { display: block; margin-top: .1rem; padding-left: 29px; }
  .next-price { flex-wrap: wrap; justify-content: end; gap: .2rem; max-width: 100%; text-align: right; }
  .next-price time { display: block; width: 100%; text-align: right; }
  .next-price time::before { content: ""; }
  .offers { justify-self: end; }
  .offers summary { min-height: 32px; }
  .offers-panel { padding: 1.25rem; }
  .price-rule { font-size: .5625rem; }
}

@media (max-width: 360px) {
  .domain-selector { gap: .8rem; }
  .domain-selector button { font-size: .6875rem; }
  .selector-mark { display: none; }
  .hero { min-height: 250px; }
  .domain-title { font-size: 15.8vw; }
  .domain-title.is-chinese { font-size: 12.5vw; }
  .orbit-art { width: 100px; }
  .price-label { gap: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
