/* Wissensquiz – Einheitliche Premium-Farbpalette, Referenz: heller Gold-Startbutton.
   Nur vorhandene Gold- und Weißflächen werden angepasst. */
:root{
  --gold-light:#fff2d0;
  --gold-mid:#f1d791;
  --gold-deep:#e2b458;
  --gold-solid:#fff0bd;
  --gold-gradient:linear-gradient(123deg,var(--gold-light) 0%,var(--gold-mid) 46%,var(--gold-deep) 100%);
  --white-strong:#fff;
  --white-soft:#eef4ff;
  --white-muted:#dbe6f8;
  --gold:#fff0bd;
  --gold2:#fff7db;
  --text:#fff;
  --muted:#dbe6f8;
  --line:rgba(244,210,137,.36);
}

/* Weiße Überschriften, Werte und Haupttexte bleiben wirklich weiß. */
body,.logo,.hero h1,.dashboard h2,.section-title,.question,
.answer-label,.answer,.result-heading,.number b,.hud b,
.score-emblem-inner b,.stat-box b,.dashboard-progress-top strong,
.dashboard-tile>strong,.share-container h3,.platform-availability-item strong,
.platform-browser-item strong,.platform-note-item strong,.review-item summary span,
.ranking-person strong,.ranking-area .ranking-person strong{color:var(--white-strong)}

/* Sekundärtexte hell, aber erkennbar vom Hauptweiß abgesetzt. */
.intro,.dashboard-description,.dashboard-progress-note,.feature-note,
.result-lead,.analysis-note,.review-item p,.help,.share-container>p,
.share-one-hint,.feedback p,.feedback,.quiz-benefit,.calc-work ol,
.dashboard-bottom,.share-privacy,.share-link-hint,
.ranking-caption,.ranking-note,.ranking-current p{color:var(--white-soft)}
.header-sub,.micro,.muted,.number small,.stat-box small,
.dashboard-caption,.dashboard-progress-top>span,.dashboard-tile>span,
.dashboard-id,.platform-browser-status-note,.platform-availability-item small,
.platform-browser-item small,.platform-note-item small,.footer,
.platform-browser-label+.platform-browser-status-note,
.ranking-person small,.ranking-score small{color:var(--white-muted)}

/* Nur bisher goldene Beschriftungen, Symbole und Hervorhebungen. */
.logo small,.overline,.eyebrow,.category,.feature-note strong,
.quiz-benefit strong,.quiz-benefit-icon,.dashboard-kicker,
.dashboard-symbol,.platform-availability-kicker,.platform-browser-label,
.platform-device-icon,.share-control label,.share-extras summary,
.share-extras summary span,.share-link-hint,.platform-title,
.feedback .extra-label,.feedback strong,.calc-work .calc-title,
.analysis-block h3,.score-emblem-inner small,.remaining-warning strong,
.footer strong,.rank-awards span,.ranking-eyebrow,.ranking-panel h3,
.ranking-place,.ranking-current label,.ranking-current h3,
.ranking-submit-status{color:var(--gold-solid)}

/* Große goldene Schriftzüge: ohne dunkle Enden oder Browser-Clipping. */
.hero h1 i,.dashboard h2 em,.section-title i{
  color:var(--gold-solid);
  background:none;
  -webkit-text-fill-color:var(--gold-solid);
  text-shadow:0 1px 0 rgba(255,247,218,.19),0 4px 15px rgba(193,143,47,.18);
  filter:none
}

/* Goldene Flächen einschließlich Start-, Weiter- und Teilen-Schaltfläche. */
.btn.primary,.primary,#start,.share-everything,.ranking-button{
  background:var(--gold-gradient);
  color:#10213e;
  border-color:rgba(255,240,203,.91);
  box-shadow:0 13px 34px rgba(2,7,22,.43),inset 0 1px rgba(255,255,255,.48)
}
.btn.primary:hover:not(:disabled),.primary:hover:not(:disabled),
#start:hover:not(:disabled),.share-everything:hover:not(:disabled),
.ranking-button:hover:not(:disabled){
  background:linear-gradient(123deg,#fff8e6,#f5dea1 48%,#eabe67);
  color:#10213e
}
.btn.primary:focus-visible,.ranking-button:focus-visible{
  outline:2px solid #fff2d0;outline-offset:3px
}

/* Goldene Linien, Akzente und Rahmen bleiben dezent, aber leuchtender. */
.monogram,.dashboard-symbol{border-color:rgba(245,215,150,.70)}
.dashboard,.platform-availability,.share-container,.panel,
.quiz-benefit,.share-extras,.calc-work,.ranking-area,.ranking-panel,
.ranking-current{border-color:rgba(241,207,139,.40)}
.feature-note{border-left-color:rgba(245,215,150,.72)}
.dashboard:before,.platform-availability::before{border-color:rgba(245,215,150,.17)}
.overline::before,.seg.done{background:var(--gold-solid)}
.dashboard-tile{border-color:rgba(241,207,139,.24)}
.share-control select{border-color:rgba(241,207,139,.5)}
.ranking-score,.ranking-current .ranking-score{color:var(--gold-light)}
.ranking-input{color:var(--white-strong)}
.ranking-area h2{color:var(--gold-solid)}
/* Antwort-Rahmen, Erfolgs-/Fehlerfarben und Hintergrund bewusst unverändert. */

/* Zuverlaessiges, helles Champagnergold in Cloudflare: keine dunklen Brauntoene. */
#home,
#ranking {
  --gold-solid:#fff0bd;
  --gold:#fff0bd;
  --gold2:#fff7db;
}
.logo small,
#home .quiz-benefit strong,
#home .quiz-benefit-icon,
#home .dashboard-kicker,
#home .dashboard-symbol,
#home .platform-availability-kicker,
#home .platform-browser-label,
#home .platform-title,
#home .platform-device-icon,
#home .feature-note strong,
#home .overline,
#home .eyebrow,
#ranking .ranking-eyebrow,
#ranking.ranking-area h2,
#ranking .ranking-panel h3,
#ranking .ranking-place,
#ranking .ranking-current h3,
#ranking .ranking-current label,
#ranking .ranking-submit-status {
  color:#fff0bd !important;
  -webkit-text-fill-color:#fff0bd !important;
  text-shadow:0 0 9px rgba(255,221,151,.26);
}
#home.hero h1 i,
#home .dashboard h2 em {
  color:#fff0bd !important;
  -webkit-text-fill-color:#fff0bd !important;
  background:none !important;
  text-shadow:0 0 10px rgba(255,229,173,.25),0 1px 0 rgba(255,255,255,.15);
  filter:none !important;
}

/* Beide Hauptbuttons genau im hellen Champagnergold der Referenz.
   Die Seite besitzt selbst ein dunkles Farbschema; deshalb wird dieses
   im HTML explizit als 'dark' deklariert (kein erzwungenes Browser-Dunkeln).
   Keine eingebetteten SVG-Grafiken, keine dunkle braune Grundfarbe. */
#start,
#last-result,
#ranking-refresh {
  -webkit-appearance:none !important;
  appearance:none !important;
  color-scheme:dark; /* fallback */
  color-scheme:only dark; /* verhindert automatische Farbkorrektur, sofern Browser dies beachtet */
  forced-color-adjust:none;
  background-color:#ffe8a9 !important;
  background-image:linear-gradient(108deg,
    #fff9e5 0%,
    #fff2ce 24%,
    #f9e2a9 53%,
    #f3d18a 76%,
    #ebbf72 100%) !important;
  border:1px solid #f8e0ad !important;
  color:#1a2940 !important;
  -webkit-text-fill-color:#1a2940 !important;
  text-shadow:none !important;
  box-shadow:0 13px 32px rgba(0,0,0,.23),
    inset 0 1px 0 rgba(255,255,255,.6) !important;
  opacity:1;
  filter:none !important;
  isolation:isolate;
}
#start:hover:not(:disabled),
#last-result:hover:not(:disabled),
#ranking-refresh:hover:not(:disabled) {
  background-image:linear-gradient(108deg,
    #fffbee 0%, #fff5d8 24%, #fce8b7 54%, #f5d898 77%, #efc983 100%) !important;
  filter:none !important;
}
#start:active,
#last-result:active,
#ranking-refresh:active {
  background-image:linear-gradient(108deg,
    #f8eccb, #f0cb82) !important;
}
#start:focus-visible,
#last-result:focus-visible,
#ranking-refresh:focus-visible {
  outline:3px solid #fff4d5;
  outline-offset:3px;
}

/* Die festgelegte Farbpalette gilt im hellen und dunklen Systemmodus.
   Eine eigene Theme-Definition kann Algorithmic Darkening in Android WebViews
   verhindern, soweit die jeweilige App diese Webstandards respektiert. */
@media (prefers-color-scheme: dark) {
  :root { color-scheme:dark; color-scheme:only dark; }
}
@media (prefers-color-scheme: light) {
  :root { color-scheme:dark; color-scheme:only dark; }
}