/* ImpactGuard — living tactical canvas v2 (loads last; softens static orange rules) */

:root {
  --ig-canvas-line: rgba(255, 255, 255, 0.028);
  --ig-canvas-line-strong: rgba(255, 255, 255, 0.045);
  --ig-canvas-glow: rgba(255, 92, 26, 0.06);
  --ig-canvas-glow-mid: rgba(255, 92, 26, 0.1);
  --ig-canvas-accent-flow: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 92, 26, 0.15) 25%,
    rgba(255, 140, 66, 0.35) 50%,
    rgba(255, 92, 26, 0.15) 75%,
    transparent 100%
  );
}

@keyframes ig-grid-drift {
  0% {
    background-position: 0 0, 0 0, 50% -12%;
  }
  100% {
    background-position: 64px 64px, 64px 64px, 50% -8%;
  }
}

@keyframes ig-glow-breathe {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(1);
  }
  50% {
    opacity: 0.85;
    transform: scale(1.02);
  }
}

@keyframes ig-accent-sweep {
  0% {
    background-position: 200% 50%;
  }
  100% {
    background-position: -200% 50%;
  }
}

@keyframes ig-edge-pulse {
  0%,
  100% {
    opacity: 0.35;
  }
  50% {
    opacity: 0.75;
  }
}

/* ── Public site grid (neutral lines + breathing glow, not flat orange) ── */
body.tactical.ig-public-site::before,
body.legal-page::before,
body.appeal-tactical::before,
body.ml-public-tactical::before,
body.docs-tactical::before,
body.status-tactical::before {
  background-image:
    linear-gradient(var(--ig-canvas-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--ig-canvas-line) 1px, transparent 1px) !important;
  background-size: 56px 56px, 56px 56px !important;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.35) 70%, transparent 100%) !important;
  animation: ig-grid-drift 48s linear infinite !important;
}

body.tactical.ig-public-site::after,
body.legal-page::after,
body.appeal-tactical::after,
body.ml-public-tactical::after,
body.docs-tactical::after,
body.status-tactical::after {
  background: radial-gradient(
    ellipse 85% 55% at 50% -18%,
    var(--ig-canvas-glow-mid),
    transparent 62%
  ) !important;
  animation: ig-glow-breathe 14s ease-in-out infinite !important;
}

body.legal-page,
body.appeal-tactical,
body.ml-public-tactical,
body.docs-tactical,
body.status-tactical {
  background-image:
    linear-gradient(var(--ig-canvas-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--ig-canvas-line) 1px, transparent 1px),
    radial-gradient(ellipse 75% 50% at 50% -14%, var(--ig-canvas-glow), transparent 58%) !important;
  background-size: 56px 56px, 56px 56px, 100% 100% !important;
  animation: ig-grid-drift 52s linear infinite !important;
}

/* ── Navbar lines: see nav-lines-fix.css (loads after this file) ── */

/* ── Legal / public accents ── */
body.legal-page .legal-title::after {
  width: 72px !important;
  height: 2px !important;
  background: var(--ig-canvas-accent-flow) !important;
  background-size: 200% 100% !important;
  animation: ig-accent-sweep 10s ease-in-out infinite !important;
}

body.legal-page .legal-meta {
  border-left: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: inset 2px 0 0 0 rgba(255, 92, 26, 0.25) !important;
}

body.legal-page .legal-hub-grid a {
  border-color: rgba(255, 255, 255, 0.08) !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease !important;
}

body.legal-page .legal-hub-grid a:hover {
  border-color: rgba(255, 92, 26, 0.28) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 92, 26, 0.12) !important;
}

/* ── Landing module section dividers (was thick static orange) ── */
.module-category--cs16-header {
  border-top: 1px solid var(--ig-canvas-line-strong) !important;
  position: relative !important;
}

.module-category--cs16-header::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: var(--ig-canvas-accent-flow) !important;
  background-size: 200% 100% !important;
  animation: ig-accent-sweep 14s ease-in-out infinite !important;
  opacity: 0.7 !important;
  pointer-events: none !important;
}

/* ── Panel shell ── */
/* Panel chrome lines: nav-lines-fix.css */

#app-view .main-content {
  background:
    radial-gradient(ellipse 90% 55% at 50% -22%, var(--ig-canvas-glow), transparent 58%),
    var(--ig-panel-bg, #060608) !important;
}

#app-view .stat-card::before,
#app-view .card::before {
  display: none !important;
}

/* Scrollbars — match tokens.css / tactical-chrome (orange brand) */
:root {
  --ig-scroll-thumb: var(--ig-scroll-thumb, #ff5c1a);
  --ig-scroll-thumb-hover: var(--ig-scroll-thumb-hover, #ff7a3d);
}

@media (prefers-reduced-motion: reduce) {
  body.tactical.ig-public-site::before,
  body.tactical.ig-public-site::after,
  body.legal-page,
  body.legal-page::before,
  body.legal-page::after,
  body.appeal-tactical,
  body.appeal-tactical::before,
  body.appeal-tactical::after,
  body.ml-public-tactical,
  body.docs-tactical,
  body.status-tactical,
  .nav.ig-tactical-nav::after,
  .module-category--cs16-header::before,
  #app-view .sidebar::before,
  #app-view .ig-tactical-header::after,
  #app-view .main-header::after,
  .nav.ig-tactical-nav .nav-links a:hover::after {
    animation: none !important;
  }
}
