/* shared.css — L4z-R-u$ — Monochrome */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,700;1,400&family=Space+Grotesk:wght@500;700&display=swap');

:root {
  --bg:           #060606;
  --bg-panel:     #0B0B0B;
  --border:       #1C1C1C;
  --border-light: #2E2E2E;
  --text:         #F0F0F0;    /* valeurs principales — blanc lumineux */
  --text-mid:     #B4B4B4;    /* labels, secondaire — gris clair lisible */
  --text-dim:     #484848;    /* très discret */
  --text-bright:  #FFFFFF;    /* highlights, chiffres clés */
  --danger:       #A02840;
  --danger-dim:   rgba(160, 40, 64, 0.10);
  --warn:         #886020;
  --warn-dim:     rgba(136, 96, 32, 0.10);
  --success:      #286844;
  --success-dim:  rgba(40, 104, 68, 0.10);
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;
  --font-title:   'Space Grotesk', system-ui, sans-serif;
}

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

body {
  background-color: var(--bg);
  color: var(--text);
  font-family: var(--font-mono);
  overflow-x: hidden;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  position: relative;
}

.disclaimer {
  background-color: var(--danger);
  color: #fff;
  padding: 5px 12px;
  text-align: center;
  font-weight: 700;
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* Animations */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

@keyframes blinkFast {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.2; }
}

@keyframes glitch {
  0%   { transform: translate(0); }
  20%  { transform: translate(-1px,  1px); }
  40%  { transform: translate(-1px, -1px); }
  60%  { transform: translate( 1px,  1px); }
  80%  { transform: translate( 1px, -1px); }
  100% { transform: translate(0); }
}

@keyframes flicker {
  0%, 6%, 8%, 10%, 100% { opacity: 1; }
  3%, 7%, 9%             { opacity: 0.5; }
}

@keyframes scan {
  0%   { top: 0; }
  100% { top: 100%; }
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.glitch     { animation: glitch  0.3s infinite; }
.flicker    { animation: flicker 4s   infinite; }
.blink-fast { animation: blinkFast 0.5s infinite; }

.cursor {
  display: inline-block;
  width: 7px;
  height: 12px;
  background-color: var(--text);
  animation: blink 1s infinite;
  vertical-align: middle;
  margin-left: 2px;
}

.scan-line {
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 1px;
  background: var(--text);
  opacity: 0.04;
  animation: scan 12s linear infinite;
  pointer-events: none;
  z-index: 10;
}

/* Scanlines CRT — texture subtile sur toute la page */
.noise {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.05) 2px,
    rgba(0, 0, 0, 0.05) 3px
  );
}

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