/* events.css — styles réservés aux événements (evenements/*) et à leurs cartes sur l'accueil
   Chargé après style.css (voir les en-têtes de page). Généré par scission de style.css le 2026-11-01 :
   règles dont les classes ne servent qu'à ces pages. */



/* 🔥 AJOUT (demande explicite du 2026-09-26, "replacer le bouton" --
   remplace .crab-edition-back sur ce lien précis, trop discret pour être
   reconnu comme un bouton). */
.warship-manager-event-cta {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 2px;
    background: #359935;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}
.warship-manager-event-cta:hover {
    background: #2a7a2a;
    text-decoration: none;
}
/* 🔥 CORRECTIF (demande explicite, "icon de cano un peu trop grand") : icône
   "Coût en canonnière" (icon_gunboat) de la page "Capacité supplémentaire"
   (voir core/functions.php) affichée en ligne avec le texte -- comme
   .wiki-icon-inline juste au-dessus, mais cette classe n'avait jamais eu de
   règle CSS du tout, donc l'image s'affichait à sa taille native (bien plus
   grande que l'icône 16-18px utilisée partout ailleurs pour ce même
   icon_gunboat, voir .character-levels-icon dans beachadex.css). */
.gba-energy-icon {
    width: 18px;
    height: 18px;
    object-fit: contain;
    vertical-align: -3px;
}

/* 🔥 AJOUT (demande explicite, div "Accès anticipé" -- liste des
   statistiques réduites) : chips discrètes, même registre que
   .actu-card-hq (petite pastille teintée, renommée round 11), teintées de
   l'accent or de .wiki-article-section-gold pour rester cohérentes avec le
   bandeau de la section. */
.troopmania-earlyaccess-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}
.troopmania-earlyaccess-stat {
    display: inline-block;
    background: #fbf3de;
    color: #8a6d1a;
    border: 1px solid #eddba8;
    border-radius: 2px;
    padding: 5px 14px;
    font-size: 0.85em;
    font-weight: 700;
}

/* ==========================================================================
   TOPBAR page d'accueil — repris de beachadex-topbar (beachadex/includes/
   header.php) pour que index.php se fonde visuellement dans le reste du
   site : même fond, même bordure teal, mêmes liens de nav + icônes
   Search.png / Menu.png. Classes propres (public-home-*) car header.php
   n'est pas inclus ici (le bouton Dashboard/Connexion diffère du reste).
   ========================================================================== */

/* ==========================================================================
   HERO — gros titre + mini présentation + barre de recherche, au-dessus des
   quickcards. La recherche tape sur beachadex/search.php (même endpoint que
   la recherche du header Beachadex) et liste personnages/bâtiments.
   ========================================================================== */
    .public-home-hero {
        max-width: 780px;
        margin: 44px auto 8px;
        padding: 0 16px;
        text-align: center;
    }

    .public-home-hero-title {
        font-family: 'Bangers', cursive;
        letter-spacing: 1.5px;
        font-size: 3em;
        margin: 0 0 12px;
        color: #dde1e5;
        -webkit-text-stroke: 1px #2b2e31;
        paint-order: stroke fill;
        text-shadow: 3px 3px 0 #000, 0 0 8px rgba(0,0,0,.55);
        /* ✨ 11/10 : logo + titre centrés verticalement (le logo restait en hauteur). */
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        line-height: 1;
    }
    .public-home-hero-title img { display: block; height: auto; flex: none; }

    .public-home-hero-search-input {
        width: 100%;
        box-sizing: border-box;
        background: #1a252f;
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: #ecf0f1;
        font-size: 0.95em;
        padding: 13px 16px 13px 42px;
        border-radius: 2px;
        outline: none;
        transition: border-color 0.15s ease;
    }
    .public-home-hero-search-input:focus { border-color: #2f8fd1; }
    .public-home-hero-search-input::placeholder { color: #6d8390; }

    .public-home-hero-search-icon {
        position: absolute;
        left: 14px;
        top: 50%;
        transform: translateY(-50%);
        width: 17px;
        height: 17px;
        opacity: 0.6;
        pointer-events: none;
    }

    .public-home-hero-search-results {
        position: absolute;
        left: 0;
        right: 0;
        top: calc(100% + 8px);
        background: #1e2b38;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 2px;
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
        overflow: hidden;
        z-index: 20;
        text-align: left;
    }

    .public-home-hero-search-results a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 14px;
        text-decoration: none;
        color: #ecf0f1;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }
    .public-home-hero-search-results a:last-child { border-bottom: none; }
    .public-home-hero-search-results a:hover { background: #243546; }

    .public-home-hero-search-results img {
        width: 26px;
        height: 26px;
        object-fit: contain;
        flex-shrink: 0;
    }

    .public-home-hero-search-results .phs-name { font-weight: 600; font-size: 0.9em; }
    .public-home-hero-search-results .phs-type {
        margin-left: auto;
        font-size: 0.78em;
        color: #7f97a6;
        white-space: nowrap;
    }

    .public-home-hero-search-empty {
        padding: 12px 14px;
        color: #7f97a6;
        font-size: 0.88em;
    }

/* 🔥 AJOUT (CORRECTIF demande explicite du 2026-09-23, pop-up scindée en 2
   accordéons "amélioration warships" / "statistiques par niveau") : <details>
   natif plutôt qu'un accordéon JS maison -- gratuit, accessible au clavier,
   se ferme/ouvre sans code additionnel (voir renderWarshipNodeInfoModal()). */

/* =========================================================================
   🔥 AJOUT (demande explicite, round "warships_manager") : page joueur
   beachadex/evenements/warships_manager.php -- barre de totaux (unlock_key/
   upgrade_key sommés depuis warship_chest_loot + tech_lvl), formulaire
   "Start" (rang de départ = -40% des étoiles saison précédente) et liste
   horizontale des 35 rangs avec bouton "Récupérer" par rang.
   ========================================================================= */

.warship-manager-no-player {
    text-align: center;
    margin: 24px 0;
}

.warship-manager-start-form {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: center;
    gap: 12px;
    margin-top: 8px;
}
.warship-manager-start-form label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 0.9em;
}
.warship-manager-start-form input[type="number"] {
    width: 140px;
    padding: 6px 8px;
}
.warship-manager-reset-btn {
    background: #5a1f1f;
    color: #fff;
    border: 1px solid #8a3030;
}
.warship-manager-switch-player-form label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9em;
}
.warship-manager-switch-player-form select {
    padding: 6px 8px;
}

#warship-start-mode-previous label,
#warship-start-mode-current label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 0.9em;
    margin-bottom: 12px;
    color: #f0f0f5;
}
#warship-start-mode-previous input[type="number"],
#warship-start-mode-current input[type="number"] {
    padding: 6px 8px;
}

/* 🔥 AJOUT (11e passage, "ajoute un formulaire pour ajouter un nombre de
   clé d'amélioration/déblocage [...] le choix entre garder la route
   classique ou avoir les ressources illimités") : formulaire replié par
   défaut (voir form_action=add_keys, warships_manager.php) pour ajouter
   manuellement des clés au stock réel. */
.warship-manager-add-keys {
    margin: 12px auto 20px;
    max-width: 360px;
    text-align: center;
}
.warship-manager-add-keys summary {
    cursor: pointer;
    font-weight: 600;
    color: #ffd966;
}
.warship-manager-add-keys-form {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
}
.warship-manager-add-keys-form label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 0.85em;
}
.warship-manager-add-keys-form input[type="number"] {
    padding: 6px 8px;
    width: 100px;
}
.warship-manager-add-keys-form button {
    padding: 8px 16px;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    border-radius: 2px;
    cursor: pointer;
}

/* 🔥 REFONTE (demande explicite du round "tableau 5x7 + icônes de rang",
   "un tableau de 5 x 7 (5 rangs sur 7 lignes)") : grille fixe (35 rangs = 5
   colonnes x 7 lignes exactement) à la place de la ligne qui scroll. */

/* 🔥 AJOUT (demande explicite : "remplacer warship-manager-rank-name par
   l'icon") : icône de badge extraite du mouvement clip XFL du jeu, à la
   place du texte brut du rang (voir warshipRankBadgeIconUrl()). */
.warship-manager-rank-icon {
    width: 56px;
    height: 56px;
    object-fit: contain;
}
.warship-manager-claim-all-form {
    align-self: flex-start;
    margin: 0 0 4px;
}
.warship-manager-claim-all-btn {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    padding: 8px 14px;
    background: #ffe27a;
    color: #2b2205;
    font-weight: 700;
}
.warship-manager-claim-all-btn:hover {
    background: #f5d15f;
}

/* 🔥 REFONTE (demande explicite du 2026-09-26 soir, "malentendu" -- restaure
   le bouton "Récupérer" par rang, voir renderWarshipRankList()). */
.warship-manager-rank-claim-form {
    margin: 0;
}
.warship-manager-rank-claim-btn {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    padding: 4px 10px;
    background: #ffe27a;
    color: #2b2205;
    font-weight: 700;
    font-size: 0.8em;
}
.warship-manager-rank-claim-btn:hover {
    background: #f5d15f;
}

/* 🔥 AJOUT (demande explicite du 2026-09-26, "augmenter de rang"/"total de
   coffre"/"récupérer un coffre") : bloc d'actions du nouveau système de
   rang, posé entre l'aperçu débloqués et la liste de progression des rangs
   -- voir renderWarshipManagerRankActions() (functions_warships_manager.php). */
.warship-manager-rank-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin: 16px 0;
    padding: 12px 16px;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.25);
}
.warship-manager-rank-action-form {
    display: flex;
    align-items: center;
    gap: 8px;
}
.warship-manager-rank-action-form button {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    padding: 8px 14px;
    background: #359935;
    color: #fff;
    font-weight: 700;
}
.warship-manager-rank-action-form button:hover:not(:disabled) {
    background: #2a7a2a;
}
.warship-manager-rank-action-form button:disabled,
.warship-manager-open-chest-form select:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.warship-manager-open-chest-form select {
    border-radius: 2px;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.25);
}

/* 🔥 AJOUT (demande explicite : "la div warship-manager-chest-pool passe à
   droite du tableau des rangs") : conteneur 2 colonnes -- grille de rangs à
   gauche (flexible), pool de coffres à droite (largeur fixe), empile en 1
   colonne sur mobile/écran étroit. */
.warship-manager-rank-board {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin: 24px 0;
}
.warship-manager-rank-panel-col {
    flex: 1 1 auto;
    min-width: 0;
}
.warship-manager-chest-pool-col {
    flex: 0 0 280px;
}
@media (max-width: 900px) {
    .warship-manager-rank-board {
        flex-direction: column;
    }
    .warship-manager-chest-pool-col {
        flex-basis: auto;
        width: 100%;
    }
}

/* 🔥 REFONTE (demande explicite du round "tableau 5x7" : "starter pack de 4
   coffres récupérable à tout moment... et au dessus le cumul de 62
   coffres") : pool de coffres générique temporel, désormais scindé en 2
   sous-blocs (voir renderWarshipManagerChestPool(),
   functions_warships_manager.php) -- bloc séparé de
   .warship-manager-rank-actions. */
.warship-manager-chest-pool {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
    padding: 12px 16px;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.25);
}

.warship-manager-open-chest-form {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}

.warship-chest-quantity-input {
    border-radius: 2px;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.25);
    width: 100%;
}
.warship-manager-open-chest-form button {
    cursor: pointer;
    border: none;
    border-radius: 2px;
    padding: 8px 14px;
    background: #359935;
    color: #fff;
    font-weight: 700;
}
.warship-manager-open-chest-form button:hover:not(:disabled) {
    background: #2a7a2a;
}
.warship-manager-open-chest-form button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
/* Menu déroulant "maison" avec icône de rareté (demande explicite : "ajoute
   l'icon de la rareté dans la liste déroulante") -- le <select> réel reste
   caché, seul ce menu est visible/cliquable (voir JS inline de
   renderWarshipManagerChestPool()). */

.warship-chest-type-icon {
    width: 22px;
    height: 22px;
    object-fit: contain;
}
/* 🔥 AJOUT (demande explicite du 28/09, bouton "Récompenses de coffres") */
.warship-rewards-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
    font-size: 0.9em;
}
.warship-rewards-table th,
.warship-rewards-table td {
    padding: 6px 10px;
    border-bottom: 1px solid var(--wiki-border, #3a3a4a);
    text-align: left;
}
.warship-rewards-table .warship-rewards-type {
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.warship-rewards-table .warship-chest-type-icon {
    width: 20px;
    height: 20px;
}
.warship-manager-combat-column {
    flex: 1 1 320px;
    max-width: 900px;
    min-width: 260px;
}
/* 🔥 AJOUT (demande explicite du 2026-09-26 tard le soir, "tu peux faire 2 et
   3 colonnes pour Défenses et Attaque [...]") : chaque colonne Défense/Attaque
   se subdivise désormais en 2 ou 3 sous-colonnes côte à côte (voir
   getWarshipUnlockedItemSubColumn(), functions_warships_manager.php) --
   wrap sur petit écran plutôt que de déborder.*/
.warship-manager-combat-subrow {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
}
.warship-manager-combat-subcolumn {
    flex: 1 1 160px;
    min-width: 140px;
}
.warship-manager-combat-subtitle {
    text-align: center;
    font-size: 0.78em;
    font-weight: 600;
    color: var(--wiki-text-soft, #9fb2c3);
    margin: 0 0 6px;
    opacity: 0.85;
}
.warship-manager-combat-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.warship-manager-combat-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 2px;
    padding: 4px 8px;
}
.warship-manager-combat-icon {
    width: 26px;
    height: 26px;
    object-fit: contain;
    flex-shrink: 0;
}
.warship-manager-combat-name {
    flex: 1 1 auto;
    font-weight: 600;
}
/* 🔥 AJOUT (demande explicite du 2026-09-26 tard le soir, "ajoute le niveau
   de la troupe (avec le texte niv. [niveau])") : même look que le tick, mais
   affiché juste avant la quantité. */
.warship-manager-combat-niveau {
    font-size: 0.8em;
    color: var(--wiki-text-soft, #9fb2c3);
    white-space: nowrap;
}
.warship-manager-combat-qty {
    font-weight: 800;
    color: #1b4f8f; /* bleu foncé : distinct des bonus (vert/rouge) */
    white-space: nowrap;
}
/* 🔥 AJOUT (demande explicite du 2026-09-26 tard le soir, "Ajoute les valeurs
   des bonus débloqués") : même look que la quantité de bâtiment (.warship-
   manager-combat-qty), couleur différente pour ne pas confondre "quantité en
   stock" et "valeur de bonus/gravure" au premier coup d'œil. */
.warship-manager-combat-value {
    font-weight: 800;
    color: #14692a; /* vert foncé : lisible sur fond beige */
    white-space: nowrap;
}
.warship-manager-combat-value.is-negative {
    color: #b3261e; /* bonus négatif : rouge */
}
.warship-manager-combat-empty {
    text-align: center;
    color: var(--wiki-text-soft, #9fb2c3);
    font-style: italic;
}

/* 🔥 AJOUT (demande explicite, 03/10, "bouton 'modifier la visibilité de
   l'événement' [...] sur les pages des événements") : contrôle admin-only
   (rapport_blackguard), voir renderRapportBlackguardAdminControl()
   (core/functions/functions_events.php) -- bandeau distinct (fond orange
   d'alerte) pour que ce soit clairement identifiable comme un outil
   d'édition et pas un élément de la fiche elle-même. */
.admin-rapport-blackguard-control {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    background: rgba(230, 126, 34, 0.15);
    border: 1px solid rgba(230, 126, 34, 0.5);
    border-radius: 2px;
    padding: 10px 14px;
    margin: 0 0 16px;
    font-size: 0.9em;
}
.admin-rapport-blackguard-control label {
    font-weight: 700;
    color: #e67e22;
}
.admin-rapport-blackguard-control select {
    background: #1b2834;
    color: #e8eef3;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 2px;
    padding: 4px 8px;
}

/* ===== Warships Manager : menu hamburger, page large, arbre plein écran ===== */
.warship-menu { position: relative; }
.warship-menu-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 50;
    min-width: 260px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    background: #142a3f;
    border: 1px solid #3f9cd9;
    border-radius: 3px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.warship-menu-panel[hidden] { display: none; }
.warship-menu-panel button { width: 100%; text-align: left; }
.warship-menu-panel {
    background: #fbf3de;
    border: 1px solid #cdb888;
    border-radius: 4px;
    padding: 6px;
    gap: 2px;
    box-shadow: 0 10px 24px rgba(60, 40, 10, 0.25);
}
.warship-menu-panel form { margin: 0; }
.warship-menu-panel button,
.warship-menu-panel .warship-manager-reset-btn,
.warship-menu-panel .warship-manager-open-rewards-popup-btn {
    width: 100%;
    text-align: left;
    background: transparent;
    color: #3b2a14;
    border: 0;
    border-radius: 3px;
    padding: 10px 12px;
    font-weight: 600;
    font-size: 0.92em;
}
.warship-menu-panel .warship-manager-open-rewards-popup-btn:hover { background: rgba(47, 128, 196, 0.14); }
.warship-menu-panel .warship-manager-reset-btn { color: #9b2a2a; }
.warship-menu-panel .warship-manager-reset-btn:hover { background: rgba(155, 42, 42, 0.12); }
.warship-menu-panel form + form,
.warship-menu-panel button + form { border-top: 1px solid rgba(120, 90, 40, 0.18); }

/* Pool de coffres : le champ quantité ne déborde plus */
.warship-manager-chest-pool input,
.warship-manager-chest-pool select { max-width: 100%; box-sizing: border-box; }

/* ===== Rangs : niveau sur le badge, fenêtre mobile repliable ===== */
.warship-manager-rank-badge { position: relative; display: inline-block; line-height: 0; }

@media (max-width: 900px) {
    .warship-manager-rank-board { align-items: stretch; }
    .warship-manager-rank-panel-col,
    .warship-manager-chest-pool-col { width: 100%; box-sizing: border-box; }
}

/* Barre d'actions des rangs : nombre de rangs + "Récupérer tous les coffres" à droite */
.warship-rank-steps-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    color: #fff;
}
.warship-rank-steps {
    width: 56px;
    padding: 6px 4px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.25);
    color: #fff;
    font-weight: 700;
}
.warship-manager-claim-all-inline { align-self: center; margin: 0 0 0 auto; }
@media (max-width: 640px) {
    .warship-manager-claim-all-inline { margin: 0; width: 100%; }
    .warship-manager-claim-all-inline .warship-manager-claim-all-btn { width: 100%; }
}

/* Stats de l'arbre : tick / niveau / quantité sous le nom sur mobile */
.warship-manager-combat-text,
.warship-manager-combat-meta { display: contents; }
@media (max-width: 640px) {
    .warship-manager-combat-text {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        min-width: 0;
    }
    .warship-manager-combat-meta {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 8px;
    }
}

.wq-note { opacity: .75; font-size: .9em; }
.wq-sub { opacity: .7; font-size: .85em; }
.wq-steps input { width: 56px; text-align: center; }
.wq-btn-green { background: #359935; }
.wq-btn-gold { background: #ffe27a; color: #2b2205; }
.wq-btn-small { padding: 5px 10px; font-size: .85em; }
.wq-full { width: 100%; }
.wq-inline-col { flex: 1 1 0; min-width: 0; }

/* Fond du hero de l'accueil (top_bg_content) */
.public-home-hero{background-size:100% 100%;background-repeat:no-repeat;background-position:center;padding:28px 40px 32px}
.public-home-hero{max-width:none;width:100%;box-sizing:border-box;margin:0 0 8px;padding:44px 16px 48px;background-size:cover}
.public-home-hero > *{max-width:780px;margin-left:auto;margin-right:auto}
.public-home-hero > .public-home-hero-search{max-width:480px}
@media (max-width: 480px) { .warship-modal-start .wss-form { padding: 16px 16px 6px; } .warship-modal-start .wss-rank { margin: 12px 16px 16px; } }

/* Warships Manager : bloc « mode invité » (sauvegarde / restauration) et rattachement au profil. */
.wsg-box { margin: 0 0 16px; padding: 12px 16px; border: 1px solid #cddbe8; border-radius: 12px; background: #f1f6fa; color: #1d2b3a; font-size: .92em; }
.wsg-box summary { cursor: pointer; font-weight: 700; }
.wsg-box p { margin: 10px 0; line-height: 1.45; }
.wsg-box a { color: #1f78b8; text-decoration: underline; }
.wsg-label { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 8px; font-weight: 600; }
.wsg-box textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid #b9cadb; border-radius: 8px; background: #fff; color: #1d2b3a; font: 12px/1.35 monospace; resize: vertical; word-break: break-all; }
.wsg-btn { padding: 8px 16px; border: 0; border-radius: 8px; background: #2f8fd1; color: #fff; font-weight: 700; cursor: pointer; }
.wsg-btn:hover { background: #247bb8; }
.wsg-import { margin-top: 14px; padding-top: 12px; border-top: 1px solid #d5e3ee; }
.warship-manager-switch-player-form label { color: #5b4527; font-weight: 600; }
.warship-manager-switch-player-form select {
    border: 1px solid #cdb888; border-radius: 6px; background: #fff; color: #2a2a3a; padding: 7px 10px;
}

.warship-manager-add-keys { margin: 4px auto 18px; max-width: 420px; }
.warship-manager-add-keys summary {
    display: inline-block;
    padding: 5px 14px;
    font-size: .85em;
    color: #5b4527;
    background: #fbf3de;
    border: 1px dashed #b79a63;
    border-radius: 999px;
    list-style: none;
}
.warship-manager-add-keys summary::-webkit-details-marker { display: none; }
.warship-manager-add-keys summary:hover { background: #f4e7c4; }
.warship-manager-add-keys[open] summary { border-style: solid; }
.warship-manager-add-keys-form {
    padding: 12px;
    background: #fbf3de;
    border: 1px solid #cdb888;
    border-radius: 10px;
    color: #3d2d17;
}
.warship-manager-add-keys-form button { background: #2f80c4; color: #fff; border: 0; border-radius: 6px; }
.wms-hud::before {
    content: ''; position: absolute; left: 0; top: 0; width: calc(720px * var(--s)); height: calc(87px * var(--s));
    background: url('images/warroom_tree_hud_bars.png') 0 0 / 100% 100% no-repeat;
}
.wms-hud .wms-item { position: absolute; display: flex; align-items: center; justify-content: flex-end; white-space: nowrap; text-shadow: 0 1px 2px #000; box-sizing: border-box; padding-right: calc(6px * var(--s)); }
.wms-hud .wms-item span { font-size: calc(24px * var(--s)); line-height: 1; font-variant-numeric: tabular-nums; }
.wms-hud .wms-tech { left: calc(80px * var(--s)); top: calc(17px * var(--s)); width: calc(106px * var(--s)); height: calc(48px * var(--s)); }
.wms-hud .wms-tech span { font-size: calc(30px * var(--s)); font-style: italic; }
.wms-hud .wms-uk { left: calc(408px * var(--s)); top: calc(27px * var(--s)); width: calc(136px * var(--s)); height: calc(32px * var(--s)); }
.wms-hud .wms-ug { left: calc(571px * var(--s)); top: calc(27px * var(--s)); width: calc(137px * var(--s)); height: calc(32px * var(--s)); }
.wms-hud .wms-item img { position: absolute; left: calc(-18px * var(--s)); top: 50%; width: calc(44px * var(--s)); height: calc(44px * var(--s)); object-fit: contain; transform: translateY(-50%); filter: drop-shadow(0 1px 1px #000); }

/* HUD : grands nombres (ex. 610 500) mieux contenus dans leur barre, sans toucher l'icône */
.wms-hud .wms-uk, .wms-hud .wms-ug { padding-left: calc(24px * var(--s)); }
.wms-hud .wms-uk span, .wms-hud .wms-ug span { font-size: calc(19px * var(--s)); letter-spacing: -0.02em; }
.wms-hud .wms-item img { left: calc(-22px * var(--s)); }

/* Popup « Débuter la saison » : saisie par étoiles totales ou par rang + étoiles */
.wss-kind { display: flex; gap: 6px; margin: 4px 0 10px; }
.wss-rank-block select, .wss-rank-block input { width: 100%; box-sizing: border-box; }
.wss-preview { margin: 8px 0 14px; font-size: 13px; font-weight: 700; color: #1b5d8c; }
.evx-next { display: block; background: #f4f6f7; color: #1c2c39; border-radius: 10px; overflow: hidden; text-decoration: none; box-shadow: 0 8px 22px rgba(0,0,0,.35); transition: transform .15s; }
.evx-next:hover { transform: translateY(-2px); text-decoration: none; }
.evx-next { box-shadow: 0 6px 18px rgba(22,34,51,.18); border: 1px solid #dfe5e9; }

/* Accueil (bureau uniquement) : personnages décoratifs sur le bandeau du haut */
.public-home-hero { position: relative; }
.public-home-hero-deco { display: none; }
@media (min-width: 1200px) {
    .public-home-hero-deco { display: block; position: absolute; bottom: 0; z-index: 0; pointer-events: none; height: auto; filter: drop-shadow(0 6px 8px rgba(0,0,0,.4)); }
    .public-home-hero-deco.is-left { left: 5%; width: clamp(150px, 15vw, 270px); }
    .public-home-hero-deco.is-right { right: 6%; width: clamp(90px, 9vw, 160px); }
}

/* Bannière « Nouvelle mise à jour » (accueil, pleine largeur, au-dessus du planning) */
.upd-banner { display: flex; align-items: center; gap: 20px; width: 90%; margin: 20px auto 0; padding: 14px 24px; box-sizing: border-box; border-radius: 14px; text-decoration: none; color: #fff; border: 2px solid #fff; box-shadow: 0 6px 18px rgba(0,0,0,.3); background: #1f4f9c url('images/gacha_background.png') center / cover no-repeat; position: relative; overflow: hidden; transition: transform .15s, box-shadow .15s; }
.upd-banner:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0,0,0,.38); }
.upd-banner-img { height: 84px; width: auto; max-width: 34%; object-fit: cover; border-radius: 10px; border: 2px solid rgba(255,255,255,.85); flex: 0 0 auto; }
.upd-banner-text { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.upd-banner-tag { align-self: flex-start; padding: 2px 12px; border-radius: 999px; background: #f2b01e; color: #3b2a14; font-weight: 700; font-size: .85rem; }
.upd-banner-title { font-family: 'Bangers', cursive; font-size: 2.1rem; letter-spacing: 1px; line-height: 1.1; color: #fff; text-shadow: 2px 2px 0 rgba(0,0,0,.55); }
.upd-banner-cta { flex: 0 0 auto; padding: 10px 22px; border-radius: 10px; background: #f2b01e; color: #3b2a14; font-weight: 700; box-shadow: 0 3px 0 #b98312; }
@media (max-width: 768px) {
    .upd-banner { width: calc(100% - 24px); flex-direction: column; align-items: stretch; text-align: center; gap: 10px; padding: 12px; }
    .upd-banner-img { width: 100%; max-width: 100%; height: 110px; }
    .upd-banner-tag { align-self: center; }
    .upd-banner-title { font-size: 1.6rem; }
}
.wrp-badge { transition: transform .15s ease, filter .15s ease; }
.warship-manager-rank-actions { gap: 10px; }
.warship-manager-rank-actions .warship-rank-steps-label { display: none; }
.warship-manager-rank-actions .wsm-btn {
    display: inline-flex; align-items: center; gap: 8px;
    cursor: pointer; border: 0; border-radius: 10px;
    padding: 10px 16px; font-weight: 800; font-size: 0.95em; line-height: 1;
    color: #fff; box-shadow: 0 3px 0 rgba(0,0,0,.28);
    transition: transform .08s ease, box-shadow .08s ease, filter .12s ease;
}
.warship-manager-rank-actions .wsm-btn:hover:not(:disabled) { filter: brightness(1.08); }
.warship-manager-rank-actions .wsm-btn:active:not(:disabled) { transform: translateY(2px); box-shadow: 0 1px 0 rgba(0,0,0,.28); }
.warship-manager-rank-actions .wsm-btn:disabled { opacity: .4; cursor: not-allowed; box-shadow: none; }
.warship-manager-rank-actions .wsm-btn-up { background: #2f8f3f; }
.warship-manager-rank-actions .wsm-btn-down { background: #b5532a; }
.warship-manager-rank-actions .wsm-btn-claim { background: #e0a91a; color: #2b2205; }

/* Hero accueil : ombre de plus en plus épaisse vers le centre pour faire ressortir
   "Beachapédia" (dégradé radial centré sur le titre, sous les personnages et le contenu). */
.public-home-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 46% 62% at 50% 34%, rgba(3, 14, 28, 0.82) 0%, rgba(3, 14, 28, 0.62) 30%, rgba(3, 14, 28, 0.30) 58%, rgba(3, 14, 28, 0) 100%);
}
.public-home-hero > :not(.public-home-hero-deco) { position: relative; z-index: 1; }
.public-home-hero-title { text-shadow: 3px 3px 0 #000, 0 0 10px rgba(0,0,0,.9), 0 0 28px rgba(0,0,0,.7); }

/* Prix du pass premium (Blitz) au-dessus de la grille de récompenses. */
.event-pass-price { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-weight: 700; color: #7a5600; }
.event-pass-price img { width: 26px; height: 26px; object-fit: contain; }