/* ── Design Tokens ──────────────────────────────── */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  /* Brand palette */
  --color-bg: #101323;
  --color-cyan: #00f5ff;
  --color-magenta: #ff2d78;
  --color-text: #ffffff;
  --color-text-dim: rgba(255,255,255,0.5);

  /* Typography */
  --font-sans: 'Inter', system-ui, sans-serif;
  --font-mono: 'Share Tech Mono', monospace;

  /* Surfaces (bg hex = 16,19,35) */
  --surface-panel: rgba(16, 19, 35, 0.6);
  --surface-overlay: rgba(16, 19, 35, 0.85);
  --surface-nav-mobile: rgba(16, 19, 35, 0.95);

  /* Borders */
  --border-subtle: rgba(255, 255, 255, 0.05);
  --border-dim: rgba(255, 255, 255, 0.08);
  --border-default: rgba(255, 255, 255, 0.15);

  /* Effects */
  --glow-logo: drop-shadow(0 0 40px rgba(0, 245, 255, 0.3));
  --blur-panel: blur(12px);

  /* Background layer defaults (override per page via inline :root) */
  --frame-duration: 6s;
  --fade-duration: 2s;
  --zoom-amount: 1.08;
  --grain-opacity: 0.04;
  --scanline-opacity: 0.06;
  --overlay-blend: color;
  --overlay-color: rgba(16, 19, 35, 0.55);
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-weight: 700;
  overflow-x: hidden;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

.content {
  position: relative;
  z-index: 10;
  min-height: 100vh;
}

/* Glass panel pattern (reusable) */
.glass-panel {
  background: var(--surface-panel);
  backdrop-filter: var(--blur-panel);
  -webkit-backdrop-filter: var(--blur-panel);
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
}

@supports not (backdrop-filter: blur(1px)) {
  .glass-panel {
    background: var(--surface-overlay);
  }
}

.hidden { display: none; }

/* Mobile global fixes */
@media (max-width: 768px) {
  h1, h2, h3, h4, h5, h6, p, li, span, div {
    text-align: left;
  }

  body {
    overflow-x: hidden;
  }

  .content {
    max-width: 100vw;
    overflow-x: hidden;
  }

  h1, h2, h3, h4, h5, h6, p {
    overflow-wrap: break-word;
    word-break: break-word;
  }

  .glass-panel,
  .album-section,
  .content-section,
  .epk__section,
  .transmission__embed,
  .transmission__meta {
    border-radius: 0;
  }
}