@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700;800;900&display=swap');

:root {
  --ink-0: #000000;
  --ink-1: #030607;
  --ink-2: #071014;
  --paper-0: #f2fbfb;
  --paper-1: #cfe4e2;
  --light-x: .5;
  --light-y: .5;
  --light-y-pos: 50%;
  --left-bg-y: 49%;
  --right-bg-y: 51%;
  --left-shift-x: 0px;
  --left-shift-y: 0px;
  --right-shift-x: 0px;
  --right-shift-y: 0px;
  --left-glow: .5;
  --right-glow: .5;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--paper-0);
  background: var(--ink-0);
  font-synthesis: none;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }

html,
body,
#root {
  width: 100%;
  min-height: 100%;
  margin: 0;
  background: var(--ink-0);
}

html { scroll-behavior: smooth; }

body { overscroll-behavior: none; overflow-x: hidden; }

canvas {
  display: block;
  image-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

body.has-signaltakt-cursor,
body.has-signaltakt-cursor *,
body.has-signaltakt-cursor button,
body.has-signaltakt-cursor a,
body.has-signaltakt-cursor [role="button"],
body.has-signaltakt-cursor input,
body.has-signaltakt-cursor textarea,
body.has-signaltakt-cursor select,
body.has-signaltakt-cursor canvas {
  cursor: none !important;
}

.cursor-fx-layer {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: screen;
  transition: opacity 180ms ease;
  --cursor-speed: 0;
  --cursor-x: 50vw;
  --cursor-y: 50vh;
}

.cursor-fx-layer.is-visible { opacity: 1; }

.cursor-fx-core,
.cursor-fx-ring,
.cursor-fx-trail i {
  position: fixed;
  left: 0;
  top: 0;
  will-change: transform, opacity;
  pointer-events: none;
}

.cursor-fx-core {
  width: 22px;
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle at 38% 28%, rgba(255,255,255,.92), transparent 17%),
    radial-gradient(circle at 54% 58%, rgba(103, 230, 255, .62), transparent 46%),
    conic-gradient(from 210deg, rgba(125, 91, 255, .08), rgba(117, 234, 255, .92), rgba(255,255,255,.58), rgba(123, 88, 255, .72), rgba(125, 91, 255, .08)),
    rgba(3, 13, 31, .68);
  box-shadow:
    0 0 16px rgba(105, 225, 255, .52),
    0 0 44px rgba(120, 86, 255, .3),
    inset 0 0 0 1px rgba(236, 255, 255, .58),
    inset 0 -8px 18px rgba(6, 12, 35, .58);
}

.cursor-fx-core::before,
.cursor-fx-core::after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: inherit;
  border: 1px solid rgba(153, 229, 255, calc(.2 + var(--cursor-speed) * .34));
  opacity: .8;
  transform: rotate(22deg) scale(calc(1 + var(--cursor-speed) * .18));
}

.cursor-fx-core::after {
  inset: 7px auto auto 50%;
  width: 4px;
  height: 4px;
  border: 0;
  background: rgba(246, 255, 255, .94);
  box-shadow: 0 0 12px rgba(145, 236, 255, .88);
  transform: translateX(-50%);
}

.cursor-fx-core i {
  position: absolute;
  left: 50%;
  top: -11px;
  width: 2px;
  height: 13px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(235,255,255,0), rgba(183,243,255,.74));
  transform: translateX(-50%);
  opacity: calc(.32 + var(--cursor-speed) * .48);
}

.cursor-fx-core b {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(250,255,255,.94);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 13px rgba(128, 238, 255, .74);
}

.cursor-fx-ring {
  width: 54px;
  aspect-ratio: 1;
  border-radius: 999px;
  border: 1px solid rgba(129, 220, 255, calc(.22 + var(--cursor-speed) * .24));
  background:
    radial-gradient(circle at 50% 50%, rgba(92, 221, 255, .08), transparent 52%),
    conic-gradient(from 90deg, transparent 0 22%, rgba(129, 226, 255, .44), transparent 38% 64%, rgba(130, 94, 255, .36), transparent 78% 100%);
  filter: drop-shadow(0 0 18px rgba(100, 218, 255, .22));
  opacity: .78;
  animation: cursorRingBreath 2.8s ease-in-out infinite alternate;
}

.cursor-fx-trail i {
  width: 12px;
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(221, 255, 255, .56), rgba(114, 228, 255, .18) 38%, transparent 70%);
  filter: blur(.35px);
  opacity: 0;
}

.cursor-fx-layer.is-interactive .cursor-fx-core {
  box-shadow:
    0 0 22px rgba(117, 235, 255, .68),
    0 0 64px rgba(126, 92, 255, .42),
    inset 0 0 0 1px rgba(244, 255, 255, .74),
    inset 0 -8px 18px rgba(6, 12, 35, .54);
}

.cursor-fx-layer.is-interactive .cursor-fx-ring {
  border-color: rgba(224, 250, 255, .48);
  opacity: .92;
}

.cursor-fx-layer.is-pressed .cursor-fx-core {
  filter: brightness(1.28) saturate(1.16);
}

.topdown-webgl-page {
  position: relative;
  min-height: 540vh;
  background: var(--ink-0);
}

.topdown-webgl-page.is-info-page {
  min-height: 100svh;
  height: 100svh;
  overflow: hidden;
}

.fixed-webgl-stage {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100svh;
  overflow: hidden;
  background:
    radial-gradient(circle at calc(var(--light-x) * 100%) calc(var(--light-y) * 100%), rgba(225,246,243,.13), transparent 18rem),
    radial-gradient(ellipse at 0% var(--left-bg-y), rgba(97, 207, 194, .24), transparent 40rem),
    radial-gradient(ellipse at 100% var(--right-bg-y), rgba(143, 112, 210, .2), transparent 42rem),
    radial-gradient(circle at 52% 22%, rgba(72, 150, 154, .2), transparent 36rem),
    linear-gradient(90deg, rgba(95, 199, 189, .12), transparent 20%, transparent 81%, rgba(200, 149, 98, .11)),
    radial-gradient(circle at 50% 0%, rgba(207, 228, 226, .09), transparent 32rem),
    linear-gradient(180deg, #020303 0%, #000000 44%, #000000 100%);
}

.fixed-webgl-stage::before,
.fixed-webgl-stage::after {
  content: "";
  position: absolute;
  inset: -16% auto -16% 0;
  width: 28vw;
  pointer-events: none;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(97, 207, 194, .22), rgba(143, 112, 210, .11), transparent),
    radial-gradient(ellipse at 0% var(--light-y-pos), rgba(200,149,98,.12), transparent 58%);
  mix-blend-mode: screen;
  opacity: calc(.38 + var(--left-glow) * .3);
  filter: blur(30px) saturate(1.25);
  transform: translate3d(var(--left-shift-x), var(--left-shift-y), 0) skewY(-3deg);
  transition: opacity 180ms ease-out;
}

.fixed-webgl-stage .color-reflection {
  position: absolute;
  inset: auto 8vw 0;
  height: 38vh;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 20% 100%, rgba(97, 207, 194, .14), transparent 44%),
    radial-gradient(ellipse at 58% 96%, rgba(143, 112, 210, .12), transparent 46%),
    radial-gradient(ellipse at 86% 100%, rgba(200, 149, 98, .08), transparent 42%),
    linear-gradient(180deg, transparent, rgba(210,235,231,.055));
  filter: blur(34px) saturate(1.35);
  mix-blend-mode: screen;
  opacity: .68;
}

.fixed-webgl-stage::after {
  left: auto;
  right: 0;
  background:
    linear-gradient(270deg, rgba(143, 112, 210, .2), rgba(200, 149, 98, .11), transparent),
    radial-gradient(ellipse at 100% var(--light-y-pos), rgba(97,207,194,.1), transparent 58%);
  opacity: calc(.38 + var(--right-glow) * .3);
  transform: translate3d(var(--right-shift-x), var(--right-shift-y), 0) skewY(3deg);
}

.mobile-scroll-aurora {
  display: none;
}

.fixed-webgl-stage canvas {
  position: relative;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  outline: none;
  transform: translateZ(0);
  backface-visibility: hidden;
  image-rendering: auto;
}

.scroll-depth {
  height: 540vh;
  pointer-events: none;
}

.topdown-webgl-page.is-info-page .scroll-depth { height: 100svh; }

.topdown-webgl-page.intro-locked {
  min-height: 100svh;
  height: 100svh;
  overflow: hidden;
}

.topdown-webgl-page.intro-locked .scroll-depth { height: 100svh; }

.fixed-webgl-stage.webgl-stage-preintro {
  filter: blur(18px) saturate(.72) brightness(.42);
  transform: scale(.94);
  opacity: .58;
  transition: filter 1100ms cubic-bezier(.19,1,.22,1), transform 1100ms cubic-bezier(.19,1,.22,1), opacity 1100ms ease;
}

.fixed-webgl-stage.webgl-stage-entering {
  filter: blur(0) saturate(1.08) brightness(1);
  transform: scale(1.035);
  opacity: 1;
}

.intro-portal {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  align-items: end;
  justify-items: start;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 40%, rgba(162,226,244,.22), transparent 12rem),
    radial-gradient(ellipse at 18% 14%, rgba(69,128,240,.22), transparent 32rem),
    radial-gradient(ellipse at 84% 10%, rgba(31,79,164,.22), transparent 34rem),
    radial-gradient(ellipse at 48% 108%, rgba(24,116,159,.28), transparent 36rem),
    linear-gradient(180deg, #061746 0%, #071b3d 34%, #061024 58%, #010207 100%);
  color: var(--paper-0);
  isolation: isolate;
}

.intro-portal::before,
.intro-portal::after {
  content: "";
  position: absolute;
  inset: -18% -8% auto;
  height: 52vh;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 25% 55%, rgba(255,255,255,.2), transparent 22%),
    radial-gradient(ellipse at 50% 42%, rgba(179,205,255,.13), transparent 24%),
    radial-gradient(ellipse at 78% 58%, rgba(209,243,238,.14), transparent 22%);
  filter: blur(36px);
  opacity: .72;
  animation: introCloudBreath 16s ease-in-out infinite alternate;
}

.intro-portal::after {
  inset: auto -12% -24%;
  height: 58vh;
  opacity: .52;
  background:
    radial-gradient(ellipse at 30% 34%, rgba(90,220,215,.16), transparent 24%),
    radial-gradient(ellipse at 64% 50%, rgba(142,120,255,.16), transparent 30%);
  animation-duration: 19s;
  animation-direction: alternate-reverse;
}

.intro-topbar {
  position: absolute;
  inset: clamp(1.25rem, 4vw, 3rem) clamp(1.25rem, 4vw, 3rem) auto;
  z-index: 4;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: rgba(245,250,255,.88);
  font-size: clamp(.66rem, .9vw, .82rem);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.intro-brand-mark,
.intro-sound-pill {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  text-shadow: 0 0 28px rgba(160,225,255,.2);
}

.intro-brand-mark span {
  width: 1.85rem;
  height: 1.85rem;
  display: block;
  clip-path: polygon(50% 0, 100% 30%, 78% 100%, 22% 100%, 0 30%);
  background:
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(164,236,255,.68)),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.9), transparent 45%);
  box-shadow: 0 0 24px rgba(169,235,255,.32);
}

.intro-sound-pill em {
  position: relative;
  width: 2.3rem;
  height: .75rem;
  display: block;
}

.intro-sound-pill em::before,
.intro-sound-pill em::after {
  content: "";
  position: absolute;
  inset: 20% 0 auto;
  height: 1px;
  background: rgba(220,245,255,.72);
  border-radius: 999px;
  transform: rotate(8deg);
  animation: introSoundWave 2.4s ease-in-out infinite alternate;
}

.intro-sound-pill em::after {
  inset: auto 0 18%;
  transform: rotate(-8deg);
  animation-delay: -1.2s;
}

.intro-cloud {
  position: absolute;
  width: 34vw;
  height: 15vw;
  min-width: 280px;
  min-height: 110px;
  border-radius: 999px;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 56%, rgba(255,255,255,.28), transparent 28%),
    radial-gradient(circle at 48% 42%, rgba(206,229,255,.2), transparent 35%),
    radial-gradient(circle at 78% 58%, rgba(202,255,247,.16), transparent 30%);
  filter: blur(24px);
  opacity: .36;
  transform: translate3d(0,0,0);
  animation: introCloudDrift 22s ease-in-out infinite alternate;
}

.intro-cloud-a { top: 12%; left: 5%; }

.intro-cloud-b { top: 20%; right: 2%; width: 28vw; animation-duration: 27s; animation-delay: -6s; }

.intro-cloud-c { bottom: 19%; left: 26%; width: 42vw; opacity: .22; animation-duration: 31s; animation-delay: -11s; }

.intro-wave-field {
  position: absolute;
  inset: auto -8vw 0;
  height: 54vh;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 20%, rgba(78,185,222,.2), transparent 28%),
    linear-gradient(180deg, transparent, rgba(2,9,25,.32) 36%, rgba(0,0,4,.88) 100%);
  mask-image: linear-gradient(180deg, transparent, black 12%, black 100%);
}

.intro-wave {
  position: absolute;
  left: -8%;
  right: -8%;
  bottom: 8%;
  height: 46%;
  border-radius: 50% 50% 0 0 / 42% 42% 0 0;
  border-top: 1px solid rgba(155,218,255,.34);
  background:
    repeating-radial-gradient(ellipse at 50% 100%, transparent 0 20px, rgba(120,194,242,.09) 21px 22px),
    linear-gradient(180deg, rgba(87,164,225,.105), transparent 70%);
  transform-origin: 50% 100%;
  animation: introWaveFlow 12s ease-in-out infinite alternate;
}

.intro-wave-2 { bottom: 0; height: 58%; opacity: .72; animation-duration: 15s; animation-delay: -4s; }

.intro-wave-3 { bottom: -9%; height: 70%; opacity: .44; animation-duration: 19s; animation-delay: -8s; }

.intro-vortex {
  position: absolute;
  width: min(56vw, 720px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
  background:
    radial-gradient(circle, transparent 0 36%, rgba(220,255,250,.1) 37%, transparent 39%),
    conic-gradient(from 120deg, transparent, rgba(130,220,255,.12), transparent, rgba(180,138,255,.12), transparent);
  filter: blur(1px);
  opacity: .42;
  animation: introVortex 22s linear infinite;
}

.intro-crystal {
  position: absolute;
  left: 50%;
  top: 14vh;
  z-index: 2;
  width: min(18vw, 190px);
  min-width: 116px;
  aspect-ratio: .62 / 1;
  transform: translateX(-50%);
  pointer-events: none;
  animation: introCrystalFloat 7.8s ease-in-out infinite alternate;
}

.intro-crystal-glow {
  position: absolute;
  inset: -38%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(169,244,255,.48), rgba(81,162,238,.22) 36%, transparent 68%);
  filter: blur(22px);
  animation: introCrystalPulse 3.8s ease-in-out infinite alternate;
}

.intro-crystal-core {
  position: absolute;
  inset: 0;
  clip-path: polygon(45% 0, 73% 10%, 95% 42%, 76% 86%, 48% 100%, 17% 86%, 0 48%, 17% 13%);
  background:
    linear-gradient(115deg, rgba(255,255,255,.78), rgba(95,205,244,.38) 18%, rgba(13,45,88,.72) 42%, rgba(202,255,255,.76) 58%, rgba(18,59,98,.86) 78%, rgba(190,246,255,.62)),
    radial-gradient(circle at 42% 32%, rgba(255,255,255,.98), transparent 19%);
  box-shadow:
    inset 0 0 34px rgba(230,255,255,.58),
    inset 0 -36px 48px rgba(2,22,45,.72),
    0 0 56px rgba(132,226,255,.48);
  opacity: .96;
}

.intro-crystal-core::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(58deg, transparent 18%, rgba(255,255,255,.75) 19% 20%, transparent 22%),
    linear-gradient(126deg, transparent 32%, rgba(198,252,255,.68) 33% 34%, transparent 36%),
    linear-gradient(22deg, transparent 55%, rgba(255,255,255,.55) 56% 57%, transparent 59%),
    radial-gradient(circle at 50% 50%, transparent 38%, rgba(255,255,255,.42) 39% 40%, transparent 42%);
  mix-blend-mode: screen;
  animation: introCrystalCrackLight 2.9s ease-in-out infinite alternate;
}

.intro-crystal-line {
  position: absolute;
  height: 2px;
  border-radius: 999px;
  background: rgba(232,255,255,.85);
  box-shadow: 0 0 14px rgba(211,255,255,.9);
  transform-origin: left center;
  opacity: .82;
}

.intro-crystal-line-1 { left: 24%; top: 28%; width: 52%; transform: rotate(42deg); }

.intro-crystal-line-2 { left: 26%; top: 51%; width: 48%; transform: rotate(-31deg); }

.intro-crystal-line-3 { left: 47%; top: 17%; width: 38%; transform: rotate(78deg); }

.intro-crystal-line-4 { left: 18%; top: 69%; width: 46%; transform: rotate(22deg); }

.intro-content {
  position: relative;
  z-index: 2;
  width: min(92vw, 760px);
  padding: 0 0 clamp(2rem, 7vh, 4.6rem) clamp(1.25rem, 4vw, 3.2rem);
  text-align: left;
  transform: translateY(0);
}

.intro-kicker {
  margin: 0 0 1.1rem;
  color: rgba(216,245,239,.68);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .26em;
  text-transform: uppercase;
}

.intro-content h1 {
  margin: 0 0 1.8rem;
  max-width: 760px;
  color: #f4fbfb;
  font-size: clamp(2.9rem, 6.8vw, 6.9rem);
  line-height: .9;
  letter-spacing: -.072em;
  text-wrap: balance;
  text-shadow: 0 0 42px rgba(155,215,255,.22);
}

.intro-button {
  position: relative;
  display: inline-grid;
  grid-template-columns: auto 2.4rem;
  align-items: center;
  gap: 1rem;
  min-width: min(82vw, 390px);
  padding: 1.28rem 1.28rem 1.28rem 1.75rem;
  border: 1px solid rgba(229,255,249,.28);
  border-radius: 999px;
  color: #041012;
  background:
    linear-gradient(135deg, rgba(249,255,252,.96), rgba(166,245,232,.92) 48%, rgba(165,190,255,.92));
  box-shadow:
    0 24px 90px rgba(81,214,208,.22),
    inset 0 1px 0 rgba(255,255,255,.72);
  font: inherit;
  font-weight: 900;
  letter-spacing: -.02em;
  cursor: pointer;
  transform: translateZ(0);
  transition: transform 220ms cubic-bezier(.19,1,.22,1), box-shadow 220ms ease, filter 220ms ease;
}

.intro-button:hover {
  transform: translateY(-3px) scale(1.018);
  filter: saturate(1.08) brightness(1.04);
  box-shadow: 0 30px 110px rgba(118,225,255,.3), inset 0 1px 0 rgba(255,255,255,.82);
}

.intro-button:active { transform: translateY(-1px) scale(.992); }

.intro-button i {
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  background:
    radial-gradient(circle at 65% 35%, #ffffff, transparent 28%),
    linear-gradient(135deg, #06121a, #183a50);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.24);
}

.intro-sound-note {
  margin: 1.25rem 0 0;
  color: rgba(220,244,240,.44);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.intro-portal.is-exiting {
  pointer-events: none;
  animation: introPortalExit 1380ms cubic-bezier(.77,0,.175,1) forwards;
}

.intro-portal.is-exiting .intro-content {
  animation: introContentIntoDepth 1180ms cubic-bezier(.77,0,.175,1) forwards;
}

.intro-portal.is-exiting .intro-vortex {
  animation: introVortexPull 1380ms cubic-bezier(.77,0,.175,1) forwards;
}

.intro-portal.is-exiting .intro-crystal {
  animation: introCrystalPull 1380ms cubic-bezier(.77,0,.175,1) forwards;
}

@keyframes introCloudBreath {
  from { transform: translate3d(-2%, -1%, 0) scale(1); }
  to { transform: translate3d(2%, 3%, 0) scale(1.08); }
}

@keyframes introCloudDrift {
  from { transform: translate3d(-4vw, -1vh, 0) scale(1); }
  to { transform: translate3d(5vw, 2vh, 0) scale(1.08); }
}

@keyframes introWaveFlow {
  from { transform: translate3d(-1.8%, 2%, 0) scaleX(1.02) scaleY(.96); }
  to { transform: translate3d(1.4%, -4%, 0) scaleX(.98) scaleY(1.08); }
}

@keyframes introVortex {
  to { transform: rotate(360deg); }
}

@keyframes introSoundWave {
  from { opacity: .42; transform: translateY(1px) rotate(7deg) scaleX(.82); }
  to { opacity: .92; transform: translateY(-1px) rotate(-7deg) scaleX(1.08); }
}

@keyframes introAudioBars {
  from { transform: scaleY(.34); filter: brightness(.82); }
  to { transform: scaleY(1); filter: brightness(1.18); }
}

@keyframes introCrystalFloat {
  from { transform: translateX(-50%) translateY(-.8vh) rotate(-2deg); }
  to { transform: translateX(-50%) translateY(1.4vh) rotate(2.4deg); }
}

@keyframes introCrystalPulse {
  from { opacity: .44; transform: scale(.92); }
  to { opacity: .78; transform: scale(1.08); }
}

@keyframes introCrystalCrackLight {
  from { opacity: .58; filter: brightness(.92); }
  to { opacity: .96; filter: brightness(1.32); }
}

@keyframes introPortalExit {
  0% { opacity: 1; filter: blur(0) brightness(1); transform: scale(1); }
  58% { opacity: .92; filter: blur(4px) brightness(1.08); transform: scale(1.08); }
  100% { opacity: 0; filter: blur(24px) brightness(1.4); transform: scale(2.2); visibility: hidden; }
}

@keyframes introContentIntoDepth {
  0% { opacity: 1; transform: translateY(0) scale(1); }
  54% { opacity: .78; transform: translateY(-1vh) scale(.9); }
  100% { opacity: 0; transform: translateY(-4vh) scale(.26); }
}

@keyframes introVortexPull {
  0% { opacity: .42; transform: rotate(0deg) scale(1); filter: blur(1px); }
  70% { opacity: .72; transform: rotate(220deg) scale(.52); filter: blur(0); }
  100% { opacity: 0; transform: rotate(420deg) scale(.08); filter: blur(18px); }
}

@keyframes introCrystalPull {
  0% { opacity: 1; transform: translateX(-50%) translateY(0) rotate(0deg) scale(1); filter: blur(0); }
  54% { opacity: .95; transform: translateX(-50%) translateY(16vh) rotate(18deg) scale(1.28); filter: blur(1px); }
  100% { opacity: 0; transform: translateX(-50%) translateY(38vh) rotate(70deg) scale(.12); filter: blur(14px); }
}

@keyframes introActiveTheorySvgWaveA {
  from { transform: translateX(-4px) scaleY(.76); stroke-dashoffset: -18; opacity: .74; }
  to { transform: translateX(4px) scaleY(1.18); stroke-dashoffset: 20; opacity: 1; }
}

@keyframes introActiveTheorySvgWaveB {
  from { transform: translateX(5px) translateY(1px) scaleY(.62); stroke-dashoffset: 24; opacity: .34; }
  to { transform: translateX(-5px) translateY(-1px) scaleY(1.05); stroke-dashoffset: -16; opacity: .72; }
}

@keyframes introActiveTheorySvgWaveC {
  from { transform: translateX(-6px) translateY(-1px) scaleY(1.08); stroke-dashoffset: -10; opacity: .3; }
  to { transform: translateX(6px) translateY(1px) scaleY(.7); stroke-dashoffset: 22; opacity: .58; }
}

@media (prefers-reduced-motion: reduce) {
  .intro-cloud,
  .intro-wave,
  .intro-crystal,
  .intro-vortex,
  .intro-portal::before,
  .intro-portal::after { animation: none !important; }
  .intro-portal.is-exiting,
  .intro-portal.is-exiting .intro-content,
  .intro-portal.is-exiting .intro-crystal,
  .intro-portal.is-exiting .intro-vortex { animation-duration: 260ms !important; }
  .fixed-webgl-stage.webgl-stage-preintro,
  .fixed-webgl-stage.webgl-stage-entering { transition-duration: 260ms; }
}

@media (max-width: 720px) {
  .intro-topbar { align-items: flex-start; gap: 1rem; }
  .intro-sound-pill { font-size: .58rem; }
  .intro-content { padding-right: 1.25rem; }
  .intro-crystal { top: 18vh; width: 34vw; opacity: .86; }
}

/* High-end textless 3D intro */

.intro-portal {
  display: block;
  cursor: default;
  background:
    radial-gradient(circle at 50% 35%, rgba(23, 76, 132, .14), transparent 18rem),
    radial-gradient(ellipse at 50% 112%, rgba(6, 41, 89, .3), transparent 42rem),
    linear-gradient(180deg, #01091f 0%, #010513 52%, #000104 100%);
}

.intro-portal::before {
  inset: 0;
  height: auto;
  z-index: 2;
  background:
    radial-gradient(ellipse at 50% 18%, rgba(80,130,178,.08), transparent 24%),
    radial-gradient(ellipse at 18% 26%, rgba(42,86,150,.08), transparent 30%),
    radial-gradient(ellipse at 82% 20%, rgba(66,68,148,.075), transparent 32%),
    linear-gradient(180deg, rgba(35,64,105,.028), transparent 46%, rgba(0,0,0,.38));
  filter: blur(20px) saturate(.92);
  opacity: .76;
  mix-blend-mode: screen;
  animation: introCloudBreath 18s ease-in-out infinite alternate;
}

.intro-portal::after {
  inset: 0;
  height: auto;
  z-index: 3;
  background:
    radial-gradient(circle at 50% 52%, transparent 0 22%, rgba(0,0,0,.18) 43%, rgba(0,0,0,.82) 100%),
    linear-gradient(180deg, rgba(0,0,0,.1) 0 52%, rgba(0,1,6,.72) 100%);
  filter: none;
  opacity: 1;
  mix-blend-mode: normal;
  animation: none;
}

.intro-canvas {
  position: absolute !important;
  inset: 0;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
}

.intro-continue-button {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 7;
  display: inline-grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1rem;
  min-width: clamp(238px, 22vw, 342px);
  padding: .98rem 1.08rem .98rem .98rem;
  border: 1px solid rgba(221, 252, 255, .62);
  border-radius: 999px;
  color: rgba(244, 253, 255, .98);
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(146, 230, 255, .07) 28%, rgba(104, 85, 220, .15) 72%, rgba(255,255,255,.08)),
    radial-gradient(circle at 18% 34%, rgba(154,236,255,.38), transparent 28%),
    radial-gradient(circle at 74% 40%, rgba(158,109,255,.3), transparent 36%),
    rgba(3, 12, 30, .72);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.08),
    0 22px 78px rgba(0, 6, 22, .46),
    0 0 68px rgba(95, 202, 255, .34),
    0 0 136px rgba(123, 81, 255, .22),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -18px 40px rgba(0, 11, 34, .28);
  backdrop-filter: blur(14px) saturate(1.18);
  -webkit-backdrop-filter: blur(14px) saturate(1.18);
  font: inherit;
  cursor: pointer;
  transform: translate(-50%, -50%) translateZ(0);
  transition: transform 280ms cubic-bezier(.19,1,.22,1), filter 280ms ease, box-shadow 280ms ease, opacity 280ms ease, border-color 280ms ease;
  animation: introContinueBreath 2.7s ease-in-out infinite alternate;
}

.intro-continue-button::before,
.intro-continue-button::after {
  content: "";
  position: absolute;
  border-radius: inherit;
  pointer-events: none;
}

.intro-continue-button::before {
  inset: -9px;
  border: 1px solid rgba(141, 235, 255, .34);
  box-shadow: 0 0 42px rgba(93, 221, 255, .18);
}

.intro-continue-button::after {
  inset: -20px;
  border: 1px solid rgba(156, 119, 255, .2);
  opacity: .78;
  filter: blur(.25px);
}

.intro-continue-orb {
  position: relative;
  z-index: 1;
  width: 3rem;
  aspect-ratio: 1;
  display: grid;
  grid-template-columns: repeat(3, 3px);
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 999px;
  background:
    radial-gradient(circle at 40% 28%, rgba(255,255,255,.68), transparent 18%),
    radial-gradient(circle at 50% 58%, rgba(95,210,255,.34), transparent 52%),
    rgba(6, 20, 44, .64);
  box-shadow:
    inset 0 0 0 1px rgba(230,255,255,.24),
    inset 0 0 22px rgba(120,224,255,.18),
    0 0 28px rgba(106,221,255,.24);
}

.intro-continue-orb b {
  width: 3px;
  height: 1.05rem;
  border-radius: 999px;
  background: linear-gradient(180deg, #f4ffff, #72ddff);
  box-shadow: 0 0 12px rgba(128, 229, 255, .66);
  animation: introContinueBars 1.08s ease-in-out infinite alternate;
}

.intro-continue-orb b:nth-child(2) { height: 1.52rem; animation-delay: -.35s; }

.intro-continue-orb b:nth-child(3) { height: .82rem; animation-delay: -.7s; }

.intro-continue-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .14rem;
  min-width: 0;
}

.intro-continue-copy strong {
  display: block;
  color: #f7fdff;
  font-size: clamp(1.05rem, 1.35vw, 1.36rem);
  font-weight: 950;
  line-height: 1;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-shadow: 0 0 22px rgba(135, 224, 255, .38);
}

.intro-continue-copy small {
  color: rgba(198, 237, 247, .7);
  font-size: clamp(.57rem, .68vw, .72rem);
  font-weight: 800;
  letter-spacing: .14em;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
}

.intro-continue-button > i {
  position: relative;
  z-index: 1;
  width: 2.34rem;
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle at 64% 36%, rgba(255,255,255,.96), transparent 20%),
    linear-gradient(135deg, rgba(99, 228, 255, .96), rgba(123, 89, 255, .82));
  box-shadow: 0 0 24px rgba(123, 230, 255, .48), inset 0 0 0 1px rgba(255,255,255,.32);
}

.intro-continue-button > i::before {
  content: "";
  position: absolute;
  left: 45%;
  top: 50%;
  width: .52rem;
  height: .52rem;
  border-right: 2px solid rgba(0, 13, 35, .74);
  border-top: 2px solid rgba(0, 13, 35, .74);
  transform: translate(-50%, -50%) rotate(45deg);
}

.intro-continue-button:hover {
  transform: translate(-50%, -50%) translateY(-4px) scale(1.035);
  border-color: rgba(232, 255, 255, .86);
  filter: brightness(1.13) saturate(1.12);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12),
    0 28px 92px rgba(0, 6, 22, .52),
    0 0 82px rgba(118, 226, 255, .42),
    0 0 168px rgba(137, 94, 255, .3),
    inset 0 1px 0 rgba(255,255,255,.44),
    inset 0 -18px 44px rgba(0, 11, 34, .28);
}

.intro-continue-button:active { transform: translate(-50%, -50%) translateY(-1px) scale(.985); }

.intro-continue-button:focus-visible {
  outline: 2px solid rgba(170, 239, 255, .82);
  outline-offset: 10px;
}

.intro-continue-button:disabled { pointer-events: none; opacity: .48; }

.intro-portal.intro-audio-pending .intro-enter-button {
  opacity: 0;
  pointer-events: none;
  transform: translateX(-50%) translateY(18px) scale(.9);
}

.intro-sound-toggle {
  position: absolute;
  right: clamp(1rem, 3.6vw, 3rem);
  top: clamp(1rem, 3.6vw, 3rem);
  z-index: 8;
  width: clamp(102px, 8.6vw, 136px);
  height: clamp(38px, 3.05vw, 46px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(126, 177, 209, .42);
  border-radius: 999px;
  padding: 0 clamp(1rem, 1.2vw, 1.28rem);
  cursor: pointer;
  background:
    radial-gradient(ellipse at 50% 120%, rgba(90, 132, 190, .17), transparent 60%),
    linear-gradient(180deg, rgba(9, 12, 18, .96), rgba(4, 6, 10, .9));
  box-shadow:
    0 0 0 1px rgba(190, 226, 255, .03),
    0 0 24px rgba(77, 140, 206, .18),
    0 0 58px rgba(103, 82, 190, .1),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -12px 28px rgba(0,0,0,.42);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  transform: translateZ(0);
  transition: transform 220ms cubic-bezier(.19,1,.22,1), opacity 220ms ease, filter 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.intro-sound-toggle::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 8%, rgba(119, 181, 225, .22) 22%, transparent 38%, transparent 62%, rgba(126, 98, 214, .18) 80%, transparent 93%),
    radial-gradient(ellipse at 50% 116%, rgba(89, 151, 219, .18), transparent 60%);
  opacity: .74;
  filter: blur(.2px);
}

.intro-sound-toggle::after {
  content: "";
  position: absolute;
  inset: 4px 6px;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid rgba(220, 242, 255, .05);
  box-shadow: inset 0 0 18px rgba(105, 172, 230, .045);
}

.intro-sound-toggle:hover {
  transform: translateY(-2px) scale(1.024);
  border-color: rgba(165, 210, 246, .68);
  filter: brightness(1.14) saturate(1.08);
  box-shadow:
    0 0 0 1px rgba(209, 235, 255, .06),
    0 0 34px rgba(101, 178, 238, .28),
    0 0 82px rgba(127, 104, 225, .17),
    inset 0 1px 0 rgba(255,255,255,.1),
    inset 0 -12px 30px rgba(0,0,0,.44);
}

.intro-sound-toggle:active { transform: translateY(-1px) scale(.99); }

.intro-sound-toggle:focus-visible { outline: 2px solid rgba(166, 214, 255, .76); outline-offset: 7px; }

.intro-sound-toggle:disabled { pointer-events: none; opacity: .42; }

.main-sound-toggle {
  position: fixed;
  z-index: 88;
  right: clamp(1rem, 3.6vw, 3rem);
  top: clamp(1rem, 3.6vw, 3rem);
  background:
    radial-gradient(ellipse at 50% 120%, rgba(79, 132, 206, .18), transparent 60%),
    linear-gradient(180deg, rgba(7, 10, 18, .9), rgba(3, 5, 10, .76));
  box-shadow:
    0 0 0 1px rgba(204, 231, 255, .04),
    0 0 24px rgba(72, 134, 216, .22),
    0 0 70px rgba(103, 82, 190, .12),
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 -12px 28px rgba(0,0,0,.42);
}

.ebook-cart-button {
  position: fixed;
  z-index: 89;
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem));
  top: clamp(1rem, 3.6vw, 3rem);
  width: clamp(46px, 3.8vw, 54px);
  height: clamp(38px, 3.05vw, 46px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(145, 202, 238, .46);
  border-radius: 999px;
  padding: 0;
  cursor: pointer;
  color: rgba(241, 250, 255, .96);
  background:
    radial-gradient(circle at 38% 28%, rgba(255,255,255,.14), transparent 22%),
    radial-gradient(ellipse at 50% 118%, rgba(95, 230, 255, .18), transparent 62%),
    linear-gradient(180deg, rgba(7, 10, 18, .94), rgba(2, 5, 12, .78));
  box-shadow:
    0 0 0 1px rgba(204, 231, 255, .035),
    0 0 24px rgba(72, 164, 216, .2),
    0 0 72px rgba(120, 82, 190, .13),
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -12px 28px rgba(0,0,0,.42);
  transition: transform 220ms cubic-bezier(.19,1,.22,1), filter 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.ebook-cart-button svg {
  width: 28px;
  height: 28px;
  overflow: visible;
  filter:
    drop-shadow(0 0 5px rgba(246, 249, 255, .62))
    drop-shadow(0 0 14px rgba(116, 231, 222, .18));
}

.ebook-cart-button path,
.ebook-cart-button circle {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ebook-cart-button .cart-signal {
  stroke: rgba(116, 239, 223, .68);
  stroke-width: 1.55;
}

.ebook-cart-button span {
  position: absolute;
  right: -5px;
  top: -6px;
  min-width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  color: #06111b;
  background: linear-gradient(135deg, #f3ffff, #7af2ff 48%, #9b7bff);
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 0 16px rgba(111, 230, 255, .46);
  font-size: .62rem;
  font-weight: 950;
  line-height: 1;
}

.ebook-cart-button:hover {
  transform: translateY(-2px) scale(1.04);
  border-color: rgba(185, 230, 255, .72);
  filter: brightness(1.14) saturate(1.1);
  box-shadow:
    0 0 0 1px rgba(218, 241, 255, .06),
    0 0 36px rgba(101, 206, 238, .3),
    0 0 88px rgba(127, 104, 225, .18),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -12px 30px rgba(0,0,0,.42);
}

.ebook-cart-button:active { transform: translateY(-1px) scale(.98); }

.ebook-cart-button:focus-visible { outline: 2px solid rgba(166, 234, 255, .76); outline-offset: 7px; }

.ebook-cart-button.is-pulsing {
  animation: cartAbsorbPulse 920ms cubic-bezier(.19,1,.22,1) both;
}

.ebook-cart-button.is-pulsing span {
  animation: cartBadgePop 780ms cubic-bezier(.19,1,.22,1) both;
}

.ebook-preview-download-button {
  position: fixed;
  z-index: 88;
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem));
  top: clamp(1rem, 3.6vw, 3rem);
  width: clamp(92px, 7.8vw, 116px);
  height: clamp(38px, 3.05vw, 46px);
  display: inline-grid;
  grid-template-columns: clamp(25px, 2.2vw, 29px) auto;
  align-items: center;
  justify-content: center;
  gap: .38rem;
  border: 1px solid rgba(145, 202, 238, .42);
  border-radius: 999px;
  padding: 0 .78rem;
  cursor: pointer;
  color: rgba(243, 252, 255, .98);
  text-decoration: none;
  background:
    radial-gradient(circle at 34% 24%, rgba(255,255,255,.12), transparent 24%),
    radial-gradient(ellipse at 50% 118%, rgba(97, 207, 194, .17), transparent 62%),
    linear-gradient(180deg, rgba(7, 10, 18, .92), rgba(2, 5, 12, .76));
  box-shadow:
    0 0 0 1px rgba(204, 231, 255, .03),
    0 0 22px rgba(72, 164, 216, .16),
    0 0 68px rgba(97, 207, 194, .1),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -12px 28px rgba(0,0,0,.4);
  transition: transform 220ms cubic-bezier(.19,1,.22,1), filter 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.ebook-preview-download-button svg {
  width: clamp(25px, 2.2vw, 29px);
  height: clamp(25px, 2.2vw, 29px);
  overflow: visible;
  filter:
    drop-shadow(0 0 5px rgba(246, 249, 255, .58))
    drop-shadow(0 0 14px rgba(116, 231, 222, .16));
}

.ebook-preview-download-button path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ebook-preview-download-button .preview-lines,
.ebook-preview-download-button .preview-arrow {
  stroke: rgba(116, 239, 223, .75);
  stroke-width: 1.75;
}

.ebook-preview-download-button span {
  font-size: clamp(.6rem, .64vw, .7rem);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1;
}

.ebook-preview-download-button:hover {
  transform: translateY(-2px) scale(1.032);
  border-color: rgba(185, 230, 255, .68);
  filter: brightness(1.12) saturate(1.08);
  box-shadow:
    0 0 0 1px rgba(218, 241, 255, .05),
    0 0 34px rgba(101, 206, 238, .26),
    0 0 82px rgba(97, 207, 194, .14),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -12px 30px rgba(0,0,0,.42);
}

.ebook-preview-download-button:active { transform: translateY(-1px) scale(.99); }

.ebook-preview-download-button:focus-visible { outline: 2px solid rgba(166, 234, 255, .76); outline-offset: 7px; }

.ebook-info-button {
  position: fixed;
  z-index: 90;
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem));
  top: clamp(1rem, 3.6vw, 3rem);
  width: clamp(46px, 3.8vw, 54px);
  height: clamp(38px, 3.05vw, 46px);
  display: grid;
  place-items: center;
  border: 1px solid rgba(145, 202, 238, .48);
  border-radius: 999px;
  padding: 0;
  cursor: pointer;
  color: rgba(245, 252, 255, .98);
  background:
    radial-gradient(circle at 38% 28%, rgba(255,255,255,.13), transparent 23%),
    radial-gradient(ellipse at 50% 118%, rgba(129, 111, 255, .2), transparent 62%),
    linear-gradient(180deg, rgba(7, 10, 18, .94), rgba(2, 5, 12, .78));
  box-shadow:
    0 0 0 1px rgba(204, 231, 255, .035),
    0 0 24px rgba(96, 164, 232, .2),
    0 0 72px rgba(120, 82, 190, .16),
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -12px 28px rgba(0,0,0,.42);
  transition: transform 220ms cubic-bezier(.19,1,.22,1), filter 220ms ease, border-color 220ms ease, box-shadow 220ms ease, opacity 220ms ease;
}

.ebook-info-button svg {
  width: 27px;
  height: 27px;
  overflow: visible;
  filter:
    drop-shadow(0 0 5px rgba(246, 249, 255, .66))
    drop-shadow(0 0 15px rgba(134, 112, 255, .24));
}

.ebook-info-button path,
.ebook-info-button circle {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ebook-info-button .info-stem,
.ebook-info-button .info-line {
  stroke: rgba(119, 248, 255, .78);
  stroke-width: 2.55;
}

.ebook-info-button .info-dot {
  fill: rgba(119, 248, 255, .92);
  stroke: none;
  filter: drop-shadow(0 0 8px rgba(119, 248, 255, .56));
}

.ebook-info-button:hover {
  transform: translateY(-2px) scale(1.04);
  border-color: rgba(185, 230, 255, .74);
  filter: brightness(1.14) saturate(1.1);
  box-shadow:
    0 0 0 1px rgba(218, 241, 255, .06),
    0 0 36px rgba(101, 206, 238, .3),
    0 0 88px rgba(127, 104, 225, .2),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -12px 30px rgba(0,0,0,.42);
}

.ebook-info-button:active { transform: translateY(-1px) scale(.98); }

.ebook-info-button:focus-visible { outline: 2px solid rgba(166, 234, 255, .76); outline-offset: 7px; }

.ebook-info-button:disabled { pointer-events: none; opacity: .5; }

.intro-sound-toggle-wave {
  position: relative;
  z-index: 1;
  width: clamp(68px, 5.6vw, 88px);
  height: 22px;
  display: block;
  overflow: visible;
  filter:
    drop-shadow(0 0 4px rgba(246, 249, 255, .82))
    drop-shadow(0 0 14px rgba(126, 180, 255, .36))
    drop-shadow(0 0 18px rgba(112, 231, 222, .18));
}

.intro-sound-toggle-wave .wave-line,
.intro-sound-toggle-wave .wave-flat {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  transform-origin: center;
}

.intro-sound-toggle-wave .wave-line {
  stroke-width: 2.2;
  stroke-dasharray: 46 18 24 18;
  stroke-dashoffset: 0;
  opacity: .92;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.intro-sound-toggle-wave .wave-line-a {
  stroke: url(#introWaveGradientA);
  animation-name: introActiveTheorySvgWaveA;
  animation-duration: 1.42s;
}

.intro-sound-toggle-wave .wave-line-b {
  stroke: rgba(245, 247, 255, .78);
  stroke-width: 1.35;
  opacity: .58;
  animation-name: introActiveTheorySvgWaveB;
  animation-duration: 1.68s;
  animation-delay: -.22s;
}

.intro-sound-toggle-wave .wave-line-c {
  stroke: rgba(116, 239, 223, .5);
  stroke-width: 1.15;
  opacity: .42;
  animation-name: introActiveTheorySvgWaveC;
  animation-duration: 1.28s;
  animation-delay: -.46s;
}

.intro-sound-toggle-wave .wave-flat {
  stroke: rgba(176, 190, 204, .82);
  stroke-width: 2;
  opacity: 0;
  transform: scaleX(.84);
  transition: opacity 180ms ease, transform 220ms ease;
}

.intro-sound-toggle.is-muted .intro-sound-toggle-wave {
  opacity: .78;
  filter: drop-shadow(0 0 7px rgba(160, 186, 210, .18));
}

.intro-sound-toggle.is-muted .intro-sound-toggle-wave .wave-line {
  opacity: 0;
  animation-play-state: paused;
}

.intro-sound-toggle.is-muted .intro-sound-toggle-wave .wave-flat {
  opacity: 1;
  transform: scaleX(.94);
}

.intro-enter-button {
  position: absolute;
  left: 50%;
  bottom: clamp(2.3rem, 8vh, 5.8rem);
  z-index: 6;
  width: clamp(96px, 10vw, 148px);
  aspect-ratio: 1;
  border: 1px solid rgba(221, 255, 255, .42);
  border-radius: 999px;
  padding: 0;
  color: transparent;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  cursor: pointer;
  transform: translateX(-50%) translateZ(0);
  background:
    radial-gradient(circle at 50% 44%, rgba(184,218,255,.82), rgba(55,132,205,.62) 16%, rgba(70,50,185,.44) 38%, rgba(4,12,34,.58) 58%, rgba(255,255,255,.06) 68%, transparent 70%),
    conic-gradient(from 180deg, rgba(115,247,255,.18), rgba(174,116,255,.7), rgba(255,255,255,.28), rgba(93,239,255,.76), rgba(115,247,255,.18));
  box-shadow:
    0 0 42px rgba(40,112,190,.24),
    0 0 96px rgba(82,60,190,.22),
    inset 0 0 18px rgba(255,255,255,.28),
    inset 0 0 46px rgba(36,116,210,.18);
  transition: transform 260ms cubic-bezier(.19,1,.22,1), filter 260ms ease, box-shadow 260ms ease;
  animation: introButtonBreath 3.2s ease-in-out infinite alternate;
}

.intro-enter-button::before,
.intro-enter-button::after {
  content: "";
  position: absolute;
  inset: 13%;
  border-radius: 999px;
  border: 1px solid rgba(235,255,255,.42);
  box-shadow: inset 0 0 22px rgba(151,244,255,.4), 0 0 24px rgba(151,244,255,.22);
  animation: introButtonOrbit 5.8s linear infinite;
}

.intro-enter-button::after {
  inset: 27%;
  border-color: rgba(191,153,255,.52);
  animation-duration: 4.2s;
  animation-direction: reverse;
}

.intro-enter-button:hover {
  transform: translateX(-50%) translateY(-4px) scale(1.055);
  filter: brightness(1.16) saturate(1.16);
  box-shadow:
    0 0 54px rgba(138,242,255,.42),
    0 0 130px rgba(142,91,255,.32),
    inset 0 0 22px rgba(255,255,255,.36),
    inset 0 0 54px rgba(72,229,255,.24);
}

.intro-enter-button:active { transform: translateX(-50%) translateY(-1px) scale(.97); }

.intro-enter-button:disabled { pointer-events: none; }

.intro-portal.is-exiting .intro-enter-button {
  animation: introButtonDive 1120ms cubic-bezier(.77,0,.175,1) forwards;
}

.intro-portal.is-exiting .intro-sound-toggle {
  opacity: 0;
  transform: translateY(-10px) scale(.86);
}

.intro-portal.is-exiting .intro-canvas {
  animation: introCanvasPull 1520ms cubic-bezier(.77,0,.175,1) forwards;
}

.intro-portal.is-exiting::after {
  animation: introVeilGather 1520ms cubic-bezier(.77,0,.175,1) forwards;
}

.fixed-webgl-stage.webgl-stage-handoff {
  filter: blur(14px) brightness(.34) saturate(.75);
  transform: scale(.965);
  opacity: 1;
  transition: filter 760ms cubic-bezier(.19,1,.22,1), transform 760ms cubic-bezier(.19,1,.22,1), opacity 760ms ease;
}

.fixed-webgl-stage.webgl-stage-handoff.webgl-stage-ready {
  filter: blur(0) brightness(1) saturate(1.04);
  transform: scale(1);
}

.intro-handoff-veil {
  position: fixed;
  inset: 0;
  z-index: 34;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  text-align: center;
  color: #ffffff;
  opacity: 1;
  transform: translateZ(0);
  background: #03050a;
  filter: blur(0) brightness(1);
  transition: opacity 360ms ease, filter 360ms ease;
  cursor: none !important;
}

.topdown-webgl-page.intro-handoff,
.topdown-webgl-page.intro-handoff *,
.topdown-webgl-page.intro-handoff .intro-handoff-veil,
.topdown-webgl-page.intro-handoff .intro-handoff-veil * {
  cursor: none !important;
}

.topdown-webgl-page.intro-handoff .cursor-fx-layer {
  display: none !important;
  opacity: 0 !important;
}

.intro-handoff-veil::before,
.intro-handoff-veil::after {
  content: none;
}

.intro-handoff-veil > .handoff-kicker,
.intro-handoff-veil > .handoff-percent,
.intro-handoff-veil > .handoff-caption,
.intro-handoff-veil > .handoff-progress-track {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  margin: 0;
}

.intro-handoff-veil > .handoff-kicker {
  order: 1;
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: clamp(18px, 2.6vh, 26px);
  margin: 0 0 clamp(26px, 5vh, 54px) !important;
  font-size: clamp(11px, 1.15vw, 14px);
  line-height: 1;
  letter-spacing: .34em;
  text-transform: uppercase;
  font-weight: 600;
  color: rgba(255, 255, 255, .72);
}

.intro-handoff-veil > .handoff-percent {
  order: 2;
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: clamp(58px, 8vw, 96px);
  margin: 0 0 clamp(22px, 4vh, 44px) !important;
  font-size: clamp(2.6rem, 5.6vw, 4.65rem);
  line-height: 1;
  letter-spacing: -.035em;
  font-weight: 700;
  color: #ffffff;
}

.intro-handoff-veil > .handoff-caption {
  display: none;
}

.intro-handoff-veil > .handoff-progress-track {
  order: 3;
  width: min(62vw, 320px);
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, .16);
}

.intro-handoff-veil > .handoff-progress-track i {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: #ffffff;
  transition: width 140ms ease-out;
}

.intro-handoff-veil.is-ready {
  opacity: 0;
  filter: blur(4px);
}

.ebook-info-page {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background: #000;
}

.ebook-info-page::before,
.ebook-info-page::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 2;
}

.ebook-info-page::before {
  inset: -18%;
  background:
    radial-gradient(circle at 28% 34%, rgba(97,207,194,.16), transparent 28rem),
    radial-gradient(circle at 76% 52%, rgba(143,112,210,.17), transparent 30rem),
    radial-gradient(circle at 50% 92%, rgba(200,149,98,.09), transparent 34rem);
  mix-blend-mode: screen;
  filter: blur(26px) saturate(1.2);
  opacity: .9;
}

.ebook-info-page::after {
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 50%, transparent 0 42%, rgba(0,0,0,.22) 64%, rgba(0,0,0,.82) 100%),
    linear-gradient(90deg, rgba(0,0,0,.18), transparent 26%, transparent 72%, rgba(0,0,0,.38));
}

.ebook-info-book-stage {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.ebook-info-canvas {
  position: absolute !important;
  inset: 0;
  z-index: 1 !important;
}

.ebook-info-book-hit {
  position: absolute;
  z-index: 7;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  border: 0;
  padding: 0;
  margin: 0;
  border-radius: 1.2rem;
  background: transparent;
  cursor: pointer;
  opacity: 0;
  -webkit-tap-highlight-color: transparent;
}

.ebook-info-book-hit:focus-visible {
  outline: 2px solid rgba(126, 248, 255, .72);
  outline-offset: 8px;
}

.ebook-info-panel {
  position: absolute;
  left: 50%;
  top: calc(50% + .25rem);
  z-index: 5;
  width: min(640px, calc(100vw - 2rem));
  max-height: calc(100svh - 7.1rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  transform: translate(-54%, -50%);
  padding: clamp(1.35rem, 3.4vw, 3rem);
  color: #f7ffff;
  border: 1px solid rgba(224, 248, 255, .16);
  border-radius: clamp(1.2rem, 2.2vw, 2rem);
  background:
    linear-gradient(180deg, rgba(8, 10, 14, .96), rgba(0, 0, 0, .92)),
    radial-gradient(circle at 16% 0%, rgba(119, 248, 255, .11), transparent 36%);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.045),
    0 38px 140px rgba(0,0,0,.7),
    0 0 88px rgba(97, 207, 194, .14),
    0 0 150px rgba(143, 112, 210, .12),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -22px 60px rgba(0,0,0,.42);
  backdrop-filter: blur(12px) saturate(1.08);
  -webkit-backdrop-filter: blur(12px) saturate(1.08);
  pointer-events: none;
}

.ebook-info-panel::-webkit-scrollbar { width: 8px; }

.ebook-info-panel::-webkit-scrollbar-track { background: rgba(255,255,255,.035); border-radius: 999px; }

.ebook-info-panel::-webkit-scrollbar-thumb { background: rgba(126,248,255,.28); border-radius: 999px; }

.ebook-info-panel.is-interactive {
  pointer-events: auto;
}

.ebook-info-panel::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: calc(clamp(1.2rem, 2.2vw, 2rem) - 6px);
  border: 1px solid rgba(119, 248, 255, .07);
  pointer-events: none;
}

.ebook-legal-page .ebook-info-panel {
  box-shadow:
    0 0 0 1px rgba(255,255,255,.045),
    0 38px 140px rgba(0,0,0,.7),
    0 0 88px rgba(97, 207, 194, .14),
    0 0 150px rgba(143, 112, 210, .12),
    inset 0 0 0 1px rgba(119, 248, 255, .07),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -22px 60px rgba(0,0,0,.42);
}

.ebook-legal-page .ebook-info-panel::before {
  content: none;
}

.ebook-info-kicker {
  margin: 0 0 .8rem;
  color: rgba(126, 248, 255, .84);
  font-size: clamp(.64rem, .75vw, .78rem);
  font-weight: 950;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.ebook-info-panel h1 {
  margin: 0;
  font-size: clamp(1.9rem, 4.15vw, 3.9rem);
  line-height: .92;
  letter-spacing: -.075em;
  white-space: nowrap;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 0 34px rgba(119,248,255,.16);
}

.ebook-info-subtitle {
  margin: clamp(.62rem, 1.15vw, .92rem) 0 0;
  color: rgba(126, 248, 255, .84);
  font-size: clamp(.72rem, .92vw, .95rem);
  font-weight: 950;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.ebook-info-lead {
  margin: clamp(.62rem, 1.2vw, .9rem) 0 0;
  max-width: 58ch;
  color: rgba(245, 255, 255, .86);
  font-size: clamp(.94rem, 1.12vw, 1.08rem);
  line-height: 1.66;
  font-weight: 650;
}

.ebook-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .72rem;
  margin-top: clamp(1rem, 2.1vw, 1.55rem);
}

.ebook-info-grid div {
  min-width: 0;
  min-height: 82px;
  padding: .9rem .95rem;
  overflow: hidden;
  overflow-wrap: anywhere;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 20% 0%, rgba(119,248,255,.08), transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
}

.ebook-info-grid .ebook-info-legal-card {
  grid-column: 1 / -1;
  min-height: 96px;
  background:
    radial-gradient(circle at 16% 0%, rgba(126,248,255,.13), transparent 50%),
    radial-gradient(circle at 92% 88%, rgba(143,112,210,.14), transparent 54%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}

.ebook-info-grid .ebook-info-contact-card {
  grid-column: 1 / -1;
  container-type: inline-size;
  min-height: 82px;
}

.ebook-info-grid span {
  display: block;
  margin-bottom: .36rem;
  color: rgba(126, 248, 255, .72);
  font-size: .66rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.ebook-info-grid strong {
  display: block;
  max-width: 100%;
  color: rgba(255,255,255,.93);
  font-size: clamp(.82rem, .92vw, .96rem);
  line-height: 1.38;
  font-weight: 850;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.ebook-info-grid .ebook-info-contact-card strong {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  font-size: clamp(.82rem, .92vw, .96rem);
  letter-spacing: 0;
  line-height: 1.24;
}

.ebook-info-note {
  margin: clamp(1rem, 2vw, 1.35rem) 0 0;
  color: rgba(207, 228, 226, .7);
  font-size: clamp(.76rem, .82vw, .86rem);
  line-height: 1.62;
  font-weight: 650;
}

.ebook-info-legal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .46rem;
  margin-top: .72rem;
}

.ebook-info-legal-actions button {
  appearance: none;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(126, 248, 255, .22);
  border-radius: 999px;
  padding: .48rem .72rem;
  color: rgba(246,255,255,.94);
  background:
    radial-gradient(circle at 50% 0%, rgba(126,248,255,.17), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  box-shadow: 0 0 20px rgba(97,207,194,.08), inset 0 1px 0 rgba(255,255,255,.08);
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transform: translateZ(0);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
  -webkit-tap-highlight-color: transparent;
}

.ebook-info-legal-actions button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0 28%, rgba(255,255,255,.24) 46%, transparent 66%);
  transform: translateX(-115%);
  opacity: .8;
  pointer-events: none;
  transition: transform 420ms cubic-bezier(.19,1,.22,1);
}

.ebook-info-legal-actions button:focus-visible {
  outline: 2px solid rgba(126, 248, 255, .78);
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .ebook-info-legal-actions button:hover {
    transform: translateY(-1px) scale(1.025);
    border-color: rgba(126,248,255,.46);
    color: #fff;
    box-shadow: 0 0 30px rgba(97,207,194,.18), 0 0 54px rgba(143,112,210,.12), inset 0 1px 0 rgba(255,255,255,.14);
  }
  .ebook-info-legal-actions button:hover::before {
    transform: translateX(115%);
  }
}

.ebook-info-legal-actions button:active {
  transform: translateY(0) scale(.97);
}

.ebook-legal-page .ebook-info-panel {
  width: min(720px, calc(100vw - 2rem));
  max-height: calc(100svh - 7.1rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  animation: ebookLegalPanelArrive 680ms cubic-bezier(.19,1,.22,1) both;
}

.ebook-legal-book-stage {
  opacity: 1;
  filter: none;
  transform: translateZ(0);
}

.ebook-legal-content {
  display: grid;
  grid-template-columns: 1fr;
  gap: .62rem;
  margin-top: clamp(.95rem, 1.8vw, 1.3rem);
}

.ebook-legal-content article {
  position: relative;
  padding: .85rem .95rem;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 12% 0%, rgba(119,248,255,.075), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.017));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
}

.ebook-legal-content span,
.mobile-legal-content span {
  display: block;
  margin-bottom: .26rem;
  color: rgba(126, 248, 255, .72);
  font-size: .58rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.ebook-legal-content h2,
.mobile-legal-content h2 {
  margin: 0;
  color: rgba(255,255,255,.95);
  font-size: clamp(.86rem, .98vw, 1.02rem);
  line-height: 1.22;
  font-weight: 950;
  letter-spacing: -.015em;
}

.ebook-legal-content p,
.mobile-legal-content p {
  margin: .32rem 0 0;
  color: rgba(229, 244, 244, .78);
  font-size: clamp(.76rem, .86vw, .9rem);
  line-height: 1.5;
  font-weight: 650;
}

.ebook-legal-note {
  color: rgba(255, 221, 168, .74);
}

@media (max-height: 820px) and (min-width: 721px) {
  .ebook-info-panel {
    top: calc(50% + .55rem);
    width: min(604px, calc(100vw - 2rem));
    max-height: calc(100svh - 5.75rem);
    padding: clamp(1rem, 2.15vw, 1.58rem);
    transform: translate(-57%, -50%);
  }
  .ebook-info-kicker { margin-bottom: .48rem; }
  .ebook-info-panel h1 { font-size: clamp(1.78rem, 3.55vw, 3.18rem); }
  .ebook-info-subtitle { margin-top: .48rem; font-size: clamp(.65rem, .78vw, .82rem); }
  .ebook-info-lead { margin-top: .52rem; font-size: clamp(.82rem, .94vw, .95rem); line-height: 1.46; }
  .ebook-info-grid { gap: .52rem; margin-top: .78rem; }
  .ebook-info-grid div { min-height: 62px; padding: .68rem .76rem; border-radius: .82rem; }
  .ebook-info-grid .ebook-info-contact-card { grid-column: 1 / -1; min-height: 62px; }
  .ebook-info-grid .ebook-info-legal-card { min-height: 78px; }
  .ebook-info-grid span { margin-bottom: .22rem; font-size: .58rem; }
  .ebook-info-grid strong { font-size: clamp(.72rem, .78vw, .84rem); line-height: 1.28; }
  .ebook-info-grid .ebook-info-contact-card strong { font-size: clamp(.72rem, .78vw, .84rem); letter-spacing: 0; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
  .ebook-info-legal-actions { margin-top: .5rem; gap: .38rem; }
  .ebook-info-legal-actions button { padding: .4rem .58rem; font-size: .58rem; }
  .ebook-legal-content { gap: .5rem; margin-top: .72rem; }
  .ebook-legal-content article { padding: .68rem .76rem; border-radius: .82rem; }
  .ebook-info-note { margin-top: .76rem; font-size: .72rem; line-height: 1.45; }
}

.mobile-info-page {
  position: relative;
  z-index: 4;
  min-height: 100svh;
  padding: calc(env(safe-area-inset-top, 0px) + 4.8rem) .88rem calc(env(safe-area-inset-bottom, 0px) + 5.5rem);
  color: #f7ffff;
  background:
    radial-gradient(circle at 50% 18%, rgba(97,207,194,.18), transparent 18rem),
    radial-gradient(circle at 82% 54%, rgba(143,112,210,.14), transparent 20rem),
    linear-gradient(180deg, #020405 0%, #000 58%, #000 100%);
  overflow: visible;
  -webkit-overflow-scrolling: touch;
}

.mobile-info-hero-card {
  position: relative;
  z-index: 4;
  width: min(100%, 560px);
  margin: 0 auto;
  padding: clamp(1rem, 4.4vw, 1.32rem);
  border: 1px solid rgba(224,248,255,.12);
  border-radius: 1.15rem;
  background:
    linear-gradient(180deg, rgba(8,10,14,.985), rgba(0,0,0,.952)),
    radial-gradient(circle at 14% 0%, rgba(119,248,255,.14), transparent 36%);
  box-shadow: 0 22px 70px rgba(0,0,0,.74), inset 0 1px 0 rgba(255,255,255,.08);
}

.mobile-info-eyebrow { margin: 0 0 .55rem; color: rgba(126,248,255,.84); font-size: .58rem; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; }

.mobile-info-hero-card h1 { margin: 0; font-size: clamp(2.28rem, 13.2vw, 3.38rem); line-height: .88; letter-spacing: -.08em; text-transform: uppercase; }

.mobile-info-subtitle { margin: .68rem 0 0; color: rgba(126,248,255,.84); font-size: .72rem; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }

.mobile-info-copy { margin: .68rem 0 0; color: rgba(245,255,255,.86); font-size: .92rem; line-height: 1.5; font-weight: 650; }

.mobile-info-facts { display: grid; grid-template-columns: 1fr; gap: .52rem; margin-top: .92rem; }

.mobile-info-facts article { min-width: 0; padding: .74rem .78rem; overflow: hidden; overflow-wrap: anywhere; border: 1px solid rgba(255,255,255,.08); border-radius: .85rem; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)); }

.mobile-info-facts article.mobile-info-legal-card {
  background:
    radial-gradient(circle at 14% 0%, rgba(126,248,255,.13), transparent 46%),
    radial-gradient(circle at 94% 92%, rgba(143,112,210,.13), transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.019));
}

.mobile-info-facts span { display: block; margin-bottom: .22rem; color: rgba(126,248,255,.72); font-size: .6rem; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }

.mobile-info-facts strong { display: block; max-width: 100%; color: rgba(246,255,255,.92); font-size: .84rem; line-height: 1.32; overflow-wrap: anywhere; word-break: break-word; hyphens: auto; }

.mobile-info-facts .mobile-info-contact-card { container-type: inline-size; }

.mobile-info-facts .mobile-info-contact-card strong { white-space: nowrap; overflow-wrap: normal; word-break: normal; hyphens: none; font-size: .84rem; letter-spacing: 0; line-height: 1.32; }

.ebook-info-legal-actions.is-compact { gap: .4rem; margin-top: .58rem; }

.ebook-info-legal-actions.is-compact button { padding: .44rem .62rem; font-size: .6rem; }

.mobile-legal-page {
  min-height: auto;
  overflow: visible;
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 8rem);
}

.mobile-legal-card {
  animation: mobileLegalPanelArrive 620ms cubic-bezier(.19,1,.22,1) both;
}

.mobile-legal-content {
  display: grid;
  grid-template-columns: 1fr;
  gap: .58rem;
  margin-top: .94rem;
}

.mobile-legal-content article {
  padding: .76rem .78rem;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: .85rem;
  background:
    radial-gradient(circle at 10% 0%, rgba(126,248,255,.08), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
}

.mobile-info-book-section { position: relative; z-index: 5; min-height: 124svh; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 9svh 0 32svh; pointer-events: auto; background: transparent; }

.mobile-info-book-section.mobile-legal-book-section {
  min-height: 104svh;
  padding-top: 7svh;
  padding-bottom: 26svh;
}

.mobile-info-book-hint { margin: 0 0 1.1rem; color: rgba(159,252,240,.78); font-size: .68rem; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }

.mobile-info-book-button { appearance: none; border: 0; background: transparent; padding: 0; margin: 0; width: min(76vw, 340px); cursor: pointer; -webkit-tap-highlight-color: transparent; }

.mobile-info-book-visual { position: relative; width: 100%; aspect-ratio: .68; margin: 0 auto; transform: perspective(900px) rotateX(2deg) rotateY(-4deg) translateZ(0); filter: drop-shadow(0 34px 74px rgba(0,0,0,.8)); will-change: transform, opacity; }

.mobile-info-book-button:active .mobile-info-book-visual { transform: perspective(900px) rotateX(2deg) rotateY(-4deg) scale(.985); }

.mobile-info-book-orbit { position: absolute; inset: 28% -24% auto; height: 22%; border: 1px solid rgba(126,248,255,.22); border-radius: 50%; transform: rotate(-10deg); filter: blur(.2px); }

.mobile-info-book-top, .mobile-info-book-bottom { position: absolute; left: 12%; right: 12%; height: 5.8%; border-radius: .16rem; background: linear-gradient(180deg, #222a30, #11161a); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }

.mobile-info-book-top { top: 0; }

.mobile-info-book-bottom { bottom: 0; height: 8%; }

.mobile-info-book-spine { position: absolute; top: 5%; bottom: 6.5%; width: 10%; border-radius: .32rem; background: linear-gradient(90deg, #0b1115, #273039 52%, #11171c); box-shadow: inset 0 0 18px rgba(126,248,255,.08); }

.mobile-info-book-spine.left { left: 4%; }

.mobile-info-book-spine.right { right: 4%; }

.mobile-info-book-cover { position: absolute; inset: 6.5% 14% 9%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border: 1px solid rgba(126,248,255,.26); background: radial-gradient(circle at 50% 29%, rgba(126,248,255,.18), transparent 20%), linear-gradient(180deg, rgba(9,22,26,.94), rgba(5,8,16,.98)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 0 54px rgba(97,207,194,.13); overflow: hidden; }

.mobile-info-book-cover::before, .mobile-info-book-cover::after { content: ""; position: absolute; inset: 11%; border: 1px solid rgba(126,248,255,.16); pointer-events: none; }

.mobile-info-book-cover::after { inset: 22% 18%; border-radius: 50%; border-color: rgba(126,248,255,.24); }

.mobile-info-book-cover small, .mobile-info-book-cover span { position: relative; z-index: 2; color: #9ffcf0; font-size: clamp(.48rem, 2.1vw, .72rem); font-weight: 950; letter-spacing: .14em; text-shadow: 0 0 18px rgba(126,248,255,.48); }

.mobile-info-book-cover strong { position: relative; z-index: 2; margin: 1.5rem 0 .72rem; color: #fff; font-size: clamp(1.75rem, 8.6vw, 3rem); line-height: .9; font-weight: 950; letter-spacing: -.04em; }

.mobile-info-book-cover em { position: relative; z-index: 2; width: 27%; aspect-ratio: 1; margin-top: 1.1rem; border-radius: 50%; border: 2px solid rgba(126,248,255,.72); box-shadow: 0 0 26px rgba(126,248,255,.58), inset 0 0 20px rgba(126,248,255,.2); }

.mobile-info-book-flyer { transform-style: preserve-3d; }

.topdown-webgl-page.is-route-transition .fixed-webgl-stage {
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.topdown-webgl-page.route-pull .fixed-webgl-stage {
  animation: ebookStageVortexOut 860ms cubic-bezier(.77,0,.175,1) both;
}

.topdown-webgl-page.route-hold .fixed-webgl-stage {
  opacity: .08;
  transform: translateZ(0) scale(1.34);
}

.topdown-webgl-page.route-reveal .fixed-webgl-stage {
  animation: ebookStageVortexIn 980ms cubic-bezier(.19,1,.22,1) both;
}

.ebook-page-pull-veil {
  position: fixed;
  inset: 0;
  z-index: 70;
  pointer-events: none;
  overflow: hidden;
  opacity: 1;
  transform: translateZ(0);
  background:
    radial-gradient(circle at 50% 50%, rgba(118,248,255,.18), transparent 0 10%, rgba(143,112,210,.14) 22%, rgba(0,0,0,.9) 56%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,.62), #000);
}

.ebook-page-pull-veil i,
.ebook-page-pull-veil b {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(68vmin, 640px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(186, 245, 255, .28);
  box-shadow: 0 0 95px rgba(111, 231, 255, .2), inset 0 0 80px rgba(151, 105, 255, .18);
  animation: ebookPullRing 780ms linear infinite;
}

.ebook-page-pull-veil b {
  width: min(38vmin, 380px);
  border-color: rgba(186, 142, 255, .26);
  animation-duration: 560ms;
  animation-direction: reverse;
}

.topdown-webgl-page.route-pull .ebook-page-pull-veil {
  animation: ebookPullVeilIn 860ms cubic-bezier(.77,0,.175,1) both;
}

.topdown-webgl-page.route-hold .ebook-page-pull-veil {
  opacity: 1;
  transform: translateZ(0) scale(1);
}

.topdown-webgl-page.route-reveal .ebook-page-pull-veil {
  animation: ebookPullVeilOut 980ms cubic-bezier(.19,1,.22,1) both;
}

@keyframes introButtonBreath {
  from { opacity: .8; filter: brightness(.92) saturate(1); }
  to { opacity: 1; filter: brightness(1.16) saturate(1.18); }
}

@keyframes introButtonOrbit {
  to { transform: rotate(360deg); }
}

@keyframes introButtonDive {
  0% { opacity: 1; transform: translateX(-50%) scale(1); filter: blur(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(14vh) scale(.18); filter: blur(16px); }
}

@keyframes introCanvasPull {
  0% { opacity: 1; filter: blur(0) brightness(1); transform: scale(1); }
  42% { opacity: .98; filter: blur(.5px) brightness(1.05); transform: scale(1.08); }
  76% { opacity: .72; filter: blur(5px) brightness(1.16); transform: scale(1.38); }
  100% { opacity: 0; filter: blur(22px) brightness(1.32); transform: scale(1.86); }
}

@keyframes introVeilGather {
  0% { opacity: 1; background: radial-gradient(circle at 50% 52%, transparent 0 24%, rgba(0,0,0,.08) 47%, rgba(0,0,0,.68) 100%), linear-gradient(180deg, transparent 0 58%, rgba(0,2,8,.54) 100%); }
  56% { opacity: 1; background: radial-gradient(circle at 50% 52%, rgba(0,0,0,.08) 0 18%, rgba(0,0,0,.34) 44%, rgba(0,0,0,.82) 100%), linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,2,8,.72)); }
  100% { opacity: 1; background: radial-gradient(circle at 50% 52%, rgba(0,0,0,.72) 0 16%, rgba(0,0,0,.96) 58%, #000 100%), linear-gradient(180deg, #000, #000); }
}

@keyframes handoffPortalSpin {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes ebookStageVortexOut {
  0% { transform: translateZ(0) scale(1); opacity: 1; }
  48% { transform: translateZ(0) scale(1.08); opacity: .96; }
  100% { transform: translateZ(0) scale(1.34); opacity: .08; }
}

@keyframes ebookStageVortexIn {
  0% { transform: translateZ(0) scale(1.3); opacity: .08; }
  38% { transform: translateZ(0) scale(1.12); opacity: .7; }
  100% { transform: translateZ(0) scale(1); opacity: 1; }
}

@keyframes ebookPullVeilIn {
  0% { opacity: 0; transform: translateZ(0) scale(1.18); }
  44% { opacity: .86; transform: translateZ(0) scale(1.04); }
  100% { opacity: 1; transform: translateZ(0) scale(1); }
}

@keyframes ebookPullVeilOut {
  0% { opacity: 1; transform: translateZ(0) scale(1); }
  42% { opacity: .92; transform: translateZ(0) scale(1.02); }
  100% { opacity: 0; transform: translateZ(0) scale(1.16); }
}

@keyframes ebookPullRing {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes ebookLegalPanelArrive {
  0% { opacity: 0; transform: translate(-54%, -50%) scale(.965); filter: blur(10px) brightness(1.12); }
  58% { opacity: 1; transform: translate(-54%, -50%) scale(1.012); filter: blur(0) brightness(1.06); }
  100% { opacity: 1; transform: translate(-54%, -50%) scale(1); filter: blur(0) brightness(1); }
}

@keyframes mobileLegalPanelArrive {
  0% { opacity: 0; transform: translateY(18px) scale(.975); filter: blur(8px) brightness(1.1); }
  58% { opacity: 1; transform: translateY(-2px) scale(1.006); filter: blur(0) brightness(1.05); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0) brightness(1); }
}

@keyframes cursorRingBreath {
  from { opacity: .54; filter: drop-shadow(0 0 12px rgba(100, 218, 255, .16)); }
  to { opacity: .9; filter: drop-shadow(0 0 24px rgba(127, 226, 255, .28)); }
}

@keyframes cartAbsorbPulse {
  0% { transform: translateY(0) scale(1); box-shadow: 0 0 24px rgba(72, 164, 216, .2), inset 0 1px 0 rgba(255,255,255,.09); }
  24% { transform: translateY(-2px) scale(1.16); box-shadow: 0 0 42px rgba(116, 240, 255, .54), 0 0 96px rgba(140, 95, 255, .28), inset 0 1px 0 rgba(255,255,255,.2); }
  62% { transform: translateY(-1px) scale(.96); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes cartBadgePop {
  0% { transform: scale(.72); filter: brightness(.9); }
  34% { transform: scale(1.34); filter: brightness(1.18); }
  100% { transform: scale(1); filter: brightness(1); }
}

@keyframes introContinueBreath {
  from { opacity: .9; filter: brightness(.94) saturate(1); }
  to { opacity: 1; filter: brightness(1.14) saturate(1.14); }
}

@keyframes introContinueBars {
  from { transform: scaleY(.45); opacity: .62; }
  to { transform: scaleY(1); opacity: 1; }
}

@keyframes introActiveTheorySvgWaveA {
  from { transform: translateX(-4px) scaleY(.76); stroke-dashoffset: -18; opacity: .74; }
  to { transform: translateX(4px) scaleY(1.18); stroke-dashoffset: 20; opacity: 1; }
}

@keyframes introActiveTheorySvgWaveB {
  from { transform: translateX(5px) translateY(1px) scaleY(.62); stroke-dashoffset: 24; opacity: .34; }
  to { transform: translateX(-5px) translateY(-1px) scaleY(1.05); stroke-dashoffset: -16; opacity: .72; }
}

@keyframes introActiveTheorySvgWaveC {
  from { transform: translateX(-6px) translateY(-1px) scaleY(1.08); stroke-dashoffset: -10; opacity: .3; }
  to { transform: translateX(6px) translateY(1px) scaleY(.7); stroke-dashoffset: 22; opacity: .58; }
}

@media (prefers-reduced-motion: reduce) {
  .intro-sound-toggle-wave::before,
  .intro-sound-toggle-wave::after,
  .intro-sound-toggle-wave i,
  .intro-sound-toggle-wave .wave-line,
  .cursor-fx-ring,
  .intro-continue-button,
  .intro-sound-toggle,
  .intro-enter-button,
  .intro-enter-button::before,
  .intro-enter-button::after,
  .intro-handoff-veil,
  .intro-handoff-veil::before,
  .intro-handoff-veil::after,
  .ebook-page-pull-veil,
  .ebook-page-pull-veil i,
  .ebook-page-pull-veil b,
  .ebook-legal-page .ebook-info-panel,
  .mobile-legal-card,
  .topdown-webgl-page.is-route-transition .fixed-webgl-stage,
  .intro-portal.is-exiting .intro-enter-button,
  .intro-portal.is-exiting::after,
  .intro-portal.is-exiting .intro-canvas { animation-duration: 260ms !important; animation-iteration-count: 1 !important; }
  .cursor-fx-trail { display: none; }
  .cursor-fx-ring { opacity: .34; }
}

@media (max-width: 720px) {
  /* Render one continuous stable surface behind Safari's toolbar. The camera
     FOV is compensated in JS from svh to lvh so objects keep their original
     pixel scale even though the canvas itself covers the large viewport. */
  .fixed-webgl-stage {
    height: 100vh;
    min-height: 100vh;
    /* Mobile uses the dedicated aurora layer below; do not stack the much
       brighter desktop atmosphere beneath it. */
    background: #000;
  }
  @supports (height: 100lvh) {
    .fixed-webgl-stage {
      height: 100lvh;
      min-height: 100lvh;
    }
  }
  .topdown-webgl-page.is-info-page {
    min-height: 100svh;
    height: auto;
    overflow: visible;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
  }
  .topdown-webgl-page.is-info-page .fixed-webgl-stage {
    position: relative;
    min-height: 100svh;
    height: auto;
    overflow: visible;
    width: 100%;
    touch-action: pan-y;
  }
  .topdown-webgl-page.is-info-page .scroll-depth {
    display: none;
  }
  .ebook-info-page {
    display: flex;
    flex-direction: column;
    position: relative;
    min-height: 100svh;
    overflow: visible;
    padding: calc(env(safe-area-inset-top, 0px) + 5rem) .82rem calc(env(safe-area-inset-bottom, 0px) + 18svh);
    box-sizing: border-box;
    gap: 1.05rem;
    touch-action: pan-y;
  }
  .ebook-info-page::before {
    opacity: .72;
    filter: blur(18px) saturate(1.05);
  }
  .ebook-info-page::after {
    background:
      linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.2) 26%, rgba(0,0,0,.72) 100%),
      radial-gradient(ellipse at 50% 72%, transparent 0 34%, rgba(0,0,0,.58) 76%, #000 100%);
  }
  .ebook-info-book-stage {
    position: relative;
    inset: auto;
    z-index: 4;
    width: 100%;
    height: 260svh;
    min-height: 1680px;
    margin: 2.8rem auto 0;
    pointer-events: auto;
    touch-action: pan-y;
    background: transparent;
  }
  .ebook-info-page.is-book-flying .ebook-info-book-stage {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100svh;
    min-height: 0;
    margin: 0;
    z-index: 2147483000;
    pointer-events: none;
  }
  .ebook-info-page.is-book-flying .ebook-info-canvas {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    width: 100vw !important;
    height: 100svh !important;
    z-index: 2147483000 !important;
  }
  .ebook-info-page.is-book-flying .ebook-info-book-hit {
    z-index: 2147483001;
  }
  .ebook-info-page.is-book-flying .ebook-info-panel {
    z-index: 3;
  }
  .ebook-info-canvas {
    position: sticky !important;
    top: calc(env(safe-area-inset-top, 0px) + 3.2rem);
    width: 100% !important;
    height: min(82svh, 720px) !important;
    opacity: 1;
  }
  .intro-sound-toggle { right: .78rem; top: .82rem; width: 96px; height: 38px; padding: 0 .78rem; }
  .ebook-info-button { right: calc(.78rem + 96px + .55rem); top: .82rem; width: 42px; height: 38px; }
  .ebook-cart-button { right: calc(.78rem + 96px + .55rem + 42px + .5rem); top: .82rem; width: 42px; height: 38px; }
  .ebook-preview-download-button { right: calc(.78rem + 96px + .55rem + 42px + .5rem + 42px + .5rem); top: .82rem; width: 78px; height: 38px; grid-template-columns: 21px auto; gap: .25rem; padding: 0 .48rem; }
  .ebook-cart-button svg { width: 25px; height: 25px; }
  .ebook-info-button svg { width: 25px; height: 25px; }
  .ebook-preview-download-button svg { width: 22px; height: 22px; }
  .ebook-preview-download-button span { font-size: .5rem; letter-spacing: .045em; }
  .ebook-info-book-hit { position: fixed; border-radius: 1rem; z-index: 8; touch-action: pan-y; }
  .ebook-info-panel {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: min(100%, 560px);
    margin: 0 auto;
    padding: clamp(1rem, 4.4vw, 1.32rem);
    border-radius: 1.1rem;
    background:
      linear-gradient(180deg, rgba(8, 10, 14, .985), rgba(0, 0, 0, .955)),
      radial-gradient(circle at 14% 0%, rgba(119, 248, 255, .14), transparent 36%);
    box-shadow: 0 26px 86px rgba(0,0,0,.78), 0 0 70px rgba(97,207,194,.14), inset 0 1px 0 rgba(255,255,255,.08);
    pointer-events: auto;
  }
  .ebook-info-kicker { margin-bottom: .55rem; font-size: .58rem; letter-spacing: .14em; }
  .ebook-info-panel h1 {
    font-size: clamp(2.28rem, 13.2vw, 3.38rem);
    line-height: .88;
    letter-spacing: -.08em;
    white-space: normal;
  }
  .ebook-info-subtitle { font-size: .72rem; letter-spacing: .12em; }
  .ebook-info-lead { font-size: .92rem; line-height: 1.5; max-width: 100%; }
  .ebook-info-grid { grid-template-columns: 1fr; gap: .52rem; margin-top: .92rem; }
  .ebook-info-grid div { min-height: auto; padding: .74rem .78rem; border-radius: .85rem; }
  .ebook-info-grid span { margin-bottom: .22rem; font-size: .6rem; letter-spacing: .12em; }
  .ebook-info-grid strong { font-size: .84rem; line-height: 1.32; }
  .ebook-info-note { font-size: .72rem; }
  .intro-sound-toggle-wave { width: 58px; }
  .intro-continue-button { min-width: 236px; padding: .82rem .92rem .82rem .9rem; gap: .72rem; }
  .intro-continue-orb { width: 2.55rem; }
  .intro-continue-copy strong { font-size: .98rem; }
  .intro-continue-copy small { font-size: .52rem; }
  .intro-continue-button > i { width: 2rem; }
  .intro-enter-button { width: clamp(86px, 23vw, 116px); bottom: 7vh; }
}

.topdown-webgl-page.is-cart-checkout-pull .fixed-webgl-stage {
  transform-origin: calc(100% - clamp(4rem, 11vw, 9rem)) clamp(2.2rem, 5vw, 4.5rem);
  animation: cartCheckoutWorldPull 820ms cubic-bezier(.77,0,.175,1) both;
  will-change: transform, opacity, filter;
}

.ebook-cart-button {
  text-decoration: none;
}

.ebook-cart-button.is-checkout-pull {
  pointer-events: none;
  animation: cartCheckoutButtonPull 820ms cubic-bezier(.77,0,.175,1) both;
  z-index: 96;
}

.ebook-cart-button.is-checkout-pull span {
  animation: cartCheckoutBadgePull 720ms cubic-bezier(.19,1,.22,1) both;
}

.ebook-cart-checkout-veil {
  position: fixed;
  inset: 0;
  z-index: 95;
  pointer-events: none;
  overflow: hidden;
  opacity: 0;
  transform: translateZ(0);
  animation: cartCheckoutVeilIn 820ms cubic-bezier(.77,0,.175,1) both;
  background:
    radial-gradient(circle at calc(100% - clamp(5.2rem, 12vw, 10rem)) clamp(2.7rem, 5.8vw, 5.1rem), rgba(126,248,255,.36) 0 3.2rem, rgba(143,112,210,.22) 9rem, rgba(0,0,0,.84) 42rem, #000 100%),
    linear-gradient(135deg, rgba(0,0,0,.12), rgba(0,0,0,.94));
}

.ebook-cart-checkout-veil i,
.ebook-cart-checkout-veil b {
  position: absolute;
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem) - min(34vmin, 330px));
  top: calc(clamp(1rem, 3.6vw, 3rem) - min(34vmin, 330px) + clamp(19px, 1.55vw, 23px));
  width: min(68vmin, 660px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(203, 249, 255, .36);
  box-shadow: 0 0 110px rgba(111, 231, 255, .32), inset 0 0 88px rgba(151, 105, 255, .24);
  animation: cartCheckoutRingSpin 520ms linear infinite, cartCheckoutRingCollapse 820ms cubic-bezier(.77,0,.175,1) both;
}

.ebook-cart-checkout-veil b {
  width: min(38vmin, 390px);
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem) - min(19vmin, 195px));
  top: calc(clamp(1rem, 3.6vw, 3rem) - min(19vmin, 195px) + clamp(19px, 1.55vw, 23px));
  border-color: rgba(186, 142, 255, .34);
  animation-duration: 380ms, 820ms;
  animation-direction: reverse, normal;
}

.ebook-cart-checkout-veil strong {
  position: fixed;
  right: calc(clamp(1rem, 3.6vw, 3rem) + clamp(102px, 8.6vw, 136px) + clamp(.68rem, 1.1vw, 1rem) + clamp(46px, 3.8vw, 54px) + clamp(.56rem, .86vw, .86rem) + .24rem);
  top: calc(clamp(1rem, 3.6vw, 3rem) + clamp(42px, 3.5vw, 54px));
  color: rgba(242, 255, 255, .96);
  font-size: clamp(.82rem, 1.7vw, 1.2rem);
  font-weight: 950;
  letter-spacing: .08em;
  text-shadow: 0 0 24px rgba(126,248,255,.62), 0 0 54px rgba(143,112,210,.42);
  animation: cartCheckoutQuantityPop 720ms cubic-bezier(.19,1,.22,1) both;
}

@keyframes cartCheckoutWorldPull {
  0% { opacity: 1; filter: blur(0) brightness(1); transform: translateZ(0) scale(1); }
  38% { opacity: .98; filter: blur(.4px) brightness(1.08) saturate(1.08); transform: translate3d(1.6vw, -1vh, 0) scale(1.04) rotate(.45deg); }
  74% { opacity: .58; filter: blur(5px) brightness(1.2) saturate(1.2); transform: translate3d(22vw, -12vh, 0) scale(.52) rotate(7deg); }
  100% { opacity: .08; filter: blur(18px) brightness(1.28) saturate(1.24); transform: translate3d(46vw, -25vh, 0) scale(.08) rotate(18deg); }
}

@keyframes cartCheckoutButtonPull {
  0% { transform: translateY(0) scale(1); filter: brightness(1); }
  18% { transform: translateY(-3px) scale(1.18); filter: brightness(1.28) saturate(1.25); }
  62% { transform: translateY(0) scale(.68) rotate(-8deg); filter: brightness(1.52) saturate(1.4); }
  100% { transform: translateY(0) scale(.08) rotate(-22deg); filter: blur(10px) brightness(1.8); opacity: .16; }
}

@keyframes cartCheckoutBadgePull {
  0% { transform: scale(1); }
  28% { transform: scale(1.42); }
  100% { transform: scale(.1); opacity: .2; }
}

@keyframes cartCheckoutVeilIn {
  0% { opacity: 0; filter: blur(0); }
  22% { opacity: .72; }
  100% { opacity: 1; filter: blur(.2px); }
}

@keyframes cartCheckoutRingSpin {
  to { transform: rotate(360deg); }
}

@keyframes cartCheckoutRingCollapse {
  0% { opacity: 0; transform: scale(1.24) rotate(0deg); }
  22% { opacity: 1; transform: scale(1) rotate(50deg); }
  100% { opacity: .12; transform: scale(.05) rotate(220deg); }
}

@keyframes cartCheckoutQuantityPop {
  0% { opacity: 0; transform: translateY(8px) scale(.72); }
  22% { opacity: 1; transform: translateY(0) scale(1.22); }
  100% { opacity: 0; transform: translateY(-18px) scale(.5); }
}

@media (prefers-reduced-motion: reduce) {
  .topdown-webgl-page.is-cart-checkout-pull .fixed-webgl-stage,
  .ebook-cart-button.is-checkout-pull,
  .ebook-cart-button.is-checkout-pull span,
  .ebook-cart-checkout-veil,
  .ebook-cart-checkout-veil i,
  .ebook-cart-checkout-veil b,
  .ebook-cart-checkout-veil strong {
    animation-duration: 160ms !important;
    transition-duration: 160ms !important;
  }
}

@media (max-width: 767px) {
  /* Touch devices do not have a mouse cursor. Removing this layer also stops
     its blurred trail/ring animations from consuming mobile compositor time. */
  .cursor-fx-layer { display: none !important; }

  /* Experimental sphere-free mobile atmosphere: three fixed, raster-once
     gradient lights move only through compositor transforms as scroll changes. */
  .fixed-webgl-stage::before,
  .fixed-webgl-stage::after,
  .fixed-webgl-stage .color-reflection { display: none; }

  .mobile-scroll-aurora {
    --ambient-a: 77, 224, 218;
    --ambient-a-deep: 31, 123, 145;
    --ambient-b: 147, 113, 239;
    --ambient-b-deep: 80, 53, 156;
    --ambient-c: 224, 170, 112;
    position: absolute;
    inset: 0;
    /* Keep all atmosphere behind the WebGL canvas so it cannot wash over
       product images, controls or 3D geometry. */
    z-index: 0;
    display: block;
    overflow: hidden;
    pointer-events: none;
    contain: strict;
    isolation: isolate;
    background:
      radial-gradient(circle at 50% 8%, rgba(222, 248, 255, .045), transparent 28%),
      radial-gradient(ellipse at 12% 72%, rgba(var(--ambient-a), .055), transparent 52%),
      radial-gradient(ellipse at 88% 28%, rgba(var(--ambient-b), .05), transparent 50%),
      linear-gradient(135deg, rgba(var(--ambient-a-deep), .045), transparent 38%, rgba(var(--ambient-b-deep), .04));
  }

  .mobile-scroll-aurora-training {
    --ambient-a: 77, 224, 218;
    --ambient-a-deep: 31, 123, 145;
    --ambient-b: 147, 113, 239;
    --ambient-b-deep: 80, 53, 156;
    --ambient-c: 224, 170, 112;
  }

  .mobile-scroll-aurora-business {
    --ambient-a: 91, 166, 255;
    --ambient-a-deep: 32, 91, 181;
    --ambient-b: 89, 226, 235;
    --ambient-b-deep: 35, 119, 145;
    --ambient-c: 175, 135, 246;
  }

  .mobile-scroll-aurora-dropshipping {
    --ambient-a: 166, 91, 255;
    --ambient-a-deep: 82, 36, 168;
    --ambient-b: 81, 221, 255;
    --ambient-b-deep: 20, 111, 156;
    --ambient-c: 201, 139, 255;
  }

  .mobile-scroll-aurora-intrapreneur {
    --ambient-a: 108, 231, 204;
    --ambient-a-deep: 31, 125, 111;
    --ambient-b: 165, 116, 224;
    --ambient-b-deep: 85, 52, 143;
    --ambient-c: 212, 162, 106;
  }

  .mobile-scroll-aurora::before {
    content: "";
    position: absolute;
    inset: -12% -20%;
    opacity: .07;
    background:
      linear-gradient(rgba(210, 244, 255, .2) 1px, transparent 1px),
      linear-gradient(90deg, rgba(210, 244, 255, .16) 1px, transparent 1px);
    background-size: 54px 54px;
    -webkit-mask-image: radial-gradient(ellipse at 50% 46%, #000 0%, transparent 67%);
    mask-image: radial-gradient(ellipse at 50% 46%, #000 0%, transparent 67%);
    transform: translate3d(0, var(--ambient-grid-y, 0), 0) perspective(520px) rotateX(58deg) scale(1.28);
    transform-origin: 50% 72%;
    will-change: transform;
    transition: transform 90ms linear;
  }

  .mobile-scroll-aurora::after {
    content: "";
    position: absolute;
    left: 4vw;
    top: 19vh;
    width: 92vw;
    height: 58vh;
    border-radius: 50%;
    opacity: .14;
    background: conic-gradient(from var(--ambient-phase, -48deg), transparent 0 12%, rgba(var(--ambient-a), .2) 19%, transparent 27% 52%, rgba(var(--ambient-b), .18) 61%, transparent 70% 100%);
    -webkit-mask-image: radial-gradient(ellipse, transparent 53%, #000 55% 58%, transparent 61%);
    mask-image: radial-gradient(ellipse, transparent 53%, #000 55% 58%, transparent 61%);
    transform: translate3d(0, var(--ambient-y-inverse, 9vh), 0);
    will-change: transform;
    transition: transform 90ms linear;
  }

  .mobile-scroll-aurora > * {
    position: absolute;
    display: block;
    width: 88vmax;
    height: 88vmax;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform, opacity;
    transition: transform 90ms linear, opacity 120ms linear;
    mix-blend-mode: screen;
  }

  .mobile-scroll-aurora > i {
    left: -44vmax;
    top: -24vmax;
    opacity: var(--ambient-pulse, .42);
    background:
      radial-gradient(circle at 48% 48%, rgba(239, 255, 255, .1) 0 2%, transparent 9%),
      radial-gradient(circle, rgba(var(--ambient-a), .18) 0%, rgba(var(--ambient-a-deep), .08) 31%, transparent 67%);
    transform: translate3d(var(--ambient-a-x, -15vw), var(--ambient-y, -9vh), 0);
  }

  .mobile-scroll-aurora > b {
    right: -46vmax;
    bottom: -30vmax;
    opacity: .44;
    background:
      radial-gradient(circle at 48% 49%, rgba(244, 238, 255, .08) 0 2%, transparent 10%),
      radial-gradient(circle, rgba(var(--ambient-b), .17) 0%, rgba(var(--ambient-b-deep), .08) 31%, transparent 68%);
    transform: translate3d(var(--ambient-b-x, 15vw), var(--ambient-y-inverse, 9vh), 0);
  }

  .mobile-scroll-aurora > span {
    left: 7vw;
    top: 27vh;
    width: 86vw;
    height: 46vh;
    border-radius: 50%;
    opacity: .4;
    background:
      radial-gradient(ellipse, rgba(var(--ambient-c), .12) 0%, rgba(var(--ambient-a), .05) 34%, transparent 70%),
      linear-gradient(105deg, transparent 22%, rgba(236, 252, 255, .06) 50%, transparent 77%);
    transform: translate3d(0, var(--ambient-y, -9vh), 0) scaleX(1.28) rotate(var(--ambient-phase, -48deg));
  }

  body:has(.intro-portal:not(.is-exiting)) {
    background: #000 !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff),
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-portal {
    background: #000 !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .fixed-webgl-stage,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-portal::before,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-portal::after,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-portal > :not(.intro-continue-button):not(.intro-consent-panel) {
    display: none !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-button {
    top: 50%;
    min-width: min(74vw, 320px);
    grid-template-columns: 1fr;
    justify-items: center;
    padding: 1.05rem 1.35rem;
    border: 1px solid rgba(255,255,255,.34);
    box-shadow: 0 18px 48px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    animation: none;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-button::before,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-button::after,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-orb,
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-button > i {
    display: none !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-copy {
    align-items: center;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-continue-copy strong {
    font-size: clamp(1rem, 4.8vw, 1.22rem);
    letter-spacing: .14em;
    text-shadow: none;
  }
}

/* Preview: integrated marketing consent on the existing Continue screen */
.intro-consent-panel {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 7;
  width: min(calc(100vw - 2rem), 520px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: .72rem;
  transform: translate(-50%, -50%);
  text-align: center;
}

.intro-consent-panel .intro-continue-button {
  position: relative;
  left: auto;
  top: auto;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  transform: translateZ(0);
}

.intro-consent-panel .intro-continue-button:hover {
  transform: translateY(-4px) scale(1.018);
}

.intro-consent-panel .intro-continue-button:active {
  transform: translateY(-1px) scale(.992);
}

.intro-consent-panel .intro-continue-copy strong {
  font-size: clamp(.9rem, 1.18vw, 1.08rem);
  line-height: 1.18;
  letter-spacing: .045em;
  text-align: left;
  text-transform: none;
}

.intro-consent-panel .intro-consent-accept[aria-pressed="true"] {
  border-color: rgba(183, 255, 239, .88);
  box-shadow:
    0 0 0 1px rgba(178,255,237,.12),
    0 24px 82px rgba(0, 6, 22, .5),
    0 0 86px rgba(95, 235, 219, .38),
    0 0 148px rgba(123, 81, 255, .22),
    inset 0 1px 0 rgba(255,255,255,.4);
}

.intro-consent-decline {
  width: calc(100% - 2.6rem);
  min-height: 48px;
  align-self: center;
  display: grid;
  place-items: center;
  padding: .76rem 1.1rem;
  border: 1px solid rgba(182, 218, 238, .38);
  border-radius: 999px;
  color: rgba(236, 248, 255, .92);
  background:
    linear-gradient(135deg, rgba(255,255,255,.055), rgba(97,137,187,.055) 48%, rgba(113,81,190,.07)),
    rgba(2, 8, 20, .56);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 34px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font: inherit;
  font-size: .82rem;
  font-weight: 820;
  letter-spacing: .035em;
  cursor: pointer;
  transition: transform 220ms cubic-bezier(.19,1,.22,1), border-color 220ms ease, background 220ms ease, color 220ms ease, box-shadow 220ms ease;
}

.intro-consent-decline:hover {
  transform: translateY(-2px);
  border-color: rgba(210, 239, 255, .7);
  color: #fff;
  background:
    linear-gradient(135deg, rgba(255,255,255,.09), rgba(97,137,187,.08) 48%, rgba(113,81,190,.12)),
    rgba(3, 10, 24, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 16px 42px rgba(0,0,0,.36);
}

.intro-consent-decline[aria-pressed="true"] {
  border-color: rgba(181, 224, 247, .72);
  background:
    linear-gradient(135deg, rgba(137,210,244,.11), rgba(104,93,196,.12)),
    rgba(3, 10, 24, .78);
}

.intro-consent-decline:active { transform: translateY(0) scale(.99); }

.intro-consent-note {
  max-width: 470px;
  margin: .14rem auto 0;
  color: rgba(222, 239, 248, .76);
  font-size: .71rem;
  font-weight: 580;
  line-height: 1.55;
  letter-spacing: .012em;
  text-wrap: balance;
  text-shadow: 0 1px 3px rgba(0,0,0,.98), 0 0 18px rgba(0,0,0,.92);
}

.intro-consent-settings-link,
.marketing-settings-launch,
.marketing-settings-reset {
  appearance: none;
  border: 0;
  padding: 0;
  color: rgba(193, 224, 242, .76);
  background: transparent;
  font: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: rgba(143, 208, 235, .36);
  text-underline-offset: .24em;
  transition: color 180ms ease, text-decoration-color 180ms ease, opacity 180ms ease;
}

.intro-consent-settings-link {
  width: max-content;
  max-width: 100%;
  align-self: center;
  margin-top: -.1rem;
  font-size: .68rem;
  font-weight: 720;
  letter-spacing: .025em;
  text-shadow: 0 1px 3px rgba(0,0,0,.98), 0 0 16px rgba(0,0,0,.9);
}

.intro-consent-settings-link:hover,
.marketing-settings-launch:hover,
.marketing-settings-reset:hover {
  color: #f2fcff;
  text-decoration-color: rgba(165, 230, 255, .9);
}

.intro-consent-decline:focus-visible,
.intro-consent-settings-link:focus-visible,
.marketing-settings-launch:focus-visible,
.marketing-settings-close:focus-visible,
.marketing-settings-choice:focus-visible,
.marketing-settings-reset:focus-visible {
  outline: 2px solid rgba(166, 232, 255, .82);
  outline-offset: 5px;
}

.intro-portal.is-exiting .intro-consent-panel {
  animation: introContentIntoDepth 1180ms cubic-bezier(.77,0,.175,1) forwards;
}

.marketing-settings-launch {
  position: fixed;
  left: clamp(.9rem, 2.4vw, 2rem);
  bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(.78rem, 2vw, 1.6rem));
  z-index: 88;
  padding: .42rem .18rem;
  color: rgba(194, 219, 233, .58);
  font-size: .62rem;
  font-weight: 690;
  letter-spacing: .035em;
}

.marketing-settings-layer {
  position: fixed;
  inset: 0;
  z-index: 2147483200;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 4vw, 2.5rem);
  background:
    radial-gradient(circle at 50% 42%, rgba(73, 133, 184, .12), transparent 36rem),
    rgba(0, 2, 8, .76);
  backdrop-filter: blur(18px) saturate(.82);
  -webkit-backdrop-filter: blur(18px) saturate(.82);
  animation: marketingSettingsFadeIn 220ms ease both;
}

.marketing-settings-layer * { box-sizing: border-box; }

.marketing-settings-dialog {
  position: relative;
  width: min(100%, 470px);
  overflow: hidden;
  padding: clamp(1.35rem, 4vw, 2rem);
  border: 1px solid rgba(158, 215, 241, .24);
  border-radius: 26px;
  color: #f4fbff;
  background:
    radial-gradient(circle at 14% 0%, rgba(119, 230, 255, .14), transparent 42%),
    radial-gradient(circle at 92% 110%, rgba(138, 94, 232, .17), transparent 48%),
    linear-gradient(155deg, rgba(7, 17, 32, .98), rgba(2, 6, 14, .985));
  box-shadow: 0 34px 120px rgba(0,0,0,.72), 0 0 80px rgba(66, 160, 210, .14), inset 0 1px 0 rgba(255,255,255,.07);
  animation: marketingSettingsRise 300ms cubic-bezier(.19,1,.22,1) both;
}

.marketing-settings-close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(181, 221, 240, .2);
  border-radius: 999px;
  color: rgba(234, 248, 255, .8);
  background: rgba(255,255,255,.035);
  font: inherit;
  font-size: 1.22rem;
  line-height: 1;
  cursor: pointer;
}

.marketing-settings-kicker {
  display: block;
  margin: 0 0 .55rem;
  color: rgba(136, 226, 241, .72);
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.marketing-settings-dialog h2 {
  margin: 0 2.5rem .75rem 0;
  color: #f5fcff;
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  line-height: 1;
  letter-spacing: -.04em;
}

.marketing-settings-dialog > p {
  margin: 0;
  color: rgba(205, 225, 238, .68);
  font-size: .82rem;
  line-height: 1.55;
}

.marketing-settings-status {
  width: max-content;
  max-width: 100%;
  margin: 1rem 0;
  padding: .42rem .7rem;
  border: 1px solid rgba(174, 214, 235, .2);
  border-radius: 999px;
  color: rgba(214, 232, 242, .78);
  background: rgba(255,255,255,.035);
  font-size: .65rem;
  font-weight: 760;
  letter-spacing: .045em;
}

.marketing-settings-status.is-granted {
  border-color: rgba(129, 239, 211, .34);
  color: rgba(185, 255, 235, .9);
  background: rgba(67, 197, 165, .08);
}

.marketing-settings-status.is-denied {
  border-color: rgba(162, 204, 228, .3);
  color: rgba(213, 235, 247, .86);
}

.marketing-settings-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .66rem;
  margin-top: .35rem;
}

.marketing-settings-choice {
  min-height: 48px;
  padding: .72rem .8rem;
  border: 1px solid rgba(174, 215, 237, .28);
  border-radius: 15px;
  color: rgba(235, 247, 253, .9);
  background: rgba(255,255,255,.035);
  font: inherit;
  font-size: .74rem;
  font-weight: 820;
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.marketing-settings-choice.is-accept {
  border-color: rgba(139, 235, 230, .4);
  color: #f6ffff;
  background: linear-gradient(135deg, rgba(81, 211, 206, .19), rgba(117, 91, 218, .18));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.marketing-settings-choice:hover { transform: translateY(-2px); border-color: rgba(205, 238, 252, .58); }
.marketing-settings-choice.is-selected { border-color: rgba(187, 255, 240, .84); box-shadow: 0 0 30px rgba(84, 218, 207, .17), inset 0 1px 0 rgba(255,255,255,.1); }
.marketing-settings-reset { display: block; margin: 1rem auto 0; font-size: .64rem; }

@keyframes marketingSettingsFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes marketingSettingsRise { from { opacity: 0; transform: translateY(14px) scale(.975); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (prefers-reduced-motion: reduce) {
  .intro-consent-panel { animation-duration: 1ms !important; }
  .marketing-settings-layer,
  .marketing-settings-dialog {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (max-width: 720px) {
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel {
    top: 50%;
    width: min(calc(100vw - 1.2rem), 390px);
    max-height: calc(100svh - 1.4rem);
    display: flex !important;
    gap: .62rem;
    overflow-y: auto;
    padding: .22rem .08rem;
    scrollbar-width: none;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel::-webkit-scrollbar { display: none; }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-button {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    min-width: 0;
    padding: 1rem 1.1rem;
    transform: none;
    box-shadow: 0 18px 48px rgba(0,0,0,.58), 0 0 52px rgba(83, 192, 231, .16), inset 0 1px 0 rgba(255,255,255,.1);
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-button:hover {
    transform: translateY(-2px) scale(1.01);
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-button:active {
    transform: scale(.99);
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-copy strong {
    font-size: clamp(.86rem, 4vw, 1rem);
    line-height: 1.24;
    letter-spacing: .035em;
    text-align: center;
    text-transform: none;
  }

  .intro-consent-decline {
    width: 100%;
    min-height: 46px;
    font-size: .76rem;
  }

  .intro-consent-note {
    max-width: 34rem;
    padding: 0 .45rem;
    font-size: .64rem;
    line-height: 1.48;
  }

  .intro-consent-settings-link { font-size: .63rem; }
  .marketing-settings-launch { left: .82rem; bottom: calc(env(safe-area-inset-bottom, 0px) + .58rem); font-size: .56rem; }
  .marketing-settings-layer { padding: .78rem; }
  .marketing-settings-dialog { max-height: calc(100svh - 1.56rem); overflow-y: auto; padding: 1.28rem; border-radius: 22px; }
  .marketing-settings-actions { grid-template-columns: 1fr; }
}

/* Clarity revision: short, familiar cookie language and restrained controls */
.intro-consent-panel {
  width: min(calc(100vw - 2rem), 440px);
  gap: .56rem;
}

@media (min-width: 768px) {
  .intro-consent-panel {
    width: min(calc(100vw - 2rem), 478px);
    padding: 1.18rem;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(133, 165, 207, .22);
    border-radius: 24px;
    background:
      radial-gradient(circle at 18% 0%, rgba(54, 111, 176, .11), transparent 38%),
      radial-gradient(circle at 90% 100%, rgba(93, 72, 171, .09), transparent 40%),
      rgba(1, 4, 9, .93);
    box-shadow:
      0 32px 90px rgba(0, 0, 0, .64),
      0 0 0 1px rgba(0, 0, 0, .34),
      inset 0 1px 0 rgba(255, 255, 255, .045);
    backdrop-filter: blur(26px) saturate(1.08);
    -webkit-backdrop-filter: blur(26px) saturate(1.08);
  }
}

.intro-consent-panel .intro-continue-button {
  min-height: 60px;
  display: flex !important;
  grid-template-columns: 1fr !important;
  align-items: center;
  justify-content: center;
  padding: .9rem 1.35rem;
  border: 1px solid rgba(62, 81, 137, .56) !important;
  border-radius: 15px !important;
  background-image:
    radial-gradient(ellipse 19% 500% at 28% 50%,
      rgba(42, 23, 88, .99) 0%,
      rgba(41, 22, 86, .98) 15%,
      rgba(38, 20, 80, .94) 30%,
      rgba(33, 18, 70, .86) 45%,
      rgba(25, 14, 54, .72) 60%,
      rgba(15, 8, 34, .52) 75%,
      rgba(7, 4, 17, .28) 88%,
      rgba(0, 0, 0, 0) 100%),
    radial-gradient(ellipse 19% 500% at 72% 50%,
      rgba(8, 23, 53, .99) 0%,
      rgba(8, 22, 51, .98) 15%,
      rgba(7, 20, 47, .94) 30%,
      rgba(6, 17, 40, .86) 45%,
      rgba(5, 13, 31, .72) 60%,
      rgba(3, 8, 20, .52) 75%,
      rgba(1, 4, 10, .28) 88%,
      rgba(0, 0, 0, 0) 100%),
    linear-gradient(90deg, #010307 0%, #000000 48%, #000000 56%, #020307 100%) !important;
  background-size: 260% 100% !important;
  background-repeat: no-repeat !important;
  background-position: 0% 50%;
  box-shadow:
    0 17px 40px rgba(0, 6, 19, .45),
    0 9px 30px rgba(10, 28, 64, .16),
    0 12px 34px rgba(44, 26, 90, .11),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(0,0,0,.2) !important;
  animation: tmConsentGradientDrift 14s cubic-bezier(.45, 0, .55, 1) infinite alternate !important;
  will-change: background-position;
}

.intro-consent-panel .intro-continue-button::before,
.intro-consent-panel .intro-continue-button::after,
.intro-consent-panel .intro-continue-orb,
.intro-consent-panel .intro-continue-button > i {
  display: none !important;
}

.intro-consent-panel .intro-continue-button:hover {
  border-color: rgba(82, 102, 166, .72) !important;
  box-shadow:
    0 20px 45px rgba(0, 6, 19, .48),
    0 10px 34px rgba(10, 28, 64, .22),
    0 13px 38px rgba(44, 26, 90, .13),
    inset 0 1px 0 rgba(255,255,255,.19) !important;
  filter: brightness(1.04) saturate(1.02);
  transform: translateY(-2px);
}

.intro-consent-panel .intro-continue-button:active {
  transform: translateY(0);
}

.intro-consent-panel .intro-continue-copy {
  display: block;
  width: 100%;
}

.intro-consent-panel .intro-continue-copy strong {
  display: block;
  color: #f6fbff;
  font-size: 1rem;
  font-weight: 760;
  line-height: 1.2;
  letter-spacing: .018em;
  text-align: center;
  text-transform: none;
  text-shadow: none;
}

.intro-consent-panel .intro-consent-accept[aria-pressed="true"] {
  border-color: rgba(190, 221, 255, .94) !important;
  box-shadow: 0 0 0 2px rgba(136,190,247,.12), 0 17px 40px rgba(0,4,14,.46), 0 8px 30px rgba(46,105,177,.22) !important;
}

.intro-consent-decline {
  width: 100%;
  min-height: 54px;
  padding: .82rem 1.2rem;
  border: 1px solid rgba(56, 70, 118, .44);
  border-radius: 15px;
  background-image:
    radial-gradient(ellipse 19% 500% at 28% 50%,
      rgba(25, 14, 53, .98) 0%,
      rgba(24, 13, 51, .97) 15%,
      rgba(22, 12, 47, .93) 30%,
      rgba(19, 10, 41, .84) 45%,
      rgba(14, 8, 31, .69) 60%,
      rgba(9, 5, 20, .49) 75%,
      rgba(4, 2, 10, .26) 88%,
      rgba(0, 0, 0, 0) 100%),
    radial-gradient(ellipse 19% 500% at 72% 50%,
      rgba(4, 16, 39, .98) 0%,
      rgba(4, 15, 38, .97) 15%,
      rgba(4, 14, 35, .93) 30%,
      rgba(3, 12, 30, .84) 45%,
      rgba(2, 9, 23, .69) 60%,
      rgba(1, 6, 15, .49) 75%,
      rgba(1, 3, 8, .26) 88%,
      rgba(0, 0, 0, 0) 100%),
    linear-gradient(90deg, #010204 0%, #000000 49%, #000000 56%, #010204 100%);
  background-size: 280% 100%;
  background-repeat: no-repeat;
  background-position: 100% 50%;
  color: rgba(241, 247, 252, .94);
  box-shadow:
    0 13px 30px rgba(0, 0, 0, .28),
    0 8px 26px rgba(10, 28, 64, .09),
    inset 0 1px 0 rgba(255,255,255,.065),
    inset 0 -1px 0 rgba(0,0,0,.3);
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .01em;
  text-transform: none;
  transition: transform 220ms cubic-bezier(.19,1,.22,1), border-color 220ms ease, color 220ms ease, box-shadow 220ms ease, filter 220ms ease;
  animation: tmConsentGradientDrift 16s cubic-bezier(.45, 0, .55, 1) infinite alternate-reverse;
  will-change: background-position;
}

.intro-consent-decline:hover,
.intro-consent-decline:focus-visible,
.intro-consent-decline:active,
.intro-consent-decline[aria-pressed="true"] {
  background-image:
    radial-gradient(ellipse 19% 500% at 28% 50%,
      rgba(42, 23, 88, .99) 0%,
      rgba(41, 22, 86, .98) 15%,
      rgba(38, 20, 80, .94) 30%,
      rgba(33, 18, 70, .86) 45%,
      rgba(25, 14, 54, .72) 60%,
      rgba(15, 8, 34, .52) 75%,
      rgba(7, 4, 17, .28) 88%,
      rgba(0, 0, 0, 0) 100%),
    radial-gradient(ellipse 19% 500% at 72% 50%,
      rgba(8, 23, 53, .99) 0%,
      rgba(8, 22, 51, .98) 15%,
      rgba(7, 20, 47, .94) 30%,
      rgba(6, 17, 40, .86) 45%,
      rgba(5, 13, 31, .72) 60%,
      rgba(3, 8, 20, .52) 75%,
      rgba(1, 4, 10, .28) 88%,
      rgba(0, 0, 0, 0) 100%),
    linear-gradient(90deg, #010307 0%, #000000 48%, #000000 56%, #020307 100%) !important;
  background-color: #010307 !important;
  background-size: 260% 100% !important;
  background-repeat: no-repeat !important;
}

.intro-consent-decline:hover {
  border-color: rgba(82, 102, 166, .72) !important;
  color: #fff;
  box-shadow:
    0 20px 45px rgba(0, 6, 19, .48),
    0 10px 34px rgba(10, 28, 64, .22),
    0 13px 38px rgba(44, 26, 90, .13),
    inset 0 1px 0 rgba(255,255,255,.19) !important;
  filter: brightness(1.04) saturate(1.02);
  transform: translateY(-2px);
}

.intro-consent-decline[aria-pressed="true"] {
  border-color: rgba(190, 221, 255, .94) !important;
  box-shadow: 0 0 0 2px rgba(136,190,247,.12), 0 17px 40px rgba(0,4,14,.46), 0 8px 30px rgba(46,105,177,.22) !important;
}

.intro-consent-decline:active {
  transform: translateY(0);
}

@keyframes tmConsentGradientDrift {
  0% { background-position: 0% 50%; }
  46% { background-position: 48% 50%; }
  100% { background-position: 100% 50%; }
}

.intro-consent-note {
  max-width: 420px;
  margin: .28rem auto 0;
  color: rgba(224, 235, 245, .75);
  font-size: .69rem;
  font-weight: 540;
  line-height: 1.48;
  letter-spacing: .006em;
}

.intro-consent-settings-link {
  margin-top: -.05rem;
  color: rgba(211, 226, 240, .78);
  font-size: .67rem;
  font-weight: 650;
  letter-spacing: .01em;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.marketing-settings-choice.is-accept {
  border-color: rgba(111, 151, 204, .68);
  background: linear-gradient(180deg, rgba(27, 59, 99, .96), rgba(17, 39, 68, .96));
  box-shadow: none;
}

.marketing-settings-choice {
  border-radius: 11px;
  font-size: .76rem;
  letter-spacing: .008em;
  text-transform: none;
}

@media (max-width: 720px) {
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel {
    width: min(calc(100vw - 1.6rem), 360px);
    gap: .5rem;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-button {
    min-height: 54px;
    display: flex !important;
    padding: .82rem 1rem;
    border-radius: 14px !important;
    background-image:
      radial-gradient(ellipse 19% 500% at 28% 50%,
        rgba(42, 23, 88, .99) 0%,
        rgba(41, 22, 86, .98) 15%,
        rgba(38, 20, 80, .94) 30%,
        rgba(33, 18, 70, .86) 45%,
        rgba(25, 14, 54, .72) 60%,
        rgba(15, 8, 34, .52) 75%,
        rgba(7, 4, 17, .28) 88%,
        rgba(0, 0, 0, 0) 100%),
      radial-gradient(ellipse 19% 500% at 72% 50%,
        rgba(8, 23, 53, .99) 0%,
        rgba(8, 22, 51, .98) 15%,
        rgba(7, 20, 47, .94) 30%,
        rgba(6, 17, 40, .86) 45%,
        rgba(5, 13, 31, .72) 60%,
        rgba(3, 8, 20, .52) 75%,
        rgba(1, 4, 10, .28) 88%,
        rgba(0, 0, 0, 0) 100%),
      linear-gradient(90deg, #010307 0%, #000000 48%, #000000 56%, #020307 100%) !important;
    background-size: 260% 100% !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.45), 0 7px 25px rgba(10,28,64,.15), 0 9px 28px rgba(44,26,90,.09), inset 0 1px 0 rgba(255,255,255,.14) !important;
    animation-duration: 13s !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-continue-copy strong {
    font-size: .94rem;
    letter-spacing: .012em;
  }

  .intro-consent-decline {
    min-height: 50px;
    border-radius: 14px;
    font-size: .8rem;
    animation-duration: 15s;
    animation-direction: alternate-reverse;
  }

  .intro-consent-decline[aria-pressed="true"] {
    box-shadow: 0 14px 34px rgba(0,0,0,.45), 0 7px 25px rgba(10,28,64,.15), 0 9px 28px rgba(44,26,90,.09), inset 0 1px 0 rgba(255,255,255,.14) !important;
  }

  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-consent-accept[aria-pressed="true"],
  .topdown-webgl-page.intro-locked:not(.intro-entering):not(.intro-handoff) .intro-consent-panel .intro-consent-decline[aria-pressed="true"] {
    border-color: rgba(62, 81, 137, .56) !important;
  }

  .intro-consent-note {
    max-width: 330px;
    padding: .05rem .45rem 0;
    font-size: .63rem;
    line-height: 1.45;
  }

  .intro-consent-settings-link { font-size: .62rem; }
}

@media (prefers-reduced-motion: reduce) {
  .intro-consent-panel .intro-continue-button,
  .intro-consent-decline {
    animation: none !important;
    background-position: 50% 50% !important;
    will-change: auto;
  }
}