/* ============================================================
   AvaloonLab — page du jeu Avaloon
   Se charge APRÈS css/style.css et n'utilise que ses tokens.
   ============================================================ */

.nav a[aria-current="page"]{background:var(--surface-2);color:var(--ink)}
.av-kicker{color:var(--accent-ink);display:block;margin-bottom:12px}
.av-hero h1 em{display:block}

/* portrait d'Élio, entouré des glyphes du jeu */
.av-portrait{position:relative;margin:0;display:grid;place-items:center;aspect-ratio:4/5;max-width:380px;justify-self:center;width:100%}
.av-portrait::before{
  content:"";position:absolute;inset:6% 4%;border-radius:var(--r-l);
  background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-l);
}
.av-portrait img{position:relative;height:84%;width:auto;max-width:80%;object-fit:contain}
:root[data-theme="dark"] .av-portrait img{filter:invert(1) hue-rotate(180deg)}
.av-orbit{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}
.av-orbit path{fill:none;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.av-portrait figcaption{
  position:absolute;bottom:2%;left:50%;transform:translateX(-50%);z-index:2;white-space:nowrap;
  background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 14px;
  font-size:.82rem;color:var(--muted);box-shadow:var(--shadow-s)
}
.av-portrait figcaption strong{color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .av-orbit g>g{animation:av-float 6s ease-in-out infinite}
  .av-orbit g>g:nth-child(2n){animation-delay:-2s}
  .av-orbit g>g:nth-child(3n){animation-delay:-4s}
}
@keyframes av-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.6px)}}

/* les cités */
.av-regions{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.av-region{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:18px;
  box-shadow:var(--shadow-s);display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden;transition:.18s
}
.av-region:hover{transform:translateY(-3px);box-shadow:var(--shadow-m)}
.av-region::after{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--c)}
.av-region .num{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.av-region h3{font-size:1.06rem}
.av-region p{font-size:.88rem;color:var(--muted)}
.av-region .who{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--ink-soft);margin-top:auto}
.glyph-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 6px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:.78rem;font-weight:600}
.glyph-chip svg{width:18px;height:18px}

/* intrigue */
.av-story{display:flex;flex-direction:column;gap:14px}
.av-chapters{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:c}
.av-chapters li{
  display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:center;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:10px 14px;box-shadow:var(--shadow-s)
}
.av-chapters li::before{
  counter-increment:c;content:counter(c);display:grid;place-items:center;width:34px;height:34px;border-radius:11px;
  background:var(--grad);color:#fff;font-weight:700;font-size:.9rem
}
.av-chapters strong{display:block;font-size:.95rem}
.av-chapters span{font-size:.84rem;color:var(--muted)}
.av-spoil{margin:0}
.av-spoil p+p{padding-top:0}

/* personnages */
.av-cast{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.av-char{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:start;box-shadow:var(--shadow-s)}
.av-char .sigil{
  width:52px;height:52px;border-radius:16px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c) 16%,var(--surface-2));border:1px solid color-mix(in srgb,var(--c) 40%,var(--line))
}
.av-char .sigil svg{width:32px;height:32px}
.av-char .sigil b{font-size:1.2rem;color:var(--ink)}
.av-char h3{font-size:1rem}
.av-char .role{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink);display:block;margin:3px 0 6px}
.av-char p{font-size:.86rem;color:var(--muted)}

/* grimoire */
.av-codex-head{margin:40px 0 16px;display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline}
.av-codex-head h3{font-size:1.2rem}
.av-codex-head p{font-size:.88rem}
.av-codex{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.av-glyph{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-m);padding:14px;text-align:center;box-shadow:var(--shadow-s);transition:.18s}
.av-glyph:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:color-mix(in srgb,var(--c) 55%,var(--line))}
.av-glyph .plate{aspect-ratio:1;border-radius:12px;background:color-mix(in srgb,var(--c) 9%,var(--surface-2));display:grid;place-items:center;margin-bottom:10px}
.av-glyph svg{width:72%;height:72%;overflow:visible}
.av-glyph h4{font-size:.95rem;margin:0 0 3px}
.av-glyph p{font-size:.78rem;color:var(--muted);line-height:1.4}
.av-glyph.secret .plate{background:repeating-linear-gradient(45deg,var(--surface-2) 0 8px,color-mix(in srgb,var(--c) 10%,var(--surface-2)) 8px 16px)}
.trace-path{fill:none;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.trace-start{stroke:var(--surface);stroke-width:2.5}
@media (prefers-reduced-motion:no-preference){
  .av-glyph:hover .trace-path{animation:av-draw 1.1s ease-out}
}
@keyframes av-draw{from{stroke-dashoffset:var(--len)}to{stroke-dashoffset:0}}

.av-modes{margin-top:30px}
.av-ranks{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.av-ranks li{font-size:.8rem;font-weight:600;padding:5px 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-soft)}
.av-ranks li:last-child{background:var(--grad);color:#fff;border-color:transparent}

/* images */
.av-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.av-gallery figure{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;box-shadow:var(--shadow-s)}
.av-gallery img{width:100%;aspect-ratio:844/390;object-fit:cover;image-rendering:pixelated;background:var(--bg-2)}
.av-gallery figcaption{padding:10px 14px;font-size:.85rem;color:var(--muted)}

/* figurines */
.av-figs .av-figs-k{display:block;margin-bottom:10px;opacity:.85}
.av-note{font-size:.8rem;margin-top:10px}

@media (max-width:900px){
  .av-portrait{max-width:300px}
}

/* glyphes pâles (Lueur, Souffle, Révélation) : plus denses sur fond clair */
:root[data-theme="light"] .trace-path,
:root[data-theme="light"] .av-orbit path{filter:brightness(.8) saturate(1.6)}