/* Shared public theme tokens. With no script or saved choice, CSS follows the OS. */
:root {
    color-scheme: light;
    --primary-blue: #002855;
    --background-gray: #ffffff;
    --white: #ffffff;
    --text-dark: #1e293b;
    --text-muted: #59697e;
    --border-color: #dce3ec;
    --surface-soft: #f2f4f7;
    --glass: rgba(255,255,255,.72);
    --link-color: #205eb5;
    --error-color: #ac2525;
    --input-border: #a6b5c6;
    --focus-color: #205eb5;
    --backdrop: rgba(16,34,54,.18);
    --badge-blue: #205eb5;
    --badge-green: #08734d;
    --badge-gold: #785008;
    --badge-purple: #6b35bc;
    --reading-highlight: rgba(249,215,28,.3);
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --primary-blue: #e1ecfc;
    --background-gray: #0b1422;
    --white: #142236;
    --text-dark: #e1e8f2;
    --text-muted: #b1bfd1;
    --border-color: #35465d;
    --surface-soft: #1c2c42;
    --glass: rgba(11,20,34,.80);
    --link-color: #91c3ff;
    --error-color: #ffaaa4;
    --input-border: #687e99;
    --focus-color: #ffc400;
    --backdrop: rgba(0,6,16,.52);
    --badge-blue: #a4ceff;
    --badge-green: #7ee0b6;
    --badge-gold: #f4d477;
    --badge-purple: #d1b2ff;
    --reading-highlight: rgba(249,215,28,.13);
    --shadow-soft: 0 10px 25px -5px rgba(0,0,0,.24);
    --shadow-hover: 0 15px 30px -5px rgba(0,0,0,.4);
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
    --primary-blue: #e1ecfc;
    --background-gray: #0b1422;
    --white: #142236;
    --text-dark: #e1e8f2;
    --text-muted: #b1bfd1;
    --border-color: #35465d;
    --surface-soft: #1c2c42;
    --glass: rgba(11,20,34,.80);
    --link-color: #91c3ff;
    --error-color: #ffaaa4;
    --input-border: #687e99;
    --focus-color: #ffc400;
    --backdrop: rgba(0,6,16,.52);
    --badge-blue: #a4ceff;
    --badge-green: #7ee0b6;
    --badge-gold: #f4d477;
    --badge-purple: #d1b2ff;
    --reading-highlight: rgba(249,215,28,.13);
    --shadow-soft: 0 10px 25px -5px rgba(0,0,0,.24);
    --shadow-hover: 0 15px 30px -5px rgba(0,0,0,.4);
    }
}

html { background: var(--background-gray); }
body { background: var(--background-gray); color: var(--text-dark); }
html .main-header { background: var(--glass); box-shadow: 0 1px 5px rgba(0,0,0,.12); }
html .section-tabs { background: var(--surface-soft); border-color: var(--border-color); }
html .publication-nav .section-tab { color: var(--text-muted); }
html .publication-nav .section-tab:hover { background: var(--white); color: var(--primary-blue); }
html .publication-nav .section-tab.active, html .publication-nav .section-tab.active:hover { background: #ffc400; color: #002855; }
html .search-dialog, html .about-modal-content { background: var(--white); border-color: var(--border-color); color: var(--text-dark); }
html .search-dialog::backdrop { background: var(--backdrop); }
html .dialog-search-form input, html .filter-popover select { color: var(--text-dark); background: var(--background-gray); border-color: var(--input-border); }
input::placeholder { color: var(--text-muted); opacity: 1; }
html .search-submit { color: #002855; }
html .media-page .episode, html .media-page .video { background: var(--white); }
html .media-section { background: var(--white); }
html .media-page .media-section { background: transparent; }
html .empty-news a, html .breadcrumb, html .breadcrumb a, html .article-body a { color: var(--link-color); }
html .breadcrumb a:hover, html .article-body a:hover { color: var(--primary-blue); }
html .article-body { color: var(--text-dark); }
html .article-body em, html .article-sources small, html .tts-hint, html .breadcrumb span { color: var(--text-muted); }
html .article-sources { border-color: var(--border-color); }
html .article-image figcaption, html .meta-badges { color: var(--text-muted); background: var(--surface-soft); border-color: var(--border-color); }
html .badge.author { color: var(--badge-blue); }
html .badge.ia { color: var(--badge-green); }
html .badge.category { color: var(--badge-gold); }
html .badge.date { color: var(--text-muted); }
html .badge.source { color: var(--badge-purple); }
html #newsLoadError, html .tts-hint.is-error { color: var(--error-color); }
html .tts-unit.tts-active { background: var(--reading-highlight); }
html .tts-bar { background: var(--glass); border-color: var(--border-color); }
html .tts-bar-status { color: var(--text-dark); }
html .tts-bar button { background: var(--surface-soft); color: var(--text-dark); }
html .tts-bar button:hover { background: #ffc400; color: #002855; }
html .tts-progress { background: var(--border-color); }
html .spinner { border-color: var(--border-color); border-top-color: var(--primary-blue); }
html .load-more-btn:hover, html .icon-btn:hover { background: var(--surface-soft); }
html :where(a,button,input,select,summary):focus-visible { outline: 3px solid var(--focus-color); outline-offset: 3px; }
html button:disabled { cursor: default; opacity: .6; }
.theme-control { position: relative; }
.theme-control[hidden], .theme-panel[hidden] { display: none; }
.theme-toggle { border-radius: 8px; }
.theme-toggle span { font: 25px/1 sans-serif; }
.theme-panel { position: absolute; top: calc(100% + 12px); right: 0; width: 200px; padding: 1rem; border: 1px solid var(--border-color); border-radius: 14px; background: var(--white); color: var(--text-dark); box-shadow: var(--shadow-hover); }
.theme-panel fieldset { border: 0; min-width: 0; }
.theme-panel legend { font-weight: 600; margin-bottom: .5rem; }
.theme-panel label { display: flex; align-items: center; gap: .65rem; min-height: 40px; padding: .35rem .5rem; border-radius: 6px; cursor: pointer; }
.theme-panel label:hover { background: var(--surface-soft); }
.theme-panel input { accent-color: var(--link-color); width: 16px; height: 16px; }
@media (max-width:780px) { .header-actions { gap: 0; } .theme-toggle span { font-size: 22px; } }
@media (prefers-reduced-motion: reduce) { .card-link, .card-image-wrapper img, .icon-btn, .sources-chevron { transition: none; } }
html .tts-listen-btn.is-playing, html .tts-listen-fab.is-playing { background: #205eb5; color: #fff; }
html .article-body .tts-listen-fab.is-playing, html .article-body .tts-listen-fab.is-playing:hover { color: #fff !important; }
