body {
    background-color: #f8f9fa;
    background-image: 
        linear-gradient(rgba(0, 0, 0, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 0, 0, 0.04) 1px, transparent 1px);
    background-size: 24px 24px;
    transition: background-color 0.3s ease;
    overscroll-behavior: none;
}

.dark body {
    background-color: #202124;
    background-image: 
        linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
}

.offer-card {
    border: 1px solid #dadce0;
    transition: all 0.2s ease;
}
.dark .offer-card {
    border-color: #3c4043;
    background-color: #292a2d;
}
.offer-card:hover {
    background-color: #f8f9fa;
    border-color: #bdc1c6;
}
.dark .offer-card:hover { 
    background-color: #3c4043;
    border-color: #5f6368;
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background-color: #dadce0; border-radius: 3px; }
.dark ::-webkit-scrollbar-thumb { background-color: #5f6368; }

.skeleton {
    background-color: #e8eaed;
    position: relative;
    overflow: hidden;
}
.dark .skeleton {
    background-color: #3c4043;
}
.skeleton::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0,
        rgba(255, 255, 255, 0.2) 20%,
        rgba(255, 255, 255, 0.5) 60%,
        rgba(255, 255, 255, 0)
    );
    animation: shimmer 2s infinite;
    content: '';
}
.dark .skeleton::after {
    background-image: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0,
        rgba(255, 255, 255, 0.05) 20%,
        rgba(255, 255, 255, 0.1) 60%,
        rgba(255, 255, 255, 0)
    );
}

@keyframes shimmer {
    100% {
        transform: translateX(100%);
    }
}

.mfp-bg {
    background: rgba(32, 33, 36, 0.8);
    backdrop-filter: blur(2px);
}
.dark .mfp-bg {
    background: rgba(0, 0, 0, 0.8);
}

.mfp-zoom-in .mfp-with-anim {
    opacity: 0;
    transition: all 0.2s ease-in-out;
    transform: scale(0.95);
}
.mfp-zoom-in.mfp-bg {
    opacity: 0;
    transition: all 0.2s ease-out;
}
.mfp-zoom-in.mfp-ready .mfp-with-anim {
    opacity: 1;
    transform: scale(1);
}
.mfp-zoom-in.mfp-ready.mfp-bg {
    opacity: 0.8;
}
.mfp-zoom-in.mfp-removing .mfp-with-anim {
    transform: scale(0.95);
    opacity: 0;
}
.mfp-zoom-in.mfp-removing.mfp-bg {
    opacity: 0;
}

body.modal-open { overflow: hidden; }