/* Desktop 结算. Every selector must start with .pg-result (optionally preceded by body.desktop-game / an element or id).
   The board is 1600×1000 "board px" scaled as one piece (--pg-result-s) into the content area right of the pillar, below the top bar. */

/* ---- dialog: non-modal, covers the content area only ---- */
body.desktop-game dialog#end-dialog.pg-result{position:fixed;inset:var(--pg-result-t,58px) 0 0 var(--pg-result-l,74px);z-index:29;box-sizing:border-box;width:auto;height:auto;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;color:var(--uk-text);text-align:center}
body.desktop-game #end-dialog.pg-result>[data-ui-skin]{position:absolute;inset:0}
body.desktop-game .pg-result-root{position:absolute;inset:0;overflow:hidden;outline:none;--dy:0px;font-family:var(--uk-sans)}
body.desktop-game .pg-result-root.is-short{--dy:110px}
body.desktop-game .pg-result-scrim{position:absolute;inset:0;background:radial-gradient(ellipse 72% 62% at 50% 30%,#46300c66,#06080cd9 72%),linear-gradient(#05070a66,#05070aa6);-webkit-backdrop-filter:blur(6px) brightness(.7) saturate(.9);backdrop-filter:blur(6px) brightness(.7) saturate(.9);animation:pg-result-fade .45s ease-out both}
body.desktop-game .pg-result-root.is-lost .pg-result-scrim{background:radial-gradient(ellipse 70% 60% at 50% 34%,#1e283a6b,#04070cdb 72%);-webkit-backdrop-filter:blur(6px) grayscale(.7) brightness(.62);backdrop-filter:blur(6px) grayscale(.7) brightness(.62)}
body.desktop-game .pg-result-board{--pg-u:10px;position:absolute;left:50%;top:50%;width:1600px;height:1000px;margin:-500px 0 0 -800px;transform:scale(var(--pg-result-s,1));transform-origin:50% 50%}
body.desktop-game .pg-result-root.is-short .pg-result-board{height:890px;margin-top:-445px}
body.desktop-game .pg-result-board>*{position:absolute}

/* ---- the guardian's own form (boss stages) ---- */
body.desktop-game .pg-result-boss{width:var(--b,400px);height:var(--b,400px);pointer-events:none;-webkit-mask-image:radial-gradient(closest-side,#000 34%,#0009 62%,#0003 82%,transparent 100%);mask-image:radial-gradient(closest-side,#000 34%,#0009 62%,#0003 82%,transparent 100%)}
body.desktop-game .pg-result-boss.is-felled{left:calc(1330px - var(--b,400px) / 2);top:calc(300px - var(--b,400px) / 2 - var(--dy) / 2)}
body.desktop-game .pg-result-boss.is-looming{left:calc(1330px - var(--b,400px) / 2);top:calc(330px - var(--b,400px) / 2 - var(--dy) / 2)}
body.desktop-game .pg-result-boss.is-distant{left:calc(1320px - var(--b,400px) / 2);top:calc(260px - var(--b,400px) / 2 - var(--dy) / 2)}
body.desktop-game .pg-result-boss-in{position:absolute;inset:0;display:block}
body.desktop-game .pg-result-boss-img{display:block;width:100%;height:100%;object-fit:cover}
body.desktop-game .pg-result-boss.is-felled .pg-result-boss-in{opacity:.42;transform:translateY(-18px) scale(1.05);animation:pg-result-felled 2.8s cubic-bezier(.3,.6,.3,1) .1s both}
body.desktop-game .pg-result-boss.is-felled .pg-result-boss-img{filter:sepia(1) saturate(1.7) hue-rotate(-6deg) brightness(1.15) contrast(1.05)}
body.desktop-game .pg-result-boss.is-looming .pg-result-boss-in{opacity:.8;animation:pg-result-loom 1.3s ease-out .15s both}
body.desktop-game .pg-result-boss.is-looming .pg-result-boss-img{filter:grayscale(.3) brightness(.72) contrast(1.15);animation:pg-result-breathe-big 6.5s ease-in-out 1.4s infinite alternate}
body.desktop-game .pg-result-boss.is-distant .pg-result-boss-in{opacity:.5;animation:pg-result-distant 1.3s ease-out .15s both}
body.desktop-game .pg-result-boss.is-distant .pg-result-boss-img{filter:grayscale(.6) brightness(.58) contrast(1.1) blur(1px)}

/* ---- motes: gold sparks rise (victory), ash falls (defeat) ---- */
body.desktop-game .pg-result-motes{inset:0;pointer-events:none}
body.desktop-game .pg-result-motes i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;opacity:0;animation:pg-result-spark var(--t) linear var(--d) infinite}
body.desktop-game .pg-result-root.is-won .pg-result-motes i{left:calc(22% + var(--x) * .56);top:560px;background:radial-gradient(circle,#fff3c4,#f0b43c 45%,transparent 70%);box-shadow:0 0 6px #f0b43c}
body.desktop-game .pg-result-root.has-felled .pg-result-motes i:nth-child(odd){left:calc(70% + var(--x) * .22);top:520px}
body.desktop-game .pg-result-root.is-lost .pg-result-motes i{left:var(--x);top:-30px;background:#9aa3ab;opacity:0;animation-name:pg-result-ash;filter:blur(.5px)}

/* ---- seal ---- */
body.desktop-game .pg-result-rays{left:420px;top:-241px;width:760px;height:760px;pointer-events:none;animation:pg-result-fade .7s ease-out .9s both}
body.desktop-game .pg-result-rays i{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffd98a40 0deg 4deg,transparent 4deg 15deg);-webkit-mask-image:radial-gradient(closest-side,#000 18%,transparent 100%);mask-image:radial-gradient(closest-side,#000 18%,transparent 100%);animation:pg-result-spin 40s linear infinite}
body.desktop-game .pg-result-rays::before{content:"";position:absolute;inset:22%;border-radius:50%;background:radial-gradient(closest-side,#ffe7a6aa,#f0b43c44 45%,transparent 75%)}
body.desktop-game .pg-result-root.is-short .pg-result-rays{transform:translateY(-55px) scale(.62)}
body.desktop-game .pg-result-seal{left:675px;top:14px;width:250px;height:250px;animation:pg-result-drop .5s cubic-bezier(.2,.8,.2,1) .2s both}
body.desktop-game .pg-result-root.is-short .pg-result-seal.is-broken{left:730px;top:8px;width:140px;height:140px}
body.desktop-game .pg-result-half,body.desktop-game .pg-result-shard{position:absolute;inset:0;background:url("./assets/pages/result/seal.webp") center/100% 100% no-repeat;filter:drop-shadow(0 8px 14px #000b)}
body.desktop-game .pg-result-half.is-l{clip-path:polygon(0 0,58% 0,52% 22%,60% 38%,47% 55%,55% 70%,44% 100%,0 100%);transform:translate(-9%,2%) rotate(-4deg);animation:pg-result-split-l .55s cubic-bezier(.2,.8,.2,1) .9s both}
body.desktop-game .pg-result-half.is-r{clip-path:polygon(58% 0,100% 0,100% 100%,44% 100%,55% 70%,47% 55%,60% 38%,52% 22%);transform:translate(9%,-1%) rotate(3.5deg);animation:pg-result-split-r .55s cubic-bezier(.2,.8,.2,1) .9s both}
body.desktop-game .pg-result-shard{opacity:0;animation:pg-result-shard .9s cubic-bezier(.1,.7,.3,1) .9s both}
body.desktop-game .pg-result-shard.s1{clip-path:polygon(54% 8%,62% 6%,58% 20%);--dx:40px;--dy:-70px;--rot:120deg}
body.desktop-game .pg-result-shard.s2{clip-path:polygon(50% 24%,58% 30%,53% 36%);--dx:-60px;--dy:-40px;--rot:-150deg}
body.desktop-game .pg-result-shard.s3{clip-path:polygon(56% 40%,62% 46%,52% 52%);--dx:80px;--dy:10px;--rot:200deg}
body.desktop-game .pg-result-shard.s4{clip-path:polygon(46% 58%,53% 62%,49% 70%);--dx:-90px;--dy:30px;--rot:-90deg}
body.desktop-game .pg-result-shard.s5{clip-path:polygon(52% 74%,57% 82%,47% 88%);--dx:60px;--dy:70px;--rot:160deg}
body.desktop-game .pg-result-seal-light{position:absolute;left:30%;top:-6%;width:40%;height:112%;border-radius:50%;background:radial-gradient(closest-side,#fff6d6,#ffd36ecc 35%,#f0b43c55 60%,transparent 100%);transform:rotate(14deg);animation:pg-result-fade .5s ease-out .9s both}
body.desktop-game .pg-result-crack{position:absolute;inset:0;transform-origin:50% 0;opacity:0;animation:pg-result-crack .8s ease-out .6s both}
body.desktop-game .pg-result-crack svg{width:100%;height:100%;overflow:visible}
body.desktop-game .pg-result-crack polyline{fill:none;stroke:#fff1c2;stroke-width:1.6;stroke-linejoin:round;filter:drop-shadow(0 0 2px #ffd36e) drop-shadow(0 0 5px #f0b43c)}
body.desktop-game .pg-result-core{position:absolute;left:31.5%;top:31.5%;width:37%;height:37%;transform:scale(1.08);filter:drop-shadow(0 0 12px #ffd36e) drop-shadow(0 0 26px #f0b43c99);animation:pg-result-core .6s ease-out .9s both}
body.desktop-game .pg-result-orb{display:block;width:100%;height:100%;object-fit:contain}
body.desktop-game .pg-result-seal.is-chained{left:575px;top:0;width:450px;height:251px;transform-origin:50% 0;animation:pg-result-swing .8s cubic-bezier(.3,.7,.3,1) .1s both}
body.desktop-game .pg-result-root.is-short .pg-result-seal.is-chained{left:675px;top:0;width:250px;height:140px}
body.desktop-game .pg-result-chained{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 18px #000c);-webkit-mask-image:linear-gradient(#000 52%,transparent 96%),radial-gradient(circle at 50% 50%,#000 30%,transparent 31%);-webkit-mask-composite:source-over;mask-image:linear-gradient(#000 52%,transparent 96%),radial-gradient(circle at 50% 50%,#000 30%,transparent 31%);mask-composite:add}

/* ---- banner (Elden-Ring-like band + echo) ---- */
body.desktop-game .pg-result-band{left:-500px;right:-500px;top:calc(287px - var(--dy));height:130px;pointer-events:none;background:linear-gradient(90deg,transparent,#000a 22%,#000b 50%,#000a 78%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);animation:pg-result-fade .5s ease-out 1s both}
body.desktop-game .pg-result-band::after{content:"";position:absolute;left:25%;right:25%;top:50%;height:2px;margin-top:-1px;background:linear-gradient(90deg,transparent,#f1d89699,transparent);box-shadow:0 0 18px 6px #f0b43c33}
body.desktop-game .pg-result-root.is-lost .pg-result-band{animation-delay:.45s}
body.desktop-game .pg-result-root.is-lost .pg-result-band::after{background:linear-gradient(90deg,transparent,#a8353099,transparent);box-shadow:0 0 18px 6px #6a1a1633}
body.desktop-game .pg-result-banner{left:510px;top:calc(268px - var(--dy));width:580px;height:168px;margin:0;animation:pg-result-banner-in .42s cubic-bezier(.2,.8,.2,1) 1s both}
body.desktop-game .pg-result-banner::before{content:"";position:absolute;inset:0;background:url("./assets/pages/result/banner.webp") center/100% 100% no-repeat;filter:drop-shadow(0 10px 16px #000c)}
body.desktop-game .pg-result-root.is-lost .pg-result-banner{animation-delay:.45s}
body.desktop-game .pg-result-root.is-lost .pg-result-banner::before{filter:sepia(.55) saturate(.45) brightness(.66) hue-rotate(-12deg) drop-shadow(0 10px 16px #000c)}
body.desktop-game .pg-result-banner-text,body.desktop-game .pg-result-banner-echo{position:absolute;left:0;right:0;top:45px;height:84px;display:flex;align-items:center;justify-content:center;font:700 72px/1 var(--uk-serif);letter-spacing:.16em;text-indent:.16em;white-space:nowrap}
body.desktop-game .pg-result-banner-text{background:linear-gradient(180deg,#fff2c6,var(--uk-title-a) 35%,var(--uk-title-b) 80%,#a07a35);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 #1b0f04) drop-shadow(0 3px 4px #000d);animation:pg-result-grow 2.6s cubic-bezier(.2,.7,.2,1) 1s both}
body.desktop-game .pg-result-root.is-lost .pg-result-banner-text{background:linear-gradient(180deg,#efe6d2,#c8bba0 45%,#8d8070);-webkit-background-clip:text;background-clip:text;animation-delay:.45s}
body.desktop-game .pg-result-banner-echo{color:#ffe3a0;opacity:0;text-shadow:0 0 18px #f0b43c,0 0 40px #f0b43c88;animation:pg-result-echo 1.9s ease-out 1.1s both}
body.desktop-game .pg-result-root.is-lost .pg-result-banner-echo{color:#d8b0a0;text-shadow:0 0 18px #8d2a22,0 0 36px #5a141088;animation-delay:.55s}
body.desktop-game .pg-result-banner-shine{position:absolute;left:15%;right:15%;top:30%;bottom:24%;overflow:hidden;pointer-events:none}
body.desktop-game .pg-result-banner-shine::before{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(105deg,transparent,#fff7da66 50%,transparent);transform:translateX(-120%);animation:pg-result-shine .9s ease-in-out 1.35s both}
body.desktop-game .pg-result-root.is-lost .pg-result-banner-shine{display:none}
body.desktop-game .pg-result-motto{left:0;right:0;top:calc(438px - var(--dy));height:42px;margin:0;font:700 32px/42px var(--uk-serif);letter-spacing:.1em;color:#f3e6c4;text-shadow:0 2px 6px #000,0 0 18px #0009;animation:pg-result-fade .45s ease-out 1.15s both}
body.desktop-game .pg-result-root.is-lost .pg-result-motto{color:#d9d4c8;animation-delay:.65s}
body.desktop-game .pg-result-plaques{left:0;right:0;top:calc(482px - var(--dy));height:46px;display:flex;align-items:center;justify-content:center;gap:18px;animation:pg-result-rise .4s ease-out 1.25s both}
body.desktop-game .pg-result-root.is-lost .pg-result-plaques{animation-delay:.7s}
body.desktop-game .pg-result-plaque{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:46px;padding:0 20px;border-style:solid;border-color:transparent;border-width:calc(46px * 120 / 635) calc(46px * 620 / 635);border-image:url("./assets/desktop/nav/plaque.webp") 120 620 fill / calc(46px * 120 / 635) calc(46px * 620 / 635) stretch;font:700 24px/1 var(--uk-serif);letter-spacing:.08em;color:#f3dfae;text-shadow:0 1px 2px #000;white-space:nowrap}
body.desktop-game .pg-result-unlock{display:inline-flex;animation:pg-result-stamp .35s cubic-bezier(.3,1.4,.5,1) 2.2s both}
/* Generic three-slice ribbon (ui-kit) sizes itself from the font; the board's --pg-u scales it with the window. */
body.desktop-game .pg-result-unlock .uk-ribbon{font-size:calc(var(--pg-u)*1.7);letter-spacing:.06em;--rb-h:calc(var(--pg-u)*5)}
/* uifix4: at 2.5em the blue band between the two gold lines was exactly one glyph tall, so at 1366 (board ×0.71) the strokes
   touched both lines. Same ribbon height as before (50 board px, nothing else moves), text 17 board px (12 px on screen at 1366)
   → about a pixel of blue above and below the glyphs at every window size. */

/* ---- middle row ---- */
body.desktop-game .pg-result-middle{left:0;top:calc(540px - var(--dy));width:1600px;height:236px}
body.desktop-game .pg-result-middle>section{position:absolute;top:0;width:640px;height:236px;box-sizing:border-box}
body.desktop-game .pg-result-stars,body.desktop-game .pg-result-progress{left:140px}
body.desktop-game .pg-result-rewards,body.desktop-game .pg-result-tips{left:820px}
body.desktop-game .pg-result-stars,body.desktop-game .pg-result-rewards,body.desktop-game .pg-result-progress,body.desktop-game .pg-result-tips{animation:pg-result-rise .45s ease-out 1.2s both}
body.desktop-game .pg-result-rewards{animation-delay:1.45s}
body.desktop-game .pg-result-progress{animation-delay:.75s}
body.desktop-game .pg-result-tips{animation-delay:.9s}

/* stars on the altar */
body.desktop-game .pg-result-arch{position:absolute;left:105px;top:0;width:430px;height:150px;background:url("./assets/pages/result/altar.webp") top center/430px auto no-repeat;filter:drop-shadow(0 8px 12px #000b)}
body.desktop-game .pg-result-base.uk-panel{position:absolute;left:0;top:134px;width:640px;height:102px;padding:0;--uk-pb:24px}
body.desktop-game .pg-result-star{position:absolute;display:block;width:104px;height:104px;top:48px}
body.desktop-game .pg-result-star.s1{left:55px}
body.desktop-game .pg-result-star.s2{left:260px;top:20px;width:120px;height:120px}
body.desktop-game .pg-result-star.s3{left:481px}
body.desktop-game .pg-result-star-img{display:block;width:100%;height:100%;object-fit:contain}
body.desktop-game .pg-result-star.is-on .pg-result-star-img{filter:drop-shadow(0 0 10px #f0b43caa) drop-shadow(0 4px 6px #000a)}
body.desktop-game .pg-result-star.s1 .pg-result-star-img{animation:pg-result-stamp .34s cubic-bezier(.3,1.4,.5,1) 1.3s both}
body.desktop-game .pg-result-star.s2 .pg-result-star-img{animation:pg-result-stamp .34s cubic-bezier(.3,1.4,.5,1) 1.48s both}
body.desktop-game .pg-result-star.s3 .pg-result-star-img{animation:pg-result-stamp .34s cubic-bezier(.3,1.4,.5,1) 1.66s both}
body.desktop-game .pg-result-star-img.is-socket{animation:none!important;clip-path:polygon(50% 4%,62% 37%,97% 38%,69% 59%,79% 94%,50% 73%,21% 94%,31% 59%,3% 38%,38% 37%);filter:drop-shadow(0 2px 3px #000c) brightness(.9)}
body.desktop-game .pg-result-rule{position:absolute;top:156px;width:200px;height:58px;display:flex;align-items:center;justify-content:center;font:700 24px/1.15 var(--uk-serif);letter-spacing:.04em;color:#f1d896;text-shadow:0 1px 2px #000,0 0 8px #000a;white-space:nowrap}
body.desktop-game .pg-result-rule.r1{left:7px}
body.desktop-game .pg-result-rule.r2{left:220px}
body.desktop-game .pg-result-rule.r3{left:433px;font-size:22px}
body.desktop-game .pg-result-rule.is-off{color:#b9b3a6;animation:pg-result-breathe 2.4s ease-in-out 1.8s infinite}

/* rewards tray: the scroll's dark inner band runs 124–199px; the big number (129–171) and the bonus line sit inside it. */
body.desktop-game .pg-result-tray{position:absolute;left:0;top:92px;width:640px;height:144px;box-sizing:border-box;border-style:solid;border-color:transparent;border-width:32px 78px 37px;border-image:url("./assets/pages/result/tray.webp") 95 230 110 fill / 32px 78px 37px stretch;filter:drop-shadow(0 10px 14px #000b)}
body.desktop-game .pg-result-reward-row{position:absolute;inset:0;display:flex;justify-content:center;gap:22px}
body.desktop-game .pg-result-rewards.has-hero .pg-result-reward-row{gap:14px}
body.desktop-game .pg-result-rewards.has-hero .pg-result-reward{width:150px}
body.desktop-game .pg-result-rewards.has-hero .pg-result-reward.is-hero{width:200px}
body.desktop-game .pg-result-reward{position:relative;width:176px;height:236px;animation:pg-result-rise .4s ease-out calc(1.7s + var(--i,0) * 80ms) both}
body.desktop-game .pg-result-reward.is-hero{width:210px}
/* uifix4: the hero card's rarity badge sits inside the card (bottom-left of the art, on a dark tab) and is never below 14 px on
   screen at 1080p / 12 px at 1366 (the board is scaled by --pg-result-s, so the board-px size is divided by it). */
body.desktop-game .pg-result-reward.is-hero .uk-card-foot{left:10%;right:auto;bottom:12.5%;height:auto}
body.desktop-game .pg-result-reward.is-hero .uk-card-foot :is(.uk-stars-n,.uk-stars,.uk-card-lv){font-size:max(14px,calc(12.5px / var(--pg-result-s,1)));line-height:1}
body.desktop-game .pg-result-reward.is-hero .uk-card-foot :is(.uk-stars-n,.uk-stars){padding:.2em .42em .16em;border-radius:3px;background:#0b0f16d9;box-shadow:0 0 0 1px #c9a45c73}
body.desktop-game .pg-result-reward .uk-icon{--uk-is:86px;position:absolute;left:calc(50% - 43px);top:2px;filter:drop-shadow(0 0 14px #9fc8ff66) drop-shadow(0 6px 8px #000b)}
body.desktop-game .pg-result-reward.is-xp .uk-icon{filter:drop-shadow(0 0 14px #f0b43c77) drop-shadow(0 6px 8px #000b)}
body.desktop-game .pg-result-value{position:absolute;left:0;right:0;top:129px;font:700 42px/1 var(--uk-serif);font-variant-numeric:tabular-nums lining-nums;color:#fff4d6;text-shadow:0 2px 4px #000,0 0 12px #f0b43c66}
body.desktop-game .pg-result-bonus{position:absolute;left:0;right:0;top:174px;font:700 18px/1 var(--uk-serif);font-style:normal;color:#ffcf73;text-shadow:0 1px 2px #000}
body.desktop-game .pg-result-chip{position:absolute;left:50%;top:194px;transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:34px;padding:0 14px;border-style:solid;border-color:transparent;border-width:calc(34px * 120 / 635) calc(34px * 620 / 635);border-image:url("./assets/desktop/nav/plaque.webp") 120 620 fill / calc(34px * 120 / 635) calc(34px * 620 / 635) stretch;font:700 20px/1 var(--uk-serif);letter-spacing:.06em;color:#f3dfae;text-shadow:0 1px 2px #000;white-space:nowrap}
body.desktop-game .pg-result-chip.is-new{color:#ffe6a6}
body.desktop-game .pg-result-chip.is-dup{color:#e1c9ff}
body.desktop-game .pg-result-wax{position:absolute;left:calc(50% + 24px);top:0;width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:url("./assets/pages/_kit/icon-wax.webp") center/contain no-repeat;font:700 19px/1 var(--uk-serif);font-style:normal;color:#ffe9d6;text-shadow:0 1px 2px #4a0d08;filter:drop-shadow(0 3px 4px #000a);transform:rotate(-10deg);animation:pg-result-wax .3s cubic-bezier(.3,1.5,.5,1) 1.95s both}
body.desktop-game .pg-result-flip{position:absolute;left:calc(50% - 60px);top:0;width:120px;height:157px}
body.desktop-game .pg-result-flip .uk-card{--uk-cw:120px}
body.desktop-game .pg-result-card-back,body.desktop-game .pg-result-card-front{position:absolute;inset:0;display:block}
body.desktop-game .pg-result-card-back{border-radius:8px;background:radial-gradient(circle at 50% 45%,#2c3646,#0b1018 75%);box-shadow:inset 0 0 0 3px #8a6a32,inset 0 0 0 5px #2a2f37,0 6px 10px #000a;opacity:0;transform:scaleX(0);animation:pg-result-flip-out .2s ease-in 2.12s backwards}
body.desktop-game .pg-result-card-back i{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;background:url("./assets/pages/_kit/icon-wax.webp") center/contain no-repeat}
body.desktop-game .pg-result-card-front{animation:pg-result-flip-in .24s ease-out 2.32s both}
body.desktop-game .pg-result-card-front .uk-card{filter:drop-shadow(0 0 16px #f0b43c66)}

/* defeat: progress slab + tips */
body.desktop-game .pg-result-progress.uk-panel,body.desktop-game .pg-result-tips.uk-panel{--uk-pb:30px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;filter:drop-shadow(0 10px 18px #0009) saturate(.8)}
body.desktop-game .pg-result-layers{display:flex;gap:10px;height:58px}
body.desktop-game .pg-result-layer{display:block;width:42px;height:58px;object-fit:contain}
body.desktop-game .pg-result-layer.is-on{filter:drop-shadow(0 0 8px #f0b43c99);animation:pg-result-gem .3s ease-out calc(.85s + var(--i,0) * 110ms) both}
body.desktop-game .pg-result-layer.is-off{opacity:.8;animation:pg-result-fade .3s ease-out .85s both}
body.desktop-game .pg-result-reached{margin:0;font:700 30px/40px var(--uk-serif);color:#e6dccb;letter-spacing:.06em;text-shadow:0 1px 2px #000}
body.desktop-game .pg-result-reached b{font-size:42px;color:#ffd98a;font-variant-numeric:tabular-nums}
body.desktop-game .pg-result-guardian{position:relative;display:flex;align-items:center;gap:12px;height:70px}
body.desktop-game .pg-result-face{position:absolute;left:5px;top:5px;width:60px;height:60px;border-radius:50%;background:center 30%/cover no-repeat;filter:saturate(.8) brightness(.9)}
body.desktop-game .pg-result-ring{position:relative;display:block;width:70px;height:70px;object-fit:contain;filter:drop-shadow(0 2px 4px #000c)}
body.desktop-game .pg-result-guardian:not(:has(.pg-result-face)) .pg-result-ring{display:none}
body.desktop-game .pg-result-bar{position:relative;display:block;width:420px;height:36px;border-radius:18px;overflow:hidden;background:linear-gradient(#0b0f14,#1b1f26);box-shadow:inset 0 0 0 2px #8a6a32,inset 0 2px 6px #000c}
body.desktop-game .pg-result-bar-fill{position:absolute;inset:3px;border-radius:15px;background:linear-gradient(90deg,#5a120c,#b33a22 70%,#e2552f);transform-origin:0 50%;transform:scaleX(var(--r,1));animation:pg-result-bar .8s cubic-bezier(.3,.6,.3,1) .95s both}
body.desktop-game .pg-result-bar-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 20px/1 var(--uk-serif);color:#fff1de;text-shadow:0 1px 2px #000,0 0 6px #000;white-space:nowrap}
body.desktop-game .pg-result-far{margin:0;font:700 22px/30px var(--uk-serif);color:#b9b3a6;letter-spacing:.06em}
body.desktop-game .pg-result-tips-head{position:relative;width:580px;height:30px}
body.desktop-game .pg-result-tips-title,body.desktop-game .pg-result-tip-line{position:absolute;inset:0;margin:0;font:700 22px/30px var(--uk-serif);letter-spacing:.06em;text-shadow:0 1px 2px #000;white-space:nowrap;transition:opacity .16s}
body.desktop-game .pg-result-tips-title{color:#cfc6b4}
body.desktop-game .pg-result-tip-line{color:#ffe3a0;opacity:0}
body.desktop-game .pg-result-tips:has(.pg-result-coin:is(:hover,:focus-visible)) .pg-result-tips-title{opacity:0}
body.desktop-game .pg-result-tips:has([data-pg-tip="heart"]:is(:hover,:focus-visible)) .pg-result-tip-line[data-tip="heart"],body.desktop-game .pg-result-tips:has([data-pg-tip="skill"]:is(:hover,:focus-visible)) .pg-result-tip-line[data-tip="skill"],body.desktop-game .pg-result-tips:has([data-pg-tip="element"]:is(:hover,:focus-visible)) .pg-result-tip-line[data-tip="element"]{opacity:1}
body.desktop-game .pg-result-coins{display:flex;gap:26px}
body.desktop-game .pg-result-coin{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:150px;margin:0;padding:0;border:0;background:none;color:inherit;cursor:pointer;animation:pg-result-rise .3s ease-out calc(1s + var(--i,0) * 80ms) both}
body.desktop-game .pg-result-coin-img{display:block;width:96px;height:96px;object-fit:contain;filter:drop-shadow(0 5px 7px #000b);transition:transform .16s,filter .16s}
body.desktop-game .pg-result-coin-title{font:700 22px/28px var(--uk-serif);color:#f1d896;letter-spacing:.04em;text-shadow:0 1px 2px #000;white-space:nowrap}
body.desktop-game .pg-result-coin:is(:hover,:focus-visible) .pg-result-coin-img{transform:translateY(-3px);filter:brightness(1.14) drop-shadow(0 0 10px #f0b43c88) drop-shadow(0 5px 7px #000b)}
body.desktop-game .pg-result-coin:focus-visible{outline:2px solid var(--uk-gold-hi);outline-offset:4px;border-radius:8px}

/* ---- records ---- */
body.desktop-game .pg-result-records{left:100px;top:calc(792px - var(--dy));width:1400px;height:72px;display:flex;gap:40px}
body.desktop-game .pg-result-record{position:relative;flex:none;width:440px;height:72px;box-sizing:border-box;display:flex;align-items:center;border-style:solid;border-color:transparent;border-width:0 60px 0 76px;border-image:url("./assets/pages/result/tablet.webp") 0 260 0 330 fill / 0 60px 0 76px stretch;filter:drop-shadow(0 6px 10px #000a);animation:pg-result-flip-rec .38s ease-out calc(2.05s + var(--i,0) * 80ms) both}
body.desktop-game .pg-result-root.is-lost .pg-result-record{filter:grayscale(.85) brightness(1.02) drop-shadow(0 6px 10px #000a);animation-delay:calc(1.05s + var(--i,0) * 60ms)}
body.desktop-game .pg-result-record-icon{position:absolute;left:-63px;top:13px;width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 2px 3px #000c)}
body.desktop-game .pg-result-record-label{margin-left:14px;font:700 24px/1 var(--uk-serif);color:#d9c9a0;letter-spacing:.06em;text-shadow:0 1px 2px #000;white-space:nowrap}
body.desktop-game .pg-result-record-value{margin-left:auto;font:700 34px/1 var(--uk-serif);font-variant-numeric:tabular-nums lining-nums;color:#fff2d2;text-shadow:0 2px 3px #000;white-space:nowrap}
body.desktop-game .pg-result-sash{position:absolute;right:-48px;top:-26px;width:128px;height:42px;display:flex;align-items:center;justify-content:center;padding-bottom:4px;box-sizing:border-box;background:url("./assets/pages/result/sash.webp") center/100% 100% no-repeat;font:700 18px/1 var(--uk-serif);letter-spacing:.12em;color:#fff4e6;text-shadow:0 1px 2px #5a0d08;transform:rotate(-7deg);filter:drop-shadow(0 3px 4px #000a);animation:pg-result-stamp .3s cubic-bezier(.3,1.4,.5,1) 2.35s both}

/* ---- actions: the game's own three buttons, dressed with the kit slab ---- */
body.desktop-game .pg-result-actions{left:0;right:0;top:calc(880px - var(--dy));height:98px;display:flex;justify-content:center;align-items:flex-start;gap:48px}
body.desktop-game .pg-result-actions>*{position:relative;flex:none}
body.desktop-game .pg-result-slot{width:320px;height:98px;animation:pg-result-rise .4s ease-out 2.2s both}
body.desktop-game .pg-result-slot.is-retry{animation-delay:2.26s}
body.desktop-game .pg-result-slot.is-next{animation-delay:2.32s}
body.desktop-game .pg-result-root.is-lost .pg-result-slot{animation-delay:1.15s}
body.desktop-game .pg-result-root.is-lost .pg-result-slot.is-retry{animation-delay:1.21s}
body.desktop-game .pg-result-slot>[data-ui-slot]{position:relative;width:320px;height:72px}
body.desktop-game .pg-result-next-name{position:absolute;left:0;right:0;top:76px;font:700 20px/20px var(--uk-serif);color:#e8d5a4;letter-spacing:.06em;text-shadow:0 1px 2px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.desktop-game .pg-result-note{width:470px;height:84px;margin:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:4px 10px;border-style:solid;border-color:transparent;border-width:18px;border-image:url("./assets/pages/_kit/panel.webp") 200 fill / 18px stretch;font:700 21px/1.4 var(--uk-serif);color:#f1d896;text-shadow:0 1px 2px #000;filter:drop-shadow(0 6px 10px #000a);animation:pg-result-rise .4s ease-out 2.32s both}
body.desktop-game .pg-result-retry-glow{position:absolute;left:-20px;right:-20px;top:-14px;height:100px;border-radius:50%;background:radial-gradient(closest-side,#f0b43c66,transparent);pointer-events:none;opacity:0;animation:pg-result-glow 2.6s ease-in-out 1.6s infinite}
body.desktop-game #end-dialog.pg-result .pg-result-btn{position:relative;--uk-bh:72px;width:100%;height:72px;min-width:0;margin:0;gap:0;border-radius:0;font-size:0!important;letter-spacing:0;text-indent:0;justify-content:center}
body.desktop-game #end-dialog.pg-result .pg-result-btn[hidden]{display:none!important}
body.desktop-game #end-dialog.pg-result .pg-result-btn>*{display:none!important}
body.desktop-game #end-dialog.pg-result .pg-result-btn::before{content:attr(data-pg-label);position:relative;z-index:1;font:700 32px/1 var(--uk-serif);letter-spacing:.14em;text-indent:.14em;white-space:nowrap}
/* uifix4: keyboard focus = a warm glow hugging the slab (no square outline reaching the next-stage name 4 px below). */
body.desktop-game #end-dialog.pg-result .pg-result-btn:focus-visible{outline:none;filter:brightness(1.14) drop-shadow(0 0 1.5px #fff1c2) drop-shadow(0 0 4px #f0b43ccc)}
body.desktop-game #end-dialog.pg-result .pg-result-btn.is-primary::after{opacity:1;animation:pg-result-sweep 4.2s ease-in-out 2.9s infinite}
body.desktop-game .pg-result-root:not(.is-ready) .pg-result-board{pointer-events:none}

/* reward motes flying to the top-bar counters (appended to <body> for 1 s, then removed) */
body.desktop-game .pg-result-fly{position:fixed;z-index:60;width:24px;height:24px;margin:0;pointer-events:none;background:center/contain no-repeat;filter:drop-shadow(0 0 6px #ffd36e);will-change:transform,opacity}
body.desktop-game .pg-result-fly.is-gem{background-image:url("./assets/pages/_kit/icon-gem.webp");filter:drop-shadow(0 0 6px #9fc8ff)}
body.desktop-game .pg-result-fly.is-xp{background-image:url("./assets/pages/_kit/icon-xp.webp")}

/* ---- skip / reduced motion ---- */
/* Skip (click / any key, or coming back from a page): every entrance animation jumps to its final state; slow loops keep running. */
body.desktop-game .pg-result-root.is-skip *:not(.pg-result-motes i):not(.pg-result-rays i):not(.pg-result-rule.is-off):not(.pg-result-boss-img):not(.pg-result-retry-glow):not(.pg-result-btn),body.desktop-game .pg-result-root.is-skip *::before{animation:none!important}
@media (prefers-reduced-motion:reduce){
  body.desktop-game .pg-result-root *:not(.pg-result-board),body.desktop-game .pg-result-root *::before,body.desktop-game .pg-result-root *::after{animation:none!important}
  body.desktop-game .pg-result-root .pg-result-board{animation:pg-result-fade .24s ease-out both}
  body.desktop-game .pg-result-motes,body.desktop-game .pg-result-shard{display:none}
}

@keyframes pg-result-fade{from{opacity:0}to{opacity:1}}
@keyframes pg-result-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pg-result-drop{from{opacity:0;transform:translateY(-46px) scale(.92)}to{opacity:1;transform:none}}
@keyframes pg-result-swing{0%{opacity:0;transform:translateY(-70px) rotate(-4deg)}45%{opacity:1;transform:translateY(8px) rotate(2.2deg)}70%{transform:translateY(-3px) rotate(-1deg)}100%{opacity:1;transform:none}}
@keyframes pg-result-crack{0%{opacity:1;transform:scaleY(0)}35%{opacity:1;transform:scaleY(1)}55%{opacity:1}100%{opacity:0;transform:scaleY(1)}}
@keyframes pg-result-split-l{from{transform:none}}
@keyframes pg-result-split-r{from{transform:none}}
@keyframes pg-result-shard{from{opacity:1;transform:none}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rot))}}
@keyframes pg-result-core{0%{transform:scale(1)}40%{transform:scale(1.26)}100%{transform:scale(1.08)}}
@keyframes pg-result-spin{to{transform:rotate(360deg)}}
@keyframes pg-result-banner-in{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes pg-result-grow{from{transform:scale(.94)}to{transform:none}}
@keyframes pg-result-echo{0%{opacity:0;transform:none}14%{opacity:.7}100%{opacity:0;transform:scale(1.16)}}
@keyframes pg-result-shine{from{transform:translateX(-120%)}to{transform:translateX(320%)}}
@keyframes pg-result-stamp{from{opacity:0;transform:scale(1.8) rotate(-8deg)}to{opacity:1}}
@keyframes pg-result-wax{from{opacity:0;transform:scale(1.9) rotate(-26deg)}to{opacity:1;transform:rotate(-10deg)}}
@keyframes pg-result-breathe{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes pg-result-breathe-big{from{transform:none}to{transform:scale(1.035)}}
@keyframes pg-result-flip-out{from{opacity:1;transform:none}to{opacity:1;transform:scaleX(0)}}
@keyframes pg-result-flip-in{from{transform:scaleX(0)}to{transform:none}}
@keyframes pg-result-flip-rec{from{opacity:0;transform:perspective(600px) rotateX(80deg)}to{opacity:1;transform:none}}
@keyframes pg-result-bar{from{transform:scaleX(1)}to{transform:scaleX(var(--r,1))}}
@keyframes pg-result-gem{from{opacity:.15;transform:scale(1.35)}to{opacity:1;transform:none}}
@keyframes pg-result-glow{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes pg-result-sweep{0%{background-position:-150% 0}22%,100%{background-position:250% 0}}
@keyframes pg-result-spark{0%{opacity:0;transform:translateY(0)}12%{opacity:1}80%{opacity:.8}100%{opacity:0;transform:translateY(-560px)}}
@keyframes pg-result-ash{0%{opacity:0;transform:translate(0,0)}12%{opacity:.7}85%{opacity:.5}100%{opacity:0;transform:translate(40px,1040px)}}
@keyframes pg-result-felled{0%{opacity:.85;transform:none}100%{opacity:.42;transform:translateY(-18px) scale(1.05)}}
@keyframes pg-result-loom{from{opacity:0;transform:scale(1.06)}to{opacity:.8;transform:none}}
@keyframes pg-result-distant{from{opacity:0}to{opacity:.5}}