
#aks-masjid-art{padding:18px 8px}
#aks-masjid-art *{box-sizing:border-box}
#aks-masjid-art [hidden]{display:none!important}
#aks-masjid-art .art-shell{max-width:740px;margin:auto;padding:28px 24px 23px;background:#fff;color:#153451;font:15px/1.75 Arial,Helvetica,sans-serif}
#aks-masjid-art .art-eyebrow{margin:0 0 9px;font:500 11px/1.5 Arial,sans-serif;color:#3779b5;letter-spacing:1.3px;text-transform:uppercase}
#aks-masjid-art h1{margin:0 0 10px;font:400 34px/1.2 Georgia,serif;color:#164b88}
#aks-masjid-art .art-intro{margin:0;color:#60788f}
#aks-masjid-art .art-views{display:flex;gap:5px;background:#edf4fb;padding:4px;border-radius:7px;width:max-content;margin:21px 0 17px}
#aks-masjid-art .art-views button{border:0;background:transparent;color:#60788f;font:500 13px/1.5 Arial,sans-serif;padding:8px 21px;min-height:40px;border-radius:4px}
#aks-masjid-art .art-views button.active{background:#fff;color:#164b88;box-shadow:0 2px 6px #164b8810}
#aks-masjid-art .art-scene{overflow:hidden;border-radius:9px;background:#f2f7fc}
#aks-masjid-art .art-picture{position:relative;line-height:0;isolation:isolate}
#aks-masjid-art .art-picture>img{display:block;width:100%;height:auto}
#aks-masjid-art .art-highlight{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
#aks-masjid-art .art-white-outline{fill:none;stroke:#fff;stroke-width:14;stroke-linejoin:round;stroke-linecap:round;opacity:.95}
#aks-masjid-art .art-blue-outline{fill:none;stroke:#247bc5;stroke-width:7;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 5px #2d85ce99)}
#aks-masjid-art .art-hit{position:absolute;border:0;padding:0;background:transparent;min-width:44px;z-index:2}
#aks-masjid-art .art-hit:focus-visible{outline:3px solid #fff;outline-offset:-5px;box-shadow:inset 0 0 0 7px #247bc5}
#aks-masjid-art .art-feature-names{display:flex;justify-content:center;gap:29px;padding:0 14px;background:#f2f7fc}
#aks-masjid-art .art-feature-names button{border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:#60788f;font:500 12px/1.4 Arial,sans-serif;padding:5px 4px;min-height:44px;min-width:54px}
#aks-masjid-art .art-feature-names button.selected{color:#164b88;border-bottom-color:#247bc5}
#aks-masjid-art button:focus-visible{outline:3px solid #8bbce5;outline-offset:3px}
#aks-masjid-art .art-detail{border-left:3px solid #247bc5;padding:0 0 0 16px;margin:22px 0 18px}
#aks-masjid-art .art-detail-top{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:35px}
#aks-masjid-art .art-context{font:500 10px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:1px;color:#60788f}
#aks-masjid-art .art-arabic{font:400 26px/1.4 Georgia,serif;color:#245fa6}
#aks-masjid-art h3{font:400 28px/1.25 Georgia,serif;color:#164b88;margin:0 0 9px}
#aks-masjid-art .art-description{color:#526d85;font:15px/1.75 Arial,sans-serif;margin:0 0 12px;max-width:590px}
#aks-masjid-art .art-source{color:#245fa6;font:12px/1.6 Arial,sans-serif;text-underline-offset:3px}
#aks-masjid-art .art-prompt{margin:15px auto;max-width:100%;color:#60788f;font:13px/1.6 Arial,sans-serif;text-wrap:balance;text-align:center}
#aks-masjid-art .art-note{border-top:1px solid #e1ebf4;padding-top:14px;margin:0;color:#60788f;font:11px/1.6 Arial,sans-serif}
@media(max-width:430px){#aks-masjid-art .art-shell{padding:22px 12px 19px}#aks-masjid-art h1{font-size:29px}#aks-masjid-art .art-detail{padding-left:12px;margin-top:18px}#aks-masjid-art .art-description{font-size:14px}}

#aks-masjid-art .masjid-back{display:inline-block;color:#245f9d;font:14px/1.5 Arial,sans-serif;text-decoration:none;margin-bottom:22px;padding:10px 0;min-height:44px}
#aks-masjid-art .masjid-back:hover{text-decoration:underline}

/* Keep the back link comfortably close to the navigation on mobile. */
@media(max-width:600px){body:has(#aks-masjid-art) .site-nav{margin-bottom:10px}#aks-masjid-art{padding-top:4px}#aks-masjid-art .art-shell{padding-top:10px}}

/* Tighten the gap between the illustration note and page footer. */
@media(max-width:600px){body:has(#aks-masjid-art) .page-foot{margin-top:14px}#aks-masjid-art{padding-bottom:0}}

/* Bring the desktop back link closer to the navigation. */
@media(min-width:601px){body:has(#aks-masjid-art) .site-nav{margin-bottom:10px}#aks-masjid-art{padding-top:4px}#aks-masjid-art .art-shell{padding-top:10px}}

/* Compact illustrated view selectors. */
#aks-masjid-art .art-views{max-width:100%;margin:18px 0 15px}
#aks-masjid-art .art-views button{display:flex;align-items:center;justify-content:center;gap:8px;padding:5px 13px 5px 6px;min-height:44px}
#aks-masjid-art .art-view-thumb{display:block;width:38px;height:30px;object-fit:cover;border-radius:3px;flex:none}
#aks-masjid-art .art-hover-name{position:absolute;z-index:3;pointer-events:none;padding:5px 9px;border-radius:5px;background:#164b88;color:#fff;font:500 12px/1.4 Arial,Helvetica,sans-serif;white-space:nowrap;box-shadow:0 2px 7px #102e4d26}
@media(hover:none),(pointer:coarse){#aks-masjid-art .art-hover-name{display:none!important}}

/* Three compact views and the added prayer-hall selector. */
#aks-masjid-art .art-views{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
#aks-masjid-art .art-views button{min-width:0;gap:6px;padding:5px 6px}
#aks-masjid-art .art-feature-names{gap:16px;flex-wrap:wrap}
@media(max-width:430px){#aks-masjid-art .art-views button{font-size:12px;gap:4px;padding:5px 3px}#aks-masjid-art .art-view-thumb{width:29px;height:25px}}

/* Compact the introduction between the navigation divider and view tabs. */
body:has(#aks-masjid-art) .site-nav{margin-bottom:4px}
#aks-masjid-art{padding-top:0}
#aks-masjid-art .art-shell{padding-top:0}
#aks-masjid-art .masjid-back{font-size:12px;line-height:1.5;margin-bottom:2px;padding:10px 0;min-height:44px}
#aks-masjid-art .art-eyebrow{margin-bottom:5px}
#aks-masjid-art h1{margin-bottom:6px}
#aks-masjid-art .art-views{margin-top:12px;margin-bottom:12px}

/* Crossfade views without changing scene layout or interactive hit targets. */
#aks-masjid-art .art-picture>img.art-transition-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:4;pointer-events:none;animation:aks-masjid-view-fade 220ms ease-in-out forwards}
@keyframes aks-masjid-view-fade{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){#aks-masjid-art .art-transition-overlay{display:none!important;animation:none}}
