/* STREAMING_CHUNK:Definindo estilos CSS globais do projeto... */
body {
background-color: #0b0c10;
color: #c5c6c7;
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* PADRÃO DE GRADE NO FUNDO DA TELA */
.bg-grid-pattern {
background-image: radial-gradient(rgba(99, 102, 241, 0.15) 1px, transparent 1px);
background-size: 28px 28px;
}

/* EFEITOS DE VIDRO (GLASSMORPHISM) COM SUPORTE A SAFARI */
.glass-card {
background-color: rgba(15, 23, 42, 0.88);
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
}

.glass-header {
background-color: rgba(2, 6, 23, 0.85);
-webkit-backdrop-filter: blur(12px);
backdrop-filter: blur(12px);
}

/* ESTILIZAÇÃO DA BARRA DE ROLAGEM */
::-webkit-scrollbar {
width: 8px;
}

::-webkit-scrollbar-track {
background: #0b0c10;
}

::-webkit-scrollbar-thumb {
background: #1e1b4b;
border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
background: #4f46e5;
}

/* BANNERS DOS RECURSOS (INDEX) — imagem de fundo via classe (evita style inline) */
.banner-map { background-image: url('/assets/img/general-banners/map-banner.png'); }
.banner-lights { background-image: url('/assets/img/general-banners/lights-banner.png'); }
.banner-dice { background-image: url('/assets/img/general-banners/dice-banner.png'); }
.banner-cards { background-image: url('/assets/img/general-banners/cards-banner.png'); }
.banner-journal { background-image: url('/assets/img/general-banners/journal-banner.png'); }
.banner-macro { background-image: url('/assets/img/general-banners/macro-banner.png'); }
.banner-portal { background-image: url('/assets/img/general-banners/portal-banner.png'); }
.banner-ruins { background-image: url('/assets/img/general-banners/ruins-banner.png'); }

/* BOTÕES DE CATEGORIA E FILTROS (ARTIGOS) */
.cat-btn {
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    transition: all 0.15s ease-in-out;
    user-select: none;
    flex-shrink: 0;
}

/* UTILITÁRIO LINE CLAMP SEGURO */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}