/* HELL-MU V13.4 – REAL SIDE CLOUDS / FOG and readable real-letter logo glow.
   Targeted assets only. CSS/JS same paths as V13.3. No PHP or CMS modifications. */
html body.hell-theme.hell35-theme .masthead .hell-v13-effects{
 position:absolute!important;display:block!important;overflow:hidden!important;
 margin:0!important;padding:0!important;border:0!important;background:transparent!important;
 pointer-events:none!important;user-select:none!important;z-index:14!important;transform:none!important;
}
.hell-v13-effects *, .hell-v13-effects *::before,.hell-v13-effects *::after{box-sizing:border-box!important;pointer-events:none!important}
/* Instead of anchoring clouds to the small central 1400x425 artwork,
   make a viewport-wide overlay BELOW .page-shell (z-index 4), over BODY scenery. */
html body.hell-theme.hell35-theme > .hell-v134-sky{
 position:absolute!important;left:0!important;width:100%!important;
 z-index:3!important;overflow:hidden!important;pointer-events:none!important;
 user-select:none!important;margin:0!important;padding:0!important;
 background:transparent!important;isolation:isolate!important;
}
.hell-v134-sky .hell-v134-cloud{
 position:absolute;display:block;pointer-events:none;
 background:url('../images/hell-v134-clouds.png') center / 100% 100% no-repeat;
 mix-blend-mode:screen;
 -webkit-mask-image:radial-gradient(ellipse 77% 65% at 50% 49%,#000 40%,transparent 100%);
 mask-image:radial-gradient(ellipse 77% 65% at 50% 49%,#000 40%,transparent 100%);
 will-change:transform,opacity;
}
/* upper sky where dark storm clouds already exist, with visible but slow lateral motion */
.hell-v134-sky .hell-v134-upper{top:12px;width:33%;height:247px;opacity:.82;
 filter:brightness(1.35) contrast(1.17) saturate(.69);}
.hell-v134-sky .hell-v134-upper.hell-v134-left{left:10%;animation:hell-v134-sky-left 24s ease-in-out infinite alternate}
.hell-v134-sky .hell-v134-upper.hell-v134-right{right:10%;animation:hell-v134-sky-right 30s ease-in-out infinite alternate}
/* foreground low fog in the wide background, not in front of the logo */
.hell-v134-sky .hell-v134-fog{top:300px;width:39%;height:265px;opacity:.77;
 filter:brightness(1.03) saturate(.65) blur(1.9px);}
.hell-v134-sky .hell-v134-fog.hell-v134-left{left:3%;animation:hell-v134-fog-left 33s ease-in-out infinite alternate}
.hell-v134-sky .hell-v134-fog.hell-v134-right{right:3%;animation:hell-v134-fog-right 38s ease-in-out infinite alternate}
@keyframes hell-v134-sky-left{
 0%{transform:translate3d(-55px,1px,0) scale(1.04);opacity:.46}
 45%{transform:translate3d(8px,-5px,0) scale(1.1);opacity:.93}
 100%{transform:translate3d(53px,5px,0) scale(1.05);opacity:.69}}
@keyframes hell-v134-sky-right{
 0%{transform:translate3d(50px,0,0) scaleX(-1) scale(1.02);opacity:.51}
 49%{transform:translate3d(-5px,-6px,0) scaleX(-1) scale(1.11);opacity:.9}
 100%{transform:translate3d(-55px,3px,0) scaleX(-1) scale(1.04);opacity:.71}}
@keyframes hell-v134-fog-left{
 0%{transform:translate3d(-65px,13px,0) scale(1.1);opacity:.53}
 55%{transform:translate3d(22px,0px,0) scale(1.07);opacity:.94}
 100%{transform:translate3d(67px,-13px,0) scale(1.12);opacity:.68}}
@keyframes hell-v134-fog-right{
 0%{transform:translate3d(65px,10px,0) scaleX(-1) scale(1.08);opacity:.54}
 55%{transform:translate3d(-23px,-7px,0) scaleX(-1) scale(1.11);opacity:.96}
 100%{transform:translate3d(-63px,-10px,0) scaleX(-1) scale(1.06);opacity:.67}}
/* glow specifically pinned to the ORIGINAL rendered image coordinates; no logo duplicate */
.hell-v13-effects .hell-v13-logo-halo,
.hell-v13-effects .hell-v13-logo-glint{
 position:absolute!important;inset:0!important;display:block!important;
 -webkit-mask-image:url('../images/hell-v134-logo-mask.png')!important;
 mask-image:url('../images/hell-v134-logo-mask.png')!important;
 -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
 -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
 -webkit-mask-position:0 0!important;mask-position:0 0!important;
 mix-blend-mode:screen!important;
}
.hell-v13-effects .hell-v13-logo-halo{
 background:linear-gradient(90deg,#e65a1d,#ffedb5 40%,#fff3d6 52%,#e65b24)!important;
 opacity:.65;filter:drop-shadow(0 0 8px rgba(255,80,20,.95))!important;
 animation:hell-v134-halo 4.8s ease-in-out infinite!important;
}
@keyframes hell-v134-halo{0%,100%{opacity:.42}40%{opacity:.84}62%{opacity:1}82%{opacity:.62}}
.hell-v13-effects .hell-v13-logo-glint{
 opacity:0;background:linear-gradient(110deg,transparent 37%,rgba(255,246,209,.2) 44%,
 rgba(255,255,255,1) 49%,rgba(255,235,172,.7) 52%,transparent 62%)!important;
 background-size:220% 100%!important;background-position:100% 0;
 animation:hell-v134-glint 6.5s linear infinite!important;
}
@keyframes hell-v134-glint{
 0%,12%,100%{opacity:0;background-position:100% 0}
 18%{opacity:1;background-position:85% 0}
 42%{opacity:1;background-position:10% 0}
 49%{opacity:0;background-position:0% 0}
 50%,99%{opacity:0;background-position:100% 0}}
/* eyes & ruby: clear but never move actual image */
.hell-v13-effects .hell-v13-eye{
 position:absolute;top:33.9%;width:2.15%;height:7%;border-radius:50%;
 transform:translate(-50%,-50%);pointer-events:none;
 background:radial-gradient(ellipse,rgba(255,244,199,.96),rgba(255,84,23,.75) 23%,rgba(255,28,4,.45) 49%,transparent 80%);
 filter:blur(.6px);opacity:.65;mix-blend-mode:screen;animation:hell-v134-eye 5.2s ease-in-out infinite;
}
.hell-v13-effects .hell-v13-eye-left{left:48.95%}.hell-v13-effects .hell-v13-eye-right{left:50.7%;animation-delay:-.17s}
@keyframes hell-v134-eye{0%,100%{opacity:.35}36%{opacity:.85}55%{opacity:1}74%{opacity:.56}}
.hell-v13-effects .hell-v13-diamond{
 position:absolute;left:49.66%;transform:translate(-50%,-50%);border-radius:50%;
 background:radial-gradient(ellipse,rgba(255,241,190,.97),rgba(255,77,24,.8) 20%,rgba(255,23,10,.5) 48%,transparent 82%);
 filter:blur(1px);opacity:.49;mix-blend-mode:screen;animation:hell-v134-ruby 5.3s ease-in-out infinite;
}
.hell-v13-effects .hell-v132-diamond-upper{top:62.8%;width:5%;height:14%}
.hell-v13-effects .hell-v132-diamond-lower{top:87%;width:5.4%;height:14%;animation-delay:-2.4s}
@keyframes hell-v134-ruby{0%,100%{opacity:.35}45%{opacity:.92}60%{opacity:1}80%{opacity:.52}}
.hell-v13-effects .hell-v13-ember{
 position:absolute;left:var(--x);top:var(--y);width:var(--sz);height:var(--sz);
 background:radial-gradient(circle,#fff3cf 0%,rgba(255,138,39,.97) 26%,rgba(247,44,7,.36) 65%,transparent 80%);
 box-shadow:0 0 6px 1px rgba(255,65,20,.55);border-radius:50%;opacity:0;
 animation:hell-v134-ember var(--dur) linear infinite;animation-delay:var(--delay);
}
@keyframes hell-v134-ember{
 0%{opacity:0;transform:translate3d(0,9px,0) scale(.75)}
 20%{opacity:.96}70%{opacity:.77}
 100%{opacity:0;transform:translate3d(var(--drift),-90px,0) scale(.2)}}

/* Preserved V13.2 ranking layout fixes. Rank tabs, dynamic data and links remain functional. The bottom band
   was the horizontal browser scrollbar caused by overflow-x:auto in hell-v11.css. */
html body.hell-theme.hell35-theme #hell-live-rank-panel .hell-live-rank{
  overflow-x:clip!important;overflow-y:visible!important;
  scrollbar-width:none!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  box-sizing:border-box!important;
  padding:9px 10px 14px!important;
}
html body.hell-theme.hell35-theme #hell-live-rank-panel .hell-live-rank::-webkit-scrollbar{
  display:none!important;height:0!important;width:0!important;
}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players table,
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_guilds table{
  width:100%!important;max-width:100%!important;min-width:0!important;
  table-layout:fixed!important;border-collapse:collapse!important;
  margin:0 auto!important;
}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players :is(th,td),
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_guilds :is(th,td){
  text-align:center!important;vertical-align:middle!important;
  box-sizing:border-box!important;min-width:0!important;
  white-space:normal!important;overflow-wrap:anywhere!important;
  padding:8px 5px!important;
}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players :is(th,td):nth-child(1){width:18%!important}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players :is(th,td):nth-child(2){width:34%!important}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players :is(th,td):nth-child(3){width:24%!important}
html body.hell-theme.hell35-theme #hell-live-rank-panel #top_players :is(th,td):nth-child(4){width:24%!important}
html body.hell-theme.hell35-theme #hell-live-rank-panel :is(.sidebar_rank,.rank-table) a{
  overflow-wrap:anywhere!important;
}

body.fx-off .hell-v13-effects,body.fx-off .hell-v134-sky{display:none!important}
@media(max-width:760px){.hell-v134-sky .hell-v134-cloud{opacity:.25;filter:blur(2px)}
 .hell-v13-effects .hell-v13-ember-extra{display:none!important}}
@media(prefers-reduced-motion:reduce){body .hell-v13-effects,body .hell-v134-sky{display:none!important}}


/* HELL-MU V13.6 — TRUE ALPHA MASK (the V13.5 PNG was opaque everywhere).
   Source: approved HELL-MU letters, no replacing artwork or touching header layout.
   Uses the existing V13.5 overlay nodes; retains all cloud/eye/ruby/ranking effects. */
html body.hell-theme.hell35-theme .masthead .hell-v13-effects{
 z-index:18!important;isolation:isolate!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-halo{
 background:url('../images/hell-v136-wordmark-glow.png') center/100% 100% no-repeat!important;
 -webkit-mask-image:none!important;mask-image:none!important;
 opacity:.8;mix-blend-mode:screen!important;
 filter:drop-shadow(0 0 6px rgba(255,70,22,.9))!important;
 animation:hell-v136-glow 4.9s ease-in-out infinite!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v135-wordlight{
 display:block!important;position:absolute!important;inset:0!important;
 background:url('../images/hell-v136-wordmark-light.png') center/100% 100% no-repeat!important;
 opacity:.8;filter:none!important;
 mix-blend-mode:screen!important;
 animation:hell-v136-core 4.9s ease-in-out infinite!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-glint{
 display:block!important;position:absolute!important;inset:0!important;
 -webkit-mask-image:url('../images/hell-v136-wordmark-alpha.png')!important;
 mask-image:url('../images/hell-v136-wordmark-alpha.png')!important;
 -webkit-mask-mode:alpha!important;mask-mode:alpha!important;
 -webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;
 -webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;
 -webkit-mask-position:0 0!important;mask-position:0 0!important;
 background-image:linear-gradient(90deg,rgba(255,255,255,0),
 rgba(255,211,116,.19) 22%,rgba(255,248,219,.94) 45%,
 rgba(255,255,255,1) 50%,rgba(255,235,168,.94) 56%,
 rgba(255,255,255,0) 100%)!important;
 background-size:20% 100%!important;
 background-repeat:no-repeat!important;
 background-position:16% 0;
 opacity:0;mix-blend-mode:screen!important;
 filter:none!important;
 animation:hell-v136-sheen 6.8s linear infinite!important;
}
@keyframes hell-v136-glow{
 0%,100%{opacity:.5}38%{opacity:.96}56%{opacity:1}75%{opacity:.72}
}
@keyframes hell-v136-core{
 0%,100%{opacity:.36}36%{opacity:.85}53%{opacity:1}75%{opacity:.61}
}
@keyframes hell-v136-sheen{
 0%,12%{opacity:0;background-position:16% 0}
 19%{opacity:1;background-position:25% 0}
 39%{opacity:1;background-position:82% 0}
 46%,100%{opacity:0;background-position:100% 0}
}
/* Respect accessible reduced motion while retaining a static readable wordmark. */
@media (prefers-reduced-motion:reduce){
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-halo,
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v135-wordlight{animation:none!important;opacity:.33!important;}
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-glint{animation:none!important;opacity:0!important;}
}

/* HELL-MU V13.7 PROFILE B — WYWAŻONY; affects ONLY HELL-MU wordmark light.
   No changes to header layout, clouds, eyes, ruby, ranking or slider.
   The original graphics are unmodified. */
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-halo{
 animation:hell-v137-B-halo 7.6s ease-in-out infinite!important;
 filter:drop-shadow(0 0 3px rgba(245,76,30,.55))!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v135-wordlight{
 animation:hell-v137-B-core 7.6s ease-in-out infinite!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-glint{
 animation:hell-v137-B-sweep 8.4s linear infinite!important;
 background-size:13% 100%!important;
}
@keyframes hell-v137-B-halo{
 0%,100%{opacity:0.17} 35%{opacity:0.34} 52%{opacity:0.43} 75%{opacity:0.23}
}
@keyframes hell-v137-B-core{
 0%,100%{opacity:0.13} 36%{opacity:0.27} 53%{opacity:0.34} 76%{opacity:0.18}
}
@keyframes hell-v137-B-sweep{
 0%,12%,100%{opacity:0;background-position:0% 0}
 19%{opacity:0.58;background-position:16% 0}
 39%{opacity:0.58;background-position:86% 0}
 46%{opacity:0;background-position:100% 0}
}
/* Preserve accessibility choice: no animation if reduced motion is requested. */
@media (prefers-reduced-motion:reduce){
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-halo{animation:none!important;opacity:.16!important}
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v135-wordlight{animation:none!important;opacity:.11!important}
 html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-glint{animation:none!important;opacity:0!important}
}

/* V13.8: Definitive wordmark animation without JS overlays.
   The approved V6 image is the base; animated WebP changes ONLY the metallic lettering.
   We intentionally disable *all* diamond and legacy wordmark glow overlays.
   No new light for upper/lower ruby (original static red diamonds remain).
   CSS 'content:url' swaps the original src for a unique animated asset to bypass
   browser caching; the original src asset is also replaced with the animated copy
   as a compatible fallback for browsers that don't support content on <img>. */
html body.hell-theme.hell35-theme .masthead img.hell-v6-titan-art {
  content:url('../images/hell-v138-animated-header.webp?v=1382')!important;
}
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-diamond,
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v132-diamond-upper,
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v132-diamond-lower,
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-halo,
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v135-wordlight,
html body.hell-theme.hell35-theme .masthead .hell-v13-effects .hell-v13-logo-glint {
 display:none!important;
 animation:none!important;
 opacity:0!important;
}
/* Do not animate for users requesting reduced motion. */
@media(prefers-reduced-motion:reduce){
 html body.hell-theme.hell35-theme .masthead img.hell-v6-titan-art {
   content:url('../images/hell-v138-static-header.webp?v=1382')!important;
 }
}