/* VIDEO EDITING — Neon Arcade: synthwave grid floor, CRT scanlines, cabinet panels */
.theme-arcade {
  --theme-bg: #0d0221;
  --theme-ink: #fff;
  --theme-panel: #120429;
  --theme-panel-ink: #fff;
  --theme-accent: #ff2d7a;
  --theme-accent-2: #ffe94a;
  --theme-border: #ff2d7a;
  --theme-heading-font: 'Press Start 2P', monospace;
  background: linear-gradient(#0d0221 0%, #2b0a52 55%, #ff2d7a 100%);
  background-attachment: fixed;
}
.theme-arcade .page-hero h1 {
  font-size: clamp(2rem, 6.5vw, 4.2rem); line-height: 1.3;
  color: #ffe94a; text-shadow: 4px 4px 0 #ff2d7a, 8px 8px 0 #00e5ff;
}
.theme-arcade .page-hero__kicker { font-family: 'Press Start 2P', monospace; font-size: .6rem; animation: arcade-blink 1s steps(1) infinite; }
@keyframes arcade-blink { 50% { opacity: .3; } }

.theme-arcade .panel,
.theme-arcade .card {
  border-width: 3px; border-radius: 6px;
  box-shadow: 0 0 0 3px #000, 0 0 18px #ff2d7a, inset 0 0 24px rgba(255,45,122,.2);
}
.theme-arcade .panel:nth-of-type(even), .theme-arcade .card:nth-child(even) {
  border-color: #00e5ff; box-shadow: 0 0 0 3px #000, 0 0 18px #00e5ff, inset 0 0 24px rgba(0,229,255,.2);
}
.theme-arcade .panel h2 { font-size: clamp(.95rem, 2.4vw, 1.3rem); line-height: 1.5; color: #00e5ff; }
.theme-arcade .card__title { font-size: .85rem; line-height: 1.5; color: #ffe94a; }
.theme-arcade .card__art--soon { --soon-bg: repeating-linear-gradient(0deg, rgba(0,0,0,.25) 0 2px, transparent 2px 4px), linear-gradient(135deg, #6a1fb8, #ff2d7a); }
.theme-arcade .card__art--soon span { font-family: 'Press Start 2P', monospace; font-size: .5rem; }
.theme-arcade .steps li { border-radius: 0; }
.theme-arcade .steps li::before { border-radius: 0; }
.theme-arcade .btn-pop { font-family: 'Press Start 2P', monospace; font-size: .8rem; line-height: 1.5; }

/* CRT showreel screen */
.crt {
  aspect-ratio: 16 / 9; max-width: 680px; margin: 0 auto; border: 10px solid #222; border-radius: 22px;
  background: radial-gradient(ellipse, #1a0640, #000);
  box-shadow: inset 0 0 40px #000, 0 0 0 4px #000;
  display: grid; place-content: center; text-align: center; gap: 10px;
  font-family: 'Press Start 2P', monospace; font-size: .8rem; color: #39ff6a;
  position: relative; overflow: hidden;
}
.crt::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,.35) 0 2px, transparent 2px 4px);
}
.crt big { font-size: 1.4rem; color: #ffe94a; animation: arcade-blink 1.2s steps(1) infinite; }

/* Synthwave floor + scanlines over the whole screen */
.grid-floor {
  position: fixed; left: -50%; right: -50%; bottom: 0; height: 45vh; z-index: 0; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,229,255,.6) 2px, transparent 2px) 0 0 / 60px 60px,
    linear-gradient(rgba(0,229,255,.6) 2px, transparent 2px) 0 0 / 60px 60px;
  transform: perspective(300px) rotateX(60deg); transform-origin: bottom;
  animation: floor-run 1.5s linear infinite;
  -webkit-mask: linear-gradient(transparent, #000 40%);
          mask: linear-gradient(transparent, #000 40%);
}
@keyframes floor-run { to { background-position: 0 60px, 0 60px; } }
.scanlines {
  position: fixed; inset: 0; z-index: 900; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0,0,0,.12) 0 1px, transparent 1px 3px);
}
.marquee {
  overflow: hidden; white-space: nowrap; border-block: 3px solid #ffe94a; background: #000; color: #ffe94a;
  font-family: 'Press Start 2P', monospace; font-size: .7rem; padding: .6em 0; position: relative; z-index: 1;
}
.marquee span { display: inline-block; padding-left: 100%; animation: marquee 18s linear infinite; }
@keyframes marquee { to { transform: translateX(-100%); } }

.theme-arcade .floaty { position: absolute; animation: arcade-hop steps(4) infinite; opacity: .55; }
@keyframes arcade-hop { 50% { transform: translateY(-24px); } }

/* --- Collage layer: photocopied xerox zine with neon highlighter --- */
.theme-arcade {
  --paper-1: #f2f2f2; --paper-2: #fff27a; --paper-3: #bff4ff;
  --ink: #0d0221; --tape-1: rgba(255, 45, 122, .6); --tape-2: rgba(0, 229, 255, .6);
  --theme-accent-strong: #ff2d7a;
}
.theme-arcade .panel.torn h2 { color: #ff2d7a; text-shadow: 3px 3px 0 #0d0221; }
.theme-arcade .price-list li { --tag-bg: #ffe94a; }
.theme-arcade .price-list li:nth-child(2n) { --tag-bg: #00e5ff; }