/* ==========================================================================
   ui-enhance.css —— 追加式 UI 增强（不修改既有 style.css / apple-crystal-theme.css）
   - 本文件在 style.css / apple-crystal-theme.css 之后加载，仅做「叠加」增强：
     新增组件样式 + 三端断点补强；不改写既有选择器的既有属性。
   - 章节：
     1) 用户端「添加电影院」弹窗与教程
     2) 用户端资源仪表盘（紧凑）
     3) 三端适配补强 + 整站轻美化
     4) 仪表盘「逐接口资源数量明细」
     5) 用户端「JSON 数据提交」弹窗 + 后台「JSON 提交审核」/「JSON 接口有效性检查」
     6) 列表分页导航（首页电影列表 / 短剧列表）
     7) 影院质感整站精修（Dark Cinema：暖琥珀 + 冷青 + 炭黑）
     8) 底部导航菜单图标（内联 SVG，维语 RTL）
   ========================================================================== */

/* ========== 1) 用户端「添加电影院」弹窗 ========== */
.modal-content.cinema-modal {
    max-width: 360px;
    width: 90%;
    max-height: 86vh;
    overflow-y: auto;
    text-align: right;
    direction: rtl;
}

.cinema-hint {
    font-size: 11px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 8px 10px;
    margin-bottom: 12px;
    text-align: right;
}

.cinema-field {
    margin-bottom: 10px;
    text-align: right;
}

.cinema-field > label {
    display: block;
    font-size: 12px;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, 0.85);
}

.cinema-field .req,
.cinema-openid-note.req {
    color: #ff8a8a;
}

.cinema-openid-note {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.55);
}

.cinema-field input {
    width: 100%;
    box-sizing: border-box;
    padding: 9px 10px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(0, 0, 0, 0.25);
    color: #fff;
    font-size: 12px;
    outline: none;
    direction: ltr;
    text-align: left;
}

.cinema-field input:focus {
    border-color: #2fb8c6;
    box-shadow: 0 0 0 2px rgba(47,184,198, 0.22);
}

.cinema-field.need-openid input {
    border-color: rgba(255, 138, 138, 0.7);
}

.cinema-link-btn {
    margin-top: 6px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #e0a94a;
    border-radius: 10px;
    padding: 5px 10px;
    font-size: 11px;
    cursor: pointer;
}

.cinema-link-btn:hover {
    background: rgba(255, 255, 255, 0.2);
}

.cinema-buttons {
    flex-wrap: wrap;
    gap: 6px !important;
}

.cinema-tutorial-row {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 6px;
}

.cinema-result {
    margin: 8px 0;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 11px;
    line-height: 1.7;
    text-align: right;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.cinema-result.ok { border-color: rgba(46, 204, 113, 0.6); color: #b6f0c8; }
.cinema-result.warn { border-color: rgba(245, 166, 35, 0.6); color: #ffe0a3; }
.cinema-result.bad { border-color: rgba(231, 76, 60, 0.6); color: #ffb3ad; }
.cinema-result.loading { color: rgba(255, 255, 255, 0.75); }

.cinema-result-row {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.cinema-result-row > span {
    color: rgba(255, 255, 255, 0.6);
    flex-shrink: 0;
}

.cinema-result-row > b {
    word-break: break-all;
    text-align: left;
    direction: ltr;
}

.cinema-my-list {
    margin-top: 8px;
}

.cinema-my-title {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 6px;
}

.cinema-my-empty {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.55);
    padding: 10px;
    text-align: center;
}

.cinema-my-item {
    border-radius: 10px;
    padding: 7px 9px;
    margin-bottom: 6px;
    background: rgba(255, 255, 255, 0.05);
    border-right: 3px solid rgba(255, 255, 255, 0.2);
}

.cinema-my-item.ok { border-right-color: #34c98a; }
.cinema-my-item.warn { border-right-color: #e5a13a; }
.cinema-my-item.bad { border-right-color: #e05263; }

.cinema-my-name {
    font-size: 12px;
    word-break: break-all;
}

.cinema-my-meta {
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 2px;
}

.cinema-my-status { color: #e0a94a; }

.cinema-my-note {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.65);
    margin-top: 3px;
}

.cinema-tutorial-text {
    max-height: 55vh;
    overflow-y: auto;
    text-align: right;
}

.cinema-pre {
    white-space: pre-wrap;
    word-break: break-word;
    font-family: inherit;
    font-size: 12px;
    line-height: 1.9;
    margin: 0;
    text-align: right;
    direction: rtl;
}

.cinema-zh summary {
    cursor: pointer;
    font-size: 11px;
    color: #2fb8c6;
    margin-top: 10px;
}

.cinema-video-modal { max-width: 560px; }

.cinema-video-box { text-align: center; }

.cinema-video-title {
    font-size: 13px;
    margin-bottom: 8px;
    color: #e0a94a;
}

.cinema-video {
    width: 100%;
    max-height: 60vh;
    border-radius: 10px;
    background: #000;
}

.cinema-video-frame {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    border-radius: 10px;
    overflow: hidden;
    background: #000;
}

.cinema-video-frame > iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.cinema-video-desc {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 8px;
    text-align: right;
}

.cinema-video-tip {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 8px;
}

.cinema-video-tip a { color: #2fb8c6; }
/* ========== 2) 用户端资源仪表盘（紧凑） ==========
   位置：我的页面 · 功能列表上方（#health-dash）
   目标：一行三格、体积小、RTL、三端自适应；不改动既有任何选择器。 */

.health-dash {
    margin: 0 0 10px;
    padding: 8px 10px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.08);
    direction: rtl;
    text-align: right;
}

.health-dash-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 7px;
}

.health-dash-title {
    font-size: 12px;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.88);
    letter-spacing: 0;
}

.health-dash-title i { color: #2fb8c6; margin-left: 4px; }

.health-dash-btn {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: #2fb8c6;
    font-size: 11px;
    line-height: 1;
    cursor: pointer;
    transition: background .2s, transform .2s;
}

.health-dash-btn:hover { background: rgba(47,184,198, 0.22); }
.health-dash-btn.spinning i { animation: hd-spin 1s linear infinite; }
.health-dash-btn:disabled { opacity: .6; cursor: default; }

@keyframes hd-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.health-dash-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.health-dash-loading {
    grid-column: 1 / -1;
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
    padding: 8px 0;
}

.hd-cell {
    min-width: 0;
    padding: 6px 7px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.hd-cell-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px;
    margin-bottom: 4px;
}

.hd-cell-name {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.72);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hd-cell-name i { font-size: 9px; opacity: .8; margin-left: 3px; }

.hd-cell-total {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    line-height: 1;
    flex-shrink: 0;
}

.hd-cell-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 7px;
    font-size: 10.5px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.8);
}

.hd-s, .hd-lg { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }

.hd-s .dot, .hd-lg .dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    flex-shrink: 0;
}

.hd-s.ok .dot, .hd-lg.ok .dot { background: #2fb8c6; }
.hd-s.fail .dot, .hd-lg.fail .dot { background: #e05263; }
.hd-s.new .dot, .hd-lg.new .dot { background: #e0a94a; }
.hd-s.unk .dot, .hd-lg.unk .dot { background: rgba(255, 255, 255, 0.35); }

.hd-s.ok { color: #2fb8c6; }
.hd-s.fail { color: #ff8b8b; }
.hd-s.new { color: #e0a94a; }
.hd-s.unk { color: rgba(255, 255, 255, 0.5); }

.health-dash-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px 10px;
    margin-top: 7px;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    font-size: 10px;
    color: rgba(255, 255, 255, 0.72);
}

.hd-lg.time { margin-right: auto; color: rgba(255, 255, 255, 0.45); }

/* ---- 三端适配：窄屏压缩字号与间距，保证 3 格不溢出 ---- */
@media (max-width: 480px) {
    .health-dash { padding: 7px 8px; border-radius: 12px; }
    .health-dash-title { font-size: 11px; }
    .health-dash-grid { gap: 5px; }
    .hd-cell { padding: 5px 6px; }
    .hd-cell-total { font-size: 14px; }
    .hd-cell-stats { font-size: 10px; gap: 2px 6px; }
    .health-dash-foot { font-size: 9.5px; gap: 3px 8px; }
}

@media (max-width: 340px) {
    .hd-cell-name i { display: none; }
    .hd-cell-name { font-size: 9px; }
    .hd-cell-stats { font-size: 9.5px; }
}

/* ========== 3) 三端适配补强 + 整站轻美化 ==========
   仅「叠加」增强：新增安全区计算、断点补强与少量可访问性/渲染增强；
   不覆盖既有选择器的既有语义（不动既有 transform / 阴影 / 背景 / 配色），
   因此不会影响既有交互与接口调用。 */

/* ---- 3.1 安全区（刘海屏 / 手势条）：新增私有变量参与计算 ----
   变量值默认与既有 .bottom-nav bottom、.movies-grid padding-bottom 完全一致，
   env() 缺失时回落到 0px，等价于原样。 */
:root {
    --ue-nav-bottom: 10px;
    --ue-nav-clearance: 70px;
}

.bottom-nav {
    bottom: calc(var(--ue-nav-bottom) + env(safe-area-inset-bottom, 0px));
}

.movies-grid {
    padding-bottom: calc(var(--ue-nav-clearance) + env(safe-area-inset-bottom, 0px));
}

/* ---- 3.2 可访问性：键盘焦点可见 + 选中态（新增，不影响鼠标/触摸交互） ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.nav-item:focus-visible,
.info-item:focus-visible,
.category-item:focus-visible,
.movie-card:focus-visible,
.library-card:focus-visible,
.library-act:focus-visible {
    outline: 2px solid rgba(47,184,198, 0.85);
    outline-offset: 2px;
}

::selection {
    background: rgba(47,184,198, 0.32);
}

/* ---- 3.3 平板竖屏（641–767px 属既有样式空档）：放大栅格列宽与个人信息卡上限 ---- */
@media (min-width: 641px) and (max-width: 767px) {
    .movies-grid,
    .recommendations-grid,
    .apps-grid {
        grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
        gap: 12px;
    }

    .library-grid {
        grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    }

    .profile-info-container { max-width: 520px; }

    .category-item { min-width: 66px; }
}

/* ---- 3.4 窄屏手机（≤480px）：收紧栅格与分类胶囊，保证不横向溢出 ---- */
@media (max-width: 480px) {
    :root { --ue-nav-bottom: 8px; }

    .bottom-nav { left: 8px; right: 8px; }

    .movies-grid,
    .recommendations-grid,
    .apps-grid {
        grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
        gap: 8px;
    }

    .category-item { min-width: 54px; }
}

/* ---- 3.5 超窄屏（≤360px）：底部导航与栅格进一步压缩 ---- */
@media (max-width: 360px) {
    :root { --ue-nav-bottom: 6px; }

    .bottom-nav { left: 6px; right: 6px; padding: 5px 2px; }

    .nav-item { padding: 4px 2px; }

    .nav-text { font-size: 8px; }

    .movies-grid,
    .recommendations-grid,
    .apps-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    .category-item { min-width: 46px; }

    .profile-info-container { padding: 10px; }
}

/* ---- 3.6 横屏矮屏（高度 ≤460px）：压缩底部导航，避免遮挡内容 ---- */
@media (max-height: 460px) and (orientation: landscape) {
    :root {
        --ue-nav-bottom: 6px;
        --ue-nav-clearance: 58px;
    }

    .bottom-nav { padding: 3px 0; border-radius: 12px; }

    .nav-item { height: 34px; padding: 2px 6px; }

    .nav-text { font-size: 8px; }
}

/* ---- 3.7 轻美化：仅新增属性（不改写既有声明），不改变既有布局与交互 ---- */
html {
    -webkit-text-size-adjust: 100%;  /* iOS 横屏不自动放大字号 */
    overscroll-behavior-y: contain;  /* 阻止滚动链式穿透，不影响页面内滚动 */
}

.modal-content,
.cinema-modal {
    overscroll-behavior: contain;    /* 弹窗内滚动不穿透到底层页面 */
}

/* ==================================================================
 * 章节 4：用户端「逐接口资源数量明细」（默认展开 / 限高滚动 / 三端不溢出）
 * 说明：只新增 .health-dash-detail 及其子类样式；
 *       不改 .health-dash / .health-dash-grid / .hd-cell 既有声明，
 *       全段不使用强制优先级声明，RTL 由容器 dir 自动继承（flex 主轴自动反转）。
 * ================================================================== */

/* ---- 4.1 头部按钮组（明细开关 + 刷新并排） ---- */
.health-dash-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.health-dash-btn.on {
    color: var(--accent-primary, #c98b2e);
    border-color: rgba(201,139,46, 0.55);
}

/* ---- 4.2 明细容器：限高 + 内部滚动，保证仪表盘保持紧凑 ---- */
.health-dash-detail {
    margin: 8px 0 0;
    padding: 8px 9px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.08);
    max-height: 190px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    font-size: 12px;
    line-height: 1.5;
}

.health-dash-detail.collapsed { display: none; }

.hd-d-loading {
    padding: 6px 0;
    text-align: center;
    color: var(--text-secondary, #999);
}

.hd-d-legend {
    margin-bottom: 6px;
    font-size: 10px;
    color: var(--text-secondary, #999);
    opacity: 0.85;
}

.hd-d-sec + .hd-d-sec { margin-top: 8px; }

.hd-d-sec-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 5px;
    padding-bottom: 3px;
    font-size: 11px;
    font-weight: 600;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.12);
}

.hd-d-sec-title {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.hd-d-sec-total {
    flex: 0 0 auto;
    color: var(--accent-primary, #c98b2e);
    font-variant-numeric: tabular-nums;
}

.hd-d-ver { margin-bottom: 6px; }

.hd-d-line {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.hd-d-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hd-d-ver-name {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.hd-d-nums {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.hd-d-num {
    min-width: 22px;
    text-align: right;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.hd-d-num.na {
    color: var(--text-secondary, #999);
    font-weight: 400;
}

.hd-d-dots {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.hd-d-s {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-variant-numeric: tabular-nums;
}

.hd-d-s.ok { color: #2fb8c6; }
.hd-d-s.fail { color: #e05263; }
.hd-d-s.unk { color: var(--text-secondary, #999); }

.hd-d-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--text-secondary, #999);
}

.hd-d-dot.ok { background: #2fb8c6; }
.hd-d-dot.fail { background: #e05263; }
.hd-d-dot.unknown { background: var(--text-secondary, #999); }

.hd-d-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.hd-d-chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    max-width: 100%;
    padding: 2px 6px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-primary, #eee);
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---- 4.3 三端适配：窄屏收紧、横屏矮屏进一步限高（均不改变既有声明） ---- */
@media (max-width: 480px) {
    .health-dash-detail { max-height: 176px; padding: 7px 8px; font-size: 11.5px; }
    .hd-d-num { min-width: 20px; }
    .hd-d-chip { padding: 2px 5px; font-size: 10.5px; }
}

@media (max-width: 360px) {
    .health-dash-detail { max-height: 158px; font-size: 11px; }
    .hd-d-legend { display: none; }
    .hd-d-num { min-width: 18px; }
    .hd-d-nums { gap: 6px; }
}

@media (min-width: 641px) and (max-width: 767px) {
    .health-dash-detail { max-height: 200px; }
}

@media (max-height: 460px) and (orientation: landscape) {
    .health-dash-detail { max-height: 132px; }
}

/* ========== 5) 用户端「JSON 数据提交」弹窗 + 后台「JSON 提交审核」/「JSON 接口有效性检查」 ==========
   全部为「新增类名」，不改写既有选择器；本段不含 !important。
   用户端复用 .modal-content.glass-effect 既定外观，仅补内部布局与状态色；
   后台复用既有 .card / .btn / .table-container 风格，仅补统计卡与明细展开样式。
   ========================================================================== */

/* ---- 5.1 用户端「JSON 数据提交」弹窗 ---- */
.modal-content.json-modal {
    max-width: 440px;
    width: 92%;
    max-height: 88vh;
    overflow-y: auto;
    text-align: right;
    direction: rtl;
}

.json-hint {
    font-size: 11px;
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.72);
    background: rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 8px 10px;
    margin: 0 0 12px;
    text-align: right;
}

.json-tabs {
    display: flex;
    gap: 6px;
    margin-bottom: 10px;
}

.json-tab {
    flex: 1 1 0;
    padding: 7px 8px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 255, 255, 0.75);
    font-size: 12px;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.json-tab.active {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.38);
    color: #fff;
    font-weight: 600;
}

.json-pane { margin-bottom: 10px; }

.json-file-drop {
    display: block;
    padding: 16px 12px;
    border-radius: 12px;
    border: 1px dashed rgba(255, 255, 255, 0.3);
    background: rgba(0, 0, 0, 0.2);
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease;
}

.json-file-drop:hover {
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(0, 0, 0, 0.3);
}

.json-pane input[type="file"] { display: none; }

.json-file-name {
    margin-top: 6px;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.6);
    text-align: center;
    word-break: break-all;
}

.json-textarea {
    width: 100%;
    box-sizing: border-box;
    min-height: 132px;
    padding: 9px 10px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-family: monospace;
    font-size: 12px;
    line-height: 1.5;
    direction: ltr;
    text-align: left;
    resize: vertical;
}

.json-probe-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    font-size: 11px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
}

.json-probe-row input { flex: 0 0 auto; }

.json-result {
    display: none;
    margin-bottom: 10px;
    padding: 9px 10px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.6;
    text-align: right;
    word-break: break-word;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.9);
}

.json-result.loading { color: rgba(255, 255, 255, 0.75); }
.json-result.ok { border-color: rgba(46, 204, 113, 0.55); background: rgba(46, 204, 113, 0.12); }
.json-result.warn { border-color: rgba(245, 166, 35, 0.55); background: rgba(245, 166, 35, 0.12); }
.json-result.bad { border-color: rgba(231, 76, 60, 0.55); background: rgba(231, 76, 60, 0.12); }

.json-rep-head {
    font-weight: 600;
    margin-bottom: 6px;
    word-break: break-all;
}

.json-rep-head.ok { color: #34c98a; }
.json-rep-head.warn { color: #e5a13a; }
.json-rep-head.bad { color: #e05263; }

.json-rep-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 3px;
}

.json-rep-row > b { color: #fff; font-weight: 600; text-align: left; }

.json-rep-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 6px 0;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.json-rep-counts .c-ok { color: #34c98a; }
.json-rep-counts .c-warn { color: #e5a13a; }
.json-rep-counts .c-bad { color: #e05263; }

.json-entry-list {
    max-height: 190px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    margin-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 6px;
}

.json-entry {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 5px 6px;
    border-radius: 8px;
    font-size: 11px;
    border-right: 3px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.04);
}

.json-entry + .json-entry { margin-top: 5px; }
.json-entry.ok { border-right-color: #34c98a; }
.json-entry.warn { border-right-color: #e5a13a; }
.json-entry.fail { border-right-color: #e05263; }

.json-entry-idx { color: rgba(255, 255, 255, 0.5); flex: 0 0 auto; }

.json-vd {
    flex: 0 0 auto;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 10px;
    border: 1px solid currentColor;
}

.json-vd.ok { color: #34c98a; }
.json-vd.warn { color: #e5a13a; }
.json-vd.bad { color: #e05263; }

.json-entry-name {
    flex: 1 1 120px;
    min-width: 0;
    color: #fff;
    word-break: break-all;
}

.json-entry-ver {
    flex: 0 0 auto;
    padding: 0 6px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
    font-size: 10px;
}

.json-entry-issues {
    flex: 1 1 100%;
    color: rgba(255, 255, 255, 0.6);
    font-size: 10.5px;
    line-height: 1.5;
    word-break: break-word;
}

.json-entry-more {
    margin-top: 6px;
    font-size: 10.5px;
    color: rgba(255, 255, 255, 0.55);
    text-align: center;
}

.json-buttons { flex-wrap: wrap; }

.json-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.85);
    font-size: 11px;
    cursor: pointer;
    transition: background 0.18s ease;
}

.json-link-btn:hover { background: rgba(255, 255, 255, 0.14); }

.json-my-row { margin-top: 10px; text-align: right; }

.json-my-list { margin-top: 8px; }

.json-my-title {
    font-size: 12px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 6px;
}

.json-my-item {
    padding: 7px 9px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.05);
    border-right: 3px solid rgba(255, 255, 255, 0.2);
    font-size: 11px;
}

.json-my-item + .json-my-item { margin-top: 6px; }
.json-my-item.ok { border-right-color: #34c98a; }
.json-my-item.warn { border-right-color: #e5a13a; }
.json-my-item.bad { border-right-color: #e05263; }

.json-my-name { color: #fff; font-weight: 600; word-break: break-all; }

.json-my-meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.6);
}

.json-my-status { flex: 0 0 auto; }

.json-my-note {
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.66);
    line-height: 1.55;
    word-break: break-word;
}

.json-my-empty {
    padding: 10px;
    text-align: center;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.55);
}

/* ---- 5.2 后台「JSON 提交审核」 ---- */
.jrev-badge {
    display: inline-block;
    margin-right: 6px;
    padding: 1px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--text-secondary, #999);
    font-size: 11px;
    font-weight: 500;
    vertical-align: middle;
}

.jrev-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 4px;
}

.jrev-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 78px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.09);
}

.jrev-num {
    font-size: 18px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.jrev-lb {
    font-size: 11px;
    color: var(--text-secondary, #999);
    margin-top: 2px;
}

table.jrev-meta { width: 100%; }

table.jrev-meta th {
    width: 92px;
    text-align: right;
    font-weight: 500;
    color: var(--text-secondary, #999);
    font-size: 12px;
    vertical-align: top;
    padding: 3px 6px;
}

table.jrev-meta td {
    font-size: 12px;
    vertical-align: top;
    padding: 3px 6px;
    word-break: break-all;
}

.jrev-details { margin-top: 10px; }

.jrev-details > summary {
    cursor: pointer;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--accent-primary, #c98b2e);
    padding: 4px 0;
    list-style-position: inside;
}

.jrev-details .table-container { margin-top: 6px; }

/* ---- 5.3 后台「JSON 接口有效性检查」卡片 ---- */
.json-check-card .jrev-stats { margin-bottom: 8px; }

.json-check-scope {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    padding: 3px 0;
}

.json-check-scope input { flex: 0 0 auto; }

.json-check-num { color: var(--text-secondary, #999); font-size: 11.5px; }

.json-check-url {
    color: var(--text-secondary, #999);
    font-size: 11px;
    word-break: break-all;
}

.json-check-note {
    font-size: 12px;
    color: var(--text-secondary, #999);
    word-break: break-word;
}

/* ---- 5.4 三端收紧（仅为新增类名，不改动既有声明） ---- */
@media (max-width: 480px) {
    .modal-content.json-modal { max-width: 94%; width: 94%; }
    .json-entry-list { max-height: 158px; }
    .json-textarea { min-height: 116px; }
    .jrev-stat { min-width: 66px; padding: 7px 8px; }
    .jrev-num { font-size: 16px; }
    table.jrev-meta th { width: 76px; }
}

@media (max-width: 360px) {
    .json-tab { font-size: 11px; padding: 6px 5px; }
    .json-entry-list { max-height: 142px; }
    .jrev-stat { min-width: 58px; padding: 6px 6px; }
    .jrev-num { font-size: 15px; }
    .jrev-lb { font-size: 10px; }
}

@media (max-height: 460px) and (orientation: landscape) {
    .modal-content.json-modal { max-height: 94vh; }
    .json-entry-list { max-height: 120px; }
}

/* ========== 6) 列表分页导航（首页电影列表 / 短剧列表） ==========
   由 script.js 的 renderPager() 渲染：‹ئالدىنقى بەت (cur-1) | 页码 | (cur+1) كېيىنكى بەت›
   默认 display:none（容器带 innerHTML 为空），有页码时由 JS 置为 flex。
   全段仅使用新增类名 .pager / .pager-btn / .pager-num / .pager-nav / .pager-total，
   不改写任何既有选择器，且不含 !important。 */
.pager {
    display: none;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px;
    /* 负上边距抵掉 .movies-grid 为固定底部导航预留的空白，避免页码条与列表之间出现 70px 大空隙 */
    margin-top: calc(-1 * (var(--ue-nav-clearance) - 12px) - env(safe-area-inset-bottom, 0px));
    /* 下边距保证页码条不被固定底部导航遮挡 */
    margin-bottom: calc(var(--ue-nav-clearance) + env(safe-area-inset-bottom, 0px));
    padding: 12px 8px;
    border-radius: 18px;
    direction: rtl;
}

.pager-btn {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 13px;
    line-height: 1;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.2s ease, transform 0.2s ease;
}

.pager-btn:active { transform: scale(0.96); }

.pager-num.active {
    background: linear-gradient(135deg, #e0a94a 0%, #b8863a 100%);
    font-weight: 700;
}

.pager-btn.disabled {
    opacity: 0.4;
    cursor: default;
    pointer-events: none;
}

.pager-nav-tx { font-size: 12px; }

.pager-total {
    direction: ltr;
    unicode-bidi: isolate;
    font-size: 11.5px;
    opacity: 0.7;
    margin-inline-start: 4px;
}

@media (max-width: 480px) {
    .pager { gap: 5px; padding: 10px 6px; }
    .pager-btn { min-width: 30px; height: 30px; font-size: 12px; border-radius: 10px; }
    .pager-nav-tx { font-size: 11px; }
}

@media (max-width: 360px) {
    .pager { gap: 4px; padding: 9px 4px; }
    .pager-btn { min-width: 26px; height: 26px; font-size: 11px; border-radius: 9px; }
    .pager-nav-tx,
    .pager-total { display: none; }
}


/* ==========================================================================
   7) 影院质感整站精修（Dark Cinema：暖琥珀 #e0a94a + 冷青 #2fb8c6 + 炭黑 #0b0e14）
   --------------------------------------------------------------------------
   本章节位于 ui-enhance.css 尾部，加载晚于 style.css / apple-crystal-theme.css，
   同权重声明由后加载者胜出；仅对 apple-crystal-theme.css 中已用 !important 的
   同一属性沿用 !important 覆盖，其余一律不用 !important，便于整体回退。
   全段只新增声明，不改写、不删除既有规则，不触及任何交互逻辑。
   ========================================================================== */

/* ---- 7.1 电影 / 短剧卡片：统一细描边（取消红/青/黄三色循环描边）+ 海报 2:3 ---- */
.movies-grid {
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: var(--sp-md);
    margin: var(--sp-md) var(--sp-sm) 0;
    align-content: start;
}

.movie-card {
    border: 1px solid var(--line-strong) !important;
    border-radius: var(--radius-md) !important;
    background: linear-gradient(160deg,
        rgba(22, 27, 36, 0.94) 0%,
        rgba(11, 14, 20, 0.97) 100%) !important;
    box-shadow: var(--shadow-sm) !important;
}

/* 覆盖 style.css 的 .movie-card:nth-child(3n+N) 三色描边 */
.movie-card:nth-child(3n+1),
.movie-card:nth-child(3n+2),
.movie-card:nth-child(3n+3) {
    border-color: var(--line-strong) !important;
}

.movie-card:hover {
    transform: translateY(-3px);
    border-color: rgba(224, 169, 74, 0.55) !important;
    box-shadow: var(--shadow-lg), 0 0 0 1px rgba(224, 169, 74, 0.22) !important;
}

.movie-poster {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 3;
}

/* 极旧内核不支持 aspect-ratio 时保留接近 2:3 的固定高度，避免海报塌陷 */
@supports not (aspect-ratio: 2 / 3) {
    .movie-poster { height: 156px; }
}

.movie-card:hover .movie-poster { transform: scale(1.05); }

.movie-info {
    padding: var(--sp-xs) 7px var(--sp-sm);
    background: linear-gradient(180deg,
        rgba(17, 21, 29, 0.96) 0%,
        rgba(11, 14, 20, 0.98) 100%);
    border-top: 1px solid var(--line);
}

.movie-title {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--text-primary);
}

.movie-rating {
    color: var(--brand-strong);
    font-weight: 700;
    letter-spacing: 0.2px;
}

/* ---- 7.2 顶部搜索区：胶囊面层 + 琥珀主按钮 ---- */
.search-box {
    border-radius: var(--radius-xl);
    background: var(--surface-2);
    border: 1px solid var(--line);
}

.search-box:focus {
    box-shadow: 0 0 0 2px rgba(224, 169, 74, 0.2), 0 0 18px rgba(224, 169, 74, 0.14);
    transform: none;
}

.search-btn,
.search-btn:hover {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%) !important;
    color: #1b1206 !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(224, 169, 74, 0.26) !important;
}

/* ---- 7.3 版本 / 资源 / 分类筛选：整行面层统一，胶囊选中态统一琥珀底 ----
   注：三类胶囊同时带 .glass-effect，其独立玻璃面板（apple-crystal 中为 !important）
   会盖掉 style.css 的选中态底色，导致「当前选中项」不可辨；这里统一脱掉面板层，
   由整行面层承载，并让选中态使用 !important 保证稳定可见。 */
.version-selector,
.source-selector-wrapper,
.category-nav {
    background: var(--surface-1) !important;
    border: 1px solid var(--line) !important;
    border-radius: var(--radius-lg) !important;
}

/* 分类容器不再套第二层面板，避免与内层 .category-nav 形成双重底色 */
.category-container {
    background: transparent !important;
    border: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

.version-item,
.source-item,
.category-item {
    background: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-radius: 999px;
    color: var(--text-secondary);
    font-weight: 500;
}

.version-item:hover,
.source-item:hover,
.category-item:hover {
    background: var(--surface-3) !important;
    color: var(--text-primary);
}

.version-item.active,
.source-item.active,
.category-item.active {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%) !important;
    border-color: rgba(224, 169, 74, 0.55) !important;
    color: #1b1206 !important;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(224, 169, 74, 0.26) !important;
}

/* ---- 7.4 页码条：面层统一 + 琥珀选中页 ---- */
.pager-btn {
    background: var(--surface-2);
    border: 1px solid var(--line);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    font-weight: 600;
}

.pager-btn:hover {
    background: var(--surface-3);
    border-color: var(--line-strong);
    color: var(--text-primary);
}

.pager-btn.disabled {
    background: var(--surface-1);
    border-color: var(--line);
}

.pager-num.active {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%);
    color: #1b1206;
    border-color: rgba(224, 169, 74, 0.6);
    box-shadow: 0 3px 12px rgba(224, 169, 74, 0.26);
}

.pager-total { color: var(--text-tertiary); }

/* ---- 7.5 会员升级横幅与弹窗面层：统一琥珀 CTA + 中性投影 ---- */
.vip-upgrade-banner {
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: var(--shadow-md);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.vip-upgrade-banner:active { transform: scale(0.985); }

.modal-content,
.setting-modal,
.profile-info,
.info-item,
.vip-package-card {
    border-color: var(--line-strong) !important;
}

/* ---- 7.6 底栏说明：底部导航由 template.php 内联样式块负责（加载更晚且带 !important），
        此处不重复声明，避免出现两套互相牵制的底栏规则 ---- */

/* ---- 7.7 推荐页「影片库」与排行榜区块：统一面层 + 取消三色描边 + 海报 2:3 ---- */
.library-panel {
    background: var(--surface-1);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
}

.library-chip {
    background: var(--surface-2);
    border: 1px solid var(--line);
    color: var(--text-secondary);
}

.library-chip:hover {
    background: var(--surface-3);
    color: var(--text-primary);
}

.library-chip.active {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%) !important;
    border-color: rgba(224, 169, 74, 0.55) !important;
    color: #1b1206 !important;
    font-weight: 700;
    box-shadow: 0 2px 10px rgba(224, 169, 74, 0.28);
}

.library-grid {
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: var(--sp-md);
    margin: var(--sp-sm) var(--sp-xs) var(--sp-md);
}

.library-card {
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-md);
    background: linear-gradient(160deg, rgba(22, 27, 36, 0.94) 0%, rgba(11, 14, 20, 0.97) 100%);
}

/* 取消 .library-card:nth-child(3n+N) 三色描边 */
.library-card:nth-child(3n+1),
.library-card:nth-child(3n+2),
.library-card:nth-child(3n+3) {
    border-color: var(--line-strong);
}

.library-card:hover {
    transform: translateY(-3px);
    border-color: rgba(224, 169, 74, 0.55);
    box-shadow: var(--shadow-lg);
}

.library-poster-wrap {
    height: auto;
    aspect-ratio: 2 / 3;
}

@supports not (aspect-ratio: 2 / 3) {
    .library-poster-wrap { height: 156px; }
}

.library-sheet {
    background: linear-gradient(180deg, rgba(22, 27, 36, 0.98) 0%, rgba(11, 14, 20, 0.99) 100%);
    border-top: 1px solid var(--line-strong);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}

.library-sheet-poster { border-radius: var(--radius-sm); }

.library-search input {
    background: var(--surface-2);
    border: 1px solid var(--line);
}

/* RTL：排行榜条目悬停位移改为向左，与 RTL 阅读方向一致 */
html[dir="rtl"] .ranking-item:hover {
    transform: translateX(-6px);
}

/* 应用程序卡片（.app-card）：取消三色循环描边，统一面层与琥珀悬停 */
.app-card {
    background: var(--surface-2);
    border: 1px solid var(--line-strong);
}

.app-card:nth-child(3n+1),
.app-card:nth-child(3n+2),
.app-card:nth-child(3n+3) {
    border-color: var(--line-strong);
}

.app-card:hover {
    background: var(--surface-3);
    border-color: rgba(224, 169, 74, 0.55);
    box-shadow: var(--shadow-lg);
}

/* ---- 7.8 次要动作与排行榜页签：返回按钮、页签选中态统一 ----
   「返回」属次要动作，改描边幽灵胶囊，避免与琥珀主按钮争夺注意力；
   页面级 .back-btn 定义分散且加载顺序不一，故统一以 !important 收敛。 */
.back-btn {
    background: transparent !important;
    border: 1px solid var(--line-strong) !important;
    color: var(--text-primary) !important;
    border-radius: 999px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.back-btn:hover {
    background: rgba(224, 169, 74, 0.14) !important;
    border-color: rgba(224, 169, 74, 0.5) !important;
    color: var(--brand-strong) !important;
    box-shadow: 0 6px 16px rgba(224, 169, 74, 0.18) !important;
}

/* 排行榜页签：未选中幽灵胶囊，选中实心琥珀（配合 switchRankingTab 的 is-active） */
.ranking-tab {
    background: transparent !important;
    border: 1px solid var(--line-strong) !important;
    color: var(--text-secondary) !important;
    font-weight: 500 !important;
}

.ranking-tab.is-active {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%) !important;
    border-color: rgba(224, 169, 74, 0.6) !important;
    color: #1b1206 !important;
    font-weight: 700 !important;
    box-shadow: 0 6px 18px rgba(224, 169, 74, 0.28) !important;
}

/* ---- 7.9 断点与 RTL 校正 ----
   7.1 的 .movies-grid 无媒体查询，会盖住 style.css 的 tablet/desktop 断点
   （同权重、后加载者胜出），故在此补齐断点，避免高分宽屏上仍按 104px 密排。 */
@media (min-width: 768px) {
    .movies-grid {
        grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
        gap: var(--sp-md);
        margin: var(--sp-md) var(--sp-lg) 0;
    }
}

@media (min-width: 1024px) {
    .movies-grid {
        grid-template-columns: repeat(auto-fill, minmax(152px, 1fr));
        gap: var(--sp-lg);
        margin: var(--sp-lg) var(--sp-lg) 0;
    }

    .movie-title { font-size: 13px; }
    .movie-info { padding: var(--sp-sm) var(--sp-sm) var(--sp-md); }
}

/* 超窄屏：栅格下限降到 96px，避免 280~360px 下每行只剩一列 */
@media (max-width: 360px) {
    .movies-grid {
        grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
        gap: var(--sp-sm);
        margin: var(--sp-sm) var(--sp-2xs) 0;
    }

    .movie-title { font-size: 11px; }
    .movie-info { padding: var(--sp-2xs) 6px var(--sp-xs); }
}

/* RTL：列表项悬停位移改为向左，与阅读方向一致 */
html[dir="rtl"] .ranking-item:hover,
html[dir="rtl"] .info-item:hover,
html[dir="rtl"] .payment-record-item:hover,
html[dir="rtl"] .avatar-menu-item:hover,
html[dir="rtl"] .record-item:hover {
    transform: translateX(-6px);
}

/* ===== 7.10 响应式校对修正：固定顶栏避让 / 影片库工具栏 / 窄屏紧收 ===== */

/* 顶部导航为 position:fixed 且高 45px，页面内容需下移避让，避免首屏内容被裁切遮挡 */
.page-content {
    padding-top: 45px;
}

/* 作为 flex 项允许收缩到内容最小宽以下，避免搜索框把语言按钮挤出视口 */
.library-search {
    min-width: 0;
}

@media (max-width: 400px) {
    .library-bar-tools {
        flex-wrap: wrap;
        row-gap: var(--sp-sm);
    }

    .library-lang-btn {
        padding: 5px 9px;
        font-size: 11px;
    }
}

/* ========== 8) 底部导航菜单图标（内联 SVG，维语 RTL） ==========
   图标由 template.php 底部导航直接内联 <svg>（不引任何外链图标库），
   线性路径取 Lucide（ISC）：house / clapperboard / star / trophy / user。
   SVG 用 stroke="currentColor" + fill="none"，颜色随 .nav-icon 继承；
   激活态由既有 .active .nav-icon 的 color: var(--brand-strong) 自动上金色。
   本节仅新增声明、不改写既有选择器、不含 !important；5 个 .nav-item 数量与
   顺序保持不变（script.js / app-inline.js 按索引映射
   home / duanju / recommend / ranking / profile）。 */
.bottom-nav .nav-item .nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    line-height: 0;
}

.bottom-nav .nav-item .nav-icon .nav-svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
    color: inherit;
}

/* 悬停（非激活）：图标略微提亮，与既有 .nav-item:hover 的位移/底色呼应 */
.bottom-nav .nav-item:hover .nav-icon .nav-svg {
    color: rgba(255, 255, 255, 0.92);
}

/* 激活态：沿用既有 scale(1.1) + 金色（var(--brand-strong)），加一层同色柔光 */
.bottom-nav .nav-item.active .nav-icon .nav-svg {
    color: var(--brand-strong);
    filter: drop-shadow(0 0 6px rgba(224, 169, 74, 0.5));
}

/* 超窄屏（≤360px）图标同步收小，避免底部导航被撑高 */
@media (max-width: 360px) {
    .bottom-nav .nav-item .nav-icon {
        width: 20px;
        height: 20px;
    }
}