* { box-sizing: border-box; }
body { margin: 0; color: #fff2da; background: #850201; font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
button:disabled { cursor: default; }
a:focus-visible, button:focus-visible { outline: 2px solid #fff2da; outline-offset: 5px; }
.stage { position: relative; isolation: isolate; min-height: 880px; height: 100svh; overflow: hidden; background: #850201 url('assets/background.png') center / cover no-repeat; }
header { position: relative; z-index: 2; display: flex; justify-content: space-between; padding: 30px 4.5vw; font-size: 14px; letter-spacing: .12em; }
.wordmark { font-weight: 900; }
#ticker { font-family: monospace; }
.art { position: absolute; right: 2vw; bottom: 0; width: min(70vw, calc(100svh - 70px), 1050px); pointer-events: none; z-index: -1; }
.art img { display: block; width: 100%; height: auto; mask-image: linear-gradient(to right, transparent, black 17%, black 87%, transparent), linear-gradient(to bottom, transparent, black 10%, black); mask-composite: intersect; -webkit-mask-image: linear-gradient(to right, transparent, black 17%, black 87%, transparent), linear-gradient(to bottom, transparent, black 10%, black); -webkit-mask-composite: source-in; }
.content { margin: 85px 0 80px 6vw; width: min(43vw, 610px); }
.eyebrow { font: 13px monospace; letter-spacing: .18em; margin: 0 0 25px; }
h1 { font-family: Impact, 'Arial Black', Arial, sans-serif; font-size: clamp(85px, 10.8vw, 170px); line-height: .83; font-weight: 900; letter-spacing: -.045em; margin: 0; }
h1 span { font-style: italic; }
.tagline { font-size: 20px; line-height: 1.5; margin: 29px 0; }
nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 8px; max-width: 560px; }
nav a { min-height: 70px; padding: 18px 15px; display: flex; align-items: center; justify-content: center; gap: 7px; background: url('assets/button.png') center / 100% 100% no-repeat; font-size: 14px; font-weight: 700; transition: transform .18s, filter .18s; white-space: nowrap; }
nav a:hover { transform: translateY(-2px); filter: brightness(1.25); }
nav a:active { transform: translateY(1px); }
a[aria-disabled='true'] { cursor: default; }
#copy { width: 100%; max-width: 550px; margin-top: 13px; padding: 15px 3px; border: 0; border-bottom: 1px solid #e4a99a; display: flex; align-items: center; gap: 18px; color: inherit; background: transparent; text-align: left; font-size: 14px; }
#address { font-family: monospace; flex: 1; overflow-wrap: anywhere; }
#status { font-size: 13px; min-height: 18px; max-width: 550px; overflow-wrap: anywhere; }
footer { position: absolute; bottom: 22px; left: 4.5vw; right: 4.5vw; display: flex; justify-content: space-between; align-items: center; font: 12px monospace; letter-spacing: .1em; }
footer button { color: inherit; background: transparent; border: 0; border-bottom: 1px solid currentColor; padding: 6px 0; font-size: 12px; }
@media (min-width: 1700px) { .content { margin-top: 12vh; } }
@media (max-width: 1000px) and (min-width: 701px) {
  .content { width: 48vw; margin-left: 4.5vw; }
  nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .art { width: 90vw; right: -18vw; }
}
@media (max-width: 700px) {
  .stage { height: auto; min-height: 100svh; padding-bottom: 66px; }
  header { padding: 23px 6vw; font-size: 12px; }
  .art { position: relative; width: 112%; right: auto; margin: -10px -6% -25px; z-index: -1; }
  .art img { mask-image: linear-gradient(to bottom, transparent, black 8%, black 78%, transparent); -webkit-mask-image: linear-gradient(to bottom, transparent, black 8%, black 78%, transparent); }
  .content { width: 88%; margin: -20px auto 25px; }
  .eyebrow { margin-bottom: 18px; }
  h1 { font-size: clamp(72px, 20vw, 130px); }
  h1 br { display: none; }
  h1 span { display: block; }
  .tagline { margin: 20px 0; font-size: 18px; }
  nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  nav a { min-height: 68px; }
  footer { left: 6vw; right: 6vw; }
}
@media (prefers-reduced-motion: reduce) { nav a { transition: none; } }
