/**
 * chess_shadow_wizard.css — left wizard + overlook scene (brighter)
 * v0.94.56
 */

.chess-shadow-wizard {
  position: fixed !important;
  inset: 0 !important;
  z-index: 3 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  display: block !important;
  background:
    radial-gradient(
      ellipse 95% 85% at 16% 46%,
      rgba(28, 90, 52, 0.72) 0%,
      rgba(12, 48, 28, 0.45) 30%,
      transparent 64%
    ),
    radial-gradient(
      ellipse 75% 65% at 80% 72%,
      rgba(14, 48, 30, 0.5) 0%,
      transparent 58%
    ),
    radial-gradient(
      ellipse 50% 40% at 55% 20%,
      rgba(0, 80, 48, 0.18) 0%,
      transparent 60%
    ),
    linear-gradient(
      165deg,
      #061810 0%,
      #03120a 40%,
      #052018 70%,
      #020a06 100%
    ) !important;
}

/* Distant canopy / sky wash */
.chess-shadow-wizard::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(
      180deg,
      rgba(40, 90, 60, 0.22) 0%,
      transparent 28%,
      transparent 58%,
      rgba(4, 18, 12, 0.55) 100%
    ),
    radial-gradient(
      ellipse 90% 50% at 50% 100%,
      rgba(0, 55, 32, 0.45) 0%,
      transparent 65%
    ) !important;
  opacity: 1;
  z-index: 0 !important;
}

/* Soft right-side fog */
.chess-shadow-wizard::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(
      ellipse 50% 70% at 92% 35%,
      rgba(0, 255, 136, 0.06) 0%,
      transparent 55%
    ),
    linear-gradient(
      90deg,
      transparent 0%,
      transparent 52%,
      rgba(2, 14, 8, 0.28) 100%
    ) !important;
  z-index: 0 !important;
}

/* Stone overlook / cliff shelf the wizard stands on */
.chess-scene-overlook {
  position: absolute !important;
  left: -4% !important;
  bottom: 6% !important;
  width: min(58vw, 720px) !important;
  height: min(38vh, 340px) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      168deg,
      transparent 0%,
      transparent 28%,
      rgba(36, 52, 40, 0.55) 42%,
      rgba(22, 34, 26, 0.75) 58%,
      rgba(10, 18, 12, 0.9) 100%
    ),
    radial-gradient(
      ellipse 90% 60% at 35% 70%,
      rgba(70, 95, 70, 0.45) 0%,
      rgba(20, 32, 22, 0.2) 55%,
      transparent 75%
    ) !important;
  clip-path: polygon(
    0% 42%,
    8% 38%,
    22% 44%,
    38% 36%,
    52% 42%,
    68% 34%,
    82% 48%,
    100% 40%,
    100% 100%,
    0% 100%
  ) !important;
  filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.55));
  opacity: 0.92;
  transform: perspective(600px) rotateX(8deg);
  transform-origin: bottom left;
  animation: chess-overlook-breathe 14s ease-in-out infinite;
}

/* Pedestal / plinth under wizard feet */
.chess-scene-pedestal {
  transform-origin: center bottom !important;
  position: absolute !important;
  left: 4% !important;
  bottom: 14% !important;
  width: min(28vw, 300px) !important;
  height: min(18vh, 150px) !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      180deg,
      rgba(110, 130, 100, 0.55) 0%,
      rgba(55, 72, 52, 0.75) 28%,
      rgba(28, 40, 28, 0.9) 70%,
      rgba(12, 18, 12, 0.95) 100%
    ) !important;
  border-radius: 8% 8% 4% 4% / 12% 12% 6% 6%;
  box-shadow:
    inset 0 8px 16px rgba(180, 220, 160, 0.18),
    inset 0 -10px 20px rgba(0, 0, 0, 0.45),
    0 16px 40px rgba(0, 0, 0, 0.55),
    0 0 40px rgba(0, 255, 136, 0.08);
  /* stepped plinth silhouette */
  clip-path: polygon(
    12% 0%,
    88% 0%,
    96% 18%,
    100% 100%,
    0% 100%,
    4% 18%
  ) !important;
  opacity: 0.88;
  animation: chess-pedestal-glow 10s ease-in-out infinite;
}

/* Top rim highlight on pedestal */
.chess-scene-pedestal::before {
  content: "" !important;
  position: absolute !important;
  left: 10% !important;
  right: 10% !important;
  top: 0 !important;
  height: 22% !important;
  background: linear-gradient(
    180deg,
    rgba(200, 230, 180, 0.35) 0%,
    transparent 100%
  ) !important;
  border-radius: 40%;
}

/* Moss / rune glow on overlook edge */
.chess-scene-overlook::after {
  content: "" !important;
  position: absolute !important;
  left: 8% !important;
  right: 18% !important;
  top: 38% !important;
  height: 10px !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(0, 255, 136, 0.35),
    rgba(120, 200, 100, 0.25),
    transparent
  ) !important;
  filter: blur(3px);
  opacity: 0.75;
}

/* Wizard figure — left wing, brighter */
.chess-shadow-wizard-img {
  position: absolute !important;
  left: 0 !important;
  top: 42% !important;
  width: min(88vmin, 880px) !important;
  height: min(105vmin, 1020px) !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center 8% !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  -webkit-mask-image: radial-gradient(
    ellipse 68% 76% at 40% 42%,
    #000 0%,
    #000 50%,
    rgba(0, 0, 0, 0.6) 70%,
    transparent 90%
  ) !important;
  mask-image: radial-gradient(
    ellipse 68% 76% at 40% 42%,
    #000 0%,
    #000 50%,
    rgba(0, 0, 0, 0.6) 70%,
    transparent 90%
  ) !important;
  border-radius: 0 !important;
  opacity: 0.68 !important;
  filter:
    grayscale(0.06)
    brightness(0.72)
    contrast(1.22)
    saturate(1.05)
    drop-shadow(0 0 50px rgba(0, 255, 136, 0.28))
    drop-shadow(0 24px 48px rgba(0, 0, 0, 0.55)) !important;
  transform: translate(-20%, -50%) scale(1.1) !important;
  transform-origin: center center !important;
  animation: chess-wizard-watch 12s ease-in-out infinite;
  z-index: 3 !important;
}

.chess-shadow-wizard-veil {
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  pointer-events: none !important;
  background:
    radial-gradient(
      ellipse 55% 70% at 18% 45%,
      transparent 0%,
      transparent 38%,
      rgba(2, 10, 6, 0.22) 62%,
      rgba(1, 6, 4, 0.62) 100%
    ),
    linear-gradient(
      90deg,
      rgba(1, 6, 4, 0.08) 0%,
      transparent 26%,
      transparent 50%,
      rgba(1, 8, 5, 0.38) 82%,
      rgba(1, 6, 4, 0.58) 100%
    ),
    linear-gradient(
      180deg,
      rgba(2, 12, 8, 0.28) 0%,
      transparent 20%,
      transparent 74%,
      rgba(1, 6, 4, 0.5) 100%
    ) !important;
}

body.chess-page,
body.chess-minimal {
  background-color: #03140c !important;
}

body.chess-page .chess-forge-stage,
body.chess-page .chess-stage-wide,
body.chess-minimal .chess-forge-stage,
body.chess-minimal .chess-stage-wide,
body.chess-page .chess-public-wrap,
body.chess-minimal .chess-public-wrap,
body.chess-page .arena-layout,
body.chess-minimal .arena-layout,
body.chess-page .chess-system-container,
body.chess-minimal .chess-system-container {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

body.chess-page .chess-mini-bar,
body.chess-page .chess-mini-foot {
  position: relative;
  z-index: 40 !important;
}

body.chess-page .chess-forge-stage,
body.chess-page .chess-stage-wide {
  position: relative;
  z-index: 10 !important;
}

body.chess-minimal .tactical-sidebar,
body.chess-page .tactical-sidebar,
body.chess-page .side-panel,
body.chess-page .move-history-panel {
  background: rgba(4, 18, 12, 0.82) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

body.chess-page #board-wrapper,
body.chess-minimal #board-wrapper {
  position: relative;
  z-index: 12;
}

body.chess-page #lightning-canvas.chess-lightning {
  /* superseded by chess_lightning.css — layer z=5 */
  z-index: 5 !important;
  opacity: 1 !important;
}

/* Virtual grow/shrink — whole backdrop breathes in depth */
@keyframes chess-wizard-watch {
  0%, 100% {
    opacity: 0.58;
    transform: translate(-24%, -50%) scale(1.0);
    filter:
      grayscale(0.1)
      brightness(0.64)
      contrast(1.18)
      saturate(1)
      drop-shadow(0 0 36px rgba(0, 255, 136, 0.18));
  }
  50% {
    opacity: 0.78;
    transform: translate(-16%, -52%) scale(1.22);
    filter:
      grayscale(0)
      brightness(0.82)
      contrast(1.28)
      saturate(1.12)
      drop-shadow(0 0 90px rgba(0, 255, 136, 0.38));
  }
}

@keyframes chess-overlook-breathe {
  0%, 100% {
    opacity: 0.86;
    transform: perspective(600px) rotateX(8deg) scale(1.0);
    filter: drop-shadow(0 16px 24px rgba(0,0,0,0.5));
  }
  50% {
    opacity: 0.98;
    transform: perspective(600px) rotateX(8deg) scale(1.06);
    filter: drop-shadow(0 22px 34px rgba(0,0,0,0.62));
  }
}

@keyframes chess-pedestal-glow {
  0%, 100% {
    transform: scale(1.0);
    box-shadow:
      inset 0 8px 16px rgba(180, 220, 160, 0.14),
      inset 0 -10px 20px rgba(0, 0, 0, 0.45),
      0 16px 40px rgba(0, 0, 0, 0.55),
      0 0 28px rgba(0, 255, 136, 0.06);
  }
  50% {
    transform: scale(1.08);
    box-shadow:
      inset 0 8px 18px rgba(200, 240, 180, 0.28),
      inset 0 -10px 20px rgba(0, 0, 0, 0.4),
      0 18px 44px rgba(0, 0, 0, 0.55),
      0 0 48px rgba(0, 255, 136, 0.16);
  }
}

body.forge-world-page .chess-shadow-wizard.forge-shadow-wizard .chess-shadow-wizard-img {
  left: 0 !important;
  opacity: 0.38 !important;
  transform: translate(-28%, -50%) scale(1) !important;
  animation: chess-wizard-watch-forge 18s ease-in-out infinite;
}

body.forge-world-page .chess-scene-pedestal,
body.forge-world-page .chess-scene-overlook {
  opacity: 0.45 !important;
}

@keyframes chess-wizard-watch-forge {
  0%, 100% { opacity: 0.3; transform: translate(-32%, -50%) scale(0.98); }
  50% { opacity: 0.42; transform: translate(-24%, -48%) scale(1.04); }
}

@media (max-width: 900px) {
  .chess-shadow-wizard-img {
    width: min(72vmin, 500px) !important;
    height: min(88vmin, 600px) !important;
    transform: translate(-28%, -50%) scale(1) !important;
    opacity: 0.55 !important;
    animation: none !important;
  }
  .chess-scene-pedestal {
    width: min(36vw, 200px) !important;
    left: 2% !important;
    bottom: 12% !important;
  }
  .chess-scene-overlook {
    width: min(70vw, 420px) !important;
    height: min(28vh, 200px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .chess-shadow-wizard-img,
  .chess-scene-overlook,
  .chess-scene-pedestal {
    animation: none !important;
  }
}