/* ═══════════════════════════════════════════════════════════════════ v3.5.40 — Darstellung & Effekte (reagiert auf data-Attribute auf ) ═══════════════════════════════════════════════════════════════════ */ /* ─── Akzentfarbe: überschreibt --red / Akzent-Variablen ──────────── */ html[data-accent="cyan"] { --red:#00c8ff; --gold:#00e5ff; } html[data-accent="purple"] { --red:#a855f7; --gold:#d8b4fe; } html[data-accent="gold"] { --red:#f5a623; --gold:#ffd700; } html[data-accent="green"] { --red:#00d97e; --gold:#00ff9c; } /* "red" = Standard, keine Überschreibung nötig */ /* ─── Effekt-Stärke "subtle": Glows abschwächen ───────────────────── */ html[data-fx="subtle"] .sbtn, html[data-fx="subtle"] .gtile, html[data-fx="subtle"] #goalFill, html[data-fx="subtle"] .sb-btn:hover, html[data-fx="subtle"] .qa-btn:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; } html[data-fx="subtle"] .gtile.speaking { box-shadow: 0 0 12px rgba(0,255,156,0.4) !important; animation: none !important; } html[data-fx="subtle"] #goalFill::after { display: none; } /* ─── Effekt-Stärke "off": alle dekorativen Glows & Partikel aus ──── */ html[data-fx="off"] .sbtn, html[data-fx="off"] .gtile, html[data-fx="off"] .gtile.speaking, html[data-fx="off"] #goalFill, html[data-fx="off"] .gift-streak, html[data-fx="off"] .sb-btn, html[data-fx="off"] .qa-btn { box-shadow: none !important; text-shadow: none !important; } html[data-fx="off"] .gtile.speaking { border-color: #00ff9c !important; /* Sprech-Indikator bleibt (nur Rand, kein Glow) */ animation: none !important; } html[data-fx="off"] #goalFill::after { display: none; } html[data-fx="off"] .fx-particle { display: none !important; } /* Schnee/Feuer/Herzen aus */ html[data-fx="off"] .glivedot { animation: none !important; } /* ─── Reduced Motion: alle Animationen praktisch still ────────────── */ html[data-motion="reduce"] *, html[data-motion="reduce"] *::before, html[data-motion="reduce"] *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } html[data-motion="reduce"] .fx-particle { display: none !important; } html[data-motion="reduce"] .gtile.speaking { animation: none !important; } html[data-motion="reduce"] .glivedot { animation: none !important; } /* ─── Bonus: Coin-Balance Glow (respektiert fx-Stufe automatisch) ──── */ .wnum { text-shadow: 0 0 16px rgba(255,215,0,0.5), 0 0 4px rgba(255,200,0,0.3); transition: transform .3s cubic-bezier(.34,1.5,.64,1); } .wnum.coin-pop { animation: coinPop .5s cubic-bezier(.34,1.6,.64,1); } @keyframes coinPop { 0%{transform:scale(1);} 40%{transform:scale(1.15);text-shadow:0 0 28px rgba(255,215,0,0.9),0 0 8px rgba(255,200,0,0.6);} 100%{transform:scale(1);} } html[data-fx="off"] .wnum { text-shadow: none !important; } html[data-fx="subtle"] .wnum { text-shadow: 0 0 8px rgba(255,215,0,0.3) !important; }