body {
    background-color: #0f0f0f;
    background-image: radial-gradient(circle at 50% 0%, #1f1f1f 0%, #050505 80%);
    min-height: 100vh;
    margin: 0;
    padding-bottom: 50px; /* Отступ снизу вместо футера */
}

/* --- НАВИГАЦИЯ --- */
.museum-nav {
    padding: 20px;
    display: flex;
    justify-content: flex-start; /* Кнопка слева */
}

.btn-museum-exit {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: 2px solid #444;
    color: #888;
    padding: 12px 25px;
    font-family: 'Press Start 2P', cursive;
    font-size: 10px;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-museum-exit span {
    font-size: 14px;
}

.btn-museum-exit:hover {
    border-color: #fff;
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.1);
}

/* --- ЗАГОЛОВОК --- */
.museum-header {
    text-align: center;
    margin-bottom: 40px;
    border-bottom: 1px solid #222;
    padding-bottom: 20px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.museum-title {
    font-family: 'Press Start 2P', cursive;
    color: #ffd700; /* Золото */
    font-size: 24px;
    text-shadow: 4px 4px 0 #000;
    margin-bottom: 15px;
    display: block;
    letter-spacing: 2px;
}

.museum-subtitle {
    font-family: 'Press Start 2P', cursive;
    color: #555;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* --- СЕТКА --- */
.museum-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px; /* Чуть больше воздуха */
    padding: 0 20px;
    max-width: 1200px;
    margin: 0 auto;
}

/* --- КАРТОЧКА --- */
.exhibit-card {
    position: relative;
    width: 220px;
    height: 320px;
    background: #111;
    border: 4px solid #333;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 25px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.6);
    user-select: none;
    
    /* ЭТО ИСПРАВИТ ВАШ ЛУЧ: обрезает всё, что выходит за рамку */
    overflow: hidden; 
}

/* Эффект "витрины" (легкий блеск) */
.exhibit-card::after {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, transparent 50%);
    pointer-events: none;
}

.exhibit-card:hover {
    border-color: #555; /* Легкая подсветка рамки */
    transform: translateY(-2px);
}

/* --- СПОТЛАЙТ (СВЕТ СВЕРХУ) --- */
.spotlight {
    position: absolute;
    top: 0; /* Опустили чуть ниже, чтобы не было резкого среза */
    left: 50%;
    transform: translateX(-50%);
    width: 180px; /* Сделали шире */
    height: 180px; 
    /* Сделали градиент намного прозрачнее (0.05 вместо 0.1) и мягче */
    background: radial-gradient(circle at center, rgba(255, 215, 0, 0.05) 0%, transparent 80%);
    pointer-events: none;
    z-index: 1;
}

/* --- СКИН --- */
.exhibit-skin {
    width: 128px;
    height: 128px;
    background-size: 1024px;
    background-position: -128px -128px;
    image-rendering: pixelated;
    filter: grayscale(100%) contrast(1.2); /* ЧБ с контрастом */
    transition: filter 0.5s;
    z-index: 2;
    margin-bottom: 30px;
    opacity: 0.8;
}

.exhibit-card:hover .exhibit-skin {
    filter: grayscale(0%) contrast(1); /* Возвращаем цвет при наведении */
    opacity: 1;
}

/* --- ТАБЛИЧКА --- */
.plaque {
    background: #000;
    border: 2px solid #ffd700;
    padding: 10px 15px;
    text-align: center;
    z-index: 2;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5);
    min-width: 140px;
}

.plaque-name {
    color: #ffd700;
    font-family: 'Press Start 2P', cursive;
    font-size: 10px;
    display: block;
    margin-bottom: 6px;
    text-shadow: 1px 1px 0 #333;
}

.plaque-score {
    color: #888;
    font-family: monospace;
    font-size: 11px;
    letter-spacing: 1px;
}

/* ПУСТОЙ МУЗЕЙ */
.empty-museum {
    text-align: center;
    color: #333;
    font-family: 'Press Start 2P', cursive;
    margin-top: 80px;
    font-size: 12px;
    line-height: 2;
}

#museum-intro {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: #000;
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.intro-text {
    position: absolute;
    width: 100%;
    text-align: center;
    font-family: 'Press Start 2P', cursive;
    font-size: 14px;
    color: #fff;
    letter-spacing: 2px;
    opacity: 0;
    transform: scale(0.8);
    filter: blur(10px);
}

/* АНИМАЦИЯ ТЕКСТА */
@keyframes textSequence {
    0% { opacity: 0; transform: scale(0.8); filter: blur(10px); }
    20% { opacity: 1; transform: scale(1); filter: blur(0px); }
    80% { opacity: 1; transform: scale(1.05); filter: blur(0px); }
    100% { opacity: 0; transform: scale(1.1); filter: blur(10px); }
}

/* ЧАСТИЦЫ ПЫЛИ (ФОН) */
body::before {
    content: "";
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: url('https://www.transparenttextures.com/patterns/stardust.png');
    opacity: 0.1;
    pointer-events: none;
    z-index: 5;
    animation: dustMove 60s linear infinite;
}

@keyframes dustMove {
    from { background-position: 0 0; }
    to { background-position: 500px 1000px; }
}

/* КАРТОЧКА С ГЛУБИНОЙ */
.exhibit-card {
    /* ... твои старые стили ... */
    perspective: 1000px;
    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.6s;
}

.exhibit-card:hover {
    transform: scale(1.1) rotateY(10deg); /* 3D поворот */
    box-shadow: 0 30px 60px rgba(0,0,0,0.8), 0 0 40px rgba(255, 215, 0, 0.1);
}