:root{
  /* --accent est defini en inline dans index.html (couleur d'accent de l'evenement) */
  --bg:#f7f7f8;
  --card:#ffffff;
  --text:#1c1c1e;
  --muted:#6b6b70;
  --border:#e6e6e9;
  --radius:10px;
  --maxw:1440px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit}

/* ---- Header ---- */
.site-header{
  background:var(--card);
  border-top:3px solid var(--accent);
  border-bottom:1px solid var(--border);
}
.header-inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:18px max(16px,env(safe-area-inset-left)) 18px max(16px,env(safe-area-inset-right));
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.logo{height:38px;width:auto;display:block;flex:0 0 auto}
.titles{flex:1 1 auto;min-width:0}
.titles h1{margin:0;font-size:1.25rem;font-weight:650;letter-spacing:.2px}
.titles .meta{margin:3px 0 0;color:var(--muted);font-size:.9rem}

/* ---- Barre d'actions (bouton Tout telecharger) ---- */
.actions{
  max-width:var(--maxw);margin:0 auto;
  padding:12px 16px;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:999px;border:1px solid var(--border);
  background:var(--card);color:var(--text);text-decoration:none;
  font-size:.92rem;font-weight:550;cursor:pointer;transition:filter .15s,background .15s;
}
.btn-accent{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-accent:hover{filter:brightness(.95)}
.warn{color:var(--muted);font-size:.82rem}

/* ---- Grille ---- */
main{max-width:var(--maxw);margin:0 auto;padding:16px}
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:8px;
}
@media(min-width:700px){
  .grid{gap:10px;grid-template-columns:repeat(auto-fill,minmax(185px,1fr))}
}
.tile{position:relative;margin:0;overflow:hidden;border-radius:var(--radius);background:#ececed}
.gallery-link{display:block;aspect-ratio:1/1}
.gallery-link img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease;
}
.tile:hover .gallery-link img{transform:scale(1.045)}

/* Bouton telechargement sur chaque vignette */
.dl-btn{
  position:absolute;top:6px;right:6px;z-index:2;
  width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:rgba(20,20,22,.55);color:#fff;text-decoration:none;
  opacity:0;transition:opacity .15s,background .15s;
}
.dl-btn:hover{background:var(--accent)}
.tile:hover .dl-btn,.dl-btn:focus-visible{opacity:1}
@media(hover:none){.dl-btn{opacity:1;background:rgba(20,20,22,.5)}}

/* ---- Onglets (mini-menu) ---- */
.tabbar{
  position:sticky;top:0;z-index:20;
  background:var(--card);border-bottom:1px solid var(--border);
}
.tabs{
  max-width:var(--maxw);margin:0 auto;
  padding:4px max(16px,env(safe-area-inset-left)) 0 max(16px,env(safe-area-inset-right));
  display:flex;gap:4px;flex-wrap:wrap;
}
.tab{
  appearance:none;border:0;background:transparent;cursor:pointer;font:inherit;
  font-size:.92rem;font-weight:550;color:var(--muted);
  padding:11px 8px;margin-bottom:-1px;
  border-bottom:2px solid transparent;
  display:inline-flex;align-items:center;gap:7px;transition:color .15s;
}
.tab:hover{color:var(--text)}
.tab.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.tab .badge{
  font-size:.72rem;font-weight:600;color:var(--muted);
  background:var(--bg);border:1px solid var(--border);
  padding:1px 7px;border-radius:999px;
}
.tab.is-active .badge{color:#fff;background:var(--accent);border-color:var(--accent)}

/* ---- Sections ---- */
.section{display:none}
.section.is-active{display:block}

/* ---- Video ---- */
.video-wrap{
  max-width:1100px;margin:10px auto;position:relative;
  aspect-ratio:16/9;background:#000;border-radius:var(--radius);overflow:hidden;
}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.video-actions{max-width:1100px;margin:12px auto 0;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.video-note{max-width:1100px;margin:10px auto 0;color:var(--muted);font-size:.82rem;text-align:center}

/* ---- Footer ---- */
.site-footer{
  border-top:1px solid var(--border);
  margin-top:28px;padding:22px 16px;
  text-align:center;color:var(--muted);font-size:.82rem;
}
.site-footer a{color:var(--muted)}

/* ---- Bouton "Telecharger en HD" de la lightbox PhotoSwipe ---- */
.pswp__button--download-hd{color:#fff}