@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; }

body.has-signaltakt-cursor,
body.has-signaltakt-cursor button,
body.has-signaltakt-cursor a,
body.has-signaltakt-cursor [role="button"] {
  cursor: none;
}

.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);
}

.fixed-webgl-stage canvas {
  position: relative;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  outline: none;
}

.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-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;
  opacity: 1;
  transform: translateZ(0) scale(1);
  background:
    radial-gradient(circle at 50% 50%, rgba(153, 112, 255, .18), transparent 0 13%, rgba(1,4,11,.2) 27%, rgba(0,0,0,.92) 68%),
    radial-gradient(circle at 50% 54%, rgba(119,241,255,.16), transparent 0 18%, rgba(0,0,0,.78) 56%),
    linear-gradient(180deg, #000 0%, #010309 44%, #000 100%);
  filter: blur(0) brightness(1);
  transition: opacity 720ms cubic-bezier(.19,1,.22,1), filter 720ms cubic-bezier(.19,1,.22,1), transform 720ms cubic-bezier(.19,1,.22,1);
}

.intro-handoff-veil::before,
.intro-handoff-veil::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(58vmin, 560px);
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(171, 248, 255, .26);
  box-shadow: 0 0 80px rgba(110, 228, 255, .18), inset 0 0 80px rgba(151, 105, 255, .14);
  animation: handoffPortalSpin 2.2s linear infinite;
}

.intro-handoff-veil::after {
  width: min(36vmin, 360px);
  border-color: rgba(186, 142, 255, .24);
  animation-duration: 1.65s;
  animation-direction: reverse;
}

.intro-handoff-veil.is-ready {
  opacity: 0;
  filter: blur(24px) brightness(1.5);
  transform: scale(1.22);
}

.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-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: 50%;
  z-index: 5;
  width: min(640px, calc(100vw - 2rem));
  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::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-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-height: 82px;
  padding: .9rem .95rem;
  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 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;
  color: rgba(255,255,255,.93);
  font-size: clamp(.82rem, .92vw, .96rem);
  line-height: 1.38;
  font-weight: 850;
}

.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;
}

.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 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,
  .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) {
  .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-cart-button svg { width: 25px; height: 25px; }
  .ebook-info-button svg { width: 25px; height: 25px; }
  .ebook-info-book-hit { border-radius: 1rem; }
  .ebook-info-panel { left: 50%; top: 54%; transform: translate(-50%, -50%); width: min(92vw, 560px); padding: 1.2rem; }
  .ebook-info-panel h1 { font-size: clamp(2rem, 13vw, 3.2rem); }
  .ebook-info-lead { font-size: .9rem; line-height: 1.55; }
  .ebook-info-grid { grid-template-columns: 1fr; gap: .55rem; }
  .ebook-info-grid div { min-height: auto; padding: .78rem .82rem; }
  .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;
  }
}