/* 曦瓜音效 v3 - 琥珀橙色调（taste-skill applied） */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --primary:#D4A574;
  --primary-dark:#c87920;
  --primary-light:rgba(212,165,116,0.12);
  --accent:#FAAF3C;
  --accent-light:rgba(250,175,60,0.15);
  --bg:#f5f0e8;
  --bg-alt:#fffdfa;
  --card:#ffffff;
  --card-hover:#faf3ea;
  --text:#2c2418;
  --text-secondary:#8B6914;
  --text-muted:#c4a882;
  --border:rgba(212,165,116,0.15);
  --radius:10px;
  --radius-sm:6px;
  --shadow:0 8px 32px rgba(180,140,80,0.1);
  --transition:all 0.25s cubic-bezier(.4,0,.2,1)
}
html{scroll-behavior:smooth}
body{font-family:-apple-system,'PingFang SC','Noto Sans SC','Microsoft YaHei',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;overflow-x:hidden}
a{color:var(--primary-dark);text-decoration:none;transition:var(--transition)}
a:hover{color:var(--accent)}
::selection{background:rgba(212,165,116,0.3)}

/* Header */
.header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,253,250,0.9);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:var(--transition)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:12px 32px;max-width:1280px;margin:auto}
.logo{font-size:1.15em;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}
.logo:hover{color:var(--primary-dark)}
.nav-links{display:flex;gap:8px}
.nav-links a{padding:6px 16px;border-radius:20px;color:var(--text-secondary);font-size:0.88em;transition:var(--transition)}
.nav-links a:hover{background:var(--primary-light);color:var(--text)}
.nav-user{display:flex;align-items:center;gap:10px}
.user-credits{background:var(--accent-light);padding:4px 12px;border-radius:12px;font-size:0.8em;color:var(--accent)}
.user-status{font-size:0.82em;color:var(--text-muted)}

/* Buttons */
.btn-primary,.btn-secondary,.btn-small,.btn-download{display:inline-flex;align-items:center;gap:6px;padding:10px 24px;border:none;border-radius:8px;cursor:pointer;font-size:0.9em;font-weight:500;transition:var(--transition)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 25px rgba(212,165,116,0.3)}
.btn-secondary{background:var(--card);color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{background:var(--card-hover);border-color:var(--primary)}
.btn-small{padding:6px 14px;font-size:0.8em;background:var(--primary-light);color:var(--primary-dark)}
.btn-small:hover{background:var(--accent);color:#fff}
.btn-download{background:linear-gradient(135deg,var(--accent),var(--primary-dark));color:#fff;padding:8px 18px;font-size:0.85em;white-space:nowrap}
.btn-download:hover{transform:translateY(-1px);box-shadow:0 4px 15px rgba(250,175,60,0.3)}
.btn-full{width:100%;justify-content:center;padding:12px}
.btn-back{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:0.9em;padding:6px 12px}
.btn-back:hover{color:var(--text)}

/* Hero v3 */
.hero{text-align:center;padding:100px 32px 60px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(212,165,116,0.08),transparent 70%);pointer-events:none}
.hero h1{font-size:clamp(1.8em,4vw,2.4em);font-weight:700;margin-bottom:8px;letter-spacing:-0.02em;color:var(--text)}
.hero-sub{color:var(--text-muted);font-size:1.05em;margin-bottom:28px}
.hero-search{display:flex;gap:8px;max-width:520px;margin:0 auto 24px}
.hero-search input{flex:1;padding:14px 24px;border-radius:24px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:1em;outline:none}
.hero-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.hero-search button{padding:14px 32px;border-radius:24px;border:none;background:var(--accent);color:#fff;font-size:1em;cursor:pointer;font-weight:500}
.hero-search button:hover{background:var(--primary-dark)}
.hero-actions{display:flex;gap:10px;justify-content:center}
.hero-stats{display:flex;justify-content:center;gap:56px;margin-top:36px;padding-top:28px;border-top:1px solid var(--border)}
.hero-stat{text-align:center}
.hero-stat .num{font-size:1.4em;font-weight:700;color:var(--accent)}
.hero-stat .label{font-size:0.75em;color:var(--text-muted);margin-top:2px}

/* Sections */
.section-block{max-width:1280px;margin:0 auto;padding:40px 32px}
.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.section-title h2{font-size:1.15em;font-weight:600;display:flex;align-items:center;gap:8px}
.section-more{font-size:0.82em;color:var(--primary-dark)}

/* Category grid */
.category-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.cat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 6px;cursor:pointer;transition:all 0.3s;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:60px;justify-content:center}
.cat-card:hover{border-color:var(--accent);background:var(--card-hover);transform:translateY(-3px);box-shadow:0 6px 20px rgba(212,165,116,0.15)}
.cat-card .icon{font-size:1.6em;display:block;margin-bottom:6px}
.cat-card .name{font-size:0.78em;font-weight:500}
.cat-card .count{font-size:0.7em;color:var(--text-muted);margin-top:2px}
.cat-card .cat-icon{font-size:1.2em;display:block;text-align:center}
.cat-card .cat-name{font-size:0.7em;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px}
.cat-hidden{display:none!important}
.cat-more{cursor:pointer;background:var(--primary-light);border:1px dashed var(--accent);display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:var(--radius);font-size:0.75em}
.cat-more:hover{background:var(--accent);color:#fff}

/* Browse */
.browse-header{max-width:1280px;margin:0 auto;padding:20px 32px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.browse-header input[type=text]{flex:1;min-width:200px;padding:10px 16px;border-radius:20px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:0.88em;outline:none}
.browse-header input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.browse-header select{padding:10px 14px;border-radius:20px;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:0.88em;outline:none;cursor:pointer}
.category-strip{display:flex;gap:6px;overflow-x:auto;padding:4px 32px 16px;max-width:1280px;margin:0 auto}
.cat-chip{flex-shrink:0;padding:6px 16px;border-radius:16px;background:var(--card);border:1px solid var(--border);cursor:pointer;font-size:0.82em;white-space:nowrap}
.cat-chip:hover{border-color:var(--accent);background:var(--card-hover)}
.cat-chip.active{background:var(--accent);color:#fff;border-color:var(--accent)}

/* Sound grid */
.sound-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;max-width:1280px;margin:0 auto;padding:0 32px}
.sound-card{background:var(--card);border-radius:var(--radius-sm);padding:16px 20px;cursor:pointer;transition:all 0.3s;border:1px solid transparent;display:flex;align-items:center;gap:14px;position:relative;overflow:hidden}
.sound-card::after{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,var(--accent),var(--primary-dark));opacity:0;transition:all 0.3s}
.sound-card:hover{background:var(--card-hover);border-color:var(--border);transform:translateX(4px)}
.sound-card:hover::after{opacity:1}
.sound-card .play-icon{width:36px;height:36px;border-radius:50%;background:var(--primary-light);display:flex;align-items:center;justify-content:center;font-size:0.9em;color:var(--accent);flex-shrink:0}
.sound-card:hover .play-icon{background:var(--accent);color:#fff}
.sound-card .info{flex:1;min-width:0}
.sound-card .name{font-size:0.92em;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sound-card .meta{font-size:0.75em;color:var(--text-muted);display:flex;gap:10px;margin-top:3px}
.sound-card .price{font-size:0.78em;color:var(--accent);font-weight:500;white-space:nowrap}
.sound-card.playing{border-color:var(--accent);background:var(--card-hover)}
.sound-card.playing::after{opacity:1}
.sound-card.playing .play-icon{background:var(--accent);color:#fff;animation:pulse 1.5s ease infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(212,165,116,0.4)}50%{box-shadow:0 0 0 8px rgba(212,165,116,0)}}

/* Player bar */
.player-bar{position:fixed;bottom:0;left:0;right:0;background:var(--bg-alt);border-top:1px solid var(--border);padding:14px 32px;display:flex;align-items:center;gap:16px;z-index:200;transform:translateY(100%);transition:transform 0.35s}
.player-bar.active{transform:translateY(0)}
.player-bar .info{flex:1;min-width:120px}
.player-bar .name{font-size:0.88em;font-weight:500}
.player-bar .cat{font-size:0.75em;color:var(--text-muted);margin-top:2px}
.player-bar audio{height:36px;max-width:360px;width:100%}
.player-bar .actions{display:flex;align-items:center;gap:10px;white-space:nowrap}
.player-bar .price{font-size:0.82em;color:var(--text-muted)}
.player-bar .close{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:1em;padding:4px}
.player-bar .close:hover{color:var(--text)}

/* Modal */
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:300;backdrop-filter:blur(4px);align-items:center;justify-content:center}
.modal.show{display:flex}
.modal-content{background:var(--bg-alt);border-radius:var(--radius);width:380px;max-width:92%;position:relative;border:1px solid var(--border);box-shadow:var(--shadow)}
.modal-close{position:absolute;top:12px;right:14px;background:none;border:none;color:var(--text-muted);font-size:1.2em;cursor:pointer;padding:4px}
.modal-close:hover{color:var(--text)}
.modal-body{padding:32px}
.modal-body h2{font-size:1.4em;margin-bottom:8px}
.modal-sub{font-size:0.9em;color:var(--text-secondary);margin-bottom:28px}
.modal input[type=text],.modal input[type=password]{width:100%;padding:12px 16px;border-radius:var(--radius-sm);border:1px solid var(--border);background:rgba(255,255,255,0.8);color:var(--text);font-size:0.95em;outline:none;margin-bottom:14px}
.modal input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.switch-form{text-align:center;margin-top:18px;font-size:0.85em;color:var(--text-muted)}
.switch-form a{color:var(--primary-dark);font-weight:500}

/* Toast */
.toast{position:fixed;top:80px;left:50%;transform:translateX(-50%);background:var(--card);border:1px solid var(--border);padding:14px 32px;border-radius:30px;font-size:0.88em;z-index:400;opacity:0;pointer-events:none}
.toast.show{opacity:1}
.toast.success{border-color:var(--accent)}
.toast.error{border-color:#e0445a}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:6px;margin-top:24px;flex-wrap:wrap;padding:0 32px}
.page-btn{padding:6px 14px;border-radius:6px;background:var(--card);color:var(--text-secondary);border:1px solid var(--border);cursor:pointer;font-size:0.82em}
.page-btn:hover{color:var(--text);border-color:var(--accent)}
.page-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}

/* Animations */
.cat-card,.sound-card{animation:fadeUp 0.5s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.hero{animation:fadeIn 0.8s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Footer */
.footer{text-align:center;padding:56px 32px 100px;color:var(--text-muted);font-size:0.82em;border-top:1px solid var(--border)}
.copyright{max-width:720px;margin:0 auto;padding:32px 32px 24px;text-align:center}
.copyright p{font-size:0.78em;color:var(--text-muted);line-height:1.6}

/* Mobile */
@media(max-width:768px){
  .hero{padding:80px 16px 32px}
  .hero h1{font-size:1.3em}
  .hero-search{flex-direction:column}
  .section-block{padding:24px 16px}
  .sound-grid{grid-template-columns:1fr;padding:0 16px}
  .category-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}
  .player-bar{flex-direction:column;padding:8px 12px}
  .player-bar audio{width:100%}
}
@media(max-width:480px){
  .hero h1{font-size:1.1em}
  .category-grid{grid-template-columns:repeat(3,1fr)}
  .sound-card{padding:12px 14px}
}
/* P2: 移动端深度优化 */
@media(max-width:768px){
  .nav{padding:10px 16px;flex-wrap:wrap;gap:6px}
  .nav-links{display:none}
  .nav-user{gap:6px}
  .logo{font-size:1em}
  .btn-small{padding:4px 10px;font-size:0.75em}
  .hero{padding-top:70px}
  .hero-stats{gap:20px;flex-wrap:wrap}
  .hero-stat .num{font-size:1.1em}
  .hero-search input{padding:12px 18px;font-size:0.9em}
  .hero-search button{padding:12px 20px;font-size:0.9em}
  .sound-grid{gap:8px}
  .sound-card{padding:12px 14px;gap:10px}
  .sound-card .play-icon{width:32px;height:32px;font-size:0.8em}
  .sound-card .name{font-size:0.85em}
  .player-bar{padding:8px 12px 4px;gap:6px}
  .player-bar audio{height:30px;max-width:100%}
  .player-bar .name{font-size:0.8em}
  .section-title h2{font-size:1em}
  .category-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:6px}
  .cat-card{min-height:50px;padding:6px 4px!important;border-radius:8px}
  .cat-card .cat-name{font-size:0.65em;max-width:65px}
  .cat-card .icon{font-size:1.2em}
  .browse-header{flex-direction:column;gap:8px;padding:12px 16px 8px}
  .browse-header input[type=text]{width:100%}
  .browse-header select{width:100%}
  .category-strip{padding:4px 16px 12px}
  .cat-chip{padding:4px 12px;font-size:0.75em}
  .pagination{padding:0 16px;gap:4px}
  .page-btn{padding:4px 10px;font-size:0.75em}
  .modal-content{width:90%!important;margin:20% auto}
  .modal-body{padding:24px 20px}
  .modal input[type=text],.modal input[type=password]{padding:10px 14px;font-size:0.85em}
}
@media(max-width:480px){
  .hero{padding:60px 12px 24px}
  .hero h1{font-size:1em}
  .hero-sub{font-size:0.85em}
  .sound-grid{padding:0 12px}
  .sound-card{padding:10px 12px}
  .sound-card .name{font-size:0.8em}
  .cat-card{min-height:44px}
  .cat-card .cat-name{font-size:0.6em;max-width:55px}
  .section-block{padding:16px 12px}
  .copyright{padding:20px 16px}
  .section-title{flex-direction:column;align-items:flex-start;gap:4px}
  .player-bar .actions{gap:6px}
  .player-bar .price{font-size:0.75em}
  .btn-download{padding:6px 12px;font-size:0.75em}
}

/* ===== 丝滑优化 ===== */

/* 平滑滚动 */
html{scroll-behavior:smooth}

/* 卡片入场交错动画 - 更丝滑 */
.sound-grid .sound-card{animation:fadeUp 0.4s cubic-bezier(.2,0,.3,1) both}
.sound-grid .sound-card:nth-child(1){animation-delay:0.02s}
.sound-grid .sound-card:nth-child(2){animation-delay:0.04s}
.sound-grid .sound-card:nth-child(3){animation-delay:0.06s}
.sound-grid .sound-card:nth-child(4){animation-delay:0.08s}
.sound-grid .sound-card:nth-child(5){animation-delay:0.10s}
.sound-grid .sound-card:nth-child(6){animation-delay:0.12s}
.sound-grid .sound-card:nth-child(7){animation-delay:0.14s}
.sound-grid .sound-card:nth-child(8){animation-delay:0.16s}

/* 播放按钮旋转动画 */
.sound-card .play-icon{transition:all 0.3s cubic-bezier(.34,1.56,.64,1)} /* spring效果 */
.sound-card:active .play-icon{transform:scale(0.9)}

/* 下载按钮点击反馈 */
.btn-download:active{transform:scale(0.95)}

/* 播放页高亮脉冲更柔和 */
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(212,165,116,0.3)}50%{box-shadow:0 0 0 6px rgba(212,165,116,0)}}

/* 分类卡片悬停弹性 */
.cat-card{transition:all 0.25s cubic-bezier(.34,1.56,.64,1)}
.cat-card:active{transform:scale(0.95)}

/* 模态框弹出动画 */
.modal.show{animation:fadeIn 0.2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Toast滑入 */
.toast.show{animation:slideIn 0.3s cubic-bezier(.2,0,.3,1)}
@keyframes slideIn{from{opacity:0;transform:translateX(-50%) translateY(-10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}

/* 加载占位动画 */
.loading-spinner{text-align:center;padding:40px;color:var(--text-muted)}
.loading-spinner::after{content:'';display:block;width:28px;height:28px;margin:10px auto;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin 0.6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* 预渲染提示 - 提升动画性能 */
.sound-card,.cat-card,.btn-primary,.btn-download{will-change:transform}

/* 首页分类 - 砖墙/瀑布流样式 */
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
}
  width: calc(33.33% - 6px);
  min-height: 70px;
  margin-bottom: 0;
  border-radius: 10px;
  padding: 10px 6px !important;
  flex: 1 1 auto;
}
  margin-top: 12px;
}
  margin-top: -6px;
}
  margin-top: 6px;
}
  font-size: 0.68em;
  max-width: 70px;
}

@media(max-width:480px){
    width: calc(50% - 6px);
    min-height: 60px;
  }
    margin-top: 8px;
  }
    margin-top: -4px;
  }
}

/* frontend-design: 登录弹窗重设 */
.modal-content{border:none!important;box-shadow:0 25px 60px rgba(0,0,0,0.12),0 0 0 1px rgba(212,165,116,0.08)!important;overflow:hidden;border-radius:12px!important}
.modal-content::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#D4A574,#FAAF3C,#c87920);z-index:1;pointer-events:none;border-radius:12px 12px 0 0}
.modal-body h2{font-size:22px!important;font-weight:700!important;color:#2c2418!important;letter-spacing:-0.02em!important;margin-bottom:4px!important}
.modal-sub{font-size:13px!important;color:#c4a882!important;margin-bottom:24px!important}
#loginForm input[type=text],#loginForm input[type=password]{padding:12px 16px!important;border-radius:8px!important;border:1px solid #e8ddd0!important;background:#fefcf9!important;font-size:14px!important;color:#2c2418!important;transition:all .2s ease!important}
#loginForm input:focus{border-color:#FAAF3C!important;box-shadow:0 0 0 3px rgba(250,175,60,0.12)!important;outline:none!important}
#loginSubmit{background:linear-gradient(135deg,#D4A574,#FAAF3C)!important;border:none!important;border-radius:8px!important;padding:12px!important;font-weight:600!important;font-size:15px!important;color:#fff!important;cursor:pointer!important;transition:all .25s ease!important;margin-top:4px!important}
#loginSubmit:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(212,165,116,0.3)}
#loginSubmit:active{transform:scale(.98)}
.switch-form{font-size:13px!important;color:#c4a882!important;margin-top:16px!important}
.switch-form a{color:#c87920!important;font-weight:600!important;text-decoration:none!important;transition:color .2s!important}
.switch-form a:hover{color:#FAAF3C!important}
.modal-close{font-size:18px!important;color:#d0c0b0!important;transition:color .2s!important;position:absolute!important;top:16px!important;right:18px!important;background:none;border:none;padding:4px;z-index:10}
.modal-close:hover{color:#2c2418!important}

/* 分类条 - 改成可换行网格，去掉难看的横滚条 */
.category-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 32px 12px;
  max-width: 1280px;
  margin: 0 auto;
  overflow: visible;
}
.cat-chip {
  flex-shrink: 0;
  padding: 5px 14px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--border);
  cursor: pointer;
  font-size: 0.82em;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.cat-chip:hover {
  border-color: var(--accent);
  background: var(--card-hover);
  transform: translateY(-1px);
}
.cat-chip.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
@media(max-width:768px){
  .category-strip {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: 4px 16px 12px;
    -webkit-overflow-scrolling: touch;
  }
  .category-strip::-webkit-scrollbar { display: none; }
}

/* 播放器 - 移动端优化，不遮挡内容 */
@media(max-width:768px){
  .player-bar {
    padding: 8px 12px;
    gap: 8px;
    flex-wrap: wrap;
  }
  .player-bar .info {
    flex: 1 1 100%;
    min-width: 0;
    order: 0;
  }
  .player-bar .name {
    font-size: 0.82em;
  }
  .player-bar .cat {
    font-size: 0.7em;
  }
  .player-bar audio {
    height: 30px;
    max-width: 100%;
    flex: 1;
    order: 1;
  }
  .player-bar .actions {
    order: 2;
    gap: 6px;
  }
  .player-bar .price {
    font-size: 0.75em;
  }
  .player-bar .btn-download {
    padding: 4px 10px;
    font-size: 0.72em;
  }
  .player-bar .close {
    font-size: 0.85em;
  }
  /* 底部留空给播放器 */
  .section-block:last-child, .copyright {
    padding-bottom: 80px;
  }
  .footer, .copyright {
    padding-bottom: 100px;
  }
}

/* 加载动画 - 居中三连点 */
.loading-spinner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 80px 0;
  min-height: 200px;
}
.loading-spinner span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #D4A574;
  animation: dotBounce 1.4s ease-in-out infinite both;
}
.loading-spinner span:nth-child(1) { animation-delay: -0.32s; }
.loading-spinner span:nth-child(2) { animation-delay: -0.16s; }
.loading-spinner span:nth-child(3) { animation-delay: 0s; }
@keyframes dotBounce {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40% { transform: scale(1); opacity: 1; }
}

/* 展开全部按钮修复 */
.cat-more {
  grid-column: 1 / -1;
  width: 100%;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 14px 10px !important;
  font-size: 0.82em !important;
  font-weight: 500;
  color: var(--primary-dark);
  cursor: pointer;
  background: var(--primary-light);
  border: 1px dashed var(--accent);
  border-radius: var(--radius);
  transition: all 0.25s ease;
}
.cat-more:hover {
  background: var(--accent);
  color: #fff;
  border-style: solid;
}

/* 底部留空给播放器 */
.player-bar.active ~ .footer,
.player-bar.active ~ .copyright,
.player-bar.active ~ .section-block:last-child {
  padding-bottom: 80px;
}
/* JS动态补偿 */
body.has-player { padding-bottom: 70px; }
