/* One reading interface across languages: the English layout and palette. */
.site-language-bar a[lang=ur]{min-width:116px;text-align:center;white-space:nowrap;font-weight:800;direction:ltr}
html:is([lang=id],[lang=ur]) body{margin:0;background:#071a2b;color:#f5f4e9;font-family:Manrope,system-ui,Tahoma,sans-serif;font-size:16px;line-height:1.65}
html[lang=ur] body{font-family:DuaArabic,'Noto Naskh Arabic',Tahoma,serif;font-size:18px;direction:rtl}
html:is([lang=id],[lang=ur]) main{max-width:none;margin:0;padding:0}
html:is([lang=id],[lang=ur]) .collection-section{max-width:1180px;margin:12px auto 0;padding:20px 20px 40px}
html:is([lang=id],[lang=ur]) .quick-finder-grid,html:is([lang=id],[lang=ur]) #idGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:100%;box-sizing:border-box}
html:is([lang=id],[lang=ur]) .quick-finder-grid .finder-card{min-width:0;min-height:150px;overflow-wrap:break-word}
html:is([lang=id],[lang=ur]) #idSearchForm{display:flex;align-items:center;gap:12px;max-width:100%;width:100%;border:1px solid #b79c65;border-radius:12px;background:#123642;padding:10px 14px;margin:20px 0;color:#fff5df}
html:is([lang=id],[lang=ur]) .id-search-row{display:flex;flex:1;align-items:center;gap:10px;min-width:0}
html:is([lang=id],[lang=ur]) #idSearch{flex:1;min-width:0;width:100%;background:transparent;color:inherit;border:0;padding:6px;font:inherit;font-size:18px}
html:is([lang=id],[lang=ur]) .id-groups{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:8px;margin:0;border:0;background:transparent}
html:is([lang=id],[lang=ur]) .id-groups a,html:is([lang=id],[lang=ur]) .id-groups button{flex:0 0 auto;white-space:nowrap;margin:0;min-height:44px;border:1px solid #799a92;border-radius:10px;padding:9px 14px;background:#133b47;color:#fff5df;font:inherit;text-decoration:none}
html:is([lang=id],[lang=ur]) .id-groups small{display:inline;margin-inline-start:6px;font-size:.82em;opacity:.8}
html:is([lang=id],[lang=ur]) .id-groups [aria-current=page]{background:#e5ca7a;color:#123642;border-color:#e5ca7a}
html:is([lang=id],[lang=ur]) .id-card{display:flex;flex-direction:column;min-width:0;text-align:center;overflow-wrap:break-word;padding:24px;border:1px solid #e9c783;border-radius:18px;color:#fff9ed}
html:is([lang=id],[lang=ur]) .id-card .arabic{font-family:DuaArabic,'Noto Naskh Arabic',serif;font-size:clamp(27px,2.2vw,34px);line-height:1.95;white-space:pre-wrap}
html:is([lang=id],[lang=ur]) .id-card .translation{font-size:22px;line-height:1.8;white-space:pre-wrap}
html:is([lang=id],[lang=ur]) .id-card .transliteration{font:17px/1.8 Manrope,system-ui,sans-serif;direction:ltr}
html:is([lang=id],[lang=ur]) .id-card .id-detail{font-size:18px;line-height:1.8;white-space:pre-wrap}
html:is([lang=id],[lang=ur]) .id-card .source{font-size:15px;color:inherit;line-height:1.8}
html:is([lang=id],[lang=ur]) .id-card-actions,html:is([lang=id],[lang=ur]) .id-reading-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
html:is([lang=id],[lang=ur]) .id-card-actions{margin-top:auto;padding-top:18px}
html:is([lang=id],[lang=ur]) .id-card-actions :is(button,a),html:is([lang=id],[lang=ur]) .id-reading-tools button,html:is([lang=id],[lang=ur]) .id-pager button{border:1px solid #ffffff60;border-radius:10px;background:#ffffff16;color:#fff9ed;font:inherit;padding:8px 14px;text-decoration:none;min-height:44px}
html:is([lang=id],[lang=ur]) .id-card.palette-0{background:linear-gradient(155deg,#102d37,#12635f)}html:is([lang=id],[lang=ur]) .id-card.palette-1{background:linear-gradient(155deg,#262650,#56508a)}html:is([lang=id],[lang=ur]) .id-card.palette-2{background:linear-gradient(155deg,#3a244a,#7c466e)}html:is([lang=id],[lang=ur]) .id-card.palette-3{background:linear-gradient(155deg,#183451,#286e98)}html:is([lang=id],[lang=ur]) .id-card.palette-4{background:linear-gradient(155deg,#173d35,#3f7661)}html:is([lang=id],[lang=ur]) .id-card.palette-5{background:linear-gradient(155deg,#4c2c38,#a05f62)}
html:is([lang=id],[lang=ur]) .id-pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px 0}
html:is([lang=id],[lang=ur]) .id-pager [aria-current=page]{background:#e5ca7a;color:#123642}
html:is([lang=id],[lang=ur]) .english-topic-toolbar select{width:auto;flex:1;min-width:180px;max-width:100%;margin:0;min-height:44px;font:inherit}
html:is([lang=id],[lang=ur]) .website-share-trigger{border:1px solid #d4b765;border-radius:12px;background:#153f45;color:#fff4d6;font-family:inherit;font-size:16px;font-weight:700;line-height:1.6;padding:12px 20px;cursor:pointer;text-align:center}
html:is([lang=id],[lang=ur]) .website-share-trigger small{display:block;font-size:13px;font-weight:400}
html:is([lang=id],[lang=ur]) .website-share-dialog{width:min(720px,94vw);max-height:90vh;overflow:auto;background:#102f3a;color:#fff9ed;border:1px solid #d4b765;border-radius:18px;padding:24px}
html:is([lang=id],[lang=ur]) .website-share-dialog textarea{width:100%;min-height:220px;padding:14px;border-radius:10px;font:inherit;background:#f8f4e7;color:#173f43}
html:is([lang=id],[lang=ur]) .website-share-dialog::backdrop{background:#00131bc9}
html:is([lang=id],[lang=ur]) .site-share-toolbar{display:flex;justify-content:center;gap:12px;padding:14px}
html:is([lang=id],[lang=ur]) .id-header.site-header{max-width:none;margin:0;border-bottom:1px solid #ffffff16;padding:0 max(18px,calc((100vw - 1180px)/2));height:86px}
html:is([lang=id],[lang=ur]) .id-header .brand{color:#f5ead3;text-decoration:none}.id-header .brand-mark{display:grid;place-items:center;border:1px solid #bda25e;border-radius:10px;width:42px;height:42px;font-family:DuaArabic,serif}
html:is([lang=id],[lang=ur]) .id-header .brand small{display:block;font-size:12px}
html[lang=ur] .hero h1{font-size:clamp(2rem,4vw,3.6rem);line-height:1.6}
@media(max-width:950px){html:is([lang=id],[lang=ur]) .quick-finder-grid,html:is([lang=id],[lang=ur]) #idGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){html:is([lang=id],[lang=ur]) .quick-finder-grid,html:is([lang=id],[lang=ur]) #idGrid{grid-template-columns:minmax(0,1fr)}html:is([lang=id],[lang=ur]) .collection-section{padding-inline:16px}html:is([lang=id],[lang=ur]) #idSearchForm{gap:8px}html:is([lang=id],[lang=ur]) #idSearchForm>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}html:is([lang=id],[lang=ur]) .id-header.site-header{height:72px}}

html:is([lang=id],[lang=ur]) main>.id-reader,html:is([lang=id],[lang=ur]) main>.id-hero{max-width:1180px;margin-inline:auto;padding-inline:20px}html:is([lang=id],[lang=ur]) main>.id-groups{max-width:1180px;margin-inline:auto}html:is([lang=id],[lang=ur]) .id-header{display:flex;align-items:center;justify-content:space-between;gap:18px}html:is([lang=id],[lang=ur]) .id-header .brand{display:flex;gap:12px;align-items:center}html:is([lang=id],[lang=ur]) .id-header .site-menu-panel{background:#102f3a;color:#fff9ed;border:1px solid #b79c65;border-radius:14px;padding:18px}html:is([lang=id],[lang=ur]) .id-header .menu-links{display:grid;gap:10px}html:is([lang=id],[lang=ur]) .id-header .site-menu summary{cursor:pointer;font-weight:700}