.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.hero-shadow {
    box-shadow: 0 20px 50px rgba(0, 87, 146, 0.15), 0 10px 20px rgba(0, 0, 0, 0.05);
}
.card-depth {
    box-shadow: 0 4px 24px -2px rgba(0,0,0,0.06), 0 2px 8px -2px rgba(0,0,0,0.04);
}
.editorial-gradient {
    background: linear-gradient(135deg, #005792 0%, #0170b9 100%);
}
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* Loading & Error States */
.status-view {
    text-align: center;
    padding: 100px 20px;
}
.spinner {
    border: 4px solid rgba(0, 87, 146, 0.1);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border-left-color: #005792;
    animation: spin 1s linear infinite;
    margin: 0 auto 20px auto;
}
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.hidden { display: none !important; }
.score-bar-bg { height: 6px; border-radius: 3px; background: #e1e3e4; overflow: hidden; }
.score-bar-fill { height: 100%; border-radius: 3px; transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1); }

/* Sidebar Scroll */
.sidebar-scroll::-webkit-scrollbar { width: 4px; }
.sidebar-scroll::-webkit-scrollbar-track { background: transparent; }
.sidebar-scroll::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.1); border-radius: 10px; }
.sidebar-scroll:hover::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.2); }

/* Custom Screenshot Gallery Layout */
.gallery-landscape {
    height: 180px;
}
@media (min-width: 640px) {
    .gallery-landscape {
        height: 240px;
    }
}
.gallery-portrait {
    height: 280px;
}
@media (min-width: 640px) {
    .gallery-portrait {
        height: 380px;
    }
}
.gallery-item-screenshot {
    height: 100% !important;
    width: auto !important;
    max-width: 85% !important;
}
.gallery-item-video {
    height: 100% !important;
    aspect-ratio: 16/9 !important;
    max-width: 85% !important;
}
