/* Prière — feuille de style */
:root{
  --bg:#f4ede1;--surface:#fffaf2;--surface2:#f8f1e5;--ink:#13232b;--muted:#5d6b6e;--line:#e3d6c2;
  --accent:#b4472c;--accent-ink:#fff;--teal:#0f5c5a;--gold:#b98720;--ring:rgba(15,92,90,.35);
  --radius:18px;--shadow:0 1px 0 rgba(19,35,43,.04),0 10px 30px -18px rgba(19,35,43,.35);
  --display:"Fraunces",ui-serif,Georgia,serif;--sans:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0b171c;--surface:#10222a;--surface2:#0e1d24;--ink:#ece4d6;--muted:#9aa9a8;--line:#1f3740;
  --accent:#e2805a;--accent-ink:#1a0d07;--teal:#6cc0b4;--gold:#e2b552;--ring:rgba(108,192,180,.4);
  --shadow:0 1px 0 rgba(0,0,0,.2),0 14px 30px -20px rgba(0,0,0,.8);color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0b171c;--surface:#10222a;--surface2:#0e1d24;--ink:#ece4d6;--muted:#9aa9a8;--line:#1f3740;--accent:#e2805a;--accent-ink:#1a0d07;--teal:#6cc0b4;--gold:#e2b552;color-scheme:dark}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--sans);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='88'%3E%3Cpath d='M44 14l8.6 20.8L74 44l-21.4 9.2L44 74l-8.6-20.8L14 44l21.4-9.2Z' fill='none' stroke='%23b98720' stroke-opacity='.09' stroke-width='1.2'/%3E%3C/svg%3E");}
a{color:var(--teal);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--accent)}
img,svg{max-width:100%}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:8px 12px;border-radius:8px;z-index:99}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:6px}
h1,h2,h3{font-family:var(--display);font-weight:650;line-height:1.12;letter-spacing:-.01em;margin:0 0 .5em}
h1{font-size:clamp(2rem,1.3rem + 3.2vw,3.6rem)}
h2{font-size:clamp(1.35rem,1.1rem + 1vw,1.85rem)}
p{margin:0 0 1em}
.small{font-size:.86rem}.muted{color:var(--muted)}
.lead{font-size:1.12rem}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* en-tête */
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:16px;height:60px}
.brand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font:650 1.3rem/1 var(--display)}
.logo-mark{width:30px;height:30px;color:var(--accent);stroke:none}
.logo-mark path:first-child{stroke:currentColor}
.mainnav{display:flex;gap:2px;margin-left:12px;overflow-x:auto;scrollbar-width:none}
.mainnav a{color:var(--ink);text-decoration:none;padding:7px 11px;border-radius:999px;font-weight:500;font-size:.95rem;white-space:nowrap}
.mainnav a:hover,.mainnav a[aria-current]{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.top-actions{margin-left:auto;display:flex;gap:6px;align-items:center}
.iconbtn{display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.iconbtn svg{width:20px;height:20px}
.install{display:flex;align-items:center;gap:6px;height:40px;padding:0 14px;border-radius:999px;border:0;background:var(--accent);color:var(--accent-ink);font:600 .92rem var(--sans);cursor:pointer}
.install svg{width:18px;height:18px}
@media (max-width:760px){.mainnav{display:none}}

/* recherche */
.searchdlg{border:0;padding:0;border-radius:20px;width:min(560px,100% - 24px);background:var(--surface);color:var(--ink);box-shadow:0 30px 80px -20px rgba(0,0,0,.5);margin-top:10vh}
.searchdlg::backdrop{background:rgba(5,15,20,.55);backdrop-filter:blur(3px)}
.sd-in{display:flex;gap:8px;padding:12px;border-bottom:1px solid var(--line)}
.sd-in input{flex:1;font:500 1.1rem var(--sans);padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.searchres{list-style:none;margin:0;padding:6px;max-height:60vh;overflow:auto}
.searchres a{display:flex;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:12px;color:var(--ink);text-decoration:none}
.searchres a:hover,.searchres a[aria-selected="true"]{background:var(--surface2)}
.searchres small{color:var(--muted)}

/* héros & scène */
.hero{position:relative;min-height:clamp(330px,44vw,500px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;isolation:isolate}
.hero-art{position:absolute;inset:0;z-index:-1}
.hero-art .scene{width:100%;height:100%;display:block}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(6,14,24,.55) 0%,rgba(6,14,24,.15) 45%,transparent 60%)}
.hero-txt{padding:18px 0 clamp(80px,12vw,150px);align-self:flex-start;padding-top:22px}
.hero h1{color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.35);max-width:15em}
.h1sub{display:block;font-size:.5em;font-weight:500;opacity:.9;margin-top:.15em}
.hero .lead{max-width:36em;text-shadow:0 1px 10px rgba(0,0,0,.4)}
.dates{display:flex;gap:8px;flex-wrap:wrap;font-weight:500;opacity:.95;text-shadow:0 1px 8px rgba(0,0,0,.4);margin:0 0 14px}
.dot{opacity:.6}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0 0 10px;font-size:.85rem}
.crumbs li+li::before{content:"›";margin-right:6px;opacity:.7}
.crumbs a{color:inherit}
.hero .crumbs{color:rgba(255,255,255,.88)}
.next{display:inline-grid;grid-template-columns:auto auto;gap:2px 16px;align-items:baseline;padding:14px 18px;border-radius:16px;background:rgba(8,18,26,.42);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}
.next-l{grid-column:1/-1;font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;opacity:.8}
.next strong{font:650 1.7rem/1.1 var(--display)}
.next-c{font:600 1.7rem/1.1 var(--sans);font-variant-numeric:tabular-nums;color:#ffd79a}
.next-clock{grid-column:1/-1;font-size:.82rem;opacity:.8}

.scene{--s1:#2b2d5a;--s2:#c4566a;--s3:#f6a15b;--far:#6b3d5c;--mid:#2d1e33;--fg:#1a1220;--sea:#5a3a5e;--wave:#f6a15b;--win:#ffcf7a;--lights:.85;--stars:.35;--moon:.4;--suny:395px;--sun:#ffb066;--glow:#ff9f5a;--pat:#ffffff;--patop:.06}
[data-sky="dawn"] .scene,.scene[data-sky="dawn"]{--s1:#16224a;--s2:#5c4c8a;--s3:#e79a83;--far:#3e3c6e;--mid:#1c1f3c;--fg:#121428;--sea:#2e3566;--wave:#e79a83;--win:#ffd08a;--lights:.7;--stars:.55;--moon:.75;--suny:470px;--sun:#ffb58a;--glow:#ff9d80}
[data-sky="sunrise"] .scene,.scene[data-sky="sunrise"]{--s1:#4d73ad;--s2:#f0b28d;--s3:#ffe0a6;--far:#9a7c95;--mid:#5b4a62;--fg:#3a2f42;--sea:#7f8fb6;--wave:#ffe8c0;--win:#ffe3a3;--lights:.2;--stars:0;--moon:.15;--suny:385px;--sun:#ffd27a;--glow:#ffc27a}
[data-sky="day"] .scene,.scene[data-sky="day"]{--s1:#2f7fc1;--s2:#7cbde6;--s3:#d8eef8;--far:#a9c6cf;--mid:#3f5f6a;--fg:#2a434c;--sea:#3a8fb0;--wave:#e8f7ff;--win:#fff2c4;--lights:0;--stars:0;--moon:0;--suny:110px;--sun:#fff3c4;--glow:#fff7d6}
[data-sky="afternoon"] .scene,.scene[data-sky="afternoon"]{--s1:#3f79b5;--s2:#dcb57a;--s3:#f6dcae;--far:#c39d76;--mid:#5c4a3e;--fg:#3b2f28;--sea:#4f86a8;--wave:#fff0cf;--win:#ffe0a0;--lights:0;--stars:0;--moon:0;--suny:230px;--sun:#ffe08a;--glow:#ffcf70}
[data-sky="sunset"] .scene,.scene[data-sky="sunset"]{--s1:#2b2d5a;--s2:#c4566a;--s3:#f6a15b;--far:#6b3d5c;--mid:#2d1e33;--fg:#1a1220;--sea:#5a3a5e;--wave:#f6a15b;--win:#ffcf7a;--lights:.85;--stars:.3;--moon:.35;--suny:395px;--sun:#ffb066;--glow:#ff9f5a}
[data-sky="night"] .scene,.scene[data-sky="night"]{--s1:#050a1a;--s2:#0f1f40;--s3:#213b66;--far:#1a2b4a;--mid:#0d1830;--fg:#081022;--sea:#13284a;--wave:#4d6fa3;--win:#ffcf7a;--lights:1;--stars:1;--moon:1;--suny:700px;--sun:#fff;--glow:#000}
.scene,.scene *{stroke:none}
.scene .s1{stop-color:var(--s1)}.scene .s2{stop-color:var(--s2)}.scene .s3{stop-color:var(--s3)}
.scene .g1{stop-color:var(--glow);stop-opacity:.55}.scene .g2{stop-color:var(--glow);stop-opacity:0}
.scene .stars{fill:#fff;stroke:none;opacity:var(--stars)}
.scene .moon{fill:#fff4d6;stroke:none;opacity:var(--moon)}
.scene .sun{transform:translateY(var(--suny))}
.scene .sundisc{fill:var(--sun);stroke:none}
.scene .far{fill:var(--far);stroke:none}
.scene .sea{fill:var(--sea);stroke:none}
.scene .waves{opacity:.45}.scene .waves path{stroke:var(--wave);fill:none}
.scene .mid{fill:var(--mid);stroke:none}
.scene .fg{fill:var(--fg);stroke:none}
.scene .lights .win{fill:var(--win);stroke:var(--win);opacity:var(--lights)}
.scene .lights .win.dim{fill:none;opacity:calc(var(--lights) * .6)}
.scene .patline{stroke:var(--pat,#fff);opacity:.09}
.scene .lbl{fill:#fff;stroke:none;opacity:.55;font:500 15px var(--sans);letter-spacing:.06em}
.scene *{transition:opacity 1.2s ease,fill 1.2s ease,stop-color 1.2s ease,transform 1.6s ease}
@media (prefers-reduced-motion:reduce){.scene *{transition:none}}

/* grille principale */
.grid-main{display:grid;gap:clamp(28px,4vw,48px);padding:clamp(20px,3vw,34px) 0 60px}
.grid-main>*{min-width:0}
.grid-main.pt{padding-top:28px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(16px,2.5vw,26px);box-shadow:var(--shadow)}
.today{margin-top:clamp(-90px,-8vw,-50px);position:relative;z-index:2}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.card-h h2{margin:0}
.sec-h{margin-bottom:14px}
.prose{max-width:46rem}
.prose h2{margin-top:1.2em}
.prose h2:first-child{margin-top:0}

/* cartes de prière */
.pcards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.pc{position:relative;display:grid;gap:4px;padding:14px 14px 16px;border-radius:14px;background:var(--surface2);border:1px solid var(--line);overflow:hidden}
.pc svg{width:24px;height:24px;color:var(--gold)}
.pn{font-weight:600;font-size:.95rem}
.pt{font:600 clamp(1.5rem,1.1rem + 1.2vw,2rem)/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.pbar{position:absolute;left:0;right:0;bottom:0;height:4px;background:transparent}
.pbar i{display:block;height:100%;width:0;background:var(--accent);transition:width .6s}
.pc.past{opacity:.55}
.pc.cur{border-color:var(--teal)}
.pc.cur .pbar i{background:var(--teal)}
.pc.nxt{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pc.nxt svg{color:#ffcf7a}
.pc[data-k="Sunrise"] .pn::after{content:" ☀";font-size:.8em;opacity:.6}
@media (max-width:900px){.pcards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:420px){.pcards{grid-template-columns:repeat(2,1fr)}}
.src{margin:12px 0 0}

.fav,.ghost{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:500 .9rem var(--sans);cursor:pointer}
.fav svg,.ghost svg{width:18px;height:18px}
.fav[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#1b1305}
.fav[aria-pressed="true"] svg{fill:currentColor}
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 20px;border-radius:999px;border:0;background:var(--accent);color:var(--accent-ink);font:600 1rem var(--sans);text-decoration:none;cursor:pointer}
.btn svg{width:20px;height:20px}
.btn:hover{color:var(--accent-ink);filter:brightness(1.06)}

.settings{margin-top:14px;border-top:1px dashed var(--line);padding-top:10px}
.settings summary{cursor:pointer;display:inline-flex;gap:8px;align-items:center;font-weight:500;color:var(--muted)}
.settings summary svg{width:18px;height:18px}
.set-in{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.set-in label{display:grid;gap:4px;font-size:.88rem;font-weight:600}
.set-in select{font:inherit;font-weight:400;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.set-in p{grid-column:1/-1;margin:0}
@media (max-width:600px){.set-in{grid-template-columns:1fr}}

/* tableaux */
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px}
.tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:.95rem;min-width:540px}
.tbl caption{text-align:left;font-size:.85rem;color:var(--muted);padding-bottom:6px}
.tbl th,.tbl td{padding:9px 10px;text-align:center;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl thead th{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;background:var(--surface2);position:sticky;top:0}
.tbl tbody th{text-align:left;font-weight:600}
.tbl tr.today{background:color-mix(in srgb,var(--gold) 18%,transparent)}
.tbl tr.today th{color:var(--accent)}
.tbl tr.reg th{background:var(--surface2);text-align:left;font-family:var(--display);font-size:1rem;padding-top:14px}
.tbl.compact td,.tbl.compact th{padding:7px 8px}
.tbl tbody tr:hover{background:var(--surface2)}

/* qibla */
.qibla{display:grid;grid-template-columns:220px 1fr;gap:26px;align-items:center}
.compass{width:100%;max-width:220px;display:block;margin:auto}
.c-ring{fill:var(--surface2);stroke:var(--line);stroke-width:2}
.c-in{fill:none;stroke:var(--line);stroke-dasharray:3 5}
.c-tick{stroke:var(--muted)}
.c-n,.c-l{font:700 14px var(--sans);text-anchor:middle;fill:var(--muted);stroke:none}
.c-n{fill:var(--accent)}
.needle{transition:transform .4s}
.n-a{fill:var(--teal);stroke:none}.n-b{fill:var(--line);stroke:none}
.kaaba{fill:var(--ink);stroke:var(--gold);stroke-width:2}
.c-hub{fill:var(--ink);stroke:none}
@media (max-width:640px){.qibla{grid-template-columns:1fr}}

/* FAQ */
.faq{border-bottom:1px solid var(--line);padding:4px 0}
.faq summary{cursor:pointer;font-weight:600;padding:10px 28px 10px 0;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:6px;font-size:1.4rem;color:var(--accent);transition:transform .2s}
.faq[open] summary::after{transform:rotate(45deg)}
.faq p{color:var(--muted);margin:0 0 12px}

/* listes de liens */
.near,.citycards,.countrycards,.prayercards,.chips{list-style:none;padding:0;margin:0}
.near{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.near a,.citycards a,.countrycards a,.prayercards a{display:grid;gap:2px;padding:14px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:var(--ink);text-decoration:none;transition:transform .15s,border-color .15s}
.near a:hover,.citycards a:hover,.countrycards a:hover,.prayercards a:hover{transform:translateY(-2px);border-color:var(--teal)}
.near span{font-weight:600}
.near small,.citycards small,.countrycards small,.prayercards small{color:var(--muted);font-size:.84rem}
.citycards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.citycards strong{font-family:var(--display);font-size:1.15rem;font-weight:600}
.mini{font-size:.82rem;font-weight:600;color:var(--teal);font-variant-numeric:tabular-nums}
.countrycards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.countrycards a{position:relative;padding-top:20px;overflow:hidden}
.flagbar{position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--c1) 0 50%,var(--c2) 50%)}
.countrycards strong{font-family:var(--display);font-size:1.25rem;font-weight:600}
.morec{background:var(--ink)!important;color:var(--bg)!important}
.morec small{color:inherit!important;opacity:.7}
.prayercards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.prayercards .ar{font-size:1.6rem;color:var(--gold);line-height:1.2;font-family:"Amiri","Noto Naskh Arabic",serif}
.prayercards strong{font-family:var(--display);font-size:1.2rem}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-block;padding:7px 13px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:.92rem}
.chips a:hover{border-color:var(--teal);color:var(--teal)}
.chips a.all{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* accueil */
.hero-home{min-height:clamp(420px,52vw,600px)}
.homesearch{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.bigsearch{display:flex;align-items:center;gap:10px;min-width:min(380px,100%);padding:14px 18px;border-radius:999px;border:0;background:rgba(255,255,255,.95);color:#13232b;font:500 1.05rem var(--sans);cursor:pointer;box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}
.bigsearch svg{width:20px;height:20px}
.fav-card{border-color:var(--gold)}
.fav-card h2{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.fav-card .pcards{margin-top:10px}

/* autour de moi */
.near-card{display:grid;gap:12px;justify-items:start}
#nearOut{width:100%}

/* pied de page */
.foot{border-top:1px solid var(--line);background:var(--surface2);padding:40px 0 20px;margin-top:20px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1.6fr 1fr;gap:28px}
.fh{font:600 .8rem var(--sans);text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:10px}
.fl{list-style:none;padding:0;margin:0;display:grid;gap:4px;font-size:.9rem}
.fl a{color:var(--ink);text-decoration:none}.fl a:hover{color:var(--accent)}
.cols2{grid-template-columns:1fr 1fr;column-gap:14px}
.copy{margin-top:26px}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}

/* impression */
@media print{
  .top,.foot,.hero-art,.next,.settings,.fav,.ghost,.near,.chips,.faq,.qibla,.sec-h,#h-near,#h-same{display:none!important}
  body{background:#fff;color:#000}.hero{min-height:0;color:#000}.hero h1{color:#000;text-shadow:none}.hero::before{display:none}
  .card{box-shadow:none;border:0}.today{margin:0}.tbl{min-width:0;font-size:11px}
  section.prose,section[aria-labelledby="h-season"]{display:none}
}
