/* La vallée d'Arcadia — mini-jeu « Amorçage de forge » (js/forge.js) : choix de la forge,
   arène, ennemis, batteries radieuses, cœur de la forge et arme forgée.
   Le cadre vient de css/components/game.css. L'état est porté par #forge-arena :
   data-phase, data-foe (fallen ou vex), data-hold (batterie en main), data-open (cœur ouvert). */

.forge-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 18px 24px 0; }
.forge-chip { display: grid; gap: 2px; padding: 10px 14px; cursor: pointer; text-align: left; background: transparent; border: 1px solid var(--line-strong); font: inherit; color: var(--pearl); transition: border-color .2s, background .2s, opacity .2s; }
.forge-chip b { font-size: .95rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.forge-chip span { font-size: .68rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.forge-chip:not(:disabled):hover, .forge-chip:focus-visible { outline: 0; border-color: #fff; }
.forge-chip[aria-checked="true"] { border-color: var(--ember); background: rgba(255, 154, 61, .12); }
.forge-chip.lit b::after { content: ' · amorcée'; color: var(--ember-hi); font-weight: 600; }
.forge-chip:disabled { cursor: default; opacity: .55; }
.forge-intro { margin: 10px 24px 0; font-size: .86rem; line-height: 1.55; color: var(--muted); }

/* ---------- Arène ---------- */
.forge-arena { position: relative; aspect-ratio: 16 / 8; margin: 14px 24px 0; overflow: hidden; border: 1px solid var(--line); background: #0a0706; user-select: none; -webkit-user-select: none; }
.forge-arena > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.42) saturate(.85); transition: filter 1s; }
.forge-arena[data-phase="done"] > img { filter: brightness(.7) saturate(1.1); }
.forge-field { position: absolute; inset: 0; cursor: crosshair; }
.forge-arena[data-hold="true"] .forge-field { cursor: grabbing; }
/* le cœur : trois bras autour d'un foyer, qui s'embrase à mesure qu'on le charge */
.forge-core { position: absolute; left: 50%; top: 50%; z-index: 2; width: 15%; aspect-ratio: 1; padding: 0; transform: translate(-50%, -50%); cursor: default; border-radius: 50%; border: 2px solid rgba(255, 210, 160, .55);
  background: radial-gradient(circle, rgba(255, 240, 200, calc(.25 + var(--charge, 0) * .75)) 0 18%, rgba(255, 154, 61, calc(.2 + var(--charge, 0) * .7)) 34%, rgba(120, 40, 10, .7) 62%, rgba(10, 7, 6, .9) 72%);
  box-shadow: 0 0 calc(10px + var(--charge, 0) * 60px) calc(var(--charge, 0) * 14px) rgba(255, 154, 61, .7); transition: box-shadow .4s, border-color .3s, transform .3s; }
.forge-core::before, .forge-core::after { content: ''; position: absolute; inset: -14%; border-radius: 50%; border: 5px solid transparent; border-top-color: rgba(30, 20, 14, .95); border-left-color: rgba(30, 20, 14, .95); transition: transform .35s; }
.forge-core::after { transform: rotate(180deg); }
.forge-arena[data-open="false"] .forge-core { border-color: rgba(90, 70, 60, .8); filter: brightness(.55); }
.forge-arena[data-open="false"] .forge-core::before { transform: rotate(45deg) scale(.82); }
.forge-arena[data-open="false"] .forge-core::after { transform: rotate(225deg) scale(.82); }
.forge-arena[data-hold="true"] .forge-core { cursor: pointer; border-color: #fff; }
.forge-arena[data-hold="true"][data-open="true"] .forge-core { animation: core-call 1s ease-in-out infinite; }
.forge-core.fed { animation: core-fed .45s ease-out; }
@keyframes core-call { 50% { transform: translate(-50%, -50%) scale(1.06); } }
@keyframes core-fed { from { filter: brightness(2.4); } }

/* ---------- Ennemis ---------- */
.foe, .battery { position: absolute; left: var(--x); top: var(--y); padding: 0; transform: translate(-50%, -50%); cursor: crosshair; border: 0; background: none; animation: foe-in .25s ease-out; }
@keyframes foe-in { from { opacity: 0; transform: translate(-50%, -50%) scale(.4); } }
.foe { width: 40px; height: 40px; }
.foe::before { content: ''; position: absolute; inset: 6px; background: var(--body); border: 2px solid var(--edge); transition: transform .15s; }
.forge-arena[data-foe="fallen"] .foe { --body: #3b4a7a; --edge: #9fb6ff; }
.forge-arena[data-foe="fallen"] .foe::before { transform: rotate(45deg); }
.forge-arena[data-foe="vex"] .foe { --body: #8a6a3a; --edge: #f0d9a0; }
.forge-arena[data-foe="vex"] .foe::before { clip-path: polygon(50% 0, 100% 28%, 100% 72%, 50% 100%, 0 72%, 0 28%); border: 0; box-shadow: inset 0 0 0 2px var(--edge); }
.forge-arena[data-foe="vex"] .foe::after { content: ''; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; margin: -3.5px; border-radius: 50%; background: #ff3b2f; box-shadow: 0 0 8px #ff3b2f; }
.foe:hover::before, .foe:focus-visible::before { filter: brightness(1.4); }
.foe:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
/* phasés : ils brillent, ce sont eux qui portent les batteries */
.foe--elite::before, .foe--major::before { background: #bff3ff; box-shadow: 0 0 14px 3px rgba(120, 220, 255, .85); border-color: #fff; }
.forge-arena[data-foe="vex"] .foe--elite::before, .forge-arena[data-foe="vex"] .foe--major::before { box-shadow: none; filter: drop-shadow(0 0 8px rgba(120, 220, 255, .95)); }
.foe--major { width: 58px; height: 58px; }
.foe.hurt::before { background: #fff; }
/* drones de l'Arsenal et drones du Gardien : petits, triangulaires */
.foe.drone, .foe--guard { width: 34px; height: 34px; }
.forge-arena .foe.drone::before, .forge-arena .foe--guard::before { inset: 5px; transform: none; clip-path: polygon(50% 0, 100% 100%, 0 100%); border: 0; box-shadow: none; background: var(--ember); filter: drop-shadow(0 0 8px rgba(255, 154, 61, .95)); }
.forge-arena .foe.drone::after, .forge-arena .foe--guard::after { display: none; }
.forge-arena .foe--guard::before { background: #ff5a4d; filter: drop-shadow(0 0 8px rgba(255, 90, 77, .95)); }
.foe.drone { transition: left .1s linear; }
/* le Gardien de forge : sa barre de vie, et un halo tant que ses drones volent */
.foe--warden { width: 92px; height: 92px; z-index: 1; }
.foe--warden::before { inset: 12px; }
.forge-arena .foe--warden.shielded::before { box-shadow: 0 0 0 5px rgba(255, 90, 77, .55), 0 0 26px 8px rgba(255, 90, 77, .5); filter: none; }
.forge-arena[data-foe] .foe--warden::after { content: ''; display: block; position: absolute; left: 6px; right: 6px; top: -6px; bottom: auto; width: auto; height: 5px; margin: 0; border-radius: 0; background: linear-gradient(90deg, #ffd27a calc(var(--hp, 1) * 100%), rgba(255, 255, 255, .18) 0); box-shadow: none; }
.foe--warden.struck { animation: struck .2s; }
@keyframes struck { 50% { filter: brightness(2.2); } }

/* ---------- Batteries radieuses ---------- */
.battery { z-index: 1; width: 30px; height: 30px; cursor: grab; border-radius: 50%; background: radial-gradient(circle, #fff 0 22%, #ffd27a 40%, #ff9a3d 68%, rgba(255, 154, 61, 0) 72%); box-shadow: 0 0 16px 4px rgba(255, 154, 61, .8); animation: foe-in .25s ease-out, battery-pulse 1s ease-in-out infinite .25s; }
.battery.fading { opacity: .45; }
.battery:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@keyframes battery-pulse { 50% { box-shadow: 0 0 24px 8px rgba(255, 154, 61, .95); } }
.forge-arena[data-hold="true"] .battery { cursor: not-allowed; }

/* ---------- Jauge, arme forgée ---------- */
.forge-arena::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: linear-gradient(90deg, var(--ember), #fff3d0); transform-origin: 0 50%; transform: scaleX(var(--charge, 0)); transition: transform .3s; }
.forge-loot { margin: 14px 24px 0; }
.forge-loot[hidden] { display: none; }
.game-hud .hud-count.hud-time { min-width: 3.2em; color: var(--pearl); }

@media (max-width: 680px) {
  .forge-chips, .forge-intro, .forge-arena, .forge-loot { margin-inline: 16px; }
  .forge-chips { grid-template-columns: minmax(0, 1fr); }
  .forge-arena { aspect-ratio: 4 / 3.4; }
  .forge-core { width: 22%; }
}
@media (prefers-reduced-motion: reduce) {
  .foe, .battery, .forge-core, .forge-core.fed { animation: none !important; }
}
/* l'arme forgée : une fiche, pas une affiche */
.forge-loot { max-width: 560px; }