/* Rift Crawl · Halloween presentation over The Rift Run v12.17 (loaded last).
   Rules are untouched: gaps from Hex and storm become ghost hands, bridges stay whole. */

/* --- Bridges stay intact: no hidden, collapsing or fractured plates --- */
#gameScene .bridge-tile[hidden] {display:block !important;}
#gameScene .bridge-tile[data-collapsing='true'] {transform:none !important; opacity:1 !important;}
#gameScene .bridge-tile[data-collapsing='true'] > img {visibility:visible !important;}
#gameScene .bridge-tile .rear-fragments, #gameScene .bridge-tile::after {display:none !important;}
#gameScene .misstep {display:none !important;}

/* --- A gap is held by ghost hands at the walker's feet (gap sits half a step ahead) --- */
#gameScene .bridge-gap {margin-left:calc(-80% / 12); width:clamp(110px,11vw,170px); aspect-ratio:1; height:auto;
 background:url('../media/crawl-v7/ghost-hands.png') 50% 92% / 100% auto no-repeat; border:0; box-shadow:none;
 transform:translate(-50%, 19%) scaleY(var(--crawl-grip,1)); transform-origin:50% 90%; z-index:4; pointer-events:none;
 bottom:var(--lane-floor) !important; filter:drop-shadow(0 0 6px #7fe0c9);}
#gameScene .bridge-gap > * {display:none !important;}
#gameScene .bridge-gap[data-breaking='true'] {--crawl-grip:var(--break-progress,1);}
#gameScene .bridge-gap[data-state='ready'] {filter:drop-shadow(0 0 9px #ffd37a) brightness(1.15);}
#gameScene .bridge-gap[data-state='crossed'] {display:none !important;}
#gameScene .bridge-gap::before, #gameScene .bridge-gap::after {display:none !important;}

/* --- Storm: no lightning, no floating ruin; the threat is a violet ground mist marker --- */
#lightningEffects, #stormRuin {display:none !important;}
#gameScene .storm-target .storm-fissure {display:none !important;}
#gameScene .storm-target::before {inset:0 -14px; background:radial-gradient(ellipse at 50% 70%, #b07dffaa, transparent 70%) !important;
 animation:crawl-mist 2.4s ease-in-out infinite;}
@keyframes crawl-mist {0%,100% {opacity:.55; transform:scaleX(.9);} 50% {opacity:1; transform:scaleX(1.08);}}

/* --- Supports read against dark plates --- */
#gameScene .bridge-support img {filter:brightness(1.65) saturate(1.1) drop-shadow(0 0 6px #0008);}

/* --- Portal light takes the colour of the next world: coral -> violet -> gold --- */
.team[data-stage='1'] {--crawl-gate:#ff7a52;} .team[data-stage='2'] {--crawl-gate:#b77cff;} .team[data-stage='3'] {--crawl-gate:#ffc35a;}
#gameScene .portal-membrane, #gameScene .portal-runes {background:var(--crawl-gate,#ff7a52) !important;}
#gameScene .portal-runes {filter:drop-shadow(0 0 6px var(--crawl-gate,#ff7a52)) brightness(1.4);}

/* --- Boo! Grab: a ghost flies instead of the hex rune; the impact is a ghostly puff --- */
#gameScene .hex-shot {width:clamp(54px,5.5vw,84px); height:clamp(54px,5.5vw,84px); background-image:url('../media/crawl-v7/ghost-flight.png') !important;
 transform:translate(-50%,-50%) !important; filter:drop-shadow(0 0 8px #9ff0d8);}
#gameScene .hex-shot::before, #gameScene .hex-shot::after {display:none !important;}
#gameScene .hex-burst {border:0 !important; box-shadow:none !important;}
#gameScene .hex-burst i {background-image:url('../media/crawl-v7/ghost-burst.png') !important;}
#gameScene .hex-burst[data-blocked='true'] i {filter:hue-rotate(200deg) saturate(1.4);}

/* --- Ghost Bell replaces the ward shield: small, swinging, beside the shoulder --- */
#gameScene .world-figure .ward {width:34% !important; height:34% !important; transform:translate(-10%,-120%) scale(var(--ward-grow,1)) !important;
 background:url('../media/crawl-v7/ghost-bell.png') 0 0 / 1200% 100% no-repeat; animation:crawl-bell 1.1s steps(11) infinite alternate !important;}
#gameScene .world-figure .ward img, #gameScene .world-figure .ward i {display:none !important;}
@keyframes crawl-bell {from {background-position:0 0;} to {background-position:100% 0;}}

/* --- Power buttons: Candy Dash, Boo! Grab, Ghost Bell, Moon Hop --- */
#dashA {--power-art:url('../media/crawl-v7/icon-dash-A.png');} #dashB {--power-art:url('../media/crawl-v7/icon-dash-B.png');}
#hexA {--power-art:url('../media/crawl-v7/icon-hex-A.png');} #hexB {--power-art:url('../media/crawl-v7/icon-hex-B.png');}
#shieldA,#shieldB,#rushA,#rushB {background-repeat:no-repeat;background-position:center;background-size:auto 88%;}
#shieldA {background-image:url('../media/crawl-v7/icon-shield-A.png');} #shieldB {background-image:url('../media/crawl-v7/icon-shield-B.png');}
#rushA {background-image:url('../media/crawl-v7/icon-rush-A.png');} #rushB {background-image:url('../media/crawl-v7/icon-rush-B.png');}
#shieldA svg,#shieldB svg,#rushA svg,#rushB svg {opacity:0;}
.cast-rune {background-image:url('../media/crawl-v7/icon-hex-A.png') !important;}
.team-b .cast-rune {background-image:url('../media/crawl-v7/icon-hex-B.png') !important;}
.team .binding {background-image:url('../media/crawl-v7/ghost-hands.png') !important; opacity:.0 !important;}

/* --- Power glyph flash above the walker: our four icons instead of the rune outlines --- */
.power-glyph svg {opacity:0;}
.power-glyph {background:center/contain no-repeat;}
.team-a .power-glyph[data-power='dash'] {background-image:url('../media/crawl-v7/icon-dash-A.png');} .team-b .power-glyph[data-power='dash'] {background-image:url('../media/crawl-v7/icon-dash-B.png');}
.power-glyph[data-power='hex'] {background-image:url('../media/crawl-v7/icon-hex-A.png'); filter:drop-shadow(0 0 12px #9ff0d8) !important;}
.power-glyph[data-power='shield'] {background-image:url('../media/crawl-v7/icon-shield-A.png'); filter:drop-shadow(0 0 12px #d9ecff) !important;}
.team-a .power-glyph[data-power='rush'] {background-image:url('../media/crawl-v7/icon-rush-A.png');} .team-b .power-glyph[data-power='rush'] {background-image:url('../media/crawl-v7/icon-rush-B.png');}

/* --- Team colours: Groggy mint, Grumble violet (replaces Moonward blue / Dawnfire red) --- */
.team-a, .team.team-a {--accent:#8fdcb4;}
.team-b, .team.team-b {--accent:#bf9dff;}
.team-a .streak-aura {--accent:#8fdcb4 !important;} .team-b .streak-aura {--accent:#c9a8ff !important;}
.rivalry {--moon:#8fdcb4 !important; --dawn:#b98cff !important;}
#hub .game-node[data-winner='A'] .node-orb {box-shadow:0 0 0 3px #8fdcb4aa, 0 0 14px #8fdcb466 !important;}
#hub .game-node[data-winner='B'] .node-orb {box-shadow:0 0 0 3px #b98cffaa, 0 0 14px #b98cff66 !important;}
#hub .game-node[data-winner='A'] .node-sub[data-score='true'] {color:#b9f0d2 !important;}
#hub .game-node[data-winner='B'] .node-sub[data-score='true'] {color:#dcc8ff !important;}
.phase-overlay[data-phase='final'][data-winner='A'] .phase-card h2 {color:#c6f5da !important;}
.phase-overlay[data-phase='final'][data-winner='B'] .phase-card h2 {color:#e2d1ff !important;}
.victory-moment {--win:#8fdcb4 !important; --win-deep:#0c2a20 !important; --win-light:#e2fff0 !important;}
.victory-moment[data-winner='B'] {--win:#bf9dff !important; --win-deep:#22103d !important; --win-light:#f0e6ff !important;}
.faction-banner::before {background:linear-gradient(90deg,#d8f5e6 0 3%,transparent 3% 97%,#d8f5e6 97%),
  linear-gradient(90deg,#071d17,#145a45 26%,#1f7d61 50%,#13513f 76%,#071d17) !important;}
.faction-banner[data-team='B']::before {background:linear-gradient(90deg,#e8c46f 0 3%,transparent 3% 97%,#e8c46f 97%),
  linear-gradient(90deg,#140726,#3b1a6e 26%,#5a2ea0 50%,#371866 76%,#140726) !important;}
.faction-banner img {border-radius:50%;}

/* --- Tutorial: our power icons, and ghost hands on an intact stone in the mist scene --- */
.tutorial-power-icon svg {opacity:0;}
.tutorial-power-icon {background:center/contain no-repeat;}
.tutorial-dialog[data-chapter='dash'] .tutorial-power-icon {background-image:url('../media/crawl-v7/icon-dash-A.png');}
.tutorial-dialog[data-chapter='hex'] .tutorial-power-icon {background-image:url('../media/crawl-v7/icon-hex-A.png');}
.tutorial-dialog[data-chapter='shield'] .tutorial-power-icon {background-image:url('../media/crawl-v7/icon-shield-A.png');}
.tutorial-dialog[data-chapter='rush'] .tutorial-power-icon {background-image:url('../media/crawl-v7/icon-rush-A.png');}
.tutorial-demo-path>#tutorialStoneMiddle[hidden] {visibility:visible !important;}
.tutorial-broken-stone {border:0 !important; box-shadow:none !important; color:transparent !important; height:calc(70px * var(--tu)) !important; bottom:calc(4px * var(--tu)) !important;
 background:url('../media/crawl-v7/ghost-hands.png') 50% 92% / 130% auto no-repeat; filter:drop-shadow(0 0 6px #7fe0c9);}
.tutorial-dialog[data-focus='gap'] .tutorial-broken-stone {filter:drop-shadow(0 0 10px #f5dfa3);}

/* --- Candy Dash trail: pastel candy streaks instead of the wind rune --- */
.world-figure .magic-trail {background:linear-gradient(90deg,transparent,#ffb4c455 30%,#fff1f555 50%,#b9f2d855 70%,transparent) center/100% 38% no-repeat !important; filter:blur(1px);}
.team-b .world-figure .magic-trail {background:linear-gradient(90deg,transparent,#ffb4c455 30%,#fff1f555 50%,#d7c2ff55 70%,transparent) center/100% 38% no-repeat !important;}
#shieldA,#shieldB {background-size:auto 88% !important;}

/* --- Remaining team-coloured details: result medals, flashes, rivalry, trophies, round table --- */
.phase-overlay[data-race-winner='A'] {--race-win:#8fdcb4 !important;} .phase-overlay[data-race-winner='B'] {--race-win:#bf9dff !important;}
.goal-flash[data-team='A'] {background:radial-gradient(circle at var(--fx,90%) var(--fy,50%),#ffffff 0,#d9fbe9 calc(4% + var(--flash,0)*30%),#8fdcb466 calc(10% + var(--flash,0)*55%),transparent calc(18% + var(--flash,0)*80%)) !important;}
.goal-flash[data-team='B'] {background:radial-gradient(circle at var(--fx,90%) var(--fy,50%),#ffffff 0,#ece0ff calc(4% + var(--flash,0)*30%),#bf9dff66 calc(10% + var(--flash,0)*55%),transparent calc(18% + var(--flash,0)*80%)) !important;}
.award-medal {background:linear-gradient(160deg,#1f6b51,#0b2a20) !important; box-shadow:inset 0 0 0 2px #a8f0cc4d,0 4px 10px #0008 !important;}
.award-medal[data-team='B'] {background:linear-gradient(160deg,#4f2b8a,#1e0f3a) !important; box-shadow:inset 0 0 0 2px #d6c0ff4d,0 4px 10px #0008 !important;}
.overtake-sweep {--win:#9fe6c2 !important;} .overtake-sweep[data-team='B'] {--win:#c9a8ff !important;}
.power-target[data-team='B'] {color:#d8c4ff !important;}
.round-team[data-team='A'] th {color:#c6f5da !important;} .round-team[data-team='B'] th {color:#e2d1ff !important;}
.rivalry .rv-a[data-lead='true'] .rv-total {color:#d2f8e4 !important; text-shadow:0 0 14px #8fdcb499 !important;}
.rivalry .rv-b[data-lead='true'] .rv-total {color:#eadcff !important; text-shadow:0 0 14px #b98cff99 !important;}
.trophy-house {background:#0d2a21cc !important; box-shadow:inset 0 0 0 1px #8fdcb455 !important;}
.trophy-house[data-team='B'] {background:#1d1233cc !important; box-shadow:inset 0 0 0 1px #bf9dff55 !important;}

/* v9 living world: back = behind the bridges, mid = on the decks behind the runners, front = brief close-ups */
#crawlBack{z-index:0}
#crawlMid{z-index:2}
#crawlFront{z-index:5}
#gameScene[data-motion='reduced'] #crawlFront{display:none}

/* Keep the race sprites out of the backdrop while setup is open. */
#gameScene:has(~ #setupOverlay:not([hidden])) .world-figure{visibility:hidden}

/* The grove frames the portraits and fades behind the menu controls. */
#hub[data-view='home']{
  background:
    linear-gradient(180deg,#09151d12,#09151d26 36%,#09151d80 62%,#09151db3),
    #10232e url('../media/crawl-v9/menu/moonlit-grove.webp') center top/cover no-repeat;
}

/* The painted rivals trade a sleepy nod and an impatient lean. */
.crawl-duo{
  --duo-height:clamp(130px,24vh,258px);
  position:relative;isolation:isolate;display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:end;gap:clamp(3px,1vw,14px);
  align-self:center;width:min(100%,440px);flex:none;margin:0 0 6px;
}
.crawl-duo::before{
  content:'';position:absolute;inset:12% -4% 12%;z-index:-1;
  background:radial-gradient(ellipse at 27% 53%,#5fa88c37,transparent 47%),
             radial-gradient(ellipse at 73% 53%,#8c6ab538,transparent 47%);
  animation:crawl-duo-light 8s ease-in-out infinite;
}
.crawl-duo figure{min-width:0;margin:0;display:grid;justify-items:center}
.crawl-duo .duo-portrait{
  position:relative;width:min(100%,calc(var(--duo-height) * var(--portrait-ratio,.801)));
  mask-image:linear-gradient(#000 87%,transparent 100%);
  transform-origin:50% 90%;animation:crawl-groggy-nod 8s ease-in-out infinite;
}
.crawl-duo :where(.duo-b) .duo-portrait{--portrait-ratio:.837;transform:scaleX(-1);animation-name:crawl-grumble-lean}
.crawl-duo img{display:block;width:100%;height:auto}
.crawl-duo .duo-expression{
  position:absolute;inset:0;opacity:0;
  mask-image:radial-gradient(ellipse 21% 10% at 63% 23%,#000 65%,transparent);
  animation:crawl-groggy-blink 8s linear infinite;
}
.crawl-duo :where(.duo-b) .duo-expression{
  mask-image:radial-gradient(ellipse 20% 10% at 51% 20%,#000 65%,transparent);
  animation-name:crawl-grumble-brow;
}
.crawl-duo figcaption{font:700 13px/1.35 Georgia,serif;letter-spacing:.14em;text-transform:uppercase;color:#9ee1ba;text-shadow:0 0 10px #8fdcb466}
.crawl-duo .duo-b figcaption{color:#d0b4ff;text-shadow:0 0 10px #bf9dff66}
.crawl-duo .duo-vs{align-self:center;font:italic 900 clamp(19px,3vh,32px)/1 Georgia,serif;color:#ffc35a;text-shadow:0 0 14px #ff8a3d99,0 2px 0 #0008}
@keyframes crawl-groggy-nod{
  0%,18%,58%,100%{rotate:0deg;translate:0 0}
  38%{rotate:3deg;translate:0 3px}
}
@keyframes crawl-grumble-lean{
  0%,39%,80%,100%{rotate:0deg;translate:0 0}
  54%,62%{rotate:-4deg;translate:-2px 0}
}
@keyframes crawl-groggy-blink{0%,35%,40%,100%{opacity:0}36%,39%{opacity:1}}
@keyframes crawl-grumble-brow{0%,48%,66%,100%{opacity:0}53%,61%{opacity:1}}
@keyframes crawl-duo-light{0%,100%{opacity:.72}50%{opacity:1}}
#gameScene[data-motion='reduced'] ~ #setupOverlay .crawl-duo :is(.duo-portrait,.duo-expression),
#gameScene[data-motion='reduced'] ~ #setupOverlay .crawl-duo::before{animation:none}
@media (prefers-reduced-motion:reduce){
  .crawl-duo :is(.duo-portrait,.duo-expression),.crawl-duo::before{animation:none}
}
@media (max-height:580px){
  #hub[data-view='home']{
    background-image:linear-gradient(180deg,#09151d1a,#09151d55 36%,#09151dd9 78%),url('../media/crawl-v9/menu/moonlit-grove.webp');
  }
  #hub[data-empty='true'] .hub-home{justify-content:flex-start}
  .crawl-duo{--duo-height:clamp(96px,24vh,150px)}
}

/* v11 power art (blender/render_fx_v11.py): 3D sheet ghost for Boo! Grab, its BOO! burst, a bigger Ghost Bell */
#gameScene .hex-shot {width:clamp(84px,8.4vw,132px); height:clamp(84px,8.4vw,132px); background-image:url('../media/crawl-v9/ghost-flight-v11.png') !important;
 filter:drop-shadow(0 0 6px #d9fff1) drop-shadow(0 0 14px #9a6bff) !important;}
#gameScene .hex-burst i {inset:-70% !important; background-image:url('../media/crawl-v9/ghost-boo-v11.png') !important; filter:drop-shadow(0 0 8px #c8ffe9) drop-shadow(0 0 16px #a070ff) !important;}
#gameScene .hex-burst[data-blocked='true'] i {filter:saturate(.35) brightness(1.25) drop-shadow(0 0 10px #ffd27a) !important;}
#gameScene .world-figure .ward {width:40% !important; height:40% !important; transform:translate(-8%,-128%) scale(var(--ward-grow,1)) !important;
 background-image:url('../media/crawl-v9/ghost-bell-v11.png') !important; filter:drop-shadow(0 0 6px #ffe1a0) drop-shadow(0 0 12px #c58bff);}

/* --- Gefahr je Welt (12.11.2026): in drei Welten fliegt ein Geschoss auf die Platte (lightning.js THEMES) --- */
#gameScene[data-world='moonlit-manor'] #lightningEffects, #gameScene[data-world='cauldron-caves'] #lightningEffects,
#gameScene[data-world='ghost-ship-cove'] #lightningEffects {display:block !important;}
#gameScene[data-world='cauldron-caves'] .storm-target::before {background:radial-gradient(ellipse at 50% 70%, #8dff6aaa, transparent 70%) !important;}
#gameScene[data-world='ghost-ship-cove'] .storm-target::before {background:radial-gradient(ellipse at 50% 70%, #ffc27aaa, transparent 70%) !important;}
#gameScene[data-world='moonlit-manor'] .storm-target::before {background:radial-gradient(ellipse at 50% 70%, #d8ccffaa, transparent 70%) !important;}