/* Le personnage et son sort partagent un même cycle de douze secondes. */
.world-hero{min-height:800px}.world-art{animation:none!important;transform:none!important}.world-art .world-backdrop{inset:0;width:100%;height:100%;object-position:70% center}.world-copy{position:relative;z-index:4;width:53%}.world-label{z-index:5}.motion-control{z-index:5}
.yuna-rig{position:absolute;z-index:1;right:14%;bottom:-8%;height:100%;width:auto;aspect-ratio:3/4;pointer-events:none;isolation:isolate}
.yuna-still,.yuna-puppet{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(#000 0 88%,transparent 99%)}.yuna-still{z-index:1}.yuna-puppet{z-index:2;display:none}.world-hero[data-puppet=webgl] .yuna-puppet{display:block}.world-hero[data-puppet=webgl] .yuna-still{visibility:hidden}
/* Expanded hair artwork and a wider drawing surface avoid rectangular side clipping. */
.yuna-still{left:-21.1283%;top:.083%;width:142.0354%;max-width:none;height:101.6573%;object-fit:fill}
.yuna-puppet{left:-30%;width:160%;max-width:none}
.frost-aura{position:absolute;z-index:0;inset:19% -3% 14%;background:radial-gradient(ellipse,#81dfff24,transparent 65%);filter:blur(10px)}
/* Only the hair and light react to the burst; the pose and scenery stay anchored. */
.yuna-rig{translate:none;rotate:none}
.world-art .world-backdrop{transform:none}
.hero-magic>.spell-bloom{width:calc(var(--unit)*1050);height:calc(var(--unit)*1050);border-radius:50%;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle,#deffff66,#80e5ff4d 12%,#429eec33 28%,#477dd419 45%,transparent 68%);opacity:0;transform:translate(-50%,-50%) scale(.3);animation-name:frost-bloom}
@keyframes frost-bloom{0%,27%,55%,100%{opacity:0;transform:translate(-50%,-50%) scale(.35)}30%{opacity:.25;transform:translate(-50%,-50%) scale(.55)}34%{opacity:.9;transform:translate(-50%,-50%) scale(1)}42%{opacity:.4;transform:translate(-50%,-50%) scale(1.4)}53%{opacity:0;transform:translate(-50%,-50%) scale(1.75)}}
.hero-magic{position:absolute;z-index:3;width:0;height:0;--unit:.6px;pointer-events:none}.hero-magic>span,.hero-magic>button{position:absolute;animation-duration:12s;animation-iteration-count:infinite;animation-play-state:paused;transform-origin:center}
.crystal-trigger{width:calc(var(--unit)*220);height:calc(var(--unit)*220);min-width:48px;min-height:48px;padding:0;border:0;background:transparent;transform:translate(-50%,-50%);pointer-events:auto;cursor:pointer;animation-name:frost-core;filter:drop-shadow(0 0 4px #8fdcff80) drop-shadow(0 0 13px #3a8bea45);-webkit-tap-highlight-color:transparent}.hero-magic>.crystal-trigger{transform-origin:50% 91%}.crystal-art{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}.crystal-trigger:hover{filter:drop-shadow(0 0 5px #c7f2ff99) drop-shadow(0 0 18px #65b7ff66)}.crystal-trigger:focus-visible{outline:3px solid #fff2bc;outline-offset:12px;border-radius:50%}
/* Light moves inside the glass; the painted surface reflections stay in place. */
.crystal-trigger{isolation:isolate}
.crystal-art{animation:frost-orb-brightness 12s ease-in-out infinite paused}
.orb-energy{position:absolute;inset:14% 13% 14% 12%;border-radius:50%;overflow:hidden;pointer-events:none;mix-blend-mode:screen;mask-image:radial-gradient(circle,#000 32%,#000c 48%,transparent 70%);opacity:.58;animation:frost-inner-charge 12s ease-in-out infinite paused}
.orb-flow{position:absolute;inset:-16%;border-radius:50%;background:radial-gradient(ellipse at 62% 23%,#e2ffff 0 2%,#75e9ff99 6%,transparent 24%),conic-gradient(from 45deg,transparent 0 12%,#1c78ed55 20%,#61dcffcc 25%,#e5ffff 27%,transparent 34% 57%,#37adffbb 65%,#dcffff 69%,transparent 75%);mask-image:radial-gradient(ellipse,transparent 9%,#000 20% 39%,transparent 64%);filter:blur(.6px);animation:frost-energy-turn 12s linear infinite paused}
.orb-flow-two{inset:-8%;opacity:.65;background:conic-gradient(from 110deg,transparent 0 24%,#327dff80 32%,#70e9ff 38%,#dfffff 40%,transparent 48% 72%,#499eff99 79%,transparent 90%);animation-name:frost-energy-return}
.orb-inner-light{position:absolute;inset:15%;border-radius:50%;background:radial-gradient(ellipse at 47% 54%,#edffffa8 0 5%,#4fdcff66 30%,#1285ee22 52%,transparent 72%)}
@keyframes frost-energy-turn{0%{transform:rotate(0deg) scaleY(.82)}20%{transform:rotate(180deg) scaleY(.95)}28%{transform:rotate(430deg) scaleY(.8)}33%,69%{transform:rotate(650deg) scaleY(.9)}88%{transform:rotate(950deg) scaleY(.86)}100%{transform:rotate(1080deg) scaleY(.82)}}
@keyframes frost-energy-return{0%{transform:rotate(70deg) scaleX(.84)}20%{transform:rotate(-60deg) scaleX(.93)}28%{transform:rotate(-260deg) scaleX(.8)}33%,69%{transform:rotate(-460deg) scaleX(.94)}88%{transform:rotate(-580deg) scaleX(.88)}100%{transform:rotate(-650deg) scaleX(.84)}}
@keyframes frost-inner-charge{0%,100%{opacity:.58}18%{opacity:.65}26%{opacity:.88}30%,33%{opacity:1}69%{opacity:.3}88%{opacity:.68}}
@keyframes frost-orb-brightness{0%,16%,69%,100%{filter:brightness(1) saturate(1)}23%{filter:brightness(1.12) saturate(1.12)}28%{filter:brightness(1.5) saturate(1.15)}30%,33%{filter:brightness(2) saturate(1.05)}88%{filter:brightness(1.08) saturate(1.08)}}
/* Cold, diffused light preserves the painted facets instead of washing them out. */
.spell-halo{width:calc(var(--unit)*420);height:calc(var(--unit)*390);border-radius:50%;background:radial-gradient(ellipse,#b4eeff66,#51a9ed35 18%,#3767cb12 39%,transparent 68%);transform:translate(-50%,-50%);animation-name:frost-charge}
.spell-flare{width:calc(var(--unit)*570);height:calc(var(--unit)*570);border-radius:50%;background:radial-gradient(circle,#ecf8ffb0 0%,#d1edff66 8%,#9bcffb22 22%,#6c9bff08 42%,transparent 68%);opacity:0;transform:translate(-50%,-50%) scale(.2);animation-name:frost-flare}
.spell-ring{width:calc(var(--unit)*180);height:calc(var(--unit)*180);border:1px solid #d8edff70;border-radius:50%;box-shadow:0 0 9px #87c5f14a,inset 0 0 8px #b5dcff30;opacity:0;transform:translate(-50%,-50%) scale(.3);animation-name:frost-wave}.ring-b{animation-name:frost-wave-two;border-width:1px;border-color:#b1d5ff50}
.spell-shard{width:calc(var(--unit)*var(--sw));height:calc(var(--unit)*var(--sh));background-color:#459cd7;background-image:linear-gradient(135deg,#e4faff55,transparent 40%,#a4ddff20),url('/assets/yuna-ice-orb.webp');background-size:100% 100%,230% 230%;background-position:center;clip-path:polygon(48% 0,100% 38%,63% 100%,0 65%);opacity:0;transform:translate(-50%,-50%) scale(.05);animation-name:frost-shards;animation-timing-function:cubic-bezier(.18,.6,.3,1);filter:drop-shadow(1px 2px 1px #073e7f66) drop-shadow(0 0 4px #54b8ff88)}
.spell-shard:nth-child(3n){background-position:center,30% 45%}.spell-shard:nth-child(3n+1){background-position:center,65% 60%}
.spell-flake{width:calc(var(--unit)*var(--size));height:calc(var(--unit)*var(--size));border-radius:50%;background:radial-gradient(circle,#eaffff 0 12%,#7bdcff90 35%,#3f96eb20 65%,transparent 72%);box-shadow:0 0 6px #69caff65;opacity:0;animation-name:frost-flakes}
.yuna-snow{position:absolute;z-index:3;inset:0;overflow:hidden;pointer-events:none}.yuna-snow i{position:absolute;width:3px;height:3px;border-radius:50%;background:#c6faff;box-shadow:0 0 8px #a3e9ff;opacity:0;animation:frost-snow var(--duration) var(--delay) infinite linear paused}
.world-hero[data-ice-running=true] .hero-magic>span,.world-hero[data-ice-running=true] .hero-magic>button,.world-hero[data-ice-running=true] .crystal-trigger *,.world-hero[data-ice-running=true] .yuna-snow i{animation-play-state:running}
@keyframes frost-core{0%,100%{opacity:1;transform:translate(-50%,-50%) rotate(-4deg) scale(.9)}20%{opacity:1;transform:translate(-50%,-50%) rotate(4deg) scale(1.03)}28%,30%{opacity:1;transform:translate(-50%,-50%) rotate(10deg) scale(1.14)}33%,69%{opacity:0;transform:translate(-50%,-50%) rotate(25deg) scale(.08)}79%{opacity:.35;transform:translate(-50%,-50%) rotate(-12deg) scale(.6)}88%{opacity:1;transform:translate(-50%,-50%) rotate(-4deg) scale(.94)}}
@keyframes frost-charge{0%,100%{opacity:.3;transform:translate(-50%,-50%) scale(.7)}22%{opacity:.65;transform:translate(-50%,-50%) scale(.95)}29%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}48%{opacity:.35;transform:translate(-50%,-50%) scale(1.8)}66%{opacity:.08;transform:translate(-50%,-50%) scale(1)}80%{opacity:.5;transform:translate(-50%,-50%) scale(.7)}}
@keyframes frost-flare{0%,25%,60%,100%{opacity:0;transform:translate(-50%,-50%) scale(.25)}30%{opacity:.85;transform:translate(-50%,-50%) scale(.8)}40%{opacity:.15;transform:translate(-50%,-50%) scale(1.65)}51%{opacity:0;transform:translate(-50%,-50%) scale(2)}}
@keyframes frost-wave{0%,27%,65%,100%{opacity:0;transform:translate(-50%,-50%) scale(.3)}32%{opacity:.9}53%{opacity:0;transform:translate(-50%,-50%) scale(5.4)}}
@keyframes frost-wave-two{0%,30%,70%,100%{opacity:0;transform:translate(-50%,-50%) scale(.5)}36%{opacity:.7}61%{opacity:0;transform:translate(-50%,-50%) scale(6.2)}}
@keyframes frost-shards{0%,27%,100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--turn)) scale(.05)}31%{opacity:1;transform:translate(-50%,-50%) rotate(var(--turn)) scale(.5)}46%{opacity:1;transform:translate(calc(-50% + var(--unit)*var(--dx)),calc(-50% + var(--unit)*var(--dy))) rotate(calc(var(--turn) + 90deg)) scale(1)}63%{opacity:.2;transform:translate(calc(-50% + var(--unit)*var(--dx)*1.18),calc(-50% + var(--unit)*var(--dy)*1.18)) rotate(calc(var(--turn) + 150deg)) scale(.7)}78%{opacity:.8;transform:translate(-50%,-50%) rotate(calc(var(--turn) + 180deg)) scale(.35)}84%{opacity:0;transform:translate(-50%,-50%) rotate(calc(var(--turn) + 180deg)) scale(.05)}}
@keyframes frost-flakes{0%,31%,100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--turn)) scale(.1)}44%{opacity:1;transform:translate(calc(-50% + var(--unit)*var(--dx)),calc(-50% + var(--unit)*var(--dy))) rotate(calc(var(--turn) + 60deg)) scale(1)}65%{opacity:0;transform:translate(calc(-50% + var(--unit)*var(--dx)*1.2),calc(-50% + var(--unit)*var(--dy)*1.3)) rotate(calc(var(--turn) + 100deg)) scale(.5)}82%{opacity:0;transform:translate(-50%,-50%) scale(.1)}}
@keyframes frost-snow{0%{opacity:0;transform:translate(0,-25px)}25%,65%{opacity:.65}100%{opacity:0;transform:translate(24px,70px)}}
/* Lettres de glace : reflets, facettes, légère épaisseur et pointes de givre. */
.world-copy h1.ice-title{font-size:clamp(70px,7.25vw,110px);line-height:1.05;letter-spacing:-4px;margin-bottom:28px;text-shadow:none}.frozen-line{display:block;position:relative;width:max-content;max-width:100%;color:#b4e8ff;background:linear-gradient(148deg,transparent 25%,#fff8 26%,transparent 27% 59%,#fff9 60%,transparent 61%),linear-gradient(178deg,#ffffff 0%,#defbff 25%,#8ad8ff 42%,#e6ffff 45%,#65b4ed 72%,#d1faff 91%,#fff 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px #d3f8ff;filter:drop-shadow(0 2px 0 #2c78a4) drop-shadow(0 5px 0 #16476f) drop-shadow(0 8px 14px #07182f)}
.frozen-line:after{content:attr(data-ice);position:absolute;inset:0;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:0;background:repeating-linear-gradient(126deg,transparent 0 27px,#eeffffd9 28px,transparent 29px 63px);background-clip:text;-webkit-background-clip:text;opacity:.55;pointer-events:none}
.icicles{position:absolute;left:0;right:0;bottom:3px;height:0;pointer-events:none}.icicles b{position:absolute;width:8px;height:23px;clip-path:polygon(0 0,100% 0,60% 100%);background:linear-gradient(90deg,#e4ffff,#75bfe8);filter:drop-shadow(1px 2px 1px #236c9c);left:12%}.icicles b:nth-child(2){left:33%;height:14px;width:6px}.icicles b:nth-child(3){left:53%;height:28px}.icicles b:nth-child(4){left:75%;height:17px;width:6px}.icicles b:nth-child(5){left:88%;height:12px;width:5px}
@media(min-width:1600px){.yuna-rig{right:14%;height:112%;bottom:-18%}}
@media(max-width:1050px) and (min-width:761px){.world-hero{min-height:780px}.world-copy h1.ice-title{font-size:74px}.yuna-rig{height:94%;right:14%;bottom:-5%}}
@media(max-width:760px){.world-hero{min-height:0;padding-bottom:70px}.world-copy{width:100%}.world-copy h1.ice-title{font-size:clamp(53px,15.1vw,73px);letter-spacing:-2.5px;margin-bottom:25px}.icicles b{height:16px;width:6px}.icicles b:nth-child(3){height:20px}.yuna-rig{position:relative;right:auto;bottom:auto;left:50%;width:min(60vw,440px);height:auto;aspect-ratio:3/4;transform:translateX(-50%);margin-top:-28px;margin-bottom:-80px}.world-art .world-backdrop{inset:0;object-position:70% center}.world-shade{background:linear-gradient(180deg,#060e23 0%,#060e23e6 36%,#060e2380 51%,#060e2300 72%,#070b1c 100%)}.motion-control{bottom:55px}.hero-magic .crystal-trigger{min-width:44px;min-height:44px}.world-label{bottom:18px}.yuna-snow{top:40%}.hero-story-link{position:relative;z-index:5}}
@media(prefers-reduced-motion:reduce){.hero-magic>span,.yuna-snow,.orb-energy{display:none!important}.hero-magic>.crystal-trigger{animation:none!important;opacity:1;transform:translate(-50%,-50%) scale(.9)}.crystal-art{animation:none!important;filter:none!important}}
/* Un clic sur Yuna déclenche un salut ; le cristal conserve son action propre. */
.yuna-greet{position:absolute;inset:0;z-index:3;width:100%;height:100%;display:block;border:0;padding:0;background:transparent;color:inherit;cursor:pointer;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;clip-path:polygon(23% 5%,70% 5%,85% 29%,100% 44%,100% 100%,0% 100%,0% 48%,13% 30%)}
.yuna-greet:focus-visible{outline:none}.yuna-greet:focus-visible:after{content:'';position:absolute;inset:10% 17% 27% 12%;border:2px dashed #ffe6a0;border-radius:42%;box-shadow:0 0 22px #90e9ff60}
.hero-magic{z-index:4}
.hello-hint,.yuna-greeting{position:absolute;right:9%;top:39%;padding:10px 14px;border:1px solid #9fdefb80;border-radius:15px 15px 15px 3px;box-shadow:0 5px 18px #02091940;white-space:nowrap;pointer-events:none}
.hello-hint{font:600 11px Arial,sans-serif;color:#d9f7ff;background:#091830db;opacity:0;transform:translateY(5px);transition:opacity .18s,transform .18s}
.yuna-greet:hover .hello-hint,.yuna-greet:focus-visible .hello-hint{opacity:1;transform:none}
.yuna-greeting{z-index:5;font:700 17px Arial,sans-serif;letter-spacing:.1px;color:#123154;background:#e7fcff;opacity:0;transform:translateY(7px) scale(.94);transition:opacity .16s,transform .2s}
.world-hero[data-greeting=true] .yuna-greeting{opacity:1;transform:none}.world-hero[data-greeting=true] .hello-hint{opacity:0}
.yuna-greeting-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:760px){.hello-hint,.yuna-greeting{right:9%;top:42%;padding:8px 11px}.hello-hint{font-size:10px;opacity:.85;transform:none}.yuna-greeting{font-size:15px}}
@media(prefers-reduced-motion:reduce){.hello-hint,.yuna-greeting{transition:none;transform:none}}