@import url("https://fonts.googleapis.com/css2?family=Anton&family=IBM+Plex+Mono:wght@400;600&family=Inter:wght@400;500;700&display=swap");
:root {
  --wz-red: #8f1027;
  --wz-violet: #3e174e;
  --wz-ink: #050505;
  --wz-paper: #d8d5cf;
}
.wizard-page {
  margin: 0;
  background: #050505;
  color: #e9e7e2;
  font-family: Inter, sans-serif;
  overflow-x: hidden;
}
.wizard-page * {
  box-sizing: border-box;
}
.wizard-page main {
  overflow: hidden;
}
.wizard-page h1,
.wizard-page h2,
.wizard-page h3 {
  font-family: Anton, Impact, sans-serif;
  letter-spacing: 0.015em;
}
.wizard-page p {
  color: #aaa6a3;
}
.wizard-page .site-header {
  background: #050505dd;
  color: white;
  border: 1px solid #413c3c;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: blur(12px);
}
.wizard-page .site-header .brand,
.wizard-page .site-header .nav a {
  color: #eee;
}
.wizard-page .site-header .nav a:hover,
.wizard-page .site-header .nav a.active {
  background: #e9e7e2;
  color: #050505;
}
.wizard-page .site-header .nav-cta {
  background: #8f1027 !important;
  color: white !important;
  border: 1px solid #b6374f !important;
  box-shadow: none;
}
.wizard-page .site-footer {
  background: #030303;
}
.wz-hero {
  height: 100svh;
  min-height: 720px;
  position: relative;
  display: flex;
  align-items: flex-end;
  background: #030303;
  isolation: isolate;
}
.wz-hero-image {
  position: absolute;
  inset: -4%;
  z-index: -4;
  background: url("../assets/img/wizard-hero-v3.png") center 42% / cover
    no-repeat;
  transform: scale(1.04);
  will-change: transform;
}
.wz-vignette {
  position: absolute;
  inset: 0;
  z-index: -3;
  background:
    linear-gradient(
      90deg,
      #0202022b 0%,
      transparent 43%,
      #0202028c 72%,
      #020202 100%
    ),
    linear-gradient(0deg, #030303 0%, transparent 36%, #00000038 80%, #020202b5);
}
.wz-grain {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0.12;
  mix-blend-mode: screen;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.wz-pull {
  position: absolute;
  z-index: -2;
  width: 48vw;
  aspect-ratio: 1;
  border-radius: 50%;
  left: 49%;
  top: 1%;
  transform: translateX(-50%);
  box-shadow: 0 0 60px #7f193d33;
  animation: zeroPulse 6s ease-in-out infinite;
}
.wz-hero-content {
  width: min(1440px, calc(100% - 70px));
  margin: 0 auto 6vh;
  position: relative;
  z-index: 4;
  padding-left: 54%;
  text-shadow: 0 3px 20px #000;
}
.wz-overline,
.wz-heading > span,
.wz-zero-copy > span,
.wz-zakom-copy > span,
.wz-cycle header > span,
.wz-final > span {
  font:
    600 0.64rem IBM Plex Mono,
    monospace;
  letter-spacing: 0.22em;
  color: #b34559;
}
.wz-hero h1 {
  margin: 16px 0;
  font-size: clamp(3rem, 5.9vw, 6.6rem);
  line-height: 0.84;
}
.wz-hero h1 span,
.wz-hero h1 strong {
  display: block;
}
.wz-hero h1 strong {
  color: #a31731;
  font-weight: 400;
}
.wz-hero p {
  font-size: clamp(0.9rem, 1.2vw, 1.1rem);
  line-height: 1.65;
  color: #d0cdca;
}
.wz-enter {
  display: inline-flex;
  align-items: center;
  gap: 40px;
  margin-top: 14px;
  padding: 15px 18px;
  border: 1px solid #8f1027;
  background: #080808;
  color: #eee;
  text-decoration: none;
  font: 600 0.67rem IBM Plex Mono;
  letter-spacing: 0.14em;
  transition: 0.25s;
}
.wz-enter:hover {
  background: #8f1027;
}
.wz-enter i {
  font-style: normal;
}
.wz-sideword {
  position: absolute;
  z-index: 4;
  right: 18px;
  top: 50%;
  writing-mode: vertical-rl;
  font: 600 0.52rem IBM Plex Mono;
  letter-spacing: 0.5em;
  color: #777;
}
.wz-scroll {
  position: absolute;
  left: 25px;
  bottom: 28px;
  writing-mode: vertical-rl;
  font: 400 0.48rem IBM Plex Mono;
  letter-spacing: 0.18em;
  color: #777;
}
.wz-section {
  padding: 130px max(30px, calc((100vw - 1320px) / 2));
  position: relative;
}
.wz-heading h2 {
  font-size: clamp(3.5rem, 8vw, 8rem);
  line-height: 0.83;
  margin: 18px 0 60px;
}
.wz-curses {
  background: #dad7d1;
  color: #080808;
}
.wz-curse-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  background: #111;
  border: 3px solid #111;
}
.wz-panel {
  min-height: 620px;
  padding: 46px;
  position: relative;
  overflow: hidden;
  background: #d8d5cf;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.wz-panel.dream {
  background: #0b0b0d;
  color: #eee;
}
.wz-panel > span {
  font: 600 0.62rem IBM Plex Mono;
  color: #8f1027;
  letter-spacing: 0.18em;
}
.wz-panel h3 {
  font-size: clamp(3.2rem, 6vw, 6rem);
  line-height: 0.87;
  margin: 14px 0 22px;
}
.wz-panel p {
  max-width: 500px;
  font-size: 0.95rem;
  line-height: 1.75;
  color: #353130;
}
.wz-panel.dream p {
  color: #aaa6a3;
}
.wz-panel small {
  margin-top: 28px;
  font: 600 0.55rem IBM Plex Mono;
  letter-spacing: 0.12em;
}
.wz-panel-ghost {
  position: absolute;
  top: -14%;
  right: -3%;
  font: 400 26rem Anton;
  color: #8f102710;
  transform: rotate(12deg);
}
.wz-panel-eye {
  position: absolute;
  width: 250px;
  height: 110px;
  top: 16%;
  left: 50%;
  transform: translateX(-50%) rotate(-8deg);
  border-radius: 50%;
  border-block: 8px solid #bbb;
  box-shadow: 0 0 70px #5c1748;
}
.wz-panel-eye::before {
  content: "";
  position: absolute;
  width: 78px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 5%, #8f1027 7% 23%, #020202 25%);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.wz-cycle {
  min-height: 100svh;
  padding: 130px max(30px, calc((100vw - 1320px) / 2));
  background: #050505;
  position: relative;
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  align-items: center;
  gap: 80px;
}
.wz-cycle header h2 {
  font-size: clamp(4rem, 8vw, 8.5rem);
  line-height: 0.84;
  margin: 16px 0;
}
.wz-cycle-track {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  border-left: 1px solid #342d30;
  padding-left: 28px;
}
.wz-cycle-track b {
  font: 400 clamp(2rem, 4vw, 4.5rem) Anton;
  color: #504a4c;
}
.wz-cycle-track b.active {
  color: #9d1731;
  text-shadow: 0 0 24px #8f102766;
}
.wz-cycle-track i {
  font-style: normal;
  color: #5c5557;
}
.wz-cycle > p {
  position: absolute;
  bottom: 35px;
  left: 50%;
  transform: translateX(-50%);
  font: 400 0.65rem IBM Plex Mono;
  letter-spacing: 0.22em;
  white-space: nowrap;
}
.wz-cycle-core {
  position: absolute;
  left: 42%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.18;
  pointer-events: none;
}
.wz-black-hole {
  width: 45vw;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 2px solid #7d1834;
  box-shadow:
    0 0 15px #8f1027,
    0 0 80px #461439;
  animation: zeroSpin 18s linear infinite;
}
.wz-black-hole i {
  position: absolute;
  inset: 20%;
  background: #000;
  border-radius: 50%;
  box-shadow: 0 0 45px #000;
}
.wz-cycle-core > span {
  position: absolute;
  inset: 48% 0 auto;
  text-align: center;
  font: 400 1rem IBM Plex Mono;
  letter-spacing: 0.5em;
}
.wz-zero {
  min-height: 100svh;
  background: #09080a;
  display: grid;
  place-items: center;
  text-align: center;
}
.wz-event {
  width: min(72vw, 980px);
  height: 260px;
  position: absolute;
  left: 50%;
  top: 44%;
  transform: translate(-50%, -50%);
}
.wz-event-ring {
  position: absolute;
  inset: 0;
  border: 14px solid #79203b;
  border-left-color: #d9d5d0;
  border-right-color: #40143e;
  border-radius: 50%;
  filter: blur(3px);
  box-shadow: 0 0 50px #8f1027;
  animation: zeroSpin 8s linear infinite;
}
.wz-event-core {
  position: absolute;
  inset: 23% 7%;
  background: #000;
  border-radius: 50%;
  box-shadow: 0 0 70px #000;
}
.wz-zero-copy {
  position: relative;
  z-index: 2;
  margin-top: 45vh;
}
.wz-zero-copy blockquote {
  font: 400 clamp(2rem, 4.2vw, 4.4rem)/1.15 Anton;
  margin: 20px auto;
  max-width: 1050px;
}
.wz-zero-copy strong {
  color: #8f1027;
  font-weight: 400;
}
.wz-zakom {
  min-height: 100svh;
  padding: 140px max(30px, calc((100vw - 1320px) / 2));
  position: relative;
  background: linear-gradient(90deg, #050505 0 52%, #0c090d);
  display: flex;
  align-items: center;
}
.wz-zakom-presence {
  position: absolute;
  inset: 0 0 0 50%;
  overflow: hidden;
  background: radial-gradient(ellipse at 60% 50%, #2f1226, transparent 42%);
}
.wz-zakom-presence::before {
  content: "";
  position: absolute;
  width: 35%;
  height: 80%;
  bottom: -12%;
  left: 35%;
  background: #010101;
  clip-path: polygon(
    42% 0,
    65% 3%,
    72% 16%,
    89% 31%,
    100% 100%,
    0 100%,
    14% 31%,
    32% 15%
  );
  filter: drop-shadow(0 0 25px #581633);
}
.wz-zakom-presence i {
  position: absolute;
  z-index: 2;
  width: 8px;
  height: 3px;
  top: 35%;
  left: 48%;
  background: #bd2946;
  box-shadow:
    38px 0 #bd2946,
    0 0 14px #d83a56,
    38px 0 14px #d83a56;
}
.wz-zakom-copy {
  position: relative;
  z-index: 2;
  width: 50%;
}
.wz-zakom h2 {
  font-size: clamp(4rem, 8vw, 8.5rem);
  line-height: 0.84;
  margin: 20px 0 40px;
}
.wz-zakom p {
  font: 400 clamp(1.3rem, 2.3vw, 2.5rem)/1.4 IBM Plex Mono;
}
.wz-zakom p strong {
  color: #b21b38;
}
.wz-zakom small {
  font: 400 0.5rem IBM Plex Mono;
  color: #5e585b;
  letter-spacing: 0.1em;
}
.wz-arc {
  background: #d8d5cf;
  color: #090909;
}
.wz-pages {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.wz-pages article {
  aspect-ratio: 0.72;
  border: 3px solid #0b0b0b;
  padding: 23px;
  background: linear-gradient(145deg, #d8d5cf 55%, #aaa59e);
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: 0.25s;
}
.wz-pages article:nth-child(even) {
  transform: translateY(45px);
}
.wz-pages article:hover {
  transform: translateY(-8px) rotate(-1deg);
}
.wz-pages article:nth-child(even):hover {
  transform: translateY(37px) rotate(1deg);
}
.wz-pages article::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    115deg,
    transparent 0 8px,
    #1111 9px 10px
  );
}
.wz-pages b {
  font: 400 6rem Anton;
  color: #8f1027;
  position: relative;
}
.wz-pages div {
  margin-top: auto;
  position: relative;
}
.wz-pages span,
.wz-pages em {
  font: 600 0.53rem IBM Plex Mono;
  letter-spacing: 0.15em;
}
.wz-pages h3 {
  font-size: 1.85rem;
  line-height: 1;
  margin: 10px 0;
}
.wz-pages em {
  font-style: normal;
  color: #8f1027;
}
.wz-pages .redacted {
  background: #090909;
  color: #ddd;
}
.wz-pages .redacted h3 {
  font-size: 3rem;
  filter: blur(1px);
}
.wz-final {
  min-height: 92svh;
  padding: 130px 30px;
  background:
    radial-gradient(circle at 50% 35%, #351020, transparent 30%), #030303;
  text-align: center;
  display: grid;
  place-content: center;
}
.wz-final h2 {
  font-size: clamp(4.5rem, 10vw, 11rem);
  line-height: 0.82;
  margin: 25px 0;
  color: #e0ddd7;
}
.wz-final p {
  font: 400 clamp(1.1rem, 2vw, 2rem) IBM Plex Mono;
  color: #8f1027;
}
.wz-wordmark {
  display: flex;
  justify-content: center;
  margin-top: 65px;
}
.wz-wordmark i {
  font: 400 clamp(2rem, 5vw, 5rem) Anton;
  font-style: normal;
  padding: 0 0.12em;
  color: #777;
  transition: 0.25s;
}
.wz-wordmark i:nth-child(3) {
  color: #a81935;
}
.wz-wordmark i:hover {
  color: #eee;
  transform: translateY(-8px);
}
.wz-wordmark small {
  display: block;
  font: 400 0.34rem IBM Plex Mono;
  letter-spacing: 0.1em;
}
.wizard-page .egg-counter {
  background: #090909;
  color: #ddd;
  border-color: #444;
}
.wizard-page.is-dying main {
  animation: deathFlash 0.32s linear;
}
@keyframes zeroPulse {
  50% {
    transform: translateX(-50%) scale(1.05);
    filter: blur(2px);
  }
}
@keyframes zeroSpin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes deathFlash {
  0%,
  100% {
    filter: none;
  }
  35% {
    filter: invert(1) contrast(2);
  }
  60% {
    filter: grayscale(1) brightness(0.25);
  }
}
@media (max-width: 900px) {
  .wz-hero-content {
    padding-left: 46%;
  }
  .wz-curse-grid {
    grid-template-columns: 1fr;
  }
  .wz-cycle {
    grid-template-columns: 1fr;
  }
  .wz-cycle-core {
    left: 50%;
    opacity: 0.1;
  }
  .wz-pages {
    grid-template-columns: 1fr 1fr;
  }
  .wz-zakom-copy {
    width: 64%;
  }
}
@media (max-width: 650px) {
  .wizard-page .nav {
    background: #080808;
    border-color: #444;
  }
  .wz-hero {
    min-height: 780px;
  }
  .wz-hero-image {
    background-position: 37% center;
  }
  .wz-hero-content {
    width: calc(100% - 28px);
    padding: 0;
    margin-bottom: 5vh;
    background: linear-gradient(90deg, #050505e8, #05050588);
    padding: 20px;
  }
  .wz-hero h1 {
    font-size: clamp(2.8rem, 14vw, 4.3rem);
  }
  .wz-sideword,
  .wz-scroll {
    display: none;
  }
  .wz-section,
  .wz-cycle,
  .wz-zakom {
    padding: 90px 18px;
  }
  .wz-panel {
    min-height: 520px;
    padding: 28px;
  }
  .wz-cycle-track {
    margin-top: 300px;
  }
  .wz-cycle > p {
    font-size: 0.45rem;
    white-space: normal;
    width: 90%;
    text-align: center;
  }
  .wz-event {
    width: 110vw;
    height: 160px;
  }
  .wz-zero-copy {
    margin-top: 38vh;
  }
  .wz-zakom {
    align-items: flex-end;
  }
  .wz-zakom-presence {
    inset: 0;
  }
  .wz-zakom-copy {
    width: 100%;
    background: linear-gradient(0deg, #050505 0 70%, transparent);
    padding-top: 180px;
  }
  .wz-zakom h2 {
    font-size: 3.8rem;
  }
  .wz-pages {
    grid-template-columns: 1fr;
  }
  .wz-pages article,
  .wz-pages article:nth-child(even) {
    transform: none;
    aspect-ratio: 1.15;
  }
  .wz-final h2 {
    font-size: 3.7rem;
  }
  .wz-wordmark small {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
  }
  .wz-hero-image {
    transform: none !important;
  }
}
.wz-black-hole {
  position: relative;
}

/* Zero spread: stable manga composition */
body.wizard-page .wz-zero {
  min-height: 100svh !important;
  padding: 130px max(30px, calc((100vw - 1320px) / 2)) !important;
  display: grid !important;
  grid-template-columns: 0.86fr 1.14fr !important;
  gap: 70px !important;
  align-items: center !important;
  text-align: left !important;
  background: radial-gradient(
    circle at 72% 48%,
    #321122 0%,
    #10090f 22%,
    #050505 54%
  ) !important;
  overflow: hidden !important;
}
body.wizard-page .wz-zero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.16;
  background: repeating-linear-gradient(
    107deg,
    transparent 0 34px,
    #ffffff0a 35px 36px
  );
}
body.wizard-page .wz-zero-copy {
  position: relative !important;
  z-index: 5 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
}
body.wizard-page .wz-zero-copy > span {
  display: block !important;
  color: #b9324c !important;
  font:
    600 0.64rem IBM Plex Mono,
    monospace !important;
  letter-spacing: 0.22em !important;
  margin-bottom: 24px !important;
}
body.wizard-page .wz-zero-copy h2 {
  color: #e5e1db !important;
  font:
    400 clamp(3.7rem, 6.8vw, 7.3rem)/0.84 Anton,
    Impact,
    sans-serif !important;
  letter-spacing: 0.01em !important;
  margin: 0 0 34px !important;
  text-shadow: none !important;
}
body.wizard-page .wz-zero-copy blockquote {
  display: grid !important;
  gap: 7px !important;
  max-width: 630px !important;
  margin: 0 !important;
  padding: 0 0 0 24px !important;
  border: 0 !important;
  border-left: 2px solid #75182f !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #9b9694 !important;
  font:
    400 clamp(1rem, 1.45vw, 1.28rem)/1.55 IBM Plex Mono,
    monospace !important;
  text-align: left !important;
}
body.wizard-page .wz-zero-copy blockquote span {
  display: block !important;
  color: #8d8887 !important;
  font: inherit !important;
}
body.wizard-page .wz-zero-copy blockquote strong {
  display: block !important;
  margin-top: 10px !important;
  color: #d9d4cf !important;
  font:
    600 clamp(1.08rem, 1.65vw, 1.5rem)/1.48 IBM Plex Mono,
    monospace !important;
  text-shadow: none !important;
}
body.wizard-page .wz-zero-copy small {
  display: block;
  margin-top: 32px;
  color: #4f494b;
  font:
    400 0.5rem IBM Plex Mono,
    monospace;
  letter-spacing: 0.13em;
}
body.wizard-page .wz-event {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  width: min(48vw, 650px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  margin: auto !important;
  display: grid !important;
  place-items: center !important;
  filter: none !important;
}
body.wizard-page .wz-event::before {
  content: "";
  position: absolute;
  inset: 5%;
  border-radius: 50%;
  background: repeating-conic-gradient(
    from 20deg,
    #7a1835 0 0.8deg,
    transparent 1deg 7deg
  );
  mask-image: radial-gradient(circle, transparent 0 54%, #000 55% 100%);
  opacity: 0.38;
  animation: zeroSpin 35s linear infinite;
}
body.wizard-page .wz-event-ring {
  position: absolute !important;
  inset: 20% !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: conic-gradient(
    from 30deg,
    #18080e,
    #ac2747,
    #eee8dd,
    #6f1736,
    #12070d,
    #ba304d,
    #18080e
  ) !important;
  filter: blur(1px) !important;
  box-shadow:
    0 0 35px #8f102766,
    0 0 110px #57142f55 !important;
  animation: zeroSpin 13s linear infinite !important;
}
body.wizard-page .wz-event-ring::after {
  content: "";
  position: absolute;
  inset: 14%;
  border-radius: 50%;
  background: #000;
  box-shadow:
    inset 12px 0 24px #4c1127,
    0 0 18px #000;
}
body.wizard-page .wz-event-core {
  position: absolute !important;
  inset: 35% !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: #000 !important;
  box-shadow:
    0 0 0 1px #742039,
    0 0 55px #000 !important;
}
body.wizard-page .wz-event-core i {
  position: relative;
  z-index: 3;
  color: #4b4446;
  font:
    400 0.55rem IBM Plex Mono,
    monospace;
  letter-spacing: 0.45em;
  font-style: normal;
}
body.wizard-page .wz-orbit {
  position: absolute;
  border: 1px solid #6f263b55;
  border-radius: 50%;
  transform: rotate(-18deg);
}
body.wizard-page .wz-orbit.orbit-a {
  inset: 12% 2%;
  animation: zeroWobble 9s ease-in-out infinite;
}
body.wizard-page .wz-orbit.orbit-b {
  inset: 4% 17%;
  transform: rotate(63deg);
  animation: zeroWobble 12s ease-in-out infinite reverse;
}
body.wizard-page .wz-falling-particles {
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  background-image:
    radial-gradient(#eee 0 1px, transparent 1.5px),
    radial-gradient(#a92846 0 1px, transparent 1.5px);
  background-size:
    37px 41px,
    53px 47px;
  mask-image: radial-gradient(circle, transparent 0 48%, #000 70%);
  animation: zeroSpin 28s linear infinite reverse;
  opacity: 0.65;
}
@keyframes zeroWobble {
  50% {
    transform: rotate(8deg) scale(0.94);
  }
}
@media (max-width: 850px) {
  body.wizard-page .wz-zero {
    grid-template-columns: 1fr !important;
    gap: 55px !important;
    padding-top: 95px !important;
  }
  body.wizard-page .wz-event {
    width: min(82vw, 560px) !important;
    grid-row: 1;
  }
  body.wizard-page .wz-zero-copy {
    grid-row: 2 !important;
  }
  body.wizard-page .wz-zero-copy h2 {
    font-size: clamp(3.4rem, 13vw, 6rem) !important;
  }
}
.wz-cycle-track button {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  font: 400 clamp(2rem, 4vw, 4.5rem) Anton;
  color: #504a4c;
  cursor: pointer;
  transition:
    color 0.35s,
    transform 0.35s,
    text-shadow 0.35s;
  transform-origin: left center;
}
.wz-cycle-track button:hover,
.wz-cycle-track button:focus-visible {
  color: #aaa;
  transform: translateX(8px);
  outline: 0;
}
.wz-cycle-track button.active {
  color: #b41e3c;
  text-shadow: 0 0 24px #8f102788;
  transform: translateX(14px);
}
.wz-cycle-track button.active::after {
  content: " // ACTIVE";
  font: 600 0.48rem IBM Plex Mono;
  letter-spacing: 0.12em;
  margin-left: 12px;
  color: #6e6265;
}
.wz-cycle.is-pinned .wz-black-hole {
  box-shadow:
    0 0 20px #b81c3e,
    0 0 120px #60183f;
}
.wz-cycle-core > span {
  transition:
    opacity 0.16s,
    transform 0.16s;
}
.wz-cycle-core > span.switching {
  opacity: 0;
  transform: scale(1.35);
  filter: blur(5px);
}
.wizard-page.is-dying main {
  animation: none !important;
  filter: none !important;
}
.wz-cycle::after {
  content: "";
  position: absolute;
  z-index: 8;
  left: 0;
  bottom: 0;
  width: var(--cycle-progress, 0%);
  height: 3px;
  background: #a71936;
  box-shadow: 0 0 14px #b31d3d;
  transition: width 0.08s linear;
}
.wz-cycle::before {
  content: "SCROLL // CICLO";
  position: absolute;
  z-index: 8;
  right: 24px;
  bottom: 16px;
  color: #5f5759;
  font: 400 0.48rem IBM Plex Mono;
  letter-spacing: 0.16em;
}
.wz-cycle.no-scrolltrigger {
  min-height: auto;
}
.wz-cycle.no-scrolltrigger::before {
  content: "SELECIONE UMA ETAPA";
}
.wz-arc .wz-heading {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 430px);
  align-items: end;
  column-gap: 50px;
}
.wz-arc .wz-heading > span,
.wz-arc .wz-heading > h2 {
  grid-column: 1;
}
.wz-arc .wz-heading > p {
  grid-column: 2;
  grid-row: 1/3;
  color: #4c4644;
  font: 500 0.82rem/1.7 IBM Plex Mono;
  margin: 0 0 8px;
}
.wz-pages article {
  opacity: 1 !important;
}
.wz-pages article:nth-child(1)::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -45px;
  top: 30px;
  border-radius: 50%;
  background: #111;
  box-shadow: 0 0 0 9px #8f1027;
}
.wz-pages article:nth-child(2)::after {
  content: "";
  position: absolute;
  inset: 22% 10% 43%;
  border: 2px solid #111;
  transform: skew(-12deg);
  background: repeating-linear-gradient(
    105deg,
    #111 0 2px,
    transparent 2px 10px
  );
}
.wz-pages article:nth-child(3)::after {
  content: "◉";
  position: absolute;
  right: 25px;
  top: 34px;
  font: 400 7rem Anton;
  color: #8f1027;
  filter: blur(0.4px);
}
.wz-pages article:nth-child(4)::after {
  content: "████████";
  position: absolute;
  right: -20px;
  top: 34%;
  font: 400 2rem IBM Plex Mono;
  color: #8f1027;
  transform: rotate(-9deg);
}
.wz-pages article > div,
.wz-pages article > b,
.wz-pages article > em {
  z-index: 2;
}
.wz-pages article:nth-child(1) > b {
  color: #d8d5cf;
  z-index: 2;
  text-shadow: 3px 3px #8f1027;
}
.wz-pages article:nth-child(1) {
  background: #131313;
  color: #ddd;
}
.wz-pages article:nth-child(1) em {
  color: #d34560;
}
.wz-pages article:nth-child(3) {
  background: linear-gradient(160deg, #eeeae3, #aaa29d);
}
@media (max-width: 800px) {
  .wz-arc .wz-heading {
    grid-template-columns: 1fr;
  }
  .wz-arc .wz-heading > p {
    grid-column: 1;
    grid-row: auto;
    margin: -30px 0 45px;
  }
}