 /* --- 全局重置 --- */
 * {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
     font-family: 'Segoe UI', 'Roboto', Helvetica, Arial, sans-serif;
 }

 body {
     background-color: #0f172a;
     /* 读取背景图片 (注意您的文件名拼写) */
     background-image: url('bg.jpg');
     background-size: cover;
     background-position: center;
     background-attachment: fixed;
     background-blend-mode: overlay;
     background-color: rgba(0, 0, 0, 0.75);
     /* 75% 黑色遮盖 */

     color: #ffffff;
     padding-bottom: 50px;
     min-height: 100vh;
 }

 /* --- Header --- */
 header {
     background: linear-gradient(135deg, rgba(0, 106, 78, 0.9) 0%, rgba(30, 41, 59, 0.9) 50%, rgba(255, 153, 51, 0.9) 100%);
     padding: 35px 20px;
     text-align: center;
     border-bottom: 4px solid #f59e0b;
     backdrop-filter: blur(5px);
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }

 h1 {
     font-size: 2rem;
     color: #f8fafc;
     text-transform: uppercase;
     font-weight: 900;
     letter-spacing: 1px;
     margin-bottom: 8px;
     text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
 }

 .subtitle {
     font-size: 1rem;
     color: #cbd5e1;
     max-width: 600px;
     margin: 0 auto;
     text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
 }

 /* --- 容器 --- */
 .container {
     max-width: 700px;
     margin: 0 auto;
     padding: 20px 15px;
 }

 /* --- 卡片样式 --- */
 .card {
     background: rgba(30, 41, 59, 0.85);
     backdrop-filter: blur(10px);
     border-radius: 16px;
     margin-bottom: 35px;
     padding: 25px;
     position: relative;
     border: 1px solid rgba(255, 255, 255, 0.1);
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5);
     overflow: hidden;
     transition: transform 0.2s;
 }

 .card:hover {
     transform: translateY(-5px);
     border-color: rgba(255, 215, 0, 0.3);
 }

 /* --- 国别标签 --- */
 .country-badge {
     position: absolute;
     top: 0;
     left: 0;
     padding: 6px 15px;
     font-size: 0.85rem;
     font-weight: bold;
     text-transform: uppercase;
     border-bottom-right-radius: 12px;
     z-index: 5;
     box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
 }

 .flag-in {
     background: #FF9933;
     color: #000;
 }

 .flag-bd {
     background: #006a4e;
     color: #fff;
 }

 /* --- 平台名称区域 (含 Logo) --- */
 .platform-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-top: 15px;
     margin-bottom: 15px;
 }

 .platform-name {
     display: flex;
     align-items: center;
     gap: 12px;
     font-size: 1.6rem;
     color: #fff;
     font-weight: 800;
     text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
 }

 /* Logo 样式：电脑端高度40px，宽度自适应 */
 .platform-logo {
     height: 40px;
     width: auto;
     object-fit: contain;
     display: block;
 }

 .rating {
     color: #fbbf24;
     font-weight: bold;
     font-size: 0.9rem;
     background: rgba(0, 0, 0, 0.3);
     padding: 4px 8px;
     border-radius: 4px;
     white-space: nowrap;
 }

 /* --- 游戏标签 --- */
 .game-tags {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
     margin-bottom: 15px;
 }

 .tag {
     background: rgba(255, 255, 255, 0.1);
     color: #e2e8f0;
     padding: 4px 10px;
     border-radius: 6px;
     font-size: 0.8rem;
     font-weight: 600;
     border: 1px solid rgba(255, 255, 255, 0.1);
 }

 .tag.highlight {
     background: rgba(245, 158, 11, 0.25);
     border-color: #f59e0b;
     color: #fbbf24;
 }

 /* --- 描述文案 --- */
 .desc-box {
     background: rgba(0, 0, 0, 0.3);
     padding: 15px;
     border-radius: 10px;
     margin-bottom: 20px;
 }

 .desc-title {
     color: #f59e0b;
     font-weight: bold;
     font-size: 1rem;
     margin-bottom: 5px;
     text-transform: uppercase;
 }

 .desc-text {
     color: #cbd5e1;
     font-size: 0.95rem;
     line-height: 1.5;
 }

 /* --- 支付图标 --- */
 .payment-icons {
     font-size: 0.8rem;
     color: #94a3b8;
     margin-bottom: 20px;
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .payment-icons span {
     background: rgba(255, 255, 255, 0.1);
     padding: 3px 8px;
     border-radius: 4px;
 }

 /* --- 按钮 --- */
 .btn {
     display: block;
     width: 100%;
     padding: 16px;
     text-align: center;
     text-decoration: none;
     font-size: 1.2rem;
     font-weight: 900;
     border-radius: 50px;
     text-transform: uppercase;
     transition: transform 0.2s;
     position: relative;
     overflow: hidden;
     text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
 }

 .btn:hover {
     transform: scale(1.02);
     filter: brightness(1.1);
 }

 .btn-india {
     background: linear-gradient(90deg, #FF9933 0%, #ff6b00 100%);
     color: white;
     box-shadow: 0 4px 15px rgba(255, 107, 0, 0.5);
 }

 .btn-bd {
     background: linear-gradient(90deg, #006a4e 0%, #059669 100%);
     color: white;
     box-shadow: 0 4px 15px rgba(5, 150, 105, 0.5);
 }

 .btn::after {
     content: "";
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
     animation: shine 3s infinite;
 }

 @keyframes shine {
     0% {
         left: -100%;
     }

     20% {
         left: 100%;
     }

     100% {
         left: 100%;
     }
 }

 footer {
     text-align: center;
     font-size: 0.8rem;
     color: #94a3b8;
     padding: 20px;
     border-top: 1px solid rgba(255, 255, 255, 0.1);
     background: rgba(0, 0, 0, 0.5);
 }

/* --- 移动端适配 (手机屏幕) 优化版 --- */
@media (max-width: 480px) {
    
    /* 1. 关键修改：减少卡片左右内边距 */
    /* 原本是 25px，现在左边改为 10px (Logo向左移)，右边 10px */
    .card {
        padding: 20px 10px; 
    }

    /* 2. 调整 Logo 高度 */
    .platform-logo {
        height: 28px; /* 稍微改小一点点 (30->28)，视觉更平衡 */
    }
    
    /* 3. 调整平台名称文字 */
    .platform-name {
        font-size: 1.2rem; /* 字号微调，防止名字太长换行 */
        gap: 6px;          /* 拉近 Logo 和文字的距离 */
    }

    /* 4. 调整评分星星 */
    .rating {
        font-size: 0.75rem; /* 星星稍微缩小，防止它顶到最右边 */
        letter-spacing: -0.5px; /* 让星星排列得更紧凑一点 */
        /* 可选：如果你觉得星星太靠右，可以给它加一点右边距 */
        /* margin-right: 2px; */
    }

    /* 5. 调整头部标题大小，避免手机上太大 */
    h1 {
        font-size: 1.6rem; 
    }
}
