@import url('arabic-fonts.css');
:root{--arabic-font:SCAmiri}html[data-font=amiri]{--arabic-font:SCAmiri}html[data-font=quran]{--arabic-font:SCQuran}html[data-font=naskh]{--arabic-font:SCNaskh}html[data-font=kufi]{--arabic-font:SCKufi}html[data-font=plex]{--arabic-font:SCPlex}
html[lang=ar] body,html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] .panel-title,html[lang=ar] button,html[lang=ar] input,html[lang=ar] select,html[lang=ar] summary,html[lang=ar] .preferences a,html[lang=ar] .hero-intro,.chosen-font-preview,a[lang=ar]{font-family:var(--arabic-font),SCBody,serif;letter-spacing:0}
html[lang=ar] body{line-height:2.05}html[lang=ar] h1{font-size:clamp(3rem,5.5vw,5.1rem);line-height:1.75;font-weight:400}html[lang=ar] h2{line-height:1.85}html[lang=ar] h3{line-height:1.9}html[lang=ar] .hero-intro{font-size:1.15rem;line-height:2.25}html[lang=ar] .branch p,html[lang=ar] .door p{font-size:1rem;line-height:2}html[lang=ar] .hero .eyebrow{font-size:1.15rem}html[lang=ar] .hero-copy{padding-block:8px}html[lang=ar] .brand strong{font-family:Georgia,serif;line-height:1.3}html[lang=ar] .brand small{font-family:SCBody,Arial,sans-serif;line-height:1.3}
html[data-font=kufi][lang=ar] h1,html[data-font=plex][lang=ar] h1{font-size:clamp(2.6rem,4.8vw,4.4rem);line-height:1.8}
.design-controls{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}.design-controls h3{font-size:1.1rem!important;margin-bottom:12px}.design-controls fieldset{border:0;padding:0;margin:14px 0}.design-controls legend{margin-bottom:8px;font-size:.9rem}.reading-picker .popover{width:min(350px,calc(100vw - 28px));max-height:65vh;overscroll-behavior:contain}.chosen-font-preview{font-size:1.45rem;line-height:2.1;padding:12px 7px;background:var(--soft);border:1px solid var(--line);border-radius:7px;margin-top:10px;color:var(--ink)}.palette-list{display:grid;gap:7px}.preferences button.palette-choice{display:flex;align-items:center;text-align:start;gap:10px;padding:9px 12px}.preferences button.palette-choice[aria-pressed=true]{outline:2px solid var(--accent,#b48c47);outline-offset:1px;background:var(--soft);color:var(--ink)}.palette-dot{flex:0 0 28px;height:21px;border-radius:5px;border:1px solid #777}.palette-dot.classic{background:linear-gradient(90deg,#252b2d 50%,#dfc88e 50%)}.palette-dot.emerald{background:linear-gradient(90deg,#0e3c32 50%,#dfc88e 50%)}.palette-dot.sapphire{background:linear-gradient(90deg,#172d4b 50%,#d4e1ed 50%)}.palette-dot.manuscript{background:linear-gradient(90deg,#e8d8b9 50%,#775431 50%)}.palette-dot.plum{background:linear-gradient(90deg,#3c263e 50%,#e4c59a 50%)}#font-sample-list>div{border-bottom:1px solid var(--line);padding:12px 0}#font-sample-list span{font-size:.8rem;color:var(--muted)}#font-sample-list p{font-size:1.4rem;line-height:2.2;color:var(--ink)}.design-help{font-size:.8rem;color:var(--muted);margin:12px 0;line-height:1.8}
@media(max-width:760px){html[lang=ar] .hero h1{font-size:clamp(2.7rem,9vw,3.6rem)}html[data-font=kufi][lang=ar] .hero h1,html[data-font=plex][lang=ar] .hero h1{font-size:clamp(2.2rem,7.5vw,3.1rem)}.reading-picker .popover{max-height:60vh}html[lang=ar] .header-inner nav{gap:8px 14px}}
html[data-palette=emerald] body{--paper:#f4f7ef;--surface:#fffef7;--ink:#153d32;--muted:#4c6255;--line:#cbd9ca;--soft:#e8efe3;--hero:#0e4033;--panel:#082b23;--accent:#e8ce92;--accent-text:#71551c;}
html[data-palette=emerald] body.dark{--paper:#102c25;--surface:#17392f;--ink:#faf2df;--muted:#c5d8c9;--line:#436052;--soft:#234639;--hero:#0e4033;--panel:#082b23;--accent:#e8ce92;--accent-text:#e8ce92;}
html[data-palette=sapphire] body{--paper:#f2f5fa;--surface:#ffffff;--ink:#17314c;--muted:#4b6177;--line:#cad5e2;--soft:#e6edf5;--hero:#173452;--panel:#101f36;--accent:#d7e6f6;--accent-text:#385978;}
html[data-palette=sapphire] body.dark{--paper:#142237;--surface:#1d3049;--ink:#eff5fc;--muted:#c0cfdf;--line:#455b75;--soft:#283e58;--hero:#173452;--panel:#101f36;--accent:#d7e6f6;--accent-text:#d7e6f6;}
html[data-palette=manuscript] body{--paper:#f6efdf;--surface:#fff9ed;--ink:#443323;--muted:#6a5744;--line:#d9c8a9;--soft:#eee2cb;--hero:#4b3825;--panel:#302419;--accent:#edd2a0;--accent-text:#785522;}
html[data-palette=manuscript] body.dark{--paper:#2d251e;--surface:#3a3026;--ink:#fbf1dd;--muted:#d8c8ad;--line:#6a5944;--soft:#463b2d;--hero:#4b3825;--panel:#302419;--accent:#edd2a0;--accent-text:#edd2a0;}
html[data-palette=plum] body{--paper:#f8f2f6;--surface:#fffbfe;--ink:#432d43;--muted:#70566d;--line:#ddcdda;--soft:#efe3ec;--hero:#432947;--panel:#2c1d31;--accent:#ecd0a0;--accent-text:#7a512d;}
html[data-palette=plum] body.dark{--paper:#2b202e;--surface:#392a3d;--ink:#fbf0f5;--muted:#dac6d7;--line:#67506a;--soft:#49364d;--hero:#432947;--panel:#2c1d31;--accent:#ecd0a0;--accent-text:#ecd0a0;}
html:not([data-palette=classic]) body{background:var(--paper);color:var(--ink)}
html:not([data-palette=classic]) header,html:not([data-palette=classic]) body.dark header{background:var(--surface)}
html:not([data-palette=classic]) .hero{background:linear-gradient(125deg,var(--hero),var(--panel))}
html:not([data-palette=classic]) .hero-panel{background:var(--panel);border-color:var(--accent)}
html:not([data-palette=classic]) .branch,html:not([data-palette=classic]) .door{background:var(--surface)}
html:not([data-palette=classic]) .source-quran,html:not([data-palette=classic]) footer{background:var(--hero);color:#fff8eb}
html:not([data-palette=classic]) .emerald{background:var(--hero);color:#fff8eb}
html:not([data-palette=classic]) .eyebrow,html:not([data-palette=classic]) .branch-number,html:not([data-palette=classic]) .door-number,html:not([data-palette=classic]) .brand strong span,html:not([data-palette=classic]) .gateway-popover h3{color:var(--accent-text)}
html:not([data-palette=classic]) .hero .eyebrow,html:not([data-palette=classic]) .hero h1 em,html:not([data-palette=classic]) .panel-kicker,html:not([data-palette=classic]) .panel-bottom,html:not([data-palette=classic]) .brand-descriptor,html:not([data-palette=classic]) .source-quran .eyebrow,html:not([data-palette=classic]) footer .brand strong span{color:var(--accent)}
html:not([data-palette=classic]) .gold,html:not([data-palette=classic]) .favourite[aria-pressed=true]{background:var(--accent);color:var(--panel);border-color:var(--accent)}
html:not([data-palette=classic]) .hero-intro,html:not([data-palette=classic]) .hero-foot,html:not([data-palette=classic]) .source-quran p{color:#e7e6e0}
html:not([data-palette=classic]) body.dark h3{color:var(--ink)}
@media print{html[data-palette] body{--paper:white!important;--surface:white!important;--ink:black!important;--muted:#333!important;--soft:white!important}html[data-palette] .hero,html[data-palette] .source-quran,html[data-palette] footer{background:white!important;color:black!important}html[data-palette] .hero-intro,html[data-palette] .hero-foot,html[data-palette] .source-quran p{color:black!important}}