/* Bridge the existing, tested page layouts to Noor's shared four-theme palette. */
:root, html[data-theme] {
 --bg:var(--paper); --green:var(--accent); --green-soft:var(--accent); --green-deep:var(--emerald);
 --green-wash:var(--surface-alt); --green-line:var(--border-strong); --rule:var(--border);
 --gold-decoration:#C9A04A; --gold:var(--gold-ink); --gold-soft:var(--gold-light); --gold-dark:var(--gold-ink);
 --gold-deep:var(--gold-ink); --gold-bright:var(--gold-ink); --gold-tint:var(--highlight);
 --lapis:var(--accent); --lapis-soft:var(--highlight); --band-a:var(--surface-alt); --band-b:var(--surface);
 --shadow:var(--shadow-1); --shadow-lg:var(--shadow-2); --emerald-dark:var(--emerald);
}
html[data-theme] body {
 --bg:var(--paper); --surface:inherit; --surface-alt:inherit; --surface-raised:inherit;
 --ink:inherit; --ink-soft:inherit; --ink-faint:inherit; --border:inherit; --border-strong:inherit;
 --green:var(--accent); --green-soft:var(--accent); --green-deep:var(--emerald);
 --green-wash:var(--surface-alt); --green-line:var(--border-strong);
 --gold:var(--gold-ink); --gold-soft:var(--gold-light); --gold-deep:var(--gold-ink); --gold-bright:var(--gold-ink);
 --gold-tint:var(--highlight); --lapis:var(--accent); --lapis-soft:var(--highlight); --shadow:var(--shadow-1); --shadow-lg:var(--shadow-2);
 --bg-gradient:none; background-color:var(--paper); color:var(--ink);
}
[hidden] { display:none!important; }
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible { outline:3px solid var(--focus); outline-offset:3px; }
.noor-theme-select { font:inherit; font-size:.875rem; min-height:44px; max-width:10rem; padding:.45rem .6rem; border:1px solid var(--border-strong); border-radius:999px; background:var(--surface); color:var(--ink); cursor:pointer; }
.topbar { flex-wrap:wrap; }
.topbar .noor-theme-select { margin-inline-start:.35rem; }
.kicker,.shelf-return,.card .go,.page-home .kicker,.page-home .f-icon { color:var(--gold-ink); }
.topbar a,.topbar button { min-height:44px; }
.page-home .topbar { position:relative; inset:auto; background:var(--paper); color:var(--ink); max-width:76rem; }
.page-home .brand,.page-home .top-nav-btn,.page-home .langbar button { color:var(--ink); }
.page-home .langbar { border-color:var(--border-strong); }
.page-home .langbar button[aria-pressed="true"] { background:var(--surface-alt); color:var(--ink); }
.page-home .top-nav-btn:hover { color:var(--accent); }
.page-home .hero { margin:0 auto; max-width:76rem; border-radius:24px; padding:4.5rem 1.5rem 3rem; background:radial-gradient(ellipse at top,var(--emerald),var(--hero-bg)); color:var(--hero-ink); }
.page-home .hero .tagline { color:var(--hero-soft); }
.page-home .hero .wordmark { color:var(--hero-ink); }
.page-home .hero .reader-link,.page-home .scroll-cue { color:var(--hero-accent); }
.page-home .hero :focus-visible,.page-home .cta :focus-visible { outline-color:var(--hero-accent); }
.page-home .store-text small { font-size:.75rem; }
.page-home .cta { background:var(--hero-bg); color:var(--hero-ink); }
.page-home .cta .kicker { color:var(--hero-accent); }
.page-home .features { border:0; gap:1rem; }
.page-home .features li:nth-child(n) { border:1px solid var(--border); border-radius:18px; background:var(--surface); padding:1.6rem; box-shadow:var(--shadow-1); }
.page-home .features li:hover { border-color:var(--border-strong); }
.page-home .kicker { font-size:.875rem; letter-spacing:.08em; }
.page-home .band { padding:2rem; border:1px solid var(--border); border-radius:22px; background:var(--surface-alt); }
.noor-start { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:2rem auto 0; }
.noor-start a { padding:1.5rem; display:flex; flex-direction:column; gap:.5rem; border:1px solid var(--border); border-radius:18px; background:var(--surface); color:var(--ink); text-decoration:none; }
.noor-start a:hover { border-color:var(--accent); }
.noor-start strong { font-size:1.2rem; color:var(--accent); }
.noor-start span { line-height:1.7; color:var(--ink-soft); }
.noor-continue { display:block; margin-top:1rem; padding:1rem 1.5rem; border:1px solid var(--border-strong); border-radius:16px; color:var(--accent); background:var(--surface-alt); text-decoration:none; }
.cards .card { border-radius:16px; background:var(--surface); box-shadow:var(--shadow-1); }
.card:hover { box-shadow:var(--shadow-2); }
.hero { background-color:var(--hero-bg); }
.hero h1,.hero p.sub { color:var(--hero-ink); }
.hero-stats span { font-size:.8rem!important; }
.controls button,.controls select,.seg button,.era,.library-lang { min-height:44px; }
.seg { flex-wrap:wrap; }
.hit,.hit2 { border-radius:12px; background:var(--surface); padding:1rem; margin-block:.5rem; }
.hbook { border:1px solid var(--border); border-radius:16px; overflow:hidden; margin-block:1rem; }
.search-more { margin:.6rem; padding:.75rem; border-radius:10px; background:var(--surface-alt); }
.search-more summary { cursor:pointer; min-height:44px; color:var(--accent); }
.reader-page .q-word { cursor:pointer; }
.reader-page .q-word:focus-visible { outline:2px solid var(--focus); outline-offset:2px; border-radius:4px; background:var(--highlight); }
.reader-page .r-verse-badge { color:var(--gold-ink); }
.reader-page .r-head-card { background:var(--surface); border-color:var(--border); }
.reader-page .r-topbar { background:var(--surface); }
.reader-page .r-player { padding-bottom:calc(12px + env(safe-area-inset-bottom,0px)); }
.reader-page .r-search-item { min-height:44px; }
@media(max-width:720px) {
 .page-home .topbar { padding: .75rem 1rem; }
 .page-home .topbar-nav-links { border-color:var(--border); gap:.5rem; justify-content:space-between; }
 .page-home .hero { border-radius:0 0 22px 22px; padding:2.5rem 1.25rem 2rem; }
 .noor-start { grid-template-columns:1fr; }
 .noor-start a { padding:1.15rem; }
 .page-home .features li:nth-child(n) { padding:1.25rem; }
 .noor-theme-select { max-width:8.5rem; font-size:.8rem; }
 .reader-page .noor-theme-select { display:none; } /* Existing mobile theme control cycles the same five choices. */
 .rpanel { max-width:calc(100vw - 2rem); padding-bottom:calc(1rem + env(safe-area-inset-bottom,0px)); }
 .hb-t { flex-wrap:wrap; gap:.5rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
@font-face { font-family:'Cormorant Garamond';src:url('/assets/fonts/cormorant-latin.woff') format('woff');font-weight:300 700;font-style:normal;font-display:swap; }
:root { --display:'Cormorant Garamond','Marcellus',Georgia,serif; }
.page-home [lang="en"] h1,.page-home [lang="en"] h2 { font-family:var(--display); font-weight:600; }
.quran-search-text { font-family:'Amiri Quran','Amiri',serif; font-size:1.45rem; line-height:2; color:var(--ink); }
@font-face { font-family:'Amiri Quran';src:url('/assets/fonts/amiri-quran.woff') format('woff');font-weight:400;font-display:swap; }
.noor-audio-source { color:var(--ink-soft); font-size:.75rem; line-height:1.5; }
.ayah-mark:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
nav.langbar { flex-wrap:wrap; }
html[data-theme] .reader-page .r-topbar { background:var(--surface); color:var(--ink); border-color:var(--border); box-shadow:var(--shadow-1); }
.reader-page .brand-name { color:var(--ink); }
.reader-page .r-player-bar { padding-bottom:calc(12px + env(safe-area-inset-bottom,0px)); }
.reader-page .noor-audio-source { color:var(--hero-soft); }
.page-home .topbar .brand-name { color:var(--ink); }
.search-scope { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; margin:1rem 0; color:var(--ink-soft); }
.search-scope select { min-height:44px; padding:.5rem 1rem; border:1px solid var(--border-strong); border-radius:999px; color:var(--ink); background:var(--surface); font:inherit; }
.translation-search-text { color:var(--ink); font-size:1.1rem; line-height:1.8; }
/* An illuminated threshold: original artwork, quiet editorial typography. */
.page-home .art-hero { display:grid; grid-template-columns:1.1fr 1fr; padding:0; text-align:start; min-height:650px; border:1px solid var(--border); background:var(--surface); color:var(--ink); border-radius:4px 4px 32px 32px; }
.page-home .art-hero .hero-inner { grid-column:1; grid-row:1; align-items:flex-start; justify-content:center; padding:3.8rem 3.5rem; margin:0; max-width:none; }
.page-home .art-hero .hero-art { grid-column:2; grid-row:1; position:relative; overflow:hidden; min-width:0; }
.page-home .hero-art img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:50% 50%; }
.page-home .hero-art::after { content:''; position:absolute; inset:1rem; border:1px solid #e2cd9170; pointer-events:none; }
.page-home .art-hero .hero-star { display:none; }
.page-home .art-hero .appicon { display:none; }
.page-home .art-hero .wordmark { color:var(--ink); font-size:clamp(4.5rem,8vw,7rem); line-height:1.25; }
.page-home .art-hero .wordmark-alt { opacity:.55; font-size:.32em; }
.page-home .hero-eyebrow { color:var(--gold-ink); font-size:.72rem; letter-spacing:.22em; margin:0 0 1.2rem; font-weight:600; }
.page-home [lang="ar"] .hero-eyebrow { letter-spacing:0; font-size:1rem; }
.page-home .art-hero .tagline { color:var(--ink-soft); font-size:1.3rem; max-width:28rem; margin:1rem 0 1.8rem; }
.page-home .art-hero .store-row { order:5; margin-top:1.5rem; justify-content:flex-start; }
.page-home .art-hero .store-badge { color:var(--ink); background:transparent; border-color:var(--border-strong); min-width:0; padding:.6rem .9rem; }
.page-home .art-hero .store-text small { color:var(--ink-soft); }
.page-home .art-hero .store-text strong { color:var(--ink); font-size:1rem; }
.page-home .art-hero .reader-link { background:var(--accent); color:var(--on-accent); border-radius:100px; padding:.85rem 1.5rem; text-decoration:none; margin:0; min-height:48px; font-weight:600; }
.page-home .art-hero .reader-link:hover { background:var(--accent-strong); }
.page-home .art-hero :focus-visible { outline-color:var(--focus); }
.page-home .art-hero .hero-links { order:6; }
.page-home .art-hero .scroll-cue { color:var(--ink-soft); margin-top:1.5rem; }
.page-home .noor-start { counter-reset:portals; gap:0; border-block:1px solid var(--border-strong); margin-top:3rem; }
.page-home .noor-start a { counter-increment:portals; border:0; border-inline-end:1px solid var(--border); border-radius:0; background:transparent; padding:1.6rem 1.8rem; position:relative; }
.page-home .noor-start a:last-child { border-inline-end:0; }
.page-home .noor-start a::before { content:'0' counter(portals); font-family:var(--display); font-size:1.5rem; color:var(--gold-ink); }
.page-home .noor-start a:hover { background:var(--surface-alt); }
.page-home .noor-start strong { color:var(--ink); }
html[data-theme="sepia"] .page-home .hero-art img { filter:sepia(.3) saturate(.75); }
html[data-theme="night"] .page-home .hero-art img { filter:brightness(.66) saturate(.55); }
html[data-theme="emerald"] .page-home .hero-art img { filter:brightness(.82) saturate(1.12); }
html[data-theme="emerald"] .page-home .art-hero { background:linear-gradient(135deg,var(--surface),var(--paper)); }
.page-home .features li:nth-child(n) { border-radius:4px 4px 20px 4px; box-shadow:none; border-top:2px solid var(--border-strong); }
@media(max-width:960px) and (min-width:721px) {
 .page-home .art-hero .hero-inner { padding:2.5rem 1.75rem; }
 .page-home .art-hero .store-row { flex-wrap:wrap; }
}
@media(max-width:720px) {
 .page-home .art-hero { grid-template-columns:1fr; min-height:0; border-radius:0 0 24px 24px; }
 .page-home .art-hero .hero-art { grid-column:1; grid-row:2; height:220px; }
 .page-home .hero-art img { object-position:50% 48%; }
 .page-home .art-hero .hero-inner { padding:2rem 1.5rem; align-items:center; text-align:center; }
 .page-home .art-hero .wordmark { font-size:4.5rem; }
 .page-home .hero-eyebrow { margin-bottom:.6rem; }
 .page-home [data-lang-pane="ar"] .art-hero .tagline { font-size:1.4rem; line-height:1.8; margin:.7rem 0 1.2rem; }
 .page-home .art-hero .tagline { font-size:1.1rem; }
 .page-home .art-hero .store-row { justify-content:center; margin-top:1.2rem; }
 .page-home .art-hero .hero-links { display:none; }
 .page-home .noor-start { margin-top:1.5rem; }
 .page-home .noor-start a { border-inline-end:0; border-bottom:1px solid var(--border); padding:1.1rem; }
 .page-home .noor-start a:last-child { border-bottom:0; }
}
.verse-tools { display:flex; flex-wrap:wrap; gap:.6rem; margin-block:1rem; }
.verse-tools button,.saved-dialog button { min-height:44px; padding:.5rem 1rem; border-radius:10px; border:1px solid var(--border-strong); background:var(--surface-alt); color:var(--ink); font:inherit; cursor:pointer; }
.verse-tools p { flex-basis:100%; font-size:.85rem; overflow-wrap:anywhere; }
.saved-dialog { border:1px solid var(--border-strong); border-radius:20px; background:var(--surface); color:var(--ink); width:min(90vw,32rem); max-height:80vh; overflow:auto; padding:1.5rem; margin:auto; }
.saved-dialog::backdrop { background:var(--scrim); }
.saved-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.6rem; border-bottom:1px solid var(--border); }
.saved-row a { padding:.5rem; color:var(--accent); }
.root-search-link { display:block; padding:.6rem; color:var(--accent); }