/* public/css/espace.css — l'espace du compte (Pierre 15/10/2026) : Favoris, puis la barre « Séries », puis la barre
   « Poèmes », chacune portant une image ; dessous, des fenêtres cliquables qui ouvrent le LIEN D'ORIGINE.
   Utilisé par le volet Historique du poème de la semaine (views/hebdo.html) et par l'accueil (views/index.html). */
.esp { --esp-or: #c9a84c; --esp-or-dim: #8a7535; --esp-texte: #e8e0d4; --esp-dim: #a09888; --esp-muted: #6b6054;
  display: flex; flex-direction: column; gap: 14px; hyphens: none; -webkit-hyphens: none; }
.esp__fav-t { font-family: 'Cormorant Garamond', Georgia, serif; font-size: .78rem; letter-spacing: .3em; text-transform: uppercase;
  color: var(--esp-or-dim); text-align: center; margin: 0; }
.esp__sep { position: relative; height: 62px; border-radius: 10px; overflow: hidden; display: flex; align-items: center; justify-content: center;
  border-top: 1px solid rgba(201,168,76,.55); border-bottom: 1px solid rgba(201,168,76,.55);
  background: linear-gradient(90deg, #120e0a, #1d1710 50%, #120e0a); margin-top: 6px; }
.esp__sep-i { position: absolute; inset: 0; background-size: cover; background-position: center 40%; filter: saturate(.75) brightness(.42); transform: scale(1.06); }
.esp__sep::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,9,8,.85), rgba(10,9,8,.25) 50%, rgba(10,9,8,.85)); }
.esp__sep span { position: relative; z-index: 1; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.05rem; letter-spacing: .5em;
  text-indent: .5em; text-transform: uppercase; color: var(--esp-or); text-shadow: 0 1px 8px rgba(0,0,0,.8); }
.esp__sep span::before, .esp__sep span::after { content: ''; display: inline-block; width: 26px; height: 1px; background: var(--esp-or);
  vertical-align: middle; margin: 0 14px; opacity: .7; }
.esp__grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.esp__f { position: relative; display: flex; flex-direction: column; min-width: 0; border: 1px solid rgba(201,168,76,.26); border-radius: 12px;
  overflow: hidden; background: #0f0d0a; color: inherit; text-decoration: none; transition: border-color .25s, transform .25s; }
.esp__f:hover { border-color: var(--esp-or); transform: translateY(-2px); }
.esp__lien { display: flex; flex-direction: column; color: inherit; text-decoration: none; min-width: 0; }
.esp__img { aspect-ratio: 4 / 3; background: radial-gradient(circle at 50% 40%, #2a2117, #0f0d0a 70%) center / cover no-repeat; }
.esp__img--vide { display: flex; align-items: center; justify-content: center; color: var(--esp-or-dim);
  font-family: 'Cormorant Garamond', Georgia, serif; font-size: 2rem; }
.esp__txt { padding: 9px 10px 11px; display: flex; flex-direction: column; gap: 3px; }
.esp__t { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 1.08rem; line-height: 1.2; color: var(--esp-or); overflow-wrap: anywhere; }
.esp__s { font-size: .76rem; color: var(--esp-muted); letter-spacing: .03em; }
.esp__etoile { position: absolute; top: 6px; right: 6px; z-index: 2; width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(201,168,76,.45);
  background: rgba(10,9,8,.72); color: var(--esp-or); font-size: 1.05rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.esp__etoile[aria-pressed="true"] { background: var(--esp-or); color: #14100a; }
.esp__vide { color: var(--esp-muted); font-size: .92rem; text-align: center; font-style: italic; margin: 4px 0; }
@media (max-width: 380px) { .esp__grille { grid-template-columns: 1fr 1fr; gap: 8px; } .esp__sep span { letter-spacing: .35em; } .esp__sep span::before, .esp__sep span::after { width: 14px; margin: 0 8px; } }