:root {
  color: #fff8ed;
  background: #1a0807;
  font-family: Arial Black, Impact, system-ui, sans-serif;
  color-scheme: dark;
  --cream: #fff1d3;
  --blood: #8f231d;
  --dark-blood: #4e100d;
  --fat: #f6d6aa;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, #6f2119 0, #2a0c09 58%, #120403 100%);
}

[data-contract-stage] {
  position: relative;
  width: min(100vw, calc(100vh * var(--stage-ratio)));
  aspect-ratio: var(--stage-ratio);
  overflow: hidden;
  background: #7d251f;
  isolation: isolate;
  box-shadow: 0 0 80px #000c;
}

[data-contract-id] {
  position: absolute;
  margin: 0;
}

[data-contract-id="stage-master"] {
  display: block;
  object-fit: contain;
  transform-origin: 50% 48%;
  will-change: transform, filter;
}

[data-contract-id="title-text"] {
  display: flex;
  align-items: center;
  color: var(--cream);
  font-family: Impact, Arial Black, sans-serif;
  font-size: clamp(28px, 4.5vw, 82px);
  line-height: .88;
  letter-spacing: -.035em;
  text-shadow: 0 4px 0 var(--dark-blood), 0 9px 28px #0009;
  white-space: nowrap;
}

[data-contract-id="ticker-text"] {
  display: grid;
  place-items: center;
  border: 2px solid #661812;
  border-radius: 999px;
  background: color-mix(in srgb, var(--fat) 92%, transparent);
  color: var(--dark-blood);
  font: 900 clamp(12px, 1.25vw, 22px) / 1 system-ui, sans-serif;
  letter-spacing: .08em;
  box-shadow: 0 6px 22px #0003;
}

button[data-contract-id],
a[data-contract-id][role="link"] {
  min-width: 44px;
  min-height: 44px;
  border: 2px solid var(--cream);
  border-radius: 999px;
  background: var(--blood);
  color: var(--cream);
  font-weight: 900;
  cursor: pointer;
  display: grid;
  place-items: center;
  text-align: center;
  text-decoration: none;
  font-family: Arial Black, system-ui, sans-serif;
}

button[data-contract-id]:focus-visible,
a[data-contract-id]:focus-visible {
  outline: 4px solid #fff;
  outline-offset: 3px;
}

[data-contract-id="action-button"] {
  border-width: 4px;
  background: var(--cream);
  color: var(--dark-blood);
  font-size: clamp(18px, 2vw, 34px);
  box-shadow: 0 8px 0 #5a1712, 0 18px 40px #0007;
  transition: transform 120ms ease, box-shadow 120ms ease;
}

[data-contract-id="action-button"]:active:not(:disabled) {
  transform: translateY(5px);
  box-shadow: 0 3px 0 #5a1712, 0 10px 24px #0007;
}

[data-contract-id="action-button"]:disabled {
  cursor: wait;
}

[data-contract-id="payoff-text"] {
  display: grid;
  place-items: center;
  color: var(--cream);
  font-family: Impact, Arial Black, sans-serif;
  font-size: clamp(36px, 6vw, 104px);
  letter-spacing: -.04em;
  line-height: .9;
  text-align: center;
  text-shadow: 0 5px 0 var(--blood), 0 12px 32px #0009;
  white-space: nowrap;
}

[data-contract-id="impact-burst"] {
  border: clamp(6px, .7vw, 12px) solid color-mix(in srgb, var(--cream) 85%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 0 16px #9a23194d, 0 0 80px 22px #fff0c259;
  pointer-events: none;
}

[data-contract-id="x-link"],
[data-contract-id="pump-link"],
[data-contract-id="copy-ca"] {
  padding: 0 .7em;
  font-size: clamp(10px, 1.05vw, 18px);
  box-shadow: 0 6px 18px #0006;
}

[data-contract-id="copy-status"] {
  display: grid;
  align-items: center;
  color: var(--cream);
  font: 900 clamp(10px, 1vw, 17px) / 1 system-ui, sans-serif;
  text-shadow: 0 2px 8px #000;
}

[data-contract-id="mute-button"] {
  font-size: 0;
}

a[data-contract-id][aria-disabled="true"] {
  cursor: default;
  opacity: .55;
}

[data-contract-visibility="dimmed"] {
  opacity: .45;
}

[data-contract-state="impact-state"] [data-contract-id="stage-master"] {
  animation: meat-impact var(--pulse-duration, 420ms) cubic-bezier(.18, .75, .2, 1);
}

[data-contract-state="impact-state"] [data-contract-id="impact-burst"] {
  animation: burst var(--pulse-duration, 420ms) ease-out both;
}

[data-contract-state="impact-state"] [data-contract-id="payoff-text"] {
  animation: words-hit var(--pulse-duration, 420ms) cubic-bezier(.17, .89, .32, 1.45) both;
}

[data-contract-state="payoff-state"] [data-contract-id="payoff-text"] {
  transform: rotate(-2deg);
}

@keyframes meat-impact {
  0% { transform: scale(1); filter: saturate(1); }
  38% { transform: scale(1.045) rotate(-.35deg); filter: saturate(1.25) contrast(1.06); }
  60% { transform: scale(.992) rotate(.2deg); }
  100% { transform: scale(1); filter: saturate(1); }
}

@keyframes burst {
  0% { opacity: 0; transform: scale(.45); }
  34% { opacity: .9; }
  100% { opacity: 0; transform: scale(1.45); }
}

@keyframes words-hit {
  0% { opacity: 0; transform: scale(.45) rotate(6deg); }
  65% { opacity: 1; transform: scale(1.08) rotate(-3deg); }
  100% { opacity: 1; transform: scale(1) rotate(-2deg); }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}