/* THE HANDS: the impact sequence over the arsenal canvas (src/arsenal/hands.js). */
.hx{ position:fixed; inset:0; z-index:2; pointer-events:none; visibility:hidden; opacity:0; overflow:hidden; contain:strict; }
.hx__bg{ position:absolute; inset:0;
  background:radial-gradient(48% 60% at var(--ix,40%) var(--iy,45%), rgba(212,169,90,.30), rgba(140,106,46,.10) 45%, transparent 75%),
             radial-gradient(120% 90% at 50% 50%, #0d0d0f, #060607 70%); }
.hx__rays{ position:absolute; left:var(--ix,40%); top:var(--iy,45%); width:240vmax; height:240vmax; margin:-120vmax 0 0 -120vmax;
  background:repeating-conic-gradient(from 0deg, rgba(241,213,149,.10) 0deg 2.2deg, transparent 2.2deg 9deg, rgba(212,169,90,.05) 9deg 10deg, transparent 10deg 17deg);
  -webkit-mask-image:radial-gradient(closest-side, #000 4%, rgba(0,0,0,.5) 30%, transparent 70%); mask-image:radial-gradient(closest-side, #000 4%, rgba(0,0,0,.5) 30%, transparent 70%);
  mix-blend-mode:screen; }
.hx__smoke i{ position:absolute; width:70vmax; height:50vmax; border-radius:50%; filter:blur(60px); opacity:.35;
  background:radial-gradient(closest-side, rgba(120,110,95,.45), transparent); animation:hxDrift 18s ease-in-out infinite alternate; }
.hx__smoke i:first-child{ left:-15vmax; top:10vh; }
.hx__smoke i:last-child{ right:-20vmax; bottom:-10vh; animation-duration:24s; animation-direction:alternate-reverse; }
@keyframes hxDrift{ to{ transform:translate3d(12vmax,-6vmax,0) scale(1.15); } }
.hx__type{ position:absolute; left:0; right:0; top:50%; margin-top:-.42em; font-size:clamp(9rem, 30vw, 34rem); text-align:center; white-space:nowrap; }
.hx__type span{ display:inline-block; font-family:var(--display); font-weight:900; font-size:1em; line-height:.8; letter-spacing:-.03em;
  color:transparent; -webkit-text-stroke:1.5px rgba(212,169,90,.42); }
.hx__shot{ position:absolute; opacity:0; will-change:transform, opacity;
  -webkit-mask-image:linear-gradient(to top, transparent, #000 16%); mask-image:linear-gradient(to top, transparent, #000 16%); }
.hx__shot img{ display:block; width:100%; height:100%; object-fit:contain;
  -webkit-mask-image:linear-gradient(to right, #000 calc(100% - var(--fade-r, 0%)), transparent);
          mask-image:linear-gradient(to right, #000 calc(100% - var(--fade-r, 0%)), transparent);
  filter:drop-shadow(0 0 1.5px rgba(241,213,149,.7)) drop-shadow(0 0 26px rgba(212,169,90,.28)) contrast(1.06) saturate(.92); }
.q-lite .hx__shot img{ filter:contrast(1.05) saturate(.92); }
.hx__streak{ position:absolute; left:0; top:0; height:3px; margin-top:-1.5px; transform-origin:0 50%;
  background:linear-gradient(to right, transparent, rgba(241,213,149,.25) 30%, rgba(255,248,225,.95) 92%, transparent);
  box-shadow:0 0 18px 4px rgba(212,169,90,.45); opacity:0; }
.hx__sparks{ position:absolute; inset:0; width:100%; height:100%; }
.hx__ring{ position:absolute; left:var(--ix); top:var(--iy); width:34vmin; height:34vmin; border-radius:50%; opacity:0;
  border:2px solid rgba(241,213,149,.75); box-shadow:0 0 30px rgba(212,169,90,.5), inset 0 0 30px rgba(212,169,90,.35);
  backdrop-filter:blur(2px) brightness(1.25); -webkit-backdrop-filter:blur(2px) brightness(1.25); }
.q-lite .hx__ring{ backdrop-filter:none; -webkit-backdrop-filter:none; }
.hx__flash{ position:absolute; inset:0; opacity:0; mix-blend-mode:screen;
  background:radial-gradient(60% 70% at var(--ix) var(--iy), rgba(255,250,232,1), rgba(241,213,149,.55) 30%, rgba(212,169,90,.1) 65%, transparent); }
.hx__hud{ position:absolute; left:0; top:0; }
.hx__cross{ position:absolute; left:-34px; top:-34px; width:68px; height:68px; --c:#f1d595;
  background:
    linear-gradient(var(--c),var(--c)) 0 0/12px 1px no-repeat, linear-gradient(var(--c),var(--c)) 0 0/1px 12px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 0/12px 1px no-repeat, linear-gradient(var(--c),var(--c)) 100% 0/1px 12px no-repeat,
    linear-gradient(var(--c),var(--c)) 0 100%/12px 1px no-repeat, linear-gradient(var(--c),var(--c)) 0 100%/1px 12px no-repeat,
    linear-gradient(var(--c),var(--c)) 100% 100%/12px 1px no-repeat, linear-gradient(var(--c),var(--c)) 100% 100%/1px 12px no-repeat; }
.hx__cross::after{ content:""; position:absolute; left:50%; top:50%; width:5px; height:5px; margin:-2.5px; border-radius:50%; background:#f1d595; box-shadow:0 0 10px #d4a95a; }
.hx__read{ position:absolute; left:46px; top:40px; display:flex; flex-direction:column; gap:4px; padding:8px 10px 9px;
  border-left:1px solid rgba(212,169,90,.6); background:linear-gradient(to right, rgba(8,9,11,.72), rgba(8,9,11,0));
  font-family:var(--label); font-size:.62rem; letter-spacing:.24em; color:rgba(241,213,149,.75); white-space:nowrap; min-width:12em; min-height:4.6em; }
.hx__hud.is-low .hx__read{ left:-24px; top:clamp(110px, 17vh, 170px); }
.hx__read b{ font-weight:600; color:#f1d595; font-size:.72rem; }
.hx-tag{ position:fixed; z-index:4; left:clamp(16px,3vw,44px); bottom:clamp(86px,13vh,120px); opacity:0; pointer-events:none;
  display:flex; flex-direction:column; gap:4px; padding-left:10px; border-left:1px solid rgba(212,169,90,.6);
  font-family:var(--label); font-size:.62rem; letter-spacing:.24em; color:rgba(241,213,149,.7); }
.hx-tag b{ font-weight:600; color:#f1d595; }
@media (max-aspect-ratio: 4/5){
  .hx__read{ left:30px; top:28px; font-size:.54rem; min-width:0; }
  .hx__hud.is-left .hx__read{ left:auto; right:46px; top:56px; border-left:0; border-right:1px solid rgba(212,169,90,.6); text-align:right; background:linear-gradient(to left, rgba(8,9,11,.72), rgba(8,9,11,0)); }
.hx__read b{ font-size:.62rem; }
  .hx__cross{ transform:scale(.7); }
  .hx-tag{ display:none; }
}
@media (prefers-reduced-motion: reduce){ .hx__smoke i{ animation:none; } }
body.is-static .hx, body.is-static .hx-tag{ display:none; }
@media (max-aspect-ratio: 4/5){ .hx__type{ font-size:21vw; } }