/* Ekran końca misji (public/js/ui/mission-result.js). Styl konsoli dowódcy (command-theme.css): grafitowa tafla,
   stalowa rama ze ściętymi rogami (--mn-frame / --mn-clip), złoto tytułów, podpisy jak w płycie fali.
   Topek 26.09: MISSION COMPLETE, zielony przycisk dalej ze ściętymi rogami i animacją, przejrzyściej.
   Kolor wyniku niesie pasek pod tytułem (--rs-accent), bez dodatkowego słowa. */
#mission-result{--rs-accent:#8fe87a;position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;overflow:auto;
 background:radial-gradient(ellipse 75% 70% at 50% 45%,#0a1517c4,#020506f2);color:var(--mn-text);font:15px/1.35 Arial,Helvetica,sans-serif;
 text-shadow:var(--mn-shadow);animation:result-fade .35s ease-out both}
#mission-result[hidden]{display:none}
#mission-result:has(.defeat){--rs-accent:#ff6a52}
.mission-result-card{position:relative;box-sizing:border-box;width:min(560px,94vw);padding:24px 34px 24px;text-align:center;
 background:var(--mn-panel);border:2px solid transparent;border-image:var(--mn-frame);clip-path:var(--mn-clip);
 animation:result-card-in .5s cubic-bezier(.2,1,.3,1) both}
.mission-result-card.victory{border-image-source:var(--mn-frame-gold)}
.mission-result-card.has-scores{width:min(940px,94vw)}

/* ---- Nagłówek: strefa, tytuł, pasek wyniku ---- */
.result-zone{margin:0 0 6px;font:700 11px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.34em;color:var(--mn-label);text-transform:uppercase}
.result-zone[hidden]{display:none}
.mission-result-card h1{margin:0;font:800 38px/1.05 Arial,Helvetica,sans-serif;letter-spacing:.1em;color:var(--mn-title);
 text-shadow:0 2px 0 #000,0 0 24px #d8a24a55}
.mission-result-card.defeat h1{color:#ff9a84;text-shadow:0 2px 0 #000,0 0 24px #ff4a3055}
.mission-result-card h1::after{content:'';display:block;width:180px;height:2px;margin:12px auto 0;
 background:linear-gradient(90deg,transparent,var(--rs-accent),transparent);box-shadow:0 0 10px var(--rs-accent);
 animation:result-rule .7s .15s ease-out both}

/* ---- Fala i czas: jedna płytka z dwoma segmentami ---- */
.result-stats{display:flex;width:max-content;margin:14px auto 0;background:#080b0ae0;border:1px solid transparent;border-image:var(--mn-frame-sm);clip-path:var(--mn-clip-sm)}
.result-stats>span{display:grid;gap:1px;padding:6px 20px 5px}
.result-stats>span+span{border-left:1px solid #5b5d55}
.result-stats small{font:700 9.5px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.26em;color:var(--mn-label)}
.result-stats b{font:800 20px/1.1 Arial,Helvetica,sans-serif;color:var(--mn-title)}
.result-stats b i{margin-left:4px;font-style:normal;font-size:12px;color:var(--mn-label)}
.result-stats b i[hidden]{display:none}

/* ---- Gwiazdki: pod każdą zdobytą modyfikator, za który jest ---- */
.result-stars{display:grid;grid-template-columns:repeat(3,minmax(110px,auto));justify-content:center;column-gap:14px;row-gap:3px;margin:14px 0 0}
.result-stars[hidden]{display:none}
.result-stars .mission-stars,.result-stars .mission-stars-rules{display:contents}
.mission-stars i{font-style:normal;font-size:30px;line-height:1;color:#484b44;text-shadow:0 2px 0 #000}
.mission-stars i.earned{color:#f4cf82;text-shadow:0 0 14px #f4cf8288,0 2px 0 #000;animation:result-star .55s cubic-bezier(.2,1.6,.4,1) both;animation-delay:calc(.3s + var(--i,0) * .15s)}
.mission-stars-rules[hidden] li{display:none}
.mission-stars-rules li{grid-row:2;list-style:none;font:700 9.5px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.14em;color:var(--mn-label);text-transform:uppercase}
.mission-stars-rules li.earned{color:#f4cf82}
/* HEROIC (0.28.5): cztery kolumny, czwarta gwiazdka czerwona. */
.result-stars.heroic{grid-template-columns:repeat(4,minmax(96px,auto))}
.mission-stars i.heroic.earned{color:#ff6a55;text-shadow:0 0 14px #ff3b2acc,0 2px 0 #000}
.mission-stars-rules li.heroic.earned{color:#ff9a88}
/* Wybór trudności następnej misji albo powtórki (0.28.5, tylko host): gwiazdki-znaki bez ramek, jak gwiazdki wyniku. */
.result-difficulty{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px 0 0}
.result-difficulty[hidden]{display:none}
.result-difficulty small{font:700 9.5px/1 Arial,Helvetica,sans-serif;letter-spacing:.2em;color:var(--mn-label)}
.result-difficulty b{min-width:96px;font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.18em;color:#f4cf82;text-align:left}
.result-difficulty b.heroic{color:#ff6a55}
.result-difficulty-stars{display:flex;gap:2px}
.result-difficulty-star{all:unset;cursor:pointer;font-size:24px;line-height:1;padding:2px 4px;color:#484b44;text-shadow:0 2px 0 #000;transition:color .15s}
.result-difficulty-star.on{color:#f4cf82;text-shadow:0 0 10px #f4cf8288,0 2px 0 #000}
.result-difficulty-star.heroic{color:#5e3a36}
.result-difficulty-star.heroic.on{color:#ff6a55;text-shadow:0 0 12px #ff3b2acc,0 2px 0 #000}
.result-difficulty-star:hover{color:#ffe7b0}
.result-difficulty-star:focus-visible{outline:1px solid #f4cf82;outline-offset:2px}

/* ---- Wyróżnienia i tabela (scoreboard.css) w ramach konsoli ---- */
.result-scores:empty{display:none}
#mission-result .score-final{margin-top:16px}
#mission-result .score-awards{margin:0 0 12px}
#mission-result .score-award{min-width:170px;padding:7px 16px 7px 10px;background:var(--mn-tile);border:1px solid transparent;border-image:var(--mn-frame-sm);
 border-image-source:var(--mn-frame-sm-gold);clip-path:var(--mn-clip-sm);text-align:left}
#mission-result .score-award em{color:var(--mn-label)}
.result-player{margin:4px 0;color:var(--mn-label)}

/* ---- Akcje: powtórz i wyjdź po lewej, dalej po prawej (bez „dalej” — na środku) ---- */
.result-actions{display:flex;align-items:center;gap:10px;margin-top:18px}
.result-actions.solo{justify-content:center}
#mission-result .result-secondary{order:1;padding:11px 20px;font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.2em;color:var(--mn-text);cursor:pointer;
 background:var(--mn-btn);border:1px solid transparent;border-image:var(--mn-frame-sm);clip-path:var(--mn-clip-sm);box-shadow:none}
#mission-result .result-secondary:hover{background:var(--mn-btn-hover);border-image-source:var(--mn-frame-sm-gold);box-shadow:none}
#mission-result .result-secondary[hidden]{display:none}
.result-go-wrap,.mission-waiting{order:2;margin-left:auto}
.result-go-wrap[hidden],.mission-waiting[hidden]{display:none}
.mission-waiting{margin-top:0;margin-bottom:0;font:700 11px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.18em;color:var(--mn-label);text-transform:uppercase}
.mission-waiting.complete{color:var(--cmd-credits);text-shadow:0 0 10px #7ee85a55,var(--mn-shadow)}

/* Zielony przycisk dalej: ścięte rogi jak ramy konsoli (12 px), krawędź = tło przycisku, wypełnienie = ::before
   wcięte o 2 px (cięcie 10,8 px, żeby skos krawędzi był równoległy), połysk = ::after. Poświata idzie na
   opakowaniu, bo clip-path ucina filtr samego przycisku. */
.result-go-wrap{animation:result-go-in .5s .45s cubic-bezier(.2,1.4,.4,1) both,result-go-glow 1.6s 1s ease-in-out infinite alternate}
/* overflow:hidden: clip-path nie zmniejsza obszaru przewijania, a przesunięty połysk dawał poziomy pasek przewijania. */
#mission-result .result-go{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:18px;min-width:300px;padding:10px 20px 11px 26px;
 border:0;border-radius:0;box-shadow:none;color:#f2ffe9;text-align:left;cursor:pointer;text-shadow:0 1px 2px #062a0a;
 background:linear-gradient(180deg,#d4ffae,#7bdc62 45%,#3f9a35);
 clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
#mission-result .result-go::before{content:'';position:absolute;inset:2px;z-index:-2;
 clip-path:polygon(10.8px 0,calc(100% - 10.8px) 0,100% 10.8px,100% calc(100% - 10.8px),calc(100% - 10.8px) 100%,10.8px 100%,0 calc(100% - 10.8px),0 10.8px);
 background:repeating-linear-gradient(110deg,#ffffff07 0 1px,transparent 1px 6px),linear-gradient(180deg,#3f9437 0%,#246a21 42%,#133f14 100%)}
#mission-result .result-go::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(105deg,transparent 38%,#eaffd455 50%,transparent 62%);transform:translateX(-110%);animation:result-go-sheen 3.4s 1.3s ease-in-out infinite}
#mission-result .result-go:hover::before{background:repeating-linear-gradient(110deg,#ffffff0a 0 1px,transparent 1px 6px),linear-gradient(180deg,#4dac44 0%,#2d7d29 42%,#18501a 100%)}
#mission-result .result-go:active{transform:translateY(1px)}
#mission-result .result-go:focus-visible{outline:none}
#mission-result .result-go:focus-visible::before{box-shadow:inset 0 0 0 2px #eaffd4}
#mission-result .result-go:disabled{cursor:default;filter:saturate(.35) brightness(.8)}
#mission-result .result-go span{flex:1}
#mission-result .result-go small{display:block;font:700 10px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.32em;color:#cdf7b8}
#mission-result .result-go b{display:block;margin-top:2px;font:800 19px/1.1 Arial,Helvetica,sans-serif;letter-spacing:.14em;text-transform:uppercase}
#mission-result .result-go .go-arrow{font-style:normal;font-size:30px;line-height:1;color:#eaffd4;animation:result-go-arrow 1.1s ease-in-out infinite}

@keyframes result-fade{from{opacity:0}}
@keyframes result-card-in{from{opacity:0;transform:translateY(14px) scale(.98)}}
@keyframes result-rule{from{transform:scaleX(0);opacity:0}}
@keyframes result-star{from{opacity:0;transform:scale(.3) rotate(-35deg)}}
@keyframes result-go-in{from{opacity:0;transform:translateY(10px)}}
@keyframes result-go-glow{from{filter:drop-shadow(0 0 5px #6dff5a38)}to{filter:drop-shadow(0 0 15px #6dff5a99)}}
@keyframes result-go-sheen{0%{transform:translateX(-110%)}45%,100%{transform:translateX(110%)}}
@keyframes result-go-arrow{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){#mission-result,#mission-result *,#mission-result *::before,#mission-result *::after{animation:none!important}}
