:root {
      --bg: #0f1020;
      --bg-soft: #17182e;
      --card: #1f2140;
      --primary: #5865f2;
      --primary-2: #7983ff;
      --text: #ffffff;
      --muted: #c8ccff;
      --muted-2: #aeb4d9;
      --line: rgba(255,255,255,.08);
      --shadow: 0 24px 80px rgba(10, 13, 38, .45);
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at 18% 14%, rgba(88, 72, 255, .18), transparent 22%),
        radial-gradient(circle at 82% 18%, rgba(120, 102, 255, .16), transparent 26%),
        linear-gradient(90deg, #070b24 0%, #171c72 46%, #2933c9 100%);
      color: var(--text);
      position: relative;
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      background:
        radial-gradient(circle at center 22%, rgba(72, 82, 255, .16), transparent 28%),
        radial-gradient(circle at 58% 78%, rgba(88, 74, 255, .14), transparent 30%),
        linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 100%);
    }

    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; display: block; }
    .container { width: min(1200px, calc(100% - 32px)); margin: 0 auto; }

    .page-bg-icons {
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      overflow: hidden;
    }

    .page-grain {
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      opacity: .75;
      background:
        radial-gradient(circle at 8% 12%, rgba(255,255,255,.9) 0 1px, transparent 1.8px),
        radial-gradient(circle at 14% 34%, rgba(255,255,255,.7) 0 .9px, transparent 1.7px),
        radial-gradient(circle at 22% 78%, rgba(255,255,255,.85) 0 1px, transparent 1.8px),
        radial-gradient(circle at 30% 18%, rgba(255,255,255,.75) 0 .9px, transparent 1.7px),
        radial-gradient(circle at 38% 52%, rgba(255,255,255,.65) 0 .8px, transparent 1.6px),
        radial-gradient(circle at 46% 26%, rgba(255,255,255,.85) 0 1px, transparent 1.8px),
        radial-gradient(circle at 54% 68%, rgba(255,255,255,.7) 0 .9px, transparent 1.7px),
        radial-gradient(circle at 63% 14%, rgba(255,255,255,.8) 0 1px, transparent 1.8px),
        radial-gradient(circle at 72% 42%, rgba(255,255,255,.7) 0 .9px, transparent 1.7px),
        radial-gradient(circle at 78% 82%, rgba(255,255,255,.82) 0 1px, transparent 1.8px),
        radial-gradient(circle at 86% 20%, rgba(255,255,255,.76) 0 .9px, transparent 1.7px),
        radial-gradient(circle at 92% 60%, rgba(255,255,255,.85) 0 1px, transparent 1.8px);
      filter: blur(.2px);
    }

    .nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 100;
      background: transparent;
      border-bottom: 1px solid transparent;
      box-shadow: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
    }

    .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .92) 0%, rgba(22, 28, 102, .9) 52%, rgba(40, 52, 190, .88) 100%);
      border-bottom-color: rgba(255,255,255,.05);
      box-shadow: 0 8px 24px rgba(5, 8, 28, .16);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    .nav-inner {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 28px;
      padding: 24px 0 12px;
    }

    .brand {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 16px;
      font-weight: 800;
      letter-spacing: .01em;
      font-size: 26px;
      color: #fff;
      white-space: nowrap;
      text-align: left;
    }

    .brand-logo {
      width: 44px;
      height: 34px;
      display: block;
      object-fit: contain;
      flex: 0 0 auto;
    }

    .brand-wordmark {
      display: inline-block;
      line-height: 1;
    }

    .nav-links {
      display: flex;
      justify-content: center;
      gap: 28px;
      color: rgba(255,255,255,.92);
      font-size: 13px;
      font-weight: 600;
    }

    .nav-links a {
      opacity: .95;
    }

    .nav-actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 14px 22px;
      border-radius: 999px;
      font-weight: 700;
      transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
      border: 1px solid transparent;
    }

    .btn:hover { transform: translateY(-2px); }

    .hero-btn {
      position: relative;
      overflow: hidden;
      min-width: 408px;
      min-height: 78px;
      padding: 20px 34px;
      border-radius: 24px;
      font-size: 18px;
      font-weight: 500;
      letter-spacing: 0;
      isolation: isolate;
    }

    .hero-btn::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      opacity: 0;
      transition: opacity .25s ease;
    }

    .hero-btn:hover::before {
      opacity: 1;
    }

    .hero-btn strong {
      font-weight: 500;
    }

    .hero-btn-icon {
      width: 28px;
      height: 28px;
      flex: 0 0 auto;
    }
    .btn-light {
      background: #fff;
      color: #1e223d;
      box-shadow: 0 10px 24px rgba(255,255,255,.18);
    }

    .hero-btn.btn-light {
      box-shadow: 0 12px 28px rgba(6, 8, 28, .12);
    }

    .hero-btn.btn-light::before {
      background: linear-gradient(135deg, #ffffff 0%, #eef2ff 45%, #dde5ff 100%);
    }

    .hero-btn.btn-light:hover {
      box-shadow: 0 18px 36px rgba(6, 8, 28, .18);
      color: #11162f;
    }

    .nav-login {
      padding: 11px 18px;
      font-size: 13px;
      font-weight: 700;
      box-shadow: none;
    }
    .btn-dark {
      background: rgba(17, 20, 40, .78);
      border-color: rgba(255,255,255,.08);
      color: #fff;
    }
    .btn-primary {
      background: linear-gradient(135deg, var(--primary) 0%, var(--primary-2) 100%);
      color: #fff;
      box-shadow: 0 20px 40px rgba(88,101,242,.34);
    }

    .hero-btn.btn-primary {
      background: linear-gradient(135deg, #5f6bff 0%, #6272ff 100%);
      box-shadow: 0 18px 34px rgba(62, 74, 220, .22);
    }

    .hero-btn.btn-primary::before {
      background: linear-gradient(135deg, #7b84ff 0%, #5a6fff 45%, #8a74ff 100%);
    }

    .hero-btn.btn-primary:hover {
      box-shadow: 0 24px 44px rgba(62, 74, 220, .3);
    }

    .hero {
      position: relative;
      overflow: hidden;
      padding: 110px 0 88px;
      min-height: 100vh;
      display: flex;
      align-items: center;
    }

    .hero::before,
    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .hero::before {
      background:
        radial-gradient(circle at 15% 18%, rgba(255,255,255,.22) 0 2px, transparent 3px),
        radial-gradient(circle at 30% 8%, rgba(255,255,255,.18) 0 1.5px, transparent 3px),
        radial-gradient(circle at 74% 14%, rgba(255,255,255,.2) 0 2px, transparent 3px),
        radial-gradient(circle at 88% 26%, rgba(255,255,255,.18) 0 1.5px, transparent 3px),
        radial-gradient(circle at 20% 70%, rgba(255,255,255,.12) 0 1.5px, transparent 3px),
        radial-gradient(circle at 80% 74%, rgba(255,255,255,.12) 0 2px, transparent 3px);
      opacity: .9;
    }

    .hero-icons {
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 0;
    }

    .bg-icon {
      position: absolute;
      opacity: .22;
      filter: blur(10px);
      transform-origin: center;
    }

    .bg-icon svg {
      display: block;
      width: 100%;
      height: 100%;
    }

    .bg-icon.discordish {
      left: 8%;
      bottom: 10%;
      width: 150px;
      height: 150px;
      color: rgba(233,237,255,.95);
      transform: rotate(-10deg);
    }

    .bg-icon.spark {
      left: 17%;
      bottom: 7%;
      width: 22px;
      height: 22px;
      color: rgba(221, 124, 255, .85);
      filter: blur(4px);
    }

    .bg-icon.coin {
      right: 16%;
      top: 14%;
      width: 74px;
      height: 74px;
      color: rgba(255,255,255,.18);
      transform: rotate(14deg);
      filter: blur(8px);
    }

    .bg-icon.potion {
      right: 28%;
      bottom: 12%;
      width: 66px;
      height: 66px;
      color: rgba(231,238,255,.28);
      transform: rotate(-12deg);
      filter: blur(8px);
    }

    .bg-icon.diamond {
      left: 28%;
      top: 18%;
      width: 38px;
      height: 38px;
      color: rgba(215, 140, 255, .32);
      transform: rotate(16deg);
      filter: blur(5px);
    }

    .bg-icon.starburst {
      right: 7%;
      bottom: 22%;
      width: 30px;
      height: 30px;
      color: rgba(255,255,255,.24);
      transform: rotate(-8deg);
      filter: blur(4px);
    }

    .bg-icon.ghost {
      left: 6%;
      top: 36%;
      width: 86px;
      height: 86px;
      color: rgba(231,236,255,.16);
      transform: rotate(-14deg);
      filter: blur(9px);
    }

    .bg-icon.capsule {
      right: 9%;
      top: 42%;
      width: 58px;
      height: 58px;
      color: rgba(215, 130, 255, .18);
      transform: rotate(18deg);
      filter: blur(7px);
    }

    .bg-icon.controller-mini {
      left: 14%;
      top: 66%;
      width: 94px;
      height: 54px;
      color: rgba(255,255,255,.14);
      transform: rotate(-10deg);
      filter: blur(8px);
    }

    .bg-icon.rune {
      right: 18%;
      top: 74%;
      width: 34px;
      height: 34px;
      color: rgba(255,255,255,.18);
      transform: rotate(12deg);
      filter: blur(4px);
    }

    .hero::after {
      background: linear-gradient(180deg, rgba(4, 7, 24, .03) 0%, rgba(23, 30, 115, .02) 100%);
    }

    .hero-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: .9fr 1.1fr;
      gap: 20px;
      align-items: center;
    }

    .eyebrow {
      display: none;
    }

    h1 {
      margin: 0;
      font-size: clamp(46px, 6vw, 74px);
      line-height: 1.06;
      letter-spacing: -.04em;
      max-width: 520px;
    }

    .hero-copy {
      padding-top: 10px;
    }

    .hero p {
      font-size: 18px;
      line-height: 1.8;
      color: #e8eaff;
      max-width: 500px;
      margin: 26px 0 0;
    }

    .hero-actions {
      display: flex;
      justify-content: center;
      gap: 28px;
      flex-wrap: wrap;
      margin-top: 42px;
    }

    .hero-visual {
      position: relative;
      height: 540px;
    }

    .hero-visual-img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      z-index: 1;
      filter: drop-shadow(0 30px 60px rgba(4, 8, 28, .28));
    }


    .hero-glow {
      position: absolute;
      inset: auto 10% 2% 10%;
      height: 120px;
      background: radial-gradient(circle, rgba(88,101,242,.5) 0%, rgba(88,101,242,.18) 40%, transparent 72%);
      filter: blur(22px);
    }

    .hero-monitor {
      position: absolute;
      right: 80px;
      top: 36px;
      width: 500px;
      height: 320px;
      background: linear-gradient(180deg, #25273d 0%, #161723 100%);
      border: 12px solid #3a3275;
      border-radius: 24px;
      box-shadow: 0 34px 90px rgba(6, 8, 32, .55);
      transform: rotate(-8deg);
      overflow: hidden;
    }

    .hero-monitor::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(255,255,255,.04) 0 17%, transparent 17% 100%),
        linear-gradient(180deg, rgba(255,255,255,.04) 0 12%, transparent 12% 100%);
      opacity: .5;
    }

    .monitor-ui {
      position: absolute;
      inset: 18px;
      border-radius: 14px;
      background: #11131d;
      overflow: hidden;
      display: grid;
      grid-template-columns: 64px 180px 1fr 54px;
    }

    .monitor-col,
    .monitor-main,
    .monitor-side {
      position: relative;
    }

    .monitor-col {
      background: #181b2a;
      border-right: 1px solid rgba(255,255,255,.04);
      padding: 12px 10px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .monitor-col span,
    .monitor-side span {
      display: block;
      height: 12px;
      border-radius: 999px;
      background: rgba(255,255,255,.08);
    }

    .monitor-col span:nth-child(1) { height: 36px; border-radius: 12px; background: linear-gradient(135deg,#fe73d4,#8d7cff); }
    .monitor-col span:nth-child(2),
    .monitor-col span:nth-child(3),
    .monitor-col span:nth-child(4) { height: 36px; border-radius: 12px; }

    .monitor-side {
      background: #141722;
      padding: 12px 10px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      border-left: 1px solid rgba(255,255,255,.04);
    }

    .monitor-main {
      background:
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)),
        #11131d;
      padding: 18px;
    }

    .monitor-main::before {
      content: "";
      position: absolute;
      left: 22px;
      top: 20px;
      width: 180px;
      height: 18px;
      border-radius: 999px;
      background: linear-gradient(90deg, #6b72ff, #9b83ff);
    }

    .monitor-main::after {
      content: "";
      position: absolute;
      left: 22px;
      top: 58px;
      width: calc(100% - 44px);
      height: 170px;
      border-radius: 18px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
        radial-gradient(circle at 48% 38%, rgba(107,114,255,.38), transparent 32%),
        #171a28;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
    }

    .monitor-list {
      position: absolute;
      left: 22px;
      top: 246px;
      right: 22px;
      display: grid;
      gap: 12px;
      z-index: 1;
    }

    .monitor-list span {
      height: 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.08);
    }

    .hero-stand {
      position: absolute;
      right: 246px;
      top: 344px;
      width: 110px;
      height: 76px;
      background: linear-gradient(180deg, #4a5096, #2d315f);
      clip-path: polygon(42% 0, 58% 0, 66% 36%, 100% 100%, 0 100%, 34% 36%);
      filter: drop-shadow(0 14px 22px rgba(0,0,0,.35));
    }

    .hero-phone {
      position: absolute;
      right: 20px;
      top: 170px;
      width: 118px;
      height: 226px;
      background: linear-gradient(180deg, #181925 0%, #2b2d42 100%);
      border: 8px solid #282741;
      border-radius: 28px;
      box-shadow: 0 24px 60px rgba(8, 9, 34, .45);
      overflow: hidden;
    }

    .hero-phone::before {
      content: "";
      position: absolute;
      left: 50%;
      top: 10px;
      transform: translateX(-50%);
      width: 40px;
      height: 6px;
      border-radius: 999px;
      background: rgba(255,255,255,.18);
    }

    .phone-ui {
      padding: 24px 12px 12px;
      display: grid;
      gap: 10px;
    }

    .phone-ui span {
      display: block;
      border-radius: 14px;
      background: rgba(255,255,255,.08);
    }

    .phone-ui span:nth-child(1) { height: 24px; background: linear-gradient(90deg, #6d7bff, #9d87ff); }
    .phone-ui span:nth-child(2) { height: 86px; }
    .phone-ui span:nth-child(3), .phone-ui span:nth-child(4) { height: 34px; }

    .hero-character,
    .hero-bot,
    .hero-controller,
    .hero-orb {
      position: absolute;
    }

    .hero-character {
      left: 18px;
      bottom: 98px;
      width: 130px;
      height: 210px;
      background: linear-gradient(180deg, rgba(0,0,0,0) 0 18%, #ffad85 18% 34%, #8a5bff 34% 62%, #1d2148 62% 100%);
      clip-path: polygon(40% 0, 55% 6%, 58% 18%, 73% 25%, 83% 46%, 72% 62%, 80% 100%, 62% 100%, 54% 76%, 42% 100%, 26% 100%, 35% 64%, 22% 44%, 28% 24%);
      filter: drop-shadow(0 12px 24px rgba(0,0,0,.35));
      opacity: .95;
    }

    .hero-bot {
      left: 188px;
      bottom: 56px;
      width: 92px;
      height: 108px;
      border-radius: 36px 36px 26px 26px;
      background: linear-gradient(180deg, #91c8ff 0%, #c9e3ff 100%);
      box-shadow: 0 16px 30px rgba(0,0,0,.28);
    }

    .hero-bot::before,
    .hero-bot::after {
      content: "";
      position: absolute;
      background: #fff;
    }

    .hero-bot::before {
      left: 16px;
      right: 16px;
      top: 24px;
      height: 24px;
      border-radius: 16px;
      background: #1e2348;
      box-shadow: inset 0 0 0 6px #dfefff;
    }

    .hero-bot::after {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      left: 37px;
      top: -10px;
      background: #7ec7ff;
      box-shadow: 0 0 0 8px rgba(126,199,255,.2);
    }

    .hero-controller {
      left: 250px;
      bottom: 44px;
      width: 158px;
      height: 58px;
      border-radius: 999px 999px 24px 24px;
      background: linear-gradient(135deg, #4730a8, #6c52e4 60%, #3b55cb);
      box-shadow: 0 18px 34px rgba(0,0,0,.32);
      transform: rotate(-8deg);
    }

    .hero-controller::before,
    .hero-controller::after {
      content: "";
      position: absolute;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: rgba(255,255,255,.5);
      top: 20px;
    }

    .hero-controller::before { left: 34px; }
    .hero-controller::after { right: 34px; }

    .hero-orb {
      left: 46%;
      top: 8px;
      width: 72px;
      height: 38px;
      border-radius: 0 0 40px 40px;
      background: linear-gradient(180deg, #ff86dc, #9f6cff);
      filter: blur(.2px);
      transform: rotate(8deg);
      opacity: .85;
    }

    .channels {
      padding: 22px 18px;
      border-right: 1px solid var(--line);
      background: rgba(20,22,40,.88);
    }

    .channels h3,
    .feed h3,
    .section-copy h2,
    .footer-col h3 { margin: 0; }

    .channel-group {
      margin-top: 18px;
    }

    .channel-title {
      color: rgba(255,255,255,.5);
      font-size: 12px;
      text-transform: uppercase;
      margin-bottom: 10px;
      letter-spacing: .06em;
    }

    .channel-item {
      padding: 10px 12px;
      border-radius: 12px;
      color: rgba(255,255,255,.76);
      font-size: 14px;
      margin-bottom: 6px;
      background: transparent;
    }

    .channel-item.active { background: rgba(255,255,255,.08); color: #fff; }

    .feed {
      padding: 22px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .room-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding-bottom: 18px;
      border-bottom: 1px solid var(--line);
    }

    .online {
      display: flex;
      gap: 8px;
      align-items: center;
      color: #d4d8ff;
      font-size: 13px;
    }

    .online span {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #43d675;
      display: inline-block;
    }

    .message {
      display: flex;
      gap: 14px;
      align-items: flex-start;
    }

    .avatar {
      width: 42px;
      height: 42px;
      border-radius: 14px;
      background: linear-gradient(135deg, #7983ff, #9aa1ff);
      flex: 0 0 auto;
    }

    .bubble {
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.06);
      border-radius: 18px;
      padding: 14px 16px;
      color: #eef1ff;
      line-height: 1.6;
      width: 100%;
    }

    .meta {
      font-size: 13px;
      color: rgba(255,255,255,.54);
      margin-bottom: 6px;
    }

    .stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-top: 18px;
    }

    .stat {
      padding: 16px;
      border-radius: 18px;
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.06);
    }

    .stat strong {
      display: block;
      font-size: 28px;
      margin-bottom: 8px;
    }

    .section {
      position: relative;
      z-index: 1;
      padding: 88px 0;
      background: transparent;
    }

    .feature {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 34px;
      align-items: center;
      margin-bottom: 26px;
    }

    .feature-showcase {
      position: relative;
      overflow: visible;
      grid-template-columns: 1.15fr .85fr;
      gap: 34px;
      padding: 36px 42px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 560px;
      margin-bottom: 112px;
    }

    .feature-stream {
      position: relative;
      grid-template-columns: .8fr 1.2fr;
      align-items: center;
      gap: 40px;
      margin-bottom: 112px;
      padding: 36px 42px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 560px;
    }

    .feature-stream-copy h2 {
      font-size: clamp(42px, 5vw, 64px);
      line-height: 1.05;
      letter-spacing: -.03em;
      margin: 0 0 18px;
    }

    .feature-stream-copy p {
      margin: 0;
      color: rgba(255,255,255,.88);
      font-size: 18px;
      line-height: 1.72;
      max-width: 420px;
    }

    .feature-stream-media {
      position: relative;
      min-height: 520px;
      border-radius: 52px;
      overflow: hidden;
    }

    .feature-stream::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      pointer-events: none;
      background:
        radial-gradient(circle at 94% 10%, rgba(255,255,255,.18) 0 2px, transparent 3px),
        radial-gradient(circle at 8% 20%, rgba(255,255,255,.12) 0 2px, transparent 3px),
        radial-gradient(circle at 14% 86%, rgba(255,255,255,.1) 0 10px, transparent 11px);
    }

    .feature-stream-media img,
    .feature-stream-media video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      object-position: center top;
      border-radius: inherit;
      transform: scale(1.045);
      transform-origin: center top;
    }

    .feature-stream-media-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-stream-media video {
      position: relative;
      z-index: 2;
    }

    .feature-stream-media.show-fallback video {
      display: none;
    }

    .feature-stream-media.show-fallback .feature-stream-media-fallback {
      z-index: 3;
    }

    .feature-drop {
      position: relative;
      overflow: visible;
      grid-template-columns: 1.15fr .85fr;
      gap: 34px;
      padding: 36px 42px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 560px;
      margin-bottom: 112px;
    }

    .feature-drop-media {
      position: relative;
      min-height: 480px;
      border-radius: 44px;
      overflow: hidden;
      background: #5a60ea;
    }

    .feature-drop-media img,
    .feature-drop-media video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .feature-drop-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-drop-media video {
      position: relative;
      z-index: 2;
    }

    .feature-drop-media.show-fallback video {
      display: none;
    }

    .feature-drop-media.show-fallback .feature-drop-fallback {
      z-index: 3;
    }

    .feature-drop-copy {
      position: relative;
      z-index: 2;
      color: #fff;
      padding-right: 24px;
    }

    .feature-drop-copy h2 {
      font-size: 52px;
      line-height: 1.08;
      margin: 0 0 18px;
    }

    .feature-drop-copy p {
      margin: 0;
      color: rgba(255,255,255,.9);
      font-size: 18px;
      line-height: 1.7;
      max-width: 420px;
    }

    .feature-box-badge {
      position: absolute;
      right: 52px;
      top: -54px;
      width: 136px;
      height: auto;
      z-index: 4;
      pointer-events: none;
      filter: drop-shadow(0 12px 24px rgba(16, 20, 60, .18));
    }

    .feature-box-badge img {
      display: block;
      width: 100%;
      height: auto;
    }

    .feature-marquee {
      width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      margin-bottom: 112px;
    }

    .feature-presence {
      position: relative;
      overflow: visible;
      grid-template-columns: .8fr 1.2fr;
      gap: 34px;
      padding: 36px 42px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 560px;
      margin-bottom: 148px;
      align-items: center;
    }

    .feature-presence-copy h2 {
      font-size: 52px;
      line-height: 1.08;
      margin: 0 0 18px;
    }

    .feature-presence-copy p {
      margin: 0;
      color: rgba(255,255,255,.9);
      font-size: 18px;
      line-height: 1.7;
      max-width: 420px;
    }

    .feature-presence-media {
      position: relative;
      min-height: 480px;
      border-radius: 44px;
      overflow: hidden;
      background: #5a60ea;
    }

    .feature-presence-media img,
    .feature-presence-media video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .feature-presence-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-presence-media video { position: relative; z-index: 2; }
    .feature-presence-media.show-fallback video { display: none; }
    .feature-presence-media.show-fallback .feature-presence-fallback { z-index: 3; }

    .feature-together {
      position: relative;
      overflow: visible;
      grid-template-columns: 1.05fr .8fr;
      gap: 28px;
      padding: 28px 30px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(69, 74, 217, .96) 0%, rgba(48, 57, 190, .92) 46%, rgba(28, 22, 88, .96) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 500px;
      margin-bottom: 112px;
      align-items: center;
    }

    .feature-together::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(circle at 10% 10%, rgba(255,255,255,.12) 0 2px, transparent 3px),
        radial-gradient(circle at 6% 16%, rgba(255,255,255,.08) 0 44px, transparent 46px),
        radial-gradient(circle at 92% 88%, rgba(160, 84, 255, .16) 0 24px, transparent 26px),
        radial-gradient(circle at 84% 18%, rgba(255,255,255,.08) 0 2px, transparent 3px);
    }

    .feature-together-copy {
      position: relative;
      z-index: 2;
      min-height: 360px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 28px 26px;
      border-radius: 40px;
      background: transparent;
    }

    .feature-together-copy h2 {
      font-size: 44px;
      line-height: 1.08;
      margin: 0 0 14px;
    }

    .feature-together-copy p {
      margin: 0;
      color: rgba(255,255,255,.9);
      font-size: 16px;
      line-height: 1.7;
      max-width: 360px;
    }

    .feature-together-media {
      position: relative;
      min-height: 400px;
      border-radius: 36px;
      overflow: hidden;
      background: #2e3190;
      z-index: 2;
    }

    .feature-together-media img,
    .feature-together-media video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .feature-together-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-together-media video { position: relative; z-index: 2; }
    .feature-together-media.show-fallback video { display: none; }
    .feature-together-media.show-fallback .feature-together-fallback { z-index: 3; }

    .feature-platforms {
      position: relative;
      overflow: visible;
      grid-template-columns: .78fr 1.22fr;
      gap: 34px;
      padding: 36px 42px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 560px;
      margin-bottom: 112px;
      align-items: center;
    }

    .feature-platforms-copy h2 {
      font-size: 52px;
      line-height: 1.08;
      margin: 0 0 18px;
      max-width: 420px;
    }

    .feature-platforms-copy p {
      margin: 0;
      color: rgba(255,255,255,.9);
      font-size: 18px;
      line-height: 1.7;
      max-width: 420px;
    }

    .feature-platforms-media {
      position: relative;
      min-height: 480px;
      border-radius: 44px;
      overflow: hidden;
      background: #4d54db;
    }

    .feature-platforms-media img,
    .feature-platforms-media video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .feature-platforms-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-platforms-media video { position: relative; z-index: 2; }
    .feature-platforms-media.show-fallback video { display: none; }
    .feature-platforms-media.show-fallback .feature-platforms-fallback { z-index: 3; }

    .faq-section {
      margin-bottom: 112px;
      position: relative;
    }

    .faq-shell {
      position: relative;
      display: grid;
      grid-template-columns: 1fr;
      gap: 30px;
      padding: 56px 42px 40px;
      border-radius: 56px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      overflow: hidden;
    }

    .faq-key {
      position: absolute;
      right: 34px;
      top: -10px;
      width: 150px;
      height: auto;
      z-index: 2;
      pointer-events: none;
    }

    .faq-head {
      position: relative;
      top: auto;
      text-align: center;
      z-index: 1;
    }

    .faq-tabs {
      display: flex;
      justify-content: center;
      gap: 12px;
      flex-wrap: wrap;
      margin-top: 26px;
    }

    .faq-tab {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 40px;
      padding: 10px 18px;
      border-radius: 14px;
      background: transparent;
      color: rgba(255,255,255,.66);
      border: 1px solid transparent;
      font-size: 14px;
      font-weight: 700;
      cursor: pointer;
      transition: .2s ease;
    }

    .faq-tab.active {
      background: #fff;
      color: #111321;
    }

    .faq-head h2 {
      margin: 0 0 12px;
      font-size: clamp(40px, 5vw, 58px);
      line-height: 1.05;
      letter-spacing: -.03em;
      max-width: none;
    }

    .faq-head p {
      margin: 0 auto;
      color: rgba(255,255,255,.8);
      font-size: 18px;
      line-height: 1.7;
      max-width: 560px;
    }

    .faq-list {
      display: grid;
      gap: 0;
      position: relative;
      z-index: 1;
    }

    .faq-panel {
      display: none;
    }

    .faq-panel.active {
      display: grid;
      gap: 0;
    }

    .faq-item {
      border-radius: 0;
      background: transparent;
      border: none;
      border-bottom: 1px solid rgba(255,255,255,.12);
      overflow: hidden;
    }

    .faq-item:first-child {
      border-top: 1px solid rgba(255,255,255,.12);
    }

    .faq-item summary {
      list-style: none;
      cursor: pointer;
      padding: 26px 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      font-size: 18px;
      font-weight: 700;
    }

    .faq-item summary::-webkit-details-marker { display: none; }

    .faq-item summary::after {
      content: "+";
      font-size: 30px;
      line-height: 1;
      color: rgba(255,255,255,.92);
      flex: 0 0 auto;
      transition: transform .2s ease;
    }

    .faq-item[open] summary::after {
      transform: rotate(45deg);
    }

    .faq-answer {
      padding: 0 0 24px;
      color: rgba(255,255,255,.76);
      font-size: 16px;
      line-height: 1.75;
      max-width: 900px;
    }

    .faq-answer p { margin: 0; }

    .feature-together-characters {
      position: absolute;
      right: 52px;
      top: -116px;
      width: 300px;
      height: auto;
      z-index: 6;
      pointer-events: none;
    }

    .feature-together-carrot {
      position: absolute;
      left: -18px;
      bottom: -44px;
      width: 144px;
      height: auto;
      z-index: 6;
      pointer-events: none;
      filter: drop-shadow(0 12px 24px rgba(18, 13, 56, .24));
    }

    .marquee-wrap {
      position: relative;
      overflow: hidden;
      border-radius: 0;
      background: rgba(8, 11, 36, .42);
      border-top: 1px solid rgba(255,255,255,.08);
      border-bottom: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 18px 48px rgba(9, 12, 40, .18);
      padding: 28px 0;
    }

    .marquee-track {
      display: flex;
      width: max-content;
      animation: marquee-scroll 24s linear infinite;
      will-change: transform;
    }

    .marquee-group {
      display: flex;
      align-items: center;
      gap: 42px;
      padding-right: 42px;
      flex: 0 0 auto;
    }

    .marquee-item {
      display: inline-flex;
      align-items: center;
      gap: 22px;
      color: #fff;
      font-size: 60px;
      font-weight: 800;
      letter-spacing: -.03em;
      white-space: nowrap;
    }

    .marquee-icon {
      width: 44px;
      height: 34px;
      display: inline-block;
      object-fit: contain;
      transform: translateY(2px);
    }

    @keyframes marquee-scroll {
      from { transform: translateX(0); }
      to { transform: translateX(-50%); }
    }

    .feature-showcase::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 12% 90%, rgba(255,255,255,.12) 0 10px, transparent 11px),
        radial-gradient(circle at 7% 94%, rgba(255,255,255,.1) 0 18px, transparent 19px),
        radial-gradient(circle at 94% 8%, rgba(255,255,255,.18) 0 2px, transparent 3px),
        radial-gradient(circle at 90% 16%, rgba(255,255,255,.14) 0 1.5px, transparent 3px),
        radial-gradient(circle at 4% 18%, rgba(255,255,255,.12) 0 3px, transparent 4px),
        radial-gradient(circle at 48% 12%, rgba(255,255,255,.12) 0 2px, transparent 3px);
      pointer-events: none;
    }

    .feature-art {
      position: relative;
      min-height: 480px;
      border-radius: 44px;
      overflow: hidden;
    }

    .feature-art video,
    .feature-art img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .feature-art {
      background: radial-gradient(circle at 50% 100%, #ff4ec8 0%, #f13eb8 18%, #932b58 58%, #472032 100%);
    }

    .feature-art-fallback {
      position: absolute;
      inset: 0;
      z-index: 1;
    }

    .feature-art video {
      position: relative;
      z-index: 2;
    }

    .feature-art.show-fallback video {
      display: none;
    }

    .feature-art.show-fallback .feature-art-fallback {
      z-index: 3;
    }

    .feature-copy {
      position: relative;
      z-index: 2;
      color: #fff;
      padding-right: 24px;
    }

    .feature-copy h2 {
      font-size: 52px;
      line-height: 1.08;
      margin-bottom: 18px;
    }

    .feature-copy p {
      color: rgba(255,255,255,.9);
      font-size: 18px;
      line-height: 1.7;
      max-width: 420px;
    }

    .feature-bot-badge {
      position: absolute;
      right: 166px;
      top: -82px;
      width: 132px;
      height: auto;
      z-index: 4;
      pointer-events: none;
      filter: drop-shadow(0 10px 22px rgba(16, 20, 60, .18));
    }

    .feature-bot-badge img {
      display: block;
      width: 100%;
      height: auto;
    }

    .feature.reverse .section-copy { order: 2; }
    .feature.reverse .visual-card { order: 1; }

    .visual-card {
      background: linear-gradient(180deg, rgba(31,33,64,.95) 0%, rgba(19,21,38,.95) 100%);
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 28px;
      padding: 28px;
      box-shadow: var(--shadow);
    }

    .panel {
      border-radius: 22px;
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.06);
      padding: 22px;
    }

    .panel + .panel { margin-top: 14px; }

    .badge-row {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 16px;
    }

    .badge {
      padding: 10px 14px;
      border-radius: 999px;
      background: rgba(121,131,255,.18);
      color: #e8eaff;
      font-size: 13px;
      border: 1px solid rgba(121,131,255,.22);
    }

    .section-copy h2 {
      font-size: clamp(34px, 5vw, 56px);
      line-height: 1.05;
      letter-spacing: -.03em;
      margin-bottom: 16px;
    }

    .section-copy p {
      margin: 0;
      color: var(--muted-2);
      font-size: 18px;
      line-height: 1.75;
      max-width: 560px;
    }

    .section-copy .mini-label {
      display: inline-block;
      color: #cdd2ff;
      font-size: 13px;
      text-transform: uppercase;
      letter-spacing: .08em;
      margin-bottom: 12px;
    }

    .cta {
      padding: 56px 42px 0;
      border-radius: 40px;
      background: transparent;
      border: none;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 64px;
      text-align: center;
      box-shadow: none;
      overflow: hidden;
    }

    .cta h2 {
      margin: 0;
      font-size: clamp(42px, 6vw, 72px);
      line-height: 1.08;
      letter-spacing: -.04em;
    }

    .cta p {
      display: none;
      margin: 0;
      color: var(--muted);
      max-width: 620px;
      line-height: 1.7;
    }

    .cta-scene {
      width: min(1100px, 100%);
      height: auto;
      display: block;
      margin-top: 34px;
    }

    footer {
      position: relative;
      z-index: 1;
      padding: 28px 0 0;
      border-top: none;
      background: transparent;
      overflow: hidden;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.15fr repeat(4, 1fr);
      gap: 34px;
      align-items: start;
      padding-top: 18px;
    }

    .footer-brand-block {
      display: flex;
      flex-direction: column;
      gap: 22px;
      align-items: flex-start;
      text-align: left;
    }

    .footer-lang-label,
    .footer-social-label {
      font-size: 14px;
      color: rgba(255,255,255,.9);
      margin-bottom: 10px;
    }

    .footer-lang {
      width: 100%;
      max-width: 320px;
      appearance: none;
      -webkit-appearance: none;
      border: 1px solid rgba(255,255,255,.06);
      background: rgba(255,255,255,.08);
      color: #fff;
      border-radius: 22px;
      padding: 18px 52px 18px 18px;
      font-size: 16px;
      line-height: 1.2;
      background-image: linear-gradient(45deg, transparent 50%, white 50%), linear-gradient(135deg, white 50%, transparent 50%);
      background-position: calc(100% - 24px) calc(50% - 3px), calc(100% - 16px) calc(50% - 3px);
      background-size: 8px 8px, 8px 8px;
      background-repeat: no-repeat;
    }

    .footer-socials {
      display: flex;
      gap: 18px;
      flex-wrap: wrap;
    }

    .footer-socials a {
      width: 34px;
      height: 34px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #fff;
    }

    .footer-socials svg {
      width: 28px;
      height: 28px;
      fill: currentColor;
    }

    .footer-col h3 {
      margin: 0 0 18px;
      color: rgba(255,255,255,.95);
      font-size: 15px;
    }

    .footer-col a {
      display: block;
      color: rgba(255,255,255,.78);
      margin-top: 12px;
      font-size: 14px;
    }

    .footer-big-logo {
      width: 100%;
      margin: 34px 0 0;
      overflow: hidden;
    }

    .footer-big-wordmark {
      display: block;
      font-size: clamp(150px, 24vw, 320px);
      line-height: .78;
      font-weight: 900;
      letter-spacing: 0.01em;
      color: #d9dcff;
      white-space: nowrap;
      transform: translateX(-10px);
      user-select: none;
      opacity: .96;
    }

    @media (max-width: 1024px) {
      .hero-grid,
      .feature,
      .feature-showcase,
      .feature-stream,
      .feature-drop,
      .feature-presence,
      .feature-together,
      .feature-platforms,
      .footer-grid,
      .cta,
      .chat-shell {
        grid-template-columns: 1fr;
      }

      .nav-inner { grid-template-columns: auto auto; }
      .nav-links { display: none; }
      .brand { font-size: 22px; gap: 12px; }
      .brand-logo { width: 36px; height: 28px; }
      .stats { grid-template-columns: 1fr; }
      .feature.reverse .section-copy,
      .feature.reverse .visual-card { order: initial; }
      .hero { min-height: auto; padding-top: 96px; }
      .hero-grid { gap: 8px; }
      .hero-copy { text-align: center; }
      h1, .hero p { max-width: none; }
      .hero-visual { height: 480px; }
      .hero-monitor { right: 54px; width: 420px; height: 280px; }
      .hero-stand { right: 190px; top: 308px; }
      .hero-phone { right: 0; top: 172px; }
      .hero-character { left: 42px; bottom: 74px; }
      .hero-bot { left: 196px; bottom: 36px; }
      .hero-controller { left: 250px; bottom: 28px; }
      .bg-icon.discordish { left: 2%; bottom: 8%; width: 124px; height: 124px; }
      .bg-icon.coin { right: 8%; top: 10%; }
      .bg-icon.potion { right: 22%; bottom: 10%; width: 58px; height: 58px; }
      .bg-icon.diamond { left: 24%; top: 16%; }
      .bg-icon.starburst { right: 4%; bottom: 18%; }
      .bg-icon.ghost { left: 2%; top: 34%; }
      .bg-icon.capsule { right: 3%; top: 44%; }
      .bg-icon.controller-mini { left: 8%; top: 70%; }
      .bg-icon.rune { right: 14%; top: 78%; }
      .feature-showcase { min-height: auto; padding: 30px; border-radius: 40px; }
      .feature-art { min-height: 420px; }
      .feature-copy { padding-right: 0; }
      .feature-copy h2 { font-size: 44px; }
      .feature-stream { min-height: auto; padding: 30px; border-radius: 40px; }
      .feature-stream-media { min-height: 420px; border-radius: 40px; }
      .feature-drop { min-height: auto; padding: 30px; border-radius: 40px; }
      .feature-drop-media { min-height: 420px; border-radius: 40px; }
      .feature-drop-copy h2 { font-size: 44px; }
      .feature-presence { min-height: auto; padding: 30px; border-radius: 40px; }
      .feature-presence-media { min-height: 420px; border-radius: 40px; }
      .feature-presence-copy h2 { font-size: 44px; }
      .feature-together { min-height: auto; padding: 26px; border-radius: 40px; }
      .feature-together-media { min-height: 360px; border-radius: 32px; }
      .feature-together-copy { min-height: 320px; border-radius: 32px; padding: 24px; }
      .feature-together-copy h2 { font-size: 38px; }
      .feature-platforms { min-height: auto; padding: 30px; border-radius: 40px; }
      .feature-platforms-media { min-height: 420px; border-radius: 40px; }
      .feature-platforms-copy h2 { font-size: 44px; }
    }

    @media (max-width: 720px) {
      .nav-actions .btn-dark { display: none; }
      .nav-inner { padding: 18px 0 8px; }
      .section { padding: 64px 0; }
      .cta { padding: 24px 18px 0; }
      .visual-card { padding: 18px; border-radius: 24px; }
      .channels { display: none; }
      .room-head { padding-bottom: 14px; }
      .feed { padding: 18px; }
      h1 { font-size: 42px; }
      .hero p { font-size: 16px; }
      .hero-actions { margin-top: 26px; gap: 16px; }
      .hero-actions .btn,
      .hero-btn { width: 100%; min-width: 0; min-height: 64px; font-size: 16px; border-radius: 20px; }
      .hero-btn-icon { width: 24px; height: 24px; }
      .hero-visual { height: 320px; transform: scale(.84); transform-origin: center top; }
      .hero-monitor { right: 36px; top: 24px; width: 330px; height: 220px; border-width: 8px; }
      .monitor-ui { grid-template-columns: 46px 110px 1fr 34px; inset: 12px; }
      .hero-stand { right: 148px; top: 242px; width: 74px; height: 52px; }
      .hero-phone { right: 0; top: 118px; width: 84px; height: 164px; border-width: 6px; }
      .hero-character { left: 0; bottom: 56px; width: 96px; height: 158px; }
      .hero-bot { left: 122px; bottom: 22px; width: 70px; height: 80px; }
      .hero-controller { left: 176px; bottom: 14px; width: 108px; height: 40px; }
      .hero-orb { width: 54px; height: 28px; }
      .bg-icon.discordish { left: -4%; bottom: 6%; width: 92px; height: 92px; }
      .bg-icon.spark { left: 10%; bottom: 5%; }
      .bg-icon.coin { right: 2%; top: 10%; width: 56px; height: 56px; }
      .bg-icon.potion { right: 18%; bottom: 9%; width: 48px; height: 48px; }
      .bg-icon.diamond { left: 20%; top: 14%; width: 28px; height: 28px; }
      .bg-icon.starburst { right: 3%; bottom: 20%; width: 22px; height: 22px; }
      .bg-icon.ghost { left: -4%; top: 38%; width: 64px; height: 64px; }
      .bg-icon.capsule { right: 1%; top: 46%; width: 42px; height: 42px; }
      .bg-icon.controller-mini { left: 4%; top: 73%; width: 68px; height: 40px; }
      .bg-icon.rune { right: 8%; top: 82%; width: 24px; height: 24px; }
      .feature-showcase { padding: 22px; border-radius: 32px; gap: 22px; }
      .feature-art { min-height: 320px; border-radius: 30px; }
      .feature-copy h2 { font-size: 34px; }
      .feature-copy p { font-size: 16px; }
      .feature-bot-badge { right: 68px; top: -58px; width: 104px; transform: none; }
      .feature-stream { gap: 24px; padding: 22px; border-radius: 32px; min-height: auto; }
      .feature-stream-copy h2 { font-size: 34px; }
      .feature-stream-copy p { font-size: 16px; }
      .feature-stream-media { min-height: 280px; border-radius: 28px; }
      .feature-drop { gap: 22px; padding: 22px; border-radius: 32px; min-height: auto; }
      .feature-drop-media { min-height: 280px; border-radius: 28px; }
      .feature-drop-copy h2 { font-size: 34px; }
      .feature-drop-copy p { font-size: 16px; }
      .feature-box-badge { right: 24px; top: -38px; width: 96px; }
      .feature-presence { gap: 22px; padding: 22px; border-radius: 32px; min-height: auto; margin-bottom: 132px; }
      .feature-presence-media { min-height: 280px; border-radius: 28px; }
      .feature-presence-copy h2 { font-size: 34px; }
      .feature-presence-copy p { font-size: 16px; }
      .feature-together { gap: 22px; padding: 22px; border-radius: 32px; min-height: auto; }
      .feature-together-media { min-height: 280px; border-radius: 28px; }
      .feature-together-copy { min-height: auto; border-radius: 32px; padding: 22px; }
      .feature-together-copy h2 { font-size: 34px; }
      .feature-together-copy p { font-size: 16px; }
      .feature-together-characters { right: 18px; top: -58px; width: 190px; }
      .feature-together-carrot { left: -10px; bottom: -24px; width: 92px; }
      .feature-platforms { gap: 22px; padding: 22px; border-radius: 32px; min-height: auto; }
      .feature-platforms-media { min-height: 280px; border-radius: 28px; }
      .feature-platforms-copy h2 { font-size: 34px; }
      .feature-platforms-copy p { font-size: 16px; }
      .faq-section { margin-bottom: 112px; }
      .faq-shell { grid-template-columns: 1fr; padding: 28px 20px 22px; border-radius: 32px; }
      .faq-key { right: 8px; top: 6px; width: 90px; }
      .faq-head { position: static; }
      .faq-head h2 { font-size: 34px; max-width: none; }
      .faq-head p { font-size: 16px; max-width: none; }
      .faq-tabs { gap: 8px; margin-top: 18px; }
      .faq-tab { min-height: 34px; padding: 8px 12px; font-size: 12px; border-radius: 10px; }
      .faq-item { border-radius: 0; }
      .faq-item summary { padding: 20px 0; font-size: 16px; }
      .faq-answer { padding: 0 0 18px; font-size: 15px; }
      .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px; }
      .footer-lang { max-width: none; }
      .footer-big-logo { margin: 26px 0 0; }
      .footer-big-wordmark { transform: translateX(-4px); }
      .feature-marquee { margin-bottom: 112px; }
      .marquee-wrap { border-radius: 0; padding: 16px 0; }
      .marquee-group { gap: 24px; padding-right: 24px; }
      .marquee-item { font-size: 34px; gap: 12px; }
      .marquee-icon { width: 24px; height: 18px; }
    }

    body.download-page .section {
      background: transparent;
    }

    .download-hero {
      padding-top: 118px;
      padding-bottom: 54px;
    }

    .download-hero-shell {
      position: relative;
      min-height: 470px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      text-align: center;
      overflow: hidden;
    }

    .download-hero-headline-row {
      display: flex;
      align-items: flex-start;
      justify-content: center;
      gap: 20px;
      margin-top: 8px;
    }

    .download-coin {
      width: 118px;
      flex: 0 0 auto;
      margin-top: -6px;
    }

    .download-coin img {
      width: 100%;
      display: block;
    }

    .download-hero-copy {
      max-width: 1180px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .download-hero-copy h1 {
      margin: 0;
      font-size: clamp(58px, 7vw, 110px);
      line-height: .88;
      letter-spacing: -.065em;
      font-weight: 900;
      text-transform: uppercase;
      max-width: 1080px;
      text-wrap: balance;
    }

    .download-hero-copy h1 span {
      display: inline-block;
      margin: 0 .04em;
    }

    .download-hero-copy p {
      margin: 18px auto 0;
      color: rgba(255,255,255,.9);
      font-size: 18px;
      line-height: 1.55;
      max-width: 900px;
    }

    .download-hero-actions {
      display: flex;
      justify-content: center;
      gap: 16px;
      flex-wrap: wrap;
      margin-top: 28px;
    }

    .download-hero-stage {
      width: min(1120px, 100%);
      margin: 52px auto 0;
    }

    .download-stage-scene {
      width: 100%;
      display: block;
      filter: drop-shadow(0 28px 70px rgba(0,0,0,.4));
    }

    .download-card-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 72px;
    }

    .download-card {
      padding: 34px 30px;
      border-radius: 38px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 26px 80px rgba(10, 13, 38, .24);
      min-height: 280px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 22px;
    }

    .download-card-large {
      grid-column: span 2;
      min-height: 320px;
    }

    .download-desktop-feature {
      display: grid;
      grid-template-columns: minmax(0, 390px) minmax(0, 1fr);
      align-items: center;
      gap: 28px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      padding: 38px 36px;
      overflow: hidden;
      max-width: 1180px;
      margin: 0 auto;
    }

    .download-desktop-copy {
      display: flex;
      flex-direction: column;
      gap: 28px;
      align-items: flex-start;
    }

    .download-os-pills {
      gap: 10px;
    }

    .download-os-pill {
      width: 104px;
      height: 32px;
      padding: 0 14px;
      border-radius: 12px;
      background: #fff !important;
      color: #111426 !important;
      font-size: 14px;
      font-weight: 700;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      box-sizing: border-box;
      border: 1px solid rgba(255,255,255,.88);
      transition: transform .22s ease, box-shadow .22s ease, background .28s ease, color .28s ease;
      transform-origin: center;
      will-change: transform;
    }

    .download-os-pill img {
      width: 16px;
      height: 16px;
      display: block;
    }

    .download-desktop-visual-wrap {
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }

    .download-desktop-visual {
      width: min(100%, 460px);
      display: block;
      border-radius: 38px;
    }

    .download-mobile-feature {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 390px);
      align-items: center;
      gap: 28px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      padding: 38px 36px;
      overflow: hidden;
      max-width: 1180px;
      margin: 0 auto;
    }

    .download-mobile-visual-wrap {
      display: flex;
      align-items: center;
      justify-content: flex-start;
    }

    .download-mobile-visual {
      width: min(100%, 460px);
      display: block;
    }

    .download-mobile-copy {
      display: flex;
      flex-direction: column;
      gap: 28px;
      align-items: flex-start;
    }

    .download-console-feature {
      display: grid;
      grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
      align-items: center;
      gap: 28px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      padding: 38px 36px;
      overflow: hidden;
      max-width: 1180px;
      margin: 0 auto;
    }

    .download-console-copy {
      display: flex;
      flex-direction: column;
      gap: 28px;
      align-items: flex-start;
    }

    .download-console-visual-wrap {
      display: flex;
      align-items: center;
      justify-content: flex-end;
    }

    .download-console-visual {
      width: min(100%, 460px);
      display: block;
      border-radius: 38px;
    }

    .download-vr-feature {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
      align-items: center;
      gap: 28px;
      background: linear-gradient(135deg, rgba(112, 122, 255, .7) 0%, rgba(79, 87, 210, .58) 45%, rgba(56, 60, 170, .55) 100%);
      padding: 38px 36px;
      overflow: hidden;
      max-width: 1180px;
      margin: 0 auto;
    }

    .download-vr-visual-wrap {
      display: flex;
      align-items: center;
      justify-content: flex-start;
    }

    .download-vr-visual {
      width: min(100%, 460px);
      display: block;
      border-radius: 38px;
    }

    .download-vr-copy {
      display: flex;
      flex-direction: column;
      gap: 28px;
      align-items: flex-start;
    }

    .download-store-buttons {
      gap: 12px;
    }

    .download-card-copy h2,
    .download-ptb h2 {
      margin: 0 0 14px;
      font-size: clamp(32px, 4vw, 48px);
      line-height: 1.08;
      letter-spacing: -.03em;
    }

    .download-card-copy p,
    .download-ptb p {
      margin: 0;
      color: rgba(255,255,255,.84);
      font-size: 17px;
      line-height: 1.75;
      max-width: 720px;
    }

    .download-os-list,
    .download-store-links {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .download-os,
    .store-chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 10px 16px;
      border-radius: 14px;
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.08);
      color: #fff;
      font-size: 14px;
      font-weight: 700;
    }

    .download-os.active,
    .store-chip:hover {
      background: #fff;
      color: #12162f;
    }

    .download-os-pill:hover,
    .download-os-pill:visited,
    .download-os-pill:active {
      background: linear-gradient(135deg, #7c83ff 0%, #92a0ff 52%, #b0b8ff 100%) !important;
      color: #fff !important;
    }

    .download-os-pill:hover {
      animation: downloadButtonWiggle .36s ease-in-out 1;
      transform: translateY(-2px);
      box-shadow: 0 12px 24px rgba(10, 13, 38, .16);
    }

    .download-os-pill.active {
      background: linear-gradient(135deg, #7c83ff 0%, #92a0ff 52%, #b0b8ff 100%) !important;
      color: #fff !important;
      box-shadow: 0 0 0 2px rgba(88, 101, 242, .42);
    }

    .download-btn {
      align-self: flex-start;
    }

    .download-page .btn {
      transition: transform .22s ease, box-shadow .22s ease, background .56s ease, color .38s ease;
      transform-origin: center;
      will-change: transform;
    }

    .download-page .btn:hover {
      animation: downloadButtonWiggle .36s ease-in-out 1;
      transform: translateY(-2px);
      box-shadow: 0 14px 28px rgba(10, 13, 38, .18);
    }

    .download-page .btn.btn-primary:hover {
      background: linear-gradient(135deg, #7c83ff 0%, #9b8cff 52%, #b681ff 100%);
      color: #fff;
    }

    .download-page .btn.btn-light:hover {
      background: linear-gradient(135deg, #ffffff 0%, #eef2ff 52%, #dddfff 100%);
      color: #111426;
    }
+
+    @keyframes downloadButtonWiggle {
+      0% { transform: translateY(0) rotate(0deg); }
+      25% { transform: translateY(-2px) rotate(-1.2deg); }
+      50% { transform: translateY(-2px) rotate(1.2deg); }
+      75% { transform: translateY(-2px) rotate(-.8deg); }
+      100% { transform: translateY(-2px) rotate(0deg); }
+    }

    .faq-section {
      margin-top: 88px;
    }

    .download-ptb {
      position: relative;
      margin-top: 54px;
      padding: 54px 120px 60px;
      border-radius: 0;
      background: transparent;
      border: 0;
      box-shadow: none;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 24px;
      text-align: center;
      overflow: hidden;
      min-height: 280px;
    }

    .download-ptb-copy {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 20px;
      max-width: 720px;
      position: relative;
      z-index: 2;
    }

    .download-ptb-copy .btn {
      margin-top: 6px;
    }

    .download-ptb-carrot,
    .download-ptb-trophy {
      position: absolute;
      display: block;
      z-index: 1;
      filter: drop-shadow(0 18px 40px rgba(10, 10, 40, .28));
    }

    .download-ptb-carrot {
      left: 40px;
      top: 10px;
      width: 126px;
      transform: rotate(-18deg);
    }

    .download-ptb-trophy {
      right: 62px;
      top: 44px;
      width: 150px;
      transform: rotate(10deg);
    }

    @media (max-width: 1024px) {
      .download-card-grid,
      .download-ptb {
        grid-template-columns: 1fr;
      }

      .download-card-large {
        grid-column: span 1;
      }

      .download-desktop-feature,
      .download-mobile-feature,
      .download-console-feature,
      .download-vr-feature {
        grid-template-columns: 1fr;
        padding: 30px 24px;
      }

      .download-desktop-visual-wrap,
      .download-mobile-visual-wrap,
      .download-console-visual-wrap,
      .download-vr-visual-wrap {
        justify-content: center;
      }

      .download-hero-shell {
        min-height: 420px;
      }

      .download-hero-headline-row {
        align-items: center;
      }

      .download-hero-stage {
        margin-top: 40px;
      }
    }

    @media (max-width: 720px) {
      .download-hero {
        padding-top: 98px;
        padding-bottom: 32px;
      }

      .download-hero-headline-row {
        gap: 12px;
        align-items: flex-start;
      }

      .download-coin {
        width: 84px;
      }

      .download-hero-copy h1 {
        font-size: clamp(38px, 12vw, 64px);
      }

      .download-hero-copy p,
      .download-card-copy p,
      .download-ptb p {
        font-size: 16px;
      }

      .download-card {
        padding: 24px 20px;
        border-radius: 28px;
      }

      .download-ptb {
        padding: 40px 24px 34px;
        min-height: 220px;
      }

      .download-ptb-carrot {
        left: 6px;
        top: 8px;
        width: 82px;
      }

      .download-ptb-trophy {
        right: 8px;
        top: 34px;
        width: 96px;
      }

      .download-desktop-feature,
      .download-mobile-feature,
      .download-console-feature,
      .download-vr-feature {
        padding: 24px 20px;
      }

      .download-desktop-visual,
      .download-mobile-visual,
      .download-console-visual,
      .download-vr-visual {
        width: 100%;
        border-radius: 28px;
      }

      .download-hero-stage {
        margin-top: 28px;
      }
    }

    .about-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .about-hero {
      padding-top: 126px;
      padding-bottom: 40px;
    }

    .about-hero-shell {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
      gap: 34px;
      align-items: center;
    }

    .about-hero-copy h1,
    .about-section-head h2,
    .about-story-copy h2,
    .about-cta-card h2 {
      margin: 0;
      font-size: clamp(40px, 5.3vw, 72px);
      line-height: .98;
      letter-spacing: -.03em;
    }

    .about-hero-copy p,
    .about-story-copy p,
    .about-cta-card p,
    .about-stat-card p,
    .about-pillar-card p,
    .about-rail-card p,
    .about-timeline-content p,
    .about-core-card p,
    .about-float-card span {
      margin: 0;
      color: rgba(255,255,255,.78);
      font-size: 18px;
      line-height: 1.8;
    }

    .about-hero-copy {
      display: grid;
      gap: 24px;
      max-width: 720px;
    }

    .about-hero-actions,
    .about-cta-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      align-items: center;
    }

    .about-hero-actions .btn,
    .about-cta-actions .btn {
      min-height: 56px;
      padding: 16px 28px;
      border-radius: 18px;
    }

    .about-hero-panel {
      position: relative;
      min-height: 560px;
      border-radius: 38px;
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.09);
      background:
        radial-gradient(circle at 28% 28%, rgba(133, 113, 255, .36), transparent 26%),
        radial-gradient(circle at 72% 70%, rgba(113, 204, 255, .22), transparent 30%),
        linear-gradient(180deg, rgba(21, 26, 74, .94), rgba(15, 18, 42, .98));
      box-shadow: 0 34px 90px rgba(7, 10, 35, .34);
    }

    .about-core-card,
    .about-float-card,
    .about-stat-card,
    .about-pillar-card,
    .about-rail-card,
    .about-cta-card {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .about-core-card {
      position: absolute;
      left: 38px;
      right: 38px;
      top: 122px;
      padding: 30px 28px;
      border-radius: 30px;
    }

    .about-core-card h2 {
      margin: 12px 0 14px;
      font-size: 34px;
      line-height: 1.06;
      letter-spacing: -.03em;
    }

    .about-core-badge,
    .about-pillar-icon,
    .about-rail-card span,
    .about-stat-card strong,
    .about-float-card strong {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: 800;
      letter-spacing: .04em;
    }

    .about-core-badge {
      min-height: 34px;
      padding: 0 14px;
      border-radius: 999px;
      font-size: 12px;
      background: rgba(255,255,255,.12);
      color: #fff;
      text-transform: uppercase;
    }

    .about-float-card {
      position: absolute;
      width: 230px;
      padding: 18px 18px 16px;
      border-radius: 24px;
    }

    .about-float-card-top {
      right: 28px;
      top: 48px;
    }

    .about-float-card-bottom {
      left: 28px;
      bottom: 34px;
    }

    .about-float-card strong,
    .about-stat-card strong {
      color: #fff;
      font-size: 18px;
      margin-bottom: 10px;
      display: block;
      letter-spacing: -.01em;
    }

    .about-orbit {
      position: absolute;
      border-radius: 50%;
      border: 1px dashed rgba(255,255,255,.14);
    }

    .about-orbit-a {
      width: 480px;
      height: 480px;
      right: -110px;
      top: -80px;
    }

    .about-orbit-b {
      width: 340px;
      height: 340px;
      left: -100px;
      bottom: -88px;
    }

    .about-stats-section,
    .about-pillars-section,
    .about-timeline-section,
    .about-cta-section {
      padding-top: 24px;
    }

    .about-stats-grid,
    .about-pillars-grid {
      display: grid;
      gap: 22px;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .about-stat-card,
    .about-pillar-card {
      padding: 28px 24px;
      border-radius: 28px;
    }

    .about-story-grid {
      display: grid;
      grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
      gap: 24px;
      align-items: start;
    }

    .about-story-copy {
      display: grid;
      gap: 18px;
      padding-top: 10px;
    }

    .about-section-head {
      display: grid;
      gap: 12px;
      margin-bottom: 28px;
      max-width: 760px;
    }

    .about-section-head h2,
    .about-story-copy h2,
    .about-cta-card h2 {
      font-size: clamp(32px, 4.2vw, 54px);
    }

    .about-story-rail,
    .about-timeline {
      display: grid;
      gap: 18px;
    }

    .about-rail-card {
      padding: 24px 24px 22px;
      border-radius: 26px;
    }

    .about-rail-card span,
    .about-pillar-icon {
      width: 50px;
      height: 50px;
      border-radius: 16px;
      background: rgba(255,255,255,.1);
      font-size: 14px;
      color: #fff;
      margin-bottom: 16px;
    }

    .about-rail-card h3,
    .about-pillar-card h3,
    .about-timeline-content h3 {
      margin: 0 0 10px;
      font-size: 24px;
      letter-spacing: -.02em;
    }

    .about-pillars-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .about-timeline {
      position: relative;
      padding-left: 28px;
    }

    .about-timeline::before {
      content: "";
      position: absolute;
      left: 8px;
      top: 8px;
      bottom: 8px;
      width: 2px;
      background: linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,.06));
    }

    .about-timeline-item {
      position: relative;
      padding-left: 22px;
    }

    .about-timeline-dot {
      position: absolute;
      left: -1px;
      top: 10px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: linear-gradient(135deg, #92a0ff 0%, #c695ff 100%);
      box-shadow: 0 0 0 6px rgba(255,255,255,.05);
    }

    .about-timeline-content {
      padding: 24px 24px 22px;
      border-radius: 24px;
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.05);
    }

    .about-cta-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 34px 34px;
      border-radius: 32px;
      background:
        radial-gradient(circle at 10% 20%, rgba(133, 113, 255, .18), transparent 24%),
        linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.05));
    }

    @media (max-width: 1024px) {
      .about-hero-shell,
      .about-story-grid,
      .about-cta-card,
      .about-stats-grid,
      .about-pillars-grid {
        grid-template-columns: 1fr;
      }

      .about-hero-panel {
        min-height: 460px;
      }
    }

    @media (max-width: 720px) {
      .about-hero {
        padding-top: 98px;
      }

      .about-hero-copy h1,
      .about-section-head h2,
      .about-story-copy h2,
      .about-cta-card h2 {
        font-size: clamp(34px, 11vw, 48px);
      }

      .about-hero-copy p,
      .about-story-copy p,
      .about-cta-card p,
      .about-stat-card p,
      .about-pillar-card p,
      .about-rail-card p,
      .about-timeline-content p,
      .about-core-card p,
      .about-float-card span {
        font-size: 16px;
        line-height: 1.7;
      }

      .about-hero-panel {
        min-height: 420px;
        border-radius: 30px;
      }

      .about-core-card {
        left: 18px;
        right: 18px;
        top: 112px;
        padding: 24px 20px;
      }

      .about-core-card h2 {
        font-size: 28px;
      }

      .about-float-card {
        width: calc(100% - 36px);
        left: 18px;
        right: 18px;
      }

      .about-float-card-top {
        top: 18px;
      }

      .about-float-card-bottom {
        bottom: 18px;
      }

      .about-stat-card,
      .about-pillar-card,
      .about-rail-card,
      .about-timeline-content,
      .about-cta-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .about-timeline {
        padding-left: 20px;
      }
    }

    .company-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .company-hero {
      padding-top: 126px;
      padding-bottom: 24px;
    }

    .company-hero-shell,
    .company-notes-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(300px, .52fr);
      gap: 24px;
      align-items: start;
    }

    .company-hero-copy,
    .company-section-head {
      display: grid;
      gap: 16px;
      max-width: 820px;
    }

    .company-hero-copy h1,
    .company-section-head h2,
    .company-note-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .company-hero-copy p,
    .company-section-head p,
    .company-note-card p,
    .company-side-card p,
    .company-info-block p {
      margin: 0;
      color: rgba(255,255,255,.78);
      font-size: 18px;
      line-height: 1.8;
    }

    .company-hero-side,
    .company-note-card,
    .company-entity-card {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .company-side-card,
    .company-note-card {
      padding: 28px 24px;
      border-radius: 28px;
    }

    .company-side-kicker,
    .company-badge,
    .company-info-label {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: fit-content;
      min-height: 34px;
      padding: 0 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.12);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .company-side-card strong,
    .company-entity-top h3 {
      display: block;
      margin: 14px 0 12px;
      font-size: 28px;
      line-height: 1.08;
      letter-spacing: -.02em;
    }

    .company-entities-section,
    .company-notes-section {
      padding-top: 24px;
    }

    .company-section-head {
      margin-bottom: 24px;
    }

    .company-entity-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 22px;
    }

    .company-entity-card {
      padding: 28px 24px;
      border-radius: 30px;
    }

    .company-entity-top {
      display: grid;
      gap: 14px;
      margin-bottom: 20px;
    }

    .company-entity-content {
      display: grid;
      gap: 18px;
    }

    .company-info-block {
      display: grid;
      gap: 10px;
      padding-top: 18px;
      border-top: 1px solid rgba(255,255,255,.1);
    }

    .company-info-block:first-child {
      padding-top: 0;
      border-top: none;
    }

    .company-info-label {
      min-height: 30px;
      font-size: 11px;
      background: rgba(117, 128, 255, .18);
    }

    .company-entity-card a,
    .company-note-card a {
      color: #fff;
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    .company-note-card {
      display: grid;
      gap: 16px;
    }

    .company-note-card .btn {
      width: fit-content;
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
      text-decoration: none;
    }

    .company-note-card-alt {
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
    }

    @media (max-width: 1024px) {
      .company-hero-shell,
      .company-notes-grid,
      .company-entity-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 720px) {
      .company-hero {
        padding-top: 98px;
      }

      .company-hero-copy h1,
      .company-section-head h2,
      .company-note-card h2 {
        font-size: clamp(34px, 11vw, 46px);
      }

      .company-hero-copy p,
      .company-section-head p,
      .company-note-card p,
      .company-side-card p,
      .company-info-block p {
        font-size: 16px;
        line-height: 1.7;
      }

      .company-side-card,
      .company-note-card,
      .company-entity-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .company-side-card strong,
      .company-entity-top h3 {
        font-size: 24px;
      }
    }

    .help-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .help-hero {
      padding-top: 126px;
      padding-bottom: 24px;
    }

    .help-hero-shell,
    .help-guides-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(300px, .52fr);
      gap: 24px;
      align-items: start;
    }

    .help-hero-copy,
    .help-section-head {
      display: grid;
      gap: 16px;
      max-width: 820px;
    }

    .help-hero-copy h1,
    .help-section-head h2,
    .help-guide-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .help-hero-copy p,
    .help-section-head p,
    .help-category-card p,
    .help-guide-card p,
    .help-panel-card li {
      margin: 0;
      color: rgba(255,255,255,.78);
      font-size: 18px;
      line-height: 1.8;
    }

    .help-keywords {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .help-keywords a,
    .help-card-kicker,
    .help-panel-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 38px;
      padding: 0 16px;
      border-radius: 999px;
      background: rgba(255,255,255,.09);
      border: 1px solid rgba(255,255,255,.08);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .01em;
    }

    .help-keywords a:hover {
      background: rgba(255,255,255,.14);
    }

    .help-hero-panel,
    .help-category-card,
    .help-guide-card {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .help-panel-card,
    .help-guide-card {
      padding: 28px 24px;
      border-radius: 28px;
    }

    .help-panel-card ul,
    .help-category-card ul {
      margin: 18px 0 0;
      padding-left: 18px;
      display: grid;
      gap: 10px;
      color: rgba(255,255,255,.78);
    }

    .help-panel-card li,
    .help-category-card li {
      margin: 0;
    }

    .help-categories-section,
    .help-guides-section,
    .help-faq-section {
      padding-top: 24px;
    }

    .help-section-head {
      margin-bottom: 24px;
    }

    .help-category-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 22px;
    }

    .help-category-card {
      padding: 28px 24px;
      border-radius: 28px;
      display: grid;
      gap: 16px;
      align-content: start;
    }

    .help-category-card h3 {
      margin: 0;
      font-size: 28px;
      line-height: 1.08;
      letter-spacing: -.02em;
    }

    .help-guide-card {
      display: grid;
      gap: 16px;
    }

    .help-guide-links {
      display: grid;
      gap: 12px;
    }

    .help-guide-links a,
    .help-guide-links span,
    .help-guide-card p,
    .help-category-card p {
      color: rgba(255,255,255,.82);
    }

    .help-guide-links a,
    .help-guide-links span {
      text-decoration: none;
      display: block;
    }

    .help-guide-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .help-guide-actions .btn {
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
    }

    .help-guide-card-alt {
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
    }

    @media (max-width: 1024px) {
      .help-hero-shell,
      .help-guides-grid,
      .help-category-grid {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 720px) {
      .help-hero {
        padding-top: 98px;
      }

      .help-hero-copy h1,
      .help-section-head h2,
      .help-guide-card h2 {
        font-size: clamp(34px, 11vw, 46px);
      }

      .help-hero-copy p,
      .help-section-head p,
      .help-category-card p,
      .help-guide-card p,
      .help-panel-card li {
        font-size: 16px;
        line-height: 1.7;
      }

      .help-panel-card,
      .help-category-card,
      .help-guide-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .help-category-card h3 {
        font-size: 24px;
      }
    }

    .docs-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .docs-hero {
      padding-top: 126px;
      padding-bottom: 16px;
    }

    .docs-hero-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
      gap: 24px;
      align-items: start;
    }

    .docs-hero-copy {
      display: grid;
      gap: 16px;
      max-width: 860px;
    }

    .docs-hero-copy h1,
    .docs-section-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .docs-hero-copy p,
    .docs-section-card p,
    .docs-section-card li,
    .docs-sidebar-title,
    .docs-toc a,
    .docs-table,
    .docs-note p {
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
    }

    .docs-hero-card,
    .docs-sidebar-card,
    .docs-section-card,
    .docs-note,
    .docs-code-block {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .docs-hero-card,
    .docs-sidebar-card,
    .docs-section-card {
      border-radius: 28px;
      padding: 26px 22px;
    }

    .docs-hero-card {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-content: start;
    }

    .docs-chip,
    .docs-section-kicker {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.1);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .docs-layout-section,
    .docs-cta-section {
      padding-top: 24px;
    }

    .docs-layout {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 24px;
      align-items: start;
    }

    .docs-sidebar {
      position: sticky;
      top: 96px;
      align-self: start;
    }

    .docs-sidebar-title {
      font-weight: 800;
      color: #fff;
      margin-bottom: 14px;
    }

    .docs-toc {
      display: grid;
      gap: 10px;
    }

    .docs-toc a {
      display: block;
      padding: 10px 12px;
      border-radius: 12px;
      color: rgba(255,255,255,.78);
    }

    .docs-toc a:hover {
      background: rgba(255,255,255,.06);
      color: #fff;
    }

    .docs-content {
      display: grid;
      gap: 22px;
    }

    .docs-section-card {
      display: grid;
      gap: 16px;
    }

    .docs-section-card h2 {
      font-size: clamp(28px, 3.5vw, 44px);
    }

    .docs-steps,
    .docs-bullet-list {
      margin: 0;
      padding-left: 20px;
      display: grid;
      gap: 10px;
    }

    .docs-code-block {
      border-radius: 22px;
      overflow: auto;
      background: rgba(11, 14, 39, .8);
      border-color: rgba(137, 149, 255, .16);
    }

    .docs-code-block pre {
      margin: 0;
      padding: 20px 22px;
      overflow: auto;
    }

    .docs-code-block code {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 14px;
      line-height: 1.8;
      color: #dfe4ff;
    }

    .docs-note {
      border-radius: 22px;
      padding: 18px 18px;
      display: grid;
      gap: 8px;
    }

    .docs-note strong {
      color: #fff;
      font-size: 16px;
    }

    .docs-note-info { border-color: rgba(127, 159, 255, .2); }
    .docs-note-warn { border-color: rgba(255, 188, 87, .22); }
    .docs-note-success { border-color: rgba(93, 220, 164, .22); }

    .docs-table {
      width: 100%;
      border-collapse: collapse;
      overflow: hidden;
      border-radius: 18px;
      background: rgba(255,255,255,.03);
    }

    .docs-table th,
    .docs-table td {
      padding: 14px 16px;
      text-align: left;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .docs-table th {
      color: #fff;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .docs-cta-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 32px 28px;
      border-radius: 30px;
      border: 1px solid rgba(255,255,255,.08);
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .docs-cta-card h2 {
      margin: 10px 0 12px;
      font-size: clamp(28px, 3.8vw, 44px);
      line-height: 1.06;
      letter-spacing: -.03em;
    }

    .docs-cta-card p {
      margin: 0;
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
      max-width: 760px;
    }

    .docs-cta-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .docs-cta-actions .btn {
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
    }

    @media (max-width: 1024px) {
      .docs-cta-card {
        grid-template-columns: 1fr;
      }
      .docs-hero-shell,
      .docs-layout {
        grid-template-columns: 1fr;
      }

      .docs-sidebar {
        position: static;
      }
    }

    @media (max-width: 720px) {
      .docs-hero {
        padding-top: 98px;
      }

      .docs-hero-copy h1,
      .docs-section-card h2 {
        font-size: clamp(32px, 10vw, 44px);
      }

      .docs-hero-copy p,
      .docs-section-card p,
      .docs-section-card li,
      .docs-sidebar-title,
      .docs-toc a,
      .docs-table,
      .docs-note p {
        font-size: 16px;
        line-height: 1.7;
      }

      .docs-hero-card,
      .docs-sidebar-card,
      .docs-section-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .docs-code-block pre {
        padding: 18px;
      }

      .docs-cta-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .docs-cta-card p {
        font-size: 16px;
        line-height: 1.7;
      }
    }

    .privacy-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .privacy-hero {
      padding-top: 126px;
      padding-bottom: 16px;
    }

    .privacy-hero-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
      gap: 24px;
      align-items: start;
    }

    .privacy-hero-copy {
      display: grid;
      gap: 16px;
      max-width: 860px;
    }

    .privacy-hero-copy h1,
    .privacy-section-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .privacy-hero-copy p,
    .privacy-section-card p,
    .privacy-section-card li,
    .privacy-sidebar-title,
    .privacy-toc a,
    .privacy-table,
    .privacy-note p {
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
    }

    .privacy-hero-card,
    .privacy-sidebar-card,
    .privacy-section-card,
    .privacy-note,
    .privacy-code-block {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .privacy-hero-card,
    .privacy-sidebar-card,
    .privacy-section-card {
      border-radius: 28px;
      padding: 26px 22px;
    }

    .privacy-hero-card {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-content: start;
    }

    .privacy-chip,
    .privacy-section-kicker {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.1);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .privacy-layout-section,
    .privacy-cta-section {
      padding-top: 24px;
    }

    .privacy-layout {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 24px;
      align-items: start;
    }

    .privacy-sidebar {
      position: sticky;
      top: 96px;
      align-self: start;
    }

    .privacy-sidebar-title {
      font-weight: 800;
      color: #fff;
      margin-bottom: 14px;
    }

    .privacy-toc {
      display: grid;
      gap: 10px;
    }

    .privacy-toc a {
      display: block;
      padding: 10px 12px;
      border-radius: 12px;
      color: rgba(255,255,255,.78);
    }

    .privacy-toc a:hover {
      background: rgba(255,255,255,.06);
      color: #fff;
    }

    .privacy-content {
      display: grid;
      gap: 22px;
    }

    .privacy-section-card {
      display: grid;
      gap: 16px;
    }

    .privacy-section-card h2 {
      font-size: clamp(28px, 3.5vw, 44px);
    }

    .privacy-steps,
    .privacy-bullet-list {
      margin: 0;
      padding-left: 20px;
      display: grid;
      gap: 10px;
    }

    .privacy-code-block {
      border-radius: 22px;
      overflow: auto;
      background: rgba(11, 14, 39, .8);
      border-color: rgba(137, 149, 255, .16);
    }

    .privacy-code-block pre {
      margin: 0;
      padding: 20px 22px;
      overflow: auto;
    }

    .privacy-code-block code {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 14px;
      line-height: 1.8;
      color: #dfe4ff;
    }

    .privacy-note {
      border-radius: 22px;
      padding: 18px 18px;
      display: grid;
      gap: 8px;
    }

    .privacy-note strong {
      color: #fff;
      font-size: 16px;
    }

    .privacy-note-info { border-color: rgba(127, 159, 255, .2); }
    .privacy-note-warn { border-color: rgba(255, 188, 87, .22); }
    .privacy-note-success { border-color: rgba(93, 220, 164, .22); }

    .privacy-table {
      width: 100%;
      border-collapse: collapse;
      overflow: hidden;
      border-radius: 18px;
      background: rgba(255,255,255,.03);
    }

    .privacy-table th,
    .privacy-table td {
      padding: 14px 16px;
      text-align: left;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .privacy-table th {
      color: #fff;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .privacy-cta-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 32px 28px;
      border-radius: 30px;
      border: 1px solid rgba(255,255,255,.08);
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .privacy-cta-card h2 {
      margin: 10px 0 12px;
      font-size: clamp(28px, 3.8vw, 44px);
      line-height: 1.06;
      letter-spacing: -.03em;
    }

    .privacy-cta-card p {
      margin: 0;
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
      max-width: 760px;
    }

    .privacy-cta-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .privacy-cta-actions .btn {
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
    }

    @media (max-width: 1024px) {
      .privacy-cta-card {
        grid-template-columns: 1fr;
      }
      .privacy-hero-shell,
      .privacy-layout {
        grid-template-columns: 1fr;
      }

      .privacy-sidebar {
        position: static;
      }
    }

    @media (max-width: 720px) {
      .privacy-hero {
        padding-top: 98px;
      }

      .privacy-hero-copy h1,
      .privacy-section-card h2 {
        font-size: clamp(32px, 10vw, 44px);
      }

      .privacy-hero-copy p,
      .privacy-section-card p,
      .privacy-section-card li,
      .privacy-sidebar-title,
      .privacy-toc a,
      .privacy-table,
      .privacy-note p {
        font-size: 16px;
        line-height: 1.7;
      }

      .privacy-hero-card,
      .privacy-sidebar-card,
      .privacy-section-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .privacy-code-block pre {
        padding: 18px;
      }

      .privacy-cta-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .privacy-cta-card p {
        font-size: 16px;
        line-height: 1.7;
      }
    }

    .terms-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .terms-hero {
      padding-top: 126px;
      padding-bottom: 16px;
    }

    .terms-hero-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
      gap: 24px;
      align-items: start;
    }

    .terms-hero-copy {
      display: grid;
      gap: 16px;
      max-width: 860px;
    }

    .terms-hero-copy h1,
    .terms-section-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .terms-hero-copy p,
    .terms-section-card p,
    .terms-section-card li,
    .terms-sidebar-title,
    .terms-toc a,
    .terms-table,
    .terms-note p {
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
    }

    .terms-hero-card,
    .terms-sidebar-card,
    .terms-section-card,
    .terms-note,
    .terms-code-block {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .terms-hero-card,
    .terms-sidebar-card,
    .terms-section-card {
      border-radius: 28px;
      padding: 26px 22px;
    }

    .terms-hero-card {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-content: start;
    }

    .terms-chip,
    .terms-section-kicker {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.1);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .terms-layout-section,
    .terms-cta-section {
      padding-top: 24px;
    }

    .terms-layout {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      gap: 24px;
      align-items: start;
    }

    .terms-sidebar {
      position: sticky;
      top: 96px;
      align-self: start;
    }

    .terms-sidebar-title {
      font-weight: 800;
      color: #fff;
      margin-bottom: 14px;
    }

    .terms-toc {
      display: grid;
      gap: 10px;
    }

    .terms-toc a {
      display: block;
      padding: 10px 12px;
      border-radius: 12px;
      color: rgba(255,255,255,.78);
    }

    .terms-toc a:hover {
      background: rgba(255,255,255,.06);
      color: #fff;
    }

    .terms-content {
      display: grid;
      gap: 22px;
    }

    .terms-section-card {
      display: grid;
      gap: 16px;
    }

    .terms-section-card h2 {
      font-size: clamp(28px, 3.5vw, 44px);
    }

    .terms-steps,
    .terms-bullet-list {
      margin: 0;
      padding-left: 20px;
      display: grid;
      gap: 10px;
    }

    .terms-code-block {
      border-radius: 22px;
      overflow: auto;
      background: rgba(11, 14, 39, .8);
      border-color: rgba(137, 149, 255, .16);
    }

    .terms-code-block pre {
      margin: 0;
      padding: 20px 22px;
      overflow: auto;
    }

    .terms-code-block code {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-size: 14px;
      line-height: 1.8;
      color: #dfe4ff;
    }

    .terms-note {
      border-radius: 22px;
      padding: 18px 18px;
      display: grid;
      gap: 8px;
    }

    .terms-note strong {
      color: #fff;
      font-size: 16px;
    }

    .terms-note-info { border-color: rgba(127, 159, 255, .2); }
    .terms-note-warn { border-color: rgba(255, 188, 87, .22); }

    .terms-table {
      width: 100%;
      border-collapse: collapse;
      overflow: hidden;
      border-radius: 18px;
      background: rgba(255,255,255,.03);
    }

    .terms-table th,
    .terms-table td {
      padding: 14px 16px;
      text-align: left;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .terms-table th {
      color: #fff;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .terms-cta-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 32px 28px;
      border-radius: 30px;
      border: 1px solid rgba(255,255,255,.08);
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .terms-cta-card h2 {
      margin: 10px 0 12px;
      font-size: clamp(28px, 3.8vw, 44px);
      line-height: 1.06;
      letter-spacing: -.03em;
    }

    .terms-cta-card p {
      margin: 0;
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
      max-width: 760px;
    }

    .terms-cta-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .terms-cta-actions .btn {
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
    }

    @media (max-width: 1024px) {
      .terms-cta-card {
        grid-template-columns: 1fr;
      }
      .terms-hero-shell,
      .terms-layout {
        grid-template-columns: 1fr;
      }

      .terms-sidebar {
        position: static;
      }
    }

    @media (max-width: 720px) {
      .terms-hero {
        padding-top: 98px;
      }

      .terms-hero-copy h1,
      .terms-section-card h2 {
        font-size: clamp(32px, 10vw, 44px);
      }

      .terms-hero-copy p,
      .terms-section-card p,
      .terms-section-card li,
      .terms-sidebar-title,
      .terms-toc a,
      .terms-table,
      .terms-note p {
        font-size: 16px;
        line-height: 1.7;
      }

      .terms-hero-card,
      .terms-sidebar-card,
      .terms-section-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .terms-code-block pre {
        padding: 18px;
      }

      .terms-cta-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .terms-cta-card p {
        font-size: 16px;
        line-height: 1.7;
      }
    }

    .guidelines-page .nav.is-solid {
      background: linear-gradient(90deg, rgba(10, 14, 44, .88) 0%, rgba(22, 28, 102, .86) 52%, rgba(40, 52, 190, .82) 100%);
    }

    .guidelines-hero {
      padding-top: 126px;
      padding-bottom: 16px;
    }

    .guidelines-hero-shell {
      display: grid;
      gap: 26px;
    }

    .guidelines-hero-shell-alt {
      grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
      align-items: start;
    }

    .guidelines-hero-copy {
      display: grid;
      gap: 18px;
      max-width: 860px;
    }

    .guidelines-hero-copy h1,
    .guidelines-section-head h2,
    .guidelines-enforcement-copy h2,
    .guidelines-report-copy h2,
    .guidelines-cta-card h2 {
      margin: 0;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 1;
      letter-spacing: -.03em;
    }

    .guidelines-hero-copy p,
    .guidelines-section-head p,
    .guidelines-principle-card p,
    .guidelines-zone-card p,
    .guidelines-zone-card li,
    .guidelines-enforcement-copy p,
    .guidelines-flow-step p,
    .guidelines-report-copy p,
    .guidelines-report-points div,
    .guidelines-cta-card p,
    .guidelines-highlight-card span {
      color: rgba(255,255,255,.8);
      font-size: 17px;
      line-height: 1.8;
    }

    .guidelines-hero-highlights,
    .guidelines-principles-grid,
    .guidelines-zones-grid,
    .guidelines-flow {
      display: grid;
      gap: 18px;
    }

    .guidelines-hero-highlights {
      grid-template-columns: 1fr;
    }

    .guidelines-highlight-card,
    .guidelines-principle-card,
    .guidelines-zone-card,
    .guidelines-report-card,
    .guidelines-cta-card,
    .guidelines-flow-step {
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.06);
      box-shadow: 0 18px 48px rgba(8, 10, 34, .18);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .guidelines-highlight-card,
    .guidelines-principle-card,
    .guidelines-zone-card,
    .guidelines-flow-step,
    .guidelines-cta-card {
      border-radius: 28px;
      padding: 24px 22px;
    }

    .guidelines-highlight-card strong,
    .guidelines-principle-card h3,
    .guidelines-zone-card h3,
    .guidelines-flow-step h3 {
      display: block;
      margin: 0 0 10px;
      font-size: 24px;
      line-height: 1.1;
      letter-spacing: -.02em;
      color: #fff;
    }

    .guidelines-principles-section,
    .guidelines-zones-section,
    .guidelines-enforcement-section,
    .guidelines-report-section,
    .guidelines-cta-section {
      padding-top: 24px;
    }

    .guidelines-section-head {
      display: grid;
      gap: 12px;
      margin-bottom: 24px;
      max-width: 820px;
    }

    .guidelines-section-head h2,
    .guidelines-enforcement-copy h2,
    .guidelines-report-copy h2,
    .guidelines-cta-card h2 {
      font-size: clamp(30px, 4vw, 50px);
    }

    .guidelines-section-head-narrow {
      max-width: 620px;
    }

    .guidelines-principles-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .guidelines-principle-no,
    .guidelines-zone-tag,
    .guidelines-section-head .eyebrow,
    .guidelines-enforcement-copy .eyebrow,
    .guidelines-report-copy .eyebrow {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 14px;
      width: fit-content;
      border-radius: 999px;
      background: rgba(255,255,255,.1);
      color: #fff;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .04em;
      text-transform: uppercase;
    }

    .guidelines-principle-no {
      margin-bottom: 18px;
    }

    .guidelines-zones-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .guidelines-zone-card {
      display: grid;
      gap: 14px;
      align-content: start;
    }

    .guidelines-zone-card ul {
      margin: 0;
      padding-left: 18px;
      display: grid;
      gap: 8px;
    }

    .guidelines-zone-card-accent {
      background: linear-gradient(160deg, rgba(116, 122, 255, .18), rgba(255,255,255,.06));
    }

    .guidelines-enforcement-grid {
      display: grid;
      grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
      gap: 24px;
      align-items: start;
    }

    .guidelines-enforcement-copy {
      display: grid;
      gap: 14px;
    }

    .guidelines-flow-step {
      position: relative;
      padding-left: 80px;
    }

    .guidelines-flow-step span {
      position: absolute;
      left: 22px;
      top: 22px;
      width: 42px;
      height: 42px;
      border-radius: 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: rgba(255,255,255,.1);
      color: #fff;
      font-weight: 800;
    }

    .guidelines-report-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, .6fr);
      gap: 24px;
      border-radius: 30px;
      padding: 30px 28px;
    }

    .guidelines-report-copy {
      display: grid;
      gap: 14px;
    }

    .guidelines-report-points {
      display: grid;
      gap: 12px;
      align-content: start;
    }

    .guidelines-report-points div {
      padding: 16px 18px;
      border-radius: 18px;
      background: rgba(255,255,255,.05);
      border: 1px solid rgba(255,255,255,.06);
    }

    .guidelines-cta-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 24px;
      align-items: center;
      padding: 32px 28px;
      border-radius: 30px;
      background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
    }

    .guidelines-cta-actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .guidelines-cta-actions .btn {
      min-height: 54px;
      padding: 14px 24px;
      border-radius: 18px;
    }

    @media (max-width: 1024px) {
      .guidelines-hero-shell-alt,
      .guidelines-principles-grid,
      .guidelines-zones-grid,
      .guidelines-enforcement-grid,
      .guidelines-report-card,
      .guidelines-cta-card {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 720px) {
      .guidelines-hero {
        padding-top: 98px;
      }

      .guidelines-hero-copy h1,
      .guidelines-section-head h2,
      .guidelines-enforcement-copy h2,
      .guidelines-report-copy h2,
      .guidelines-cta-card h2 {
        font-size: clamp(32px, 10vw, 44px);
      }

      .guidelines-hero-copy p,
      .guidelines-section-head p,
      .guidelines-principle-card p,
      .guidelines-zone-card p,
      .guidelines-zone-card li,
      .guidelines-enforcement-copy p,
      .guidelines-flow-step p,
      .guidelines-report-copy p,
      .guidelines-report-points div,
      .guidelines-cta-card p,
      .guidelines-highlight-card span {
        font-size: 16px;
        line-height: 1.7;
      }

      .guidelines-highlight-card,
      .guidelines-principle-card,
      .guidelines-zone-card,
      .guidelines-flow-step,
      .guidelines-report-card,
      .guidelines-cta-card {
        padding: 22px 18px;
        border-radius: 24px;
      }

      .guidelines-flow-step {
        padding-left: 18px;
        padding-top: 72px;
      }

      .guidelines-flow-step span {
        left: 18px;
        top: 18px;
      }
    }