*{ -webkit-tap-highlight-color:transparent;margin:0;padding:0;box-sizing:border-box;font-family:"微软雅黑",sans-serif }body{ background-color:#f5f5f5;padding:6px }.top-container{ width:100%;max-width:1400px;margin:0 auto 6px;overflow:hidden;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,0.08);background:#fff }.banner-section{ padding:10px 16px }.banner-inner{ display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px }.banner-logo{ width:44px;height:44px;border-radius:8px;object-fit:cover;border:1px solid #eee }.title-group .main-title{ font-size:16px;color:#2d3748;font-weight:600 }.title-group .sub-desc{ font-size:12px;color:#4a5568;margin-top:1px }.nav-btns{ display:flex;gap:8px }.nav-btn{ padding:7px 14px;border:none;border-radius:20px;font-size:13px;font-weight:500;cursor:pointer;transition:all 0.2s ease;background:#f5fafe;color:#4361ee;border:1px solid #e8f4f8 }.nav-btn:hover{ background:#4361ee;color:#fff;border-color:#4361ee }.marquee-section{ background:#f8f9fa;color:#4361ee;padding:6px 0;overflow:hidden }.marquee-text{ white-space:nowrap;animation:marquee 7s linear infinite;font-size:13px;padding-left:100% }@keyframes marquee{ 0%{ transform:translateX(0) } 100%{ transform:translateX(-100%) } }.category-tabs{ padding:8px 16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center }.tab-btn{ flex:0 0 calc(25% - 6px);max-width:calc(25% - 6px);border:none;padding:6px 0;border-radius:20px;font-size:12px;font-weight:600;text-align:center;cursor:pointer;transition:all 0.2s ease;background:#f5fafe;color:#4361ee }.tab-btn.active{ background:#4361ee;color:#fff }.tab-btn:hover:not(.active){ transform:scale(1.02);box-shadow:0 1px 3px rgba(67,97,238,0.1) }.top-bar{ display:flex;justify-content:space-between;align-items:center;margin:6px 0 6px;padding:0 2px;max-width:1400px;margin-left:auto;margin-right:auto }.page-title{ color:#333;font-size:17px;font-weight:bold }.game-search{ display:flex;align-items:center;background:white;border-radius:20px;padding:4px 10px;box-shadow:0 2px 4px rgba(0,0,0,0.08) }.game-search input{ border:none;outline:none;font-size:12px;padding:2px 0;width:90px;background:transparent }.game-search input::placeholder{ color:#aaa;font-size:11px }.game-container{ display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:1400px;margin:0 auto;padding-bottom:60px;height:auto }.game-card{ background-color:white;border-radius:6px;box-shadow:0 2px 4px rgba(0,0,0,0.06);overflow:hidden;transition:transform 0.2s ease,box-shadow 0.2s ease;display:flex;flex-direction:column;align-items:center;text-decoration:none;cursor:pointer;padding:6px 4px 8px }.game-card:hover{ transform:translateY(-1px);box-shadow:0 3px 6px rgba(0,0,0,0.08) }.img-container{ width:100%;padding-top:100%;position:relative;background-color:#f8f8f8;border-bottom:1px solid #f0f0f0;border-radius:6px 6px 0 0 }.game-img{ position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;loading="eager" onerror="this.style.background='#f8f8f8';this.style.display='flex';this.style.alignItems='center';this.style.justifyContent='center';this.innerHTML='<span style=\"font-size:10px;color:#999\">图片加载失败</span>'" }.game-name-cn{ font-size:11px;color:#333;font-weight:600;text-align:center;padding:4px 4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100% }.skeleton{ background:#fff;border-radius:6px;box-shadow:0 2px 4px rgba(0,0,0,0.06);overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:6px 4px 8px }.skeleton-img{ width:100%;padding-top:100%;background:linear-gradient(90deg,#f0f0f0 25%,#f8f8f8 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:6px 6px 0 0 }.skeleton-text{ width:80%;height:8px;background:#f0f0f0;border-radius:3px;margin-top:4px;animation:skeleton-loading 1.5s infinite }.load-status{ display:flex;flex-direction:column;align-items:center;justify-content:center;grid-column:1/-1;height:180px;color:#666;font-size:12px }.load-spin{ width:20px;height:20px;border:2px solid #eee;border-top-color:#4361ee;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:6px }.retry-btn{ border:none;background:#4361ee;color:#fff;padding:5px 12px;border-radius:18px;font-size:11px;cursor:pointer;margin-top:6px;transition:background 0.2s ease }.retry-btn:hover{ background:#5a75f0 }.no-result{ grid-column:1/-1;text-align:center;padding:20px 0;color:#999;font-size:12px;display:none }.footer-bar{ position:fixed;bottom:0;left:0;right:0;max-width:1400px;margin:0 auto;background-color:#fff;border-radius:8px 8px 0 0;box-shadow:0 -2px 6px rgba(0,0,0,0.08);padding:8px 12px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#333;z-index:999 }.game-count{ font-weight:600 }.copyright{ font-style:normal;color:#666 }@keyframes spin{ to{ transform:rotate(360deg) } }@keyframes skeleton-loading{ 0%{ background-position:200% 0 } 100%{ background-position:-200% 0 } }@media (min-width:768px){ .banner-section{ padding:12px 20px }.banner-logo{ width:48px;height:48px }.title-group .main-title{ font-size:18px }.title-group .sub-desc{ font-size:13px }.nav-btn{ padding:8px 16px;font-size:14px }.tab-btn{ flex:0 0 calc(25% - 7px);max-width:calc(25% - 7px);font-size:13px;padding:7px 0 }.top-bar{ margin:8px 0 8px }.page-title{ font-size:19px }.game-search input{ width:140px;font-size:13px }.game-container{ grid-template-columns:repeat(4,1fr);gap:6px;padding-bottom:80px }.game-name-cn{ font-size:10px } }@media (min-width:1200px){ .nav-btn{ padding:9px 18px;font-size:14px }.tab-btn{ font-size:13px;padding:8px 0 }.game-search input{ width:200px }.game-container{ grid-template-columns:repeat(5,1fr);gap:8px;padding-bottom:100px }.game-name-cn{ font-size:11px } }