/* Valforge — le sanctuaire et la découverte des reliques d’or. */
#summon-result { --aura:#8fc8ec; --aura-light:#e1f4ff; --relic-art:url('../assets/art/summon/golden-seal-v1.jpg'); isolation:isolate; padding:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; background:#080c12; }
#summon-result::before { content:''; position:fixed; z-index:-2; inset:0; background:linear-gradient(#060a112b,#05080e19 70%,#04070b70),url('../assets/art/summon/sanctuary-v1.jpg') center 80% / cover no-repeat; }
#summon-result::after { content:''; position:fixed; z-index:-1; inset:0; pointer-events:none; background:radial-gradient(ellipse at 50% 50%,transparent 22%,#01040c88 100%); }
#summon-result[data-aura="elite"] { --aura:#d49e4e; --aura-light:#f8dda2; }
#summon-result[data-aura="legendary"] { --aura:#ffca55; --aura-light:#fff6d5; }
#summon-result,#summon-result .summon-result-card { animation:none; }
#summon-result [hidden] { display:none !important; }
#summon-result .summon-result-card { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; width:min(100%,780px); max-width:780px; min-height:100dvh; max-height:none; margin:auto; padding:24px 20px; border:0; border-radius:0; background:none; box-shadow:none; text-align:center; }
#summon-result .summon-reveal-all { position:fixed; z-index:30; top:max(12px,env(safe-area-inset-top)); right:max(12px,env(safe-area-inset-right)); min-width:84px; min-height:44px; margin:0; padding:9px 16px; background:#090e19dd; color:#f9e4b6; border:1px solid #a78b52; border-radius:5px; font-size:14px; }
.summon-film-eyebrow { margin:18px 70px 9px; color:#d2b882; font-size:11px; letter-spacing:.22em; text-shadow:0 2px 8px #000; }
#summon-result-title { margin:6px 0 9px; color:#fff0d0; font:500 clamp(25px,5vw,36px)/1.12 Georgia,serif; text-shadow:0 3px 16px #000; }
#summon-result-sub { width:100%; min-height:20px; margin:0 auto 8px; color:#ddd0b9; font-size:12px; line-height:1.6; text-shadow:0 2px 6px #000; }
.summon-film-status { position:relative; z-index:15; min-height:38px; max-width:430px; margin:8px auto; color:#efdfc0; font-size:14px; line-height:1.45; text-shadow:0 2px 5px #000,0 0 12px #000; }
.summon-film-altar { position:relative; width:100%; height:126px; margin:0 auto; perspective:600px; color:var(--aura); }
.summon-altar-halo { position:absolute; inset:-20% 5%; background:radial-gradient(ellipse,color-mix(in srgb,var(--aura) 35%,transparent),transparent 67%); animation:summon-breathe 2.2s ease-in-out infinite; }
.summon-altar-beam { position:absolute; width:190px; height:180px; bottom:-10px; left:calc(50% - 95px); background:linear-gradient(0deg,color-mix(in srgb,var(--aura) 30%,transparent),transparent); clip-path:polygon(28% 0,72% 0,100% 100%,0 100%); }
.summon-altar-relic { position:absolute; top:7px; left:calc(50% - 29px); width:58px; height:87px; border-radius:4px; background:var(--relic-art) center / 100% 100%; filter:grayscale(1) sepia(.15) brightness(.85) drop-shadow(0 0 16px var(--aura)); animation:summon-relic-hover 2.2s ease-in-out infinite; transition:filter .6s; }
[data-aura="legendary"] .summon-altar-relic,[data-aura="elite"] .summon-altar-relic { filter:drop-shadow(0 0 25px #ffcb6599); }
.summon-altar-ring { position:absolute; bottom:-7px; width:210px; height:70px; left:calc(50% - 105px); border:1px solid var(--aura); border-radius:50%; box-shadow:0 0 18px color-mix(in srgb,var(--aura) 40%,transparent),inset 0 0 20px color-mix(in srgb,var(--aura) 30%,transparent); }
#summon-result .summon-result-grid { position:relative; z-index:2; width:min(100%,570px); gap:10px; margin:12px auto 18px; }
.summon-card { --card-aura:#8fc8ec; position:relative; display:block; min-width:0; width:100%; aspect-ratio:2/3; border:0; border-radius:5px; padding:0; background:transparent; color:#f6e9cd; font:inherit; perspective:750px; opacity:0; transform:translateY(-48px) scale(.8); transition:opacity .35s,transform .6s cubic-bezier(.2,.8,.25,1); transition-delay:calc(var(--card-order) * 22ms); -webkit-tap-highlight-color:transparent; }
.cards-arrived .summon-card { opacity:1; transform:translateY(0) scale(1); }
.summon-result-grid.single .summon-card { width:min(45vw,200px); }
.summon-card-turn { position:absolute; inset:0; display:block; transform-style:preserve-3d; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.summon-card.is-revealed .summon-card-turn { transform:rotateY(180deg); }
.summon-face-back,.summon-face-front { position:absolute; inset:0; display:block; overflow:hidden; border:1px solid var(--card-aura); border-radius:5px; backface-visibility:hidden; -webkit-backface-visibility:hidden; box-shadow:0 3px 12px #0009,0 0 10px color-mix(in srgb,var(--card-aura) 25%,transparent); }
.summon-face-back { background:#766246; }
.summon-back-engraving { position:absolute; inset:0; background:var(--relic-art) center / 100% 100%; filter:grayscale(1) brightness(.6) sepia(.15); transition:filter .65s; }
.summon-face-back::after { content:''; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 20px #143b5644; }
[data-aura="elite"] .summon-card[data-effect="elite"],[data-aura="legendary"] .summon-card[data-effect="elite"] { --card-aura:#d9ad63; }
[data-aura="elite"] [data-effect="elite"] .summon-back-engraving,[data-aura="legendary"] [data-effect="elite"] .summon-back-engraving { filter:saturate(.75) brightness(.8); }
[data-aura="legendary"] .summon-card[data-effect="legendary"] { --card-aura:#ffe08b; }
[data-aura="legendary"] [data-effect="legendary"] .summon-back-engraving { filter:brightness(1.12) saturate(1.12); }
[data-aura="legendary"] [data-effect="legendary"] .summon-face-back { box-shadow:0 0 22px #efb534bb,0 0 50px #d87d263b; }
.summon-card-crack { position:absolute; inset:0; opacity:0; background:#fff5cc; clip-path:polygon(48% 0,52% 28%,73% 39%,49% 59%,57% 75%,30% 100%,49% 74%,42% 58%,63% 39%,46% 29%); }
.is-cracking [data-effect="legendary"] .summon-card-crack { opacity:.9; }
.is-cracking .summon-altar-relic { animation:summon-relic-awake .6s ease-out; }
.summon-face-front { border-color:var(--tier-color); background:#080c12; transform:rotateY(180deg); isolation:isolate; }
.summon-hero-portrait { position:absolute; display:block; inset:0; width:100%; height:100%; object-fit:cover; object-position:center top; }
.summon-hero-frame { position:absolute; z-index:2; inset:0; display:block; width:100%; height:100%; object-fit:fill; mix-blend-mode:screen; pointer-events:none; }
.summon-card-meta { position:absolute; z-index:3; left:5%; right:5%; bottom:3%; display:flex; flex-direction:column; gap:2px; padding:9px 2px 3px; background:linear-gradient(transparent,#090b12e8 35%); border-radius:3px; }
.summon-card-stars { color:#f8d576; font-size:clamp(8px,1.8vw,12px); letter-spacing:-1px; white-space:nowrap; }
.summon-card-meta b { color:#fff0cf; font:600 clamp(10px,2.3vw,14px)/1.15 Georgia,serif; overflow-wrap:anywhere; }
.summon-card-meta small { font-size:clamp(7px,1.4vw,10px); color:#cfdfd9; line-height:1.3; }
.single .summon-card-meta b { font-size:22px; }
.single .summon-card-meta small { font-size:11px; }
.single .summon-card-stars { font-size:18px; }
.summon-card[data-stars="5"].is-revealed .summon-face-front { border:2px solid #ffdc80; box-shadow:0 0 14px #ffc445aa,0 0 34px #b8813544; }
.summon-card[data-stars="5"] .summon-card-shine { position:absolute; z-index:4; inset:0; pointer-events:none; background:linear-gradient(115deg,transparent 30%,#fff8dca3 48%,transparent 64%); transform:translateX(-160%); }
[data-phase="results"] .summon-card[data-stars="5"] .summon-card-shine { animation:summon-card-shine 3.8s ease-in-out infinite; animation-delay:calc(var(--card-order) * .13s); }
[data-phase="results"] .summon-card[data-stars="5"] { animation:summon-gold-glory 3.8s ease-in-out infinite; }
#summon-result[data-phase="results"] .summon-film-altar { display:none; }
#summon-result[data-phase="results"] .summon-card,#summon-result[data-phase="results"] .summon-card-turn { transition:none; }
#summon-result[data-phase="results"] .summon-result-card { min-height:0; width:min(96vw,660px); margin:20px auto; padding:20px; border:1px solid #b79354; border-radius:9px; background:#090d17e8; box-shadow:0 0 70px #000b,inset 0 1px 0 #ffe1a445; }
#summon-result[data-phase="results"] .summon-film-status { min-height:0; margin:4px 0; font-size:12px; }
#summon-result-actions { width:100%; }
.summon-share { padding:12px 0; border-top:1px solid #94713c80; }
.summon-share > .btn { font-size:14px; min-height:44px; padding:8px 14px; }
.summon-share > small { display:block; margin-top:7px; color:#b5a78f; font-size:12px; line-height:1.4; }
#summon-result .result-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
#summon-result .result-actions .btn { min-height:44px; font-size:14px; padding:10px 15px; }

/* Le trésor prend toute la scène. Les petits résultats attendent derrière. */
#summon-result:is([data-phase="waiting"],[data-phase="hatching"],[data-phase="treasure"]) :is(.summon-film-eyebrow,#summon-result-title,#summon-result-sub,.summon-film-altar,#summon-result-grid) { display:none; }
#summon-result:is([data-phase="waiting"],[data-phase="hatching"],[data-phase="treasure"]) .summon-film-status { order:5; margin:10px 0 0; }
.summon-treasure { position:relative; display:flex; flex-direction:column; align-items:center; gap:12px; width:100%; perspective:1100px; overflow:clip; overflow-clip-margin:24px; }
.treasure-overline { position:relative; z-index:3; color:#f5d187; font-size:12px; letter-spacing:.24em; text-shadow:0 2px 10px #000; }
.treasure-relic { position:relative; z-index:4; width:min(62vw,270px,36dvh); aspect-ratio:2/3; perspective:1000px; margin:2px 0; }
.treasure-trigger { position:absolute; inset:0; display:block; width:100%; height:100%; border:0; padding:0; border-radius:8px; background:transparent; cursor:grab; perspective:1000px; touch-action:none; -webkit-tap-highlight-color:transparent; }
.treasure-trigger::before { content:''; position:absolute; inset:0; border-radius:6px; background:#fff4cd; box-shadow:0 0 50px #ffda6aaa; opacity:0; }
.treasure-trigger:active { cursor:grabbing; }
.treasure-trigger:disabled { cursor:default; }
.treasure-trigger:focus-visible { outline:2px solid #ffe9a5; outline-offset:8px; }
.treasure-shell { position:absolute; z-index:5; inset:0; display:block; transform-style:preserve-3d; filter:drop-shadow(0 0 14px #f8bd3e77) drop-shadow(0 15px 12px #000b); }
.treasure-shard { position:absolute; inset:0; display:block; transform-style:preserve-3d; filter:drop-shadow(0 2px 1px #6d370bd9); }
.treasure-shard > span { position:absolute; inset:0; display:block; background:var(--relic-art) center / 100% 100%; }
.treasure-shell-gloss { position:absolute; z-index:6; inset:0; display:block; border-radius:5px; overflow:hidden; pointer-events:none; background:linear-gradient(115deg,transparent 30%,#fff9db85 48%,transparent 64%); mask-image:linear-gradient(#000,#000); animation:treasure-seal-sheen 3.1s ease-in-out infinite; }
.treasure-seams { position:absolute; inset:0; width:100%; height:100%; overflow:visible; fill:none; stroke:#fff9dc; stroke-width:.65; stroke-linecap:round; filter:drop-shadow(0 0 3px #fff0a8) drop-shadow(0 0 8px #ffb629); }
.treasure-seams path { stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--touch-tension,0) * .8); }
.treasure-hero { position:absolute; inset:0; display:block; opacity:0; overflow:hidden; border:2px solid #ffe09a; border-radius:7px; background:#080b12; isolation:isolate; box-shadow:0 0 22px #ffd360,0 0 65px #de92226b; }
.treasure-hero-gloss { position:absolute; z-index:4; inset:0; display:block; background:linear-gradient(110deg,transparent 26%,#fff1b876 46%,transparent 64%); transform:translateX(-150%); }
.treasure-caption { position:relative; z-index:8; max-width:100%; min-height:95px; color:#f6d699; }
.treasure-caption h3 { margin:5px 0 4px; color:#fff3d1; font:500 clamp(25px,6vw,35px)/1.12 Georgia,serif; text-shadow:0 0 22px #f6b34a77,0 3px 6px #000; }
.treasure-caption p { max-width:450px; color:#d7c6a6; font-size:13px; line-height:1.4; text-shadow:0 2px 8px #000; }
.treasure-stars { display:flex; justify-content:center; align-items:center; gap:8px; height:31px; }
.treasure-stars > span { display:inline-flex; opacity:.45; transform:scale(.8); }
.treasure-stars .vf-icon { width:28px; height:28px; filter:drop-shadow(0 0 4px #ffbd4277); }
.treasure-controls { position:relative; z-index:15; display:flex; justify-content:center; min-height:44px; }
#btn-summon-treasure-next { min-height:44px; min-width:200px; padding:10px 24px; font-size:14px; border-radius:5px; box-shadow:0 0 20px #daaa4040; }
.treasure-light { position:absolute; z-index:0; width:min(125vw,850px); aspect-ratio:1; top:42%; left:50%; transform:translate(-50%,-50%); pointer-events:none; }
.treasure-rays { position:absolute; inset:0; opacity:.12; background:repeating-conic-gradient(from 0deg,transparent 0deg 11deg,#ffd77370 12deg,#fff5cc8c 14deg,transparent 19deg 30deg); mask-image:radial-gradient(circle,#000 0%,#000a 32%,transparent 69%); animation:treasure-orbit 28s linear infinite; }
.treasure-corona { position:absolute; inset:17%; border-radius:50%; background:radial-gradient(circle,#fff0bb6b, #f4b93b20 43%,transparent 70%); animation:summon-breathe 2.6s ease-in-out infinite; }
.treasure-wave { position:absolute; inset:25%; border:3px solid #ffe7a8; border-radius:50%; box-shadow:0 0 18px #ffdc8e,inset 0 0 20px #d6973b; opacity:0; }
.treasure-flare { position:absolute; inset:5%; opacity:0; border-radius:50%; background:radial-gradient(ellipse,#fffbedc9 0%,#fff0b696 15%,#f6bf4155 28%,transparent 62%); }
.treasure-motes { position:absolute; z-index:10; top:50%; left:50%; pointer-events:none; }
.treasure-motes i { position:absolute; width:var(--mote-size); height:calc(var(--mote-size) * 2.4); opacity:0; border-radius:1px; background:linear-gradient(#fff9d6,#ffd264,#b3711e); box-shadow:0 0 6px #ffcb4c; }
[data-stage="charging"] .treasure-trigger { animation:treasure-strain .42s ease-in both; }
[data-stage="charging"] .treasure-trigger::before { opacity:1; }
[data-stage="charging"] .treasure-seams path { animation:treasure-fracture .27s ease-out forwards; animation-delay:var(--crack-delay); }
[data-stage="charging"] .treasure-shell { filter:drop-shadow(0 0 22px #ffce74dd); }
[data-stage="charging"] .treasure-shell-gloss { animation:none; opacity:0; }
.has-burst .treasure-shell-gloss,.has-burst .treasure-seams { display:none; }
.has-burst .treasure-shell { filter:none; }
[data-stage="sealed"] .treasure-relic { animation:treasure-arrive .65s cubic-bezier(.12,.7,.2,1) both; }
.has-burst .treasure-shard { animation:treasure-shatter 1.02s cubic-bezier(.12,.66,.27,1) both; animation-delay:var(--shard-delay); will-change:transform,opacity; }
.has-burst .treasure-relic { animation:treasure-impact .48s ease-out; }
.has-burst .treasure-hero { animation:treasure-emerge .72s cubic-bezier(.12,.8,.3,1) .18s both; }
.has-burst .treasure-hero-gloss { animation:treasure-hero-sheen 3.5s .3s ease-in-out infinite; }
.has-burst .treasure-wave { animation:treasure-shockwave 1.15s ease-out both; }
.has-burst .treasure-flare { animation:treasure-flare-burst .8s ease-out both; }
.has-burst .treasure-rays { opacity:.6; transition:opacity .18s; }
.has-burst .treasure-corona { background:radial-gradient(circle,#ffedb78c,#df972e3a 45%,transparent 72%); }
.has-burst .treasure-motes i { animation:treasure-spark-burst 1.25s cubic-bezier(.15,.5,.25,1) both; animation-delay:var(--mote-delay); }
[data-stage="revealed"] .treasure-stars > span { animation:treasure-star-awaken .5s cubic-bezier(.1,1.1,.3,1.4) both; animation-delay:calc(var(--star-order) * .095s); }
[data-stage="revealed"] .treasure-stars .vf-icon { filter:drop-shadow(0 0 8px #ffcc5dc9); }
[data-stage="revealed"] .treasure-caption h3 { animation:treasure-name-awaken .45s ease-out both; }
@keyframes summon-breathe { 50% { opacity:.65; } }
@keyframes summon-relic-hover { 50% { transform:translateY(-6px) rotateY(12deg); } }
@keyframes summon-relic-awake { 45% { transform:scale(1.22); } }
@keyframes summon-card-shine { 0%,40% { transform:translateX(-160%); } 77%,100% { transform:translateX(160%); } }
@keyframes summon-gold-glory { 50% { filter:drop-shadow(0 0 9px #f8cd5880); } }
@keyframes treasure-orbit { to { transform:rotate(360deg); } }
@keyframes treasure-arrive { from { opacity:0; transform:translateY(26px) scale(.72) rotateY(-14deg); } to { opacity:1; transform:translateY(0) scale(1) rotateY(0); } }
@keyframes treasure-seal-sheen { 0%,25% { opacity:0; background-position:180px 0; } 45% { opacity:.65; } 70%,100% { opacity:0; background-position:-180px 0; } }
@keyframes treasure-strain { 15%,45%,75% { transform:translateX(-2px) rotate(-.7deg); } 30%,60%,90% { transform:translateX(2px) rotate(.7deg); } 100% { transform:scale(1.025); } }
@keyframes treasure-fracture { to { stroke-dashoffset:0; } }
@keyframes treasure-shatter { 0% { transform:translate3d(0,0,0); opacity:1; } 25% { opacity:1; } 100% { transform:translate3d(var(--shard-x),var(--shard-y),var(--shard-z)) rotateX(35deg) rotateY(var(--shard-ry)) rotateZ(var(--shard-r)); opacity:0; } }
@keyframes treasure-impact { 20% { transform:translateY(5px) scale(.97); } 55% { transform:translateY(-2px) scale(1.02); } }
@keyframes treasure-emerge { 0% { opacity:0; transform:scale(.82) translateY(22px); filter:brightness(2); } 38% { opacity:1; } 100% { opacity:1; transform:scale(1) translateY(0); filter:brightness(1); } }
@keyframes treasure-shockwave { 0% { opacity:.9; transform:scale(.3) rotateX(35deg); } 100% { opacity:0; transform:scale(2.2) rotateX(35deg); } }
@keyframes treasure-flare-burst { 0% { opacity:0; transform:scale(.4); } 15% { opacity:.85; } 100% { opacity:0; transform:scale(1.65); } }
@keyframes treasure-spark-burst { 0% { opacity:0; transform:translate3d(0,0,0) rotate(var(--mote-r)); } 12%,45% { opacity:1; } 100% { opacity:0; transform:translate3d(var(--mote-x),var(--mote-y),0) rotate(calc(var(--mote-r) + 140deg)); } }
@keyframes treasure-star-awaken { 0% { opacity:0; transform:scale(.3) translateY(9px); } 65% { transform:scale(1.28) translateY(-2px); } 100% { opacity:1; transform:scale(1); } }
@keyframes treasure-name-awaken { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes treasure-hero-sheen { 0%,18% { transform:translateX(-150%); } 55%,100% { transform:translateX(150%); } }
@media (min-width:800px) { #summon-result::before { background-size:auto 100%; background-color:#080c12; } }
@media (max-height:650px) and (orientation:portrait) { .treasure-relic { width:min(60vw,30dvh); } .summon-treasure { gap:8px; } .treasure-caption { min-height:82px; } }
@media (max-width:370px) { #summon-result .summon-result-card { padding:22px 12px; } #summon-result .summon-result-grid { gap:6px; } .summon-film-eyebrow { font-size:10px; margin-inline:50px; } .treasure-caption p { font-size:12px; } .treasure-stars { gap:6px; } }
@media (max-height:570px) and (orientation:landscape) {
  #summon-result .summon-result-card { padding:15px 24px; }
  .summon-film-altar { height:68px; }
  .summon-altar-relic { top:0; width:36px; height:54px; left:calc(50% - 18px); }
  .summon-film-eyebrow { margin-top:0; }
  #summon-result .summon-result-grid { max-width:480px; }
  .summon-result-grid.single .summon-card { width:125px; }
  .summon-treasure { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto auto auto; gap:8px 18px; max-width:650px; align-items:center; }
  .treasure-relic { grid-column:1; grid-row:1/4; justify-self:center; width:min(31vw,46dvh); }
  .treasure-overline { grid-column:2; grid-row:1; align-self:end; font-size:11px; margin-top:15px; }
  .treasure-caption { grid-column:2; grid-row:2; align-self:center; min-height:0; }
  .treasure-caption h3 { font-size:27px; }
  .treasure-controls { grid-column:2; grid-row:3; align-self:start; }
  .treasure-light { left:25%; top:50%; width:650px; }
  #summon-result:is([data-phase="waiting"],[data-phase="hatching"],[data-phase="treasure"]) .summon-film-status { margin-top:10px; font-size:12px; min-height:20px; }
}
@media (prefers-reduced-motion:reduce) { #summon-result,#summon-result *,#summon-result *::before,#summon-result *::after { animation:none !important; transition:none !important; } }
