/* ===========================================
   NIGHTANGELS.FR — FEUILLE FUSIONNÉE
   CORE STYLE - UNIVERS PRINCIPAL
=========================================== */

/* ===========================================
   PARTICLES
=========================================== */
body[data-universe="nightangels"]:not([data-page="livre"]) .particles{
    position:fixed;
    inset:0;
    width:100%;
    height:100%;
    overflow:hidden;
    pointer-events:none;
    z-index:-8;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .particles span{
    position:absolute;
    bottom:-40px;
    border-radius:50%;
animation:
    nightParticles linear infinite,
    emberFlicker 3s ease-in-out infinite;
    will-change:transform,opacity;
background:var(--accent-color);
box-shadow:
0 0 10px var(--accent-color),
0 0 24px var(--accent-color),
0 0 40px color-mix(in srgb,var(--accent-color) 40%,transparent);
}
@keyframes nightParticles{
    0%{
        transform:translateY(0) scale(.6);
        opacity:0;
    }
    10%{
        opacity:1;
    }
    100%{
        transform:translateY(-120vh) scale(1.4);
        opacity:0;
    }
}
@keyframes emberFlicker{
    0%,100%{
        filter:brightness(1);
    }
    50%{
        filter:brightness(1.8);
    }
}
/* ===========================================
   BACKGROUND
=========================================== */
body[data-universe="nightangels"]:not([data-page="livre"]) .background{
    will-change:transform;
    backface-visibility:hidden;
    position:fixed;
    inset:0;
    background:
    linear-gradient(
    rgba(0,0,0,0.55),
    rgba(0,0,0,0.92)),
    url('/images/porte-enfers.png')
    center center / cover no-repeat;
    z-index:-5;
    filter:
    brightness(0.45)
    contrast(1.1)
    saturate(1.05);
    transform:scale(1.03);
}
/* =========================================================
   RED HALO
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .light-bg{
    position:fixed;
    inset:0;
    z-index:-6;
    pointer-events:none;
    background:
    radial-gradient(
    circle at center,
    rgba(120,0,0,0.32),
    rgba(60,0,0,0.10),
    rgba(0,0,0,0.95)
    );
    animation:
    haloPulse 8s ease-in-out infinite,
    haloMove 18s ease-in-out infinite;
}
@keyframes haloPulse{
    0%{
        opacity:0.72;
    }
    50%{
        opacity:1;
    }
    100%{
        opacity:0.72;
    }
}
@keyframes haloMove{
    0%{
        transform:
        scale(1)
        translateY(0px);
    }
    50%{
        transform:
        scale(1.04)
        translateY(-10px);
    }
    100%{
        transform:
        scale(1)
        translateY(0px);
    }
}
/* =========================================================
   RED FOG
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .red-fog{
    position:fixed;
    inset:0;
    background:
    radial-gradient(
    circle at center,
    rgba(180,0,0,0.25),
    transparent 60%
    );
    animation:pulse 6s ease-in-out infinite;
    z-index:-4;
}
@keyframes pulse{
    0%{
        opacity:0.45;
    }
    50%{
        opacity:0.9;
    }
    100%{
        opacity:0.45;
    }
}
/* =========================================================
   FORM
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-form{
    display:flex;
    flex-direction:column;
    gap:20px;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .input-box{
    width:100%;
    height:72px;
    outline:none;
    border-radius:18px;
    border:
    1px solid rgba(255,0,0,0.18);
    background:
    rgba(0,0,0,0.55);
    color:white;
    text-align:center;
    letter-spacing:4px;
    font-size:1rem;
    transition:0.4s ease;
    box-shadow:
    inset 0 0 12px rgba(255,0,0,0.04),
    0 0 12px rgba(255,0,0,0.04);
}
body[data-universe="nightangels"]:not([data-page="livre"]) .input-box:focus{
    border-color:#ff3c3c;
    background:
    rgba(10,0,0,0.72);
    transform:scale(1.01);
    box-shadow:
    0 0 25px rgba(255,0,0,0.28),
    inset 0 0 18px rgba(255,0,0,0.12);
}
body[data-universe="nightangels"]:not([data-page="livre"]) .input-box::placeholder{
    color:
    rgba(255,255,255,0.42);
    letter-spacing:4px;
}
/* =========================================================
   BUTTON
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .enter-btn{
    width:100%;
    height:74px;
    border:none;
    cursor:pointer;
    border-radius:20px;
    color:white;
    text-transform:uppercase;
    letter-spacing:4px;
    font-size:0.9rem;
    background:
    linear-gradient(
    145deg,
    #6e0000,
    #250000
    );
    transition:0.45s ease;
    box-shadow:
    0 0 35px rgba(255,0,0,0.15);
    animation:
    portalPulse 4s ease-in-out infinite;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .enter-btn:hover{
    transform:
    translateY(-4px)
    scale(1.01);
    box-shadow:
    0 0 55px rgba(255,0,0,0.35);
}
body[data-universe="nightangels"]:not([data-page="livre"]) .enter-btn:active{
    transform:scale(0.98);
}
@keyframes portalPulse{
    0%{
        box-shadow:0 0 25px rgba(255,0,0,0.15);
    }
    50%{
        box-shadow:0 0 45px rgba(255,0,0,0.35);
    }
    100%{
        box-shadow:0 0 25px rgba(255,0,0,0.15);
    }
}
/* =========================================================
   ERROR
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .error{
    margin-top:25px;
    color:#ff6464;
    font-size:0.9rem;
    letter-spacing:2px;
    text-shadow:
    0 0 12px rgba(255,0,0,0.45);
    animation:flicker 1s infinite;
}
@keyframes flicker{
    0%{
        opacity:1;
    }
    50%{
        opacity:0.45;
    }
    100%{
        opacity:1;
    }
}
/* =========================================================
   QUOTE
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .quote{
    margin-top:40px;
    color:
    rgba(255,255,255,0.42);
    font-style:italic;
    line-height:2;
    transition:opacity 0.8s ease;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .quote span{
    display:block;
    margin-top:15px;
    text-transform:uppercase;
    letter-spacing:3px;
    color:
    rgba(255,0,0,0.65);
}
/* =========================================================
   AUDIO SEAL
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .audio-seal{
    position:fixed;
    top:118px;
    left:8px;
    width:150px;
    height:150px;
    z-index:9999;
    cursor:pointer;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:50%;
    background:
    radial-gradient(
    circle,
    rgba(120,0,0,0.18),
    transparent);
    backdrop-filter:blur(8px);
    box-shadow:
    0 0 12px rgba(255,0,0,0.55),
    0 0 30px rgba(255,0,0,0.25);
    transition:0.4s ease;
    overflow:hidden;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .audio-seal:hover{

    transform:scale(1.08);
}

body[data-universe="nightangels"]:not([data-page="livre"]) .audio-seal img{
    width:140%;
    height:140%;
    object-fit:cover;

    transform:scale(1.35);

    filter:
    drop-shadow(0 0 10px rgba(255,0,0,0.5));
}

body[data-universe="nightangels"]:not([data-page="livre"]) .audio-seal.active{

    box-shadow:
    0 0 18px rgba(255,0,0,0.75),
    0 0 45px rgba(255,0,0,0.35);
}

@keyframes sigilRotate{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }
}

body[data-universe="nightangels"]:not([data-page="livre"]) .seal-message{

    position:fixed;

    top:145px;
    left:95px;

    z-index:9999;

    padding:12px 18px;

    background:
    linear-gradient(
    145deg,
    rgba(20,0,0,0.92),
    rgba(0,0,0,0.95));

    border:1px solid rgba(255,0,0,0.28);

    border-radius:16px;

    color:#ddd;

    font-size:0.82rem;

    letter-spacing:1px;

    backdrop-filter:blur(8px);

    box-shadow:
    0 0 18px rgba(255,0,0,0.18);

    animation:
    messageAppear 1s ease,
    messagePulse 3s ease-in-out infinite;

    transition:opacity 1.2s ease;
}

body[data-universe="nightangels"]:not([data-page="livre"]) .seal-message::before{

    content:'';

    position:absolute;

    left:-8px;
    top:22px;

    width:16px;
    height:16px;

    background:rgba(15,0,0,0.95);

    border-left:1px solid rgba(255,0,0,0.28);
    border-bottom:1px solid rgba(255,0,0,0.28);

    transform:rotate(45deg);
}

@keyframes messageAppear{

    from{
        opacity:0;
        transform:translateX(-15px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }
}

@keyframes messagePulse{

    0%{
        box-shadow:0 0 12px rgba(255,0,0,0.12);
    }

    50%{
        box-shadow:0 0 22px rgba(255,0,0,0.28);
    }

    100%{
        box-shadow:0 0 12px rgba(255,0,0,0.12);
    }
}
/* =========================================================
   HERO
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .hero-portal{
    position:relative;
    z-index:5;
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:
    120px
    40px
    40px;
}

/* =========================================================
   PORTAL CARD
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-card{
    position:relative;
    will-change:transform;
    overflow:hidden;
    width:100%;
    max-width:1000px;
    border-radius:35px;
    background:
    linear-gradient(
    to bottom,
    rgba(35,0,0,0.58),
    rgba(0,0,0,0.92)
    );
    border:
    1px solid rgba(255,0,0,0.12);
    backdrop-filter:blur(16px);
    box-shadow:
    0 0 60px rgba(255,0,0,0.08),
    0 0 120px rgba(0,0,0,0.55);
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-card::after{
    content:'';
    position:absolute;
    top:0;
    bottom:0;
    left:50%;
    width:2px;
    transform:translateX(-50%);
    opacity:0.18;
    background:
    linear-gradient(
    to bottom,
    transparent,
    rgba(255,0,0,0.75),
    transparent
    );
}
/* =========================================================
   IMAGE
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-image{
    position:relative;
    width:100%;
    height:280px;
    overflow:hidden;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    filter:
    brightness(0.78)
    contrast(1.08)
    saturate(1.05);
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-image::after{
    content:'';
    position:absolute;
    inset:0;
    background:
    linear-gradient(
    to top,
    rgba(0,0,0,0.96),
    transparent 45%
    );
}
/* =========================================================
   CONTENT
========================================================= */
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-content{
    padding:25px 30px;
    text-align:center;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-subtitle{
    margin-bottom:25px;
    letter-spacing:6px;
    text-transform:uppercase;
    font-size:1rem;
    color:#ff5a5a;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-title{
    margin-bottom:30px;
    font-family:'Cinzel',serif;
    font-size:2.8rem;
    line-height:1;
    text-transform:uppercase;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-title span{
    color:#c40000;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .separator{
    width:220px;
    height:2px;
    margin:
    0 auto
    35px;
    background:
    linear-gradient(
    to right,
    transparent,
    #c40000,
    transparent
    );
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-text{
    max-width:700px;
    margin:
    0 auto
    38px;
    color:
    rgba(255,255,255,0.76);
    font-size:1rem;
    line-height:1.75;
}
body[data-universe="nightangels"]:not([data-page="livre"]) .portal-text span{
    color:#c40000;
    font-family:'Cinzel',serif;
    letter-spacing:2px;
}

/* =========================================================
   PAGE : LIVRE DES RÉVÉLATIONS
========================================================= */

/* =========================================================
   LIVRE DES RÉVÉLATIONS
   NIGHTANGELS.FR
========================================================= */

/* =========================================================
   BACKGROUND
========================================================= */
body[data-page="livre"] .background{
    position:fixed;
    inset:0;
    background:
    linear-gradient(
    rgba(0,0,0,0.82),
    rgba(0,0,0,0.97)),
    url('/images/banner-nightangels.png')
    center center / cover no-repeat;
    z-index:-5;
    filter:
    brightness(0.4)
    contrast(1.1)
    saturate(1.05);
    transform:scale(1.03);
}

/* =========================================================
   RED FOG
========================================================= */

body[data-page="livre"] .red-fog{

    position:fixed;
    inset:0;

    background:
    radial-gradient(
    circle at center,
    rgba(180,0,0,0.18),
    transparent 65%
    );

    animation:pulse 8s ease-in-out infinite;

    z-index:-4;
}



/* =========================================================
   HERO
========================================================= */
body[data-page="livre"] .hero-book{

    position:relative;

    z-index:5;

    width:100%;

    display:flex;

    justify-content:center;
    align-items:flex-start;

    padding:
    100px
    20px
    20px;
}

/* =========================================================
   REVELATION CARD
========================================================= */

body[data-page="livre"] .revelation-card{

    width:100%;
    max-width:980px;

    background:
    linear-gradient(
    to bottom,
    rgba(10,0,0,0.55),
    rgba(0,0,0,0.95));

    border:
    1px solid rgba(255,0,0,0.12);

    backdrop-filter:blur(16px);

    box-shadow:
    0 0 60px rgba(255,0,0,0.08),
    0 0 120px rgba(0,0,0,0.55);

    position:relative;

    overflow:visible;

    border-radius:35px;

    z-index:5;
}

/* =========================================================
   LILITH GUARDIAN
========================================================= */

body[data-page="livre"] .lilith-guardian{

    position:relative;

    width:100%;

    background:#000;

    overflow:hidden;

    display:flex;

    justify-content:center;

    align-items:flex-end;
}

body[data-page="livre"] .lilith-guardian img{

    width:100%;
    max-width:1200px;

    display:block;

    object-fit:contain;

    filter:
    drop-shadow(0 0 30px rgba(255,0,0,0.18));

    animation:lilithBreath 7s ease-in-out infinite;
}

@keyframes lilithBreath{

    0%{

        transform:
        scale(1)
        translateY(0px);
    }

    50%{

        transform:
        scale(1.01)
        translateY(-4px);
    }

    100%{

        transform:
        scale(1)
        translateY(0px);
    }
}

/* =========================================================
   CONTENT
========================================================= */
body[data-page="livre"] .content{
    padding:60px 40px 70px;
}
/* =========================================================
   TITLES
========================================================= */

body[data-page="livre"] .subtitle{

    letter-spacing:6px;

    text-transform:uppercase;

    font-size:0.72rem;

    color:#ff5a5a;

    margin-bottom:25px;

    text-align:center;
}

body[data-page="livre"] .title{

    font-family:'Cinzel',serif;

    font-size:clamp(2.5rem,8vw,5rem);

    line-height:1;

    margin-bottom:25px;

    text-transform:uppercase;

    text-align:center;
}

body[data-page="livre"] .title span{

    color:#c40000;
}

body[data-page="livre"] .separator{

    width:240px;
    height:2px;

    margin:0 auto 40px;

    background:
    linear-gradient(
    to right,
    transparent,
    #c40000,
    transparent);
}

/* =========================================================
   LORE
========================================================= */
body[data-page="livre"] .lore{
    max-width:760px;
    margin:0 auto 50px;
    text-align:center;
    font-size:1.05rem;
    line-height:2.1;
    color:rgba(255,255,255,0.78);
}
body[data-page="livre"] .lore p{
    margin-bottom:28px;
}
body[data-page="livre"] .lore span{
    color:#c40000;
    font-family:'Cinzel',serif;
    letter-spacing:2px;
}
/* =========================================================
   BOOK
========================================================= */
body[data-page="livre"] .book-container{

    display:flex;

    justify-content:center;

    margin-bottom:35px;
}

body[data-page="livre"] .book{

    position:relative;

    width:240px;

    transition:0.5s ease;

    animation:bookFloat 6s ease-in-out infinite;
}

body[data-page="livre"] .book img{

    width:100%;

    filter:
    drop-shadow(0 0 18px rgba(255,0,0,0.35))
    drop-shadow(0 0 45px rgba(255,0,0,0.12));
}

body[data-page="livre"] .book::before{

    content:'';

    position:absolute;

    inset:-18px;

    border-radius:25px;

    background:
    radial-gradient(
    ellipse at center,
    rgba(180,0,0,0.25),
    rgba(120,0,0,0.08),
    transparent 72%);

    filter:blur(18px);

    z-index:-1;
}

/* =========================================================
   SEAL
========================================================= */

body[data-page="livre"] .seal{

    width:280px;
    height:280px;

    margin:0 auto 35px;

    border-radius:50%;

    cursor:pointer;

    display:flex;

    justify-content:center;
    align-items:center;

    background:none;

    border:none;

    transition:0.4s ease;

    animation:pulseSeal 4s ease-in-out infinite;
}

body[data-page="livre"] .seal:hover{

    transform:scale(1.05);
}

body[data-page="livre"] .seal-text{

    text-align:center;

    margin-bottom:5px;

    font-family:'Cinzel',serif;

    font-size:0.90rem;

    letter-spacing:3px;

    color:#d8b07a;

    text-transform:uppercase;

    text-shadow:
    0 0 12px rgba(255,180,120,0.25);
}

body[data-page="livre"] .seal img{

    width:112%;
    height:112%;

    object-fit:contain;

    opacity:0.98;

    filter:
    drop-shadow(0 0 18px rgba(255,0,0,0.55))
    drop-shadow(0 0 40px rgba(255,0,0,0.25));
}

@keyframes pulseSeal{

    0%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.03);
    }

    100%{
        transform:scale(1);
    }
}

/* =========================================================
   REVELATION
========================================================= */

body[data-page="livre"] .revelation{

    opacity:0;

    max-height:0;

    overflow:hidden;

    transition:1s ease;

    text-align:center;
}

body[data-page="livre"] .revelation.show{

    opacity:1;

    max-height:900px;
}

/* =========================================================
   REVELATION TITLE
========================================================= */

body[data-page="livre"] .revelation-title{

    font-family:'Cinzel',serif;

    font-size:1rem;

    letter-spacing:5px;

    color:#ff5a5a;

    margin-bottom:20px;

    text-transform:uppercase;
}

/* =========================================================
   SECRET KEY
========================================================= */
body[data-page="livre"] .key{

    font-family:'Cinzel',serif;

    font-size:clamp(2.2rem,7vw,4rem);

    color:#c40000;

    letter-spacing:10px;

    margin-bottom:25px;

    text-shadow:
    0 0 15px rgba(255,0,0,0.45);
}

/* =========================================================
   WARNING TEXT
========================================================= */
body[data-page="livre"] .warning{
    color:rgba(255,255,255,0.72);
    line-height:2;
    margin-bottom:40px;
    font-size:1rem;
}
/* =========================================================
   ENTER BUTTON
========================================================= */

body[data-page="livre"] .enter-btn{

    display:inline-flex;

    justify-content:center;
    align-items:center;

    padding:18px 55px;

    border-radius:60px;

    text-decoration:none;

    color:white;

    text-transform:uppercase;

    letter-spacing:4px;

    font-size:0.9rem;

    background:
    linear-gradient(
    145deg,
    #6e0000,
    #250000);

    transition:0.45s ease;

    box-shadow:
    0 0 35px rgba(255,0,0,0.15);
}

body[data-page="livre"] .enter-btn:hover{

    transform:
    translateY(-4px)
    scale(1.02);

    box-shadow:
    0 0 55px rgba(255,0,0,0.35);
}

/* =========================================================
   ABIGAIL
========================================================= */

body[data-page="livre"] .abigail-warning{

    position:fixed;

    right:-120px;
    bottom:-120px;

    width:520px;

    z-index:50;

    pointer-events:auto;

    text-decoration:none;

    opacity:0;

    transition:
    opacity 1.5s ease,
    transform 1.5s ease;

    transform:
    translateY(40px);
}

body[data-page="livre"] .abigail-warning.show{

    opacity:1;

    transform:translateY(0px);
}

body[data-page="livre"] .abigail-warning:hover{

    transform:
    translateY(-6px)
    scale(1.02);
}

body[data-page="livre"] .abigail-warning img{

    width:100%;

    height:auto;

    object-fit:contain;

    mix-blend-mode:screen;

    opacity:0.96;

    animation:
    abigailFloat 7s ease-in-out infinite;
}

@keyframes abigailFloat{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-10px);
    }

    100%{
        transform:translateY(0px);
    }
}

/* =========================================================
   ABIGAIL BUBBLE
========================================================= */

body[data-page="livre"] .abigail-bubble{

    position:absolute;

    left:-185px;
    top:55px;

    width:185px;

    padding:18px 18px;

    background:
    linear-gradient(
    145deg,
    rgba(255,245,220,0.96),
    rgba(255,230,185,0.92),
    rgba(215,170,120,0.88));

    border:
    1px solid rgba(255,240,210,0.75);

    border-radius:28px;

    color:#3d220d;

    font-size:0.78rem;

    line-height:1.75;

    letter-spacing:1px;

    box-shadow:
    0 0 22px rgba(255,220,160,0.28),
    0 0 55px rgba(255,210,140,0.16);

    backdrop-filter:blur(12px);

    opacity:0;

    transform:translateY(10px);

    transition:
    opacity 1s ease,
    transform 1s ease;

    animation:
    bubbleFloat 5s ease-in-out infinite;

    z-index:51;
}

body[data-page="livre"] .abigail-bubble.show{

    opacity:1;

    transform:translateY(0px);
}

body[data-page="livre"] .abigail-bubble::after{

    content:'';

    position:absolute;

    right:-8px;
    top:58%;

    width:18px;
    height:18px;

    background:
    linear-gradient(
    145deg,
    rgba(255,245,220,0.96),
    rgba(255,230,185,0.92),
    rgba(215,170,120,0.88));

    transform:rotate(45deg);

    border-radius:2px;
}

@keyframes bubbleFloat{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-6px);
    }

    100%{
        transform:translateY(0px);
    }
}