/* ============================================================


   MIX57 深色 DJ 主题覆盖层


   参考设计稿配色:


     --bg:#14141d  --bg2:#1a1a26  --card:#1d1d29


     --accent:#00f0ff  --accent2:#7b5bff  --pink:#ff3d81  --gold:#ffc94d


     --text:#eef1ff  --muted:#8b8fa3  --line:rgba(255,255,255,.08)


   本文件在 style.css 之后加载, 用于覆盖默认浅色主题


   ============================================================ */





/* ---- 全局背景与文字 ---- */


html,body {


	background-color: #14141d !important;


	color: #eef1ff !important;


}


body {


	/* v55: 移除顶部紫色径向渐变, 消除 LOGO 上方紫色线条 */


	background-image: none !important;


	background-attachment: fixed !important;


	background-repeat: no-repeat !important;


}


.wide_layout, .boxed_layout {


	background: #14141d !important;


}


[class*="layout"], .menu_wrap.type_3 {


	background: #14141d !important;


}





/* ---- 链接与文字 ---- */


a { color: #eef1ff !important; }


a:hover { color: #00f0ff !important; }


.text-muted, .muted { color: #8b8fa3 !important; }


h1,h2,h3,h4,h5,h6 { color: #eef1ff !important; }





/* ---- 页面内容区通用背景 ---- */


.page_content_offset, .page_content {


	background: transparent !important;


}


.container, .content, .main {


	background: transparent !important;


}





/* ---- 头部 ---- */


.header {


	background: #0d0d15 !important;


	border-bottom: 1px solid #16161f !important;


}


.h_top {


	background: #0d0d15 !important;


	border-bottom: 1px solid #16161f !important;


}


.menu_wrap {


	background: #0d0d15 !important;


	border-bottom: 1px solid #16161f !important;


}


/* 导航容器: flex 单行, 每日推荐按钮同行右对齐(覆盖 style.css #top_button float:right 掉行) */


.menu_wrap .nav_menu{


  display:flex !important;


  align-items:center !important;


}


.menu_wrap #top_button{


  float:none !important;


  margin-top:0 !important;


  margin-left:auto !important;


  display:inline-flex !important;


  align-items:center !important;


  justify-content:center !important;


}


/* 导航项基础: 白色文字, 紧凑间距, 集中一行 */


.nav_menu > li > a,


.menu_wrap .nav li.t-nav a {


	color: #eef1ff !important;


	font-size: 15px !important;


	line-height: 40px !important;


	padding: 0 20px !important;


	position: relative !important;


	background: transparent !important;


	transition: color .2s ease !important;


	display: inline-flex !important;


	align-items: center !important;


	justify-content: center !important;


	height: 100% !important;


}


/* 隐藏默认主题的红色角标 */


.menu_wrap .nav em { display: none !important; }


.nav_menu > li > a:hover,


.menu_wrap .nav li.t-nav a:hover,


.menu_wrap .nav li.t-nav a:focus {


	color: #00f0ff !important;


	background: transparent !important;


}


.nav_menu > li.current > a,


.menu_wrap .nav li.t-nav.current a {


	color: #00f0ff !important;


	background: transparent !important;


}


/* 当前项底部青紫渐变下划线(覆盖整个导航项) */


.menu_wrap .nav li.t-nav.current > a::after {


	content: "";


	position: absolute;


	left: 0;


	right: 0;


	bottom: 0;


	height: 3px;


	background: linear-gradient(90deg,#00f0ff,#7b5bff) !important;


	border-radius: 3px 3px 0 0;


}


/* 播放状态: 按钮图标切换 + 行高亮 (jp-play-me 全站统一) */


.op-play .ic-pause,.jp-play-me .ic-pause{display:none !important;}


.op-play.playing .ic-play,.jp-play-me.playing .ic-play{display:none !important;}


.op-play.playing .ic-pause,.jp-play-me.playing .ic-pause{display:inline-block !important;}


.jp-play-me svg{display:block;}


.jp-play-me{color:#fff;transition:all .15s;}


.jp-play-me:hover{color:#00f0ff;}


.ex-row.playing,.t-row.playing{background:rgba(0,240,255,.06) !important;}


.ex-row.playing .ex-name,.t-row.playing .t-name{background:rgba(0,240,255,.10) !important;border-radius:6px !important;padding:0 8px !important;box-sizing:border-box !important;color:#00f0ff !important;}


.products_list li.playing{background:rgba(0,240,255,.06) !important;}


.products_list li.playing .play_name{background:rgba(0,240,255,.10) !important;border-radius:6px !important;padding:0 8px !important;box-sizing:border-box !important;color:#00f0ff !important;}


.mq-inner{display:inline-block;white-space:nowrap;will-change:transform;}


/* 歌名跑马灯: 确保框内裁剪 */


.ex-name,.play_name,a[target="_play"]{overflow:hidden !important;display:inline-block !important;max-width:100%;vertical-align:middle;}


.products_list li{padding:8px 12px !important;line-height:1.1 !important;}


/* 每日推荐下拉: 行内 flex, 歌名延长靠近播放按钮 */


.products_list li > .clearfix{display:flex;align-items:center;gap:10px;}


.products_list .product_description{flex:1;min-width:0;}


.products_list .f_right{flex:none;margin-left:auto;}


.products_list .play_name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}


/* 每日推荐下拉: 播放按钮圆形钮 */


.products_list .jp-play-me{display:inline-flex;width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;align-items:center;justify-content:center;color:#fff;transition:all .15s;}


.products_list .jp-play-me:hover{color:#00f0ff;border-color:rgba(0,240,255,.55);background:rgba(0,240,255,.15);}


.products_list .jp-play-me svg{display:block;}


/* 每日推荐按钮: 圆角胶囊, 与右侧对齐 */


.menu_wrap #top_button > a {


	border-radius: 999px !important;


	border: 1px solid rgba(0,240,255,.35) !important;


	background: rgba(0,240,255,.08) !important;


	line-height: 26px !important;


	height: 26px !important;


	padding: 0 10px !important;


	margin-left: 16px !important;


	display: inline-flex !important;


	align-items: center !important;


	gap: 5px !important;


	color: #eef1ff !important;


	font-size: 12px !important;


}


.menu_wrap #top_button .jy-2x{font-size: 15px !important;}


.menu_wrap #top_button .shop_icon{margin-right: 5px !important;}


.menu_wrap #top_button .count{width: 14px !important;height: 14px !important;line-height: 14px !important;font-size: 9px !important;right: -6px !important;top: -1px !important;}


.menu_wrap #top_button > a:hover {


	border-color: #00f0ff !important;


	background: rgba(0,240,255,.16) !important;


	color: #00f0ff !important;


}


.menu_wrap #top_button .count {


	background: #00f0ff !important;


	color: #0a0a0f !important;


}


.icon-bar { background-color: #00f0ff !important; }





/* ---- 搜索框 ---- */


.search-box input, .search-form input {


	background: #10101a !important;


	border: 1px solid rgba(255,255,255,.12) !important;


	color: #eef1ff !important;


	border-radius: 999px !important; padding-left: 30px !important;


}


.search-box .search_icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:rgba(0,240,255,.85) !important;font-size:16px !important;pointer-events:none;z-index:2;}


.search-box input:focus,.search-box input:active{background:#1a1a26 !important;box-shadow:none !important;outline:none !important;}


.search-box input:-webkit-autofill,.search-box input:-webkit-autofill:hover,.search-box input:-webkit-autofill:focus{-webkit-text-fill-color:#eef1ff !important;-webkit-box-shadow:0 0 0 1000px #10101a inset !important;caret-color:#eef1ff !important;transition:background-color 9999s ease-in-out 0s !important;}


.search-box input{border-right:none !important;}


.search-box input::placeholder { color: #8b8fa3 !important; }


.search_button {


	background: linear-gradient(135deg,#3fbfd6,#6a5bff) !important;


	color: #fff !important;


	border-radius: 0 999px 999px 0 !important;


}





/* ---- 下拉菜单 / 购物车 / 弹窗 ---- */


.sub_menu_wrap, .shopping_cart, .dropdown_list, .select_list, .popup {


	background: #1d1d29 !important;


	border-color: rgba(255,255,255,.1) !important;


	box-shadow: 0 6px 24px rgba(0,0,0,.5) !important;


}


.popup_wrap { background: rgba(6,6,10,.6) !important; }


.popup { border-radius: 14px !important; overflow: hidden; }


.popup h3 { color: #eef1ff !important; }


.popup .form-control { border-radius: 8px !important; }


.popup .close { border-radius: 999px; }





/* ---- 表单 ---- */


.form-control, input[type="text"], input[type="password"], input[type="email"], textarea, select {


	background: #10101a !important;


	color: #eef1ff !important;


	border: 1px solid rgba(255,255,255,.12) !important;


}


.form-control:focus { border-color: #00f0ff !important; box-shadow: 0 0 0 2px rgba(0,240,255,.15) !important; }


.form-control::placeholder { color: #8b8fa3 !important; }


label { color: #cfd3e4 !important; }





/* ---- 卡片 / 内容块 ---- */


.widget_content, .panel, .card, .play_box, .song_list, .album_item, .artist_item {


	background: #1d1d29 !important;


	border-color: rgba(255,255,255,.08) !important;


}


.widget figcaption, .a_title {


	background: #1c1c28 !important;


	color: #eef1ff !important;


	border-color: rgba(255,255,255,.08) !important;


}


.widget_content .product_description a, .song_list a { color: #eef1ff !important; }


.widget_content .product_description a:hover, .song_list a:hover { color: #00f0ff !important; }





/* ---- 侧边栏 ---- */


.sidebar, .sidebar_content {


	background: transparent !important;


}


.sidebar .widget_content {


	background: #1d1d29 !important;


}





/* ---- 分割线 ---- */


hr, .l_hr { border-color: rgba(255,255,255,.08) !important; }


.products_list li, .vertical_list li {


	border-color: rgba(255,255,255,.08) !important;


}





/* ---- 排行/列表 ---- */


.c_rank li a {


	background: #1d1d29 !important;


	color: #cfd3e4 !important;


	border: 1px solid rgba(255,255,255,.08) !important;


}


.c_rank li a:hover { border-color: #00f0ff !important; }


.ls_num { background-color: #323a45 !important; color: #eef1ff !important; }


.page_total { background: #323a45 !important; color: #eef1ff !important; }





/* ---- 页脚 ---- */


#footer {


	background: #0d0d15 !important;


	border-top: 1px solid rgba(255,255,255,.08) !important;


}


.footer_top_part { background: #0d0d15 !important; }


.footer_bottom_part { background: #0d0d15 !important; color: #8b8fa3 !important; }


#footer p, .vertical_list p { color: #8b8fa3 !important; }


#footer a { color: #cfd3e4 !important; }


#footer a:hover { color: #00f0ff !important; }


#footer h3 { color: #eef1ff !important; }





/* ---- 播放器区域 ---- */


.jy-player-f { background: rgba(10,10,15,.3) !important; border-top: 1px solid rgba(255,255,255,.08) !important; }





/* ---- 滚动条 ---- */


::-webkit-scrollbar { background: #10101a !important; }


::-webkit-scrollbar-thumb { background: #7b5bff !important; }


::-webkit-scrollbar-thumb:hover { background: #00f0ff !important; }





/* ---- 强调色按钮 ---- */


.bg_scheme_color, .btn_8, .button_type_7 {


	background-color: #7b5bff !important;


	color: #fff !important;


}


.bg_scheme_color:hover, .btn_8:hover {


	background-color: #00f0ff !important;


	color: #0a0a0f !important;


}





/* ---- 顶部"每日推荐"徽标 ---- */


.count { background: #ff3d81 !important; color: #fff !important; }








/* ============================================================


   TOP12 歌曲列表样式  (复刻设计稿截图: 规整单列, 序号+歌名+右侧操作)


   ============================================================ */


.song-card-wrap {


	display: block;


	margin-bottom: 15px;


}


.song-card {


	display: flex;


	align-items: center;


	gap: 10px;


	padding: 10px 14px;


	border-bottom: 1px solid rgba(255,255,255,.07);


	transition: background .12s ease;


	border-radius: 0;


	background: transparent !important;


}


.song-card:last-child { border-bottom: none; }


.song-card:hover { background: rgba(255,255,255,.03); }


.song-card.playing { background: rgba(0,240,255,.06); }





/* 序号: 等宽靠左 */


.song-card .sc-num {


	flex: none;


	width: 34px;


	text-align: left;


	font-size: 13px;


	font-weight: 700;


	color: #8b8fa3;


	letter-spacing: .5px;


}


.song-card .sc-num.sc-top { color: #7b5bff; }





/* 歌名: 占满剩余空间, 超长省略 */


.song-card .sc-name {


	flex: 1;


	min-width: 0;


	display: block;


	color: #eef1ff;


	font-size: 13.5px;


	white-space: nowrap;


	overflow: hidden;


	text-overflow: ellipsis;


	transition: color .15s;


}


.song-card .sc-name:hover { color: #00f0ff; }





/* 右侧操作区: 日期+收藏+下载+播放 固定靠右 */


.song-card .sc-btns {


	flex: none;


	display: flex;


	align-items: center;


	gap: 12px;


	margin-left: auto;


}


.song-card .sc-date {


	font-size: 12px;


	color: #8b8fa3;


	min-width: 40px;


	text-align: right;


	white-space: nowrap;


}





/* 收藏: 空心♡, 收藏变粉色♥ */


.song-card .op-fav {


	width: 22px;


	height: 22px;


	display: inline-flex;


	align-items: center;


	justify-content: center;


	border: none;


	background: none;


	color: #8b8fa3;


	font-size: 15px;


	line-height: 1;


	cursor: pointer;


	transition: color .15s, transform .15s;


}


.song-card .op-fav:hover { color: #ff3d81; transform: scale(1.12); }


.song-card .op-fav.on { color: #ff3d81; }





/* 下载: ↓ 空心, hover 青色 */


.song-card .op-dl {


	width: 22px;


	height: 22px;


	display: inline-flex;


	align-items: center;


	justify-content: center;


	border: none;


	background: none;


	color: #8b8fa3;


	font-size: 15px;


	line-height: 1;


	cursor: pointer;


	transition: color .15s;


}


.song-card .op-dl:hover { color: #00f0ff; }





/* 播放: ▶ 圆形外框, hover 变青色 */


.song-card .op-play {


	width: 24px;


	height: 24px;


	display: inline-flex;


	align-items: center;


	justify-content: center;


	border-radius: 50%;


	border: 1px solid rgba(255,255,255,.5);


	background: rgba(255,255,255,.08);


	color: #fff;


	font-size: 12px;


	line-height: 1;


	cursor: pointer;


	transition: all .15s;


}


.song-card .op-play:hover {


	border-color: #00f0ff;


	color: #00f0ff;


	background: rgba(0,240,255,.12);


}





/* ============================================================


   推荐专辑 整块卡片背景  (复刻设计稿截图: 封面+名称+日期)


   ============================================================ */


.album-card {


	background: #1d1d29 !important;


	border: 1px solid rgba(255,255,255,.08) !important;


	border-radius: 14px !important;


	padding: 14px !important;


}


.album-card .new-title { margin-bottom: 12px !important; }


.album-card .new-title h2 { font-size: 16px; color: #eef1ff; }


.album-card .more a { color: #8b8fa3; font-size: 12px; }


.album-card .more a:hover { color: #00f0ff; }





/* 专辑条目: 封面+名称+日期 横排 */


.album-card .album-item {


	display: flex;


	align-items: center;


	gap: 10px;


	padding: 9px 0;


	border-bottom: 1px solid rgba(255,255,255,.07);


}


.album-card .album-item:last-child { border-bottom: none; }


.album-card .album-cover {


	flex: none;


	width: 44px;


	height: 44px;


	border-radius: 8px;


	object-fit: cover;


	background: #10101a;


	box-shadow: 0 2px 8px rgba(0,0,0,.35);


}


.album-card .album-name {


	flex: 1;


	min-width: 0;


	display: block;


	color: #eef1ff;


	font-size: 13px;


	white-space: nowrap;


	overflow: hidden;


	text-overflow: ellipsis;


}


.album-card .album-name:hover { color: #00f0ff; }


.album-card .album-date {


	flex: none;


	font-size: 12px;


	color: #8b8fa3;


	min-width: 40px;


	text-align: right;


}








/* ---- 全局防横向溢出：修复跑马灯/横排卡片撑宽页面导致内容不居中 ---- */


html, body {


	overflow-x: hidden !important;


}








/* ===== 顶部右侧用户导航胶囊按钮（对齐设计稿 quick-nav） ===== */


.h_top ul.users_nav{float:right;padding:14px 0;display:flex;align-items:center;gap:6px;}


.h_top .users_nav li{float:none;margin-left:0;list-style:none;}


.h_top .users_nav{margin-top:4px;}


.h_top .users_nav .quick-btn{


	display:inline-flex !important;align-items:center;gap:5px;


	border:1px solid rgba(0,240,255,.22);background:rgba(255,255,255,.04);color:#fff !important;


	border-radius:999px;padding:7px 12px;font-size:13px;line-height:1;


	transition:border-color .2s,color .2s,box-shadow .2s;text-decoration:none !important;cursor:pointer;


}


.h_top .users_nav .quick-btn i{font-size:15px !important;color:#00f0ff !important;margin:0;}


.h_top .users_nav .quick-btn span{display:inline !important;color:#fff !important;font-size:13px !important;margin:0;padding:0;line-height:1;vertical-align:middle;}


.h_top .users_nav .quick-btn i{display:inline-block !important;vertical-align:middle;}


.h_top .users_nav .quick-btn:hover{border-color:#00f0ff;color:#00f0ff;box-shadow:0 0 8px rgba(0,240,255,.3);}


.h_top .users_nav .quick-btn:hover > span{color:#00f0ff !important;}


.h_top .users_nav .quick-btn:hover i{color:#00f0ff !important;}


.h_top .users_nav .quick-btn #user-info a{color:#fff;text-decoration:none;}


.h_top .users_nav .quick-btn #user-info a:hover{color:#00f0ff;}





/* ===== 全局设计变量 ===== */


:root{


  --bg:#14141d; --bg2:#1a1a26; --card:#1d1d29;


  --accent:#00f0ff; --accent2:#7b5bff; --pink:#ff3d81;


  --text:#eef1ff; --muted:#8b8fa3; --line:rgba(255,255,255,.08);


  --gold:#ffc94d;


}


/* ===== 通用 ex 列表(歌手页推荐试听等) ===== */


.ex-row{ display:flex; align-items:center; gap:9px; padding:10px 13px; border-bottom:1px solid var(--line); font-size:12.5px; cursor:pointer; transition:background .12s; color:var(--text); }


.ex-row:hover{ background:rgba(255,255,255,.03); }


.ex-row:last-child{ border-bottom:none; }


.ex-no{ color:#fff; font-weight:800; font-size:11px; flex:none; width:21px; height:21px; border-radius:6px; display:inline-grid; place-items:center; line-height:1; font-variant-numeric:tabular-nums; box-shadow:0 2px 6px rgba(0,0,0,.4); }


.no1{ background:linear-gradient(135deg,#ffc94d,#ff9d2e); color:#fff; }


.no2{ background:linear-gradient(135deg,#e8ecf4,#9aa3b8); color:#fff; }


.no3{ background:linear-gradient(135deg,#ff9a5a,#d96a2f); color:#fff; }


.no4{ background:linear-gradient(135deg,#ff3d81,#b344ff); color:#fff; }


.no5{ background:linear-gradient(135deg,#00f0ff,#7b5bff); color:#fff; }


.no6{ background:linear-gradient(135deg,#4ade80,#16a34a); color:#fff; }


.no-rest{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); color:var(--muted); }


.ex-name{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text); }


.ex-name:hover{ color:var(--accent); }


.ex-date{ color:var(--muted); font-size:12px; flex:none; }


.ex-ops{ display:flex; gap:6px; flex:none; }


.op{ width:26px; height:26px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:transparent; color:#fff; font-size:11px; line-height:1; cursor:pointer; display:grid; place-items:center; transition:all .15s; padding:0; }


.op:hover{ transform:translateY(-1px); border-color:#fff; }


.op-fav:hover,.op-fav.on{ background:var(--pink); color:#fff; border-color:var(--pink); }


.op-fav.on{ box-shadow:0 0 8px rgba(255,61,129,.4); }


.op-play:hover{ background:rgba(0,240,255,.15); color:var(--accent); border-color:rgba(0,240,255,.55); }


.op-dl:hover{ background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.4); }


/* ===== Artist 页: 封面卡片 ===== */


.portfolio_masonry_container .portfolio_item{ margin:8px 0; padding:0 8px; }


.portfolio_masonry_container .portfolio_item .photoframe{ border:1px solid var(--line) !important; background:var(--card) !important; border-radius:14px; padding:8px; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.35); transition:border-color .2s, transform .2s, box-shadow .2s; }


.portfolio_masonry_container .portfolio_item .photoframe:hover{ border-color:rgba(0,240,255,.45) !important; transform:translateY(-3px); box-shadow:0 12px 30px rgba(0,240,255,.12); }


.portfolio_masonry_container .artist_cover img{ max-height:170px; max-width:150px; border-radius:9px; display:block; margin:0 auto; }


.portfolio_masonry_container .portfolio_item figcaption{ margin-top:6px; }


.portfolio_masonry_container .portfolio_item figcaption h5{ color:var(--text); font-size:13px; font-weight:700; margin:4px 0 2px; }


.portfolio_masonry_container .portfolio_item figcaption h5:hover{ color:var(--accent); }


/* Artist 页: 标题区 + 分类下拉 */


.page_content_offset h2.pt_10{ font-size:20px; font-weight:800; margin-top:6px; }


.custom_select .select_title{ background:var(--bg2); border:1px solid var(--line) !important; color:var(--text); border-radius:8px; font-size:12px; }


.custom_select .select_title:after{ color:var(--muted); }


.custom_select .select_title:before{ border-left-color:var(--line) !important; }
.custom_select select{ display:none !important; }


.select_list{ background:var(--card); border:1px solid var(--line); border-radius:8px; }


.select_list a, .select_list li a{ color:var(--text); }


.select_list li:hover, .select_list a:hover{ background:rgba(0,240,255,.08); color:var(--accent); }


/* Artist 页: 新晋艺人 */


.sidebar_content{ padding:5px; }


.sidebar_content h2{ font-size:18px; font-weight:800; color:var(--text); }


.sidebar_content h2 a{ color:var(--accent); font-size:12px; font-weight:400; }


.sidebar_content hr{ border-color:var(--line); }


.sidebar_content .clearfix a.d_block{ color:var(--text); font-size:13px; font-weight:600; }


.sidebar_content .clearfix a.d_block:hover{ color:var(--accent); }


.sidebar_content .clearfix .scheme_color{ color:var(--muted); font-size:12px; }


.sidebar_content .clearfix .scheme_color .jy-fire{ color:var(--gold); }


.sidebar_content .clearfix .button_type_19{ background:var(--bg2); border:1px solid rgba(0,240,255,.35); color:var(--accent); border-radius:999px; padding:3px 12px; font-size:12px; }


.sidebar_content .clearfix .button_type_19:hover{ background:rgba(0,240,255,.15); color:var(--accent); }


/* Artist 页: 推荐试听面板 */


.panel{ border:1px solid var(--line); border-radius:14px; background:var(--card); overflow:hidden; margin-bottom:14px; }


.panel .panel-head{ padding:12px 16px; border-bottom:1px solid var(--line); background:rgba(123,91,255,.12); }


.panel .panel-head h3{ font-size:15px; font-weight:800; margin:0; color:var(--text); }


/* Artist 页: 分页 */


.page_list li a, .page_list li span{ background:var(--bg2); color:var(--muted); border:1px solid var(--line); border-radius:8px; font-size:12px; padding:5px 12px; }


.page_list li a:hover, .page_list li.active span{ background:rgba(0,240,255,.15); color:var(--accent); border-color:rgba(0,240,255,.5); }


.page_content_offset hr{ border-color:var(--line); }





/* ===== Artist 页: 模块卡片容器 ===== */


.artist-card{ border:1px solid var(--line); border-radius:14px; background:var(--card); padding:14px 14px 10px; margin-bottom:16px; }


.artist-card hr{ border-color:var(--line); }


.artist-card .portfolio_masonry_container{ margin-bottom:2px; }


.artist-card .page_total{ color:var(--muted); font-size:12px; }


.side-card{ border:1px solid var(--line); border-radius:14px; background:var(--card); padding:12px 14px 6px; margin-bottom:16px; }


.side-card h2{ font-size:18px; font-weight:800; color:var(--text); }


.side-card h2 a{ color:var(--accent); font-size:12px; font-weight:400; }


.side-card hr{ border-color:var(--line); }


.side-card .sidebar_content{ padding:2px 0 0; }


.side-card .sidebar_content hr{ margin-bottom:12px; }





/* ===== Artist 页: 四列网格 ===== */


.portfolio_masonry_container{ display:flex; flex-wrap:wrap; gap:14px 10px; margin:0; }


.portfolio_masonry_container .portfolio_item{ flex:0 0 calc(25% - 7.5px); width:auto !important; margin:0; padding:0; box-sizing:border-box; }


.portfolio_masonry_container figure{ width:100%; }


.portfolio_masonry_container .photoframe{ width:100%; max-width:100%; box-sizing:border-box; }


.portfolio_masonry_container .artist_cover img{ max-width:100%; height:auto; max-height:180px; }


@media (max-width:768px){


  .portfolio_masonry_container .portfolio_item{ flex-basis:calc(50% - 5px); width:auto !important; }


}


/*


===== Artist 页: 模块卡片容器 ===== */


.artist-card{ border:1px solid var(--line); border-radius:14px; background:var(--card); padding:14px 14px 10px; margin-bottom:16px; }


.artist-card hr{ border-color:var(--line); }


.artist-card .portfolio_masonry_container{ margin-bottom:2px; }


.artist-card .page_total{ color:var(--muted); font-size:12px; }


.side-card{ border:1px solid var(--line); border-radius:14px; background:var(--card); padding:12px 14px 6px; margin-bottom:16px; }


.side-card h2{ font-size:18px; font-weight:800; color:var(--text); }


.side-card h2 a{ color:var(--accent); font-size:12px; font-weight:400; }


.side-card hr{ border-color:var(--line); }


.side-card .sidebar_content{ padding:2px 0 0; }


.side-card .sidebar_content hr{ margin-bottom:12px; }








/* Artist 网格溢出修复 */


.portfolio_masonry_container figure{ width:100%; }


.portfolio_masonry_container .photoframe{ max-width:100%; }





/* Artist 页: 分页区分隔线 */


.artist-card > .clearfix:last-child{ border-top:1px solid var(--line); padding-top:16px; margin-top:10px; margin-bottom:0; }





/* Artist 页: 上页/下页按钮统一深色并水平对齐 */


.page_list li.next a, .page_list li.prev a{


  background:var(--bg2) !important;


  border:1px solid var(--line) !important;


  color:var(--muted) !important;


  border-radius:8px;


  font-size:12px;


  padding:5px 12px !important;


  line-height:normal;


  box-sizing:border-box;


}


.page_list li.next a:hover, .page_list li.prev a:hover{


  background:rgba(0,240,255,.15) !important;


  color:var(--accent) !important;


  border-color:rgba(0,240,255,.5) !important;


}





/* ===== 版块标题渐变竖条(首页同款) ===== */


.page_content_offset h2.pt_10, .side-card h2, .panel .panel-head h3{


  display:flex; align-items:center; gap:9px;


}


.page_content_offset h2.pt_10::before, .side-card h2::before, .panel .panel-head h3::before{


  content:""; width:5px; height:18px; flex:none;


  background:linear-gradient(180deg,#00f0ff,#7b5bff);


  border-radius:3px;


}


.side-card h2 a{ margin-left:auto; }





/* 侧边栏: 隐藏空广告占位, 收紧版块间距 */


.sidebar_content.mb_10:has(> div[style]:empty){ display:none !important; }


.side-card{ margin-bottom:14px; }


.panel{ margin-bottom:14px; }





/* ===== 艺人详情页 & 专辑页 黑金化 ===== */


.team_photo{ background:var(--card) !important; border-color:var(--line) !important; }


.music-action-btn.btn_1, .btn_1{


  background:var(--bg2) !important; color:var(--text) !important;


  border:1px solid var(--line); border-radius:999px;


  padding:6px 14px; font-size:13px;


}


.btn_1:hover{


  background:rgba(0,240,255,.15) !important; color:var(--accent) !important;


  border-color:rgba(0,240,255,.5);


}


.tabs_nav li a{


  background:var(--bg2) !important; color:var(--muted) !important;


  border:1px solid var(--line); border-radius:8px;


  padding:6px 14px; font-size:13px; margin:0 3px;


}


.tabs_nav li.active a, .tabs_nav li a:hover{


  background:rgba(0,240,255,.15) !important; color:var(--accent) !important;


  border-color:rgba(0,240,255,.5);


}


/* 歌曲序号/分页统计: 蓝灰转黑金 */


.ls_num{


  background:var(--bg2) !important; color:var(--muted) !important;


  border:1px solid var(--line); border-radius:6px;


  padding:2px 8px; font-size:12px;


}


.ls_num_top{


  color:var(--accent) !important; background:rgba(0,240,255,.15) !important;


  border-color:rgba(0,240,255,.4);


}


.page_total{


  background:var(--bg2) !important; color:var(--muted) !important;


  border:1px solid var(--line); border-radius:8px;


  padding:4px 10px; font-size:12px;


}


/* 专辑页 */


.a_cover{ border-color:var(--line) !important; background:var(--card); }


.a_list .scheme_color{ color:var(--muted) !important; }


.a_list_info{ color:var(--muted) !important; }


.album_play.btn_4{


  background:var(--bg2) !important; color:var(--accent) !important;


  border:1px solid rgba(0,240,255,.4); border-radius:999px;


  padding:6px 14px; font-size:13px;


}


.album_play.btn_4:hover{ background:rgba(0,240,255,.15); }





/* ===== 专辑列表页: 标题+列表整合为一张大卡片 (对齐歌手页/首页风格) ===== */


/* section 整体大卡片(仅含 .a_list 的专辑列表页, 不误伤标签页) */


section.col-sm-8.pt_10:has(.a_list){


  border:1px solid var(--line);


  border-radius:14px;


  background:var(--card);


  padding:0 14px 14px;


}


/* 标题行: 大卡片头部, jy-cdcover 图标保留 */


section.col-sm-8.pt_10:has(.a_list) > .row.clearfix:first-child{


  border:none; border-radius:0; background:transparent;


  padding:14px 0 10px;


  border-bottom:1px solid var(--line);


  margin-bottom:0;


}


section.col-sm-8.pt_10:has(.a_list) > .row.clearfix:first-child h2.pt_10{


  font-size:18px; font-weight:800; margin-top:0;


}


section.col-sm-8.pt_10:has(.a_list) > .row.clearfix:first-child h2.pt_10 i{


  font-size:18px; color:var(--accent); flex:none;


}


/* 标题与列表之间的 hr 隐藏 */


section.col-sm-8.pt_10:has(.a_list) > hr{ display:none !important; }


/* 专辑条目: 大卡片内部行, 分格线分隔, 按钮组固定在行底部右侧 */


.a_list{


  position:relative;


  border:none; border-radius:0; background:transparent;


  border-bottom:1px solid var(--line);


  padding:14px 0 6px;


  margin:0;


  min-height:140px;


  box-sizing:border-box;


  transition:background .15s;


}


.a_list:last-of-type{ border-bottom:none; }


.a_list:hover{ background:rgba(255,255,255,.03); }


.a_list .a_cover{ background:transparent; border-radius:10px; }


.a_list .a_cover img{ border-radius:10px; box-shadow:0 4px 14px rgba(0,0,0,.45); }


/* 中间信息列: 结构统一(标题/发行/描述各一行, 超长省略) */


.a_list .col-sm-6{


  display:flex; flex-direction:column; justify-content:center;


  min-width:0;


}


.a_list h3{


  font-size:16px; font-weight:800; color:var(--text);


  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;


  max-width:100%; margin:0 0 8px;


}


.a_list h3:hover{ color:var(--accent); }


.a_list .scheme_color{ color:var(--muted) !important; font-size:13px; margin:0 0 6px; }


.a_list .a_list_info{


  color:var(--muted) !important; font-size:13px;


  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;


}


.a_list .a_list_info a{ color:var(--accent); }


/* 右列(日期/制作人): 顶部对齐, 底部留按钮组空间 */


.a_list .col-sm-3{ padding-bottom:46px; }


.a_list .col-sm-3 .scheme_color{ margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }


/* 按钮组: 绝对定位在行底部, 所有行统一位置 */


.a_list .album_play.btn_4{


  position:absolute; bottom:12px; right:104px; margin:0;


  display:inline-flex; align-items:center;


}


.a_list .music-action-btn.btn_1{


  position:absolute; bottom:12px; margin:0;


  width:26px; height:26px; border-radius:50% !important;


  display:inline-grid !important; place-items:center !important;


  padding:0 !important;


  border:1px solid rgba(255,255,255,.25) !important;


  background:transparent !important; color:#fff !important;


  font-size:13px; line-height:1;


}


.a_list .music-action-btn.btn_1 i{ font-size:14px !important; }


.a_list .music-action-btn.btn_1:hover,


.a_list .music-action-btn.btn_1.on{


  background:var(--pink) !important; color:#fff !important;


  border-color:var(--pink) !important;


}


.a_list .music-action-btn.btn_1.on{ box-shadow:0 0 8px rgba(255,61,129,.4); }


.a_list .music-action-btn[data-action="fav"]{ right:16px; }


.a_list .music-action-btn[data-action="like"]{ right:56px; }


/* 条目间 hr(分格线) 隐藏, 靠行分隔线 */


section.col-sm-8.pt_10:has(.a_list) > .a_list + hr{ display:none !important; }


/* 分页区: 大卡片尾部 */


section.col-sm-8.pt_10:has(.a_list) > .row.clearfix.mb_15{


  border-top:1px solid var(--line);


  padding-top:16px;


  margin-top:8px;


}


/* 页面宽度同步首页: PC 下 container 1170(覆盖 user.css 的 970), 小屏保持响应 */


@media (min-width:1200px){


  .container{ width:1170px !important; }


}


/* ===== 用户中心(User模块) 黑金化 ===== */


/* 个人中心顶部导航条: 深色卡片 */


.personaltop ul{


  background:var(--card) !important;


  border:1px solid var(--line) !important;


  border-radius:14px;


  height:auto !important;


  padding:6px 10px;


  display:flex; align-items:center; flex-wrap:nowrap; gap:0;


  overflow-x:auto;


}


.personaltop ul li{ line-height:30px !important; margin-right:0 !important; flex:none; }


.personaltop ul li.title{


  color:var(--text) !important;


  font-size:16px !important; font-weight:800;


  margin-right:10px !important;


  display:flex; align-items:center; gap:7px;


}


.personaltop ul li.title::before{


  content:""; width:5px; height:18px; flex:none;


  background:linear-gradient(180deg,#00f0ff,#7b5bff);


  border-radius:3px;


}


.personaltop ul li a{


  color:var(--muted) !important;


  font-size:13px !important;


  padding:4px 9px !important;


  border-radius:999px !important;


  border:1px solid transparent !important;


  transition:all .15s;


  white-space:nowrap;


}


.personaltop ul li a:hover{ color:var(--accent) !important; background:rgba(0,240,255,.08) !important; }


.personaltop ul li.active a,


.personaltop ul li.active a:hover{


  color:var(--accent) !important;


  background:rgba(0,240,255,.12) !important;


  border:1px solid rgba(0,240,255,.4) !important;


  border-bottom:1px solid rgba(0,240,255,.4) !important;


}


.personaltop ul li.reture{ margin-left:auto !important; }


.personaltop ul li.reture a{


  border:1px solid rgba(0,240,255,.35) !important;


  color:var(--accent) !important;


}


/* 左侧用户信息卡 */


.new-warpl .user-info{


  background:var(--card) !important;


  border:1px solid var(--line);


  border-radius:14px;


  padding:14px 10px 10px;


}


.new-warpl .user-info dt img{


  border-radius:50%;


  border:2px solid rgba(0,240,255,.35);


  box-shadow:0 0 0 4px rgba(0,240,255,.08);


}


.new-warpl .user-info .name{ color:var(--text) !important; font-weight:700; }


.new-warpl .user-info .hy_no{ border-top:1px solid var(--line) !important; }


.new-warpl .user-info .hy_no span{ border-right:1px solid var(--line) !important; }


.new-warpl .user-info .hy_no span p{ color:var(--text) !important; }


.new-warpl .user-info .hy_no span p.pt_10{ color:var(--muted) !important; font-size:12px; }


/* 账户内容卡片 */


.tabbable-custom{


  background:var(--card) !important;


  border:1px solid var(--line);


  border-radius:14px;


  padding:14px 16px;


}


.tabbable-custom > .nav-tabs{ border-bottom:1px solid var(--line) !important; }


.tabbable-custom > .nav-tabs > li{ border-top:none !important; margin-bottom:0 !important; }


.tabbable-custom > .nav-tabs > li > a{


  color:var(--muted) !important;


  border-radius:999px !important;


  padding:5px 14px !important;


  margin-right:6px !important;


  font-size:13px;


}


.tabbable-custom > .nav-tabs > li > a:hover,


.tabbable-custom > .nav-tabs > li > a:focus{


  color:var(--accent) !important;


  background:rgba(0,240,255,.08) !important;


  border-color:transparent !important;


}


.tabbable-custom > .nav-tabs > li.active{ border-top:none !important; }


.tabbable-custom > .nav-tabs > li.active > a{


  color:var(--accent) !important;


  background:rgba(0,240,255,.12) !important;


  border:1px solid rgba(0,240,255,.4) !important;


}


.tabbable-custom .tab-content{ color:var(--text); padding:14px 6px !important; }


.tabbable-custom .tab-content p{ color:var(--text); }


.tabbable-custom hr{ border-color:var(--line) !important; }


.tabbable-custom .text-info, .tabbable-custom .text-danger{ color:var(--accent) !important; }


/* 登录页: 登录卡片 */


.login-box{


  background:var(--card) !important;


  border:1px solid var(--line);


  border-radius:14px;


  padding:24px 26px !important;


  box-shadow:0 12px 40px rgba(0,0,0,.45);


  max-width:560px; margin:0 auto; float:none;


}


.login-box .control-label{ text-align:right; padding-right:12px; }


.login-box h2{ display:flex; align-items:center; gap:9px; }


.login-box h2::before{


  content:""; width:5px; height:18px; flex:none;


  background:linear-gradient(180deg,#00f0ff,#7b5bff);


  border-radius:3px;


}


.login-box h2 i{ color:var(--accent); }


.login-box hr{ border-color:var(--line) !important; }


.login-box label{ color:var(--muted) !important; font-size:13px; }


.login-box .form-control{


  background:var(--bg2) !important;


  border:1px solid var(--line) !important;


  color:var(--text) !important;


  border-radius:8px !important;


  box-shadow:none !important;


}


.login-box .form-control:focus{ border-color:rgba(0,240,255,.5) !important; box-shadow:0 0 0 3px rgba(0,240,255,.12) !important; }


.login-box .form-control::placeholder{ color:var(--muted) !important; }


.login-box ul{ list-style:none; padding:0; margin:0; }


.login-box a{ color:var(--muted); }


.login-box a:hover{ color:var(--accent); }


.login-box .sina-btn, .login-box .qq-btn{


  display:inline-grid; place-items:center;


  width:34px; height:34px; border-radius:50%;


  border:1px solid var(--line); margin-left:8px;


  color:var(--muted) !important; transition:all .15s;


}


.login-box .sina-btn:hover, .login-box .qq-btn:hover{


  color:#fff !important; border-color:rgba(0,240,255,.5);


}


/* 公共: 搜索下拉面板/面包屑 黑金化 */


.sw_content{


  background:var(--bg2) !important;


  box-shadow:0 8px 24px rgba(0,0,0,.5);


  border-bottom-left-radius:12px;


}


.sw_content input{


  background:var(--card) !important; color:var(--text) !important;


  border:1px solid var(--line) !important;


}


.sw_content input::placeholder{ color:var(--muted) !important; }


.breadcrumbs{ background:transparent !important; border-bottom:1px solid var(--line); }





/* ===== 全站歌曲列表统一首页 ex 风格 ===== */


/* 序号: 首页 no1-no6 渐变 + no-rest 深底 */


.play_box .ls_num{


  color:#fff !important; font-weight:800; font-size:11px;


  width:24px !important; height:24px !important; border-radius:6px !important;


  display:inline-grid !important; place-items:center; line-height:1;


  font-variant-numeric:tabular-nums; box-shadow:0 2px 6px rgba(0,0,0,.4);


  padding:0 !important; background:rgba(255,255,255,.06) !important;


  border:1px solid rgba(255,255,255,.12) !important; color:#8b8fa3 !important;


}


.play_box:nth-child(1) .ls_num{ background:linear-gradient(135deg,#ffc94d,#ff9d2e) !important; color:#1a1200 !important; border:none !important; }


.play_box:nth-child(2) .ls_num{ background:linear-gradient(135deg,#e8ecf4,#9aa3b8) !important; color:#1a1a2e !important; border:none !important; }


.play_box:nth-child(3) .ls_num{ background:linear-gradient(135deg,#ff9a5a,#d96a2f) !important; color:#fff !important; border:none !important; }


.play_box:nth-child(4) .ls_num{ background:linear-gradient(135deg,#ff3d81,#b344ff) !important; color:#fff !important; border:none !important; }


.play_box:nth-child(5) .ls_num{ background:linear-gradient(135deg,#00f0ff,#7b5bff) !important; color:#00121a !important; border:none !important; }


.play_box:nth-child(6) .ls_num{ background:linear-gradient(135deg,#4ade80,#16a34a) !important; color:#001a0a !important; border:none !important; }


/* 行 hover 与分隔 */


.play_box:hover{ background:rgba(255,255,255,.03); }


/* 操作按钮: 首页 op 圆形 */


.ls_btns a{


  width:26px; height:26px; border-radius:50%;


  border:1px solid rgba(255,255,255,.25);


  display:inline-grid; place-items:center;


  color:#fff; font-size:13px;


}


.ls_btns a:hover{ transform:translateY(-1px); }


.ls_btns .music-action-btn:hover, .ls_btns a.on{


  background:var(--pink) !important; color:#fff; border-color:var(--pink);


}


.ls_btns a.on{ box-shadow:0 0 8px rgba(255,61,129,.4); }


.ls_btns .jp-play-me:hover{


  background:rgba(0,240,255,.15); color:var(--accent); border-color:rgba(0,240,255,.55);


}


/* 歌曲列表容器: 首页 ex-col 卡片 */


.tab-content{


  border:1px solid var(--line); border-radius:14px;


  background:var(--card); overflow:hidden;


}


.tab-content .tab-pane{ padding:4px 14px 10px; }


/* 标题: 首页 ex-col-head h3 风格 */


.page_content_offset h3.f_left{


  font-size:15px; font-weight:800; color:var(--text);


  display:flex; align-items:center; gap:7px; margin:0;


}


.page_content_offset h3.f_left::before{


  content:""; width:5px; height:16px;


  background:linear-gradient(180deg,#00f0ff,#ff3d81);


  border-radius:3px; display:inline-block;


}





/* 歌曲行播放状态: 只歌名背景发亮(整行不发亮, 避免分割线发亮) */


.play_box.playing .song_list a[target="_play"]{


  background:rgba(0,240,255,.10) !important; border-radius:6px !important;


  padding:0 8px !important; box-sizing:border-box !important; color:#00f0ff !important;


}





/* 艺人详情/专辑页: 标题栏卡片化, 与下方歌曲列表衔接成一体(保留行卡片/分格线) */


section.col-sm-8 > .clearfix.pt_10{


  background:#1d1d29 !important;


  border:1px solid rgba(255,255,255,.08) !important;


  border-radius:14px 14px 0 0 !important;


  padding:11px 14px !important;


  display:flex !important;


  align-items:center !important;


  justify-content:space-between !important;


  flex-wrap:wrap !important;


  gap:8px !important;


}


section.col-sm-8 > .clearfix.pt_10 h3{


  margin:0 !important; font-size:16px !important; font-weight:800 !important;


  color:var(--text) !important; display:flex !important; align-items:center !important; gap:8px !important;


}


section.col-sm-8 > .clearfix.pt_10 h3::before{


  content:""; width:5px; height:16px;


  background:linear-gradient(180deg,#00f0ff,#ff3d81);


  border-radius:3px; display:inline-block;


}


section.col-sm-8 > .clearfix.pt_10 .tabs_nav{


  display:flex !important; align-items:center !important; gap:6px !important;


  margin:0 !important; padding:0 !important; list-style:none !important;


}


section.col-sm-8 > .clearfix.pt_10 .tabs_nav li{ margin:0 !important; }


section.col-sm-8 > .clearfix.pt_10 .tabs_nav li a{


  display:inline-block !important; padding:5px 12px !important; border-radius:20px !important;


  border:1px solid rgba(255,255,255,.12) !important; color:#8b8fa3 !important; font-size:12.5px !important;


  background:transparent !important; text-decoration:none !important; transition:all .15s !important;


}


section.col-sm-8 > .clearfix.pt_10 .tabs_nav li.active a{


  background:rgba(0,240,255,.15) !important; color:#00f0ff !important; border-color:rgba(0,240,255,.55) !important;


}


section.col-sm-8 > .clearfix.pt_10 .tabs_nav li a:hover{


  color:#00f0ff !important; border-color:rgba(0,240,255,.4) !important;


}


/* 标题卡片与列表衔接: 去掉中间独立 hr, 首行卡片顶部边框让位给标题卡片底边 */


section.col-sm-8 > hr{ display:none !important; }


section.col-sm-8 .tab-content .play_box:first-child{ border-top:none !important; }


/* 播放态: 只歌名背景发亮(与首页一致) */


.play_box.playing .song_list a[target="_play"]{


  background:rgba(0,240,255,.10) !important; border-radius:6px !important;


  color:#00f0ff !important;


}





/* 艺人详情/专辑页: 左侧头像区域卡片化 */


aside.col-sm-4:has(.team_photo){


  border:1px solid var(--line); border-radius:14px;


  background:var(--card); padding-left:18px; padding-right:18px;


}


aside.col-sm-4:has(.team_photo) .t_align_c{ padding-top:18px; }


aside.col-sm-4:has(.team_photo) .team_photo{


  border:2px solid rgba(0,240,255,.35) !important;


  box-shadow:0 6px 20px rgba(0,0,0,.5);


}





/* 歌曲行操作区: 首页 ex-ops flex 布局对齐 */


.ls_btns{ display:flex !important; align-items:center; justify-content:flex-end; gap:6px; min-height:32px; }


.ls_btns a{ flex:none; }





/* 歌曲行: 序号与歌名同一水平线 */


.song_list > span:first-child{ display:flex; align-items:center; gap:8px; }


.song_list > span:first-child .ls_num{ margin-top:0 !important; margin-bottom:0 !important; }


.song_list > span:first-child a.text-ellipsis{ flex:1; min-width:0; }





/* 歌曲行操作按钮: 完全对齐首页 op 按钮 */


.ls_btns a{


  width:26px; height:26px; border-radius:50%;


  border:1px solid rgba(255,255,255,.25);


  background:transparent; color:#fff; font-size:11px;


  line-height:1; cursor:pointer; display:grid; place-items:center;


  flex:none;


}


.ls_btns a:hover{ transform:translateY(-1px); border-color:#fff; }


/* 下载图标视觉重心偏下, 上移 1.5px 修正居中 */


.ls_btns a[target="_down"] svg{ transform:translateY(-1.5px); }


.ls_btns a[data-action="fav"]:hover, .ls_btns a.on{


  background:var(--pink); color:#fff; border-color:var(--pink);


}


.ls_btns a.on, .ls_btns a[data-action="fav"]:hover{ box-shadow:0 0 8px rgba(255,61,129,.4); }


.ls_btns a[target="_down"]:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.4); }


.ls_btns .jp-play-me:hover{


  background:rgba(0,240,255,.15); color:var(--accent); border-color:rgba(0,240,255,.55);


}





/* 播放按钮默认白色描边(对齐首页 op-play), 覆盖 style.css 粉色 */


.ls_btns a{ margin:0 !important; }


.ls_btns a.jp-play-me{ color:#fff !important; border-color:rgba(255,255,255,.25) !important; }


.ls_btns a.jp-play-me:hover{ color:var(--accent) !important; border-color:rgba(0,240,255,.55) !important; background:rgba(0,240,255,.15) !important; }





/* 按钮图标强制 grid 居中(同步首页"最新发布"op 按钮) */


.ls_btns a{ display:grid !important; place-items:center !important; }


.ls_btns a svg{ margin:auto; }





/* ===== Article 分组(关于网站/文章) 黑金化 ===== */


/* 左侧关于网站导航 */


.page_content_offset aside h2{ font-size:18px; font-weight:800; color:var(--text); display:flex; align-items:center; gap:9px; }


.page_content_offset aside h2::before{ content:""; width:5px; height:18px; flex:none; background:linear-gradient(180deg,#00f0ff,#7b5bff); border-radius:3px; }


aside.col-sm-3 hr{ border-color:var(--line); }


.main_menu li.current a{ background:linear-gradient(135deg,rgba(0,240,255,.2),rgba(123,91,255,.2)) !important; border-color:rgba(0,240,255,.5) !important; color:#00f0ff !important; font-weight:700; }


/* 右侧正文卡片 */


section.col-lg-9 article{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:22px 24px; margin-bottom:16px; }


section.col-lg-9 article h2{ font-size:20px; font-weight:800; color:var(--text); display:flex; align-items:center; gap:9px; }


section.col-lg-9 article h2::before{ content:""; width:5px; height:18px; flex:none; background:linear-gradient(180deg,#00f0ff,#7b5bff); border-radius:3px; }


section.col-lg-9 article hr{ border-color:var(--line); }


section.col-lg-9 article .widget_content{ background:transparent !important; border:none !important; padding:0 !important; }


.widget_content p{ color:var(--text); }


.widget_content a{ color:var(--accent); }


/* 文章列表/详情页 */


.article_inner{ background:var(--card) !important; border:1px solid var(--line); border-radius:14px; }


.article_title{ border-bottom-color:var(--line); }


.article_title h1{ color:var(--text); }


.article_title p{ color:var(--muted); }


.article_content p{ color:var(--text); }


.info_list_item{ color:var(--text); border-bottom-color:var(--line); }


.info_list_item h1{ color:var(--text); }


.info_list_item p{ color:var(--muted); }


.info_list_txt{ color:var(--text); }


.top_list li{ color:var(--text); }


.side_info_list p a{ color:var(--text); }


.side_info_list li{ border-bottom-color:rgba(255,255,255,.08); }


.info_list{ border-bottom-color:var(--line); }


.siblings{ background:var(--card); border-top-color:var(--line); }


.siblings a{ color:var(--muted); }





/* ===== Article 列表页(资讯首页) 黑金化 ===== */


.info_hd h3.hd, aside h2.hd{ border-left:none; color:var(--text); display:flex; align-items:center; gap:9px; font-size:18px; font-weight:800; height:auto; line-height:1.4; padding-left:0; margin-bottom:10px; }


.info_hd h3.hd::before, aside h2.hd::before{ content:""; width:5px; height:18px; flex:none; background:linear-gradient(180deg,#00f0ff,#7b5bff); border-radius:3px; }


.info_hd h3.hd a{ color:var(--text); }


.info_hd .more, .info_hd .more a{ color:var(--muted); }


.top_list li{ background-image:none !important; color:var(--text); }


.top_list li a{ color:var(--text); }


.top_list li a:hover{ color:var(--accent); }


.top_list .top1 a b{ color:var(--accent); }


.top_title{ color:var(--text); }


.side_info_con{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px; }


.side_info_list img{ background:var(--bg2); }


.side_info_list p span{ color:var(--muted); }


.info_hd{ border-bottom-color:var(--line); }





/* ===== Article 正文强制可读 + 侧栏细节优化 ===== */


/* 正文所有文字强制浅色, 覆盖后台内联灰字/白底 */


section.col-lg-9 article .widget_content,


section.col-lg-9 article .widget_content *{


  color:#eef1ff !important;


  background-color:transparent !important;


  border-color:rgba(255,255,255,.08) !important;


}


section.col-lg-9 article .widget_content a{ color:#00f0ff !important; }


section.col-lg-9 article .widget_content a:hover{ color:#ff3d81 !important; }


section.col-lg-9 article .widget_content strong{ color:#ffc94d !important; }


section.col-lg-9 article .widget_content h1,


section.col-lg-9 article .widget_content h2,


section.col-lg-9 article .widget_content h3{ color:#eef1ff !important; }


/* 正文段落间距与行高 */


section.col-lg-9 article .widget_content p{ line-height:2; margin:0 0 14px; font-size:14px; }


/* 左侧导航: 紧凑卡片列表 */


.page_content_offset aside .sidebar_content{ background:transparent !important; border:none !important; padding:0 !important; }


.page_content_offset aside .main_menu.c_rank{ margin:0; padding:0; list-style:none; }


.page_content_offset aside .main_menu.c_rank li{ margin-bottom:5px; }


.page_content_offset aside .main_menu.c_rank li a{


  background:rgba(255,255,255,.03) !important;


  border:1px solid rgba(255,255,255,.06) !important;


  color:#cfd3e4 !important;


  border-radius:10px;


  padding:9px 14px;


  font-size:14px;


  display:block;


  transition:all .2s;


}


.page_content_offset aside .main_menu.c_rank li a:hover{ background:rgba(0,240,255,.1) !important; color:#00f0ff !important; border-color:rgba(0,240,255,.35) !important; }


.page_content_offset aside .main_menu.c_rank li.current a{


  background:linear-gradient(135deg,rgba(0,240,255,.22),rgba(123,91,255,.22)) !important;


  color:#00f0ff !important;


  border-color:rgba(0,240,255,.55) !important;


  font-weight:700;


  box-shadow:inset 3px 0 0 #00f0ff;


}


/* 标题区与列表间距 */


.page_content_offset aside h2{ margin:0 0 12px; }


.page_content_offset aside hr{ margin:0 0 14px; }





/* ---- 滚动条统一细窄 (v46): 避免页面滚动条与内部容器滚动条并排成双 ---- */


::-webkit-scrollbar{ width:10px; height:10px; background:#1a1a26 !important; }


::-webkit-scrollbar-track{ background:#14141d !important; }


::-webkit-scrollbar-thumb{ background:#7b5bff !important; border-radius:99px; }


::-webkit-scrollbar-thumb:hover{ background:#00f0ff !important; }


.pl-body::-webkit-scrollbar, .playlist::-webkit-scrollbar, .products_list::-webkit-scrollbar{ width:5px !important; }


.pl-body::-webkit-scrollbar-track, .playlist::-webkit-scrollbar-track, .products_list::-webkit-scrollbar-track{ background:transparent !important; }


.pl-body::-webkit-scrollbar-thumb, .playlist::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.22) !important; border-radius:99px; }





/* ---- 内部容器隐藏滚动条(v47): 页面仅保留主滚动条, 容器可滚动但不显示条 ---- */


.pl-body::-webkit-scrollbar, .playlist::-webkit-scrollbar, .products_list::-webkit-scrollbar{ display:none !important; }


.pl-body, .playlist, .products_list{ scrollbar-width:none; -ms-overflow-style:none; }





/* ---- 修复 html+body 双滚动条(v48): body 不产生滚动条, 由 html 统一滚动 ---- */


html{ overflow-y:auto !important; overflow-x:hidden !important; }


body{ overflow:visible !important; }





/* ---- 隐藏右侧悬浮二维码条(v50): 避免与滚动条视觉混淆 ---- */


.social_widgets{ display:none !important; }





/* ---- 隐藏系统注入的 "Powered by JYmusic" 固定版权条(v51) ---- */


body > p:has(a[href*="jyuu.cn"]){ display:none !important; }





/* ---- 播放态歌名不改变行高(v52): 避免下方版块错位 ---- */


.ex-row.playing, .t-row.playing{ line-height:inherit !important; }








/* ---- 回到顶部小火箭(v61): 按设计稿规则 —— 默认隐藏, 滚动>400px 显示, hover 反色 ---- */


#go_to_top{


	display: none;


	position: fixed;


	left: auto !important; right: 26px !important;


	top: auto !important; bottom: 120px !important;


	margin: 0 !important;


	width: 42px; height: 42px;


	border-radius: 50%;


	border: 1px solid rgba(255,255,255,.14);


	background: rgba(16,16,26,.9) !important;


	box-shadow: none !important;


	color: #ffffff !important;


	font-size: 18px; font-weight: 900; line-height: 1;


	cursor: pointer;


	z-index: 80;


	transition: background .2s, transform .2s;


}


#go_to_top.show{ display: grid; place-items: center; }


#go_to_top i{ line-height: 1 !important; }


#go_to_top:hover{


	background: #00f0ff !important;


	color: #05050a !important;


	border-color: #00f0ff;


}





/* ===== 站内下载弹窗(设计稿同款) ===== */


.dl-modal{ position:fixed; inset:0; z-index:120; display:none; align-items:center; justify-content:center; background:rgba(5,5,10,.62); backdrop-filter:blur(4px); padding:20px; overflow-y:auto; }


.dl-modal.show{ display:flex !important; }


.dl-card{ width:100%; max-width:560px; margin:auto; background:linear-gradient(180deg,#15151f,#0b0b14); border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.6); box-sizing:border-box; }


.dl-head{ display:flex; align-items:center; gap:10px; padding:14px 20px; border-bottom:1px solid var(--line); }


.dl-head b{ font-size:16px; color:var(--text); }


.dl-no{ color:var(--muted); font-size:11px; flex:1; }


.dl-close{ margin-left:auto; width:28px; height:28px; border-radius:50%; border:1px solid var(--line); background:none; color:var(--muted); font-size:14px; cursor:pointer; display:grid; place-items:center; line-height:1; }


.dl-close:hover{ color:var(--pink); border-color:var(--pink); }


.dl-name{ padding:14px 20px 4px; font-size:16px; font-weight:700; color:var(--text); line-height:1.4; }


.dl-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; padding:12px 20px; }


.dl-cell{ background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:10px; padding:8px 12px; }


.dl-cell label{ font-size:10.5px; color:var(--muted); display:block; margin-bottom:3px; }


.dl-cell b{ font-size:13px; color:var(--text); font-weight:600; }


.dl-tip{ color:var(--gold); font-size:12px; padding:2px 20px 10px; }


.dl-price{ background:rgba(255,61,129,.08); border:1px solid rgba(255,61,129,.25); margin:0 20px; padding:10px 14px; border-radius:10px; font-size:13px; color:var(--text); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }


.dl-price b{ color:var(--pink); }


.dl-price .dl-status{ color:var(--accent); }


.dl-actions{ display:flex; gap:12px; padding:16px 20px; }


.dl-cancel{ flex:1; padding:11px; border-radius:10px; border:1px solid var(--line); background:none; color:var(--muted); font-size:14px; cursor:pointer; }


.dl-cancel:hover{ color:var(--text); }


.dl-confirm{ flex:1.6; padding:11px; border:none; border-radius:10px; background:linear-gradient(90deg,#22c55e,#16a34a); color:#fff; font-size:14px; font-weight:700; cursor:pointer; box-shadow:0 6px 18px rgba(34,197,94,.3); transition:transform .15s,box-shadow .2s; }


.dl-confirm:hover{ box-shadow:0 8px 24px rgba(34,197,94,.45); transform:translateY(-1px); }


.dl-note{ color:var(--muted); font-size:11px; padding:0 20px 16px; }


.dl-login-tip{ flex:1.6; padding:11px 14px; border-radius:10px; border:1px dashed rgba(255,61,129,.4); color:#ff8fae; font-size:13px; text-align:center; background:rgba(255,61,129,.05); }


.dl-login-tip a{ color:var(--accent); text-decoration:underline; margin-right:6px; }


@media(max-width:560px){ .dl-grid{ grid-template-columns:1fr 1fr; gap:8px 10px; padding:10px 16px; } .dl-cell{ padding:6px 10px; } .dl-cell b{ font-size:12.5px; } }








/* ===== 音乐人卡片 ===== */


.sidebar-panel{background:var(--card,#1d1d29);border:1px solid var(--line,rgba(255,255,255,.08));border-radius:14px;overflow:hidden;margin-bottom:18px;}


.sidebar-head{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line,rgba(255,255,255,.08));background:linear-gradient(90deg,rgba(123,91,255,.22),rgba(0,240,255,.05));}


.sidebar-head h3{display:flex;align-items:center;gap:9px;font-size:15.5px;font-weight:800;margin:0;color:var(--text,#fff);}


.sidebar-head h3::before{content:"";width:5px;height:18px;flex:none;background:linear-gradient(180deg,#00f0ff,#7b5bff);border-radius:3px;}


.sidebar-head .s-more{font-size:12px;font-weight:400;color:#8b8b99;margin-left:6px;}


.sidebar-head .s-more:hover{color:#00f0ff;}


.sidebar-body{padding:10px 14px 8px;}


.s-artist{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:10px;transition:background .2s;}


.s-artist:hover{background:rgba(255,255,255,.045);}


.s-artist+.s-artist{border-top:1px solid var(--line,rgba(255,255,255,.06));}


.s-avatar{flex:none;width:46px;height:46px;border-radius:50%;overflow:hidden;background:#0e0e13;border:1px solid rgba(123,91,255,.35);}


.s-avatar img{width:100%;height:100%;object-fit:cover;display:block;}


.s-info{flex:1;min-width:0;}


.s-name{display:block;color:var(--text,#fff);font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}


.s-name:hover{color:#7b5bff;}


.s-hits{display:inline-flex;align-items:center;gap:4px;margin-top:4px;font-size:12px;color:#8b8b99;}


.s-detail{flex:none;font-size:12px;color:#a78bfa;border:1px solid rgba(123,91,255,.35);padding:4px 10px;border-radius:7px;background:rgba(123,91,255,.1);transition:all .2s;}


.s-detail:hover{color:#fff;background:rgba(123,91,255,.3);border-color:rgba(123,91,255,.6);}


/* v72: 幻灯与导航条间距收紧 */


.page_content_offset{ padding-top: 0px !important; }


#slider_wrapper{ margin-top: -10px !important; }





/* v73: 导航条高收到 66px（对齐设计稿 61px 附近） */


header.header .header-row{ padding-top: 3px !important; padding-bottom: 3px !important; }





/* v74: 导航吸顶+毛玻璃（复刻设计稿 header 原版规则） */


header.header{


  position: sticky !important;


  top: 0 !important;


  z-index: 60 !important;


  -webkit-backdrop-filter: blur(12px);


  backdrop-filter: blur(12px);


  background: rgba(0,0,0,.55) !important;


  border-bottom: 1px solid var(--line, rgba(255,255,255,.08));


}





/* v75: 导航条透明化——去掉 .h_top 实心底，露出 header 毛玻璃 */


header.header .h_top{


  background: transparent !important;


  border-bottom: none !important;


}





/* ===== MIX57 会员悬浮面板 user-panel ===== */


.user-panel-li{position:relative}


.user-panel{position:absolute;top:calc(100% + 12px);right:-10px;width:300px;z-index:9999;display:none;flex-direction:column;


  background:rgba(10,10,15,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);


  border:1px solid rgba(0,240,255,.18);border-radius:14px;


  box-shadow:0 12px 40px rgba(0,0,0,.55),0 0 24px rgba(0,240,255,.10);padding:0 0 10px}


.user-panel.up-show{display:flex;animation:upFade .2s ease}


.user-panel::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;border-radius:14px 14px 0 0;


  background:linear-gradient(90deg,#0ff,#7b2ff7,#ff3d8e);opacity:.9}


.user-panel::after{content:'';position:absolute;top:-7px;right:24px;width:13px;height:13px;


  background:rgba(10,10,15,.92);border-left:1px solid rgba(0,240,255,.18);border-top:1px solid rgba(0,240,255,.18);


  transform:rotate(45deg);border-radius:2px}


@keyframes upFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}


.up-head{display:flex;align-items:center;gap:12px;padding:18px 16px 12px}


.up-ava{width:48px;height:48px;border-radius:50%;padding:2px;background:linear-gradient(135deg,#0ff,#ff3d8e);flex:none;display:block}


.up-ava img{width:100%;height:100%;border-radius:50%;display:block;background:#14141d}


.up-meta{min-width:0}


.up-name{display:block;font-size:15px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}


.up-level{display:inline-block;margin-top:5px;font-size:11px;padding:2px 10px;border-radius:20px;width:fit-content;line-height:1.4;
  color:#9be8ff;border:1px solid rgba(0,240,255,.35);background:rgba(0,240,255,.08);font-weight:600}


.up-level.vip{color:#fff;font-weight:700;border:none;padding:3px 12px;


  background:linear-gradient(135deg,#ff3d8e,#ff9d4d);


  box-shadow:0 0 14px rgba(255,61,142,.6),inset 0 0 0 1px rgba(255,255,255,.18)}


.up-level.vip::before{content:'♛ ';color:#fff;text-shadow:0 0 8px rgba(255,255,255,.8)}


.up-balance{padding:8px 16px;font-size:13px;color:#8f93ab}


.up-balance b{color:#ffd479;font-size:15px;margin-left:4px;font-weight:600}


.up-vip-tip{display:flex;align-items:center;gap:4px;margin:4px 12px;padding:8px 12px;border-radius:8px;


  font-size:12px;color:#9be8ff;background:rgba(0,240,255,.08);border-left:3px solid #0ff}


.up-vip-tip a{color:#0ff;text-decoration:none}


.up-vip-tip a:hover{text-decoration:underline}


.up-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 12px}


.up-btns a{display:block;text-align:center;padding:9px 4px;border-radius:8px;font-size:13px;color:#dfe3f5;


  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);text-decoration:none;transition:.2s}


.up-btns a:hover{color:#0ff;border-color:rgba(0,240,255,.5);box-shadow:0 0 12px rgba(0,240,255,.25);background:rgba(0,240,255,.06)}


.up-btns a.up-c1{color:#ffd479;border-color:rgba(255,212,121,.25)}


.up-btns a.up-c1:hover{border-color:#ffd479;box-shadow:0 0 12px rgba(255,212,121,.3);background:rgba(255,212,121,.06);color:#ffd479}


.up-btns a.up-c2{color:#ff9cc0;border-color:rgba(255,61,142,.25)}


.up-btns a.up-c2:hover{border-color:#ff3d8e;box-shadow:0 0 12px rgba(255,61,142,.3);background:rgba(255,61,142,.06);color:#ff9cc0}


.up-logout{display:block;margin:4px 12px 0;padding:8px;text-align:center;border-radius:8px;font-size:13px;


  color:#9fa3bd;border:1px solid rgba(255,255,255,.05);text-decoration:none;transition:.2s}


.up-logout:hover{color:#ff5d7e;border-color:rgba(255,93,126,.4);background:rgba(255,61,142,.06)}


/* 移动端不显示悬浮面板（点按会员号仍进会员中心） */


@media (max-width:768px){.user-panel{display:none!important}}





/* 栏目歌名跑马灯：播放中溢出才滑动，未播放固定 */


.ex-name.mq-on,.t-name.mq-on{text-overflow:clip !important;overflow:hidden !important;}


.ex-name.mq-on .mq-inner,.t-name.mq-on .mq-inner{display:inline-block;white-space:nowrap;will-change:transform;animation:nameMarquee var(--mq-dur,9s) linear infinite;}


@keyframes nameMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}





/* 窄屏：隐藏歌曲列表行内的上传者/歌手列（黑色音频、DJ刚刚、Mix 等），歌名自动拉宽 */


@media (max-width: 767px){


	.song_list .p_hr_0{ display:none !important; }


	.song_list .col-xs-8{ width:83.3333%; }


}





/* 图标：去掉精灵图，改用字符图标 */


.tip_message .tip_ico_succ,.tip_message .tip_ico_fail,


.tip_message .tip_ico_warn,.tip_message .tip_ico_hits{


  background-image:none !important;


  font-size:34px; line-height:42px; text-align:center;


  font-style:normal;


}


.tip_message .tip_ico_succ::before{ content:"✓"; color:#2ecc71; }


.tip_message .tip_ico_fail::before{ content:"✕"; color:#ff3d8e; }


.tip_message .tip_ico_warn::before{ content:"!"; color:#ffb84d; font-weight:700; }


.tip_message .tip_ico_hits::before{ content:"i"; color:#00f0ff; font-style:italic; font-weight:700; }





/* ===== MIX57 提示框 · 渐变流光（方案B）+ 居中 ===== */


.tip_message{


  position:fixed !important;


  top:50% !important;


  left:50% !important;


  transform:translate(-50%,-50%) !important;


  z-index:65500 !important;


}


.tip_message .tip_message_content{


  background:linear-gradient(160deg,#1c1c2a,#13131e) !important;


  border:1px solid rgba(0,240,255,.35) !important;


  border-top:none !important;


  border-radius:14px !important;


  box-shadow:0 0 0 1px rgba(0,240,255,.08),0 12px 40px rgba(0,0,0,.6),0 0 30px rgba(0,240,255,.18) !important;


  overflow:hidden;


}


.tip_message .tip_message_content::before{


  content:""; display:block; height:3px;


  background:linear-gradient(90deg,#00f0ff,#ff3d8e);


}


.tip_message .tip_message_title{


  background:transparent !important;


  border-bottom:1px solid rgba(255,255,255,.07) !important;


  color:#fff !important;


}


.tip_message .tip_message_close{ color:#8b8fa3 !important; font-size:20px !important; }


.tip_message .tip_message_close:hover{ color:#00f0ff !important; }


.tip_message .tip_content{ color:#f0f0f8 !important; }


.tip_message .message_content{ color:#f0f0f8 !important; }


/* 图标：渐变圆底 + 字符 */


.tip_message .message_icon{ display:flex; align-items:center; justify-content:center; }


.tip_message .message_icon span{


  width:38px !important; height:38px !important; line-height:38px;


  border-radius:50%;


  background:linear-gradient(135deg,rgba(0,240,255,.25),rgba(255,61,142,.25)) !important;


  background-image:none !important;


  box-shadow:0 0 14px rgba(0,240,255,.25) inset;


  font-size:19px; text-align:center; font-weight:700; font-style:normal; color:#00f0ff;


}


.tip_message .tip_ico_succ::before{ content:"✓"; color:#2ecc71; }


.tip_message .tip_ico_fail::before{ content:"✕"; color:#ff3d8e; }


.tip_message .tip_ico_warn::before{ content:"!"; color:#ffb84d; }


.tip_message .tip_ico_hits::before{ content:"i"; color:#00f0ff; }





/* ===== MIX57 登录/注册弹窗 · 渐变流光（方案B） ===== */


.popup_wrap{ background:rgba(6,6,10,.72) !important; }


#login_popup .popup, #register_popup .popup{


  background:linear-gradient(160deg,#1c1c2a,#13131e) !important;


  border:1px solid rgba(0,240,255,.35) !important;


  border-radius:14px !important;


  box-shadow:0 0 0 1px rgba(0,240,255,.08),0 14px 44px rgba(0,0,0,.6),0 0 30px rgba(0,240,255,.15) !important;


  overflow:hidden;


  padding-top:0 !important;


}


#login_popup .popup::before, #register_popup .popup::before{


  content:""; display:block; height:3px;


  background:linear-gradient(90deg,#00f0ff,#ff3d8e);


  margin-bottom:20px;


}


#login_popup .popup h3, #register_popup .popup h3{


  color:#fff !important; font-size:15px !important;


}


#login_popup .popup h3 i, #register_popup .popup h3 i{ color:#00f0ff !important; }


#login_popup .popup .form-control, #register_popup .popup .form-control{


  background:rgba(10,10,16,.85) !important;


  border:1px solid rgba(0,240,255,.25) !important;


  color:#eef1ff !important;


  border-radius:8px !important;


  box-shadow:inset 0 0 10px rgba(0,0,0,.3) !important;


}


#login_popup .popup .form-control:focus, #register_popup .popup .form-control:focus{


  border-color:#00f0ff !important;


  box-shadow:0 0 10px rgba(0,240,255,.2) !important;


}


#login_popup .popup .ajax-login.btn_4, #register_popup .popup .ajax-login.btn_4{


  background:linear-gradient(135deg,#00f0ff,#ff3d8e) !important;


  border:none !important;


  border-radius:8px !important;


  color:#fff !important;


  font-weight:600 !important;


  box-shadow:0 6px 20px rgba(0,240,255,.3) !important;


  height:36px; line-height:36px; padding:0 24px !important;


}


#login_popup .popup .ajax-login.btn_4:hover, #register_popup .popup .ajax-login.btn_4:hover{


  opacity:.92;


  box-shadow:0 6px 26px rgba(0,240,255,.45) !important;


}


#login_popup .popup label, #register_popup .popup label{ color:#c5c9dd !important; }


#login_popup .popup a, #register_popup .popup a{ color:#00f0ff !important; }


#login_popup .popup a:hover, #register_popup .popup a:hover{ color:#ff3d8e !important; }


#login_popup .popup footer, #register_popup .popup footer{


  border-top:1px solid rgba(255,255,255,.07) !important;


  margin-top:18px !important; padding-top:14px !important;


}


#login_popup .popup footer h3, #register_popup .popup footer h3{ color:#8b8fa3 !important; font-size:12px !important; }


#login_popup .popup footer a, #register_popup .popup footer a{ color:#00f0ff !important; }


#login_popup .popup footer a:hover, #register_popup .popup footer a:hover{ color:#ff3d8e !important; }


#login_popup .popup .close, #register_popup .popup .close{ color:#8b8fa3 !important; }


#login_popup .popup .close:hover, #register_popup .popup .close:hover{ color:#ff3d8e !important; }





/* ===== MIX57 登录/注册页 · 渐变流光（配套方案B） ===== */


.login-box h2{ color:#fff !important; }


.login-box h2 i{ color:#00f0ff !important; }


.login-box hr{ border-color:rgba(255,255,255,.1) !important; }


.login-box > p{ color:#8b8fa3 !important; }


.login-box .form-control{


  background:rgba(10,10,16,.85) !important;


  border:1px solid rgba(0,240,255,.25) !important;


  color:#eef1ff !important;


  border-radius:8px !important;


  box-shadow:inset 0 0 10px rgba(0,0,0,.3) !important;


}


.login-box .form-control:focus{


  border-color:#00f0ff !important;


  box-shadow:0 0 10px rgba(0,240,255,.2) !important;


}


.login-box .control-label{ color:#c5c9dd !important; }


.login-box .scheme_color{ color:#ff3d8e !important; }


.login-box label{ color:#c5c9dd !important; }


.login-box a.color-blue{ color:#00f0ff !important; }


.login-box a.color-blue:hover{ color:#ff3d8e !important; }


.login-box .btn_8{


  background:linear-gradient(135deg,#00f0ff,#ff3d8e) !important;


  border:none !important;


  border-radius:8px !important;


  color:#fff !important;


  font-weight:600 !important;


  box-shadow:0 6px 20px rgba(0,240,255,.3) !important;


  padding:0 28px !important;


  height:38px; line-height:38px;


}


.login-box .btn_8:hover{


  opacity:.92;


  box-shadow:0 6px 26px rgba(0,240,255,.45) !important;


}


.login-box .sina-btn, .login-box .qq-btn{ opacity:.85; }


.login-box .sina-btn:hover, .login-box .qq-btn:hover{ opacity:1; }





/* ===== MIX57 注册页 · 验证码行（独立样式） ===== */


.verify-row{ display:flex; align-items:center; gap:6px; flex-wrap:nowrap; }


.verify-row .math-verify{


  flex:none; display:flex; align-items:center; justify-content:center;


  height:36px; line-height:1; padding:0 14px; box-sizing:border-box;


  background:rgba(10,10,16,.85); border:1px solid rgba(0,240,255,.25);


  border-radius:8px; color:#00f0ff; font-size:15px; font-weight:600;


  letter-spacing:1px; cursor:pointer;


}


.verify-row .verify-input{


  flex:1 1 auto; min-width:60px; height:36px; box-sizing:border-box;


  margin:0 !important;


}


.verify-row .verify-refresh{


  flex:none; color:#8b8fa3; font-size:12px; cursor:pointer; white-space:nowrap;


}


.verify-row .verify-refresh:hover{ color:#00f0ff; }


.reg-btn{


  width:220px; height:42px; line-height:42px; padding:0 !important;


  display:block; margin:0 auto;


  background:linear-gradient(90deg,#00f0ff,#7b5bff,#ff3d8e) !important;


  color:#fff !important; border:none; border-radius:10px !important;


  font-size:15px; font-weight:700; letter-spacing:2px; cursor:pointer;


  box-shadow:0 6px 20px rgba(123,91,255,.35);


}


.reg-btn:hover{


  background:linear-gradient(90deg,#00f0ff,#7b5bff,#ff3d8e) !important;


  filter:brightness(1.15); color:#fff !important;


}





/* ===== MIX57 登录弹窗 · 记住我复选框（自定义小框） ===== */


.rem-row{ display:flex; align-items:center; justify-content:space-between; }


.rem-label{ display:flex; align-items:center; gap:8px; cursor:pointer; user-select:none; }


.rem-check{ position:absolute; opacity:0; width:0; height:0; }


.rem-box{


  width:16px; height:16px; flex:none; box-sizing:border-box;


  border:1px solid rgba(0,240,255,.45); border-radius:4px;


  background:rgba(10,10,16,.6); position:relative;


  transition:border-color .2s, background .2s;


}


.rem-check:checked + .rem-box{


  background:linear-gradient(135deg,#00f0ff,#7b5bff);


  border-color:transparent;


}


.rem-check:checked + .rem-box::after{


  content:""; position:absolute; left:4px; top:1px;


  width:5px; height:9px; border:solid #fff;


  border-width:0 2px 2px 0; transform:rotate(45deg);


}


.rem-text{ color:#c5c9dd; font-size:13px; }


.rem-text:hover{ color:#00f0ff; }





/* ===== 登录弹窗 · 登录按钮居中（删第三方登录后） ===== */


#login_popup .ajax-login{


  display:block !important; margin:0 auto !important; float:none !important;


  width:200px !important;


}
/* ===== 统一弹窗按钮（artDialog 深色霓虹）===== */
.d-buttons{ background:transparent; border-top:1px solid rgba(255,255,255,.07); padding:10px 12px; text-align:center; }
.d-button{
  display:inline-block; margin:0 6px; padding:8px 22px; min-width:96px;
  border-radius:8px; border:1px solid rgba(0,240,255,.4);
  background:rgba(0,240,255,.08); color:#eaf6ff; font-size:14px; font-family:'Microsoft Yahei',sans-serif;
  cursor:pointer; line-height:1.2; transition:all .2s; outline:none;
}
.d-button:hover{ background:rgba(0,240,255,.2); box-shadow:0 0 14px rgba(0,240,255,.28); color:#fff; }
.d-button.d-state-highlight{
  background:linear-gradient(90deg,#00c2d6,#00f0ff); color:#00121a; font-weight:700;
  border-color:transparent; box-shadow:0 0 14px rgba(0,240,255,.35);
}
.d-button.d-state-highlight:hover{ filter:brightness(1.1); }

/* 下载确认弹窗内容：多行+居中 */
.d-content{ white-space:normal; word-break:break-word; text-align:center !important; max-width:560px; line-height:1.6; }

/* 下载确认弹窗图标（与提示窗同款霓虹） */
.dl-confirm-ico{ display:flex; justify-content:center; margin-bottom:12px; }
.dl-confirm-ico .ico{ width:46px; height:46px; border-radius:50%; border:2px solid rgba(0,240,255,.55); background:rgba(0,240,255,.08); display:flex; align-items:center; justify-content:center; font-size:26px; font-weight:700; color:#00f0ff; box-shadow:0 0 16px rgba(0,240,255,.3); }

/* ===== 下载确认弹窗背景 · 复刻提示窗样式 ===== */
.d-outer{ border:1px solid rgba(0,240,255,.35) !important; }
.d-inner{ background:linear-gradient(160deg,rgba(28,28,42,.92),rgba(19,19,30,.96)) !important; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.d-inner::before{ content:""; display:block; height:3px; background:linear-gradient(90deg,#00f0ff,#ff3d8e); }
.d-title{ border-bottom:1px solid rgba(255,255,255,.07) !important; }
.d-state-focus .d-dialog{ box-shadow:0 0 0 1px rgba(0,240,255,.08),0 12px 40px rgba(0,0,0,.6),0 0 30px rgba(0,240,255,.18) !important; }

/* 下载确认弹窗：精确居中 + 宽度自适应（不铺满也不过窄） */
.d-outer{ position:fixed !important; top:50% !important; left:50% !important; transform:translate(-50%,-50%) !important; z-index:1990 !important; width:auto !important; min-width:300px !important; max-width:92vw !important; }

.up-balance{ display:flex; gap:10px; flex-wrap:nowrap; align-items:center; margin:6px 0 14px; }
.pill{ display:inline-flex; align-items:center; gap:5px; font-size:12px; padding:3px 10px; border-radius:20px; font-weight:600; white-space:nowrap; color:#ffffff !important; line-height:1.4; }
.pill b{ font-weight:800; font-size:13px; }
.pill-coin{ color:#fff; background:rgba(245,197,66,.13); border:1px solid rgba(245,197,66,.35); }
.pill-coin b{ color:#ffd970; }
.pill-quota{ color:#fff; background:rgba(123,91,255,.15); border:1px solid rgba(139,109,255,.4); }
.pill-quota b{ color:#c3b3ff; }


/* ===== 商城 ===== */
.shop-wrap{margin:16px 0;padding:18px;background:linear-gradient(180deg,#1e1e30,#1a1a28);border:1px solid rgba(0,240,255,.08);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.3)}
.shop-banner{border-radius:16px;padding:50px 20px;text-align:center;background:linear-gradient(135deg,#1a0f3a,#2d1b5e,#4a1a6e);margin-bottom:24px}
.shop-banner h1{font-size:28px;font-weight:800;background:linear-gradient(90deg,#00f0ff,#7b5bff,#ff3d81);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:8px}
.shop-banner p{color:#9aa0b8;font-size:14px}
.shop-cats{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:12px 16px;align-items:center}
.shop-cats .cat{padding:6px 16px;border-radius:99px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:#9aa0b8;font-size:13px;text-decoration:none;transition:all .2s}
.shop-cats .cat:hover{border-color:rgba(0,240,255,.3);color:#00f0ff}
.shop-cats .cat.on{background:linear-gradient(90deg,#00f0ff,#7b5bff);color:#0a0a12;font-weight:600;border-color:transparent}
.shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.shop-card{background:linear-gradient(180deg,#252540,#1e1e30);border:1px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}
.shop-card:hover{border-color:rgba(0,240,255,.4);transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,240,255,.12),0 0 0 1px rgba(0,240,255,.15)}
.shop-card-img{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#2a2a45;font-size:48px;overflow:hidden;position:relative}
.shop-card-img::after{content:'';position:absolute;bottom:0;left:0;right:0;height:60px;background:linear-gradient(transparent,rgba(30,30,48,.6));pointer-events:none}
.shop-card-img img{width:100%;height:100%;object-fit:contain;transition:transform .3s}
.shop-card:hover .shop-card-img img{transform:scale(1.05)}
.shop-card-body{padding:10px 12px 12px}
.shop-card-name{font-size:13px;font-weight:600;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.shop-card-price{font-size:16px;font-weight:800;color:#ff3d81;display:flex;align-items:baseline;gap:6px}
.shop-card-price del{font-size:12px;color:#888;font-weight:400}
.shop-card-sales{font-size:11px;color:#999;margin-top:8px;display:flex;justify-content:space-between;align-items:center}
.shop-card-sales::after{content:'立即购买 →';font-size:11px;color:rgba(0,240,255,0);transition:color .3s}
.shop-card:hover .shop-card-sales::after{color:#00f0ff}
.shop-nav-bar{display:flex;justify-content:center;gap:8px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.06);flex-wrap:wrap}
.shop-nav-bar .nav-item{padding:8px 18px;border-radius:99px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);color:#9aa0b8;font-size:13px;text-decoration:none;transition:all .2s}
.shop-nav-bar .nav-item:hover{border-color:#00f0ff;color:#00f0ff}
.shop-title{font-size:22px;font-weight:700;margin-bottom:24px;color:#fff}

/* 详情页 */
.shop-detail-main{display:flex;gap:24px;background:#1e1e30;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:24px}
.shop-detail-img{flex:1 1 0;border-radius:12px;overflow:hidden;background:#2a2a45;display:flex;align-items:center;justify-content:center;min-height:280px;aspect-ratio:1/1}
.shop-detail-img img{width:100%;height:100%;object-fit:contain}
.shop-placeholder{font-size:80px;opacity:.5}
.shop-detail-info{flex:1 1 0}
.shop-detail-info h1{font-size:22px;margin-bottom:12px;color:#fff}
.shop-detail-info .price{font-size:28px;font-weight:800;color:#ff3d81;margin-bottom:8px}
.shop-detail-info .price del{font-size:14px;color:#888;margin-left:8px}
.shop-detail-info .meta{color:#aaa;font-size:13px;margin-bottom:16px}
.shop-detail-info .intro{color:#ccc;font-size:14px;line-height:1.6;margin-bottom:20px}
.buy-form .form-row{margin-bottom:16px}
.buy-form label{display:block;font-size:12px;color:#bbb;margin-bottom:4px}
.buy-form input{width:100%;padding:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#fff;font-size:14px;box-sizing:border-box}
.buy-form input:focus{border-color:#00f0ff;outline:none}
.buy-form .qty-input{width:80px}
.buy-form .btn-buy{display:block;width:100%;padding:13px;background:linear-gradient(90deg,#4a90d9,#5b7fd4);color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;margin-top:16px;transition:opacity .2s}
.buy-form .btn-buy:hover{opacity:.9}

/* 支付页 */
.pay-page{max-width:500px;margin:0 auto;padding:30px 0}
.pay-page h1{font-size:22px;margin-bottom:20px;color:#fff;text-align:center}
.pay-card{background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px;margin-bottom:20px}
.pay-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px;color:#ccc;border-bottom:1px solid rgba(255,255,255,.05)}
.pay-row:last-child{border-bottom:none}
.pay-row.total{font-size:18px;font-weight:700}
.pay-row .amount{color:#ff3d81;font-weight:800}
.pay-qrcode{background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:40px 20px;text-align:center;margin-bottom:20px}
.qrcode-icon{font-size:64px;display:block;margin-bottom:12px}
.pay-qrcode p{color:#aaa;font-size:14px;margin-bottom:6px}
.pay-tip{color:#666;font-size:12px !important}
.pay-actions{display:flex;gap:10px;justify-content:center;align-items:center}
.btn-outline{display:inline-block;padding:10px 28px;border:1px solid rgba(255,255,255,.15);color:#aaa;border-radius:8px;text-decoration:none;font-size:14px;transition:all .2s;background:rgba(255,255,255,.05)}
.btn-outline:hover{background:rgba(255,255,255,.1);color:#ccc}

/* 订单列表 */
.order-list{max-width:800px;margin:0 auto}
.order-card{background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:16px;margin-bottom:16px;transition:border-color .2s}
.order-card:hover{border-color:rgba(0,240,255,.2)}
.order-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.05)}
.order-no{font-size:12px;color:#888}
.status{font-size:12px;padding:3px 10px;border-radius:99px;font-weight:600}
.status-pending{background:rgba(255,201,77,.15);color:#ffc94d}
.status-paid{background:rgba(46,204,113,.15);color:#2ecc71}
.status-shipped{background:rgba(0,240,255,.15);color:#00f0ff}
.status-done{background:rgba(123,91,255,.15);color:#7b5bff}
.status-cancel{background:rgba(255,255,255,.08);color:#888}
.order-body{display:flex;justify-content:space-between;align-items:center}
.order-product{font-size:14px;color:#eee}
.order-meta{display:flex;gap:16px;align-items:center}
.order-meta .amount{font-size:16px;font-weight:700;color:#ff3d81}
.order-meta .time{font-size:12px;color:#666}
.order-express{margin-top:8px;padding:8px 12px;background:rgba(0,192,255,.08);border-radius:6px;font-size:12px;color:#aaa;display:flex;gap:16px}
.order-express .express-link{color:#00c0ff;text-decoration:none;cursor:pointer}
.order-express .express-link:hover{text-decoration:underline}
.order-express .express-tip{font-size:11px;color:#00c0ff;opacity:.8;margin-left:4px}
.order-express .copy-btn{font-size:11px;color:#666;background:rgba(255,255,255,.08);padding:2px 8px;border-radius:4px;cursor:pointer;margin-left:8px}
.order-express .copy-btn:hover{color:#00c0ff;background:rgba(0,192,255,.15)}
.empty-state{text-align:center;padding:60px 20px;color:#666}
.empty-state span{font-size:48px;display:block;margin-bottom:12px}
.empty-state p{margin-bottom:16px}

@media(max-width:768px){
  .shop-grid{grid-template-columns:repeat(2,1fr)}
  .shop-detail-main{flex-direction:column}
  .order-body{flex-direction:column;gap:8px;align-items:flex-start}
}

/* 购物车 */
.cart-list{max-width:700px;margin:0 auto}
.cart-item{display:flex;align-items:center;gap:14px;background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:14px;margin-bottom:10px}
.cart-img{width:64px;height:64px;border-radius:8px;overflow:hidden;background:#1a1a26;display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0}
.cart-img img{width:100%;height:100%;object-fit:contain}
.cart-info{flex:1}
.cart-name{font-size:14px;color:#eee;margin-bottom:4px}
.cart-price{font-size:14px;font-weight:700;color:#ff3d81}
.cart-del{font-size:12px;color:#888;text-decoration:none;padding:4px 10px;border:1px solid rgba(255,255,255,.1);border-radius:6px;transition:all .2s}
.cart-del:hover{color:#ff3d81;border-color:rgba(255,61,129,.3)}
.cart-footer{max-width:700px;margin:20px auto;display:flex;justify-content:flex-end;align-items:center;gap:16px;padding:16px;background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:12px}
.cart-total{font-size:14px;color:#ccc}
.cart-total span{font-size:20px;font-weight:800;color:#ff3d81;margin-left:4px}
.btn-buy-link{display:inline-block;padding:10px 28px;background:linear-gradient(90deg,#00f0ff,#7b5bff);color:#0a0a12;border-radius:8px;text-decoration:none;font-weight:700;font-size:14px}

/* 支付成功页 */
.pay-success{max-width:500px;margin:40px auto;text-align:center;padding:40px 20px;background:#14141d;border:1px solid rgba(255,255,255,.06);border-radius:16px}
.success-icon{font-size:64px;margin-bottom:16px}
.pay-success h1{font-size:24px;color:#2ecc71;margin-bottom:12px}
.pay-success p{color:#aaa;font-size:14px;margin-bottom:6px}
.pay-success .amount{font-size:28px;font-weight:800;color:#ff3d81;margin:12px 0}
.pay-success .tip{color:#666;font-size:13px;margin-bottom:24px}
.pay-success .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* 商城导航购物车图标 */
.shop-cart-link{position:relative;display:inline-flex;align-items:center;gap:6px;color:#9aa0b8;text-decoration:none;font-size:13px;padding:8px 18px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);transition:all .2s}
.shop-cart-link:hover{color:#00f0ff;background:rgba(0,240,255,.1);border-color:rgba(0,240,255,.3)}
.cart-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;background:linear-gradient(90deg,#ff3d81,#ff6b6b);color:#fff;border-radius:99px;font-size:11px;font-weight:700;margin-left:2px}
.shop-pager{margin-top:20px;display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap}
.shop-pager .pagination,.shop-pager .page_list,.shop-pager ul{display:inline-flex;gap:6px;list-style:none;padding:0;margin:0;align-items:center}
.shop-pager li{list-style:none}
.shop-pager a,.shop-pager span{display:inline-block;padding:5px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#eee;font-size:12px;text-decoration:none;transition:all .2s}
.shop-pager a:hover{border-color:#00f0ff;color:#00f0ff}
.shop-pager .current,.shop-pager .active span{background:rgba(0,240,255,.15);color:#fff;border-color:rgba(0,240,255,.4);font-weight:600}
.shop-pager .disabled,.shop-pager .next.disabled{opacity:.3;pointer-events:none}
