/* Canyon geometry is shared by live V3 and the Hero Codex. Numbers sit above it. */
.zahira-combat-canvas { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 120; }
.zahira-canyon-hit { position: absolute; inset: 0; z-index: 45; pointer-events: none; border-radius: inherit; overflow: hidden; box-shadow: inset 0 0 0 3px #e8dfb8, inset 0 0 28px #89cb6080, 0 0 22px #66b452; animation: zhCanyonHit .55s ease-out both; }
.zahira-canyon-hit::before { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 15%, #edf3c280 45%, #81ac5a55 55%, transparent 80%); }
.zahira-canyon-hit i { position: absolute; width: 75%; height: 3px; top: 35%; left: -5%; background: #eaf3ba; box-shadow: 0 0 6px #91d367; transform: rotate(34deg); }
.zahira-canyon-hit i:nth-child(2) { top: 52%; left: 25%; transform: rotate(-24deg); }
.zahira-canyon-hit i:nth-child(3) { top: 66%; left: -12%; transform: rotate(12deg); }
.zahira-canyon-hit i:nth-child(4) { top: 25%; left: 42%; width: 45%; transform: rotate(72deg); }
.zahira-canyon-orbit { position: absolute; inset: 0; pointer-events: none; z-index: 6; overflow: hidden; }
.zahira-canyon-plinth { position: absolute; bottom: 0; left: 2%; width: 96%; height: 12%; opacity: .55; background: repeating-linear-gradient(168deg, #9a805d 0 3px, #403e2c 4px 8px); clip-path: polygon(0 100%, 6% 40%, 19% 32%, 31% 54%, 43% 14%, 57% 25%, 71% 5%, 87% 33%, 100% 100%); }
.zahira-canyon-stone { position: absolute; left: calc(7% + var(--zh-orbit) * 24%); bottom: calc(6% + var(--zh-orbit) * 2%); width: 15%; aspect-ratio: 1; filter: drop-shadow(0 5px 4px #0009); animation: zhCanyonFloat 3.4s ease-in-out infinite; animation-delay: calc(var(--zh-orbit) * -.7s); }
.zahira-canyon-stone[hidden] { display: none; }
.zahira-canyon-stone::before { content: ''; position: absolute; inset: 0; clip-path: polygon(18% 5%, 66% 0, 100% 29%, 83% 84%, 38% 100%, 0 55%); background: repeating-linear-gradient(164deg, #b69a70 0 2px, transparent 3px 8px), linear-gradient(120deg, #c6af86, #6e5b44 52%, #292c22); }
.zahira-canyon-stone b { position: absolute; inset: 14% 38% 13% 25%; background: #96d077; clip-path: polygon(0 0, 30% 0, 78% 32%, 44% 53%, 100% 100%, 69% 100%, 20% 53%, 51% 31%); }
.zahira-canyon-orbit.is-full .zahira-canyon-stone { filter: drop-shadow(0 0 5px #72bc58) drop-shadow(0 6px 3px #0009); }
.zahira-canyon-orbit.is-full .zahira-canyon-plinth { box-shadow: 0 0 18px #7aba53; opacity: .85; }
@keyframes zhCanyonHit { 0% { opacity: 0; } 12% { opacity: 1; } 100% { opacity: 0; } }
.zahira-canyon-hit[data-zh-theme="akademia"] { box-shadow: inset 0 0 0 2px #e8ffd9, inset 0 0 30px #78d47960, 0 0 22px #3eb771; }
.zahira-canyon-hit[data-zh-theme="akademia"]::before { background: linear-gradient(115deg,transparent 15%,#e8ffd980 45%,#3eb77155 55%,transparent 80%); }
.zahira-canyon-hit[data-zh-theme="akademia"]::after { content: ''; position: absolute; width: 26%; aspect-ratio: .83; left: 37%; top: 23%; background: linear-gradient(140deg,#e8ffd9,#78d479 45%,#1c8b74); clip-path: polygon(50% 0,95% 20%,85% 72%,50% 100%,15% 72%,5% 20%); opacity: .65; }
.zahira-canyon-hit[data-zh-theme="akademia"] i { background: #e8ffd9; box-shadow: 0 0 6px #3eb771; }
.zahira-canyon-orbit[data-zh-theme="akademia"] .zahira-canyon-plinth { background: repeating-linear-gradient(168deg,#9ed269 0 2px,#123f35 3px 9px); opacity: .4; }
.zahira-canyon-orbit[data-zh-theme="akademia"] .zahira-canyon-stone b { inset: 0; background: #baffdc; clip-path: polygon(30% 5%, 32% 5%, 45% 25%, 42% 41%, 59% 63%, 56% 95%, 53% 97%, 55% 64%, 39% 43%, 42% 26%); filter: drop-shadow(0 0 3px #3eb771); }
.zahira-canyon-orbit[data-zh-theme="akademia"] .zahira-canyon-stone::after { content: ''; position: absolute; inset: 0; background: #78d479; clip-path: polygon(5% 28%, 40% 41%, 60% 29%, 99% 35%, 98% 38%, 60% 33%, 41% 45%, 4% 31%); filter: drop-shadow(0 0 3px #3eb771); }
.zahira-canyon-orbit[data-zh-theme="akademia"].is-full .zahira-canyon-stone { filter: drop-shadow(0 0 6px #78d479) drop-shadow(0 6px 3px #0009); }
@keyframes zhCanyonFloat { 0%, 100% { translate: 0 0; rotate: -6deg; } 50% { translate: 0 -10px; rotate: 6deg; } }
body.v3-vfx-disabled .zahira-canyon-orbit, body.v3-vfx-disabled .zahira-canyon-hit { display: none; }
body.bf-vfx-suspended .zahira-canyon-orbit * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .zahira-canyon-stone { animation: none; } .zahira-canyon-hit { animation-duration: .25s; } }

/* Everwinter: dark glacier shards, silver frost and crystalline runes. */
.zahira-canyon-hit[data-zh-theme="jeg"] { box-shadow: inset 0 0 0 2px #ecfaff, inset 0 0 30px #0c80ed88, 0 0 24px #00cee099; }
.zahira-canyon-hit[data-zh-theme="jeg"]::before { background: repeating-conic-gradient(from 15deg at 50% 45%, transparent 0 56deg, #bec7ff66 57deg 59deg, transparent 60deg), linear-gradient(120deg, transparent 18%, #00cee044 48%, #f4fbff77 51%, transparent 78%); }
.zahira-canyon-hit[data-zh-theme="jeg"]::after { content: ''; position: absolute; inset: 8%; background: linear-gradient(130deg,#f4fbff,#00cee0 55%,#0c80ed); opacity: .7; clip-path: polygon(49% 0,51% 0,51% 31%,65% 20%,68% 23%,52% 37%,52% 47%,80% 30%,77% 16%,80% 14%,84% 28%,100% 20%,100% 24%,86% 33%,98% 41%,96% 44%,81% 36%,54% 51%,82% 68%,96% 60%,98% 63%,86% 71%,100% 81%,98% 85%,83% 76%,80% 92%,77% 91%,79% 73%,52% 56%,52% 70%,67% 82%,64% 85%,52% 75%,52% 100%,48% 100%,48% 75%,34% 86%,31% 83%,48% 70%,48% 56%,21% 73%,23% 91%,20% 92%,17% 76%,2% 85%,0 81%,14% 71%,2% 63%,4% 60%,18% 68%,46% 51%,19% 36%,4% 44%,2% 41%,14% 33%,0 24%,0 20%,16% 28%,20% 14%,23% 16%,20% 30%,48% 47%,48% 37%,32% 23%,35% 20%,49% 31%); }
.zahira-canyon-hit[data-zh-theme="jeg"] i { background: #F4FBFF; box-shadow: 0 0 7px #00CEE0; height: 1px; }
.zahira-canyon-orbit[data-zh-theme="jeg"] .zahira-canyon-plinth { height: 17%; background: linear-gradient(125deg,#bec7ffbb,#001361 45%,#00cee099); clip-path: polygon(0 100%,8% 40%,15% 81%,23% 11%,33% 75%,46% 36%,54% 84%,68% 0,77% 68%,87% 24%,100% 100%); }
.zahira-canyon-orbit[data-zh-theme="jeg"] .zahira-canyon-stone::before { clip-path: polygon(50% 0,90% 26%,100% 65%,50% 100%,0 66%,10% 26%); background: conic-gradient(from 25deg at 45% 38%,#122a50,#0c80ed 65deg,#07142c 105deg,#bec7ff 185deg,#00cee0 205deg,#162c4d 250deg,#bec7ff); }
.zahira-canyon-orbit[data-zh-theme="jeg"] .zahira-canyon-stone b { inset: 22%; background: #f4fbff; clip-path: polygon(46% 0,54% 0,54% 40%,89% 20%,94% 28%,60% 48%,94% 69%,89% 77%,54% 57%,54% 100%,46% 100%,46% 57%,11% 77%,6% 69%,40% 48%,6% 28%,11% 20%,46% 40%); filter: drop-shadow(0 0 4px #00cee0); }
.zahira-canyon-orbit[data-zh-theme="jeg"].is-full .zahira-canyon-stone { filter: drop-shadow(0 0 7px #00cee0) drop-shadow(0 4px 3px #001361); }
.zahira-canyon-orbit[data-zh-theme="jeg"].is-full .zahira-canyon-plinth { box-shadow: 0 0 18px #0c80ed; }