/* ==========================================================================
   PROJECT LAZARUS — DESIGN TOKENS
   Source of truth for colors, type, spacing and motion.
   Import this file first in any Lazarus surface: landing pages, dashboards,
   shop, leaderboards, Discord embed cards, loading screens, etc.
   ========================================================================== */

:root {
  /* ----------- CORE PALETTE ----------- */
  /* Lazarus Acid — the primary brand color. Used for CTAs, accents, hero. */
  --laz-green:         #9dff2b;
  --laz-green-deep:    #5fc300;  /* hover / pressed */
  --laz-green-soft:    rgba(157, 255, 43, 0.15);

  /* Gamemode accents — each gamemode owns ONE color. Do not mix. */
  --gm-original:       #9dff2b;  /* acid green — "DayZ x Rust" (shares the Lazarus primary) */
  --gm-life:           #e6b84a;  /* gold — "Rust x GTA" */
  --gm-hardcore:       #ff2d2d;  /* red — reserved for Hardcore variant */

  /* Inks — backgrounds. Near-black with a slight green bias. */
  --ink:               #0a0d0a;  /* page */
  --ink-2:             #13181a;  /* raised surface */
  --ink-3:             #1b2124;  /* card */
  --ink-4:             #2a3237;  /* elevated / fog */

  /* Bones — foreground text. */
  --bone:              #e9e6dc;  /* primary text */
  --bone-2:            #bdb8a8;  /* secondary text */
  --bone-3:            #8a8678;  /* tertiary / captions */

  /* Utility */
  --hairline:          rgba(255, 255, 255, 0.08);
  --hairline-strong:   rgba(255, 255, 255, 0.18);
  --danger:            #ff2d2d;
  --success:           var(--laz-green);
  --warning:           var(--gm-life);

  /* ----------- TYPOGRAPHY ----------- */
  --font-display:      'Anton', 'Barlow Condensed', Impact, sans-serif;   /* huge headlines */
  --font-hed:          'Barlow Condensed', Impact, sans-serif;            /* UI labels, buttons */
  --font-body:         'Inter', system-ui, -apple-system, sans-serif;     /* body */
  --font-mono:         ui-monospace, 'SF Mono', Menlo, monospace;         /* stats, IPs, timestamps */

  /* Type scale */
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-22: 22px;
  --fs-28: 28px;
  --fs-40: 40px;
  --fs-56: 56px;
  --fs-80: 80px;
  --fs-hero: clamp(48px, 7vw, 96px);

  /* Tracking */
  --track-tight:       -0.01em;
  --track-normal:      0.02em;
  --track-ui:          0.12em;     /* barlow labels */
  --track-kicker:      0.3em;      /* eyebrow / kicker text */

  /* ----------- SPACING ----------- */
  --s-2:  2px;
  --s-4:  4px;
  --s-8:  8px;
  --s-12: 12px;
  --s-16: 16px;
  --s-20: 20px;
  --s-24: 24px;
  --s-32: 32px;
  --s-40: 40px;
  --s-60: 60px;
  --s-80: 80px;
  --s-120: 120px;
  --wrap-max: 1280px;

  /* ----------- RADII / BORDERS ----------- */
  --r-sharp:  2px;    /* default — Lazarus leans sharp, industrial */
  --r-card:   4px;
  --r-pill:   999px;

  /* ----------- ELEVATION ----------- */
  --shadow-green:      0 0 0 1px rgba(157,255,43,0.5), 0 12px 36px rgba(157,255,43,0.22);
  --shadow-green-lg:   0 0 0 1px var(--laz-green), 0 20px 60px rgba(157,255,43,0.35);
  --shadow-card:       0 12px 40px rgba(0,0,0,0.5);

  /* ----------- MOTION ----------- */
  --ease-out:          cubic-bezier(.2, .8, .2, 1);
  --dur-fast:          150ms;
  --dur-base:          250ms;
  --dur-slow:          600ms;
}

/* ==========================================================================
   BASE RESETS
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  background: var(--ink);
  color: var(--bone);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }

/* ==========================================================================
   TYPOGRAPHY HELPERS
   ========================================================================== */
.display {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: var(--track-normal);
  line-height: 0.95;
}
.hed {
  font-family: var(--font-hed);
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: var(--track-normal);
}
.kicker {
  font-family: var(--font-hed);
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: var(--track-kicker);
  font-size: var(--fs-13);
  color: var(--laz-green);
}
.mono { font-family: var(--font-mono); }

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.laz-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-hed);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: var(--track-ui);
  font-size: var(--fs-16);
  padding: 16px 28px;
  border-radius: var(--r-sharp);
  cursor: pointer;
  border: 0;
  transition: var(--dur-fast) var(--ease-out);
}
.laz-btn--primary {
  background: var(--laz-green);
  color: var(--ink);
  box-shadow: var(--shadow-green);
}
.laz-btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-green-lg);
}
.laz-btn--ghost {
  background: rgba(255,255,255,0.04);
  color: var(--bone);
  border: 1px solid var(--hairline-strong);
}
.laz-btn--ghost:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--bone);
}

/* ==========================================================================
   TEXTURES — the "Lazarus look"
   Apply to any surface that needs grit.
   ========================================================================== */
.laz-grain { position: relative; }
.laz-grain::before {
  content: "";
  position: absolute; inset: 0; pointer-events: none;
  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.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.35 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity: 0.35;
  mix-blend-mode: overlay;
}
.laz-scanline {
  background-image: repeating-linear-gradient(0deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 3px);
}

/* Corner-bracket accent (used on gamemode cards, mission cards) */
.laz-brackets { position: relative; }
.laz-brackets::before,
.laz-brackets::after {
  content: ""; position: absolute; width: 28px; height: 28px; pointer-events: none;
}
.laz-brackets::before { top: 16px; left: 16px; border-top: 2px solid var(--laz-green); border-left: 2px solid var(--laz-green); }
.laz-brackets::after { top: 16px; right: 16px; border-top: 2px solid var(--laz-green); border-right: 2px solid var(--laz-green); }