/* =============================================
   苏白子比小工具扩展 - 完整样式
   ============================================= */

/* ===== 公共样式 ===== */
.subai-widget-container {
    font-family: 'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ===== 统一"查看更多"按钮 ===== */
.subai-btn-more {
    display: inline-block;
    padding: 8px 28px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #5b8def, #4a7ad4);
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(91, 141, 239, 0.35);
    letter-spacing: 0.5px;
}
.subai-btn-more:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(91, 141, 239, 0.50);
    background: linear-gradient(135deg, #4a7ad4, #3a6ac4);
}
.subai-btn-more:active {
    transform: translateY(0);
}
.subai-btn-more i {
    margin-left: 4px;
}

/* =============================================
   游戏体验模块样式
   ============================================= */

/* ===== 主容器 ===== */
.subai-game-experience {
    width: 100%;
    background: #fff;
    border-radius: 16px;
    padding: 24px 28px 24px 28px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    height: 651px;
    margin-bottom: 20px;
}

/* ===== 标题行 ===== */
.subai-exp-title {
    font-size: 24px;
    font-weight: 700;
    color: #222;
    padding-bottom: 16px;
    padding-right: 120px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    position: relative;
}
.subai-exp-title .title-text {
    font-size: 24px;
    font-weight: 700;
    color: #222;
}

/* ===== TAB行 ===== */
.subai-exp-tab-row {
    display: flex;
    gap: 16px;
    padding: 0 0 16px 0;
    flex-shrink: 0;
    align-items: stretch;
}

/* ===== 左侧 TAB 容器 ===== */
.subai-exp-tab-left {
    flex: 1;
    min-width: 0;
    background: #f8faff;
    border-radius: 12px;
    padding: 6px 8px;
    border: 1px solid #eef3fc;
    display: flex;
    align-items: center;
}
.subai-exp-tab-left .tab-bar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    gap: 0;
}
.subai-exp-tab-left .tab-item {
    flex: 1;
    text-align: center;
    padding: 5px 4px;
    font-size: 13px;
    color: #666;
    background: #fff;
    border-radius: 16px;
    cursor: pointer;
    transition: all 0.25s ease;
    font-weight: 500;
    white-space: nowrap;
    line-height: 1.4;
    border: 1px solid transparent;
    margin: 0 2px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.subai-exp-tab-left .tab-item:hover {
    background: #e8edf5;
    color: #333;
    border-color: #dce3ed;
}
.subai-exp-tab-left .tab-item.active {
    background: #5b8def;
    color: #fff;
    box-shadow: 0 4px 12px rgba(91, 141, 239, 0.30);
    border-color: #5b8def;
}

/* ===== 右侧 TAB 容器 ===== */
.subai-exp-tab-right {
    width: 320px;
    flex-shrink: 0;
    background: #f8faff;
    border-radius: 12px;
    padding: 6px 16px;
    border: 1px solid #eef3fc;
    display: flex;
    align-items: center;
    justify-content: center;
}
.subai-exp-tab-right .hot-tabs {
    display: flex;
    gap: 0;
    align-items: center;
}
.subai-exp-tab-right .hot-tab {
    padding: 5px 18px;
    font-size: 13px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.25s ease;
    user-select: none;
    white-space: nowrap;
    line-height: 1.4;
    margin-bottom: -2px;
    border-radius: 0;
}
.subai-exp-tab-right .hot-tab:hover {
    color: #333;
}
.subai-exp-tab-right .hot-tab.active {
    color: #5b8def;
    border-bottom-color: #5b8def;
}

/* ===== 内容行 ===== */
.subai-exp-content {
    display: flex;
    gap: 16px;
    flex: 1;
    padding-top: 16px;
}

/* 左侧内容卡片 */
.subai-exp-left {
    flex: 1;
    min-width: 0;
    background: #fafcff;
    border-radius: 12px;
    padding: 12px 18px 8px 18px;
    border: 1px solid #eef3fc;
    display: flex;
    flex-direction: column;
}

/* ===== 游戏卡片网格 ===== */
.subai-exp-game-grid {
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 0 18px;
    flex: 1;
    min-height: 0;
}
.subai-exp-game-grid.active {
    display: grid;
}
.subai-exp-game-item {
    display: flex;
    align-items: center;
    padding: 8px 4px;
    border-bottom: 1px solid #edf2f9;
    min-width: 0;
    height: 82px;
    flex-shrink: 0;
    transition: all 0.25s ease;
    border-radius: 8px;
    cursor: default;
}
.subai-exp-game-grid.active .subai-exp-game-item:nth-last-child(1),
.subai-exp-game-grid.active .subai-exp-game-item:nth-last-child(2) {
    border-bottom: none;
}
.subai-exp-game-item:hover {
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(91, 141, 239, 0.10);
    transform: translateY(-2px);
    padding-left: 6px;
    padding-right: 6px;
    border-bottom-color: transparent;
}
.subai-exp-game-item:hover + .subai-exp-game-item {
    border-top-color: transparent;
}

.subai-exp-game-icon {
    width: 65px;
    height: 65px;
    border-radius: 12px;
    overflow: hidden;
    flex-shrink: 0;
    border: 1px solid #e8edf5;
    background: #f5f8fe;
    transition: transform 0.5s ease;
}
.subai-exp-game-item:hover .subai-exp-game-icon {
    transform: rotate(360deg);
}
.subai-exp-game-icon img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.subai-exp-game-info {
    flex: 1;
    padding-left: 14px;
    min-width: 0;
}
.subai-exp-game-info .title {
    font-size: 14px;
    font-weight: 600;
    color: #222;
    line-height: 1.4;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.subai-exp-game-info .title a {
    color: inherit;
    text-decoration: none;
}
.subai-exp-game-info .title a:hover {
    color: #5b8def;
}
.subai-exp-game-meta {
    font-size: 11px;
    color: #8892a6;
    display: flex;
    align-items: center;
    gap: 12px;
    line-height: 1;
}
.subai-exp-game-meta > span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.subai-exp-game-meta i {
    font-size: 10px;
    color: #c0c6d0;
    line-height: 1;
}
.subai-exp-game-meta .meta-value {
    line-height: 1;
}
.subai-exp-stars {
    display: inline-block;
    width: 60px;
    height: 12px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAAAOCAYAAAB3gBwzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAAArklEQVR4Xu3PQQ6AIBBE0d6fa3sXoyQgMuiP+BF3TcKkA/4n7WMcYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjnGOs9QHhG2WcAAAAAElFTkSuQmCC') repeat-x;
    background-size: 12px 12px;
    position: relative;
    top: 2px;
}
.subai-exp-stars .fill {
    display: block;
    height: 100%;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAAAOCAYAAAB3gBwzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAAAtElEQVR4Xu3PQQ6AIBBE0d6fa3sXoyQgMuiP+BF3TcKkA/4n7WMcYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjnGOtR4Wj2WcAAAAAElFTkSuQmCC') repeat-x;
    background-size: 12px 12px;
}
.subai-exp-game-action {
    margin-left: auto;
    flex-shrink: 0;
}
.subai-exp-game-action .btn {
    display: inline-block;
    padding: 4px 16px;
    font-size: 12px;
    color: #fff;
    background: #5b8def;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.25s ease;
    font-weight: 500;
}
.subai-exp-game-action .btn:hover {
    background: #4a7ad4;
    box-shadow: 0 4px 12px rgba(91, 141, 239, 0.35);
    transform: translateY(-1px);
}

/* ===== 右侧内容卡片 ===== */
.subai-exp-right {
    width: 320px;
    flex-shrink: 0;
    background: #fafcff;
    border-radius: 12px;
    padding: 12px 16px 8px 16px;
    border: 1px solid #eef3fc;
    display: flex;
    flex-direction: column;
}

.subai-exp-hot-panels {
    flex: 1;
    padding-top: 2px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.subai-exp-hot-panel {
    display: none;
    animation: subaiExpFadeIn 0.3s ease;
    overflow: hidden;
}
.subai-exp-hot-panel.active {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    overflow: hidden;
    flex: 1;
}
@keyframes subaiExpFadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.subai-exp-hot-item {
    display: flex;
    align-items: center;
    padding: 5px 4px;
    border-bottom: 1px solid #edf2f9;
    transition: all 0.25s ease;
    border-radius: 8px;
    cursor: default;
    flex: 1;
    min-height: 0;
}
.subai-exp-hot-item:last-child {
    border-bottom: none;
}
.subai-exp-hot-item:hover {
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(91, 141, 239, 0.10);
    transform: translateY(-2px);
    padding-left: 6px;
    padding-right: 6px;
    border-bottom-color: transparent;
}
.subai-exp-hot-item:hover + .subai-exp-hot-item {
    border-top-color: transparent;
}

.subai-exp-hot-rank {
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #999;
    flex-shrink: 0;
    border-radius: 6px;
    background: #f0f4fd;
    transition: all 0.25s ease;
}
.subai-exp-hot-item:nth-child(1) .subai-exp-hot-rank {
    background: #fd6d3f;
    color: #fff;
}
.subai-exp-hot-item:nth-child(2) .subai-exp-hot-rank {
    background: #f9b801;
    color: #fff;
}
.subai-exp-hot-item:nth-child(3) .subai-exp-hot-rank {
    background: #88d87a;
    color: #fff;
}
.subai-exp-hot-item:nth-child(4) .subai-exp-hot-rank {
    background: #5fafff;
    color: #fff;
}
.subai-exp-hot-item:nth-child(5) .subai-exp-hot-rank {
    background: #cac9c9;
    color: #fff;
}

.subai-exp-hot-info {
    flex: 1;
    padding-left: 8px;
    min-width: 0;
}
.subai-exp-hot-info .hot-name {
    font-size: 13px;
    font-weight: 500;
    color: #222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.subai-exp-hot-info .hot-name a {
    color: inherit;
    text-decoration: none;
}
.subai-exp-hot-info .hot-name a:hover {
    color: #5b8def;
}
.subai-exp-hot-info .hot-tag {
    font-size: 11px;
    color: #999;
    display: flex;
    align-items: center;
    gap: 4px;
}
.subai-exp-hot-info .subai-exp-game-meta {
    font-size: 11px;
    color: #8892a6;
    display: flex;
    align-items: center;
    gap: 12px;
    line-height: 1;
}
.subai-exp-hot-info .subai-exp-game-meta > span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.subai-exp-hot-info .subai-exp-game-meta i {
    font-size: 10px;
    color: #c0c6d0;
    line-height: 1;
}
.subai-exp-hot-info .subai-exp-game-meta .meta-value {
    line-height: 1;
}
.subai-exp-hot-info .hot-tag .stars-sm {
    display: inline-block;
    width: 48px;
    height: 10px;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAAAOCAYAAAB3gBwzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAAArklEQVR4Xu3PQQ6AIBBE0d6fa3sXoyQgMuiP+BF3TcKkA/4n7WMcYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjnGOs9QHhG2WcAAAAAElFTkSuQmCC') repeat-x;
    background-size: 10px 10px;
    position: relative;
    top: 1px;
}
.subai-exp-hot-info .hot-tag .stars-sm .fill {
    display: block;
    height: 100%;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAAAOCAYAAAB3gBwzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAAAtElEQVR4Xu3PQQ6AIBBE0d6fa3sXoyQgMuiP+BF3TcKkA/4n7WMcYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGOccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjHGMccYxxjnGOtR4Wj2WcAAAAAElFTkSuQmCC') repeat-x;
    background-size: 10px 10px;
}
.subai-exp-hot-action {
    flex-shrink: 0;
    margin-left: 6px;
}
.subai-exp-hot-action .btn-sm {
    display: inline-block;
    padding: 3px 14px;
    font-size: 11px;
    color: #fff;
    background: #5b8def;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.25s ease;
    font-weight: 500;
}
.subai-exp-hot-action .btn-sm:hover {
    background: #4a7ad4;
    box-shadow: 0 2px 8px rgba(91, 141, 239, 0.30);
}

/* =============================================
   游戏专题模块样式
   ============================================= */

/* ===== 游戏专题主容器 ===== */
.subai-special-module {
    background: #fff;
    border-radius: 16px;
    padding: 22px 26px 26px 26px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    margin-bottom: 20px;
}

/* ===== 标题栏 ===== */
.subai-special-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 14px;
    padding-right: 120px;
    position: relative;
}
.subai-special-title h2 {
    font-size: 22px;
    font-weight: 700;
    color: #222;
    margin: 0;
}

/* ===== 专题网格 ===== */
.subai-special-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 18px !important;
    padding-top: 16px !important;
    width: 100% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ===== 专题卡片 ===== */
.subai-special-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #eef3fc;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 
        0 2px 8px rgba(0, 0, 0, 0.04),
        0 1px 3px rgba(0, 0, 0, 0.02);
    position: relative;
    transform: translateY(0);
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}
.subai-special-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(91, 141, 239, 0.25), transparent);
    opacity: 0;
    transition: all 0.4s ease;
    z-index: 2;
    border-radius: 0 0 50% 50%;
}
.subai-special-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, rgba(91, 141, 239, 0.08), transparent);
    opacity: 0;
    transition: all 0.4s ease;
    z-index: 2;
}
.subai-special-card:hover {
    transform: translateY(-8px);
    border-color: rgba(91, 141, 239, 0.15);
    box-shadow: 
        0 16px 48px rgba(91, 141, 239, 0.12),
        0 6px 20px rgba(0, 0, 0, 0.06),
        0 2px 8px rgba(0, 0, 0, 0.04);
}
.subai-special-card:hover::before {
    opacity: 1;
    left: 5%;
    right: 5%;
    background: linear-gradient(90deg, transparent, rgba(91, 141, 239, 0.5), transparent);
}
.subai-special-card:hover::after {
    opacity: 1;
}

.subai-special-card .cover {
    width: 100% !important;
    aspect-ratio: 16/9 !important;
    overflow: hidden !important;
    background: #f0f4fd !important;
    display: block !important;
    text-decoration: none !important;
    position: relative !important;
    flex-shrink: 0 !important;
}
.subai-special-card .cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.subai-special-card:hover .cover img {
    transform: scale(1.06);
}

.subai-special-card .info {
    padding: 14px 16px 16px 16px;
    background: #fff;
    position: relative;
}
.subai-special-card .info h3 {
    font-size: 16px;
    font-weight: 700;
    color: #222;
    margin-bottom: 4px;
    margin-top: 0;
    transition: color 0.3s ease;
}
.subai-special-card:hover .info h3 {
    color: #5b8def;
}
.subai-special-card .info .desc {
    font-size: 13px;
    color: #888;
    line-height: 1.5;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 40px;
}
.subai-special-card .info .bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.subai-special-card .info .bottom .num {
    font-size: 13px;
    color: #999;
}
.subai-special-card .info .bottom .num b {
    color: #5b8def;
    font-size: 16px;
}
.subai-special-card .info .bottom .btn-view {
    display: inline-block;
    padding: 4px 20px;
    font-size: 13px;
    font-weight: 500;
    color: #fff;
    background: #5b8def;
    border-radius: 20px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(91, 141, 239, 0.15);
}
.subai-special-card .info .bottom .btn-view:hover {
    background: #4a7ad4;
    box-shadow: 0 4px 16px rgba(91, 141, 239, 0.30);
    transform: translateY(-2px);
}

/* =============================================
   必玩大作模块样式
   ============================================= */

/* ===== 必玩大作主容器 ===== */
.subai-must-module {
    background: #fff;
    border-radius: 16px;
    padding: 22px 26px 60px 26px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    margin-bottom: 20px;
    position: relative;
}

/* ===== 标题栏 ===== */
.subai-must-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 14px;
    position: relative;
}
.subai-must-title h2 {
    font-size: 22px;
    font-weight: 700;
    color: #222;
    margin: 0;
}

/* ===== 轮播容器 ===== */
.subai-must-carousel-wrap {
    position: relative;
    height: auto;
    padding-top: 16px;
}

.subai-must-carousel {
    position: relative;
    overflow: visible;
    padding: 16px 12px 30px 12px;
}

.subai-must-track {
    display: grid;
    grid-template-columns: 1fr;
}

.subai-must-page {
    grid-column: 1 / -1;
    grid-row: 1 / -1;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.45s ease;
}

.subai-must-page.active {
    opacity: 1;
    pointer-events: auto;
}

.subai-must-card {
    background: #fff !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 1px solid #eef3fc !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    text-decoration: none !important;
    display: block !important;
    box-shadow: 
        0 2px 8px rgba(0, 0, 0, 0.04),
        0 1px 3px rgba(0, 0, 0, 0.02) !important;
    position: relative !important;
    transform: translateY(0) !important;
    color: inherit !important;
}

.subai-must-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 15%;
    right: 15%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(91, 141, 239, 0.2), transparent);
    opacity: 0;
    transition: all 0.4s ease;
    z-index: 2;
    border-radius: 0 0 50% 50%;
}

.subai-must-card:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(91, 141, 239, 0.12) !important;
    box-shadow: 
        0 14px 40px rgba(91, 141, 239, 0.12),
        0 6px 18px rgba(0, 0, 0, 0.05),
        0 2px 8px rgba(0, 0, 0, 0.03) !important;
}

.subai-must-card:hover::before {
    opacity: 1;
    left: 8%;
    right: 8%;
    background: linear-gradient(90deg, transparent, rgba(91, 141, 239, 0.4), transparent);
}

.subai-must-card .cover {
    width: 100% !important;
    height: 110px !important;
    overflow: hidden !important;
    background: #f0f4fd !important;
    flex-shrink: 0 !important;
    position: relative !important;
    display: block !important;
}

.subai-must-card .cover img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.subai-must-card:hover .cover img {
    transform: scale(1.06) !important;
}

.subai-must-card .info {
    padding: 10px 12px 12px 12px !important;
    background: #fff !important;
    position: relative !important;
}

.subai-must-card .info h3 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #222 !important;
    line-height: 1.4 !important;
    margin-bottom: 4px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 36px !important;
    transition: color 0.3s ease !important;
    margin-top: 0 !important;
}

.subai-must-card:hover .info h3 {
    color: #5b8def !important;
}

.subai-must-card .info .meta {
    display: flex !important;
    justify-content: space-between !important;
    font-size: 12px !important;
    color: #999 !important;
}

.subai-must-card .info .meta span {
    color: #888 !important;
}

.subai-must-card .info .meta i {
    margin-right: 3px !important;
}

.dark-theme .subai-must-card,
body.night .subai-must-card {
    background: #323335 !important;
    border-color: #565656 !important;
}

.dark-theme .subai-must-card .info h3,
body.night .subai-must-card .info h3 {
    color: #c0c4cc !important;
}

.dark-theme .subai-must-card:hover .info h3,
body.night .subai-must-card:hover .info h3 {
    color: #5b8def !important;
}

.dark-theme .subai-must-card .info,
body.night .subai-must-card .info {
    background: #323335 !important;
}

.dark-theme .subai-must-card .cover,
body.night .subai-must-card .cover {
    background: #444 !important;
}

/* ===== 翻页箭头 ===== */
.subai-must-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    opacity: 0;
    transition: all 0.2s ease;
    font-size: 16px;
    color: #666;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.subai-must-carousel-wrap:hover .subai-must-arrow {
    opacity: 1;
}

.subai-must-arrow:hover {
    background: #5b8def;
    color: #fff;
    border-color: #5b8def;
}

.subai-must-prev {
    left: 0;
}

.subai-must-next {
    right: 0;
}

/* ===== 指示器 ===== */
.subai-must-dots {
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
}

.subai-must-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.2s ease;
}

.subai-must-dot.active {
    background: #5b8def;
    width: 20px;
    border-radius: 4px;
}

/* =============================================
   今日更新模块样式
   ============================================= */

.subai-today-wrapper {
    display: flex;
    gap: 20px;
    align-items: stretch;
}

/* ===== 今日更新主容器 ===== */
.subai-today-module {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: 16px;
    padding: 22px 26px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    height: 600px;
    margin-bottom: 20px;
}

/* ===== 标题栏 ===== */
.subai-today-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    margin-bottom: 24px;
}
.subai-today-title .left {
    display: flex;
    align-items: center;
    gap: 16px;
}

.subai-news-tabs {
    display: flex;
    gap: 6px;
    background: #f5f7fa;
    border-radius: 24px;
    padding: 3px;
}
.subai-news-tabs .tab-btn {
    padding: 5px 20px;
    font-size: 14px;
    font-weight: 600;
    color: #666;
    border: none;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    background: transparent;
    font-family: inherit;
}
.subai-news-tabs .tab-btn:hover {
    color: #333;
}
.subai-news-tabs .tab-btn.active {
    background: #5b8def;
    color: #fff;
    box-shadow: 0 4px 12px rgba(91, 141, 239, 0.30);
}

.subai-update-stats {
    display: inline-block;
    padding: 5px 18px;
    font-size: 14px;
    font-weight: 600;
    color: #888;
    background: #f5f7fa;
    border-radius: 20px;
    border: 1px solid #e8ecf1;
    white-space: nowrap;
}
.subai-update-stats i {
    color: #ff5722;
    margin-right: 4px;
}
.subai-update-stats b {
    font-weight: 700;
    color: #ff5722;
}

/* ===== 列表区域 ===== */
.subai-today-list-area,
.today-list-area {
    flex: 1;
    overflow: hidden;
    min-height: 0;
    padding-top: 0;
    margin-top: -8px;
}
.subai-today-left {
    height: 100%;
    background: #fafcff;
    border-radius: 12px;
    padding: 6px 16px 2px 16px;
    border: 1px solid #eef3fc;
}

.subai-news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
}
.subai-news-item {
    display: flex;
    align-items: center;
    padding: 6px 2px;
    border-bottom: 1px solid #edf2f9;
    min-height: 44px;
    transition: all 0.2s ease;
    border-radius: 4px;
    min-width: 0;
}
.subai-news-item:hover {
    background: #fff;
    box-shadow: 0 2px 10px rgba(91, 141, 239, 0.06);
    padding-left: 4px;
    padding-right: 4px;
}
.subai-news-item:nth-last-child(2),
.subai-news-item:last-child {
    border-bottom: none;
}
.subai-news-item .icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 1px solid #e8edf5;
    background: #f5f8fe;
}
.subai-news-item .icon img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.subai-news-item .info {
    flex: 1;
    padding-left: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    overflow: hidden;
}
.subai-news-item .info .tag {
    font-size: 12px;
    color: #ff5722;
    font-weight: 500;
    flex-shrink: 0;
    white-space: nowrap;
}
.subai-news-item .info .tag.gray {
    color: #999;
}
.subai-news-item .info .title {
    font-size: 13px;
    color: #222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
    max-width: 200px;
}
.subai-news-item .info .title a {
    color: inherit;
    text-decoration: none;
}
.subai-news-item .info .title a:hover {
    color: #5b8def;
}
.subai-news-item .action {
    flex-shrink: 0;
    margin-left: 8px;
    padding-left: 8px;
}
.subai-news-item .action .btn {
    display: inline-block;
    padding: 2px 14px;
    font-size: 12px;
    color: #333;
    background: transparent;
    border: 1px solid #dce3ed;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.25s ease;
    white-space: nowrap;
}
.subai-news-item .action .btn:hover {
    color: #fff;
    background: #5b8def;
    border-color: #5b8def;
}

/* ===== 底部：页码居中 + 查看更多右侧 ===== */
.subai-news-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0 0 0;
    min-height: 48px;
    background: transparent;
    flex-shrink: 0;
    position: relative;
}
.subai-pagination {
    display: flex;
    gap: 6px;
    align-items: center;
}
.subai-btn-more {
    position: absolute;
    right: 0;
    display: inline-block;
    padding: 5px 22px;
    font-size: 14px;
    font-weight: 600;
    color: #5b8def;
    background: transparent;
    border: 1px solid #dce3ed;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    letter-spacing: 0.3px;
    flex-shrink: 0;
    box-shadow: none;
}
.subai-btn-more:hover {
    transform: translateY(-2px);
    color: #fff;
    background: #5b8def;
    border-color: #5b8def;
    box-shadow: none;
}
.subai-pagination a {
    display: inline-block;
    padding: 3px 14px;
    font-size: 13px;
    color: #666;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.25s ease;
    border: 1px solid #dce3ed;
    cursor: pointer;
    background: #fff;
}
.subai-pagination a:hover {
    background: #5b8def;
    border-color: #5b8def;
    color: #fff;
}
.subai-pagination a.current {
    background: #5b8def;
    color: #fff;
    border-color: #5b8def;
}

/* ===== 右侧列 ===== */
.subai-today-right {
    width: 320px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 600px;
}

/* 在线工具卡片 */
.subai-tool-card {
    background: #fff;
    border-radius: 16px;
    padding: 18px 20px 16px 20px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    border: 1px solid #eef3fc;
}
.subai-tool-title {
    font-size: 18px;
    font-weight: 700;
    color: #222;
    text-align: left;
    margin-bottom: 14px;
    display: block;
}

.subai-tool-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin: 0;
}
.subai-tool-grid a {
    display: block;
    padding: 12px 4px 10px 4px;
    background: #fafcff;
    border-radius: 8px;
    border: 1px solid #eef3fc;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 100%;
}
.subai-tool-grid a:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(91, 141, 239, 0.10);
    border-color: #5b8def;
}
.subai-tool-grid a img {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    margin: 0 auto 6px;
    display: block;
    object-fit: cover;
}
.subai-tool-grid a span {
    font-size: 11px;
    color: #333;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 用户登录卡片 - 使用Zibll原生用户个人信息小工具 */
.subai-login-card {
    background: #fff;
    border-radius: 16px;
    padding: 0;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    border: 1px solid #eef3fc;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
.subai-login-card .mb20 {
    margin-bottom: 0 !important;
}
.subai-login-card .user-card {
    box-shadow: none;
    border: none;
    border-radius: 16px;
    margin-bottom: 0;
}
body.dark-theme .subai-login-card .user-card {
    background: transparent !important;
    border: none !important;
}
.subai-login-card .yan-one {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}

/* =============================================
   响应式适配
   ============================================= */

/* 游戏体验响应式 */
@media (max-width: 1200px) {
    .subai-exp-tab-right,
    .subai-exp-right {
        width: 280px;
    }
    .subai-exp-tab-left .tab-item {
        font-size: 12px;
        padding: 4px 2px;
        margin: 0 1px;
    }
    .subai-exp-tab-right .hot-tab {
        font-size: 12px;
        padding: 4px 12px;
    }
}

@media (max-width: 860px) {
    .subai-game-experience {
        padding: 14px 12px;
    }
    .subai-exp-tab-row {
        flex-wrap: wrap;
        gap: 10px;
        padding: 0 0 12px 0;
    }
    .subai-exp-tab-right {
        width: 100%;
        justify-content: center;
    }
    .subai-exp-tab-left .tab-bar {
        flex-wrap: wrap;
        gap: 4px 6px;
    }
    .subai-exp-tab-left .tab-item {
        flex: 0 0 auto;
        padding: 3px 10px;
    }
    .subai-exp-content {
        flex-direction: column;
        gap: 14px;
        min-height: auto;
        padding-top: 12px;
    }
    .subai-exp-right {
        width: 100%;
    }
    .subai-exp-game-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .subai-exp-game-item {
        min-height: 72px;
        padding: 6px 4px;
    }
    .subai-exp-game-icon {
        width: 55px;
        height: 55px;
    }
    .subai-exp-game-info .title {
        font-size: 13px;
    }
    .subai-exp-game-meta {
        font-size: 11px;
    }
    .subai-exp-game-action .btn {
        padding: 3px 12px;
        font-size: 11px;
    }
    .subai-exp-tab-right .hot-tab {
        font-size: 13px;
        padding: 3px 12px;
    }
    .subai-exp-title {
        flex-wrap: wrap;
        gap: 10px;
        padding-bottom: 12px;
    }
    .subai-btn-more {
        padding: 6px 20px;
        font-size: 13px;
    }
}

/* 游戏专题响应式 */
@media (max-width: 1200px) {
    .subai-special-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 860px) {
    .subai-special-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 560px) {
    .subai-special-grid {
        grid-template-columns: 1fr;
    }
    .subai-special-title {
        flex-wrap: wrap;
        gap: 8px;
    }
    .subai-special-card .info .bottom {
        flex-wrap: wrap;
        gap: 8px;
    }
    .subai-btn-more {
        padding: 5px 18px;
        font-size: 12px;
    }
}

/* 必玩大作响应式 */
@media (max-width: 1200px) {
    .subai-must-page {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media (max-width: 992px) {
    .subai-must-page {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 600px) {
    .subai-must-page {
        grid-template-columns: repeat(2, 1fr);
    }
    .subai-must-title {
        flex-wrap: wrap;
        gap: 8px;
    }
    .subai-btn-more {
        padding: 5px 18px;
        font-size: 12px;
    }
}

/* 今日更新响应式 */
@media (max-width: 1024px) {
    .subai-today-right {
        width: 280px;
    }
}
@media (max-width: 768px) {
    .subai-today-wrapper {
        flex-direction: column;
    }
    .subai-today-right {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .subai-tool-card,
    .subai-login-card {
        flex: 1;
        min-width: 200px;
    }
    .subai-today-title {
        flex-wrap: wrap;
        gap: 8px;
    }
    .subai-news-grid {
        grid-template-columns: 1fr;
    }
    .subai-news-item:nth-last-child(2) {
        border-bottom: 1px solid #edf2f9;
    }
    .subai-news-item:last-child {
        border-bottom: none;
    }
    .subai-news-item .info .title {
        font-size: 13px;
    }
    .subai-news-item .icon {
        width: 28px;
        height: 28px;
    }
    .subai-today-title .left {
        flex-wrap: wrap;
        gap: 10px;
    }
    .subai-news-footer {
        min-height: 40px;
        padding: 10px 0 4px 0;
    }
    .subai-pagination a {
        padding: 2px 10px;
        font-size: 12px;
    }
    .subai-btn-more {
        padding: 4px 16px;
        font-size: 12px;
    }
    .subai-tool-grid {
        max-width: 220px;
        gap: 10px;
    }
}
@media (max-width: 480px) {
    .subai-today-right {
        flex-direction: column;
    }
    .subai-tool-card,
    .subai-login-card {
        min-width: 0;
    }
    .subai-tool-grid {
        max-width: 200px;
        gap: 8px;
    }
    .subai-tool-grid a {
        padding: 10px 0 8px 0;
    }
    .subai-tool-grid a img {
        width: 36px;
        height: 36px;
    }
    .subai-tool-grid a span {
        font-size: 12px;
    }
    .subai-news-tabs .tab-btn {
        font-size: 12px;
        padding: 4px 14px;
    }
    .subai-update-stats {
        font-size: 12px;
        padding: 4px 14px;
    }
    .subai-today-module {
        padding: 16px 14px;
    }
    .subai-btn-more {
        padding: 4px 12px;
        font-size: 11px;
        right: 2px;
    }
    .subai-pagination a {
        padding: 2px 8px;
        font-size: 11px;
    }
}

/* =============================================
   暗夜模式支持
   ============================================= */
body.dark-theme .subai-game-experience,
body.dark-theme .subai-special-module,
body.dark-theme .subai-must-module,
body.dark-theme .subai-today-module {
    background: var(--main-bg-color);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

body.dark-theme .subai-exp-title,
body.dark-theme .subai-exp-title .title-text,
body.dark-theme .subai-special-title h2,
body.dark-theme .subai-must-title h2,
body.dark-theme .subai-today-title h2,
body.dark-theme .subai-tool-title {
    color: var(--key-color);
}

body.dark-theme .subai-exp-title,
body.dark-theme .subai-exp-title::after,
body.dark-theme .subai-special-title,
body.dark-theme .subai-must-title {
    border-bottom-color: var(--main-border-color);
}

body.dark-theme .subai-exp-left,
body.dark-theme .subai-exp-right,
body.dark-theme .subai-today-left {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-exp-tab-left,
body.dark-theme .subai-exp-tab-right {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-exp-tab-left .tab-item {
    background: var(--main-bg-color);
    color: var(--muted-2-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-exp-tab-left .tab-item:hover {
    background: var(--muted-bg-color);
    color: var(--main-color);
}

body.dark-theme .subai-exp-tab-left .tab-item.active {
    background: var(--focus-color);
    color: #fff;
    border-color: var(--focus-color);
}

body.dark-theme .subai-exp-tab-right .hot-tab {
    color: var(--muted-2-color);
}

body.dark-theme .subai-exp-tab-right .hot-tab:hover {
    color: var(--main-color);
}

body.dark-theme .subai-exp-tab-right .hot-tab.active {
    color: var(--focus-color);
    border-bottom-color: var(--focus-color);
}

body.dark-theme .subai-exp-game-item,
body.dark-theme .subai-exp-hot-item {
    border-bottom-color: var(--main-border-color);
}

body.dark-theme .subai-exp-game-item:hover,
body.dark-theme .subai-exp-hot-item:hover {
    background: rgba(255, 255, 255, 0.05);
}

body.dark-theme .subai-exp-game-info .title,
body.dark-theme .subai-exp-hot-info .hot-name,
body.dark-theme .subai-must-card .info h3,
body.dark-theme .subai-special-card .info h3 {
    color: var(--main-color);
}

body.dark-theme .subai-exp-game-info .title a:hover,
body.dark-theme .subai-exp-hot-info .hot-name a:hover,
body.dark-theme .subai-must-card:hover .info h3,
body.dark-theme .subai-special-card:hover .info h3 {
    color: var(--focus-color);
}

body.dark-theme .subai-exp-game-meta,
body.dark-theme .subai-exp-hot-info .subai-exp-game-meta,
body.dark-theme .subai-must-card .info .meta {
    color: var(--muted-color);
}

body.dark-theme .subai-exp-game-meta i,
body.dark-theme .subai-exp-hot-info .subai-exp-game-meta i,
body.dark-theme .subai-must-card .info .meta i {
    color: var(--muted-3-color);
}

body.dark-theme .subai-exp-game-action .btn,
body.dark-theme .subai-exp-hot-action .btn-sm {
    background: var(--focus-color);
    color: #fff;
}

body.dark-theme .subai-exp-game-action .btn:hover,
body.dark-theme .subai-exp-hot-action .btn-sm:hover {
    background: var(--focus-color);
    opacity: 0.9;
}

body.dark-theme .subai-exp-hot-rank {
    background: var(--main-bg-color);
    color: var(--muted-2-color);
}

body.dark-theme .subai-must-card,
body.dark-theme .subai-special-card {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-must-card:hover,
body.dark-theme .subai-special-card:hover {
    border-color: rgba(91, 141, 239, 0.3);
}

body.dark-theme .subai-must-card .cover,
body.dark-theme .subai-special-card .cover {
    background: rgba(0, 0, 0, 0.2);
}

body.dark-theme .subai-must-card .info,
body.dark-theme .subai-special-card .info {
    background: var(--muted-bg-color);
}

body.dark-theme .subai-must-arrow {
    background: rgba(30, 30, 30, 0.9);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-theme .subai-must-arrow:hover {
    background: #5b8def;
    border-color: #5b8def;
}

body.dark-theme .subai-must-dot {
    background: rgba(255, 255, 255, 0.2);
}

body.dark-theme .subai-must-dot.active {
    background: #5b8def;
}

body.dark-theme .subai-must-arrow,
body.dark-theme .subai-exp-arrow {
    background: var(--main-bg-color);
    border-color: var(--main-border-color);
    color: var(--muted-2-color);
}

body.dark-theme .subai-must-arrow:hover,
body.dark-theme .subai-exp-arrow:hover {
    background: var(--main-bg-color);
    color: var(--focus-color);
    border-color: rgba(253, 83, 161, 0.3);
}

body.dark-theme .subai-must-dots .dot {
    background: var(--muted-3-color);
}

body.dark-theme .subai-must-dots .dot.active,
body.dark-theme .subai-must-dots .dot:hover {
    background: var(--focus-color);
}

body.dark-theme .subai-btn-more {
    background: rgba(253, 83, 161, 0.15);
    border-color: rgba(253, 83, 161, 0.3);
    color: var(--focus-color);
}

body.dark-theme .subai-btn-more:hover {
    background: var(--focus-color);
    color: #fff;
}

body.dark-theme .subai-special-card .info .desc {
    color: var(--muted-color);
}

body.dark-theme .subai-special-card .info .bottom .num {
    color: var(--muted-2-color);
}

body.dark-theme .subai-special-card .info .bottom .btn-view {
    background: rgba(253, 83, 161, 0.15);
    color: var(--focus-color);
    border-color: rgba(253, 83, 161, 0.3);
}

body.dark-theme .subai-special-card .info .bottom .btn-view:hover {
    background: var(--focus-color);
    color: #fff;
}

body.dark-theme .subai-news-tabs {
    background: var(--muted-bg-color);
}

body.dark-theme .subai-news-tabs .tab-btn {
    color: var(--muted-2-color);
}

body.dark-theme .subai-news-tabs .tab-btn:hover {
    color: var(--main-color);
}

body.dark-theme .subai-news-tabs .tab-btn.active {
    background: var(--focus-color);
    color: #fff;
}

body.dark-theme .subai-update-stats {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
    color: var(--muted-2-color);
}

body.dark-theme .subai-news-item {
    border-bottom-color: var(--main-border-color);
}

body.dark-theme .subai-news-item:hover {
    background: rgba(255, 255, 255, 0.03);
}

body.dark-theme .subai-news-item .info .title {
    color: var(--main-color);
}

body.dark-theme .subai-news-item .info .title a:hover {
    color: var(--focus-color);
}

body.dark-theme .subai-news-item .info .tag {
    color: var(--focus-color);
}

body.dark-theme .subai-news-item .info .tag.gray {
    color: var(--muted-2-color);
}

body.dark-theme .subai-news-item .action .btn {
    border-color: var(--main-border-color);
    color: var(--muted-2-color);
}

body.dark-theme .subai-news-item .action .btn:hover {
    background: var(--focus-color);
    color: #fff;
    border-color: var(--focus-color);
}

body.dark-theme .subai-news-footer {
    border-top-color: var(--main-border-color);
}

body.dark-theme .subai-pagination a {
    background: var(--muted-bg-color);
    color: var(--muted-2-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-pagination a:hover,
body.dark-theme .subai-pagination a.current {
    background: var(--focus-color);
    color: #fff;
    border-color: var(--focus-color);
}

body.dark-theme .subai-tool-card {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-tool-grid a {
    background: var(--main-bg-color);
    border-color: var(--main-border-color);
}

body.dark-theme .subai-tool-grid a:hover {
    border-color: var(--focus-color);
}

body.dark-theme .subai-tool-grid a span {
    color: var(--main-color);
}

body.dark-theme .subai-login-card {
    background: var(--muted-bg-color);
    border-color: var(--main-border-color);
}
/* =============================================
   布局修复：标题外置、容器分离、必玩大作单卡高度修复
   ============================================= */
.subai-section-block {
    background: transparent !important;
    margin-bottom: 20px;
    position: relative;
}

.subai-section-title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px;
    position: relative !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 18px 0 !important;
    min-height: 34px;
}

.subai-section-title.has-accent {
    padding-left: 20px !important;
}

.subai-section-title.has-accent::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 0.6em;
    transform: translateY(-50%);
    background: #5b8def;
    border-radius: 4px;
}

.subai-section-title h2,
.subai-section-title .title-text,
.subai-tool-title.subai-section-title span {
    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #222 !important;
    margin: 0 !important;
}

.subai-section-title .subai-btn-more {
    position: static !important;
    right: auto !important;
    flex-shrink: 0;
    padding: 5px 22px !important;
    font-size: 14px !important;
    color: #5b8def !important;
    background: transparent !important;
    border: 1px solid #dce3ed !important;
    box-shadow: none !important;
}

.subai-section-title .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
    box-shadow: none !important;
}

/* 游戏体验：标题已移到白色卡片外，白色卡片只承载内容 */
.subai-game-experience {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 18px 22px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
    height: auto !important;
    margin-bottom: 0 !important;
}

.subai-game-experience .subai-exp-tab-row {
    padding-bottom: 14px !important;
}

.subai-game-experience .subai-exp-content {
    padding-top: 14px !important;
}

/* 游戏专题：标题已外置，白色卡片只包裹专题卡片网格 */
.subai-special-module {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 20px 24px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
    margin-bottom: 0 !important;
}

.subai-special-module .subai-special-grid {
    padding-top: 0 !important;
}

/* 必玩大作：压缩上下空白，保留 hover 阴影空间 */
.subai-must-module {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 18px 22px 20px 22px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
    margin-bottom: 0 !important;
    overflow: visible !important;
    position: relative !important;
}

.subai-must-carousel-wrap {
    padding-top: 0 !important;
    overflow: visible !important;
}

.subai-must-carousel {
    position: relative !important;
    overflow: visible !important;
    padding: 10px 8px 4px 8px !important;
}

.subai-must-track {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
}

.subai-must-page {
    grid-column: 1 / -1 !important;
    grid-row: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 14px !important;
    align-self: start !important;
    align-items: start !important;
    align-content: start !important;
    grid-auto-rows: auto !important;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.45s ease;
}

.subai-must-page.active {
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 2;
}

.subai-must-card {
    align-self: start !important;
    height: auto !important;
    min-height: 0 !important;
}

.subai-must-dots {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    margin-top: 16px !important;
}

.subai-must-arrow {
    top: 45% !important;
}

/* 今日更新：TAB + 今日更新统计外置，白色卡片只包裹列表和底部翻页 */
.subai-today-wrapper {
    align-items: flex-start !important;
}

.subai-today-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.subai-today-title.subai-section-title {
    margin-bottom: 18px !important;
    min-height: 38px;
}

.subai-today-module {
    height: 545px !important;
    margin-bottom: 0 !important;
}

.subai-today-module .today-list-area {
    margin-top: 0 !important;
}

.subai-news-footer .subai-btn-more {
    position: absolute !important;
    right: 0 !important;
    display: inline-block;
    padding: 5px 22px !important;
    font-size: 14px !important;
    font-weight: 600;
    color: #5b8def !important;
    background: transparent !important;
    border: 1px solid #dce3ed !important;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    letter-spacing: 0.3px;
    flex-shrink: 0;
    box-shadow: none !important;
}

.subai-news-footer .subai-btn-more:hover {
    transform: translateY(-2px);
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
    box-shadow: none !important;
}

/* 在线工具：标题外置透明，登录卡片不改结构 */
.subai-tool-section {
    background: transparent !important;
    display: flex;
    flex-direction: column;
}

.subai-tool-title.subai-section-title {
    margin-bottom: 18px !important;
    padding: 0 !important;
}

.subai-tool-card {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 18px 20px 16px 20px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
    border: 1px solid #eef3fc !important;
}

/* 响应式修复 */
@media (max-width: 1200px) {
    .subai-must-page {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (max-width: 992px) {
    .subai-must-page {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .subai-section-title {
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 14px !important;
    }
    .subai-section-title.has-accent {
        padding-left: 16px !important;
    }
    .subai-section-title.has-accent::before {
        width: 3px;
        height: 0.6em;
    }
    .subai-section-title h2,
    .subai-section-title .title-text,
    .subai-tool-title.subai-section-title span {
        font-size: 20px !important;
    }
    .subai-today-main,
    .subai-today-right {
        width: 100% !important;
        height: auto !important;
    }
    .subai-today-module {
        height: auto !important;
        min-height: 0 !important;
    }
    .subai-today-title.subai-section-title .left {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .subai-must-page {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .subai-must-module,
    .subai-special-module,
    .subai-game-experience,
    .subai-today-module,
    .subai-tool-card {
        padding: 16px 14px !important;
    }
    .subai-section-title .subai-btn-more,
    .subai-news-footer .subai-btn-more {
        padding: 4px 14px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 420px) {
    .subai-must-page {
        grid-template-columns: 1fr !important;
    }
}

/* 暗色模式下保持标题区域透明，仅调整文字和卡片颜色 */
body.dark-theme .subai-section-title,
body.night .subai-section-title {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

body.dark-theme .subai-section-title h2,
body.dark-theme .subai-section-title .title-text,
body.dark-theme .subai-tool-title.subai-section-title span,
body.night .subai-section-title h2,
body.night .subai-section-title .title-text,
body.night .subai-tool-title.subai-section-title span {
    color: var(--key-color, #fff) !important;
}

body.dark-theme .subai-game-experience,
body.dark-theme .subai-special-module,
body.dark-theme .subai-must-module,
body.dark-theme .subai-today-module,
body.dark-theme .subai-tool-card,
body.night .subai-game-experience,
body.night .subai-special-module,
body.night .subai-must-module,
body.night .subai-today-module,
body.night .subai-tool-card {
    background: var(--main-bg-color, #222) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3) !important;
}
/* =============================================
   Final QA fixes 2026-07-09：统一标题竖杠、固定模块高度、暗夜模式、右侧对齐
   ============================================= */
:root {
    --subai-section-accent-width: 4px;
    --subai-section-accent-height: 1em;
    --subai-section-accent-color: #5b8def;
    --subai-section-title-gap: 16px;
    --subai-card-bg: #fff;
    --subai-card-border: #eef3fc;
    --subai-card-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    --subai-dark-card-bg: var(--muted-bg-color, #222);
    --subai-dark-card-border: var(--main-border-color, rgba(255, 255, 255, 0.10));
}

/* 统一所有外置标题的基准，避免 h2/span 继承不同 font-size 导致竖杠长短不一致 */
.subai-section-title {
    min-height: 34px !important;
    line-height: 1.2 !important;
    margin: 0 0 18px 0 !important;
}

.subai-section-title.has-accent {
    padding-left: calc(var(--subai-section-accent-width) + var(--subai-section-title-gap)) !important;
}

.subai-section-title.has-accent::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: var(--subai-section-accent-width) !important;
    height: var(--subai-section-accent-height) !important;
    transform: translateY(-50%) !important;
    background: var(--subai-section-accent-color) !important;
    border-radius: 4px !important;
}

.subai-section-title h2,
.subai-section-title .title-text,
.subai-tool-title.subai-section-title span {
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* 外置标题里的查看更多按钮：白天/暗夜都使用可见边框 */
.subai-section-title .subai-btn-more,
.subai-news-footer .subai-btn-more {
    border: 1px solid #dce3ed !important;
    color: #5b8def !important;
    background: transparent !important;
    box-shadow: none !important;
}

.subai-section-title .subai-btn-more:hover,
.subai-news-footer .subai-btn-more:hover {
    border-color: #5b8def !important;
    color: #fff !important;
    background: #5b8def !important;
}

/* 游戏体验：标题外置后，白色内容卡片恢复固定高度，避免随内容变高/变矮 */
.subai-exp-block {
    margin-bottom: 20px !important;
}
.subai-exp-block .subai-game-experience {
    height: 599px !important;
    min-height: 599px !important;
    max-height: 599px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-tab-row {
    flex: 0 0 auto !important;
}
.subai-exp-block .subai-exp-content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-left,
.subai-exp-block .subai-exp-right,
.subai-exp-block .subai-exp-hot-panels,
.subai-exp-block .subai-exp-hot-panel.active {
    min-height: 0 !important;
}

/* 今日更新：主栏与右侧栏固定总高 600px，底部对齐 */
.subai-today-wrapper {
    align-items: stretch !important;
    min-height: 600px !important;
}
.subai-today-main,
.subai-today-right {
    height: 600px !important;
    min-height: 600px !important;
    max-height: 600px !important;
    box-sizing: border-box !important;
}
.subai-today-main {
    display: flex !important;
    flex-direction: column !important;
}
.subai-today-title.subai-section-title {
    flex: 0 0 38px !important;
    min-height: 38px !important;
    margin-bottom: 18px !important;
}
.subai-today-module {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.subai-today-module .today-list-area {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}
.subai-news-footer {
    flex: 0 0 auto !important;
}

/* 右侧在线工具 + 登录卡片：固定在 600px 高度内，登录卡片补足剩余高度并与今日更新底部对齐 */
.subai-today-right {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}
.subai-tool-section {
    flex: 0 0 auto !important;
}
.subai-tool-title.subai-section-title {
    flex: 0 0 34px !important;
    min-height: 34px !important;
    margin-bottom: 18px !important;
}
.subai-tool-card {
    flex: 0 0 auto !important;
    border: 1px solid var(--subai-card-border) !important;
}
.subai-login-card {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
}

/* 必玩大作：最后一页单卡不拉伸；保持页面由内容自身高度决定 */
.subai-must-track {
    align-items: start !important;
    align-content: start !important;
}
.subai-must-page {
    align-items: start !important;
    align-content: start !important;
    justify-items: stretch !important;
    grid-auto-rows: max-content !important;
}
.subai-must-card {
    align-self: start !important;
    height: auto !important;
    min-height: 0 !important;
}

/* 暗夜模式补全：在线工具卡片、工具项、查看更多按钮边框 */
body.dark-theme .subai-tool-card,
body.night .subai-tool-card {
    background: var(--subai-dark-card-bg) !important;
    border-color: var(--subai-dark-card-border) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.30) !important;
}
body.dark-theme .subai-tool-grid a,
body.night .subai-tool-grid a {
    background: rgba(255, 255, 255, 0.035) !important;
    border-color: var(--subai-dark-card-border) !important;
}
body.dark-theme .subai-tool-grid a:hover,
body.night .subai-tool-grid a:hover {
    border-color: #5b8def !important;
    background: rgba(91, 141, 239, 0.10) !important;
}
body.dark-theme .subai-section-title .subai-btn-more,
body.dark-theme .subai-news-footer .subai-btn-more,
body.night .subai-section-title .subai-btn-more,
body.night .subai-news-footer .subai-btn-more {
    border-color: var(--subai-dark-card-border) !important;
    color: #8fb0ff !important;
    background: transparent !important;
}
body.dark-theme .subai-section-title .subai-btn-more:hover,
body.dark-theme .subai-news-footer .subai-btn-more:hover,
body.night .subai-section-title .subai-btn-more:hover,
body.night .subai-news-footer .subai-btn-more:hover {
    border-color: #5b8def !important;
    color: #fff !important;
    background: #5b8def !important;
}
body.dark-theme .subai-game-experience,
body.dark-theme .subai-special-module,
body.dark-theme .subai-must-module,
body.dark-theme .subai-today-module,
body.night .subai-game-experience,
body.night .subai-special-module,
body.night .subai-must-module,
body.night .subai-today-module {
    border: 1px solid var(--subai-dark-card-border) !important;
}

@media (max-width: 768px) {
    :root {
        --subai-section-accent-width: 3px;
        --subai-section-accent-height: 1em;
        --subai-section-title-gap: 13px;
    }
    .subai-section-title h2,
    .subai-section-title .title-text,
    .subai-tool-title.subai-section-title span {
        font-size: 20px !important;
    }
    .subai-exp-block .subai-game-experience,
    .subai-today-main,
    .subai-today-right,
    .subai-today-wrapper {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
    .subai-login-card {
        height: auto !important;
        min-height: 0 !important;
    }
}

/* =============================================
   Final layout sizing pass v3：1400 视觉网格、统一竖杠、移动端自适应
   ============================================= */
:root {
    --subai-layout-width: 1400px;
    --subai-layout-gap: 20px;
    --subai-main-col-width: 1000px;
    --subai-side-col-width: 380px;
    --subai-title-height: 42px;
    --subai-title-gap-bottom: 18px;
    --subai-title-font-size: 24px;
    --subai-accent-width: 4px;
    --subai-accent-height: 24px;
}

.subai-section-block,
.subai-today-wrapper {
    width: 100% !important;
    max-width: var(--subai-layout-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

.subai-section-block {
    background: transparent !important;
    margin-bottom: 20px !important;
}

/* 统一三处蓝色竖杠：不用 em，避免继承不同字体导致长度不一致 */
.subai-section-title {
    height: var(--subai-title-height) !important;
    min-height: var(--subai-title-height) !important;
    max-height: var(--subai-title-height) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    margin: 0 0 var(--subai-title-gap-bottom) 0 !important;
    padding: 0 !important;
    position: relative !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
}

.subai-section-title.has-accent {
    padding-left: 20px !important;
}

.subai-section-title.has-accent::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: var(--subai-accent-width) !important;
    height: var(--subai-accent-height) !important;
    min-height: var(--subai-accent-height) !important;
    max-height: var(--subai-accent-height) !important;
    transform: translateY(-50%) !important;
    background: #5b8def !important;
    border-radius: 4px !important;
}

.subai-section-title h2,
.subai-section-title .title-text,
.subai-tool-title.subai-section-title span {
    font-size: var(--subai-title-font-size) !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: #222 !important;
}

.subai-section-title .subai-btn-more,
.subai-news-footer .subai-btn-more {
    font-size: 15px !important;
    line-height: 1.2 !important;
    padding: 6px 24px !important;
}

/* 今日更新：整体 1400×690，左主栏 1000，右侧栏 380，间距 20；尺寸包含标题 */
.subai-today-wrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--subai-side-col-width) !important;
    gap: var(--subai-layout-gap) !important;
    align-items: stretch !important;
    height: 690px !important;
    min-height: 690px !important;
    max-height: 690px !important;
    margin-bottom: 20px !important;
}

.subai-today-main,
.subai-today-right {
    height: 690px !important;
    min-height: 690px !important;
    max-height: 690px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.subai-today-main {
    width: auto !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.subai-today-right {
    width: var(--subai-side-col-width) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    min-width: 0 !important;
}

.subai-today-title.subai-section-title,
.subai-tool-title.subai-section-title {
    flex: 0 0 var(--subai-title-height) !important;
}

.subai-today-module {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.subai-today-module .today-list-area,
.subai-today-left,
.subai-news-grid {
    min-height: 0 !important;
}

.subai-today-left {
    height: 100% !important;
    box-sizing: border-box !important;
}

.subai-tool-section {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
}

.subai-tool-card {
    flex: 0 0 auto !important;
}

.subai-login-card {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
}

/* 游戏体验：整体 1400×628，拆成左主内容 1000×628 与右热门 380×628，间距 20；尺寸包含标题 */
.subai-exp-block {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
}

.subai-exp-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--subai-side-col-width) !important;
    gap: var(--subai-layout-gap) !important;
    width: 100% !important;
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    align-items: stretch !important;
}

.subai-exp-main-panel,
.subai-exp-hot-panel-card {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.subai-exp-main-panel {
    width: auto !important;
}

.subai-exp-hot-panel-card {
    width: var(--subai-side-col-width) !important;
}

.subai-exp-main-panel > .subai-section-title,
.subai-exp-hot-panel-card > .subai-section-title {
    flex: 0 0 var(--subai-title-height) !important;
}

.subai-exp-hot-panel-card > .subai-section-title {
    justify-content: center !important;
}

.subai-game-experience,
.subai-exp-right {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border-radius: 16px !important;
    border: 1px solid #eef3fc !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
    overflow: hidden !important;
}

.subai-game-experience {
    display: flex !important;
    flex-direction: column !important;
    padding: 18px 22px !important;
}

.subai-exp-right {
    padding: 12px 16px 8px 16px !important;
    display: flex !important;
    flex-direction: column !important;
}

.subai-exp-tab-left {
    width: 100% !important;
    flex: 0 0 auto !important;
    margin-bottom: 16px !important;
}

.subai-exp-left {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    padding: 10px 16px 8px 16px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.subai-exp-game-grid {
    min-height: 0 !important;
}

.subai-exp-hot-panels,
.subai-exp-hot-panel.active {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

/* 必玩大作与游戏专题：整体尺寸包含标题 */
.subai-must-block {
    height: 769px !important;
    min-height: 769px !important;
    max-height: 769px !important;
    display: flex !important;
    flex-direction: column !important;
}

.subai-must-block > .subai-section-title,
.subai-special-block > .subai-section-title {
    flex: 0 0 var(--subai-title-height) !important;
}

.subai-must-module {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.subai-special-block {
    height: 412px !important;
    min-height: 412px !important;
    max-height: 412px !important;
    display: flex !important;
    flex-direction: column !important;
}

.subai-special-module {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* 必玩大作最后一页单卡保持正常高度，不被 grid 拉伸 */
.subai-must-track,
.subai-must-page {
    align-items: start !important;
    align-content: start !important;
}

.subai-must-page {
    grid-auto-rows: max-content !important;
}

.subai-must-card {
    align-self: start !important;
}

/* 文字整体略放大 */
.subai-news-tabs .tab-btn,
.subai-update-stats,
.subai-exp-tab-left .tab-item,
.subai-exp-tab-right .hot-tab {
    font-size: 15px !important;
}

.subai-news-item .info .title,
.subai-exp-game-info .title,
.subai-exp-hot-info .hot-name,
.subai-must-card .info h3 {
    font-size: 15px !important;
}

.subai-news-item .action .btn,
.subai-exp-game-action .btn,
.subai-exp-hot-action .btn-sm,
.subai-special-card .info .bottom .btn-view {
    font-size: 13px !important;
}

.subai-exp-game-meta,
.subai-exp-hot-info .subai-exp-game-meta,
.subai-must-card .info .meta,
.subai-special-card .info .desc {
    font-size: 13px !important;
}

.subai-special-card .info h3 {
    font-size: 18px !important;
}

/* 暗夜模式同步给新拆分出来的游戏体验右侧容器 */
body.dark-theme .subai-game-experience,
body.dark-theme .subai-exp-right,
body.dark-theme .subai-special-module,
body.dark-theme .subai-must-module,
body.dark-theme .subai-today-module,
body.dark-theme .subai-tool-card,
body.night .subai-game-experience,
body.night .subai-exp-right,
body.night .subai-special-module,
body.night .subai-must-module,
body.night .subai-today-module,
body.night .subai-tool-card {
    background: var(--subai-dark-card-bg, var(--muted-bg-color, #222)) !important;
    border-color: var(--subai-dark-card-border, var(--main-border-color, rgba(255,255,255,.1))) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.30) !important;
}

/* 中等屏：保留右侧 380，左侧自动收缩，保证多数笔记本不溢出 */
@media (max-width: 1420px) {
    .subai-section-block,
    .subai-today-wrapper {
        max-width: 100% !important;
    }
}

/* 平板与移动端：主内容在上，侧栏在下，固定像素高度取消 */
@media (max-width: 900px) {
    :root {
        --subai-title-height: 38px;
        --subai-title-font-size: 21px;
        --subai-accent-width: 3px;
        --subai-accent-height: 21px;
        --subai-title-gap-bottom: 14px;
    }

    .subai-today-wrapper,
    .subai-exp-layout {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .subai-today-main,
    .subai-today-right,
    .subai-exp-block,
    .subai-exp-main-panel,
    .subai-exp-hot-panel-card,
    .subai-must-block,
    .subai-special-block {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .subai-today-module,
    .subai-game-experience,
    .subai-exp-right,
    .subai-must-module,
    .subai-special-module,
    .subai-tool-card,
    .subai-login-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .subai-exp-hot-panel-card {
        width: 100% !important;
    }

    .subai-tool-section {
        width: 100% !important;
    }
}

@media (max-width: 600px) {
    :root {
        --subai-title-height: 36px;
        --subai-title-font-size: 20px;
        --subai-accent-height: 20px;
    }

    .subai-section-title {
        flex-wrap: wrap !important;
        height: auto !important;
        max-height: none !important;
        min-height: var(--subai-title-height) !important;
    }

    .subai-section-title .subai-btn-more,
    .subai-news-footer .subai-btn-more {
        font-size: 12px !important;
        padding: 4px 14px !important;
    }

    .subai-news-tabs,
    .subai-exp-tab-left .tab-bar,
    .subai-exp-tab-right .hot-tabs {
        flex-wrap: wrap !important;
    }
}


/* =============================================
   Final layout polish v4: 20px titles, filled today list, game-experience right controls
   ============================================= */
:root {
    --subai-title-font-size: 20px;
    --subai-accent-height: 20px;
    --subai-accent-width: 4px;
    --subai-title-height: 38px;
}

/* 主模块标题统一为 20px；竖杠用固定像素，避免不同标签继承 line-height 后长短不一 */
.subai-section-title {
    min-height: var(--subai-title-height) !important;
    height: var(--subai-title-height) !important;
    line-height: 1 !important;
}
.subai-section-title.has-accent::before {
    width: var(--subai-accent-width) !important;
    height: var(--subai-accent-height) !important;
    min-height: var(--subai-accent-height) !important;
    max-height: var(--subai-accent-height) !important;
}
.subai-section-title h2,
.subai-section-title .title-text,
.subai-tool-title.subai-section-title span {
    font-size: 20px !important;
    line-height: 20px !important;
}

/* 今日更新：固定 20 条，两列十行，列表区铺满，不在底部留下空白 */
.subai-today-module .today-list-area {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}
.subai-today-left {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}
.subai-news-grid {
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(10, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(0, 1fr) !important;
    align-content: stretch !important;
}
.subai-news-item {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
}
.subai-news-item:nth-last-child(2),
.subai-news-item:last-child {
    border-bottom: 1px solid #edf2f9 !important;
}
.subai-news-item:nth-child(19),
.subai-news-item:nth-child(20) {
    border-bottom: none !important;
}

/* 游戏体验：查看更多移到右侧容器顶部，热门 tabs 在按钮下面，并且都在白色容器内部 */
.subai-exp-hot-panel-card > .subai-section-title {
    display: none !important;
}
.subai-exp-right {
    padding: 16px !important;
    gap: 12px !important;
}
.subai-exp-more-row {
    flex: 0 0 auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    min-height: 34px !important;
}
.subai-exp-more-row .subai-btn-more {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 20px !important;
    font-size: 14px !important;
    color: #5b8def !important;
    background: transparent !important;
    border: 1px solid #dce3ed !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    line-height: 1.2 !important;
}
.subai-exp-more-row .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}
.subai-exp-tab-right {
    flex: 0 0 auto !important;
    width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: block !important;
}
.subai-exp-tab-right .hot-tabs {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 4px !important;
    border-radius: 999px !important;
    background: #f3f6fc !important;
    border: 1px solid #e7edf8 !important;
}
.subai-exp-tab-right .hot-tab {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 4px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: #667085 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    transition: all .22s ease !important;
}
.subai-exp-tab-right .hot-tab:hover {
    color: #5b8def !important;
    background: rgba(91, 141, 239, .08) !important;
}
.subai-exp-tab-right .hot-tab.active {
    color: #fff !important;
    background: linear-gradient(135deg, #5b8def, #4a7ad4) !important;
    box-shadow: 0 4px 12px rgba(91, 141, 239, .28) !important;
}
.subai-exp-hot-panels {
    flex: 1 1 auto !important;
}

/* 游戏体验左侧分类 tab：胶囊分组 + 渐变激活态，更清爽 */
.subai-exp-tab-left {
    background: #f3f6fc !important;
    border: 1px solid #e7edf8 !important;
    border-radius: 16px !important;
    padding: 8px !important;
}
.subai-exp-tab-left .tab-bar {
    gap: 8px !important;
}
.subai-exp-tab-left .tab-item {
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 999px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: #667085 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    box-shadow: none !important;
}
.subai-exp-tab-left .tab-item:hover {
    background: #fff !important;
    color: #5b8def !important;
    border-color: rgba(91, 141, 239, .18) !important;
}
.subai-exp-tab-left .tab-item.active {
    color: #fff !important;
    background: linear-gradient(135deg, #5b8def, #4a7ad4) !important;
    border-color: #5b8def !important;
    box-shadow: 0 5px 14px rgba(91, 141, 239, .28) !important;
}

/* 暗夜模式补充 */
body.dark-theme .subai-news-item:nth-last-child(2),
body.dark-theme .subai-news-item:last-child,
body.night .subai-news-item:nth-last-child(2),
body.night .subai-news-item:last-child {
    border-bottom-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}
body.dark-theme .subai-news-item:nth-child(19),
body.dark-theme .subai-news-item:nth-child(20),
body.night .subai-news-item:nth-child(19),
body.night .subai-news-item:nth-child(20) {
    border-bottom: none !important;
}
body.dark-theme .subai-exp-tab-left,
body.dark-theme .subai-exp-tab-right .hot-tabs,
body.night .subai-exp-tab-left,
body.night .subai-exp-tab-right .hot-tabs {
    background: rgba(255,255,255,.035) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}
body.dark-theme .subai-exp-tab-left .tab-item,
body.dark-theme .subai-exp-tab-right .hot-tab,
body.night .subai-exp-tab-left .tab-item,
body.night .subai-exp-tab-right .hot-tab {
    color: rgba(255,255,255,.72) !important;
}
body.dark-theme .subai-exp-tab-left .tab-item:hover,
body.dark-theme .subai-exp-tab-right .hot-tab:hover,
body.night .subai-exp-tab-left .tab-item:hover,
body.night .subai-exp-tab-right .hot-tab:hover {
    color: #8fb0ff !important;
    background: rgba(91,141,239,.12) !important;
}
body.dark-theme .subai-exp-more-row .subai-btn-more,
body.night .subai-exp-more-row .subai-btn-more {
    color: #8fb0ff !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
    background: transparent !important;
}
body.dark-theme .subai-exp-more-row .subai-btn-more:hover,
body.night .subai-exp-more-row .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}

@media (max-width: 900px) {
    :root {
        --subai-title-font-size: 20px;
        --subai-accent-height: 18px;
        --subai-title-height: 36px;
    }
    .subai-news-grid {
        grid-template-columns: 1fr !important;
        grid-template-rows: none !important;
        grid-auto-rows: auto !important;
        height: auto !important;
    }
    .subai-news-item:nth-child(19),
    .subai-news-item:nth-child(20) {
        border-bottom: 1px solid #edf2f9 !important;
    }
    .subai-news-item:last-child {
        border-bottom: none !important;
    }
}

@media (max-width: 600px) {
    .subai-exp-tab-right .hot-tabs {
        border-radius: 14px !important;
        grid-template-columns: 1fr !important;
    }
    .subai-exp-tab-left .tab-bar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* =============================================
   Final polish v5: fix experience tabs, external right button, hot list stretch, must card uniformity
   ============================================= */
/* 游戏体验右侧：查看更多按钮回到白色卡片外部的透明标题行，与左侧标题行对齐 */
.subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    display: flex !important;
    flex: 0 0 var(--subai-title-height) !important;
    min-height: var(--subai-title-height) !important;
    height: var(--subai-title-height) !important;
    max-height: var(--subai-title-height) !important;
    margin: 0 0 var(--subai-title-gap-bottom) 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    align-items: center !important;
    justify-content: space-between !important;
}
.subai-exp-side-title-spacer {
    display: block !important;
    width: 1px !important;
    height: 1px !important;
    flex: 1 1 auto !important;
}
.subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more {
    flex: 0 0 auto !important;
}
.subai-exp-more-row {
    display: none !important;
}

/* 右侧白色热门卡片只放 tabs + 列表，底部与左侧白色卡片对齐 */
.subai-exp-hot-panel-card .subai-exp-right {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    box-sizing: border-box !important;
}

/* 右侧热门内容：不足一条/少量时保持普通条目高度，紧靠顶部，不拉伸占满 */
.subai-exp-hot-panels {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: block !important;
}
.subai-exp-hot-panel {
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}
.subai-exp-hot-panel.active {
    display: block !important;
    flex: none !important;
    justify-content: flex-start !important;
    align-content: start !important;
}
.subai-exp-hot-item {
    flex: 0 0 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    box-sizing: border-box !important;
}

/* 游戏体验左侧 TAB：保持一行，缩小字号和间距，不再用省略号截断 */
.subai-exp-tab-left {
    padding: 6px !important;
}
.subai-exp-tab-left .tab-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
}
.subai-exp-tab-left .tab-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 7px 4px !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    letter-spacing: -0.2px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

/* 必玩大作：统一每张卡片整体高度、封面高度、标题区域高度 */
.subai-must-page {
    align-items: start !important;
    align-content: start !important;
    grid-auto-rows: 178px !important;
}
.subai-must-card {
    height: 178px !important;
    min-height: 178px !important;
    max-height: 178px !important;
    display: flex !important;
    flex-direction: column !important;
    align-self: start !important;
    box-sizing: border-box !important;
}
.subai-must-card .cover {
    height: 110px !important;
    min-height: 110px !important;
    flex: 0 0 110px !important;
}
.subai-must-card .info {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}
.subai-must-card .info h3 {
    min-height: 36px !important;
    max-height: 42px !important;
    margin-bottom: 4px !important;
}
.subai-must-card .info .meta {
    flex: 0 0 auto !important;
    min-height: 16px !important;
}

/* 暗夜模式：新增的右侧透明标题行按钮沿用统一按钮暗色样式 */
body.dark-theme .subai-exp-side-title.subai-section-title,
body.night .subai-exp-side-title.subai-section-title {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

@media (max-width: 900px) {
    .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
        height: auto !important;
        min-height: var(--subai-title-height) !important;
        max-height: none !important;
    }
    .subai-exp-hot-item {
        height: auto !important;
        min-height: 54px !important;
        max-height: none !important;
        flex: 0 0 auto !important;
    }
}

@media (max-width: 600px) {
    .subai-exp-tab-left .tab-bar {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 3px !important;
    }
    .subai-exp-tab-left .tab-item {
        font-size: 10px !important;
        padding: 6px 2px !important;
        letter-spacing: -0.4px !important;
    }
}

/* =============================================
   Final polish v6: align experience columns, show 10 hot items, unify tabs, refine must cards
   ============================================= */
/* 游戏体验：左右两栏统一用“标题行 + 间距 + 白色卡片”的网格结构，确保底部完全对齐 */
.subai-exp-block {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    margin-bottom: 34px !important;
}
.subai-exp-layout {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    align-items: stretch !important;
}
.subai-exp-main-panel,
.subai-exp-hot-panel-card {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    display: grid !important;
    grid-template-rows: var(--subai-title-height) minmax(0, 1fr) !important;
    row-gap: var(--subai-title-gap-bottom) !important;
    align-items: stretch !important;
}
.subai-exp-main-panel > .subai-section-title,
.subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    height: var(--subai-title-height) !important;
    min-height: var(--subai-title-height) !important;
    max-height: var(--subai-title-height) !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}
.subai-exp-side-title-spacer {
    display: block !important;
    flex: 1 1 auto !important;
}
.subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 6px 24px !important;
    font-size: 15px !important;
    line-height: 1 !important;
    border-radius: 999px !important;
    color: #5b8def !important;
    background: transparent !important;
    border: 1px solid rgba(91, 141, 239, .22) !important;
    box-shadow: none !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
.subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}
.subai-game-experience,
.subai-exp-hot-panel-card .subai-exp-right {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    overflow: hidden !important;
}
.subai-game-experience {
    padding: 16px 20px !important;
}
.subai-exp-hot-panel-card .subai-exp-right {
    padding: 12px 14px 10px 14px !important;
    display: flex !important;
    flex-direction: column !important;
}

/* 左右 TAB 统一：同高度、同字号、同胶囊样式 */
.subai-exp-tab-left,
.subai-exp-tab-right .hot-tabs {
    min-height: 42px !important;
    height: 42px !important;
    max-height: 42px !important;
    padding: 5px !important;
    border-radius: 16px !important;
    background: #f3f6fc !important;
    border: 1px solid #e7edf8 !important;
    box-sizing: border-box !important;
}
.subai-exp-tab-left {
    width: 100% !important;
    margin: 0 0 12px 0 !important;
    flex: 0 0 42px !important;
    overflow: hidden !important;
}
.subai-exp-tab-right {
    width: 100% !important;
    flex: 0 0 42px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.subai-exp-tab-left .tab-bar,
.subai-exp-tab-right .hot-tabs {
    display: flex !important;
    align-items: stretch !important;
    gap: 4px !important;
    width: 100% !important;
}
.subai-exp-tab-left .tab-bar {
    height: 30px !important;
    min-width: 0 !important;
    flex-wrap: nowrap !important;
}
.subai-exp-tab-right .hot-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.subai-exp-tab-left .tab-item,
.subai-exp-tab-right .hot-tab {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 5px !important;
    border-radius: 999px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: #667085 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    letter-spacing: -0.25px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
}
.subai-exp-tab-left .tab-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}
.subai-exp-tab-left .tab-item:hover,
.subai-exp-tab-right .hot-tab:hover {
    background: #fff !important;
    color: #5b8def !important;
    border-color: rgba(91, 141, 239, .18) !important;
}
.subai-exp-tab-left .tab-item.active,
.subai-exp-tab-right .hot-tab.active {
    color: #fff !important;
    background: linear-gradient(135deg, #5b8def, #4a7ad4) !important;
    border-color: #5b8def !important;
    box-shadow: 0 5px 14px rgba(91, 141, 239, .26) !important;
}

/* 右侧热门：固定 628 总高内完整容纳 10 条；不足时不拉伸，紧贴顶部自然留空 */
.subai-exp-hot-panels {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
    display: block !important;
    padding-top: 0 !important;
}
.subai-exp-hot-panel {
    display: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
}
.subai-exp-hot-panel.active {
    display: block !important;
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    justify-content: flex-start !important;
    align-content: start !important;
}
.subai-exp-hot-item {
    display: flex !important;
    align-items: center !important;
    flex: 0 0 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 4px 3px !important;
    border-radius: 7px !important;
    box-sizing: border-box !important;
}
.subai-exp-hot-rank {
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
    font-size: 11px !important;
    border-radius: 6px !important;
}
.subai-exp-hot-info {
    padding-left: 7px !important;
    min-width: 0 !important;
}
.subai-exp-hot-info .hot-name {
    font-size: 12px !important;
    line-height: 1.15 !important;
    margin-bottom: 3px !important;
}
.subai-exp-hot-info .subai-exp-game-meta {
    font-size: 10px !important;
    line-height: 1 !important;
    gap: 8px !important;
}
.subai-exp-hot-action {
    margin-left: 5px !important;
}
.subai-exp-hot-action .btn-sm {
    padding: 3px 10px !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    border-radius: 5px !important;
}

/* 左侧内容卡片底部留出视觉呼吸感，避免贴住下面模块标题 */
.subai-exp-left {
    padding: 8px 14px 12px 14px !important;
    overflow: hidden !important;
}

/* 必玩大作：总高 769 不变，增大卡片与间距，压缩指示器区域空白 */
.subai-must-module {
    padding: 18px 26px 30px 26px !important;
    overflow: hidden !important;
}
.subai-must-carousel-wrap {
    height: 100% !important;
    min-height: 0 !important;
    padding-top: 0 !important;
}
.subai-must-carousel {
    height: 100% !important;
    min-height: 0 !important;
    padding: 8px 12px 30px 12px !important;
    box-sizing: border-box !important;
}
.subai-must-track {
    height: 100% !important;
    min-height: 0 !important;
}
.subai-must-page {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    grid-auto-rows: 190px !important;
    gap: 18px !important;
    align-items: start !important;
    align-content: start !important;
}
.subai-must-card {
    height: 190px !important;
    min-height: 190px !important;
    max-height: 190px !important;
    display: flex !important;
    flex-direction: column !important;
    align-self: start !important;
}
.subai-must-card .cover {
    height: 120px !important;
    min-height: 120px !important;
    flex: 0 0 120px !important;
}
.subai-must-card .info {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding: 9px 12px 10px 12px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}
.subai-must-card .info h3 {
    font-size: 14px !important;
    line-height: 1.35 !important;
    min-height: 38px !important;
    max-height: 40px !important;
    margin: 0 0 4px 0 !important;
    -webkit-line-clamp: 2 !important;
}
.subai-must-card .info .meta {
    min-height: 16px !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
}
.subai-must-dots {
    bottom: 8px !important;
}
.subai-must-arrow {
    top: calc(50% - 8px) !important;
}

/* 暗色模式同步 */
body.dark-theme .subai-exp-tab-left,
body.dark-theme .subai-exp-tab-right .hot-tabs,
body.night .subai-exp-tab-left,
body.night .subai-exp-tab-right .hot-tabs {
    background: rgba(255,255,255,.035) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}
body.dark-theme .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more,
body.night .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more {
    color: #8fb0ff !important;
    background: transparent !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.12)) !important;
}
body.dark-theme .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more:hover,
body.night .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}

@media (max-width: 900px) {
    .subai-exp-block,
    .subai-exp-layout,
    .subai-exp-main-panel,
    .subai-exp-hot-panel-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
    .subai-exp-main-panel,
    .subai-exp-hot-panel-card {
        display: flex !important;
    }
    .subai-exp-main-panel > .subai-section-title,
    .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
        height: var(--subai-title-height) !important;
        min-height: var(--subai-title-height) !important;
        max-height: none !important;
    }
    .subai-exp-hot-item {
        height: auto !important;
        min-height: 44px !important;
        max-height: none !important;
        flex: 0 0 auto !important;
    }
    .subai-must-module,
    .subai-must-carousel,
    .subai-must-carousel-wrap,
    .subai-must-track {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
    .subai-must-page {
        grid-auto-rows: auto !important;
        gap: 14px !important;
    }
    .subai-must-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
}

@media (max-width: 600px) {
    .subai-exp-tab-left,
    .subai-exp-tab-right .hot-tabs {
        height: auto !important;
        max-height: none !important;
    }
    .subai-exp-tab-left .tab-bar {
        flex-wrap: wrap !important;
        height: auto !important;
    }
    .subai-exp-tab-left .tab-item,
    .subai-exp-tab-right .hot-tab {
        font-size: 11px !important;
        padding: 0 4px !important;
    }
}


/* =============================================
   Final hard reset v7：游戏体验 628 等高对齐、10条铺满、必玩大作收窄边距
   ============================================= */
/* 游戏体验：左右两栏均为 628px，总高包含标题/按钮行；白卡底部强制平齐 */
.subai-exp-block.subai-section-block {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    margin-bottom: 46px !important;
    overflow: visible !important;
}
.subai-exp-block .subai-exp-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 380px !important;
    column-gap: 20px !important;
    row-gap: 0 !important;
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    align-items: stretch !important;
    overflow: visible !important;
}
.subai-exp-block .subai-exp-main-panel,
.subai-exp-block .subai-exp-hot-panel-card {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    display: grid !important;
    grid-template-rows: 42px 568px !important;
    row-gap: 18px !important;
    align-items: stretch !important;
    align-content: stretch !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}
.subai-exp-block .subai-exp-hot-panel-card {
    width: 380px !important;
}
.subai-exp-block .subai-exp-main-panel > .subai-section-title,
.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    grid-row: 1 !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
}
.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    justify-content: flex-end !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 3 !important;
}
.subai-exp-block .subai-exp-side-title-spacer {
    display: none !important;
}
.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 18px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    line-height: 32px !important;
    font-weight: 600 !important;
    color: #5b8def !important;
    background: transparent !important;
    border: 1px solid rgba(91,141,239,.25) !important;
    box-shadow: none !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    position: relative !important;
    z-index: 5 !important;
}
.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}
.subai-exp-block .subai-game-experience,
.subai-exp-block .subai-exp-hot-panel-card .subai-exp-right {
    grid-row: 2 !important;
    height: 568px !important;
    min-height: 568px !important;
    max-height: 568px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    background: #fff !important;
    border-radius: 16px !important;
    border: 1px solid #eef3fc !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.06) !important;
    overflow: hidden !important;
    align-self: stretch !important;
}
.subai-exp-block .subai-exp-tab-left,
.subai-exp-block .subai-exp-tab-right {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    flex: 0 0 42px !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-tab-left .tab-bar,
.subai-exp-block .subai-exp-tab-right .hot-tabs {
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    width: 100% !important;
    padding: 5px !important;
    border-radius: 16px !important;
    background: #f3f6fc !important;
    border: 1px solid #e7edf8 !important;
    display: flex !important;
    align-items: stretch !important;
    gap: 4px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-tab-right .hot-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.subai-exp-block .subai-exp-tab-left .tab-item,
.subai-exp-block .subai-exp-tab-right .hot-tab {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 0 5px !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    line-height: 30px !important;
    font-weight: 600 !important;
    letter-spacing: -0.25px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
    color: #667085 !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}
.subai-exp-block .subai-exp-tab-left .tab-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}
.subai-exp-block .subai-exp-tab-left .tab-item:hover,
.subai-exp-block .subai-exp-tab-right .hot-tab:hover {
    background: #fff !important;
    color: #5b8def !important;
    border-color: rgba(91,141,239,.18) !important;
}
.subai-exp-block .subai-exp-tab-left .tab-item.active,
.subai-exp-block .subai-exp-tab-right .hot-tab.active {
    color: #fff !important;
    background: linear-gradient(135deg, #5b8def, #4a7ad4) !important;
    border-color: #5b8def !important;
    box-shadow: 0 5px 14px rgba(91,141,239,.26) !important;
}
.subai-exp-block .subai-exp-left,
.subai-exp-block .subai-exp-hot-panels {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-hot-panel {
    display: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
}
.subai-exp-block .subai-exp-hot-panel.active {
    display: block !important;
}
.subai-exp-block .subai-exp-hot-panel.active.is-full {
    display: grid !important;
    grid-template-rows: repeat(10, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    align-content: stretch !important;
}
.subai-exp-block .subai-exp-hot-panel.active:not(.is-full) {
    display: block !important;
}
.subai-exp-block .subai-exp-hot-item {
    display: flex !important;
    align-items: center !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 4px 3px !important;
    box-sizing: border-box !important;
    border-radius: 7px !important;
    flex: 0 0 auto !important;
}
.subai-exp-block .subai-exp-hot-panel.is-full .subai-exp-hot-item {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: none !important;
    padding: 3px 3px !important;
}
.subai-exp-block .subai-exp-hot-info .hot-name {
    font-size: 12px !important;
    line-height: 1.12 !important;
    margin-bottom: 2px !important;
}
.subai-exp-block .subai-exp-hot-info .subai-exp-game-meta {
    font-size: 10px !important;
    line-height: 1 !important;
    gap: 6px !important;
}
.subai-exp-block .subai-exp-hot-action .btn-sm {
    height: 23px !important;
    line-height: 23px !important;
    padding: 0 9px !important;
    font-size: 11px !important;
    border-radius: 6px !important;
}

/* 必玩大作：减少内容区左右留白，不改变每行卡片数量 */
.subai-must-module {
    padding-left: 12px !important;
    padding-right: 12px !important;
}
.subai-must-carousel {
    padding-left: 4px !important;
    padding-right: 4px !important;
    padding-bottom: 24px !important;
}
.subai-must-page {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 18px !important;
    grid-auto-rows: 198px !important;
}
.subai-must-card {
    height: 198px !important;
    min-height: 198px !important;
    max-height: 198px !important;
}
.subai-must-card .cover {
    height: 120px !important;
    min-height: 120px !important;
    flex-basis: 120px !important;
}
.subai-must-card .info {
    padding: 9px 11px 9px 11px !important;
}
.subai-must-card .info h3 {
    font-size: 14px !important;
    line-height: 1.35 !important;
    min-height: 38px !important;
    max-height: 40px !important;
    -webkit-line-clamp: 2 !important;
}
.subai-must-dots {
    bottom: 6px !important;
}

body.dark-theme .subai-exp-block .subai-game-experience,
body.dark-theme .subai-exp-block .subai-exp-hot-panel-card .subai-exp-right,
body.night .subai-exp-block .subai-game-experience,
body.night .subai-exp-block .subai-exp-hot-panel-card .subai-exp-right {
    background: var(--subai-dark-card-bg, #1f232b) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}
body.dark-theme .subai-exp-block .subai-exp-tab-left .tab-bar,
body.dark-theme .subai-exp-block .subai-exp-tab-right .hot-tabs,
body.night .subai-exp-block .subai-exp-tab-left .tab-bar,
body.night .subai-exp-block .subai-exp-tab-right .hot-tabs {
    background: rgba(255,255,255,.035) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}

@media (max-width: 900px) {
    .subai-exp-block.subai-section-block,
    .subai-exp-block .subai-exp-layout,
    .subai-exp-block .subai-exp-main-panel,
    .subai-exp-block .subai-exp-hot-panel-card,
    .subai-exp-block .subai-game-experience,
    .subai-exp-block .subai-exp-hot-panel-card .subai-exp-right {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
    .subai-exp-block .subai-exp-layout {
        grid-template-columns: 1fr !important;
        row-gap: 20px !important;
    }
    .subai-exp-block .subai-exp-main-panel,
    .subai-exp-block .subai-exp-hot-panel-card {
        grid-template-rows: auto auto !important;
    }
    .subai-exp-block .subai-exp-hot-panel-card {
        width: 100% !important;
    }
    .subai-exp-block .subai-exp-hot-panel.active.is-full {
        display: block !important;
    }
    .subai-exp-block .subai-exp-hot-panel.is-full .subai-exp-hot-item {
        height: auto !important;
        min-height: 44px !important;
    }
}


/* ===== Final v8 alignment / spacing fixes ===== */
:root {
    --subai-card-side-gap: 16px;
    --subai-title-gap: 6px;
    --subai-title-font: 20px;
    --subai-title-bar-h: 16px;
}

.subai-section-block,
.subai-today-wrapper,
.subai-must-block,
.subai-special-block {
    margin-bottom: 32px !important;
}

.subai-section-title {
    min-height: 40px !important;
}

.subai-section-title.has-accent {
    padding-left: 10px !important;
}

.subai-section-title.has-accent::before {
    left: 0 !important;
    width: 4px !important;
    height: var(--subai-title-bar-h) !important;
    border-radius: 3px !important;
}

.subai-section-title h2,
.subai-section-title .title-text,
.subai-tool-title.subai-section-title span {
    font-size: var(--subai-title-font) !important;
    line-height: 1.2 !important;
}

.subai-exp-block.subai-section-block {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    margin-bottom: 32px !important;
}

.subai-exp-block .subai-exp-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 380px !important;
    column-gap: 20px !important;
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    align-items: stretch !important;
}

.subai-exp-block .subai-exp-main-panel,
.subai-exp-block .subai-exp-hot-panel-card {
    height: 628px !important;
    min-height: 628px !important;
    max-height: 628px !important;
    display: grid !important;
    grid-template-rows: 40px 570px !important;
    row-gap: 18px !important;
    align-items: stretch !important;
    align-content: stretch !important;
    overflow: visible !important;
}

.subai-exp-block .subai-exp-hot-panel-card {
    width: 380px !important;
}

.subai-exp-block .subai-exp-main-panel > .subai-section-title,
.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
}

.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title.subai-section-title {
    justify-content: flex-end !important;
}

.subai-exp-block .subai-exp-hot-panel-card > .subai-exp-side-title .subai-btn-more {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 22px !important;
    font-size: 14px !important;
    line-height: 34px !important;
    border-radius: 999px !important;
}

.subai-exp-block .subai-game-experience,
.subai-exp-block .subai-exp-hot-panel-card .subai-exp-right,
.subai-special-module,
.subai-must-module,
.subai-today-left,
.subai-tool-card,
.subai-login-card {
    padding-left: var(--subai-card-side-gap) !important;
    padding-right: var(--subai-card-side-gap) !important;
}

.subai-exp-block .subai-game-experience,
.subai-exp-block .subai-exp-hot-panel-card .subai-exp-right {
    height: 570px !important;
    min-height: 570px !important;
    max-height: 570px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

.subai-exp-block .subai-exp-tab-left,
.subai-exp-block .subai-exp-tab-right {
    flex: 0 0 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 0 14px 0 !important;
}

.subai-exp-block .subai-exp-tab-left .tab-bar,
.subai-exp-block .subai-exp-tab-right .hot-tabs {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding: 4px !important;
    gap: 4px !important;
    border-radius: 14px !important;
}

.subai-exp-block .subai-exp-tab-left .tab-item,
.subai-exp-block .subai-exp-tab-right .hot-tab {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    font-size: 11px !important;
    line-height: 30px !important;
    padding: 0 4px !important;
    letter-spacing: -0.15px !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    overflow: hidden !important;
}

.subai-exp-block .subai-exp-tab-left .tab-item {
    flex: 1 1 0 !important;
}

.subai-exp-block .subai-exp-left,
.subai-exp-block .subai-exp-hot-panels {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.subai-exp-block .subai-exp-game-grid {
    height: 100% !important;
    min-height: 0 !important;
    align-content: stretch !important;
}

.subai-exp-block .subai-exp-hot-panel {
    height: 100% !important;
    min-height: 0 !important;
}

.subai-exp-block .subai-exp-hot-panel.active.is-full {
    display: grid !important;
    grid-template-rows: repeat(10, minmax(0, 1fr)) !important;
    gap: 0 !important;
}

.subai-exp-block .subai-exp-hot-item {
    border-radius: 8px !important;
}

.subai-exp-block .subai-exp-hot-panel.is-full .subai-exp-hot-item {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.subai-exp-block .subai-exp-hot-panel.active:not(.is-full) {
    display: block !important;
}

.subai-exp-block .subai-exp-hot-info .hot-name {
    font-size: 12px !important;
    line-height: 1.2 !important;
}

.subai-must-module {
    padding-top: 16px !important;
    padding-bottom: 18px !important;
}

.subai-must-carousel {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 18px !important;
}

.subai-must-page {
    gap: 16px !important;
    grid-auto-rows: 214px !important;
}

.subai-must-card {
    height: 214px !important;
    min-height: 214px !important;
    max-height: 214px !important;
}

.subai-must-card .cover {
    height: 132px !important;
    min-height: 132px !important;
    flex-basis: 132px !important;
}

.subai-must-card .info {
    padding: 10px 10px 9px 10px !important;
}

.subai-must-card .info h3 {
    font-size: 14px !important;
    line-height: 1.38 !important;
    min-height: 38px !important;
    max-height: 40px !important;
}

.subai-must-dots {
    bottom: 2px !important;
}

@media (max-width: 900px) {
    .subai-exp-block.subai-section-block,
    .subai-exp-block .subai-exp-layout,
    .subai-exp-block .subai-exp-main-panel,
    .subai-exp-block .subai-exp-hot-panel-card,
    .subai-exp-block .subai-game-experience,
    .subai-exp-block .subai-exp-hot-panel-card .subai-exp-right {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }
    .subai-exp-block .subai-exp-layout {
        grid-template-columns: 1fr !important;
        row-gap: 20px !important;
    }
    .subai-exp-block .subai-exp-main-panel,
    .subai-exp-block .subai-exp-hot-panel-card {
        grid-template-rows: auto auto !important;
    }
    .subai-exp-block .subai-exp-hot-panel-card {
        width: 100% !important;
    }
}


/* ===== Final v9 micro fixes ===== */
:root {
    --subai-card-side-gap: 16px;
}

/* 标题竖杠与文字间距统一，修复游戏体验标题过近 */
.subai-section-title.has-accent {
    padding-left: 16px !important;
}
.subai-section-title.has-accent::before {
    left: 0 !important;
    width: 4px !important;
    height: 16px !important;
}

/* 今日更新内容卡片左右内边距统一为 16px */
.subai-today-left,
.subai-today-module .subai-today-left,
.subai-today-list-area .subai-today-left {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
}

/* 在线工具卡片仍统一左右内边距，但登录卡片恢复原样 */
.subai-tool-card {
    padding-left: 16px !important;
    padding-right: 16px !important;
}
.subai-login-card {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 游戏体验左右两侧 TAB 文字放大到 12px，并继续保证一行完整显示 */
.subai-exp-block .subai-exp-tab-left .tab-item,
.subai-exp-block .subai-exp-tab-right .hot-tab {
    font-size: 12px !important;
    line-height: 30px !important;
    padding: 0 3px !important;
    letter-spacing: -0.2px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
}

/* 左侧 tab 更紧凑，避免文字被截断 */
.subai-exp-block .subai-exp-tab-left .tab-bar {
    gap: 3px !important;
    padding: 4px !important;
}
.subai-exp-block .subai-exp-tab-left .tab-item {
    min-width: 0 !important;
    flex: 1 1 0 !important;
}

/* 右侧热门 tab 同步放大，但保持三栏完整显示 */
.subai-exp-block .subai-exp-tab-right .hot-tabs {
    gap: 3px !important;
    padding: 4px !important;
}

@media (max-width: 1200px) {
    .subai-exp-block .subai-exp-tab-left .tab-item,
    .subai-exp-block .subai-exp-tab-right .hot-tab {
        font-size: 11px !important;
        padding: 0 2px !important;
    }
}


/* ===== Final v10 hard fixes: game title real accent + today spacing ===== */
/* 游戏体验标题改为真实竖杠结构，确保竖杠和文字严格 6px 间距 */
.subai-exp-title.subai-section-title.has-accent.subai-real-accent-title {
    padding-left: 0 !important;
    gap: 6px !important;
    justify-content: flex-start !important;
    align-items: center !important;
}
.subai-exp-title.subai-section-title.has-accent.subai-real-accent-title::before {
    display: none !important;
    content: none !important;
}
.subai-exp-title .subai-title-accent {
    display: inline-block !important;
    flex: 0 0 4px !important;
    width: 4px !important;
    height: 16px !important;
    min-width: 4px !important;
    max-width: 4px !important;
    border-radius: 3px !important;
    background: #5b8def !important;
    margin: 0 !important;
    padding: 0 !important;
}
.subai-exp-title .title-text {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 今日更新：真正减少 20 条文章列表到白色大卡片左右边缘的距离 */
.subai-today-module {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
}
.subai-today-module .today-list-area {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}
.subai-today-module .subai-today-left,
.subai-today-left#newsList {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}
.subai-today-module .subai-news-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
.subai-today-module .subai-news-item {
    padding-left: 2px !important;
    padding-right: 2px !important;
    box-sizing: border-box !important;
}

/* 登录卡片继续恢复原样，不参与统一内边距 */
.subai-login-card {
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ===== Final v11: restore today list behavior + unify title accent ===== */

/* 所有模块标题统一使用同一套伪元素竖杠 */
.subai-section-title.has-accent {
    padding-left: 16px !important; /* 4px 竖杠 + 6px 间距 + 6px 安全留白 */
    position: relative !important;
}

.subai-section-title.has-accent::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 4px !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    transform: translateY(-50%) !important;
    background: #5b8def !important;
    border-radius: 3px !important;
}

/* 禁止游戏体验标题再使用单独真实竖杠，避免和其它标题不一致 */
.subai-exp-title .subai-title-real-bar,
.subai-exp-title .subai-exp-title-bar {
    display: none !important;
}

/* 游戏体验标题完全回到公共标题布局 */
.subai-exp-title.subai-section-title.has-accent {
    display: flex !important;
    align-items: center !important;
    padding-left: 16px !important;
}

/* 今日更新：只调整外层白色卡片左右留白，不改变内部列表结构和 hover 交互 */
.subai-today-module {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

/* 撤销 v10 对今日更新内部列表的清零/重排影响 */
.subai-today-left,
.subai-today-list-area,
.subai-today-list,
.subai-today-list ul,
.subai-today-list .today-list,
.subai-today-post-list {
    margin-left: initial;
    margin-right: initial;
}

/* 今日更新内部列表恢复原先自身排版，不再被统一 padding 强行改动 */
.subai-today-left {
    padding-left: initial !important;
    padding-right: initial !important;
}

.subai-today-list-area {
    padding-left: initial !important;
    padding-right: initial !important;
}

/* 如果主题列表是 grid/flex，保留原 hover 和原单条样式，只保证不被 v10 清空间距 */
.subai-today-module .subai-today-left > *:first-child {
    margin-left: 0;
}

.subai-today-module .subai-today-left > *:last-child {
    margin-right: 0;
}

/* 登录卡片继续不额外加左右间距 */
.subai-login-card {
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ===== Final v12: title accent truly unified + today list restored ===== */

/* 游戏体验标题不再拥有任何独立竖杠结构，和必玩大作/游戏专题共用同一套公共标题竖杠 */
.subai-exp-title.subai-section-title.has-accent {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    padding-left: 16px !important;
    gap: 16px !important;
}
.subai-exp-title.subai-section-title.has-accent::before,
.subai-must-title.subai-section-title.has-accent::before,
.subai-special-title.subai-section-title.has-accent::before,
.subai-section-title.has-accent::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 4px !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    transform: translateY(-50%) !important;
    background: #5b8def !important;
    border-radius: 3px !important;
}
.subai-exp-title .subai-title-accent,
.subai-exp-title .subai-title-real-bar,
.subai-exp-title .subai-exp-title-bar {
    display: none !important;
}
.subai-exp-title .title-text {
    margin: 0 !important;
    padding: 0 !important;
}

/* 今日更新：外层白色卡片只保留左右 16px，内部列表恢复原始排列和交互 */
.subai-today-module {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
}
.subai-today-module .subai-today-list-area,
.subai-today-module .today-list-area {
    flex: 1 !important;
    overflow: hidden !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: -8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.subai-today-module .subai-today-left,
.subai-today-left#newsList {
    height: 100% !important;
    background: #fafcff !important;
    border-radius: 12px !important;
    padding: 6px 16px 2px 16px !important;
    border: 1px solid #eef3fc !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.subai-today-module .subai-news-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 20px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
    box-sizing: border-box !important;
}
.subai-today-module .subai-news-item {
    display: flex !important;
    align-items: center !important;
    padding: 6px 2px !important;
    border-bottom: 1px solid #edf2f9 !important;
    min-height: 44px !important;
    transition: all 0.2s ease !important;
    border-radius: 4px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}
.subai-today-module .subai-news-item:hover {
    background: #fff !important;
    box-shadow: 0 2px 10px rgba(91, 141, 239, 0.06) !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}
.subai-today-module .subai-news-item:nth-last-child(2),
.subai-today-module .subai-news-item:last-child {
    border-bottom: none !important;
}

/* 暗色模式下今日更新内层列表恢复暗色卡片效果 */
body.dark-theme .subai-today-module .subai-today-left,
body.night .subai-today-module .subai-today-left {
    background: rgba(255,255,255,.035) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}

/* 登录卡片继续不加统一左右内边距 */
.subai-login-card {
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ===== Final v13: must-play dots reserve safe space ===== */
/* 必玩大作：保持当前卡片高度不变，给底部指示器单独预留空间 */
.subai-must-module {
    padding-bottom: 34px !important;
    overflow: visible !important;
}

.subai-must-carousel-wrap {
    overflow: visible !important;
    padding-bottom: 30px !important;
}

.subai-must-carousel {
    overflow: visible !important;
    padding-bottom: 34px !important;
}

/* 卡片高度保持 v12 当前设置，不再缩小 */
.subai-must-page {
    padding-bottom: 0 !important;
    align-content: start !important;
}

/* 指示器独立放到卡片下方，避免被卡片压住 */
.subai-must-dots {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 8px !important;
    transform: translateX(-50%) !important;
    z-index: 20 !important;
    pointer-events: auto !important;
    margin: 0 !important;
}

/* 防止指示器被其它层级遮挡 */
.subai-must-carousel,
.subai-must-carousel-wrap,
.subai-must-module {
    position: relative !important;
}

.subai-must-track {
    position: relative !important;
    z-index: 1 !important;
}

.subai-must-dots .dot,
.subai-must-dot {
    position: relative !important;
    z-index: 21 !important;
}

/* ===== Final v14: make must-play indicators visible in their own footer ===== */
/* v13 把指示器继续放在 absolute bottom，受固定高度/层级影响会看不见；这里改为正常文档流 footer */
.subai-must-block {
    height: auto !important;
    min-height: 769px !important;
    max-height: none !important;
    overflow: visible !important;
}

.subai-must-module,
.subai-must-carousel-wrap,
.subai-must-carousel {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

.subai-must-module {
    padding-bottom: 18px !important;
}

.subai-must-carousel-wrap {
    padding-bottom: 0 !important;
}

.subai-must-carousel {
    display: flex !important;
    flex-direction: column !important;
    padding-top: 8px !important;
    padding-bottom: 0 !important;
}

.subai-must-track {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
    position: relative !important;
    z-index: 1 !important;
}

.subai-must-page {
    padding-bottom: 0 !important;
    align-content: start !important;
}

/* 指示器独立成为卡片下方的 footer，不再依赖 absolute/bottom */
.subai-must-dots {
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    height: 18px !important;
    min-height: 18px !important;
    margin: 12px auto 0 auto !important;
    z-index: 30 !important;
    pointer-events: auto !important;
}

.subai-must-dot {
    display: inline-block !important;
    flex: 0 0 auto !important;
    position: relative !important;
    z-index: 31 !important;
}



/* ===== Final v15: 今日更新游戏列表暗夜模式适配 ===== */

/* 今日更新左侧大卡片暗夜模式 */
body.dark-theme .subai-today-module,
body.night .subai-today-module {
    background: var(--subai-dark-card-bg, #1f232b) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.22) !important;
}

/* 今日更新左侧列表容器暗夜模式 */
body.dark-theme .subai-today-left,
body.dark-theme .subai-today-list-area,
body.dark-theme .subai-today-list,
body.dark-theme .subai-today-post-list,
body.night .subai-today-left,
body.night .subai-today-list-area,
body.night .subai-today-list,
body.night .subai-today-post-list {
    background: transparent !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
}

/* 今日更新单条游戏列表暗夜模式 */
body.dark-theme .subai-today-left li,
body.dark-theme .subai-today-list-area li,
body.dark-theme .subai-today-post-list li,
body.dark-theme .subai-today-item,
body.dark-theme .subai-today-post-item,
body.dark-theme .subai-today-card,
body.night .subai-today-left li,
body.night .subai-today-list-area li,
body.night .subai-today-post-list li,
body.night .subai-today-item,
body.night .subai-today-post-item,
body.night .subai-today-card {
    background: rgba(255,255,255,.035) !important;
    border-color: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.86) !important;
}

/* 今日更新单条 hover 暗夜模式 */
body.dark-theme .subai-today-left li:hover,
body.dark-theme .subai-today-list-area li:hover,
body.dark-theme .subai-today-post-list li:hover,
body.dark-theme .subai-today-item:hover,
body.dark-theme .subai-today-post-item:hover,
body.dark-theme .subai-today-card:hover,
body.night .subai-today-left li:hover,
body.night .subai-today-list-area li:hover,
body.night .subai-today-post-list li:hover,
body.night .subai-today-item:hover,
body.night .subai-today-post-item:hover,
body.night .subai-today-card:hover {
    background: rgba(91,141,239,.12) !important;
    border-color: rgba(91,141,239,.28) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.26) !important;
}

/* 今日更新标题、链接、摘要、meta 暗夜模式 */
body.dark-theme .subai-today-left a,
body.dark-theme .subai-today-list-area a,
body.dark-theme .subai-today-post-list a,
body.night .subai-today-left a,
body.night .subai-today-list-area a,
body.night .subai-today-post-list a {
    color: rgba(255,255,255,.88) !important;
}

body.dark-theme .subai-today-left a:hover,
body.dark-theme .subai-today-list-area a:hover,
body.dark-theme .subai-today-post-list a:hover,
body.night .subai-today-left a:hover,
body.night .subai-today-list-area a:hover,
body.night .subai-today-post-list a:hover {
    color: #7aa2ff !important;
}

body.dark-theme .subai-today-left .title,
body.dark-theme .subai-today-left .post-title,
body.dark-theme .subai-today-left h3,
body.dark-theme .subai-today-list-area .title,
body.dark-theme .subai-today-list-area .post-title,
body.dark-theme .subai-today-list-area h3,
body.night .subai-today-left .title,
body.night .subai-today-left .post-title,
body.night .subai-today-left h3,
body.night .subai-today-list-area .title,
body.night .subai-today-list-area .post-title,
body.night .subai-today-list-area h3 {
    color: rgba(255,255,255,.90) !important;
}

body.dark-theme .subai-today-left .meta,
body.dark-theme .subai-today-left .desc,
body.dark-theme .subai-today-left .time,
body.dark-theme .subai-today-left .post-meta,
body.dark-theme .subai-today-list-area .meta,
body.dark-theme .subai-today-list-area .desc,
body.dark-theme .subai-today-list-area .time,
body.dark-theme .subai-today-list-area .post-meta,
body.night .subai-today-left .meta,
body.night .subai-today-left .desc,
body.night .subai-today-left .time,
body.night .subai-today-left .post-meta,
body.night .subai-today-list-area .meta,
body.night .subai-today-list-area .desc,
body.night .subai-today-list-area .time,
body.night .subai-today-list-area .post-meta {
    color: rgba(255,255,255,.54) !important;
}

/* 今日更新里的图标、标签、按钮暗夜模式 */
body.dark-theme .subai-today-left i,
body.dark-theme .subai-today-list-area i,
body.night .subai-today-left i,
body.night .subai-today-list-area i {
    color: rgba(255,255,255,.50) !important;
}

body.dark-theme .subai-today-left .badge,
body.dark-theme .subai-today-left .cat,
body.dark-theme .subai-today-left .tag,
body.dark-theme .subai-today-list-area .badge,
body.dark-theme .subai-today-list-area .cat,
body.dark-theme .subai-today-list-area .tag,
body.night .subai-today-left .badge,
body.night .subai-today-left .cat,
body.night .subai-today-left .tag,
body.night .subai-today-list-area .badge,
body.night .subai-today-list-area .cat,
body.night .subai-today-list-area .tag {
    background: rgba(91,141,239,.14) !important;
    color: #8fb0ff !important;
    border-color: rgba(91,141,239,.24) !important;
}

/* ===== Final v16: 今日更新真实列表结构暗夜模式强制适配 ===== */
/* 说明：今日更新实际条目是 .subai-news-item，需覆盖前面恢复白天样式时写入的 !important */

body.dark-theme .subai-today-module,
body.night .subai-today-module {
    background: var(--subai-dark-card-bg, #1f232b) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.22) !important;
}

body.dark-theme .subai-today-module .today-list-area,
body.dark-theme .subai-today-module .subai-today-list-area,
body.night .subai-today-module .today-list-area,
body.night .subai-today-module .subai-today-list-area {
    background: transparent !important;
}

body.dark-theme .subai-today-module .subai-today-left,
body.dark-theme .subai-today-left#newsList,
body.night .subai-today-module .subai-today-left,
body.night .subai-today-left#newsList {
    background: rgba(255,255,255,.035) !important;
    border-color: var(--subai-dark-card-border, rgba(255,255,255,.10)) !important;
    box-shadow: none !important;
}

body.dark-theme .subai-today-module .subai-news-grid,
body.night .subai-today-module .subai-news-grid {
    background: transparent !important;
}

body.dark-theme .subai-today-module .subai-news-item,
body.night .subai-today-module .subai-news-item {
    background: transparent !important;
    border-bottom-color: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.86) !important;
}

body.dark-theme .subai-today-module .subai-news-item:hover,
body.night .subai-today-module .subai-news-item:hover {
    background: rgba(91,141,239,.12) !important;
    border-bottom-color: rgba(91,141,239,.24) !important;
    box-shadow: 0 6px 16px rgba(0,0,0,.22) !important;
}

body.dark-theme .subai-today-module .subai-news-item .icon,
body.night .subai-today-module .subai-news-item .icon {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(255,255,255,.10) !important;
}

body.dark-theme .subai-today-module .subai-news-item .info .title,
body.dark-theme .subai-today-module .subai-news-item .info .title a,
body.night .subai-today-module .subai-news-item .info .title,
body.night .subai-today-module .subai-news-item .info .title a {
    color: rgba(255,255,255,.88) !important;
}

body.dark-theme .subai-today-module .subai-news-item .info .title a:hover,
body.night .subai-today-module .subai-news-item .info .title a:hover {
    color: #7aa2ff !important;
}

body.dark-theme .subai-today-module .subai-news-item .info .tag,
body.night .subai-today-module .subai-news-item .info .tag {
    color: #ff9b72 !important;
}

body.dark-theme .subai-today-module .subai-news-item .info .tag.gray,
body.night .subai-today-module .subai-news-item .info .tag.gray {
    color: rgba(255,255,255,.52) !important;
}

body.dark-theme .subai-today-module .subai-news-item .action .btn,
body.night .subai-today-module .subai-news-item .action .btn {
    color: rgba(255,255,255,.72) !important;
    background: transparent !important;
    border-color: rgba(255,255,255,.16) !important;
}

body.dark-theme .subai-today-module .subai-news-item .action .btn:hover,
body.night .subai-today-module .subai-news-item .action .btn:hover {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
}

body.dark-theme .subai-today-title .subai-update-stats,
body.night .subai-today-title .subai-update-stats {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(255,255,255,.10) !important;
    color: rgba(255,255,255,.72) !important;
}

body.dark-theme .subai-news-tabs,
body.night .subai-news-tabs {
    background: rgba(255,255,255,.045) !important;
    border-color: rgba(255,255,255,.10) !important;
}

body.dark-theme .subai-news-tabs .tab-btn,
body.night .subai-news-tabs .tab-btn {
    color: rgba(255,255,255,.68) !important;
}

body.dark-theme .subai-news-tabs .tab-btn.active,
body.night .subai-news-tabs .tab-btn.active {
    color: #fff !important;
    background: #5b8def !important;
}

/* =============================================
   V22 模块化最终响应式与兼容层
   目标：保留现有桌面端视觉，只集中管理移动端、平板端和最终覆盖规则
   ============================================= */

/* ---------- 公共：标题按钮 ---------- */
/* 移动端专用的游戏体验查看更多按钮：电脑端隐藏，避免出现两个查看更多 */
.subai-exp-mobile-more {
    display: none !important;
}

.subai-exp-mobile-more,
.subai-exp-mobile-more i,
.subai-exp-title .subai-btn-more,
.subai-exp-title .subai-btn-more i {
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
}

.subai-exp-mobile-more,
.subai-exp-title .subai-btn-more {
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: auto !important;
    min-width: max-content !important;
}

.subai-exp-mobile-more i,
.subai-exp-title .subai-btn-more i {
    display: inline-block !important;
    margin-left: 2px !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
}

/* ---------- 平板与窄屏公共释放固定高度 ---------- */
@media (max-width: 1024px) {
    .subai-section-block,
    .subai-today-wrapper,
    .subai-today-main,
    .subai-today-module,
    .subai-today-right,
    .subai-exp-block.subai-section-block,
    .subai-exp-block .subai-exp-layout,
    .subai-exp-block .subai-exp-main-panel,
    .subai-exp-block .subai-exp-hot-panel-card,
    .subai-exp-block .subai-game-experience,
    .subai-special-block,
    .subai-special-module,
    .subai-must-block,
    .subai-must-module,
    .subai-tool-section,
    .subai-tool-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .subai-section-block,
    .subai-today-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* =============================================
   今日更新：响应式
   ============================================= */
@media (max-width: 1024px) {
    .subai-today-wrapper {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
    }

    .subai-today-right {
        width: 100% !important;
        flex: none !important;
    }

    .subai-news-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .subai-news-item,
    .subai-news-item .info,
    .subai-news-item .title,
    .subai-news-item .title a {
        min-width: 0 !important;
        max-width: 100% !important;
    }
}

@media (max-width: 767px) {
    .subai-today-title {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 36px !important;
        max-height: none !important;
        margin-bottom: 12px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .subai-today-title .left {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        overflow: hidden !important;
    }

    .subai-news-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        padding: 0 0 2px 0 !important;
        margin: 0 !important;
    }

    .subai-news-tabs::-webkit-scrollbar {
        display: none !important;
    }

    .subai-news-tabs .tab-btn {
        flex: 0 0 auto !important;
        min-width: max-content !important;
        width: auto !important;
        white-space: nowrap !important;
        font-size: 13px !important;
        padding: 7px 12px !important;
        line-height: 1 !important;
    }

    .subai-update-stats {
        flex: 0 0 auto !important;
        align-self: center !important;
        width: auto !important;
        max-width: 128px !important;
        min-width: max-content !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        text-align: right !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .subai-today-module {
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 14px !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }

    .today-list-area,
    .subai-today-left,
    #newsList {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .subai-news-grid,
    .subai-news-grid[style] {
        width: 100% !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        height: auto !important;
    }

    .subai-news-item {
        min-height: 58px !important;
        height: auto !important;
        padding: 8px !important;
        border-radius: 10px !important;
        overflow: visible !important;
    }

    .subai-news-item .icon {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        flex: 0 0 44px !important;
    }

    .subai-news-item .info {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .subai-news-item .info .title,
    .subai-news-item .info .title a {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        line-height: 1.35 !important;
        font-size: 13px !important;
    }

    .subai-news-item .action .btn {
        height: 28px !important;
        line-height: 28px !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }

    .subai-news-footer {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        margin-top: 12px !important;
    }

    /* 手机端今日更新最多显示两页 */
    .subai-pagination a:nth-child(n+3) {
        display: none !important;
    }
}

/* =============================================
   在线工具 / 登录卡：响应式
   ============================================= */
@media (max-width: 767px) {
    .subai-tool-title {
        display: none !important;
    }

    .subai-login-card {
        display: none !important;
    }

    .subai-tool-section {
        width: 100% !important;
        height: auto !important;
    }

    .subai-tool-card {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
        padding: 14px !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }

    .subai-tool-grid {
        display: grid !important;
        grid-template-columns: repeat(4, 66px) !important;
        justify-content: center !important;
        justify-items: center !important;
        align-items: start !important;
        width: auto !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        gap: 12px 8px !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .subai-tool-grid a {
        width: 66px !important;
        max-width: 66px !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    .subai-tool-grid a img {
        width: 38px !important;
        height: 38px !important;
    }

    .subai-tool-grid a span {
        display: block !important;
        width: 100% !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

@media (max-width: 380px) {
    .subai-tool-grid {
        grid-template-columns: repeat(4, 58px) !important;
        gap: 10px 6px !important;
    }

    .subai-tool-grid a {
        width: 58px !important;
        max-width: 58px !important;
    }

    .subai-tool-grid a span {
        font-size: 11px !important;
    }
}

/* =============================================
   游戏体验：响应式
   ============================================= */
@media (max-width: 1024px) {
    .subai-exp-mobile-more {
        display: inline-flex !important;
    }

    .subai-exp-block .subai-exp-layout,
    .subai-exp-block .subai-exp-main-panel {
        display: block !important;
    }

    .subai-exp-block .subai-exp-hot-panel-card {
        display: none !important;
    }

    .subai-exp-block .subai-exp-title.subai-section-title {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        margin-bottom: 14px !important;
        min-height: 36px !important;
    }

    .subai-exp-block .subai-exp-title .title-text {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }

    .subai-exp-block .subai-game-experience {
        padding: 14px !important;
        overflow: visible !important;
    }

    .subai-exp-block .subai-exp-tab-left,
    .subai-exp-block .subai-exp-tab-left .tab-bar {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .subai-exp-block .subai-exp-tab-left .tab-bar {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 6px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    .subai-exp-block .subai-exp-tab-left .tab-bar::-webkit-scrollbar {
        display: none !important;
    }

    .subai-exp-block .subai-exp-tab-left .tab-item {
        flex: 0 0 auto !important;
        min-width: max-content !important;
        width: auto !important;
        height: 32px !important;
        min-height: 32px !important;
        max-height: 32px !important;
        padding: 0 12px !important;
        font-size: 13px !important;
        line-height: 32px !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .subai-exp-block .subai-exp-game-grid.active {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        height: auto !important;
    }

    .subai-exp-block .subai-exp-game-item {
        min-width: 0 !important;
        height: auto !important;
        min-height: 76px !important;
    }

    .subai-exp-block .subai-exp-game-info .title,
    .subai-exp-block .subai-exp-game-info .title a {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        line-height: 1.35 !important;
    }
}

@media (max-width: 767px) {
    .subai-exp-block .subai-exp-title.subai-section-title {
        margin-bottom: 12px !important;
    }

    .subai-exp-mobile-more {
        flex: 0 0 auto !important;
        min-width: max-content !important;
        max-width: none !important;
        white-space: nowrap !important;
    }

    .subai-exp-block .subai-game-experience {
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .subai-exp-block .subai-exp-tab-left {
        margin-bottom: 10px !important;
    }

    .subai-exp-block .subai-exp-tab-left .tab-bar {
        border-radius: 13px !important;
        padding: 5px !important;
        gap: 7px !important;
    }

    .subai-exp-block .subai-exp-game-grid.active {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .subai-exp-block .subai-exp-game-item {
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) auto !important;
        gap: 10px !important;
        min-height: 66px !important;
        padding: 8px !important;
    }

    .subai-exp-block .subai-exp-game-icon {
        width: 48px !important;
        height: 48px !important;
    }

    .subai-exp-block .subai-exp-game-info .title,
    .subai-exp-block .subai-exp-game-info .title a {
        font-size: 13px !important;
    }

    .subai-exp-game-action .btn {
        height: 28px !important;
        line-height: 28px !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 380px) {
    .subai-news-item {
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
    }

    .subai-news-item .icon {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
    }

    .subai-exp-block .subai-exp-game-item {
        grid-template-columns: 44px minmax(0, 1fr) auto !important;
    }

    .subai-exp-block .subai-exp-game-icon {
        width: 44px !important;
        height: 44px !important;
    }
}

/* =============================================
   必玩大作：响应式
   ============================================= */
@media (max-width: 1024px) {
    .subai-must-page {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 14px !important;
        grid-auto-rows: auto !important;
    }

    .subai-must-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .subai-must-card .info h3 {
        white-space: normal !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }
}

@media (max-width: 767px) {
    .subai-must-module {
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .subai-must-carousel,
    .subai-must-carousel-wrap {
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
    }

    .subai-must-page {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        grid-auto-rows: auto !important;
    }

    .subai-must-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        border-radius: 12px !important;
    }

    .subai-must-card .cover {
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 10 !important;
        flex-basis: auto !important;
    }

    .subai-must-card .info {
        padding: 8px !important;
    }

    .subai-must-card .info h3 {
        font-size: 13px !important;
        line-height: 1.35 !important;
        min-height: 36px !important;
        max-height: none !important;
        white-space: normal !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }

    .subai-must-card .info .meta {
        font-size: 11px !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    .subai-must-arrow {
        display: none !important;
    }

    .subai-must-dots {
        margin-top: 12px !important;
        position: static !important;
        transform: none !important;
    }
}

/* =============================================
   游戏专题：响应式
   ============================================= */
.subai-special-block .subai-special-module .subai-special-grid {
    display: grid !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    gap: 18px !important;
}

/* 电脑端：保持原来的 4 列视觉 */
@media (min-width: 1101px) {
    .subai-special-block .subai-special-module .subai-special-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

/* 宽折叠屏 / 小平板：空间够时 3 列 */
@media (min-width: 901px) and (max-width: 1100px) {
    .subai-special-block .subai-special-module .subai-special-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

/* 折叠屏 / 普通平板偏窄状态：2 列 */
@media (min-width: 568px) and (max-width: 900px) {
    .subai-special-block .subai-special-module .subai-special-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 14px !important;
    }
}

/* 苹果手机、安卓普通手机等窄屏：强制 1 列 */
@media (max-width: 567px) {
    .subai-special-block .subai-special-module .subai-special-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .subai-special-block .subai-special-module {
        padding: 12px !important;
    }
}

/* 游戏专题文字：不省略、不遮挡；允许正常换行展示完整信息 */
@media (max-width: 1100px) {
    .subai-special-block .subai-special-card {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .subai-special-block .subai-special-card .info {
        min-width: 0 !important;
        height: auto !important;
        overflow: visible !important;
    }

    .subai-special-block .subai-special-card .info h3,
    .subai-special-block .subai-special-card .info .desc {
        white-space: normal !important;
        word-break: break-word !important;
        overflow: visible !important;
        text-overflow: clip !important;
        max-height: none !important;
    }

    .subai-special-block .subai-special-card .info .desc {
        display: block !important;
        -webkit-line-clamp: unset !important;
        -webkit-box-orient: initial !important;
        min-height: 0 !important;
    }

    .subai-special-block .subai-special-card .info .bottom {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    .subai-special-block .subai-special-card .info .bottom .btn-view {
        white-space: nowrap !important;
        min-width: max-content !important;
    }
}

/* =============================================
   手机端公共标题尺寸
   ============================================= */
@media (max-width: 767px) {
    .subai-section-block,
    .subai-today-wrapper,
    .subai-exp-block.subai-section-block,
    .subai-must-block,
    .subai-special-block {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 22px !important;
    }

    .subai-section-title {
        min-height: 34px !important;
        margin-bottom: 12px !important;
        gap: 10px !important;
    }

    .subai-section-title h2,
    .subai-section-title .title-text,
    .subai-tool-title.subai-section-title span {
        font-size: 18px !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
    }

    .subai-section-title .subai-btn-more,
    .subai-exp-mobile-more {
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        line-height: 30px !important;
        border-radius: 999px !important;
        white-space: nowrap !important;
    }
}



/* ===== v34: 今日更新标题交互仿 XDGAME 列表 tit/link ===== */
.subai-today-module .subai-news-item .info .title {
    position: relative !important;
    overflow: hidden !important;
    flex: 1 1 auto !important;
    max-width: none !important;
}
.subai-today-module .subai-news-item .info .title a,
.subai-today-module .subai-news-item .info .title a.tit {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: inherit !important;
    text-decoration: none !important;
    transition: color .22s ease, transform .22s ease !important;
    will-change: transform !important;
}
.subai-today-module .subai-news-item .icon img {
    transition: transform .25s ease !important;
}
.subai-today-module .subai-news-item .action .btn,
.subai-today-module .subai-news-item .action .btn.link {
    opacity: .74 !important;
    transform: translateX(0) !important;
    transition: color .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease, opacity .22s ease, transform .22s ease !important;
}
.subai-today-module .subai-news-item:hover .info .title a,
.subai-today-module .subai-news-item:hover .info .title a.tit {
    color: #2f7df6 !important;
    transform: translateX(4px) !important;
}
.subai-today-module .subai-news-item:hover .icon img {
    transform: scale(1.06) !important;
}
.subai-today-module .subai-news-item:hover .action .btn,
.subai-today-module .subai-news-item:hover .action .btn.link {
    opacity: 1 !important;
    color: #fff !important;
    background: #2f7df6 !important;
    border-color: #2f7df6 !important;
    box-shadow: 0 6px 14px rgba(47,125,246,.20) !important;
    transform: translateX(2px) !important;
}
body.dark-theme .subai-today-module .subai-news-item:hover .info .title a,
body.dark-theme .subai-today-module .subai-news-item:hover .info .title a.tit,
body.night .subai-today-module .subai-news-item:hover .info .title a,
body.night .subai-today-module .subai-news-item:hover .info .title a.tit {
    color: #7aa2ff !important;
}
body.dark-theme .subai-today-module .subai-news-item:hover .action .btn,
body.dark-theme .subai-today-module .subai-news-item:hover .action .btn.link,
body.night .subai-today-module .subai-news-item:hover .action .btn,
body.night .subai-today-module .subai-news-item:hover .action .btn.link {
    color: #fff !important;
    background: #5b8def !important;
    border-color: #5b8def !important;
    box-shadow: 0 6px 14px rgba(91,141,239,.28) !important;
}
@media (hover: none) {
    .subai-today-module .subai-news-item:hover .info .title a,
    .subai-today-module .subai-news-item:hover .info .title a.tit,
    .subai-today-module .subai-news-item:hover .action .btn,
    .subai-today-module .subai-news-item:hover .action .btn.link {
        transform: none !important;
    }
}
@media (max-width: 767px) {
    .subai-today-module .subai-news-item .info .title a,
    .subai-today-module .subai-news-item .info .title a.tit {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        transform: none !important;
    }
}