@font-face{font-family:Nunito;src:url('/fonts/nunito/Nunito-Variable.ttf') format('truetype');font-weight:200 1000;font-style:normal;font-display:swap}
:root{--brand-gold:#f2d567;--brand-navy:#040d58;--purple:#4f1070;--active:#8822bd;--ink:#262626;--muted:#65606b;--line:#e5e5e5;--paper:#fff;--lavender:#f5eef9;font-family:Nunito,system-ui,sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:#f8f6fa}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button,summary{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #b66ed4;outline-offset:3px}.topbar{height:84px;display:flex;align-items:center;padding:0 38px;gap:60px;background:white;border-bottom:1px solid var(--line)}.brand img{width:110px;max-height:52px}.topbar nav{display:flex;gap:30px;height:100%;align-items:center;font-size:14px}.topbar nav a{height:100%;display:flex;align-items:center;border-bottom:3px solid transparent}.topbar nav a[aria-current]{color:var(--purple);border-color:var(--purple)}.preview-badge{margin-left:auto;background:var(--lavender);color:var(--purple);font-size:12px;padding:9px 14px;border-radius:20px}.finder{position:relative;min-height:calc(100vh - 84px);overflow:hidden}.map{position:absolute;inset:0;background:#eae7df}.map>svg{width:100%;height:100%;position:absolute;opacity:.8}.sidebar{position:relative;width:380px;margin:28px 32px 28px auto;z-index:2}.search-card,.mosque-card{background:var(--paper);border:1px solid #fff;border-radius:17px;box-shadow:0 8px 40px #30213812;overflow:hidden}.search-card{padding:24px;margin-bottom:14px}h1{font-size:23px;font-weight:600;letter-spacing:-.7px;margin:0 0 9px}.search-card>p{font-size:12px;color:var(--muted);margin:0 0 20px}form{display:flex;border:1px solid #e3dce8;background:#faf8fb;border-radius:9px;overflow:hidden}input{min-width:0;flex:1;border:0;background:transparent;padding:15px 12px;font-size:13px}form button{border:0;color:var(--purple);background:transparent;width:46px;font-size:28px}#results:empty{display:none}#results{padding-top:12px;font-size:13px}#results button{display:block;width:100%;text-align:left;padding:12px;border:0;background:var(--lavender);color:var(--purple);border-radius:7px;margin-top:5px}.summary{padding:24px 24px 20px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--purple);font-weight:bold}h2{font-size:24px;letter-spacing:-.6px;margin:10px 0}#mosque-address{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 12px}.status{font-size:10px;padding:6px 9px;border-radius:5px;background:#f3f1f4;color:#6c6372}.tabs{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:0 16px}.tabs button{min-height:52px;flex:1;background:transparent;border:0;border-bottom:2px solid transparent;font-size:12px;color:var(--muted)}.tabs button[aria-selected=true]{border-color:var(--purple);color:var(--purple);font-weight:bold}.panel{padding:22px 24px;min-height:320px}.panel[hidden]{display:none}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-heading span{font-size:10px;color:var(--muted)}h3{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:var(--purple);margin:0 0 14px}.panel-heading h3{margin:0}.muted{font-size:11px;line-height:1.7;color:var(--muted)}.prayer{display:flex;align-items:center;gap:12px;min-height:57px;border-bottom:1px solid var(--line)}.prayer img{width:23px;height:23px;opacity:.75}.prayer strong{font-size:12px;font-weight:500}.prayer small{display:block;font-size:9px;color:var(--muted);margin-top:5px}.prayer time{margin-left:auto;font-size:12px}.footnote,.draft-note{font-size:10px;line-height:1.7;color:var(--muted)}.footnote{margin:18px 0 0}.draft-note{background:#ffffffe6;border-radius:8px;padding:10px 14px;margin:12px 0}.pin{position:absolute;background:var(--purple);border:5px solid white;border-radius:50% 50% 50% 0;width:43px;height:43px;transform:rotate(-45deg);box-shadow:0 3px 12px #35233a35}.pin span{display:block;width:9px;height:9px;background:white;border-radius:50%;margin:auto}.pin-one{top:43%;left:57%}.pin-two{top:69%;left:75%;background:#9273a5}.map-note{position:absolute;right:12px;bottom:12px;background:#ffffffed;padding:7px 10px;font-size:10px;color:#666}.map-caption{position:absolute;left:6%;top:7%;text-align:left;pointer-events:none}.map-caption p{font-size:31px;letter-spacing:-1px;line-height:1.25;margin:12px 0;color:#3d294d}.empty-image{height:130px;display:grid;place-items:center;color:#b89ac8;background:var(--lavender);border-radius:9px;font-size:45px;margin-top:18px}h4{font-size:14px;margin:18px 0 6px}details{border-bottom:1px solid var(--line);font-size:12px}summary{padding:17px 0;min-height:48px}details p{font-size:11px;color:var(--muted);line-height:1.6}.information-title{margin-top:26px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1600px){.sidebar{margin-right:5%;margin-top:40px}.map-caption{left:10%}}@media(max-width:900px){.topbar{height:70px;padding:0 18px;gap:20px}.brand img{width:85px}.topbar nav{gap:16px;font-size:12px}.preview-badge{display:none}.finder{padding-top:230px}.map{height:400px}.map-caption{top:25px;right:22px}.map-caption p{font-size:25px}.sidebar{width:auto;margin:0 14px 20px}.pin-one{top:34%;left:35%}.pin-two{top:40%;left:72%}.map-note{bottom:auto;top:200px;font-size:9px}.search-card{padding:20px}.panel{min-height:300px}}@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s,color .15s}.pin:hover{background:#793f96}}

/* Keep the sample finder comfortable on phones and narrow tablets. */
.topbar nav a{min-height:44px;padding:0 4px}
@media(min-width:901px){.topbar nav{margin-left:auto}.topbar .preview-badge{margin-left:0}}
@media(max-width:900px){
    .topbar{height:auto;min-height:70px;flex-wrap:wrap;align-content:center;padding-top:8px;padding-bottom:8px;padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));gap:clamp(12px,4vw,28px)}
    .topbar nav{flex-wrap:wrap;height:auto}
    .brand{display:flex;align-items:center;min-width:44px;min-height:44px}
    .brand img{width:68px}
    .topbar nav{gap:clamp(12px,4vw,24px)}
    .finder{min-height:calc(100svh - 70px)}
    .sidebar{max-width:560px;margin-left:auto;margin-right:auto;padding:0 14px}
    .pin{width:48px;height:48px}
    .pin-one{top:32%;left:30%}
    .pin-two{top:37%;left:72%}
    .map-caption p{font-size:clamp(23px,6vw,28px)}
    .map-note{max-width:calc(100% - 28px);line-height:1.5;text-align:center;right:14px}
    .search-card>p{font-size:13px;line-height:1.6}
    input{font-size:16px;min-height:50px}
    form button{min-width:48px;min-height:50px}
    #results button{min-height:48px;line-height:1.5}
    .summary{padding:24px 20px 20px}
    #mosque-address{font-size:13px}
    .tabs button{min-height:54px;font-size:14px}
    .panel{padding:22px 20px}
    .muted,details p{font-size:13px}
    .prayer{min-height:62px}
    .prayer strong,.prayer time{font-size:14px}
    .prayer small,.footnote,.draft-note{font-size:11px}
    summary{font-size:14px;min-height:52px}
}
@media(max-width:350px){
    .topbar{gap:12px;padding:0 14px}
    .brand img{width:44px}
    .topbar nav{gap:14px}
    h1{font-size:21px}
    h2{font-size:22px}
    .search-card{padding:20px 16px}
    .panel-heading{align-items:flex-start}
}

/* Handoff refinements; retain the approved floating-card composition. */
h1{font-weight:800}h2{color:#404040;font-size:28px;line-height:1.25;font-weight:700}
.eyebrow{font-size:11px;letter-spacing:.1em}
.tabs button{font-size:15px;font-weight:600}
.tabs button[aria-selected=true]{color:var(--active);border-color:var(--active)}
h3{font-size:12px;line-height:1.4;font-weight:800;letter-spacing:.1em}
#mosque-address{font-size:14px;line-height:1.5}
.prayer strong,.prayer time{font-size:15px}.prayer small{font-size:11px}.prayer strong{font-weight:600}
.muted{font-size:13px}.footnote{font-size:11px}
.facility-count{float:right;margin-right:12px;font-size:12px;color:var(--muted)}
.facility-list{list-style:none;padding:0 0 12px;margin:0;display:grid;gap:10px;font-size:14px;color:#404040}
.facility-list li{display:flex;gap:12px;align-items:center}.facility-list li::before{content:'·';color:var(--purple);font-size:22px;line-height:1}
.info-label{font-size:11px;color:var(--muted)}.info-address p{font-size:14px;line-height:1.5;margin:5px 0 20px}
.hours-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.hours-heading h4{margin:0;font-size:14px}.hours-heading span{font-size:11px;color:var(--muted)}
.opening-hours{font-size:13px;line-height:1.5;margin:14px 0}.opening-hours div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line)}.opening-hours dd{margin:0;white-space:nowrap}
.verification-note{font-size:11px;line-height:1.6;color:var(--purple);background:var(--lavender);padding:10px 12px;border-radius:8px}
@media(max-width:350px){h2{font-size:25px}.opening-hours{font-size:12px}}
@media(min-width:901px){.finder{height:calc(100vh - 84px)}.sidebar{max-height:calc(100vh - 140px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d7c5e0 transparent;padding-right:6px;padding-bottom:2px}.sidebar:focus-within{scroll-behavior:auto}}
@media(min-width:1600px){.sidebar{max-height:calc(100vh - 164px)}}

[hidden]{display:none!important}
.discovery-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}
.view-switch{display:flex;padding:3px;border-radius:10px;background:#f2edf5;gap:3px}
.view-switch button{min-width:64px;min-height:38px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-weight:700;font-size:13px}
.view-switch button[aria-pressed=true]{background:white;color:var(--purple);box-shadow:0 2px 6px #30213812}
.sample-label{font-size:10px;color:var(--muted)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.filters button{border:1px solid #e3dce8;background:white;border-radius:22px;padding:8px 12px;min-height:40px;font-size:12px;color:#525252}
.filters button[aria-pressed=true]{background:var(--lavender);border-color:var(--active);color:var(--purple);font-weight:700}
.filters button[aria-pressed=true]::before{content:'✓ ';}
.result-count{font-size:11px;color:var(--muted);line-height:1.6;margin:12px 0 0}
#results.result-list{display:grid;gap:10px;padding-top:14px}
#results .result-card{display:flex;align-items:flex-start;gap:10px;margin:0;border:1px solid var(--line);background:#faf9fb;color:var(--ink);padding:14px 10px;border-radius:12px}
#results .result-card[aria-pressed=true]{border-color:var(--active);background:var(--lavender)}
.result-mark{flex:none;width:30px;height:34px;display:grid;place-items:center;border-radius:8px;background:#eee4f3;color:var(--purple);font-size:23px}
.result-card strong{font-size:14px;line-height:1.4;display:block}.result-address{display:block;font-size:11px;line-height:1.6;color:var(--muted);margin-top:4px}.result-facilities{display:block;font-size:10px;color:var(--purple);line-height:1.6;margin-top:8px}
.result-state{font-size:9px;color:var(--purple);margin-left:auto;padding-top:3px}
.pin{background:white;border-color:var(--purple)}.pin span{background:var(--purple)}
.pin[aria-pressed=true]{background:var(--purple);border-color:white;box-shadow:0 0 0 7px #8822bd26,0 4px 16px #35233a45;z-index:1}.pin[aria-pressed=true] span{background:white}

@media(max-width:900px){.view-switch button{min-height:44px}.filters button{min-height:44px}.result-state{font-size:10px}.result-card strong{font-size:15px}}

.pin-three{top:61%;left:46%}
@media(max-width:900px){.pin-one{left:18%;top:32%}.pin-two{left:48%;top:37%}.pin-three{left:78%;top:30%}.map-note{font-size:9px}}

.featured-photo-wrap{position:relative;background:#eee8e0}
#featured-photo{display:block;width:100%;height:190px;object-fit:cover;object-position:center 60%}
.photo-credit{font-size:10px;line-height:1.5;color:var(--muted);margin:0}
.mosque-photo-placeholder {
    display: none;
    width: 100%;
    height: 190px;
    padding: 8px;
    box-sizing: border-box;
    background: #100b38;
}
img:is(#featured-photo, #gallery-photo)[src="/imgs/mosques/photo-unavailable.svg"] { display: none; }
img:is(#featured-photo, #gallery-photo)[src="/imgs/mosques/photo-unavailable.svg"] + .mosque-photo-placeholder { display: block; }
.mosque-gallery .mosque-photo-placeholder { border-radius: 10px; }
.featured-photo-halo {
    opacity: .55;
    transform-box: fill-box;
    transform-origin: center;
}
@media (prefers-reduced-motion: no-preference) {
    .featured-photo-halo { animation: finder-sun-glow 3s ease-in-out infinite; }
}
@keyframes finder-sun-glow {
    0%, 100% { opacity: .55; transform: scale(.92); }
    50% { opacity: .9; transform: scale(1.12); }
}
.featured-photo-wrap .photo-credit{display:block;padding:7px 14px;background:#faf8fb}
.result-photo{width:56px;height:68px;object-fit:cover;object-position:center 60%;border-radius:8px;flex:none}
.mosque-gallery{margin:0 0 12px}.mosque-gallery img{display:block;width:100%;height:auto;border-radius:10px}.mosque-gallery figcaption{font-size:12px;line-height:1.6;margin-top:10px;color:#404040}
@media(max-width:350px){.result-photo{width:42px;height:58px}#featured-photo{height:170px}}

/* The card photos are already cropped. Do not zoom them again. */
.featured-photo-wrap{overflow:hidden}
.featured-photo-wrap .photo-credit{position:relative;background:#faf8fb}
.mosque-gallery{overflow:hidden}.mosque-gallery img{max-height:400px;object-fit:cover}

.place-address{display:flex;align-items:center;width:100%;min-height:44px;margin:10px 0 0;padding:8px 0;border:0;background:transparent;color:#404040;font-size:14px;line-height:1.5;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:copy;user-select:text}
.copy-status{display:block;font-size:13px;line-height:1.5;color:#404040}.copy-status:not(:empty){margin-top:6px}
.place-address[data-copied="true"]{color:var(--purple)}
.take-me{display:flex;align-items:center;justify-content:center;min-height:54px;margin-top:14px;padding:12px 16px;border-radius:13px;background:var(--brand-gold);color:var(--brand-navy);font-size:18px;font-weight:800;text-align:center}
.take-me:hover{background:#ebc64d}
.take-me:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.summary .status{display:inline-block;margin-top:12px}
.mosque-card{scroll-margin-top:14px}.mosque-card:focus{outline:none}.mosque-card:focus-visible{outline:3px solid #b66ed4;outline-offset:-3px}

.skip-link{position:fixed;top:8px;left:8px;z-index:20;padding:12px 18px;background:white;color:var(--purple);border:2px solid var(--purple);border-radius:8px;transform:translateY(-160%)}.skip-link:focus{transform:none}
.back-results{display:block;border:0;background:#faf8fb;color:var(--purple);padding:12px 20px;min-height:48px;width:100%;text-align:left;font-weight:700;font-size:14px;border-bottom:1px solid var(--line)}
.clear-discovery{margin-top:12px;min-height:48px;padding:10px 14px;border:1px solid var(--purple);border-radius:8px;color:var(--purple);background:var(--lavender);font-weight:700;font-size:13px}
.pin.pin-preview{box-shadow:0 0 0 9px #8822bd30,0 4px 16px #35233a45}
.result-card:hover{outline:1px solid #b66ed4;outline-offset:1px}
#results .result-card strong,#results .result-address{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

.prayer { padding-inline: 8px; }
.prayer time { white-space: nowrap; }
.prayer-icon-color { flood-color: var(--brand-gold); }
@media (hover: hover) {
    .prayer:hover {
        background: var(--brand-navy);
        color: white;
    }
    .prayer:hover small { color: #e5e7fa; }
    .prayer:hover time { color: var(--brand-gold); }
    .prayer:hover img {
        opacity: 1;
        filter: url(#finder-prayer-icon-gold) drop-shadow(0 0 5px var(--brand-gold));
    }
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .prayer:hover img { animation: prayer-icon-pulse 650ms ease-in-out; }
}

@keyframes prayer-icon-pulse {
    50% { transform: scale(1.18); }
}
#geographic-map{position:absolute;inset:0;z-index:1}
.map-actions{position:absolute;left:16px;bottom:16px;z-index:2;display:flex;gap:8px;flex-wrap:wrap}
.map-actions button{min-height:44px;padding:0 14px;background:#fff;color:#262626;border:1px solid #e5e5e5;border-radius:8px}
.map-status{position:absolute;left:16px;top:16px;z-index:2;margin:0;max-width:280px;padding:8px 12px;background:#fff;color:#262626;border-radius:8px}.map-status:empty{display:none}.map-notice{position:absolute;left:16px;right:16px;bottom:72px;z-index:2;margin:0;padding:12px 14px;background:#fff8e1;color:#040d58;border:2px solid #f2d567;border-radius:8px;font-size:16px;line-height:1.45}.map-notice a{display:inline-block;margin-top:8px;color:#4f1070;text-decoration:underline;min-height:44px}

@media (max-width: 900px) {
    .finder-with-map { padding-top: 0; }
    .finder-with-map .map {
        position: relative;
        inset: auto;
        height: auto;
        display: grid;
        grid-template-rows: minmax(144px, 60vh);
        grid-template-rows: minmax(144px, 60svh);
    }
    .finder-with-map .map > svg,
    .finder-with-map #geographic-map {
        position: relative;
        inset: auto;
        grid-area: 1 / 1;
        min-width: 0;
        min-height: 0;
    }
    .finder-with-map .map-note { top: 12px; }
    .finder-with-map .map-actions {
        position: static;
        padding: 8px 14px;
        background: #f8f6fa;
    }
    .finder-with-map .map-actions:not(:has(button:not([hidden]))) { display: none; }
    .finder-with-map .map-notice {
        position: static;
        margin: 0 14px 8px;
    }
}
