/* PornGutschein — Schwarz/Rot-Retheme der Nocturne-Tokens.
   Wird NACH _ds/…/styles.css geladen und überschreibt nur :root-Variablen.
   Ramps in OKLCH auf derselben Helligkeitsskala nachgebaut: Neutral entblaut
   (fast schwarzer Grund), Akzent = Rot als Linie/Glow, nie als Flutfläche. */
:root {
  --color-bg: #131114;
  --color-surface: #1e1b1d;
  --color-text: #edeaeb;
  --color-accent: #e5484d;
  --color-accent-2: #d98d90;
  --color-divider: color-mix(in srgb, #edeaeb 16%, transparent);

  --color-neutral-100: #f6f3f4;
  --color-neutral-200: #e9e5e6;
  --color-neutral-300: #d4d0d2;
  --color-neutral-400: #b7b2b4;
  --color-neutral-500: #989296;
  --color-neutral-600: #7a7478;
  --color-neutral-700: #5d585b;
  --color-neutral-800: #423e40;
  --color-neutral-900: #2a2729;

  --color-accent-100: #fff1f0;
  --color-accent-200: #ffdedd;
  --color-accent-300: #fdbcbc;
  --color-accent-400: #f58e90;
  --color-accent-500: #e5484d;
  --color-accent-600: #bf3a41;
  --color-accent-700: #942f35;
  --color-accent-800: #692428;
  --color-accent-900: #421a1c;

  --color-accent-2-100: #fdf2f1;
  --color-accent-2-200: #f9dfde;
  --color-accent-2-300: #efc0c0;
  --color-accent-2-400: #e09a9c;
  --color-accent-2-500: #c97e81;
  --color-accent-2-600: #a96569;
  --color-accent-2-700: #835054;
  --color-accent-2-800: #5d3a3d;
  --color-accent-2-900: #3a2628;

  /* Sektionsgrund: gesättigtes Tiefrot — nur als Flächen-Präsenz (Stat-Band). */
  --color-section: #55121b;
  --color-section-glow: #75202b;
  --color-section-ghost: #96323d;

  --shadow-sm: 0 0 0 1px #423e40;
  --shadow-md: 0 0 0 1px #5d585b, 0 6px 18px rgba(0,0,0,0.55);
  --shadow-lg: 0 0 0 1px #989296, 0 16px 40px rgba(0,0,0,0.65);
}

/* ── Helles Farbschema (Umschalter im Header, gespeichert in pg_theme) ──
   Ramps invertiert auf derselben Skala: 100 = dunkelster, 900 = hellster Schritt,
   damit bestehende Zuordnungen (300 = Sekundärtext, 800/900 = Flächen) weiter stimmen. */
html[data-theme="light"] {
  --color-bg: #f7f4f4;
  --color-surface: #fdfcfc;
  --color-text: #201b1d;
  --color-accent: #c93038;
  --color-accent-2: #a2585d;
  --color-divider: color-mix(in srgb, #201b1d 14%, transparent);

  --color-neutral-100: #2a2729;
  --color-neutral-200: #3b3739;
  --color-neutral-300: #4c4749;
  --color-neutral-400: #6a6467;
  --color-neutral-500: #898286;
  --color-neutral-600: #a7a0a3;
  --color-neutral-700: #c5bfc1;
  --color-neutral-800: #ded8da;
  --color-neutral-900: #eeeaeb;

  --color-accent-100: #3f181a;
  --color-accent-200: #692428;
  --color-accent-300: #8f2d33;
  --color-accent-400: #b03840;
  --color-accent-500: #c93038;
  --color-accent-600: #d9575c;
  --color-accent-700: #ea9598;
  --color-accent-800: #f5c5c6;
  --color-accent-900: #fcecec;

  --color-accent-2-100: #3a2628;
  --color-accent-2-200: #5d3a3d;
  --color-accent-2-300: #835054;
  --color-accent-2-400: #a96569;
  --color-accent-2-500: #c97e81;
  --color-accent-2-600: #d99a9c;
  --color-accent-2-700: #e9bcbd;
  --color-accent-2-800: #f4d9d9;
  --color-accent-2-900: #fbf0f0;

  --color-section: #f3dadb;
  --color-section-glow: #ecc9cb;
  --color-section-ghost: #dfb0b4;

  --shadow-sm: 0 0 0 1px #e3dedf;
  --shadow-md: 0 0 0 1px #d6d0d2, 0 6px 18px rgba(32,27,29,0.08);
  --shadow-lg: 0 0 0 1px #c8c1c3, 0 16px 40px rgba(32,27,29,0.12);
}
/* Auf hellem Grund Fotos nicht aufhellen-blenden */
html[data-theme="light"] image-slot[data-blend][data-filled] { mix-blend-mode: normal; }
