/* Site-wide visual theme, loaded on all 5 routes after shared.css.
   Direction: industrial-brutalist-ui skill, "Tactical Telemetry & CRT
   Terminal" archetype — dark terminal, monospace-dominant, a single
   hazard-red accent, hard 90° corners, no gradients/glassmorphism.
   Terminal green is reserved for exactly one element (the paired
   "Maîtrise" label) per the skill's "single specific indicator" rule.
   Prototyped on index.html alone first, then rolled out everywhere once
   approved. The palette itself (colors + --radius) now lives directly in
   shared.css's own :root — merged there once the theme became permanent,
   so it isn't duplicated in two places with this file always winning.
   What's left here is everything that isn't a simple variable swap:
   textures, font, ASCII framing, and the handful of shared.css rules that
   hardcode a radius/color instead of referencing a variable. */

/* Blueprint grid: a fine 8px mesh plus a bolder 40px mesh, both very low
   opacity — reads as engineering-drawing graph paper rather than a busy
   pattern. Fixed to the viewport (not the page) so it feels like part of
   the same instrument surface as the scanline overlay below, instead of
   paper scrolling past underneath the content. */
body{
  background-color:var(--bg);
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0, rgba(255,255,255,.05) 1px, transparent 1px, transparent 40px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0, rgba(255,255,255,.05) 1px, transparent 1px, transparent 40px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.02) 0, rgba(255,255,255,.02) 1px, transparent 1px, transparent 8px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0, rgba(255,255,255,.02) 1px, transparent 1px, transparent 8px);
  background-attachment:fixed;
  font-family:'IBM Plex Mono','Space Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

/* CRT scanline texture — fixed overlay, no layout impact, no new markup */
body::after{
  content:"";
  position:fixed; inset:0; z-index:100; pointer-events:none;
  background:repeating-linear-gradient(0deg,
    rgba(255,255,255,.025), rgba(255,255,255,.025) 1px,
    transparent 1px, transparent 3px);
  mix-blend-mode:overlay;
}

/* Hard corners everywhere shared.css hardcoded a radius (the --radius vars
   above only cover the classes that already referenced them). */
.nav-link, .lang-switch, button, input[type=number], input[type=text], select,
.card, .intro-card, .res-card, .res-card .missing, .rarity-badge,
.research-group, .group-badge, .track, .track-badge, .estimated-tag,
.sticky-chip, .breakdown tr {
  border-radius:0;
}
/* Base dot shape override only — the actual per-resource icons now live in
   shared.css (universal, all 5 routes), since they aren't specific to this
   theme. Sizing here just keeps the square-corners doctrine: an icon that
   IS defined for a resource still renders (shared.css sets its own
   width/height on top of this), only the plain undefined-resource dot
   stays square instead of round. */
.res-dot{ border-radius:0; width:7px; height:7px; }

/* Structural type: uppercase + tracking on headers, ASCII bracket framing
   on the two main card headings. */
h1, h2, .cat-title, .part-header, .brand-eyebrow, .intro-title{
  text-transform:uppercase;
  letter-spacing:.04em;
}
.card h2::before{ content:"[ "; color:var(--muted); }
.card h2::after{ content:" ]"; color:var(--muted); }

/* No glassmorphism on the sticky bar — solid panel + hard top border. */
.sticky-bar{
  background:var(--panel);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-top:2px solid var(--border);
}

/* White text on this red fails WCAG AA (3.74:1) — dark text passes (5.3:1)
   and reads more like real hazard signage anyway (black-on-red tape). */
.nav-link.active{ background:var(--accent); border-color:var(--accent); color:var(--bg); }
.lang-btn.active{ background:var(--accent); color:var(--bg); }