/* Farbkonzept „Fanzine“ – kopiertes Konzertplakat: Zeitungspapier, Schwarz
   und genau eine Schmuckfarbe (Ziegelrot) in zwei Rastertönen.
   Einbinden direkt nach css/style.css · passende theme-color: #151515 */
:root{
  /* ===== Palette ===== */
  --newsprint:   #DAD5C9;   /* Zeitungspapier */
  --sheet:       #EBE7DE;   /* helles Papier */
  --black:       #151515;   /* Schwarz */
  --graphite:    #4B4740;   /* Graphit */
  --screen-grey: #C4BFB3;   /* Grauraster */
  --pale-grey:   #ADA89C;   /* Hellgrau */
  --brick:       #C9654F;   /* Ziegelrot voll (nie als Textfarbe) */
  --brick-tint:  #DE8F7C;   /* Ziegelrot gerastert */

  /* ===== Rollen (in allen Farbdateien gleich) ===== */
  /* Flächen */
  --bg:                 var(--newsprint); /* Seitenhintergrund */
  --surface:            var(--sheet);     /* Karten, Drawer-Links, Buttons */
  --header-bg:          var(--black);     /* Header-Leiste */
  --band:               var(--black);     /* Farbband hinter „Music“ */
  --footer-bg:          var(--black);
  --dark:               var(--black);     /* Grund von Hero, Player-Leiste, Cover, Video */
  --plaque:             var(--black);     /* Logo-Plakette */
  /* Schrift */
  --text-body:          var(--black);     /* Fließtext, Buttons, Drawer-Links */
  --text-heading:       var(--black);     /* Section-, Album-, Videotitel */
  --muted:              var(--graphite);  /* Ort, Tracklist, Tracknummern */
  --on-accent:          var(--black);     /* Schrift auf Akzent-, Hover- und CTA-Flächen */
  --band-text:          var(--sheet);     /* Titel auf dem Music-Band */
  --text-on-dark:       var(--sheet);     /* Footer, Player-Leiste */
  --text-on-dark-muted: var(--pale-grey); /* Footer-Kleintext */
  /* Linien & Schatten */
  --line:               var(--black);     /* alle Rahmen und Trennlinien */
  --shadow-c:           var(--black);     /* harte Schatten */
  --band-shadow:        var(--brick-tint);/* Schatten auf dem Music-Band */
  --rule-soft:          rgba(21, 21, 21, .2); /* feine Linien der Tracklist */
  /* Akzente */
  --accent:             var(--brick-tint);/* aktiv / markiert / Play */
  --accent-hover:       var(--screen-grey); /* Hover-Fläche */
  --cta:                var(--brick);     /* Haupt-Button, Badges */
  --accent-on-dark:     var(--brick-tint);/* Akzent auf dunklem Grund: Hero, Footer, Player */
  --focus:              var(--black);     /* Fokusrahmen (Tastatur) */
  /* Header (schwarz: helle Schrift, Marker als Unterstreichung) */
  --header-text:        var(--sheet);     /* Markenname, Navigation, Burger */
  --header-muted:       var(--pale-grey); /* Untertitel unter dem Markennamen */
  --header-mark:        var(--brick-tint);/* Marker aktiver Menüpunkt */
  --header-mark-hover:  var(--screen-grey); /* Marker bei Hover */
  --header-ring:        var(--sheet);     /* Rand der Logo-Plakette */
  --nav-mark-inset:     76% -12px -16% -12px; /* Marker unter statt hinter dem Wort */
  /* Sonstiges */
  --drawer-backdrop:    rgba(21, 21, 21, .6);
}