/* ========================================================================
   Ash & Blood — Site Atmosphere v12
   A restrained, performance-conscious cinematic layer for the public site.
   ======================================================================== */

:root{
    --ab-atmos-rgb:166,58,46;
    --ab-atmos-soft-rgb:199,163,90;
    --ab-atmos-strength:.78;
    --ab-atmos-scroll:0px;
}

body[data-ab-atmos="blood"]{--ab-atmos-rgb:180,48,42;--ab-atmos-soft-rgb:215,116,54}
body[data-ab-atmos="azure"]{--ab-atmos-rgb:66,128,184;--ab-atmos-soft-rgb:105,159,207}
body[data-ab-atmos="amber"]{--ab-atmos-rgb:201,145,49;--ab-atmos-soft-rgb:235,184,83}
body[data-ab-atmos="violet"]{--ab-atmos-rgb:130,91,166;--ab-atmos-soft-rgb:171,127,202}
body[data-ab-atmos="ivory"]{--ab-atmos-rgb:177,192,200;--ab-atmos-soft-rgb:223,215,196}
body[data-ab-atmos="gold"]{--ab-atmos-rgb:186,139,57;--ab-atmos-soft-rgb:223,187,109}
body[data-ab-atmos="hearth"]{--ab-atmos-rgb:188,91,43;--ab-atmos-soft-rgb:231,153,70}
body[data-ab-atmos="bronze"]{--ab-atmos-rgb:155,107,59;--ab-atmos-soft-rgb:207,164,96}
body[data-ab-atmos="gilded"]{--ab-atmos-rgb:183,137,53;--ab-atmos-soft-rgb:223,190,116}

/* The entire decorative system is opt-out through the existing display menu. */
body.ab-effects-off .ab-atmosphere-v12{display:none!important}
body.ab-high-contrast{--ab-atmos-strength:.42}

.ab-atmosphere-v12{
    position:fixed;
    inset:0;
    overflow:hidden;
    pointer-events:none;
    z-index:3;
    opacity:var(--ab-atmos-strength);
    contain:strict;
    isolation:isolate;
}

.ab-atmosphere-v12__wash,
.ab-atmosphere-v12__mist,
.ab-atmosphere-v12__edge,
.ab-atmosphere-v12__horizon{
    position:absolute;
    pointer-events:none;
    will-change:transform,opacity;
}

/* Broad page tint — deliberately weak so artwork and text keep their real colour. */
.ab-atmosphere-v12__wash{
    inset:-12%;
    background:
        radial-gradient(ellipse at 13% 14%,rgba(var(--ab-atmos-rgb),.105),transparent 29%),
        radial-gradient(ellipse at 88% 74%,rgba(var(--ab-atmos-soft-rgb),.05),transparent 34%),
        linear-gradient(115deg,rgba(var(--ab-atmos-rgb),.02),transparent 35% 67%,rgba(var(--ab-atmos-rgb),.025));
    filter:blur(24px) saturate(112%);
    mix-blend-mode:screen;
    animation:ab-atmos-breathe 18s ease-in-out infinite alternate;
}

/* Two oversized translucent fog banks. No backdrop-filter: this stays GPU-light. */
.ab-atmosphere-v12__mist{
    width:76vw;
    height:34vh;
    border-radius:50%;
    opacity:.09;
    filter:blur(70px);
    background:radial-gradient(ellipse,rgba(var(--ab-atmos-soft-rgb),.30),rgba(var(--ab-atmos-rgb),.08) 48%,transparent 72%);
    mix-blend-mode:screen;
}
.ab-atmosphere-v12__mist--a{
    left:-24vw;
    top:18vh;
    transform:translate3d(0,var(--ab-atmos-scroll),0) rotate(-7deg);
    animation:ab-atmos-drift-a 32s ease-in-out infinite alternate;
}
.ab-atmosphere-v12__mist--b{
    right:-31vw;
    bottom:7vh;
    width:82vw;
    opacity:.065;
    transform:translate3d(0,var(--ab-atmos-scroll),0) rotate(8deg);
    animation:ab-atmos-drift-b 39s ease-in-out infinite alternate;
}

/* Edge light and horizon keep large black areas feeling intentionally cinematic. */
.ab-atmosphere-v12__edge{
    inset:0;
    box-shadow:
        inset 0 0 155px rgba(0,0,0,.46),
        inset 0 -110px 170px rgba(0,0,0,.28),
        inset 1px 0 0 rgba(var(--ab-atmos-rgb),.025),
        inset -1px 0 0 rgba(var(--ab-atmos-soft-rgb),.02);
}
.ab-atmosphere-v12__horizon{
    left:-15vw;
    right:-15vw;
    bottom:-11vh;
    height:35vh;
    opacity:.085;
    background:radial-gradient(ellipse at center bottom,rgba(var(--ab-atmos-rgb),.36),transparent 62%);
    filter:blur(40px);
    mix-blend-mode:screen;
}

#abAtmosphereCanvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:.74;
}

/* Navigation receives a faint atmospheric rim without changing its layout. */
#nav.ab-nav{
    box-shadow:0 12px 36px rgba(0,0,0,.27),0 1px 0 rgba(var(--ab-atmos-rgb),.035)!important;
}
#nav.ab-nav::before{
    content:"";
    position:absolute;
    inset:auto 8% -1px;
    height:1px;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(var(--ab-atmos-rgb),.12),rgba(var(--ab-atmos-soft-rgb),.19),rgba(var(--ab-atmos-rgb),.12),transparent);
    opacity:.72;
}
.ab-nav-dropdown{
    box-shadow:0 24px 70px rgba(0,0,0,.58),0 0 35px rgba(var(--ab-atmos-rgb),.025)!important;
}

/* Shared shells gain a deeper upper glow and less visibly flat black. */
.ab-shell{
    background:
        radial-gradient(ellipse at 52% -11%,rgba(var(--ab-atmos-rgb),.11),transparent 37%),
        radial-gradient(ellipse at 92% 24%,rgba(var(--ab-atmos-soft-rgb),.022),transparent 28%),
        linear-gradient(180deg,#0b0c0d,#090a0b 55%,#070809)!important;
}

/* General depth without fighting page-specific card artwork. */
@media (hover:hover) and (pointer:fine){
    :is(.ab-card,.feature-card,.event-card,.char-card,.ab-directory-card,.ab-game-card,.ab-rumor-notice,.server-info,.trailer-wrapper,.system-block,.pillar){
        transition:transform .24s cubic-bezier(.22,1,.36,1),border-color .24s ease,box-shadow .24s ease,filter .24s ease;
    }
    :is(.ab-card,.feature-card,.event-card,.char-card,.ab-directory-card,.ab-game-card,.ab-rumor-notice,.server-info,.trailer-wrapper,.system-block,.pillar):hover{
        box-shadow:0 24px 65px rgba(0,0,0,.34),0 0 30px rgba(var(--ab-atmos-rgb),.026);
        filter:brightness(1.025);
    }
}

/* Hero sections acquire subtle depth rather than a hard overlay. */
.hero,
.ab-page-hero,
.page-header,
.ab-character-profile-hero{
    isolation:isolate;
}
.hero::after{
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:32%;
    pointer-events:none;
    z-index:2;
    background:linear-gradient(0deg,rgba(5,5,6,.66),transparent 82%),radial-gradient(ellipse at 50% 115%,rgba(var(--ab-atmos-rgb),.18),transparent 56%);
}
.ab-page-hero{
    box-shadow:0 28px 76px rgba(0,0,0,.34),0 0 52px rgba(var(--ab-atmos-rgb),.025)!important;
}
.ab-page-hero::before{
    background:
        radial-gradient(ellipse at 13% 10%,rgba(var(--ab-atmos-rgb),.12),transparent 35%),
        linear-gradient(90deg,rgba(var(--ab-atmos-rgb),.055),transparent 44%),
        repeating-linear-gradient(135deg,rgba(255,255,255,.011) 0 1px,transparent 1px 12px)!important;
}

/* Existing legacy headers get the same subtle page-aware glow. */
.page-header{
    box-shadow:inset 0 -42px 70px rgba(0,0,0,.2),0 18px 58px rgba(0,0,0,.14);
}
.section-title,
.ab-title{
    text-shadow:0 8px 32px rgba(0,0,0,.42),0 0 30px rgba(var(--ab-atmos-rgb),.025);
}
.section-label,
.ab-kicker,
.ab-eyebrow{
    text-shadow:0 0 18px rgba(var(--ab-atmos-rgb),.12);
}

/* Homepage — warm horizon under the existing fire/video treatment. */
body[data-ab-atmos="blood"] .hero-overlay{
    background:
        radial-gradient(ellipse at 50% 72%,rgba(116,27,18,.12),transparent 46%),
        linear-gradient(180deg,rgba(2,2,3,.24),rgba(4,3,3,.25) 42%,rgba(3,3,4,.78))!important;
}
body[data-ab-atmos="blood"] .ab-home-live{
    box-shadow:0 -15px 45px rgba(0,0,0,.22),inset 0 1px 0 rgba(var(--ab-atmos-soft-rgb),.04);
}

/* Roster keeps its established cold blue atmosphere. */
body.roster-page .roster-controls{
    box-shadow:0 16px 42px rgba(0,0,0,.32),0 0 30px rgba(var(--ab-atmos-rgb),.025)!important;
}
body.roster-page .char-card{
    box-shadow:0 20px 48px rgba(0,0,0,.28),0 0 0 1px rgba(var(--ab-atmos-rgb),.018);
}

/* Events retain the notice-board amber light. */
body.events-page .event-card{
    box-shadow:0 19px 50px rgba(0,0,0,.26),0 0 28px rgba(var(--ab-atmos-rgb),.018);
}

/* Wiki / reading surfaces stay cooler and clearer than other pages. */
body[data-ab-atmos="ivory"]{
    --ab-atmos-strength:.59;
}
body[data-ab-atmos="ivory"] .ab-atmosphere-v12__wash{opacity:.65}
body[data-ab-atmos="ivory"] #abAtmosphereCanvas{opacity:.50}

/* Tavern pages get a low hearth glow instead of floating bright particles. */
body[data-ab-atmos="hearth"] .ab-atmosphere-v12__horizon{opacity:.14}
body[data-ab-atmos="hearth"] .ab-game-stage{box-shadow:inset 0 0 70px rgba(var(--ab-atmos-rgb),.035),0 20px 55px rgba(0,0,0,.3)}

/* Footer fades into the atmosphere instead of reading like a separate slab. */
.ab-footer{
    background:
        radial-gradient(ellipse at 18% 0,rgba(var(--ab-atmos-rgb),.045),transparent 30%),
        linear-gradient(180deg,#08090a,#060708)!important;
    box-shadow:0 -30px 70px rgba(0,0,0,.28),inset 0 1px rgba(var(--ab-atmos-soft-rgb),.025);
}

/* Small separators pick up the active page colour very subtly. */
.ornament-line,
.hero-divider,
.ab-section-head,
.ab-card-head{
    --ab-atmos-local:rgba(var(--ab-atmos-rgb),.12);
}

/* Effects-disabled mode returns to the underlying v11 presentation cleanly. */
body.ab-effects-off .ab-shell{background:linear-gradient(180deg,#0b0c0d,#090a0b 55%,#070809)!important}
body.ab-effects-off #nav.ab-nav::before{display:none}
body.ab-effects-off .hero::after{background:linear-gradient(0deg,rgba(5,5,6,.58),transparent 82%)}

@keyframes ab-atmos-breathe{
    0%{transform:scale(1) translate3d(-.5%,0,0);opacity:.72}
    100%{transform:scale(1.035) translate3d(.7%,-.6%,0);opacity:1}
}
@keyframes ab-atmos-drift-a{
    from{margin-left:-2vw;margin-top:-1vh}
    to{margin-left:10vw;margin-top:3vh}
}
@keyframes ab-atmos-drift-b{
    from{margin-right:-3vw;margin-bottom:-2vh}
    to{margin-right:9vw;margin-bottom:2vh}
}

body.ab-motion-none .ab-atmosphere-v12__wash,
body.ab-motion-none .ab-atmosphere-v12__mist{
    animation:none!important;
    transform:none!important;
}
@media (prefers-reduced-motion:reduce){
    .ab-atmosphere-v12__wash,.ab-atmosphere-v12__mist{animation:none!important;transform:none!important}
}

@media (max-width:760px){
    .ab-atmosphere-v12{--ab-atmos-strength:.58}
    .ab-atmosphere-v12__mist{filter:blur(54px);opacity:.055}
    .ab-atmosphere-v12__horizon{height:26vh}
}

@media (max-width:480px){
    .ab-atmosphere-v12__mist--b{display:none}
    .ab-atmosphere-v12__wash{filter:blur(18px)}
}
