/* La Croisée: the end-of-expedition screen (run.js renderEnd). */
.end { text-align: center; position: relative; overflow: hidden; }
.end::before { content: ""; position: absolute; inset: 0 0 auto; height: 160px; pointer-events: none;
  background: radial-gradient(ellipse at 50% 0%, rgba(242, 155, 58, .28), transparent 70%); }
.end.r-lose::before { background: radial-gradient(ellipse at 50% 0%, rgba(224, 82, 91, .25), transparent 70%); }
.end.r-retreat::before { background: radial-gradient(ellipse at 50% 0%, rgba(185, 182, 175, .22), transparent 70%); }
.end-head { position: relative; animation: endIn .5s ease-out both; }
.end-head h2 { font-size: 2.1rem; margin: 2px 0 6px; color: var(--gold); text-shadow: 0 2px 0 var(--edge), 0 0 18px rgba(242, 155, 58, .45);
  animation: endTitle .7s cubic-bezier(.2, 1.6, .4, 1) both; }
.end.r-lose .end-head h2 { color: var(--bad); text-shadow: 0 2px 0 var(--edge); }
.end.r-retreat .end-head h2 { color: var(--muted); text-shadow: 0 2px 0 var(--edge); }
.end-head .story { margin: 0 4px 10px; }

.end .end-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 10px 0; }
.end .end-stats .end-stat { display: flex; flex-direction: column; align-items: center; padding: 6px 2px; border-radius: 8px;
  background: rgba(0, 0, 0, .25); border: 2px solid var(--edge); animation: endIn .4s ease-out both; }
.end-stat b { font-family: var(--pixel); font-size: 1.15rem; color: var(--ink); }
.end-stat small { font-size: .68rem; color: var(--muted); }
.end-stat.off b { color: var(--muted); }

.end-renown { margin: 10px 2px 4px; text-align: left; }
.end-renown-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-family: var(--pixel); font-size: .85rem; }
.end-renown-head b { color: var(--gold); }
.end-renown-head b::before { content: "+"; }
.end .bar { position: relative; height: 10px; border-radius: 5px; background: rgba(0, 0, 0, .45); border: 1px solid var(--edge); overflow: hidden; margin-top: 4px; }
.end .bar i { position: absolute; inset: 0 auto 0 0; display: block; border-radius: 5px; }
.end .bar.renown .was { background: rgba(242, 155, 58, .35); }
.end .bar.renown .fill { background: linear-gradient(90deg, #c9952f, var(--gold)); transition: width 1.4s cubic-bezier(.3, .8, .3, 1) .5s;
  box-shadow: 0 0 8px rgba(242, 155, 58, .6); }
.end .bar.xp { height: 6px; margin-top: 3px; }
.end .bar.xp i { background: var(--xp); }

.end h3 { margin: 14px 0 6px; font-size: .95rem; letter-spacing: .04em; }
.end-loot { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; }
.end-tile { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px 6px; border-radius: 8px;
  background: var(--panel-2); border: 2px solid var(--edge); animation: endPop .45s cubic-bezier(.2, 1.5, .4, 1) both; }
.end-tile b { font-family: var(--pixel); font-size: 1.05rem; }
.end-tile small { font-size: .66rem; color: var(--muted); line-height: 1.1; }
.end-tile .gem.big { width: 18px; height: 18px; margin: 7px 0 5px; box-shadow: 0 0 8px rgba(255, 255, 255, .25); }
.end-tile.gear { border-color: #6b4a1d; }

.end-heroes { display: grid; gap: 6px; text-align: left; }
.end-hero { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; background: rgba(0, 0, 0, .22);
  border: 2px solid var(--edge); animation: endIn .45s ease-out both; }
.end-hero.fallen { opacity: .85; border-color: #5a2430; }
.end-hero.fallen .sprite { filter: grayscale(.8) brightness(.8); }
.end-hero .grow { flex: 1; min-width: 0; }
.end-hero-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.end-hero-head b { font-family: var(--pixel); }
.end-hero-head .lvl { font-family: var(--pixel); font-size: .75rem; color: var(--muted); }
.end-tag { font-family: var(--pixel); font-size: .68rem; padding: 1px 6px; border-radius: 4px; }
.end-tag.up { background: #3a2d6b; color: #d9c8ff; animation: glow .8s infinite alternate; }
.end-tag.bad { background: #5a2430; color: #ffb0b0; }
.end-xp small { font-size: .7rem; }

.end-news { margin: 8px 0; padding: 6px 8px; border-radius: 8px; text-align: left; font-size: .88rem; background: rgba(103, 196, 119, .12); border: 1px solid rgba(103, 196, 119, .35); }
.end-relics { margin: 10px 0 4px; }
.end-relics > div { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; margin-top: 4px; }
.end-relics .chip.small { font-size: .7rem; padding: 2px 6px; color: var(--gold); }
.end .btn.big { margin-top: 14px; width: 100%; }

@keyframes endIn { from { opacity: 0; transform: translateY(8px); } }
@keyframes endPop { from { opacity: 0; transform: scale(.7); } }
@keyframes endTitle { from { opacity: 0; transform: scale(1.6); letter-spacing: .3em; } }
@media (prefers-reduced-motion: reduce) { .end * { animation: none !important; transition: none !important; } }