/* Original hydra hero, with new illustrations in the supporting sections. */
.hero{overflow:clip;background:#121513 url('artwork/hero-wuxia-v4.png') 66% center/cover;min-height:600px}
.hero:before{z-index:0;background:linear-gradient(90deg,#0b100dda,#0b100d66 36%,transparent 64%),linear-gradient(0deg,#0d0e0ddd,transparent 24%)}
.hero>.shell{position:relative;z-index:3}.hero-content{padding:82px 0 112px}
.hero #heroFire{opacity:.8}.hero #heroEmbers{opacity:.85}
.hero .phase-stamp{bottom:87px}.motion-toggle{bottom:51px}
.quick:nth-child(2){--card-art:url('artwork/silk-master-v4.png');background-position:center 31%}
.quick:nth-child(3){--card-art:url('artwork/duel-courtyard-v4.png');background-position:center 27%}
.quick:nth-child(2):hover{background-position:center 31%}.quick:nth-child(3):hover{background-position:center 27%}
.world-card.path{--world-bg:url('artwork/silk-master-v4.png');background-position:center 23%}
.world-card.clan{--world-bg:url('artwork/duel-courtyard-v4.png');background-position:center 23%}
.world-card{min-height:410px}.world-card:after{background:linear-gradient(0deg,#080c0dfc,transparent 83%)}
.community:after{display:none}
@media(min-width:1600px){.hero{min-height:660px}.hero-content{padding:105px 0 140px}}
@media(max-width:800px){.hero{background-position:61% center}.hero-content{padding:64px 0 128px}.hero:before{background:linear-gradient(90deg,#0b100dec,#0b100d88 47%,#0b100d15),linear-gradient(0deg,#0d0e0dcc,transparent 30%)}.world-card{min-height:355px}}
@media(max-width:540px){.hero{min-height:600px;background-position:80% center}.hero-content{padding:47px 0 175px}.hero:before{background:linear-gradient(90deg,#0b100df0,#0b100d99 62%,#0b100d55),linear-gradient(0deg,#0d0e0de0,transparent 33%)}.hero #heroFire{opacity:.6}.hero .phase-stamp{bottom:77px}.motion-toggle{bottom:77px}.quick:nth-child(2){background-position:53% 27%}.quick:nth-child(3){background-position:50% 24%}.world-card{min-height:375px}.world-card.path{background-position:center 22%}.world-card.clan{background-position:center 23%}}

/* Restore Heavenfall's original hydra and backdrop. */
.hero{background:#321b13 url('https://playheavenfall.com/images/hero-bg.webp') center 45%/cover}
.hero:before{background:linear-gradient(90deg,#0d0b09de,#120b085f 56%,#120b0814),linear-gradient(0deg,#0f0e0c,transparent 35%)}
.hero .dragon{z-index:0;right:3%;width:min(46%,565px);bottom:-120px;pointer-events:none}
@media(min-width:1600px){.hero .dragon{right:7%;width:610px}}
@media(max-width:1100px){.hero .dragon{right:-8%;width:60%;bottom:-75px}}
@media(max-width:800px){.hero .dragon{right:-13%;width:62%;bottom:-10px;opacity:.72}}
@media(max-width:540px){.hero{background-position:center 45%}.hero:before{background:linear-gradient(90deg,#130d09d9,#170d0866),linear-gradient(0deg,#0f0e0c,transparent 60%)}.hero .dragon{width:79%;right:-27%;bottom:-27px;opacity:.52}}
/* Smoke needs normal alpha compositing so it retains its soft charcoal tone. */
.hero #heroFire{mix-blend-mode:normal;opacity:1}
@media(max-width:540px){.hero #heroFire{opacity:.85}}

/* Anchor the mobile menu to the header after removing the preview strip. */
header{position:relative;z-index:8}
@media(max-width:800px){.nav-links{top:100%}}

/* Keep the phase caption in the hero's content flow. */
.hero .phase-stamp{position:static;max-width:none;margin-top:25px;padding-left:13px;border-left:2px solid #cba36380;text-align:left;font-size:10px;line-height:1.5;letter-spacing:1.1px}
.hero .phase-stamp span{margin-top:5px;font-size:11px;line-height:1.5;letter-spacing:.1px;color:#c4b59e}
@media(max-width:540px){.hero .phase-stamp{margin-top:22px;font-size:9px}.hero .phase-stamp span{font-size:10px}}

/* Start the scenery at the hero edge, not a fixed offset down the page. */
body{background:#0d0e0c}
main{background:none;overflow:clip}
main>.shell{position:relative;isolation:isolate}
main>.shell:before{content:"";position:absolute;z-index:-1;pointer-events:none;top:-140px;left:calc(50% - 50vw);width:100vw;height:1190px;mask-image:linear-gradient(180deg,transparent,#000 200px);background:linear-gradient(180deg,#29170daa 0%,#11171b88 34%,#0d0e0c 96%),url('artwork/mountain-journey.png') center top/cover no-repeat}
@media(max-width:540px){main>.shell:before{height:1250px;background-position:center top,61% top}}
/* One uninterrupted landscape behind the entire opening section. */
.hero-stage{position:relative;isolation:isolate;overflow:clip;padding-bottom:45px;background:#1d130e url('https://playheavenfall.com/images/hero-bg.webp') center top/cover no-repeat}
.hero-stage:after{content:"";position:absolute;inset:auto 0 0;height:150px;z-index:-1;pointer-events:none;background:linear-gradient(transparent,#0d0e0c)}
.hero-stage .hero{background:none;overflow:visible}
.hero-stage .hero:before{background:linear-gradient(90deg,#0d0b09c9,#120b0838 56%,transparent)}
.hero-stage .hero .dragon{mask-image:linear-gradient(#000 68%,transparent 99%)}
.hero-stage>#heroFire{position:absolute;inset:auto 0 0;width:100%;height:clamp(400px,55vw,660px);z-index:1;pointer-events:none;mix-blend-mode:normal;opacity:1;mask-image:linear-gradient(#000 calc(100% - 45px),transparent 100%)}
.hero-stage .hero #heroEmbers{mask-image:linear-gradient(#000 90%,transparent 100%)}
.hero-stage>.shell{position:relative;z-index:4}
main>.shell:before{top:0;height:1050px;mask-image:linear-gradient(180deg,transparent,#000 220px)}
@media(max-width:540px){.hero-stage{padding-bottom:24px;background-position:58% top}.hero-stage .hero:before{background:linear-gradient(90deg,#130d09c9,#170d0838)}main>.shell:before{height:1250px}}
/* Full account navigation in the preview's existing drawer. */
.drawer{width:380px;overflow-y:auto;overscroll-behavior:contain;padding:24px 25px 32px}
#previewAccountContent{clear:both;padding-top:22px}
.drawer .eyebrow{margin-top:0}
.drawer nav a,.drawer .account-entry{display:flex;align-items:center;gap:13px;min-height:46px;padding:12px 0;border-bottom:1px solid #cfab6424;font-size:13px;line-height:1.5}
.drawer a:hover{color:#ffe3a3;background:#b995550c}
.drawer svg{width:20px;height:20px;color:#cbae75;flex-shrink:0}
.drawer .panel-chevron,.drawer .hf-drawer-chevron{margin-left:auto;color:#b9a27b}
.drawer .hf-drawer-profile{display:flex;gap:14px;align-items:center;padding:0 0 22px;margin-bottom:17px;border-bottom:1px solid #cfab6430}
.drawer .hf-drawer-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid #b49b6644}
.drawer .hf-drawer-profile-copy strong{display:block;color:#f3dfb7;font:20px var(--font)}
.drawer .hf-drawer-profile-copy>span{display:block;font-size:11px;color:#bcae98;margin-top:6px}
.drawer .hf-drawer-panel{display:flex;align-items:center;gap:13px;border:1px solid #b49b663b;border-radius:4px;padding:15px;margin-bottom:12px;background:#211b1255}
.drawer .hf-drawer-panel small{margin:0 0 3px;font-size:9px;letter-spacing:.9px;text-transform:uppercase;color:#c4b38d}
.drawer .hf-drawer-panel strong{font-size:15px;color:#f0ca84}.drawer .hf-drawer-coins strong{font-size:23px}
.drawer .hf-drawer-panel-copy{display:flex;flex-direction:column}.drawer .hf-drawer-panel-copy>span{font-size:11px}
.drawer .hf-drawer-logout{margin-top:22px}.drawer .hf-drawer-logout button{width:100%;display:flex;gap:13px;align-items:center;padding:13px;border:1px solid #bb745c44;border-radius:3px;background:#331b1522;color:#e3a78d;font-size:12px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:540px){.drawer{width:100%;padding:20px 24px 30px}.drawer nav a{min-height:48px}}
.hero-stage:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#0d0b09c9,#120b0838 56%,transparent)}
.hero-stage .hero:before{display:none}

.hero-stage{background-image:linear-gradient(90deg,#0d0b09c9,#120b0838 56%,#120b0814),url('https://playheavenfall.com/images/hero-bg.webp')}
.hero-stage:before{display:none}
@media(max-width:540px){.hero-stage{background-image:linear-gradient(90deg,#130d09eb,#170d0899),url('https://playheavenfall.com/images/hero-bg.webp')}}