:root {
      color-scheme: dark;
      --bg: #070a14;
      --panel: rgba(11, 16, 31, .76);
      --panel-strong: rgba(13, 20, 40, .94);
      --text: #f4f7ff;
      --muted: #aeb8d9;
      --soft: #6f7da8;
      --cyan: #61f4ff;
      --blue: #619bff;
      --violet: #9d76ff;
      --magenta: #ff4edb;
      --green: #7dffce;
      --line: rgba(130, 172, 255, .26);
      --shadow: 0 32px 120px rgba(0, 0, 0, .55);
      --radius: 30px;
      --safe-bottom: env(safe-area-inset-bottom, 0px);
    }

    * { box-sizing: border-box; }

    html,
    body {
      margin: 0;
      width: 100%;
      max-width: 100%;
      min-height: 100%;
      background: #050711;
      color: var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      overflow: hidden;
      overflow-x: hidden;
    }

    body {
      min-height: 100svh;
      background:
        radial-gradient(circle at 20% 16%, rgba(97, 244, 255, .16), transparent 32%),
        radial-gradient(circle at 78% 12%, rgba(255, 78, 219, .14), transparent 30%),
        radial-gradient(circle at 52% 84%, rgba(110, 88, 255, .18), transparent 35%),
        var(--bg);
    }

    a { color: inherit; text-decoration: none; }

    button {
      border: 0;
      font: inherit;
      color: inherit;
      cursor: pointer;
    }

    .show {
      position: relative;
      width: 100%;
      max-width: 100vw;
      min-height: 100svh;
      isolation: isolate;
      overflow: hidden;
      overflow-x: hidden;
      container-type: inline-size;
      touch-action: pan-y;
      overscroll-behavior-x: none;
      contain: paint;
    }

    .show::before {
      content: "";
      position: absolute;
      inset: -18%;
      z-index: -4;
      background:
        radial-gradient(circle at 46% 42%, rgba(97, 244, 255, .14), transparent 30%),
        radial-gradient(circle at 76% 18%, rgba(255, 78, 219, .12), transparent 28%),
        linear-gradient(115deg, rgba(4, 7, 20, .92), rgba(4, 8, 22, .48) 44%, rgba(4, 7, 20, .92));
      transform: scale(1.03);
      filter: saturate(1.1) contrast(1.08);
    }

    .show::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -3;
      background:
        linear-gradient(180deg, rgba(4, 6, 14, .42), rgba(4, 6, 14, .72) 52%, rgba(4, 6, 14, .92)),
        radial-gradient(circle at 50% 44%, rgba(97, 244, 255, .08), transparent 36%),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 86px);
      pointer-events: none;
    }

    .noise {
      position: absolute;
      inset: 0;
      z-index: -2;
      opacity: .13;
      pointer-events: none;
      background-image:
        radial-gradient(circle at 18% 22%, rgba(255, 255, 255, .28) 0 1px, transparent 1.2px),
        radial-gradient(circle at 76% 61%, rgba(255, 255, 255, .18) 0 1px, transparent 1.1px);
      background-size: 72px 72px, 118px 118px;
      mix-blend-mode: screen;
    }

    .aurora {
      position: absolute;
      inset: auto -18% -28% -18%;
      z-index: -1;
      height: 48svh;
      background:
        radial-gradient(ellipse at 35% 60%, rgba(97, 244, 255, .3), transparent 50%),
        radial-gradient(ellipse at 67% 42%, rgba(255, 78, 219, .22), transparent 54%),
        radial-gradient(ellipse at 50% 82%, rgba(125, 255, 206, .12), transparent 48%);
      filter: blur(44px);
      opacity: .82;
      pointer-events: none;
    }

    .ambient-code-layer {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      pointer-events: none;
      user-select: none;
      mix-blend-mode: screen;
      mask-image: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, .64), rgba(0, 0, 0, .92) 34%, rgba(0, 0, 0, .78) 66%, transparent 100%);
    }

    .ambient-code {
      position: absolute;
      left: var(--code-left, 4%);
      top: var(--code-top, 12%);
      display: grid;
      gap: 4px;
      max-width: min(420px, 30vw);
      color: #a8b7d8;
      font: 600 11px/1.55 Consolas, "Cascadia Code", "SFMono-Regular", monospace;
      letter-spacing: .02em;
      opacity: 0;
      filter: drop-shadow(0 0 12px rgba(97, 244, 255, .28));
      transform: rotate(var(--code-rotate, 0deg)) translate3d(0, 10px, 0);
      transform-origin: left top;
      will-change: opacity, transform;
    }

    .ambient-code.is-active {
      animation: ambientBlockCycle var(--code-duration, 11s) ease-in-out both;
    }

    .ambient-line {
      display: block;
      width: max-content;
      max-width: 100%;
      white-space: pre;
      overflow: hidden;
      opacity: .96;
      clip-path: inset(0 100% 0 0);
    }

    .ambient-code.is-active .ambient-line {
      animation: ambientRandomType var(--line-duration, 3.1s) steps(var(--code-steps, 36), end) both;
      animation-delay: calc(var(--line) * var(--line-delay, .32s));
    }

    .ambient-code .t-key { color: #ff70e8; }
    .ambient-code .t-var { color: #79d8ff; }
    .ambient-code .t-class { color: #7dffce; }
    .ambient-code .t-fn { color: #8da8ff; }
    .ambient-code .t-prop { color: #8ddcff; }
    .ambient-code .t-string { color: #f7b86a; }
    .ambient-code .t-comment { color: #61788f; }
    .ambient-code .t-tag { color: #ff6cb8; }
    .ambient-code .t-num { color: #b197ff; }
    .ambient-code .t-cyan { color: #19dfff; }

    .topbar {
      position: fixed;
      inset: 0 0 auto 0;
      z-index: 40;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      width: 100%;
      max-width: 100vw;
      min-width: 0;
      padding: max(14px, env(safe-area-inset-top, 0px)) clamp(16px, 4vw, 42px) 10px;
      pointer-events: none;
      overflow: hidden;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
      padding: 8px 12px;
      border: 1px solid rgba(125, 255, 255, .17);
      border-radius: 999px;
      background: rgba(8, 12, 28, .58);
      box-shadow: 0 16px 44px rgba(0, 0, 0, .22);
      backdrop-filter: blur(16px);
      pointer-events: auto;
    }

    .brand-mark {
      display: grid;
      position: relative;
      width: 44px;
      height: 44px;
      place-items: center;
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, rgba(97, 244, 255, .18), transparent 58%),
        rgba(6, 12, 28, .72);
      box-shadow:
        0 0 24px rgba(97, 244, 255, .34),
        0 0 34px rgba(255, 78, 219, .18);
      overflow: visible;
    }

    .brand-mark img {
      display: block;
      position: relative;
      z-index: 2;
      width: 108%;
      height: 108%;
      object-fit: contain;
      object-position: center center;
      filter: drop-shadow(0 0 5px rgba(97, 244, 255, .22));
      transform: translateZ(0);
    }

    .brand-text {
      display: grid;
      gap: 0;
      line-height: 1.05;
      min-width: 0;
    }

    .brand-text strong {
      font-size: 13px;
      letter-spacing: .02em;
      white-space: nowrap;
    }

    .brand-text span {
      color: var(--muted);
      font-size: 10px;
      letter-spacing: .32em;
      text-transform: uppercase;
    }

    .top-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      pointer-events: auto;
    }

    .icon-button {
      display: inline-grid;
      width: 42px;
      height: 42px;
      place-items: center;
      border: 1px solid rgba(126, 180, 255, .19);
      border-radius: 16px;
      background: rgba(9, 13, 29, .65);
      box-shadow: 0 18px 48px rgba(0, 0, 0, .25);
      backdrop-filter: blur(16px);
      transition: transform .2s ease, border-color .2s ease, background .2s ease;
    }

    .icon-button:hover {
      transform: translateY(-1px);
      border-color: rgba(97, 244, 255, .46);
      background: rgba(16, 24, 48, .82);
    }

    .stage {
      position: absolute;
      inset: 0;
      z-index: 2;
      display: grid;
      width: 100%;
      max-width: 100vw;
      min-width: 0;
      align-items: center;
      isolation: isolate;
      padding: 92px clamp(18px, 5vw, 74px) 118px;
      opacity: 0;
      visibility: hidden;
      transition: opacity .42s ease, visibility .42s ease;
      overflow-x: hidden;
      overscroll-behavior-x: contain;
      touch-action: pan-y;
      contain: paint;
    }

    .stage::before {
      content: "";
      position: absolute;
      inset: -7%;
      z-index: -2;
      background:
        radial-gradient(circle at 76% 38%, rgba(97, 244, 255, .06), transparent 28%),
        radial-gradient(circle at 30% 62%, rgba(255, 78, 219, .06), transparent 30%),
        linear-gradient(110deg, rgba(4, 7, 17, .82), rgba(4, 8, 19, .22) 46%, rgba(4, 7, 17, .82));
      opacity: 1;
      pointer-events: none;
    }

    .stage::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background:
        radial-gradient(circle at 20% 50%, rgba(97, 244, 255, .08), transparent 34%),
        radial-gradient(circle at 80% 48%, rgba(255, 78, 219, .08), transparent 34%);
      pointer-events: none;
    }

    .stage[data-stage="0"] { --stage-art: url("assets/digital-show-01-hero-premium.png"); }
    .stage[data-stage="1"] { --stage-art: url("assets/digital-show-02-system-premium.png"); }
    .stage[data-stage="2"] { --stage-art: url("assets/digital-show-03-directions-square-v2.png"); }
    .stage[data-stage="3"] { --stage-art: url("assets/digital-show-04-route-premium.png"); }
    .stage[data-stage="4"] { --stage-art: url("assets/digital-show-05-launch-premium.png"); }
    .stage .visual-card--image { --card-art: var(--stage-art); }

    .stage.is-active {
      opacity: 1;
      visibility: visible;
    }

    .stage-inner {
      position: relative;
      z-index: 2;
      width: min(1120px, 100%);
      max-width: 100%;
      min-width: 0;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(310px, 480px);
      gap: clamp(22px, 5vw, 68px);
      align-items: center;
    }

    .stage--center .stage-inner {
      grid-template-columns: minmax(0, 1120px);
      justify-content: center;
      text-align: center;
    }

    .stage--intro .stage-inner {
      width: min(1240px, 100%);
      grid-template-columns: minmax(0, 640px) minmax(330px, 480px);
      gap: clamp(34px, 5vw, 86px);
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: fit-content;
      margin-bottom: 16px;
      padding: 7px 11px;
      border: 1px solid rgba(97, 244, 255, .24);
      border-radius: 999px;
      color: #c9fbff;
      background: rgba(4, 15, 31, .5);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .16em;
      text-transform: uppercase;
      box-shadow: 0 0 32px rgba(97, 244, 255, .12);
    }

    .stage--center .eyebrow { margin-inline: auto; }

    .kicker-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--green);
      box-shadow: 0 0 18px var(--green);
    }

    h1,
    h2 {
      margin: 0;
      text-wrap: balance;
      line-height: .92;
      letter-spacing: -.055em;
      overflow: visible;
      background: linear-gradient(104deg, #ffffff 0%, #79fbff 22%, #8fa6ff 44%, #ff4edb 66%, #ffffff 86%);
      background-size: 320% 100%;
      background-position: 0% 50%;
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
      -webkit-text-fill-color: transparent;
      text-shadow: none;
      filter: none;
      padding: .03em .22em .08em 0;
      will-change: background-position, opacity, transform;
    }

    h1 {
      max-width: 940px;
      font-size: clamp(46px, 9vw, 122px);
    }

    .stage--intro h1 {
      max-width: 640px;
      font-size: clamp(50px, 4.3vw, 66px);
      line-height: .96;
      letter-spacing: -.052em;
    }

    .heading-line {
      display: block;
      max-width: 100%;
    }

    h2 {
      max-width: 760px;
      font-size: clamp(34px, 6.4vw, 78px);
    }

    .stage--center h2 { margin-inline: auto; }

    .gradient-text {
      background: none;
      color: inherit;
      -webkit-text-fill-color: inherit;
      filter: none;
    }

    .lead {
      max-width: 700px;
      margin: 22px 0 0;
      color: #d8def5;
      font-size: clamp(17px, 2.1vw, 23px);
      line-height: 1.48;
    }

    .stage--center .lead { margin-inline: auto; }

    .cta-row {
      display: flex;
      flex-wrap: wrap;
      gap: clamp(34px, 3.4vw, 52px);
      margin: 26px -22px 0;
      padding: 20px 22px;
      overflow: visible;
    }

    .stage--center .cta-row { justify-content: center; }

    .button {
      flex: none;
    }

    .show .cta-row .button.public-btn:not(.public-btn-round) {
      --nb-particle-space: 22px;
      overflow: visible !important;
    }

    .show .cta-row .button.public-btn:not(.public-btn-round) .nb-particle-canvas {
      -webkit-mask-image: radial-gradient(ellipse 88% 74% at 50% 50%, #000 0 62%, rgba(0, 0, 0, .72) 78%, transparent 100%);
      mask-image: radial-gradient(ellipse 88% 74% at 50% 50%, #000 0 62%, rgba(0, 0, 0, .72) 78%, transparent 100%);
    }

    .visual-card {
      position: relative;
      min-height: 440px;
      border: 1px solid rgba(139, 179, 255, .2);
      border-radius: var(--radius);
      background:
        linear-gradient(180deg, rgba(16, 25, 48, .68), rgba(6, 10, 22, .82)),
        rgba(5, 8, 18, .78);
      box-shadow: var(--shadow), 0 0 0 1px rgba(255, 255, 255, .03) inset;
      overflow: hidden;
      backdrop-filter: blur(20px);
    }

    .visual-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 50% 45%, rgba(97, 244, 255, .28), transparent 36%),
        radial-gradient(circle at 64% 54%, rgba(255, 78, 219, .23), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 46%);
      opacity: .92;
    }

    .visual-card--image {
      display: grid;
      grid-template-rows: minmax(0, 1fr) auto;
      gap: 10px;
      height: min(68svh, 680px);
      min-height: 540px;
      padding: 12px;
      background: rgba(5, 8, 18, .92);
    }

    .visual-card--image::before {
      z-index: 0;
      background:
        radial-gradient(circle at 50% 42%, rgba(97, 244, 255, .12), transparent 34%),
        radial-gradient(circle at 64% 50%, rgba(255, 78, 219, .1), transparent 30%),
        linear-gradient(180deg, rgba(8, 14, 30, .76), rgba(4, 8, 18, .92));
      opacity: 1;
      transform: none;
    }

    .visual-card--image::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      border-radius: inherit;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, .12), transparent 28%, transparent 70%, rgba(97, 244, 255, .12)),
        radial-gradient(circle at 18% 16%, rgba(97, 244, 255, .16), transparent 22%);
      box-shadow: 0 0 0 1px rgba(255, 255, 255, .05) inset;
      pointer-events: none;
    }

    .visual-image {
      position: relative;
      z-index: 1;
      display: block;
      width: 100%;
      height: 100%;
      min-height: 0;
      object-fit: contain;
      border-radius: 22px;
      filter: saturate(1.04) contrast(1.02);
      background: rgba(2, 6, 16, .42);
    }

    .visual-caption {
      position: relative;
      z-index: 3;
      display: grid;
      gap: 6px;
      padding: 13px 16px;
      border: 1px solid rgba(125, 255, 255, .2);
      border-radius: 18px;
      background: rgba(5, 10, 23, .8);
      box-shadow: 0 18px 50px rgba(0, 0, 0, .25);
      backdrop-filter: blur(16px);
    }

    .visual-caption span {
      color: #9af8ff;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    .visual-caption strong {
      font-size: clamp(18px, 2vw, 24px);
      line-height: 1.1;
      letter-spacing: -.03em;
    }

    .stage-art-panel {
      width: min(520px, 100%);
      height: min(52svh, 520px);
      min-height: 420px;
      margin: 0;
    }

    .stage-art-panel .visual-image {
      object-fit: cover;
    }

    .directions-showcase {
      display: grid;
      grid-template-columns: minmax(320px, 500px) minmax(0, 1fr);
      gap: clamp(16px, 3vw, 28px);
      align-items: stretch;
      margin-top: 28px;
      max-width: 100%;
      min-width: 0;
    }

    .orbital {
      position: absolute;
      inset: 11%;
      display: grid;
      place-items: center;
      border: 1px solid rgba(97, 244, 255, .24);
      border-radius: 50%;
      animation: spin 22s linear infinite;
    }

    .orbital:nth-child(2) {
      inset: 21%;
      border-color: rgba(255, 78, 219, .24);
      animation-duration: 16s;
      animation-direction: reverse;
    }

    .core {
      position: absolute;
      inset: 34%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 36% 28%, #fff, transparent 14%),
        radial-gradient(circle, rgba(97, 244, 255, .98), rgba(157, 118, 255, .78) 36%, rgba(255, 78, 219, .34) 66%, transparent 72%);
      box-shadow:
        0 0 52px rgba(97, 244, 255, .55),
        0 0 104px rgba(255, 78, 219, .22);
      animation: corePulse 2.8s ease-in-out infinite alternate;
    }

    .mini-module {
      position: absolute;
      display: grid;
      place-items: center;
      width: 92px;
      height: 62px;
      border: 1px solid rgba(123, 184, 255, .25);
      border-radius: 18px;
      background: rgba(7, 13, 30, .78);
      box-shadow: 0 18px 52px rgba(0, 0, 0, .28);
      color: #eaf8ff;
      font-weight: 900;
      font-size: 22px;
      backdrop-filter: blur(12px);
    }

    .m1 { left: 10%; top: 18%; }
    .m2 { right: 9%; top: 22%; }
    .m3 { left: 13%; bottom: 22%; }
    .m4 { right: 13%; bottom: 18%; }
    .m5 { left: 50%; top: 6%; transform: translateX(-50%); }
    .m6 { left: 50%; bottom: 6%; transform: translateX(-50%); }

    .problem-stack {
      display: grid;
      gap: 12px;
      padding: 24px;
    }

    .problem-card {
      position: relative;
      display: grid;
      gap: 6px;
      padding: 16px 16px 16px 48px;
      border: 1px solid rgba(145, 172, 255, .16);
      border-radius: 22px;
      background: rgba(11, 17, 34, .72);
    }

    .problem-card::before {
      content: "×";
      position: absolute;
      top: 15px;
      left: 18px;
      color: #ff77c7;
      font-weight: 1000;
      text-shadow: 0 0 16px rgba(255, 78, 219, .35);
    }

    .problem-card strong { font-size: 15px; }
    .problem-card span { color: var(--muted); font-size: 13px; line-height: 1.35; }

    .directions {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
      margin-top: 30px;
    }

    .directions-showcase .directions {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      align-content: center;
      margin-top: 0;
    }

    .direction {
      position: relative;
      min-height: 88px;
      padding: 12px;
      border: 1px solid rgba(126, 180, 255, .17);
      border-radius: 22px;
      background: linear-gradient(180deg, rgba(16, 24, 48, .78), rgba(7, 11, 24, .76));
      box-shadow: 0 18px 50px rgba(0, 0, 0, .25);
      overflow: hidden;
      transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background .24s ease;
    }

    .directions-showcase .direction { min-height: 76px; }

    .direction::before {
      content: "";
      position: absolute;
      inset: auto 12px 10px 12px;
      height: 2px;
      background: linear-gradient(90deg, var(--cyan), var(--magenta));
      opacity: .7;
      filter: blur(.2px);
    }

    .direction::after,
    .step::after,
    .result-panel::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, .18) 42%, transparent 68%);
      transform: translateX(-120%);
      transition: transform .55s ease;
      pointer-events: none;
    }

    .direction:hover,
    .step:hover,
    .result-panel:hover {
      transform: translateY(-2px);
      border-color: rgba(97, 244, 255, .42);
      box-shadow: 0 22px 70px rgba(97, 244, 255, .12), 0 18px 50px rgba(0, 0, 0, .28);
    }

    .direction:hover::after,
    .step:hover::after,
    .result-panel:hover::after {
      transform: translateX(120%);
    }

    .direction span {
      position: relative;
      z-index: 1;
      display: block;
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .direction strong {
      position: relative;
      z-index: 1;
      display: block;
      margin-top: 8px;
      font-size: clamp(13px, 1.6vw, 17px);
      line-height: 1.08;
    }

    .direction:nth-child(odd) { --fly-x: -26px; --fly-y: 18px; }
    .direction:nth-child(even) { --fly-x: 28px; --fly-y: -16px; }
    .direction:nth-child(3n) { --fly-x: -18px; --fly-y: -24px; }

    .pipeline {
      display: grid;
      gap: 16px;
      margin-top: 30px;
    }

    .pipeline--plain {
      margin-top: 26px;
    }

    .pipeline--over-image {
      position: relative;
      overflow: hidden;
      padding: 18px;
      border: 1px solid rgba(139, 179, 255, .2);
      border-radius: var(--radius);
      background: rgba(5, 8, 18, .72);
      box-shadow: var(--shadow), 0 0 0 1px rgba(255, 255, 255, .03) inset;
    }

    .pipeline--over-image::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background-image:
        linear-gradient(90deg, rgba(5, 8, 18, .9), rgba(5, 8, 18, .72) 58%, rgba(5, 8, 18, .46)),
        var(--card-art);
      background-size: cover, contain;
      background-position: center, center;
      background-repeat: no-repeat;
      opacity: .86;
      transform: none;
    }

    .step {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 60px 1fr;
      gap: 16px;
      align-items: center;
      padding: 18px;
      border: 1px solid rgba(135, 178, 255, .18);
      border-radius: 24px;
      background: rgba(9, 14, 31, .74);
      box-shadow: 0 18px 55px rgba(0, 0, 0, .22);
      backdrop-filter: blur(12px);
      overflow: hidden;
      transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
    }

    .step-num {
      position: relative;
      z-index: 1;
      display: grid;
      width: 56px;
      height: 56px;
      place-items: center;
      border-radius: 20px;
      background: linear-gradient(135deg, rgba(97, 244, 255, .95), rgba(255, 78, 219, .9));
      color: #07101f;
      font-weight: 1000;
      font-size: 20px;
      box-shadow: 0 0 34px rgba(97, 244, 255, .2);
    }

    .step strong { position: relative; z-index: 1; display: block; font-size: 18px; }
    .step span { position: relative; z-index: 1; display: block; margin-top: 5px; color: var(--muted); line-height: 1.42; }

    .result-panel {
      position: relative;
      padding: 26px;
      border: 1px solid rgba(125, 255, 206, .2);
      border-radius: var(--radius);
      background:
        radial-gradient(circle at 25% 10%, rgba(125, 255, 206, .14), transparent 34%),
        linear-gradient(180deg, rgba(14, 28, 42, .86), rgba(8, 12, 26, .84));
      box-shadow: var(--shadow);
      overflow: hidden;
      transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
    }

    .result-panel--image {
      min-height: 450px;
      overflow: hidden;
      display: grid;
      align-content: end;
    }

    .result-panel--image::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background-image:
        linear-gradient(180deg, rgba(4, 8, 18, .08), rgba(4, 8, 18, .40) 48%, rgba(4, 8, 18, .88)),
        var(--card-art);
      background-size: cover, contain;
      background-position: center, center;
      background-repeat: no-repeat;
      transform: none;
    }

    .result-panel--image > * {
      position: relative;
      z-index: 2;
    }

    .result-panel h3 {
      position: relative;
      z-index: 1;
      margin: 0 0 14px;
      font-size: 22px;
      line-height: 1.1;
    }

    .result-panel--compact {
      margin-top: 26px;
      padding: 20px;
      border-radius: 24px;
    }

    .result-list {
      position: relative;
      z-index: 1;
      display: grid;
      gap: 10px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .result-list li {
      display: flex;
      gap: 10px;
      color: #dfe8ff;
      line-height: 1.38;
    }

    .result-list li::before {
      content: "✓";
      flex: 0 0 auto;
      color: var(--green);
      font-weight: 1000;
      text-shadow: 0 0 14px rgba(125, 255, 206, .42);
    }

    .stage.is-active .eyebrow {
      animation: eyebrowSignal .62s .04s cubic-bezier(.18, .85, .22, 1) both;
    }

    .stage.is-active h1,
    .stage.is-active h2 {
      animation:
        titleReveal 1.08s .12s cubic-bezier(.16, .9, .22, 1) both,
        headingGradientFlow 20s ease-in-out infinite alternate;
    }

    .stage.is-active .lead {
      animation: contentReveal .74s .38s cubic-bezier(.18, .82, .22, 1) both;
    }

    .stage.is-active .cta-row,
    .stage.is-active .tiny-note {
      animation: contentReveal .68s .58s cubic-bezier(.18, .82, .22, 1) both;
    }

    .stage.is-active .cta-row .button {
      animation: buttonEntrance .6s .66s cubic-bezier(.16, .9, .22, 1) both;
    }

    .stage.is-active .cta-row .button:nth-child(2) {
      animation-delay: .76s;
    }

    .stage.is-active .result-panel {
      animation: panelReveal .76s .42s cubic-bezier(.16, .88, .22, 1) both;
    }

    .stage.is-active .visual-card {
      animation: panelReveal .86s .28s cubic-bezier(.16, .88, .22, 1) both;
    }

    .stage.is-active .direction {
      animation: categoryAssemble .48s both;
    }

    .stage.is-active .direction:nth-child(1) { animation-delay: .18s; }
    .stage.is-active .direction:nth-child(2) { animation-delay: .22s; }
    .stage.is-active .direction:nth-child(3) { animation-delay: .26s; }
    .stage.is-active .direction:nth-child(4) { animation-delay: .30s; }
    .stage.is-active .direction:nth-child(5) { animation-delay: .34s; }
    .stage.is-active .direction:nth-child(6) { animation-delay: .38s; }
    .stage.is-active .direction:nth-child(7) { animation-delay: .42s; }
    .stage.is-active .direction:nth-child(8) { animation-delay: .46s; }
    .stage.is-active .direction:nth-child(9) { animation-delay: .50s; }
    .stage.is-active .direction:nth-child(10) { animation-delay: .54s; }
    .stage.is-active .direction:nth-child(11) { animation-delay: .58s; }
    .stage.is-active .direction:nth-child(12) { animation-delay: .62s; }

    .stage.is-active .step {
      animation: cardSlideIn .62s cubic-bezier(.16, .88, .22, 1) both;
    }

    .stage.is-active .step:nth-child(1) { animation-delay: .30s; }
    .stage.is-active .step:nth-child(2) { animation-delay: .42s; }
    .stage.is-active .step:nth-child(3) { animation-delay: .54s; }

    .stage.is-active .result-list li {
      animation: contentReveal .52s cubic-bezier(.18, .82, .22, 1) both;
    }

    .stage.is-active .result-list li:nth-child(1) { animation-delay: .42s; }
    .stage.is-active .result-list li:nth-child(2) { animation-delay: .50s; }
    .stage.is-active .result-list li:nth-child(3) { animation-delay: .58s; }
    .stage.is-active .result-list li:nth-child(4) { animation-delay: .66s; }

    .bottom-nav {
      position: fixed;
      left: 50%;
      bottom: calc(14px + var(--safe-bottom));
      z-index: 42;
      display: grid;
      width: min(660px, calc(100% - 34px));
      max-width: calc(100vw - 34px);
      transform: translateX(-50%);
      gap: 7px;
      overflow: visible;
    }

    .progress {
      height: 3px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .11);
      overflow: hidden;
      box-shadow: 0 0 0 1px rgba(255, 255, 255, .05) inset;
    }

    .progress-fill {
      width: 0;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--cyan), var(--magenta), var(--green));
      box-shadow: 0 0 20px rgba(97, 244, 255, .45);
      transition: width .35s ease;
    }

    .nav-shell {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
      padding: 6px;
      border: 1px solid rgba(130, 172, 255, .18);
      border-radius: 999px;
      background: rgba(7, 10, 24, .74);
      box-shadow: 0 16px 54px rgba(0, 0, 0, .34);
      backdrop-filter: blur(18px);
    }

    .nav-dots {
      display: flex;
      gap: 6px;
      align-items: center;
      justify-content: center;
      flex: 1 1 auto;
    }

    .dot {
      width: 7px;
      height: 7px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .2);
      transition: width .25s ease, background .25s ease, box-shadow .25s ease;
    }

    .dot.is-active {
      width: 28px;
      background: linear-gradient(90deg, var(--cyan), var(--magenta));
      box-shadow: 0 0 18px rgba(97, 244, 255, .34);
    }

    .bottom-nav .nav-button {
      --nb-particle-space: 8px;
      --nb-orbit-duration: 76s;
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 35px !important;
      min-width: 35px !important;
      max-width: 35px !important;
      height: 35px !important;
      min-height: 35px !important;
      max-height: 35px !important;
      flex: 0 0 35px;
      box-sizing: border-box;
      padding: 0 !important;
      place-items: center;
      border-radius: 50% !important;
      font-size: 0;
      line-height: 1;
      text-shadow: 0 0 14px rgba(255, 255, 255, .7);
    }

    .bottom-nav .nav-shell button.nav-button.public-btn.public-btn-primary {
      width: 35px !important;
      min-width: 35px !important;
      max-width: 35px !important;
      height: 35px !important;
      min-height: 35px !important;
      max-height: 35px !important;
      border-radius: 50% !important;
      padding: 0 !important;
    }

    .bottom-nav .nav-button .nb-button-label {
      display: grid;
      place-items: center;
      position: relative;
      z-index: 7;
      width: 100%;
      height: 100%;
      font-size: 0;
      font-weight: 900;
      line-height: 1;
      text-align: center;
      transform: none;
      color: transparent;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: 18px 18px;
    }

    #prevStage .nb-button-label {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 5.5 9 12l6.5 6.5' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
      filter:
        drop-shadow(0 0 4px rgba(255, 255, 255, .9))
        drop-shadow(0 0 9px rgba(97, 244, 255, .68));
    }

    #nextStage .nb-button-label {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 5.5 15 12l-6.5 6.5' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
      filter:
        drop-shadow(0 0 4px rgba(255, 255, 255, .9))
        drop-shadow(0 0 9px rgba(97, 244, 255, .68));
    }

    .pause-button .pause-icon {
      position: relative;
      display: block;
      width: 15px;
      height: 15px;
      color: #fff;
      filter:
        drop-shadow(0 0 4px rgba(255, 255, 255, .9))
        drop-shadow(0 0 9px rgba(97, 244, 255, .68));
    }

    .pause-button .pause-icon::before,
    .pause-button .pause-icon::after {
      content: "";
      position: absolute;
      top: 1px;
      bottom: 1px;
      width: 4px;
      border-radius: 999px;
      background: currentColor;
    }

    .pause-button .pause-icon::before { left: 2px; }

    .pause-button .pause-icon::after { right: 2px; }

    .pause-button.is-paused .pause-icon::before {
      left: 3px;
      top: 0;
      bottom: auto;
      width: 0;
      height: 0;
      border-top: 7.5px solid transparent;
      border-bottom: 7.5px solid transparent;
      border-left: 11px solid currentColor;
      border-radius: 0;
      background: transparent;
    }

    .pause-button.is-paused .pause-icon::after {
      display: none;
    }

    .bottom-nav .nav-button .nb-button-edge {
      inset: 2px;
      border-radius: 50%;
    }

    .bottom-nav .nav-button .nb-button-circuitry {
      inset: 3px;
      opacity: .44;
      border-radius: 50%;
    }

    .bottom-nav .nav-button .nb-button-dark-core {
      inset: 18%;
      border-radius: 50%;
      opacity: .82;
    }

    .bottom-nav .nav-button .nb-particle-canvas {
      border-radius: 50% !important;
      opacity: .84;
    }

    .tiny-note {
      max-width: 650px;
      margin-top: 18px;
      color: var(--soft);
      font-size: 13px;
      line-height: 1.45;
    }

    .sound-panel {
      position: fixed;
      right: clamp(16px, 4vw, 42px);
      bottom: calc(94px + var(--safe-bottom));
      z-index: 41;
      display: none;
      max-width: 260px;
      padding: 12px;
      border: 1px solid rgba(97, 244, 255, .2);
      border-radius: 20px;
      color: var(--muted);
      background: rgba(8, 12, 28, .78);
      font-size: 12px;
      line-height: 1.35;
      backdrop-filter: blur(16px);
    }

    .sound-panel.is-visible { display: block; }

    @keyframes cinematicDrift {
      0% { transform: scale(1.03) translate3d(-1.5%, -1.2%, 0); }
      100% { transform: scale(1.08) translate3d(1.4%, 1.1%, 0); }
    }

    @keyframes auroraPulse {
      0% { opacity: .45; transform: translateY(6px) scale(.98); }
      100% { opacity: .9; transform: translateY(-16px) scale(1.05); }
    }

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

    @keyframes corePulse {
      0% { transform: scale(.92); filter: saturate(1); }
      100% { transform: scale(1.04); filter: saturate(1.25); }
    }

    @keyframes eyebrowSignal {
      0% {
        opacity: 0;
        transform: translate3d(-10px, 8px, 0) scale(.98);
        filter: blur(7px);
      }
      58% {
        opacity: 1;
        transform: translate3d(2px, 0, 0) scale(1.015);
        filter: blur(0);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0);
      }
    }

    @keyframes titleReveal {
      0% {
        opacity: 0;
        transform: translate3d(0, 34px, 0) scale(.985);
        clip-path: inset(0 0 100% 0 round 22px);
        filter: blur(12px) saturate(.9);
      }
      45% {
        opacity: 1;
        filter: blur(4px) saturate(1.08);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        clip-path: inset(0 0 0 0);
        filter: blur(0) saturate(1);
      }
    }

    @keyframes contentReveal {
      0% {
        opacity: 0;
        transform: translate3d(0, 18px, 0);
        clip-path: inset(14% 0 0 0);
        filter: blur(9px);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        clip-path: inset(0 0 0 0);
        filter: blur(0);
      }
    }

    @keyframes buttonEntrance {
      0% {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(.92);
        filter: blur(10px) saturate(.85);
      }
      58% {
        opacity: 1;
        transform: translate3d(0, -2px, 0) scale(1.025);
        filter: blur(0) saturate(1.1);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0) saturate(1);
      }
    }

    @keyframes panelReveal {
      0% {
        opacity: 0;
        transform: translate3d(28px, 20px, 0) scale(.965);
        filter: blur(14px) saturate(.88);
      }
      62% {
        opacity: 1;
        transform: translate3d(-3px, -2px, 0) scale(1.01);
        filter: blur(1px) saturate(1.08);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0) saturate(1);
      }
    }

    @keyframes headingGradientFlow {
      0% { background-position: 0% 50%; }
      28% { background-position: 42% 50%; }
      62% { background-position: 96% 50%; }
      100% { background-position: 148% 50%; }
    }

    @keyframes ambientRandomType {
      0% { clip-path: inset(0 100% 0 0); }
      68%,
      100% { clip-path: inset(0 0 0 0); }
    }

    @keyframes ambientBlockCycle {
      0%,
      7%,
      100% {
        opacity: 0;
        transform: rotate(var(--code-rotate, 0deg)) translate3d(0, 14px, 0) scale(.985);
      }
      18%,
      74% {
        opacity: var(--code-opacity, .18);
        transform: rotate(var(--code-rotate, 0deg)) translate3d(0, 0, 0) scale(1);
      }
      88% {
        opacity: 0;
        transform: rotate(var(--code-rotate, 0deg)) translate3d(0, -8px, 0) scale(1.005);
      }
    }

    @keyframes posterFade {
      0% {
        opacity: 0;
        filter: blur(10px) saturate(.9);
      }
      100% {
        opacity: 1;
        filter: blur(0) saturate(1);
      }
    }

    @keyframes categoryAssemble {
      0% {
        opacity: 0;
        transform: translate3d(var(--fly-x, 20px), var(--fly-y, 22px), 0) rotate(.8deg);
        filter: blur(8px);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotate(0deg);
        filter: blur(0);
      }
    }

    @keyframes cardSlideIn {
      0% {
        opacity: 0;
        transform: translateX(-18px);
        filter: blur(8px);
      }
      100% {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
      }
    }

    @keyframes panelRevealMobileStable {
      0% {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(.985);
        filter: blur(12px) saturate(.9);
      }
      62% {
        opacity: 1;
        transform: translate3d(0, -1px, 0) scale(1.005);
        filter: blur(1px) saturate(1.06);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0) saturate(1);
      }
    }

    @keyframes cardRevealMobileStable {
      0% {
        opacity: 0;
        transform: translate3d(0, 14px, 0);
        filter: blur(8px);
      }
      100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        filter: blur(0);
      }
    }

    @media (max-width: 860px) {
      html,
      body {
        width: 100%;
        max-width: 100vw;
        overflow-x: hidden !important;
        overscroll-behavior-x: none;
      }

      .show {
        width: 100%;
        max-width: 100vw;
        min-width: 0;
        overflow: hidden;
        overflow-x: hidden;
        touch-action: pan-y;
        overscroll-behavior-x: none;
      }

      .show::before {
        inset: 0;
        transform: none;
      }

      .aurora {
        inset: auto 0 -28% 0;
      }

      .stage {
        align-items: start;
        padding: 92px 16px 116px;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior-x: contain;
        touch-action: pan-y;
        width: 100%;
        max-width: 100vw;
        min-width: 0;
        -webkit-overflow-scrolling: touch;
      }

      .stage::before {
        inset: 0;
      }

      .stage-inner,
      .stage--center .stage-inner {
        grid-template-columns: 1fr;
        gap: 22px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
      }

      .stage.is-active .eyebrow,
      .stage.is-active .direction,
      .stage.is-active .step {
        animation-name: cardRevealMobileStable;
      }

      .stage.is-active .visual-card,
      .stage.is-active .result-panel {
        animation-name: panelRevealMobileStable;
      }

      .topbar,
      .bottom-nav,
      .nav-shell {
        max-width: 100vw;
        min-width: 0;
      }

      .stage--intro .stage-inner {
        grid-template-columns: 1fr;
      }

      .visual-card { min-height: 315px; order: -1; }

      .stage--intro .visual-card { min-height: 360px; }

      .stage--intro::after {
        background:
          linear-gradient(180deg, rgba(4, 6, 14, .32), rgba(4, 6, 14, .78) 56%, rgba(4, 6, 14, .95)),
          radial-gradient(circle at 58% 24%, rgba(97, 244, 255, .15), transparent 34%),
          radial-gradient(circle at 82% 34%, rgba(255, 78, 219, .12), transparent 30%),
          var(--stage-art) center 86px / min(100%, 440px) auto no-repeat;
        opacity: .74;
      }

      .stage--intro .visual-card {
        display: none;
      }

      .stage--intro h1 {
        width: min(100%, 560px);
        max-width: 100%;
        min-width: 0;
        font-size: clamp(36px, 12vw, 52px);
        line-height: .98;
        overflow-wrap: normal;
        word-break: keep-all;
        text-wrap: normal;
      }

      .stage--intro .heading-line {
        width: auto;
        max-width: 100%;
        overflow-wrap: normal;
        word-break: keep-all;
        white-space: normal;
      }

      .visual-card--image { min-height: 330px; }

      .stage-art-panel {
        width: 100%;
        max-width: 100%;
        min-height: 280px;
        margin: 0 auto;
      }

      .directions-showcase {
        grid-template-columns: 1fr;
        margin-top: 22px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
      }

      .directions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
      }

      .direction { min-height: 78px; border-radius: 18px; }

      .brand-text span { letter-spacing: .18em; }

      .top-actions .button { display: none; }

      .lead { font-size: 17px; }

      .cta-row {
        justify-content: center;
        align-items: center;
        gap: 16px;
        margin: 22px -12px 0;
        padding: 18px 12px;
        max-width: calc(100% + 24px);
        overflow-x: hidden;
      }

      .cta-row .button.public-btn:not(.public-btn-round) {
        --nb-particle-space: 8px;
        min-height: 40px;
        padding: 9px 16px;
        font-size: 11.5px;
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, .86),
          inset 0 -1px 0 rgba(255, 255, 255, .42),
          inset 13px 0 22px rgba(var(--nb-a-rgb), .14),
          inset -13px 0 23px rgba(var(--nb-b-rgb), .13),
          0 0 4px rgba(255, 255, 255, .42),
          -4px 0 13px rgba(var(--nb-a-rgb), .28),
          4px 0 14px rgba(var(--nb-b-rgb), .26),
          0 10px 22px rgba(0, 0, 0, .42);
      }

      .cta-row .button.public-btn:not(.public-btn-round):hover {
        filter: saturate(1.08) brightness(1.05);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, .9),
          inset 0 -1px 0 rgba(255, 255, 255, .48),
          inset 14px 0 24px rgba(var(--nb-a-rgb), .17),
          inset -14px 0 25px rgba(var(--nb-b-rgb), .16),
          0 0 5px rgba(255, 255, 255, .48),
          -5px 0 16px rgba(var(--nb-a-rgb), .34),
          5px 0 17px rgba(var(--nb-b-rgb), .32),
          0 12px 25px rgba(0, 0, 0, .44);
      }

      .cta-row .button.public-btn:not(.public-btn-round) .nb-particle-canvas {
        opacity: .16 !important;
        filter: blur(.4px);
        -webkit-mask-image: radial-gradient(ellipse 76% 58% at 50% 50%, rgba(0, 0, 0, .9) 0 44%, rgba(0, 0, 0, .34) 66%, transparent 100%);
        mask-image: radial-gradient(ellipse 76% 58% at 50% 50%, rgba(0, 0, 0, .9) 0 44%, rgba(0, 0, 0, .34) 66%, transparent 100%);
      }

      .stage--intro .cta-row {
        flex-direction: column;
        gap: 15px;
        margin: 24px -12px 0;
        padding: 19px 12px 18px;
      }

      .cta-row .button {
        width: min(100%, 282px);
        max-width: 282px;
      }

      .stage--intro .tiny-note {
        margin-top: 20px;
        font-size: 14.5px;
        line-height: 1.52;
      }

      .sound-panel {
        left: 16px;
        right: 16px;
        bottom: calc(104px + var(--safe-bottom));
        max-width: none;
      }

      .ambient-code {
        max-width: 62vw;
        font-size: 8px;
      }

      .ambient-code:nth-child(n+5) {
        display: none;
      }
    }

    @media (max-width: 460px) {
      .brand-text strong { font-size: 12px; }
      .brand-text span { font-size: 9px; }
      .brand { padding: 7px 9px; }
      .brand-mark { width: 36px; height: 36px; }
      .icon-button { width: 38px; height: 38px; border-radius: 14px; }
      h1 { font-size: clamp(42px, 16vw, 68px); }
      .stage--intro h1 { font-size: clamp(32px, 11vw, 46px); }
      h2 { font-size: clamp(32px, 12vw, 54px); }
      .step { grid-template-columns: 48px 1fr; padding: 14px; gap: 12px; }
      .step-num { width: 46px; height: 46px; border-radius: 16px; }
      .mini-module { width: 74px; height: 52px; font-size: 18px; }
    }

    .show.is-mobile-review {
      width: 100%;
      max-width: 100vw;
      min-width: 0;
      overflow: hidden;
      overflow-x: hidden;
      overscroll-behavior-x: none;
      touch-action: pan-y;
      contain: paint;
    }

    .show.is-mobile-review .stage {
      align-items: start;
      width: 100%;
      padding: 92px 16px 116px;
      overflow-y: auto;
      overflow-x: hidden;
      overscroll-behavior-x: contain;
      touch-action: pan-y;
      max-width: 100vw;
      min-width: 0;
      -webkit-overflow-scrolling: touch;
    }

    .show.is-mobile-review::before {
      inset: 0;
      transform: none;
    }

    .show.is-mobile-review .aurora {
      inset: auto 0 -28% 0;
    }

    .show.is-mobile-review .stage::before {
      inset: 0;
    }

    .show.is-mobile-review .stage-inner,
    .show.is-mobile-review .stage--center .stage-inner {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      grid-template-columns: 1fr;
      gap: 22px;
    }

    .show.is-mobile-review .stage.is-active .eyebrow,
    .show.is-mobile-review .stage.is-active .direction,
    .show.is-mobile-review .stage.is-active .step {
      animation-name: cardRevealMobileStable;
    }

    .show.is-mobile-review .stage.is-active .visual-card,
    .show.is-mobile-review .stage.is-active .result-panel {
      animation-name: panelRevealMobileStable;
    }

    .show.is-mobile-review .topbar,
    .show.is-mobile-review .bottom-nav,
    .show.is-mobile-review .nav-shell,
    .show.is-mobile-review .directions-showcase,
    .show.is-mobile-review .directions,
    .show.is-mobile-review .stage-art-panel {
      max-width: 100%;
      min-width: 0;
    }

    .show.is-mobile-review .stage--intro .stage-inner {
      grid-template-columns: 1fr;
    }

    .show.is-mobile-review .stage--intro::after {
      background:
        linear-gradient(180deg, rgba(4, 6, 14, .32), rgba(4, 6, 14, .78) 56%, rgba(4, 6, 14, .95)),
        radial-gradient(circle at 58% 24%, rgba(97, 244, 255, .15), transparent 34%),
        radial-gradient(circle at 82% 34%, rgba(255, 78, 219, .12), transparent 30%),
        var(--stage-art) center 86px / min(100%, 440px) auto no-repeat;
      opacity: .74;
    }

    .show.is-mobile-review .stage--intro .visual-card {
      display: none;
    }

    .show.is-mobile-review .stage--intro h1 {
      width: min(100%, 560px);
      max-width: 100%;
      min-width: 0;
      font-size: clamp(36px, 12vw, 52px);
      line-height: .98;
      overflow-wrap: normal;
      word-break: keep-all;
      text-wrap: normal;
    }

    .show.is-mobile-review .stage--intro .heading-line {
      width: auto;
      max-width: 100%;
      overflow-wrap: normal;
      word-break: keep-all;
      white-space: normal;
    }

    .show.is-mobile-review .top-actions .button {
      display: none;
    }

    .show.is-mobile-review .lead {
      font-size: 17px;
    }

    .show.is-mobile-review .cta-row {
      justify-content: center;
      align-items: center;
      gap: 16px;
      margin: 22px -12px 0;
      padding: 18px 12px;
      max-width: calc(100% + 24px);
      overflow-x: hidden;
    }

    .show.is-mobile-review .cta-row .button.public-btn:not(.public-btn-round) {
      --nb-particle-space: 8px;
      min-height: 40px;
      padding: 9px 16px;
      font-size: 11.5px;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .86),
        inset 0 -1px 0 rgba(255, 255, 255, .42),
        inset 13px 0 22px rgba(var(--nb-a-rgb), .14),
        inset -13px 0 23px rgba(var(--nb-b-rgb), .13),
        0 0 4px rgba(255, 255, 255, .42),
        -4px 0 13px rgba(var(--nb-a-rgb), .28),
        4px 0 14px rgba(var(--nb-b-rgb), .26),
        0 10px 22px rgba(0, 0, 0, .42);
    }

    .show.is-mobile-review .cta-row .button.public-btn:not(.public-btn-round):hover {
      filter: saturate(1.08) brightness(1.05);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -1px 0 rgba(255, 255, 255, .48),
        inset 14px 0 24px rgba(var(--nb-a-rgb), .17),
        inset -14px 0 25px rgba(var(--nb-b-rgb), .16),
        0 0 5px rgba(255, 255, 255, .48),
        -5px 0 16px rgba(var(--nb-a-rgb), .34),
        5px 0 17px rgba(var(--nb-b-rgb), .32),
        0 12px 25px rgba(0, 0, 0, .44);
    }

    .show.is-mobile-review .cta-row .button.public-btn:not(.public-btn-round) .nb-particle-canvas {
      opacity: .16 !important;
      filter: blur(.4px);
      -webkit-mask-image: radial-gradient(ellipse 76% 58% at 50% 50%, rgba(0, 0, 0, .9) 0 44%, rgba(0, 0, 0, .34) 66%, transparent 100%);
      mask-image: radial-gradient(ellipse 76% 58% at 50% 50%, rgba(0, 0, 0, .9) 0 44%, rgba(0, 0, 0, .34) 66%, transparent 100%);
    }

    .show.is-mobile-review .stage--intro .cta-row {
      flex-direction: column;
      gap: 15px;
      margin: 24px -12px 0;
      padding: 19px 12px 18px;
    }

    .show.is-mobile-review .cta-row .button {
      width: min(100%, 282px);
      max-width: 282px;
    }

    .show.is-mobile-review .stage--intro .tiny-note {
      margin-top: 20px;
      font-size: 14.5px;
      line-height: 1.52;
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
      }

      .ambient-code {
        display: none !important;
      }
    }
    .ambient-line-0 { --line: 0; }
    .ambient-line-1 { --line: 1; }
    .ambient-line-2 { --line: 2; }
    .ambient-line-3 { --line: 3; }