/* 全局变量，方便统一调整 */
:root {
    --spacing-multiplier: 1;  /* 统一缩放倍数 */
    --text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.7);
}

/* 黑色背景 */
body {
    background: #000 url("background.jpg") no-repeat center center fixed;
    background-size: cover;
    color: #fff;
    font-family: Arial, sans-serif;
    text-align: center;
    margin: 0;
    padding: 0;
}

/* 电影/电视剧展示区 */
.gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(25px * var(--spacing-multiplier)); /* 电影之间的间距扩大 */
    padding: 20px;
}

/* 单个电影/电视剧 */
.movie {
    text-align: center;
    cursor: pointer;
    transition: transform 0.3s;
    position: relative;
    width: calc(260px * var(--spacing-multiplier)); /* 电影块整体放大 */
    margin-bottom: calc(25px * var(--spacing-multiplier)); /* 间距放大 */
}

/* 让图片等比例放大 */
.movie img {
    width: 80%;
    height: auto;
    object-fit: contain;
}

/* 第一行的间距调整 
.movie:nth-child(-n+3) {
    margin-top: calc(15px * var(--spacing-multiplier)); /* 控制第一行的高度 */
}
*/

/* 电影名称 */
.movie-title {
    margin-top: calc(8px * var(--spacing-multiplier));
    font-size: calc(16px * var(--spacing-multiplier));
    font-weight: bold;
    color: white;
    text-shadow: var(--text-shadow);
}

/* 电影超链接按钮 */
.movie-links {
    display: none;
    margin-top: calc(15px * var(--spacing-multiplier));
}

/* 悬停放大 */
.movie:hover {
    transform: scale(1.05);
}

/* 点击后显示按钮区域 */
.movie.clicked .movie-links {
    display: block;
}

/* 按钮样式 */
.movie-links a {
    display: inline-block;
    background-color: #222;
    color: white;
    padding: calc(10px * var(--spacing-multiplier)) calc(15px * var(--spacing-multiplier));
    text-decoration: none;
    border-radius: calc(5px * var(--spacing-multiplier));
    transition: all 0.3s;
    font-size: calc(14px * var(--spacing-multiplier));
}

.movie-links a:hover {
    background-color: #444;
}
