/* ════════════════════════════════════════════════════
   PLATFORM BACKGROUND — unified AI environment
   Fixed layer · zero document flow impact
   Layer 1 · Grid background
   Layer 2 · Circuit network
   Layer 3 · Floating particles & data flow
   ════════════════════════════════════════════════════ */

:root {
  --pb-cyan: rgba(216, 160, 80, 0.35);
  --pb-cyan-soft: rgba(216, 160, 80, 0.08);
  --pb-purple-soft: rgba(216, 160, 80, 0.06);
  --pb-z-grid: 1;
  --pb-z-stars: 2;
  --pb-z-twinkle: 3;
  --pb-z-comets: 4;
  --pb-z-circuit: 5;
  --pb-z-flow: 6;
}

/* ── Shell: fixed viewport layer, never affects layout ── */
.platform-bg {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  z-index: 0 !important;
  pointer-events: none !important;
  user-select: none !important;
  overflow: hidden !important;
  contain: strict;
}

/* Subtle dark scrim — reduces white star haze between panels */
.platform-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  background:
    radial-gradient(ellipse 110% 75% at 50% 35%, rgba(5, 7, 11, 0) 0%, rgba(3, 5, 9, 0.28) 72%, rgba(2, 4, 7, 0.42) 100%),
    rgba(4, 6, 10, 0.1);
}

.platform-bg__layer {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
}

/* Content sits above background — no child selector overrides */
.app {
  position: relative;
  z-index: 1;
}

/* Deep night base — starfield sits on top, no grid */
body {
  background-color: #05070b !important;
  background-image: none !important;
}

/* ════════════════════════════════════════════════════
   LAYER 1 — Grid (disabled; clean sky only)
   ════════════════════════════════════════════════════ */

.platform-bg__layer--grid {
  z-index: var(--pb-z-grid);
  display: none;
  opacity: 0;
  visibility: hidden;
  background-image: none;
  animation: none;
}

.platform-bg__layer--grid::after {
  content: none;
  display: none;
  opacity: 0;
}

/* ════════════════════════════════════════════════════
   LAYER 1.5 — Clean starfield ONLY (no baked-in grid/lines)
   ════════════════════════════════════════════════════ */

.platform-bg__layer--stars {
  z-index: var(--pb-z-stars);
  background-color: transparent;
  background-image: url("../assets/starfield-clean.svg");
  background-repeat: repeat;
  background-position: center top;
  background-size: 1400px 788px;
  opacity: 0.88;
  mix-blend-mode: normal;
  pointer-events: none;
  filter: brightness(0.82) contrast(1.08);
}

/* Extra star density without any lines/images */
.platform-bg__layer--stars::before,
.platform-bg__layer--stars::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-repeat: repeat;
}

.platform-bg__layer--stars::before {
  opacity: 0.52;
  background-image:
    radial-gradient(1px 1px at 12% 18%, rgba(255, 255, 255, 0.55) 50%, transparent 51%),
    radial-gradient(1px 1px at 28% 62%, rgba(180, 200, 230, 0.42) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 44% 34%, rgba(255, 255, 255, 0.48) 50%, transparent 51%),
    radial-gradient(1px 1px at 61% 78%, rgba(170, 190, 220, 0.38) 50%, transparent 51%),
    radial-gradient(1px 1px at 76% 22%, rgba(255, 255, 255, 0.4) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 88% 54%, rgba(190, 210, 235, 0.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 8% 88%, rgba(255, 255, 255, 0.32) 50%, transparent 51%),
    radial-gradient(1px 1px at 52% 8%, rgba(170, 195, 225, 0.38) 50%, transparent 51%);
  background-size: 420px 360px;
  animation: pb-starfield-drift-a 8.5s ease-in-out infinite;
}

.platform-bg__layer--stars::after {
  opacity: 0.42;
  background-image:
    radial-gradient(1px 1px at 18% 42%, rgba(255, 255, 255, 0.42) 50%, transparent 51%),
    radial-gradient(1px 1px at 36% 14%, rgba(180, 200, 230, 0.34) 50%, transparent 51%),
    radial-gradient(1px 1px at 58% 66%, rgba(255, 255, 255, 0.45) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 72% 38%, rgba(170, 190, 220, 0.48) 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 84%, rgba(255, 255, 255, 0.32) 50%, transparent 51%),
    radial-gradient(1px 1px at 4% 56%, rgba(190, 210, 235, 0.36) 50%, transparent 51%);
  background-size: 560px 480px;
  animation: pb-starfield-drift-b 11s ease-in-out infinite;
}

@keyframes pb-starfield-drift-a {
  0%, 100% { opacity: 0.32; }
  35%      { opacity: 0.58; }
  62%      { opacity: 0.24; }
  80%      { opacity: 0.5; }
}

@keyframes pb-starfield-drift-b {
  0%, 100% { opacity: 0.26; }
  28%      { opacity: 0.52; }
  55%      { opacity: 0.2; }
  78%      { opacity: 0.44; }
}

/* ════════════════════════════════════════════════════
   LAYER 1.6 — Independent star twinkle (разнобой)
   ════════════════════════════════════════════════════ */

.platform-bg__layer--twinkle {
  z-index: var(--pb-z-twinkle);
  overflow: hidden;
  pointer-events: none;
}

.platform-bg__star {
  position: absolute;
  left: var(--sx, 50%);
  top: var(--sy, 50%);
  width: calc(1.2px * var(--ss, 1));
  height: calc(1.2px * var(--ss, 1));
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 0 2px rgba(210, 230, 255, 0.45);
  opacity: 0.25;
  pointer-events: none;
  will-change: opacity, transform;
  animation: pb-star-twinkle var(--st, 4.5s) ease-in-out infinite;
  animation-delay: var(--sd, 0s);
}

.platform-bg__star.platform-bg__star--bright {
  background: rgba(230, 240, 255, 0.95);
  box-shadow:
    0 0 3px rgba(200, 225, 255, 0.7),
    0 0 8px rgba(180, 210, 255, 0.35);
  animation-name: pb-star-twinkle-bright;
}

.platform-bg__star:nth-child(3n):not(.platform-bg__star--bright) {
  background: rgba(210, 230, 255, 0.9);
}

.platform-bg__star:nth-child(7n):not(.platform-bg__star--bright) {
  animation-name: pb-star-twinkle-soft;
}

@keyframes pb-star-twinkle {
  0%, 100% {
    opacity: 0.15;
    transform: scale(0.85);
  }
  18% {
    opacity: 0.35;
    transform: scale(0.95);
  }
  42% {
    opacity: 0.95;
    transform: scale(1.25);
  }
  58% {
    opacity: 0.25;
    transform: scale(0.9);
  }
  76% {
    opacity: 0.7;
    transform: scale(1.1);
  }
}

@keyframes pb-star-twinkle-bright {
  0%, 100% {
    opacity: 0.2;
    transform: scale(0.9);
  }
  12% {
    opacity: 0.45;
    transform: scale(1);
  }
  28% {
    opacity: 1;
    transform: scale(1.45);
  }
  40% {
    opacity: 0.3;
    transform: scale(0.95);
  }
  65% {
    opacity: 0.85;
    transform: scale(1.2);
  }
  82% {
    opacity: 0.22;
    transform: scale(0.88);
  }
}

@keyframes pb-star-twinkle-soft {
  0%, 100% {
    opacity: 0.12;
    transform: scale(0.8);
  }
  50% {
    opacity: 0.65;
    transform: scale(1.15);
  }
}

/* ════════════════════════════════════════════════════
   LAYER 1.7 — Fast diagonal comets
   ════════════════════════════════════════════════════ */

.platform-bg__layer--comets {
  z-index: var(--pb-z-comets);
  overflow: hidden;
  pointer-events: none;
}

.platform-bg__comet {
  position: absolute;
  display: block;
  width: 72px;
  height: 1.5px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(200, 225, 255, 0.55) 28%,
    rgba(180, 210, 255, 0.12) 68%,
    transparent 100%
  );
  box-shadow:
    0 0 4px rgba(220, 235, 255, 0.55),
    0 0 10px rgba(180, 210, 255, 0.25);
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
  transform-origin: left center;
}

.platform-bg__comet::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 50%;
  width: 3px;
  height: 3px;
  margin-top: -1.5px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 0 6px rgba(220, 240, 255, 0.8);
}

/* Top-left → bottom-right */
.platform-bg__comet--1 {
  top: 8%;
  left: -8%;
  width: 88px;
  animation: pb-comet-se 14s linear infinite;
}

.platform-bg__comet--2 {
  top: 22%;
  left: -10%;
  width: 64px;
  animation: pb-comet-se 16s linear infinite 4.5s;
  opacity: 0;
}

.platform-bg__comet--3 {
  top: -4%;
  left: 28%;
  width: 70px;
  animation: pb-comet-se 15s linear infinite 8.2s;
}

/* Top-right → bottom-left */
.platform-bg__comet--4 {
  top: 12%;
  right: -8%;
  left: auto;
  width: 78px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(200, 225, 255, 0.5) 30%,
    rgba(180, 210, 255, 0.1) 70%,
    transparent 100%
  );
  transform-origin: right center;
  animation: pb-comet-sw 17s linear infinite 2.6s;
}

.platform-bg__comet--4::before {
  left: auto;
  right: -1px;
}

.platform-bg__comet--5 {
  top: -6%;
  right: 18%;
  left: auto;
  width: 58px;
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0.9) 0%,
    rgba(200, 225, 255, 0.45) 32%,
    transparent 100%
  );
  transform-origin: right center;
  animation: pb-comet-sw 13s linear infinite 6.4s;
}

.platform-bg__comet--5::before {
  left: auto;
  right: -1px;
}

.platform-bg__comet--6 {
  top: 36%;
  left: -12%;
  width: 54px;
  animation: pb-comet-se-fast 12s linear infinite 3.5s;
}

@keyframes pb-comet-se {
  0%, 78%, 100% {
    transform: translate3d(0, 0, 0) rotate(38deg);
    opacity: 0;
  }
  79% {
    opacity: 0;
  }
  81% {
    opacity: 0.85;
  }
  96% {
    transform: translate3d(118vw, 95vh, 0) rotate(38deg);
    opacity: 0;
  }
}

@keyframes pb-comet-se-fast {
  0%, 80%, 100% {
    transform: translate3d(0, 0, 0) rotate(42deg);
    opacity: 0;
  }
  81% {
    opacity: 0;
  }
  83% {
    opacity: 0.75;
  }
  97% {
    transform: translate3d(110vw, 88vh, 0) rotate(42deg);
    opacity: 0;
  }
}

@keyframes pb-comet-sw {
  0%, 78%, 100% {
    transform: translate3d(0, 0, 0) rotate(-38deg);
    opacity: 0;
  }
  79% {
    opacity: 0;
  }
  81% {
    opacity: 0.8;
  }
  96% {
    transform: translate3d(-118vw, 95vh, 0) rotate(-38deg);
    opacity: 0;
  }
}

@keyframes pb-grid-breathe {
  0%, 100% { opacity: 0.042; }
  50%      { opacity: 0.063; }
}

/* ════════════════════════════════════════════════════
   LAYER 2 — Circuit network
   ════════════════════════════════════════════════════ */

.platform-bg__layer--circuit {
  z-index: var(--pb-z-circuit);
  width: 100%;
  height: 100%;
  display: none;
  opacity: 0;
  visibility: hidden;
}

.platform-bg__circuit-lines {
  stroke: var(--pb-cyan-soft);
  stroke-width: 0.6;
  vector-effect: non-scaling-stroke;
  opacity: 0.55;
  animation: pb-circuit-lines-breathe 16s ease-in-out infinite;
}

.platform-bg__circuit-lines path:nth-child(even) {
  stroke: var(--pb-purple-soft);
}

.platform-bg__circuit-pulses {
  opacity: 0.35;
}

.platform-bg__circuit-pulse {
  stroke-dasharray: 40 600;
  stroke-dashoffset: 640;
  animation: pb-circuit-flow 28s linear infinite;
}

.platform-bg__circuit-pulse--b {
  animation-duration: 34s;
  animation-delay: 8s;
}

.platform-bg__circuit-pulse--c {
  animation-duration: 31s;
  animation-delay: 14s;
}

.platform-bg__circuit-node {
  fill: rgba(216, 160, 80, 0.55);
  animation: pb-circuit-node-blink 9s ease-in-out infinite;
}

.platform-bg__circuit-node--purple {
  fill: rgba(233, 184, 99, 0.5);
}

.platform-bg__circuit-node:nth-child(odd)  { animation-delay: 1.5s; }
.platform-bg__circuit-node:nth-child(3n)   { animation-delay: 3s; }
.platform-bg__circuit-node:nth-child(4n)   { animation-delay: 4.5s; }
.platform-bg__circuit-node:nth-child(5n)   { animation-delay: 6s; }

@keyframes pb-circuit-lines-breathe {
  0%, 100% { opacity: 0.45; }
  50%      { opacity: 0.58; }
}

@keyframes pb-circuit-flow {
  0%   { stroke-dashoffset: 640; opacity: 0; }
  8%   { opacity: 0.5; }
  92%  { opacity: 0.5; }
  100% { stroke-dashoffset: -640; opacity: 0; }
}

@keyframes pb-circuit-node-blink {
  0%, 100% { opacity: 0.35; }
  50%      { opacity: 0.85; }
}

/* ════════════════════════════════════════════════════
   LAYER 3 — Floating particles & data flow
   ════════════════════════════════════════════════════ */

.platform-bg__layer--flow {
  z-index: var(--pb-z-flow);
  overflow: hidden;
}

.platform-bg__flow-streams,
.platform-bg__flow-particles,
.platform-bg__flow-packets {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

.platform-bg__flow-streams { z-index: 1; }
.platform-bg__flow-particles { z-index: 2; }
.platform-bg__flow-packets { z-index: 3; overflow: hidden; }

/* ── Layer 3a · vertical & diagonal data streams ── */

.platform-bg__stream {
  position: absolute;
  display: block;
  pointer-events: none;
  opacity: 0.06;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(216, 160, 80, 0.21) 42%,
    rgba(233, 184, 99, 0.12) 58%,
    transparent 100%
  );
}

.platform-bg__stream--v1 { left: 8%;  width: 1px; height: 38vh; top: -38vh; animation: pb-stream-v 32s linear infinite 0s; }
.platform-bg__stream--v2 { left: 22%; width: 1px; height: 45vh; top: -45vh; animation: pb-stream-v 38s linear infinite 6s; opacity: 0.05; }
.platform-bg__stream--v3 { left: 41%; width: 1px; height: 32vh; top: -32vh; animation: pb-stream-v 29s linear infinite 12s; }
.platform-bg__stream--v4 { left: 63%; width: 1px; height: 42vh; top: -42vh; animation: pb-stream-v 35s linear infinite 4s; opacity: 0.055; }
.platform-bg__stream--v5 { left: 78%; width: 1px; height: 36vh; top: -36vh; animation: pb-stream-v 31s linear infinite 18s; }
.platform-bg__stream--v6 { left: 91%; width: 1px; height: 40vh; top: -40vh; animation: pb-stream-v 37s linear infinite 9s; opacity: 0.045; }

.platform-bg__stream--d1 {
  left: 15%; width: 1px; height: 55vh; top: -20vh;
  animation: pb-stream-d1 42s linear infinite 2s;
}
.platform-bg__stream--d2 {
  left: 48%; width: 1px; height: 48vh; top: -15vh;
  animation: pb-stream-d2 36s linear infinite 11s;
  opacity: 0.05;
}
.platform-bg__stream--d3 {
  left: 70%; width: 1px; height: 52vh; top: -25vh;
  animation: pb-stream-d3 40s linear infinite 16s;
}
.platform-bg__stream--d4 {
  left: 88%; width: 1px; height: 44vh; top: -18vh;
  animation: pb-stream-d4 33s linear infinite 7s;
  opacity: 0.055;
}

@keyframes pb-stream-v {
  0%   { transform: translateY(0); opacity: 0; }
  6%   { opacity: 0.07; }
  94%  { opacity: 0.07; }
  100% { transform: translateY(145vh); opacity: 0; }
}

@keyframes pb-stream-d1 {
  0%   { transform: rotate(24deg) translateY(0); opacity: 0; }
  6%   { opacity: 0.06; }
  94%  { opacity: 0.06; }
  100% { transform: rotate(24deg) translateY(130vh); opacity: 0; }
}

@keyframes pb-stream-d2 {
  0%   { transform: rotate(-18deg) translateY(0); opacity: 0; }
  6%   { opacity: 0.06; }
  94%  { opacity: 0.06; }
  100% { transform: rotate(-18deg) translateY(130vh); opacity: 0; }
}

@keyframes pb-stream-d3 {
  0%   { transform: rotate(15deg) translateY(0); opacity: 0; }
  6%   { opacity: 0.06; }
  94%  { opacity: 0.06; }
  100% { transform: rotate(15deg) translateY(130vh); opacity: 0; }
}

@keyframes pb-stream-d4 {
  0%   { transform: rotate(-22deg) translateY(0); opacity: 0; }
  6%   { opacity: 0.06; }
  94%  { opacity: 0.06; }
  100% { transform: rotate(-22deg) translateY(130vh); opacity: 0; }
}

/* ── Layer 3b · floating particles ── */

.platform-bg__particle {
  position: absolute;
  left: var(--px, 50%);
  top: var(--py, 50%);
  border-radius: 50%;
  pointer-events: none;
  animation: pb-particle-drift var(--pt, 22s) ease-in-out infinite;
  animation-delay: var(--pd, 0s);
}

.platform-bg__particle--dot {
  width: 2px;
  height: 2px;
  background: rgba(216, 160, 80, 0.55);
  box-shadow: 0 0 4px rgba(216, 160, 80, 0.35);
}

.platform-bg__particle--spark {
  width: 1px;
  height: 1px;
  background: rgba(233, 184, 99, 0.65);
  box-shadow: 0 0 6px rgba(233, 184, 99, 0.4);
}

.platform-bg__particle--glow {
  width: 3px;
  height: 3px;
  background: rgba(216, 160, 80, 0.35);
  box-shadow: 0 0 10px rgba(216, 160, 80, 0.25), 0 0 3px rgba(233, 184, 99, 0.2);
}

@keyframes pb-particle-drift {
  0%, 100% {
    opacity: 0.15;
    transform: translate(0, 0) scale(1);
  }
  25% {
    opacity: 0.55;
    transform: translate(12px, -18px) scale(1.15);
  }
  50% {
    opacity: 0.35;
    transform: translate(-8px, -32px) scale(0.9);
  }
  75% {
    opacity: 0.65;
    transform: translate(16px, -14px) scale(1.05);
  }
}

/* ════════════════════════════════════════════════════
   Reduced motion
   ════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  .platform-bg__layer--grid,
  .platform-bg__layer--stars::before,
  .platform-bg__layer--stars::after,
  .platform-bg__star,
  .platform-bg__comet,
  .platform-bg__circuit-lines,
  .platform-bg__circuit-pulse,
  .platform-bg__circuit-node,
  .platform-bg__stream,
  .platform-bg__particle,
  .platform-bg__data-packet {
    animation: none !important;
  }

  .platform-bg__layer--grid { display: none; opacity: 0; }
  .platform-bg__layer--comets { display: none; opacity: 0; }
  .platform-bg__star { opacity: 0.45; }
  .platform-bg__circuit-lines { display: none; opacity: 0; }
  .platform-bg__circuit-pulse { display: none; opacity: 0; }
  .platform-bg__circuit-node { display: none; opacity: 0; }
  .platform-bg__stream { display: none; opacity: 0; }
  .platform-bg__particle { opacity: 0.45; }
  .platform-bg__data-packet { display: none; opacity: 0; }
}

/* ════════════════════════════════════════════════════
   GLOW BLOB REFINEMENT — −40% large cyan/purple blooms
   Nodes · chart lines · data paths unchanged
   ════════════════════════════════════════════════════ */

body::before {
  animation: pb-body-glow-breathe 28s ease-in-out infinite !important;
  opacity: 0.28 !important;
}

@keyframes pb-body-glow-breathe {
  0%, 100% { opacity: 0.2; }
  50%      { opacity: 0.3; }
}

.platform-divider__ambient {
  animation: ac-divider-ambient 20s ease-in-out infinite !important;
}

.platform-divider__sweep::after {
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(216, 160, 80, 0.024) 35%,
    rgba(216, 160, 80, 0.084) 50%,
    rgba(233, 184, 99, 0.06) 65%,
    transparent 100%
  ) !important;
}

.platform-divider__svg-sweep {
  opacity: 0.21 !important;
}

@keyframes ac-divider-light-sweep {
  0%, 78%, 100% { transform: translateX(0) skewX(-12deg); opacity: 0; }
  8%  { opacity: 0.51; }
  42% { transform: translateX(420%) skewX(-12deg); opacity: 0.42; }
  52% { opacity: 0; }
}

@keyframes ac-divider-svg-sweep {
  0%, 82%, 100% { transform: translateX(0); opacity: 0; }
  12% { opacity: 0.24; }
  48% { transform: translateX(1620px); opacity: 0.21; }
  58% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  body::before {
    animation: none !important;
    opacity: 0.58 !important;
  }

  .platform-divider__ambient {
    animation: none !important;
    opacity: 0.48 !important;
  }
}

/* ════════════════════════════════════════════════════
   PREMIUM MOTION v7 — slow continuous data-flow life
   Layer 1 grid · Layer 2 circuit · Layer 3 flow
   ════════════════════════════════════════════════════ */

/* Layer 1 */
.platform-bg__layer--grid {
  animation-duration: 56s !important;
}

/* Layer 2 */
.platform-bg__circuit-lines {
  animation: pb-circuit-lines-breathe 22s ease-in-out infinite !important;
}

.platform-bg__layer--circuit {
  animation: pb-circuit-breathe 24s ease-in-out infinite;
}

.platform-bg__circuit-pulse {
  animation: pb-circuit-flow-premium 38s linear infinite;
  opacity: 0.3;
}

.platform-bg__circuit-pulse--b { animation-duration: 44s; animation-delay: 10s; }
.platform-bg__circuit-pulse--c { animation-duration: 41s; animation-delay: 18s; }
.platform-bg__circuit-pulse--d { animation-duration: 46s; animation-delay: 26s; }

.platform-bg__circuit-node {
  animation: pb-circuit-node-soft-blink 14s ease-in-out infinite;
}

/* Layer 3 */
.platform-bg__stream--v1 { animation-duration: 46s !important; }
.platform-bg__stream--v2 { animation-duration: 52s !important; }
.platform-bg__stream--v3 { animation-duration: 44s !important; }
.platform-bg__stream--v4 { animation-duration: 50s !important; }
.platform-bg__stream--v5 { animation-duration: 48s !important; }
.platform-bg__stream--v6 { animation-duration: 54s !important; }
.platform-bg__stream--d1 { animation-duration: 58s !important; }
.platform-bg__stream--d2 { animation-duration: 50s !important; }
.platform-bg__stream--d3 { animation-duration: 56s !important; }
.platform-bg__stream--d4 { animation-duration: 47s !important; }

@keyframes pb-circuit-breathe {
  0%, 100% { opacity: 0.8; }
  50%      { opacity: 0.9; }
}

@keyframes pb-circuit-flow-premium {
  0%   { stroke-dashoffset: 640; opacity: 0; }
  6%   { opacity: 0.38; }
  94%  { opacity: 0.38; }
  100% { stroke-dashoffset: -640; opacity: 0; }
}

@keyframes pb-circuit-node-soft-blink {
  0%, 100% { opacity: 0.36; }
  48%      { opacity: 0.62; }
}

.platform-bg__particle {
  animation: pb-particle-drift var(--pt, 28s) ease-in-out infinite;
}

@keyframes pb-particle-drift {
  0%, 100% { opacity: 0.18; transform: translate(0, 0); }
  35%      { opacity: 0.48; transform: translate(10px, -14px); }
  70%      { opacity: 0.32; transform: translate(-6px, -22px); }
}

/* Layer 3c · data packets */
.platform-bg__data-packet {
  position: absolute;
  display: block;
  width: 5px;
  height: 2px;
  border-radius: 1px;
  background: rgba(216, 160, 80, 0.5);
  box-shadow: 0 0 6px rgba(216, 160, 80, 0.35);
  opacity: 0;
  pointer-events: none;
}

.platform-bg__data-packet--1 {
  top: 22%;
  left: -2%;
  animation: pb-packet-route-h 36s linear infinite 0s;
}

.platform-bg__data-packet--2 {
  top: 48%;
  left: -2%;
  animation: pb-packet-route-h 42s linear infinite 14s;
  background: rgba(233, 184, 99, 0.45);
  box-shadow: 0 0 6px rgba(233, 184, 99, 0.3);
}

.platform-bg__data-packet--3 {
  top: 68%;
  left: 18%;
  width: 2px;
  height: 5px;
  animation: pb-packet-route-v 38s linear infinite 8s;
}

.platform-bg__data-packet--4 {
  top: -2%;
  left: 72%;
  width: 2px;
  height: 5px;
  animation: pb-packet-route-v 44s linear infinite 22s;
  background: rgba(233, 184, 99, 0.42);
  box-shadow: 0 0 6px rgba(233, 184, 99, 0.28);
}

@keyframes pb-packet-route-h {
  0%   { transform: translateX(0); opacity: 0; }
  4%   { opacity: 0.45; }
  96%  { opacity: 0.45; }
  100% { transform: translateX(105vw); opacity: 0; }
}

@keyframes pb-packet-route-v {
  0%   { transform: translateY(0); opacity: 0; }
  4%   { opacity: 0.4; }
  96%  { opacity: 0.4; }
  100% { transform: translateY(105vh); opacity: 0; }
}

@keyframes ac-divider-chart-flow {
  0%   { stroke-dashoffset: 1800; opacity: 0; }
  10%  { opacity: 0.38; }
  90%  { opacity: 0.38; }
  100% { stroke-dashoffset: -1800; opacity: 0; }
}

/* ── Footer divider — slower premium motion ── */
.platform-divider__pulse {
  animation: ac-divider-flow 26s linear infinite !important;
}

.platform-divider__pulse--1 { animation-delay: 0s !important; }
.platform-divider__pulse--2 { animation-delay: 5s !important; }
.platform-divider__pulse--3 { animation-delay: 11s !important; }
.platform-divider__pulse--4 { animation-delay: 17s !important; }
.platform-divider__pulse--5 { animation-duration: 28s !important; animation-delay: 8s !important; }
.platform-divider__pulse--6 { animation-duration: 30s !important; animation-delay: 13s !important; }
.platform-divider__pulse--7 { animation-duration: 32s !important; animation-delay: 19s !important; }
.platform-divider__pulse--8 { animation-duration: 34s linear infinite 6s !important; }
.platform-divider__pulse--9 { animation-duration: 36s linear infinite 15s !important; }

.platform-divider__pulse--8 {
  stroke: url(#ac-flow-cyan);
  stroke-width: 1.2;
}

.platform-divider__pulse--9 {
  stroke: url(#ac-flow-purple);
  stroke-width: 1.2;
}

.platform-divider__chart-pulse--1 {
  animation: ac-divider-chart-flow 30s linear infinite !important;
}

.platform-divider__chart-pulse--2 {
  animation: ac-divider-chart-flow 34s linear infinite 9s !important;
}

.platform-divider__chart-pulse--scan {
  animation: ac-divider-chart-flow 28s linear infinite 4s !important;
}

.platform-divider__mesh {
  animation: ac-divider-mesh-breathe 22s ease-in-out infinite !important;
}

.platform-divider__particle {
  animation: ac-divider-particle-flow 20s ease-in-out infinite !important;
}

.platform-divider__tag {
  animation: ac-divider-tag-flicker 18s ease-in-out infinite !important;
}

@keyframes ac-divider-mesh-breathe {
  0%, 100% { opacity: 0.48; }
  50%      { opacity: 0.58; }
}

@keyframes ac-divider-particle-flow {
  0%, 100% { opacity: 0.22; transform: translateY(0); }
  50%      { opacity: 0.46; transform: translateY(-2px); }
}

@keyframes ac-divider-tag-flicker {
  0%, 100% { opacity: 0.48; }
  50%      { opacity: 0.62; }
}

.platform-divider__node {
  animation: ac-divider-node-glow 13s ease-in-out infinite !important;
}

@keyframes ac-divider-flow {
  0%   { stroke-dashoffset: 1440; opacity: 0; }
  8%   { opacity: 0.42; }
  92%  { opacity: 0.42; }
  100% { stroke-dashoffset: -1440; opacity: 0; }
}

@keyframes ac-divider-node-glow {
  0%, 100% { opacity: 0.38; }
  50%      { opacity: 0.68; }
}

.platform-divider__dots circle,
.platform-divider__dots--upper circle {
  animation: ac-divider-dot-blink 16s ease-in-out infinite;
}

.platform-divider__particles circle {
  animation: ac-divider-dot-travel 22s ease-in-out infinite;
}

.platform-divider__particles circle:nth-child(odd) { animation-delay: 3s; }
.platform-divider__particles circle:nth-child(3n) { animation-delay: 7s; }
.platform-divider__particles circle:nth-child(4n) { animation-delay: 11s; }

@keyframes ac-divider-dot-blink {
  0%, 100% { opacity: 0.28; }
  50%      { opacity: 0.58; }
}

@keyframes ac-divider-dot-travel {
  0%, 100% { opacity: 0.22; transform: translateY(0); }
  50%      { opacity: 0.52; transform: translateY(-3px); }
}

.platform-divider__bars {
  animation: ac-divider-bars-breathe 18s ease-in-out infinite !important;
}

@keyframes ac-divider-bars-breathe {
  0%, 100% { opacity: 0.48; }
  50%      { opacity: 0.58; }
}

@keyframes ac-divider-ambient {
  0%, 100% { opacity: 0.42; }
  50%      { opacity: 0.58; }
}

.platform-divider__data-packets {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  overflow: hidden;
}

.platform-divider__data-packet {
  position: absolute;
  display: block;
  width: 6px;
  height: 2px;
  border-radius: 1px;
  background: rgba(216, 160, 80, 0.55);
  box-shadow: 0 0 8px rgba(216, 160, 80, 0.4);
  opacity: 0;
}

.platform-divider__data-packet--1 {
  top: 38%;
  left: -3%;
  animation: ac-divider-packet-h 30s linear infinite 0s;
}

.platform-divider__data-packet--2 {
  top: 58%;
  left: -3%;
  animation: ac-divider-packet-h 36s linear infinite 12s;
  background: rgba(233, 184, 99, 0.5);
  box-shadow: 0 0 8px rgba(233, 184, 99, 0.32);
}

.platform-divider__data-packet--3 {
  top: 12%;
  left: 42%;
  width: 2px;
  height: 6px;
  animation: ac-divider-packet-v 32s linear infinite 20s;
}

@keyframes ac-divider-packet-h {
  0%   { transform: translateX(0); opacity: 0; }
  5%   { opacity: 0.5; }
  95%  { opacity: 0.5; }
  100% { transform: translateX(104vw); opacity: 0; }
}

@keyframes ac-divider-packet-v {
  0%   { transform: translateY(0); opacity: 0; }
  5%   { opacity: 0.45; }
  95%  { opacity: 0.45; }
  100% { transform: translateY(420px); opacity: 0; }
}

@keyframes ac-divider-light-sweep {
  0%, 88%, 100% { transform: translateX(0) skewX(-12deg); opacity: 0; }
  6%  { opacity: 0.38; }
  38% { transform: translateX(420%) skewX(-12deg); opacity: 0.32; }
  48% { opacity: 0; }
}

.platform-divider__sweep::after {
  animation: ac-divider-light-sweep 32s ease-in-out infinite !important;
}

.platform-divider__svg-sweep {
  animation: ac-divider-svg-sweep 36s ease-in-out infinite !important;
}

@media (prefers-reduced-motion: reduce) {
  .platform-bg__layer--grid,
  .platform-bg__layer--circuit,
  .platform-bg__layer--stars::before,
  .platform-bg__layer--stars::after,
  .platform-bg__star,
  .platform-bg__comet,
  .platform-bg__circuit-lines,
  .platform-bg__circuit-pulse,
  .platform-bg__circuit-node,
  .platform-bg__stream,
  .platform-bg__particle,
  .platform-bg__data-packet,
  .platform-divider__pulse,
  .platform-divider__chart-pulse,
  .platform-divider__node,
  .platform-divider__bars,
  .platform-divider__ambient,
  .platform-divider__dots circle,
  .platform-divider__dots--upper circle,
  .platform-divider__particles circle,
  .platform-divider__mesh,
  .platform-divider__particle,
  .platform-divider__tag,
  .platform-divider__data-packet,
  .platform-divider__sweep::after,
  .platform-divider__svg-sweep {
    animation: none !important;
  }

  .platform-bg__data-packet,
  .platform-bg__comet,
  .platform-divider__data-packet { opacity: 0; }
  .platform-bg__star { opacity: 0.45; }
  .platform-bg__circuit-pulse { opacity: 0.15; stroke-dashoffset: 0; }
  .platform-bg__circuit-node,
  .platform-divider__node { opacity: 0.55; }
  .platform-divider__particles circle { opacity: 0.38; }
  .platform-divider__pulse,
  .platform-divider__chart-pulse { opacity: 0.18; }
}

/* ════════════════════════════════════════════════════
   Animated backgrounds — desktop only (≥769px)
   Mobile: hide/disable all cyberpunk motion layers
   ════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  /* Keep starry sky on mobile; only drop heavy motion */
  .market-bg,
  .cyberpunk-bg,
  .animated-bg,
  .background-animation {
    display: none !important;
    visibility: hidden !important;
  }

  .platform-bg {
    display: block !important;
    visibility: visible !important;
  }

  .platform-bg__layer--grid,
  .platform-bg__layer--circuit,
  .platform-bg__layer--flow {
    display: none !important;
  }

  .platform-bg__layer--stars {
    display: block !important;
    opacity: 1 !important;
  }

  .platform-bg__layer--comets,
  .platform-bg__comet,
  .platform-bg__layer--stars::before,
  .platform-bg__layer--stars::after {
    animation: none !important;
  }

  .platform-bg__layer--comets {
    opacity: 0.55;
  }
}

@media (min-width: 769px) {
  .platform-bg,
  .cyberpunk-bg,
  .animated-bg,
  .background-animation {
    display: block;
  }
}

/* ════════════════════════════════════════════════════
   MARKET CHART BACKGROUND — DISABLED (mountains/grid banned)
   ════════════════════════════════════════════════════ */

.market-bg,
.market-bg svg,
.market-bg::after {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.cabinet-app,
.term-app {
  position: relative;
  z-index: 1;
}

@media (max-width: 768px) {
  .market-bg {
    display: none !important;
    visibility: hidden !important;
  }
}
