/* Mnemi — dark cinematic theme.
   Remaps the design system's own tokens so every page built on them inverts
   without touching their markup. Linked from each page's helmet. */
:root {
  --color-bg: #04060a;
  --color-surface: rgba(255,255,255,0.05);
  --color-text: #eef3f8;
  --color-divider: rgba(255,255,255,0.13);
  --color-accent: #4fc6e8;
  --color-accent-2: #ff5fa2;
  --color-accent-100: rgba(79,198,232,0.15);
  --color-accent-200: rgba(79,198,232,0.22);
  --color-accent-300: rgba(79,198,232,0.3);
  --color-accent-500: #4fc6e8;
  --color-accent-600: #7fd7ef;
  --color-accent-700: #9fe0f4;
  --color-accent-800: #d3effb;
  --color-accent-900: #eaf8fe;
  --color-accent-2-100: rgba(255,95,162,0.15);
  --color-accent-2-200: rgba(255,95,162,0.24);
  --color-accent-2-500: #ff5fa2;
  --color-accent-2-600: #ff7cb3;
  --color-accent-2-700: #ff9cc6;
  --color-accent-2-800: #ffcbe1;
  --color-neutral-100: rgba(255,255,255,0.07);
  --color-neutral-200: rgba(255,255,255,0.12);
  --color-neutral-800: rgba(255,255,255,0.8);
  --color-neutral-900: #05070c;
  --color-process-yellow: #ffd166;
  --radius-sm: 7px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.5);
  --shadow-md: 0 14px 40px -12px rgba(0,0,0,0.75);
  --shadow-lg: 0 40px 110px -28px rgba(0,0,0,0.92);

  --mn-shell: #04060a;
  --mn-blur: blur(24px) saturate(180%) brightness(1.06);
  --mn-spec: inset 0 1px 0 rgba(255,255,255,0.13), inset 0 -1px 0 rgba(0,0,0,0.34), 0 18px 44px -26px rgba(0,0,0,0.92);
  --mn-spec-hi: inset 0 1px 0 rgba(255,255,255,0.26), inset 0 -1px 0 rgba(0,0,0,0.4), 0 28px 66px -28px rgba(0,0,0,0.96);
  --mn-glass: rgba(255,255,255,0.045);
  --mn-glass-2: rgba(255,255,255,0.08);
  --mn-line: rgba(255,255,255,0.09);
  --mn-strong: #ffffff;
  --mn-soft: rgba(255,255,255,0.82);
  --mn-faint: rgba(255,255,255,0.72);
  --mn-halo-c: rgba(79,198,232,0.14);
  --mn-halo-m: rgba(255,95,162,0.13);
  --mn-glowc: rgba(79,198,232,0.5);

  --mn-kicker-c: #9fe0f4;
  --mn-kicker-m: #ff8dbb;
  --mn-dot-c: #4fc6e8;
  --mn-dot-m: #ff5fa2;
  --mn-badge-bg: rgba(214,0,108,0.14);
  --mn-badge-border: rgba(214,0,108,0.32);
  --mn-pill-bg: rgba(6,10,18,0.72);
  --mn-pill-ink: rgba(255,255,255,0.68);
  --mn-pill-line: rgba(255,255,255,0.12);
  --mn-nebula-c: rgba(0,136,176,0.26);
  --mn-nebula-m: rgba(214,0,108,0.18);
  --mn-dots: rgba(255,255,255,0.055);
  --mn-beam: rgba(79,198,232,0.09);
  --mn-vignette: rgba(4,6,10,0.42);
  --mn-btn: linear-gradient(180deg, #0aa3d0, #0079a0);
  --mn-btn-ink: #fff;
  --mn-active: rgba(79,198,232,0.16);
  --mn-active-line: rgba(79,198,232,0.32);
  --mn-good: #7fe0a8;
  --mn-bad: #ff8dbb;
  --mn-track: rgba(255,255,255,0.07);
}
html, body { margin: 0; background: #04060a; }
body { -webkit-font-smoothing: antialiased; color: #eef3f8; }
::selection { background: rgba(79,198,232,0.42); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.14); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }
a { color: #4fc6e8; }
a:hover { color: #7fd7ef; }
:focus-visible { outline: 2px solid #4fc6e8; outline-offset: 3px; }

/* Print plates make no sense on ink-black ground: C×M×Y multiply resolves to
   black. Figures become clean emissive numerals instead. */
.cmyk-num, .cmyk-head { background: transparent !important; padding: 0 !important; margin: 0 !important; }
.cmyk-num .paper, .cmyk-head .paper { color: #fff !important; text-shadow: 0 0 34px rgba(79,198,232,0.4) !important; }
.cmyk-num .plate, .cmyk-head .plate { display: none !important; }

.card { border: 1px solid rgba(255,255,255,0.08); backdrop-filter: blur(20px); }
.input { color: #fff; background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.12); }
.input::placeholder { color: rgba(255,255,255,0.4); }
.table tbody tr:hover { background: rgba(255,255,255,0.05); }
.btn-primary { box-shadow: 0 12px 34px -14px rgba(79,198,232,0.8); }
.btn-secondary { background: rgba(255,255,255,0.05); }
.dialog { background: rgba(22,26,36,0.94); border: 1px solid rgba(255,255,255,0.12); }
.seg { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.09); }
.tag-neutral { background: rgba(255,255,255,0.07); color: rgba(255,255,255,0.76); }

/* Film grain — 3%, kills the banding the two nebulae leave on the ground. */
.mn-grain {
  position: absolute; inset: 0; pointer-events: none; opacity: 0.035;
  mix-blend-mode: overlay; background-repeat: repeat; background-size: 180px 180px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
}

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