/* THE GOD TERMINAL — popup scenes 31–34: safes, invest, mining, airdrop (the bitcoin set).
 * Interactive: tap a choice, or a reticle (css/crypto.css) drifts over and picks for you.
 * Shared pieces use the sc7- prefix (stage, foot with prompt → verdict); everything else
 * is .sc-<name>-*. Gold is the palette's --warn; all colours come from palette tokens
 * except a few physical materials (wood, toast), which stay what they are. */

@keyframes sc7-rise {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
@keyframes sc7-blink { 50% { opacity: 0.2; } }
@keyframes sc7-verdict {
  0% { opacity: 0; transform: scale(1.4, 0.05); filter: brightness(3); }
  30% { opacity: 1; transform: scale(0.97, 1.12); filter: brightness(2); }
  55% { transform: scale(1.02, 0.97); }
  100% { opacity: 1; transform: none; filter: none; }
}
@keyframes sc7-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes sc7-spin { to { rotate: 360deg; } }

/* ───────── shared ───────── */
.sc7-root {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  container-type: inline-size;
}

/* The instrument: dark glass, fine scanlines, lit HUD corner brackets. */
.sc7-stage {
  --hb: 12px;
  --hc: color-mix(in srgb, var(--line-bright) 80%, transparent);
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
  background:
    radial-gradient(90% 80% at 50% 50%, color-mix(in srgb, var(--glow) 9%, transparent), transparent 75%),
    color-mix(in srgb, var(--bg) 80%, transparent);
  box-shadow: inset 0 0 calc(34px * var(--glow-k)) calc(-14px * var(--glow-k)) var(--glow);
  animation: sc7-rise 280ms 40ms ease-out both;
}
.sc7-stage::before,
.sc7-stage::after {
  content: '';
  position: absolute;
  pointer-events: none;
  z-index: 8;
}
.sc7-stage::before {
  inset: 0;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.022) 0 1px, transparent 1px 3px);
}
.sc7-stage::after {
  inset: 5px;
  background:
    linear-gradient(var(--hc), var(--hc)) left top / var(--hb) 1.5px,
    linear-gradient(var(--hc), var(--hc)) left top / 1.5px var(--hb),
    linear-gradient(var(--hc), var(--hc)) right top / var(--hb) 1.5px,
    linear-gradient(var(--hc), var(--hc)) right top / 1.5px var(--hb),
    linear-gradient(var(--hc), var(--hc)) left bottom / var(--hb) 1.5px,
    linear-gradient(var(--hc), var(--hc)) left bottom / 1.5px var(--hb),
    linear-gradient(var(--hc), var(--hc)) right bottom / var(--hb) 1.5px,
    linear-gradient(var(--hc), var(--hc)) right bottom / 1.5px var(--hb);
  background-repeat: no-repeat;
  filter: drop-shadow(0 0 calc(4px * var(--glow-k)) var(--glow));
}

/* Foot: the prompt line, replaced by the verdict when the scene resolves. */
.sc7-foot {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 4.4rem;
  animation: sc7-rise 280ms 120ms ease-out both;
}
.sc7-foot > * { grid-area: 1 / 1; }
.sc7-prompt {
  --s: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  font-size: 0.9375rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: center;
  color: var(--text-bright);
  text-shadow: var(--text-glow);
  transition: opacity 200ms ease, transform 200ms ease;
}
.sc7-prompt::before {
  content: '';
  flex: none;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background: var(--s);
  box-shadow: 0 0 10px var(--s);
  animation: sc7-blink 640ms steps(1) infinite;
}
.sc7-prompt.is-busy { --s: var(--warn); }
.sc7-prompt.is-out { opacity: 0; transform: scale(0.96); }

.sc7-verdict {
  --v: var(--good);
  display: grid;
  justify-items: center;
  gap: 0.15rem;
  padding: 0.35rem 0.8rem 0.45rem;
  border-block: 1px solid color-mix(in srgb, var(--v) 70%, transparent);
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--v) 14%, transparent) 25% 75%, transparent);
  box-shadow: 0 0 calc(26px * var(--glow-k)) -10px var(--v);
  text-align: center;
  opacity: 0;
  pointer-events: none;
}
.sc7-verdict.is-in { animation: sc7-verdict 540ms cubic-bezier(.2, .9, .3, 1) both; }
.sc7-verdict.is-bad { --v: var(--bad); }
.sc7-verdict.is-warn { --v: var(--warn); }
.sc7-verdict-title {
  max-width: 100%;
  font-family: var(--font-display);
  font-size: min(3.1rem, 10.5cqw);
  font-weight: 400;
  line-height: 0.95;
  letter-spacing: 0.05em;
  color: color-mix(in srgb, var(--v) 55%, #fff);
  text-shadow: 0 0 calc(16px * var(--glow-k)) var(--v), 0 0 3px color-mix(in srgb, var(--v) 60%, transparent);
  text-wrap: balance;
}
.sc7-verdict-sub {
  max-width: 100%;
  text-wrap: balance;
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-bright);
  text-shadow: var(--text-glow);
}

@container (max-width: 380px) {
  .sc7-prompt { font-size: 0.8125rem; letter-spacing: 0.08em; }
  .sc7-verdict-sub { font-size: 0.75rem; letter-spacing: 0.06em; }
}

html[data-reduced-motion="on"] .sc7-verdict.is-in { animation: sc7-fade 300ms ease-out both; }
html[data-reduced-motion="on"] .sc7-prompt::before { animation: none; }

/* ───────── 31 · Crack the Vaults ───────── */
.sc-safes-stage {
  padding: 1.3rem 0.4rem 0.9rem;
  background:
    radial-gradient(28% 70% at 17% -8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 75%),
    radial-gradient(28% 70% at 50% -8%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 75%),
    radial-gradient(28% 70% at 83% -8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 75%),
    linear-gradient(180deg, transparent 76%, color-mix(in srgb, var(--text) 10%, transparent) 76.3%, color-mix(in srgb, var(--text) 4%, transparent) 77%, transparent),
    color-mix(in srgb, var(--bg) 84%, transparent);
  transition: box-shadow 300ms;
}
.sc-safes-row {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  font-size: clamp(5px, 2.65cqw, 16px);
}

.sc-safes-safe {
  appearance: none;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.7em;
  padding: 0.6em 0.5em 0.3em;
  border: 0;
  border-radius: 0.7em;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transform-origin: 50% 100%;
  transition: transform 160ms cubic-bezier(.2, 1.6, .4, 1), opacity 300ms, filter 300ms;
  -webkit-tap-highlight-color: transparent;
}
.sc-safes-safe::before {
  content: '';
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: 2.1rem;
  height: 1.4em;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(0, 0, 0, 0.75), transparent);
  pointer-events: none;
}
.sc-safes-safe.is-pressed { transform: scale(1.08); }
.sc-safes-safe.is-pressed .sc-safes-box { filter: brightness(1.35); }
.sc-safes-safe:focus-visible { outline: 2px solid var(--line-bright); outline-offset: 2px; }
.sc-safes-row.is-picked .sc-safes-safe { pointer-events: none; }
.sc-safes-row.is-picked .sc-safes-safe:not(.is-chosen):not(.is-open) { opacity: 0.55; filter: saturate(0.6); }

/* The body: one shell per model, all built from the palette's own tints. */
.sc-safes-box {
  --m: color-mix(in srgb, var(--text-bright) 24%, var(--bg));
  position: relative;
  perspective: 32em;
  border: 1px solid color-mix(in srgb, var(--m), #fff 22%);
  border-radius: 0.55em;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.16), transparent 36%),
    linear-gradient(180deg, color-mix(in srgb, var(--m), #fff 10%), var(--m) 50%, color-mix(in srgb, var(--m), #000 38%));
  box-shadow: 0 1.3em 1.2em -0.9em #000, 0 0 0 1px rgba(0, 0, 0, 0.55), inset 0 -0.3em 0.6em rgba(0, 0, 0, 0.35);
  transition: filter 160ms;
}
.sc-safes-inside {
  position: absolute;
  inset: 0.55em;
  overflow: hidden;
  border-radius: 0.35em;
  background: radial-gradient(90% 80% at 50% 30%, color-mix(in srgb, var(--m), #000 60%), #000);
  box-shadow: inset 0 0.5em 1.1em #000;
  transition: background 400ms;
}
.sc-safes-door {
  --u: 1em;
  position: absolute;
  inset: 0.55em;
  z-index: 2;
  border-radius: 0.35em;
  transform-origin: 0 50%;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.14), transparent 40%),
    linear-gradient(180deg, color-mix(in srgb, var(--m), #fff 14%), color-mix(in srgb, var(--m), #000 12%));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--m), #fff 18%), 0 0.2em 0.4em rgba(0, 0, 0, 0.5);
  backface-visibility: hidden;
}
/* The door's thickness, seen once it swings. */
.sc-safes-safe.is-open .sc-safes-door { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--m), #fff 18%), -0.5em 0 0.2em -0.1em color-mix(in srgb, var(--m), #000 50%); }

/* Vault: a chunky round door with a dial, a three-spoke wheel and bolts. */
.is-vault .sc-safes-box { width: 10.8em; height: 10.4em; }
.is-vault .sc-safes-box::before {
  content: '';
  position: absolute;
  inset: 0.35em;
  border-radius: 0.4em;
  background:
    radial-gradient(circle at 0.45em 0.45em, color-mix(in srgb, var(--m), #fff 35%) 0 0.18em, transparent 0.24em) left top / 50% 50% no-repeat,
    radial-gradient(circle at calc(100% - 0.45em) 0.45em, color-mix(in srgb, var(--m), #fff 35%) 0 0.18em, transparent 0.24em) right top / 50% 50% no-repeat,
    radial-gradient(circle at 0.45em calc(100% - 0.45em), color-mix(in srgb, var(--m), #fff 35%) 0 0.18em, transparent 0.24em) left bottom / 50% 50% no-repeat,
    radial-gradient(circle at calc(100% - 0.45em) calc(100% - 0.45em), color-mix(in srgb, var(--m), #fff 35%) 0 0.18em, transparent 0.24em) right bottom / 50% 50% no-repeat;
}
.is-vault .sc-safes-inside,
.is-vault .sc-safes-door { inset: 0.85em; border-radius: 50%; }
.is-vault .sc-safes-door {
  background:
    radial-gradient(circle, transparent 60%, rgba(0, 0, 0, 0.35) 61%, transparent 64%),
    repeating-conic-gradient(rgba(255, 255, 255, 0.06) 0 2deg, rgba(0, 0, 0, 0.06) 2deg 4deg),
    radial-gradient(circle at 40% 35%, color-mix(in srgb, var(--m), #fff 26%), var(--m) 55%, color-mix(in srgb, var(--m), #000 32%));
  box-shadow:
    0 0 0 0.22em color-mix(in srgb, var(--m), #000 30%),
    0 0 0 0.3em color-mix(in srgb, var(--m), #fff 22%),
    inset 0 0 1.1em rgba(0, 0, 0, 0.5);
}
.sc-safes-bolt {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.62em;
  height: 0.62em;
  margin: -0.31em;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, color-mix(in srgb, var(--m), #fff 55%), color-mix(in srgb, var(--m), #000 30%));
  box-shadow: 0 0.06em 0.1em rgba(0, 0, 0, 0.7);
  transform: rotate(calc(var(--k) * 45deg + 22.5deg)) translateY(-3.85em);
}
.sc-safes-wheel { position: absolute; inset: 0; }
.sc-safes-spoke {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.5em;
  height: 3.2em;
  margin-left: -0.25em;
  border-radius: 0.24em;
  transform-origin: 50% 0;
  transform: rotate(calc(var(--k) * 120deg + 180deg));
  background: linear-gradient(90deg, color-mix(in srgb, var(--m), #000 25%), color-mix(in srgb, var(--m), #fff 48%), color-mix(in srgb, var(--m), #000 25%));
  box-shadow: 0 0.12em 0.2em rgba(0, 0, 0, 0.6);
}
.sc-safes-spoke::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -0.32em;
  width: 0.85em;
  height: 0.85em;
  margin-left: -0.425em;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, color-mix(in srgb, var(--warn) 40%, #fff), var(--warn) 50%, color-mix(in srgb, var(--warn), #000 45%));
  box-shadow: 0 0 0.4em color-mix(in srgb, var(--warn) 50%, transparent);
}
.sc-safes-dial {
  --tick: color-mix(in srgb, var(--text-bright) 75%, transparent);
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3.2em;
  height: 3.2em;
  margin: -1.6em;
  border-radius: 50%;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--m), #fff 40%) 0 20%, color-mix(in srgb, var(--m), #000 25%) 21% 25%, transparent 26%),
    radial-gradient(circle, transparent 0 66%, rgba(0, 0, 0, 0.55) 67% 100%),
    repeating-conic-gradient(var(--tick) 0 1.6deg, transparent 1.6deg 12deg),
    radial-gradient(circle at 40% 35%, color-mix(in srgb, var(--m), #fff 30%), color-mix(in srgb, var(--m), #000 28%));
  box-shadow: 0 0.18em 0.35em rgba(0, 0, 0, 0.7), inset 0 0 0 0.13em color-mix(in srgb, var(--m), #000 40%);
}
.sc-safes-dial::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 6%;
  width: 0.2em;
  height: 0.75em;
  margin-left: -0.1em;
  border-radius: 0.1em;
  background: var(--warn);
  box-shadow: 0 0 0.35em var(--warn);
}
.is-vault .sc-safes-door::after {
  content: '';
  position: absolute;
  left: 50%;
  top: calc(50% - 2em);
  border: 0.32em solid transparent;
  border-top-color: var(--warn);
  margin-left: -0.32em;
  filter: drop-shadow(0 0 0.25em var(--warn));
}

/* Keypad: a tall, glossy safe behind a sweeping laser grid. */
.is-keypad .sc-safes-box {
  --m: color-mix(in srgb, var(--text-bright) 9%, var(--bg));
  width: 7.4em;
  height: 11.8em;
  border-color: color-mix(in srgb, var(--accent-2) 45%, transparent);
  box-shadow: 0 1.3em 1.2em -0.9em #000, 0 0 0 1px rgba(0, 0, 0, 0.55), 0 0 1em -0.4em var(--accent-2);
}
.is-keypad .sc-safes-door {
  inset: 0.45em;
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.16), transparent 28%),
    linear-gradient(180deg, color-mix(in srgb, var(--m), #fff 8%), color-mix(in srgb, var(--m), #000 30%));
}
.is-keypad .sc-safes-inside { inset: 0.45em; }
.sc-safes-lcd {
  position: absolute;
  left: 12%;
  right: 12%;
  top: 8%;
  height: calc(1.9 * var(--u));
  display: grid;
  place-items: center;
  overflow: hidden;
  white-space: nowrap;
  border-radius: 0.2em;
  background: color-mix(in srgb, var(--bg), #000 50%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-2) 30%, transparent), inset 0 0 0.6em rgba(0, 0, 0, 0.8);
  font-family: var(--font-display);
  font-size: max(0.75rem, 1.45em);
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--accent-2);
  text-shadow: 0 0 0.4em var(--accent-2);
}
.sc-safes-lcd.is-good { color: var(--good); text-shadow: 0 0 0.4em var(--good); }
.sc-safes-keys {
  position: absolute;
  left: 15%;
  right: 15%;
  top: 30%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.36em;
}
.sc-safes-keys i {
  aspect-ratio: 1;
  border-radius: 0.24em;
  background: linear-gradient(180deg, color-mix(in srgb, var(--m), #fff 22%), color-mix(in srgb, var(--m), #fff 6%));
  box-shadow: 0 0.12em 0 rgba(0, 0, 0, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.07);
  transition: background-color 120ms, box-shadow 120ms;
}
.sc-safes-keys i.is-lit {
  background: color-mix(in srgb, var(--accent-2) 70%, #fff);
  box-shadow: 0 0 0.7em var(--accent-2), 0 0.06em 0 rgba(0, 0, 0, 0.8);
}
.sc-safes-grip {
  position: absolute;
  right: 7%;
  top: 34%;
  width: 0.5em;
  height: 30%;
  border-radius: 0.3em;
  background: linear-gradient(90deg, color-mix(in srgb, var(--m), #fff 45%), color-mix(in srgb, var(--m), #fff 15%));
  box-shadow: 0 0.1em 0.2em #000;
}
.sc-safes-lasers {
  position: absolute;
  left: -1.4em;
  right: -1.4em;
  top: 6%;
  bottom: 8%;
  z-index: 4;
  pointer-events: none;
}
.sc-safes-lasers i {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--k) * 30% + 4%);
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--bad) 0 3%, transparent 3% 5%, color-mix(in srgb, var(--bad) 70%, transparent) 10%, color-mix(in srgb, var(--bad) 40%, #fff) 50%, color-mix(in srgb, var(--bad) 70%, transparent) 90%, transparent 95% 97%, var(--bad) 97%);
  box-shadow: 0 0 0.45em var(--bad), 0 0 1.2em color-mix(in srgb, var(--bad) 45%, transparent);
  rotate: calc(var(--t) * 1deg);
  animation: sc-safes-laser 2.6s ease-in-out calc(var(--k) * -0.9s) infinite alternate;
  transition: opacity 120ms;
}
@keyframes sc-safes-laser { from { translate: 0 -0.9em; } to { translate: 0 0.9em; } }
.sc-safes-lasers.is-off i { animation: sc-safes-laser-off 380ms steps(1) forwards; }
@keyframes sc-safes-laser-off { 0% { opacity: 1; } 20% { opacity: 0.1; } 40% { opacity: 0.9; } 60%, 100% { opacity: 0; } }

/* Hotel: wide and low, a red LED read-out, a little keypad and a knob. */
.is-hotel .sc-safes-box {
  --m: color-mix(in srgb, var(--accent-3) 16%, color-mix(in srgb, var(--text-bright) 30%, var(--bg)));
  width: 10.8em;
  height: 6.9em;
}
.is-hotel .sc-safes-door,
.is-hotel .sc-safes-inside { inset: 0.45em; }
.sc-safes-led {
  position: absolute;
  left: 7%;
  top: 12%;
  width: 50%;
  height: calc(2 * var(--u));
  display: grid;
  place-items: center;
  overflow: hidden;
  white-space: nowrap;
  border-radius: 0.2em;
  background: color-mix(in srgb, var(--bg), #000 55%);
  box-shadow: inset 0 0 0.6em #000, 0 0 0 1px color-mix(in srgb, var(--m), #000 35%);
  font-family: var(--font-display);
  font-size: max(0.75rem, 1.7em);
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--bad);
  text-shadow: 0 0 0.45em var(--bad);
}
.sc-safes-led.is-good { color: var(--good); text-shadow: 0 0 0.45em var(--good); }
.sc-safes-pad {
  position: absolute;
  right: 7%;
  top: 12%;
  width: 30%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.25em;
}
.sc-safes-pad i {
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, color-mix(in srgb, var(--m), #fff 40%), color-mix(in srgb, var(--m), #000 20%));
  box-shadow: 0 0.08em 0.1em rgba(0, 0, 0, 0.6);
  transition: background 120ms, box-shadow 120ms;
}
.sc-safes-pad i.is-lit { background: color-mix(in srgb, var(--bad) 60%, #fff); box-shadow: 0 0 0.5em var(--bad); }
.sc-safes-knob {
  position: absolute;
  left: 10%;
  bottom: 11%;
  width: 1.7em;
  height: 1.7em;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, color-mix(in srgb, var(--m), #fff 50%), color-mix(in srgb, var(--m), #000 30%));
  box-shadow: 0 0.15em 0.25em rgba(0, 0, 0, 0.7);
}
.sc-safes-knob::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 12%;
  bottom: 12%;
  width: 0.34em;
  margin-left: -0.17em;
  border-radius: 0.2em;
  background: color-mix(in srgb, var(--m), #000 35%);
}

/* The status plate under each safe: legible at any size. */
.sc-safes-plate {
  --p: 0;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-width: 5.6rem;
  padding: 0.12rem 0.5rem;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: rgba(0, 0, 0, 0.45);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  white-space: nowrap;
  color: var(--dim);
  transition: color 200ms, border-color 200ms, box-shadow 200ms;
}
.sc-safes-plate::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  transform-origin: 0 50%;
  transform: scaleX(var(--p));
  background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 22%, transparent), color-mix(in srgb, var(--accent) 50%, transparent));
}
.sc-safes-plate { isolation: isolate; }
.sc-safes-plate.is-cracking { color: var(--text-bright); border-color: var(--accent); }
.sc-safes-plate i {
  flex: none;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: var(--bad);
  box-shadow: 0 0 6px var(--bad);
}
.sc-safes-plate.is-open { color: var(--text-bright); border-color: var(--line-bright); }
.sc-safes-plate.is-open i { background: var(--good); box-shadow: 0 0 6px var(--good); }
.sc-safes-plate.is-gold { color: color-mix(in srgb, var(--warn) 60%, #fff); border-color: var(--warn); box-shadow: 0 0 12px -4px var(--warn); }
.sc-safes-plate.is-gold i { background: var(--warn); box-shadow: 0 0 6px var(--warn); }
.sc-safes-plate.is-bad { color: color-mix(in srgb, var(--bad) 60%, #fff); border-color: var(--bad); }
.sc-safes-plate.is-bad i { background: var(--bad); }
.sc-safes-plate.is-warm { color: color-mix(in srgb, var(--warn) 50%, #fff); border-color: color-mix(in srgb, var(--warn) 70%, transparent); }
.sc-safes-plate.is-warm i { background: var(--warn); box-shadow: 0 0 6px var(--warn); }

/* ── prizes ── */
.sc-safes-safe { --ray: var(--warn); }
.sc-safes-safe.has-cash, .sc-safes-safe.has-bags { --ray: var(--good); }
.sc-safes-safe.has-diamonds { --ray: var(--accent-2); }
.sc-safes-safe.has-puppies, .sc-safes-safe.has-kittens, .sc-safes-safe.has-snacks { --ray: var(--accent-3); }
.sc-safes-loot { position: absolute; inset: 0; }
.is-keypad .sc-safes-loot { font-size: 0.86em; }
.is-hotel .sc-safes-loot { font-size: 0.66em; }
.sc-safes-rays {
  position: absolute;
  left: 50%;
  top: 55%;
  width: 16em;
  height: 16em;
  margin: -8em;
  opacity: 0;
  background: repeating-conic-gradient(color-mix(in srgb, var(--ray) 32%, transparent) 0 7deg, transparent 7deg 20deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 10%, transparent 75%);
  mask-image: radial-gradient(closest-side, #000 10%, transparent 75%);
  transition: opacity 400ms;
}
.sc-safes-safe.is-open .sc-safes-inside {
  background: radial-gradient(80% 70% at 50% 65%, color-mix(in srgb, var(--ray) 40%, transparent), color-mix(in srgb, var(--ray) 6%, #000) 70%, #000);
}
.sc-safes-safe.is-open .sc-safes-rays { opacity: 0.6; }
.sc-safes-safe.is-open.is-chosen .sc-safes-rays { opacity: 1; animation: sc7-spin 9s linear infinite; }
.sc-safes-piece {
  position: absolute;
  left: calc(var(--x) * 1%);
  top: calc(var(--y) * 1%);
  font-size: var(--sz, 2.1em);
  font-style: normal;
  line-height: 1;
  translate: -50% -50%;
  filter: drop-shadow(0 0.1em 0.12em rgba(0, 0, 0, 0.65));
}
.sc-safes-piece.cr-coin { font-size: 2.1em; filter: none; }
/* Cash: banded stacks of bills. */
.sc-safes-stack,
.sc-safes-ingot {
  position: absolute;
  left: calc(var(--x) * 1%);
  top: calc(var(--y) * 1%);
  translate: -50% -50%;
}
.sc-safes-stack {
  width: 2.5em;
  height: 1.3em;
  border-radius: 0.12em;
  background:
    linear-gradient(90deg, transparent 42%, color-mix(in srgb, var(--warn) 70%, #fff) 42% 58%, transparent 58%),
    repeating-linear-gradient(180deg, color-mix(in srgb, var(--good), #fff 35%) 0 0.08em, color-mix(in srgb, var(--good), #000 25%) 0.08em 0.14em),
    var(--good);
  box-shadow: 0 0.12em 0.2em rgba(0, 0, 0, 0.6), inset 0 0 0 0.06em color-mix(in srgb, var(--good), #000 45%);
}
/* Gold: stamped ingots. */
.sc-safes-ingot {
  width: 2.5em;
  height: 1.2em;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--warn), #fff 45%), var(--warn) 45%, color-mix(in srgb, var(--warn), #000 35%));
  clip-path: polygon(14% 0, 86% 0, 100% 100%, 0 100%);
  filter: drop-shadow(0 0.1em 0.12em rgba(0, 0, 0, 0.6));
}
.sc-safes-cushion {
  position: absolute;
  left: 50%;
  bottom: 10%;
  width: 72%;
  height: 26%;
  translate: -50% 0;
  border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%;
  background: radial-gradient(70% 90% at 50% 30%, color-mix(in srgb, var(--bad), #fff 20%), color-mix(in srgb, var(--bad), #000 45%));
  box-shadow: 0 0.15em 0.3em rgba(0, 0, 0, 0.6);
}
.sc-safes-twinkle {
  position: absolute;
  left: calc(var(--x) * 1%);
  top: calc(var(--y) * 1%);
  width: 0.9em;
  height: 0.9em;
  translate: -50% -50%;
  background: radial-gradient(closest-side, #fff, transparent), linear-gradient(transparent 46%, #fff 46% 54%, transparent 54%), linear-gradient(90deg, transparent 46%, #fff 46% 54%, transparent 54%);
  opacity: 0;
}
.sc-safes-safe.is-open .sc-safes-twinkle { animation: sc-safes-twinkle 1.2s ease-in-out calc(var(--i) * 0.4s) infinite; }
@keyframes sc-safes-twinkle { 0%, 100% { opacity: 0; scale: 0.4; } 50% { opacity: 1; scale: 1.2; } }
@keyframes sc-safes-steam {
  0% { opacity: 0; transform: translateY(0.6em) scaleY(0.6); }
  30% { opacity: 0.8; }
  100% { opacity: 0; transform: translateY(-1.4em) scaleY(1.1) skewX(-14deg); }
}
/* Light pours out of the chosen vault once it's open. */
.sc-safes-beams {
  position: absolute;
  left: 50%;
  top: 40%;
  width: 26em;
  height: 26em;
  margin: -13em;
  z-index: -1;
  opacity: 0;
  pointer-events: none;
  background: repeating-conic-gradient(color-mix(in srgb, var(--ray) 22%, transparent) 0 6deg, transparent 6deg 18deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 20%, transparent 72%);
  mask-image: radial-gradient(closest-side, #000 20%, transparent 72%);
  transition: opacity 600ms;
}
.sc-safes-safe.is-open.is-chosen .sc-safes-beams { opacity: 1; animation: sc7-spin 16s linear infinite; }
.sc-safes-safe.is-chosen .sc-safes-box {
  box-shadow: 0 1.3em 1.2em -0.9em #000, 0 0 0 2px var(--accent), 0 0 2.2em -0.4em var(--accent);
}

/* Plates for prizes. */
.sc-safes-plate.is-cash { color: color-mix(in srgb, var(--good) 55%, #fff); border-color: var(--good); box-shadow: 0 0 12px -4px var(--good); }
.sc-safes-plate.is-cash i { background: var(--good); box-shadow: 0 0 6px var(--good); }
.sc-safes-plate.is-joy { color: color-mix(in srgb, var(--accent-3) 55%, #fff); border-color: var(--accent-3); box-shadow: 0 0 12px -4px var(--accent-3); }
.sc-safes-plate.is-joy i { background: var(--accent-3); box-shadow: 0 0 6px var(--accent-3); }
.sc7-verdict.is-joy { --v: var(--accent-3); }

/* The appraisal stamp. */
.sc-safes-appraise {
  position: absolute;
  left: 50%;
  top: 52%;
  z-index: 5;
  display: grid;
  justify-items: center;
  padding: 0.2em 0.5em 0.25em;
  border: 3px solid var(--warn);
  border-radius: 6px;
  background: color-mix(in srgb, var(--bg) 78%, transparent);
  box-shadow: 0 0 22px -4px var(--warn), inset 0 0 14px -6px var(--warn);
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
  transform: translate(-50%, -50%) rotate(-8deg);
}
.sc-safes-appraise small {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: clamp(0.04em, 0.2em, 0.18em);
  color: var(--warn);
}
.sc-safes-appraise b {
  font-size: clamp(0.875rem, 1.75em, 1.35rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, var(--warn) 45%, #fff);
  text-shadow: 0 0 12px var(--warn);
}
/* Puppies and kittens hop out and keep bouncing. */
.sc-safes-critter {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 6;
  line-height: 1;
  pointer-events: none;
  filter: drop-shadow(0 0.12em 0.15em rgba(0, 0, 0, 0.6));
}
.sc-safes-critter.is-happy { animation: sc-safes-hop 0.62s cubic-bezier(.3, .6, .5, 1) calc(var(--i) * 0.13s) infinite alternate; }
@keyframes sc-safes-hop { from { translate: 0 0; } to { translate: 0 -0.35em; } }

/* ── kickoff popup ── */
.sc-safes-kick { gap: 0.9rem; }
.sc-safes-kick-stage { padding: 0.9rem 0.4rem 0.6rem; }
.sc-safes-kick .sc-safes-row { font-size: clamp(4px, 1.85cqw, 8px); pointer-events: none; }
.sc-safes-kick .sc-safes-plate { display: none; }
.sc-safes-kick .sc-safes-safe { padding-bottom: 0; }
.sc-safes-kick .sc-safes-safe::before { bottom: -0.2rem; }
/* The big red button: an arcade cap with a pulsing halo and a sheen. */
.sc-safes-go {
  appearance: none;
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 4.4rem;
  padding: 0.7rem 1rem 0.8rem;
  border: 2px solid color-mix(in srgb, var(--bad), #fff 30%);
  border-radius: 14px;
  background: radial-gradient(130% 150% at 50% 0%, color-mix(in srgb, var(--bad), #fff 32%), var(--bad) 45%, color-mix(in srgb, var(--bad), #000 38%));
  box-shadow:
    0 0.38rem 0 color-mix(in srgb, var(--bad), #000 58%),
    0 0.8rem 1.4rem -0.4rem rgba(0, 0, 0, 0.75),
    inset 0 2px 0 rgba(255, 255, 255, 0.45),
    inset 0 -0.35rem 0.7rem color-mix(in srgb, var(--bad), #000 30%);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 1.375rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-shadow: 0 2px 0 color-mix(in srgb, var(--bad), #000 55%), 0 0 14px rgba(255, 255, 255, 0.45);
  cursor: pointer;
  transition: transform 140ms cubic-bezier(.2, 1.6, .4, 1), box-shadow 140ms, filter 160ms, opacity 300ms;
  -webkit-tap-highlight-color: transparent;
}
.sc-safes-go::before {
  content: '';
  position: absolute;
  inset: -10px;
  z-index: -1;
  border-radius: 22px;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--bad) 70%, transparent), transparent);
  filter: blur(6px);
  animation: sc-safes-halo 1.4s ease-in-out infinite;
  pointer-events: none;
}
.sc-safes-go::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.5) 50%, transparent 65%) no-repeat;
  background-size: 260% 100%;
  animation: sc-safes-sheen 2.6s ease-in-out infinite;
  pointer-events: none;
}
.sc-safes-go span { position: relative; text-wrap: balance; text-align: center; }
@keyframes sc-safes-halo { 0%, 100% { opacity: 0.45; scale: 0.98; } 50% { opacity: 1; scale: 1.04; } }
@keyframes sc-safes-sheen { 0%, 55% { background-position: 130% 0; } 100% { background-position: -30% 0; } }
@media (hover: hover) { .sc-safes-go:hover { filter: brightness(1.12); } }
.sc-safes-go:focus-visible { outline: 3px solid var(--line-bright); outline-offset: 4px; }
.sc-safes-go.is-pressed {
  transform: scale(1.08) translateY(0.22rem);
  filter: brightness(1.2);
  box-shadow:
    0 0.14rem 0 color-mix(in srgb, var(--bad), #000 58%),
    0 0 44px 6px color-mix(in srgb, var(--bad) 70%, transparent),
    inset 0 2px 0 rgba(255, 255, 255, 0.5),
    inset 0 -0.2rem 0.5rem color-mix(in srgb, var(--bad), #000 30%);
}
.sc-safes-go.is-off { opacity: 0.35; filter: saturate(0.3); pointer-events: none; }
.sc-safes-go.is-off::before, .sc-safes-go.is-off::after { animation: none; opacity: 0; }
.sc-safes-timer { display: flex; align-items: center; gap: 0.7rem; }
.sc-safes-timer-track {
  position: relative;
  flex: 1;
  height: 0.5rem;
  overflow: hidden;
  border-radius: 99px;
  background: color-mix(in srgb, var(--bad) 14%, rgba(0, 0, 0, 0.5));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bad) 35%, transparent);
}
.sc-safes-timer-fill {
  position: absolute;
  inset: 0;
  transform-origin: 0 50%;
  background: linear-gradient(90deg, color-mix(in srgb, var(--bad) 55%, transparent), var(--bad), color-mix(in srgb, var(--bad), #fff 40%));
  box-shadow: 0 0 10px var(--bad);
}
.sc-safes-timer-s {
  min-width: 2ch;
  text-align: right;
  font-size: 1.125rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--text-bright);
  text-shadow: var(--text-glow);
}
.sc-safes-timer-s.is-late { color: color-mix(in srgb, var(--bad) 55%, #fff); text-shadow: 0 0 10px var(--bad); }

/* ── the vault room (a full-screen tool window) ── */
#modal > .win-dim:has(+ .sc-vaults) {
  /* Keep the top strip bright: payouts land in the HUD counters. */
  -webkit-mask-image: linear-gradient(transparent calc(var(--top-h) + var(--gap) * 1.6), #000 calc(var(--top-h) + var(--gap) * 1.6 + 14px));
  mask-image: linear-gradient(transparent calc(var(--top-h) + var(--gap) * 1.6), #000 calc(var(--top-h) + var(--gap) * 1.6 + 14px));
}
.sc-vaults .win-body { display: flex; flex-direction: column; overflow: hidden; padding: 0.9rem 1rem 1rem; }
.sc-vaults-root { flex: 1; min-height: 0; gap: 0.8rem; }
.sc-vaults-stage {
  flex: 1;
  min-height: 0;
  container-type: size;
  display: grid;
  align-items: center;
  padding: 1.2rem 0.6rem 1rem;
  touch-action: manipulation;
  user-select: none;
}
.sc-vaults-stage.sc-safes-stage {
  background:
    radial-gradient(28% 60% at 17% -8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 75%),
    radial-gradient(28% 60% at 50% -8%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 75%),
    radial-gradient(28% 60% at 83% -8%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 75%),
    color-mix(in srgb, var(--bg) 84%, transparent);
}
.sc-vaults .sc-safes-row { font-size: clamp(6px, min(2.55cqw, 3.3cqh), 26px); }
/* The floor the vaults stand on: a lit edge at the foot of the boxes, fading toward the viewer. */
.sc-vaults .sc-safes-row::before {
  content: '';
  position: absolute;
  left: -30%;
  right: -30%;
  top: calc(100% - 1.5rem - 2px - 1em);
  height: 60vh;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent, color-mix(in srgb, var(--text) 22%, transparent) 20% 80%, transparent) top / 100% 1px no-repeat,
    linear-gradient(180deg, color-mix(in srgb, var(--text) 7%, transparent), transparent 40%);
}
.sc-vaults .sc-safes-row.is-picked .sc-safes-safe:not(.is-chosen):not(.is-open) { opacity: 0.32; filter: saturate(0.5) blur(1px); }
.sc-vaults-foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; }
.sc-vaults-done { min-width: 7rem; min-height: 3rem; font-size: 1rem; letter-spacing: 0.14em; text-transform: uppercase; }

/* Pop the lock: a dial floating over the chosen vault. */
.sc-lock {
  --d: 18rem;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 7;
  display: grid;
  justify-items: center;
  gap: 0.7rem;
  width: var(--d);
  pointer-events: none;
}
.sc-lock-dial {
  position: relative;
  width: var(--d);
  height: var(--d);
  border-radius: 50%;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--text-bright) 10%, var(--bg)) 0 26%, color-mix(in srgb, var(--bg), #000 35%) 27% 50%, color-mix(in srgb, var(--text-bright) 16%, var(--bg)) 51% 62%, color-mix(in srgb, var(--bg), #000 25%) 63% 100%);
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--line-bright) 80%, transparent),
    0 0 0 0.55rem color-mix(in srgb, var(--bg), #000 30%),
    0 0 0 calc(0.55rem + 2px) color-mix(in srgb, var(--line-bright) 45%, transparent),
    0 0 50px -6px var(--glow),
    0 1.2rem 2.4rem -0.6rem rgba(0, 0, 0, 0.85);
}
.sc-lock-dial canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.sc-lock-count {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-size: calc(var(--d) * 0.3);
  font-weight: 400;
  line-height: 1;
  color: #fff;
  text-shadow: 0 0 calc(18px * var(--glow-k)) var(--accent), 0 0 3px var(--accent);
}
.sc-lock-pips { display: flex; gap: 0.55rem; }
.sc-lock-pips i {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 2px solid color-mix(in srgb, var(--warn) 60%, transparent);
  background: rgba(0, 0, 0, 0.5);
  transition: background-color 120ms, box-shadow 160ms;
}
.sc-lock-pips i.is-on { background: var(--warn); box-shadow: 0 0 12px var(--warn), inset 0 0 0 2px rgba(255, 255, 255, 0.5); }

@container (max-width: 400px) {
  .sc-safes-stage { padding: 1rem 0.1rem 0.7rem; }
  .sc-safes-row { justify-content: space-between; }
  .sc-safes-safe { flex: 1 1 0; min-width: 0; padding-inline: 0.1em; gap: 0.5rem; }
  .sc-safes-plate { min-width: 0; max-width: 100%; padding-inline: 0.2rem; letter-spacing: 0; }
  .sc-safes-plate i { display: none; }
}
@media (max-width: 599px) {
  .sc-vaults .win-body { padding: 0.6rem 0.6rem 0.8rem; }
  .sc-vaults-foot { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; }
  .sc-vaults-done { justify-self: center; }
  .sc-safes-go { font-size: 1.125rem; min-height: 4rem; letter-spacing: 0.1em; }
}

html[data-reduced-motion="on"] .sc-safes-lasers i,
html[data-reduced-motion="on"] .sc-safes-safe.is-open .sc-safes-rays,
html[data-reduced-motion="on"] .sc-safes-safe.is-open .sc-safes-beams,
html[data-reduced-motion="on"] .sc-safes-safe.is-open .sc-safes-twinkle,
html[data-reduced-motion="on"] .sc-safes-critter.is-happy,
html[data-reduced-motion="on"] .sc-safes-go::before,
html[data-reduced-motion="on"] .sc-safes-go::after { animation: none; }
html[data-reduced-motion="on"] .sc-safes-safe.is-open .sc-safes-twinkle { opacity: 0.8; }

/* ───────── 32 · Investment Opportunities ───────── */
.sc-invest-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem 0.8rem;
  animation: sc7-rise 260ms ease-out both;
}
.sc-invest-k {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--dim);
}
.sc-invest-stake {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 1.375rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, var(--warn) 55%, #fff);
  text-shadow: 0 0 calc(12px * var(--glow-k)) color-mix(in srgb, var(--warn) 70%, transparent);
  transition: color 300ms, text-shadow 300ms;
}
.sc-invest-stake .cr-coin { font-size: 1.25rem; }
.sc-invest-stake.is-bad { color: color-mix(in srgb, var(--bad) 55%, #fff); text-shadow: 0 0 calc(12px * var(--glow-k)) var(--bad); }
.sc-invest-tag {
  padding: 0.1rem 0.5rem;
  border: 1px solid color-mix(in srgb, var(--warn) 70%, transparent);
  border-radius: 3px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: var(--warn);
  box-shadow: 0 0 12px -4px var(--warn), inset 0 0 10px -6px var(--warn);
  animation: sc-invest-tag 1.3s ease-in-out infinite;
}
@keyframes sc-invest-tag { 50% { box-shadow: 0 0 18px -2px var(--warn), inset 0 0 12px -4px var(--warn); } }

.sc-invest-cards {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}
.sc-invest-card {
  --st: var(--warn);
  appearance: none;
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.7rem 0.7rem 0.6rem;
  border: 1px solid var(--line);
  border-radius: 5px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--text) 7%, transparent), transparent 45%),
    color-mix(in srgb, var(--bg) 80%, transparent);
  box-shadow: inset 0 0 22px -12px var(--glow);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform 160ms cubic-bezier(.2, 1.6, .4, 1), border-color 200ms, box-shadow 250ms, opacity 300ms, filter 300ms;
  -webkit-tap-highlight-color: transparent;
  animation: sc7-rise 300ms calc(80ms + var(--i) * 90ms) ease-out both;
}
.sc-invest-card.is-pressed {
  transform: scale(1.06);
  border-color: var(--line-bright);
  box-shadow: 0 0 24px -4px var(--glow), inset 0 0 22px -10px var(--glow);
}
.sc-invest-card:focus-visible { outline: 2px solid var(--line-bright); outline-offset: 2px; }
@media (hover: hover) {
  .sc-invest-cards:not(.is-picked) .sc-invest-card:hover { border-color: var(--line-bright); box-shadow: 0 0 18px -6px var(--glow), inset 0 0 22px -10px var(--glow); }
}
.sc-invest-cards.is-picked .sc-invest-card { pointer-events: none; }
.sc-invest-card.is-chosen {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent), 0 0 26px -6px var(--accent), inset 0 0 26px -12px var(--accent);
}
.sc-invest-card.is-win {
  border-color: var(--warn);
  box-shadow: 0 0 0 1px var(--warn), 0 0 30px -4px var(--warn), inset 0 0 30px -10px var(--warn);
}
.sc-invest-card.is-lose { --st: var(--bad); border-color: color-mix(in srgb, var(--bad) 80%, transparent); box-shadow: 0 0 22px -8px var(--bad), inset 0 0 26px -12px var(--bad); }
.sc-invest-card.is-missed { opacity: 0.82; }
.sc-invest-card.is-flat { opacity: 0.55; filter: saturate(0.4); }
.sc-invest-stamp.is-meh { --st: var(--dim); }

.sc-invest-top {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 0.55rem;
  align-items: center;
  min-width: 0;
}
.sc-invest-ico {
  grid-row: span 2;
  font-size: 1.75rem;
  line-height: 1;
  filter: drop-shadow(0 0 8px var(--glow));
}
.sc-invest-tick,
.sc-invest-name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sc-invest-tick { font-size: 1.0625rem; font-weight: 800; letter-spacing: 0.04em; color: var(--text-bright); text-shadow: var(--text-glow); }
.sc-invest-name { font-size: 0.75rem; font-weight: 700; color: var(--dim); }
.sc-invest-chart {
  display: block;
  width: 100%;
  height: 6.4rem;
  border-radius: 3px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--text) 4%, transparent), transparent),
    rgba(0, 0, 0, 0.38);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--line) 80%, transparent);
}
.sc-invest-bot { display: flex; align-items: baseline; justify-content: space-between; gap: 0.4rem; min-width: 0; }
.sc-invest-price {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--text-bright);
}
.sc-invest-chg { flex: none; font-size: 0.9375rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--good); text-shadow: 0 0 8px color-mix(in srgb, var(--good) 50%, transparent); }
.sc-invest-chg.is-down { color: var(--bad); text-shadow: 0 0 8px color-mix(in srgb, var(--bad) 50%, transparent); }
.is-win .sc-invest-chg { color: color-mix(in srgb, var(--warn) 50%, #fff); text-shadow: 0 0 10px var(--warn); }

.sc-invest-chip {
  position: absolute;
  top: -0.65rem;
  right: 0.6rem;
  z-index: 3;
  padding: 0.05rem 0.45rem;
  border: 1px solid var(--accent);
  border-radius: 3px;
  background: color-mix(in srgb, var(--bg) 85%, #000);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: var(--accent);
  box-shadow: 0 0 12px -3px var(--accent);
  pointer-events: none;
}
.sc-invest-stamp {
  position: absolute;
  left: 50%;
  top: 48%;
  z-index: 3;
  padding: 0.05rem 0.55rem;
  border: 3px solid var(--st);
  border-radius: 5px;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: color-mix(in srgb, var(--st) 55%, #fff);
  text-shadow: 0 0 12px var(--st);
  box-shadow: 0 0 20px -4px var(--st), inset 0 0 14px -6px var(--st);
  translate: -50% -50%;
  rotate: -9deg;
  opacity: 0;
  pointer-events: none;
}
.sc-invest-stamp.is-in { animation: sc-invest-stamp 360ms cubic-bezier(.3, .7, .3, 1.2) both; }
.sc-invest-stamp.is-small { font-size: 1.05rem; }
@keyframes sc-invest-stamp {
  0% { opacity: 0; scale: 2.4; }
  60% { opacity: 1; scale: 0.92; }
  100% { opacity: 1; scale: 1; }
}

@container (max-width: 440px) {
  .sc-invest-cards { grid-template-columns: minmax(0, 1fr); gap: 0.5rem; }
  .sc-invest-card {
    grid-template-columns: minmax(0, 6.6rem) minmax(0, 1fr) auto;
    grid-template-rows: auto;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0.55rem;
  }
  .sc-invest-ico { font-size: 1.35rem; }
  .sc-invest-tick { font-size: 0.9375rem; }
  .sc-invest-chart { height: 3.4rem; }
  .sc-invest-bot { flex-direction: column; align-items: flex-end; gap: 0; }
  .sc-invest-price { font-size: 0.8125rem; max-width: 5.2rem; }
  .sc-invest-chg { font-size: 0.875rem; }
  .sc-invest-stamp { top: 50%; left: 58%; font-size: 1.25rem; }
  .sc-invest-stamp.is-small { font-size: 0.9375rem; }
  .sc-invest-stake { font-size: 1.125rem; }
}

html[data-reduced-motion="on"] .sc-invest-tag { animation: none; }
html[data-reduced-motion="on"] .sc-invest-stamp.is-in { animation: sc7-fade 260ms ease-out both; }

/* ───────── 33 · Mining Bitcoin ───────── */
.sc-mining-stage { padding: 0; }
/* The whole rig is one big tap target: every tap is a harder swing. */
.sc-mining-rig {
  appearance: none;
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.sc-mining-rig:focus-visible { outline: 2px solid var(--line-bright); outline-offset: -3px; }
.sc-mining-rig.is-pressed .sc-mining-cave { filter: brightness(1.2); }

.sc-mining-shroud {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  height: 4.8rem;
  padding: 0 0.8rem 0.35rem;
  border-bottom: 1px solid var(--line);
  background:
    repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.025) 0 6px, transparent 6px 14px),
    linear-gradient(180deg, color-mix(in srgb, var(--text-bright) 15%, var(--bg)), color-mix(in srgb, var(--text-bright) 6%, var(--bg)));
  box-shadow: inset 0 -0.6rem 1rem -0.7rem rgba(0, 0, 0, 0.9);
}
.sc-mining-fan { position: relative; width: 4rem; height: 4rem; filter: drop-shadow(0 0.15rem 0.2rem rgba(0, 0, 0, 0.7)); }
.sc-mining-fan svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sc-mining-fan .f-ring { fill: color-mix(in srgb, var(--bg), #000 45%); stroke: color-mix(in srgb, var(--line-bright) 70%, transparent); stroke-width: 2; }
.sc-mining-fan .f-blade { fill: color-mix(in srgb, var(--text-bright) 34%, var(--bg)); stroke: color-mix(in srgb, var(--text-bright) 60%, var(--bg)); stroke-width: 0.6; }
.sc-mining-fan .f-blur { fill: color-mix(in srgb, var(--text-bright) 32%, transparent); }
.sc-mining-fan .f-hub { fill: color-mix(in srgb, var(--text-bright) 20%, var(--bg)); stroke: var(--accent); stroke-width: 1.5; }
.sc-mining-rgb {
  position: absolute;
  left: 5%;
  right: 5%;
  bottom: 0.3rem;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3), var(--accent)) 0 0 / 200% 100%;
  box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 70%, transparent);
  animation: sc-mining-rgb 2.4s linear infinite;
}
@keyframes sc-mining-rgb { to { background-position: -200% 0; } }

.sc-mining-cave {
  position: relative;
  display: block;
  height: 10.8rem;
  overflow: hidden;
  background:
    linear-gradient(180deg, transparent 84%, color-mix(in srgb, var(--bg), #000 50%) 84%),
    repeating-linear-gradient(90deg, color-mix(in srgb, var(--good) 8%, transparent) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(0deg, color-mix(in srgb, var(--good) 6%, transparent) 0 1px, transparent 1px 22px),
    radial-gradient(70% 90% at 45% 100%, color-mix(in srgb, var(--warn) 12%, transparent), transparent 70%),
    color-mix(in srgb, var(--bg) 70%, #000);
  transition: filter 160ms;
}
.sc-mining-seam { position: absolute; right: 0; top: 0; bottom: 0; width: 34%; }
.sc-mining-seam svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.sc-mining-seam .s-rock { fill: color-mix(in srgb, var(--text-bright) 13%, var(--bg)); stroke: color-mix(in srgb, var(--text-bright) 30%, var(--bg)); stroke-width: 0.8; }
.sc-mining-seam .s-face { fill: color-mix(in srgb, var(--text-bright) 20%, var(--bg)); }
.sc-mining-seam .s-dark { fill: color-mix(in srgb, var(--bg), #000 30%); }
.sc-mining-seam .s-vein { fill: none; stroke: var(--warn); stroke-width: 2.4; stroke-linecap: round; filter: drop-shadow(0 0 3px var(--warn)); }
.sc-mining-seam .s-crack { fill: none; stroke: color-mix(in srgb, var(--warn) 40%, #fff); stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 2px var(--warn)); transition: stroke-dashoffset 260ms cubic-bezier(.2, .8, .3, 1); }
.sc-mining-vein-coin {
  position: absolute;
  left: 50%;
  top: 46%;
  font-size: 2.6rem;
  translate: -50% -50%;
  animation: sc-mining-throb 1.4s ease-in-out infinite;
}
@keyframes sc-mining-throb { 50% { filter: brightness(1.35) drop-shadow(0 0 10px var(--warn)); } }

.sc-mining-miner {
  position: absolute;
  right: calc(34% - 0.6rem);
  bottom: 0.45rem;
  width: 6rem;
  aspect-ratio: 80 / 90;
  transform-origin: 50% 100%;
}
.sc-mining-miner svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sc-mining-miner .m-suit { fill: color-mix(in srgb, var(--accent-2) 55%, var(--bg)); stroke: color-mix(in srgb, var(--accent-2), #000 45%); stroke-width: 0.8; }
.sc-mining-miner .m-suit2 { fill: color-mix(in srgb, var(--accent-2) 38%, var(--bg)); }
.sc-mining-miner .m-hat { fill: var(--warn); stroke: color-mix(in srgb, var(--warn), #000 40%); stroke-width: 0.8; }
.sc-mining-miner .m-beam { fill: color-mix(in srgb, var(--warn) 22%, transparent); }
.sc-mining-miner .m-lamp { fill: #fff; filter: drop-shadow(0 0 3px #fff); }
.sc-mining-miner .m-steel { fill: none; stroke: color-mix(in srgb, var(--text-bright) 70%, #888); stroke-width: 3.6; stroke-linecap: round; }
.sc-mining-arm { transform-box: view-box; transform-origin: 40px 40px; transform: rotate(-40deg); }

.sc-mining-heat {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(90% 75% at 50% 112%, color-mix(in srgb, var(--bad) 55%, transparent), transparent 72%);
}
.sc-mining-loot { position: absolute; inset: 0; pointer-events: none; }
.sc-mining-loot > .cr-coin { position: absolute; left: 0; top: 0; font-size: 1.9rem; }
.sc-mining-nugget {
  position: absolute;
  left: 50%;
  top: 44%;
  display: grid;
  place-items: center;
  translate: -50% -50%;
}
.sc-mining-nugget > * { grid-area: 1 / 1; }
.sc-mining-nugget i {
  width: 11rem;
  height: 11rem;
  background: repeating-conic-gradient(color-mix(in srgb, var(--warn) 30%, transparent) 0 7deg, transparent 7deg 20deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 15%, transparent 75%);
  mask-image: radial-gradient(closest-side, #000 15%, transparent 75%);
  animation: sc7-spin 8s linear infinite;
}
.sc-mining-nugget .cr-coin { font-size: 4.4rem; border-radius: 46% 54% 40% 60% / 55% 42% 58% 45%; }
.sc-mining-food { position: absolute; left: 50%; top: 46%; font-size: 3.4rem; line-height: 1; translate: -50% -50%; filter: drop-shadow(0 0.2rem 0.3rem #000); }
.sc-mining-stink {
  position: absolute;
  left: 50%;
  top: 22%;
  width: 0.4rem;
  height: 1.6rem;
  border-radius: 1rem;
  border-left: 0.16rem solid color-mix(in srgb, var(--good) 70%, var(--warn));
  opacity: 0;
  translate: calc(-50% + var(--dx)) 0;
  animation: sc-safes-steam 1.4s ease-out calc(var(--k) * 0.35s) infinite;
}

.sc-mining-tele {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 0.6rem;
  animation: sc7-rise 260ms 80ms ease-out both;
}
.sc-mining-tm { display: grid; gap: 0.1rem; min-width: 0; }
.sc-mining-tm-k { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--dim); }
.sc-mining-tm-v {
  font-size: 1.0625rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
  color: var(--text-bright);
  text-shadow: var(--text-glow);
  transition: color 300ms;
}
.sc-mining-tm-v.is-warn { color: var(--warn); }
.sc-mining-tm-v.is-bad { color: color-mix(in srgb, var(--bad) 60%, #fff); text-shadow: 0 0 10px var(--bad); }
.sc-mining-block {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 3.4rem;
  align-items: center;
  gap: 0.75rem;
  animation: sc7-rise 260ms 120ms ease-out both;
}
.sc-mining-meter { --meter-color: var(--warn); --meter-h: 0.85rem; }
.sc-mining-pct { text-align: right; font-size: 1.0625rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--text-bright); text-shadow: var(--text-glow); }

@container (max-width: 420px) {
  .sc-mining-shroud { height: 3.8rem; }
  .sc-mining-fan { width: 3.1rem; height: 3.1rem; }
  .sc-mining-cave { height: 9.6rem; }
  .sc-mining-miner { width: 5rem; }
  .sc-mining-vein-coin { font-size: 2.1rem; }
  .sc-mining-tele { gap: 0.4rem; }
  .sc-mining-tm-k { letter-spacing: 0.06em; }
  .sc-mining-tm-v { font-size: 0.875rem; }
  .sc-mining-block { gap: 0.5rem; }
}

html[data-reduced-motion="on"] .sc-mining-rgb,
html[data-reduced-motion="on"] .sc-mining-vein-coin,
html[data-reduced-motion="on"] .sc-mining-nugget i,
html[data-reduced-motion="on"] .sc-mining-stink { animation: none; }
html[data-reduced-motion="on"] .sc-mining-stink { opacity: 0.6; }

/* ───────── 34 · Crypto Airdrop ───────── */
.sc-airdrop-stage {
  height: 17rem;
  background:
    radial-gradient(1px 1px at 12% 18%, color-mix(in srgb, var(--text-bright) 70%, transparent), transparent),
    radial-gradient(1px 1px at 34% 8%, color-mix(in srgb, var(--text-bright) 55%, transparent), transparent),
    radial-gradient(1.5px 1.5px at 58% 22%, color-mix(in srgb, var(--text-bright) 65%, transparent), transparent),
    radial-gradient(1px 1px at 76% 12%, color-mix(in srgb, var(--text-bright) 50%, transparent), transparent),
    radial-gradient(1px 1px at 91% 30%, color-mix(in srgb, var(--text-bright) 60%, transparent), transparent),
    radial-gradient(60% 50% at 80% 0%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent 70%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg-2) 85%, transparent), color-mix(in srgb, var(--bg) 85%, transparent));
  touch-action: manipulation;
}
.sc-airdrop-cloud {
  position: absolute;
  width: 9rem;
  height: 2.6rem;
  border-radius: 50%;
  background:
    radial-gradient(closest-side at 30% 60%, color-mix(in srgb, var(--text-bright) 12%, transparent), transparent),
    radial-gradient(closest-side at 62% 45%, color-mix(in srgb, var(--text-bright) 14%, transparent), transparent),
    radial-gradient(closest-side at 50% 70%, color-mix(in srgb, var(--text-bright) 9%, transparent), transparent);
  pointer-events: none;
  animation: sc-airdrop-cloud 22s linear infinite;
}
@keyframes sc-airdrop-cloud { from { translate: -12rem 0; } to { translate: 46rem 0; } }
.sc-airdrop-ground {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 14%;
  background:
    radial-gradient(60% 120% at 20% 100%, color-mix(in srgb, var(--text) 16%, var(--bg)), transparent 70%),
    radial-gradient(70% 140% at 75% 100%, color-mix(in srgb, var(--text) 12%, var(--bg)), transparent 70%),
    linear-gradient(180deg, transparent, color-mix(in srgb, var(--text) 10%, var(--bg)) 60%);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text) 18%, transparent);
  pointer-events: none;
}

.sc-airdrop-plane {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;
  width: 9.5rem;
  aspect-ratio: 120 / 44;
  pointer-events: none;
  filter: drop-shadow(0 0.4rem 0.5rem rgba(0, 0, 0, 0.55));
}
.sc-airdrop-plane svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sc-airdrop-plane .p-body { fill: color-mix(in srgb, var(--text-bright) 34%, var(--bg)); stroke: color-mix(in srgb, var(--text-bright) 55%, var(--bg)); stroke-width: 0.8; }
.sc-airdrop-plane .p-dark { fill: color-mix(in srgb, var(--text-bright) 18%, var(--bg)); }
.sc-airdrop-plane .p-glass { fill: color-mix(in srgb, var(--accent-2) 60%, #000); }
.sc-airdrop-plane .p-hold { fill: color-mix(in srgb, var(--warn) 45%, #000); }
.sc-airdrop-plane .p-red { fill: var(--bad); filter: drop-shadow(0 0 3px var(--bad)); animation: sc7-blink 0.9s steps(1) infinite; }
.sc-airdrop-plane .p-green { fill: var(--good); filter: drop-shadow(0 0 3px var(--good)); }

/* A coin on a parachute: the whole thing is the tap target. */
.sc-airdrop-drop {
  appearance: none;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 3rem;
  padding: 0.15rem 0 0.2rem;
  border: 0;
  border-radius: 0.6rem;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transform-origin: 50% 0.6rem;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.sc-airdrop-drop:focus-visible { outline: 2px solid var(--line-bright); }
.sc-airdrop-chute {
  display: block;
  width: 2.7rem;
  height: 1.35rem;
  border-radius: 2.7rem 2.7rem 0.2rem 0.2rem / 2.1rem 2.1rem 0.2rem 0.2rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.28), transparent 60%),
    repeating-linear-gradient(90deg, var(--accent) 0 25%, color-mix(in srgb, var(--text-bright) 85%, var(--accent)) 25% 50%);
  -webkit-mask: radial-gradient(circle at 50% 100%, transparent 0.28rem, #000 0.3rem) 0 0 / 25% 100% repeat-x;
  mask: radial-gradient(circle at 50% 100%, transparent 0.28rem, #000 0.3rem) 0 0 / 25% 100% repeat-x;
  transform-origin: 50% 100%;
  filter: drop-shadow(0 0 0.35rem color-mix(in srgb, var(--accent) 45%, transparent));
}
.sc-airdrop-lines { display: block; width: 2.5rem; height: 0.95rem; margin-top: -0.12rem; overflow: visible; }
.sc-airdrop-lines path { fill: none; stroke: color-mix(in srgb, var(--text-bright) 65%, transparent); stroke-width: 1; }
.sc-airdrop-drop .cr-coin { font-size: 1.65rem; margin-top: -0.1rem; }
.sc-airdrop-drop.is-pressed .cr-coin { scale: 1.25; }
.sc-airdrop-drop.is-landed .sc-airdrop-chute { opacity: 0; transition: opacity 400ms; }
.sc-airdrop-drop.is-landed .sc-airdrop-lines { opacity: 0; transition: opacity 300ms; }

/* The rug: a patterned carpet on a red-and-gold canopy. */
.sc-airdrop-drop.is-rug { width: 4.6rem; z-index: 5; }
.is-rug .sc-airdrop-chute {
  width: 4rem;
  height: 1.9rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.25), transparent 60%),
    repeating-linear-gradient(90deg, var(--bad) 0 25%, var(--warn) 25% 50%);
  filter: drop-shadow(0 0 0.4rem color-mix(in srgb, var(--bad) 45%, transparent));
}
.is-rug .sc-airdrop-lines { width: 3.8rem; height: 1.1rem; }
.sc-airdrop-rug {
  position: relative;
  display: block;
  width: 4.4rem;
  height: 2.5rem;
  border: 0.22rem solid color-mix(in srgb, var(--warn) 75%, var(--bad));
  border-radius: 0.15rem;
  background:
    radial-gradient(closest-side, color-mix(in srgb, var(--accent-2) 75%, #fff) 0 18%, color-mix(in srgb, var(--warn) 80%, var(--bad)) 20% 34%, transparent 36%),
    repeating-linear-gradient(45deg, color-mix(in srgb, var(--bad) 70%, var(--bg)) 0 4px, color-mix(in srgb, var(--bad) 55%, var(--bg)) 4px 8px);
  box-shadow: inset 0 0 0 0.16rem color-mix(in srgb, var(--accent-2) 55%, var(--bad)), 0 0.3rem 0.5rem rgba(0, 0, 0, 0.5);
}
.sc-airdrop-rug::before,
.sc-airdrop-rug::after {
  content: '';
  position: absolute;
  top: 0.1rem;
  bottom: 0.1rem;
  width: 0.3rem;
  background: repeating-linear-gradient(180deg, color-mix(in srgb, var(--text-bright) 80%, var(--warn)) 0 2px, transparent 2px 4px);
}
.sc-airdrop-rug::before { left: -0.55rem; }
.sc-airdrop-rug::after { right: -0.55rem; }

/* The hook that does the pulling. */
.sc-airdrop-hook {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 6;
  width: 1.6rem;
  height: 2.2rem;
  pointer-events: none;
}
.sc-airdrop-hook svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sc-airdrop-hook .h-steel { fill: none; stroke: color-mix(in srgb, var(--text-bright) 75%, #999); stroke-width: 3.2; stroke-linecap: round; }
.sc-airdrop-hook::before {
  content: '';
  position: absolute;
  left: 60%;
  top: 0.15rem;
  width: 60rem;
  height: 2px;
  background: repeating-linear-gradient(90deg, color-mix(in srgb, var(--text-bright) 70%, transparent) 0 5px, color-mix(in srgb, var(--text-bright) 35%, transparent) 5px 8px);
}
.sc-airdrop-stamp {
  position: absolute;
  left: 50%;
  top: 42%;
  z-index: 7;
  padding: 0.1rem 0.7rem;
  border: 3px solid var(--bad);
  border-radius: 6px;
  background: color-mix(in srgb, var(--bg) 70%, transparent);
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  white-space: nowrap;
  color: color-mix(in srgb, var(--bad) 55%, #fff);
  text-shadow: 0 0 14px var(--bad);
  box-shadow: 0 0 24px -4px var(--bad), inset 0 0 16px -6px var(--bad);
  translate: -50% -50%;
  rotate: -8deg;
  pointer-events: none;
  animation: sc-invest-stamp 380ms cubic-bezier(.3, .7, .3, 1.2) both;
}

@container (max-width: 420px) {
  .sc-airdrop-stage { height: 15.5rem; }
  .sc-airdrop-plane { width: 7.4rem; }
  .sc-airdrop-stamp { font-size: 1.5rem; }
}

html[data-reduced-motion="on"] .sc-airdrop-cloud,
html[data-reduced-motion="on"] .sc-airdrop-plane .p-red { animation: none; }
html[data-reduced-motion="on"] .sc-airdrop-stamp { animation: sc7-fade 260ms ease-out both; }