body.bw-changelog-page{
    margin:0;
    background:#020912;
    color:#edf8ff;
    font-family:Inter,"Segoe UI",Arial,sans-serif;
}

.bw-changelog-main{
    min-height:100vh;
}


/* HERO */

.bw-changelog-hero{
    min-height:610px;

    padding:90px 24px 55px;

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

    text-align:center;

    background:
        linear-gradient(
            180deg,
            rgba(0,8,15,.22),
            rgba(0,8,15,.60) 58%,
            #020912 100%
        ),
        url("assets/hero-frostbound-v2.png")
        center top / cover
        no-repeat;
}

.bw-changelog-hero-inner{
    width:min(900px,100%);
    padding-top:315px;
}

.bw-changelog-kicker{
    display:inline-block;

    padding:7px 14px;

    border:1px solid rgba(91,203,255,.34);

    border-radius:6px;

    background:rgba(4,32,50,.72);

    color:#61d5ff;

    font-size:10px;
    font-weight:900;

    text-transform:uppercase;
    letter-spacing:.16em;
}

.bw-changelog-hero h1{
    margin:18px 0 0;

    font-size:clamp(52px,6vw,84px);
    font-weight:950;

    letter-spacing:-.055em;
    line-height:.9;
}

.bw-changelog-hero h1 span{
    display:block;
    color:#55cfff;
}

.bw-changelog-hero p{
    max-width:680px;

    margin:23px auto 0;

    color:#afc7d5;

    font-size:16px;
    line-height:1.65;
}


/* SECTION */

.bw-changelog-section{
    padding:85px 24px;

    background:
        linear-gradient(
            180deg,
            #04111d,
            #020a12
        );
}

.bw-changelog-heading{
    width:min(1000px,100%);

    margin:0 auto 40px;

    display:flex;
    gap:17px;
    align-items:flex-start;
}

.bw-changelog-heading > span{
    padding:7px 10px;

    color:#4bd0ff;

    background:rgba(6,53,78,.58);

    border:1px solid rgba(70,195,244,.30);

    border-radius:5px;

    font-size:10px;
    font-weight:900;

    text-transform:uppercase;
}

.bw-changelog-heading h2{
    margin:0;

    font-size:34px;
    font-weight:950;

    letter-spacing:-.04em;
}

.bw-changelog-heading p{
    margin:8px 0 0;

    color:#839eae;
}


/* ENTRIES */

.bw-changelog-list{
    width:min(1000px,100%);
    margin:auto;
}

.bw-changelog-entry{
    margin-bottom:18px;
    padding:25px;

    border:1px solid rgba(75,175,222,.22);

    border-radius:10px;

    background:
        linear-gradient(
            150deg,
            rgba(7,28,45,.94),
            rgba(2,15,25,.97)
        );

    box-shadow:
        0 18px 45px rgba(0,0,0,.22);
}

.bw-changelog-entry-meta{
    padding-bottom:15px;
    margin-bottom:17px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:15px;

    border-bottom:1px solid rgba(80,180,226,.15);
}

.bw-changelog-date{
    color:#7898aa;
    font-size:11px;
}

.bw-changelog-version{
    color:#dff5ff;

    font-size:18px;
    font-weight:900;
}

.bw-changelog-entry-content{
    color:#9fb6c5;

    font-size:13px;
    line-height:1.7;
}

.bw-changelog-entry-content p{
    margin:8px 0;
}

.bw-changelog-entry-content ul{
    margin:12px 0;
    padding-left:22px;
}

.bw-changelog-entry-content li{
    margin:5px 0;
}

.bw-changelog-empty{
    padding:35px;

    text-align:center;

    border:1px solid rgba(75,175,222,.20);

    border-radius:10px;

    background:rgba(5,23,36,.78);

    color:#8fa9b9;
}

.bw-changelog-empty strong{
    color:#d4f1fd;
}


/* LEGEND */

.bw-changelog-legend{
    padding:75px 24px;

    text-align:center;

    background:#01070d;
}

.bw-changelog-legend h2{
    margin:0 0 24px;

    font-size:29px;
}

.bw-changelog-tags{
    display:flex;

    justify-content:center;

    gap:10px;

    flex-wrap:wrap;
}

.bw-changelog-tags span{
    min-width:105px;

    padding:9px 12px;

    border-radius:6px;

    font-size:11px;
    font-weight:850;
}

.bw-changelog-tags .new{
    color:#80efa0;
    background:rgba(32,126,61,.18);
    border:1px solid rgba(70,210,104,.24);
}

.bw-changelog-tags .changed{
    color:#66d7ff;
    background:rgba(28,119,164,.16);
    border:1px solid rgba(79,191,239,.24);
}

.bw-changelog-tags .fixed{
    color:#9fc7ff;
    background:rgba(55,86,154,.17);
    border:1px solid rgba(105,145,229,.24);
}

.bw-changelog-tags .removed{
    color:#ef9e9e;
    background:rgba(144,51,51,.16);
    border:1px solid rgba(220,84,84,.23);
}

.bw-changelog-tags .security{
    color:#ffc77c;
    background:rgba(140,85,26,.17);
    border:1px solid rgba(222,147,63,.25);
}


/* MOBILE */

@media(max-width:650px){

    .bw-changelog-hero{
        min-height:520px;

        padding:
            0 18px
            45px;

        background-size:
            auto,
            105% auto;

        background-position:
            center,
            center 10px;
    }

    .bw-changelog-hero-inner{
        padding-top:190px;
    }

    .bw-changelog-hero h1{
        font-size:44px;
    }

    .bw-changelog-section{
        padding:65px 17px;
    }

    .bw-changelog-entry{
        padding:20px 17px;
    }

    .bw-changelog-entry-meta{
        align-items:flex-start;
        flex-direction:column;
    }

}

@media(max-width:420px){

    .bw-changelog-hero{
        background-size:
            auto,
            103% auto;
    }

}

/* ============================================================
   CHANGELOG - CORES POR TIPO DE ALTERAÇÃO
   ============================================================ */

/* títulos das categorias dentro do conteúdo */
.bw-changelog-entry-content p strong{
    display:inline-block;

    padding:5px 9px;

    border-radius:5px;

    font-size:12px;
    font-weight:900;
}


/* + NOVO */
.bw-changelog-entry-content p strong:first-child{
    color:#82f3a1;
}


/* deteção visual por conteúdo através das classes geradas abaixo */
.bw-changelog-entry-content .bw-log-new{
    color:#82f3a1 !important;

    background:rgba(34,126,62,.18);

    border:1px solid rgba(72,214,106,.25);
}

.bw-changelog-entry-content .bw-log-changed{
    color:#68d9ff !important;

    background:rgba(29,121,164,.17);

    border:1px solid rgba(78,192,240,.25);
}

.bw-changelog-entry-content .bw-log-fixed{
    color:#9fc8ff !important;

    background:rgba(54,87,157,.18);

    border:1px solid rgba(105,146,231,.25);
}

.bw-changelog-entry-content .bw-log-removed{
    color:#f19c9c !important;

    background:rgba(145,49,49,.18);

    border:1px solid rgba(224,83,83,.24);
}

.bw-changelog-entry-content .bw-log-security{
    color:#ffc777 !important;

    background:rgba(144,85,24,.18);

    border:1px solid rgba(224,148,59,.26);
}


/* bullets mantêm leitura limpa */
.bw-changelog-entry-content ul{
    color:#9fb8c8;
}

.bw-changelog-entry-content li::marker{
    color:#638da5;
}



/* ============================================================
   CHANGELOG - CORES DOS TIPOS DE ALTERAÇÃO
   ============================================================ */

.bw-changelog-update h3{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:30px;

    margin:22px 0 12px;
    padding:0 12px;

    border-radius:6px;

    font-size:11px;
    font-weight:900;

    letter-spacing:.02em;
}


/* + NOVO */
.bw-changelog-update h3:nth-of-type(1){
    color:#69f58b;

    background:
        rgba(17,78,36,.28);

    border:
        1px solid rgba(65,201,95,.32);
}


/* ~ ALTERADO */
.bw-changelog-update h3:nth-of-type(2){
    color:#63cfff;

    background:
        rgba(18,67,94,.30);

    border:
        1px solid rgba(68,169,218,.34);
}


/* ! SEGURANÇA */
.bw-changelog-update h3:nth-of-type(3){
    color:#ffd05c;

    background:
        rgba(92,62,8,.30);

    border:
        1px solid rgba(214,153,36,.34);
}


/* ✓ CORRIGIDO */
.bw-changelog-update h3:nth-of-type(4){
    color:#78aaff;

    background:
        rgba(25,54,105,.30);

    border:
        1px solid rgba(76,128,224,.34);
}


/* Listas */

.bw-changelog-update ul{
    margin:4px 0 18px;
    padding-left:22px;
}

.bw-changelog-update li{
    margin:7px 0;

    color:#a9c3cf;

    line-height:1.55;
}

.bw-changelog-update li::marker{
    color:#5ebfe5;
}


/* Texto inicial */

.bw-changelog-update > p:first-child{
    color:#95b5c4;

    margin-bottom:8px;

    line-height:1.6;
}


/* Código inline */

.bw-changelog-update code{
    padding:2px 6px;

    border-radius:4px;

    color:#7edcff;

    background:
        rgba(45,135,174,.12);

    border:
        1px solid rgba(74,165,204,.15);
}