/* ==========================================================
   MOT-LAMBDA V24 — FRONT HARMONY / ADVENTURE
   Un même langage visuel desktop + mobile.
   ========================================================== */


/* ==========================================================
   BRAND TYPOGRAPHY — CROSS-DEVICE
   ========================================================== */

.brand-lockup h1 {
    font-family:
        "Cinzel",
        Copperplate,
        "Copperplate Gothic Bold",
        Georgia,
        serif
        !important;

    font-weight:
        800
        !important;

    font-style:
        normal
        !important;

    text-transform:
        uppercase
        !important;

    letter-spacing:
        0.018em
        !important;

    font-synthesis:
        none;
}


/* Le nouveau module étant placé sous le header, on resserre
   légèrement l'espace vertical sans étouffer la marque. */

.game-header {
    margin-bottom:
        13px
        !important;
}


/* ==========================================================
   MOT DE LA VEILLE — PLAQUE AVENTURE
   ========================================================== */

.yesterday-word-card[hidden] {
    display:
        none
        !important;
}


body
.yesterday-word-card {
    position:
        relative;

    isolation:
        isolate;

    display:
        grid;

    grid-template-columns:
        auto
        minmax(
            0,
            1fr
        )
        auto;

    width:
        100%;

    box-sizing:
        border-box;

    margin:
        0
        0
        14px
        !important;

    padding:
        7px
        8px
        !important;

    overflow:
        hidden;

    align-items:
        center;

    gap:
        9px
        !important;

    border:
        1px solid
        rgba(
            236,
            173,
            69,
            0.42
        )
        !important;

    border-radius:
        7px
        !important;

    background:
        linear-gradient(
            116deg,
            #07111e 0%,
            #0d1d32 58%,
            #132943 100%
        )
        !important;

    box-shadow:
        0
        8px
        20px
        rgba(
            7,
            16,
            29,
            0.14
        )
        !important;

    color:
        #fff6e6;
}


body
.yesterday-word-card::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        -1;

    pointer-events:
        none;

    background:
        radial-gradient(
            circle
            at
            4%
            50%,
            rgba(
                244,
                190,
                90,
                0.16
            ),
            transparent
            24%
        ),
        linear-gradient(
            128deg,
            transparent
            0 73%,
            rgba(
                255,
                255,
                255,
                0.035
            )
            73% 74%,
            transparent
            74% 100%
        );
}


.yesterday-word-emblem {
    display:
        inline-flex;

    width:
        28px;

    height:
        28px;

    flex:
        0
        0
        28px;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(
            244,
            198,
            111,
            0.34
        );

    border-radius:
        4px;

    background:
        rgba(
            255,
            255,
            255,
            0.06
        );

    color:
        #f2bd5d;

    font-size:
        10px;

    text-shadow:
        0
        1px
        6px
        rgba(
            242,
            189,
            93,
            0.35
        );
}


body
.yesterday-word-copy {
    display:
        grid
        !important;

    grid-template-columns:
        minmax(
            100px,
            auto
        )
        minmax(
            90px,
            1fr
        );

    min-width:
        0;

    align-items:
        center
        !important;

    gap:
        11px
        !important;
}


body
.yesterday-word-heading {
    display:
        flex
        !important;

    min-width:
        0;

    flex-direction:
        column;

    justify-content:
        center;

    gap:
        2px
        !important;
}


body
.yesterday-word-kicker {
    color:
        #f4c66f
        !important;

    font-size:
        9px
        !important;

    font-weight:
        900;

    line-height:
        1.05;

    letter-spacing:
        0.085em
        !important;

    text-transform:
        uppercase;
}


body
.yesterday-word-meta {
    color:
        rgba(
            255,
            246,
            230,
            0.54
        )
        !important;

    font-size:
        8.5px
        !important;

    font-weight:
        650;

    line-height:
        1.05;

    white-space:
        nowrap;
}


/*
Le secret n'est PLUS dessiné comme un champ de formulaire.
Il vit directement dans la plaque. L'état masqué et révélé
occupent exactement la même zone.
*/

body
.yesterday-word-value,
body
.yesterday-word-value.is-masked {
    display:
        flex;

    min-width:
        0
        !important;

    min-height:
        28px;

    padding:
        0
        7px
        !important;

    overflow:
        hidden;

    align-items:
        center;

    justify-content:
        center;

    border:
        0
        !important;

    border-left:
        1px solid
        rgba(
            244,
            198,
            111,
            0.22
        )
        !important;

    border-radius:
        0
        !important;

    background:
        transparent
        !important;

    color:
        #fff8ea
        !important;

    font-size:
        clamp(
            12px,
            2.4vw,
            15px
        )
        !important;

    font-weight:
        900;

    line-height:
        1
        !important;

    letter-spacing:
        0.01em
        !important;

    text-align:
        center;

    text-shadow:
        none
        !important;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


body
.yesterday-word-value.is-masked {
    color:
        rgba(
            255,
            248,
            234,
            0.66
        )
        !important;

    font-size:
        10.5px
        !important;

    letter-spacing:
        0.17em
        !important;
}


/* ==========================================================
   REVEAL — ACTION SECONDAIRE / OR
   volontairement distincte du bouton principal OK.
   ========================================================== */

body
.yesterday-word-reveal {
    display:
        inline-flex;

    min-width:
        76px
        !important;

    height:
        32px;

    box-sizing:
        border-box;

    padding:
        0
        10px
        !important;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(
            255,
            225,
            165,
            0.44
        )
        !important;

    border-radius:
        4px
        !important;

    background:
        linear-gradient(
            180deg,
            #ffd47d 0%,
            #e7a23a 100%
        )
        !important;

    color:
        #111a28
        !important;

    font-size:
        10px
        !important;

    font-weight:
        900;

    line-height:
        1;

    box-shadow:
        0
        3px
        8px
        rgba(
            0,
            0,
            0,
            0.18
        ),
        inset
        0
        1px
        0
        rgba(
            255,
            255,
            255,
            0.42
        )
        !important;

    transform:
        none
        !important;

    transition:
        transform
        120ms ease,
        filter
        120ms ease;
}


body
.yesterday-word-reveal:hover:not(:disabled) {
    filter:
        brightness(
            1.05
        );
}


body
.yesterday-word-reveal:active:not(:disabled) {
    transform:
        translateY(
            1px
        )
        scale(
            0.985
        )
        !important;
}


body
.yesterday-word-reveal:disabled {
    opacity:
        0.55;
}


/* ==========================================================
   GAME STATS — ONLY USEFUL INFORMATION
   ========================================================== */

.game-stats {
    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        )
        !important;

    gap:
        9px
        !important;

    margin-bottom:
        14px
        !important;
}


.game-stats
.stat {
    min-width:
        0;

    padding:
        10px
        12px
        !important;
}


.game-stats
.stat-label {
    margin-bottom:
        2px
        !important;

    font-size:
        9.5px
        !important;
}


.game-stats
.stat strong {
    font-size:
        15px
        !important;
}


/*
En archive, "Déjà trouvé par" est masqué par le JS existant.
Le seul compteur restant reprend toute la largeur.
*/

.game-stats:has(
    .stat-solvers[hidden]
)
.stat-attempts {
    grid-column:
        1
        / -1;
}


/* ==========================================================
   MOBILE
   Même composant, mêmes couleurs : seulement plus dense.
   ========================================================== */

@media (
    max-width:
        700px
) {

    .brand-lockup h1 {
        font-family:
            "Cinzel",
            Copperplate,
            "Copperplate Gothic Bold",
            Georgia,
            serif
            !important;

        font-size:
            22px
            !important;

        font-weight:
            800
            !important;

        line-height:
            0.96
            !important;

        letter-spacing:
            0.012em
            !important;
    }


    .game-header {
        margin-bottom:
            10px
            !important;
    }


    body
    .yesterday-word-card {
        margin-bottom:
            10px
            !important;

        padding:
            6px
            !important;

        gap:
            6px
            !important;

        border-radius:
            6px
            !important;
    }


    .yesterday-word-emblem {
        width:
            24px;

        height:
            24px;

        flex-basis:
            24px;

        font-size:
            8px;
    }


    body
    .yesterday-word-copy {
        grid-template-columns:
            67px
            minmax(
                0,
                1fr
            );

        gap:
            5px
            !important;
    }


    body
    .yesterday-word-meta {
        display:
            none
            !important;
    }


    body
    .yesterday-word-kicker {
        font-size:
            7.2px
            !important;

        letter-spacing:
            0.052em
            !important;
    }


    body
    .yesterday-word-value,
    body
    .yesterday-word-value.is-masked {
        min-height:
            26px;

        padding:
            0
            4px
            !important;

        font-size:
            clamp(
                10px,
                3.25vw,
                12.5px
            )
            !important;
    }


    body
    .yesterday-word-value.is-masked {
        font-size:
            9px
            !important;
    }


    body
    .yesterday-word-reveal {
        min-width:
            66px
            !important;

        height:
            30px;

        padding:
            0
            7px
            !important;

        font-size:
            9px
            !important;
    }


    .game-stats {
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            )
            !important;

        gap:
            8px
            !important;

        margin-bottom:
            10px
            !important;
    }


    .game-stats
    .stat-solvers {
        grid-column:
            auto
            !important;
    }


    .game-stats
    .stat {
        padding:
            8px
            9px
            !important;
    }


    .game-stats
    .stat-label {
        font-size:
            8.5px
            !important;
    }


    .game-stats
    .stat strong {
        font-size:
            14px
            !important;
    }
}


@media (
    max-width:
        365px
) {

    .brand-lockup h1 {
        font-size:
            20px
            !important;
    }


    .yesterday-word-emblem {
        display:
            none;
    }


    body
    .yesterday-word-copy {
        grid-template-columns:
            61px
            minmax(
                0,
                1fr
            );
    }


    body
    .yesterday-word-reveal {
        min-width:
            62px
            !important;
    }
}


@media (
    prefers-reduced-motion:
        reduce
) {

    body
    .yesterday-word-reveal {
        transition:
            none
            !important;
    }
}