/* ============================================================
   theme/tokens.css — Design-Tokens dieses Tenants (#105)
   ------------------------------------------------------------
   Angelegt mit zpub init (Publisher 1.0.0-rc.19). Der Build lädt
   diese Datei NACH der style.css des Publishers; gesetzte
   Werte überschreiben die Tokens des Templates. Funktion
   (HTML, JS, Layout) bleibt im Publisher und kommt mit jedem
   Update — hier steht nur das Design.

   Unten stehen alle Tokens mit dem zentonic26-Standardwert,
   auskommentiert. Zum Ändern die Zeile einkommentieren und
   den Wert anpassen. Vertrag (Namen, Bedeutung, Version):
   templates/zentonic26/TEMPLATE.md im Publisher,
   Anleitung: docs/theming.md.
   ============================================================ */

:root {
  /* surfaces */
  /* --bg-void: #06050f; */
  /* --bg-page: #0b0a1a; */
  /* --bg-panel: #12112a; */
  /* --bg-raised: #1c1940; */
  /* --bg-inset: #080612; */
  /* foreground */
  /* --fg-1: #e8eef6; */
  /* --fg-2: #97a6ba; */
  /* --fg-3: #5b6b7e; */
  /* --fg-4: #36424f; */
  /* borders */
  /* --line-1: #1c2533; */
  /* --line-2: #2a3647; */
  /* --line-3: #3c4d63; */
  /* accents */
  /* --blue: #3d8bff; */
  /* --blue-bright: #62a4ff; */
  /* --blue-dim: #1e4a8a; */
  /* --blue-glow: rgba(61,139,255,.45); */
  /* --green: #36f1a6; */
  /* --green-bright: #5cffc0; */
  /* --green-glow: rgba(54,241,166,.40); */
  /* --amber: #ffb340; */
  /* --amber-glow: rgba(255,179,64,.40); */
  /* --magenta: #ff4d9d; */
  /* --magenta-glow: rgba(255,77,157,.40); */
  /* --cyan: #36d6ff; */
  /* --cyan-glow: rgba(54,214,255,.38); */
  /* --violet: #7c4dff; */
  /* --violet-glow: rgba(124,77,255,.42); */
  /* --red: #ff5c63; */
  /* semantic */
  /* --link: var(--blue); */
  /* --link-hover: var(--blue-bright); */
  /* --prompt: var(--green); */
  /* type */
  /* #83: Berkeley Mono/TX-02 nur, wenn der Tenant sie liefert (fonts.css);
     sonst greift der freie Fallback-Stack */
  /* --font-fallback: ui-monospace,"JetBrains Mono","IBM Plex Mono",SFMono-Regular,Menlo,Consolas,monospace; */
  /* --font-display: "Berkeley Mono Cond","Berkeley Mono",var(--font-fallback); */
  /* --font-ultra: "Berkeley Mono Ultra","Berkeley Mono",var(--font-fallback); */
  /* --font-ui: "Berkeley Mono",var(--font-fallback); */
  /* --font-body: "TX-02","Berkeley Mono",var(--font-fallback); */
  /* --font-mono: "TX-02","Berkeley Mono",var(--font-fallback); */
  /* type scale */
  /* --t-display: clamp(52px, 9vw, 88px); */
  /* --t-h1: clamp(28px, 5vw, 44px); */
  /* --t-h2: 30px; */
  /* --t-h3: 21px; */
  /* --t-h4: 16px; */
  /* --t-body: 15px; */
  /* --t-small: 13px; */
  /* --t-micro: 11px; */
  /* spacing (4px grid) */
  /* --sp-1: 4px; */
  /* --sp-2: 8px; */
  /* --sp-3: 12px; */
  /* --sp-4: 16px; */
  /* --sp-5: 24px; */
  /* --sp-6: 32px; */
  /* --sp-7: 48px; */
  /* --sp-8: 64px; */
  /* --sp-9: 96px; */
  /* radii — sharp by design */
  /* --r-0: 0px; */
  /* --r-1: 2px; */
  /* --r-2: 4px; */
  /* elevation — glow, not shadow */
  /* --shadow-panel: 0 1px 0 rgba(255,255,255,.02) inset, 0 12px 32px -12px rgba(0,0,0,.8); */
  /* --glow-blue: 0 0 0 1px rgba(61,139,255,.35), 0 0 18px -2px var(--blue-glow); */
  /* --glow-green: 0 0 0 1px rgba(54,241,166,.35), 0 0 18px -2px var(--green-glow); */
  /* --glow-magenta: 0 0 0 1px rgba(255,77,157,.35), 0 0 18px -2px var(--magenta-glow); */
  /* --glow-text-blue: 0 0 12px var(--blue-glow); */
  /* --glow-text-green: 0 0 10px var(--green-glow); */
  /* motion */
  /* --ease: cubic-bezier(.2,.6,.2,1); */
  /* --dur-fast: 90ms; */
  /* --dur: 160ms; */
  /* --dur-slow: 280ms; */
  /* misc */
  /* --scanline: repeating-linear-gradient( to bottom, rgba(255,255,255,.022) 0 1px, transparent 1px 3px); */
  /* --maxw: 1100px; */
  /* component tokens (#105) — vormals Hartwerte in den Komponenten.
     Theme-Vertrag: TEMPLATE.md „Theme-Schicht“. Abgeleitete Werte folgen
     den Akzent-Tokens; ein Tenant überschreibt sie in theme/tokens.css. */
  /* --selection-bg: color-mix(in srgb, var(--blue) 30%, transparent); */
  /* Hero-Glow bewusst als Literal: color-mix im Verlauf rundet um 1/255 ab */
  /* --hero-bg: radial-gradient(900px 360px at 18% -10%, rgba(61,139,255,.16), transparent 60%), var(--bg-void); */
  /* --hero-border: 1px solid var(--line-2); */
  /* --wordmark-color: var(--fg-1); */
  /* --wordmark-shadow: 0 0 40px color-mix(in srgb, var(--blue) 25%, transparent); */
  /* --ph-stripe-a: #11304f; */
  /* --ph-stripe-b: #0c2238; */
  /* --ph-nr-color: var(--blue); */
  /* --ph-nr-shadow: 0 0 20px var(--blue-glow); */
  /* --badge-bg: color-mix(in srgb, var(--blue) 10%, transparent); */
  /* --badge-border: var(--blue-dim); */
  /* --badge-amber-bg: color-mix(in srgb, var(--amber) 10%, transparent); */
  /* --badge-amber-border: color-mix(in srgb, var(--amber) 35%, transparent); */
  /* --badge-green-bg: color-mix(in srgb, var(--green) 8%, transparent); */
  /* --badge-green-border: color-mix(in srgb, var(--green) 35%, transparent); */
  /* --badge-magenta-bg: color-mix(in srgb, var(--magenta) 8%, transparent); */
  /* --badge-magenta-border: color-mix(in srgb, var(--magenta) 35%, transparent); */
  /* --badge-cyan-bg: color-mix(in srgb, var(--cyan) 7%, transparent); */
  /* --badge-cyan-border: color-mix(in srgb, var(--cyan) 30%, transparent); */
  /* --avatar-bg: radial-gradient(circle at 30% 30%, #2a4a6e, #0c1828); */
  /* --backdrop: rgba(6,5,15,.9); */
  /* --overlay-btn-bg: rgba(8,6,18,.8); */
  /* --glow-play-hover: 0 0 0 1px color-mix(in srgb, var(--blue) 50%, transparent), 0 0 28px -2px var(--blue-glow); */
  /* --shadow-pop: 0 -12px 32px -12px rgba(0,0,0,.8); */
}

/* Zweiter Modus — nur mit podcast.toml [theme] modes = ["light", "dark"].
   :root oben ist dann der Standardmodus ([theme] default), dieser Block der
   andere (hier: dunkel). Nur Tokens setzen, die sich je Modus unterscheiden.
[data-theme="dark"] {
  color-scheme: dark;
  --bg-page: #0b0a1a;
  --fg-1:    #e8eef6;
}
*/
