/* Reading and night palettes; screen colors preserve print and Word formatting. */
@media screen {
  html:root[data-theme="reading"] {
    color-scheme: light;
    /* Match the live Shuoun Islamiya reading palette. */
    --bg: #f4ecd8;
    --surface: #f9f2e0;
    --surface-2: #ebe3cc;
    --royal: #7a5c32;
    --gold: #7a5c32;
    --gold-light: #7a5c32;
    --text: #3b2e1a;
    --muted: #6b5a3e;
    --ink-accent: #2b2010;
    --border: #d9cdb3;
    --theme-line: #d9cdb3;
    --theme-shadow: 0 6px 22px rgba(59, 46, 26, .08);
    --theme-glow: #efe6cf;
  }
  html:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #07152d;
    --surface: #0c1d3a;
    --surface-2: #102747;
    --royal: #153a79;
    --gold: #ffd05a;
    --gold-light: #fff0a5;
    --text: #f3f2ec;
    --muted: #a9b5cc;
    --border: rgba(182,200,230,.13);
    --theme-line: #8499bc40;
    --theme-shadow: 0 8px 24px #0002;
    --theme-glow: #18375b;
  }
  /* Display only transparent margins differently; keep the supplied artwork intact. */
  img.midad-logo { box-sizing: content-box; aspect-ratio: 2; object-fit: cover; object-position: 50% 47%; filter: none; padding: 0; border: 0; background: transparent; }
  .footer .brand img.midad-logo, .library-footer-brand > img.midad-logo { width: 112px; height: 112px; aspect-ratio: 1; object-fit: contain; object-position: center; flex: none; padding: 0; border-radius: 0; background: transparent; }
  .footer-brand > .brand, .library-footer-brand { display: flex; align-items: center; gap: 14px; min-width: 0; max-width: 100%; }
  .footer-brand > .brand > span, .library-footer-brand > span { min-width: 0; }
  .footer .brand strong { white-space: normal; }
  .footer { padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
  /* Keep the complete square artwork visible in every logo area. */
  html:root img.midad-logo { object-fit: contain; object-position: 50% 50%; }
  /* Foreground-only chocolate accents; keep paper, red and gold unchanged. */
  html:root[data-theme="reading"] :where(.button-gold, .share-copy:not(.is-copied), .error-page .links a:first-child, .home-hero-caption > strong) { color: var(--text); }
  html:root[data-theme="reading"] ::selection { color: var(--text); }
  html:root[data-theme="reading"] :where(.home-hero-caption, .stat-intro .icon-tile) { color: var(--ink-accent); }
  /* Warm paper and ink on every public page. */
  html:root[data-theme="reading"] body { background: var(--bg); color: var(--text); }
  html:root[data-theme="reading"] .site-header { background: color-mix(in srgb, var(--bg) 96%, transparent); }
  html:root[data-theme="reading"] :is(.footer, .library-footer) { background: var(--surface-2); }
  html:root[data-theme="reading"] :is(.hero, .home-hero, .library-hero) { background: radial-gradient(ellipse at 12% 10%, var(--theme-glow), transparent 65%); }
  html:root[data-theme="reading"] :is(.features-section, .types-section, .samples-section, .prepare-section, .faq-section) { background: var(--surface-2); }
  html:root[data-theme="reading"] :is(.feature-card, .feature-main, .type-panel, .sample-card, .prompt-form, .community-panel, .audience-card, .contact-card, .support-inner, .support-card, .home-library-panel, .home-hero-workbench, .hero-library-search, .hero-model-entry, .start-intro, .start-step, .start-example, .start-ready, .library-search-panel, .library-search-hero, .library-discovery, .library-card, .library-browse, .library-empty, .library-search-empty, .sermon-heading, .sermon-paper, .sermon-tools, .sermon-share--footer, dialog) {
    background: var(--surface); border-color: var(--border); box-shadow: var(--theme-shadow);
  }
  html:root[data-theme="reading"] :is(.search-page .library-card.search-result, .library-series-grid > a) { background: var(--surface); border-color: var(--border); box-shadow: none; }
  html:root[data-theme="reading"] :is(.sample-prompt, .guide-sample, .guide-sermon, .guide-search, .type-tab, .mode-note, .support-other, .library-search-suggestions, .library-pagination > a, .sermon-font-tools button, .library-clear, .library-saved-filter, .back-top) { background: var(--surface); border-color: var(--border); }
  html:root[data-theme="reading"] :is(.home-hero-search-field, .hero-search-field, .library-search-box, .library-filters select, .prompt-form input, .prompt-form textarea, .prompt-form select, .prompt-result textarea, .support-custom-control > input) { background: var(--surface); color: var(--text); border-color: var(--theme-line); }
  html:root[data-theme="reading"] :is(.home-hero-search-field input, .hero-search-field > input, .guide-search > input) { color: var(--text); }
  html:root[data-theme="reading"] :is(input, textarea)::placeholder { color: var(--muted); }
  html:root[data-theme="reading"] :is(.button-outline, .icon-button, .topic-chips > button, .support-amount > span, .library-browse-groups a, .library-search-suggestions a, .home-hero-topics > a, .hero-search-suggestions > a) { color: var(--text); background: var(--surface); border-color: var(--border); }
  html:root[data-theme="reading"] .support-amount input:checked + span { color: #fff; background: var(--royal); border-color: var(--royal); }
  html:root[data-theme="reading"] .library-hero-search > label { color: var(--text); }
  html:root[data-theme="reading"] .faq-contact a { color: var(--gold); }
  html:root[data-theme="reading"] :is(.sermon-copy-button, .sermon-print-button, .sermon-word-button) > .icon { color: var(--ink-accent); }
  html:root[data-theme="reading"] .sermon-paper { border-top-color: var(--gold); }
  html:root[data-theme="reading"] :is(.main-nav > a, .home-hero-search label, .hero-library-search > label, .hero-model-copy strong, .library-browse > summary, .library-series-heading h2, .library-series-label, .library-search-suggestions h2, .prompt-form label, .start-example blockquote, .sermon-heading h1, .search-page .search-result h2, .stat-intro strong, .prose strong, .guide-prose h3, .guide-prose strong, .audience-card > div strong) { color: var(--text); }
  html:root[data-theme="reading"] :is(.hero-description, .hero-checks, .hero-footnote, .brand small, .small-label, .art-index, .hero-stats > div > span, .stat-intro p, .feature-card p, .type-panel > p, .type-panel-bottom > span, .sample-prompt > span, .sample-card p, .sample-number > span, .step p, .step-top > .icon, .mode-note > p, .prepare-path > p, .form-heading > small, .prompt-form label > small, .form-note, .topic-chips > span, .community-copy > p:not(.eyebrow), .community-checks, .community-note, .audience-card > div > p, .faq-contact, .faq-filter, .faq-item > .prose, .contact-card span, .support-inner p:not(.eyebrow), .footer-brand > p, .footer-top > div > a, .social-mini, .footer-bottom, .contact-choice > span > small, .guide-prose, .guide-sidebar nav > a, .support-card-heading p, .support-security, .support-custom-row > label, .support-other p, .support-email, .support-platforms > span, .support-custom-row > small, .home-library-note, .home-library-number, .home-hero-description, .home-hero-topics > span, .home-hero-help, .home-hero-help b, .home-hero-help > a, .home-hero-proof, .home-hero-visual-caption, .hero-model-copy p, .hero-search-suggestions > span, .start-lead, .start-section-heading > span, .start-step p, .start-step-icon, .start-example-note, .start-ready p:not(.eyebrow), .start-ready > small, .library-emblem > span:last-child, .library-filters > label, .library-search-status, .library-browse > summary > span, .library-browse-groups a > span, .library-language, .library-excerpt, .library-card-bottom > span, .library-card-selection > span:last-child, .library-series-total, .library-search-topline, .library-search-heading p:not(.eyebrow), .library-search-actions .library-clear, .library-search-actions .library-search-status, .library-search-fallback, .search-page .search-result-length, .search-page .search-result .library-excerpt, .sermon-metadata, .sermon-heading-identity .eyebrow, .sermon-tools > p:first-child, .sermon-tools > .sermon-local-note, .library-footer-brand small, .library-footer nav, .library-footer p, .sermon-share-caption span) { color: var(--muted); }
  html:root[data-theme="reading"] :is(.hero-stats > div > strong, .sample-card h3, .sample-number, .sample-link, .mode-note strong, .community-copy > .eyebrow, .community-checks .icon, .prose h3, .prose h4, .sermon-dialog > h2, .contact-choice > span > strong, .guide-prose h1, .guide-prose h2, .guide-prose h4, .guide-prose a, .guide-section-label, .library-stats strong, .library-type, .library-series-total strong, .library-series-symbol, .library-series-count, .library-search-back, .search-page .search-result-open, .library-search-results-heading > p:not(:empty), .sermon-share-label, .sermon-share-caption strong, .home-library-featured-label, .home-hero-kicker, .start-step p strong, .start-step p b) { color: var(--gold); }
  html:root[data-theme="reading"] :is(.sermon-part, .sermon-dialog .prose, .sample-prompt > p) { color: var(--text); }
  html:root[data-theme="reading"] :is(.library-tag, .sermon-heading .sermon-tags .library-tag, .sermon-heading .sermon-topics .library-tag, .library-featured-badge) { color: var(--ink-accent); background: var(--surface-2); border-color: var(--border); }
  html:root[data-theme="reading"] :is(.type-tab.active, .faq-filter.active, .library-saved-filter[aria-pressed="true"], .sermon-tools button[aria-pressed="true"], .library-series-grid > a[aria-current="page"]) { color: var(--gold); background: var(--surface-2); border-color: var(--gold); }
  html:root[data-theme="reading"] .library-pagination > a[aria-current="page"] { background: var(--royal); color: #fff; border-color: var(--royal); }
  html:root[data-theme="reading"] .library-series-grid > a[aria-current="page"] .library-series-symbol { background: var(--royal); color: #fff; }
  html:root[data-theme="reading"] :is(.type-tab > .icon:first-child, .home-hero-search-field > .icon, .hero-search-field > .icon, .home-hero-proof .icon, .sample-prompt > .icon-button, .audience-card > summary > .icon:last-child, .faq-item > summary > .icon, .contact-card > .icon:last-child, .dialog-close) { color: var(--muted); }
  html:root[data-theme="reading"] :is(.library-card h2 > a:hover, .search-page .search-result h2 > a:hover, .library-search-back:hover, .main-nav > a:hover, .main-nav > a.active) { color: var(--gold-light); }
  html:root[data-theme="reading"] .main-nav > .nav-support { color: #9b2941; background: #be345410; }
  html:root[data-theme="reading"] :is(.sermon-heading-art, .sermon-paper-ornament, .sermon-end) { color: var(--gold); }
  html:root[data-theme="reading"] .sermon-heading-art { opacity: .22; }
  html:root[data-theme="reading"] .sermon-heading-art .sermon-arch-fill { fill: var(--theme-glow); }
  html:root[data-theme="reading"] .home-library-item { border-color: var(--border); }
  html:root[data-theme="reading"] .support-error { color: #a22b23; }
  html:root[data-theme="reading"] .skip-link { color: #fff; }
  html:root[data-theme="reading"] :is(#toast, #library-toast) { color: var(--text); background: var(--surface); border-color: var(--gold); box-shadow: var(--theme-shadow); }
  html:root[data-theme="reading"] body.error-page main { background: var(--surface); border-color: var(--border); box-shadow: var(--theme-shadow); }
  html:root[data-theme="reading"] .error-page :is(.brand, .code, .links a:not(:first-child)) { color: var(--gold); }
  html:root[data-theme="reading"] .error-page p:not(.brand) { color: var(--muted); }
  html:root[data-theme="reading"] :focus-visible { outline-color: var(--royal); }
  @media (max-width: 1100px) {
    html:root[data-theme="reading"] .main-nav { background: var(--surface); box-shadow: var(--theme-shadow); }
  }

  html:root[data-theme="reading"] :is(.home-hero, .library-hero) { background: var(--bg); }
  html:root[data-theme="reading"] .home-hero-workbench { background: transparent; border: 0; box-shadow: none; }
  html:root[data-theme="reading"] .sermon-actions > .button { background: var(--surface); border-color: var(--border); color: var(--text); }
  html:root[data-theme="reading"] .sermon-actions > .button:hover { background: var(--surface-2); }
  html:root[data-theme="reading"] .sermon-report {
    --report-ink: var(--text);
    --report-muted: var(--muted);
    --report-panel: var(--surface);
    --report-field: var(--bg);
    --report-line: var(--theme-line);
  }
  .library-hero:after { content: none; }
  .library-hero-grid { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 64px; }
  .library-emblem { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 360px; aspect-ratio: auto; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .library-emblem:before, .library-emblem:after { content: none; }
  .library-emblem img.midad-logo { display: block; width: 100%; height: auto; padding: 0; border-radius: 0; background: transparent; filter: none; }
  .library-emblem > span:last-child { color: var(--muted); margin-top: 24px; font-size: 12px; letter-spacing: 0; }
  .library-emblem-ring { display: none; }
  @media (max-width: 820px) {
    .library-hero-grid { gap: 28px; }
    .library-emblem { max-width: 240px; }
  }
  @media (max-width: 600px) {
    .footer .brand img.midad-logo, .library-footer-brand > img.midad-logo { width: 96px; height: 96px; }
  }
  @media (max-width: 580px) {
    .library-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .library-emblem { display: flex; order: -1; max-width: 220px; margin: 0 auto 28px; }
    .library-emblem > span:last-child { display: none; }
  }

  html:root[data-theme="dark"] .home-hero-caption { color: var(--muted); }
  html:root[data-theme="dark"] .home-hero-caption > strong { color: var(--gold-light); }
  .theme-toggle { position: fixed; right: max(22px, env(safe-area-inset-right)); bottom: max(22px, env(safe-area-inset-bottom)); z-index: 90; display: grid; place-items: center; width: 54px; height: 54px; padding: 13px; border: 1.5px solid var(--gold); border-radius: 50%; background: var(--surface); color: var(--gold); box-shadow: 0 6px 24px #0003; cursor: pointer; transition: transform .2s, box-shadow .2s; }
  .theme-toggle:hover { transform: translateY(-2px); box-shadow: 0 8px 28px #0004; }
  .theme-toggle:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
  .theme-toggle svg { display: block; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  html[data-theme="reading"] .theme-toggle .theme-sun, html[data-theme="dark"] .theme-toggle .theme-moon { display: none; }
  .theme-toggle > span { display: none; }
  @media (max-width: 600px) { .theme-toggle { right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); width: 50px; height: 50px; padding: 11px; } }

  /* Center the visible ink, not its transparent square. Reserve the full orbit height. */
  .midad-logo-stage { --logo-center-x: 49.58%; --logo-center-y: 55.55%; position: relative; isolation: isolate; width: 100%; aspect-ratio: 1.3; }
  .midad-logo-stage > img.midad-logo { position: absolute; z-index: 1; left: 50%; top: 50%; width: 50%; height: auto; aspect-ratio: 1; transform: translate(calc(-1 * var(--logo-center-x)), calc(-1 * var(--logo-center-y))); }
  .logo-orbit { position: absolute; z-index: 0; pointer-events: none; left: 50%; top: 50%; width: 64%; aspect-ratio: 1; border-radius: 50%; border: 2px solid transparent; border-top-color: var(--gold); border-bottom-color: color-mix(in srgb, var(--gold) 50%, transparent); animation: midad-logo-orbit 18s linear infinite; }
  .logo-orbit::before { content: ''; position: absolute; width: 8px; height: 8px; top: 50%; left: 0; transform: translate(-50%, -50%); border-radius: 50%; background: var(--gold); box-shadow: 0 0 12px color-mix(in srgb, var(--gold) 65%, transparent); }
  .logo-orbit--outer { width: 74%; border-width: 1px; border-style: dashed; border-color: color-mix(in srgb, var(--gold) 45%, transparent); animation-duration: 28s; animation-direction: reverse; }
  .logo-orbit--outer::before { width: 6px; height: 6px; left: 100%; }
  .logo-orbit:not(.logo-orbit--outer) { filter: drop-shadow(0 0 5px #ffd05a60); }
  @keyframes midad-logo-orbit { from { transform: translate(-50%, -50%) rotate(0deg); } to { transform: translate(-50%, -50%) rotate(360deg); } }
  @media (prefers-reduced-motion: reduce) { .logo-orbit { animation: none; transform: translate(-50%, -50%); } .theme-toggle { transition: none; } }
  /* A permanent navy setting for the gold brand, independent of reading mode.
     Local tokens also cover the existing reading-mode component selectors. */
  html:root[data-theme] :is(.home-hero, .library-hero, .footer) {
    color-scheme: dark;
    --bg: #08172e;
    --surface: #102541;
    --surface-2: #152f4e;
    --royal: #153a79;
    --gold: #ffd05a;
    --gold-light: #fff0a5;
    --text: #f3f2ec;
    --muted: #b5c2d7;
    --ink-accent: #ffda78;
    --border: #a9bdd62e;
    --theme-line: #9cb2ce4d;
    --theme-shadow: 0 8px 24px #0002;
    --theme-glow: #213d60;
    color: var(--text);
    background: radial-gradient(ellipse at 15% 30%, #294c704d, transparent 58%), linear-gradient(120deg, #10243f, #08172e 72%);
    border-color: #c4a46138;
  }
  html:root[data-theme] .footer { background: #07152b; border-top: 1px solid #c4a46138; }
  html:root[data-theme] :is(.home-hero, .library-hero) { border-bottom: 1px solid #c4a46138; }
  html:root[data-theme] :is(.home-hero, .library-hero, .footer) .button-gold { color: #17243a; }
  html:root[data-theme] :is(.home-hero, .library-hero, .footer) :focus-visible { outline-color: var(--gold); }
  html:root[data-theme] :is(.home-hero, .library-hero, .footer) ::selection { color: #17243a; background: #ffd05a; }
  html:root[data-theme] .home-hero-caption { color: var(--muted); }
  html:root[data-theme] .home-hero-caption > strong { color: var(--gold-light); }
  html:root[data-theme] .footer .brand strong { color: var(--gold-light); }
  html:root[data-theme] .footer a:any-link:hover { color: var(--gold-light); }
}
@media print { .theme-toggle, .logo-orbit { display: none !important; } }
