/* ===== 储物 ===== */
.inventory-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-8) 0;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* ===== 储物工作台 V3 · A 玉简袋（1:1 对齐设计原型）=====
   圆角语汇：
   · 控件（Tab/搜索/批量/关闭/筛选）= 8px（--radius-md）
   · 搜索 / Tab / 筛选 / 玉简卡 / 分组卡 / 日限 = 同一圆角 token（8px）
   · 底栏操作钮 / 铭文印 = 4px
   · 容量/状态角标 = 999px 胶囊
   只在 #inventoryPanel 内生效。 */
#inventoryPanel.inventory-workbench {
    --inv-wb-ink: var(--text-primary);
    --inv-wb-muted: var(--text-muted);
    --inv-wb-line: color-mix(in srgb, var(--border-color) 82%, transparent);
    --inv-wb-line-soft: color-mix(in srgb, var(--border-color) 55%, transparent);
    --inv-wb-line-strong: color-mix(in srgb, var(--accent-gold) 38%, var(--border-color));
    --inv-wb-surface: var(--bg-panel);
    --inv-wb-raised: var(--bg-card);
    --inv-wb-accent: var(--accent-gold);
    /* 控件与卡片圆角统一走 --radius-md（Excel 主题作用域内变方角是有意设计） */
    --inv-wb-radius: var(--radius-md);
    --inv-wb-card-radius: var(--radius-md);
    --inv-wb-action-radius: var(--radius-xs);
    --inv-wb-ease: cubic-bezier(.2, .8, .2, 1);
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    /* 压过 .side-content 的 16px padding，避免双层留白 + 透底 */
    padding: 0 !important;
    margin: 0;
    /* 实色底，挡住 Excel 网格/侧栏透底横纹 */
    background-color: var(--inv-wb-surface) !important;
    background-image: none !important;
    overflow: hidden !important;
}

/* ===== 标题区 · 已迁 gc-panel-head（gc-rule + gc-title + gc-panel-sub + ×）===== */
/* 旧 panel-title 册封条已废弃；inventory-workbench__header 现挂在 gc-panel-head 上，
   保留 var(--inv-wb-surface) 背景与 flex:none，布局由 gc-panel-head 接管。 */
/* 储物面板标题区：side-content.inventory-workbench 的 padding 被清成 0，
   gc-panel-head 的负 margin 无处抵消。用 !important 显式覆盖。 */
#inventoryPanel > .gc-panel-head {
    position: relative !important;
    top: auto !important;
    margin: 0 !important;
    padding: var(--space-14) var(--space-48) var(--space-8) var(--space-16) !important;
    z-index: 10 !important;
    background: var(--inv-wb-surface) !important;
    flex: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
/* 批量按钮 + 关闭钮浮到标题区右上角并排（不参与 gc-panel-head 流式布局）。
   覆盖旧 .inventory-workbench__header-actions 的 margin-left:auto 和 gc-panel-close 的 absolute。 */
#inventoryPanel > .gc-panel-head .inventory-workbench__header-actions {
    position: absolute !important;
    top: 12px;
    right: 14px;
    display: inline-flex !important;
    align-items: center;
    gap: var(--space-6);
    margin-left: 0 !important;
    z-index: 11;
}
/* 关闭钮取消 gc-panel-close 的 absolute（由 header-actions 的 flex 统一排布，不再独立浮） */
#inventoryPanel > .gc-panel-head .gc-panel-close {
    position: relative !important;
    top: auto !important;
    right: auto !important;
}
/* 容量副标（#inventoryCapacityText，gc-panel-sub）将满警示：
   game.js / game-inventory-workbench.js 在用量 ≥90% 时切 is-near-limit */
#inventoryPanel > .gc-panel-head .gc-panel-sub.is-near-limit {
    color: var(--text-danger);
    font-weight: 600;
}

/* A · 分类 + 搜索 chrome */
.inventory-workbench__chrome {
    flex: none;
    background: var(--inv-wb-surface);
    border-bottom: 1px solid color-mix(in srgb, var(--inv-wb-line) 70%, transparent);
}

#inventoryPanel .inv-batch-menu { position: relative; display: inline-flex; }
.inventory-workbench__header-actions {
    display: inline-flex;
    align-items: center;
    gap: var(--space-6);
    flex: none;
    margin-left: auto;
}
.inventory-tool-button {
    box-sizing: border-box;
    height: 30px;
    min-height: 30px;
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    cursor: pointer;
    transition: border-color 140ms var(--inv-wb-ease), color 140ms var(--inv-wb-ease), background 140ms var(--inv-wb-ease);
}
.inventory-tool-button {
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    font-weight: 600;
}
#inventoryPanel.inventory-workbench .btn-panel-close {
    width: 30px;
    height: 30px;
    min-width: 30px;
    border-radius: var(--radius-md);
    border: 1px solid var(--inv-wb-line);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--font-action);
}
/* 批量操作下拉箭头：CSS 三角，避免字体渲染偏位 */
.inventory-tool-button::after {
    content: '';
    display: inline-block;
    width: 0; height: 0;
    margin-left: var(--space-6);
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 4px solid currentColor;
    vertical-align: middle;
    opacity: .6;
}
.inventory-tool-button:hover {
    border-color: var(--inv-wb-line-strong);
    color: var(--inv-wb-accent);
}
.inventory-tool-button.is-open {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 48%, var(--border-color));
    color: var(--inv-wb-accent);
    background: color-mix(in srgb, var(--inv-wb-accent) 10%, var(--inv-wb-raised));
}
.inventory-tool-button.is-open::after {
    transform: rotate(180deg);
    opacity: .9;
}
.inventory-tool-button::after {
    transition: transform 160ms var(--inv-wb-ease), opacity 140ms var(--inv-wb-ease);
}

#inventoryPanel :is(button, input, select):focus-visible {
    outline: 2px solid color-mix(in srgb, var(--inv-wb-accent) 76%, white);
    outline-offset: 2px;
}

/* ===== 弹出菜单（批量 / 更多）=====
   结构仍是扁平列表；质感用宣纸面 + 金边 + 悬停左金线，不堆印记标签。
   body > .inv-card__more-menu：打开时挂到 body，选择器须覆盖（防 list contain 裁切）。 */
#inventoryPanel .inv-pop-menu,
#inventoryPanel .inv-batch-dropdown,
#inventoryPanel .inv-card__more-menu,
body > .inv-card__more-menu {
    display: none;
    position: absolute;
    z-index: 40;
    min-width: 148px;
    padding: var(--space-6);
    border: 1px solid color-mix(in srgb, var(--inv-wb-accent) 32%, var(--inv-wb-line));
    border-radius: var(--radius-md);
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--inv-wb-accent) 7%, var(--inv-wb-raised)) 0,
            var(--inv-wb-raised) 28%,
            var(--inv-wb-raised) 100%
        );
    box-shadow:
        0 12px 28px color-mix(in srgb, var(--text-primary) 14%, transparent),
        0 0 0 1px color-mix(in srgb, var(--inv-wb-accent) 8%, transparent),
        inset 0 1px 0 color-mix(in srgb, var(--inv-wb-accent) 14%, transparent);
    box-sizing: border-box;
}
#inventoryPanel .inv-batch-dropdown {
    top: calc(100% + 6px);
    right: 0;
    z-index: 1100;
    min-width: 156px;
}
#inventoryPanel .inv-batch-dropdown.open,
#inventoryPanel .inv-card__more-menu.is-open,
body > .inv-card__more-menu.is-open {
    display: block;
    animation: invPopMenuIn 150ms var(--inv-wb-ease);
}
@keyframes invPopMenuIn {
    from { opacity: 0; transform: translateY(-3px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    #inventoryPanel .inv-batch-dropdown.open,
    #inventoryPanel .inv-card__more-menu.is-open,
    body > .inv-card__more-menu.is-open {
        animation: none;
    }
}

/* 轻量眉题：只给批量菜单一点语境，不做复杂分组 */
/* #9388 一键清点弹窗行 */
.stocktake-list { display: flex; flex-direction: column; gap: var(--space-4); }
.stocktake-row {
    display: flex; align-items: baseline; gap: var(--space-8);
    padding: var(--space-4) var(--space-8);
    background: var(--bg-panel); border: 1px solid var(--border-color); border-radius: var(--radius-sm);
}
.stocktake-row__type { flex: none; width: 56px; font-size: var(--font-label); font-weight: 600; }
.stocktake-row__chips { flex: 1; display: flex; flex-wrap: wrap; gap: var(--space-6); }
.stocktake-row__total { flex: none; font-size: var(--font-caption); color: var(--text-muted); }
.stocktake-bt__title { margin: var(--space-12) 0 var(--space-4); font-size: var(--font-label); font-weight: 600; color: var(--text-gold); }
.stocktake-bt__row { font-size: var(--font-caption); color: var(--text-secondary); line-height: 1.8; }

#inventoryPanel .inv-pop-menu__caption {
    padding: var(--space-4) var(--space-10) var(--space-8);
    margin: 0 var(--space-2) var(--space-2);
    border-bottom: 1px solid color-mix(in srgb, var(--inv-wb-accent) 16%, var(--inv-wb-line));
    color: color-mix(in srgb, var(--inv-wb-accent) 55%, var(--inv-wb-muted));
    font-family: var(--font-serif);
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.18em;
    line-height: 1.2;
}

#inventoryPanel .inv-pop-menu__divider {
    height: 1px;
    margin: var(--space-6) var(--space-8);
    border: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--inv-wb-accent) 34%, var(--inv-wb-line)) 50%,
        transparent 100%
    );
}

#inventoryPanel .inv-pop-item,
body > .inv-card__more-menu .inv-pop-item {
    position: relative;
    display: block;
    width: 100%;
    min-height: 34px;
    margin: 0;
    padding: var(--space-8) var(--space-14) var(--space-8) var(--space-16);
    border: 0;
    border-radius: var(--inv-wb-radius);
    background: transparent;
    color: var(--inv-wb-ink);
    text-align: left;
    font-family: var(--font-serif);
    font-size: var(--font-label);
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.35;
    cursor: pointer;
    box-sizing: border-box;
    transition:
        background 140ms var(--inv-wb-ease),
        color 140ms var(--inv-wb-ease),
        padding-left 140ms var(--inv-wb-ease);
}
/* 悬停左金线：比整块背景更有「点中」感，又不动结构 */
#inventoryPanel .inv-pop-item::before,
body > .inv-card__more-menu .inv-pop-item::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 50%;
    width: 2px;
    height: 0;
    border-radius: var(--radius-xs);
    background: var(--inv-wb-accent);
    transform: translateY(-50%);
    opacity: 0;
    transition: height 140ms var(--inv-wb-ease), opacity 140ms var(--inv-wb-ease);
}
#inventoryPanel .inv-pop-item:hover,
#inventoryPanel .inv-pop-item:focus-visible,
body > .inv-card__more-menu .inv-pop-item:hover,
body > .inv-card__more-menu .inv-pop-item:focus-visible {
    background: color-mix(in srgb, var(--inv-wb-accent) 11%, transparent);
    color: var(--inv-wb-accent);
    outline: none;
}
#inventoryPanel .inv-pop-item:hover::before,
#inventoryPanel .inv-pop-item:focus-visible::before,
body > .inv-card__more-menu .inv-pop-item:hover::before,
body > .inv-card__more-menu .inv-pop-item:focus-visible::before {
    height: 14px;
    opacity: 0.9;
}
#inventoryPanel .inv-pop-item:active,
body > .inv-card__more-menu .inv-pop-item:active {
    background: color-mix(in srgb, var(--inv-wb-accent) 16%, transparent);
}
#inventoryPanel .inv-pop-item--danger,
body > .inv-card__more-menu .inv-pop-item--danger {
    color: var(--text-danger);
}
#inventoryPanel .inv-pop-item--danger::before,
body > .inv-card__more-menu .inv-pop-item--danger::before {
    background: var(--text-danger);
}
#inventoryPanel .inv-pop-item--danger:hover,
#inventoryPanel .inv-pop-item--danger:focus-visible,
body > .inv-card__more-menu .inv-pop-item--danger:hover,
body > .inv-card__more-menu .inv-pop-item--danger:focus-visible {
    background: color-mix(in srgb, var(--text-danger) 10%, transparent);
    color: var(--text-danger);
}
#inventoryPanel .inv-pop-item:disabled,
body > .inv-card__more-menu .inv-pop-item:disabled {
    opacity: .42;
    cursor: not-allowed;
}
#inventoryPanel .inv-pop-item:disabled::before,
body > .inv-card__more-menu .inv-pop-item:disabled::before {
    display: none;
}

/* body 门户菜单：补齐工作台 token（原定义在 #inventoryPanel 上） */
body > .inv-card__more-menu {
    --inv-wb-ink: var(--text-primary);
    --inv-wb-muted: var(--text-muted);
    --inv-wb-line: color-mix(in srgb, var(--border-color) 82%, transparent);
    --inv-wb-raised: var(--bg-card);
    --inv-wb-accent: var(--accent-gold);
    --inv-wb-radius: var(--radius-md);
    --inv-wb-ease: cubic-bezier(.2, .8, .2, 1);
}

/* 坊市「关注」红点：贴在文字旁（与 inv-filter-tab 同壳）
   注：workbench Tab 基线见文末「筛选 chip Tab 基线」统一收口 */
#marketPanel.market-workbench .market-workbench__tabs .watch-badge {
    position: static;
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 var(--space-6) var(--space-2);
    vertical-align: middle;
    top: auto;
    right: auto;
}
#marketPanel.market-workbench .market-workbench__tabs .watch-badge.hidden {
    display: none;
}

/* ===== 工具栏：搜索 + 筛选 · A 1:1 高 32 · 圆角 8 · 扁平 ===== */
.inventory-workbench__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-6);
    padding: 0 var(--space-12) var(--space-8);
    border-top: 0;
    border-bottom: 0;
    background: transparent;
    flex: 0 0 auto;
    min-height: 0;
    max-height: none;
    box-sizing: border-box;
}
#inventoryPanel .inv-search-wrap {
    --inv-search-h: 32px;
    position: relative;
    display: flex;
    align-items: center;
    align-self: center;
    min-width: 0;
    flex: 1 1 auto;
    height: var(--inv-search-h);
    max-height: var(--inv-search-h);
    margin: 0;
    padding: 0 var(--space-10);
    box-sizing: border-box;
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--inv-wb-radius, var(--radius-md));
    background: var(--inv-wb-raised);
    box-shadow: none;
    transition: border-color 160ms var(--inv-wb-ease), background 160ms var(--inv-wb-ease);
}
#inventoryPanel .inv-search-wrap:focus-within {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 42%, var(--border-color));
    background: var(--inv-wb-raised);
    box-shadow: none;
}
#inventoryPanel .inv-search-wrap.is-filled {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 38%, var(--border-color));
}
.inv-search-icon {
    position: static;
    z-index: 1;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin-right: var(--space-6);
    border-radius: 0;
    color: var(--inv-wb-muted);
    background: transparent;
    line-height: 1;
    pointer-events: none;
    transform: none;
}
#inventoryPanel .inv-search-wrap:focus-within .inv-search-icon {
    color: var(--inv-wb-accent);
    background: transparent;
}
.inv-search-icon svg {
    display: block;
}
#inventoryPanel .inv-search-input {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    display: block;
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
    height: calc(var(--inv-search-h) - 2px);
    min-height: calc(var(--inv-search-h) - 2px);
    max-height: calc(var(--inv-search-h) - 2px);
    margin: 0;
    padding: 0 var(--space-4) 0 var(--space-2);
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--inv-wb-ink);
    font-family: inherit;
    /* 原型 12px；窄屏仍 ≥16px，避免 iOS 聚焦整页放大 */
    font-size: var(--font-label);
    font-weight: 400;
    letter-spacing: 0.02em;
    line-height: calc(var(--inv-search-h) - 2px);
}
@media (max-width: 640px) {
    #inventoryPanel .inv-search-input {
        font-size: var(--font-title);
    }
}
#inventoryPanel .inv-search-input::-webkit-search-decoration,
#inventoryPanel .inv-search-input::-webkit-search-cancel-button,
#inventoryPanel .inv-search-input::-webkit-search-results-button,
#inventoryPanel .inv-search-input::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}
#inventoryPanel .inv-search-input::placeholder {
    color: color-mix(in srgb, var(--inv-wb-muted) 82%, transparent);
    letter-spacing: 0.04em;
}
#inventoryPanel .inv-search-input:focus {
    outline: none;
    box-shadow: none;
}
/* 清空：有字时出现，命中区域够大 */
#inventoryPanel .inv-search-clear {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin: 0 0 0 var(--space-2);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--inv-wb-muted) 12%, transparent);
    color: var(--inv-wb-muted);
    font-size: var(--font-action);
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: background 140ms var(--inv-wb-ease), color 140ms var(--inv-wb-ease);
}
#inventoryPanel .inv-search-clear:hover,
#inventoryPanel .inv-search-clear:focus-visible {
    background: color-mix(in srgb, var(--inv-wb-accent) 18%, transparent);
    color: var(--inv-wb-accent);
    outline: none;
}
#inventoryPanel .inv-search-clear[hidden] {
    display: none !important;
}

/* 筛选按钮：A 1:1 高 32 · 圆角 8 · 扁平（jade 激活） */
.inv-filter-toggle {
    flex: none;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-10);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--inv-wb-radius, var(--radius-md));
    background: transparent;
    color: var(--text-secondary);
    font-family: inherit;
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    white-space: nowrap;
    box-sizing: border-box;
    transition:
        color 140ms var(--inv-wb-ease),
        border-color 140ms var(--inv-wb-ease),
        background 140ms var(--inv-wb-ease);
}
.inv-filter-toggle:hover {
    color: var(--inv-wb-accent);
    border-color: color-mix(in srgb, var(--inv-wb-accent) 35%, var(--border-color));
    background: transparent;
}
.inv-filter-toggle.is-active {
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    border-color: color-mix(in srgb, var(--accent-jade) 40%, transparent);
    color: var(--accent-jade);
    box-shadow: none;
}
.inv-filter-toggle__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--inv-wb-accent);
    display: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--inv-wb-accent) 18%, transparent);
}
.inv-filter-toggle.is-active .inv-filter-toggle__dot { display: inline-block; }

/* 筛选展开面板（默认隐藏）· A 1:1 圆角 8 */
.inventory-workbench__filter-panel {
    display: none;
    flex: none;
    padding: 0 var(--space-12) var(--space-8);
    gap: var(--space-6);
    background: transparent;
    border-bottom: 0;
}
/* 品质/境界/锁定/领悟/排序 五项：两列网格，窄侧栏不挤成横排 */
.inventory-workbench__filter-panel.is-open { display: grid; grid-template-columns: 1fr 1fr; }
#inventoryPanel .inv-extra-filter-select {
    flex: 1;
    min-width: 0;
    height: 30px;
    min-height: 30px;
    padding: 0 var(--space-24) 0 var(--space-10);
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--radius-md);
    background: var(--inv-wb-raised);
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-caption);
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%238e8e85' stroke-width='1.4'/></svg>");
    background-repeat: no-repeat;
    background-position: right 8px center;
}
#inventoryPanel .inv-extra-filter-select:focus { outline: none; border-color: var(--inv-wb-accent); }
.inventory-pill-stats { display: none; }

/* ===== 主体：单列表 ===== */
.inventory-workbench__body {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background-color: var(--inv-wb-surface);
    background-image: none;
}
#inventoryPanel .inventory-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: var(--space-8) var(--space-12) var(--space-12);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    align-content: flex-start;
    /* 子项不得被拉伸成大块空白 */
    justify-content: flex-start;
    background-color: var(--inv-wb-surface);
    background-image: none;
    scrollbar-width: none;
}
#inventoryPanel .inventory-list::-webkit-scrollbar { display: none; }
#inventoryPanel .inventory-list > * {
    flex: 0 0 auto;
    max-width: 100%;
}

/* ===== 物品卡片 · 圆角与搜索框同值（--inv-wb-card-radius）· 无左轨 · 无卡内横线 ===== */
/* 不用离屏跳过绘制特性：老 WebView 在滚动/聚焦搜索时会反复回收重算，300+ 卡反而卡死。
   用 contain 隔离重排范围即可（见文末 .inventory-list > :where(...) 统一规则）。 */
.inv-card {
    position: relative;
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--inv-wb-card-radius, var(--radius-md));
    background: var(--inv-wb-raised);
    overflow: hidden;
    transition: border-color 180ms var(--inv-wb-ease), background 180ms var(--inv-wb-ease);
}
/* 列表内卡片/分组强制与搜索同圆角，防止其它规则压小 */
#inventoryPanel .inv-card,
#inventoryPanel .inv-group--workbench {
    border-radius: var(--inv-wb-card-radius, var(--radius-md));
}
.inv-card:hover {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 28%, var(--border-color));
}
.inv-card.is-open {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 32%, transparent);
    background: color-mix(in srgb, var(--inv-wb-accent) 4%, var(--inv-wb-raised));
    box-shadow: none;
}

/* 头部：原型 主列 + 角标列（无 chevron 列）
   div[role=button]：允许选中复制品名（原生 button 内文字不可选） */
.inv-card__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-8);
    align-items: start;
    min-height: 0;
    padding: var(--space-10) var(--space-12) var(--space-6);
    width: 100%;
    border: 0;
    background: transparent;
    color: var(--inv-wb-ink);
    text-align: left;
    font: inherit;
    cursor: pointer;
    -webkit-user-select: text;
    user-select: text;
}
.inv-card__head:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--inv-wb-accent) 55%, transparent);
    outline-offset: 2px;
}
/* 保留节点兼容旧 DOM，A 视觉隐藏 */
.inv-card__rail {
    display: none;
    width: 0;
    min-width: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    box-shadow: none;
}
.inv-card__main { min-width: 0; }
.inv-card__title-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-4) var(--space-6);
    min-width: 0;
}
.inv-card__name {
    overflow: hidden;
    color: var(--rarity-color, var(--inv-wb-ink));
    font-family: var(--font-serif);
    font-size: var(--font-body-lg);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 70%;
    cursor: text;
    -webkit-user-select: text;
    user-select: text;
    -webkit-touch-callout: default;
}
/* 名字后的先天词条：紧贴品名，不占满剩余宽度 */
.inv-card__affix-inline {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-4);
    min-width: 0;
    flex: 0 1 auto;
    max-width: 40%;
    overflow: hidden;
    color: var(--text-gold);
    font-size: var(--font-caption);
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
}
.inv-card__affix-dot {
    color: color-mix(in srgb, var(--text-muted) 70%, var(--text-gold));
    flex: none;
}
.inv-card__affix-label {
    flex: none;
    font-family: var(--font-serif);
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.06em;
    opacity: 0.7;
}
.inv-card__affix-name {
    min-width: 0;
    overflow: hidden;
    font-family: var(--font-serif);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-overflow: ellipsis;
    color: color-mix(in srgb, var(--accent-purple) 85%, var(--inv-wb-ink));
}
.inv-card__qty {
    color: var(--text-secondary);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex: none;
    /* 原型：数量贴行尾 */
    margin-left: auto;
}
.inv-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--space-2);
    margin-top: var(--space-4);
    color: var(--inv-wb-muted);
    font-size: var(--font-caption);
    line-height: 1.4;
}
.inv-card__meta .sep { color: var(--text-dim); opacity: .45; margin: 0 var(--space-4); }
.inv-card__meta .refine { color: var(--inv-wb-accent); font-weight: 700; }
.inv-card__meta-realm { color: var(--inv-wb-muted); }

/* A · 折叠态关键数值外显（攻防血/损耗/境界） */
.inv-card__stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4) var(--space-10);
    margin-top: var(--space-6);
    min-width: 0;
    color: var(--text-secondary);
    font-size: var(--font-caption);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1.35;
}
.inv-card__stat {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-2);
    white-space: nowrap;
}
.inv-card__stat-k {
    color: var(--inv-wb-muted);
    font-weight: 500;
    font-size: var(--font-caption);
    margin-right: var(--space-2);
}
.inv-card__stat-v { color: var(--inv-wb-ink); }
.inv-card__stat--hi .inv-card__stat-v { color: var(--text-jade, var(--accent-jade)); }
.inv-card__stat--warn .inv-card__stat-v { color: var(--text-danger); }
/* A 1:1：角标列在右侧纵向堆叠 */
.inv-card__chips {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: var(--space-4);
    flex: none;
    align-items: flex-end;
    max-width: 88px;
}
.inv-state-chip {
    padding: var(--space-2) var(--space-6);
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    font-weight: 700;
    white-space: nowrap;
    line-height: 1.5;
    background: color-mix(in srgb, var(--inv-wb-raised) 90%, transparent);
}
.inv-state-chip--gold {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 45%, var(--border-color));
    color: var(--inv-wb-accent);
    background: color-mix(in srgb, var(--inv-wb-accent) 8%, transparent);
}
/* 野装：偏冷灰，与锻造金色区分 */
.inv-state-chip--wild {
    border-color: color-mix(in srgb, var(--text-muted) 42%, var(--border-color));
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--text-muted) 10%, transparent);
}
/* 交易冻结：暖橙警示，折叠态一眼可见（坊市/拍卖买入冷冻） */
.inv-state-chip--freeze {
    border-color: color-mix(in srgb, #ff9800 48%, var(--border-color));
    color: #ff9800;
    background: color-mix(in srgb, #ff9800 10%, transparent);
}
/* 限时物品剩余时间 */
.inv-state-chip--expire {
    border-color: color-mix(in srgb, #ff9800 42%, var(--border-color));
    color: #ff9800;
    background: color-mix(in srgb, #ff9800 8%, transparent);
}
/* 已过期 / 高破损 */
.inv-state-chip--danger {
    border-color: color-mix(in srgb, #f44336 45%, var(--border-color));
    color: #f44336;
    background: color-mix(in srgb, #f44336 10%, transparent);
}
/* ===== 装备成色（折叠）=====
   先天贴在名字后；铭文直接铺印鉴，无「天纹×N」前缀。
   展开时隐藏折叠铭文行，避免与下方 inv-lore 铭文块重复。 */
.inv-card__special {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-top: var(--space-6);
    min-width: 0;
}
.inv-card.is-open .inv-card__special {
    display: none;
}
.inv-seal-row {
    display: flex;
    align-items: flex-start;
    gap: var(--space-6);
    min-width: 0;
}
.inv-seal-row__seals {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    min-width: 0;
    flex: 1;
}
.inv-seal {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    max-width: 100%;
    min-height: 18px;
    padding: var(--space-2) var(--space-6) var(--space-2) var(--space-2);
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    line-height: 1.3;
    vertical-align: middle;
    flex: none;
}
.inv-seal__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-xs);
    font-family: var(--font-serif);
    font-size: var(--font-micro);
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.4;
    white-space: nowrap;
}
.inv-seal__body {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-4);
    min-width: 0;
    padding-right: var(--space-2);
}
.inv-seal__name {
    color: inherit;
    font-size: var(--font-micro);
    font-weight: 600;
    white-space: nowrap;
}
.inv-seal__val {
    color: inherit;
    font-family: var(--font-mono);
    font-size: var(--font-micro);
    font-variant-numeric: tabular-nums;
    opacity: 0.92;
    white-space: nowrap;
}

/* 单道铭文小印 */
.inv-seal--insc {
    --insc-quality-color: var(--color-inscription-1);
    border-color: color-mix(in srgb, var(--insc-quality-color) 32%, var(--border-color));
    background: color-mix(in srgb, var(--insc-quality-color) 7%, var(--inv-wb-raised));
    color: var(--insc-quality-color);
}
.inv-seal--insc .inv-seal__mark {
    border: 0;
    background: color-mix(in srgb, var(--insc-quality-color) 16%, transparent);
    color: var(--insc-quality-color);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-micro);
}

/* 展开区：机缘 / 天纹分栏 */
.inv-card__lore {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-10);
}
.inv-lore-block {
    position: relative;
    padding: var(--space-8) var(--space-10) var(--space-10);
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--inv-wb-surface) 55%, transparent);
}
.inv-lore-block::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 2px;
    border-radius: var(--radius-xs);
    background: var(--inv-wb-line);
}
.inv-lore-block--affix {
    border-color: color-mix(in srgb, var(--text-gold) 28%, var(--border-color));
    background: color-mix(in srgb, var(--text-gold) 5%, var(--inv-wb-raised));
}
.inv-lore-block--affix::before {
    background: color-mix(in srgb, var(--text-gold) 70%, transparent);
}
.inv-lore-block--insc {
    border-color: color-mix(in srgb, var(--accent-purple) 28%, var(--border-color));
    background: color-mix(in srgb, var(--accent-purple) 5%, var(--inv-wb-raised));
}
.inv-lore-block--insc::before {
    background: color-mix(in srgb, var(--accent-purple) 70%, transparent);
}
.inv-lore-block__head {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    margin-bottom: var(--space-4);
}
.inv-lore-block__mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 var(--space-6);
    border-radius: var(--radius-xs);
    font-family: var(--font-serif);
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.5;
}
.inv-lore-block--affix .inv-lore-block__mark {
    border: 1px solid color-mix(in srgb, var(--text-gold) 45%, var(--border-color));
    color: var(--text-gold);
    background: color-mix(in srgb, var(--text-gold) 10%, transparent);
}
.inv-lore-block--insc .inv-lore-block__mark {
    border: 1px solid color-mix(in srgb, var(--accent-purple) 45%, var(--border-color));
    color: var(--accent-purple);
    background: color-mix(in srgb, var(--accent-purple) 10%, transparent);
}
.inv-lore-block__title {
    color: var(--inv-wb-muted);
    font-size: var(--font-micro);
    letter-spacing: 0.06em;
}
.inv-lore-block__name {
    color: var(--text-gold);
    font-family: var(--font-serif);
    font-size: var(--font-body);
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.4;
}
.inv-lore-block__desc {
    margin: var(--space-4) 0 0;
    color: var(--text-secondary);
    font-size: var(--font-caption);
    line-height: 1.65;
}
.inv-lore-block__seals {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-top: var(--space-2);
}
/* A 1:1：原型无展开三角，隐藏 */
.inv-card__chevron {
    display: none;
    width: 0;
    height: 0;
}
.inv-card.is-open .inv-card__chevron {
    display: none;
}

/* ===== 展开详情区（手风琴）===== */
.inv-card__expand {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 320ms var(--inv-wb-ease);
}
.inv-card__expand-inner {
    overflow: hidden;
    min-height: 0;
}
.inv-card.is-open .inv-card__expand { grid-template-rows: 1fr; }
.inv-card__detail {
    padding: 0 var(--space-12) var(--space-10);
}
.inv-card__desc {
    margin: 0;
    padding: var(--space-4) 0 0;
    border-top: 0;
    color: var(--inv-wb-muted);
    font-size: var(--font-caption);
    line-height: 1.55;
}
.inv-card__metrics {
    display: grid;
    /* 每列至少留出长状态文案所需宽度；窄卡自动降为单列，避免
       「持有数量」被相邻的「交易冻结 剩余 X小时X分」挤压遮挡。 */
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0 var(--space-14);
    margin-top: var(--space-8);
}
.inv-card__metric {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-4) 0;
    border-bottom: 0; /* A：属性表亦去横线，靠字号/留白分层 */
}
.inv-card__metric dt {
    color: var(--inv-wb-muted);
    font-size: var(--font-micro);
    white-space: nowrap;
}
.inv-card__metric dd {
    min-width: 0;
    margin: 0;
    color: var(--inv-wb-ink);
    font-size: var(--font-label);
    font-weight: 700;
    text-align: right;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

/* ===== 卡片底栏操作 · A 1:1 圆角 4 · 无顶线 · 小钮 ===== */
.inv-card__bar {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-10) var(--space-6);
    border-top: 0;
    overflow: hidden;
}
.inv-card__action {
    flex: 0 0 auto;
    min-height: 0;
    height: auto;
    padding: var(--space-4) var(--space-10);
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--inv-wb-action-radius, var(--radius-xs));
    background: var(--inv-wb-raised);
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-caption);
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 140ms var(--inv-wb-ease), color 140ms var(--inv-wb-ease);
}
.inv-card__action:hover {
    border-color: var(--inv-wb-line-strong);
    color: var(--inv-wb-accent);
}
/* A 1:1：主操作 jade 小钮（非金色渐变） */
.inv-card__action--primary {
    flex: 0 0 auto;
    min-height: 0;
    height: auto;
    border-color: color-mix(in srgb, var(--accent-jade) 45%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-jade) 12%, transparent),
        color-mix(in srgb, var(--accent-jade) 4%, transparent)
    );
    color: var(--accent-jade);
    font-weight: 700;
}
.inv-card__action--primary:hover {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-jade) 18%, transparent),
        color-mix(in srgb, var(--accent-jade) 7%, transparent)
    );
}
.inv-card__action:disabled { cursor: not-allowed; opacity: .42; }
/* 更多按钮：弱化 + CSS 三角箭头 */
.inv-card__action--more {
    color: var(--inv-wb-muted);
    min-width: 0;
    padding: var(--space-4) var(--space-8);
}
.inv-card__action--more::after {
    content: '';
    display: inline-block;
    width: 0; height: 0;
    margin-left: var(--space-4);
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 3.5px solid currentColor;
    vertical-align: middle;
    opacity: .6;
}

/* 卡片「更多」：默认 absolute；打开后 JS 挂到 body + fixed 锚定（见 positionInvCardMoreMenu） */
#inventoryPanel .inv-card__more-menu {
    top: auto;
    bottom: calc(100% + 4px);
    right: 8px;
    min-width: 148px;
    z-index: 35;
}
/* 挂 body 后不再有 #inventoryPanel 祖先，需全局选择器才能显示 */
.inv-card__more-menu.is-open.is-fixed,
#inventoryPanel .inv-card__more-menu.is-open.is-fixed {
    display: block;
    position: fixed;
    right: auto;
    bottom: auto;
    z-index: 100000;
    max-width: min(240px, calc(100vw - 16px));
    -webkit-overflow-scrolling: touch;
    animation: invPopMenuIn 150ms var(--inv-wb-ease, ease);
}
.inv-card__action--more[aria-expanded="true"] {
    border-color: color-mix(in srgb, var(--inv-wb-accent) 42%, var(--border-color));
    color: var(--inv-wb-accent);
}
.inv-card__action--more[aria-expanded="true"]::after {
    transform: rotate(180deg);
    opacity: .9;
}
.inv-card__action--more::after {
    transition: transform 160ms var(--inv-wb-ease), opacity 140ms var(--inv-wb-ease);
}

/* ===== 储物（灵宝司）标签页 ===== */
.inventory-workbench__storage {
    flex: 1;
    min-height: 0;
    padding: var(--space-20) var(--space-14);
    overflow: auto;
}
.inventory-storage-intro {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-bottom: var(--space-14);
}
.inventory-storage-intro__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
}
.inventory-storage-intro__row strong {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--inv-wb-ink);
    font-size: var(--font-action);
}
.inventory-storage-intro__actions { flex: none; }
.inventory-storage-pawn {
    box-sizing: border-box;
    min-height: 44px;
    min-width: 44px;
    padding: 0 var(--space-12);
    border: 1px solid color-mix(in srgb, var(--inv-wb-accent) 48%, var(--border-color));
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--inv-wb-accent) 10%, var(--inv-wb-raised));
    color: var(--inv-wb-accent);
    font-size: var(--font-caption);
    font-weight: 600;
    cursor: pointer;
}
.inventory-storage-intro span { color: var(--inv-wb-muted); font-size: var(--font-caption); }
.inventory-storage-refresh { width: 100%; margin-top: var(--space-10); }
.inventory-workbench__error,
.inventory-workbench__empty-state { padding: var(--space-48) var(--space-24); color: var(--inv-wb-muted); font-size: var(--font-label); line-height: 1.7; text-align: center; }
.inventory-workbench__error button { display: block; margin: var(--space-14) auto 0; }

@media (prefers-reduced-motion: reduce) {
    #inventoryPanel *,
    #inventoryPanel *::before,
    #inventoryPanel *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; }
}

/* 储物列表性能：原先用离屏跳过绘制(content visibility auto)以提速,
   但在老旧 WebView(Chromium < 85 / 部分魔改内核)上, 该特性实现有缺陷——
   滚动/点搜索框(软键盘改可视高度)时会反复对上百个列表项重算布局并触发 渲染/回收, 反而卡顿严重。
   改为 contain(布局/样式/绘制隔离): 所有内核都安全, 仍能缩小重排范围,
   对老 WebView 立竿见影, 对现代浏览器几乎无副作用。
   注意：.inv-card 不得含 paint——会变成 fixed 的 containing block，
   卡片底栏「更多」菜单(fixed 锚定)会被裁切/定位错乱，表现为点更多无反应。 */
.inventory-list > :where(.inventory-item, .inv-group, .inv-market-section) {
    contain: layout style paint;
}
.inventory-list > .inv-card {
    contain: layout style;
}

.cave-list {
    gap: 0;
    padding: 0;
}

.cave-view {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    padding: var(--space-2) 0 var(--space-8);
}

.cave-stamp {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 var(--space-6);
    border-radius: var(--radius-xs);
    font-size: var(--font-micro);
    font-weight: 800;
    letter-spacing: 0.04em;
    border: 1px solid var(--border-color);
    color: var(--text-muted);
    background: var(--bg-panel, transparent);
}
.cave-stamp--grow {
    color: var(--text-jade, var(--accent-jade));
    border-color: color-mix(in srgb, var(--accent-jade) 35%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}
.cave-stamp--ready {
    color: var(--accent-orange, #c47a22);
    border-color: color-mix(in srgb, var(--accent-orange, #c47a22) 40%, transparent);
    background: color-mix(in srgb, var(--accent-orange, #c47a22) 10%, transparent);
}
.cave-stamp--guard {
    color: var(--accent-purple);
    border-color: color-mix(in srgb, var(--accent-purple) 35%, transparent);
    background: color-mix(in srgb, var(--accent-purple) 8%, transparent);
}
.cave-field-stamps {
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: flex-end;
}

.cave-tabbar {
    position: sticky;
    top: 0;
    z-index: 3;
    display: flex;
    gap: var(--space-4);
    overflow-x: auto;
    padding: var(--space-4);
    margin-bottom: var(--space-2);
    border: 1px solid color-mix(in srgb, var(--border-color) 88%, transparent);
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--bg-card, var(--bg-panel)) 88%, transparent);
    backdrop-filter: blur(8px);
    scrollbar-width: none;
}

.cave-tabbar::-webkit-scrollbar {
    display: none;
}

.cave-tab {
    flex: 1 0 auto;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    padding: 0 var(--space-12);
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-muted);
    font: inherit;
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 0.04em;
    white-space: nowrap;
    cursor: pointer;
}

.cave-tab.is-active {
    background: color-mix(in srgb, var(--accent-jade) 14%, var(--bg-card, transparent));
    color: var(--accent-jade);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-jade) 35%, transparent);
}

.cave-tab em {
    min-width: 17px;
    height: 17px;
    padding: 0 var(--space-6);
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--accent-orange) 18%, transparent);
    color: var(--accent-orange);
    font-size: var(--font-micro);
    font-style: normal;
    line-height: 17px;
    text-align: center;
}

.cave-tab-panel {
    min-width: 0;
}

.cave-action-btn {
    min-height: 40px;
    margin-top: var(--space-8);
}

/* 换访道友折叠列表：拜访界面内直接跳转其他道友洞府 */
.cave-friend-visit-list {
    margin-top: var(--space-4);
}

.cave-friend-visit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
    max-height: 240px;
    overflow-y: auto;
    padding: var(--space-2);
}

.cave-friend-visit-item {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-8) var(--space-10);
    border: 1px solid var(--border-soft, var(--glass-white-1));
    border-radius: var(--radius-md);
    background: var(--glass-white-2);
    color: var(--text-main, var(--bg-secondary));
    cursor: pointer;
    text-align: left;
    transition: background 0.15s, border-color 0.15s;
}

.cave-friend-visit-item:hover {
    background: color-mix(in srgb, var(--canghai-teal) 12%, transparent);
    border-color: var(--accent-jade, var(--canghai-teal));
}

.cave-friend-visit-item__name {
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--text-gold, var(--craft-gold-soft));
}

.cave-friend-visit-item__raw {
    font-size: var(--font-caption);
    font-weight: 400;
    color: var(--text-muted, #999);
}

.cave-friend-visit-item__sub {
    font-size: var(--font-caption);
    color: var(--text-muted, #999);
}

.cave-danger-row .cave-action-btn {
    border-color: color-mix(in srgb, var(--jimo-crimson) 36%, transparent);
    color: var(--text-danger);
    background: color-mix(in srgb, var(--jimo-crimson) 6%, transparent);
}

.cave-companion-search-result {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-top: var(--space-6);
}

.cave-field-card {
    border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
    border-radius: var(--radius-md);
    padding: var(--space-8) var(--space-8);
    margin-top: 0;
    background: var(--glass-white-3);
    min-width: 0;
}

.cave-field-card--mature {
    border-color: color-mix(in srgb, var(--accent-gold) 46%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}

.cave-field-card--planted {
    border-color: color-mix(in srgb, var(--accent-jade) 36%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 6%, transparent);
}

.cave-field-card--idle {
    border-style: dashed;
}

.cave-field-summary {
    color: var(--text-muted);
    font-size: var(--font-label);
    line-height: 1.6;
    min-width: 0;
}

.cave-field-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: var(--space-6);
    margin-top: var(--space-6);
}

.cave-field-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    color: var(--text-secondary);
    font-size: var(--font-label);
    line-height: 1.3;
}

.cave-field-head span {
    flex: none;
    color: var(--text-muted);
}

.cave-field-crop {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    min-width: 0;
    margin-top: var(--space-4);
    color: var(--text-muted);
    font-size: var(--font-label);
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cave-field-crop b {
    min-width: 0;
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cave-field-crop span {
    flex: none;
    color: var(--text-dim);
}

.cave-field-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-4);
    margin-top: var(--space-6);
}

.cave-field-actions .cave-action-btn {
    margin-top: var(--space-8);
}

.cave-field-actions .cave-action-btn:last-child {
    border-color: color-mix(in srgb, var(--jimo-crimson) 30%, transparent);
    color: var(--text-danger);
    background: color-mix(in srgb, var(--jimo-crimson) 5%, transparent);
}

.friend-btn-badge.cave-alert-badge {
    width: auto;
    min-width: 14px;
    height: 14px;
    line-height: 14px;
    font-size: var(--font-micro);
    padding: 0 var(--space-4);
    color: #fff;
    text-align: center;
}

@media (max-width: 520px) {
    .cave-field-actions {
        grid-template-columns: 1fr;
    }

    .cave-field-actions {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.inventory-empty {
    color: var(--text-dim);
    text-align: center;
    padding: var(--space-32) 0;
}

/* 储物「装备」分类：已装备不在列表的提示条 */
.inv-equip-hint {
    display: flex;
    align-items: center;
    gap: var(--space-10);
    margin: 0 0 var(--space-10);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 28%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 10%, var(--bg-card, var(--bg-secondary)));
    color: var(--text-secondary);
    font-size: var(--font-label);
    line-height: 1.45;
}
.inv-equip-hint__text {
    flex: 1;
    min-width: 0;
}
.inv-equip-hint__text strong {
    color: var(--text-gold);
    font-weight: 600;
}
.inv-equip-hint__btn {
    flex-shrink: 0;
    border: 1px solid color-mix(in srgb, var(--accent-gold) 45%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 14%, transparent);
    color: var(--text-gold);
    border-radius: var(--radius-pill);
    padding: var(--space-6) var(--space-12);
    font-size: var(--font-caption);
    font-weight: 600;
    cursor: pointer;
}
.inv-equip-hint__btn:hover {
    background: color-mix(in srgb, var(--accent-gold) 22%, transparent);
}

/* 穿戴成功后左侧法相格短暂高亮 */
#equipGridContainer.equip-grid-hint-flash {
    outline: 2px solid color-mix(in srgb, var(--accent-gold) 70%, transparent);
    outline-offset: 2px;
    border-radius: var(--radius-md);
    animation: equipGridHintPulse 1.6s ease;
}
@keyframes equipGridHintPulse {
    0%, 100% { outline-color: color-mix(in srgb, var(--accent-gold) 35%, transparent); }
    40% { outline-color: color-mix(in srgb, var(--accent-gold) 85%, transparent); }
}

/* ═══════════════════════════════════════════════════════════════
   筛选胶囊 Tab 基线（全局）
   ─────────────────────────────────────────────────────────────
   横滑胶囊（border-radius: var(--radius-pill)）· 透明底 · 金选中
   覆盖：储物 / 坊市 / 拍卖 / 商铺 / 灵兽 / 功法筛选 / ItemPicker
   ═══════════════════════════════════════════════════════════════ */
.inventory-filter-tabs,
.ip-filter-tabs {
    --inv-tab-line: var(--inv-wb-line, color-mix(in srgb, var(--border-color) 82%, transparent));
    --inv-tab-accent: var(--inv-wb-accent, var(--accent-gold));
    /* 胶囊：始终 999，不跟卡片 --inv-wb-radius(8) 走 */
    
    --inv-tab-ease: var(--inv-wb-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
    display: flex;
    flex-shrink: 0;
    flex-wrap: nowrap;
    gap: var(--space-6);
    margin: 0 0 var(--space-8);
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 0;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    /* 手机端侧栏 touch-action 曾仅 pan-y，导致 Tab 无法左右滑 */
    touch-action: pan-x pan-y;
}
.inventory-filter-tabs::-webkit-scrollbar,
.ip-filter-tabs::-webkit-scrollbar {
    display: none;
}

/* #6712 / #9592：电脑宽露出储物、商铺分柜细横条；平板/手机仍藏条、手指横滑 */
@media (min-width: 1025px) {
    #inventoryPanel .inventory-workbench__tabs,
    #shopPanel.shop-workbench .shop-workbench__tabs {
        scrollbar-width: thin;
        scrollbar-color: color-mix(in srgb, var(--color-border-default) 80%, transparent) transparent;
    }
    #inventoryPanel .inventory-workbench__tabs::-webkit-scrollbar,
    #shopPanel.shop-workbench .shop-workbench__tabs::-webkit-scrollbar {
        display: block;
        height: 6px;
    }
    #inventoryPanel .inventory-workbench__tabs::-webkit-scrollbar-track,
    #shopPanel.shop-workbench .shop-workbench__tabs::-webkit-scrollbar-track {
        background: transparent;
    }
    #inventoryPanel .inventory-workbench__tabs::-webkit-scrollbar-thumb,
    #shopPanel.shop-workbench .shop-workbench__tabs::-webkit-scrollbar-thumb {
        background: color-mix(in srgb, var(--color-border-default) 80%, transparent);
        border-radius: var(--radius-pill);
    }
}

.inv-filter-tab {
    flex: 0 0 auto;
    box-sizing: border-box;
    width: auto;
    height: 30px;
    min-height: 30px;
    max-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    padding: 0 var(--space-12);
    border: 1px solid var(--inv-tab-line, color-mix(in srgb, var(--border-color) 82%, transparent));
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-family: inherit;
    font-size: var(--font-label);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transform: none;
    position: relative;
    overflow: visible;
    appearance: none;
    -webkit-appearance: none;
    transition:
        color 140ms var(--inv-tab-ease, ease),
        border-color 140ms var(--inv-tab-ease, ease),
        background 140ms var(--inv-tab-ease, ease);
}

.inv-filter-tab:hover {
    color: var(--inv-tab-accent, var(--accent-gold));
    border-color: color-mix(in srgb, var(--inv-tab-accent, var(--accent-gold)) 35%, var(--border-color));
    background: transparent;
}

.inv-filter-tab.active,
.inv-filter-tab.active:hover {
    background: color-mix(in srgb, var(--inv-tab-accent, var(--accent-gold)) 10%, transparent);
    border-color: color-mix(in srgb, var(--inv-tab-accent, var(--accent-gold)) 42%, transparent);
    color: var(--inv-tab-accent, var(--accent-gold));
}

.inv-filter-tab:active {
    transform: none;
}

/* 坊市 / 拍卖 / 商铺 / 储物 workbench：胶囊 + chrome 内边距 */
#inventoryPanel .inventory-workbench__tabs,
#marketPanel.market-workbench .market-workbench__tabs,
#auctionPanel.auction-workbench .auction-workbench__tabs,
#shopPanel.shop-workbench .shop-workbench__tabs,
#transmitPanel.transmit-workbench .transmit-workbench__tabs {
    flex: none;
    margin: 0;
    padding: 0 var(--space-12) var(--space-8);
    gap: var(--space-6);
}

#shopPanel.shop-workbench .shop-workbench__tabs.is-dragging {
    cursor: grabbing;
    user-select: none;
}

#shopPanel.shop-workbench .shop-workbench__tabs.is-dragging .inv-filter-tab {
    pointer-events: none;
}
#inventoryPanel .inventory-workbench__tabs .inv-filter-tab,
#marketPanel.market-workbench .market-workbench__tabs .inv-filter-tab,
#auctionPanel.auction-workbench .auction-workbench__tabs .inv-filter-tab,
#shopPanel.shop-workbench .shop-workbench__tabs .inv-filter-tab,
#transmitPanel.transmit-workbench .transmit-workbench__tabs .inv-filter-tab {
    border-radius: var(--radius-pill) !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 var(--space-12) !important;
}

/* 灵兽面板主 Tab 容器与全局同构 */
#petPanel > .inventory-filter-tabs {
    margin: 0 0 var(--space-10);
    padding: 0 var(--space-2);
}

/* 功法/技能筛选：条目多，允许换行（仍是 chip，不均分撑满） */
.technique-filter-tabs.inventory-filter-tabs,
.technique-filter-tabs {
    flex-wrap: wrap;
    overflow-x: visible;
    margin-bottom: var(--space-10);
    gap: var(--space-6);
}

/* 灵兽先天词条 chip：独立 class，避免 switchTab 清 active 误伤 */
.pet-talent-tab {
    flex: 0 0 auto;
    box-sizing: border-box;
    height: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 var(--space-12);
    font-size: var(--font-caption);
    font-family: inherit;
    font-weight: 600;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
    color: var(--text-secondary);
    border-radius: var(--radius-pill);
    cursor: pointer;
    white-space: nowrap;
    transition:
        color 140ms ease,
        border-color 140ms ease,
        background 140ms ease;
    white-space: nowrap;
}
.pet-talent-tab:hover {
    color: var(--accent-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: transparent;
}
.pet-talent-tab.active,
.pet-talent-tab.active:hover {
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
    border-color: color-mix(in srgb, var(--accent-gold) 42%, transparent);
    color: var(--text-gold, var(--accent-gold));
}

/* #9951：兽袋「种类/境界」下拉筛选行。规则镜像 game-item-picker.css 的
   .ip-filter-row / .ip-filter-select（#6736 并排下拉、少占列表高度）；
   FixedSelect 升级后原生 select 被换成 .fx-select wrap，wrap 与按钮需一并吃满行宽 */
.pet-filter-row {
    display: flex;
    align-items: stretch;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}
.pet-filter-row .pet-filter-select,
.pet-filter-row .fx-select {
    flex: 1 1 0;
    min-width: 0;
}
.pet-filter-select {
    font-size: var(--font-label);
    padding: var(--space-8) var(--space-10);
}
.pet-filter-row .fx-select__btn {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* 灵宠游历：路线/时长按钮列表（替代原生 select，避免侧栏内点不开） */
.pet-explore-route-label {
    color: var(--text-muted);
    font-size: var(--font-caption);
    margin: 0 0 var(--space-6);
    letter-spacing: 0.04em;
}
.pet-explore-route-picker {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
    margin-bottom: var(--space-8);
}
.pet-explore-route-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
    min-width: 0;
    padding: var(--space-8) var(--space-10);
    border: 1px solid color-mix(in srgb, var(--border-color) 88%, transparent);
    border-radius: var(--radius-sm);
    background: var(--bg-card);
    color: var(--text-primary);
    font: inherit;
    font-size: var(--font-label);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    position: relative;
    z-index: 1;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
}
.pet-explore-route-btn:hover {
    border-color: color-mix(in srgb, var(--accent-blue, #4a90d9) 45%, var(--border-color));
    color: var(--text-gold);
}
.pet-explore-route-btn.is-active {
    border-color: color-mix(in srgb, var(--accent-blue, #4a90d9) 55%, var(--border-color));
    background: color-mix(in srgb, var(--accent-blue, #4a90d9) 12%, var(--bg-card));
    color: var(--text-gold);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-blue, #4a90d9) 22%, transparent);
}
.pet-explore-route-btn__name {
    font-weight: 600;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}
.pet-explore-route-btn__time {
    color: var(--text-muted);
    font-size: var(--font-caption);
    font-variant-numeric: tabular-nums;
}
.pet-explore-route-btn.is-active .pet-explore-route-btn__time {
    color: color-mix(in srgb, var(--accent-blue, #4a90d9) 70%, var(--text-secondary));
}
@media (max-width: 380px) {
    .pet-explore-route-picker {
        grid-template-columns: 1fr;
    }
}

/* ===== 储物搜索框（非工作台兜底）===== */
.inv-search-wrap {
    margin-bottom: var(--space-8);
}

.inv-search-input {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    box-sizing: border-box;
    height: 36px;
    min-height: 36px;
    max-height: 36px;
    padding: 0 var(--space-10);
    font-size: var(--font-title);
    font-family: var(--font-serif);
    line-height: 36px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    border-radius: var(--radius-xs);
    outline: none;
    transition: border-color 0.15s;
}

.inv-search-input::placeholder {
    color: var(--text-dim);
}

.inv-search-input:focus {
    border-color: var(--primary);
}

.inv-extra-filter-select {
    flex: 1;
    padding: var(--space-4) var(--space-6);
    font-size: var(--font-caption);
    font-family: var(--font-serif);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    border-radius: var(--radius-xs);
    cursor: pointer;
    outline: none;
}

.inv-extra-filter-select:focus {
    border-color: var(--primary);
}

/* ===== 折叠分组 ===== */
.inv-group {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
}

.inv-group-header {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding: var(--space-8) var(--space-10);
    background: var(--bg-card);
    cursor: pointer;
    user-select: none;
    transition: background 0.15s;
    border-radius: var(--radius-sm);
}

.inv-group-header:hover {
    background: var(--bg-card-hover);
}

.inv-group-name {
    font-weight: 600;
    font-size: var(--font-body);
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.inv-group-count {
    font-size: var(--font-caption);
    color: var(--text-dim);
    white-space: nowrap;
}

.inv-group-arrow {
    /* 与 ui-disclosure-caret 同规格；收起朝右、展开朝下 */
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 4px solid currentColor;
    color: var(--text-dim);
    opacity: 0.6;
    transition: transform 0.2s;
    flex-shrink: 0;
    transform: rotate(-90deg);
}

.inv-group-arrow.expanded {
    transform: rotate(0deg);
}

.inv-group-body {
    display: none;
    padding: var(--space-6) var(--space-8);
    background: var(--shadow-black-3);
    flex-direction: column;
    gap: var(--space-6);
}

.inv-group-body.show {
    display: flex;
}

/* 当组内容展开时，移除总头部的下方圆角修正 */
.inv-group:has(.inv-group-body.show) .inv-group-header {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* ===== 工作台同名折叠组 · A 1:1（无左轨 · 圆角 12 · 与玉简卡同壳） ===== */
#inventoryPanel .inv-group--workbench {
    border: 1px solid var(--inv-wb-line);
    border-radius: var(--inv-wb-card-radius, var(--radius-md));
    background: var(--inv-wb-raised);
    /* 覆盖列表项 contain:paint — 展开子卡片时 paint 隔离会裁切/量高异常 */
    contain: style;
    overflow: hidden;
    flex: 0 0 auto !important;
    min-height: 0 !important;
    height: auto !important;
}
#inventoryPanel .inv-group--workbench .inv-group-header {
    /* A：无左轨 — 主信息 | 数量 | 箭头；操作行通栏 */
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 16px;
    grid-template-areas:
        "main count arrow"
        "actions actions actions";
    align-items: start;
    column-gap: var(--space-8);
    row-gap: var(--space-6);
    padding: var(--space-10) var(--space-12) var(--space-8);
    border-radius: 0;
    background: transparent;
    cursor: pointer;
}
#inventoryPanel .inv-group--workbench .inv-group-header:hover {
    background: color-mix(in srgb, var(--inv-wb-accent) 4%, var(--inv-wb-raised));
}
/* A：左轨隐藏（DOM 可留，不占格） */
#inventoryPanel .inv-group-rail {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    box-shadow: none !important;
}
#inventoryPanel .inv-group-main {
    grid-area: main;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    pointer-events: none; /* 点击穿透到 header，避免子节点吞事件 */
}
#inventoryPanel .inv-group--workbench .inv-group-name {
    color: var(--rarity-color, var(--inv-wb-ink, var(--text-primary)));
    font-family: var(--font-serif);
    font-size: var(--font-body-lg);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.3;
}
#inventoryPanel .inv-group-desc {
    display: block;
    font-size: var(--font-caption);
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.45;
}
#inventoryPanel .inv-group-badge--ok { color: #8fcf8f; }
#inventoryPanel .inv-group-badge--purple { color: #c792ea; }
#inventoryPanel .inv-group-badge--warn { color: #ffb347; }
#inventoryPanel .inv-group-actions {
    grid-area: actions;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    min-width: 0;
    pointer-events: auto;
}
#inventoryPanel .inv-group-actions:empty { display: none; }
/* 组操作钮：与卡底栏同 4px 小钮 */
#inventoryPanel .inv-group--workbench :where(.btn-group-salvage, .btn-group-sell, .btn-group-discard, .btn-synthesize-item, .btn-disabled) {
    height: auto !important;
    min-height: 0 !important;
    padding: var(--space-4) var(--space-10) !important;
    border-radius: var(--inv-wb-action-radius, var(--radius-xs)) !important;
    font-size: var(--font-caption) !important;
    font-weight: 600;
    line-height: 1.4;
    margin: 0 !important;
}
#inventoryPanel .inv-group--workbench .inv-group-count {
    grid-area: count;
    justify-self: end;
    align-self: start;
    color: var(--text-secondary);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    pointer-events: none;
    white-space: nowrap;
}
#inventoryPanel .inv-group--workbench .inv-group-count em {
    font-style: normal;
    color: var(--text-dim);
    font-size: var(--font-micro);
    font-weight: 500;
}
#inventoryPanel .inv-group--workbench .inv-group-arrow {
    grid-area: arrow;
    justify-self: end;
    align-self: start;
    margin-top: var(--space-4);
    pointer-events: none;
    /* 小三角，对齐原型 */
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid var(--text-dim);
    background: none;
    opacity: 0.55;
}
#inventoryPanel .inv-group--workbench.is-expanded .inv-group-arrow,
#inventoryPanel .inv-group--workbench:has(.inv-group-body.show) .inv-group-arrow {
    transform: rotate(180deg);
    border-top-color: var(--inv-wb-accent);
}
/* 展开显隐：提高优先级，避免被其它 display 规则压掉 */
#inventoryPanel .inv-group--workbench .inv-group-body {
    display: none;
    flex-direction: column;
    padding: 0 var(--space-8) var(--space-8);
    gap: var(--space-6);
    background: transparent;
    border-top: 0;
    min-height: 0;
}
#inventoryPanel .inv-group--workbench .inv-group-body.show,
#inventoryPanel .inv-group--workbench.is-expanded .inv-group-body {
    display: flex;
}
#inventoryPanel .inv-group--workbench .inv-group-body .inv-card {
    box-shadow: none;
}
@media (max-width: 420px) {
    #inventoryPanel .inv-group--workbench .inv-group-header {
        grid-template-columns: minmax(0, 1fr) auto 16px;
        grid-template-areas:
            "main count arrow"
            "actions actions actions";
    }
}

/* 今日使用统计 · A 1:1 圆角 10 · 不透底 · 不占幽灵高度 */
#inventoryPanel .daily-usage-stats {
    flex: 0 0 auto;
    margin: var(--space-8) var(--space-12) 0;
    padding: var(--space-8) var(--space-10);
    border: 1px solid var(--inv-wb-line-soft, var(--inv-wb-line));
    background-color: var(--inv-wb-raised);
    background-image: none;
    border-radius: var(--inv-wb-card-radius, var(--radius-md));
    font-size: var(--font-caption);
}
#inventoryPanel .daily-usage-stats.hidden {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

#inventoryPanel .daily-usage-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    color: var(--accent-gold);
    font-size: var(--font-caption);
    font-family: var(--font-serif);
    font-weight: 600;
    user-select: none;
}

#inventoryPanel .daily-usage-toggle:hover {
    opacity: 0.85;
}

#inventoryPanel .daily-usage-arrow {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 4px solid currentColor;
    opacity: 0.6;
    transition: transform 0.2s;
    transform: rotate(-90deg);
}

#inventoryPanel .daily-usage-arrow.expanded {
    transform: rotate(0deg);
}

#inventoryPanel .daily-usage-body {
    display: none;
    margin-top: var(--space-8);
    max-height: min(42vh, 320px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

#inventoryPanel .daily-usage-body.show {
    display: block;
}

#inventoryPanel .daily-usage-row {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-4) 0;
}

#inventoryPanel .daily-usage-label {
    width: 72px;
    color: var(--text-secondary);
    font-size: var(--font-caption);
    flex-shrink: 0;
}

#inventoryPanel .daily-usage-bar {
    flex: 1;
    height: 5px;
    background: color-mix(in srgb, var(--border-color) 60%, transparent);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

#inventoryPanel .daily-usage-bar-fill {
    height: 100%;
    border-radius: var(--radius-pill);
    transition: width 0.3s ease;
    background: var(--accent-jade);
}

#inventoryPanel .daily-usage-bar-fill.warn {
    background: var(--accent-gold);
}

#inventoryPanel .daily-usage-bar-fill.full {
    background: var(--accent-crimson);
}

#inventoryPanel .daily-usage-count {
    width: 38px;
    text-align: right;
    font-size: var(--font-caption);
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
    flex-shrink: 0;
}

#inventoryPanel .daily-usage-count.full {
    color: var(--accent-crimson);
}

/* 卡片基类：与 .shop-item/.court-card/.task-card 等(:where 合并)保持同构，
   新卡片请直接用 .lv-card。border-radius 统一用 --radius-md。 */
.inventory-item {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-8) var(--space-10);
}

/* 拆堆后定位高亮（prepareStackedEquipForInstanceWork → scrollInventoryToItem） */
.inventory-item.inventory-item--flash {
    animation: inv-item-flash 1.6s ease-out 1;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent-gold, #c9a227) 65%, transparent);
}
@keyframes inv-item-flash {
    0% { background: color-mix(in srgb, var(--accent-gold, #c9a227) 22%, var(--bg-card)); }
    100% { background: var(--bg-card); }
}

/* ══════════════════════════════════════
   灵兽轩 · B 兽录台
   顶条工具 + 游历条 + 列表 feed 卡
   置顶/锁定用 chip，禁止 border-left 左轨
   ══════════════════════════════════════ */
#petList.pet-list--desk,
.pet-list--desk {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
}

.pet-b-top {
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    background: var(--bg-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
.pet-b-top__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}
.pet-b-top__cap {
    font-size: var(--font-body);
    color: var(--text-primary);
}
.pet-b-top__cap b {
    color: var(--text-gold);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-variant-numeric: tabular-nums;
}
.pet-b-top__tools {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.pet-b-top__hint,
.pet-b-explore__hint {
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
}
.pet-b-muted {
    font-size: var(--font-label);
    color: var(--text-muted);
}
.pet-b-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 0 var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-family: inherit;
    font-size: var(--font-caption);
    cursor: pointer;
    white-space: nowrap;
    -webkit-appearance: none;
    appearance: none;
}
.pet-b-btn:active { opacity: 0.88; }
.pet-b-btn--jade {
    border-color: color-mix(in srgb, var(--accent-jade, var(--accent-jade)) 40%, transparent);
    background: color-mix(in srgb, var(--accent-jade, var(--accent-jade)) 10%, transparent);
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}
.pet-b-btn--gold {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
    color: var(--text-gold);
    font-weight: 600;
}
.pet-b-btn--danger {
    border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 38%, transparent);
    background: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 8%, transparent);
    color: var(--text-danger, var(--accent-crimson));
}

/* 游历条 */
.pet-b-explore {
    padding: var(--space-10) var(--space-12);
    border: 1px solid color-mix(in srgb, var(--accent-blue, #3a6ea5) 36%, transparent);
    border-radius: var(--radius-lg);
    background: color-mix(in srgb, var(--accent-blue, #3a6ea5) 6%, var(--bg-card));
}
.pet-b-explore__h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}
.pet-b-explore__toggle {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-width: 0;
    flex: 1;
    padding: var(--space-2) 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.pet-b-explore__title {
    flex-shrink: 0;
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text-blue, var(--accent-blue));
}
.pet-b-explore__sum {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-secondary);
    font-weight: 400;
    font-size: var(--font-label);
}
.pet-b-explore__body { margin-top: var(--space-10); }

.pet-b-empty {
    text-align: center;
    padding: var(--space-24) var(--space-14);
    border: 1px dashed var(--border-color);
    border-radius: var(--radius-lg);
    background: var(--bg-card);
    color: var(--text-muted);
    font-size: var(--font-body);
    line-height: 1.55;
}
.pet-b-empty strong {
    display: block;
    margin-bottom: var(--space-6);
    color: var(--text-secondary);
    font-size: var(--font-body);
}

.pet-b-chip {
    display: inline-flex;
    align-items: center;
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    font-size: var(--font-micro);
    line-height: 1.4;
    color: var(--text-muted);
    white-space: nowrap;
    vertical-align: middle;
}
.pet-b-chip--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 36%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
.pet-b-chip--jade {
    color: var(--text-jade, var(--accent-jade));
    border-color: color-mix(in srgb, var(--accent-jade) 36%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}
.pet-b-chip--blue {
    color: var(--text-blue, var(--accent-blue));
    border-color: color-mix(in srgb, var(--accent-blue) 36%, transparent);
    background: color-mix(in srgb, var(--accent-blue) 10%, transparent);
}
.pet-b-chip--purple {
    color: var(--accent-purple);
    border-color: color-mix(in srgb, var(--accent-purple) 36%, transparent);
    background: color-mix(in srgb, var(--accent-purple) 10%, transparent);
}

.inventory-item.pet-card,
.inventory-item.pet-feed {
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
}
.inventory-item.pet-card:hover,
.inventory-item.pet-card:focus-visible,
.inventory-item.pet-feed:hover,
.inventory-item.pet-feed:focus-visible {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent-gold) 14%, transparent);
    outline: none;
}

/* 状态：全边框色，无左轨 */
.inventory-item.pet-card.is-deploy,
.inventory-item.pet-feed.is-deploy {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 6%, var(--bg-card));
}
.inventory-item.pet-card.is-guard,
.inventory-item.pet-feed.is-guard {
    border-color: color-mix(in srgb, var(--accent-jade) 40%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 5%, var(--bg-card));
}
.inventory-item.pet-card.is-explore,
.inventory-item.pet-feed.is-explore {
    border-color: color-mix(in srgb, var(--accent-blue) 40%, transparent);
    background: color-mix(in srgb, var(--accent-blue) 5%, var(--bg-card));
}
.inventory-item.pet-card.is-ready,
.inventory-item.pet-feed.is-ready {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-gold) 16%, transparent);
}

/* 置顶/锁定：类名保留兼容；视觉改由 pet-pin-badge / pet-lock-badge 表达，禁止 border-left 左轨 */

.pet-feed__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-8) var(--space-10);
    align-items: start;
}
.pet-feed__main { min-width: 0; }
.pet-feed__name {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4);
}
.pet-feed.is-deploy .pet-feed__name { color: var(--text-gold); }
.pet-feed__sub {
    margin-top: var(--space-4);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4) var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.pet-feed__realm {
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}
.pet-feed__vitals {
    margin-top: var(--space-6);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8) var(--space-12);
    font-size: var(--font-caption);
}
/* 列表卡内兽诀槽：横向排列，窄宽可换行 */
.pet-feed__skills,
.pet-list--desk .pet-skill-slot-list--compact.pet-feed__skills {
    margin-top: var(--space-6);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--space-6);
    grid-template-columns: none;
}
.pet-feed__skills .pet-skill-slot,
.pet-feed__skills .pet-skill-slot--compact {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}
.pet-feed__cta { flex-shrink: 0; }
.pet-b-cta {
    min-width: 64px;
    min-height: 36px;
    padding: 0 var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-family: inherit;
    font-size: var(--font-label);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.pet-b-cta:disabled { opacity: 0.55; cursor: not-allowed; }
.pet-b-cta--jade {
    border-color: color-mix(in srgb, var(--accent-jade) 40%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
    color: var(--text-jade, var(--accent-jade));
}
.pet-b-cta--danger {
    border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 38%, transparent);
    background: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 8%, transparent);
    color: var(--text-danger, var(--accent-crimson));
}
.pet-b-cta--blue {
    border-color: color-mix(in srgb, var(--accent-blue) 38%, transparent);
    color: var(--text-blue, var(--accent-blue));
}

.pet-feed__exp-lab {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-bottom: var(--space-4);
    font-variant-numeric: tabular-nums;
}
.pet-feed__exp-lab.is-full {
    color: var(--text-gold);
    font-weight: 600;
}

.pet-b-hint {
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px dashed color-mix(in srgb, var(--accent-gold) 40%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-secondary);
}
.pet-b-hint b { color: var(--text-gold); }
.pet-b-hint__t {
    font-weight: 600;
    color: var(--text-gold);
    margin-bottom: var(--space-2);
}
.pet-b-hint__sub {
    margin-top: var(--space-2);
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.pet-b-hint--muted {
    border-color: var(--border-color);
    background: color-mix(in srgb, var(--bg-panel, var(--bg-card)) 80%, transparent);
}
.pet-b-hint--muted .pet-b-hint__t { color: var(--text-muted); }

.pet-feed__ops {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px dashed color-mix(in srgb, var(--border-color) 80%, transparent);
}
.pet-b-op {
    min-height: 28px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-family: inherit;
    font-size: var(--font-micro);
    cursor: pointer;
    white-space: nowrap;
}
.pet-b-op:disabled { opacity: 0.45; cursor: not-allowed; }
.pet-b-op--gold { color: var(--text-gold); border-color: color-mix(in srgb, var(--accent-gold) 36%, transparent); }
.pet-b-op--blue { color: var(--text-blue, var(--accent-blue)); border-color: color-mix(in srgb, var(--accent-blue) 36%, transparent); }
.pet-b-op--cyan { color: var(--accent-cyan); border-color: color-mix(in srgb, var(--accent-cyan) 36%, transparent); }
.pet-b-op--purple { color: var(--accent-purple); border-color: color-mix(in srgb, var(--accent-purple) 36%, transparent); }
.pet-b-op--danger { color: var(--text-danger, var(--accent-crimson)); border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 36%, transparent); }

/* feed 内 item-actions 覆盖旧网格 */
.inventory-item.pet-feed .item-actions,
.inventory-item.pet-feed .pet-feed__ops.item-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: 0;
}

.pet-pin-badge {
    display: inline-flex;
    align-items: center;
    padding: 0 var(--space-6);
    margin: 0;
    font: inherit;
    font-size: var(--font-micro);
    line-height: 16px;
    border-radius: var(--radius-pill);
    color: var(--text-gold);
    border: 1px solid color-mix(in srgb, var(--craft-gold, var(--accent-gold)) 40%, transparent);
    background: color-mix(in srgb, var(--craft-gold, var(--accent-gold)) 8%, transparent);
    font-weight: 500;
    cursor: pointer;
    /* button 重置，避免浏览器默认按钮样式破坏角标（FB#5648） */
    appearance: none;
    -webkit-appearance: none;
}
.pet-pin-badge:hover {
    background: color-mix(in srgb, var(--craft-gold, var(--accent-gold)) 16%, transparent);
}

/* 储物戒置顶标记(物品名右侧金色★) */
.pin-badge {
    display: inline-block;
    margin-left: var(--space-4);
    color: var(--text-gold);
    font-size: var(--font-caption);
    vertical-align: middle;
}

.pet-lock-badge {
    display: inline-flex;
    align-items: center;
    padding: 0 var(--space-6);
    margin: 0;
    font: inherit;
    font-size: var(--font-micro);
    line-height: 16px;
    border-radius: var(--radius-pill);
    color: var(--accent-cyan);
    border: 1px solid color-mix(in srgb, var(--accent-cyan) 40%, transparent);
    background: color-mix(in srgb, var(--accent-cyan) 8%, transparent);
    font-weight: 500;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}
.pet-lock-badge:hover {
    background: color-mix(in srgb, var(--accent-cyan) 16%, transparent);
}

.inventory-item.pet-card .pet-exp-track {
    height: 7px;
    margin: 0;
    border-color: color-mix(in srgb, var(--craft-gold-bright) 45%, var(--border-color));
    background:
        linear-gradient(180deg, var(--shadow-black-2), var(--glass-white-2)),
        color-mix(in srgb, var(--bg-primary) 82%, var(--combat-dark));
    box-shadow:
        inset 0 0 0 1px var(--shadow-black-2),
        inset 0 1px 3px var(--shadow-black-2);
}

.inventory-item.pet-card .pet-exp-bar {
    background: linear-gradient(90deg, var(--accent-gold) 0%, var(--craft-gold-bright) 46%, var(--craft-gold-soft) 100%);
    box-shadow:
        0 0 8px color-mix(in srgb, var(--craft-gold-bright) 46%, transparent),
        inset 0 1px 0 var(--glass-white-1);
}

.inventory-item.pet-card .pet-exp-bar--full {
    background: linear-gradient(90deg, var(--craft-gold) 0%, var(--craft-gold-soft) 48%, var(--bg-secondary) 100%);
    box-shadow:
        0 0 12px color-mix(in srgb, var(--craft-gold-bright) 70%, transparent),
        inset 0 1px 0 var(--glass-white-1);
}

.item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.item-name {
    font-weight: 600;
    font-size: var(--font-body);
}

.item-rarity {
    font-size: var(--font-caption);
    color: var(--text-dim);
}

.item-desc {
    font-size: var(--font-caption);
    color: var(--text-secondary);
    margin-bottom: var(--space-6);
}

/* 装备属性展示 */
.item-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    padding: var(--space-4) 0;
    margin-bottom: var(--space-4);
    font-size: var(--font-caption);
    font-weight: 500;
    letter-spacing: 0.5px;
}

.item-stats .stat-atk {
    color: var(--craft-gold);
}

.item-stats .stat-def {
    color: color-mix(in srgb, var(--craft-gold) 50%, var(--text-muted));
}

.item-stats .stat-hp {
    color: var(--canghai-teal);
}

.item-stats .stat-spirit {
    color: var(--ghost-purple-deep);
}

.stat-inscription {
    display: inline-block;
    font-size: var(--font-caption);
    font-weight: 500;
    letter-spacing: 0.3px;
    margin: var(--space-2) var(--space-2) var(--space-2) 0;
}

/* ===== 铭文弹窗体系 ===== */
.inscription-modal-overlay {
    /* 默认用不透明实色，旧 WebView 不支持 color-mix 时直接生效，避免弹窗整体透明。 */
    
    --insc-modal-panel: var(--bg-card);
    --insc-modal-raised: var(--bg-card-hover);
    --insc-modal-line: var(--border-color);
    --insc-modal-line-strong: var(--border-color);
    --insc-modal-accent: color-mix(in srgb, var(--ghost-purple) 70%, white);
    --insc-modal-danger: var(--danger-color);
    --insc-modal-text: var(--text-primary);
    --insc-modal-muted: var(--text-muted);
}

@supports (color: color-mix(in srgb, #000 50%, #fff)) {
    .inscription-modal-overlay {
        
        --insc-modal-panel: color-mix(in srgb, var(--bg-card) 88%, var(--bg-panel));
        --insc-modal-raised: color-mix(in srgb, var(--bg-card-hover) 58%, var(--bg-card));
        --insc-modal-line: color-mix(in srgb, var(--border-color) 78%, transparent);
        --insc-modal-line-strong: color-mix(in srgb, color-mix(in srgb, var(--ghost-purple) 70%, white) 42%, var(--border-color));
    }
}

/*
 * 不支持 color-mix 的兜底：弹窗内部很多元素用单层 color-mix(..., transparent)，
 * 旧引擎会把整条 background 丢弃而退回透明，这里强制它们用不透明实色。
 */
@supports not (color: color-mix(in srgb, #000 50%, #fff)) {
    .inscription-modal-overlay .modal-content,
.inscription-modal-overlay .inscription-dialog-body,
.inscription-modal-overlay .inscription-section {
        background: var(--bg-card) !important;
        background-image: none !important;
    }

    .inscription-modal-overlay .modal-header-deco,
    .inscription-modal-overlay .modal-header-close,
    .inscription-modal-overlay .inscription-draw-btn--single,
    .inscription-modal-overlay .inscription-draw-btn--ten,
    .insc-result-card {
        background: var(--bg-card-hover) !important;
        background-image: none !important;
    }
}

.inscription-modal-overlay .modal-content {
    width: min(90vw, 392px);
    max-width: 392px;
    max-height: min(92dvh, 780px);
    display: flex;
    flex-direction: column;
    min-height: 0;
    border: 1px solid color-mix(in srgb, var(--border-gold, var(--border-color)) 55%, var(--border-color));
    border-radius: var(--radius-lg);
    background: var(--bg-card) !important;
    box-shadow: var(--shadow-md);
    overflow: hidden;
    color: var(--insc-modal-text);
}

/* B 铭纹台：gc-dialog 壳 */
.inscription-modal-overlay .modal-content.insc-dialog,
.modal-content.modal--decorated.insc-dialog,
.insc-dialog {
    width: min(90vw, 392px);
    max-width: 392px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(92dvh, 780px);
}

.insc-dialog .gc-mid.insc-mid,
.insc-dialog .inscription-dialog-body.insc-mid {
    text-align: left;
    padding: var(--space-12) var(--space-14) var(--space-8);
    max-height: none;
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    gap: var(--space-10);
    background: transparent !important;
}

.insc-item-card {
    padding: var(--space-12);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-2);
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
    background: var(--bg-panel);
}

.insc-item-name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-title);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-gold);
    margin-bottom: var(--space-8);
    line-height: 1.3;
    word-break: break-word;
}

.insc-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}

.insc-chip {
    height: 24px;
    padding: 0 var(--space-10);
    border-radius: var(--radius-pill);
    font-size: var(--font-caption);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    border: 1px solid color-mix(in srgb, var(--border-color) 90%, transparent);
    background: color-mix(in srgb, var(--bg-card) 80%, transparent);
    color: var(--text-secondary);
}

.insc-chip em {
    font-style: normal;
    color: var(--text-gold);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.insc-dialog .inscription-section {
    margin-top: 0 !important;
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 75%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 60%, transparent);
    box-shadow: none;
    padding: var(--space-10) var(--space-12);
}

/* 折叠上限：外层零 padding，由 summary 自管留白，避免双层内边距 */
.insc-dialog .inscription-section--limits {
    padding: 0 !important;
}

.insc-dialog .inscription-section--limits > .inscription-section__toggle {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
    margin: 0;
    padding: var(--space-12);
    list-style: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.insc-dialog .inscription-section--limits > .inscription-section__toggle::-webkit-details-marker,
.insc-dialog .inscription-section--limits > .inscription-section__toggle::marker {
    display: none;
    content: "";
}

.insc-dialog .inscription-section--limits > .inscription-section__toggle > div:first-child {
    flex: 1 1 auto;
    min-width: 0;
}

.insc-dialog .inscription-section--limits .inscription-section__chevron {
    flex: 0 0 auto;
    align-self: center;
    margin-top: 0;
    opacity: 0.55;
}

/* 与 ui-disclosure-caret 的 details[open] 旋转二选一，避免叠转 */
.insc-dialog .inscription-section--limits[open] .inscription-section__chevron {
    transform: none;
}

.insc-dialog .inscription-section--limits .inscription-limit-list {
    padding: 0 var(--space-12) var(--space-12);
}

.insc-dialog .inscription-section__title {
    color: var(--text-gold);
    font-size: var(--font-label);
    font-weight: 600;
    letter-spacing: 0.5px;
    gap: 0;
}

.insc-dialog .inscription-section__title svg {
    display: none;
}

.insc-dialog .inscription-section__note {
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
    margin-top: var(--space-4);
}

.insc-dialog .gc-foot.insc-foot {
    flex: 0 0 auto;
    padding: var(--space-10) var(--space-12) var(--space-12);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
    background: var(--bg-card);
}

/* 底栏：固定 2×2 抽取格 + 全宽关闭，压过 modal-btn-row 的 flex 与窄屏百连通栏 */
.insc-dialog .inscription-actions.modal-btn-row,
.insc-dialog .inscription-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: var(--space-8) !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    width: 100%;
}

.insc-dialog .inscription-actions > * {
    flex: none !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

.insc-dialog .inscription-draw-btn.modal-btn,
.insc-dialog .inscription-draw-btn {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--space-4) !important;
    box-sizing: border-box;
    width: 100%;
    min-height: 52px !important;
    height: 52px !important;
    padding: var(--space-6) var(--space-8) !important;
    border-radius: var(--radius-md);
    font-weight: 600;
    text-align: center;
    line-height: 1.15;
}

.insc-dialog .inscription-draw-btn--single,
.insc-dialog .inscription-draw-btn--ten {
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 12%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--accent-gold, var(--text-gold)) 40%, var(--border-color)) !important;
    color: var(--text-gold) !important;
}

.insc-dialog .inscription-draw-btn--hundred {
    background: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 12%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--accent-jade, var(--text-jade)) 40%, var(--border-color)) !important;
    color: var(--text-jade, var(--accent-jade)) !important;
    /* 禁止窄屏把百连拉成通栏，保持 2×2 */
    grid-column: auto !important;
}

.insc-dialog .inscription-draw-btn--auto {
    background: transparent !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-secondary) !important;
    grid-column: auto !important;
}

.insc-dialog .inscription-draw-btn__text,
.insc-dialog .inscription-draw-btn__cost {
    display: block;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
}

.insc-dialog .inscription-draw-btn__text {
    font-size: var(--font-label);
    font-weight: 600;
    line-height: 1.2;
}

.insc-dialog .inscription-draw-btn__cost {
    font-size: var(--font-caption);
    font-weight: 500;
    opacity: 0.85;
    line-height: 1.2;
    color: inherit;
}

.insc-dialog .inscription-draw-btn:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

.inscription-modal-overlay .modal-header-deco {
    padding: var(--space-16) 66px var(--space-14) var(--space-24);
    border-bottom: 1px solid var(--insc-modal-line);
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
    text-align: left;
}

.inscription-modal-overlay .modal-header-deco__subtitle {
    color: var(--text-gold) !important;
    font-size: var(--font-title);
    font-weight: 700;
    letter-spacing: 0;
    text-shadow: none;
}

.inscription-modal-overlay .modal-header-close {
    top: 12px;
    right: 14px;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-lg);
    border-color: var(--insc-modal-line);
    background: color-mix(in srgb, var(--bg-card-hover) 72%, transparent);
    color: var(--insc-modal-muted);
    box-shadow: none;
}

.inscription-modal-overlay .modal-header-close:hover,
.inscription-modal-overlay .modal-header-close:focus-visible {
    border-color: var(--insc-modal-accent);
    background: color-mix(in srgb, color-mix(in srgb, var(--ghost-purple) 70%, white) 12%, var(--bg-card));
    color: var(--insc-modal-text);
}

.inscription-header-title {
    margin-top: var(--space-6);
    color: var(--text-gold);
    font-size: var(--font-page-title);
    font-weight: 800;
    line-height: 1.25;
}

.inscription-dialog-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: var(--space-12);
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    background: transparent !important;
}

.inscription-section {
    margin-top: 0 !important;
    border-color: var(--insc-modal-line);
    border-radius: var(--radius-lg);
    background: var(--insc-modal-panel);
    padding: var(--space-10) var(--space-12);
}

.inscription-section--pending {
    border-color: color-mix(in srgb, color-mix(in srgb, var(--ghost-purple) 70%, white) 34%, var(--border-color));
}

.inscription-section--limits {
    padding: 0;
}

.inscription-section__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-10);
    margin-bottom: var(--space-10);
}

.inscription-section__title {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    color: var(--text-gold);
    font-size: var(--font-label);
    font-weight: 700;
    line-height: 1.35;
}

.inscription-section__note {
    margin-top: var(--space-4);
    color: var(--insc-modal-muted);
    font-size: var(--font-caption);
    line-height: 1.45;
}

.inscription-section__tools {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-6);
}

.inscription-section__toggle {
    margin-bottom: 0;
    padding: var(--space-12) var(--space-14);
    cursor: pointer;
    list-style: none;
}

.inscription-section__toggle::-webkit-details-marker {
    display: none;
}

.inscription-section__toggle:hover .inscription-section__title,
.inscription-section__toggle:focus-visible .inscription-section__title {
    color: color-mix(in srgb, var(--insc-modal-accent) 76%, var(--text-primary));
}

.inscription-section__toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--insc-modal-accent) 34%, transparent);
    outline-offset: 2px;
}

.inscription-section__chevron {
    flex: 0 0 auto;
    color: var(--insc-modal-muted);
    transition: transform 0.15s ease;
}

.inscription-section--limits[open] .inscription-section__chevron {
    transform: rotate(180deg);
    color: var(--text-gold);
}

.inscription-section--limits .inscription-limit-list {
    display: none;
    padding: 0 var(--space-14) var(--space-12);
}

.inscription-section--limits[open] .inscription-limit-list {
    display: grid;
}

.inscription-mini-btn {
    min-height: 28px;
    height: 28px;
    padding: 0 var(--space-10);
    border-color: color-mix(in srgb, color-mix(in srgb, var(--ghost-purple) 70%, white) 45%, var(--border-color));
    color: var(--insc-modal-accent);
    font-size: var(--font-caption);
}

.inscription-mini-btn--danger {
    border-color: color-mix(in srgb, var(--insc-modal-danger) 44%, var(--border-color));
    color: var(--text-red);
}

.inscription-slot-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: var(--space-8);
}

.inscription-slot-card {
    display: flex;
    align-items: center;
    gap: var(--space-10);
    min-width: 0;
    min-height: 48px;
    padding: var(--space-10) var(--space-10);
    border: 1px solid var(--insc-modal-line);
    border-radius: var(--radius-md);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--bg-card-hover) 42%, transparent), transparent 72%),
        var(--insc-modal-raised);
    box-shadow: inset 0 1px 0 var(--glass-white-2);
}

.inscription-slot-card--filled {
    border-color: color-mix(in srgb, var(--insc-quality-color) 64%, var(--border-color));
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--insc-quality-color) 16%, transparent), transparent 62%),
        color-mix(in srgb, var(--insc-quality-color) 8%, var(--insc-modal-raised));
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--insc-quality-color) 12%, transparent),
        inset 0 1px 0 var(--glass-white-1);
}

.inscription-slot-card--empty {
    opacity: 0.72;
}

.inscription-slot-card__icon {
    flex: 0 0 auto;
    color: var(--insc-quality-color, var(--insc-modal-muted));
    filter: drop-shadow(0 0 4px color-mix(in srgb, var(--insc-quality-color, var(--insc-modal-accent)) 36%, transparent));
}

.inscription-slot-card__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}

.inscription-slot-card__label {
    color: var(--insc-modal-muted);
    font-size: var(--font-caption);
}

.inscription-slot-card__value {
    color: var(--insc-quality-color, var(--text-secondary));
    font-size: var(--font-label);
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-shadow: 0 1px 1px var(--shadow-black-2);
}
.inscription-slot-card__mp {
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-top: var(--space-2);
}

.inscription-limit-list {
    display: grid;
    gap: var(--space-8);
}

.inscription-limit-row {
    display: flex;
    gap: var(--space-8);
    min-width: 0;
    padding: var(--space-8) var(--space-10);
    border: 1px solid color-mix(in srgb, var(--insc-quality-color) 20%, var(--border-color));
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-card-hover) 20%, transparent);
}

.inscription-limit-row__icon {
    flex: 0 0 auto;
    color: var(--insc-quality-color);
}

.inscription-limit-row__main {
    display: grid;
    gap: var(--space-2);
    min-width: 0;
}

.inscription-limit-row__main b {
    color: var(--insc-quality-color);
    font-size: var(--font-label);
}

.inscription-limit-row__meta,
.inscription-limit-row__desc {
    color: var(--insc-modal-muted);
    font-size: var(--font-caption);
    line-height: 1.4;
}

.inscription-limit-row__desc {
    color: var(--text-secondary);
}

.inscription-actions,
.inscription-result-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-8) !important;
    margin: var(--space-4) 0 0 !important;
    padding: var(--space-12) 0 0 !important;
    border-top: 1px solid var(--insc-modal-line);
}

.inscription-actions > *,
.inscription-result-actions > * {
    min-width: 0;
}

.inscription-actions .modal-action-btn,
.inscription-result-actions .modal-btn {
    min-height: 42px;
    border-radius: var(--radius-md);
}

.insc-autodraw-qrow {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(84px, 1fr));
    gap: var(--space-8);
    margin-top: var(--space-10);
}
.insc-autodraw-qbtn {
    min-height: 40px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--insc-modal-line, var(--glass-white-1));
    background: var(--bg-card-hover, var(--glass-white-2));
    color: var(--text-secondary);
    font-size: var(--font-body);
    cursor: pointer;
    transition: border-color .15s, color .15s, background .15s;
}
.insc-autodraw-qbtn.is-active {
    border-color: var(--accent-gold, var(--craft-gold-bright));
    color: var(--accent-gold, var(--craft-gold-bright));
    background: color-mix(in srgb, var(--accent-gold, var(--craft-gold-bright)) 16%, var(--bg-card-hover, var(--glass-white-2)));
}
.insc-autodraw-status {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
    text-align: center;
}
.insc-autodraw-status--wide {
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
}
.insc-autodraw-stat {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-10) var(--space-6);
    border-radius: var(--radius-md);
    background: var(--bg-card-hover, var(--glass-white-2));
}
.insc-autodraw-stat span {
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.insc-autodraw-stat b {
    font-size: var(--font-body-lg);
    color: var(--text-primary);
}
.inscription-draw-btn--auto {
    color: var(--accent-gold, var(--craft-gold-bright));
}

.inscription-draw-btn {
    justify-content: center;
    gap: var(--space-4);
    padding: var(--space-8) var(--space-10);
    color: var(--text-gold);
    text-align: center;
}

.inscription-draw-btn--single,
.inscription-draw-btn--ten {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 12%, transparent);
    color: var(--text-gold);
}

.inscription-draw-btn--hundred {
    border-color: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 40%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 12%, transparent);
    color: var(--text-jade, var(--accent-jade));
}

/* 千炼：第 5 个按钮，单独占一整行，作为主操作强调（金色）。
   不用左栏/顶栏装饰，仅靠 grid 跨列 + 配色建立层级。 */
.insc-dialog .inscription-actions .inscription-draw-btn--autobatch {
    grid-column: 1 / -1;
    flex-direction: row !important;
    gap: var(--space-10) !important;
}
.inscription-draw-btn--autobatch .inscription-draw-btn__text {
    font-weight: 600;
}
.inscription-draw-btn--autobatch .inscription-draw-btn__cost {
    color: var(--text-secondary);
    font-size: var(--font-caption);
}

.inscription-draw-btn .modal-action-btn__text,
.inscription-draw-btn .modal-action-btn__cost,
.inscription-draw-btn__text,
.inscription-draw-btn__cost {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inscription-confirm-modal-overlay .gc-dialog {
    border-color: color-mix(in srgb, var(--insc-modal-accent, var(--accent-gold)) 28%, var(--border-color));
}

.inscription-confirm-modal-overlay .gc-title {
    color: var(--insc-modal-accent, var(--text-gold));
}

.inscription-confirm-body {
    gap: var(--space-12);
}

.inscription-confirm-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8) !important;
    margin: var(--space-4) 0 0 !important;
    padding: var(--space-12) var(--space-16) var(--space-16) !important;
    border-top: 1px solid var(--insc-modal-line, var(--border-color));
}

.inscription-confirm-actions .modal-btn {
    min-height: 42px;
    border-radius: var(--radius-md);
}

/* ===== 铭文十连 / 百连结果 · A 揭榜笺 ===== */
/* 外壳宽高由 .gc-dialog 几何契约提供（已登记 medium 520 / 手机 392）。 */
.gc-dialog.ir-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: 0 !important;
}

.ir-dialog .gc-head {
    flex: 0 0 auto;
}

.ir-mid.gc-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: var(--space-12) var(--space-14) var(--space-10);
}

/* 本轮最高 */
.ir-hero {
    padding: var(--space-12);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-10);
    border: 1px solid color-mix(in srgb, var(--insc-quality-color, var(--border-gold)) 40%, var(--border-color));
    background: color-mix(in srgb, var(--insc-quality-color, var(--accent-gold)) 8%, var(--bg-panel));
    box-sizing: border-box;
}
.ir-hero__k {
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.ir-hero__v {
    font-family: var(--font-serif, inherit);
    font-size: var(--font-title);
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: 1.35;
    color: var(--insc-quality-color, var(--text-gold));
    overflow-wrap: anywhere;
}
.ir-hero__sub {
    margin-top: var(--space-6);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
    text-wrap: wrap;
}

/* 品质 tally */
.ir-tally {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-bottom: var(--space-8);
}
.ir-tally__chip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 40%, var(--border-color));
    background: color-mix(in srgb, var(--insc-quality-color, var(--bg-card)) 10%, var(--bg-card));
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-secondary);
    line-height: 1.3;
}
.ir-tally__chip b {
    color: var(--insc-quality-color, var(--text-gold));
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.ir-note {
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-bottom: var(--space-10);
    line-height: 1.45;
}
.ir-sec-t {
    font-family: var(--font-serif, inherit);
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text-gold, var(--accent-gold));
    margin-bottom: var(--space-6);
}
.ir-sec-note {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.45;
    margin: calc(-1 * var(--space-2)) 0 var(--space-8);
}

/* 结果卡网格 */
.insc-result-grid,
.ir-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-6);
    max-width: 100%;
}
.insc-result-card,
.ir-card {
    border: 1px solid color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 42%, var(--border-color));
    border-radius: var(--radius-md);
    padding: var(--space-10) var(--space-6) var(--space-8);
    text-align: center;
    animation: inscCardFadeIn 0.35s ease both;
    transition: border-color 0.15s ease, background 0.15s ease;
    box-sizing: border-box;
    min-width: 0;
    background: color-mix(in srgb, var(--insc-quality-color, var(--bg-card)) 8%, var(--bg-panel));
    box-shadow: none;
}
.insc-result-card:hover,
.ir-card:hover {
    transform: none;
    border-color: color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 55%, var(--border-color));
}
.insc-result-card.is-best,
.ir-card.is-best {
    border-color: color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 55%, var(--border-color));
    background: color-mix(in srgb, var(--insc-quality-color, var(--bg-card)) 14%, var(--bg-panel));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--insc-quality-color, transparent) 16%, transparent);
}
.insc-result-card__quality {
    font-size: var(--font-caption);
    font-weight: 700;
    margin-bottom: var(--space-2);
    color: var(--insc-quality-color, var(--text-secondary));
    text-shadow: none;
}
.insc-result-card__stat {
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-bottom: var(--space-2);
}
.insc-result-card__value {
    font-size: var(--font-body);
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
    color: var(--insc-quality-color, var(--text-secondary));
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
    text-shadow: none;
}
.insc-result-card__mp {
    margin-top: var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.2;
}
@keyframes inscCardFadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 脚栏：三键均分铺满（查看详情 | 重新抽取 | 全部放弃） */
.ir-dialog .gc-foot.ir-foot,
.ir-dialog .ir-foot.inscription-result-actions {
    flex: 0 0 auto;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: var(--space-8) !important;
    margin: 0 !important;
    padding: var(--space-12) !important;
    border-top: 1px solid var(--border-color);
    background: var(--bg-card);
}
.ir-dialog .ir-foot > .modal-btn {
    min-width: 0 !important;
    width: 100% !important;
    min-height: 40px;
    border-radius: var(--radius-md);
    margin: 0 !important;
    box-sizing: border-box;
}

@media (max-width: 520px) {
    .gc-dialog.ir-dialog {
        border-radius: var(--radius-lg);
    }
    .insc-result-grid,
    .ir-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--space-8);
    }
    .ir-dialog .gc-foot.ir-foot,
    .ir-dialog .ir-foot.inscription-result-actions {
        /* 窄屏仍三列均分，避免旧 2×2 留下半行空位 */
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        padding: var(--space-10) var(--space-12) calc(var(--space-12) + env(safe-area-inset-bottom, 0px)) !important;
        gap: var(--space-6) !important;
    }
    .ir-dialog .ir-foot > .modal-btn {
        min-height: 44px;
        padding-left: var(--space-4);
        padding-right: var(--space-4);
        font-size: var(--font-body);
    }
}

/* ===== 待铭刻灵纹折叠卡片 ===== */
.insc-pending-item {
    border: 1px solid var(--border-color);
    border-color: color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 70%, var(--border-color));
    border-radius: var(--radius-md);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--insc-quality-color, var(--text-secondary)) 12%, transparent), transparent 66%),
        var(--insc-quality-bg, color-mix(in srgb, var(--bg-card-hover) 88%, var(--bg-card)));
    box-shadow:
        var(--insc-quality-shadow, none),
        inset 0 1px 0 var(--glass-white-1),
        0 0 0 1px color-mix(in srgb, var(--insc-quality-color, var(--border-color)) 10%, transparent);
    margin-bottom: 0;
    cursor: pointer;
    transition: all 0.2s;
    overflow: hidden;
}
.insc-pending-item:hover {
    filter: brightness(1.05);
}
.insc-pending-item__header {
    display: flex;
    align-items: center;
    padding: var(--space-10) var(--space-12);
    gap: var(--space-8);
}
.insc-pending-item__name {
    font-size: var(--font-body);
    font-weight: 800;
    color: var(--insc-quality-color, var(--text-secondary));
    text-shadow: 0 1px 1px var(--shadow-black-2);
}
.insc-pending-item__value {
    font-size: var(--font-body-lg);
    font-weight: 700;
    margin-left: auto;
    color: var(--insc-quality-color, var(--text-secondary));
    overflow-wrap: anywhere;
    text-align: right;
    text-shadow: 0 1px 1px var(--shadow-black-1);
}
.insc-pending-item__mp {
    font-size: var(--font-micro);
    color: var(--text-muted);
    flex-shrink: 0;
}
.insc-pending-item__arrow {
    color: var(--text-muted);
}
.insc-pending-item__actions {
    display: none;
    padding: 0 var(--space-12) var(--space-12);
}
.insc-pending-item--expanded .insc-pending-item__actions {
    display: block;
}
.inscription-pending-list {
    display: grid;
    gap: var(--space-8);
}
.insc-slot-btns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
    gap: var(--space-6);
    margin-bottom: var(--space-8);
}
.insc-slot-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    min-width: 0;
    min-height: 34px;
    padding: var(--space-6) var(--space-10);
    font-size: var(--font-caption);
    border-radius: var(--radius-md);
    border: 1px solid var(--insc-modal-line, var(--border-color));
    background: color-mix(in srgb, var(--bg-card-hover) 28%, transparent);
    color: var(--text-secondary);
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s;
}
.insc-slot-btn:hover {
    border-color: var(--insc-modal-line-strong, var(--border-gold));
    color: var(--text-primary);
}
.insc-slot-btn--warning {
    border-color: color-mix(in srgb, var(--text-red) 38%, var(--border-color));
    color: var(--text-red);
}
.insc-slot-btn__label {
    font-weight: 600;
    flex: 0 0 auto;
}
.insc-slot-btn__value {
    color: var(--text-muted);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.insc-slot-btn__cost {
    color: var(--text-gold);
    font-size: var(--font-micro);
    margin-left: var(--space-2);
    flex: 0 0 auto;
}
.insc-discard-btn {
    display: inline-block;
    min-height: 30px;
    padding: var(--space-4) var(--space-12);
    font-size: var(--font-caption);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--text-red) 34%, var(--border-color));
    background: color-mix(in srgb, var(--text-red) 8%, transparent);
    color: var(--text-red);
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s;
}
.insc-discard-btn:hover {
    background: color-mix(in srgb, var(--jimo-crimson) 12%, transparent);
}

@media (max-width: 400px) {
    .insc-result-grid {
        grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
    }
}

@media (max-width: 640px) {
    .inscription-modal-overlay .modal-header-deco {
        padding: var(--space-14) var(--space-48) var(--space-12) var(--space-16);
    }

    .inscription-header-title {
        font-size: var(--font-heading);
    }

    .inscription-dialog-body {
        padding: var(--space-12) !important;
    }

    /* 待铭刻工具条可换行；折叠上限 summary 保持标题+箭头横排 */
    .inscription-section__head:not(.inscription-section__toggle) {
        align-items: stretch;
        flex-direction: column;
    }

    .insc-dialog .inscription-section--limits > .inscription-section__toggle {
        flex-direction: row !important;
        align-items: center !important;
    }

    .inscription-section__tools {
        justify-content: flex-start;
    }

    .inscription-slot-list {
        grid-template-columns: 1fr;
    }

    .inscription-actions,
    .inscription-result-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: var(--space-4) 0 0 !important;
        padding: var(--space-10) 0 0 !important;
    }

    .inscription-modal-overlay:not(:has(.insc-dialog)):not(:has(.ir-dialog)) .inscription-draw-btn--hundred {
        grid-column: 1 / -1;
    }
    .inscription-result-actions .modal-btn:first-child {
        grid-column: 1 / -1;
    }
    .ir-dialog .inscription-result-actions .modal-btn:first-child,
    .ir-dialog .ir-foot .modal-btn {
        grid-column: auto !important;
    }

    .insc-dialog .inscription-draw-btn--hundred,
    .insc-dialog .inscription-draw-btn--auto {
        grid-column: auto !important;
    }

    .inscription-draw-btn {
        flex-direction: column;
        gap: var(--space-4);
    }

    .insc-slot-btns {
        grid-template-columns: 1fr;
    }
}

/* 坊市物品效果描述 (功法/技能卷轴等) */
.item-desc-effect {
    padding: var(--space-4) 0;
    margin-bottom: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-secondary);
    font-style: italic;
}

/* 分解按钮 */
.btn-salvage-item {
    color: var(--craft-gold-bright) !important;
    border-color: color-mix(in srgb, var(--craft-gold-bright) 30%, transparent) !important;
}

.btn-salvage-item:hover {
    background: color-mix(in srgb, var(--craft-gold-bright) 15%, transparent) !important;
    color: color-mix(in srgb, var(--craft-gold-bright) 60%, white) !important;
}

/* 聚合卡片：一键分解 / 一键出售 / 一键丢弃 按钮 */
.btn-group-salvage,
.btn-group-sell,
.btn-group-discard {
    flex: none;
    padding: var(--space-4) var(--space-10);
    font-size: var(--font-caption);
    font-family: inherit;
    line-height: 1.4;
    border-radius: var(--radius-xs);
    cursor: pointer;
    background: var(--glass-white-2);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    transition: all 0.15s;
    white-space: nowrap;
}

.btn-group-salvage {
    color: var(--craft-gold-bright);
    border-color: color-mix(in srgb, var(--craft-gold-bright) 35%, transparent);
    background: color-mix(in srgb, var(--craft-gold-bright) 8%, transparent);
}

.btn-group-salvage:hover {
    background: color-mix(in srgb, var(--craft-gold-bright) 18%, transparent);
    color: color-mix(in srgb, var(--craft-gold-bright) 60%, white);
    border-color: color-mix(in srgb, var(--craft-gold-bright) 55%, transparent);
}

.btn-group-sell {
    color: var(--craft-gold-bright);
    border-color: color-mix(in srgb, var(--craft-gold-bright) 35%, transparent);
    background: color-mix(in srgb, var(--craft-gold-bright) 8%, transparent);
}

.btn-group-sell:hover {
    background: color-mix(in srgb, var(--craft-gold-bright) 20%, transparent);
    color: color-mix(in srgb, var(--craft-gold-bright) 50%, var(--text-muted));
    border-color: color-mix(in srgb, var(--craft-gold-bright) 55%, transparent);
}

/* 一键丢弃：红色调提示不可逆的破坏性操作 */
.btn-group-discard {
    color: #d66;
    border-color: color-mix(in srgb, var(--jimo-crimson) 35%, transparent);
    background: color-mix(in srgb, var(--jimo-crimson) 8%, transparent);
}

.btn-group-discard:hover {
    background: color-mix(in srgb, var(--jimo-crimson) 20%, transparent);
    color: #e88;
    border-color: color-mix(in srgb, var(--jimo-crimson) 60%, transparent);
}

/* 一键升品 / 一键升满 / 全部凝聚：合成升品类操作，紫蓝色调 */
.btn-synthesize-item {
    flex: none;
    padding: var(--space-4) var(--space-10);
    font-size: var(--font-caption);
    font-family: inherit;
    line-height: 1.4;
    border-radius: var(--radius-xs);
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
    color: color-mix(in srgb, var(--ghost-purple) 70%, white);
    border: 1px solid color-mix(in srgb, var(--ghost-purple) 35%, transparent);
    background: color-mix(in srgb, var(--ghost-purple) 8%, transparent);
}

.btn-synthesize-item:hover {
    background: color-mix(in srgb, var(--ghost-purple) 20%, transparent);
    color: var(--ghost-purple);
    border-color: color-mix(in srgb, var(--ghost-purple) 60%, transparent);
}

/* 批量出售：类型范围 chips */
.batch-sell-scope-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-bottom: var(--space-4);
}

.batch-sell-scope-chip {
    flex: 1 1 0;
    min-width: 60px;
    padding: var(--space-6) var(--space-10);
    font-size: var(--font-label);
    font-family: inherit;
    line-height: 1.4;
    border-radius: var(--radius-xs);
    cursor: pointer;
    background: var(--glass-white-2);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    transition: all 0.15s;
    white-space: nowrap;
}

.batch-sell-scope-chip:hover {
    background: color-mix(in srgb, var(--craft-gold-bright) 12%, transparent);
    color: var(--text-primary);
    border-color: color-mix(in srgb, var(--craft-gold-bright) 40%, transparent);
}

.batch-sell-scope-chip--active {
    background: color-mix(in srgb, var(--craft-gold-bright) 22%, transparent);
    color: color-mix(in srgb, var(--craft-gold-bright) 50%, var(--text-muted));
    border-color: color-mix(in srgb, var(--craft-gold-bright) 60%, transparent);
    font-weight: 600;
}

/* ═══════════════════════════════════════════════════════════════
   出售选数量 · A 问售笺（_proceedSellWithQty）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.sq-dialog,
.modal-content.modal--decorated.sq-dialog,
.sq-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 640px);
}

.sq-dialog .gc-mid.sq-mid {
    text-align: center;
    padding: var(--space-12) var(--space-14) var(--space-8);
    max-height: none;
    flex: 1 1 auto;
}

.sq-q {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-action);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-primary);
    line-height: 1.45;
    margin-bottom: var(--space-6);
}

.sq-q em {
    font-style: normal;
    color: var(--text-gold);
}

.sq-sub {
    font-size: var(--font-label);
    color: var(--text-secondary);
    margin-bottom: var(--space-12);
    line-height: 1.45;
}

.sq-sub b {
    color: var(--text-gold);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.sq-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-14) var(--space-12);
    margin-bottom: var(--space-4);
    border-radius: var(--radius-lg);
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-gold, var(--text-gold)) 24%, transparent);
}

.sq-hero-lab {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 1px;
}

.sq-hero-num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
}

.sq-hero-num small {
    font-size: var(--font-label);
    font-weight: 500;
    color: var(--text-muted);
    margin-left: var(--space-4);
}

.sq-hero-unit {
    font-size: var(--font-label);
    color: var(--text-secondary);
}

.sq-hero-unit b {
    color: var(--text-gold);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.sq-chips {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-6);
    margin: var(--space-10) 0;
}

.sq-chips--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sq-chip {
    height: 36px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--font-label);
    font-weight: 600;
    font-family: inherit;
    padding: 0 var(--space-4);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.sq-chip.is-on {
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 12%, transparent);
    border-color: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 42%, var(--border-color));
    color: var(--text-gold);
}

.sq-custom {
    display: flex;
    gap: var(--space-8);
    align-items: center;
    margin-top: var(--space-2);
}

.sq-input {
    flex: 1 1 0;
    min-width: 0;
    height: 40px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    color: var(--text-primary);
    padding: 0 var(--space-12);
    font-size: var(--font-body-lg);
    font-family: inherit;
    font-variant-numeric: tabular-nums;
    -webkit-appearance: none;
    appearance: none;
}

.sq-input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 50%, var(--border-color));
}

.sq-input::placeholder {
    color: var(--text-muted);
}

.sq-dialog .sq-go {
    flex: 0 0 88px;
    width: 88px;
    height: 40px;
    min-height: 40px;
}

.sq-note {
    margin-top: var(--space-10);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    font-size: var(--font-caption);
    line-height: 1.55;
    text-align: left;
    color: var(--accent-orange, #9a6b3d);
    background: color-mix(in srgb, var(--accent-orange, #9a6b3d) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-orange, #9a6b3d) 28%, var(--border-color));
}

.sq-ref {
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
    text-align: left;
    min-height: 0;
}

.sq-ref:empty {
    display: none;
}

.sq-dialog .gc-foot.sq-foot {
    padding: var(--space-12) var(--space-14) var(--space-14);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
}

.sq-dialog .sq-foot .modal-btn--full {
    width: 100%;
    height: 40px;
    min-height: 40px;
    font-size: var(--font-body);
    font-weight: 600;
}

@media (max-width: 520px) {
    .sq-dialog {
        width: calc(100vw - 24px);
    }
}

/* ═══════════════════════════════════════════════════════════════
   灵宝司寄存 · B 灵宝台（depositItem qty>1）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.dp-dialog,
.modal-content.modal--decorated.dp-dialog,
.dp-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 640px);
}

.dp-dialog .gc-mid.dp-mid {
    text-align: left;
    padding: var(--space-12) var(--space-14) var(--space-14);
    max-height: none;
    flex: 1 1 auto;
}

.dp-item {
    padding: var(--space-12);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-10);
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
    background: var(--bg-panel);
}

.dp-item-name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-title);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-primary);
    margin-bottom: var(--space-6);
    line-height: 1.3;
}

.dp-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6) var(--space-12);
    font-size: var(--font-label);
    color: var(--text-muted);
}

.dp-item-meta em {
    font-style: normal;
    font-weight: 700;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.dp-item-meta span:last-child em {
    color: var(--text-gold);
}

.dp-field-lab {
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--space-6);
}

.dp-chips {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-6);
    margin-bottom: var(--space-8);
}

.dp-chips--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dp-chip {
    height: 36px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--font-label);
    font-weight: 600;
    font-family: inherit;
    padding: 0 var(--space-4);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.dp-chip.is-on {
    background: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 12%, transparent);
    border-color: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 42%, var(--border-color));
    color: var(--text-jade, var(--accent-jade));
}

.dp-custom {
    display: flex;
    gap: var(--space-8);
    align-items: center;
    margin-bottom: var(--space-2);
}

.dp-input {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
    height: 40px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    color: var(--text-primary);
    padding: 0 var(--space-12);
    font-size: var(--font-body-lg);
    font-family: inherit;
    font-variant-numeric: tabular-nums;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}

.dp-input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 50%, var(--border-color));
}

.dp-input::placeholder {
    color: var(--text-muted);
}

.dp-fee {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    margin-top: var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-gold, var(--text-gold)) 30%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 8%, transparent);
}

.dp-fee-k {
    font-size: var(--font-label);
    color: var(--text-secondary);
    font-weight: 600;
}

.dp-fee-v {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-heading);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}

.dp-fee-v small {
    font-size: var(--font-caption);
    font-weight: 500;
    color: var(--text-muted);
    margin-left: var(--space-4);
}

.dp-note {
    margin-top: var(--space-10);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-muted);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    border: 1px dashed color-mix(in srgb, var(--border-color) 80%, transparent);
}

.dp-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-12);
}

.dp-actions-row {
    display: flex;
    gap: var(--space-8);
}

.dp-actions-row > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
    height: 40px;
    min-height: 40px;
}

@media (max-width: 520px) {
    .dp-dialog {
        width: calc(100vw - 24px);
    }
}

/* ═══════════════════════════════════════════════════════════════
   物品用途 · C 玉简录（showItemUsage）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.iu-dialog,
.modal-content.modal--decorated.iu-dialog,
.iu-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 640px);
}

.iu-dialog .gc-mid.iu-mid {
    text-align: left;
    padding: var(--space-12) var(--space-14) var(--space-8);
    max-height: none;
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.iu-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--space-10);
    padding-bottom: var(--space-10);
    margin-bottom: var(--space-4);
    border-bottom: 1px solid color-mix(in srgb, var(--border-color) 55%, transparent);
}

.iu-hero-k {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 1px;
    margin-bottom: var(--space-4);
}

.iu-hero-v {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-heading);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-primary);
    line-height: 1.25;
    word-break: break-word;
}

.iu-hero-r {
    flex: 0 0 auto;
    text-align: right;
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-jade, var(--accent-jade));
    white-space: nowrap;
}

.iu-body {
    min-height: 40px;
}

.iu-loading {
    padding: var(--space-16) var(--space-8);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
}

.iu-row {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: var(--space-8);
    padding: var(--space-10) 0;
    font-size: var(--font-label);
    border-bottom: 1px solid color-mix(in srgb, var(--border-color) 40%, transparent);
}

.iu-row:last-child {
    border-bottom: 0;
}

.iu-k {
    color: var(--text-muted);
    padding-top: var(--space-2);
    line-height: 1.45;
    word-break: break-all;
}

.iu-v {
    color: var(--text-primary);
    line-height: 1.55;
    word-break: break-word;
}

.iu-empty {
    margin-top: var(--space-8);
    padding: var(--space-16) var(--space-12);
    border-radius: var(--radius-md);
    font-size: var(--font-label);
    line-height: 1.6;
    color: var(--text-muted);
    text-align: center;
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
    border: 1px dashed color-mix(in srgb, var(--border-color) 80%, transparent);
}

@media (max-width: 520px) {
    .iu-dialog {
        width: calc(100vw - 24px);
    }
}

/* 反馈 #5979：本命法宝弹窗操作分区（业务层，勿写入 game-dialog 共享几何锁） */
.modal-btn-row.natal-devour-ops,
.modal-btn-row.natal-manage-ops {
    flex-wrap: wrap;
    row-gap: var(--space-8);
}
.modal-btn-row.natal-devour-ops > .modal-btn {
    flex: 1 1 calc(33.333% - var(--space-8));
    min-width: 96px;
}
.modal-btn-row.natal-manage-ops > .modal-btn {
    flex: 1 1 calc(50% - var(--space-8));
    min-width: 88px;
}
@media (max-width: 360px) {
    .modal-btn-row.natal-devour-ops > .modal-btn {
        flex: 1 1 100%;
    }
}

/* ═══════════════════════════════════════════════════════════════
   本命法宝描述 · C 玉简稿（showEditNatalArtifactDesc）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.nd-dialog,
.modal-content.modal--decorated.nd-dialog,
.nd-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 680px);
}

.nd-dialog .gc-mid.nd-mid {
    text-align: left;
    padding: var(--space-12) var(--space-14) var(--space-14);
    max-height: none;
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.nd-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: var(--space-10);
    padding-bottom: var(--space-10);
    margin-bottom: var(--space-10);
    border-bottom: 1px solid color-mix(in srgb, var(--border-color) 55%, transparent);
}

.nd-hero-k {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 1px;
    margin-bottom: var(--space-4);
}

.nd-hero-v {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-heading);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-gold);
    line-height: 1.2;
    word-break: break-word;
}

.nd-hero-meta {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
}

.nd-hero-r {
    flex: 0 0 auto;
    text-align: right;
}

.nd-hero-num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-page-title);
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.nd-hero-num.is-over {
    color: var(--accent-crimson, var(--accent-crimson));
}

.nd-hero-num small {
    font-size: var(--font-caption);
    font-weight: 500;
    color: var(--text-muted);
    margin-left: var(--space-2);
}

.nd-hero-lab {
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-top: var(--space-2);
    font-variant-numeric: tabular-nums;
}

.nd-ta {
    width: 100%;
    min-height: 110px;
    box-sizing: border-box;
    resize: vertical;
    padding: var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 90%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    color: var(--text-primary);
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-body-lg);
    line-height: 1.8;
    letter-spacing: 0.2px;
    -webkit-appearance: none;
    appearance: none;
}

.nd-ta:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 50%, var(--border-color));
}

.nd-ta::placeholder {
    color: var(--text-muted);
    opacity: 0.85;
    font-family: var(--font-ui, inherit);
    font-size: var(--font-body);
}

.nd-ta.is-over {
    border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 45%, var(--border-color));
}

.nd-ta:disabled {
    opacity: 0.7;
}

.nd-lab {
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-secondary);
    margin: var(--space-12) 0 var(--space-6);
}

.nd-inp {
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 90%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    color: var(--text-primary);
    padding: 0 var(--space-12);
    font-size: var(--font-body);
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
}

.nd-inp:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 50%, var(--border-color));
}

.nd-inp::placeholder {
    color: var(--text-muted);
}

.nd-inp:disabled {
    opacity: 0.7;
}

.nd-note {
    margin-top: var(--space-10);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-muted);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    border: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
}

.nd-note.is-warn {
    color: var(--accent-crimson, var(--accent-crimson));
    background: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 7%, transparent);
    border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 22%, transparent);
}

.nd-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-12);
}

.nd-actions-row {
    display: flex;
    gap: var(--space-8);
}

.nd-actions-row > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
    height: 40px;
    min-height: 40px;
}

.nd-dialog .nd-actions > .modal-btn--full {
    width: 100%;
    flex: 0 0 auto;
    height: 40px;
    min-height: 40px;
    font-size: var(--font-body);
    font-weight: 600;
}

.nd-dialog #natalDescRegenBtn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

@media (max-width: 520px) {
    .nd-dialog {
        width: calc(100vw - 24px);
    }
}

/* 批量分解 预览/结果 弹窗
 * 手机 WebView 坑：.salvage-list 内层 overflow 会抢走 touch 滚动，外层 .gc-mid
 * 几乎滚不动，底部「确定/确认」若写在 mid 里就永远在屏外。
 * → 按钮走 .gc-foot 固定；结果区永不嵌套滚动，整段 mid 只有一条滑轨。 */
.salvage-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog {
    /* 85dvh 给手机浏览器工具栏伸缩留余量，foot 始终留在壳内。 */
    max-height: calc(100vh - 88px);
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
}
.salvage-preview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
    touch-action: pan-y;
}
.salvage-preview-grid > .modal-info-card {
    margin-top: 0;
    touch-action: pan-y;
}
.salvage-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    font-size: var(--font-body);
    /* 不创建第二个滚动容器；在卡片任意位置拖动都交给 gc-mid。 */
    max-height: none;
    overflow: visible;
    touch-action: pan-y;
}
.salvage-list__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-8);
    padding: var(--space-2) 0;
    color: var(--text-secondary);
    touch-action: pan-y;
}
.salvage-list__qty {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex: none;
    text-align: right;
}
.salvage-list__count {
    color: var(--text-muted);
    font-size: var(--font-label);
    flex-shrink: 0;
    white-space: nowrap;
}
.salvage-list__hint {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
    white-space: nowrap;
}
.salvage-modal-overlay .gc-title {
    white-space: nowrap;
    overflow: visible;
}
.salvage-mat-link {
    appearance: none;
    -webkit-appearance: none;
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font: inherit;
    color: var(--text-gold);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-align: left;
}
.salvage-list__count--gold { color: var(--text-gold); font-weight: bold; }
.salvage-modal-overlay .gc-mid.salvage-dialog-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    padding-bottom: var(--space-12);
}
.salvage-modal-overlay .gc-foot.modal-btn-row {
    flex: 0 0 auto;
    margin-top: 0;
    border-top: 1px solid rgba(128, 128, 128, 0.18);
    background: var(--bg-card, var(--bg-panel));
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
    .salvage-modal-overlay .gc-foot.modal-btn-row {
        border-top-color: color-mix(in srgb, var(--border-color) 80%, transparent);
    }
}
@media (max-width: 480px) {
    .salvage-preview-grid { grid-template-columns: 1fr; }
    .salvage-modal-overlay .gc-foot.modal-btn-row {
        padding: var(--space-10) var(--space-16) var(--space-14);
    }
}

.item-actions {
    display: flex;
    gap: var(--space-6);
    flex-wrap: wrap;
}

.item-actions button {
    padding: var(--space-2) var(--space-10);
    font-size: var(--font-caption);
    background: var(--bg-card-hover);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    border-radius: var(--radius-xs);
    cursor: pointer;
    transition: all 0.2s;
}

.item-actions button:hover {
    background: var(--bg-panel);
    color: var(--text-primary);
}

.item-actions .inv-inline-action,
.item-actions .btn-inv-action-more {
    min-height: 23px;
    padding: var(--space-2) var(--space-8);
    font-size: var(--font-micro);
    color: var(--text-secondary);
    border-color: var(--border-color);
    background: var(--bg-card-hover);
}

.item-actions .btn-inv-action-more {
    min-width: 46px;
}

.inv-action-menu .modal-action-btn {
    min-height: 44px;
}

.inv-action-menu__main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: var(--space-10);
}

.inv-action-menu .modal-action-btn__text {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    text-align: left;
}

.inv-action-menu .modal-action-btn__text small {
    font-size: var(--font-caption);
    line-height: 1.25;
    color: var(--text-muted);
    font-weight: 400;
}

@media (max-width: 520px) {
    .item-actions .inv-inline-action,
    .item-actions .btn-inv-action-more {
        min-height: 26px;
        padding: var(--space-4) var(--space-8);
    }
}

/* ===== 储物内在售物品区块 ===== */
.inv-market-section {
    margin-top: var(--space-12);
    padding-top: var(--space-8);
    border-top: 1px dashed var(--border-color);
}

.inv-market-header {
    text-align: center;
    font-size: var(--font-label);
    font-family: var(--font-serif);
    color: var(--text-gold);
    letter-spacing: 2px;
    padding: var(--space-6) 0;
    margin-bottom: var(--space-8);
    opacity: 0.85;
}

.inv-market-item {
    opacity: 0.75;
    border-style: dashed;
}

/* ===== 兑换弹窗 ===== */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--shadow-black-1);
    display: flex;
    align-items: center;
    justify-content: center;
    /* 必须用统一层级：旧值 2000 会低于侧栏(1001)以外的顶栏/浮层，导致弹窗与背景叠字、点不中 */
    z-index: var(--z-overlay-base, 100000);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    /* 非 iOS 端保留稳定合成层，避免遮罩过渡期间临时提升导致命中坐标抖动。
       iOS 端在下方覆盖规则中取消 transform，避免地址栏变化后命中层偏移；
       不叠加 will-change，避免多弹窗长期占用合成层显存。 */
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* iOS Safari：固定遮罩不要再进入 transform 合成层，避免地址栏变化后遮罩内
   的关闭按钮/确认按钮出现视觉位置与实际命中位置不一致。 */
html.lv-ios-touch .modal-overlay {
    transform: none !important;
    backface-visibility: visible;
}

.modal-content {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-20) var(--space-24);
    min-width: 300px;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    /* 实色壳，避免主题半透明 token 让日志透出 */
    isolation: isolate;
}

.modal-content h3 {
    color: var(--text-gold);
    margin-bottom: var(--space-16);
    text-align: center;
}

/* ===== 统一弹窗层级 ===== */
.modal-overlay--high  { z-index: var(--z-overlay-high); }
.modal-overlay--top   { z-index: var(--z-overlay-top); }
/* 从道友画卷内部唤起的子弹窗(道体重塑/修订小传等)，需浮于画卷(#playerProfileOverlay = top+1)之上。
   差值拉大到 +100：画卷与子弹窗都是 position:fixed + transform:translateZ(0) 的合成层，
   相近 z-index(+2) 在部分移动 WebView 上绘制顺序不稳定（合成层命中测试乱序），
   出现「子弹窗在画卷下面」。拉开差值让层级判定更稳健。 */
.modal-overlay--above-profile { z-index: calc(var(--z-overlay-top) + 100); }
/* 叠在 above-profile 列表弹窗之上的二次确认（如「道心所向」批量取消点赞） */
.modal-overlay--stack { z-index: calc(var(--z-overlay-top) + 200); }

/* 道友画卷可由任意 modal-overlay--top 弹窗(如玄筹阁盈利榜)内的链接唤起,
   需始终浮于其上(但低于 toast),否则会被后插入的同级 overlay 遮挡。 */
#playerProfileOverlay { z-index: calc(var(--z-overlay-top) + 1); }

/* ===== 统一弹窗带金边装饰 ===== */
.modal--decorated {
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
    /* 无 gc-dialog 壳时的兜底几何也对齐契约：宽 392、高 92dvh（手机 94dvh）。 */
    max-height: min(var(--pattern-dialog-max-height), calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
    max-width: var(--pattern-dialog-compact-max-width);
    width: 90%;
    margin: 0 auto;
}

/* ===== 尺寸变体已废弃：统一走 .gc-dialog 登记档（compact/medium/…），旧 modal--sm/md/lg 无消费者 ===== */


/* ===== 移动端弹窗: 留出外部可点击关闭区域, 避免占满整屏 ===== */
@media (max-width: 640px) {
    .modal-overlay,
.transmit-confirm-overlay,
.announce-overlay,
.adventure-overlay,
.dungeon-invite-overlay {
        padding: var(--space-16);
        box-sizing: border-box;
        padding-top: var(--mobile-popup-safe-top);
        padding-bottom: var(--mobile-popup-safe-bottom);
    }
    /* 死亡页：全屏状态页，不套弹窗安全边距 */
    .death-overlay {
        padding: 0;
        box-sizing: border-box;
    }
    /* 长内容弹窗（道友画卷/选择宗门/战报）高度超过视口时，
       align-items:center 会把顶部推到滚动区负坐标，导致「滚动条在顶部却只看得到底部、上滑无效」。
       改为 flex-start 让超长内容从顶部开始正常滚动；短内容靠 margin-block:auto 仍可垂直居中。 */
    .modal-overlay {
        align-items: flex-start;
    }
    .modal-overlay .modal-content,
.modal-overlay .modal-content.modal--decorated,
.modal-overlay .announce-modal,
.modal-overlay.adventure-overlay .adv-dialog,
.modal-overlay .dungeon-invite-dialog {
        margin-block: auto;
    }
    .modal-content {
        min-width: 0;
    }
    .modal-content.modal--decorated,
.announce-modal,
.modal-overlay.adventure-overlay .adv-dialog,
.dungeon-invite-dialog,
.encounter-content {
        box-sizing: border-box;
    }
    .modal-content.modal--decorated,
.announce-modal,
.modal-overlay.adventure-overlay .adv-dialog,
.dungeon-invite-dialog {
        max-height: calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom));
    }
}


/* 弹窗装饰头部 */
.modal-header-deco {
    position: relative;
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent-gold) 12%, transparent), color-mix(in srgb, var(--accent-jade) 8%, transparent));
    padding: var(--space-20) var(--space-48) var(--space-16);
    text-align: center;
    border-bottom: none;
    flex-shrink: 0;
}
/* 关闭 × 统一样式以 game-dialog.css 为准（右上角 32 扁平方角）；此处仅作未加载 dialog 时的基线 */
.modal-header-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-muted);
    appearance: none;
    -webkit-appearance: none;
    font-size: var(--font-heading);
    line-height: 1;
    cursor: pointer;
    z-index: 3;
    box-shadow: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}
.modal-header-close:hover,
.modal-header-close:focus-visible {
    color: var(--text-primary);
    border-color: var(--border-gold);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    outline: none;
    transform: none;
}
.modal-header-deco__subtitle {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 4px;
    margin-bottom: var(--space-6);
}
.modal-header-deco__value {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: var(--space-4);
}
.modal-header-deco__num {
    font-size: var(--font-hero-lg);
    font-weight: bold;
    color: var(--text-gold);
    text-shadow: 0 0 12px color-mix(in srgb, var(--accent-gold) 30%, transparent);
}
.modal-header-deco__unit {
    color: var(--text-secondary);
    font-size: var(--font-body);
}

/* 弹窗主体区域 */
.modal-body-padded {
    padding: var(--space-16) var(--space-20) var(--space-20);
    overflow-y: auto;
    /* 父级 .modal--decorated 是 flex column + max-height,
       子项默认 min-height: auto 会让 body 撑出边框, overflow 失效;
       必须 min-height: 0 配合 flex: 1 让 body 在父高度内滚动, 按钮才不会被屏幕底裁掉 */
    min-height: 0;
    flex: 1 1 auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

.ui-scrollable-modal {
    touch-action: pan-y;
}

.ui-scrollable-modal .modal-content {
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.ui-scrollable-modal .modal-content--self-scroll {
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

.ui-scrollable-modal .modal-body-padded {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

/* 突破弹窗 · 1:1 对齐 design-demos/breakthrough-redesign 原型 */
.breakthrough-modal-overlay .modal-content.modal--decorated.gc-dialog.bt-dialog,
body.game-page .modal-content.modal--decorated.gc-dialog.bt-dialog {
    display: flex;
    flex-direction: column;
    max-height: min(82dvh, 640px);
    width: min(90vw, 392px);
    max-width: 392px;
    padding: 0;
    overflow: hidden;
}

body.game-page .bt-dialog .gc-mid.bt-gc-mid,
.bt-dialog .gc-mid.bt-gc-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: min(58vh, 460px);
    text-align: left !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

body.game-page .bt-dialog .gc-foot.breakthrough-modal-actions,
.bt-dialog .gc-foot.breakthrough-modal-actions {
    flex-shrink: 0;
    margin-top: 0;
}

/* mid 内文：压过 .gc-mid { text-align:center } */
body.game-page .bt-dialog .gc-mid.is-form .gc-q,
body.game-page .bt-dialog .gc-mid.is-form .gc-sub,
body.game-page .bt-dialog .gc-mid.is-form .gc-note,
body.game-page .bt-dialog .gc-mid.is-form .gc-irrev,
.bt-dialog .gc-mid.is-form .gc-q,
.bt-dialog .gc-mid.is-form .gc-sub,
.bt-dialog .gc-mid.is-form .gc-note,
.bt-dialog .gc-mid.is-form .gc-irrev {
    text-align: left !important;
}
body.game-page .bt-dialog .gc-mid.is-form .gc-loot,
.bt-dialog .gc-mid.is-form .gc-loot {
    text-align: center;
}

.bt-rate-hero {
    margin-top: var(--space-10);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero-lg);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -1px;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    text-align: left;
}
.bt-rate-hero small {
    font-size: var(--font-title);
    font-weight: 600;
    margin-left: var(--space-2);
}
.bt-rate-caption {
    margin-top: var(--space-4);
    margin-bottom: var(--space-2);
    font-size: var(--font-caption);
    letter-spacing: 1px;
    color: var(--text-muted);
    text-align: left;
}

.bt-loot-realm {
    font-size: var(--font-body) !important;
    font-family: var(--font-serif, "Songti SC", STSong, serif) !important;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.bt-form {
    margin-top: var(--space-14);
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    text-align: left;
}

.bt-hudao {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    font-size: var(--font-label);
    color: var(--text-secondary);
}
.bt-hudao.is-on {
    border-color: color-mix(in srgb, var(--accent-jade) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    color: var(--text-jade, var(--accent-jade));
}
.bt-hudao .modal-btn {
    height: 30px;
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    flex: none;
    box-shadow: none;
}

.bt-mat,
.breakthrough-material-list.bt-mat {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    max-height: min(30dvh, 220px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    padding-right: var(--space-2);
}
.bt-mat__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    font-size: var(--font-label);
}
.bt-mat__name {
    color: var(--text-gold);
    text-decoration: underline;
    cursor: pointer;
    font-weight: 500;
}
.bt-mat__qty {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    color: var(--text-muted);
    flex-shrink: 0;
}
.bt-mat__qty.is-ok {
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}

/* 道韵破境开关行：label 文字 + 右侧 toggle */
.bt-dao-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    font-size: var(--font-body);
    color: var(--text-secondary);
    margin-bottom: var(--space-6);
}
.bt-dao-switch {
    position: relative;
    display: inline-block;
    flex-shrink: 0;
    width: 36px;
    height: 20px;
    cursor: pointer;
}
.bt-dao-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.bt-dao-switch__track {
    position: absolute;
    inset: 0;
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--text-muted) 30%, transparent);
    transition: background 0.15s ease;
}
.bt-dao-switch__track::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--bg-card, #fff);
    transition: transform 0.15s ease;
}
.bt-dao-switch input:checked + .bt-dao-switch__track {
    background: color-mix(in srgb, var(--accent-gold) 55%, transparent);
}
.bt-dao-switch input:checked + .bt-dao-switch__track::before {
    transform: translateX(16px);
}

.bt-dao-hint {
    text-align: left !important;
    margin-top: var(--space-6);
}
.bt-dao-preview {
    margin-top: var(--space-8);
    font-size: var(--font-label);
    color: var(--text-gold);
    line-height: 1.5;
    text-align: left;
}

/* 道韵输入：对齐红包 rp-field number */
body.game-page .bt-dialog .rp-field .bt-dao-input,
.bt-dialog .rp-field .bt-dao-input,
.bt-dialog .rp-field input#breakthroughDaoBonusInput {
    width: 100%;
    box-sizing: border-box;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-input, var(--bg-card));
    color: var(--text-gold);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body-lg);
    font-weight: 600;
}
body.game-page .bt-dialog .rp-field .bt-dao-input:focus,
.bt-dialog .rp-field .bt-dao-input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent-gold) 55%, var(--border-color));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-gold) 12%, transparent);
}

/* 明细表在 form mid 内保持左对齐 */
.bt-dialog .gc-detail {
    text-align: left;
}

/* 道友画卷 · A 玉简分章（圆角对齐 gc-dialog 14px；头/粘顶不透底） */
body.game-page .modal-content.modal--decorated.pf-modal,
.modal-content.modal--decorated.pf-modal,
.pf-modal.modal--decorated {
    --pf-radius: var(--radius-lg);
    border-radius: var(--pf-radius);
    overflow: hidden;
    background: var(--bg-card);
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
}
.pf-modal__head {
    position: relative;
    z-index: 3;
    flex-shrink: 0;
    padding: var(--space-16) var(--space-16) 0;
    /* 实底，避免标题下露出中区滚动内容 */
    background: var(--bg-card);
    isolation: isolate;
}
.pf-modal__head .gc-title {
    letter-spacing: 4px;
    padding-right: var(--space-32);
}
/* 身份 + Tab：在滚动区外固定；与标题保留呼吸间距 */
.pf-chrome {
    flex-shrink: 0;
    z-index: 3;
    padding: var(--space-14) var(--space-14) var(--space-10);
    background: var(--bg-card);
    isolation: isolate;
}
.pf-chrome:empty,
.pf-chrome[style*="display: none"] {
    display: none !important;
    padding: 0 !important;
}
.pf-identity {
    padding-bottom: var(--space-2);
}
.pf-chrome .pf-card-head {
    padding-top: 0;
    padding-bottom: var(--space-10);
    border-bottom: none;
}
.pf-chrome .pf-tabs {
    margin-top: var(--space-8);
}
/* 道友画卷关闭已改用 .modal-header-close（game-dialog.css 统一） */
.pf-scroll-wrap {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--bg-card);
}
.pf-scroll-wrap::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 20px;
    pointer-events: none;
    z-index: 1;
    background: linear-gradient(to bottom, transparent, var(--bg-card));
    opacity: 0.95;
    transition: opacity 0.15s ease;
}
.pf-scroll-wrap.is-bottom::after {
    opacity: 0;
}
#playerProfileContent,
.pf-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    padding: var(--space-8) var(--space-14) var(--space-14);
    background: var(--bg-card);
    /* 隐条保滚：无可见滚动条，滚轮/触控仍可滚 */
    scrollbar-width: none;
    -ms-overflow-style: none;
}
#playerProfileContent::-webkit-scrollbar,
.pf-scroll::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

/* 货架空态/加载态（替代 #playerShelfContent 旧内联 style；pf-modal 布局保留不动） */
.pf-scroll .shelf-empty {
    text-align: center;
    color: var(--text-muted);
    padding: var(--space-32) var(--space-12);
    font-size: var(--font-body);
    line-height: 1.7;
}
.pf-scroll .shelf-empty__hint {
    display: block;
    margin-top: var(--space-4);
    font-size: var(--font-caption);
}

/* 画卷加载/失败态（替代 #playerProfileContent 旧内联 style；pf-modal 布局保留不动） */
.pf-scroll .pf-loading,
#playerProfileContent .pf-loading {
    text-align: center;
    padding: var(--space-40) var(--space-16);
    color: var(--text-muted);
    font-size: var(--font-body);
    line-height: 1.7;
}
.pf-scroll .pf-error,
#playerProfileContent .pf-error {
    text-align: center;
    padding: var(--space-40) var(--space-16);
    color: var(--danger-color);
    font-size: var(--font-body);
    line-height: 1.7;
}

@media (max-width: 640px) {
    .breakthrough-modal-overlay .modal-content.gc-dialog.bt-dialog,
    .modal-content.modal--decorated.gc-dialog.bt-dialog {
        width: min(90vw, 392px);
        max-height: min(82dvh, calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
    }
    .bt-rate-hero { font-size: var(--font-hero); }
}

/* 弹窗信息卡片 */
.modal-info-card {
    background: var(--bg-glass);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-12) var(--space-14);
    margin-top: var(--space-12);
}
.modal-info-card--jade {
    background: var(--bg-glass-jade);
    border-color: var(--border-jade);
}
.modal-info-card--danger {
    background: color-mix(in srgb, var(--jimo-crimson) 6%, transparent);
    border-color: color-mix(in srgb, var(--jimo-crimson) 28%, transparent);
}
.modal-info-card__title {
    font-size: var(--font-label);
    color: var(--text-gold);
    margin-bottom: var(--space-8);
    letter-spacing: 1px;
}

/* ══════════════════════════════════════
   后天兽诀 · sj-dialog + 妖丹合成 · yd-dialog
   统一：紧凑分区 / 行内操作 / 无左轨
   注意：game-dialog.css 在 inventory 之后加载，
   mid / 行内 btn 必须用更高优先级压过 .gc-mid / .modal-btn。
   ══════════════════════════════════════ */

/* ---- shared shell ---- */
body.game-page .modal-content.modal--decorated.gc-dialog.sj-dialog,
.modal-content.modal--decorated.gc-dialog.sj-dialog,
.gc-dialog.sj-dialog,
body.game-page .modal-content.modal--decorated.gc-dialog.yd-dialog,
.modal-content.modal--decorated.gc-dialog.yd-dialog,
.gc-dialog.yd-dialog {
    padding: 0;
}
body.game-page .gc-dialog.sj-dialog > .gc-head.sj-head,
.gc-dialog.sj-dialog > .gc-head.sj-head,
body.game-page .gc-dialog.yd-dialog > .gc-head.yd-head,
.gc-dialog.yd-dialog > .gc-head.yd-head,
.sj-head, .yd-head {
    position: relative;
    padding: var(--space-14) var(--space-48) var(--space-6) var(--space-14);
}
.sj-head .gc-rule, .yd-head .gc-rule { margin-bottom: var(--space-8); }
.sj-head .gc-title, .yd-head .gc-title {
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-title);
    letter-spacing: 0.12em;
}
.sj-head .modal-header-close,
.yd-head .modal-header-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 40px;
    height: 40px;
}
/* 无底栏：mid 自带底 padding；压过 .gc-mid 的 4px 底与 55vh/420 限高 */
body.game-page .gc-dialog.sj-dialog > .gc-mid.sj-mid,
.gc-dialog.sj-dialog > .gc-mid.sj-mid,
body.game-page .gc-dialog.yd-dialog > .gc-mid.yd-mid,
.gc-dialog.yd-dialog > .gc-mid.yd-mid,
.sj-mid, .yd-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    flex: 1 1 auto;
    min-height: 0;
    padding: var(--space-2) var(--space-14) max(var(--space-16), env(safe-area-inset-bottom, 0px));
    text-align: left;
    max-height: min(74vh, 680px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: normal;
}
.sj-mid::-webkit-scrollbar,
.yd-mid::-webkit-scrollbar { display: none; }
body.game-page .gc-dialog.yd-dialog .gc-sub.yd-lead,
.gc-dialog.yd-dialog .gc-sub.yd-lead,
.sj-lead, .yd-lead {
    margin: 0;
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-muted);
    text-align: left;
}
/* 行内紧凑钮：压过 .modal-btn { height:40px }（dialog 后载） */
body.game-page .gc-dialog.sj-dialog .modal-btn.sj-btn,
.gc-dialog.sj-dialog .modal-btn.sj-btn,
body.game-page .gc-dialog.yd-dialog .modal-btn.yd-btn,
.gc-dialog.yd-dialog .modal-btn.yd-btn,
.sj-btn, .yd-btn {
    flex: 0 0 auto;
    width: auto;
    min-width: 56px;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-12);
    font-size: var(--font-label);
    line-height: 1;
    border-radius: var(--gc-radius-btn, var(--radius-md));
    box-sizing: border-box;
}
body.game-page .gc-dialog.sj-dialog .modal-btn.sj-btn:disabled,
.gc-dialog.sj-dialog .modal-btn.sj-btn:disabled,
body.game-page .gc-dialog.yd-dialog .modal-btn.yd-btn:disabled,
.gc-dialog.yd-dialog .modal-btn.yd-btn:disabled,
.sj-btn:disabled, .yd-btn:disabled {
    opacity: 0.42;
    cursor: not-allowed;
}

/* ---- 妖丹 yd ---- */
/* mid 为滚动容器：子块勿 shrink，否则 overflow:hidden 的 stock 会被压成 2px 高 */
.yd-lead,
.yd-stock,
.yd-sec,
.yd-note,
.sj-workshop,
.sj-list-head,
.sj-pet,
.sj-empty {
    flex-shrink: 0;
}
.yd-stock {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    overflow: hidden;
    background: var(--bg-panel, var(--bg-card));
    min-height: 48px;
}
.yd-stock__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-8) var(--space-4) var(--space-8);
    border-right: 1px solid var(--border-color);
}
.yd-stock__cell:last-child { border-right: 0; }
.yd-stock__cell.is-top {
    background: color-mix(in srgb, var(--accent-gold) 9%, transparent);
}
.yd-stock__cell.is-empty .yd-stock__v {
    color: var(--text-muted);
    font-weight: 500;
}
.yd-stock__k {
    font-size: var(--font-micro);
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.yd-stock__v {
    font-size: var(--font-title);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-gold, var(--accent-gold));
    line-height: 1.15;
}
.yd-sec { display: flex; flex-direction: column; gap: var(--space-6); }
.yd-sec__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    min-height: 28px;
}
.yd-sec__title {
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--text-jade, var(--accent-jade));
}
.yd-sec__head-right {
    display: flex;
    align-items: center;
    gap: var(--space-8);
}
.yd-sec__hint {
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.yd-sec__note {
    margin: 0;
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-muted);
}
/* 压过 .modal-btn 高度；与行内 yd-btn 同档 */
body.game-page .gc-dialog.yd-dialog .modal-btn.yd-max,
.gc-dialog.yd-dialog .modal-btn.yd-max,
.yd-max {
    height: 28px;
    min-height: 28px;
    max-height: 28px;
    min-width: 0;
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    line-height: 1;
    flex: 0 0 auto;
    width: auto;
    border-radius: var(--gc-radius-btn, var(--radius-md));
    box-sizing: border-box;
}
.yd-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-8) var(--space-10);
    align-items: center;
    padding: var(--space-10) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
}
.yd-row.is-disabled { opacity: 0.68; }
.yd-row__main { min-width: 0; }
.yd-row__title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) var(--space-6);
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.3;
}
.yd-row__x { font-size: var(--font-caption); font-weight: 500; color: var(--text-muted); }
.yd-row__arrow { color: var(--text-muted); font-weight: 500; }
.yd-row__out { color: var(--text-gold, var(--accent-gold)); }
.yd-row__out.is-jade { color: var(--text-jade, var(--accent-jade)); }
.yd-row__meta {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    line-height: 1.4;
    color: var(--text-muted);
}
.yd-row__meta b {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.yd-row__meta b.is-ok { color: var(--text-jade, var(--accent-jade)); }
.yd-row__meta b.is-bad { color: var(--text-danger, var(--accent-crimson)); }
.yd-row__actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-6);
}
.yd-qty {
    width: 48px;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-4);
    box-sizing: border-box;
    text-align: center;
    font-size: var(--font-label);
    line-height: 1;
    font-variant-numeric: tabular-nums;
    border-radius: var(--gc-radius-btn, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-primary, var(--bg-card));
    color: var(--text-primary);
    -webkit-appearance: none;
    appearance: none;
}
.yd-qty:disabled { opacity: 0.5; }
.yd-note {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 28%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 7%, transparent);
    font-size: var(--font-label);
    color: var(--text-secondary);
}
.yd-note b {
    font-size: var(--font-body-lg);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-gold, var(--accent-gold));
}
.yd-note__sub {
    flex: none;
    font-size: var(--font-caption);
    color: var(--text-muted);
}

/* ---- 兽诀 sj ---- */
.sj-workshop {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
}
.sj-workshop__top {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-10);
    align-items: end;
}
.sj-frag__label {
    font-size: var(--font-micro);
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.sj-frag__val {
    margin-top: var(--space-2);
    font-size: var(--font-label);
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}
.sj-frag__val b {
    font-size: var(--font-heading);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
    margin-right: var(--space-2);
}
.sj-frag__val span { color: var(--text-muted); }
.sj-frag__bar {
    margin-top: var(--space-6);
    height: 5px;
    border-radius: var(--radius-pill);
    background: var(--border-color);
    overflow: hidden;
}
.sj-frag__bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--accent-gold);
    min-width: 0;
}
.sj-frag__hint {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.sj-frag__hint b {
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
    font-variant-numeric: tabular-nums;
}
.sj-workshop__actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
.sj-scrolls-label {
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.sj-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.sj-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-card) 70%, transparent);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.sj-chip.is-empty { color: var(--text-muted); }
.sj-chip__q {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-gold, var(--accent-gold));
}
.sj-list-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 var(--space-2);
}
.sj-list-head__t {
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--text-jade, var(--accent-jade));
}
.sj-list-head__n {
    font-size: var(--font-caption);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
.sj-empty {
    padding: var(--space-14) var(--space-8);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
    line-height: 1.55;
}
.sj-pet {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
}
.sj-pet.is-focus {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
}
.sj-pet__hint {
    margin: 0;
    font-size: var(--font-caption);
    line-height: 1.4;
    color: var(--text-muted);
}
.sj-pet__hint b {
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
    font-variant-numeric: tabular-nums;
}
.sj-pet__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}
.sj-pet__name {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.25;
}
.sj-pet__realm {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.sj-pet__slots { margin: 0; }

/* 可选卷轴：卡片列表（对齐 yd-row / sj-current） */
.sj-scroll-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    flex-shrink: 0;
}
.sj-scroll {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-8) var(--space-10);
    align-items: center;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    box-sizing: border-box;
    flex-shrink: 0;
}
.sj-scroll__main { min-width: 0; }
.sj-scroll__title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2) var(--space-6);
}
.sj-scroll__name {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
    line-height: 1.3;
}
.sj-scroll__qty {
    font-size: var(--font-caption);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
}
.sj-scroll__desc {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sj-scroll .pet-skill-detail-lines {
    margin-top: var(--space-6);
}
.sj-scroll > .modal-btn.sj-btn {
    align-self: center;
}
.sj-btn--warn {
    color: var(--accent-orange, #9a6b3d);
    border-color: color-mix(in srgb, var(--accent-orange, #9a6b3d) 38%, transparent);
}

/* 点槽后的选诀二级弹窗：宽高由 .gc-dialog 几何契约统一提供 */
.sj-current,
.sj-current.is-empty {
    flex-shrink: 0;
}
.sj-current {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    text-align: left;
}
.sj-current.is-empty {
    border-style: dashed;
    opacity: 0.92;
}
.sj-current__lab {
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.sj-current__name {
    font-size: var(--font-body-lg);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
    line-height: 1.3;
}
.sj-current.is-empty .sj-current__name {
    color: var(--text-secondary);
    font-weight: 600;
}
.sj-current__desc {
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
}
.sj-current__forget {
    margin-top: var(--space-6);
    align-self: flex-start;
}
@supports not (background: color-mix(in srgb, white 50%, black)) {
    .yd-stock__cell.is-top,
    .yd-note,
    .sj-chip {
        background: var(--bg-panel, var(--bg-card));
    }
    .sj-pet.is-focus { border-color: var(--border-gold, var(--border-color)); }
}
@media (max-width: 360px) {
    .sj-workshop__top {
        grid-template-columns: 1fr;
    }
    .sj-workshop__actions {
        flex-direction: row;
    }
    body.game-page .gc-dialog.sj-dialog .sj-workshop__actions .modal-btn.sj-btn,
    .gc-dialog.sj-dialog .sj-workshop__actions .modal-btn.sj-btn,
    .sj-workshop__actions .sj-btn { flex: 1; }
}

/* ══════════════════════════════════════
   一键放生 · pet-rel-dialog（gc-dialog danger）
   无 gc-foot / 无底栏关闭：仅顶 ×；mid 自带底距
   ══════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.gc-dialog.pet-rel-dialog,
.modal-content.modal--decorated.gc-dialog.pet-rel-dialog,
.gc-dialog.pet-rel-dialog {
    padding: 0;
}
body.game-page .gc-dialog.pet-rel-dialog > .gc-mid.pet-rel-mid,
.gc-dialog.pet-rel-dialog > .gc-mid.pet-rel-mid,
.pet-rel-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    text-align: left;
    padding: var(--space-8) var(--space-16) max(var(--space-20), env(safe-area-inset-bottom, 0px));
    max-height: min(70vh, 560px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: normal;
}
.pet-rel-mid::-webkit-scrollbar { display: none; }
.pet-rel-q {
    margin: 0;
    font-size: var(--font-action);
    text-align: left;
    letter-spacing: 0.5px;
}
.pet-rel-sub {
    margin: 0;
    text-align: left;
}
.pet-rel-sec { margin: 0; }
.pet-rel-sec + .pet-rel-sec { margin-top: var(--space-4); }
.pet-rel-sec__h {
    margin: 0 0 var(--space-8);
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--text-muted);
}
.pet-rel-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8);
}
.pet-rel-stage {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: var(--space-4);
}
.pet-rel-stage > .pet-rel-sec__h {
    margin: 0;
}
.pet-rel-cell {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-4);
    min-height: 72px;
    padding: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 58, 49, 0.26);
    background: rgba(183, 58, 49, 0.06);
    color: var(--text-primary);
    text-align: left;
    font-family: inherit;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    transition: background 0.12s ease, border-color 0.12s ease;
}
.pet-rel-cell:hover {
    background: rgba(183, 58, 49, 0.10);
    border-color: rgba(183, 58, 49, 0.40);
}
.pet-rel-cell:active { opacity: 0.9; }
.pet-rel-cell__t {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-6);
}
.pet-rel-cell__t b {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-danger, var(--accent-crimson));
}
.pet-rel-cell__t em {
    font-style: normal;
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.pet-rel-cell__d {
    font-size: var(--font-caption);
    line-height: 1.4;
    color: var(--text-muted);
}
.pet-rel-mid > .gc-irrev {
    margin-top: var(--space-4);
    margin-bottom: 0;
}

/* ══════════════════════════════════════
   灵兽弹窗族 · feed / pill / egg / wash
   圆角一律吃 gc-dialog 变量：壳 14 / 内卡 10 / 钮 8
   禁止另写 6px/4px 圆角分叉
   ══════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.gc-dialog.pet-feed-dialog,
.modal-content.modal--decorated.gc-dialog.pet-feed-dialog,
.gc-dialog.pet-feed-dialog,
body.game-page .modal-content.modal--decorated.gc-dialog.pet-wash-dialog,
.modal-content.modal--decorated.gc-dialog.pet-wash-dialog,
.gc-dialog.pet-wash-dialog {
    padding: 0;
    border-radius: var(--gc-radius, var(--radius-lg));
}
body.game-page .modal-content.modal--decorated.gc-dialog.pet-list-dialog,
.modal-content.modal--decorated.gc-dialog.pet-list-dialog,
.gc-dialog.pet-list-dialog {
    padding: 0;
    border-radius: var(--gc-radius, var(--radius-lg));
}

/* 列表头：对齐 sj/yd（金标题 + 40 触控 ×），圆角仍走全局 8 */
body.game-page .gc-dialog.pet-list-dialog > .gc-head.pet-list-head,
.gc-dialog.pet-list-dialog > .gc-head.pet-list-head,
.pet-list-head {
    position: relative;
    padding: var(--space-14) var(--space-48) var(--space-6) var(--space-14);
}
.pet-list-head .gc-rule { margin-bottom: var(--space-8); }
.pet-list-head .gc-title {
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-title);
    letter-spacing: 0.12em;
}
.pet-list-head .modal-header-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
}

body.game-page .gc-dialog.pet-list-dialog > .gc-mid.pet-list-mid,
.gc-dialog.pet-list-dialog > .gc-mid.pet-list-mid,
.pet-list-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    flex: 1 1 auto;
    min-height: 0;
    text-align: left;
    padding: var(--space-2) var(--space-14) max(var(--space-16), env(safe-area-inset-bottom, 0px));
    max-height: min(74vh, 680px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: normal;
}
.pet-list-mid::-webkit-scrollbar { display: none; }

body.game-page .gc-dialog.pet-feed-dialog > .gc-mid.pet-feed-mid,
.gc-dialog.pet-feed-dialog > .gc-mid.pet-feed-mid,
.pet-feed-mid,
body.game-page .gc-dialog.pet-wash-dialog > .gc-mid.pet-wash-mid,
.gc-dialog.pet-wash-dialog > .gc-mid.pet-wash-mid,
.pet-wash-mid {
    text-align: left;
    white-space: normal;
}

.pet-gc-id {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-8);
}
.pet-gc-id__name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-action);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-primary);
    line-height: 1.3;
}
.pet-gc-id__meta {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
}
.pet-gc-chip {
    flex-shrink: 0;
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    font-weight: 700;
    border: 1px solid var(--border-jade, rgba(22, 128, 106, 0.40));
    color: var(--text-jade, var(--accent-jade));
    background: rgba(22, 128, 106, 0.08);
}
.pet-gc-chip--gold {
    border-color: var(--border-gold, rgba(183, 120, 31, 0.40));
    color: var(--text-gold, var(--accent-gold));
    background: rgba(183, 120, 31, 0.10);
}

.pet-gc-field { margin-top: var(--space-12); }
.pet-gc-lab {
    display: block;
    margin: 0 0 var(--space-6);
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-secondary);
}
.pet-gc-qty {
    display: flex;
    gap: var(--space-8);
    align-items: center;
}
.pet-gc-qty .gc-input,
.pet-gc-qty .app-input {
    flex: 1 1 auto;
    min-width: 0;
    text-align: center;
    border-radius: var(--gc-radius-btn, var(--radius-md));
}
.pet-gc-qty .modal-btn {
    flex: 0 0 auto;
    width: auto;
    min-width: 64px;
    border-radius: var(--gc-radius-btn, var(--radius-md));
}

/* 表单控件圆角：与 gc-dialog 输入一致 8px */
.gc-dialog.pet-feed-dialog .gc-input,
.gc-dialog.pet-feed-dialog .app-input,
.gc-dialog.pet-list-dialog .gc-input,
.gc-dialog.pet-list-dialog .app-input,
.gc-dialog.pet-wash-dialog .gc-input {
    border-radius: var(--gc-radius-btn, var(--radius-md));
}

.pet-gc-mat {
    margin-top: var(--space-12);
    padding: var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.40));
    background: rgba(183, 120, 31, 0.08);
    text-align: left;
}
.pet-gc-mat__h {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
    margin-bottom: var(--space-6);
}
.pet-gc-mat__row {
    font-size: var(--font-label);
    line-height: 1.7;
    color: var(--text-secondary);
}
.pet-gc-mat__row b { color: var(--text-gold, var(--accent-gold)); }
.pet-gc-mat__hint {
    margin: var(--space-2) 0 var(--space-4);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
}
.pet-gc-mat .is-ok,
.yd-row__meta b.is-ok,
.pet-pill-x { color: var(--text-jade, var(--accent-jade)); font-weight: 700; }
.pet-gc-mat .is-bad { color: var(--text-danger, var(--accent-crimson)); font-weight: 700; }
.pet-gc-em { color: var(--text-gold, var(--accent-gold)); font-weight: 600; }

.pet-lead {
    margin: 0;
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-muted);
    text-align: left;
}
.pet-list-empty {
    padding: var(--space-20) var(--space-8);
    text-align: center;
    font-size: var(--font-body);
    color: var(--text-muted);
    line-height: 1.6;
}

.pet-res-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
}
.pet-res-card {
    padding: var(--space-10) var(--space-8) var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    text-align: left;
}
.pet-res-card__k {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
}
.pet-res-card__v {
    margin-top: var(--space-4);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body-lg);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.pet-res-card--hp .pet-res-card__v { color: var(--text-danger, var(--accent-crimson)); }
.pet-res-card--mp .pet-res-card__v { color: var(--text-blue, #3a6ea5); }

/* 行：复用 yd-row 网格；显式 10px 圆角与全局内卡一致 */
.gc-dialog.pet-list-dialog .yd-row {
    border-radius: var(--gc-radius-inner, var(--radius-md));
}
.gc-dialog.pet-list-dialog .yd-row.is-disabled { opacity: 0.68; }
.pet-pill-fam { display: flex; flex-direction: column; gap: var(--space-8); }
.pet-pill-fam__h {
    margin: var(--space-2) 0 0;
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
}
.pet-pill-fam__h small {
    margin-left: var(--space-6);
    font-weight: 500;
    color: var(--text-muted);
}
.pet-pill-x {
    font-size: var(--font-caption);
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
}

/* 行内操作钮 32px · 圆角 8 · 对齐 sj/yd */
body.game-page .gc-dialog.pet-list-dialog .modal-btn.pet-row-btn,
.gc-dialog.pet-list-dialog .modal-btn.pet-row-btn,
.pet-row-btn {
    flex: 0 0 auto;
    width: auto;
    min-width: 56px;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-12);
    font-size: var(--font-label);
    line-height: 1;
    border-radius: var(--gc-radius-btn, var(--radius-md));
    box-sizing: border-box;
}

.pet-egg-ops {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-6);
}
.pet-egg-qty {
    width: 48px;
    height: 32px;
    min-height: 32px;
    padding: 0 var(--space-4);
    text-align: center;
    font-size: var(--font-label);
    border-radius: var(--gc-radius-btn, var(--radius-md));
    box-sizing: border-box;
}

.pet-wash-q {
    font-size: var(--font-action);
    text-align: left;
    letter-spacing: 0.5px;
}
.pet-wash-sub { text-align: left; }
.pet-wash-xy {
    color: var(--accent-blue, #3a6ea5);
    font-weight: 600;
}
.pet-wash-stack {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-12);
}
.pet-wash-stack .modal-btn {
    width: 100%;
    height: auto;
    min-height: 48px;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-10) var(--space-12);
    letter-spacing: 0;
    border-radius: var(--gc-radius-btn, var(--radius-md));
}
.pet-wash-stack .modal-btn small {
    font-size: var(--font-caption);
    font-weight: 500;
    color: var(--text-muted);
    letter-spacing: 0;
}
.gc-dialog.pet-feed-dialog .gc-foot > .modal-btn,
.gc-dialog.pet-wash-dialog .gc-foot > .modal-btn,
.gc-dialog.pet-rel-dialog .gc-foot > .modal-btn {
    border-radius: var(--gc-radius-btn, var(--radius-md));
}

/* ══════════════════════════════════════
   灵兽详情 · B 分栏台（gc-dialog）
   顶条身份 + 四列四维 + 修为 + 流式键值 + 横向兽诀
   ══════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.gc-dialog.pet-detail-modal,
body.game-page .modal-content.modal--decorated.gc-dialog.pd-dialog,
.modal-content.modal--decorated.gc-dialog.pet-detail-modal,
.gc-dialog.pet-detail-modal,
.pd-dialog {
    max-width: min(392px, 90vw);
    width: 90%;
    padding: 0;
}

.pd-head {
    position: relative;
    padding: var(--space-16) var(--space-48) var(--space-8) var(--space-16);
}
.pd-head .gc-rule { margin-bottom: var(--space-10); }
.pd-head .gc-title { color: var(--text-jade, var(--accent-jade)); }
.pd-head .modal-header-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 44px;
    height: 44px;
}

body.game-page .gc-dialog.pd-dialog .gc-mid.pd-mid,
.gc-dialog.pd-dialog .gc-mid.pd-mid,
.pd-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    padding: var(--space-4) var(--space-14) var(--space-12);
    max-height: min(62vh, 520px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: normal;
}
.pd-mid::-webkit-scrollbar { display: none; }

.pd-strip {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: var(--space-12) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    background: var(--bg-panel, var(--bg-card));
}
.pd-strip__name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-heading);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text-gold);
    line-height: 1.25;
}
.pd-strip__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    align-items: center;
}
.pd-meta {
    font-size: var(--font-label);
    color: var(--text-secondary);
}
.pd-strip__desc {
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-muted);
}

.pd-chip {
    display: inline-flex;
    align-items: center;
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    font-size: var(--font-micro);
    line-height: 1.4;
    color: var(--text-muted);
    white-space: nowrap;
    background: color-mix(in srgb, var(--bg-card) 70%, transparent);
}
.pd-chip--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 36%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
.pd-chip--jade {
    color: var(--text-jade, var(--accent-jade));
    border-color: color-mix(in srgb, var(--accent-jade) 36%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}
.pd-chip--blue {
    color: var(--text-blue, var(--accent-blue));
    border-color: color-mix(in srgb, var(--accent-blue) 36%, transparent);
    background: color-mix(in srgb, var(--accent-blue) 10%, transparent);
}
.pd-chip--danger {
    color: var(--text-danger, var(--accent-crimson));
    border-color: color-mix(in srgb, var(--text-danger, var(--accent-crimson)) 36%, transparent);
    background: color-mix(in srgb, var(--text-danger, var(--accent-crimson)) 10%, transparent);
}
.pd-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.pd-muted {
    font-size: var(--font-label);
    color: var(--text-muted);
}

.pd-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-6);
}
.pd-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
    padding: var(--space-8);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel, var(--bg-card));
    min-width: 0;
}
.pd-stat span {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.pd-stat b {
    font-size: var(--font-label);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    overflow-wrap: anywhere;
}

.pd-exp {
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel, var(--bg-card));
}
.pd-exp__lab {
    display: flex;
    justify-content: space-between;
    gap: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-bottom: var(--space-6);
    font-variant-numeric: tabular-nums;
}
.pd-exp__lab.is-full {
    color: var(--text-gold);
    font-weight: 600;
}

/* 详情 B 内灵根块：贴合流式密度 */
.pd-mid .pet-root-bonus {
    margin-top: 0;
    border-radius: var(--radius-md);
}

.pd-flow {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
.pd-row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: var(--space-8);
    align-items: start;
    padding: var(--space-10) var(--space-10);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel, var(--bg-card));
    font-size: var(--font-label);
    line-height: 1.5;
    color: var(--text-secondary);
}
.pd-row strong {
    font-size: var(--font-caption);
    letter-spacing: 1px;
    color: var(--text-gold);
    font-weight: 700;
    padding-top: var(--space-2);
}
.pd-row__lead {
    color: var(--text-primary);
    font-weight: 700;
    margin-right: var(--space-6);
}
.pd-row__body {
    margin-top: var(--space-4);
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-secondary);
}
.pd-cost {
    display: inline-block;
    font-size: var(--font-caption);
    color: var(--text-blue, var(--accent-blue));
}
.pd-row--danger {
    border-color: color-mix(in srgb, var(--text-danger, var(--accent-crimson)) 32%, transparent);
    background: color-mix(in srgb, var(--text-danger, var(--accent-crimson)) 6%, var(--bg-panel, var(--bg-card)));
}
.pd-row--jade {
    border-color: color-mix(in srgb, var(--accent-jade) 28%, transparent);
}
.pd-row--skill {
    border-color: color-mix(in srgb, var(--accent-purple) 30%, transparent);
    background: color-mix(in srgb, var(--accent-purple) 6%, var(--bg-panel, var(--bg-card)));
}

.pd-skills {
    padding: var(--space-12) var(--space-12);
    border: 1px solid color-mix(in srgb, var(--accent-purple) 32%, transparent);
    border-radius: var(--radius-lg);
    background: color-mix(in srgb, var(--accent-purple) 7%, var(--bg-panel, var(--bg-card)));
}
.pd-skills__h {
    margin-bottom: var(--space-4);
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--text-gold);
}
.pd-skills__hint {
    margin: 0 0 var(--space-8);
    font-size: var(--font-caption);
    line-height: 1.4;
    color: var(--text-muted);
}

/* 详情内兽诀横向 */
.pet-skill-slot-list--row,
.pd-skills .pet-skill-slot-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-top: 0;
    grid-template-columns: none;
}
.pet-skill-slot-list--row .pet-skill-slot {
    flex: 1 1 140px;
    min-width: 0;
}

/* 兼容旧类名（护主 chip 等仍可能被引用） */
.pet-detail-body { white-space: normal; }
.pet-detail-muted {
    color: var(--text-muted);
    font-size: var(--font-label);
}
.pet-detail-bonus {
    padding: var(--space-2) var(--space-8);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 36%, transparent);
    border-radius: var(--radius-pill);
    color: var(--text-gold);
    font-size: var(--font-caption);
    line-height: 1.4;
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}

@media (max-width: 380px) {
    .pd-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .pd-row {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }
}

.pet-root-bonus {
    margin-top: var(--space-10);
    padding: var(--space-10) var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 24%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--accent-gold) 7%, transparent);
}

.pet-root-bonus--compact {
    margin: var(--space-6) 0 var(--space-8);
    padding: var(--space-6) var(--space-8);
    border-radius: var(--radius-sm);
}

.pet-root-bonus__title {
    display: flex;
    justify-content: space-between;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
    color: var(--text-gold);
    font-size: var(--font-label);
    font-weight: 600;
}

.pet-root-bonus__title small {
    flex: none;
    color: var(--text-muted);
    font-size: var(--font-caption);
    font-weight: 400;
}

.pet-root-bonus__rows {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}

.pet-root-bonus__chip {
    min-width: 0;
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-pill);
    font-size: var(--font-caption);
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.pet-root-bonus__chip--stat {
    border: 1px solid color-mix(in srgb, var(--accent-jade) 26%, transparent);
    color: var(--text-jade);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}

.pet-root-bonus__chip--effect {
    border: 1px solid color-mix(in srgb, var(--accent-gold) 30%, transparent);
    color: var(--text-gold);
    background: color-mix(in srgb, var(--accent-gold) 9%, transparent);
}

.pet-root-bonus__note {
    margin-top: var(--space-6);
    color: var(--text-muted);
    font-size: var(--font-caption);
    line-height: 1.45;
}

.pet-skill-slot-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--space-8);
    margin-top: var(--space-8);
}

.pet-skill-slot-list--compact {
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: var(--space-6);
}

.pet-skill-slot {
    min-width: 0;
    padding: var(--space-8) var(--space-8);
    border: 1px solid var(--glass-white-1);
    border-radius: var(--radius-sm);
    background: var(--glass-white-3);
    text-align: left;
    font: inherit;
    color: inherit;
    box-sizing: border-box;
}

button.pet-skill-slot {
    width: 100%;
    cursor: default;
    appearance: none;
    -webkit-appearance: none;
}

.pet-skill-slot--compact {
    padding: var(--space-6) var(--space-6);
}

.pet-skill-slot.has-skill {
    border-color: color-mix(in srgb, var(--text-gold) 28%, transparent);
}

.pet-skill-slot.is-empty {
    color: var(--text-secondary);
}

.pet-skill-slot.is-locked {
    color: var(--text-muted);
    opacity: 0.8;
}

/* 点槽 → 选诀：可点态 */
.pet-skill-slot.is-clickable:not(.is-locked) {
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.pet-skill-slot.is-clickable:not(.is-locked):hover {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, var(--glass-white-3, transparent));
}
.pet-skill-slot.is-clickable:not(.is-locked):active {
    opacity: 0.9;
}
.pet-skill-slot.is-clickable.is-locked {
    cursor: not-allowed;
}

.pet-skill-slot__head {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    min-width: 0;
    color: var(--text-gold);
    font-size: var(--font-label);
    line-height: 1.35;
}
.pet-skill-slot__go {
    margin-left: auto;
    flex: none;
    font-size: var(--font-title);
    line-height: 1;
    color: var(--text-muted);
    font-weight: 400;
}
.pet-skill-slot.is-clickable:not(.is-locked) .pet-skill-slot__go {
    color: var(--text-gold, var(--accent-gold));
}

.pet-skill-slot--compact .pet-skill-slot__head {
    font-size: var(--font-caption);
}

.pet-skill-slot__head b {
    flex: none;
    font-weight: 600;
}

.pet-skill-slot__head span {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* 兽诀名品阶着色与品阶小标（#10866） */
.pet-skill-slot__head span {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
}
.pet-skill-slot__skill-name {
    font-weight: 600;
}
.pet-skill-slot__grade {
    flex: none;
    font-style: normal;
    font-size: var(--font-caption);
    line-height: 1;
    padding: 1px 4px;
    border-radius: 3px;
    border: 1px solid currentColor;
    opacity: .85;
}

.pet-skill-slot__desc {
    margin-top: var(--space-4);
    color: var(--text-muted);
    font-size: var(--font-caption);
    line-height: 1.45;
}

.pet-skill-detail-lines {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: var(--space-6);
}

.pet-skill-detail-lines span {
    min-width: 0;
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--accent-purple) 12%, transparent);
    color: var(--text-secondary);
    font-size: var(--font-caption);
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.pet-skill-detail-lines--compact span {
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-micro);
}

@media (max-width: 520px) {

    /* 详情弹窗等可单列；列表卡内 pet-feed__skills 保持横向 flex */
    .pet-skill-slot-list:not(.pet-feed__skills),
    .pet-skill-slot-list--compact:not(.pet-feed__skills) {
        grid-template-columns: 1fr;
    }
}
.modal-info-card__title--jade { color: var(--accent-jade); }
.modal-info-card__title--danger { color: var(--text-danger); }

/* 弹窗功能列表行 */
.modal-feat-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    font-size: var(--font-label);
    line-height: 1.5;
}
.modal-feat-row {
    display: flex;
    align-items: start;
    gap: var(--space-8);
}
.modal-feat-icon { flex-shrink: 0; }
.modal-feat-icon--orange { color: var(--accent-orange); }
.modal-feat-icon--blue   { color: var(--accent-blue); }
.modal-feat-icon--purple { color: var(--accent-purple); }
.modal-feat-icon--jade   { color: var(--accent-jade); }

/* 角色增益弹窗 · A 玉简分章（gc-dialog 壳 + 生效/可开 Tab） */
body.game-page .modal-content.modal--decorated.ab-dialog,
.modal-content.modal--decorated.ab-dialog,
.ab-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-card);
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top) - var(--mobile-popup-safe-bottom)));
}
.active-buff-modal-overlay .modal-content {
    /* 宽度由 .gc-dialog 几何契约提供 */
}
.ab-head {
    padding: var(--space-16) var(--space-16) 0;
    flex-shrink: 0;
    background: var(--bg-card);
}
.ab-head .gc-title {
    letter-spacing: 4px;
}
.ab-summary {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    padding: var(--space-12) var(--space-16) 0;
    flex-shrink: 0;
    background: var(--bg-card);
}
.ab-summary span {
    font-size: var(--font-caption);
    color: var(--text-muted);
    padding: var(--space-4) var(--space-10);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
}
.ab-summary b {
    color: var(--text-gold);
    font-weight: 700;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}
.ab-note {
    margin: var(--space-8) var(--space-16) 0;
    padding: var(--space-8) var(--space-10);
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 85%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
}
.ab-note b {
    color: var(--text-jade, var(--text-gold));
    font-weight: 700;
}
.ab-tabs {
    display: flex;
    gap: var(--space-4);
    margin: var(--space-12) var(--space-14) 0;
    padding: var(--space-4);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
    border: 1px solid var(--border-color);
    flex-shrink: 0;
}
.ab-tab {
    flex: 1;
    height: 30px;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-muted);
    font: inherit;
    font-size: var(--font-label);
    letter-spacing: 1px;
    cursor: pointer;
    font-family: var(--font-display, KaiTi, "Noto Serif SC", serif);
}
.ab-tab.is-on {
    background: var(--bg-card);
    color: var(--text-gold);
    font-weight: 600;
    border: 1px solid color-mix(in srgb, var(--accent-gold) 20%, transparent);
    box-shadow: 0 1px 3px color-mix(in srgb, var(--text-primary) 8%, transparent);
}
.ab-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--space-10) var(--space-12) var(--space-12);
    background: var(--bg-card);
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.ab-scroll::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.ab-pane[hidden] {
    display: none !important;
}
.ab-foot {
    flex-shrink: 0;
    background: var(--bg-card);
}
.ab-foot--split {
    display: flex;
    gap: var(--space-10);
}
.ab-foot--split .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}
.active-buff-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 18px;
    padding: var(--space-2) var(--space-6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-pill);
    color: var(--text-muted);
    background: color-mix(in srgb, var(--bg-card) 48%, transparent);
    font-size: var(--font-micro);
    line-height: 1.3;
    white-space: nowrap;
}
.active-buff-badge--on {
    color: var(--accent-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 44%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}

/* —— 列表行（对齐 A 原型 .row） —— */
.active-buff-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.active-buff-row,
.active-buff-option-wrap {
    display: flex;
    align-items: flex-start;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
    margin-bottom: var(--space-8);
    border: 1px solid color-mix(in srgb, var(--border-color) 85%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
    transition: border-color 0.12s ease, background 0.12s ease;
}
.active-buff-row:last-child,
.active-buff-option-wrap:last-child {
    margin-bottom: 0;
}
.active-buff-row--on {
    border-color: color-mix(in srgb, var(--accent-jade) 28%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 6%, var(--bg-panel));
}
.active-buff-option-wrap:hover,
.active-buff-option-wrap:focus-within {
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--bg-panel));
}

.active-buff-row__main {
    flex: 1 1 auto;
    min-width: 0;
}

.active-buff-row__top,
.active-buff-item-choice__top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-8);
}

.active-buff-row__name,
.active-buff-item-choice__name {
    min-width: 0;
    color: var(--text-primary);
    font-size: var(--font-body);
    font-weight: 700;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.active-buff-row__remain {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: var(--font-caption);
    line-height: 1.4;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    white-space: nowrap;
}

.active-buff-row__detail {
    display: block;
    margin-top: var(--space-4);
    color: var(--text-secondary);
    font-size: var(--font-caption);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.active-buff-option__preview,
.active-buff-item-choice__desc {
    display: block;
    margin-top: var(--space-2);
    color: var(--text-muted);
    font-size: var(--font-caption);
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.active-buff-row__actions {
    margin-top: var(--space-8);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}

.active-buff-option__meta {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-4);
    flex-wrap: wrap;
}

/* 卡内迷你钮（对齐原型 .mini / .mini--jade / .mini--gold） */
.active-buff-mini-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    min-height: 28px;
    margin: 0;
    padding: 0 var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-jade) 32%, transparent);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    color: var(--text-jade, var(--accent-jade));
    font: inherit;
    font-size: var(--font-caption);
    letter-spacing: 0.3px;
    cursor: pointer;
    white-space: nowrap;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
}
.active-buff-mini-btn:hover {
    border-color: color-mix(in srgb, var(--accent-jade) 48%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 12%, transparent);
}
.active-buff-mini-btn--gold,
.active-buff-option-quick {
    width: auto;
    min-height: 28px;
    height: 28px;
    margin: 0;
    padding: 0 var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 32%, transparent);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    color: var(--text-gold);
    font-weight: 600;
    box-shadow: none;
}
.active-buff-mini-btn--gold:hover,
.active-buff-option-quick:hover,
.active-buff-option-quick:focus-visible {
    border-color: color-mix(in srgb, var(--accent-gold) 48%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 14%, transparent);
    color: var(--text-gold);
    outline: none;
    transform: none;
}
.active-buff-mini-btn--ghost {
    border-color: var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font-weight: 500;
}
.active-buff-mini-btn--ghost:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
    color: var(--text-gold);
    background: color-mix(in srgb, var(--accent-gold) 5%, transparent);
}

.active-buff-item-choice {
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: var(--space-10) var(--space-12);
    margin-bottom: var(--space-8);
    border: 1px solid color-mix(in srgb, var(--border-color) 85%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
    color: var(--text-primary);
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.active-buff-item-choice:last-child {
    margin-bottom: 0;
}
.active-buff-item-choice:hover,
.active-buff-item-choice:focus-visible {
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--bg-panel));
    outline: none;
    transform: none;
}

.active-buff-modal__quick-use {
    flex: 1.25 1 0;
    white-space: nowrap;
}

.active-buff-empty {
    padding: var(--space-16) var(--space-8);
    border: none;
    border-radius: 0;
    color: var(--text-muted);
    background: transparent;
    font-size: var(--font-label);
    line-height: 1.6;
    text-align: center;
    font-style: italic;
}

.active-buff-empty--loading {
    color: var(--text-gold);
    font-style: normal;
}

/* ═══════════════════════════════════════════════════════════════
   清心丹 · 药力化解 · B 药力台（showMeditationBuffModal）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.mb-dialog,
.modal-content.modal--decorated.mb-dialog,
.mb-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 640px);
}

.mb-dialog .gc-mid.mb-mid {
    text-align: left;
    padding: var(--space-12) var(--space-14) var(--space-14);
    max-height: none;
    flex: 1 1 auto;
}

.mb-meter {
    padding: var(--space-12);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-10);
    background: var(--bg-panel);
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
}

.mb-meter-top {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: var(--space-8);
}

.mb-meter-title {
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-secondary);
}

.mb-meter-val {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-heading);
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
    font-variant-numeric: tabular-nums;
}

.mb-meter-val span {
    font-size: var(--font-caption);
    font-weight: 500;
    color: var(--text-muted);
    margin-left: var(--space-2);
}

.mb-track {
    display: flex;
    gap: var(--space-4);
    height: 10px;
}

.mb-seg {
    flex: 1 1 0;
    min-width: 0;
    border-radius: var(--radius-xs);
    background: color-mix(in srgb, var(--border-color) 70%, transparent);
    opacity: 0.55;
}

.mb-seg.is-on {
    background: color-mix(in srgb, var(--accent-jade) 55%, transparent);
    opacity: 1;
}

.mb-card {
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-8);
    border: 1px solid color-mix(in srgb, var(--border-color) 75%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 60%, transparent);
}

.mb-card-h {
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-gold);
    margin-bottom: var(--space-6);
}

.mb-card-p {
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-secondary);
}

.mb-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-10);
}

.mb-actions-row {
    display: flex;
    gap: var(--space-8);
}

.mb-actions-row > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

/* 关闭：与主操作同高 40px、全宽，勿用小字 ghost */
.mb-dialog .mb-close.modal-btn--full,
.mb-dialog .mb-actions > .modal-btn--full {
    width: 100%;
    flex: 0 0 auto;
    height: 40px;
    min-height: 40px;
    font-size: var(--font-body);
    font-weight: 600;
}

.mb-dialog .mb-actions .modal-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* ═══════════════════════════════════════════════════════════════
   五行通灵 · 药力化解 · A 通灵笺（showFiveRootModal）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.fr-dialog,
.modal-content.modal--decorated.fr-dialog,
.fr-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 720px);
}

.fr-dialog .gc-mid.fr-mid {
    text-align: center;
    padding: var(--space-12) var(--space-14) var(--space-14);
    max-height: none;
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.fr-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-14) var(--space-16);
    margin-bottom: var(--space-12);
    border-radius: var(--radius-lg);
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-gold, var(--text-gold)) 24%, transparent);
}

.fr-hero-grade {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-hero);
    font-weight: 600;
    color: var(--text-gold);
    letter-spacing: 2px;
    line-height: 1.1;
}

.fr-hero-sub {
    font-size: var(--font-label);
    color: var(--text-secondary);
}

.fr-hero-sub b {
    color: var(--text-gold);
    font-weight: 700;
}

.fr-hero-time {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    color: var(--text-jade, var(--accent-jade));
    margin-top: var(--space-2);
}

.fr-stamps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--space-6);
    margin-bottom: var(--space-12);
}

.fr-stamp {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-8) var(--space-2) var(--space-8);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
    min-width: 0;
    --fr-c: var(--text-muted);
}

.fr-stamp--metal { --fr-c: #b89a2e; }
.fr-stamp--wood { --fr-c: #2f8f5b; }
.fr-stamp--water { --fr-c: #3a7fc4; }
.fr-stamp--fire { --fr-c: #c45a3a; }
.fr-stamp--earth { --fr-c: #9a7340; }

html.theme-dark .fr-stamp--metal { --fr-c: #c9b46a; }
html.theme-dark .fr-stamp--wood { --fr-c: #6fad8a; }
html.theme-dark .fr-stamp--water { --fr-c: #7aa8d4; }
html.theme-dark .fr-stamp--fire { --fr-c: #d48872; }
html.theme-dark .fr-stamp--earth { --fr-c: #b89a72; }

.fr-stamp.is-on {
    border-color: color-mix(in srgb, var(--fr-c) 45%, var(--border-color));
    background: color-mix(in srgb, var(--fr-c) 10%, transparent);
}

.fr-stamp.is-off {
    opacity: 0.48;
}

.fr-stamp-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--fr-c);
}

.fr-stamp.is-off .fr-stamp-dot {
    background: transparent;
    border: 1.5px solid var(--text-muted);
}

.fr-stamp-name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--fr-c);
    line-height: 1.2;
}

.fr-stamp.is-off .fr-stamp-name {
    color: var(--text-muted);
}

.fr-stamp-lab {
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 0;
    white-space: nowrap;
}

.fr-queue-h {
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-gold);
    margin-bottom: var(--space-8);
    text-align: left;
}

.fr-queue {
    text-align: left;
    max-height: min(38dvh, 260px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: var(--space-4);
}

.fr-qitem {
    padding: var(--space-10) var(--space-10) var(--space-10);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-8);
    border: 1px solid color-mix(in srgb, var(--border-color) 75%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 55%, transparent);
}

.fr-qitem.is-active {
    border-color: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 40%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade, var(--text-jade)) 8%, transparent);
}

.fr-qitem-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-4);
}

.fr-qitem-title {
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.35;
    min-width: 0;
}

.fr-qitem-tag {
    flex: 0 0 auto;
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-muted);
}

.fr-qitem.is-active .fr-qitem-tag {
    color: var(--text-jade, var(--accent-jade));
}

.fr-qitem-bot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-8);
}

.fr-qitem-meta {
    font-size: var(--font-caption);
    color: var(--text-muted);
    min-width: 0;
}

.fr-dialog .fr-dismiss-btn {
    flex: 0 0 auto;
    height: 28px;
    min-height: 28px;
    min-width: 52px;
    padding: 0 var(--space-10);
    font-size: var(--font-label);
    line-height: 1.2;
    border-radius: var(--radius-sm);
}

.fr-dialog .fr-dismiss-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.fr-qempty {
    text-align: center;
    padding: var(--space-12) var(--space-8);
    font-size: var(--font-label);
    color: var(--text-muted);
}

.fr-note {
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-muted);
    text-align: left;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    margin: var(--space-8) 0 var(--space-10);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    border: 1px dashed color-mix(in srgb, var(--border-color) 80%, transparent);
}

.fr-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.fr-dialog .fr-close.modal-btn--full,
.fr-dialog .fr-actions > .modal-btn--full {
    width: 100%;
    flex: 0 0 auto;
    height: 40px;
    min-height: 40px;
    font-size: var(--font-body);
    font-weight: 600;
}

@media (max-width: 520px) {
    .modal-header-deco {
        padding-right: var(--space-48);
        padding-left: var(--space-48);
    }

    /* A 原型：卡内按钮横排，窄屏自动换行（row__actions 已 flex-wrap） */
    .active-buff-option-wrap {
        display: flex;
    }

    .active-buff-option-quick {
        width: auto;
        min-height: 28px;
        height: 28px;
        margin: 0;
        flex-direction: row;
        padding: 0 var(--space-10);
    }

    .active-buff-modal__quick-use {
        flex-basis: 100%;
    }

    .active-buff-row__top,
.active-buff-item-choice__top {
        flex-direction: column;
        gap: var(--space-4);
    }

    .active-buff-option__meta,
    .active-buff-row__remain {
        align-self: flex-start;
    }
}

/* ═══ 修为加成总览 · co-dialog（gc-dialog 壳 + mid 可滚、隐藏滚动条）═══ */
.gc-dialog.co-dialog {
    max-width: 392px;
}
/* 壳：头/脚固定，中间区滚动；脚底 padding 不被裁切 */
.co-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.co-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.co-dialog,
.modal-content.modal--decorated.gc-dialog.co-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
/* mid 可滚，但不显示滚动条 */
.gc-dialog.co-dialog .gc-mid.co-mid,
.gc-dialog.co-dialog .co-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none; /* 高度由 flex 在壳 max-height 内分配 */
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* 旧 Edge */
}
.gc-dialog.co-dialog .gc-mid.co-mid::-webkit-scrollbar,
.gc-dialog.co-dialog .co-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none; /* Chrome / Safari */
}
.gc-dialog.co-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.co-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.co-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
/* 脚固定在壳底，保留底边距 */
.gc-dialog.co-dialog .gc-foot,
.gc-dialog.co-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.co-sub {
    margin: 0 0 var(--space-10) !important;
    font-size: var(--font-caption);
    line-height: 1.55;
}

/* 三场景净倍率 */
.co-hero {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-6);
    margin-bottom: var(--space-10);
}
.co-hero__cell {
    padding: var(--space-8) var(--space-4) var(--space-6);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    text-align: center;
}
.co-hero__k {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
}
.co-hero__v {
    margin-top: var(--space-2);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body-lg);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
.co-hero__v.is-jade { color: var(--text-jade); }
.co-hero__v.is-muted {
    color: var(--text-muted);
    font-weight: 500;
    font-size: var(--font-body);
}

/* 修为进度 */
.co-progress {
    margin-bottom: var(--space-10);
    padding: var(--space-10) var(--space-10) var(--space-8);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(22, 128, 106, 0.18);
    background: rgba(22, 128, 106, 0.05);
}
html.theme-dark .co-progress {
    border-color: rgba(127, 161, 141, 0.22);
    background: rgba(127, 161, 141, 0.06);
}
.co-progress__top {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-6);
    margin-bottom: var(--space-4);
}
.co-progress__realm {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-body);
    letter-spacing: 1px;
    color: var(--text-jade);
    font-weight: 600;
}
.co-progress__pct {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-caption);
    color: var(--accent-cyan, #82a9aa);
    font-variant-numeric: tabular-nums;
}
.co-progress__nums {
    font-size: var(--font-micro);
    color: var(--text-secondary);
    margin-bottom: var(--space-6);
    line-height: 1.45;
    /* 详细千分位可能很长（反馈 #5643），允许换行不溢出 */
    word-break: break-all;
    overflow-wrap: anywhere;
}
.co-progress__nums b {
    color: var(--text-primary);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.co-progress__sep { color: var(--text-muted); }
.co-progress__need {
    color: var(--text-gold);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.co-progress__bar {
    height: 6px;
    border-radius: var(--radius-xs);
    background: rgba(47, 47, 43, 0.08);
    overflow: hidden;
}
html.theme-dark .co-progress__bar {
    background: rgba(255, 255, 255, 0.06);
}
.co-progress__fill {
    height: 100%;
    border-radius: var(--radius-xs);
    background: linear-gradient(90deg, var(--accent-jade), var(--accent-cyan, #82a9aa));
}

/* 场景块 + chip 流 */
.co-scene {
    margin-bottom: var(--space-8);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.co-scene__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.co-scene__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.co-scene__mul {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-caption);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
.co-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--space-4);
    padding: 0 var(--space-8) var(--space-8);
}
/*
 * #6513：overflow-wrap:anywhere 会把 flex 子项 min-content 压到单字宽，
 * 长标签（如「越阶境界压制（战斗过程）」）变成一字一行竖排。
 * 改为不压缩宽度、放不下就换行；长说明用 .co-note 块级展示。
 */
.co-chip {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
    box-sizing: border-box;
    max-width: 100%;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-micro);
    line-height: 1.35;
    color: var(--text-secondary);
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}
.co-chip__fx {
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-micro);
    flex-shrink: 0;
}
/* 长规则说明：整行块，避免塞进 pill chip */
.co-note {
    display: block;
    flex: 1 1 100%;
    box-sizing: border-box;
    max-width: 100%;
    margin: 0;
    padding: var(--space-6) var(--space-8);
    border-radius: var(--radius-md);
    border: 1px dashed color-mix(in srgb, var(--border-color) 90%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}
.co-note.is-dim {
    opacity: 0.72;
}
.co-note__name {
    display: block;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--space-2);
}
.co-note__fx {
    display: block;
    color: var(--text-muted);
    font-weight: 400;
}
.co-chip.is-neg {
    border-color: rgba(183, 58, 49, 0.28);
    background: rgba(183, 58, 49, 0.06);
}
.co-chip.is-neg .co-chip__fx { color: var(--text-red, var(--accent-crimson)); }
.co-chip.is-dim { opacity: 0.45; }
.co-chip.is-dim .co-chip__fx {
    color: var(--text-muted);
    font-weight: 500;
    font-family: inherit;
}

.co-footnote {
    margin: var(--space-2) var(--space-2) var(--space-4);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-align: left;
    text-wrap: wrap;
}
.co-footnote b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 气血/灵力/神识状态感知 · hp-dialog 诊脉笺族（无副标题）═══
   .is-hp 朱砂 · .is-mp 青蓝 · .is-sp 紫  */
.gc-dialog.hp-dialog {
    max-width: 392px;
}
/* 主题：进度条/数值语义色 */
.gc-dialog.hp-dialog.is-mp {
    --hp-accent: var(--accent-cyan, #2a7a7c);
    --hp-accent-soft: rgba(42, 122, 124, 0.28);
    --hp-accent-bg: rgba(42, 122, 124, 0.07);
    --hp-bar-grad: linear-gradient(90deg, #3a8a9a, #6ab4c0);
}
html.theme-dark .gc-dialog.hp-dialog.is-mp {
    --hp-accent: var(--accent-cyan, #82a9aa);
    --hp-accent-soft: rgba(130, 169, 170, 0.30);
    --hp-accent-bg: rgba(130, 169, 170, 0.08);
    --hp-bar-grad: linear-gradient(90deg, #5a8a94, #82a9aa);
}
.gc-dialog.hp-dialog.is-sp {
    --hp-accent: var(--text-purple, var(--accent-purple, #7b5ea7));
    --hp-accent-soft: rgba(123, 94, 167, 0.30);
    --hp-accent-bg: rgba(123, 94, 167, 0.07);
    --hp-bar-grad: linear-gradient(90deg, #6a4f96, #9b7fc4);
}
html.theme-dark .gc-dialog.hp-dialog.is-sp {
    --hp-accent: var(--text-purple, #a88bc8);
    --hp-accent-soft: rgba(168, 139, 200, 0.32);
    --hp-accent-bg: rgba(168, 139, 200, 0.08);
    --hp-bar-grad: linear-gradient(90deg, #7a5fa0, #a88bc8);
}
.gc-dialog.hp-dialog.is-hp {
    --hp-accent: var(--text-red, var(--accent-crimson));
    --hp-accent-soft: rgba(183, 58, 49, 0.28);
    --hp-accent-bg: rgba(183, 58, 49, 0.06);
    --hp-bar-grad: linear-gradient(90deg, #c45c4a, #d4846a);
}
html.theme-dark .gc-dialog.hp-dialog.is-hp {
    --hp-accent-soft: rgba(197, 124, 114, 0.28);
    --hp-accent-bg: rgba(197, 124, 114, 0.07);
    --hp-bar-grad: linear-gradient(90deg, #a86a62, var(--text-red));
}
.gc-dialog.hp-dialog.is-mp .gc-rule,
.gc-dialog.hp-dialog.is-sp .gc-rule {
    background: var(--hp-accent);
}
.hp-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.hp-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.hp-dialog,
.modal-content.modal--decorated.gc-dialog.hp-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.hp-dialog .gc-mid.hp-mid,
.gc-dialog.hp-dialog .hp-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.hp-dialog .gc-mid.hp-mid::-webkit-scrollbar,
.gc-dialog.hp-dialog .hp-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.hp-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.hp-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.hp-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.hp-dialog .gc-foot,
.gc-dialog.hp-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 脉象英雄区（颜色跟 .is-hp / .is-mp / .is-sp） */
.hp-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-12) var(--space-12) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--hp-accent-soft, rgba(183, 58, 49, 0.28));
    background: var(--hp-accent-bg, rgba(183, 58, 49, 0.06));
}
.hp-hero__top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-8);
    margin-bottom: var(--space-6);
}
.hp-hero__nums {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    line-height: 1;
}
.hp-hero__cur {
    font-size: var(--font-hero);
    color: var(--hp-accent, var(--text-red, var(--accent-crimson)));
    letter-spacing: -0.5px;
}
.hp-hero__sep {
    font-size: var(--font-title);
    color: var(--text-muted);
    margin: 0 var(--space-4);
    font-weight: 500;
}
.hp-hero__max {
    font-size: var(--font-title);
    color: var(--text-secondary);
    font-weight: 600;
}
.hp-hero__pct {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--hp-accent, var(--text-red, var(--accent-crimson)));
    font-variant-numeric: tabular-nums;
}
.hp-hero__bar {
    height: 7px;
    border-radius: var(--radius-xs);
    background: rgba(42, 42, 38, 0.08);
    overflow: hidden;
}
html.theme-dark .hp-hero__bar {
    background: rgba(255, 255, 255, 0.06);
}
.hp-hero__fill {
    height: 100%;
    border-radius: var(--radius-xs);
    background: var(--hp-bar-grad, linear-gradient(90deg, #c45c4a, #d4846a));
}
.hp-hero__meta {
    margin-top: var(--space-8);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6) var(--space-12);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.hp-hero__meta b {
    color: var(--text-gold);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}
.hp-hero__meta .is-ok {
    color: var(--text-jade);
}

/* 区块（仅区名，无右侧子标题） */
.hp-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.hp-sec__head {
    display: flex;
    align-items: center;
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.hp-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.hp-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    padding: 0 var(--space-8) var(--space-10);
}
.hp-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-micro);
    line-height: 1.35;
    color: var(--text-secondary);
}
.hp-chip__v {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-micro);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
.hp-chip.is-jade .hp-chip__v { color: var(--text-jade, var(--accent-jade)); }
.hp-chip.is-blue .hp-chip__v { color: var(--accent-blue, #3a6ea5); }
.hp-chip.is-cyan .hp-chip__v { color: var(--accent-cyan, #2a7a7c); }
.hp-chip.is-purple .hp-chip__v { color: var(--text-purple, var(--accent-purple, #7b5ea7)); }
.hp-chip.is-gold .hp-chip__v { color: var(--text-gold, var(--accent-gold, #c4a35a)); }
.hp-chip.is-neg {
    border-color: rgba(183, 58, 49, 0.30);
    background: rgba(183, 58, 49, 0.07);
}
.hp-chip.is-neg .hp-chip__v { color: var(--text-red, var(--accent-crimson)); }

/* 恢复预估 */
.hp-eta {
    margin-bottom: var(--space-10);
    padding: var(--space-10) var(--space-10) var(--space-8);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
}
html.theme-dark .hp-eta {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.06);
}
.hp-eta__head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-8);
    margin-bottom: var(--space-4);
}
.hp-eta__title {
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-gold);
    letter-spacing: 0.5px;
}
.hp-eta__time {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--hp-accent, var(--text-red, var(--accent-crimson)));
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}
.hp-eta__sub {
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.hp-eta__sub b {
    color: var(--text-secondary);
    font-weight: 600;
}
.hp-eta__rows {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}
.hp-eta__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.hp-eta__row b {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--hp-accent, var(--text-gold));
    font-variant-numeric: tabular-nums;
}

/* 神识恢复口径脚注（构成区内） */
.hp-regen-note {
    padding: 0 var(--space-10) var(--space-10);
    font-size: var(--font-micro);
    line-height: 1.55;
    color: var(--text-muted);
}
.hp-regen-note b {
    color: var(--hp-accent, var(--text-purple));
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}

/* 灵石自定义吸收行 */
.hp-absorb-row {
    display: flex;
    align-items: center;
    gap: var(--space-8);
}
.hp-absorb-input {
    flex: 1;
    min-width: 0;
    height: 36px;
    text-align: center;
    border-radius: var(--radius-md, var(--radius-md));
}
.hp-absorb-row .modal-btn {
    flex: 0 0 auto;
    height: 36px;
    padding: 0 var(--space-14);
    font-size: var(--font-label);
}

/* 动作行 */
.hp-act-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: 0 var(--space-8) var(--space-10);
}
.hp-act {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    width: 100%;
    min-height: 40px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    color: var(--text-primary);
    font-family: inherit;
    font-size: var(--font-label);
    cursor: pointer;
    text-align: left;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.12s ease, background 0.12s ease, opacity 0.12s ease;
}
.hp-act:hover { border-color: var(--border-gold); }
.hp-act__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}
.hp-act__name {
    font-weight: 600;
    font-size: var(--font-label);
    letter-spacing: 0.3px;
}
.hp-act__hint {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.35;
}
.hp-act__cost {
    flex-shrink: 0;
    font-size: var(--font-micro);
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}
.hp-act--jade {
    border-color: rgba(22, 128, 106, 0.36);
    background: rgba(22, 128, 106, 0.07);
}
html.theme-dark .hp-act--jade {
    border-color: rgba(127, 161, 141, 0.36);
    background: rgba(127, 161, 141, 0.08);
}
.hp-act--jade .hp-act__name { color: var(--text-jade); }
.hp-act--orange {
    border-color: rgba(196, 122, 44, 0.36);
    background: rgba(196, 122, 44, 0.07);
}
html.theme-dark .hp-act--orange {
    border-color: rgba(201, 160, 106, 0.36);
    background: rgba(201, 160, 106, 0.08);
}
.hp-act--orange .hp-act__name { color: var(--accent-orange, #c47a2c); }
.hp-act--cyan {
    border-color: rgba(42, 122, 124, 0.36);
    background: rgba(42, 122, 124, 0.07);
}
html.theme-dark .hp-act--cyan {
    border-color: rgba(130, 169, 170, 0.36);
    background: rgba(130, 169, 170, 0.08);
}
.hp-act--cyan .hp-act__name { color: var(--accent-cyan, #2a7a7c); }
.hp-act--purple {
    border-color: rgba(123, 94, 167, 0.36);
    background: rgba(123, 94, 167, 0.07);
}
html.theme-dark .hp-act--purple {
    border-color: rgba(168, 139, 200, 0.36);
    background: rgba(168, 139, 200, 0.08);
}
.hp-act--purple .hp-act__name { color: var(--text-purple, var(--accent-purple, #7b5ea7)); }
.hp-act--gold {
    border-color: rgba(183, 120, 31, 0.36);
    background: rgba(183, 120, 31, 0.07);
}
html.theme-dark .hp-act--gold {
    border-color: rgba(203, 168, 102, 0.36);
    background: rgba(203, 168, 102, 0.08);
}
.hp-act--gold .hp-act__name { color: var(--text-gold); }
.hp-act.is-disabled,
.hp-act:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════
   聚气回灵 · A 顶 × B 中下（design/absorb-stone-modal）
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.gc-dialog.as-dialog,
.modal-content.modal--decorated.gc-dialog.as-dialog,
.gc-dialog.as-dialog {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}
.as-head {
    position: relative;
    padding: var(--space-14) var(--space-48) var(--space-8) var(--space-16);
    flex-shrink: 0;
}
.as-head .gc-rule {
    margin-bottom: var(--space-10);
    background: var(--accent-cyan, #2a7a7c);
}
.as-head .gc-title { color: var(--accent-cyan, #2a7a7c); }
.as-head .modal-header-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 44px;
    height: 44px;
}
body.game-page .gc-dialog.as-dialog .gc-mid.as-mid,
.gc-dialog.as-dialog .gc-mid.as-mid,
.as-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    text-align: left;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--space-2) var(--space-14) var(--space-12);
    scrollbar-width: none;
}
.as-mid::-webkit-scrollbar { display: none; }
.as-foot {
    flex-shrink: 0;
    margin-top: 0;
    padding: var(--space-10) var(--space-14) max(var(--space-12), env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border-color);
    background: var(--bg-card);
}
.as-foot .modal-btn--gold { flex: 1.2; }
.as-foot .modal-btn--outline { flex: 0.75; }

/* A 顶：灵力进度 */
.as-hero {
    text-align: center;
    padding: var(--space-14) var(--space-12) var(--space-12);
    margin-bottom: var(--space-10);
    border: 1px solid rgba(42, 122, 124, 0.36);
    border-radius: var(--radius-lg);
    background: rgba(42, 122, 124, 0.08);
}
html.theme-dark .as-hero {
    border-color: rgba(130, 169, 170, 0.36);
    background: rgba(130, 169, 170, 0.1);
}
.as-hero__k {
    font-size: var(--font-caption);
    letter-spacing: 1px;
    color: var(--text-muted);
}
.as-hero__v {
    margin-top: var(--space-4);
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-hero);
    font-weight: 600;
    color: var(--accent-cyan, #2a7a7c);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.5px;
    line-height: 1.15;
}
html.theme-dark .as-hero__v { color: var(--accent-cyan, #82a9aa); }
.as-hero__v small {
    font-size: var(--font-action);
    opacity: 0.72;
    font-weight: 500;
    margin: 0 var(--space-4);
}
.as-hero__bar {
    position: relative;
    margin: var(--space-10) auto 0;
    height: 8px;
    max-width: 248px;
    border-radius: var(--radius-pill);
    background: var(--bg-input, rgba(42, 42, 38, 0.06));
    border: 1px solid var(--border-color);
    overflow: hidden;
}
.as-hero__fill {
    height: 100%;
    border-radius: var(--radius-pill);
    background: var(--accent-cyan, #2a7a7c);
    transition: width 0.18s ease;
}
.as-hero__preview {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--accent-gold) 45%, transparent);
    opacity: 0.55;
    pointer-events: none;
    transition: width 0.18s ease;
}
@supports not (color: color-mix(in srgb, #000 50%, #fff)) {
    .as-hero__preview { background: rgba(183, 120, 31, 0.4); }
}
.as-hero__meta {
    margin-top: var(--space-8);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-10) var(--space-14);
    font-size: var(--font-label);
    color: var(--text-secondary);
}
.as-hero__meta b {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}
.as-hero__after { color: var(--text-gold) !important; }
.as-hero__ok {
    color: var(--text-jade);
    font-weight: 600;
}

.as-stats {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-8);
    margin-bottom: var(--space-12);
}
.as-stat {
    padding: var(--space-10) var(--space-6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
    text-align: center;
}
.as-stat span {
    display: block;
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-bottom: var(--space-4);
    letter-spacing: 0.4px;
}
.as-stat b {
    font-size: var(--font-body);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}
.as-stat--gold { color: var(--text-gold) !important; }
.as-stat--cyan { color: var(--accent-cyan, #2a7a7c) !important; }
html.theme-dark .as-stat--cyan { color: var(--accent-cyan, #82a9aa) !important; }

/* B 中下：预估 + 滑杆 + 比例 */
.as-section-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-8);
    margin: var(--space-2) 0 var(--space-8);
}
.as-section-h h3 {
    margin: 0;
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--text-primary);
}
.as-section-h span {
    font-size: var(--font-caption);
    color: var(--text-muted);
}

.as-preview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: var(--space-12);
    border: 1px solid rgba(183, 120, 31, 0.36);
    border-radius: var(--radius-lg);
    background: rgba(183, 120, 31, 0.08);
    overflow: hidden;
}
html.theme-dark .as-preview {
    border-color: rgba(203, 168, 102, 0.36);
    background: rgba(203, 168, 102, 0.1);
}
.as-preview__cell {
    padding: var(--space-12) var(--space-10) var(--space-12);
    text-align: center;
}
.as-preview__cell + .as-preview__cell {
    border-left: 1px solid rgba(183, 120, 31, 0.22);
}
html.theme-dark .as-preview__cell + .as-preview__cell {
    border-left-color: rgba(203, 168, 102, 0.22);
}
.as-preview__k {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.as-preview__v {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-heading);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text-gold);
    line-height: 1.15;
}
.as-preview__v small {
    font-size: var(--font-label);
    font-weight: 500;
    opacity: 0.85;
    margin-left: var(--space-2);
}
.as-preview__v--cyan {
    color: var(--accent-cyan, #2a7a7c);
}
html.theme-dark .as-preview__v--cyan {
    color: var(--accent-cyan, #82a9aa);
}

.as-slider { margin-bottom: var(--space-10); }
.as-slider label {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-bottom: var(--space-8);
}
.as-slider label b {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    font-size: var(--font-label);
}
.as-slider input[type="range"] {
    width: 100%;
    height: 28px;
    margin: 0;
    accent-color: var(--accent-cyan, #2a7a7c);
    cursor: pointer;
}

.as-pct {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6);
    margin-bottom: var(--space-12);
}
.as-pct__btn {
    min-height: 40px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    color: var(--text-secondary);
    font-size: var(--font-label);
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
}
.as-pct__btn.is-on {
    border-color: rgba(42, 122, 124, 0.4);
    background: rgba(42, 122, 124, 0.14);
    color: var(--accent-cyan, #2a7a7c);
}
html.theme-dark .as-pct__btn.is-on {
    border-color: rgba(130, 169, 170, 0.4);
    background: rgba(130, 169, 170, 0.16);
    color: var(--accent-cyan, #82a9aa);
}
.as-pct__btn--fill.is-on {
    border-color: rgba(183, 120, 31, 0.4);
    background: rgba(183, 120, 31, 0.12);
    color: var(--text-gold);
}

.as-custom {
    display: flex;
    gap: var(--space-8);
    margin-bottom: var(--space-12);
    align-items: stretch;
}
.as-custom input {
    flex: 1;
    min-height: 44px;
    min-width: 0;
}
.as-custom .modal-btn {
    flex-shrink: 0;
    min-width: 64px;
    min-height: 44px;
    height: 44px;
}

.as-supply {
    margin-bottom: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
}
.as-supply__h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-primary);
}
.as-supply__h span {
    font-weight: 400;
    color: var(--text-muted);
    font-size: var(--font-caption);
}
.as-note {
    margin: var(--space-4) 0 0;
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.55;
    text-align: center;
}
.as-empty {
    text-align: center;
    padding: var(--space-16) var(--space-12);
    color: var(--text-muted);
    font-size: var(--font-body);
    border: 1px dashed var(--border-color);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-10);
}

/* 丹药列表收进 sec 内：去掉多余顶距，保留品阶色 */
.hp-dialog .dialog-pill-section {
    margin-top: var(--space-2);
}
.hp-dialog .dialog-pill-header {
    font-size: var(--font-caption);
    letter-spacing: 0.5px;
    margin-bottom: var(--space-6);
}
.hp-dialog .dialog-pill-item {
    background: var(--bg-card);
}
.hp-dialog .auto-process-entry-card {
    margin-bottom: var(--space-4);
    padding: var(--space-10) var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.hp-dialog .auto-process-entry-card__title {
    font-size: var(--font-label);
}
.hp-dialog .auto-process-entry-card__desc {
    font-size: var(--font-micro);
}
.hp-dialog .auto-process-entry-card .modal-btn {
    height: 30px;
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    flex: 0 0 auto;
}

/* ═══ 战力计算说明 · pw-help-dialog（gc-dialog gold · 无副标题）═══ */
.gc-dialog.pw-help-dialog {
    max-width: 392px;
}
.pw-help-overlay.ui-scrollable-modal .modal-content.gc-dialog.pw-help-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.pw-help-dialog,
.modal-content.modal--decorated.gc-dialog.pw-help-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.pw-help-dialog .gc-mid.pw-help-mid,
.gc-dialog.pw-help-dialog .pw-help-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.pw-help-dialog .gc-mid.pw-help-mid::-webkit-scrollbar,
.gc-dialog.pw-help-dialog .pw-help-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.pw-help-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.pw-help-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.pw-help-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.pw-help-dialog .gc-foot,
.gc-dialog.pw-help-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 公式锚点 */
.pw-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-12) var(--space-12) var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
}
html.theme-dark .pw-hero {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.07);
}
.pw-hero__k {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-gold);
    margin-bottom: var(--space-8);
}
.pw-hero__formula {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-6) var(--space-6);
}
.pw-term {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-caption);
    color: var(--text-primary);
    line-height: 1.3;
}
.pw-term b {
    font-weight: 600;
    letter-spacing: 0.3px;
}
.pw-term i {
    font-style: normal;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-micro);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
.pw-op {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-muted);
}

/* 分区 */
.pw-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.pw-sec--muted {
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
}
.pw-sec__head {
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.pw-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.pw-sec--muted .pw-sec__name {
    color: var(--text-secondary);
}
.pw-rows {
    display: flex;
    flex-direction: column;
    padding: 0 var(--space-10) var(--space-8);
}
.pw-row {
    padding: var(--space-8) 0;
    border-top: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
}
.pw-row:first-child {
    border-top: none;
    padding-top: var(--space-2);
}
.pw-row__k {
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-gold);
    letter-spacing: 0.3px;
    margin-bottom: var(--space-2);
}
.pw-row__v {
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
    text-wrap: wrap;
}
.pw-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    padding: 0 var(--space-8) var(--space-10);
}
.pw-chip {
    display: inline-flex;
    align-items: center;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-micro);
    line-height: 1.35;
    color: var(--text-muted);
}
.pw-footnote {
    margin: var(--space-2) var(--space-2) var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.pw-footnote b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 灵根操作 · sr-dialog（命格笺 A · gc-dialog gold · 无副标题）═══ */
.gc-dialog.sr-dialog {
    --sr-root: var(--text-gold);
    max-width: 392px;
}
.sr-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.sr-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.sr-dialog,
.modal-content.modal--decorated.gc-dialog.sr-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.sr-dialog .gc-mid.sr-mid,
.gc-dialog.sr-dialog .sr-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.sr-dialog .gc-mid.sr-mid::-webkit-scrollbar,
.gc-dialog.sr-dialog .sr-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.sr-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.sr-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.sr-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.sr-dialog .gc-foot,
.gc-dialog.sr-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* #5828：回选灵根可选 chip（须点选，禁默认第一项） */
.sr-reselect-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.sr-reselect-chip {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    padding: var(--space-6) var(--space-10);
    font-size: var(--font-label);
    font-weight: 600;
    line-height: 1.2;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(255, 215, 0, 0.28);
    background: rgba(0, 0, 0, 0.18);
    cursor: pointer;
    transition: background 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
.sr-reselect-chip:hover {
    background: rgba(255, 215, 0, 0.08);
}
.sr-reselect-chip.is-on {
    background: color-mix(in srgb, currentColor 16%, rgba(0, 0, 0, 0.22));
    border-color: currentColor;
    box-shadow: 0 0 0 1px color-mix(in srgb, currentColor 35%, transparent);
}

/* 命格英雄区 */
.sr-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-12) var(--space-12) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid color-mix(in srgb, var(--sr-root, var(--text-gold)) 36%, transparent);
    background: color-mix(in srgb, var(--sr-root, var(--text-gold)) 8%, var(--bg-panel));
}
.sr-hero__label {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.sr-hero__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-page-title);
    letter-spacing: 2px;
    font-weight: 700;
    color: var(--sr-root, var(--text-gold));
    line-height: 1.2;
}
.sr-hero__meta {
    margin-top: var(--space-6);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6) var(--space-12);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.sr-hero__meta b {
    color: var(--text-gold);
    font-weight: 600;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
}
.sr-badge {
    display: inline-flex;
    align-items: center;
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.5px;
    border: 1px solid color-mix(in srgb, var(--sr-root, var(--text-gold)) 40%, transparent);
    color: var(--sr-root, var(--text-gold));
    background: color-mix(in srgb, var(--sr-root, var(--text-gold)) 10%, transparent);
}
.sr-badge--muted {
    border-color: var(--border-color);
    color: var(--text-muted);
    background: var(--bg-card);
}

.sr-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.sr-sec__head {
    display: flex;
    align-items: center;
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.sr-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.sr-fx {
    padding: 0 var(--space-10) var(--space-10);
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
.sr-fx__row {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: var(--space-8);
    align-items: start;
}
.sr-fx__row--plain {
    grid-template-columns: 1fr;
}
.sr-fx__tag {
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--text-gold);
    padding-top: var(--space-2);
}
.sr-fx__body {
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
    text-wrap: wrap;
}
.sr-fx__body b {
    color: var(--text-primary);
    font-weight: 600;
}
.sr-fx__body--block {
    padding: 0 0 var(--space-2);
}

.sr-act-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: 0 var(--space-8) var(--space-10);
}
.sr-act {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    width: 100%;
    min-height: 40px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    color: var(--text-primary);
    font-family: inherit;
    font-size: var(--font-label);
    cursor: pointer;
    text-align: left;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.12s ease, background 0.12s ease, opacity 0.12s ease;
}
.sr-act:hover { border-color: var(--border-gold); }
.sr-act__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}
.sr-act__name {
    font-weight: 600;
    font-size: var(--font-label);
}
.sr-act__hint {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.35;
}
.sr-act__cost {
    flex-shrink: 0;
    font-size: var(--font-micro);
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}
.sr-act--jade {
    border-color: rgba(22, 128, 106, 0.36);
    background: rgba(22, 128, 106, 0.07);
}
html.theme-dark .sr-act--jade {
    border-color: rgba(127, 161, 141, 0.36);
    background: rgba(127, 161, 141, 0.08);
}
.sr-act--jade .sr-act__name { color: var(--text-jade); }
.sr-act--gold {
    border-color: rgba(183, 120, 31, 0.40);
    background: rgba(183, 120, 31, 0.08);
}
html.theme-dark .sr-act--gold {
    border-color: rgba(203, 168, 102, 0.40);
    background: rgba(203, 168, 102, 0.10);
}
.sr-act--gold .sr-act__name { color: var(--text-gold); }
.sr-act--purple {
    border-color: rgba(123, 94, 167, 0.36);
    background: rgba(123, 94, 167, 0.07);
}
html.theme-dark .sr-act--purple {
    border-color: rgba(168, 139, 200, 0.36);
    background: rgba(168, 139, 200, 0.08);
}
.sr-act--purple .sr-act__name { color: var(--text-purple, var(--accent-purple, #7b5ea7)); }
.sr-act--orange {
    border-color: rgba(196, 122, 44, 0.36);
    background: rgba(196, 122, 44, 0.07);
}
html.theme-dark .sr-act--orange {
    border-color: rgba(201, 160, 106, 0.36);
    background: rgba(201, 160, 106, 0.08);
}
.sr-act--orange .sr-act__name { color: var(--accent-orange, #c47a2c); }
.sr-act.is-disabled,
.sr-act:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.sr-note {
    margin: var(--space-2) var(--space-2) var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.sr-note b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 天灵根特效切换 · hm-dialog（命格笺同族 · 无副标题）═══ */
.gc-dialog.hm-dialog {
    max-width: 392px;
}
.hm-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.hm-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.hm-dialog,
.modal-content.modal--decorated.gc-dialog.hm-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.hm-dialog .gc-mid.hm-mid,
.gc-dialog.hm-dialog .hm-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.hm-dialog .gc-mid.hm-mid::-webkit-scrollbar,
.gc-dialog.hm-dialog .hm-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.hm-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.hm-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.hm-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.hm-dialog .gc-foot,
.gc-dialog.hm-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 状态总览 */
.hm-status {
    margin-bottom: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
}
html.theme-dark .hm-status {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.07);
}
.hm-status__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-4) 0;
}
.hm-status__row + .hm-status__row {
    border-top: 1px solid rgba(42, 42, 38, 0.06);
}
html.theme-dark .hm-status__row + .hm-status__row {
    border-top-color: rgba(172, 186, 196, 0.08);
}
.hm-status__k {
    font-size: var(--font-caption);
    color: var(--text-muted);
    flex-shrink: 0;
}
.hm-status__v {
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-primary);
    text-align: right;
    line-height: 1.4;
}
.hm-status__v.is-ok {
    color: var(--text-jade);
}
.hm-status__v--gold {
    color: var(--text-gold);
}
.hm-status__dim {
    font-weight: 500;
    color: var(--text-muted);
    font-size: var(--font-caption);
}

.hm-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.hm-sec__head {
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.hm-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.hm-cards {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: 0 var(--space-8) var(--space-10);
}

/* 模式卡片 */
.hm-card {
    display: block;
    width: 100%;
    padding: var(--space-10) var(--space-12) var(--space-10);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    text-align: left;
    font-family: inherit;
    color: inherit;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}
button.hm-card {
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
button.hm-card:hover {
    border-color: var(--border-gold);
}
.hm-card.is-current.hm-card--jade {
    border-color: rgba(22, 128, 106, 0.40);
    background: rgba(22, 128, 106, 0.08);
}
html.theme-dark .hm-card.is-current.hm-card--jade {
    border-color: rgba(127, 161, 141, 0.42);
    background: rgba(127, 161, 141, 0.10);
}
.hm-card.is-current.hm-card--gold {
    border-color: rgba(183, 120, 31, 0.42);
    background: rgba(183, 120, 31, 0.09);
}
html.theme-dark .hm-card.is-current.hm-card--gold {
    border-color: rgba(203, 168, 102, 0.42);
    background: rgba(203, 168, 102, 0.11);
}
.hm-card.is-disabled {
    opacity: 0.55;
}
.hm-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}
.hm-card__name {
    font-size: var(--font-body);
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--text-primary);
}
.hm-card--jade .hm-card__name { color: var(--text-jade); }
.hm-card--gold .hm-card__name { color: var(--text-gold); }
.hm-card__badge {
    flex-shrink: 0;
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    color: var(--text-muted);
    background: transparent;
}
.hm-card__badge.is-on {
    border-color: rgba(22, 128, 106, 0.36);
    color: var(--text-jade);
    background: rgba(22, 128, 106, 0.08);
}
.hm-card__badge.is-free {
    border-color: rgba(22, 128, 106, 0.36);
    color: var(--text-jade);
}
.hm-card__badge.is-paid {
    border-color: rgba(183, 120, 31, 0.40);
    color: var(--text-gold);
}
.hm-card__body {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
.hm-card__line {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: var(--space-8);
    align-items: start;
}
.hm-card__tag {
    font-size: var(--font-micro);
    font-weight: 700;
    color: var(--text-gold);
    letter-spacing: 0.5px;
    padding-top: var(--space-2);
}
.hm-card__text {
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-secondary);
    text-wrap: wrap;
}
.hm-note {
    margin: var(--space-2) var(--space-2) var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.hm-note b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 神庭更名 · cr-dialog（表单壳 / 诊脉笺同族 · 无副标题）═══ */
.gc-dialog.cr-dialog {
    max-width: 392px;
}
.cr-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.cr-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.cr-dialog,
.modal-content.modal--decorated.gc-dialog.cr-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 640px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.cr-dialog .gc-mid.cr-mid,
.gc-dialog.cr-dialog .cr-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.cr-dialog .gc-mid.cr-mid::-webkit-scrollbar,
.gc-dialog.cr-dialog .cr-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.cr-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.cr-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.cr-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.cr-dialog .gc-foot,
.gc-dialog.cr-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 费用锚点 */
.cr-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-12) var(--space-12) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
    text-align: center;
}
html.theme-dark .cr-hero {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.07);
}
.cr-hero__cost {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: var(--space-6);
}
.cr-hero__num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
}
.cr-hero__unit {
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--text-secondary);
}

.cr-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.cr-sec__head {
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.cr-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.cr-rows {
    padding: 0 var(--space-12) var(--space-8);
}
.cr-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-8) 0;
    border-top: 1px solid rgba(42, 42, 38, 0.06);
    font-size: var(--font-label);
}
html.theme-dark .cr-row {
    border-top-color: rgba(172, 186, 196, 0.08);
}
.cr-row:first-child {
    border-top: none;
    padding-top: var(--space-2);
}
.cr-row__k {
    color: var(--text-muted);
    flex-shrink: 0;
}
.cr-row__v {
    color: var(--text-primary);
    font-weight: 600;
    text-align: right;
}
.cr-row__v--gold {
    color: var(--text-gold);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
}
.cr-row__warn {
    font-size: var(--font-micro);
    font-weight: 600;
    color: var(--text-red, var(--accent-crimson));
    margin-left: var(--space-4);
}

.cr-field {
    padding: 0 var(--space-10) var(--space-10);
}
.cr-input {
    width: 100%;
    height: 42px;
    padding: 0 var(--space-12);
    font-size: var(--font-action);
    letter-spacing: 2px;
    text-align: center;
    border-radius: var(--radius-md, var(--radius-md));
    box-sizing: border-box;
}
.cr-field__hint {
    margin-top: var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.45;
    color: var(--text-muted);
    text-align: center;
}
.cr-note {
    margin: var(--space-2) var(--space-2) var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.cr-note b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 仇敌录 · nm-dialog（孽缘簿 C · gc-dialog danger · 无副标题）═══ */
.gc-dialog.nm-dialog {
    max-width: 392px;
}
.nm-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.nm-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.nm-dialog,
.modal-content.modal--decorated.gc-dialog.nm-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 720px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.nm-dialog .gc-mid.nm-mid,
.gc-dialog.nm-dialog .nm-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.nm-dialog .gc-mid.nm-mid::-webkit-scrollbar,
.gc-dialog.nm-dialog .nm-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.nm-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.nm-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.nm-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.nm-dialog .gc-foot,
.gc-dialog.nm-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

.nm-loading {
    margin: var(--space-16) var(--space-4);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
}

/* 代价顶条 */
.nm-banner {
    margin-bottom: var(--space-10);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-secondary);
    text-wrap: wrap;
}
html.theme-dark .nm-banner {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.07);
}
.nm-banner b {
    color: var(--text-gold);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* 账簿行 */
.nm-table {
    margin-bottom: var(--space-4);
}
.nm-tr {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-4) var(--space-10);
    padding: var(--space-10) 0;
    border-bottom: 1px solid rgba(42, 42, 38, 0.06);
    align-items: center;
}
html.theme-dark .nm-tr {
    border-bottom-color: rgba(172, 186, 196, 0.08);
}
.nm-tr:last-child {
    border-bottom: none;
}
.nm-tr__main {
    grid-column: 1;
    min-width: 0;
}
.nm-tr__name {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-red, var(--accent-crimson));
    letter-spacing: 0.3px;
    line-height: 1.3;
}
/* 灵根 / 品阶 / 品种徽章 */
.nm-tr__id {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-top: var(--space-4);
}
.nm-chip {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    font-size: var(--font-caption);
    font-weight: 600;
    line-height: 1;
    color: var(--text-secondary);
    background: transparent;
    box-sizing: border-box;
}
.nm-chip--tier.is-common {
    color: var(--text-muted);
}
.nm-chip--tier.is-elite {
    color: var(--text-gold, var(--accent-gold));
    border-color: color-mix(in srgb, var(--accent-gold, var(--accent-gold)) 40%, transparent);
    background: color-mix(in srgb, var(--accent-gold, var(--accent-gold)) 9%, transparent);
}
.nm-chip--tier.is-boss {
    color: var(--text-red, var(--accent-crimson, var(--accent-crimson)));
    border-color: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 40%, transparent);
    background: color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 9%, transparent);
}
.nm-chip--arch {
    color: var(--text-secondary);
}
.nm-chip--root {
    color: var(--nm-root, var(--text-secondary));
    border-color: color-mix(in srgb, var(--nm-root, var(--border-color)) 42%, transparent);
    background: color-mix(in srgb, var(--nm-root, transparent) 10%, transparent);
}
@supports not (color: color-mix(in srgb, #000 50%, #fff)) {
    .nm-chip--tier.is-elite {
        border-color: rgba(183, 120, 31, 0.35);
        background: rgba(183, 120, 31, 0.08);
    }
    .nm-chip--tier.is-boss {
        border-color: rgba(183, 58, 49, 0.35);
        background: rgba(183, 58, 49, 0.08);
    }
    .nm-chip--root {
        border-color: var(--border-color);
        background: transparent;
    }
}
.nm-tr__meta {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.4;
    margin-top: var(--space-2);
}
/* 仇敌快照三维：相对自身染色，便于复仇前量力 */
.nm-tr__stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4) var(--space-6);
    margin-top: var(--space-6);
}
.nm-tr__stats.is-muted {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.nm-st {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-pill);
    border: 1px solid rgba(42, 42, 38, 0.1);
    background: rgba(42, 42, 38, 0.03);
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
    line-height: 1.45;
}
.nm-st em {
    font-style: normal;
    font-weight: 500;
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-right: var(--space-2);
}
.nm-st i {
    font-style: normal;
    font-weight: 500;
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-left: var(--space-2);
}
.nm-st.is-danger {
    color: var(--text-red, var(--accent-crimson));
    border-color: rgba(183, 58, 49, 0.28);
    background: rgba(183, 58, 49, 0.07);
}
.nm-st.is-warn {
    color: var(--accent-orange, #c8781f);
    border-color: rgba(200, 120, 31, 0.3);
    background: rgba(200, 120, 31, 0.08);
}
.nm-st.is-safe {
    color: var(--text-jade, #2a8f6a);
    border-color: rgba(42, 143, 106, 0.28);
    background: rgba(42, 143, 106, 0.07);
}
.nm-st--power {
    font-weight: 700;
}
.nm-st--affix {
    color: var(--text-gold, var(--accent-gold));
    border-color: rgba(183, 120, 31, 0.3);
    background: rgba(183, 120, 31, 0.08);
}
html.theme-dark .nm-st {
    border-color: rgba(172, 186, 196, 0.12);
    background: rgba(172, 186, 196, 0.05);
}
.nm-banner__sub {
    display: inline-block;
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
    font-weight: 400;
}
/* #6279：一键清空 */
.nm-banner__acts {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
    margin-top: var(--space-8);
}
.nm-banner__acts .nm-clear-all {
    height: 30px;
    padding: 0 var(--space-12);
    color: var(--text-red, var(--accent-crimson));
    border-color: color-mix(in srgb, var(--text-red, var(--accent-crimson)) 35%, var(--border-color));
}
.nm-tr__go {
    height: 30px;
    padding: 0 var(--space-12);
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-red, var(--accent-crimson));
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid rgba(183, 58, 49, 0.32);
    background: rgba(183, 58, 49, 0.07);
    cursor: pointer;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.12s ease, background 0.12s ease;
    white-space: nowrap;
    flex-shrink: 0;
}
html.theme-dark .nm-tr__go {
    border-color: rgba(197, 124, 114, 0.36);
    background: rgba(197, 124, 114, 0.08);
}
.nm-tr__go:hover {
    border-color: rgba(183, 58, 49, 0.48);
    background: rgba(183, 58, 49, 0.12);
}
/* 操作组：再战 + 移除 纵向堆叠在右侧 */
.nm-tr__acts {
    grid-column: 2;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-6);
}
/* 移除：低调灰边，避免误触；hover 提示可点 */
.nm-tr__del {
    height: 26px;
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    font-weight: 500;
    letter-spacing: 0.4px;
    color: var(--text-muted);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.12s ease, color 0.12s ease, background 0.12s ease;
    white-space: nowrap;
}
.nm-tr__del:hover {
    color: var(--text-secondary);
    border-color: color-mix(in srgb, var(--text-muted) 50%, transparent);
    background: color-mix(in srgb, var(--text-muted) 8%, transparent);
}

/* 空态 */
.nm-empty {
    padding: var(--space-16) var(--space-14);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    text-align: center;
}
.nm-empty__title {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-body-lg);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--space-8);
}
.nm-empty__body {
    font-size: var(--font-label);
    line-height: 1.65;
    color: var(--text-muted);
    text-wrap: wrap;
}
.nm-empty__body b {
    color: var(--text-gold);
    font-weight: 600;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}

.nm-note {
    margin: var(--space-6) var(--space-2) var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}
.nm-note b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ═══ 天道仙缘 · xy-dialog（造化柜 B · 三 Tab · 无副标题）═══ */
/* 外壳宽度走 game-dialog.css 业务档位登记：桌面 wide 720 宽弹窗、手机回收 392，
   业务层不再覆写 width/max-width（几何锁管辖） */
.xy-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.xy-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.xy-dialog,
.modal-content.modal--decorated.gc-dialog.xy-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 740px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
/* 标题 / 余额+Tab 固定不滚 */
.gc-dialog.xy-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.xy-dialog .xy-top {
    flex-shrink: 0;
    padding: var(--space-10) var(--space-12) 0;
}
.gc-dialog.xy-dialog .xy-top .xy-hero {
    margin-bottom: var(--space-10);
}
.gc-dialog.xy-dialog .xy-top .xy-tabs {
    margin-bottom: 0;
}
/* 仅 Tab 下方内容滚动 */
.gc-dialog.xy-dialog > .gc-mid.xy-mid,
.gc-dialog.xy-dialog > .xy-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.xy-dialog > .gc-mid.xy-mid::-webkit-scrollbar,
.gc-dialog.xy-dialog > .xy-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.xy-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.xy-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.xy-dialog .gc-foot,
.gc-dialog.xy-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 设计稿 B：紧凑余额条，仅数字 + 点 */
.xy-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.28);
    background: rgba(183, 120, 31, 0.06);
    text-align: center;
}
.xy-hero--compact {
    padding: var(--space-10);
}
html.theme-dark .xy-hero {
    border-color: rgba(203, 168, 102, 0.28);
    background: rgba(203, 168, 102, 0.07);
}
.xy-hero__num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}
.xy-hero__unit {
    font-size: var(--font-body);
    color: var(--text-secondary);
    margin-left: var(--space-4);
    font-weight: 600;
}

.xy-tabs {
    display: flex;
    gap: var(--space-4);
    margin-bottom: var(--space-10);
    padding: var(--space-4);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.xy-tab {
    flex: 1;
    height: 30px;
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-muted);
    font-size: var(--font-caption);
    font-family: inherit;
    cursor: pointer;
    font-weight: 600;
    letter-spacing: 0.5px;
    -webkit-appearance: none;
    appearance: none;
}
.xy-tab.is-on {
    background: rgba(183, 120, 31, 0.14);
    color: var(--text-gold);
}
html.theme-dark .xy-tab.is-on {
    background: rgba(203, 168, 102, 0.16);
}

.xy-pane { display: none; }
.xy-pane.is-on { display: block; }

.xy-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.xy-sec__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.xy-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.xy-sec__side {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.xy-sec__side.is-on {
    color: var(--text-jade);
    font-weight: 600;
}
.xy-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    padding: 0 var(--space-8) var(--space-8);
}
.xy-chip {
    display: inline-flex;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-micro);
    color: var(--text-secondary);
    line-height: 1.35;
}
.xy-chip b {
    color: var(--text-gold);
    font-weight: 700;
    margin-left: var(--space-2);
}

.xy-acts {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: 0 0 var(--space-4);
}
.xy-pane[data-xy-pane="spend"] .xy-acts,
.xy-pane[data-xy-pane="card"] .xy-acts {
    padding: 0 var(--space-2) var(--space-6);
}
.xy-act {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    width: 100%;
    min-height: 40px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    color: var(--text-primary);
    font-family: inherit;
    font-size: var(--font-label);
    text-align: left;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    transition: border-color 0.12s ease, opacity 0.12s ease;
}
.xy-act:hover { border-color: var(--border-gold); }
.xy-act__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}
.xy-act__name {
    font-weight: 600;
    font-size: var(--font-label);
}
.xy-act__hint {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.35;
}
.xy-act__cost {
    flex-shrink: 0;
    font-size: var(--font-micro);
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}
.xy-act--jade {
    border-color: rgba(22, 128, 106, 0.36);
    background: rgba(22, 128, 106, 0.07);
}
html.theme-dark .xy-act--jade {
    border-color: rgba(127, 161, 141, 0.36);
    background: rgba(127, 161, 141, 0.08);
}
.xy-act--jade .xy-act__name { color: var(--text-jade); }
.xy-act--gold {
    border-color: rgba(183, 120, 31, 0.40);
    background: rgba(183, 120, 31, 0.08);
}
html.theme-dark .xy-act--gold {
    border-color: rgba(203, 168, 102, 0.40);
    background: rgba(203, 168, 102, 0.10);
}
.xy-act--gold .xy-act__name { color: var(--text-gold); }
.xy-act--orange {
    border-color: rgba(196, 122, 44, 0.36);
    background: rgba(196, 122, 44, 0.07);
}
html.theme-dark .xy-act--orange {
    border-color: rgba(201, 160, 106, 0.36);
    background: rgba(201, 160, 106, 0.08);
}
.xy-act--orange .xy-act__name { color: var(--accent-orange, #c47a2c); }
.xy-act--purple {
    border-color: rgba(123, 94, 167, 0.36);
    background: rgba(123, 94, 167, 0.07);
}
html.theme-dark .xy-act--purple {
    border-color: rgba(168, 139, 200, 0.36);
    background: rgba(168, 139, 200, 0.08);
}
.xy-act--purple .xy-act__name { color: var(--text-purple, var(--accent-purple, #7b5ea7)); }
.xy-act--cyan {
    border-color: rgba(42, 122, 124, 0.36);
    background: rgba(42, 122, 124, 0.07);
}
html.theme-dark .xy-act--cyan {
    border-color: rgba(130, 169, 170, 0.36);
    background: rgba(130, 169, 170, 0.08);
}
.xy-act--cyan .xy-act__name { color: var(--accent-cyan, #2a7a7c); }
.xy-act.is-disabled,
.xy-act:disabled {
    opacity: 0.52;
    cursor: not-allowed;
    pointer-events: none;
}

/* 获取 Tab 内「查看记录」入口 */
.xy-history { margin-top: var(--space-4); }
.xy-history__msg {
    text-align: center;
    color: var(--text-muted);
    padding: var(--space-16) var(--space-8);
    font-size: var(--font-label);
}

/* ═══ 仙缘记录 · 筛账 B（独立叠层弹窗）═══ */
.xh-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.xh-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.xh-dialog,
.modal-content.modal--decorated.gc-dialog.xh-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 640px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.xh-dialog {
    max-width: 392px;
}
/* 汇总 + 筛选 Tab 固定 */
.gc-dialog.xh-dialog .xh-top {
    flex-shrink: 0;
    padding: var(--space-10) var(--space-12) 0;
}
.gc-dialog.xh-dialog .xh-top .xh-sum {
    margin-bottom: var(--space-10);
}
.gc-dialog.xh-dialog .xh-top .xh-filters {
    margin-bottom: 0;
}
/* 仅列表滚动 */
.gc-dialog.xh-dialog > .gc-mid.xh-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
}
.gc-dialog.xh-dialog .gc-foot,
.gc-dialog.xh-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.gc-dialog.xh-dialog .gc-foot > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.xh-sum {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-6);
    margin-bottom: var(--space-10);
}
.xh-sum__cell {
    padding: var(--space-8) var(--space-6);
    text-align: center;
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.xh-sum__lab {
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 0.5px;
    margin-bottom: var(--space-4);
}
.xh-sum__val {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body-lg);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-gold);
}
.xh-sum__val.is-earn { color: var(--text-jade); }
.xh-sum__val.is-spend { color: var(--text-red, var(--accent-crimson)); }

.xh-filters {
    display: flex;
    gap: var(--space-4);
    margin-bottom: var(--space-10);
    padding: var(--space-4);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.xh-filter {
    flex: 1;
    height: 28px;
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-muted);
    font-size: var(--font-caption);
    font-family: inherit;
    cursor: pointer;
    font-weight: 600;
    -webkit-appearance: none;
    appearance: none;
}
.xh-filter.is-on {
    background: rgba(183, 120, 31, 0.14);
    color: var(--text-gold);
}
html.theme-dark .xh-filter.is-on {
    background: rgba(203, 168, 102, 0.16);
}

.xh-list {
    display: flex;
    flex-direction: column;
    min-height: 80px;
}
.xh-row {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: var(--space-8);
    align-items: center;
    padding: var(--space-8) var(--space-2);
    border-bottom: 1px solid rgba(42, 42, 38, 0.06);
}
html.theme-dark .xh-row {
    border-bottom-color: rgba(172, 186, 196, 0.08);
}
.xh-row:last-child { border-bottom: none; }
.xh-dot {
    width: 44px;
    height: 28px;
    border-radius: var(--radius-pill);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.5px;
    border: 1px solid var(--border-color);
    box-sizing: border-box;
}
.xh-dot.is-earn {
    color: var(--text-jade);
    border-color: rgba(22, 128, 106, 0.36);
    background: rgba(22, 128, 106, 0.09);
}
html.theme-dark .xh-dot.is-earn {
    border-color: rgba(127, 161, 141, 0.36);
    background: rgba(127, 161, 141, 0.10);
}
.xh-dot.is-spend {
    color: var(--text-red, var(--accent-crimson));
    border-color: rgba(183, 58, 49, 0.30);
    background: rgba(183, 58, 49, 0.08);
}
html.theme-dark .xh-dot.is-spend {
    border-color: rgba(197, 124, 114, 0.32);
    background: rgba(197, 124, 114, 0.10);
}
.xh-row__main { min-width: 0; }
.xh-row__name {
    font-size: var(--font-label);
    font-weight: 600;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.xh-row__time {
    margin-top: var(--space-2);
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.xh-row__pts {
    flex-shrink: 0;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.xh-row__pts.is-earn { color: var(--text-jade); }
.xh-row__pts.is-spend { color: var(--text-red, var(--accent-crimson)); }
.xh-note {
    margin: var(--space-8) var(--space-2) var(--space-4);
    font-size: var(--font-micro);
    line-height: 1.5;
    color: var(--text-muted);
    text-wrap: wrap;
}

/* ═══ 道号详情 · 顶 C 英雄 + 下 A 尊号双列 ═══ */
.gc-dialog.dt-dialog {
    max-width: 392px;
}
.dt-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.dt-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.dt-dialog,
.modal-content.modal--decorated.gc-dialog.dt-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 680px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.dt-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.dt-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.dt-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.dt-dialog .gc-mid.dt-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
}
.gc-dialog.dt-dialog .gc-mid.dt-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.dt-dialog .gc-foot,
.gc-dialog.dt-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.gc-dialog.dt-dialog .gc-foot > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.dt-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-14) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.32);
    background: rgba(183, 120, 31, 0.08);
    text-align: center;
}
html.theme-dark .dt-hero {
    border-color: rgba(203, 168, 102, 0.32);
    background: rgba(203, 168, 102, 0.09);
}
.dt-hero--form {
    padding: var(--space-12);
}
.dt-hero__label {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
    margin-bottom: var(--space-8);
}
.dt-hero__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-hero);
    font-weight: 700;
    letter-spacing: 4px;
    color: var(--text-gold);
    line-height: 1.2;
}
.dt-hero__sub {
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}

.dt-input-wrap {
    margin-top: var(--space-4);
}
.dt-input {
    width: 100%;
    height: 48px;
    padding: 0 var(--space-12);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-gold);
    background: var(--bg-card);
    color: var(--text-primary);
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-page-title);
    letter-spacing: 12px;
    text-align: center;
    font-weight: 600;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}
.dt-input::placeholder {
    letter-spacing: 4px;
    font-size: var(--font-body-lg);
    color: var(--text-muted);
    font-weight: 400;
}
.dt-preview {
    margin-top: var(--space-10);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
}
.dt-preview strong {
    display: inline-block;
    margin-left: var(--space-4);
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-title);
    letter-spacing: 2px;
    color: var(--text-gold);
    font-weight: 700;
}

/* 道号对外展示：三选一 */
.dt-mode {
    margin-top: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    background: var(--bg-panel, var(--bg-card));
}
.dt-mode__lab {
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    margin-bottom: var(--space-8);
}
.dt-mode__chips {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}
.dt-mode-chip {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
    width: 100%;
    margin: 0;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    color: var(--text-secondary);
    font: inherit;
    text-align: left;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color .12s, background .12s, color .12s;
}
.dt-mode-chip.is-on {
    border-color: color-mix(in srgb, var(--accent-gold) 45%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 10%, var(--bg-card));
    color: var(--text-primary);
}
.dt-mode-chip__t {
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 0.04em;
}
.dt-mode-chip__d {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
}
.dt-mode-chip.is-on .dt-mode-chip__d {
    color: var(--text-secondary);
}

.dt-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.dt-sec__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.dt-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.dt-sec__side {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.dt-sec__side.is-on {
    color: var(--text-jade);
    font-weight: 600;
}
.dt-sec__body {
    padding: 0 var(--space-10) var(--space-10);
}

.dt-ladder {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
}
.dt-ladder__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-8) var(--space-8);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-caption);
}
.dt-ladder__item.is-on {
    border-color: rgba(183, 120, 31, 0.45);
    background: rgba(183, 120, 31, 0.10);
}
html.theme-dark .dt-ladder__item.is-on {
    border-color: rgba(203, 168, 102, 0.45);
    background: rgba(203, 168, 102, 0.12);
}
.dt-ladder__realm {
    color: var(--text-secondary);
    min-width: 0;
}
.dt-ladder__item.is-on .dt-ladder__realm {
    color: var(--text-primary);
    font-weight: 600;
}
.dt-ladder__suf {
    color: var(--text-gold);
    font-weight: 700;
    white-space: nowrap;
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    letter-spacing: 0.5px;
}
.dt-ladder__cur {
    font-size: var(--font-micro);
    color: var(--text-gold);
    font-weight: 700;
    margin-left: var(--space-4);
}

.dt-note {
    margin: var(--space-4) var(--space-2) var(--space-8);
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.5;
}
.dt-empty {
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
    padding: var(--space-12) var(--space-8);
}

/* ═══ 凶煞 · 刻度册 C（四段刻度 + 台账）═══ */
.gc-dialog.inf-dialog {
    max-width: 392px;
}
.inf-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.inf-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.inf-dialog,
.modal-content.modal--decorated.gc-dialog.inf-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 640px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.inf-dialog[data-tone="danger"] {
    border-color: rgba(183, 58, 49, 0.42);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="danger"] {
    border-color: rgba(197, 124, 114, 0.42);
}
.gc-dialog.inf-dialog[data-tone="warn"] {
    border-color: rgba(196, 122, 44, 0.42);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="warn"] {
    border-color: rgba(201, 160, 106, 0.42);
}
.gc-dialog.inf-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.inf-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.inf-dialog[data-tone="danger"] .gc-rule {
    background: var(--accent-crimson, var(--accent-crimson));
}
.gc-dialog.inf-dialog[data-tone="warn"] .gc-rule {
    background: var(--accent-orange, #c47a2c);
}
.gc-dialog.inf-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.inf-dialog .gc-mid.inf-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
}
.gc-dialog.inf-dialog .gc-mid.inf-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.inf-dialog .gc-foot,
.gc-dialog.inf-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.gc-dialog.inf-dialog .gc-foot > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.inf-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.gc-dialog.inf-dialog[data-tone="danger"] .inf-hero {
    border-color: rgba(183, 58, 49, 0.32);
    background: rgba(183, 58, 49, 0.07);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="danger"] .inf-hero {
    border-color: rgba(197, 124, 114, 0.32);
    background: rgba(197, 124, 114, 0.08);
}
.gc-dialog.inf-dialog[data-tone="warn"] .inf-hero {
    border-color: rgba(196, 122, 44, 0.32);
    background: rgba(196, 122, 44, 0.07);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="warn"] .inf-hero {
    border-color: rgba(201, 160, 106, 0.32);
    background: rgba(201, 160, 106, 0.08);
}
.inf-hero__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-8);
}
.inf-hero__label {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
}
.inf-hero__val {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    line-height: 1;
}
.inf-hero__num {
    font-size: var(--font-hero);
    color: var(--text-gold);
}
.gc-dialog.inf-dialog[data-tone="danger"] .inf-hero__num {
    color: var(--text-red, var(--accent-crimson));
}
.gc-dialog.inf-dialog[data-tone="warn"] .inf-hero__num {
    color: var(--accent-orange, #c47a2c);
}
.inf-hero__sep {
    font-size: var(--font-title);
    color: var(--text-muted);
    margin: 0 var(--space-4);
}
.inf-hero__max {
    font-size: var(--font-heading);
    color: var(--text-muted);
}

.inf-segments {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
    margin: var(--space-10) 0 var(--space-4);
}
.inf-seg {
    height: 10px;
    border-radius: var(--radius-xs);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-sizing: border-box;
}
.inf-seg.is-fill {
    background: rgba(183, 120, 31, 0.45);
    border-color: rgba(183, 120, 31, 0.40);
}
html.theme-dark .inf-seg.is-fill {
    background: rgba(203, 168, 102, 0.42);
    border-color: rgba(203, 168, 102, 0.38);
}
.gc-dialog.inf-dialog[data-tone="danger"] .inf-seg.is-fill {
    background: rgba(183, 58, 49, 0.48);
    border-color: rgba(183, 58, 49, 0.40);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="danger"] .inf-seg.is-fill {
    background: rgba(197, 124, 114, 0.45);
    border-color: rgba(197, 124, 114, 0.38);
}
.gc-dialog.inf-dialog[data-tone="warn"] .inf-seg.is-fill {
    background: rgba(196, 122, 44, 0.48);
    border-color: rgba(196, 122, 44, 0.40);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="warn"] .inf-seg.is-fill {
    background: rgba(201, 160, 106, 0.45);
    border-color: rgba(201, 160, 106, 0.38);
}
.inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(183, 120, 31, 0.45) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(183, 120, 31, 0.40);
}
html.theme-dark .inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(203, 168, 102, 0.42) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(203, 168, 102, 0.38);
}
.gc-dialog.inf-dialog[data-tone="danger"] .inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(183, 58, 49, 0.48) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(183, 58, 49, 0.40);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="danger"] .inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(197, 124, 114, 0.45) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(197, 124, 114, 0.38);
}
.gc-dialog.inf-dialog[data-tone="warn"] .inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(196, 122, 44, 0.48) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(196, 122, 44, 0.40);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="warn"] .inf-seg.is-partial {
    background: linear-gradient(
        90deg,
        rgba(201, 160, 106, 0.45) var(--inf-p, 50%),
        transparent var(--inf-p, 50%)
    );
    border-color: rgba(201, 160, 106, 0.38);
}

.inf-marks {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-micro);
    color: var(--text-muted);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    margin-bottom: var(--space-2);
}
.inf-stamp {
    display: inline-flex;
    margin-top: var(--space-8);
    padding: var(--space-4) var(--space-10);
    border-radius: var(--radius-pill);
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 1px;
    border: 1px solid var(--border-color);
    color: var(--text-gold);
    background: var(--bg-card);
}
.gc-dialog.inf-dialog[data-tone="danger"] .inf-stamp {
    color: var(--text-red, var(--accent-crimson));
    border-color: rgba(183, 58, 49, 0.40);
    background: rgba(183, 58, 49, 0.10);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="danger"] .inf-stamp {
    border-color: rgba(197, 124, 114, 0.40);
    background: rgba(197, 124, 114, 0.12);
}
.gc-dialog.inf-dialog[data-tone="warn"] .inf-stamp {
    color: var(--accent-orange, #c47a2c);
    border-color: rgba(196, 122, 44, 0.40);
    background: rgba(196, 122, 44, 0.10);
}
html.theme-dark .gc-dialog.inf-dialog[data-tone="warn"] .inf-stamp {
    border-color: rgba(201, 160, 106, 0.40);
    background: rgba(201, 160, 106, 0.12);
}

.inf-sec {
    margin-bottom: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.inf-sec__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10) var(--space-6);
}
.inf-sec__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
    color: var(--text-primary);
}
.inf-sec__side {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.inf-sec__side.is-danger {
    color: var(--text-red, var(--accent-crimson));
    font-weight: 600;
}
.inf-sec__body {
    padding: 0 var(--space-10) var(--space-10);
}

.inf-effects {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
.inf-effect {
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
}
.inf-effect b {
    color: var(--text-primary);
    font-weight: 600;
}
.inf-effect.is-on {
    border-color: rgba(183, 58, 49, 0.36);
    background: rgba(183, 58, 49, 0.08);
}
html.theme-dark .inf-effect.is-on {
    border-color: rgba(197, 124, 114, 0.36);
    background: rgba(197, 124, 114, 0.10);
}
.inf-effect.is-on b {
    color: var(--text-red, var(--accent-crimson));
}
.inf-effect.is-off {
    opacity: 0.78;
}
.inf-down {
    color: var(--text-jade);
    font-weight: 700;
}

.inf-ledger {
    display: flex;
    flex-direction: column;
}
.inf-ledger__row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-8);
    align-items: center;
    padding: var(--space-8) var(--space-2);
    border-bottom: 1px solid rgba(42, 42, 38, 0.06);
    font-size: var(--font-caption);
}
html.theme-dark .inf-ledger__row {
    border-bottom-color: rgba(172, 186, 196, 0.08);
}
.inf-ledger__row:last-child {
    border-bottom: none;
}
.inf-ledger__k {
    color: var(--text-secondary);
}
.inf-ledger__v {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.inf-ledger__v.is-up {
    color: var(--text-red, var(--accent-crimson));
}
.inf-ledger__v.is-down {
    color: var(--text-jade);
}

/* ═══ 本源裂损 · 紧凑行 C ═══ */
.gc-dialog.od-dialog {
    max-width: 392px;
}
.od-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.od-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.od-dialog,
.modal-content.modal--decorated.gc-dialog.od-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 700px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.od-dialog[data-tone="danger"] {
    border-color: rgba(183, 58, 49, 0.42);
}
html.theme-dark .gc-dialog.od-dialog[data-tone="danger"] {
    border-color: rgba(197, 124, 114, 0.42);
}
.gc-dialog.od-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.od-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.od-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.od-dialog .gc-mid.od-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
}
.gc-dialog.od-dialog .gc-mid.od-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.od-dialog .gc-foot,
.gc-dialog.od-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.gc-dialog.od-dialog .gc-foot > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.od-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
    margin-bottom: var(--space-8);
    padding: var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 58, 49, 0.32);
    background: rgba(183, 58, 49, 0.07);
    text-align: left;
}
html.theme-dark .od-hero {
    border-color: rgba(197, 124, 114, 0.32);
    background: rgba(197, 124, 114, 0.08);
}
.od-hero__label {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.od-hero__num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero);
    font-weight: 700;
    color: var(--text-red, var(--accent-crimson));
    font-variant-numeric: tabular-nums;
    line-height: 1;
}
.od-hero__unit {
    font-size: var(--font-body);
    color: var(--text-muted);
    margin-left: var(--space-4);
    font-weight: 600;
}
.od-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: flex-end;
}
.od-chip {
    display: inline-flex;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-size: var(--font-micro);
    color: var(--text-secondary);
    line-height: 1.35;
}
.od-chip b {
    color: var(--text-red, var(--accent-crimson));
    font-weight: 700;
    margin-left: var(--space-2);
}

.od-note {
    margin: 0 var(--space-2) var(--space-8);
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.5;
}

.od-row {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-bottom: var(--space-8);
    padding: var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.od-row__top {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-8);
    align-items: baseline;
}
.od-row__name {
    font-weight: 600;
    font-size: var(--font-body);
    color: var(--text-primary);
}
.od-row__pen {
    font-size: var(--font-caption);
    color: var(--text-red, var(--accent-crimson));
    font-weight: 700;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    white-space: nowrap;
}
.od-row__mid {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.45;
    word-break: break-word;
}
.od-row__mid b.is-ok { color: var(--text-jade); font-weight: 700; }
.od-row__mid b.is-bad { color: var(--text-red, var(--accent-crimson)); font-weight: 700; }
.od-row__bot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}
.od-row__bot .modal-btn {
    flex: 0 0 auto;
    min-width: 88px;
    height: 32px;
    padding: 0 var(--space-10);
}
.od-row__bot .modal-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.od-layers {
    display: flex;
    gap: var(--space-4);
    flex: 1 1 auto;
    min-width: 0;
    max-width: 140px;
}
.od-layer {
    flex: 1;
    height: 6px;
    border-radius: var(--radius-xs);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-sizing: border-box;
}
.od-layer.is-on {
    background: rgba(183, 58, 49, 0.48);
    border-color: rgba(183, 58, 49, 0.40);
}
html.theme-dark .od-layer.is-on {
    background: rgba(197, 124, 114, 0.45);
    border-color: rgba(197, 124, 114, 0.38);
}

.od-mats {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: 0 0 var(--space-8);
}
.od-mat {
    display: flex;
    justify-content: space-between;
    gap: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.od-mat b {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
}
.od-mat b.is-ok { color: var(--text-jade); }
.od-mat b.is-bad { color: var(--text-red, var(--accent-crimson)); }

.od-major {
    margin-bottom: var(--space-8);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(196, 122, 44, 0.40);
    background: rgba(196, 122, 44, 0.07);
    overflow: hidden;
}
html.theme-dark .od-major {
    border-color: rgba(201, 160, 106, 0.40);
    background: rgba(201, 160, 106, 0.08);
}
.od-major__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-10) var(--space-4);
}
.od-major__name {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-body);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-gold);
}
.od-major__side {
    font-size: var(--font-micro);
    color: var(--accent-orange, #c47a2c);
    font-weight: 600;
}
.od-major__desc {
    padding: 0 var(--space-10) var(--space-6);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}
.od-major .od-mats {
    padding: 0 var(--space-10) var(--space-8);
}
.od-major__act {
    padding: 0 var(--space-10) var(--space-10);
}
.od-major__act .modal-btn {
    width: 100%;
    height: 34px;
}
.od-major__act .modal-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ═══ 攻击/防御感知 · 分栏 C（无 hero 副文案）═══ */
.gc-dialog.sb-dialog {
    max-width: 392px;
}
.sb-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.sb-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.sb-dialog,
.modal-content.modal--decorated.gc-dialog.sb-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 640px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.sb-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.sb-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.sb-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.sb-dialog .gc-mid.sb-mid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
}
.gc-dialog.sb-dialog .gc-mid.sb-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.sb-dialog .gc-foot,
.gc-dialog.sb-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}
.gc-dialog.sb-dialog .gc-foot > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.sb-hero {
    margin-bottom: var(--space-10);
    padding: var(--space-14) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid rgba(183, 120, 31, 0.32);
    background: rgba(183, 120, 31, 0.08);
    text-align: center;
}
html.theme-dark .sb-hero {
    border-color: rgba(203, 168, 102, 0.32);
    background: rgba(203, 168, 102, 0.09);
}
.sb-hero__label {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
    margin-bottom: var(--space-6);
}
.sb-hero__num {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.sb-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
}
.sb-col {
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    padding: var(--space-8);
    min-width: 0;
}
.sb-col__t {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
    margin-bottom: var(--space-6);
    font-weight: 600;
}
.sb-list {
    display: flex;
    flex-direction: column;
}
.sb-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-6);
    align-items: baseline;
    padding: var(--space-6) 0;
    border-bottom: 1px solid rgba(42, 42, 38, 0.06);
    font-size: var(--font-caption);
}
html.theme-dark .sb-row {
    border-bottom-color: rgba(172, 186, 196, 0.08);
}
.sb-row:last-child {
    border-bottom: none;
}
.sb-row__k {
    color: var(--text-secondary);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sb-row.is-base .sb-row__k {
    color: var(--text-primary);
    font-weight: 600;
}
.sb-row__v {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    white-space: nowrap;
}
.sb-row__v.is-plus { color: var(--text-jade); }
.sb-row__v.is-minus { color: var(--text-red, var(--accent-crimson)); }
.sb-row__v.is-base { color: var(--text-primary); }

.sb-formula {
    margin-top: var(--space-8);
    padding: var(--space-10);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.sb-formula__t {
    margin-bottom: var(--space-8);
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-muted);
}
.sb-formula__eq {
    font-size: var(--font-caption);
    font-weight: 600;
    line-height: 1.55;
    color: var(--text-primary);
}
.sb-formula__text,
.sb-formula__note {
    margin-top: var(--space-6);
    font-size: var(--font-micro);
    line-height: 1.55;
    color: var(--text-secondary);
    text-wrap: wrap;
}
.sb-formula__note {
    margin-top: var(--space-4);
    color: var(--text-muted);
}

/* 获取 Tab · 折叠块（对齐 prototype foldsHtml） */
.xy-fold {
    margin-bottom: var(--space-8);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    overflow: hidden;
}
.xy-fold__sum {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: var(--space-10) var(--space-10);
    border: 0;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
    color: var(--text-primary);
    text-align: left;
    -webkit-appearance: none;
    appearance: none;
}
.xy-fold__sum span {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-label);
    letter-spacing: 1.5px;
    font-weight: 600;
}
.xy-fold__sum i {
    font-style: normal;
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 0;
    font-family: inherit;
}
.xy-fold__body {
    display: none;
    padding: 0 var(--space-10) var(--space-10);
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
}
.xy-fold.is-open .xy-fold__body {
    display: block;
}
.xy-fold__row {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: var(--space-8);
    padding: var(--space-6) 0;
    border-top: 1px solid rgba(42, 42, 38, 0.06);
}
html.theme-dark .xy-fold__row {
    border-top-color: rgba(172, 186, 196, 0.08);
}
.xy-fold__row:first-child {
    border-top: none;
    padding-top: 0;
}
.xy-fold__k {
    font-weight: 700;
    color: var(--text-gold);
    font-size: var(--font-caption);
}
.xy-fold__v {
    color: var(--text-secondary);
    text-wrap: wrap;
}

/* 脚双钮：下载 + 关闭 等宽 */
.gc-dialog.xy-dialog .gc-foot > .modal-btn,
.gc-dialog.xy-dialog .gc-foot > a.modal-btn {
    flex: 1 1 0;
    min-width: 0;
    text-decoration: none;
}

/* 通用 modal-btn / gc-dialog 壳 → 见 game-dialog.css */

/* 洗炼结果确认：同壳多操作脚 */
/* 外壳宽度由 game-dialog.css compact 档（392）几何锁统一裁定 */
.wash-confirm-dialog {
    max-height: min(90dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 24px));
}
.wash-confirm-mid {
    text-align: left;
    max-height: none;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.wash-confirm-actions {
    flex-direction: column;
    align-items: stretch;
    flex-shrink: 0;
    gap: 0;
    padding-bottom: max(var(--space-12), env(safe-area-inset-bottom, 0px));
}
.wash-confirm-actions .wc-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
/* #9718 按钮恒在但置灰：给 disabled 补可见反馈（modal-btn 作者样式会盖掉浏览器默认灰化） */
.wash-confirm-actions .wc-actions .modal-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}
.wash-keep-hint {
    margin-top: var(--space-12) !important;
    padding: var(--space-8) var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    border-radius: var(--radius-md);
    text-align: left;
    color: var(--text-secondary);
    font-size: var(--font-caption);
    line-height: 1.55;
}

/* 传功上架确认（gc 壳 + 定价） */
.transmit-confirm-overlay .gc-dialog {
    max-width: 400px;
}

.btn-ink-soft {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    padding: 0 var(--space-14);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-card) 54%, transparent);
    color: var(--text-secondary);
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    font-size: var(--font-body);
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.16s ease, color 0.16s ease, background 0.16s ease, transform 0.16s ease;
}

.btn-ink-soft:hover,
.btn-ink-soft:focus-visible {
    border-color: var(--border-gold);
    background: color-mix(in srgb, var(--accent-gold) 9%, var(--bg-card));
    color: var(--text-primary);
    outline: none;
    transform: translateY(-1px);
}

/* 弹窗操作按钮列表 */
.modal-action-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
.modal-action-btn {
    width: 100%;
    padding: var(--space-12) var(--space-14);
    font-size: var(--font-body);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    font-family: inherit;
    background: transparent;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: all 0.2s;
}
.modal-action-btn:hover { border-color: var(--border-gold); color: var(--text-primary); }
.modal-action-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.modal-action-btn--gold { border-color: var(--border-gold); color: var(--text-gold); background: color-mix(in srgb, var(--craft-gold) 9%, transparent); }
.modal-action-btn--jade { border-color: var(--border-jade); color: var(--accent-jade); background: var(--bg-glass-jade); }
.modal-action-btn--cyan { border-color: color-mix(in srgb, var(--beihuang-blue) 34%, transparent); color: var(--accent-cyan); background: color-mix(in srgb, var(--beihuang-blue) 8%, transparent); }
.modal-action-btn--orange { border-color: var(--border-orange); color: var(--accent-orange); background: var(--bg-orange-glass); }
.modal-action-btn--purple { border-color: color-mix(in srgb, var(--ghost-purple) 30%, transparent); color: var(--text-purple, var(--ghost-purple-deep)); background: color-mix(in srgb, var(--ghost-purple) 10%, transparent); }
.modal-action-btn--danger { border-color: color-mix(in srgb, var(--jimo-crimson) 36%, transparent); color: var(--text-danger); background: color-mix(in srgb, var(--jimo-crimson) 8%, transparent); }
.modal-content .modal-title {
    margin: 0;
    color: var(--text-gold);
    text-align: center;
    font-size: var(--font-heading);
    line-height: 1.35;
}

/* ===== 云游商人 · gc-dialog.mc-dialog（2026-07-19） =====
   壳 14 / 内卡 10 / 钮 8 · 无左轨 · 商品卡片 + 扁平 modal-btn */
body.game-page .modal-content.modal--decorated.gc-dialog.mc-dialog,
.modal-content.modal--decorated.gc-dialog.mc-dialog,
.gc-dialog.mc-dialog {
    max-width: min(400px, 94vw);
    width: 94%;
    padding: 0;
    border-radius: var(--gc-radius, var(--radius-lg));
    /* #6263：弹层在视口内封顶，中区才能成为真正滚动容器 */
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(var(--pattern-dialog-max-height, 92dvh), calc(100dvh - 40px));
    overflow: hidden;
}
body.game-page .gc-dialog.mc-dialog > .gc-head.mc-head,
.gc-dialog.mc-dialog > .gc-head.mc-head,
.mc-head {
    position: relative;
    padding: var(--space-20) var(--space-48) 0 var(--space-20);
    text-align: left;
    flex-shrink: 0;
}
.mc-head .gc-title {
    color: var(--text-gold, var(--accent-gold));
}
.mc-head .modal-header-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
}
body.game-page .gc-dialog.mc-dialog > .gc-mid.mc-mid,
.gc-dialog.mc-dialog > .gc-mid.mc-mid,
.mc-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    flex: 1 1 auto;
    /* #6263：壳层 max-height 约束高度；中区 min-height:0 + overflow 才滚得动。
       勿再叠 max-height:62vh，旧 iOS 上 flex 子项双顶高会导致“划不动”。 */
    min-height: 0;
    max-height: none;
    padding: var(--space-12) var(--space-16) var(--space-8);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    /* 覆盖全局 [onclick]{touch-action:manipulation}，保证货卡区域可纵向滑动 */
    touch-action: pan-y;
    text-align: left;
    white-space: normal;
}
body.game-page .gc-dialog.mc-dialog:has(> .gc-foot) > .gc-mid.mc-mid,
.gc-dialog.mc-dialog:has(> .gc-foot) > .gc-mid.mc-mid {
    padding-bottom: var(--space-8);
}
body.game-page .gc-dialog.mc-dialog > .gc-foot.mc-foot,
.gc-dialog.mc-dialog > .gc-foot.mc-foot,
.mc-foot {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-8);
    margin: 0;
    padding: var(--space-10) var(--space-16) max(var(--space-12), env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border-color);
}
body.game-page .gc-dialog.mc-dialog .modal-btn,
.gc-dialog.mc-dialog .modal-btn {
    border-radius: var(--gc-radius-btn, var(--radius-md));
}
.mc-foot .modal-btn { flex: 1; }

/* 引语 */
.mc-quote {
    flex-shrink: 0;
    padding: var(--space-12) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid color-mix(in srgb, var(--accent-gold) 26%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 7%, transparent);
    text-align: left;
}
.mc-quote__lab {
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.mc-quote__body {
    margin: 0;
    font-size: var(--font-label);
    line-height: 1.65;
    color: var(--text-secondary);
    font-style: italic;
}
.mc-quote__body em {
    font-style: normal;
    color: var(--text-gold, var(--accent-gold));
    font-weight: 600;
}

.mc-sec-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 var(--space-2);
    flex-shrink: 0;
}
.mc-sec-head__t {
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--text-jade, var(--accent-jade));
}
.mc-sec-head__n {
    font-size: var(--font-caption);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

/* 商品列表 */
.merchant-items,
.mc-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    text-align: left;
    max-height: none;
    overflow: visible;
    padding-right: 0;
    flex-shrink: 0;
    /* #6263：列表区域明确允许纵向滑动（中区是滚动容器） */
    touch-action: pan-y;
}
.mc-item,
.merchant-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-10);
    /* 介绍全文展开后按钮顶对齐，避免被拉到卡片垂直中心 */
    align-items: start;
    padding: var(--space-12) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    box-sizing: border-box;
    margin: 0;
    transition: border-color 0.12s ease, background 0.12s ease;
    /* 在货卡空白处滑动应驱动中区滚动，勿被 manipulation 吃掉 */
    touch-action: pan-y;
    flex-shrink: 0;
}
.merchant-item + .merchant-item { margin-top: 0; }
.mc-item:hover,
.merchant-item:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--bg-panel, var(--bg-card)));
}
.mc-item__main,
.merchant-item__info {
    min-width: 0;
    flex: 1;
    margin: 0;
}
.mc-item__name,
.merchant-item__name {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-6) var(--space-6);
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
    margin: 0;
}
.mc-item__chip,
.merchant-item__stage {
    display: inline-flex;
    align-items: center;
    padding: var(--space-2) var(--space-6);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 35%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 9%, transparent);
    color: var(--text-gold);
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.4;
}
.mc-item__chip.is-rarity {
    border-color: color-mix(in srgb, var(--mc-rarity, var(--accent-gold)) 40%, transparent);
    background: color-mix(in srgb, var(--mc-rarity, var(--accent-gold)) 10%, transparent);
    color: var(--mc-rarity, var(--text-gold));
}
/* 云游商人货卡：完整展示物品介绍，不截两行（限购 1 件时需看清效果再下手） */
.mc-item__desc,
.merchant-item__desc {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-muted);
    white-space: normal;
    overflow: visible;
    word-break: break-word;
}
/* 购买钮：全局 gold + 触控高度（iOS hit-testing） */
.mc-buy.modal-btn,
.merchant-item__buy-btn.modal-btn,
.merchant-item__buy-btn {
    flex: none;
    min-width: 88px;
    min-height: 40px;
    height: auto;
    padding: 0 var(--space-12);
    font-size: var(--font-label);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    touch-action: pan-y;
    border-radius: var(--gc-radius-btn, var(--radius-md));
    cursor: pointer;
    font-family: inherit;
    box-shadow: none;
    filter: none;
    text-shadow: none;
    -webkit-appearance: none;
    appearance: none;
}
.mc-buy.modal-btn b,
.merchant-item__buy-btn b {
    font-weight: 700;
    margin-right: var(--space-2);
}
.merchant-item__buy-btn:not(.modal-btn) {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.12));
    color: var(--text-gold);
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.40));
}
.merchant-item__buy-btn:hover { filter: none; }

.mc-empty {
    padding: var(--space-20) var(--space-12);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px dashed var(--border-color);
    line-height: 1.55;
}
.mc-note {
    margin: 0;
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-muted);
    flex-shrink: 0;
}

/* 自动探索超时提示挂在引语卡内 */
#merchantOverlay .mc-quote #merchantAutoExploreTimeoutHint,
#merchantOverlay .modal-info-card #merchantAutoExploreTimeoutHint {
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-muted);
    font-style: normal;
}

@supports not (background: color-mix(in srgb, white 50%, black)) {
    .mc-quote,
    .mc-item,
    .merchant-item,
    .mc-item__chip,
    .merchant-item__stage {
        background: var(--bg-panel, var(--bg-card));
    }
}

/* 洗炼对比布局 */
/* 洗炼对比块样式已迁移至 game-panels.css（.wash-compare 单列：新在上、旧在下） */

/* 环境效果信息卡 */
.env-card {
    background: var(--bg-glass);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-sm);
    padding: var(--space-12);
}
.env-card + .env-card { margin-top: var(--space-12); }
.env-card__title {
    font-size: var(--font-body-lg);
    color: var(--accent-gold);
    font-weight: bold;
    margin-bottom: var(--space-6);
}

/* ============================================================ */
/* ===== 天时地利弹窗 #envOverlay（gc-dialog jade 迁移后） ===== */
/* 旧 .env-card 平铺 + 统一金 title 已废弃；新版用季节色 chip   */
/* 做视觉锚点（春玉/夏朱/秋金/冬青）+ 数据分危机/机遇两行。   */
/* 用 .env-dialog 作用域限定，不影响其它仍用旧 .env-card 的地方。*/
/* ============================================================ */

/* 四季 + 昼夜语义色 token（暗/浅各自在 :root / theme-light 定义） */
:root {
    --season-spring: var(--accent-jade);
    --season-summer: var(--text-red);
    --season-autumn: var(--accent-gold);
    --season-winter: #82a9aa;
    --time-day: var(--text-secondary);
    --time-night: var(--accent-crimson);
}
html.theme-light {
    --season-spring: var(--accent-jade);
    --season-summer: var(--accent-crimson);
    --season-autumn: var(--accent-gold);
    --season-winter: #2f8390;
    --time-day: var(--text-secondary);
    --time-night: var(--accent-crimson);
}

/* 卡片升级：实色底板 + 圆角加大 */
.env-dialog .env-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-12) var(--space-14) var(--space-14);
}
.env-dialog .env-card + .env-card { margin-top: var(--space-10); }
.env-dialog .env-calendar {
    margin: 0 0 var(--space-10);
    padding: var(--space-8) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-body);
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.4;
}

/* 卡顶：chip + title 同行 */
.env-dialog .env-card__head {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}
.env-dialog .env-card__title {
    flex: 1;
    font-size: var(--font-body);
    color: var(--text-secondary);
    font-weight: 500;
    letter-spacing: 0.5px;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.env-dialog .env-card__title b { color: var(--text-primary); font-weight: 600; }

/* 季节/昼夜 chip：圆角胶囊，色 = currentColor（边框 + 浅底） */
.env-chip {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-8);
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 1px;
    border-radius: var(--radius-pill);
    border: 1px solid currentColor;
}
.env-chip--spring { color: var(--season-spring); background: color-mix(in srgb, var(--season-spring) 10%, transparent); }
.env-chip--summer { color: var(--season-summer); background: color-mix(in srgb, var(--season-summer) 10%, transparent); }
.env-chip--autumn { color: var(--season-autumn); background: color-mix(in srgb, var(--season-autumn) 10%, transparent); }
.env-chip--winter { color: var(--season-winter); background: color-mix(in srgb, var(--season-winter) 10%, transparent); }
.env-chip--day { color: var(--time-day); background: var(--bg-glass); }
.env-chip--night { color: var(--time-night); background: color-mix(in srgb, var(--time-night) 10%, transparent); }

/* 基调描述：衬线大字 + 季节色，卡的视觉重心 */
.env-dialog .env-card__mood {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-body-lg);
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: var(--space-6);
}
.env-card__mood--spring { color: var(--season-spring); }
.env-card__mood--summer { color: var(--season-summer); }
.env-card__mood--autumn { color: var(--season-autumn); }
.env-card__mood--winter { color: var(--season-winter); }
.env-card__mood--day { color: var(--text-muted); }
.env-card__mood--night { color: var(--time-night); }
/* 白昼无 mood 文案时，mood 节点为空——不占垂直空间 */
.env-dialog .env-card__mood:empty { display: none; }

/* 效果行：标签（危机/机遇 灰小字）+ 文案 + 数值（语义色 mono） */
.env-dialog .env-effects {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    font-size: var(--font-label);
    line-height: 1.6;
    color: var(--text-secondary);
}
.env-effect__label {
    display: inline-block;
    min-width: 3em;
    color: var(--text-muted);
    font-size: var(--font-caption);
    letter-spacing: 1px;
}
.env-effect__val {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-weight: 600;
}
.env-effect__val--up { color: var(--accent-jade); }
.env-effect__val--down { color: var(--text-danger); }
.env-effect__val--gold { color: var(--text-gold); }
.env-effect__val--crimson { color: var(--season-summer); }
.env-effect__val--cyan { color: var(--season-winter); }

/* 平淡态（白昼无加成时的中性文案） */
.env-dialog .env-card__calm {
    font-size: var(--font-label);
    color: var(--text-muted);
    line-height: 1.6;
}

/* 隐藏滚动条但保留滚动（gc-mid 内容超长时） */
.env-dialog, .env-dialog .gc-mid {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.env-dialog::-webkit-scrollbar,
.env-dialog .gc-mid::-webkit-scrollbar {
    display: none;
}

/* ============================================================ */
/* ===== 赎回账单 #pawnModalUI（gc-dialog gold 迁移后） ====== */
/* 旧 modal-header-deco 双层 + 全内联 style item 卡 + 底部空   */
/* modal-btn-row（bug）已废弃。这里只保留业务分区样式。       */
/* 全局 rarity-1~5 / refine-badge / item-desc-effect 复用。   */
/* ============================================================ */

/* 顶部说明条（虚线胶囊，关键信息加粗） */
.pawn-dialog .pawn-tip {
    font-size: var(--font-label);
    color: var(--text-secondary);
    line-height: 1.6;
    padding: var(--space-10) var(--space-12);
    margin-bottom: var(--space-12);
    border-radius: var(--radius-md);
    border: 1px dashed var(--border-color);
    background: var(--bg-glass);
}
.pawn-dialog .pawn-tip b { color: var(--text-gold); font-weight: 600; }
.pawn-dialog .pawn-tip .danger { color: var(--text-danger); font-weight: 600; }

/* 列表容器 */
.pawn-dialog .pawn-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

/* 单条赎回卡 */
.pawn-dialog .pawn-item {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-10) var(--space-12);
    background: var(--bg-panel);
    transition: border-color 0.15s;
}
.pawn-dialog .pawn-item:hover { border-color: var(--border-gold); }
/* 紧急态（期限 <24h）：朱红描边 + 浅红底，逾期死当强警示 */
.pawn-dialog .pawn-item--urgent {
    border-color: rgba(183, 58, 49, 0.4);
    background: color-mix(in srgb, var(--accent-crimson) 4%, var(--bg-panel));
}

.pawn-dialog .pawn-item__name {
    font-size: var(--font-body-lg);
    font-weight: 600;
    line-height: 1.4;
}
.pawn-dialog .pawn-item__qty {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    color: var(--text-muted);
    margin-left: var(--space-4);
}

/* 先天词缀描述（复用全局 .item-desc-effect，这里只覆写 pawn 作用域内间距） */
.pawn-dialog .item-desc-effect {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-secondary);
    line-height: 1.5;
}

/* 赎金 + 期限行 */
.pawn-dialog .pawn-item__meta {
    display: flex;
    align-items: center;
    gap: var(--space-12);
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    flex-wrap: wrap;
}
.pawn-dialog .pawn-item__redeem {
    display: flex;
    align-items: baseline;
    gap: var(--space-4);
}
.pawn-dialog .pawn-item__redeem-label { color: var(--text-muted); font-size: var(--font-micro); letter-spacing: 1px; }
.pawn-dialog .pawn-item__redeem-val {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-action);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
.pawn-dialog .pawn-item__redeem-unit { font-size: var(--font-micro); color: var(--text-muted); }

/* 期限 chip：按剩余时间三档变色 */
.pawn-dialog .pawn-deadline {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    letter-spacing: 0.5px;
    border: 1px solid currentColor;
}
.pawn-dialog .pawn-deadline__icon { font-size: var(--font-caption); }
.pawn-dialog .pawn-deadline--safe { color: var(--accent-jade); background: color-mix(in srgb, var(--accent-jade) 10%, transparent); }
.pawn-dialog .pawn-deadline--warn { color: var(--accent-gold); background: color-mix(in srgb, var(--accent-gold) 10%, transparent); }
.pawn-dialog .pawn-deadline--urgent { color: var(--text-danger); background: color-mix(in srgb, var(--text-danger) 10%, transparent); }

/* 赎回钮行 */
.pawn-dialog .pawn-item__action {
    margin-top: var(--space-8);
    display: flex;
    justify-content: flex-end;
}
.pawn-dialog .pawn-item__action .modal-btn { height: 34px; font-size: var(--font-label); padding: 0 var(--space-16); }

/* 空态 */
.pawn-dialog .pawn-empty {
    text-align: center;
    padding: var(--space-40) var(--space-20);
    color: var(--text-muted);
    font-size: var(--font-body);
    line-height: 1.8;
}
.pawn-dialog .pawn-empty__icon {
    display: block;
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-hero);
    color: var(--border-color);
    margin-bottom: var(--space-10);
    letter-spacing: 4px;
}

/* 加载态 */
.pawn-dialog .pawn-loading {
    text-align: center;
    padding: var(--space-32) var(--space-20);
    color: var(--text-muted);
    font-size: var(--font-label);
}

/* 隐藏滚动条但保留滚动（list 超长时） */
.pawn-dialog, .pawn-dialog .gc-mid {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.pawn-dialog::-webkit-scrollbar,
.pawn-dialog .gc-mid::-webkit-scrollbar {
    display: none;
}

.log-loot {
    color: var(--text-gold);
}

.log-item {
    color: var(--ghost-purple-muted);
}

.log-trade {
    color: var(--beihuang-blue);
}

.log-exchange {
    color: var(--text-gold);
}
.pf-line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: var(--space-4) 0;
    font-size: var(--font-body);
    line-height: 1.8;
}
.pf-line__label {
    color: var(--text-muted);
    min-width: 48px;
    flex-shrink: 0;
}
.pf-line__value {
    flex: 1;
    text-align: right;
}
.pf-block__label {
    color: var(--text-muted);
    font-size: var(--font-label);
}
.pf-track {
    padding: var(--space-4) 0;
    font-size: var(--font-label);
    line-height: 1.8;
}
.pf-track__time {
    color: var(--text-muted);
    min-width: 48px;
    display: inline-block;
}
.pf-track__text {
    color: var(--text-secondary);
}
.pf-empty {
    text-align: center;
    color: var(--text-muted);
    font-style: italic;
    font-size: var(--font-label);
    padding: var(--space-4) 0;
}
.pf-intro {
    position: relative;
    padding: var(--space-10) var(--space-12);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 18%, var(--border-color));
    border-radius: var(--radius-md, var(--radius-md));
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--bg-panel));
}
.pf-intro__text {
    color: var(--text-secondary);
    font-size: var(--font-body);
    line-height: 1.8;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
}
.pf-intro__empty {
    color: var(--text-muted);
    font-size: var(--font-label);
    font-style: italic;
    line-height: 1.8;
}
.pf-intro__edit {
    margin-top: var(--space-8);
    padding: var(--space-6) var(--space-10);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 35%, transparent);
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-gold);
    font-family: var(--font-serif);
    font-size: var(--font-label);
    cursor: pointer;
}
.pf-intro__edit:hover {
    border-color: var(--accent-gold);
}
/* 题写道号小传 · A 笺心（openProfileIntroDialog） */
body.game-page .modal-content.modal--decorated.pi-dialog,
.modal-content.modal--decorated.pi-dialog,
.pi-dialog {
    max-width: 392px;
    width: min(90vw, 392px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: min(85dvh, 640px);
}

.pi-dialog .gc-mid.pi-mid {
    text-align: center;
    padding: var(--space-12) var(--space-14) var(--space-8);
    max-height: none;
    flex: 1 1 auto;
}

.pi-q {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-action);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-primary);
    line-height: 1.45;
    margin-bottom: var(--space-10);
}

.pi-paper {
    padding: var(--space-2);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
    background: color-mix(in srgb, var(--accent-gold, var(--text-gold)) 7%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-gold, var(--text-gold)) 22%, transparent);
}

.pi-ta,
.profile-intro-editor__input {
    width: 100%;
    box-sizing: border-box;
    min-height: 148px;
    resize: vertical;
    padding: var(--space-12);
    border: 0;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-card) 92%, transparent);
    color: var(--text-primary);
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-body-lg);
    line-height: 1.85;
    letter-spacing: 0.2px;
    -webkit-appearance: none;
    appearance: none;
}

.pi-ta:focus,
.profile-intro-editor__input:focus {
    outline: none;
}

.pi-ta::placeholder,
.profile-intro-editor__input::placeholder {
    color: var(--text-muted);
    opacity: 0.85;
    font-family: var(--font-ui, inherit);
    font-size: var(--font-body);
}

.pi-ta.is-over,
.profile-intro-editor__input.is-over {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-crimson, var(--accent-crimson)) 45%, transparent);
}

.pi-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-10);
    margin-top: var(--space-8);
    font-size: var(--font-label);
    color: var(--text-muted);
}

.pi-cnt,
#profileIntroCounter {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
}

.pi-cnt.is-ok,
#profileIntroCounter.is-ok {
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}

.pi-cnt.is-over,
#profileIntroCounter.is-over {
    color: var(--accent-crimson, var(--danger-color, var(--accent-crimson)));
    font-weight: 700;
}

.pi-dialog .gc-foot.pi-foot {
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-12) var(--space-14) var(--space-14);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
}

.pi-foot-row {
    display: flex;
    gap: var(--space-8);
    width: 100%;
}

.pi-foot-row > .modal-btn {
    flex: 1 1 0;
    min-width: 0;
}

.pi-dialog .pi-save.modal-btn--full,
.pi-dialog .pi-foot > .modal-btn--full {
    width: 100%;
    flex: 0 0 auto;
    height: 40px;
    min-height: 40px;
    font-size: var(--font-body);
    font-weight: 600;
}

.pi-dialog #profileIntroAiBtn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

@media (max-width: 520px) {
    .pi-dialog {
        width: calc(100vw - 24px);
    }
}
.pf-rank-inline {
    font-size: var(--font-body);
    text-align: center;
    line-height: 1.8;
}
.pf-rank-inline .sep {
    color: var(--text-muted);
    margin: 0 var(--space-4);
    opacity: 0.4;
}
/* —— 底栏 v3：主双钮 + 更多展开（废左标签分组） —— */
.pf-foot {
    position: relative;
    z-index: 3;
    flex-shrink: 0;
    padding: var(--space-12) var(--space-14) var(--space-14);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
    /* 实底，避免底栏与圆角处透出中区内容 */
    background: var(--bg-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
}
.pf-foot-primary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10);
}
.pf-foot-primary:has(> :only-child) {
    grid-template-columns: 1fr;
}
.pf-foot-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    height: 30px;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-muted);
    font: inherit;
    font-size: var(--font-label);
    letter-spacing: 1px;
    cursor: pointer;
    font-family: var(--font-display, KaiTi, "Noto Serif SC", serif);
}
.pf-foot-toggle:hover {
    color: var(--text-gold);
    background: color-mix(in srgb, var(--accent-gold) 6%, transparent);
}
.pf-foot-toggle__chev {
    opacity: 0.75;
}
.pf-foot-toggle.is-open .pf-foot-toggle__chev {
    transform: rotate(180deg);
}
.pf-foot-panel {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
    padding-top: var(--space-4);
    border-top: 1px dashed color-mix(in srgb, var(--border-color) 75%, transparent);
}
.pf-foot-panel[hidden] {
    display: none !important;
}
.pf-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    height: 36px;
    padding: 0 var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-body);
    font-family: var(--font-serif);
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
    letter-spacing: 0.8px;
    white-space: nowrap;
    text-align: center;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}
.pf-btn--lg {
    height: 40px;
    font-size: var(--font-body-lg);
    letter-spacing: 1.5px;
    font-weight: 600;
}
.pf-btn:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
    color: var(--text-gold);
    background: color-mix(in srgb, var(--accent-gold) 5%, transparent);
}
.pf-btn--like,
.pf-btn--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 36%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 9%, transparent);
    font-weight: 600;
}
.pf-btn--like:hover,
.pf-btn--gold:hover {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 52%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 14%, transparent);
}
.pf-btn--shelf,
.pf-btn--jade {
    color: var(--text-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 32%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}
.pf-btn--shelf:hover,
.pf-btn--jade:hover {
    border-color: color-mix(in srgb, var(--accent-jade) 48%, transparent);
    color: var(--text-jade);
    background: color-mix(in srgb, var(--accent-jade) 12%, transparent);
}
.pf-btn--black {
    color: var(--text-danger, var(--accent-crimson));
    border-color: color-mix(in srgb, var(--accent-crimson) 28%, transparent);
}
.pf-btn--black:hover {
    color: var(--text-danger, var(--accent-crimson));
    border-color: color-mix(in srgb, var(--accent-crimson) 45%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 7%, transparent);
}
.pf-btn--master {
    color: var(--text-secondary);
    border-color: var(--border-color);
}
.pf-btn--master:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, var(--border-color));
    color: var(--text-gold);
}
.pf-btn--disabled {
    opacity: 0.42;
    cursor: not-allowed;
}
.pf-btn--disabled:hover {
    border-color: var(--border-color);
    color: var(--text-secondary);
    background: transparent;
}

/* ===== 道友画卷 · 名片 v2（2026-07 重设计） ===== */
/* 顶部金线标题条 + 底部固定操作区：需把弹窗改为 title-bar / scroll-body / actions 三段 flex。
   .modal--decorated 已是 flex column，这里让 #playerProfileContent 自然占满中段滚动。 */

/* —— 名片头部 —— */
.pf-card-head {
    position: relative;
    padding: var(--space-2) 0 var(--space-14);
    border-bottom: 1px dashed color-mix(in srgb, var(--accent-gold) 22%, transparent);
    display: flex;
    align-items: flex-start;
    gap: var(--space-12);
}
.pf-portrait {
    flex: none;
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
    padding: 0;
    overflow: hidden;
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-jade) 35%, transparent);
    background: var(--bg-panel);
    color: var(--text-jade);
    font-family: var(--font-display);
    font-size: var(--font-heading);
    line-height: 46px;
    text-align: center;
    cursor: default;
    appearance: none;
    -webkit-appearance: none;
}
.pf-portrait img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pf-portrait.is-editable {
    cursor: pointer;
}
.pf-portrait.is-editable:hover {
    border-color: var(--accent-gold);
}
.pf-portrait-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-10);
}
.pf-portrait-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-6);
    padding: var(--space-8);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
    cursor: pointer;
    min-height: 44px;
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    color: inherit;
}
.pf-portrait-option.is-on {
    border-color: color-mix(in srgb, var(--accent-gold) 55%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}
.pf-portrait-option img,
.pf-portrait-option__letter {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-pill);
    object-fit: cover;
    border: 1px solid color-mix(in srgb, var(--accent-jade) 30%, transparent);
}
.pf-portrait-option__letter {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-jade);
    font-family: var(--font-display);
    font-size: var(--font-heading);
    background: var(--bg-card);
}
.pf-portrait-option span {
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.pf-card-head__main {
    flex: 1;
    min-width: 0;
}
.pf-card-head__seal {
    position: absolute;
    top: 0;
    right: 0;
    width: 38px;
    height: 38px;
    border: 1.5px solid var(--accent-crimson);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--accent-crimson) 6%, transparent);
    flex-shrink: 0;
}
.pf-card-head__seal span {
    color: var(--accent-crimson);
    font-family: var(--font-display);
    font-size: var(--font-heading);
    font-weight: bold;
    line-height: 1;
}
.pf-card-head__name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-8);
    font-size: var(--font-page-title);
    font-weight: bold;
    color: var(--text-primary);
    letter-spacing: 2px;
    line-height: 1.3;
    padding-right: var(--space-48);
    overflow-wrap: anywhere;
    word-break: break-word;
}
.pf-card-head__name-text {
    min-width: 0;
}
.pf-name-rename {
    flex: 0 0 auto;
    padding: var(--space-2) var(--space-8);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    border-radius: var(--radius-xs);
    background: transparent;
    color: var(--text-gold);
    font: inherit;
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.4;
    cursor: pointer;
}
.pf-name-rename:hover {
    border-color: var(--accent-gold);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
.pf-name-rename:disabled {
    cursor: wait;
    opacity: 0.6;
}
.pf-card-head__realm {
    margin-top: var(--space-6);
    font-size: var(--font-body);
    color: var(--text-secondary);
    letter-spacing: 1px;
}
.pf-card-head__realm .sep {
    color: var(--text-muted);
    margin: 0 var(--space-6);
    opacity: 0.6;
}
.pf-card-head__badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-top: var(--space-10);
}
.pf-badge {
    font-size: var(--font-caption);
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-xs);
    background: color-mix(in srgb, var(--bg-panel) 90%, transparent);
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    white-space: nowrap;
    letter-spacing: 0.5px;
    line-height: 1.5;
}
.pf-badge--gold    { color: var(--text-gold);    border-color: color-mix(in srgb, var(--accent-gold) 28%, transparent); }
.pf-badge--jade    { color: var(--text-jade);    border-color: color-mix(in srgb, var(--accent-jade) 28%, transparent); }
.pf-badge--cyan    { color: var(--accent-cyan);             border-color: color-mix(in srgb, var(--accent-cyan) 26%, transparent); }
/* 人气 / 可点徽章：压掉全局 button 默认 min-height，与旁路 span 徽章同高 */
button.pf-badge {
    cursor: pointer;
    font: inherit;
    font-size: var(--font-caption);
    appearance: none;
    -webkit-appearance: none;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: var(--space-2) var(--space-8);
    line-height: 1.35;
    box-sizing: border-box;
    vertical-align: middle;
}
/* 人气入口略收窄：字号与内边距再紧一档，避免「人气 N · 谁赞过我」整块偏大 */
button.pf-badge--likes {
    font-size: var(--font-caption);
    padding: var(--space-2) var(--space-6);
    letter-spacing: 0.2px;
    max-width: 100%;
}
button.pf-badge--likes:hover,
button.pf-badge--likes:focus-visible {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 48%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
    outline: none;
}

/* 谁为我点过赞 */
.rl-shell {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
}
.rl-head {
    text-align: center;
}
.rl-title {
    font-size: var(--font-action);
    color: var(--text-gold);
    letter-spacing: 1px;
}
.rl-sub {
    margin-top: var(--space-2);
    font-size: var(--font-label);
    color: var(--text-muted);
}
.rl-meta {
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-secondary);
}
.rl-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    max-height: min(48vh, 420px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}
.rl-empty {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-body);
    line-height: 1.7;
    padding: var(--space-24) var(--space-10);
}
.rl-row {
    display: flex;
    align-items: center;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 85%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 92%, transparent);
}
/* 「我赞过谁」批量取消的勾选框：方形复选，与画卷按钮/链接错开点击区 */
.rl-row__check {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    padding: var(--space-4);
}
.rl-row__check input {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--accent-gold, #c8a04a);
}
.rl-row__main {
    flex: 1 1 auto;
    min-width: 0;
}
.rl-row__name {
    font-size: var(--font-body-lg);
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rl-row__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-top: var(--space-4);
    align-items: center;
}
.rl-chip {
    font-size: var(--font-caption);
    color: var(--text-jade, var(--accent-jade));
    border: 1px solid color-mix(in srgb, var(--accent-jade) 28%, transparent);
    border-radius: var(--radius-pill);
    padding: var(--space-2) var(--space-8);
}
.rl-time {
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.rl-row__go {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 var(--space-10);
    border-radius: var(--radius-sm);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 36%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
    color: var(--text-gold);
    font-size: var(--font-label);
    cursor: pointer;
}
.rl-row__go:hover {
    background: color-mix(in srgb, var(--accent-gold) 16%, transparent);
}
.rl-actions {
    margin-top: var(--space-2);
}

/* 「我赞过谁」底部批量取消工具条：全选 + 计数 + 取消按钮 */
.rl-batch {
    display: flex;
    align-items: center;
    gap: var(--space-10);
    padding: var(--space-8) var(--space-10);
    margin-bottom: var(--space-8);
    border-radius: var(--radius-md);
    border: 1px dashed color-mix(in srgb, var(--accent-gold, #c8a04a) 35%, transparent);
    background: color-mix(in srgb, var(--accent-gold, #c8a04a) 5%, transparent);
}
.rl-batch__select {
    display: inline-flex;
    align-items: center;
    gap: var(--space-6);
    font-size: var(--font-label);
    color: var(--text-secondary);
    cursor: pointer;
}
.rl-batch__select input {
    width: 15px;
    height: 15px;
    accent-color: var(--accent-gold, #c8a04a);
    cursor: pointer;
}
.rl-batch__count {
    flex: 1 1 auto;
    font-size: var(--font-label);
    color: var(--text-muted);
}
.rl-batch__cancel {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 var(--space-12);
    font-size: var(--font-label);
}
.pf-tabs {
    display: flex;
    gap: var(--space-4);
    margin: 0;
    padding: var(--space-4);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
}
.pf-tab {
    flex: 1;
    height: 30px;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--text-muted);
    font: inherit;
    font-size: var(--font-label);
    letter-spacing: 1px;
    cursor: pointer;
    font-family: var(--font-display, KaiTi, "Noto Serif SC", serif);
}
.pf-tab.is-on {
    background: var(--bg-card);
    color: var(--text-gold);
    font-weight: 600;
    box-shadow: 0 1px 3px color-mix(in srgb, var(--text-primary) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 20%, transparent);
}
.pf-pane[hidden] {
    display: none !important;
}
.pf-pane {
    padding-top: var(--space-2);
}

/* —— 章节标题（金色细线 + 楷体） —— */
.pf-section { margin-top: var(--space-14); }
.pf-pane > .pf-section:first-child { margin-top: var(--space-10); }
.pf-section__title {
    font-size: var(--font-label);
    color: var(--text-gold);
    letter-spacing: 3px;
    margin-bottom: var(--space-10);
    display: flex;
    align-items: center;
    gap: var(--space-8);
    font-family: var(--font-display);
}
.pf-section__title::before,
.pf-section__title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: color-mix(in srgb, var(--accent-gold) 18%, transparent);
}

/* 道友画卷 · 各境历时（历程·破境汇总） */
.pf-years {
    display: flex;
    flex-direction: column;
}
.pf-years__row {
    display: flex;
    align-items: baseline;
    gap: var(--space-8);
    padding: var(--space-6) 0;
    border-bottom: 1px dashed color-mix(in srgb, var(--border-color) 70%, transparent);
}
.pf-years__row:last-child { border-bottom: none; }
.pf-years__name {
    flex: 1;
    min-width: 0;
    font-size: var(--font-label);
    color: var(--text-primary);
}
.pf-years__row.is-now .pf-years__name { color: var(--text-jade); }
.pf-years__enter,
.pf-years__len {
    flex: none;
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.pf-years__len { color: var(--text-gold); }
.pf-years__note {
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    text-align: center;
}

/* —— 稳定战力（道友画卷 · 反馈 #4574） —— */
.pf-power-line {
    display: flex;
    align-items: baseline;
    gap: var(--space-8);
    margin: 0 0 var(--space-8);
    padding: var(--space-8) var(--space-12);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 28%, var(--border-color));
    border-radius: var(--radius-md);
    cursor: pointer;
}
.pf-power-line__lab {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 2px;
}
.pf-power-line__val {
    flex: 1;
    font-size: var(--font-title);
    font-weight: bold;
    color: var(--text-gold);
    line-height: 1.2;
    overflow-wrap: anywhere;
}
.pf-power-line__hint {
    font-size: var(--font-caption);
    color: var(--text-muted);
    opacity: 0.75;
}
.pf-badge--power {
    cursor: pointer;
}
/* 与人气徽章视觉权重对齐：略紧凑 */
.pf-badge--power,
span.pf-badge--likes {
    font-size: var(--font-caption);
    padding: var(--space-2) var(--space-6);
    line-height: 1.35;
    letter-spacing: 0.2px;
}

/* —— 灵力周天 2×2 网格 —— */
.pf-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
}
.pf-stat-cell {
    background: color-mix(in srgb, var(--bg-panel) 55%, transparent);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: var(--space-8) var(--space-12);
    min-width: 0; /* 允许 cell 收缩到内容以下，避免长数值撑破卡片 */
}
.pf-stat-cell__label {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 2px;
    margin-bottom: var(--space-4);
}
.pf-stat-cell__value {
    font-size: var(--font-title);
    font-weight: bold;
    line-height: 1.25;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0 var(--space-4);
    overflow-wrap: anywhere; /* 超长数字串可在任意点折行 */
}
.pf-stat-cell__max {
    font-size: var(--font-micro);
    color: var(--text-muted);
    font-weight: normal;
}
.pf-stat-cell__bonus {
    display: block;
    font-size: var(--font-micro);
    color: var(--text-gold);
    margin-top: var(--space-2);
    opacity: 0.8;
}

/* —— 装备行（紧凑分隔） —— */
.pf-equip-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-6) 0;
    font-size: var(--font-label);
    border-bottom: 1px dashed color-mix(in srgb, var(--border-color) 70%, transparent);
    line-height: 1.6;
}
.pf-equip-row:last-child { border-bottom: none; }
.pf-equip-row__slot {
    color: var(--text-muted);
    font-size: var(--font-caption);
    min-width: 52px;
    flex-shrink: 0;
    letter-spacing: 1px;
}
.pf-equip-row__name { flex: 1; text-align: right; }
/* #6832：已装备行可点；命中至少 44 */
button.pf-equip-row--open {
    width: 100%;
    margin: 0;
    background: transparent;
    border-left: 0;
    border-right: 0;
    border-top: 0;
    cursor: pointer;
    font: inherit;
    color: inherit;
    min-height: 44px;
    text-align: inherit;
}
.pf-equip-inspect__stats { margin-bottom: var(--space-8); }
.pf-equip-inspect__desc {
    margin-top: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-secondary);
    line-height: 1.65;
}
.pf-equip-inspect__tag {
    margin-left: var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-gold);
}

/* —— 传承/术法块（紧凑分隔） —— */
.pf-heir-block {
    padding: var(--space-8) 0;
    border-bottom: 1px dashed color-mix(in srgb, var(--border-color) 70%, transparent);
}
.pf-heir-block:last-child { border-bottom: none; }
.pf-heir-block__head { font-size: var(--font-label); line-height: 1.6; }
.pf-heir-block__desc {
    font-size: var(--font-caption);
    color: var(--text-secondary);
    line-height: 1.65;
    margin-top: var(--space-4);
    overflow-wrap: anywhere;
}

/* —— 藏锋隐世态 —— */
.pf-hidden-body { padding: var(--space-32) var(--space-24); text-align: center; }
.pf-hidden-body__seal {
    display: inline-flex;
    width: 54px; height: 54px;
    border: 2px solid var(--accent-crimson);
    border-radius: var(--radius-sm);
    align-items: center;
    justify-content: center;
    color: var(--accent-crimson);
    font-family: var(--font-display);
    font-size: var(--font-page-title);
    margin-bottom: var(--space-14);
}
.pf-hidden-body__text {
    color: var(--text-secondary);
    font-size: var(--font-body);
    line-height: 2;
    font-family: var(--font-display);
}
.pf-hidden-body__sub {
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-top: var(--space-8);
}

/* 旧 pf-actions--grouped / pf-action-group 已退役，底栏见 .pf-foot */

.cave-decoration-active {
    display: grid;
    gap: var(--space-4);
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--glass-white-2);
    color: var(--text-secondary);
    font-size: var(--font-label);
    line-height: 1.6;
}

.cave-decoration-active b {
    color: var(--text-gold);
    font-size: var(--font-body-lg);
}

.cave-decoration-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8);
    margin-top: var(--space-10);
}

.cave-decoration-btn {
    min-height: 52px;
}

/* ===== 盔甲架（workbench · 无左轨）===== */
.cave-armor-hint {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.55;
    margin: 0 0 var(--space-2);
}
.cave-armor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8);
    align-items: start;
}
.cave-armor-grid--visit {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    align-items: start;
}
/* 陈列卡片：对齐储物折叠卡（名+祭炼 / meta / 属性 / 铭文印鉴），无左轨 */
.cave-armor-slot {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md, var(--radius-md));
    background: var(--bg-card);
    padding: var(--space-10);
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-height: 96px;
    text-align: left;
    color: inherit;
    font: inherit;
    width: 100%;
    box-sizing: border-box;
    transition: border-color .12s, background .12s;
}
.cave-armor-slot:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent);
}
.cave-armor-slot.rarity-5 {
    border-color: color-mix(in srgb, var(--rarity-5) 35%, var(--border-color));
}
.cave-armor-slot.rarity-4 {
    border-color: color-mix(in srgb, var(--rarity-4) 30%, var(--border-color));
}
.cave-armor-slot--empty {
    align-items: center;
    justify-content: center;
    border-style: dashed;
    cursor: pointer;
    color: var(--text-muted);
    font-size: var(--font-label);
    min-height: 96px;
    -webkit-appearance: none;
    appearance: none;
}
.cave-armor-slot--empty:hover {
    border-color: color-mix(in srgb, var(--accent-jade) 42%, transparent);
    color: var(--text-jade);
    background: color-mix(in srgb, var(--accent-jade) 5%, var(--bg-card));
}
.cave-armor-slot__hint {
    font-size: var(--font-caption);
    text-align: center;
    line-height: 1.4;
}
.cave-armor-slot__head {
    display: flex;
    align-items: baseline;
    gap: var(--space-6);
    min-width: 0;
}
.cave-armor-slot__name {
    font-size: var(--font-body);
    font-weight: 700;
    line-height: 1.3;
    color: var(--rarity-c, var(--text-primary));
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}
/* 祭炼等级：与储物 meta .refine / 坊市强化标同金 */
.cave-armor-slot__refine {
    flex: none;
    color: var(--accent-orange, var(--text-gold));
    font-weight: 700;
    font-size: var(--font-label);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}
/* 品类 · 品质 · 祭炼 · 铭文数 */
.cave-armor-slot__meta {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
    letter-spacing: 0.02em;
}
/* 属性区：复用全局 .item-stats 色板（stat-atk/def/hp/spirit） */
.cave-armor-slot__stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-8);
    font-size: var(--font-caption);
    line-height: 1.45;
}
.cave-armor-slot__stats .stat-atk { color: var(--craft-gold, var(--text-gold)); }
.cave-armor-slot__stats .stat-def { color: color-mix(in srgb, var(--craft-gold, var(--text-gold)) 50%, var(--text-muted)); }
.cave-armor-slot__stats .stat-hp { color: var(--canghai-teal, var(--text-jade)); }
.cave-armor-slot__stats .stat-spirit { color: var(--ghost-purple-deep, var(--accent-purple)); }
.cave-armor-slot__stats span { white-space: nowrap; }
/* 铭文区：复用储物 .inv-seal 印鉴 */
.cave-armor-slot__inscs {
    min-width: 0;
}
.cave-armor-slot__inscs.is-muted {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.cave-armor-slot__inscs .inv-seal-row {
    margin: 0;
}
.cave-armor-slot__inscs .inv-seal {
    /* 甲架 2 列窄卡：印鉴可略紧 */
    max-width: 100%;
}
/* 底部 */
.cave-armor-slot__foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: var(--space-2);
    min-height: 22px;
}
.cave-armor-slot__type {
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 0.3px;
    margin-right: auto;
}
.cave-armor-slot__remove {
    font-size: var(--font-micro);
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--accent-crimson) 30%, transparent);
    background: transparent;
    color: var(--accent-crimson);
    font-family: var(--font-serif, serif);
    cursor: pointer;
    line-height: 1.5;
}

.cave-field-meta {
    color: var(--text-muted);
    font-size: var(--font-caption);
    margin: var(--space-4) 0 0;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== 洞府 workbench v6（对齐储物 / 坊市）=====
   外层 #cavePanel.cave-workbench 已 padding:0；标题册封条与 inventory/market 同参。 */
#cavePanel.cave-workbench,
#cavePanel.cave-wb-shell {
    background: var(--bg-panel);
    padding: 0;
}
/* 标题区：已迁 gc-panel-head（gc-rule + gc-title + 副题 + 右上操作组），
   布局由 game-panels.css 的公共 workbench 壳适配接管；此处只保 chip/sub 与按钮样式 */
#caveContent .cave-workbench__chip {
    display: inline-flex;
    align-items: center;
    align-self: center;
    height: 22px;
    padding: 0 var(--space-8);
    margin: 0;
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 35%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    color: var(--text-gold);
    font-size: var(--font-micro);
    font-weight: 700;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
}
#cavePanel.cave-workbench .cave-workbench__sub,
#caveContent .cave-workbench__sub {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 0;
    margin: 0;
}
/* 头部单行:标题+品阶章居左,拜访/说明/× 靠右同排(替代旧的多行堆叠) */
#cavePanel.cave-workbench .cave-workbench__header .cave-workbench__row,
#caveContent .cave-workbench__header .cave-workbench__row {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-width: 0;
}
/* 洞府头嵌在 #caveContent 内,吃不到 .gc-panel > .gc-panel-head 基类——册封条与标题在 cave 作用域补齐 */
#cavePanel.cave-workbench .cave-workbench__header .gc-rule,
#caveContent .cave-workbench__header .gc-rule {
    width: 36px;
    height: 3px;
    border-radius: var(--radius-pill);
    margin-bottom: var(--space-6);
    background: var(--gc-tone, var(--accent-gold));
}
/* × 在 cave 头部随行内排布:取消全局 .gc-panel-close 的右上绝对定位
   (全局取消规则只认「操作组为 gc-panel-head 直接子节点」的旧结构) */
#cavePanel.cave-workbench .cave-workbench__header .gc-panel-close,
#caveContent .cave-workbench__header .gc-panel-close {
    position: static;
    top: auto;
    right: auto;
}
/* 头部左右与 chrome(状态卡) 12px 对齐:右侧 48px 是旧绝对定位 × 的遗留预留 */
#cavePanel.cave-workbench .cave-workbench__header,
#caveContent .cave-workbench__header {
    padding-right: var(--space-12);
    padding-left: var(--space-12);
}
#cavePanel.cave-workbench .cave-workbench__header .gc-title,
#caveContent .cave-workbench__header .gc-title {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    min-width: 0;
    font-size: var(--font-heading);
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--text-primary);
    line-height: 1.35;
}
#cavePanel.cave-workbench .cave-workbench__header .cave-workbench__sub,
#caveContent .cave-workbench__header .cave-workbench__sub {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#cavePanel.cave-workbench .cave-workbench__header-actions,
#caveContent .cave-workbench__header-actions {
    display: inline-flex;
    align-items: center;
    align-self: center;
    gap: var(--space-6);
    margin-left: auto;
    margin-bottom: 0;
    flex: none;
}
#cavePanel.cave-workbench .cave-tool-btn,
#cavePanel.cave-workbench .cave-workbench__header-actions .btn-panel-close {
    box-sizing: border-box;
    height: 30px;
    min-height: 30px;
    border-radius: var(--radius-md);
    border: 1px solid color-mix(in srgb, var(--border-color) 90%, transparent);
    background: transparent;
    color: var(--text-secondary);
    font-family: inherit;
    cursor: pointer;
    transition: border-color .12s, color .12s, background .12s;
}
#cavePanel.cave-workbench .cave-tool-btn {
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
    font-weight: 600;
}
#cavePanel.cave-workbench .cave-workbench__header-actions .btn-panel-close {
    width: 30px;
    min-width: 30px;
    margin-left: 0;
    padding: 0;
    font-size: var(--font-action);
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#cavePanel.cave-workbench .cave-tool-btn:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent);
    color: var(--text-gold);
}
#cavePanel.cave-workbench .cave-workbench__header-actions .btn-panel-close:hover {
    color: var(--accent-crimson);
    border-color: color-mix(in srgb, var(--accent-crimson) 36%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 7%, transparent);
}

/* ── 顶栏气机笺（统一 place + 三加成）──
   一张软卡 + 芯片 + 三列数值；无左轨 / 无通栏顶装饰 */
#caveContent .cw-status {
    border: 1px solid var(--cw-line, var(--border-color));
    border-radius: var(--cw-radius, var(--radius-md));
    background: var(--cw-raised, var(--bg-card));
    padding: var(--space-12) var(--space-12) var(--space-10);
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}
#caveContent .cw-status__head {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-width: 0;
}
#caveContent .cw-status__title-row {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-width: 0;
}
#caveContent .cw-status__name {
    margin: 0;
    min-width: 0;
    flex: 1;
    font-family: var(--font-serif);
    font-size: var(--font-action);
    font-weight: 600;
    letter-spacing: 0.12em;
    color: var(--text-primary);
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* 安好：轻印章，非实心块 */
#caveContent .cw-status__stamp {
    flex: none;
    height: 20px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-jade) 38%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    color: var(--text-jade);
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 18px;
}
#caveContent .cw-status__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    min-width: 0;
}
#caveContent .cw-status__chip {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--border-color) 90%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
    color: var(--text-secondary);
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#caveContent .cw-status__chip--jade {
    border-color: color-mix(in srgb, var(--accent-jade) 32%, transparent);
    color: var(--text-jade);
    background: color-mix(in srgb, var(--accent-jade) 7%, transparent);
}
#caveContent .cw-status__chip--gold {
    border-color: color-mix(in srgb, var(--accent-gold) 36%, transparent);
    color: var(--text-gold);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}
#caveContent .cw-status__desc {
    margin: 0;
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-muted);
    text-wrap: wrap;
}
/* 三加成：同卡内分栏，列间细线为结构分隔（非左轨装饰） */
#caveContent .cw-status__bonuses {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: var(--space-8);
    padding-top: var(--space-8);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 75%, transparent);
}
#caveContent .cw-status__bonus {
    text-align: center;
    padding: 0 var(--space-4);
    min-width: 0;
}
#caveContent .cw-status__bonus + .cw-status__bonus {
    border-left: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
}
#caveContent .cw-status__bonus-v {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-title);
    font-weight: 700;
    color: var(--text-gold);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}
/* #6235：部分衬线/宋体环境下 % 字形异常，走共享 --font-sans */
#caveContent .cw-pct,
#caveContent .cw-status__bonus-v .cw-pct,
#caveContent .cw-metric__v .cw-pct {
    font-family: var(--font-sans);
    font-weight: 600;
    letter-spacing: 0;
    margin-left: 0.02em;
}
#caveContent .cw-status__bonus-v.is-purple { color: var(--accent-purple); }
#caveContent .cw-status__bonus-v.is-jade { color: var(--accent-jade); }
#caveContent .cw-status__bonus-l {
    margin-top: var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 0.08em;
    line-height: 1.3;
}

/* 未开辟等场景的轻 place 行（仍用旧 caveHeader） */
#caveContent .cw-place {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--cw-line, var(--border-color));
    border-radius: var(--cw-radius, var(--radius-md));
    background: var(--cw-raised, var(--bg-card));
}
#caveContent .cw-place__main { min-width: 0; flex: 1; }
#caveContent .cw-place__name {
    font-family: var(--font-serif);
    font-size: var(--font-body-lg);
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--text-primary);
    line-height: 1.3;
}
#caveContent .cw-place__meta {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.45;
}
#caveContent .cw-place__meta--desc {
    margin-top: var(--space-4);
}
#caveContent .cw-place__ok {
    flex: none;
    height: 20px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-jade) 38%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    color: var(--text-jade);
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 18px;
}

/* 胶囊 Tab（对齐坊市 market-tab） */
#cavePanel.cave-workbench .cave-workbench__tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-6);
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
#cavePanel.cave-workbench .cave-workbench__tabs::-webkit-scrollbar { display: none; }
#cavePanel.cave-workbench .cave-tab {
    flex: 0 0 auto;
    height: 30px;
    min-height: 30px;
    padding: 0 var(--space-12);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
    background: transparent;
    color: var(--text-secondary);
    font-size: var(--font-label);
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: var(--space-6);
    white-space: nowrap;
    transition: border-color .12s, color .12s, background .12s;
}
#cavePanel.cave-workbench .cave-tab:hover {
    border-color: color-mix(in srgb, var(--accent-jade) 35%, var(--border-color));
    color: var(--text-jade);
    background: transparent;
}
#cavePanel.cave-workbench .cave-tab.active {
    border-color: color-mix(in srgb, var(--accent-jade) 48%, transparent);
    color: var(--text-jade);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}
#cavePanel.cave-workbench .cave-tab__dot {
    min-width: 16px;
    height: 16px;
    padding: 0 var(--space-4);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    background: color-mix(in srgb, var(--accent-crimson) 14%, transparent);
    color: var(--accent-crimson);
}

/* 阵法卡（圆角基准 8px = --cw-radius） */
#caveContent .cw-fm-sum {
    padding: var(--space-8) var(--space-12);
    border-radius: var(--cw-radius, var(--radius-md));
    font-size: var(--font-label);
    line-height: 1.5;
    border: 1px solid color-mix(in srgb, var(--accent-jade) 28%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 6%, var(--bg-card));
    color: var(--text-secondary);
    margin-bottom: var(--space-8);
}
#caveContent .cw-fm-sum b { color: var(--text-jade); font-weight: 700; }
#caveContent .cw-fm-sum.is-muted {
    border-color: var(--border-color);
    background: var(--bg-card);
    color: var(--text-muted);
}
#caveContent .cw-fm-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
#caveContent .cw-fm-row {
    padding: var(--space-12) var(--space-12);
    border-radius: var(--cw-radius, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
#caveContent .cw-fm-row.is-on {
    border-color: color-mix(in srgb, var(--accent-jade) 42%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 5%, var(--bg-card));
}
#caveContent .cw-fm-row__top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-6) var(--space-8);
}
#caveContent .cw-fm-row__name {
    font-family: var(--font-serif);
    font-size: var(--font-body-lg);
    font-weight: 600;
    color: var(--text-primary);
}
#caveContent .cw-fm-row__fx {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}
#caveContent .cw-fm-row__mat {
    font-size: var(--font-micro);
    color: var(--text-muted);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--cw-radius, var(--radius-md));
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
    border: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
}
#caveContent .cw-fm-row__mat.is-lack {
    color: var(--accent-crimson);
    border-color: color-mix(in srgb, var(--accent-crimson) 28%, transparent);
}
#caveContent .cw-fm-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--space-4);
}

/* ===== 洞府工作台族 v5（储物工作台 + 决战台，无左轨）=====
   外层 #cavePanel.cave-wb-shell 已 padding:0；间距只由 header / scroll 内边距承担。 */
#cavePanel.cave-wb-shell {
    background: var(--bg-panel);
}
#caveContent.cave-list,
#caveContent {
    --cw-line: color-mix(in srgb, var(--border-color) 82%, transparent);
    --cw-line-strong: color-mix(in srgb, var(--accent-gold) 38%, var(--border-color));
    --cw-surface: var(--bg-panel);
    --cw-raised: var(--bg-card);
    --cw-ease: cubic-bezier(.2, .8, .2, 1);
    /* 与储物/坊市册封条水平 12px 对齐 */
    --cw-pad-x: 12px;
    /* 面圆角统一 8px（与阵法 .cw-fm-row 一致）；胶囊/圆钮仍用 999px */
    --cw-radius: var(--radius-md);
    gap: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
    overflow: hidden;
    background: var(--cw-surface);
    font-family: var(--font-serif);
}
#caveContent .cw-card,
#caveContent .cw-empty,
#caveContent .cw-metric,
#caveContent .cw-choice,
#caveContent .cw-facility,
#caveContent .cw-fm-sum,
#caveContent .cw-fm-row,
#caveContent .cw-fm-row__mat,
#caveContent .cw-field,
#caveContent .cw-btn,
#caveContent .cw-seek-input,
#caveContent .cave-field-card,
#caveContent .cave-armor-slot {
    border-radius: var(--cw-radius);
}
#caveContent .cave-view.cave-wb,
#caveContent .cave-wb {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
    gap: 0;
    padding: 0;
}
/* 固定区：地脉摘要 + 指标 + Tab，不随内容滚动
   水平 12px 与册封条 / 储物 chrome 对齐 */
#caveContent .cave-wb__chrome {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    padding: var(--space-4) var(--space-12) var(--space-10);
    background: var(--cw-surface);
    border-bottom: 1px solid color-mix(in srgb, var(--cw-line) 70%, transparent);
    z-index: 2;
}
/* 仅 Tab 正文滚动；切 Tab 时顶部卡片始终可见 */
#caveContent .cave-wb__scroll {
    flex: 1;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--space-10) var(--space-12) var(--space-16);
    display: flex;
    flex-direction: column;
    gap: 0;
}
#caveContent .cave-tab-panel {
    display: flex;
    flex-direction: column;
    /* 区块之间 12px；块内由 .cw-block 管 6px */
    gap: var(--space-12);
    min-width: 0;
}
#caveContent .cw-block {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-width: 0;
}
/* 加载态也吃统一水平边距 */
#caveContent > p {
    margin: 0;
    padding: var(--space-16) var(--cw-pad-x) !important;
}

#caveContent .cw-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
}
#caveContent .cw-metrics--2x2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
#caveContent .cw-metrics--3mini {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
#caveContent .cw-metric__slash {
    margin: 0 var(--space-2);
    font-weight: 500;
    opacity: .55;
    font-size: var(--font-caption);
}
#caveContent .cw-metric {
    padding: var(--space-8) var(--space-4) var(--space-6);
    text-align: center;
    border: 1px solid var(--cw-line);
    border-radius: var(--radius-md);
    background: var(--cw-raised);
}
#caveContent .cw-metric__v {
    font-family: var(--font-mono);
    font-size: var(--font-action);
    font-weight: 700;
    color: var(--text-gold);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-metric__v--jade { color: var(--accent-jade); }
#caveContent .cw-metric__v--purple { color: var(--accent-purple); }
#caveContent .cw-metric__l {
    font-size: var(--font-micro);
    color: var(--text-muted);
    margin-top: var(--space-4);
    letter-spacing: 1px;
}

#caveContent .cw-sec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--text-gold);
    margin: 0;
}
#caveContent .cw-sec__right,
#caveContent .cw-sec__count { font-weight: 600; letter-spacing: 0; }
#caveContent .cw-sec__meta {
    font-size: var(--font-micro);
    font-weight: 500;
    letter-spacing: 0;
    color: var(--text-muted);
    text-align: right;
    line-height: 1.35;
}
#caveContent .cw-link {
    border: 0;
    background: none;
    color: var(--accent-jade);
    font: inherit;
    font-size: var(--font-caption);
    font-weight: 600;
    cursor: pointer;
    letter-spacing: 0;
}
#caveContent .cw-sec__right {
    flex: none;
}
#caveContent .cw-help {
    flex: none;
    box-sizing: border-box;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text-gold);
    font: inherit;
    font-size: var(--font-label);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}
#caveContent .cw-risk-toggle {
    min-height: 44px;
    min-width: 44px;
    padding: 0 var(--space-8);
}
#caveContent .cw-stack { display: flex; flex-direction: column; gap: var(--space-6); }
#caveContent .cw-card {
    border: 1px solid var(--cw-line);
    border-radius: var(--cw-radius, var(--radius-md));
    background: var(--cw-raised);
    padding: var(--space-12) var(--space-12);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-primary) 2.5%, transparent);
}
#caveContent .cw-card--soft {
    background: color-mix(in srgb, var(--cw-raised) 90%, var(--cw-surface));
}
#caveContent .cw-card--todo {
    width: 100%;
    text-align: left;
    color: inherit;
    font: inherit;
    cursor: pointer;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-8);
    align-items: center;
    border-color: color-mix(in srgb, var(--accent-gold) 28%, var(--border-color));
    transition: border-color 140ms var(--cw-ease), background 140ms var(--cw-ease);
}
#caveContent .cw-card--todo:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 48%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--cw-raised));
}
#caveContent .cw-card__row {
    display: flex;
    align-items: center;
    gap: var(--space-6) var(--space-8);
    flex-wrap: wrap;
}
#caveContent .cw-card__name,
#caveContent .cw-card__t {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
}
#caveContent .cw-card__s {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
}
#caveContent .cw-card__go {
    font-size: var(--font-caption);
    font-weight: 700;
    color: var(--text-gold);
    white-space: nowrap;
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--accent-gold) 32%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}
#caveContent .cw-card__act {
    margin-left: auto;
    font-size: var(--font-micro);
    color: var(--text-muted);
    white-space: nowrap;
}
#caveContent .cw-pill {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--cw-line);
    font-size: var(--font-micro);
    font-weight: 600;
    color: var(--text-muted);
}
#caveContent .cw-pill--gold {
    border-color: color-mix(in srgb, var(--accent-gold) 38%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    color: var(--text-gold);
}
#caveContent .cw-pill--jade {
    border-color: color-mix(in srgb, var(--accent-jade) 38%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
    color: var(--accent-jade);
}
#caveContent .cw-pill--warn {
    border-color: color-mix(in srgb, var(--accent-crimson) 35%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 8%, transparent);
    color: var(--accent-crimson);
}
#caveContent .cw-empty {
    font-size: var(--font-label);
    color: var(--text-muted);
    text-align: center;
    padding: var(--space-12) var(--space-6);
    border: 1px dashed var(--cw-line);
    border-radius: var(--radius-md);
    background: var(--cw-raised);
    line-height: 1.6;
}
#caveContent .cw-hint {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}

/* —— 道侣 Tab —— */
#caveContent .cw-companion-hero {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    padding: var(--space-12);
    border-color: color-mix(in srgb, var(--accent-jade) 28%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-jade) 8%, var(--cw-raised)),
        var(--cw-raised)
    );
}
#caveContent .cw-companion-hero__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-10);
}
#caveContent .cw-companion-hero__who {
    min-width: 0;
}
#caveContent .cw-companion-hero__name {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-title);
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--text-primary);
    line-height: 1.25;
}
#caveContent .cw-companion-hero__meta {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
}
#caveContent .cw-companion-hero__pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: flex-end;
    flex: none;
}
#caveContent .cw-companion-hero .cw-metrics {
    margin: 0;
}
#caveContent .cw-msg-author {
    flex: none;
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-gold);
    margin-right: var(--space-6);
}
#caveContent .cw-log-row.is-mine .cw-msg-author {
    color: var(--text-jade);
}
#caveContent .cw-msg-body {
    min-width: 0;
    color: var(--text-primary);
    line-height: 1.45;
}
#caveContent .cw-msg-compose .cw-seek-row {
    margin-top: 0;
}
#caveContent .cw-log-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
}
#caveContent .cw-log-row__main {
    min-width: 0;
    font-size: var(--font-label);
    line-height: 1.45;
    color: var(--text-secondary);
    text-align: left;
}
#caveContent .cw-log-row__time {
    flex: none;
    font-size: var(--font-micro);
    color: var(--text-muted);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-card--invite {
    border-color: color-mix(in srgb, var(--accent-gold) 32%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-gold) 7%, var(--cw-raised)),
        var(--cw-raised)
    );
}
#caveContent .cw-btn-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    margin-top: 0;
}
#caveContent .cw-btn-row--tight {
    gap: var(--space-4);
}
#caveContent .cw-btn-row--tight .cw-btn {
    min-height: 28px;
    padding: 0 var(--space-10);
    font-size: var(--font-caption);
}
#caveContent .cw-btn {
    min-height: 32px;
    padding: 0 var(--space-12);
    border-radius: var(--cw-radius, var(--radius-md));
    border: 1px solid var(--cw-line);
    background: var(--cw-raised);
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-caption);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 140ms var(--cw-ease), color 140ms var(--cw-ease), filter 140ms var(--cw-ease);
}
#caveContent .cw-btn:hover:not(:disabled) {
    border-color: var(--cw-line-strong);
    color: var(--text-gold);
}
#caveContent .cw-btn:active:not(:disabled) { transform: scale(.985); }
#caveContent .cw-btn:disabled { opacity: .42; cursor: not-allowed; }
/* 扁平钮：color-mix 浅填 + 描边，无实心渐变主钮（对齐 dialog / workbench） */
#caveContent .cw-btn--primary {
    border: 1px solid color-mix(in srgb, var(--accent-jade) 48%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
    color: var(--text-jade);
    font-weight: 700;
    box-shadow: none;
}
#caveContent .cw-btn--primary:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--accent-jade) 62%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 16%, transparent);
    color: var(--text-jade);
}
#caveContent .cw-btn--gold {
    border-color: color-mix(in srgb, var(--accent-gold) 45%, transparent);
    color: var(--text-gold);
    font-weight: 700;
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
#caveContent .cw-btn--gold:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--accent-gold) 58%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 16%, transparent);
}
#caveContent .cw-btn--ghost { background: transparent; }
#caveContent .cw-btn--danger {
    border-color: color-mix(in srgb, var(--accent-crimson) 35%, transparent);
    color: var(--accent-crimson);
    background: color-mix(in srgb, var(--accent-crimson) 7%, transparent);
}
#caveContent .cw-btn--danger:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--accent-crimson) 50%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 12%, transparent);
    color: var(--accent-crimson);
}
#caveContent .cw-cost {
    margin-left: var(--space-4);
    font-size: var(--font-micro);
    opacity: .9;
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-metric-inline-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-12);
    margin-top: var(--space-4);
}
#caveContent .cw-metric-inline {
    display: inline-flex;
    align-items: baseline;
    gap: var(--space-4);
}
#caveContent .cw-metric-inline__l {
    font-size: var(--font-micro);
    color: var(--text-muted);
}
#caveContent .cw-metric-inline__v {
    font-family: var(--font-mono);
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-metric-inline__v.is-jade { color: var(--accent-jade); }

/* —— 设施 Tab：升级卡 / 蓄气条 / 摆设选择 ——
   侧栏默认 ~360px，升级卡一律单列，避免三列挤成「小药丸」 */
#caveContent .cw-facility-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}
#caveContent .cw-facility {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-12) var(--space-12) var(--space-12);
}
#caveContent .cw-facility__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-8);
}
#caveContent .cw-facility__title-wrap {
    min-width: 0;
}
#caveContent .cw-facility__title {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: 0.04em;
    line-height: 1.3;
}
#caveContent .cw-facility__level {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.35;
}
#caveContent .cw-facility__body {
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-secondary);
}
#caveContent .cw-facility__em {
    color: var(--text-gold);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-facility__meter {
    height: 6px;
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--text-primary) 6%, transparent);
    border: 1px solid var(--cw-line);
    overflow: hidden;
}
#caveContent .cw-facility__meter-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--accent-jade) 75%, transparent),
        var(--accent-jade)
    );
    transition: width 200ms var(--cw-ease);
}
#caveContent .cw-facility--ready {
    border-color: color-mix(in srgb, var(--accent-jade) 42%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-jade) 8%, var(--cw-raised)),
        var(--cw-raised)
    );
}
#caveContent .cw-facility--danger {
    border-color: color-mix(in srgb, var(--accent-crimson) 32%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-crimson) 7%, var(--cw-raised)),
        var(--cw-raised)
    );
}
#caveContent .cw-facility .cw-btn-row {
    margin-top: var(--space-2);
}
#caveContent .cw-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
}
@media (min-width: 560px) {
    #caveContent .cw-choice-grid {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    }
}
#caveContent .cw-choice {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
    min-height: 52px;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid var(--cw-line);
    background: var(--cw-raised);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 140ms var(--cw-ease), background 140ms var(--cw-ease), box-shadow 140ms var(--cw-ease);
}
#caveContent .cw-choice:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
#caveContent .cw-choice.is-on {
    border-color: color-mix(in srgb, var(--accent-jade) 48%, var(--border-color));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-jade) 12%, transparent),
        color-mix(in srgb, var(--accent-jade) 4%, var(--cw-raised))
    );
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-jade) 12%, transparent);
    cursor: default;
}
#caveContent .cw-choice.is-locked {
    opacity: 0.92;
}
#caveContent .cw-choice:disabled {
    cursor: default;
}
#caveContent .cw-choice__name {
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
}
#caveContent .cw-choice.is-on .cw-choice__name {
    color: var(--accent-jade);
}
#caveContent .cw-choice__meta {
    font-size: var(--font-micro);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
#caveContent .cw-choice.is-on .cw-choice__meta {
    color: color-mix(in srgb, var(--accent-jade) 75%, var(--text-muted));
    font-weight: 600;
}
#caveContent #caveArmorStandsAnchor {
    /* 作为 tab-panel 子级，与其它 .cw-block 同 12px 间距，不再叠 margin */
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}
#caveContent .cave-armor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
    align-items: start;
}
@media (max-width: 320px) {
    #caveContent .cave-armor-grid {
        grid-template-columns: 1fr;
    }
}
/* 甲架品质色：全边框语义，避免左轨色条 */
#caveContent .cave-armor-slot {
    border-left-width: 1px;
    border-color: color-mix(in srgb, var(--rarity-c, var(--border-color)) 55%, var(--border-color));
}
#caveContent .cave-armor-slot--empty {
    border-left-width: 1px;
    border-style: dashed;
}

/* 印信输入：单层 flex 行，去掉外框套内框 */
#caveContent .cw-field-lab {
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: .12em;
    color: var(--text-muted);
    margin: var(--space-2) 0 var(--space-6) var(--space-2);
}
#caveContent .cw-field-bar,
#caveContent .cw-seek-row {
    display: flex;
    align-items: stretch;
    gap: var(--space-6);
    flex-wrap: nowrap;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}
#caveContent .cw-field-bar .cw-field--grow,
#caveContent .cw-seek-row .cw-seek-input {
    flex: 1 1 auto;
    min-width: 0;
}
/* 寻觅道侣：扁平单行输入，与阵法卡同圆角 */
#caveContent .cw-seek-input {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    height: 34px;
    min-height: 34px;
    padding: 0 var(--space-12);
    border: 1px solid var(--cw-line);
    border-radius: var(--cw-radius, var(--radius-md));
    background: var(--cw-raised);
    color: var(--text-primary);
    font-family: var(--font-serif);
    font-size: var(--font-body);
    line-height: 34px;
    outline: none;
    transition: border-color 140ms var(--cw-ease), box-shadow 140ms var(--cw-ease);
}
#caveContent .cw-seek-input::placeholder {
    color: var(--text-muted);
    opacity: .85;
}
#caveContent .cw-seek-input:focus {
    border-color: color-mix(in srgb, var(--accent-gold) 55%, var(--border-color));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-gold) 12%, transparent);
}
#caveContent .cw-seek-row .cw-btn {
    height: 34px;
    min-height: 34px;
    align-self: center;
}
#caveContent .cw-field {
    --field-h: 34px;
    position: relative;
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1 1 120px;
    height: var(--field-h);
    max-height: var(--field-h);
    padding: 0 var(--space-10);
    box-sizing: border-box;
    border: 1px solid var(--cw-line);
    border-radius: var(--cw-radius, var(--radius-md));
    background: var(--cw-raised);
    box-shadow: none;
    transition: border-color 160ms var(--cw-ease), box-shadow 160ms var(--cw-ease), background 160ms var(--cw-ease);
}
#caveContent .cw-field:focus-within {
    border-color: color-mix(in srgb, var(--accent-gold) 55%, var(--border-color));
    background: var(--cw-raised);
    box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--accent-gold) 10%, transparent),
        0 0 0 3px color-mix(in srgb, var(--accent-gold) 14%, transparent);
}
#caveContent .cw-field--sm { flex: 0 0 72px; max-width: 80px; padding: 0 var(--space-6); }
#caveContent .cw-field--grow { flex: 1 1 160px; }
#caveContent .cw-field--select { padding-right: var(--space-32); }
/* 仅原生 select 时画容器箭头；FixedSelect 升级后由 .fx-select__btn::after 负责（见 game-base） */
#caveContent .cw-field--select:not(:has(.fx-select))::after {
    content: "";
    position: absolute;
    right: 11px;
    top: 50%;
    width: 0;
    height: 0;
    pointer-events: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid color-mix(in srgb, var(--accent-gold) 55%, var(--text-muted));
    transform: translateY(-35%);
    opacity: .75;
}
/* 洞府字段内 FixedSelect：无边框透明底，贴合 cw-field 壳 */
#caveContent .cw-field--select .fx-select {
    display: flex;
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    height: 100%;
    align-items: center;
    overflow: hidden;
}
#caveContent .cw-field--select .fx-select__btn {
    display: inline-flex;
    width: 100%;
    max-width: 100%;
    height: calc(var(--field-h, 34px) - 2px);
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--text-primary);
    font-family: var(--font-serif);
    font-size: var(--font-body);
    font-weight: 400;
    letter-spacing: .02em;
    overflow: hidden;
}
/* #6235：长灵种名必须在选择框内省略，禁止溢到数量/批量播种钮上叠字 */
#caveContent .cw-field--select .fx-select__label {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#caveContent .cw-field--select .fx-select.is-open .fx-select__btn {
    box-shadow: none;
    color: var(--text-gold);
}
#caveContent .cave-seed-stock-hint {
    margin: var(--space-4) 0 0;
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.4;
}
#caveContent .cw-field__control,
#caveContent .cw-field input,
#caveContent .cw-field select {
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    display: block;
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
    height: calc(var(--field-h) - 2px);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-primary);
    font-family: var(--font-serif);
    font-size: var(--font-body);
    font-weight: 400;
    letter-spacing: .02em;
    line-height: calc(var(--field-h) - 2px);
    outline: none;
}
#caveContent .cw-field input::placeholder { color: var(--text-muted); opacity: .85; }
#caveContent .cw-field input[type="number"] {
    -moz-appearance: textfield;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono);
    font-weight: 600;
}
#caveContent .cw-field input[type="number"]::-webkit-outer-spin-button,
#caveContent .cw-field input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
#caveContent .cw-field select {
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* 深色模式下 <option> 弹出层配色：
 * html.theme-dark 已声明 color-scheme: dark，主流桌面浏览器会按深色渲染 option。
 * 但部分移动 webview（微信/QQ/UC 等）对 color-scheme 不稳定，option 仍强制白底黑字
 * ——玩家反馈「洞府灵田种子选择一片白」。这里显式给 option 写深色背景+浅色字兜底。
 * Chrome/Safari/Firefox 桌面端都支持给 option 设背景色；少数旧 webview 仍会忽略，但已覆盖大多数场景。
 */
html.theme-dark #caveContent .cw-field select option,
html.theme-dark #caveContent select.cw-field__control option {
    background: var(--bg-card, #1f2429);
    color: var(--text-primary, #e8e4d8);
}
html.theme-dark #caveContent .cw-field select option:checked,
html.theme-dark #caveContent select.cw-field__control option:checked {
    /* :checked 在某些浏览器表现为「高亮项」，用金色淡底与字色区分 */
    background: color-mix(in srgb, var(--accent-gold, #b8945a) 22%, var(--bg-card, #1f2429));
    color: var(--text-gold, #d8c896);
}
#caveContent .cw-field-bar .cw-btn {
    height: 34px;
    min-height: 34px;
    align-self: center;
}
@media (max-width: 360px) {
    #caveContent .cw-seek-row,
    #caveContent .cw-field-bar {
        flex-wrap: wrap;
    }
    #caveContent .cw-seek-row .cw-btn,
    #caveContent .cw-field-bar .cw-btn {
        flex: 1 1 calc(50% - 4px);
    }
}

/* 灵田：工具条 + 田格同属 .cw-stack，块内 6px */
#caveContent .cave-field-block {
    gap: var(--space-8);
}
#caveContent .cave-field-batch {
    /* 四钮一排在 360 宽仍可读；允许换行 */
    flex-wrap: wrap;
}
#caveContent .cave-field-batch .cw-btn {
    flex: 1 1 calc(50% - 4px);
    min-width: 0;
}
#caveContent .cave-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
    margin-top: 0;
}
#caveContent .cave-field-card {
    border: 1px solid var(--cw-line);
    border-radius: var(--cw-radius, var(--radius-md));
    padding: var(--space-8);
    background: var(--cw-raised);
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-height: 0;
}
#caveContent .cave-field-card--mature {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 7%, var(--cw-raised));
}
#caveContent .cave-field-card--planted {
    border-color: color-mix(in srgb, var(--accent-jade) 36%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 6%, var(--cw-raised));
}
#caveContent .cave-field-card--idle {
    border-style: dashed;
    min-height: 88px;
}
#caveContent .cave-field-idle-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    flex: 1;
    justify-content: flex-end;
}
#caveContent .cave-field-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    font-size: var(--font-caption);
    line-height: 1.2;
}
#caveContent .cave-field-head b {
    font-size: var(--font-caption);
    font-weight: 700;
    color: var(--text-secondary);
    letter-spacing: .04em;
}
#caveContent .cave-field-stamps {
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: flex-end;
}
#caveContent .cave-stamp {
    display: inline-flex;
    align-items: center;
    height: 16px;
    padding: 0 var(--space-6);
    border-radius: var(--radius-xs);
    font-size: var(--font-micro);
    font-weight: 800;
    border: 1px solid var(--cw-line);
    color: var(--text-muted);
    background: color-mix(in srgb, var(--cw-surface) 60%, transparent);
}
#caveContent .cave-stamp--ready {
    color: var(--accent-orange, #c47a22);
    border-color: color-mix(in srgb, var(--accent-orange, #c47a22) 40%, transparent);
    background: color-mix(in srgb, var(--accent-orange, #c47a22) 10%, transparent);
}
#caveContent .cave-stamp--grow {
    color: var(--accent-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 35%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}
#caveContent .cave-stamp--guard {
    color: var(--accent-purple);
    border-color: color-mix(in srgb, var(--accent-purple) 35%, transparent);
    background: color-mix(in srgb, var(--accent-purple) 8%, transparent);
}
#caveContent .cave-stamp--nourish {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 35%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}
#caveContent .cave-field-crop {
    margin: 0;
    font-size: var(--font-body);
    line-height: 1.25;
}
#caveContent .cave-field-crop b {
    color: var(--text-primary);
    font-weight: 700;
}
#caveContent .cave-field-meta {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.35;
}
#caveContent .cave-field-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
    margin-top: auto;
}
#caveContent .cave-field-actions--single {
    grid-template-columns: 1fr;
}
#caveContent .cave-field-actions .cw-btn {
    min-height: 28px;
    padding: 0 var(--space-6);
    font-size: var(--font-caption);
    width: 100%;
}
#caveContent .cave-field-expand {
    margin-top: var(--space-2);
}
#caveContent .cave-field-summary {
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.45;
}
#caveContent .cw-field-lab {
    margin-bottom: var(--space-4);
}
@media (max-width: 360px) {
    #caveContent .cave-field-grid {
        grid-template-columns: 1fr;
    }
}

/* ═══ 装备破损感知 · B 破损清单台（wr-dialog · 单装/一键同族）═══
   橙=破损 · 金=灵石 · 翠=足够 · 朱=不足；无左轨/顶条，对齐诊脉笺密度 */
.gc-dialog.wr-dialog {
    --wr-accent: var(--accent-orange, #c47a2c);
    --wr-soft: rgba(196, 122, 44, 0.28);
    --wr-bg: rgba(196, 122, 44, 0.07);
    --wr-bar: linear-gradient(90deg, #c47a2c, #d4a06a);
    max-width: 392px;
}
html.theme-dark .gc-dialog.wr-dialog {
    --wr-accent: var(--accent-orange, #c9a06a);
    --wr-soft: rgba(201, 160, 106, 0.30);
    --wr-bg: rgba(201, 160, 106, 0.08);
    --wr-bar: linear-gradient(90deg, #a87848, #c9a06a);
}
.gc-dialog.wr-dialog[data-tone="danger"] {
    --gc-tone: var(--accent-crimson);
}
.gc-dialog.wr-dialog[data-tone="warn"],
.gc-dialog.wr-dialog[data-tone="gold"] {
    --gc-tone: var(--wr-accent);
}
.gc-dialog.wr-dialog .gc-rule {
    background: var(--wr-accent);
}
.wr-modal-overlay.ui-scrollable-modal .modal-content.gc-dialog.wr-dialog,
.ui-scrollable-modal .modal-content.modal--decorated.gc-dialog.wr-dialog,
.modal-content.modal--decorated.gc-dialog.wr-dialog {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: min(85dvh, 680px, calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 16px)));
    overflow: hidden;
}
.gc-dialog.wr-dialog .gc-mid.wr-mid,
.gc-dialog.wr-dialog .wr-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: left;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.gc-dialog.wr-dialog .gc-mid.wr-mid::-webkit-scrollbar,
.gc-dialog.wr-dialog .wr-mid::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.gc-dialog.wr-dialog .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline);
    flex-shrink: 0;
}
.gc-dialog.wr-dialog .gc-rule {
    width: 32px;
    height: 2.5px;
    margin-bottom: var(--space-10);
}
.gc-dialog.wr-dialog .gc-title {
    font-size: var(--pattern-dialog-title-size);
}
.gc-dialog.wr-dialog .gc-foot,
.gc-dialog.wr-dialog .gc-foot.modal-btn-row {
    margin-top: var(--space-4);
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
}

/* 顶三格汇总 */
.wb-sum {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-6);
    margin-bottom: var(--space-10);
}
.wb-sum__cell {
    padding: var(--space-8) var(--space-6);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    text-align: center;
}
.wb-sum__k {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
}
.wb-sum__v {
    margin-top: var(--space-4);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-body-lg);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}
.wb-sum__v.is-wear { color: var(--wr-accent, var(--accent-orange)); }
.wb-sum__v.is-ok { color: var(--text-jade, var(--accent-jade)); }
.wb-sum__v.is-bad { color: var(--text-red, var(--accent-crimson)); }

/* 编号清单 */
.wb-list {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
    overflow: hidden;
    margin-bottom: var(--space-8);
}
.wb-item {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: var(--space-6) var(--space-8);
    align-items: center;
    padding: var(--space-10) var(--space-10);
    border-top: 1px solid var(--border-color);
}
.wb-item.is-checkable {
    grid-template-columns: 22px minmax(0, 1fr) auto;
    cursor: pointer;
}
.wb-item.is-checkable .wb-item__check {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--wr-accent, var(--accent-orange));
}
.wb-item.is-off {
    opacity: 0.45;
}
.wb-item:first-child { border-top: 0; }
.wb-item__idx {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-caption);
    font-weight: 700;
    color: var(--wr-accent, var(--accent-orange));
    background: var(--wr-bg, rgba(196, 122, 44, 0.07));
    border: 1px solid var(--wr-soft, rgba(196, 122, 44, 0.28));
}
.wb-item__name {
    font-size: var(--font-body);
    font-weight: 600;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wb-item__meta {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6) var(--space-8);
}
.wb-item__meta em {
    font-style: normal;
    color: var(--wr-accent, var(--accent-orange));
    font-weight: 600;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-variant-numeric: tabular-nums;
}
.wb-item__cost {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.wb-item__bar {
    grid-column: 2 / -1;
    height: 3px;
    border-radius: var(--radius-pill);
    background: rgba(42, 42, 38, 0.08);
    overflow: hidden;
}
html.theme-dark .wb-item__bar {
    background: rgba(255, 255, 255, 0.06);
}
.wb-item__fill {
    height: 100%;
    border-radius: var(--radius-pill);
    background: var(--wr-bar, linear-gradient(90deg, #c47a2c, #d4a06a));
    max-width: 100%;
}

/* 单装焦点卡 */
.wb-focus {
    margin-bottom: var(--space-10);
    padding: var(--space-14) var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid var(--wr-soft, rgba(196, 122, 44, 0.28));
    background: var(--wr-bg, rgba(196, 122, 44, 0.07));
    text-align: center;
}
.wb-focus__slot {
    font-size: var(--font-micro);
    letter-spacing: 2px;
    color: var(--text-muted);
}
.wb-focus__name {
    margin-top: var(--space-4);
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-heading);
    letter-spacing: 1px;
    font-weight: 600;
    color: var(--text-primary);
}
.wb-focus__wear {
    margin-top: var(--space-10);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-hero-lg);
    font-weight: 700;
    color: var(--wr-accent, var(--accent-orange));
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.wb-focus__wear span {
    font-size: var(--font-body-lg);
    color: var(--text-muted);
    margin-left: var(--space-2);
    font-weight: 600;
}
.wb-focus__bar {
    margin: var(--space-10) auto 0;
    max-width: 200px;
    height: 8px;
    border-radius: var(--radius-xs);
    background: rgba(42, 42, 38, 0.08);
    overflow: hidden;
}
html.theme-dark .wb-focus__bar {
    background: rgba(255, 255, 255, 0.06);
}
.wb-focus__fill {
    height: 100%;
    border-radius: var(--radius-xs);
    background: var(--wr-bar, linear-gradient(90deg, #c47a2c, #d4a06a));
    max-width: 100%;
}
.wb-focus__loss {
    margin-top: var(--space-8);
    font-size: var(--font-label);
    color: var(--text-red, var(--accent-crimson));
    font-weight: 600;
}

.wb-note {
    margin: 0 0 var(--space-6);
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-muted);
    text-align: center;
}
.wb-warn {
    margin-bottom: var(--space-8);
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    text-align: center;
    font-size: var(--font-caption);
    font-weight: 600;
    line-height: 1.45;
    color: var(--accent-crimson);
    background: rgba(183, 58, 49, 0.08);
    border: 1px solid rgba(183, 58, 49, 0.28);
}
html.theme-dark .wb-warn {
    background: rgba(197, 124, 114, 0.10);
    border-color: rgba(197, 124, 114, 0.32);
}

/* ═══════════════════════════════════════════════════════════════
   温养灵兽蛋 tab · 复用 workbench .card / .btn / .sec-h / .chip-kind
   仅新增 .pet-inc-* 温养专属组件(对齐洞府 cw-status / cw-facility 视觉语言):
   - 克制:6px 细进度条、20px 印章/标签、color-mix 浅填、无光晕无动画
   - 三态差异化只改边框/底色,不动 .card 结构
   ═══════════════════════════════════════════════════════════════ */

#petTabContentIncubate .pet-inc-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: var(--space-10) var(--space-12) var(--space-16);
}

/* ─── 温养槽 hero 卡 ─── */
#petTabContentIncubate .pet-inc-hero {
    padding: var(--space-12) var(--space-12);
}
#petTabContentIncubate .pet-inc-hero__head {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-6);
    min-width: 0;
}
#petTabContentIncubate .pet-inc-hero__name {
    margin: 0;
    flex: 1;
    min-width: 0;
    font-family: var(--font-serif);
    font-size: var(--font-action);
    font-weight: 600;
    letter-spacing: 0.12em;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 品阶标签(20px 胶囊,对齐 cw-status__stamp) */
#petTabContentIncubate .pet-inc-hero__grade {
    flex: none;
    height: 20px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid;
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 18px;
    white-space: nowrap;
}
#petTabContentIncubate .pet-inc-hero__grade--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 38%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
#petTabContentIncubate .pet-inc-hero__grade--purple {
    color: var(--text-purple);
    border-color: color-mix(in srgb, var(--accent-purple) 38%, transparent);
    background: color-mix(in srgb, var(--accent-purple) 10%, transparent);
}
#petTabContentIncubate .pet-inc-hero__grade--jade {
    color: var(--text-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 38%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}
#petTabContentIncubate .pet-inc-hero__grade--gray {
    color: var(--text-muted);
    border-color: var(--border-color);
    background: color-mix(in srgb, var(--text-primary) 4%, transparent);
}

/* 状态印章(温养中/待破壳/等候入蛋) */
#petTabContentIncubate .pet-inc-stamp {
    flex: none;
    height: 20px;
    padding: 0 var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid;
    font-size: var(--font-micro);
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 18px;
    white-space: nowrap;
}
#petTabContentIncubate .pet-inc-stamp--jade {
    color: var(--text-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 38%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}
#petTabContentIncubate .pet-inc-stamp--warn {
    color: var(--text-orange);
    border-color: color-mix(in srgb, var(--accent-orange) 42%, transparent);
    background: color-mix(in srgb, var(--accent-orange) 10%, transparent);
}
#petTabContentIncubate .pet-inc-stamp--muted {
    color: var(--text-muted);
    border-color: var(--border-color);
    background: transparent;
}

/* 进度条(6px 细条,对齐 cw-facility__meter) */
#petTabContentIncubate .pet-inc-meter {
    height: 6px;
    border-radius: var(--radius-pill);
    background: color-mix(in srgb, var(--text-primary) 6%, transparent);
    border: 1px solid var(--border-color);
    overflow: hidden;
    margin: var(--space-8) 0 var(--space-4);
}
#petTabContentIncubate .pet-inc-meter__fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--accent-jade) 75%, transparent),
        var(--accent-jade));
    transition: width 0.4s ease;
}
#petTabContentIncubate .pet-inc-meter__fill--gold {
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--accent-gold) 75%, transparent),
        var(--accent-gold));
}
#petTabContentIncubate .pet-inc-meter__fill--full {
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--accent-orange) 70%, transparent),
        var(--accent-orange));
}

/* 进度数字行 */
#petTabContentIncubate .pet-inc-meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}
#petTabContentIncubate .pet-inc-meta__em {
    color: var(--text-gold);
    font-weight: 700;
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
}
#petTabContentIncubate .pet-inc-meta__pct {
    font-family: var(--font-mono);
    font-size: var(--font-caption);
    color: var(--text-secondary);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* 提示行 */
#petTabContentIncubate .pet-inc-note {
    margin: var(--space-6) 0 var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.65;
}
#petTabContentIncubate .pet-inc-note b {
    color: var(--text-secondary);
    font-weight: 600;
}
#petTabContentIncubate .pet-inc-note--warn {
    color: var(--text-orange);
}
#petTabContentIncubate .pet-inc-note--warn b {
    color: var(--text-orange);
}

/* 三态 hero 卡的边框/底色差异化(抄 cw-facility--ready / cave-field-card--idle) */
#petTabContentIncubate .pet-inc-hero--pending {
    border-color: color-mix(in srgb, var(--accent-orange) 42%, var(--border-color));
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--accent-orange) 7%, var(--bg-card)),
        var(--bg-card));
}
#petTabContentIncubate .pet-inc-hero--empty {
    border-style: dashed;
    border-color: color-mix(in srgb, var(--accent-gold) 30%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 3%, var(--bg-card));
    text-align: center;
}
#petTabContentIncubate .pet-inc-hero--empty .pet-inc-hero__head {
    justify-content: center;
}
#petTabContentIncubate .pet-inc-hero--empty .pet-inc-hero__name {
    color: var(--text-secondary);
    flex: none;
}

/* ─── 队列(每颗蛋一张 .card 紧凑变体)─── */
#petTabContentIncubate .pet-inc-queue {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
#petTabContentIncubate .pet-inc-qcard {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-10);
    background: var(--bg-panel);
    margin-bottom: 0;
}
#petTabContentIncubate .pet-inc-qcard.is-next {
    border-color: var(--border-gold);
    background: color-mix(in srgb, var(--accent-gold) 5%, var(--bg-panel));
}
#petTabContentIncubate .pet-inc-qcard__rank {
    flex: none;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    font-family: var(--font-mono);
    font-size: var(--font-micro);
    color: var(--text-muted);
}
#petTabContentIncubate .pet-inc-qcard.is-next .pet-inc-qcard__rank {
    background: var(--gradient-gold);
    border-color: var(--border-gold);
    color: var(--text-gold);
    font-weight: 700;
}
#petTabContentIncubate .pet-inc-qcard__name {
    flex: 1;
    min-width: 0;
    font-size: var(--font-label);
    font-weight: 600;
    letter-spacing: 0.04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#petTabContentIncubate .pet-inc-qcard__ops {
    flex: none;
    display: flex;
    gap: var(--space-4);
}
#petTabContentIncubate .pet-inc-qcard__op {
    width: 22px;
    height: 22px;
    padding: 0;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    font-size: var(--font-caption);
    line-height: 1;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    transition: color 0.12s, border-color 0.12s;
}
#petTabContentIncubate .pet-inc-qcard__op:hover:not(:disabled) {
    color: var(--text-gold);
    border-color: var(--border-gold);
}
#petTabContentIncubate .pet-inc-qcard__op:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}
/* 置顶：略强调金色，与上下移区分（#5951） */
#petTabContentIncubate .pet-inc-qcard__op--pin {
    width: 24px;
    font-size: var(--font-micro);
    letter-spacing: 0;
}
#petTabContentIncubate .pet-inc-qcard__op--pin:hover:not(:disabled) {
    color: var(--text-gold);
    border-color: var(--border-gold);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
#petTabContentIncubate .pet-inc-qcard__op--cancel:hover:not(:disabled) {
    color: var(--text-orange);
    border-color: color-mix(in srgb, var(--accent-orange) 40%, transparent);
}

/* ─── 待检视幼兽（蛋侧，破壳后手动转入兽袋）─── */
/* #6971：标题与入袋/放生成组，说明单独一行，避免窄屏把按钮拆到说明旁 */
#petTabContentIncubate .pet-hatchling-head {
    margin-top: var(--space-8);
    flex-wrap: nowrap;
    gap: var(--space-8);
}
#petTabContentIncubate .pet-hatchling-head .sec-t {
    min-width: 0;
    flex: 1;
}
#petTabContentIncubate .pet-hatchling-head__ops {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    flex: none;
}
#petTabContentIncubate .pet-hatchling-head__hint {
    margin: 0 0 var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
}
#petTabContentIncubate .pet-hatchling-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-top: var(--space-4);
}
/* #6373：按先天分组标题 */
#petTabContentIncubate .pet-hatchling-group {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
#petTabContentIncubate .pet-hatchling-group + .pet-hatchling-group {
    margin-top: var(--space-8);
    padding-top: var(--space-8);
    border-top: 1px solid color-mix(in srgb, var(--border-color) 80%, transparent);
}
#petTabContentIncubate .pet-hatchling-group__title {
    font-size: var(--font-label);
    font-weight: 700;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: var(--space-6);
}
#petTabContentIncubate .pet-hatchling-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
    margin: 0;
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 6%, var(--bg-card));
}
#petTabContentIncubate .pet-hatchling-card__main {
    min-width: 0;
    flex: 1;
}
#petTabContentIncubate .pet-hatchling-card__name {
    font-weight: 700;
    font-size: var(--font-body-lg);
    color: var(--text-primary);
    font-family: var(--font-serif);
}
#petTabContentIncubate .pet-hatchling-card__meta {
    margin-top: var(--space-4);
    font-size: var(--font-label);
    color: var(--text-secondary);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) 0;
}
#petTabContentIncubate .pet-hatchling-card__ops {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
#petTabContentIncubate .pet-hatchling-card__ops .btn {
    white-space: nowrap;
}

/* ===== 洞府灵沼(B 方向「灵沼即景」):场景 + 木牌钓点 + 岸上饵竿 + 水面判定 ===== */
#caveContent .pond {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    min-width: 0;
}

/* —— 场景 —— */
/* 静息/咬钩/结果同一高度,避免抛竿后底栏「收竿」被顶走(#9182) */
#caveContent .pond-scene {
    position: relative;
    height: 272px;
    border: 1px solid var(--cw-line);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-secondary) 35%, var(--bg-primary)) 0%,
        color-mix(in srgb, var(--bg-secondary) 12%, var(--bg-primary)) 33%,
        color-mix(in srgb, var(--accent-jade) 14%, var(--bg-primary)) 33.2%,
        color-mix(in srgb, var(--accent-jade) 26%, var(--bg-primary)) 100%
    );
}
#caveContent .pond-scene__cave {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 34%;
    pointer-events: none;
}
#caveContent .pond-scene__waterline {
    position: absolute;
    left: 0;
    right: 0;
    top: 33%;
    height: 0;
    border-top: 1px solid color-mix(in srgb, var(--accent-jade) 42%, transparent);
}
#caveContent .pond-scene__waterline::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -3px;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 6%, transparent);
}
#caveContent .pond-scene__drift {
    position: absolute;
    left: 0;
    top: calc(33% - 8px);
    width: calc(100% + 78px);
    height: 20px;
    animation: pondDriftX 26s linear infinite;
    opacity: .85;
}
@keyframes pondDriftX { from { transform: translateX(0); } to { transform: translateX(-78px); } }
#caveContent .pond-scene__bed {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 26px;
}

/* 水下鱼影(纯意象剪影,不带名——未钓获的鱼不剧透) */
#caveContent .pond-fish { position: absolute; z-index: 2; pointer-events: none; }
#caveContent .pond-fish svg { display: block; animation: pondFishBob 3.4s ease-in-out infinite; }
#caveContent .pond-fish--a { left: 14%; top: 56%; animation: pondFishA 16s ease-in-out infinite; }
#caveContent .pond-fish--b { left: 55%; top: 68%; animation: pondFishB 21s ease-in-out infinite; }
#caveContent .pond-fish--c { left: 30%; top: 82%; animation: pondFishC 25s ease-in-out infinite; }
@keyframes pondFishBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
@keyframes pondFishA { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(58px, -5px); } }
@keyframes pondFishB { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-64px, 4px); } }
@keyframes pondFishC { 0%, 100% { transform: translate(0, 2px); } 50% { transform: translate(44px, -3px); } }

/* 竿梢 + 垂线 + 浮漂 */
#caveContent .pond-rod {
    position: absolute;
    right: -6px;
    top: -4px;
    width: 55%;
    max-width: 214px;
    height: auto;
    pointer-events: none;
    z-index: 3;
}
#caveContent .pond-rodline {
    position: absolute;
    left: 70%;
    top: 20%;
    width: 0;
    height: 0;
    z-index: 3;
    transform-origin: 0 0;
    animation: pondSway 5.2s ease-in-out infinite;
    pointer-events: none;
}
@keyframes pondSway { 0%, 100% { transform: rotate(0deg); } 30% { transform: rotate(1.4deg); } 70% { transform: rotate(-1.1deg); } }
#caveContent .pond-rodline__line {
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 28px;
    background: color-mix(in srgb, var(--text-primary) 20%, transparent);
    transform: rotate(6deg);
    transform-origin: top;
}
#caveContent .pond-rodline__line::after {
    content: "";
    position: absolute;
    left: -2px;
    bottom: -2px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent-jade) 42%, transparent);
}
#caveContent .pond-bobber {
    position: absolute;
    left: -7px;
    top: 26px;
    z-index: 4;
    animation: pondBobIdle 3.8s ease-in-out infinite;
    transform-origin: 50% 30%;
}
@keyframes pondBobIdle { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(2px) rotate(1.6deg); } }
#caveContent .pond-bobber--biting { animation: pondBobBite .7s ease-in-out infinite; }
@keyframes pondBobBite {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    18% { transform: translateY(4px) rotate(-5deg); }
    36% { transform: translateY(2px) rotate(4deg); }
    54% { transform: translateY(5px) rotate(-3deg); }
    72% { transform: translateY(3px) rotate(3deg); }
}

/* 涟漪 */
#caveContent .pond-ring {
    position: absolute;
    left: 70%;
    top: 33%;
    width: 44px;
    height: 14px;
    margin: -7px 0 0 -22px;
    border: 1px solid color-mix(in srgb, var(--accent-jade) 42%, transparent);
    border-radius: 50%;
    pointer-events: none;
    animation: pondRipple 3.6s ease-out infinite;
}
#caveContent .pond-ring--gold {
    border-color: color-mix(in srgb, var(--accent-gold) 46%, transparent);
    width: 56px;
    height: 18px;
    margin: -9px 0 0 -28px;
    animation-duration: 1.6s;
}
#caveContent .pond-ring--big {
    width: 76px;
    height: 24px;
    margin: -12px 0 0 -38px;
}
@keyframes pondRipple {
    0% { transform: scale(.32); opacity: .9; }
    70% { opacity: .35; }
    100% { transform: scale(1.55); opacity: 0; }
}

/* 上鱼高潮:鱼跃剪影 + 金点水花 */
#caveContent .pond-leap {
    position: absolute;
    left: 70%;
    top: 33%;
    z-index: 5;
    pointer-events: none;
    animation: pondFishLeap 2.6s cubic-bezier(.3, .5, .4, 1) infinite;
}
@keyframes pondFishLeap {
    0% { transform: translate(14px, 64px) rotate(38deg); opacity: 0; }
    12% { opacity: 1; }
    46% { transform: translate(-58px, -52px) rotate(-16deg); opacity: 1; }
    62% { transform: translate(-86px, -38px) rotate(-4deg); opacity: 1; }
    100% { transform: translate(-128px, 42px) rotate(34deg); opacity: 0; }
}
#caveContent .pond-spot {
    position: absolute;
    left: 70%;
    top: 33%;
    width: 4px;
    height: 4px;
    margin: -2px 0 0 -2px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent-gold) 66%, transparent);
    pointer-events: none;
    animation: pondSpotFly .9s ease-out infinite;
}
@keyframes pondSpotFly {
    0% { transform: translate(0, 0) scale(1); opacity: 1; }
    100% { transform: translate(var(--dx, 14px), var(--dy, -26px)) scale(.4); opacity: 0; }
}

/* —— 木牌(钓点下拉入口) —— */
#caveContent .pond-plaque {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 6;
    max-width: 62%;
    background: var(--bg-card);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-sm);
    padding: 7px 12px 8px;
    box-shadow: 0 2px 8px rgba(42, 42, 38, .06);
}
#caveContent .pond-plaque::before,
#caveContent .pond-plaque::after {
    content: "";
    position: absolute;
    top: -11px;
    width: 1px;
    height: 12px;
    background: color-mix(in srgb, var(--text-primary) 20%, transparent);
}
#caveContent .pond-plaque::before { left: 22px; transform: rotate(9deg); }
#caveContent .pond-plaque::after { right: 22px; transform: rotate(-9deg); }
#caveContent .pond-plaque__row { display: flex; align-items: baseline; gap: var(--space-4); min-width: 0; }
#caveContent .pond-plaque__name,
#caveContent .pond-plaque .fx-select__btn {
    border: 0;
    background: none;
    padding: 0;
    min-width: 0;
    box-shadow: none;
    font-family: var(--font-display, var(--font-serif));
    font-size: var(--font-title);
    letter-spacing: 2px;
    line-height: 1.2;
    color: var(--text-primary);
}
#caveContent .pond-plaque .fx-select__btn:hover { color: var(--text-gold); }
#caveContent .pond-plaque .fx-select { min-width: 0; }
/* #9332 换钓点入口胶囊：金色描边,提示木牌是钓点选择入口（无胶囊时 tag 仍靠右） */
#caveContent .pond-plaque__swap {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    flex: none;
    margin-left: auto;
    font-size: var(--font-micro);
    color: var(--text-gold);
    letter-spacing: 1px;
    line-height: 1;
    border: 1px solid color-mix(in srgb, var(--accent-gold) 55%, var(--border-color));
    border-radius: var(--radius-pill);
    padding: var(--space-2) var(--space-8);
    white-space: nowrap;
}
#caveContent .pond-plaque__swap + .pond-plaque__tag { margin-left: var(--space-4); }
#caveContent .pond-plaque__tag {
    margin-left: auto;
    flex: none;
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 1px;
    white-space: nowrap;
}
#caveContent .pond-plaque__meta {
    margin-top: var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: .5px;
    /* #10367：窄视口（套壳 WebView）下单行截断会把整行压成一个省略号，
       今日问潮次数随之不可见；改自然换行，木牌随内容增高。 */
    white-space: normal;
}

/* —— 咬钩水花签 / 上鱼成果签 / 空竿 —— */
#caveContent .pond-splash,
#caveContent .pond-catch {
    position: absolute;
    left: 50%;
    top: 46%;
    transform: translate(-50%, -50%);
    z-index: 7;
    text-align: center;
    background: var(--bg-card);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-pill);
    animation: pondSignRise 1s ease-out both;
}
#caveContent .pond-splash {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-4) var(--space-16) var(--space-4) var(--space-12);
}
/* #9324 史诗/传说水花签入场后持续脉动：高品阶窗口窄游标快，别肌肉记忆放跑 */
#caveContent .pond-splash--epic {
    animation: pondSignRise 1s ease-out both, pondSplashPulse 0.9s ease-in-out 1s infinite alternate;
}
@keyframes pondSplashPulse {
    from { transform: translate(-50%, -50%) scale(1); }
    to { transform: translate(-50%, -50%) scale(1.06); }
}
#caveContent .pond-catch { padding: var(--space-6) var(--space-16); max-width: 88%; }
@keyframes pondSignRise { from { transform: translate(-50%, calc(-50% + 10px)); opacity: 0; } to { transform: translate(-50%, -50%); opacity: 1; } }
#caveContent .pond-splash__name,
#caveContent .pond-catch__t { font-family: var(--font-display, var(--font-serif)); font-size: var(--font-heading); letter-spacing: 2px; line-height: 1.3; }
#caveContent .pond-catch__t { display: flex; align-items: center; justify-content: center; gap: var(--space-8); }
#caveContent .pond-splash__grade,
#caveContent .pond-catch__tag {
    font-family: var(--font-serif);
    font-size: var(--font-caption);
    letter-spacing: 1px;
    border: 1px solid;
    border-radius: var(--radius-xs);
    padding: 0 var(--space-4);
    line-height: 16px;
}
#caveContent .pond-catch__s {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 1px;
}
#caveContent .pond-miss {
    position: absolute;
    left: 50%;
    top: 46%;
    transform: translate(-50%, -50%);
    z-index: 7;
    text-align: center;
    animation: pondSignRise 1s ease-out both;
}
#caveContent .pond-miss__t {
    font-family: var(--font-display, var(--font-serif));
    font-size: var(--font-body-lg);
    color: var(--accent-crimson);
    letter-spacing: 2px;
}
#caveContent .pond-miss__s {
    margin-top: var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 1px;
    max-width: 240px;
}

/* —— 岸:饵/竿一行双下拉 —— */
#caveContent .pond-bank {
    background: var(--bg-card);
    border: 1px solid var(--cw-line);
    border-radius: var(--radius-md);
    padding: var(--space-10) var(--space-12) var(--space-12);
}
#caveContent .pond-gear-row { display: flex; gap: var(--space-8); }
#caveContent .pond-gear {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}
#caveContent .pond-gear__head {
    display: flex;
    align-items: baseline;
    gap: var(--space-6);
    margin: 0 var(--space-2);
    min-width: 0;
}
#caveContent .pond-gear__lb {
    flex: none;
    font-family: var(--font-display, var(--font-serif));
    font-size: var(--font-label);
    letter-spacing: 2px;
    color: var(--text-secondary);
}
#caveContent .pond-gear__hint {
    font-size: var(--font-micro);
    color: var(--text-muted);
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#caveContent .pond-gear .cw-field { flex: 1 1 auto; }
/* #9751 咬钩品阶概率条（复用 game-systems 的 chance-stack 分段条视觉） */
#content .pond-chances,
#caveContent .pond-chances {
    margin: var(--space-8) 0 0;
}
#content .pond-chances__lb,
#caveContent .pond-chances__lb {
    display: block;
    margin-bottom: var(--space-6);
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: .5px;
}
#content .pond-chances__lb i,
#caveContent .pond-chances__lb i {
    font-style: normal;
    color: var(--text-primary);
}

/* —— 水面判定带(判定区=金鳞光斑,游标=浮漂投影) —— */
#caveContent .pond-band {
    position: relative;
    flex: none;
    height: 52px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: linear-gradient(180deg, color-mix(in srgb, var(--accent-jade) 6%, transparent), color-mix(in srgb, var(--accent-jade) 18%, transparent));
    border-top: 1px solid color-mix(in srgb, var(--accent-jade) 42%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--accent-jade) 18%, transparent);
}
#caveContent .pond-band__waves {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: calc(100% + 120px);
}
#caveContent .pond-band__w1 { animation: pondWaveMove 6s linear infinite; }
#caveContent .pond-band__w2 { animation: pondWaveMove 9s linear infinite reverse; }
@keyframes pondWaveMove { from { transform: translateX(0); } to { transform: translateX(-60px); } }
#caveContent .pond-band__zone { position: absolute; top: 0; bottom: 0; }
/* #9388 光斑按本竿品阶着色(--band-color 覆盖,默认金);与水花签同色系,一眼分辨成色 */
#caveContent .pond-band__zone { --band-color: var(--accent-gold); }
#caveContent .pond-band__zone { position: absolute; top: 0; bottom: 0; }
#caveContent .pond-band__zone[data-band-r="1"] { --band-color: var(--rarity-1); }
#caveContent .pond-band__zone[data-band-r="2"] { --band-color: var(--rarity-2); }
#caveContent .pond-band__zone[data-band-r="3"] { --band-color: var(--rarity-3); }
#caveContent .pond-band__zone[data-band-r="4"] { --band-color: var(--rarity-4); }
#caveContent .pond-band__zone[data-band-r="5"] { --band-color: var(--rarity-5); }
#caveContent .pond-band__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(
        50% 62% at 50% 50%,
        color-mix(in srgb, var(--band-color) 26%, transparent),
        color-mix(in srgb, var(--band-color) 11%, transparent) 58%,
        transparent 78%
    );
    animation: pondGlowBreath 2.4s ease-in-out infinite;
}
@keyframes pondGlowBreath { 0%, 100% { transform: scaleX(1); opacity: .92; } 50% { transform: scaleX(1.1); opacity: 1; } }
#caveContent .pond-band__cap {
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: color-mix(in srgb, var(--band-color) 62%, transparent);
}
#caveContent .pond-band__cap--t { top: 3px; }
#caveContent .pond-band__cap--b { bottom: 3px; }
#caveContent .pond-band__minifish {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -3px 0 0 -8px;
    animation: pondMiniSwim 4s ease-in-out infinite;
}
@keyframes pondMiniSwim { 0%, 100% { transform: translateX(-9px); } 50% { transform: translateX(9px); } }
/* #9671 针是一条与判定带同宽的透明轨，JS 用 translateX(百分比) 推它（百分比相对自身=条宽），
   只走合成层不触发布局；可见的竖线与圆点由伪元素画在轨的左沿，越界部分被 .pond-band 裁掉 */
#caveContent .pond-band__cursor {
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;
    width: 100%;
    pointer-events: none;
    will-change: transform;
    z-index: 2;
}
/* #10474：游标改朱红浮漂色（原 text-primary 在亮色模式下近黑，快竿下看不清） */
#caveContent .pond-band__cursor::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -1.75px;
    width: 3.5px;
    border-radius: 2px;
    background: var(--accent-crimson);
    box-shadow: 0 0 3px color-mix(in srgb, var(--accent-crimson) 55%, transparent);
}
#caveContent .pond-band__cursor::after {
    content: "";
    position: absolute;
    top: -5px;
    left: -3.5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-crimson);
    box-shadow: 0 0 3px color-mix(in srgb, var(--accent-crimson) 55%, transparent);
}

/* —— 咬钩说明行 + 潮退线 —— */
#caveContent .pond-caption {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding: 0 var(--space-2);
    min-width: 0;
}
#caveContent .pond-caption--sub { margin-top: calc(-1 * var(--space-4)); }
#caveContent .pond-caption__t {
    font-size: var(--font-caption);
    color: var(--text-secondary);
    letter-spacing: 1px;
    min-width: 0;
}
#caveContent .pond-caption__t b { color: var(--text-gold); font-weight: 400; }
#caveContent .pond-caption--sub .pond-caption__t { color: var(--text-muted); }
#caveContent .pond-tide {
    flex: 1;
    max-width: 96px;
    margin-left: auto;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--accent-jade) 18%, transparent), color-mix(in srgb, var(--accent-jade) 42%, transparent));
    transform-origin: right center;
}

/* 岸上饵竿卡与判定带+说明取高,钉死抛竿/收竿槽(#9182)。108 为布局锁,非设计阶梯 */
#caveContent .pond-mid {
    min-height: 108px;
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    min-width: 0;
}
#caveContent .pond-acts .cw-btn { min-height: 44px; }
#caveContent .pond-acts .cw-btn--gold { flex: 1; }
#caveContent .pond-journal {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 6;
    min-width: 44px;
    min-height: 44px;
    padding: 0 var(--space-12);
    font: inherit;
    font-size: var(--font-label);
    font-weight: 600;
    line-height: 1;
    color: var(--text-gold);
    background: var(--bg-card);
    border: 1px solid var(--border-gold);
    border-radius: var(--radius-sm);
    cursor: pointer;
}
#caveContent .pond-journal:hover { color: var(--accent-gold); }


/* ═══ 天道仙缘 · 方向 A v2（底栏渠道矩阵 + 月卡卡面双钮）═══ */
/* gc-foot 基线为 flex row（game-dialog.css #6198 几何锁带 !important），
   底栏内容（手机折叠钮 + 渠道矩阵）必须整体包在单个全宽子元素 .xy-web-wrap 内，
   禁止直接平铺进 foot */
.xy-web-wrap {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}
/* 底栏：渠道矩阵（仅 Web 端渲染；App 内走 modal-btn-row 获取仙缘） */
.xy-foot-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    margin: 0 0 var(--space-6);
}
.xy-foot-title span {
    font-size: var(--font-micro);
    letter-spacing: 1.5px;
    color: var(--text-muted);
    font-family: var(--font-serif, "Songti SC", serif);
    font-weight: 600;
}
.xy-foot-title em {
    font-style: normal;
    font-size: var(--font-micro);
    color: var(--text-gold);
}
.xy-plat-row {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    margin: var(--space-2) var(--space-2) var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 1px;
}
.xy-plat-row::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--border-color);
}
.xy-channels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
}
.xy-ch {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-height: 44px;
    padding: var(--space-6) var(--space-8);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    text-decoration: none;
    color: var(--text-primary);
    /* 无 href（套壳直链未取到）时不可点观感；拿到 href 后由 a.xy-ch[href] 恢复 pointer */
    cursor: default;
    -webkit-appearance: none;
    appearance: none;
    font-family: inherit;
    text-align: left;
    box-sizing: border-box;
    transition: border-color 0.12s ease, background 0.12s ease;
}
a.xy-ch[href] { cursor: pointer; }
a.xy-ch[href]:hover { border-color: var(--border-gold); background: var(--bg-card-hover); }
.xy-ch__icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.xy-ch__icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    border-radius: 5px;
}
.xy-ch__text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.xy-ch__name {
    font-size: var(--font-caption);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.xy-ch__sub {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    min-width: 0;
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.3;
}
.xy-ch__desc {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.xy-plat {
    display: inline-flex;
    align-items: center;
    font-style: normal;
    flex-shrink: 0;
    padding: 1px 5px;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    font-size: var(--font-micro);
    line-height: 1.4;
    color: var(--text-muted);
    background: var(--bg-panel);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}
.xy-plat--and { color: var(--text-jade); border-color: rgba(22, 128, 106, 0.35); }
.xy-plat--ios { color: var(--text-secondary); }
.xy-ch--gold {
    border-color: rgba(183, 120, 31, 0.40);
    background: rgba(183, 120, 31, 0.08);
}
.xy-ch--gold .xy-ch__name { color: var(--text-gold); }
.xy-ch--jade {
    border-color: rgba(22, 128, 106, 0.36);
    background: rgba(22, 128, 106, 0.07);
}
.xy-ch--jade .xy-ch__name { color: var(--text-jade); }
html.theme-dark .xy-plat--and { border-color: rgba(127, 161, 141, 0.35); }
html.theme-dark .xy-ch--gold {
    border-color: rgba(203, 168, 102, 0.40);
    background: rgba(203, 168, 102, 0.10);
}
html.theme-dark .xy-ch--jade {
    border-color: rgba(127, 161, 141, 0.36);
    background: rgba(127, 161, 141, 0.08);
}

/* 渠条默认折叠为一枚「下载 App」展开钮（桌面/平板/手机一致）；点开再显矩阵，
   .is-open 挂在 .gc-foot.xy-web-foot 上由 JS 切换 */
.xy-ch-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-4) var(--space-8);
    width: 100%;
    min-height: 44px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid rgba(183, 120, 31, 0.40);
    background: rgba(183, 120, 31, 0.08);
    color: var(--text-primary);
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}
html.theme-dark .xy-ch-toggle {
    border-color: rgba(203, 168, 102, 0.40);
    background: rgba(203, 168, 102, 0.10);
}
.xy-ch-toggle__main {
    font-size: var(--font-label);
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--text-gold);
}
.xy-ch-toggle__plat {
    font-style: normal;
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.xy-ch-toggle__state {
    font-style: normal;
    font-size: var(--font-micro);
    color: var(--text-muted);
    letter-spacing: 1px;
}
.gc-foot.xy-web-foot:not(.is-open) .xy-web-channels {
    display: none;
}
/* 宽弹窗（>640px 视口，壳 720px）：消耗页动作行双列铺排，避免单列拉稀；
   获取页入口钮与折叠行保持单列通读 */
@media (min-width: 641px) {
    .xy-pane[data-xy-pane="spend"] .xy-acts {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-content: start;
    }
}

/* 月卡 Tab：卡面 + 并排双钮 */
.xy-cardface {
    position: relative;
    margin: 0 var(--space-2) var(--space-8);
    padding: var(--space-12);
    border-radius: var(--radius-md);
    border: 1px solid rgba(183, 120, 31, 0.45);
    background: linear-gradient(135deg, rgba(183, 120, 31, 0.14), rgba(183, 120, 31, 0.04) 55%, rgba(183, 120, 31, 0.10));
    overflow: hidden;
}
.xy-cardface::after {
    content: "";
    position: absolute;
    top: -22px;
    right: -22px;
    width: 74px;
    height: 74px;
    border-radius: 50%;
    border: 1.5px solid rgba(183, 120, 31, 0.22);
    pointer-events: none;
}
.xy-cardface__row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-8);
}
.xy-cardface__name {
    font-family: var(--font-serif, "Songti SC", serif);
    font-size: var(--font-title);
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--text-gold);
    line-height: 1.3;
}
.xy-cardface__status {
    margin-top: var(--space-4);
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.xy-cardface__status.is-on {
    color: var(--text-jade);
    font-weight: 600;
}
.xy-cardface__daily {
    flex-shrink: 0;
    text-align: center;
    padding: var(--space-6) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid rgba(183, 120, 31, 0.40);
    background: var(--bg-card);
}
.xy-cardface__daily b {
    display: block;
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-heading);
    font-weight: 700;
    color: var(--text-gold);
    line-height: 1.1;
}
.xy-cardface__daily i {
    display: block;
    margin-top: var(--space-2);
    font-style: normal;
    font-size: var(--font-micro);
    color: var(--text-muted);
}
.xy-cardface__perks {
    margin-top: var(--space-8);
    font-size: var(--font-micro);
    color: var(--text-secondary);
    letter-spacing: 0.3px;
}
.xy-cardface__perks b { color: var(--text-gold); }
html.theme-dark .xy-cardface {
    border-color: rgba(203, 168, 102, 0.45);
    background: linear-gradient(135deg, rgba(203, 168, 102, 0.16), rgba(203, 168, 102, 0.05) 55%, rgba(203, 168, 102, 0.11));
}
html.theme-dark .xy-cardface::after { border-color: rgba(203, 168, 102, 0.24); }
html.theme-dark .xy-cardface__daily { border-color: rgba(203, 168, 102, 0.40); }
.xy-cardbtns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-8);
    margin: 0 var(--space-2) var(--space-8);
}
.xy-cardbtn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-height: 48px;
    padding: var(--space-8) var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-card);
    font-family: inherit;
    cursor: pointer;
    text-align: center;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
    transition: border-color 0.12s ease, opacity 0.12s ease;
}
.xy-cardbtn__name {
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 1px;
}
.xy-cardbtn__sub {
    font-size: var(--font-micro);
    color: var(--text-muted);
    line-height: 1.3;
}
.xy-cardbtn--jade {
    border-color: rgba(22, 128, 106, 0.42);
    background: rgba(22, 128, 106, 0.10);
}
.xy-cardbtn--jade .xy-cardbtn__name { color: var(--text-jade); }
.xy-cardbtn--gold {
    border-color: rgba(183, 120, 31, 0.48);
    background: rgba(183, 120, 31, 0.12);
}
.xy-cardbtn--gold .xy-cardbtn__name { color: var(--text-gold); }
.xy-cardbtn.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}
html.theme-dark .xy-cardbtn--jade {
    border-color: rgba(127, 161, 141, 0.42);
    background: rgba(127, 161, 141, 0.10);
}
html.theme-dark .xy-cardbtn--gold {
    border-color: rgba(203, 168, 102, 0.48);
    background: rgba(203, 168, 102, 0.14);
}

/* ===== #9676 钓鱼图鉴 C 版（水域收集墙）：fjj-* 桌面 4 列 / 手机 2 列横排 ===== */
.fjj-tabs { display: flex; gap: var(--space-6); overflow-x: auto; padding-bottom: var(--space-8); scrollbar-width: none; }
.fjj-tabs::-webkit-scrollbar { display: none; }
.fjj-tab {
    flex: none; min-height: 32px; display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 12px; font-size: var(--font-label);
    border: 1px solid var(--border-color); border-radius: var(--radius-pill);
    background: var(--bg-panel); color: var(--text-secondary); cursor: pointer;
}
.fjj-tab i { font-style: normal; color: var(--accent-jade); font-size: var(--font-caption); }
.fjj-tab.is-on { border-color: color-mix(in srgb, var(--accent-gold) 50%, transparent); color: var(--text-gold); background: color-mix(in srgb, var(--accent-gold) 6%, transparent); }
.fjj-tab.is-lock { opacity: .5; }
.fjj-mastery { text-align: center; font-size: var(--font-caption); color: var(--text-muted); padding: var(--space-2) 0 var(--space-6); }
.fjj-mastery b { color: var(--text-gold); font-weight: 500; }
.fjj-hero { text-align: center; padding: var(--space-32) var(--space-12) var(--space-20); }
.fjj-hero__glyph {
    width: 132px; height: 38px; margin: 0 auto var(--space-12);
    border: 1px dashed var(--border-color); border-radius: var(--radius-pill);
    display: grid; place-items: center; font-family: var(--font-display);
    font-size: var(--font-action); color: var(--text-muted); letter-spacing: 6px; text-indent: 6px;
}
.fjj-hero__t { font-family: var(--font-display); font-size: var(--font-title); letter-spacing: 2px; }
.fjj-hero__d { margin-top: var(--space-6); font-size: var(--font-label); color: var(--text-secondary); line-height: 1.8; }
.fjj-hero__d b { color: var(--accent-jade); font-weight: 500; }
.fjj-hero__go {
    display: inline-flex; align-items: center; gap: 4px; margin-top: var(--space-12);
    min-height: 36px; padding: 4px 18px; cursor: pointer;
    border: 1px solid color-mix(in srgb, var(--accent-gold) 45%, transparent); border-radius: var(--radius-pill);
    color: var(--text-gold); font-size: var(--font-label); background: color-mix(in srgb, var(--accent-gold) 5%, transparent);
}
.fjj-hero__seal {
    display: block; width: fit-content; margin: var(--space-14) auto 0; padding: 4px 12px;
    font-family: var(--font-display); font-size: var(--font-micro); letter-spacing: 2px;
    color: var(--color-text-on-accent, #fff); background: var(--accent-crimson); border-radius: var(--radius-xs);
    transform: rotate(-3deg); opacity: .82;
}
.fjj-wall { margin-top: var(--space-10); }
.fjj-wall__head {
    display: flex; align-items: baseline; gap: var(--space-8); flex-wrap: wrap;
    padding: var(--space-8) var(--space-10) var(--space-6);
    background: linear-gradient(180deg, color-mix(in srgb, var(--accent-jade) 7%, transparent), transparent);
    border-bottom: 1px solid var(--border-color); border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}
.fjj-wall__name { font-family: var(--font-display); font-size: var(--font-title); letter-spacing: 2px; }
.fjj-wall__name em { font-style: normal; font-size: var(--font-micro); color: var(--text-gold); margin-left: 5px; vertical-align: 2px; }
.fjj-wall__prog { margin-left: auto; font-family: var(--font-display); font-size: var(--font-body); color: var(--text-muted); }
.fjj-wall__prog b { color: var(--accent-jade); font-size: var(--font-body-lg); }
.fjj-wall.is-done .fjj-wall__prog b { color: var(--text-gold); }
.fjj-wall__sub { width: 100%; font-size: var(--font-micro); color: var(--text-muted); line-height: 1.5; margin-top: -2px; }
.fjj-wall.is-lock .fjj-wall__head { background: repeating-linear-gradient(-45deg, transparent 0 6px, color-mix(in srgb, var(--text-primary) 2%, transparent) 6px 12px); }
.fjj-wall.is-lock .fjj-wall__name { color: var(--text-muted); }
.fjj-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); padding-top: var(--space-8); }
.fjj-card {
    display: flex; align-items: center; gap: var(--space-8);
    padding: var(--space-8) var(--space-10); min-height: 44px;
    border: 1px solid var(--border-color); border-radius: var(--radius-md); background: var(--bg-panel);
}
.fjj-card__glyph {
    width: 32px; height: 32px; flex: none; border-radius: 50%;
    display: grid; place-items: center;
    border: 1px solid color-mix(in srgb, var(--accent-jade) 35%, transparent); background: color-mix(in srgb, var(--accent-jade) 7%, transparent);
    font-family: var(--font-display); font-size: var(--font-label); color: var(--accent-jade);
}
.fjj-card__glyph--hp { border-color: color-mix(in srgb, var(--accent-crimson) 35%, transparent); background: color-mix(in srgb, var(--accent-crimson) 6%, transparent); color: var(--accent-crimson); }
.fjj-card__glyph--mp { border-color: color-mix(in srgb, var(--accent-blue) 40%, transparent); background: color-mix(in srgb, var(--accent-blue) 7%, transparent); color: var(--accent-blue); }
.fjj-card__glyph--lifespan { border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent); background: color-mix(in srgb, var(--accent-gold) 6%, transparent); color: var(--text-gold); }
.fjj-card__main { flex: 1; min-width: 0; display: grid; gap: 4px; }
.fjj-card__namerow { display: flex; align-items: baseline; gap: 5px; min-width: 0; }
.fjj-card__name { font-family: var(--font-serif); font-size: var(--font-body); line-height: 1.3; font-weight: 500; }
.fjj-card__kind { font-style: normal; font-size: var(--font-micro); color: var(--text-muted); flex: none; }
.fjj-card__dots { display: flex; gap: 3px; }
.fjj-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--border-color); }
.fjj-dot--g1 { background: var(--rarity-1); } .fjj-dot--g2 { background: var(--rarity-2); }
.fjj-dot--g3 { background: var(--rarity-3); } .fjj-dot--g4 { background: var(--rarity-4); }
.fjj-dot--g5 { background: var(--rarity-5); }
.fjj-dot.is-off { opacity: .22; }
/* #10958 仅购入未亲钓：描边空心（点亮图鉴不计全谱），边色随品阶 */
.fjj-dot.is-bag { background: transparent; border-style: solid; border-width: 1.5px; opacity: .8; }
.fjj-dot--g1.is-bag { border-color: var(--rarity-1); }
.fjj-dot--g2.is-bag { border-color: var(--rarity-2); }
.fjj-dot--g3.is-bag { border-color: var(--rarity-3); }
.fjj-dot--g4.is-bag { border-color: var(--rarity-4); }
.fjj-dot--g5.is-bag { border-color: var(--rarity-5); }
.fjj-card__nums { flex: none; font-size: var(--font-micro); color: var(--text-secondary); align-self: center; }
.fjj-card__nums b { color: var(--accent-jade); font-weight: 500; }
.fjj-card.is-unknown { background: transparent; border-style: dashed; }
.fjj-card.is-unknown .fjj-card__glyph { border-style: dashed; border-color: var(--border-color); background: transparent; color: var(--text-muted); }
.fjj-card.is-unknown .fjj-card__name { color: var(--text-muted); letter-spacing: 2px; font-weight: 400; }
.fjj-card__tip { font-size: var(--font-micro); color: var(--text-muted); line-height: 1.4; }
.fjj-foot { margin-top: var(--space-12); font-size: var(--font-micro); color: var(--text-muted); text-align: center; line-height: 1.7; }
/* 手机（≤480px）：4 列竖排改 2 列横排小卡；档头大数字收小 */
@media (max-width: 480px) {
    .fjj-cards { grid-template-columns: 1fr 1fr; }
    .fjj-wall__name { font-size: var(--font-body-lg); }
    .fjj-wall__prog { font-size: var(--font-label); }
    .fjj-wall__prog b { font-size: var(--font-body); }
    .fjj-card__name { font-size: var(--font-label); }
}

/* #9676 修正：桌面 4 列横卡过挤致鱼名竖排 —— 桌面改竖卡（对齐设计稿），手机保持横排小卡 */
.fjj-card { flex-direction: column; text-align: center; gap: 5px; align-items: center; justify-content: flex-start; }
.fjj-card__namerow { justify-content: center; flex-wrap: wrap; }
.fjj-card__main { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.fjj-card__tip { text-align: center; }
.fjj-card__nums { align-self: center; }
@media (max-width: 480px) {
    .fjj-card { flex-direction: row; text-align: left; align-items: center; gap: var(--space-8); }
    .fjj-card__namerow { justify-content: flex-start; }
    .fjj-card__main { align-items: flex-start; }
    .fjj-card__tip { text-align: left; }
    .fjj-card__nums { align-self: center; margin-left: auto; }
}

/* #11041 卷轴细分芯片（仅卷轴页签显示；容器是 inv-filter-tab 同排的小胶囊组） */
.inv-scroll-kind-chip {
    flex: 0 0 auto;
    height: 22px;
    min-height: 22px;
    padding: 0 var(--space-8);
    margin-left: var(--space-4);
    border: 1px solid var(--inv-tab-line, color-mix(in srgb, var(--border-color) 82%, transparent));
    border-radius: var(--radius-pill);
    background: transparent;
    color: var(--text-muted);
    font-family: inherit;
    font-size: var(--font-label);
    line-height: 1;
    cursor: pointer;
}
.inv-scroll-kind-chip.is-on {
    background: color-mix(in srgb, var(--inv-tab-accent, var(--accent-gold)) 10%, transparent);
    border-color: color-mix(in srgb, var(--inv-tab-accent, var(--accent-gold)) 42%, transparent);
    color: var(--inv-tab-accent, var(--accent-gold));
}