/** * Accueil #quests : accroche sous « Drop de la semaine », grille live, puis Prochains / Clôturés. * Chargé en dernier (block stylesheets). Préfixe #quests. */ #quests .home-quests-main-lede { margin: 0.35rem auto 0; text-align: center; font-size: clamp(0.95rem, 1.85vw, 1.1rem); line-height: 1.55; color: var(--text-muted, #636e72); } #quests .home-quests-live-zone { margin-top: 0.35rem; margin-bottom: 2.25rem; } /* Grille sans cartes : même traitement visuel que l’historique vide boutique (.empty-state-muted dans core) */ #quests .home-quests-grid-empty { grid-column: 1 / -1; } #quests .home-quests-block { margin-top: 2.5rem; padding-top: 0; } /* Premier sous-bloc = « Prochains drops » : séparateur sous la grille des drops ouverts */ #quests .home-quests-block:first-of-type { margin-top: 0; padding-top: 2.25rem; border-top: 1px solid var(--border-color, #dfe6e9); } #quests .home-quests-block:not(:first-of-type) { border-top: 1px solid var(--border-color, #dfe6e9); padding-top: 2.25rem; } #quests .home-quests-subheading { text-align: center; margin: 0 auto 1.35rem; } #quests .home-quests-subheading__title { margin: 0 0 0.5rem; font-family: var(--font-heading, 'Quicksand', sans-serif); font-size: clamp(1.4rem, 2.8vw, 2rem); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; color: var(--text-dark, #2d3436); } /* Petit trait sous le titre : ancrage visuel (couleur primaire maquette) */ #quests .home-quests-subheading__title::after { content: ''; display: block; width: 2.75rem; height: 3px; margin: 0.5rem auto 0; border-radius: 999px; background: linear-gradient( 90deg, rgba(95, 39, 205, 0.15), #5f27cd, rgba(95, 39, 205, 0.15) ); } #quests .home-quests-subheading__lede { margin: 0; padding-top: 0.15rem; font-size: clamp(0.95rem, 1.85vw, 1.1rem); line-height: 1.55; color: var(--text-muted, #636e72); } /* * Pastille « +N » sur les cartes de l’accueil : ce fichier est chargé **en dernier** dans * (block stylesheets après site + overrides) pour éviter un premier rendu « gris clair + chiffre sombre » * si une autre règle ou l’ordre du parse faisait encore matcher le .l-avatar générique seul. */ #quests .looter-faces-avatars .l-avatar.l-avatar-count, #quests .card-horizon .looter-faces-avatars .l-avatar.l-avatar-count { background: #636e72 !important; color: #fff !important; display: inline-flex !important; align-items: center; justify-content: center; font-family: var(--font-heading, 'Quicksand', sans-serif); /* Accueil #quests : légèrement plus petit que le socle global (.l-avatar.l-avatar-count dans cards.css) */ font-size: 0.75rem; font-weight: 800; letter-spacing: -0.015em; line-height: 1; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.12); object-fit: unset; white-space: nowrap; padding: 0 2px; box-sizing: border-box; -webkit-font-smoothing: antialiased; } /* --- Filtres catégories (#quests) : mobile / tablette — wrap centré (sans « carte » autour du bloc). --- */ @media (max-width: 900px) { #quests .filters { flex-wrap: wrap; justify-content: center; align-content: center; gap: 10px 10px; margin-bottom: 2rem; overflow-x: visible; overflow-y: visible; } #quests .filters .filter-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0.6rem 1.05rem; font-size: clamp(0.86rem, 2.75vw, 0.98rem); flex: 0 1 auto; border: 1px solid var(--border-light, #e9ecef); box-shadow: 0 1px 2px rgba(45, 52, 54, 0.05); } #quests .filters .filter-btn.active { border-color: transparent; box-shadow: 0 4px 14px rgba(255, 107, 129, 0.22); } #quests .filters .filter-btn i { margin-right: 6px; font-size: 0.92em; } } @media (max-width: 480px) { #quests .filters { gap: 8px; } #quests .filters .filter-btn { padding: 0.5rem 0.85rem; } }