/* === Lorath — Theme-Definitionen === * * Gesteuert über data-theme="..." auf . * Default (kein data-theme-Attribut) wird im :root-Block von style.css * als "fantasy" definiert. * Schriftarten über data-font="..." auf . */ /* ─── Sanftes Hellgrau (light) — data-theme="light" ─── */ [data-theme="light"] { color-scheme: light; --ff-bg-primary: #eef3f7; --ff-bg-secondary: #e7ecef; --ff-bg-tertiary: #e0e5e6; --ff-bg-card: #e4e9eb; --ff-bg-primary-rgb: 238, 243, 247; --ff-bg-secondary-rgb: 231, 236, 239; --ff-bg-tertiary-rgb: 224, 229, 230; --ff-bg-card-rgb: 228, 233, 235; --ff-text-primary: #4f5a3b; --ff-text-primary-rgb: 79, 90, 59; --ff-text-light: #5c664a; --ff-text-soft: #687259; --ff-text-secondary: #757f68; --ff-text-subdued: #828b77; --ff-text-muted: #88917f; --ff-text-muted-rgb: 136, 145, 127; --ff-text-dim: #a5ada1; --ff-text-faint: #b5bcb3; --ff-text-quote: #685d4a; --ff-accent: #db6a8c; --ff-accent-hover: #87b7d8; --ff-accent-dark: #ba5a77; --ff-accent-darker: #9e4c65; --ff-accent-rgb: 219, 106, 140; --ff-gold: #87b7d8; --ff-gold-light: #a1c7e1; --ff-gold-dark: #698fa8; --ff-gold-rgb: 135, 183, 216; --ff-on-accent: #ffffff; --ff-on-gold: #4f5a3b; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 230, 162, 146; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(135, 183, 216, 0.28); --ff-border-strong: rgba(135, 183, 216, 0.45); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); --ff-glow-gold: rgba(135, 183, 216, 0.22); --ff-scrollbar-track: #e0e5e6; --ff-scrollbar-thumb: #87b7d8; --ff-purple: #b16574; --ff-purple-light: #ba7785; --ff-purple-rgb: 177, 101, 116; --ff-user-bubble-rgb: 156, 99, 104; --ff-user-strong: rgba(142, 97, 95, 1); --ff-ai-memory-rgb: 188, 102, 122; --ff-thinking-rgb: 145, 83, 95; --ff-lore-rgb: 111, 144, 150; --ff-code-border-rgb: 143, 151, 134; } /* ─── Zartes Grün (light) — data-theme="sage" ─── */ [data-theme="sage"] { color-scheme: light; --ff-bg-primary: #eaf4ec; --ff-bg-secondary: #e1ece3; --ff-bg-tertiary: #d7e3da; --ff-bg-card: #dde8df; --ff-bg-primary-rgb: 234, 244, 236; --ff-bg-secondary-rgb: 225, 236, 227; --ff-bg-tertiary-rgb: 215, 227, 218; --ff-bg-card-rgb: 221, 232, 223; --ff-text-primary: #1c3a27; --ff-text-primary-rgb: 28, 58, 39; --ff-text-light: #2c4937; --ff-text-soft: #3d5847; --ff-text-secondary: #4d6756; --ff-text-subdued: #5e7666; --ff-text-muted: #667d6e; --ff-text-muted-rgb: 102, 125, 110; --ff-text-dim: #8b9e91; --ff-text-faint: #a0b1a5; --ff-text-quote: #314641; --ff-accent: #8e7ab5; --ff-accent-hover: #e89f95; --ff-accent-dark: #79689a; --ff-accent-darker: #665882; --ff-accent-rgb: 142, 122, 181; --ff-gold: #e89f95; --ff-gold-light: #edb4ac; --ff-gold-dark: #b57c74; --ff-gold-rgb: 232, 159, 149; --ff-on-accent: #ffffff; --ff-on-gold: #1c3a27; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 230, 162, 146; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(232, 159, 149, 0.28); --ff-border-strong: rgba(232, 159, 149, 0.45); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); --ff-glow-gold: rgba(232, 159, 149, 0.22); --ff-scrollbar-track: #d7e3da; --ff-scrollbar-thumb: #e89f95; --ff-purple: #6c678a; --ff-purple-light: #7e7998; --ff-purple-rgb: 108, 103, 138; --ff-user-bubble-rgb: 91, 93, 117; --ff-user-strong: rgba(79, 87, 103, 1); --ff-ai-memory-rgb: 117, 108, 149; --ff-thinking-rgb: 89, 84, 113; --ff-lore-rgb: 146, 117, 103; --ff-code-border-rgb: 110, 132, 118; } /* ─── Zartes Gelb (light) — data-theme="coral" ─── */ [data-theme="coral"] { color-scheme: light; --ff-bg-primary: #fff9e5; --ff-bg-secondary: #f7f0dd; --ff-bg-tertiary: #efe8d4; --ff-bg-card: #f3edd9; --ff-bg-primary-rgb: 255, 249, 229; --ff-bg-secondary-rgb: 247, 240, 221; --ff-bg-tertiary-rgb: 239, 232, 212; --ff-bg-card-rgb: 243, 237, 217; --ff-text-primary: #4a3c2a; --ff-text-primary-rgb: 74, 60, 42; --ff-text-light: #584b39; --ff-text-soft: #675a48; --ff-text-secondary: #756957; --ff-text-subdued: #847866; --ff-text-muted: #8b806d; --ff-text-muted-rgb: 139, 128, 109; --ff-text-dim: #aca28f; --ff-text-faint: #beb5a2; --ff-text-quote: #6b4d45; --ff-accent: #ff9dbe; --ff-accent-hover: #ffb84d; --ff-accent-dark: #d985a2; --ff-accent-darker: #b87189; --ff-accent-rgb: 255, 157, 190; --ff-gold: #ffb84d; --ff-gold-light: #ffc874; --ff-gold-dark: #c7903c; --ff-gold-rgb: 255, 184, 77; --ff-on-accent: #4a3c2a; --ff-on-gold: #4a3c2a; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 230, 162, 146; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(255, 184, 77, 0.28); --ff-border-strong: rgba(255, 184, 77, 0.45); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); --ff-glow-gold: rgba(255, 184, 77, 0.22); --ff-scrollbar-track: #efe8d4; --ff-scrollbar-thumb: #ffb84d; --ff-purple: #c98092; --ff-purple-light: #cf8f9f; --ff-purple-rgb: 201, 128, 146; --ff-user-bubble-rgb: 174, 113, 123; --ff-user-strong: rgba(155, 104, 109, 1); --ff-ai-memory-rgb: 215, 135, 157; --ff-thinking-rgb: 165, 105, 120; --ff-lore-rgb: 179, 132, 62; --ff-code-border-rgb: 146, 136, 117; } /* ─── Puderrosa (light) — data-theme="rose" ─── */ [data-theme="rose"] { color-scheme: light; --ff-bg-primary: #fcefef; --ff-bg-secondary: #f4e5e6; --ff-bg-tertiary: #ecdbdc; --ff-bg-card: #f0e1e2; --ff-bg-primary-rgb: 252, 239, 239; --ff-bg-secondary-rgb: 244, 229, 230; --ff-bg-tertiary-rgb: 236, 219, 220; --ff-bg-card-rgb: 240, 225, 226; --ff-text-primary: #4a1521; --ff-text-primary-rgb: 74, 21, 33; --ff-text-light: #582631; --ff-text-soft: #663842; --ff-text-secondary: #754952; --ff-text-subdued: #835b63; --ff-text-muted: #8a636b; --ff-text-muted-rgb: 138, 99, 107; --ff-text-dim: #aa8b90; --ff-text-faint: #bca1a5; --ff-text-quote: #661b28; --ff-accent: #e63946; --ff-accent-hover: #f15bb5; --ff-accent-dark: #c4303c; --ff-accent-darker: #a62932; --ff-accent-rgb: 230, 57, 70; --ff-gold: #f15bb5; --ff-gold-light: #f47fc5; --ff-gold-dark: #bc478d; --ff-gold-rgb: 241, 91, 181; --ff-on-accent: #ffffff; --ff-on-gold: #4a1521; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 230, 162, 146; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(241, 91, 181, 0.28); --ff-border-strong: rgba(241, 91, 181, 0.45); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.08); --ff-glow-gold: rgba(241, 91, 181, 0.22); --ff-scrollbar-track: #ecdbdc; --ff-scrollbar-thumb: #f15bb5; --ff-purple: #b72e3b; --ff-purple-light: #c04753; --ff-purple-rgb: 183, 46, 59; --ff-user-bubble-rgb: 160, 41, 53; --ff-user-strong: rgba(144, 37, 50, 1); --ff-ai-memory-rgb: 195, 49, 62; --ff-thinking-rgb: 150, 38, 48; --ff-lore-rgb: 171, 62, 119; --ff-code-border-rgb: 145, 108, 115; } /* ─── Königsblau (dark) — data-theme="blue" ─── */ [data-theme="blue"] { color-scheme: dark; --ff-bg-primary: #101e42; --ff-bg-secondary: #1c294b; --ff-bg-tertiary: #273453; --ff-bg-card: #313c5a; --ff-bg-primary-rgb: 16, 30, 66; --ff-bg-secondary-rgb: 28, 41, 75; --ff-bg-tertiary-rgb: 39, 52, 83; --ff-bg-card-rgb: 49, 60, 90; --ff-text-primary: #f9f6f0; --ff-text-primary-rgb: 249, 246, 240; --ff-text-light: #e6e5e2; --ff-text-soft: #d4d3d4; --ff-text-secondary: #c1c2c6; --ff-text-subdued: #aeb1b8; --ff-text-muted: #a5a8b1; --ff-text-muted-rgb: 165, 168, 177; --ff-text-dim: #7b8192; --ff-text-faint: #646c81; --ff-text-quote: #f8edcd; --ff-accent: #f4c430; --ff-accent-hover: #87b7d8; --ff-accent-dark: #cfa729; --ff-accent-darker: #b08d23; --ff-accent-rgb: 244, 196, 48; --ff-gold: #87b7d8; --ff-gold-light: #a1c7e1; --ff-gold-dark: #698fa8; --ff-gold-rgb: 135, 183, 216; --ff-on-accent: #101e42; --ff-on-gold: #101e42; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 190, 90, 70; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(135, 183, 216, 0.22); --ff-border-strong: rgba(135, 183, 216, 0.38); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.45); --ff-glow-gold: rgba(135, 183, 216, 0.18); --ff-scrollbar-track: #273453; --ff-scrollbar-thumb: #87b7d8; --ff-purple: #f6d36a; --ff-purple-light: #f7d87c; --ff-purple-rgb: 246, 211, 106; --ff-user-bubble-rgb: 246, 219, 134; --ff-user-strong: rgba(247, 224, 154, 1); --ff-ai-memory-rgb: 246, 207, 92; --ff-thinking-rgb: 202, 173, 87; --ff-lore-rgb: 183, 209, 226; --ff-code-border-rgb: 156, 160, 170; } /* ─── Dunkellila (dark) — data-theme="fantasy" ─── */ [data-theme="fantasy"] { color-scheme: dark; --ff-bg-primary: #392d4d; --ff-bg-secondary: #403555; --ff-bg-tertiary: #483c5d; --ff-bg-card: #4e4263; --ff-bg-primary-rgb: 57, 45, 77; --ff-bg-secondary-rgb: 64, 53, 85; --ff-bg-tertiary-rgb: 72, 60, 93; --ff-bg-card-rgb: 78, 66, 99; --ff-text-primary: #cec3ea; --ff-text-primary-rgb: 206, 195, 234; --ff-text-light: #c2b7dd; --ff-text-soft: #b6abd1; --ff-text-secondary: #aa9fc4; --ff-text-subdued: #9e93b8; --ff-text-muted: #988db1; --ff-text-muted-rgb: 152, 141, 177; --ff-text-dim: #7e7295; --ff-text-faint: #6f6386; --ff-text-quote: #bac1dd; --ff-accent: #5fb7a0; --ff-accent-hover: #cc6daa; --ff-accent-dark: #519c88; --ff-accent-darker: #448473; --ff-accent-rgb: 95, 183, 160; --ff-gold: #cc6daa; --ff-gold-light: #d78dbd; --ff-gold-dark: #9f5585; --ff-gold-rgb: 204, 109, 170; --ff-on-accent: #392d4d; --ff-on-gold: #ffffff; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 190, 90, 70; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(204, 109, 170, 0.22); --ff-border-strong: rgba(204, 109, 170, 0.38); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.45); --ff-glow-gold: rgba(204, 109, 170, 0.18); --ff-scrollbar-track: #483c5d; --ff-scrollbar-thumb: #cc6daa; --ff-purple: #80bbb6; --ff-purple-light: #8fc3bf; --ff-purple-rgb: 128, 187, 182; --ff-user-bubble-rgb: 145, 188, 193; --ff-user-strong: rgba(156, 190, 201, 1); --ff-ai-memory-rgb: 120, 186, 177; --ff-thinking-rgb: 105, 153, 149; --ff-lore-rgb: 205, 145, 197; --ff-code-border-rgb: 146, 135, 171; } /* ─── Dunkles Waldgrün (dark) — data-theme="dark" ─── */ [data-theme="dark"] { color-scheme: dark; --ff-bg-primary: #12221a; --ff-bg-secondary: #1c2c24; --ff-bg-tertiary: #27372e; --ff-bg-card: #2f3f36; --ff-bg-primary-rgb: 18, 34, 26; --ff-bg-secondary-rgb: 28, 44, 36; --ff-bg-tertiary-rgb: 39, 55, 46; --ff-bg-card-rgb: 47, 63, 54; --ff-text-primary: #e2efe0; --ff-text-primary-rgb: 226, 239, 224; --ff-text-light: #d1dfd0; --ff-text-soft: #c1cec0; --ff-text-secondary: #b0beb0; --ff-text-subdued: #9fada1; --ff-text-muted: #97a599; --ff-text-muted-rgb: 151, 165, 153; --ff-text-dim: #728075; --ff-text-faint: #5d6c61; --ff-text-quote: #dfe1c8; --ff-accent: #d4a35b; --ff-accent-hover: #8fb396; --ff-accent-dark: #b48b4d; --ff-accent-darker: #997542; --ff-accent-rgb: 212, 163, 91; --ff-gold: #8fb396; --ff-gold-light: #a8c4ad; --ff-gold-dark: #708c75; --ff-gold-rgb: 143, 179, 150; --ff-on-accent: #12221a; --ff-on-gold: #12221a; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 190, 90, 70; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(143, 179, 150, 0.22); --ff-border-strong: rgba(143, 179, 150, 0.38); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.45); --ff-glow-gold: rgba(143, 179, 150, 0.18); --ff-scrollbar-track: #27372e; --ff-scrollbar-thumb: #8fb396; --ff-purple: #d8ba83; --ff-purple-light: #ddc292; --ff-purple-rgb: 216, 186, 131; --ff-user-bubble-rgb: 218, 197, 151; --ff-user-strong: rgba(220, 205, 164, 1); --ff-ai-memory-rgb: 215, 180, 121; --ff-thinking-rgb: 177, 153, 107; --ff-lore-rgb: 178, 204, 181; --ff-code-border-rgb: 143, 157, 145; } /* ─── Dunkles Schiefergrau (dark) — data-theme="gray" ─── */ [data-theme="gray"] { color-scheme: dark; --ff-bg-primary: #2c2f3a; --ff-bg-secondary: #363841; --ff-bg-tertiary: #3f4048; --ff-bg-card: #47474d; --ff-bg-primary-rgb: 44, 47, 58; --ff-bg-secondary-rgb: 54, 56, 65; --ff-bg-tertiary-rgb: 63, 64, 72; --ff-bg-card-rgb: 71, 71, 77; --ff-text-primary: #edddc5; --ff-text-primary-rgb: 237, 221, 197; --ff-text-light: #decfba; --ff-text-soft: #cec1af; --ff-text-secondary: #bfb3a4; --ff-text-subdued: #afa599; --ff-text-muted: #a89e93; --ff-text-muted-rgb: 168, 158, 147; --ff-text-dim: #857f7a; --ff-text-faint: #716e6c; --ff-text-quote: #e9c1ad; --ff-accent: #d43f3f; --ff-accent-hover: #de9b3e; --ff-accent-dark: #b43636; --ff-accent-darker: #992d2d; --ff-accent-rgb: 212, 63, 63; --ff-gold: #de9b3e; --ff-gold-light: #e5b168; --ff-gold-dark: #ad7930; --ff-gold-rgb: 222, 155, 62; --ff-on-accent: #ffffff; --ff-on-gold: #2c2f3a; --ff-btn-primary-text: var(--ff-on-accent); --ff-promo-cta-bg: var(--ff-gold); --ff-promo-cta-bg-hover: var(--ff-gold-dark); --ff-intimate: #e6a292; --ff-intimate-rgb: 190, 90, 70; --ff-warning-rgb: 243, 156, 18; --ff-error-rgb: 231, 76, 60; --ff-info-rgb: 52, 152, 219; --ff-tindra-info-rgb: 100, 180, 255; --ff-type-world: #d4a574; --ff-type-continent: #4a9e5c; --ff-type-country: #5b8a3c; --ff-type-npc: #4fc3f7; --ff-type-organization: #9c27b0; --ff-type-organization-rgb: 156, 39, 176; --ff-type-god: #ffd54f; --ff-type-item: #7f8c8d; --ff-type-race: #e67e22; --ff-type-class: #2ecc71; --ff-type-creature: #ef5350; --ff-type-quest: #ff9800; --ff-type-artifact: #66bb6a; --ff-type-event: #e94560; --ff-type-curse: #ab47bc; --ff-type-culture: #26c6da; --ff-provider-anthropic: #d4a574; --ff-provider-google: #4285f4; --ff-provider-openai: #10a37f; --ff-provider-minimax: #8a4baf; --ff-provider-mistral: #ff7000; --ff-provider-deepseek: #1e6091; --ff-provider-elevenlabs: #e94560; --ff-provider-promptchan: #b450af; --ff-provider-runpod: #6c757d; --ff-provider-unknown: #555a6e; --ff-status-refunded: #d37a2e; --ff-status-partial: #e0a240; --ff-status-partial-text: #2a1200; --ff-status-disputed: #b03030; --ff-usk-0: #88c057; --ff-usk-6: #b3c855; --ff-usk-12: #d4a574; --ff-usk-16: #e9a045; --ff-usk-18: #e94560; --ff-on-usk-light: #0d0d1a; --ff-on-usk-strong: #ffffff; --ff-white-rgb: 255, 255, 255; --ff-black-rgb: 0, 0, 0; --ff-success: #2e8b3e; --ff-success-rgb: 46, 139, 62; --ff-success-dark: #1e7a30; --ff-success-dark-rgb: 30, 122, 48; --ff-border: rgba(222, 155, 62, 0.22); --ff-border-strong: rgba(222, 155, 62, 0.38); --ff-shadow: 0 4px 16px rgba(0, 0, 0, 0.45); --ff-glow-gold: rgba(222, 155, 62, 0.18); --ff-scrollbar-track: #3f4048; --ff-scrollbar-thumb: #de9b3e; --ff-purple: #dc6e67; --ff-purple-light: #e07f79; --ff-purple-rgb: 220, 110, 103; --ff-user-bubble-rgb: 223, 134, 123; --ff-user-strong: rgba(226, 150, 137, 1); --ff-ai-memory-rgb: 218, 98, 93; --ff-thinking-rgb: 180, 90, 84; --ff-lore-rgb: 228, 183, 119; --ff-code-border-rgb: 160, 151, 141; } /* ─── Light-Mode Kontrast-Overrides (v1.1.0.128) ────────────────────────────── Form-Inputs liefen vorher auf `rgba(var(--ff-bg-secondary-rgb), 0.6)` — im Light-Theme ist das ein fast-weißes Crème mit 60 % Deckkraft über einem ebenfalls hellen Hintergrund. Resultat: Felder hatten praktisch keinen sichtbaren Rand zum Hintergrund. Hier setzen wir sie auf volles Weiß mit kräftigerer Border, damit der User klar erkennt, wo er tippen kann. Im Settings-Menü greift derselbe Selektor pro Container. Greift fuer alle Light-Themes: light/sage/rose/coral. */ [data-theme="light"] .form-input, [data-theme="sage"] .form-input, [data-theme="rose"] .form-input, [data-theme="coral"] .form-input, [data-theme="light"] input.form-input, [data-theme="sage"] input.form-input, [data-theme="rose"] input.form-input, [data-theme="coral"] input.form-input, [data-theme="light"] select.form-input, [data-theme="sage"] select.form-input, [data-theme="rose"] select.form-input, [data-theme="coral"] select.form-input, [data-theme="light"] textarea.form-input, [data-theme="sage"] textarea.form-input, [data-theme="rose"] textarea.form-input, [data-theme="coral"] textarea.form-input, [data-theme="light"] .settings-container select, [data-theme="sage"] .settings-container select, [data-theme="rose"] .settings-container select, [data-theme="coral"] .settings-container select, [data-theme="light"] .settings-container input[type="text"], [data-theme="sage"] .settings-container input[type="text"], [data-theme="rose"] .settings-container input[type="text"], [data-theme="coral"] .settings-container input[type="text"], [data-theme="light"] .settings-container input[type="email"], [data-theme="sage"] .settings-container input[type="email"], [data-theme="rose"] .settings-container input[type="email"], [data-theme="coral"] .settings-container input[type="email"], [data-theme="light"] .settings-container input[type="number"], [data-theme="sage"] .settings-container input[type="number"], [data-theme="rose"] .settings-container input[type="number"], [data-theme="coral"] .settings-container input[type="number"], [data-theme="light"] .settings-container input[type="date"], [data-theme="sage"] .settings-container input[type="date"], [data-theme="rose"] .settings-container input[type="date"], [data-theme="coral"] .settings-container input[type="date"], [data-theme="light"] .settings-container textarea, [data-theme="sage"] .settings-container textarea, [data-theme="rose"] .settings-container textarea, [data-theme="coral"] .settings-container textarea { background: #ffffff; border-color: rgba(var(--ff-gold-rgb), 0.45); color: var(--ff-text-primary); } [data-theme="light"] .form-input:hover:not(:disabled), [data-theme="sage"] .form-input:hover:not(:disabled), [data-theme="rose"] .form-input:hover:not(:disabled), [data-theme="coral"] .form-input:hover:not(:disabled), [data-theme="light"] input.form-input:hover:not(:disabled), [data-theme="sage"] input.form-input:hover:not(:disabled), [data-theme="rose"] input.form-input:hover:not(:disabled), [data-theme="coral"] input.form-input:hover:not(:disabled), [data-theme="light"] select.form-input:hover:not(:disabled), [data-theme="sage"] select.form-input:hover:not(:disabled), [data-theme="rose"] select.form-input:hover:not(:disabled), [data-theme="coral"] select.form-input:hover:not(:disabled), [data-theme="light"] textarea.form-input:hover:not(:disabled), [data-theme="sage"] textarea.form-input:hover:not(:disabled), [data-theme="rose"] textarea.form-input:hover:not(:disabled), [data-theme="coral"] textarea.form-input:hover:not(:disabled), [data-theme="light"] .settings-container select:hover, [data-theme="sage"] .settings-container select:hover, [data-theme="rose"] .settings-container select:hover, [data-theme="coral"] .settings-container select:hover, [data-theme="light"] .settings-container input:hover, [data-theme="sage"] .settings-container input:hover, [data-theme="rose"] .settings-container input:hover, [data-theme="coral"] .settings-container input:hover, [data-theme="light"] .settings-container textarea:hover, [data-theme="sage"] .settings-container textarea:hover, [data-theme="rose"] .settings-container textarea:hover, [data-theme="coral"] .settings-container textarea:hover { border-color: var(--ff-gold); } [data-theme="light"] .form-input:focus, [data-theme="sage"] .form-input:focus, [data-theme="rose"] .form-input:focus, [data-theme="coral"] .form-input:focus, [data-theme="light"] input.form-input:focus, [data-theme="sage"] input.form-input:focus, [data-theme="rose"] input.form-input:focus, [data-theme="coral"] input.form-input:focus, [data-theme="light"] select.form-input:focus, [data-theme="sage"] select.form-input:focus, [data-theme="rose"] select.form-input:focus, [data-theme="coral"] select.form-input:focus, [data-theme="light"] textarea.form-input:focus, [data-theme="sage"] textarea.form-input:focus, [data-theme="rose"] textarea.form-input:focus, [data-theme="coral"] textarea.form-input:focus { background: #ffffff; } [data-theme="light"] select.form-input, [data-theme="sage"] select.form-input, [data-theme="rose"] select.form-input, [data-theme="coral"] select.form-input, [data-theme="light"] .settings-container select, [data-theme="sage"] .settings-container select, [data-theme="rose"] .settings-container select, [data-theme="coral"] .settings-container select { /* Custom-Pfeil sichtbar auf weißem Hintergrund */ background-image: linear-gradient(45deg, transparent 50%, var(--ff-gold-dark) 50%), linear-gradient(135deg, var(--ff-gold-dark) 50%, transparent 50%); } [data-theme="light"] .settings-container select option, [data-theme="sage"] .settings-container select option, [data-theme="rose"] .settings-container select option, [data-theme="coral"] .settings-container select option { background: #ffffff; color: var(--ff-text-primary); } /* Datum-Input Calendar-Icon im Light-Theme dunkler einfärben */ [data-theme="light"] input[type="date"].form-input::-webkit-calendar-picker-indicator, [data-theme="sage"] input[type="date"].form-input::-webkit-calendar-picker-indicator, [data-theme="rose"] input[type="date"].form-input::-webkit-calendar-picker-indicator, [data-theme="coral"] input[type="date"].form-input::-webkit-calendar-picker-indicator, [data-theme="light"] .settings-container input[type="date"]::-webkit-calendar-picker-indicator, [data-theme="sage"] .settings-container input[type="date"]::-webkit-calendar-picker-indicator, [data-theme="rose"] .settings-container input[type="date"]::-webkit-calendar-picker-indicator, [data-theme="coral"] .settings-container input[type="date"]::-webkit-calendar-picker-indicator { filter: none; opacity: 0.7; } /* Akkordeon-Hover im Settings nutzt hartkodiertes Fantasy-Gold (212,165,116) — im Light-Theme wirkt das zu kalt. Stattdessen Gold-Token verwenden. */ [data-theme="light"] .accordion-header:hover, [data-theme="sage"] .accordion-header:hover, [data-theme="rose"] .accordion-header:hover, [data-theme="coral"] .accordion-header:hover { background: rgba(var(--ff-gold-rgb), 0.08); } [data-theme="light"] .accordion-info-btn:hover, [data-theme="sage"] .accordion-info-btn:hover, [data-theme="rose"] .accordion-info-btn:hover, [data-theme="coral"] .accordion-info-btn:hover { background: rgba(var(--ff-gold-rgb), 0.18); } /* ═══════════════════════════════════════════════════════════════════════════════ SCHRIFTARTEN — v1.1.0.060: keine Schriftart-Auswahl mehr. Die App nutzt nur noch das Default-Schrift-Set (Segoe UI / Georgia + Noto- Fallbacks für nicht-lateinische Sprachen). Alte data-font="..."-Selektoren wurden entfernt; bestehende ff_font-Cookies werden ignoriert. ═══════════════════════════════════════════════════════════════════════════════ */ /* Website-specific theme variables. The color palette above is copied from the app; these aliases keep the marketing chrome in sync without changing app token names. */ [data-theme] { --ff-border-color: var(--ff-border); } [data-theme="light"] { --ff-hero-overlay-start: rgba(var(--ff-bg-primary-rgb), .26); --ff-hero-overlay-mid: rgba(var(--ff-bg-primary-rgb), .54); --ff-hero-overlay-end: rgba(var(--ff-bg-primary-rgb), .94); --ff-promo-gradient: linear-gradient(135deg, var(--ff-accent) 0%, var(--ff-accent-dark) 52%, var(--ff-gold) 100%); } [data-theme="dark"], [data-theme="blue"], [data-theme="gray"], [data-theme="fantasy"] { --ff-hero-overlay-start: rgba(var(--ff-bg-primary-rgb), .4); --ff-hero-overlay-mid: rgba(var(--ff-bg-primary-rgb), .68); --ff-hero-overlay-end: rgba(var(--ff-bg-primary-rgb), .95); --ff-promo-gradient: linear-gradient(135deg, var(--ff-accent) 0%, var(--ff-accent-dark) 52%, var(--ff-gold) 100%); } [data-theme="sage"], [data-theme="rose"], [data-theme="coral"] { --ff-hero-overlay-start: rgba(var(--ff-bg-primary-rgb), .26); --ff-hero-overlay-mid: rgba(var(--ff-bg-primary-rgb), .52); --ff-hero-overlay-end: rgba(var(--ff-bg-primary-rgb), .94); --ff-promo-gradient: linear-gradient(135deg, var(--ff-accent) 0%, var(--ff-accent-dark) 52%, var(--ff-gold) 100%); }