/* ================================================================
   SOUL ANNEXED — HALLOWEEN UPDATE, PART I
   Seasonal skin for the existing main-menu shell. Navigation and
   game-flow layout remain owned by mecha-main-menu.css.
   ================================================================ */

#screen-menu.menu-mecha {
  --mm-void: #090612;
  --mm-panel: #171020;
  --mm-panel-2: #251531;
  --mm-steel: #b7a4c1;
  --mm-cyan: #ff9d3f;
  --mm-blue: #7c4dba;
  --mm-red: #ff6b1f;
  --mm-green: #b9ed58;
  --mm-ink: #fff4dd;
  --mm-muted: #b9a9c2;
  --hm-orange: #ff8a2b;
  --hm-gold: #ffc867;
  --hm-violet: #8d57cc;
  --hm-poison: #b8ef5c;
  --hm-night: #0b0714;
  background: #08050f;
}

#screen-menu .mm-backdrop {
  background:
    radial-gradient(ellipse at 50% 48%, rgba(116, 54, 135, .26), transparent 42%),
    radial-gradient(circle at 82% 14%, rgba(255, 156, 54, .16), transparent 24%),
    linear-gradient(180deg, #10091e 0%, #120b1d 46%, #08060d 100%);
}

#screen-menu .mm-backdrop::before {
  content: '';
  position: absolute;
  inset: -3%;
  background: url('../events/trick-or-treat/haunted-porch.webp') center 43% / cover no-repeat;
  opacity: .26;
  filter: saturate(.82) contrast(1.08) brightness(.72);
  transform: scale(1.035);
}

#screen-menu .mm-backdrop::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(7, 3, 13, .18), rgba(8, 4, 14, .36) 60%, rgba(5, 3, 8, .84)),
    radial-gradient(ellipse at center, transparent 24%, rgba(5, 2, 10, .62) 100%);
}

#screen-menu .mm-hangar-grid {
  opacity: .34;
  mix-blend-mode: screen;
  background:
    linear-gradient(90deg, transparent 49.85%, rgba(255, 145, 46, .15) 50%, transparent 50.15%),
    repeating-linear-gradient(90deg, transparent 0 11vw, rgba(161, 91, 190, .08) 11.05vw 11.15vw),
    repeating-linear-gradient(0deg, transparent 0 94px, rgba(255, 151, 56, .055) 95px 96px);
}

#screen-menu .mm-hangar-grid::before {
  opacity: .22;
  background:
    repeating-linear-gradient(90deg, transparent 0 8vw, rgba(255, 138, 43, .24) 8.1vw 8.2vw),
    repeating-linear-gradient(0deg, transparent 0 8vh, rgba(134, 80, 164, .25) 8.1vh 8.25vh);
}

#screen-menu .mm-hangar-grid::after {
  border-color: rgba(255, 157, 63, .12);
  box-shadow: inset 0 0 100px rgba(102, 42, 130, .12);
}

#screen-menu .mm-reactor {
  width: 5px;
  background: linear-gradient(180deg, transparent, var(--hm-orange) 26%, #fff0ba 50%, var(--hm-orange) 74%, transparent);
  box-shadow: 0 0 18px rgba(255, 138, 43, .75), 0 0 78px rgba(138, 65, 178, .38);
  opacity: .22;
}

#screen-menu .mm-zombie-bay {
  opacity: .16;
  filter: blur(.7px) saturate(.6);
  border-color: rgba(184, 239, 92, .28);
  background: linear-gradient(90deg, rgba(80, 38, 96, .16), transparent 76%);
}

#screen-menu .mm-zombie-bay i { background: #2b1939; }
#screen-menu .mm-zombie-bay i::before { box-shadow: inset 15px -3px 0 rgba(184, 239, 92, .18); }

#screen-menu .mm-smoke {
  background: radial-gradient(circle, rgba(123, 73, 147, .24), transparent 68%);
  filter: blur(30px);
}

#screen-menu .mm-scanline {
  background: linear-gradient(90deg, transparent, rgba(255, 174, 75, .24), transparent);
  box-shadow: 0 0 12px rgba(255, 122, 24, .25);
  opacity: .55;
}

#screen-menu .mm-sparks i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--hm-gold);
  color: var(--hm-gold);
  box-shadow: 0 0 10px 2px currentColor;
}

/* ---------- Moonlit scene dressing ---------- */
#screen-menu .hm-web {
  position: absolute;
  z-index: 3;
  top: -22px;
  width: 176px;
  aspect-ratio: 1;
  opacity: .5;
  background:
    repeating-radial-gradient(circle at 0 0, transparent 0 27px, rgba(255, 239, 207, .32) 28px 29px, transparent 30px 47px),
    repeating-conic-gradient(from 0deg at 0 0, rgba(255, 239, 207, .36) 0 1deg, transparent 1deg 19deg);
  mask-image: radial-gradient(circle at 0 0, #000 0 70%, transparent 72%);
}
#screen-menu .hm-web--left { left: -12px; }
#screen-menu .hm-web--right { right: -12px; transform: scaleX(-1); }

#screen-menu .hm-moon {
  position: absolute;
  z-index: 2;
  top: 6%;
  right: 12%;
  width: clamp(88px, 9vw, 142px);
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle at 67% 28%, rgba(111, 63, 98, .18) 0 8%, transparent 9%),
    radial-gradient(circle at 32% 64%, rgba(111, 63, 98, .16) 0 12%, transparent 13%),
    linear-gradient(145deg, #fff3c3, #ffbd63 65%, #e87536);
  box-shadow: 0 0 34px rgba(255, 185, 89, .4), 0 0 104px rgba(132, 75, 172, .3);
  opacity: .83;
  animation: hmMoonBreathe 6s ease-in-out infinite alternate;
}
#screen-menu .hm-moon::after {
  content: '';
  position: absolute;
  inset: 8% 8% 8% 44%;
  border-radius: 50%;
  background: #1a0f28;
  opacity: .78;
}
#screen-menu .hm-moon i,
#screen-menu .hm-moon span {
  position: absolute;
  z-index: 2;
  left: 23%;
  top: 48%;
  width: 10%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #240f2f;
  box-shadow: 18px -12px 0 -2px #240f2f;
  transform: rotate(-8deg);
}
#screen-menu .hm-moon span { left: 39%; top: 66%; transform: scale(.65); opacity: .7; }
@keyframes hmMoonBreathe { to { filter: brightness(1.12); transform: translateY(-3px); } }

#screen-menu .hm-cloud {
  position: absolute;
  z-index: 2;
  width: 34vw;
  min-width: 320px;
  height: 76px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(42, 24, 59, .78), transparent 68%);
  filter: blur(11px);
  opacity: .62;
  animation: hmCloudDrift 24s linear infinite alternate;
}
#screen-menu .hm-cloud--one { top: 9%; left: -18%; }
#screen-menu .hm-cloud--two { top: 20%; right: -16%; animation-duration: 30s; animation-direction: alternate-reverse; }
@keyframes hmCloudDrift { to { transform: translate3d(34vw, 8px, 0) scale(1.12); } }

#screen-menu .hm-bats { position: absolute; z-index: 5; inset: 0; }
#screen-menu .hm-bats i {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--s);
  height: calc(var(--s) * .42);
  border-radius: 50% 50% 10% 10%;
  background: #14091d;
  clip-path: polygon(0 25%, 28% 44%, 42% 18%, 50% 47%, 58% 18%, 72% 44%, 100% 25%, 84% 76%, 57% 62%, 50% 100%, 43% 62%, 16% 76%);
  transform-origin: 50% 48%;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,.8));
  animation: hmBatFly var(--t) ease-in-out infinite alternate, hmBatFlap .34s ease-in-out infinite alternate;
}
#screen-menu .hm-bats i:nth-child(1) { --x: 16%; --y: 17%; --s: 34px; --t: 9s; }
#screen-menu .hm-bats i:nth-child(2) { --x: 24%; --y: 10%; --s: 22px; --t: 7s; animation-delay: -2s; }
#screen-menu .hm-bats i:nth-child(3) { --x: 72%; --y: 25%; --s: 29px; --t: 11s; animation-delay: -5s; }
#screen-menu .hm-bats i:nth-child(4) { --x: 83%; --y: 14%; --s: 19px; --t: 8s; animation-delay: -3s; }
#screen-menu .hm-bats i:nth-child(5) { --x: 62%; --y: 8%; --s: 15px; --t: 10s; animation-delay: -6s; }
@keyframes hmBatFly { to { translate: 38px 18px; rotate: 7deg; } }
@keyframes hmBatFlap { to { scale: 1 .58; } }

#screen-menu .hm-ghost {
  position: absolute;
  z-index: 4;
  width: 56px;
  height: 76px;
  border-radius: 55% 55% 18% 18%;
  background: linear-gradient(180deg, rgba(200, 255, 209, .68), rgba(101, 230, 170, .08));
  box-shadow: 0 0 24px rgba(128, 255, 190, .2);
  filter: blur(.2px);
  opacity: .58;
  animation: hmGhostDrift 7s ease-in-out infinite alternate;
}
#screen-menu .hm-ghost::before,
#screen-menu .hm-ghost::after {
  content: '';
  position: absolute;
  top: 25px;
  width: 7px;
  height: 10px;
  border-radius: 50%;
  background: #1a1230;
  box-shadow: 0 0 5px rgba(184,239,92,.7);
}
#screen-menu .hm-ghost::before { left: 16px; }
#screen-menu .hm-ghost::after { right: 16px; }
#screen-menu .hm-ghost i {
  position: absolute;
  inset: auto 0 -9px;
  height: 22px;
  background: inherit;
  clip-path: polygon(0 0, 25% 42%, 50% 0, 75% 42%, 100% 0, 100% 100%, 0 100%);
}
#screen-menu .hm-ghost--left { left: 7%; top: 34%; transform: rotate(-6deg) scale(.88); }
#screen-menu .hm-ghost--right { right: 5%; top: 46%; animation-delay: -3.5s; transform: rotate(7deg) scale(.68); }
@keyframes hmGhostDrift { to { translate: 7px -22px; opacity: .32; } }

#screen-menu .hm-pumpkins {
  position: absolute;
  z-index: 7;
  bottom: 2%;
  display: flex;
  align-items: flex-end;
  gap: 7px;
  filter: drop-shadow(0 12px 11px rgba(0,0,0,.7));
}
#screen-menu .hm-pumpkins--left { left: 4%; }
#screen-menu .hm-pumpkins--right { right: 4%; transform: scale(.82); }
#screen-menu .hm-pumpkins i {
  position: relative;
  width: 58px;
  height: 46px;
  border-radius: 47% 53% 44% 46%;
  background:
    radial-gradient(ellipse at 50% 46%, transparent 0 22%, rgba(85, 25, 16, .24) 23% 29%, transparent 30%),
    repeating-linear-gradient(90deg, transparent 0 13px, rgba(116, 35, 14, .24) 14px 17px),
    linear-gradient(145deg, #ffad2e, #dd4c13 74%);
  border: 1px solid rgba(255, 191, 69, .54);
  box-shadow: inset 0 -9px 12px rgba(84, 13, 13, .32), 0 0 16px rgba(255, 100, 22, .22);
}
#screen-menu .hm-pumpkins i::before {
  content: '';
  position: absolute;
  left: 26px;
  top: -9px;
  width: 7px;
  height: 13px;
  border-radius: 5px 2px 1px 1px;
  background: #60762c;
  transform: rotate(8deg);
}
#screen-menu .hm-pumpkins i::after {
  content: '';
  position: absolute;
  inset: 15px 12px 9px;
  background: #ffe47a;
  clip-path: polygon(0 0, 27% 22%, 50% 0, 73% 22%, 100% 0, 86% 34%, 69% 28%, 65% 62%, 50% 100%, 35% 62%, 31% 28%, 14% 34%);
  opacity: .78;
  filter: drop-shadow(0 0 5px #ff9d28);
  animation: hmPumpkinFlicker 2.8s steps(2,end) infinite;
}
#screen-menu .hm-pumpkins i:nth-child(2) { width: 40px; height: 34px; transform: rotate(5deg); }
#screen-menu .hm-pumpkins i:nth-child(3) { width: 31px; height: 27px; transform: rotate(-8deg); }
@keyframes hmPumpkinFlicker { 45% { opacity: .48; filter: drop-shadow(0 0 2px #ff7b18); } }

#screen-menu .hm-fireflies { position: absolute; z-index: 6; inset: 0; }
#screen-menu .hm-fireflies i {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--hm-poison);
  box-shadow: 0 0 8px 2px rgba(184, 239, 92, .8);
  animation: hmFirefly var(--t) ease-in-out infinite alternate;
  animation-delay: var(--d);
}
#screen-menu .hm-fireflies i:nth-child(1) { --x: 10%; --y: 65%; --t: 4s; --d: -1s; }
#screen-menu .hm-fireflies i:nth-child(2) { --x: 18%; --y: 40%; --t: 5s; --d: -3s; }
#screen-menu .hm-fireflies i:nth-child(3) { --x: 31%; --y: 74%; --t: 3.4s; --d: -2s; }
#screen-menu .hm-fireflies i:nth-child(4) { --x: 42%; --y: 23%; --t: 5.5s; --d: -4s; }
#screen-menu .hm-fireflies i:nth-child(5) { --x: 57%; --y: 66%; --t: 4.3s; --d: -2.6s; }
#screen-menu .hm-fireflies i:nth-child(6) { --x: 68%; --y: 34%; --t: 4.8s; --d: -1.7s; }
#screen-menu .hm-fireflies i:nth-child(7) { --x: 78%; --y: 72%; --t: 3.8s; --d: -3.5s; }
#screen-menu .hm-fireflies i:nth-child(8) { --x: 89%; --y: 50%; --t: 5.2s; --d: -2.2s; }
#screen-menu .hm-fireflies i:nth-child(9) { --x: 94%; --y: 29%; --t: 4.6s; --d: -4.1s; }
@keyframes hmFirefly { to { transform: translate3d(15px, -22px, 0); opacity: .18; } }

#screen-menu .mm-vignette {
  z-index: 8;
  background:
    linear-gradient(180deg, rgba(7, 3, 13, .48), transparent 18%, transparent 77%, rgba(5, 2, 9, .9)),
    radial-gradient(ellipse at center, transparent 40%, rgba(4, 2, 8, .75) 100%);
}

/* ---------- Haunted interface surfaces ---------- */
#screen-menu.menu-mecha .menu-player-badge,
#screen-menu.menu-mecha .currency-item {
  border-color: rgba(255, 154, 55, .4);
  background: linear-gradient(120deg, rgba(20, 10, 30, .94), rgba(42, 20, 52, .86));
  box-shadow: 0 12px 32px rgba(4, 1, 8, .48), inset 0 1px rgba(255, 225, 176, .08);
}
#screen-menu.menu-mecha .menu-player-badge { border-left-color: var(--hm-orange); }
#screen-menu.menu-mecha .player-skull {
  border-color: rgba(255, 162, 67, .62);
  background-color: #24122d;
  box-shadow: 0 0 15px rgba(255, 126, 36, .15);
}
#screen-menu.menu-mecha .player-rank-name { color: #c7b3cb; }
#screen-menu.menu-mecha .player-xp-bar { background: rgba(139, 73, 172, .22); }
#screen-menu.menu-mecha .player-xp-fill { background: linear-gradient(90deg, var(--hm-violet), var(--hm-orange)); }
#screen-menu.menu-mecha .menu-level-badge { background: #281335; border-color: #bd723f; color: #ffe6b0; }
#screen-menu.menu-mecha .menu-language-toggle {
  border-color: rgba(255, 159, 63, .35);
  background: rgba(20, 10, 28, .88);
  color: #d8c7dc;
}

#screen-menu .mm-brand {
  border: 1px solid rgba(255, 165, 68, .44);
  border-radius: 3px 18px 3px 18px;
  padding: 8px 18px 8px 15px;
  background:
    linear-gradient(90deg, rgba(19, 8, 27, .96), rgba(53, 24, 61, .88)),
    repeating-linear-gradient(135deg, transparent 0 8px, rgba(255,255,255,.03) 8px 9px);
  box-shadow: 0 10px 35px rgba(3, 1, 7, .55), inset 0 1px rgba(255, 224, 176, .1), 0 0 18px rgba(141, 87, 204, .12);
}
#screen-menu .mm-brand::before,
#screen-menu .mm-brand::after { background: linear-gradient(90deg, var(--hm-orange), transparent 84%); }
#screen-menu .mm-brand__rail {
  background: var(--hm-orange);
  box-shadow: 0 0 15px rgba(255, 125, 26, .75);
}
#screen-menu .mm-brand__soul,
#screen-menu .mm-brand__annexed {
  font-family: 'Cinzel', serif;
  text-shadow: 0 2px 0 #260e2f, 0 0 12px rgba(255, 170, 73, .18);
}
#screen-menu .mm-brand__slash { color: var(--hm-orange); }
#screen-menu .mm-brand__season {
  color: #ffd28a;
  border-color: rgba(255, 156, 54, .38);
  background: rgba(255, 126, 29, .09);
}
#screen-menu .mm-brand__season i { background: var(--hm-poison); box-shadow: 0 0 9px var(--hm-poison); }

#screen-menu .mm-side-tools__label {
  color: #d6b9dd;
  font-family: 'Cinzel', serif;
  letter-spacing: .14em;
  text-shadow: 0 2px 4px #09030f;
}

#screen-menu.menu-mecha .mi-building:not(.mm-play) .mi-building__bob {
  border-color: rgba(180, 112, 201, .45);
  background: linear-gradient(135deg, rgba(25, 12, 34, .96), rgba(50, 23, 59, .9));
  box-shadow: 0 12px 26px rgba(4, 1, 9, .42), inset 0 1px rgba(255, 228, 183, .06);
}
#screen-menu.menu-mecha .mi-building:not(.mm-play):hover .mi-building__bob,
#screen-menu.menu-mecha .mi-building:not(.mm-play):focus-visible .mi-building__bob {
  border-color: var(--hm-orange);
  box-shadow: 0 14px 30px rgba(3, 1, 8, .54), 0 0 20px rgba(255, 128, 30, .16), inset 0 1px rgba(255,255,255,.09);
}
#screen-menu .mm-nav-icon {
  color: #ffc56f;
  border-color: rgba(255, 162, 55, .44);
  background: radial-gradient(circle at 45% 35%, rgba(255, 153, 48, .2), rgba(77, 32, 90, .7));
  box-shadow: inset 0 0 18px rgba(130, 67, 155, .2), 0 0 12px rgba(255, 135, 30, .08);
}
#screen-menu .mm-nav-icon svg { stroke: currentColor; }
#screen-menu.menu-mecha .mi-building .hut__label { color: #fff2d8; }
#screen-menu.menu-mecha .mi-building .hut__sign small { color: #bca7c3; }

#screen-menu .mm-center-console { filter: drop-shadow(0 20px 30px rgba(2, 0, 6, .38)); }
#screen-menu .mm-deck-rail {
  border-color: rgba(255, 155, 55, .38);
  background: linear-gradient(105deg, rgba(25, 11, 34, .97), rgba(55, 25, 61, .9));
  box-shadow: inset 0 1px rgba(255, 233, 195, .08), 0 12px 28px rgba(2,0,5,.38);
}
#screen-menu .mm-deck-rail:hover { border-color: var(--hm-orange); }
#screen-menu .mm-deck-rail__head b { color: #ffe1a5; }
#screen-menu .mm-deck-rail__head small,
#screen-menu .mm-deck-rail__open { color: #c5b0cb; }

#screen-menu .mm-card-stage {
  border-color: rgba(255, 164, 71, .24);
  background:
    radial-gradient(circle at 50% 48%, rgba(255, 129, 28, .14), transparent 24%),
    radial-gradient(ellipse at 50% 110%, rgba(137, 70, 167, .26), transparent 57%),
    linear-gradient(180deg, rgba(19, 8, 28, .78), rgba(9, 5, 15, .92));
  box-shadow: inset 0 0 60px rgba(93, 45, 116, .12), 0 18px 45px rgba(2,0,5,.5);
}
#screen-menu .mm-card-stage::before {
  background: radial-gradient(circle, rgba(255, 151, 47, .18), transparent 63%);
}
#screen-menu .mm-card-stage__orbit { border-color: rgba(255, 157, 63, .32); }
#screen-menu .mm-card-stage__orbit i { background: var(--hm-poison); box-shadow: 0 0 12px var(--hm-poison); }
#screen-menu .mm-card-stage__scan { border-color: rgba(255, 174, 71, .24); }
#screen-menu .mm-card-stage__plinth { background: linear-gradient(90deg, transparent, rgba(255, 139, 34, .34), transparent); }
#screen-menu .mm-featured-card { filter: drop-shadow(0 18px 18px rgba(0,0,0,.7)) drop-shadow(0 0 11px rgba(255, 125, 32, .22)); }
#screen-menu .mm-featured-card__frame { border-color: rgba(255, 164, 65, .52); }
#screen-menu .mm-featured-meta span { color: #d7bdde; }
#screen-menu .mm-featured-meta span i { background: var(--hm-poison); box-shadow: 0 0 8px var(--hm-poison); }
#screen-menu .mm-featured-meta strong { color: #fff0cf; font-family: 'Cinzel', serif; }

#screen-menu.menu-mecha .mm-play .mi-building__bob {
  border-color: #ffba59;
  background:
    linear-gradient(105deg, rgba(151, 53, 16, .98), rgba(255, 121, 25, .92) 46%, rgba(95, 37, 86, .94)),
    repeating-linear-gradient(135deg, transparent 0 8px, rgba(255,255,255,.06) 8px 9px);
  box-shadow: 0 13px 30px rgba(41, 7, 2, .5), inset 0 1px rgba(255, 242, 206, .26), 0 0 22px rgba(255, 101, 20, .2);
}
#screen-menu.menu-mecha .mm-play:hover .mi-building__bob,
#screen-menu.menu-mecha .mm-play:focus-visible .mi-building__bob {
  box-shadow: 0 16px 36px rgba(35, 5, 1, .58), inset 0 1px rgba(255,255,255,.3), 0 0 32px rgba(255, 128, 26, .36);
}
#screen-menu .mm-play__chevron {
  border-color: rgba(255, 243, 190, .68);
  background: rgba(39, 10, 42, .7);
  color: #ffe8aa;
}
#screen-menu .mm-play:hover .mm-play__chevron { background: #ffe2a4; color: #4a1626; }
#screen-menu.menu-mecha .mm-play .hut__label { color: #fff6da; text-shadow: 0 2px 0 rgba(80, 20, 13, .6); }
#screen-menu.menu-mecha .mm-play .hut__sign small { color: #ffe0a8; }
#screen-menu .mm-play__signal { background: var(--hm-poison); box-shadow: 0 0 12px var(--hm-poison); }

#screen-menu.menu-mecha .mm-social {
  border-color: rgba(168, 107, 192, .42);
  background: linear-gradient(105deg, rgba(26, 12, 35, .96), rgba(55, 25, 62, .9));
}
#screen-menu .mm-social__icon { color: #ffbc66; border-color: rgba(255, 154, 52, .42); background: rgba(255, 135, 34, .09); }
#screen-menu .mm-social__copy b { color: #fff0d0; }
#screen-menu .mm-social__copy small { color: #bda9c5; }
#screen-menu .mm-social__live { color: #d5c3d9; }
#screen-menu .mm-social__live i { background: var(--hm-poison); box-shadow: 0 0 8px var(--hm-poison); }

#screen-menu .mm-blasters__name {
  border-color: rgba(255, 159, 61, .42);
  background: linear-gradient(105deg, rgba(25, 11, 34, .94), rgba(55, 24, 59, .88));
}
#screen-menu .mm-blasters__name i { background: var(--hm-poison); box-shadow: 0 0 8px var(--hm-poison); }
#screen-menu .mm-blasters__name b { color: #ffe1a8; }
#screen-menu .mm-blasters__name small { color: #bfaac5; }
#screen-menu .mm-blasters__glow { background: radial-gradient(circle, rgba(255, 122, 27, .28), transparent 68%); }

#screen-menu.menu-mecha .daily-rewards {
  border-color: rgba(255, 154, 52, .42);
  background: linear-gradient(110deg, rgba(20, 9, 29, .95), rgba(51, 23, 59, .9));
  box-shadow: 0 15px 34px rgba(3,1,7,.5), inset 0 1px rgba(255, 226, 178, .07);
}
#screen-menu.menu-mecha .daily-rewards::before { content: 'MIDNIGHT HAUL'; color: rgba(255, 174, 78, .55); }
#screen-menu.menu-mecha .daily-rewards__kicker { color: #fff0d0; }
#screen-menu.menu-mecha .daily-rewards__kicker i { background: var(--hm-orange); box-shadow: 0 0 8px var(--hm-orange); }
#screen-menu.menu-mecha .daily-rewards__title { color: #b69ebd; }
#screen-menu.menu-mecha .daily-rewards__timer { border-color: rgba(255, 154, 54, .34); background: rgba(255, 131, 28, .08); color: #ffd493; }

/* ---------- Halloween mode picker ---------- */
#screen-menu.menu-mecha .mi-play-overlay__backdrop {
  background:
    radial-gradient(circle at 50% 28%, rgba(121, 54, 145, .34), rgba(7, 3, 12, .94)),
    repeating-linear-gradient(135deg, transparent 0 21px, rgba(255, 136, 32, .015) 22px 23px);
}
#screen-menu.menu-mecha .mi-play-panel {
  border-color: rgba(255, 155, 58, .48);
  background:
    radial-gradient(circle at 50% 0, rgba(122, 57, 142, .22), transparent 38%),
    linear-gradient(145deg, #1b0d25, #100817 68%);
  box-shadow: 0 28px 80px rgba(0,0,0,.68), inset 0 1px rgba(255, 232, 195, .1), 0 0 40px rgba(116, 55, 141, .15);
}
#screen-menu.menu-mecha .mi-play-panel::before { content: 'CHOOSE YOUR FATE // ALL HALLOWS LINK'; color: rgba(255, 173, 77, .62); }
#screen-menu .mi-play-kicker { color: var(--hm-poison); }
#screen-menu .mi-play-title { color: #fff0cf; font-family: 'Cinzel', serif; }
#screen-menu .mi-play-close { border-color: rgba(255, 159, 62, .38); color: #ffd19a; background: rgba(255, 125, 25, .08); }

#screen-menu .mi-mode-card {
  border-color: rgba(174, 109, 196, .35);
  background: linear-gradient(115deg, rgba(35, 16, 45, .96), rgba(22, 10, 30, .94));
}
#screen-menu .mi-mode-card:hover,
#screen-menu .mi-mode-card:focus-visible { border-color: var(--hm-orange); background: linear-gradient(115deg, rgba(62, 25, 68, .98), rgba(34, 14, 42, .96)); }
#screen-menu .mi-mode-card__name { color: #fff0ce; }
#screen-menu .mi-mode-card__desc { color: #baa8c0; }
#screen-menu .mi-mode-card__icon { filter: drop-shadow(0 0 10px rgba(255, 134, 30, .28)); }

@media (max-width: 720px) {
  #screen-menu .mm-backdrop::before { background-position: 50% 40%; opacity: .22; }
  #screen-menu .hm-web { width: 120px; opacity: .34; }
  #screen-menu .hm-moon { right: -18px; top: 12%; width: 100px; opacity: .52; }
  #screen-menu .hm-ghost { display: none; }
  #screen-menu .hm-pumpkins { position: fixed; bottom: 4px; opacity: .72; transform: scale(.66); transform-origin: bottom left; }
  #screen-menu .hm-pumpkins--right { transform: scale(.52); transform-origin: bottom right; }
  #screen-menu .hm-bats i:nth-child(n+4) { display: none; }
  #screen-menu .mm-brand { padding: 7px 13px 7px 11px; }
  #screen-menu .mm-side-tools__label { font-size: .49rem; }
}

@media (max-width: 380px) {
  #screen-menu .hm-pumpkins { opacity: .44; }
  #screen-menu .hm-moon { display: none; }
  #screen-menu .mm-brand__season { max-width: 135px; white-space: normal; line-height: 1.15; }
}

@media (prefers-reduced-motion: reduce) {
  #screen-menu .hm-moon,
  #screen-menu .hm-cloud,
  #screen-menu .hm-bats i,
  #screen-menu .hm-ghost,
  #screen-menu .hm-pumpkins i::after,
  #screen-menu .hm-fireflies i { animation: none !important; }
  #screen-menu .hm-bats i { transform: none !important; }
}
