/* ===== 设计变量 · 全界面排版 ===== */
:root {
    --bg-deep: #06080d;
    --bg-mid: #0c1018;
    --bg-elevated: #141a26;
    --bg-card: linear-gradient(165deg, rgba(20, 26, 38, 0.97) 0%, rgba(10, 13, 22, 0.98) 100%);
    --bg-card-solid: rgba(18, 23, 34, 0.96);
    --border: rgba(201, 162, 39, 0.42);
    --border-subtle: rgba(255, 255, 255, 0.06);
    --border-jade: rgba(90, 160, 140, 0.22);
    --text: #e8eaf2;
    --text-muted: #8b95ab;
    --text-faint: #5c6578;
    --accent: #e4c76a;
    --accent-dim: rgba(228, 199, 106, 0.14);
    --accent-glow: rgba(228, 199, 106, 0.38);
    --jade: #5ab89a;
    --jade-dim: rgba(90, 184, 154, 0.12);
    --danger: #e05252;
    --gold: #f2d57a;
    --hp: #c23c3c;
    --exp: #8b7fd8;
    --radius: 16px;
    --radius-sm: 10px;
    --shadow: 0 20px 56px rgba(0, 0, 0, 0.55);
    --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.045);
    --font-ui: "Noto Sans SC", system-ui, sans-serif;
    --font-display: "Cinzel", "Noto Sans SC", serif;
    --font-xian: "ZCOOL XiaoWei", "Noto Sans SC", serif;
    --app-max: 28rem;
    --space-xs: 0.35rem;
    --space-sm: 0.5rem;
    --space-md: 0.75rem;
    --space-lg: 1rem;
}

/* 主游戏手机「洞天全屏」：父页 postMessage 后为 html 加此类，整体放大并拉满可用宽度（行囊/坊市/武神坛/副本等） */
html.dongtian-parent-mobile-fs {
    font-size: clamp(17px, 3.05vmin, 22px);
    --app-max: min(100vw - 0.5rem, 42rem);
    --space-sm: 0.55rem;
    --space-md: 0.88rem;
    --space-lg: 1.12rem;
}

html.dongtian-parent-mobile-fs body {
    font-size: 1.02rem;
}

html.dongtian-parent-mobile-fs .btn {
    font-size: max(0.9rem, 0.95em);
}

html.dongtian-parent-mobile-fs .btn--sm {
    font-size: max(0.82rem, 0.9em);
}

html.dongtian-parent-mobile-fs .modal-sheet,
html.dongtian-parent-mobile-fs .xiu-market-sheet,
html.dongtian-parent-mobile-fs .wushen-arena-sheet {
    max-width: min(100vw - 0.5rem, 42rem);
}

html.dongtian-parent-mobile-fs #inventory .content {
    width: min(100%, 100vw - 0.5rem);
    max-width: min(100vw - 0.5rem, 42rem);
}

* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

*:focus {
    outline: none;
}

*:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

h1 { font-size: 1.85rem; }
h2 { font-size: 1.45rem; }
h3 { font-size: 1.15rem; }
h4 { font-size: 0.82rem; }
h5 { font-size: 0.85rem; }
h6 { font-size: 0.75rem; }

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    font-style: normal;
    font-family: var(--font-display);
    letter-spacing: 0.04em;
}

i {
    margin-right: 0.35rem;
    opacity: 0.88;
    flex-shrink: 0;
}

body {
    min-height: 100dvh;
    font-family: var(--font-ui);
    font-size: 0.92rem;
    color: var(--text);
    touch-action: manipulation;
    overscroll-behavior: contain;
    background:
        radial-gradient(ellipse 120% 80% at 50% -20%, rgba(228, 199, 106, 0.09), transparent 58%),
        radial-gradient(ellipse 50% 45% at 100% 0%, rgba(90, 184, 154, 0.07), transparent 45%),
        radial-gradient(ellipse 45% 50% at 0% 85%, rgba(100, 80, 180, 0.06), transparent 48%),
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 2px,
            rgba(255, 255, 255, 0.012) 2px,
            rgba(255, 255, 255, 0.012) 3px
        ),
        linear-gradient(172deg, #05070c 0%, var(--bg-mid) 42%, #070a10 100%);
    -webkit-font-smoothing: antialiased;
}

input,
select,
textarea {
    font-family: var(--font-ui);
}

input {
    font-size: 1rem;
    padding: 0.6rem 0.85rem;
    margin: 0;
    background: var(--bg-deep);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text);
    user-select: text;
    -webkit-user-select: text;
    transition: border-color 0.2s, box-shadow 0.2s;
}

input:hover {
    border-color: var(--border);
}

input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-dim);
}

select {
    cursor: pointer;
    font-size: 0.88rem;
    width: 100%;
    padding: 0.45rem 0.6rem;
    background: var(--bg-deep);
    border: 1px solid var(--border-subtle);
    color: var(--text);
    border-radius: var(--radius-sm);
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%238892a8' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    padding-right: 1.85rem;
}

.select-field {
    flex: 1;
    min-width: 0;
}

option {
    background-color: var(--bg-mid);
    color: var(--text);
}

img {
    pointer-events: none;
    margin-top: 0.75rem;
    border-radius: var(--radius-sm);
    max-width: 100%;
    height: auto;
}

/* ===== 按钮 ===== */
button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    text-align: center;
    background: transparent;
    color: var(--text);
    font-family: var(--font-ui);
    font-size: 0.92rem;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.12s;
    -webkit-tap-highlight-color: transparent;
}

button:hover {
    background: var(--accent-dim);
    border-color: var(--border);
}

button:active {
    transform: scale(0.98);
}

.btn--primary {
    background: linear-gradient(180deg, rgba(212, 175, 55, 0.32), rgba(212, 175, 55, 0.1));
    border-color: var(--accent);
    color: #fffaf0;
}

.btn--primary:hover {
    background: linear-gradient(180deg, rgba(212, 175, 55, 0.48), rgba(212, 175, 55, 0.18));
    box-shadow: 0 0 18px var(--accent-glow);
}

.btn--accent {
    background: var(--bg-elevated);
    border-color: var(--accent);
    color: var(--gold);
    font-weight: 600;
}

.btn--ghost {
    background: transparent;
    border-color: var(--border-subtle);
    color: var(--text-muted);
}

.btn--ghost:hover {
    color: var(--text);
    border-color: var(--border);
}

.btn--sm {
    font-size: 0.82rem;
    padding: 0.38rem 0.65rem;
}

.btn--block {
    width: 100%;
}

.icon-btn {
    width: 2.35rem;
    height: 2.35rem;
    padding: 0;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    background: var(--bg-deep);
    color: var(--text-muted);
    flex-shrink: 0;
}

.icon-btn:hover {
    color: var(--text);
    border-color: var(--border);
    background: var(--bg-elevated);
}

/* ===== 通用 ===== */
.w-100 { width: 100%; }

.row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.row span {
    min-width: 1.25rem;
    text-align: center;
}

.center-text { text-align: center; }
.pad { padding: 0.35em 0.5em; }
.center { text-align: center; }

/* ===== 应用根与面板外壳 ===== */
.app-root {
    width: 100%;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: var(--space-sm);
    padding-bottom: max(var(--space-sm), env(safe-area-inset-bottom));
}

.game-container {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    max-width: var(--app-max);
    min-height: 0;
}

.app-panel.screen {
    position: relative;
    border-radius: var(--radius);
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: var(--bg-card-solid);
    background-image:
        linear-gradient(165deg, rgba(28, 34, 48, 0.55) 0%, rgba(12, 15, 24, 0.92) 100%);
    box-shadow:
        var(--shadow),
        0 0 0 1px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    overflow: hidden;
}

.app-panel.screen::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(
        135deg,
        rgba(228, 199, 106, 0.06) 0%,
        transparent 42%,
        transparent 58%,
        rgba(90, 184, 154, 0.04) 100%
    );
    z-index: 0;
}

.app-panel.screen > * {
    position: relative;
    z-index: 1;
}

.screen--title {
    display: flex;
    flex-direction: column;
    flex: 1;
    max-height: min(100dvh - 1rem, 40rem);
    min-height: min(100dvh - 1rem, 36rem);
    cursor: pointer;
}

.screen--hub {
    flex: 1;
    max-height: calc(100dvh - 1rem);
    min-height: min(calc(100dvh - 1rem), 44rem);
    display: flex;
    flex-direction: column;
}

.screen--loading {
    justify-content: center;
    align-items: center;
    min-height: 10rem;
    max-width: 16rem;
}

/* ===== 标题页 ===== */
.title-layout {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-lg) var(--space-md);
    text-align: center;
}

.title-layout__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.screen-brand__glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.75rem;
    height: 4.75rem;
    margin-bottom: var(--space-md);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, var(--accent-glow), transparent 72%);
    border: 1px solid var(--border);
    font-size: 2.1rem;
    color: var(--gold);
}

.screen-title {
    font-size: clamp(1.8rem, 7vw, 2.4rem);
    font-weight: 700;
    color: #fff;
    text-shadow: 0 0 28px var(--accent-glow);
    margin-bottom: 0.25rem;
}

.screen-sub {
    font-size: 0.78rem;
    color: var(--text-muted);
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

.title-layout__divider {
    width: min(12rem, 60%);
    height: 1px;
    margin: var(--space-lg) 0;
    background: linear-gradient(90deg, transparent, var(--border), transparent);
}

.screen-hint {
    font-size: 0.88rem;
    color: var(--text-muted);
}

.tap-hint {
    animation: hint-pulse 2.2s ease-in-out infinite;
}

@keyframes hint-pulse {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}

.loading-layout {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-lg);
}

.loading-text {
    color: var(--text-muted);
    font-size: 0.88rem;
}

/* ===== 主界面 Hub ===== */
.hub-layout {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    padding: var(--space-md);
}

.hub-layout__primary {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    min-width: 0;
    flex-shrink: 0;
}

@media (min-width: 800px) {
    #dungeon-main.game-container.scrollable.screen--hub {
        max-width: min(96vw, 52rem);
        overflow: hidden;
    }

    .hub-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) clamp(16.25rem, 33vw, 21.5rem);
        grid-template-rows: minmax(0, 1fr);
        gap: var(--space-md);
        align-items: stretch;
        padding: var(--space-md);
    }

    .hub-layout__primary {
        flex-shrink: 1;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: 0.15rem;
    }

    .hub-layout__log.log-panel {
        flex: unset;
        min-height: 0;
        max-height: none;
        height: auto;
        align-self: stretch;
        background:
            linear-gradient(180deg, rgba(228, 199, 106, 0.04) 0%, transparent 28%),
            linear-gradient(165deg, rgba(22, 30, 44, 0.85) 0%, rgba(6, 8, 14, 0.92) 100%);
        border: 1px solid rgba(212, 175, 55, 0.2);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.05),
            inset -1px 0 0 rgba(90, 184, 154, 0.06),
            0 0 36px rgba(0, 0, 0, 0.35);
    }

    .hub-layout__log .log-panel__head {
        text-align: left;
    }

    .hub-layout__log .log-panel__status {
        text-align: left;
    }
}

.hud-bar {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--radius-sm);
    background:
        linear-gradient(145deg, rgba(30, 38, 52, 0.55) 0%, rgba(8, 10, 18, 0.75) 100%);
    border: 1px solid rgba(212, 175, 55, 0.18);
    box-shadow: var(--shadow-inset), 0 8px 28px rgba(0, 0, 0, 0.22);
}

.hud-bar__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, auto));
    gap: 0.4rem;
    align-items: center;
    align-self: center;
    justify-content: end;
}

.hud-bar__pet {
    white-space: nowrap;
    padding-left: 0.55rem;
    padding-right: 0.55rem;
    border: 1px solid rgba(212, 175, 55, 0.22);
}

.hud-bar__menu {
    white-space: nowrap;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
}

.hud-bar__main {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.hud-bar__avatar {
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 50%;
    background:
        radial-gradient(circle at 32% 28%, rgba(228, 199, 106, 0.35), transparent 55%),
        radial-gradient(circle at 70% 80%, rgba(90, 184, 154, 0.15), transparent 45%),
        linear-gradient(160deg, #1a2230, #0c1018);
    border: 1px solid rgba(212, 175, 55, 0.35);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 0 20px rgba(228, 199, 106, 0.08);
    font-family: var(--font-xian);
    font-size: 1.05rem;
    color: rgba(242, 213, 122, 0.88);
    text-shadow: 0 0 12px rgba(228, 199, 106, 0.35);
}

.hud-bar__avatar-img {
    display: none;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0 !important;
    object-fit: cover;
    object-position: center center;
    border-radius: 50%;
    z-index: 1;
    pointer-events: none;
}

.hud-bar__avatar--has-image .hud-bar__avatar-img {
    display: block;
}

.hud-bar__avatar--has-image::before {
    content: none;
}

.hud-bar__avatar::before {
    content: "炁";
    position: relative;
    z-index: 0;
}

.hud-bar__identity {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.hud-bar__titles {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.hud-name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.28em;
    margin: 0;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.35;
    font-family: var(--font-xian);
    letter-spacing: 0.06em;
    color: #f5f2ea;
    text-shadow: 0 1px 14px rgba(0, 0, 0, 0.45);
}

.hud-name > i {
    flex-shrink: 0;
    align-self: center;
    margin-right: 0;
    margin-top: 0;
    line-height: 1;
    opacity: 0.75;
}

.hud-realm {
    margin: 0;
    padding-left: 1.35rem;
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    color: rgba(242, 213, 122, 0.88);
    line-height: 1.3;
    word-break: keep-all;
}

.hud-sect {
    margin: 0;
    padding-left: 1.35rem;
    font-size: 0.76rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    color: rgba(140, 200, 180, 0.82);
    line-height: 1.35;
    word-break: keep-all;
}

.hud-bar__meta {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}

.hud-bar__inv,
.hud-bar__skills {
    white-space: nowrap;
}

.hud-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    padding: 0.28rem 0.55rem;
    border-radius: 999px;
    background: rgba(6, 8, 14, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.07);
    color: var(--text-muted);
    margin: 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.hud-pill__lbl {
    color: var(--text-muted);
    font-weight: 500;
}

.hud-pill__val {
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.hud-pill--exp .hud-pill__lbl { color: #b5a8ec; }
.hud-pill--exp {
    border-color: rgba(139, 127, 216, 0.22);
    background: rgba(40, 32, 72, 0.25);
}
.hud-pill--gold .hud-pill__val { color: var(--gold); }
.hud-pill--gold {
    border-color: rgba(212, 175, 55, 0.25);
    background: rgba(48, 40, 20, 0.35);
}

/* 进度条：时间 | 楼层 | 房间 | 按钮 */
.run-bar {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.run-bar__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "time time"
        "floor room"
        "act act";
    gap: 0.45rem;
    padding: var(--space-md);
    border-radius: var(--radius-sm);
    background:
        linear-gradient(160deg, rgba(26, 34, 48, 0.65) 0%, rgba(8, 11, 18, 0.82) 100%);
    border: 1px solid rgba(90, 184, 154, 0.14);
    box-shadow: var(--shadow-inset), 0 6px 24px rgba(0, 0, 0, 0.2);
}

@media (min-width: 380px) {
    .run-bar__grid {
        grid-template-columns: 1fr 1fr auto;
        grid-template-areas:
            "time time time"
            "floor room act";
        align-items: center;
    }
}

.run-bar__cell {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    padding: 0.45rem 0.5rem;
    border-radius: var(--radius-sm);
    background: rgba(4, 6, 12, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.run-bar__cell--time {
    grid-area: time;
    text-align: center;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.06em;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--gold);
    text-shadow: 0 0 18px rgba(228, 199, 106, 0.2);
    padding: 0.55rem 0.5rem;
    border-color: rgba(212, 175, 55, 0.2);
    background: linear-gradient(180deg, rgba(48, 42, 28, 0.5) 0%, rgba(12, 14, 22, 0.65) 100%);
}

.run-bar__cell--time::before {
    content: "洞天历时";
    display: block;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.28em;
    color: var(--text-faint);
    margin-bottom: 0.2rem;
    text-shadow: none;
}

.run-bar__cell--floor {
    grid-area: floor;
    font-weight: 600;
    color: var(--text);
}

.run-bar__cell--room {
    grid-area: room;
    font-weight: 600;
    color: var(--text);
}

.run-bar__actions {
    grid-area: act;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: stretch;
    width: 100%;
}

.run-bar__actions .run-bar__action {
    flex: 1 1 auto;
    min-width: 0;
}

.run-bar__action {
    width: 100%;
    font-weight: 600;
    letter-spacing: 0.12em;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-sm);
}

@media (min-width: 380px) {
    .run-bar__action {
        width: auto;
        min-width: 5.25rem;
    }
}

/* 押镖 / 采矿：独立一行，位于秘境进度条下方、属性面板上方 */
.hub-layout__run-extra {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.run-bar__extra-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: stretch;
    padding: var(--space-md);
    border-radius: var(--radius-sm);
    background:
        linear-gradient(160deg, rgba(32, 28, 44, 0.6) 0%, rgba(8, 11, 18, 0.82) 100%);
    border: 1px solid rgba(212, 175, 55, 0.16);
    box-shadow: var(--shadow-inset), 0 4px 16px rgba(0, 0, 0, 0.18);
}

.run-bar__extra-actions .run-bar__action {
    flex: 1 1 auto;
    min-width: 0;
}

@media (min-width: 380px) {
    .run-bar__extra-actions .run-bar__action {
        width: auto;
        min-width: 5.25rem;
    }
}

.run-bar__item { margin: 0; }
.run-bar__item--strong {
    color: var(--text);
    font-weight: 600;
}

/* 属性双列 */
.hub-stats.stat-panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-sm);
    margin: 0;
    flex-shrink: 0;
}

@media (min-width: 360px) {
    .hub-stats.stat-panel {
        grid-template-columns: 1fr 1fr;
    }
}

.stat-card {
    min-width: 0;
    padding: var(--space-md) var(--space-md);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.65rem;
    bottom: 0.65rem;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: linear-gradient(180deg, rgba(228, 199, 106, 0.55), rgba(90, 184, 154, 0.35));
    opacity: 0.85;
}

.stat-card__body {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.stat-card__body p,
.stat-card .stat-card__body p {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.35rem 0.5rem;
    margin: 0;
    padding: 0.42rem 0;
    padding-left: 0.15rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.045);
    font-size: 0.8rem;
    color: var(--text-muted);
}

.stat-card__body p i,
.stat-card .stat-card__body p i {
    color: rgba(228, 199, 106, 0.55);
    opacity: 1;
}

.stat-card__body p:last-child {
    border-bottom: none;
}

.stat-card__lbl {
    color: var(--text-muted);
    font-size: 0.78rem;
}

.stat-card__val {
    text-align: right;
    color: var(--text);
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.card__title {
    font-size: 0.95rem;
    letter-spacing: 0.2em;
    color: var(--accent);
    margin-bottom: var(--space-sm);
    margin-left: 0.35rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid rgba(212, 175, 55, 0.15);
    font-family: var(--font-xian);
    font-weight: 400;
}

/* 主界面 Hub：道体 / 机缘双列略缩小字号 */
.hub-stats.stat-panel > .stat-card {
    padding: var(--space-sm) var(--space-sm);
}

.hub-stats.stat-panel .card__title {
    font-size: 0.8rem;
    letter-spacing: 0.12em;
    margin-bottom: 0.3rem;
    margin-left: 0.28rem;
    padding-bottom: 0.32rem;
}

.hub-stats.stat-panel .stat-card::before {
    top: 0.5rem;
    bottom: 0.5rem;
}

.hub-stats.stat-panel .stat-card__body p,
.hub-stats.stat-panel .stat-card .stat-card__body p {
    font-size: 0.72rem;
    padding: 0.3rem 0;
    padding-left: 0.1rem;
    gap: 0.28rem 0.4rem;
}

.hub-stats.stat-panel .stat-card__body p i,
.hub-stats.stat-panel .stat-card .stat-card__body p i {
    font-size: 0.7rem;
    width: 0.95rem;
    text-align: center;
}

.hub-stats.stat-panel .stat-card__lbl {
    font-size: 0.68rem;
}

.hub-stats.stat-panel .stat-card__val {
    font-size: 0.72rem;
}

.hub-stats.stat-panel .stat-card__body p.stat-card__note {
    display: block;
    font-size: 0.62rem;
    line-height: 1.45;
    color: var(--text-faint);
    padding-top: 0.32rem;
    margin-top: 0.1rem;
}

/* 日志区占满剩余高度 */
.hub-layout__log.log-panel {
    flex: 1;
    min-height: 9rem;
    margin: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: var(--space-md) var(--space-lg);
    border-radius: var(--radius-sm);
}

.log-panel__head {
    flex-shrink: 0;
    margin-bottom: var(--space-sm);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
    background: linear-gradient(90deg, rgba(228, 199, 106, 0.06) 0%, transparent 65%);
}

.log-panel__heading {
    margin: 0 0 0.35rem;
    font-family: var(--font-xian);
    font-size: 1.15rem;
    font-weight: 400;
    letter-spacing: 0.35em;
    color: var(--gold);
    text-shadow: 0 0 20px rgba(228, 199, 106, 0.2);
}

.log-panel__status {
    margin: 0;
    text-align: center;
    font-weight: 500;
    font-size: 0.84rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.log-panel__scroll,
#dungeonLog {
    flex: 1;
    min-height: 0;
    overflow: auto;
    font-size: 0.88rem;
    line-height: 1.72;
    color: rgba(200, 206, 220, 0.88);
    padding-right: 0.15rem;
}

.primary-panel {
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.12);
    background: linear-gradient(175deg, rgba(14, 18, 28, 0.72) 0%, rgba(6, 8, 14, 0.88) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.card {
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: linear-gradient(168deg, rgba(20, 26, 38, 0.55) 0%, rgba(8, 10, 16, 0.72) 100%);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-inset);
}

.hub-layout .logBox {
    margin: 0;
}

/* ===== 背包 · 行囊（大尺寸 · 栅格卡片） ===== */
#inventory .content {
    width: min(100%, min(96vw, 52rem));
    max-width: none;
    max-height: min(90dvh, 52rem);
    min-height: min(70dvh, 36rem);
    /* 明确高度上限，便于 flex 子项把滚动交给 .inv-grid */
    height: min(90dvh, 52rem);
}

.modal-sheet--inventory {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* 行囊：装备/材料分区占满剩余高度，把滚动交给囊中之物栅格 */
.modal-sheet--inventory .inv-split {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* [hidden] 默认会被上面的 display:flex 盖掉，材料/装备分页切换失效，必须写回 none */
.modal-sheet--inventory .inv-split[hidden] {
    display: none !important;
}

.modal-sheet__head--inv {
    flex-shrink: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-lg) var(--space-lg) var(--space-md);
    background: linear-gradient(165deg, rgba(212, 175, 55, 0.11) 0%, rgba(0, 0, 0, 0.22) 45%, rgba(8, 10, 18, 0.55) 100%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.14);
}

.modal-sheet__eyebrow--inv {
    font-size: 0.62rem;
    letter-spacing: 0.22em;
    color: var(--accent);
    opacity: 0.9;
    margin: 0 0 0.35rem;
}

.modal-sheet__head--inv h3 {
    font-size: 1.45rem;
    margin: 0 0 0.25rem;
    color: var(--text);
    text-shadow: 0 1px 18px rgba(212, 175, 55, 0.14);
}

.modal-sheet__sub {
    margin: 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.45;
    max-width: 22rem;
}

.inv-tabs {
    flex-shrink: 0;
    display: flex;
    gap: 0;
    padding: 0 var(--space-lg);
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
    background: rgba(0, 0, 0, 0.22);
}

.inv-tab {
    flex: 1;
    max-width: none;
    padding: 0.65rem 1rem;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    transition: color 0.2s, border-color 0.2s, background 0.2s;
}

.inv-tab:hover {
    color: var(--text);
    background: rgba(212, 175, 55, 0.06);
}

.inv-tab--active {
    color: var(--accent);
    border-bottom-color: rgba(212, 175, 55, 0.55);
    background: rgba(212, 175, 55, 0.05);
}

.inv-split--materials .inv-panel--materials {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0 var(--space-lg) var(--space-lg);
}

.inv-split--gems .inv-panel--gems {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0 var(--space-lg) var(--space-lg);
}

.inv-panel--gems .inv-panel__hint {
    display: block;
}

.eq-meta-gems {
    font-size: 0.72rem;
    margin: 0.28rem 0;
    color: rgba(220, 200, 255, 0.92);
}

.eq-meta-gems--muted {
    color: var(--text-muted);
}

/* 灵窍说明接在基础属性列表之后，与上方数值列表划清层次 */
#equipmentInfo .content > ul + .eq-meta-gems,
.eq-compare__panel .eq-compare__ul + .eq-meta-gems {
    margin-top: 0.6rem;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(180, 100, 220, 0.15);
}

.eq-gem-actions {
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(180, 100, 220, 0.2);
}

.eq-gem-actions__title {
    font-size: 0.68rem;
    color: var(--text-muted);
    margin-bottom: 0.38rem;
}

.eq-gem-slot-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    margin-bottom: 0.28rem;
    font-size: 0.7rem;
}

.eq-gem-slot-row--locked {
    color: var(--text-faint);
}

.eq-gem-slot-row__locked {
    opacity: 0.85;
}

.eq-gem-slot-row__hint {
    font-size: 0.62rem;
    color: var(--text-muted);
}

.inv-gem-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem 0.5rem;
    align-content: start;
    width: 100%;
}

@media (max-width: 520px) {
    .inv-gem-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 340px) {
    .inv-gem-grid {
        grid-template-columns: 1fr;
    }
}

.inv-gem-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.85rem 0.95rem;
    min-height: 0;
    border-radius: 11px;
    border: 1px solid rgba(200, 165, 255, 0.22);
    background: linear-gradient(150deg, rgba(44, 28, 58, 0.58) 0%, rgba(10, 10, 18, 0.88) 100%);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.26);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.inv-gem-card:hover {
    border-color: rgba(228, 199, 106, 0.28);
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.32);
}

.inv-gem-card--hp {
    border-color: rgba(255, 120, 140, 0.25);
}
.inv-gem-card--atk {
    border-color: rgba(255, 180, 100, 0.28);
}
.inv-gem-card--def {
    border-color: rgba(120, 180, 255, 0.25);
}
.inv-gem-card--atkSpd {
    border-color: rgba(120, 230, 200, 0.22);
}
.inv-gem-card--critDmg {
    border-color: rgba(255, 220, 120, 0.3);
}

.inv-gem-card__icon {
    flex-shrink: 0;
    width: 2.35rem;
    height: 2.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(200, 130, 255, 0.1);
    border: 1px solid rgba(200, 130, 255, 0.28);
    font-size: 1rem;
    color: rgba(240, 210, 255, 0.95);
}

.inv-gem-card__body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.inv-gem-card__name {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text);
    letter-spacing: 0.04em;
}

.inv-gem-card__lvl {
    font-size: 0.68rem;
    color: rgba(180, 165, 220, 0.95);
    letter-spacing: 0.08em;
}

.inv-gem-card__qty {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--accent);
    font-variant-numeric: tabular-nums;
}

.inv-gem-card__eff {
    margin: 0.25rem 0 0;
    font-size: 0.65rem;
    line-height: 1.45;
    color: var(--text-muted);
}

.inv-gem-card__eff strong {
    color: rgba(200, 220, 255, 0.95);
    font-weight: 600;
}

.inv-gem-card__hint {
    margin: 0.35rem 0 0;
    font-size: 0.65rem;
    line-height: 1.4;
    color: var(--text-faint);
}

.inv-gem-card__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    margin-top: 0.25rem;
}

.inv-gem-card .inv-gem-merge-btn {
    margin-top: 0.45rem;
    align-self: flex-start;
    letter-spacing: 0.06em;
}

.inv-gem-merge-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.3rem;
    font-size: 0.76rem;
}

.inv-mat-card {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.1rem;
    min-height: 9.6rem;
    height: auto;
    align-self: start;
    border-radius: 11px;
    border: 1px solid rgba(180, 100, 220, 0.22);
    background: linear-gradient(145deg, rgba(40, 22, 52, 0.55) 0%, rgba(10, 8, 16, 0.85) 100%);
    box-shadow: 0 4px 22px rgba(0, 0, 0, 0.28);
}

.inv-mat-card__meta {
    /* flex-basis 用 0 时，在部分浏览器 + Grid 行高计算下会低估内容高度，导致卡片与下一行重叠 */
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.inv-mat-card__icon {
    flex-shrink: 0;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(200, 120, 255, 0.12);
    border: 1px solid rgba(200, 120, 255, 0.28);
    font-size: 1.35rem;
    color: rgba(230, 180, 255, 0.95);
}

.inv-mat-card__name {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 0.25rem;
}

.inv-mat-card__count {
    display: block;
    font-size: 0.78rem;
    color: rgba(200, 180, 255, 0.9);
    letter-spacing: 0.06em;
    margin-bottom: 0.45rem;
}

.inv-mat-card__desc {
    margin: 0;
    font-size: 0.72rem;
    color: var(--text-muted);
    line-height: 1.5;
}

.inv-mat-card__actions {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.4rem;
    margin-top: 0.5rem;
    width: 100%;
}

.inv-mat-card__actions .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* 批量使用靠右，与主操作同一行 */
.inv-mat-card__actions .btn--ghost {
    margin-left: auto;
}

.inv-mat-card__market {
    margin-top: 0.55rem;
    align-self: flex-start;
    font-size: 0.68rem;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    border: 1px solid rgba(200, 160, 255, 0.35);
    color: rgba(230, 200, 255, 0.95);
    background: rgba(12, 8, 20, 0.65);
}

.inv-mat-card__market:hover {
    border-color: rgba(228, 199, 106, 0.45);
    color: rgba(255, 235, 190, 0.98);
}

.inv-mat-card--enchant {
    margin-top: 0;
    border-color: rgba(242, 213, 122, 0.28);
    background: linear-gradient(145deg, rgba(50, 36, 14, 0.5) 0%, rgba(16, 12, 8, 0.86) 100%);
}

.inv-mat-card--god-essence {
    border-color: rgba(200, 160, 255, 0.32);
    background: linear-gradient(145deg, rgba(36, 22, 48, 0.52) 0%, rgba(12, 10, 22, 0.88) 100%);
}

.inv-mat-card--god-essence .inv-mat-card__icon {
    background: rgba(200, 160, 255, 0.12);
    border-color: rgba(210, 170, 255, 0.35);
    color: rgba(230, 200, 255, 0.96);
}

.inv-mat-card--life-potion {
    border-color: rgba(120, 200, 160, 0.32);
    background: linear-gradient(145deg, rgba(18, 42, 38, 0.5) 0%, rgba(8, 14, 16, 0.86) 100%);
}

.inv-mat-card--life-potion .inv-mat-card__icon {
    background: rgba(100, 200, 150, 0.14);
    border-color: rgba(120, 220, 170, 0.3);
    color: rgba(160, 240, 200, 0.95);
}

.inv-mat-card--pet-exp-fruit {
    border-color: rgba(200, 170, 90, 0.35);
    background: linear-gradient(145deg, rgba(48, 38, 18, 0.55) 0%, rgba(12, 10, 6, 0.88) 100%);
}

.inv-mat-card--pet-exp-fruit .inv-mat-card__icon {
    background: rgba(212, 175, 55, 0.12);
    border-color: rgba(228, 199, 106, 0.32);
    color: rgba(255, 220, 150, 0.96);
}

.inv-mat-card__buff {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.72rem;
    line-height: 1.35;
    color: rgba(190, 210, 170, 0.92);
}

#invSplitMat .inv-panel__hint {
    display: none;
}

.inv-mat-card--enchant .inv-mat-card__icon {
    background: rgba(242, 213, 122, 0.12);
    border-color: rgba(242, 213, 122, 0.32);
    color: rgba(255, 232, 170, 0.96);
}

.eq-meta-stars {
    margin: 0.28rem 0 0.5rem;
    font-size: 0.6rem;
    line-height: 1.4;
    color: rgba(255, 210, 140, 0.88);
    letter-spacing: 0.04em;
}

.eq-meta-enchant {
    margin: -0.15rem 0 0.5rem;
    font-size: 0.6rem;
    line-height: 1.4;
    color: rgba(255, 235, 185, 0.9);
    letter-spacing: 0.04em;
}

.eq-meta-armor-class {
    margin: 0.15rem 0 0.4rem;
    font-size: 0.6rem;
    line-height: 1.42;
    color: var(--text-muted);
}

.eq-set-block {
    margin: 0.35rem 0 0.45rem;
    font-size: 0.58rem;
    line-height: 1.38;
    color: var(--text-muted);
}

.eq-set-block__title {
    margin: 0 0 0.2rem;
    font-size: 0.62rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--text);
}

.eq-set-block__meta {
    margin: 0 0 0.28rem;
    font-size: 0.56rem;
    line-height: 1.35;
    opacity: 0.92;
}

.eq-set-block__ul {
    margin: 0;
    padding-left: 0.95rem;
    list-style: disc;
    font-size: 0.56rem;
    line-height: 1.36;
}

.eq-set-block__ul li {
    margin: 0.05rem 0;
}

/* 套装信息折叠按钮（details/summary） */
.eq-set-collapse {
    margin: 0.55rem 0 0;
}

.eq-set-collapse__summary {
    cursor: pointer;
    user-select: none;
    list-style: none;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--text);
    padding: 0.32rem 0.55rem;
    border-radius: 10px;
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: rgba(0, 0, 0, 0.18);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

/* 隐藏默认披露三角 */
.eq-set-collapse__summary::-webkit-details-marker {
    display: none;
}

/* 折叠符号：三角（关闭向下 / 展开向上） */
.eq-set-collapse__summary::before {
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid var(--gold);
    /* 默认 details 关闭：向下（下翻） */
    transform: rotate(180deg);
    transition: transform 0.16s ease;
    opacity: 0.95;
}

.eq-set-collapse[open] .eq-set-collapse__summary::before {
    transform: rotate(0deg);
}

.eq-enhance-block {
    margin: 0.6rem 0 0;
    padding: 0.35rem 0.48rem;
    border-radius: 8px;
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.28);
}

.eq-enhance-row {
    margin-top: 0.6rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11.25rem, 1fr));
    gap: 0.42rem;
}

.eq-enhance-row .eq-enhance-block {
    margin: 0;
}

.eq-enhance-block__title {
    margin: 0 0 0.22rem;
    font-size: 0.56rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--accent);
}

.eq-enhance-block__line {
    margin: 0 0 0.18rem;
    font-size: 0.56rem;
    line-height: 1.36;
    color: var(--text);
}

.eq-enhance-block__muted {
    color: var(--text-muted);
    font-size: 0.52rem;
}

.eq-enhance-block__btn {
    margin-top: 0.32rem;
    font-size: 0.58rem;
    padding: 0.16rem 0.38rem;
}

.eq-enchant-block {
    border-color: rgba(242, 213, 122, 0.28);
    background: linear-gradient(145deg, rgba(42, 30, 12, 0.38) 0%, rgba(8, 6, 3, 0.5) 100%);
}

.eq-divine-block {
    border-color: rgba(200, 160, 255, 0.35);
    background: linear-gradient(145deg, rgba(38, 24, 52, 0.42) 0%, rgba(10, 8, 18, 0.55) 100%);
}

.eq-divine-block .eq-enhance-block__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
}

.eq-divine-block .eq-enhance-block__btn .fas {
    font-size: 0.92em;
    opacity: 0.95;
}

@media (max-width: 740px) {
    .eq-enhance-row {
        grid-template-columns: 1fr;
    }
}

.icon-btn--inv-close {
    flex-shrink: 0;
    margin-top: 0.2rem;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.25);
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.icon-btn--inv-close:hover {
    background: rgba(212, 175, 55, 0.12);
    border-color: rgba(212, 175, 55, 0.4);
    color: var(--accent);
}

.modal-sheet__head-actions {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    flex-shrink: 0;
}

.icon-btn--inv-inbox {
    position: relative;
    flex-shrink: 0;
    margin-top: 0.2rem;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.25);
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.icon-btn--inv-inbox:hover {
    background: rgba(212, 175, 55, 0.12);
    border-color: rgba(212, 175, 55, 0.4);
    color: var(--accent);
}

.inv-inbox-badge {
    position: absolute;
    top: -0.35rem;
    right: -0.35rem;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: #c62828;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1.1rem;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}

.modal-container--inv-gift-inbox {
    z-index: 5030;
    background: rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overscroll-behavior: contain;
}

body.inv-gift-inbox-open #inventory.modal-container {
    pointer-events: none !important;
}

.inv-gift-inbox-sheet {
    position: relative;
    z-index: 1;
    width: min(100%, 28rem);
    max-height: min(88dvh, 36rem);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, rgba(26, 26, 46, 0.98) 0%, rgba(12, 12, 22, 0.99) 100%);
    color: var(--text);
    border-radius: 14px;
    border: 2px solid rgba(255, 215, 0, 0.78);
    box-shadow: 0 0 36px rgba(255, 215, 0, 0.18), 0 20px 48px rgba(0, 0, 0, 0.65);
}

.inv-gift-inbox-head {
    flex-shrink: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid rgba(212, 175, 55, 0.14);
    background: linear-gradient(165deg, rgba(212, 175, 55, 0.1) 0%, rgba(0, 0, 0, 0.15) 100%);
}

.inv-gift-inbox-eyebrow {
    margin: 0 0 0.3rem;
    font-size: 0.62rem;
    letter-spacing: 0.2em;
    color: var(--accent);
    opacity: 0.9;
}

.inv-gift-inbox-title {
    margin: 0 0 0.25rem;
    font-size: 1.25rem;
    color: var(--text);
}

.inv-gift-inbox-cap {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-muted);
}

.icon-btn--inv-gift-inbox-close {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.25);
}

.icon-btn--inv-gift-inbox-close:hover {
    background: rgba(212, 175, 55, 0.12);
    border-color: rgba(212, 175, 55, 0.4);
    color: var(--accent);
}

.inv-gift-inbox-hint {
    flex-shrink: 0;
    margin: 0;
    padding: var(--space-sm) var(--space-lg);
    font-size: 0.78rem;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-subtle);
    line-height: 1.45;
}

.inv-gift-inbox-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.inv-gift-inbox-empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-xl);
    color: var(--text-muted);
    font-size: 0.9rem;
}

.inv-gift-inbox-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    margin: 0;
    padding: var(--space-md) var(--space-lg) var(--space-lg);
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.inv-gift-inbox-item {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.25rem 0.75rem;
    align-items: center;
    padding: var(--space-md);
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.14);
    background: rgba(0, 0, 0, 0.22);
}

.inv-gift-inbox-item__meta {
    grid-column: 1;
    grid-row: 1;
    font-size: 0.72rem;
    color: var(--text-muted);
}

.inv-gift-inbox-item__item {
    grid-column: 1;
    grid-row: 2;
    font-size: 0.92rem;
    color: var(--text);
    word-break: break-word;
}

.inv-gift-inbox-claim {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
}

.inv-toolbar {
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid var(--border-subtle);
    background: rgba(0, 0, 0, 0.18);
}

.inv-toolbar--view {
    border-top: 1px solid rgba(212, 175, 55, 0.08);
    background: rgba(0, 0, 0, 0.12);
}

.inv-toolbar--view .inv-toolbar__filter {
    flex: 1 1 10rem;
    min-width: min(100%, 12rem);
    max-width: 22rem;
}

.inv-toolbar__group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-sm);
}

.inv-toolbar__group--sell {
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.75rem;
}

.inv-auto-batch {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    user-select: none;
    font-size: 0.72rem;
    color: rgba(180, 188, 204, 0.92);
    letter-spacing: 0.05em;
}

.inv-auto-batch__input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.inv-auto-batch__track {
    position: relative;
    flex-shrink: 0;
    width: 2.45rem;
    height: 1.32rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(212, 175, 55, 0.22);
    transition: background 0.2s, border-color 0.2s;
}

.inv-auto-batch__track::after {
    content: "";
    position: absolute;
    top: 0.11rem;
    left: 0.14rem;
    width: 1.02rem;
    height: 1.02rem;
    border-radius: 50%;
    background: rgba(200, 206, 220, 0.88);
    transition: transform 0.2s ease, background 0.2s;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.inv-auto-batch__input:checked + .inv-auto-batch__track {
    background: rgba(212, 175, 55, 0.2);
    border-color: rgba(212, 175, 55, 0.42);
}

.inv-auto-batch__input:checked + .inv-auto-batch__track::after {
    transform: translateX(1.05rem);
    background: var(--gold);
}

.inv-auto-batch__input:focus-visible + .inv-auto-batch__track {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.inv-auto-batch__text {
    white-space: nowrap;
}

.inv-toolbar__label {
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-muted);
    font-weight: 600;
}

.inv-toolbar__sell {
    min-height: 2.25rem;
    padding-inline: 1rem;
}

.inv-toolbar__filter {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: min(100%, 14rem);
    flex: 1 1 12rem;
}

.inv-toolbar__filter-lbl {
    font-size: 0.72rem;
    color: var(--text-muted);
    letter-spacing: 0.06em;
}

.inv-toolbar__filter--lvl {
    flex: 1 1 9rem;
    min-width: min(100%, 10.5rem);
    max-width: 18rem;
}

.inv-toolbar__lvl-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.2rem;
}

.inv-toolbar__lvl-inp {
    flex: 0 0 auto;
}

.select-field--inv {
    width: 100%;
    min-height: 2.35rem;
    padding: 0.45rem 0.65rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: rgba(0, 0, 0, 0.35);
    color: var(--text);
    font-size: 0.88rem;
}

.select-field--inv:focus-visible {
    border-color: var(--accent);
}

.inv-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
}

@media (min-width: 880px) {
    .inv-body {
        flex-direction: row;
        align-items: stretch;
    }

    .inv-panel--bag {
        border-right: 1px solid rgba(212, 175, 55, 0.1);
    }

    .inv-panel--wear {
        width: 17.5rem;
        flex-shrink: 0;
        padding: var(--space-md) var(--space-lg) var(--space-lg) var(--space-md);
        display: flex;
        flex-direction: column;
    }

    .inv-panel--wear .inv-equip-card {
        flex: 1;
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .equip-strip--inv {
        flex: 1;
        align-content: flex-start;
    }
}

.inv-panel--bag {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.inv-panel__hd {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-md);
    flex-shrink: 0;
    padding: var(--space-md) var(--space-lg) var(--space-sm);
}

.inv-panel__title {
    font-family: var(--font-display);
    font-size: 0.92rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--gold);
}

.inv-panel__title-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.inv-panel__title-row--gem-actions {
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.inv-panel__title-row--gem-actions .inv-gem-merge-all-btn {
    flex-shrink: 0;
    max-width: 100%;
}

.inv-panel__cap {
    font-size: 0.75rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    color: rgba(180, 188, 204, 0.82);
}

.inv-mat-cloud-sync {
    display: inline-block;
    margin-left: 0.65rem;
    padding: 0.12rem 0.45rem;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    border-radius: 4px;
    vertical-align: middle;
}
.inv-mat-cloud-sync--ok {
    color: #7dcea0;
    background: rgba(72, 160, 110, 0.14);
}
.inv-mat-cloud-sync--pending {
    color: #e8c87a;
    background: rgba(200, 160, 60, 0.16);
}
.inv-mat-cloud-sync--dirty {
    color: #e8a07a;
    background: rgba(200, 120, 60, 0.14);
}

.inv-panel__hint {
    font-size: 0.72rem;
    color: var(--text-muted);
}

.inv-grid {
    flex: 1;
    /* flex 子项必须 min-height:0，否则网格会撑满父级并被 overflow:hidden 裁切而无法滚动 */
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    padding: var(--space-sm) var(--space-lg) var(--space-lg);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12.75rem, 1fr));
    gap: 0.65rem;
    align-content: start;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

/* 宝石分页：内层 .inv-gem-grid 已负责三列，外层若沿用 auto-fill 会生成多列，
   唯一子元素只占第一轨，列宽被均分后极窄，卡片会塌成竖条 */
#playerInventoryGems.inv-grid {
    grid-template-columns: minmax(0, 1fr);
}

/* 材料卡含双按钮，列宽略增以免挤换行 */
#playerInventoryMaterials.inv-grid {
    grid-template-columns: repeat(auto-fill, minmax(15.25rem, 1fr));
    min-height: 10rem;
    align-items: start;
    grid-auto-rows: min-content;
    gap: 0.75rem;
}

/* 装备分页：行高随卡片内容，避免神话品质卡（overflow:hidden）与绝对定位「上架」被裁切 */
#playerInventory.inv-grid {
    grid-auto-rows: min-content;
    align-items: start;
}

#playerInventoryMaterials.inv-grid > .inv-mat-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* 行囊列表：略加宽滚动条，便于发现可滚动 */
#playerInventory.inv-grid::-webkit-scrollbar,
#playerInventoryMaterials.inv-grid::-webkit-scrollbar,
#playerInventoryGems.inv-grid::-webkit-scrollbar {
    width: 8px;
}

.inv-empty {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2.5rem 1.5rem;
    margin: 0.5rem 0 1rem;
    border-radius: var(--radius-sm);
    border: 1px dashed rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.2);
    color: var(--text-muted);
    font-size: 0.92rem;
    line-height: 1.6;
}

.inv-empty__icon {
    font-size: 2rem;
    color: var(--accent);
    opacity: 0.38;
    margin-bottom: 0.75rem;
    line-height: 1;
}

.inv-empty strong {
    display: block;
    color: var(--text);
    font-size: 1rem;
    margin-bottom: 0.35rem;
    font-weight: 600;
}

.inv-empty span {
    max-width: 18rem;
}

.inv-empty--equip {
    padding: 1.25rem 1rem;
    margin: 0;
    min-height: auto;
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.06);
}

.inv-empty--equip .inv-empty__icon {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.inv-slot {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-self: start;
    gap: 0.75rem;
    padding: 0.8rem 0.9rem;
    padding-top: 2.1rem;
    border-radius: 11px;
    border: 1px solid rgba(212, 175, 55, 0.16);
    background: linear-gradient(145deg, rgba(22, 28, 42, 0.9) 0%, rgba(10, 12, 20, 0.75) 100%);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
}

.inv-slot--mythic {
    overflow: hidden;
    isolation: isolate;
    border-color: rgba(255, 220, 160, 0.5);
    box-shadow: 0 0 18px rgba(255, 185, 92, 0.2), 0 0 34px rgba(175, 120, 255, 0.12), inset 0 0 14px rgba(255, 255, 255, 0.04);
    animation: rarity-card-enter-mythic 0.52s cubic-bezier(0.22, 0.9, 0.2, 1.05) both, mythic-card-pulse 2.1s ease-in-out infinite 0.52s;
}

.inv-slot--mythic::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(120deg, rgba(255, 220, 160, 0.92) 0%, rgba(167, 139, 250, 0.95) 30%, rgba(244, 114, 182, 0.95) 60%, rgba(255, 220, 160, 0.92) 100%);
    background-size: 240% 100%;
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0;
    animation: mythic-card-border-sheen 2.4s linear infinite;
}

.inv-slot--mythic::after {
    content: "";
    position: absolute;
    inset: -18%;
    border-radius: 12px;
    pointer-events: none;
    z-index: -1;
    background:
        radial-gradient(circle at 18% 20%, rgba(255, 224, 138, 0.28), transparent 42%),
        radial-gradient(circle at 78% 24%, rgba(167, 139, 250, 0.24), transparent 40%),
        radial-gradient(circle at 52% 86%, rgba(244, 114, 182, 0.2), transparent 44%);
    filter: blur(10px);
    animation: mythic-card-aura-breath 2.6s ease-in-out infinite;
}

.inv-slot--locked {
    border-color: rgba(212, 175, 55, 0.32);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.12);
}

/* 全品质阶梯特效：越高越亮、越有动态感 */
.inv-slot--common {
    border-color: rgba(188, 196, 216, 0.22);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 10px rgba(188, 196, 216, 0.06);
    animation: rarity-card-enter-common 0.2s ease-out both;
}

.inv-slot--uncommon {
    border-color: rgba(74, 222, 128, 0.26);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 14px rgba(74, 222, 128, 0.1);
    animation: rarity-card-enter-uncommon 0.24s ease-out both;
}

.inv-slot--rare {
    border-color: rgba(96, 165, 250, 0.34);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 18px rgba(96, 165, 250, 0.16);
    animation: rarity-card-enter-rare 0.28s ease-out both;
}

.inv-slot--epic {
    border-color: rgba(192, 132, 252, 0.42);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 22px rgba(192, 132, 252, 0.2);
    animation: rarity-card-enter-epic 0.34s ease-out both, rarity-card-epic-breath 3.2s ease-in-out infinite 0.34s;
}

.inv-slot--legendary {
    border-color: rgba(255, 211, 110, 0.56);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 26px rgba(255, 185, 92, 0.3);
    animation: rarity-card-enter-legendary 0.4s ease-out both, rarity-card-legendary-breath 2.8s ease-in-out infinite 0.4s;
}

.inv-slot--heirloom {
    border-color: rgba(251, 113, 133, 0.6);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 28px rgba(251, 113, 133, 0.32);
    animation: rarity-card-enter-heirloom 0.45s ease-out both, rarity-card-heirloom-breath 2.6s ease-in-out infinite 0.45s;
}

.inv-slot--common .inv-slot__icon { filter: drop-shadow(0 0 2px rgba(226, 228, 235, 0.2)); }
.inv-slot--uncommon .inv-slot__icon { filter: drop-shadow(0 0 5px rgba(74, 222, 128, 0.3)); }
.inv-slot--rare .inv-slot__icon { filter: drop-shadow(0 0 7px rgba(96, 165, 250, 0.36)); }
.inv-slot--epic .inv-slot__icon { filter: drop-shadow(0 0 9px rgba(192, 132, 252, 0.44)); }
.inv-slot--legendary .inv-slot__icon { filter: drop-shadow(0 0 11px rgba(255, 211, 110, 0.5)); }
.inv-slot--heirloom .inv-slot__icon { filter: drop-shadow(0 0 12px rgba(251, 113, 133, 0.54)); }

.inv-slot__lock {
    position: absolute;
    top: 0.45rem;
    right: 0.45rem;
    z-index: 2;
    width: 1.85rem;
    height: 1.85rem;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid rgba(212, 175, 55, 0.28);
    background: rgba(0, 0, 0, 0.45);
    color: rgba(228, 199, 106, 0.92);
    cursor: pointer;
    font-size: 0.78rem;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.inv-slot__lock:hover {
    background: rgba(212, 175, 55, 0.14);
    border-color: rgba(212, 175, 55, 0.45);
}

.inv-slot__lock:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.inv-slot__market {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    z-index: 2;
    font-size: 0.65rem;
    padding: 0.18rem 0.42rem;
    line-height: 1.2;
    border-radius: 6px;
    border: 1px solid rgba(212, 175, 55, 0.35);
    background: rgba(8, 10, 16, 0.72);
    color: rgba(228, 199, 106, 0.95);
    pointer-events: auto;
}

.inv-slot__market:hover {
    border-color: rgba(212, 175, 55, 0.55);
    background: rgba(212, 175, 55, 0.1);
}

.inv-slot__stars {
    position: absolute;
    top: 0.4rem;
    left: 0.5rem;
    z-index: 2;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: rgba(255, 220, 140, 0.95);
    text-shadow: 0 0 8px rgba(255, 200, 80, 0.35);
    pointer-events: none;
}

.inv-slot:hover {
    border-color: rgba(212, 175, 55, 0.42);
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(212, 175, 55, 0.08);
    transform: translateY(-1px);
}

.inv-slot--mythic:hover {
    transform: translateY(-2px) scale(1.018);
    border-color: rgba(255, 232, 170, 0.82);
    box-shadow: 0 0 24px rgba(255, 194, 106, 0.38), 0 0 46px rgba(167, 139, 250, 0.26), inset 0 0 18px rgba(255, 255, 255, 0.08);
}

.inv-slot--chronarch.inv-slot--mythic::before {
    background: linear-gradient(120deg, rgba(255, 246, 202, 0.98) 0%, rgba(252, 211, 77, 0.98) 35%, rgba(245, 158, 11, 0.96) 65%, rgba(255, 246, 202, 0.98) 100%);
    background-size: 240% 100%;
}

.inv-slot--apexother.inv-slot--mythic::before {
    background: linear-gradient(120deg, rgba(255, 230, 246, 0.98) 0%, rgba(244, 114, 182, 0.98) 30%, rgba(167, 139, 250, 0.98) 62%, rgba(129, 140, 248, 0.95) 82%, rgba(255, 230, 246, 0.98) 100%);
    background-size: 250% 100%;
}

.inv-slot:active {
    transform: translateY(0);
}

.inv-slot__icon {
    flex-shrink: 0;
    width: 2.85rem;
    height: 2.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(212, 175, 55, 0.07);
    border: 1px solid rgba(212, 175, 55, 0.22);
    font-size: 1.15rem;
}

.inv-slot--mythic .inv-slot__icon {
    position: relative;
    overflow: visible;
    z-index: 1;
}

.inv-slot--mythic .inv-slot__icon::before {
    content: "";
    position: absolute;
    inset: -20%;
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
    background:
        conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0deg, rgba(255, 245, 210, 0.9) 48deg, rgba(255, 255, 255, 0) 110deg, rgba(255, 170, 84, 0.55) 170deg, rgba(255, 255, 255, 0) 240deg, rgba(167, 139, 250, 0.62) 320deg, rgba(255, 255, 255, 0) 360deg);
    filter: blur(1px) saturate(1.2);
    animation: mythic-icon-rotate 3.6s linear infinite;
    opacity: 0.95;
}

.inv-slot--mythic .inv-slot__icon::after {
    content: "";
    position: absolute;
    inset: -35%;
    border-radius: 50%;
    pointer-events: none;
    z-index: -2;
    background:
        radial-gradient(circle at 26% 24%, rgba(255, 245, 210, 0.88) 0 7%, transparent 8% 100%),
        radial-gradient(circle at 74% 26%, rgba(167, 139, 250, 0.78) 0 6%, transparent 7% 100%),
        radial-gradient(circle at 68% 76%, rgba(244, 114, 182, 0.75) 0 7%, transparent 8% 100%),
        radial-gradient(circle at 32% 72%, rgba(252, 211, 77, 0.8) 0 6%, transparent 7% 100%);
    filter: blur(0.8px);
    animation: mythic-icon-particles 2.8s ease-in-out infinite;
    opacity: 0.78;
}

.inv-slot--chronarch.inv-slot--mythic .inv-slot__icon::before {
    background:
        conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0deg, rgba(255, 248, 220, 0.95) 54deg, rgba(255, 255, 255, 0) 120deg, rgba(252, 211, 77, 0.62) 182deg, rgba(255, 255, 255, 0) 248deg, rgba(245, 158, 11, 0.72) 324deg, rgba(255, 255, 255, 0) 360deg);
}

.inv-slot--apexother.inv-slot--mythic .inv-slot__icon::before {
    background:
        conic-gradient(from 0deg, rgba(255, 255, 255, 0) 0deg, rgba(255, 230, 246, 0.95) 52deg, rgba(255, 255, 255, 0) 116deg, rgba(244, 114, 182, 0.68) 182deg, rgba(255, 255, 255, 0) 248deg, rgba(129, 140, 248, 0.8) 324deg, rgba(255, 255, 255, 0) 360deg);
}

.inv-slot__icon .eq-weapon-icon {
    margin-right: 0;
}

.inv-slot__icon i,
.inv-equip-btn i {
    margin-right: 0;
}

.inv-slot__meta {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.inv-slot__tier {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: none;
    line-height: 1.2;
}

.inv-slot__realm {
    font-size: 0.62rem;
    font-weight: 500;
    color: rgba(186, 198, 218, 0.92);
    letter-spacing: 0.03em;
    line-height: 1.25;
    word-break: break-word;
}

.inv-slot__name {
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--text);
    word-break: break-word;
}

.inv-slot__name--mythic {
    position: relative;
    display: inline-block;
    font-weight: 700;
    letter-spacing: 0.02em;
    filter: saturate(1.2) brightness(1.08);
}

.inv-slot__name--mythic::after {
    content: attr(data-name);
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.55;
    z-index: -1;
    filter: blur(5px);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.1) 18%, rgba(255, 255, 255, 0.95) 36%, rgba(255, 255, 255, 0.12) 54%, rgba(255, 255, 255, 0.95) 72%, rgba(255, 255, 255, 0.18) 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: rarity-name-ghost-sheen 2.8s linear infinite;
}

.inv-slot__name.Common {
    text-shadow: 0 0 2px rgba(226, 228, 235, 0.2);
}

.inv-slot__name.Uncommon {
    text-shadow: 0 0 6px rgba(74, 222, 128, 0.32);
}

.inv-slot__name.Rare {
    text-shadow: 0 0 8px rgba(96, 165, 250, 0.4);
}

.inv-slot__name.Epic {
    text-shadow: 0 0 10px rgba(192, 132, 252, 0.48);
}

.inv-slot__name.Legendary {
    text-shadow: 0 0 14px rgba(255, 211, 110, 0.72), 0 0 26px rgba(255, 170, 84, 0.42), 0 0 36px rgba(255, 220, 140, 0.22);
    animation: rarity-name-pulse-legendary 2.4s ease-in-out infinite;
}

.inv-slot__name.Heirloom {
    text-shadow: 0 0 15px rgba(251, 113, 133, 0.72), 0 0 28px rgba(251, 113, 133, 0.45), 0 0 38px rgba(251, 113, 133, 0.25);
    animation: rarity-name-pulse-heirloom 2.3s ease-in-out infinite;
}

.inv-slot__name.Etherbound {
    text-shadow: 0 0 16px rgba(94, 234, 212, 0.74), 0 0 30px rgba(94, 234, 212, 0.44), 0 0 40px rgba(94, 234, 212, 0.24);
    animation: rarity-name-pulse-etherbound 2.2s ease-in-out infinite;
}

.inv-slot__name.StellarSign {
    text-shadow: 0 0 17px rgba(165, 180, 252, 0.78), 0 0 32px rgba(165, 180, 252, 0.5), 0 0 44px rgba(165, 180, 252, 0.28);
    animation: rarity-name-pulse-stellarsign 2.1s ease-in-out infinite;
}

.inv-slot__name.Nullforge {
    text-shadow: 0 0 18px rgba(196, 181, 253, 0.8), 0 0 34px rgba(196, 181, 253, 0.52), 0 0 46px rgba(196, 181, 253, 0.3);
    animation: rarity-name-pulse-nullforge 2s ease-in-out infinite;
}

.inv-slot__name.Chronarch {
    text-shadow: 0 0 20px rgba(252, 211, 77, 0.85), 0 0 38px rgba(252, 211, 77, 0.58), 0 0 52px rgba(252, 211, 77, 0.34);
    animation: rarity-name-pulse-chronarch 1.9s ease-in-out infinite;
    background: linear-gradient(120deg, #fff6cc 0%, #fde68a 28%, #f59e0b 52%, #fde68a 76%, #fff6cc 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 0.35px rgba(255, 248, 210, 0.85);
    animation: rarity-name-pulse-chronarch 1.9s ease-in-out infinite, rarity-name-sheen-gold 2.6s linear infinite;
}

.inv-slot__name.Apexother {
    text-shadow: 0 0 22px rgba(244, 114, 182, 0.9), 0 0 42px rgba(167, 139, 250, 0.66), 0 0 58px rgba(244, 114, 182, 0.4);
    background: linear-gradient(120deg, #ffe6f6 0%, #f9a8d4 22%, #c4b5fd 48%, #818cf8 66%, #f9a8d4 84%, #ffe6f6 100%);
    background-size: 240% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 0.35px rgba(255, 230, 246, 0.9);
    animation: rarity-name-pulse-apexother 1.75s ease-in-out infinite, rarity-name-sheen-cosmic 2.2s linear infinite;
}

@keyframes rarity-name-pulse-legendary {
    0%, 100% { text-shadow: 0 0 12px rgba(255, 211, 110, 0.62), 0 0 22px rgba(255, 170, 84, 0.34), 0 0 30px rgba(255, 220, 140, 0.16); }
    50% { text-shadow: 0 0 18px rgba(255, 211, 110, 0.9), 0 0 34px rgba(255, 170, 84, 0.6), 0 0 48px rgba(255, 220, 140, 0.34); }
}

@keyframes rarity-name-pulse-heirloom {
    0%, 100% { text-shadow: 0 0 13px rgba(251, 113, 133, 0.62), 0 0 24px rgba(251, 113, 133, 0.34), 0 0 34px rgba(251, 113, 133, 0.18); }
    50% { text-shadow: 0 0 20px rgba(251, 113, 133, 0.9), 0 0 38px rgba(251, 113, 133, 0.62), 0 0 52px rgba(251, 113, 133, 0.34); }
}

@keyframes rarity-name-pulse-etherbound {
    0%, 100% { text-shadow: 0 0 14px rgba(94, 234, 212, 0.62), 0 0 26px rgba(94, 234, 212, 0.34), 0 0 36px rgba(94, 234, 212, 0.18); }
    50% { text-shadow: 0 0 21px rgba(94, 234, 212, 0.92), 0 0 40px rgba(94, 234, 212, 0.64), 0 0 54px rgba(94, 234, 212, 0.34); }
}

@keyframes rarity-name-pulse-stellarsign {
    0%, 100% { text-shadow: 0 0 15px rgba(165, 180, 252, 0.66), 0 0 28px rgba(165, 180, 252, 0.36), 0 0 40px rgba(165, 180, 252, 0.2); }
    50% { text-shadow: 0 0 23px rgba(165, 180, 252, 0.95), 0 0 44px rgba(165, 180, 252, 0.68), 0 0 58px rgba(165, 180, 252, 0.36); }
}

@keyframes rarity-name-pulse-nullforge {
    0%, 100% { text-shadow: 0 0 16px rgba(196, 181, 253, 0.68), 0 0 30px rgba(196, 181, 253, 0.38), 0 0 42px rgba(196, 181, 253, 0.22); }
    50% { text-shadow: 0 0 24px rgba(196, 181, 253, 0.98), 0 0 46px rgba(196, 181, 253, 0.7), 0 0 60px rgba(196, 181, 253, 0.38); }
}

@keyframes rarity-name-pulse-chronarch {
    0%, 100% { text-shadow: 0 0 17px rgba(252, 211, 77, 0.72), 0 0 32px rgba(252, 211, 77, 0.42), 0 0 46px rgba(252, 211, 77, 0.24); }
    50% { text-shadow: 0 0 26px rgba(252, 211, 77, 1), 0 0 50px rgba(252, 211, 77, 0.74), 0 0 66px rgba(252, 211, 77, 0.42); }
}

@keyframes rarity-name-pulse-apexother {
    0%, 100% { text-shadow: 0 0 18px rgba(244, 114, 182, 0.78), 0 0 34px rgba(167, 139, 250, 0.5), 0 0 48px rgba(244, 114, 182, 0.28); }
    50% { text-shadow: 0 0 30px rgba(244, 114, 182, 1), 0 0 56px rgba(167, 139, 250, 0.8), 0 0 74px rgba(244, 114, 182, 0.5); }
}

@keyframes rarity-name-sheen-gold {
    0% { background-position: 0% 50%; }
    100% { background-position: 220% 50%; }
}

@keyframes rarity-name-sheen-cosmic {
    0% { background-position: 0% 50%; }
    100% { background-position: 240% 50%; }
}

@keyframes rarity-name-ghost-sheen {
    0% { background-position: 0% 50%; opacity: 0.35; }
    50% { opacity: 0.62; }
    100% { background-position: 220% 50%; opacity: 0.35; }
}

@keyframes mythic-card-border-sheen {
    0% { background-position: 0% 50%; }
    100% { background-position: 240% 50%; }
}

@keyframes mythic-card-pulse {
    0%, 100% { box-shadow: 0 0 16px rgba(255, 185, 92, 0.18), 0 0 30px rgba(175, 120, 255, 0.11), inset 0 0 12px rgba(255, 255, 255, 0.04); }
    50% { box-shadow: 0 0 28px rgba(255, 194, 106, 0.34), 0 0 52px rgba(175, 120, 255, 0.24), inset 0 0 22px rgba(255, 255, 255, 0.09); }
}

@keyframes mythic-card-aura-breath {
    0%, 100% { transform: scale(0.98); opacity: 0.55; }
    50% { transform: scale(1.03); opacity: 0.88; }
}

@keyframes mythic-icon-rotate {
    0% { transform: rotate(0deg) scale(0.98); }
    50% { transform: rotate(180deg) scale(1.04); }
    100% { transform: rotate(360deg) scale(0.98); }
}

@keyframes mythic-icon-particles {
    0%, 100% { transform: translateY(0) scale(0.96); opacity: 0.56; }
    50% { transform: translateY(-4px) scale(1.06); opacity: 0.9; }
}

@keyframes rarity-card-epic-breath {
    0%, 100% { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 16px rgba(192, 132, 252, 0.14); }
    50% { box-shadow: 0 6px 24px rgba(0, 0, 0, 0.3), 0 0 28px rgba(192, 132, 252, 0.26); }
}

@keyframes rarity-card-legendary-breath {
    0%, 100% { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 20px rgba(255, 185, 92, 0.2); }
    50% { box-shadow: 0 6px 26px rgba(0, 0, 0, 0.32), 0 0 34px rgba(255, 185, 92, 0.38); }
}

@keyframes rarity-card-heirloom-breath {
    0%, 100% { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25), 0 0 22px rgba(251, 113, 133, 0.24); }
    50% { box-shadow: 0 7px 28px rgba(0, 0, 0, 0.34), 0 0 38px rgba(251, 113, 133, 0.42); }
}

@keyframes rarity-card-enter-common {
    0% { opacity: 0; transform: translateY(2px) scale(0.992); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes rarity-card-enter-uncommon {
    0% { opacity: 0; transform: translateY(3px) scale(0.99); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes rarity-card-enter-rare {
    0% { opacity: 0; transform: translateY(4px) scale(0.988); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes rarity-card-enter-epic {
    0% { opacity: 0; transform: translateY(5px) scale(0.986); filter: brightness(1); }
    55% { filter: brightness(1.06); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: brightness(1); }
}

@keyframes rarity-card-enter-legendary {
    0% { opacity: 0; transform: translateY(7px) scale(0.982); filter: brightness(1); }
    50% { filter: brightness(1.1); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: brightness(1); }
}

@keyframes rarity-card-enter-heirloom {
    0% { opacity: 0; transform: translateY(8px) scale(0.978); filter: brightness(1); }
    48% { filter: brightness(1.13); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: brightness(1); }
}

@keyframes rarity-card-enter-mythic {
    0% { opacity: 0; transform: translateY(10px) scale(0.972); filter: brightness(1); }
    42% { filter: brightness(1.18); }
    100% { opacity: 1; transform: translateY(0) scale(1); filter: brightness(1); }
}

.inv-panel--wear {
    flex-shrink: 0;
    padding: 0 var(--space-lg) var(--space-lg);
}

.inv-equip-card {
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.18);
    background: linear-gradient(180deg, rgba(18, 22, 32, 0.95) 0%, rgba(8, 10, 16, 0.88) 100%);
    padding: var(--space-md) var(--space-lg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.inv-equip-card__hd {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    margin-bottom: 0.35rem;
}

.inv-equip-card__eyebrow {
    display: block;
    font-size: 0.6rem;
    letter-spacing: 0.18em;
    color: var(--accent);
    opacity: 0.85;
    margin-bottom: 0.2rem;
}

.inv-equip-card__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--gold);
    font-family: var(--font-display);
    letter-spacing: 0.06em;
}

.inv-equip-card__hd-actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
}

.inv-title-btn {
    white-space: nowrap;
    border-color: rgba(212, 175, 55, 0.35) !important;
    color: var(--gold) !important;
}

.icon-btn--unequip-all {
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.2);
}

.icon-btn--unequip-all:hover {
    border-color: rgba(224, 82, 82, 0.45);
    color: var(--danger);
    background: rgba(224, 82, 82, 0.08);
}

.inv-equip-card__hint {
    margin: 0 0 var(--space-md);
    font-size: 0.72rem;
    color: var(--text-muted);
    line-height: 1.45;
}

.equip-strip--inv {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: stretch;
}

.inv-equip-slot {
    flex: 0 0 auto;
}

.inv-equip-slot__wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.22rem;
    max-width: 4.5rem;
}

.inv-equip-slot__realm {
    font-size: 0.55rem;
    font-weight: 500;
    line-height: 1.15;
    color: rgba(186, 198, 218, 0.9);
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.inv-equip-slot .inv-equip-btn {
    position: relative;
    width: 3.35rem;
    height: 3.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.35);
    padding: 0;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
    font-size: 1.2rem;
}

.inv-equip-btn__stars {
    position: absolute;
    top: 0.12rem;
    right: 0.12rem;
    font-size: 0.52rem;
    font-weight: 800;
    line-height: 1;
    color: rgba(255, 220, 140, 0.95);
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
    pointer-events: none;
    z-index: 1;
}

.inv-equip-slot .inv-equip-btn:hover {
    border-color: rgba(212, 175, 55, 0.45);
    background: rgba(212, 175, 55, 0.1);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.12);
}

.inv-equip-slot__empty {
    width: 3.35rem;
    min-height: 3.35rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px dashed rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.22);
    padding: 0.2rem;
    box-sizing: border-box;
}

.inv-equip-slot__lbl {
    font-size: 0.58rem;
    color: var(--text-muted);
    letter-spacing: 0.02em;
    text-align: center;
    line-height: 1.25;
    max-width: 3rem;
}

.inv-equip-slot__ph {
    font-size: 0.72rem;
    color: var(--text-faint);
    margin-top: 0.12rem;
}

#playerInventory {
    min-height: 0;
}

@media (max-width: 879px) {
    .inv-split--equip .inv-body {
        flex: 1 1 auto;
        min-height: 0;
    }

    .inv-panel--bag {
        flex: 1 1 auto;
        min-height: 0;
    }

    .inv-panel--wear {
        max-height: min(42vh, 22rem);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 520px) {
    #inventory .content {
        width: 100%;
        min-height: min(85dvh, 40rem);
        max-height: 92dvh;
        height: min(92dvh, 40rem);
        border-radius: var(--radius-sm);
    }

    .inv-grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .modal-sheet__head--inv {
        padding: var(--space-md);
    }

    .inv-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .inv-toolbar__filter {
        min-width: 0;
    }
}

#sectPassivesModal .content {
    width: min(100%, 32rem);
    max-height: min(92dvh, 42rem);
}

.modal-sheet--sect-passives {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.modal-sheet__head--sect {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-md) var(--space-sm);
    background: linear-gradient(165deg, rgba(212, 175, 55, 0.09) 0%, rgba(0, 0, 0, 0.2) 48%, rgba(0, 0, 0, 0.35) 100%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
}

.modal-sheet__head-text .modal-sheet__eyebrow {
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 0.25rem;
    font-family: var(--font-ui);
    opacity: 0.95;
}

.modal-sheet__head--sect h3 {
    font-size: 1.18rem;
    margin: 0;
    color: var(--text);
    text-shadow: 0 1px 12px rgba(212, 175, 55, 0.12);
}

.icon-btn--sect-close {
    margin-top: 0.15rem;
    border-radius: var(--radius-sm);
    transition: background 0.2s, color 0.2s;
}

.icon-btn--sect-close:hover {
    background: rgba(212, 175, 55, 0.12);
    color: var(--accent);
}

.modal-sheet--sect-passives .sect-passives-modal-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    background: linear-gradient(180deg, rgba(8, 10, 15, 0.35) 0%, rgba(15, 18, 25, 0.5) 100%);
}

#petModal {
    overflow: hidden;
}

html.pet-modal-open,
body.pet-modal-open {
    overflow: hidden;
}

#petModal .content {
    width: min(calc(100vw - 1.25rem), 70rem);
    max-width: 100%;
    height: min(calc(92dvh - env(safe-area-inset-bottom, 0px)), 52rem);
    max-height: min(calc(92dvh - env(safe-area-inset-bottom, 0px)), 52rem);
}

/* —— 灵宠面板 · 修仙卷轴 / 玉简风 —— */
.modal-container--pet {
    background: radial-gradient(ellipse 85% 70% at 50% 40%, rgba(20, 32, 28, 0.55), rgba(4, 6, 12, 0.82));
    overflow-x: hidden;
    overflow-y: hidden;
}

#petModal .modal-sheet--pet {
    border: 1px solid rgba(201, 162, 39, 0.38);
    box-shadow:
        0 0 0 1px rgba(90, 160, 140, 0.12),
        0 24px 64px rgba(0, 0, 0, 0.65),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    background:
        radial-gradient(ellipse 120% 80% at 0% 0%, rgba(212, 175, 55, 0.07), transparent 52%),
        radial-gradient(ellipse 90% 60% at 100% 100%, rgba(90, 140, 120, 0.06), transparent 50%),
        linear-gradient(168deg, rgba(16, 22, 32, 0.98) 0%, rgba(8, 11, 18, 0.99) 100%);
}

.modal-sheet--pet {
    display: flex;
    flex-direction: column;
    min-height: 0;
    position: relative;
}

.modal-sheet--pet::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0.35;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}

.modal-sheet__head--pet {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-md) var(--space-lg) var(--space-sm);
    background:
        linear-gradient(180deg, rgba(32, 42, 38, 0.45) 0%, transparent 100%),
        linear-gradient(90deg, rgba(212, 175, 55, 0.1) 0%, transparent 28%);
    border-bottom: 1px solid rgba(90, 160, 140, 0.18);
    position: relative;
}

.modal-sheet__head--pet::after {
    content: "";
    position: absolute;
    left: var(--space-lg);
    right: var(--space-lg);
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.28), transparent);
}

.modal-sheet__eyebrow--pet {
    font-family: var(--font-xian);
    font-size: 0.68rem;
    letter-spacing: 0.35em;
    color: rgba(180, 205, 190, 0.75);
    text-transform: none;
}

.modal-sheet__title--pet {
    font-family: var(--font-xian);
    font-size: 1.28rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    margin: 0.2rem 0 0;
    color: #f0e6c8;
    text-shadow: 0 0 24px rgba(212, 175, 55, 0.25);
}

.icon-btn--pet-close {
    margin-top: 0.15rem;
    border-radius: 4px;
    border: 1px solid rgba(201, 162, 39, 0.35);
    background: rgba(0, 0, 0, 0.35);
    color: rgba(220, 200, 150, 0.85);
}

.icon-btn--pet-close:hover {
    background: rgba(90, 160, 140, 0.15);
    color: var(--jade);
    border-color: rgba(90, 184, 154, 0.45);
}

.pet-modal-body {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    padding: 0;
    background:
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 3px,
            rgba(40, 52, 48, 0.12) 3px,
            rgba(40, 52, 48, 0.12) 4px
        ),
        linear-gradient(175deg, rgba(12, 16, 22, 0.92) 0%, rgba(6, 9, 14, 0.96) 100%);
}

#petModal .pet-modal-body::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

#petModal .pet-modal-body::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

#petModal .pet-modal-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(160, 130, 70, 0.55), rgba(90, 70, 40, 0.65));
    border-radius: 4px;
    border: 1px solid rgba(212, 175, 55, 0.2);
}

.pet-ui {
    padding: var(--space-md) var(--space-md) calc(var(--space-md) + 0.15rem);
    font-size: 0.86rem;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow-x: hidden;
    box-sizing: border-box;
}

.pet-ui__hero {
    display: grid;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
}

.pet-ui__kicker {
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.pet-ui__title {
    margin: 0.2rem 0 0;
    font-size: 1.05rem;
    color: var(--text);
}

.pet-ui__realm {
    color: var(--accent);
}

.pet-ui__intro-block {
    position: relative;
    margin-bottom: var(--space-sm);
    padding: 0.5rem 0.75rem 0.5rem 1rem;
    border-radius: 2px;
    background:
        linear-gradient(90deg, rgba(212, 175, 55, 0.08) 0%, rgba(0, 0, 0, 0.12) 40%),
        rgba(8, 12, 18, 0.5);
    border: 1px solid rgba(201, 162, 39, 0.22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.pet-ui__intro-block::before {
    content: "";
    position: absolute;
    left: 0.45rem;
    top: 0.5rem;
    bottom: 0.5rem;
    width: 3px;
    border-radius: 1px;
    background: linear-gradient(180deg, rgba(90, 184, 154, 0.55), rgba(212, 175, 55, 0.45));
    box-shadow: 0 0 8px rgba(90, 184, 154, 0.25);
}

.pet-ui__hint {
    margin: 0;
    color: rgba(190, 198, 210, 0.92);
    line-height: 1.5;
    font-size: 0.8rem;
}

.pet-ui__hint strong {
    color: #f2e4b8;
    font-weight: 600;
    text-shadow: 0 0 12px rgba(212, 175, 55, 0.35);
}

/* 灵宠：左栏列表 · 右栏详情 */
.pet-ui__layout {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex: 1;
    height: 100%;
    gap: var(--space-md);
    min-height: 0;
    position: relative;
}

.pet-ui__layout::before {
    content: "";
    position: absolute;
    left: 33%;
    top: 0.25rem;
    bottom: 0.25rem;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(212, 175, 55, 0.22), transparent);
    opacity: 0.9;
    pointer-events: none;
}

.pet-ui__col {
    min-width: 0;
}

.pet-ui__col--left {
    flex: 0 1 31%;
    max-width: 35%;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.pet-ui__col--right {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
}

.pet-ui__roster-head {
    margin: 0 0 0.65rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(90, 160, 140, 0.2);
}

.pet-ui__roster-title {
    margin: 0;
    font-family: var(--font-xian);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.pet-ui__roster-cap {
    color: rgba(230, 215, 175, 0.95);
}

.pet-ui__roster-count {
    font-family: var(--font-ui);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: rgba(160, 170, 185, 0.88);
}

.pet-ui__fragments {
    margin-left: auto;
    font-family: var(--font-ui);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: rgba(212, 175, 55, 0.92);
}

.pet-ui__stars,
.pet-roster__stars {
    color: rgba(255, 210, 90, 0.95);
    letter-spacing: 0.06em;
    font-size: 0.88em;
}

.pet-ui__star-row {
    margin: 0.35rem 0 0.5rem;
}

.pet-ui__section--star {
    margin-top: 0.75rem;
}

/* 灵宠法器 · 升星 并排（法器左、升星右；窄屏纵向堆叠） */
.pet-ui__peq-star-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--space-lg);
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px dashed rgba(140, 100, 200, 0.28);
}

.pet-ui__peq-star-row .pet-ui__section {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    flex: 1 1 0;
    min-width: 0;
}

.pet-ui__peq-star-row .pet-ui__section--star {
    padding-left: var(--space-md);
    border-left: 1px solid rgba(212, 175, 55, 0.22);
}

.pet-ui__detail-panel {
    flex: 1;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: var(--space-sm) var(--space-md);
    padding-right: calc(var(--space-md) - 0.15rem);
    border-radius: 2px;
    background:
        radial-gradient(ellipse 100% 80% at 50% 0%, rgba(212, 175, 55, 0.06), transparent 55%),
        linear-gradient(165deg, rgba(18, 24, 30, 0.75) 0%, rgba(6, 10, 16, 0.82) 100%);
    border: 1px solid rgba(201, 162, 39, 0.28);
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    position: relative;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.pet-ui__detail-panel::-webkit-scrollbar {
    width: 8px;
}

.pet-ui__detail-panel::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

.pet-ui__detail-panel::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(160, 130, 70, 0.55), rgba(90, 70, 40, 0.65));
    border-radius: 4px;
    border: 1px solid rgba(212, 175, 55, 0.2);
}

.pet-ui__detail-panel::before,
.pet-ui__detail-panel::after {
    content: "◆";
    position: absolute;
    font-size: 0.45rem;
    color: rgba(212, 175, 55, 0.35);
    pointer-events: none;
}

.pet-ui__detail-panel::before {
    top: 0.35rem;
    left: 0.35rem;
}

.pet-ui__detail-panel::after {
    bottom: 0.35rem;
    right: 0.35rem;
}

.pet-ui__detail {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    min-width: 0;
}

.pet-ui__detail-head {
    padding-bottom: 0.5rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid rgba(90, 160, 140, 0.15);
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.04), transparent 70%);
}

.pet-ui__name-row {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.pet-ui__name-row .pet-ui__detail-title {
    flex: 1 1 auto;
    min-width: 0;
}

.pet-rename-modal__lead {
    margin: 0 0 0.75rem;
}

.pet-rename-modal__label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.86rem;
    color: rgba(210, 220, 230, 0.92);
}

.pet-rename-modal__input {
    display: block;
    width: 100%;
    max-width: 18rem;
    box-sizing: border-box;
    margin-bottom: 0.45rem;
    padding: 0.45rem 0.55rem;
    font-size: 0.95rem;
    color: #f0f4f8;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(140, 180, 160, 0.35);
    border-radius: 3px;
}

.pet-rename-modal__input:focus {
    outline: none;
    border-color: rgba(212, 175, 55, 0.55);
}

.pet-rename-modal__hint {
    margin: 0 0 0.85rem;
    font-size: 0.78rem;
    color: rgba(160, 170, 185, 0.95);
    line-height: 1.45;
}

.pet-ui__realm-line {
    margin: 0.35rem 0 0;
    font-size: 0.84rem;
    font-weight: 600;
    font-family: var(--font-xian);
    color: #d4c896;
    letter-spacing: 0.08em;
}

.pet-ui__section {
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(90, 160, 140, 0.12);
}

.pet-ui__section--identity {
    margin-top: 0.55rem;
    padding-top: 0;
    border-top: none;
}

/* 机缘加成 · 斗法推演 并排（窄屏自动纵向堆叠） */
.pet-ui__bonus-combat-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--space-lg);
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(90, 160, 140, 0.12);
}

.pet-ui__bonus-combat-row .pet-ui__section {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    flex: 1 1 0;
    min-width: 0;
}

.pet-ui__bonus-combat-row .pet-ui__section--combat {
    padding-left: var(--space-md);
    border-left: 1px solid rgba(90, 160, 140, 0.15);
}

.pet-ui__section-title {
    margin: 0 0 0.4rem;
    font-size: 0.88rem;
    font-weight: 700;
    font-family: var(--font-xian);
    letter-spacing: 0.1em;
    color: rgba(230, 220, 195, 0.95);
}

.pet-ui__section-title::before {
    content: "「";
    opacity: 0.45;
    margin-right: 0.15em;
}

.pet-ui__section-title::after {
    content: "」";
    opacity: 0.45;
    margin-left: 0.15em;
}

.pet-ui__section--combat .pet-ui__section-title::before,
.pet-ui__section--combat .pet-ui__section-title::after {
    content: none;
    margin: 0;
}

.pet-ui__section--combat .pet-ui__section-title {
    letter-spacing: 0.06em;
}

.pet-ui__section--combat .pet-ui__section-title::before {
    content: "";
    display: inline-block;
    width: 0.45rem;
    height: 0.45rem;
    margin-right: 0.4rem;
    vertical-align: middle;
    background: radial-gradient(circle, rgba(212, 175, 55, 0.6), transparent 70%);
}

.pet-ui__section-tag {
    margin-left: 0.35rem;
    padding: 0.15rem 0.5rem;
    font-size: 0.62rem;
    font-weight: 600;
    vertical-align: middle;
    border-radius: 2px;
    font-family: var(--font-xian);
    letter-spacing: 0.08em;
    color: rgba(40, 32, 20, 0.92);
    background: linear-gradient(165deg, #e8d49a 0%, #b89850 100%);
    border: 1px solid rgba(120, 90, 40, 0.5);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.pet-ui__section-note {
    margin: 0 0 0.45rem;
    font-size: 0.7rem;
    line-height: 1.4;
    color: var(--text-muted);
}

.pet-ui__type-readonly {
    margin: 0 0 0.5rem;
    line-height: 1.5;
}

.pet-ui__type-lock {
    font-size: 0.72rem;
    color: var(--text-muted);
    font-weight: 400;
}

.pet-ui__stats--cols {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem 0.45rem;
}

.pet-ui__stats--cols li {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.38rem 0.45rem;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(201, 162, 39, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.pet-ui__stat-name {
    color: rgba(170, 180, 195, 0.9);
    font-size: 0.72rem;
    line-height: 1.25;
    flex: none;
    min-width: 0;
}

.pet-ui__stat-pct {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #e8c86a;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.2);
    font-size: 0.76rem;
    line-height: 1.2;
    width: 100%;
    text-align: right;
    align-self: flex-end;
}

.pet-ui__stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem 0.5rem;
}

.pet-ui__stat-cell {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    padding: 0.4rem 0.45rem;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(90, 160, 140, 0.18);
}

.pet-ui__stat-cell--wide {
    grid-column: 1 / -1;
}

.pet-ui__stat-label {
    font-size: 0.7rem;
    color: var(--text-muted);
    letter-spacing: 0.02em;
}

.pet-ui__stat-val {
    font-size: 0.92rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}

@media (max-width: 640px) {
    .pet-ui__layout::before {
        display: none;
    }

    .pet-ui__layout {
        flex-direction: column;
        min-height: 0;
    }

    .pet-ui__col--left {
        max-width: none;
        flex: 0 0 auto;
    }

    .pet-ui__col--right {
        flex: 1 1 auto;
    }

    .pet-ui__bonus-combat-row {
        flex-direction: column;
        gap: 0.65rem;
    }

    .pet-ui__bonus-combat-row .pet-ui__section--combat {
        padding-left: 0;
        border-left: none;
        padding-top: 0.65rem;
        border-top: 1px solid rgba(90, 160, 140, 0.12);
    }

    .pet-ui__peq-star-row {
        flex-direction: column;
        gap: 0.65rem;
    }

    .pet-ui__peq-star-row .pet-ui__section--star {
        padding-left: 0;
        border-left: none;
        padding-top: 0.65rem;
        border-top: 1px dashed rgba(212, 175, 55, 0.22);
    }
}

.pet-ui__expbar {
    position: relative;
    height: 1.5rem;
    border-radius: 2px;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(20, 28, 32, 0.4));
    border: 1px solid rgba(90, 160, 140, 0.25);
    overflow: hidden;
    box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.45);
}

.pet-ui__expbar--jade .pet-ui__expbar-fill {
    background: linear-gradient(
        90deg,
        rgba(70, 140, 120, 0.75) 0%,
        rgba(90, 184, 154, 0.55) 35%,
        rgba(212, 175, 55, 0.42) 100%
    );
    box-shadow: 0 0 16px rgba(90, 184, 154, 0.25);
}

.pet-ui__expbar-fill {
    height: 100%;
    background: linear-gradient(90deg, rgba(138, 99, 210, 0.55), rgba(212, 175, 55, 0.35));
    transition: width 0.25s ease;
}

.pet-ui__expbar-lbl {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 600;
    font-family: var(--font-xian);
    letter-spacing: 0.06em;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9), 0 0 12px rgba(0, 0, 0, 0.5);
    pointer-events: none;
    color: rgba(248, 244, 230, 0.95);
}

.pet-ui__grid {
    display: grid;
    gap: var(--space-md);
}

@media (min-width: 540px) {
    .pet-ui__grid {
        grid-template-columns: 1fr 1fr;
    }
}

.pet-ui__card {
    padding: var(--space-md);
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(212, 175, 55, 0.1);
}

.pet-ui__card h5 {
    margin: 0 0 0.35rem;
    font-size: 0.82rem;
    color: var(--accent);
}

.pet-ui__roots {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin: 0.4rem 0 0.45rem;
}

.pet-root-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4rem;
    padding: 0.28rem 0.42rem;
    border-radius: 2px;
    font-size: 0.74rem;
    font-family: var(--font-xian);
    letter-spacing: 0.06em;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: linear-gradient(165deg, rgba(28, 36, 44, 0.9), rgba(12, 16, 22, 0.95));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 2px 4px rgba(0, 0, 0, 0.35);
}

.pet-root-tag--metal { border-color: rgba(212, 175, 55, 0.45); color: #e8d49a; }
.pet-root-tag--wood { border-color: rgba(90, 180, 120, 0.45); color: #a8ddb8; }
.pet-root-tag--water { border-color: rgba(90, 160, 220, 0.45); color: #a8c8f0; }
.pet-root-tag--fire { border-color: rgba(220, 100, 80, 0.5); color: #f0a898; }
.pet-root-tag--earth { border-color: rgba(180, 140, 90, 0.45); color: #d8c4a0; }

.pet-ui__lbl {
    display: block;
    font-size: 0.72rem;
    color: var(--text-muted);
    margin: 0.5rem 0 0.25rem;
}

.pet-ui__select {
    width: 100%;
    padding: 0.4rem 0.5rem;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(212, 175, 55, 0.18);
    color: var(--text);
}

.pet-ui__muted {
    font-size: 0.72rem;
    color: var(--text-muted);
    margin: 0.45rem 0 0.5rem;
    line-height: 1.4;
}

.pet-ui__stats {
    margin: 0;
    padding-left: 1.1rem;
    line-height: 1.55;
}

.pet-ui--collection .pet-ui__roster {
    flex: 1;
    min-height: 0;
    margin-bottom: 0;
    padding: var(--space-sm);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    border-radius: 2px;
    background:
        linear-gradient(180deg, rgba(20, 28, 32, 0.5) 0%, rgba(8, 12, 18, 0.65) 100%);
    border: 1px solid rgba(201, 162, 39, 0.2);
    overflow: hidden;
    box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.25);
}

.pet-ui--collection .pet-ui__roster h5 {
    margin: 0 0 0.5rem;
    font-size: 0.85rem;
    color: var(--accent);
}

.pet-ui--collection .pet-ui__roster-list {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.1rem;
}

.pet-roster__row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.25rem 0.5rem;
    align-items: center;
    padding: 0.5rem 0.6rem;
    margin-bottom: 0.4rem;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid rgba(201, 162, 39, 0.12);
    background: rgba(8, 12, 18, 0.45);
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.pet-roster__row:hover {
    border-color: rgba(90, 160, 140, 0.35);
    background: rgba(20, 32, 28, 0.35);
}

.pet-roster__row--focus {
    border-color: rgba(212, 175, 55, 0.42);
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.1), rgba(8, 12, 18, 0.5));
    box-shadow: inset 0 0 0 1px rgba(212, 175, 55, 0.08);
}

.pet-roster__name {
    font-weight: 600;
    font-family: var(--font-xian);
    letter-spacing: 0.06em;
    color: rgba(236, 230, 215, 0.96);
}

.pet-roster__meta {
    font-size: 0.72rem;
    color: rgba(160, 170, 185, 0.9);
    grid-column: 1 / -1;
}

.pet-roster__acts {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.pet-roster__totem {
    color: #c9a227;
    margin-right: 0.35rem;
    filter: drop-shadow(0 0 6px rgba(212, 175, 55, 0.45));
}

.pet-ui--xian .pet-roster__acts .btn--sm {
    font-family: var(--font-xian);
    letter-spacing: 0.06em;
    border-radius: 2px;
}

.pet-ui--xian .pet-roster__acts .btn--ghost {
    border-color: rgba(201, 162, 39, 0.28);
    background: rgba(0, 0, 0, 0.25);
}

.pet-ui--xian .pet-roster__acts .btn--ghost:hover {
    border-color: rgba(90, 184, 154, 0.45);
    color: var(--jade);
}

.pet-ui--xian .pet-roster__acts .btn--accent {
    background: linear-gradient(165deg, rgba(90, 140, 120, 0.35), rgba(40, 60, 52, 0.6));
    border-color: rgba(90, 184, 154, 0.45);
    color: #c8f0e4;
}

.pet-roster__badge {
    font-size: 0.68rem;
    font-family: var(--font-xian);
    letter-spacing: 0.12em;
    color: rgba(200, 190, 160, 0.85);
    line-height: 1.8;
    padding: 0.1rem 0.35rem;
    border: 1px solid rgba(212, 175, 55, 0.25);
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.2);
}

.pet-ui__detail-title {
    margin: 0;
    font-size: 1.12rem;
    font-family: var(--font-xian);
    letter-spacing: 0.14em;
    color: #f5ecd8;
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.2);
}

.pet-ui__empty {
    color: rgba(160, 170, 185, 0.95);
    font-size: 0.84rem;
    line-height: 1.55;
}

/* —— 门派功法 · 新布局 —— */
.sect-ui {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    font-size: 0.86rem;
}

.sect-ui__hero {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--space-md);
    align-items: start;
    padding: var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
    background: radial-gradient(ellipse 80% 120% at 0% 0%, rgba(212, 175, 55, 0.06), transparent 55%);
}

.sect-ui__kicker {
    display: block;
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 0.25rem;
}

.sect-ui__sect-title {
    font-size: 1.05rem;
    font-family: var(--font-display);
    letter-spacing: 0.06em;
    color: var(--gold);
    margin: 0 0 0.4rem;
    font-weight: 600;
}

.sect-ui__weapon-type {
    font-weight: 500;
    font-size: 0.92em;
    color: rgba(180, 215, 200, 0.88);
    letter-spacing: 0.04em;
}

.sect-ui__blurb {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.55;
    color: var(--text-muted);
}

.sect-ui__hero-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
    min-width: 7.5rem;
}

.sect-ui__slots-box {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
    padding: 0.45rem 0.55rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: rgba(0, 0, 0, 0.28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.sect-ui__slots-label {
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    text-transform: uppercase;
}

.sect-ui__slot-dots {
    display: flex;
    gap: 0.4rem;
}

.sect-ui__slot-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(0, 0, 0, 0.35);
    transition: background 0.2s, box-shadow 0.2s;
}

.sect-ui__slot-dot.is-on {
    background: linear-gradient(145deg, var(--gold) 0%, var(--accent) 100%);
    border-color: rgba(212, 175, 55, 0.6);
    box-shadow: 0 0 10px var(--accent-glow);
}

.sect-ui__slots-num {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.sect-ui__rule {
    margin: 0;
    font-size: 0.68rem;
    color: var(--text-muted);
    text-align: right;
    max-width: 9rem;
    line-height: 1.4;
}

.sect-ui__scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--space-sm) var(--space-md) var(--space-md);
    -webkit-overflow-scrolling: touch;
    /* 列表项高度/文案随领悟变化时，避免浏览器滚动锚定把视口拽回顶部 */
    overflow-anchor: none;
}

.sect-ui__scroll::-webkit-scrollbar {
    width: 6px;
}

.sect-ui__scroll::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.22);
    border-radius: 4px;
}

.sect-ui__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.sect-ui__card {
    position: relative;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    background: rgba(0, 0, 0, 0.22);
    padding: 0.55rem 0.65rem 0.6rem;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.sect-ui__card:hover {
    border-color: rgba(212, 175, 55, 0.2);
    background: rgba(22, 27, 38, 0.55);
}

.sect-ui__card--on {
    padding-left: 0.85rem;
    border-color: rgba(212, 175, 55, 0.42);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.04);
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.07) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.sect-ui__card--on::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.6rem;
    bottom: 0.6rem;
    width: 3px;
    border-radius: 0 2px 2px 0;
    background: linear-gradient(180deg, var(--gold), var(--accent));
    opacity: 0.9;
}

.sect-ui__card--locked {
    opacity: 0.78;
}

.sect-ui__card-top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.45rem 0.55rem;
    margin-bottom: 0.4rem;
}

.sect-ui__idx {
    font-family: ui-monospace, monospace;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-muted);
    opacity: 0.85;
    min-width: 1.4rem;
}

.sect-ui__title-row {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}

.sect-ui__name {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
    letter-spacing: 0.02em;
}

.sect-ui__badge-on {
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 0.12rem 0.35rem;
    border-radius: 999px;
    background: var(--accent-dim);
    color: var(--gold);
    border: 1px solid rgba(212, 175, 55, 0.28);
}

.sect-ui__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.45rem;
}

.sect-ui__pill {
    font-size: 0.68rem;
    padding: 0.15rem 0.4rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
}

.sect-ui__pill--cost {
    color: var(--gold);
    border-color: rgba(240, 208, 96, 0.25);
    background: rgba(240, 208, 96, 0.06);
}

.sect-ui__pill--cost i {
    margin-right: 0.25rem;
    font-size: 0.65rem;
    opacity: 0.9;
}

.sect-ui__pill--free {
    color: var(--text-muted);
    border-style: dashed;
}

.sect-ui__desc {
    margin: 0 0 0.55rem;
    font-size: 0.78rem;
    line-height: 1.6;
    color: var(--text-muted);
}

.sect-ui__foot {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.1rem;
}

.sect-ui__btn {
    min-width: 4.2rem;
}

.sect-ui--empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 12rem;
    padding: var(--space-lg);
}

.sect-ui__empty-inner {
    text-align: center;
    max-width: 14rem;
}

.sect-ui__empty-inner i {
    font-size: 2.25rem;
    color: var(--accent);
    opacity: 0.45;
    margin-bottom: var(--space-md);
    display: block;
}

.sect-ui__empty-inner p {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.35rem;
    color: var(--text);
}

.sect-ui__empty-hint {
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.5;
}

@media (max-width: 540px) {
    .sect-ui__hero {
        grid-template-columns: 1fr;
    }

    .sect-ui__hero-side {
        align-items: stretch;
        width: 100%;
        min-width: 0;
    }

    .sect-ui__slots-box {
        align-items: stretch;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }

    .sect-ui__rule {
        text-align: left;
        max-width: none;
        width: 100%;
    }
}

/* 武器图标：统一框线与尺寸，与十二品类成套 */
.eq-weapon-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.28em;
    height: 1.28em;
    margin-right: 0.14em;
    vertical-align: -0.14em;
    border-radius: 0.2em;
    background: rgba(180, 140, 60, 0.08);
    border: 1px solid rgba(180, 140, 60, 0.22);
}
/* 戟：PNG 内层不再叠一层底色，避免与行囊格叠成发黑块 */
.eq-weapon-icon:has(.eq-weapon-icon__glaive-img) {
    background: transparent;
    border-color: rgba(212, 175, 55, 0.32);
}
.eq-weapon-icon .ra,
.eq-weapon-icon .fas {
    font-size: 1.12em;
    line-height: 1;
    color: var(--gold);
    opacity: 0.94;
}
.eq-weapon-icon .eq-weapon-icon__speartip {
    font-size: 1.02em;
    transform: scaleY(1.5);
    color: #f0d878;
}
.eq-weapon-icon .eq-weapon-icon__glaive-img {
    width: 92%;
    height: 92%;
    object-fit: contain;
    display: block;
    margin: auto;
    pointer-events: none;
    /* 残留近黑像素与背后 UI 取较亮者，去掉「黑圆底」观感 */
    mix-blend-mode: lighten;
}
.eq-weapon-icon .fa-slash {
    transform: rotate(105deg);
    font-size: 1.05em;
}

/* ===== 模态层 ===== */
.modal-container {
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    z-index: 100;
    padding: var(--space-md);
    padding-bottom: max(var(--space-md), env(safe-area-inset-bottom));
    background: rgba(4, 6, 12, 0.76);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* 斗法：须压在洞天菜单 / 坊市 / 武神坛等 body 级模态之上（#combatPanel 位于 main 内时仍可能被盖住） */
#combatPanel.modal-container {
    z-index: 5300;
}

/* 塑道本源：整块面板一次排开，不嵌套内层滚动条；内容过高时由整层模态滚动（:has + 类名双保险） */
#defaultModal:has(.content.allocate-sheet),
#defaultModal.modal-container--allocate {
    overflow-y: auto;
    overflow-x: hidden;
    align-items: flex-start;
    justify-content: center;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-top: max(var(--space-md), env(safe-area-inset-top));
    padding-bottom: max(var(--space-md), env(safe-area-inset-bottom));
}

.modal-container .content {
    background: var(--bg-card);
    color: var(--text);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    max-width: min(var(--app-max), 100%);
    max-height: min(92dvh, 44rem);
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.modal-container .content .button-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--space-sm);
    margin-top: var(--space-sm);
}

/* 灵宠放生确认：名 / 等级 / 年份 */
.modal-container .content.pet-rel-confirm {
    max-width: min(24rem, 100%);
    padding: var(--space-md) var(--space-lg);
    box-sizing: border-box;
    gap: var(--space-sm);
}

.pet-rel-confirm__lead {
    margin: 0;
    padding: 0 var(--space-xs);
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--text);
}

.pet-rel-confirm__info {
    margin: 0;
    padding: 0.55rem 0.75rem 0.65rem;
    list-style: none;
    background: rgba(0, 0, 0, 0.22);
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: var(--radius-sm);
    font-size: 0.88rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.92);
}

.pet-rel-confirm__info li {
    margin: 0.35rem 0 0;
    word-break: break-word;
}

.pet-rel-confirm__info li:first-child {
    margin-top: 0;
}

.pet-rel-confirm__info strong {
    color: var(--accent);
    font-weight: 600;
    margin-right: 0.15em;
}

.modal-container .content.pet-rel-confirm .button-container {
    margin-top: var(--space-md);
}

/* 斗法认输确认：压在 #combatPanel 之上 */
#defaultModal.modal-container--combat-surrender {
    z-index: 5350;
}

/* 战败「重整再战」二次确认：须与认输弹窗同级，否则会被斗法面板盖住导致点了没反应 */
#defaultModal.modal-container--run-reset {
    z-index: 5350;
}

.modal-container .content.combat-surrender-confirm {
    max-width: min(22rem, 100%);
    padding: var(--space-md) var(--space-lg);
    box-sizing: border-box;
    gap: var(--space-sm);
    border: 1px solid rgba(200, 90, 70, 0.45);
    background: linear-gradient(165deg, rgba(28, 18, 22, 0.98) 0%, rgba(12, 10, 16, 0.99) 100%);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.55);
}

.combat-surrender-confirm__head {
    text-align: center;
    margin-bottom: 0.15rem;
}

.combat-surrender-confirm__eyebrow {
    margin: 0 0 0.25rem;
    font-size: 0.68rem;
    letter-spacing: 0.28em;
    color: rgba(240, 180, 160, 0.75);
}

.combat-surrender-confirm__title {
    margin: 0;
    font-family: var(--font-xian, var(--font-display));
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: #f0c8c8;
}

.combat-surrender-confirm__lead {
    margin: 0;
    padding: 0 var(--space-xs);
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--text);
}

.combat-surrender-confirm__lead strong {
    color: #ffb8a8;
}

.combat-surrender-confirm__rules {
    margin: 0;
    padding: 0.55rem 0.75rem 0.65rem;
    list-style: none;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: var(--radius-sm);
    font-size: 0.84rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.88);
}

.combat-surrender-confirm__rules li + li {
    margin-top: 0.35rem;
}

.combat-surrender-confirm__actions {
    margin-top: var(--space-md);
}

.combat-surrender-confirm__actions .combat-surrender-confirm__yes,
#combatSurrenderConfirmYes {
    border-color: rgba(200, 90, 70, 0.65);
    background: linear-gradient(180deg, rgba(96, 36, 40, 0.95) 0%, rgba(58, 20, 24, 0.98) 100%);
}

/* 行囊材料批量：数量输入弹窗（替代系统 prompt，便于手机/WebView） */
#defaultModal.modal-container--inv-batch-qty {
    z-index: 5200;
}

.inv-batch-qty-modal {
    padding: var(--space-md) var(--space-lg);
    max-width: min(22rem, 100%);
    box-sizing: border-box;
}

.inv-batch-qty-modal__title {
    margin: 0 0 0.35rem;
    font-size: 0.98rem;
    font-weight: 600;
    color: var(--text);
    line-height: 1.35;
}

.inv-batch-qty-modal__hint {
    margin: 0 0 0.75rem;
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.5;
}

.inv-batch-qty-modal__label {
    display: block;
    font-size: 0.74rem;
    margin-bottom: 0.28rem;
    color: rgba(200, 190, 230, 0.88);
}

.inv-batch-qty-modal__input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.55rem 0.7rem;
    font-size: 1rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    background: rgba(0, 0, 0, 0.35);
    color: var(--text);
    margin: 0;
}

.inv-batch-qty-modal__input:focus {
    outline: none;
    border-color: rgba(228, 199, 106, 0.55);
    box-shadow: 0 0 0 2px rgba(228, 199, 106, 0.12);
}

.inv-batch-qty-modal__err {
    margin: 0.45rem 0 0;
    font-size: 0.76rem;
    color: #f87171;
    line-height: 1.4;
}

.inv-batch-qty-modal__btns {
    margin-top: 1rem;
    justify-content: flex-end;
    gap: 0.5rem;
}

.modal-sheet__head {
    padding: var(--space-md);
    background: rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid var(--border-subtle);
}

.modal-sheet__head h3 {
    margin: 0;
}

#equipmentInfo .content {
    padding: var(--space-md) var(--space-lg);
    gap: 0.55rem;
    /* 套装说明等较长时勿裁切底部；flex 子项需 min-height:0 才能在 max-height 内滚动 */
    min-height: 0;
    max-height: min(92dvh, 44rem);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    position: relative;
}

#equipmentInfo .eq-item-info__head {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-shrink: 0;
    margin: calc(-1 * var(--space-md)) calc(-1 * var(--space-lg)) 0.45rem calc(-1 * var(--space-lg));
    padding: 0 0 0.2rem 0;
    position: sticky;
    top: calc(-1 * var(--space-md));
    z-index: 4;
    background: linear-gradient(180deg, rgba(12, 10, 18, 0.92) 0%, rgba(12, 10, 18, 0.65) 72%, transparent 100%);
    pointer-events: none;
}

#equipmentInfo .eq-item-info__head .icon-btn {
    pointer-events: auto;
    margin-top: 0;
}

#equipmentInfo .content > h3 {
    font-size: 0.86rem;
    line-height: 1.32;
    margin: 0 0 0.3rem;
}

#equipmentInfo .content.content--eq-compare {
    max-width: min(46rem, 96vw);
    width: 100%;
}

#equipmentInfo .button-container--eq {
    flex-wrap: wrap;
    gap: 0.38rem;
    margin-top: 0.15rem;
}

#equipmentInfo .button-container--eq button {
    font-size: 0.74rem;
    padding: 0.26rem 0.5rem;
}

#equipmentInfo .eq-gem-actions .btn.btn--sm {
    font-size: 0.58rem;
    padding: 0.14rem 0.32rem;
}

#equipmentInfo .btn-item-lock {
    min-height: 2.1rem;
    padding: 0.38rem 0.72rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.35);
    background: rgba(0, 0, 0, 0.35);
    color: var(--gold);
    cursor: pointer;
    font-size: 0.76rem;
}

#equipmentInfo .btn-item-lock:hover {
    background: rgba(212, 175, 55, 0.1);
}

#equipmentInfo #sell-equip:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

#equipmentInfo .content ul {
    margin: 0;
    padding-left: 1rem;
    color: var(--text-muted);
    font-size: 0.7rem;
    line-height: 1.42;
}

#equipmentInfo .eq-compare__slot-hint {
    font-size: 0.56rem;
}

#equipmentInfo .eq-compare__panel h3 {
    font-size: 0.78rem;
}

#equipmentInfo .eq-compare__panel h4.eq-compare__kicker {
    font-size: 0.56rem;
}

#equipmentInfo .eq-compare__ul {
    font-size: 0.66rem;
}

#equipmentInfo .eq-compare__slot-empty {
    font-size: 0.64rem;
}

/* 行囊 · 与同槽已装备对比 */
.eq-compare {
    width: 100%;
}

.eq-compare__slot-hint {
    margin: 0 0 0.5rem;
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    color: var(--text-muted);
}

.eq-compare__cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 1rem;
    align-items: start;
}

.eq-compare__panel {
    min-width: 0;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: rgba(0, 0, 0, 0.22);
}

.eq-compare__panel--new {
    border-color: rgba(120, 180, 160, 0.35);
}

.eq-compare__kicker {
    margin: 0 0 0.35rem;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: none;
    color: rgba(180, 200, 190, 0.85);
}

.eq-compare__panel h3 {
    margin: 0 0 0.5rem;
    font-size: 0.88rem;
    line-height: 1.35;
    word-break: break-word;
}

.eq-compare__slot-empty {
    margin: 0.25rem 0 0.5rem;
    font-size: 0.76rem;
    color: rgba(160, 160, 170, 0.9);
    line-height: 1.45;
}

.eq-compare__ul {
    margin: 0;
    padding-left: 1rem;
    list-style: disc;
    color: var(--text-muted);
    font-size: 0.76rem;
    line-height: 1.5;
}

.eq-compare__ul li {
    margin: 0.15rem 0;
}

.eq-compare-stat-txt {
    word-break: break-word;
}

.eq-diff {
    display: inline-block;
    margin-left: 0.2rem;
    font-size: 0.75em;
    font-weight: 700;
    vertical-align: middle;
}

.eq-diff--up {
    color: #5fd89a;
}

.eq-diff--down {
    color: #e86b6b;
}

.eq-diff--same {
    color: rgba(150, 155, 170, 0.65);
}

.eq-swap-delta {
    margin-left: 0.25rem;
    font-size: 0.82em;
    font-weight: 600;
    white-space: nowrap;
}

@media (max-width: 520px) {
    .eq-compare__cols {
        grid-template-columns: 1fr;
    }
}

#menuModal .content {
    min-width: min(18rem, 100%);
    padding: 0;
    display: grid;
    gap: 0;
}

#menuModal .content-head {
    padding: var(--space-md);
    grid-column: 1 / -1;
}

#menuModal .content > button {
    margin: 0 var(--space-md);
    width: calc(100% - 2 * var(--space-md));
    justify-content: flex-start;
    border-radius: var(--radius-sm);
}

#menuModal .content > button + button {
    margin-top: 0;
}

#menuModal .content > button:first-of-type {
    margin-top: var(--space-sm);
}

#menuModal .content > button:last-of-type {
    margin-bottom: var(--space-md);
}

/* 卷宗 · 更新日记 / 存档 */
#defaultModal .content.changelog-modal-sheet,
#defaultModal .content.dongtian-save-sheet {
    max-width: min(24rem, 94vw);
    padding: var(--space-lg);
    gap: var(--space-sm);
}

#defaultModal .changelog-scroll {
    max-height: min(58vh, 22rem);
    padding-right: 0.25rem;
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--text-muted, rgba(232, 228, 220, 0.88));
}

#defaultModal .changelog-scroll .changelog-h4 {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    color: var(--text, #f0e6d8);
}

#defaultModal .changelog-scroll .changelog-list {
    margin: 0;
    padding-left: 1.2rem;
}

#defaultModal .changelog-scroll code {
    font-size: 0.82em;
    word-break: break-all;
}

#defaultModal .dongtian-save-hint {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--text-muted, rgba(232, 228, 220, 0.85));
}

#defaultModal .dongtian-save-section-title {
    margin: 0.75rem 0 0.35rem;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--gold, #e4c76a);
}

#defaultModal .dongtian-save-section-desc {
    margin: 0 0 0.5rem;
    font-size: 0.8rem;
    line-height: 1.45;
    color: var(--text-muted, rgba(232, 228, 220, 0.8));
}

#defaultModal .dongtian-field-label {
    display: block;
    font-size: 0.76rem;
    margin-top: 0.35rem;
    margin-bottom: 0.2rem;
    color: var(--text-muted, rgba(232, 228, 220, 0.75));
}

#defaultModal .dongtian-rename-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
    margin-bottom: 0.65rem;
}

#defaultModal .dongtian-rename-input {
    flex: 1;
    min-width: 8rem;
    box-sizing: border-box;
    padding: 0.45rem 0.55rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border, rgba(255, 255, 255, 0.12));
    background: rgba(0, 0, 0, 0.35);
    color: var(--text, #f0e6d8);
    font-size: 0.9rem;
}

#defaultModal .dongtian-avatar-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    margin-bottom: 0.25rem;
}

#defaultModal .dongtian-save-hint--tight {
    margin-top: 0.15rem;
    margin-bottom: 0.5rem;
    font-size: 0.78rem;
}

#defaultModal .changelog-ver--older {
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
    opacity: 0.92;
}

#defaultModal .dongtian-save-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    margin-top: var(--space-xs);
}

#defaultModal .content.dongtian-save-sheet .dongtian-save-actions .btn {
    width: 100%;
    justify-content: center;
}

.dongtian-save-pw-host {
    position: fixed;
    inset: 0;
    z-index: 150;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-md);
    padding-top: max(var(--space-md), env(safe-area-inset-top));
    padding-bottom: max(var(--space-md), env(safe-area-inset-bottom));
    box-sizing: border-box;
}

.dongtian-save-pw-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(4, 6, 12, 0.68);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.dongtian-save-pw-host .dongtian-save-pw-sheet {
    position: relative;
    z-index: 1;
    max-width: min(24rem, 94vw);
    width: 100%;
    padding: var(--space-lg);
    gap: var(--space-sm);
    display: flex;
    flex-direction: column;
    background: var(--bg-card);
    color: var(--text);
    border-radius: var(--radius);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    max-height: min(88dvh, 34rem);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

.dongtian-save-pw-host .dongtian-save-pw-sheet .content-head h3 {
    margin: 0;
    font-size: 1.05rem;
}

.dongtian-save-pw-host .dongtian-save-hint {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--text-muted, rgba(232, 228, 220, 0.85));
}

.dongtian-save-pw-host .dongtian-field-label {
    display: block;
    font-size: 0.76rem;
    margin-top: 0.35rem;
    margin-bottom: 0.2rem;
    color: var(--text-muted, rgba(232, 228, 220, 0.75));
}

.dongtian-save-pw-host .dongtian-save-pw-input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.5rem 0.6rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border, rgba(255, 255, 255, 0.12));
    background: rgba(0, 0, 0, 0.35);
    color: var(--text, #f0e6d8);
    font-size: 1rem;
}

.dongtian-save-pw-host .dongtian-save-pw-input:focus {
    outline: none;
    border-color: var(--accent, #c9a227);
    box-shadow: 0 0 0 1px rgba(201, 162, 39, 0.25);
}

.dongtian-save-pw-host .dongtian-save-pw-actions {
    margin-top: 0.35rem;
}

.dongtian-save-pw-host .dongtian-save-pw-actions .btn {
    width: 100%;
    justify-content: center;
}

#defaultModal .content {
    padding: var(--space-lg);
    gap: var(--space-md);
}

#defaultModal .content-head {
    padding: 0;
    margin-bottom: 0.2rem;
}

/* —— 塑道本源（开局加点） —— */
#defaultModal .content.allocate-sheet {
    /* 覆盖 .modal-container .content 的 flex，否则 max-height 下子项 flex-shrink 会把说明区压扁并与按钮重叠 */
    display: block;
    max-width: min(38rem, 100%);
    /* 不设 max-height：与门派说明、按钮一并完整展示；视口不够时由 #defaultModal 外层滚动 */
    max-height: none;
    overflow: visible;
    padding: var(--space-lg);
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
    margin: auto 0;
    flex-shrink: 0;
}

.allocate-sheet__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-md);
    margin-bottom: var(--space-sm);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
}

.allocate-sheet__head h3 {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.25rem;
    letter-spacing: 0.08em;
}

.allocate-sheet__sub {
    margin: 0.35rem 0 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    line-height: 1.45;
}

.allocate-sheet__close {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    background: rgba(0, 0, 0, 0.25);
    color: var(--text-muted);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
}

.allocate-sheet__close:hover {
    color: var(--text);
    border-color: var(--border);
    background: rgba(255, 255, 255, 0.04);
}

.allocate-stats-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: var(--space-sm);
}

.allocate-stat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--border-subtle);
    font-size: 0.92rem;
}

.allocate-stat-row:last-of-type {
    border-bottom: none;
}

.allocate-stat-row__label {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    color: var(--text);
}

.allocate-stat-row__label i {
    color: var(--accent);
    opacity: 0.9;
    width: 1.1rem;
    text-align: center;
}

.allocate-stat-row__stepper {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.allocate-stat-row__stepper button {
    min-width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    background: rgba(0, 0, 0, 0.35);
    color: var(--text);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.allocate-stat-row__stepper button:hover {
    border-color: var(--accent);
    background: rgba(180, 140, 60, 0.12);
}

.allocate-stat-row__num {
    min-width: 1.25rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--accent);
}

.allocate-points-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    margin: var(--space-md) 0 var(--space-sm);
    padding: 0.5rem 0.65rem;
    border-radius: var(--radius-sm);
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid var(--border-subtle);
}

.allocate-points-row__pts {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.allocate-sect-heading {
    margin: var(--space-md) 0 var(--space-sm);
    font-size: 0.72rem;
    letter-spacing: 0.28em;
    text-transform: none;
    color: var(--text-muted);
    font-weight: 600;
}

.allocate-sect-heading--info {
    margin-top: var(--space-lg);
    margin-bottom: 0.4rem;
}

.allocate-sect-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem 0.4rem;
    align-content: start;
}

.allocate-sect-card {
    margin: 0;
    padding: 0.5rem 0.3rem;
    min-height: 2.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    background: rgba(0, 0, 0, 0.22);
    color: var(--text);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
    text-align: center;
    font: inherit;
}

.allocate-sect-card:hover {
    border-color: var(--border);
    background: rgba(255, 255, 255, 0.04);
}

.allocate-sect-card.is-selected {
    border-color: var(--gold);
    background: rgba(180, 140, 60, 0.12);
    box-shadow: 0 0 0 1px rgba(201, 162, 39, 0.25);
}

.allocate-sect-card__name {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.3;
    word-break: keep-all;
}

.allocate-sect-blurb {
    margin-top: var(--space-md);
    margin-bottom: var(--space-lg);
    padding: var(--space-md);
    font-size: 0.82rem;
    line-height: 1.6;
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    background: rgba(0, 0, 0, 0.2);
    min-height: min-content;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: visible;
    width: 100%;
}

.allocate-sect-blurb__text {
    margin: 0;
    padding: 0;
}

.allocate-sect-weapon {
    display: block;
    margin: 0.65rem 0 0;
    padding: 0.65rem 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.8rem;
    letter-spacing: 0.03em;
    line-height: 1.5;
    color: rgba(180, 215, 200, 0.9);
}

.allocate-confirm-btn {
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    justify-content: center;
}

@media (max-width: 520px) {
    #defaultModal .content.allocate-sheet {
        max-width: 100%;
        padding-left: var(--space-md);
        padding-right: var(--space-md);
    }
    .allocate-sect-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.45rem 0.35rem;
    }
    .allocate-sect-card__name {
        font-size: 0.76rem;
    }
}

@media (max-width: 360px) {
    .allocate-sect-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ===== 战斗界面 ===== */
#combatPanel .content.combat-sheet {
    width: min(84vw, 46rem) !important;
    max-width: min(46rem, 100%) !important;
    max-height: min(94dvh, 48rem);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(212, 175, 55, 0.22);
    background: linear-gradient(165deg, rgba(18, 22, 34, 0.98) 0%, rgba(8, 10, 18, 0.98) 100%);
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.55);
}

.combat-sheet__head {
    position: relative;
    padding: 0.65rem var(--space-md);
    padding-right: 4.5rem;
    background: linear-gradient(90deg, rgba(120, 32, 48, 0.45) 0%, rgba(40, 18, 28, 0.55) 50%, rgba(18, 22, 32, 0.9) 100%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.18);
}

.combat-surrender-btn {
    position: absolute;
    top: 0.45rem;
    right: 0.55rem;
    z-index: 2;
    margin: 0;
    padding: 0.28rem 0.65rem;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    line-height: 1.35;
    color: rgba(255, 220, 200, 0.92);
    background: linear-gradient(180deg, rgba(72, 28, 32, 0.95) 0%, rgba(42, 14, 18, 0.98) 100%);
    border: 1px solid rgba(200, 90, 70, 0.55);
    border-radius: 4px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.combat-surrender-btn:hover {
    color: #fff;
    border-color: rgba(230, 120, 90, 0.75);
    background: linear-gradient(180deg, rgba(96, 36, 40, 0.98) 0%, rgba(58, 20, 24, 0.99) 100%);
}

.combat-surrender-btn:active {
    transform: translateY(1px);
}

.combat-surrender-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

.combat-sheet__head-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
}

.combat-sheet__badge {
    font-family: var(--font-xian, var(--font-display));
    font-size: 1.05rem;
    letter-spacing: 0.45em;
    color: #f0c8c8;
    text-shadow: 0 0 18px rgba(220, 90, 90, 0.45);
}

.combat-sheet__sub {
    font-size: 0.68rem;
    letter-spacing: 0.2em;
    color: rgba(200, 206, 220, 0.55);
}

.combat-sheet__body {
    flex: 1;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: var(--space-md);
}

/* 人物卡与灵兽卡并排；无灵兽时人物仍占满一行 */
.combat-sheet__player-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.65rem;
    width: 100%;
    min-width: 0;
}

.combat-sheet__player-row .combat-card--player {
    flex: 1 1 0;
    min-width: 0;
}

.combat-sheet__player-row .combat-card--pet {
    flex: 0 1 40%;
    max-width: 44%;
    min-width: 0;
}

@media (max-width: 480px) {
    .combat-sheet__player-row {
        flex-direction: column;
    }

    .combat-sheet__player-row .combat-card--pet {
        flex: 1 1 auto;
        max-width: none;
    }
}

.combat-card {
    border-radius: 12px;
    padding: var(--space-md);
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.combat-card--enemy {
    background: linear-gradient(145deg, rgba(48, 22, 28, 0.35) 0%, rgba(12, 14, 22, 0.55) 100%);
    border-color: rgba(200, 80, 80, 0.18);
}

.combat-card--player {
    background: linear-gradient(145deg, rgba(22, 36, 52, 0.45) 0%, rgba(10, 12, 20, 0.55) 100%);
    border-color: rgba(100, 140, 200, 0.2);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    align-content: flex-start;
}

/* 头像与「名字+称号」横排；称号在 DOM 中紧跟名字，保证显示在你框出的名字正下方 */
.combat-card--player .combat-card__row--player-head {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.4rem;
}

.combat-card--player .combat-card__main--player {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

/* 名字行：收紧行高，避免 p 元素行盒在文字下方留出大块空白 */
.combat-card--player .combat-card__main--player > .combat-card__playerline {
    line-height: 1.2;
    margin: 0;
    padding: 0;
}

/* 斗法称号左右位置：只改下面这一行数值（正=右移，负=左移），单位可用 px / rem */
.combat-card--player .combat-card__titlebar--player {
    --combat-title-fx-offset-x: -55px;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-top: -2.5rem;
    line-height: 0;
    gap: 0;
    /* 预留称号动效高度，避免图片 load 后把名字/血条顶上去再弹回 */
    min-height: 3.25rem;
}

/* 称号动效：固定舞台高度，文字绝对定位，图片就绪后仅淡出文字不改变布局 */
.combat-card--player .combat-title-fx {
    display: block;
    margin: 0;
    padding: 0;
    line-height: 0;
    transform: translateX(var(--combat-title-fx-offset-x, 0px));
}

.combat-card--player .combat-title-fx.combat-title-fx--active {
    min-height: 3.25rem;
}

.combat-card--player .combat-title-fx__stage {
    position: relative;
    display: block;
    min-height: 3.25rem;
    max-height: 7.5rem;
    width: 100%;
    max-width: 100%;
}

.combat-card--player .combat-title-fx__stage--solo {
    min-height: 0;
}

.combat-card--player .combat-title-fx__name {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    line-height: 1.2;
    margin: 0;
    max-width: 100%;
    transition: opacity 0.12s ease;
}

.combat-card--player .combat-title-fx--img-ready .combat-title-fx__name {
    opacity: 0;
    pointer-events: none;
}

.combat-card--player .combat-title-fx__img {
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 2;
}

.combat-card--player > .combat-bar--hp {
    margin-top: -2.15rem;
}

.combat-card--pet {
    background: linear-gradient(145deg, rgba(28, 48, 38, 0.48) 0%, rgba(10, 18, 14, 0.58) 100%);
    border-color: rgba(120, 200, 150, 0.22);
}

.combat-avatar--pet {
    background: radial-gradient(circle at 32% 30%, rgba(90, 180, 120, 0.45), rgba(12, 28, 18, 0.92));
    color: #a8f0c0;
    border-color: rgba(140, 220, 160, 0.35);
}

.combat-card__badge--pet {
    display: block;
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(160, 235, 185, 0.9);
    margin-bottom: 0.15rem;
}

.combat-pet-name {
    color: #b8f5d0;
    font-weight: 600;
}

.combat-card__row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}


.combat-avatar {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    border: 1px solid rgba(212, 175, 55, 0.25);
}

.combat-avatar--enemy {
    background: radial-gradient(circle at 30% 30%, rgba(180, 60, 60, 0.35), rgba(20, 12, 16, 0.9));
    color: #e8a0a0;
}

/* 敌阵头像 · 妖躯品质（凡物→劫主） */
.combat-avatar--enemy.combat-avatar--qt {
    transition: border-color 0.2s, box-shadow 0.2s, color 0.2s, background 0.2s;
}

.combat-avatar--enemy.combat-avatar--qt-0 {
    background: radial-gradient(circle at 32% 28%, rgba(140, 140, 150, 0.5), rgba(16, 16, 22, 0.94));
    border-color: rgba(170, 175, 190, 0.45);
    color: #d1d5dc;
}

.combat-avatar--enemy.combat-avatar--qt-1 {
    background: radial-gradient(circle at 32% 28%, rgba(120, 140, 160, 0.42), rgba(14, 20, 28, 0.94));
    border-color: rgba(130, 170, 210, 0.45);
    color: #b8d4ee;
    box-shadow: 0 0 12px rgba(100, 160, 220, 0.15);
}

.combat-avatar--enemy.combat-avatar--qt-2 {
    background: radial-gradient(circle at 32% 28%, rgba(90, 140, 90, 0.4), rgba(12, 22, 14, 0.94));
    border-color: rgba(110, 190, 120, 0.42);
    color: #a8e8b0;
}

.combat-avatar--enemy.combat-avatar--qt-3 {
    background: radial-gradient(circle at 32% 28%, rgba(70, 120, 180, 0.42), rgba(10, 16, 28, 0.94));
    border-color: rgba(100, 160, 230, 0.48);
    color: #9ec8ff;
}

.combat-avatar--enemy.combat-avatar--qt-4 {
    background: radial-gradient(circle at 32% 28%, rgba(130, 80, 180, 0.4), rgba(22, 10, 28, 0.94));
    border-color: rgba(180, 120, 230, 0.5);
    color: #d8b8ff;
    box-shadow: 0 0 14px rgba(150, 100, 220, 0.22);
}

.combat-avatar--enemy.combat-avatar--qt-5 {
    background: radial-gradient(circle at 32% 28%, rgba(180, 100, 60, 0.45), rgba(28, 12, 8, 0.94));
    border-color: rgba(230, 150, 90, 0.52);
    color: #ffd0a8;
    box-shadow: 0 0 16px rgba(220, 120, 60, 0.25);
}

.combat-avatar--enemy.combat-avatar--qt-6 {
    background: radial-gradient(circle at 32% 28%, rgba(200, 70, 50, 0.48), rgba(32, 10, 8, 0.95));
    border-color: rgba(255, 140, 100, 0.55);
    color: #ffc4a8;
    box-shadow: 0 0 18px rgba(240, 90, 50, 0.3);
}

.combat-avatar--enemy.combat-avatar--qt-7 {
    background: radial-gradient(circle at 32% 28%, rgba(220, 180, 60, 0.42), rgba(36, 24, 6, 0.95));
    border-color: rgba(255, 210, 120, 0.58);
    color: #ffe8a0;
    box-shadow: 0 0 20px rgba(255, 200, 80, 0.32);
}

.combat-avatar--enemy.combat-avatar--qt-8 {
    background: radial-gradient(circle at 32% 28%, rgba(180, 60, 120, 0.48), rgba(28, 6, 22, 0.95));
    border-color: rgba(255, 120, 180, 0.52);
    color: #ffb8e0;
    box-shadow: 0 0 22px rgba(255, 80, 160, 0.35);
}

.combat-avatar--enemy.combat-avatar--qt-9 {
    background: radial-gradient(circle at 32% 28%, rgba(200, 40, 160, 0.52), rgba(40, 4, 32, 0.96));
    border-color: rgba(255, 160, 240, 0.6);
    color: #ffe0fc;
    box-shadow: 0 0 0 1px rgba(255, 120, 220, 0.25), 0 0 26px rgba(220, 60, 200, 0.42);
}

.combat-card__quality {
    margin: 0.28rem 0 0;
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    font-weight: 600;
}

.combat-card__quality--t0 { color: rgba(180, 186, 198, 0.92); }
.combat-card__quality--t1 { color: rgba(150, 190, 230, 0.95); }
.combat-card__quality--t2 { color: rgba(140, 220, 160, 0.95); }
.combat-card__quality--t3 { color: rgba(140, 190, 255, 0.95); }
.combat-card__quality--t4 { color: rgba(200, 160, 255, 0.95); }
.combat-card__quality--t5 { color: rgba(255, 180, 120, 0.96); }
.combat-card__quality--t6 { color: rgba(255, 150, 120, 0.96); }
.combat-card__quality--t7 { color: rgba(255, 220, 140, 0.98); }
.combat-card__quality--t8 { color: rgba(255, 160, 200, 0.96); }
.combat-card__quality--t9 {
    color: rgba(255, 200, 245, 0.98);
    text-shadow: 0 0 12px rgba(255, 120, 200, 0.35);
}

/* BOSS：层主 / 秘境主宰（张扬：扫光、呼吸光晕、标题辉光、标签律动） */
.combat-card--enemy.combat-card--boss-guardian,
.combat-card--enemy.combat-card--boss-sboss {
    position: relative;
    isolation: isolate;
    border-width: 1px;
}

.combat-card--enemy.combat-card--boss-guardian {
    border-color: rgba(255, 210, 120, 0.55);
    background:
        radial-gradient(ellipse 120% 80% at 10% 0%, rgba(255, 200, 100, 0.18) 0%, transparent 55%),
        linear-gradient(155deg, rgba(64, 38, 22, 0.62) 0%, rgba(8, 6, 4, 0.9) 100%);
    box-shadow:
        0 0 0 1px rgba(255, 200, 100, 0.22),
        0 0 28px rgba(255, 160, 40, 0.28),
        0 0 56px rgba(200, 100, 20, 0.12),
        inset 0 0 52px rgba(120, 60, 24, 0.16);
    animation: combat-boss-card-glow-guardian 2.8s ease-in-out infinite;
}

.combat-card--enemy.combat-card--boss-guardian::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(
        105deg,
        transparent 0%,
        transparent 38%,
        rgba(255, 255, 255, 0.14) 50%,
        transparent 62%,
        transparent 100%
    );
    background-size: 220% 100%;
    animation: combat-boss-shimmer 2.6s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: overlay;
}

.combat-card--enemy.combat-card--boss-guardian::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    box-shadow:
        inset 0 0 0 1px rgba(255, 220, 160, 0.45),
        inset 0 0 24px rgba(255, 180, 60, 0.08);
    animation: combat-boss-border-breathe-g 3.2s ease-in-out infinite;
}

.combat-card--enemy.combat-card--boss-sboss {
    border-color: rgba(220, 120, 255, 0.58);
    background:
        radial-gradient(ellipse 130% 90% at 90% 10%, rgba(200, 80, 255, 0.22) 0%, transparent 50%),
        radial-gradient(ellipse 80% 60% at 20% 80%, rgba(120, 40, 180, 0.2) 0%, transparent 45%),
        linear-gradient(155deg, rgba(56, 18, 52, 0.58) 0%, rgba(4, 2, 12, 0.94) 100%);
    box-shadow:
        0 0 0 1px rgba(220, 100, 255, 0.28),
        0 0 36px rgba(180, 60, 220, 0.35),
        0 0 72px rgba(100, 30, 160, 0.2),
        inset 0 0 60px rgba(80, 20, 100, 0.22);
    animation: combat-boss-card-glow-sboss 2.6s ease-in-out infinite;
}

.combat-card--enemy.combat-card--boss-sboss::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(
        115deg,
        transparent 0%,
        rgba(200, 100, 255, 0.12) 48%,
        rgba(255, 180, 255, 0.18) 50%,
        rgba(200, 100, 255, 0.12) 52%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: combat-boss-shimmer-s 2.4s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: screen;
}

.combat-card--enemy.combat-card--boss-sboss::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    box-shadow:
        inset 0 0 0 1px rgba(230, 140, 255, 0.5),
        inset 0 0 28px rgba(180, 60, 220, 0.12);
    animation: combat-boss-border-breathe-s 2.9s ease-in-out infinite;
}

.combat-card--enemy.combat-card--boss-guardian .combat-card__row,
.combat-card--enemy.combat-card--boss-sboss .combat-card__row {
    position: relative;
    z-index: 2;
}

.combat-card--enemy.combat-card--boss-guardian .combat-bar,
.combat-card--enemy.combat-card--boss-sboss .combat-bar,
.combat-card--enemy.combat-card--boss-guardian .combat-card__dmg,
.combat-card--enemy.combat-card--boss-sboss .combat-card__dmg {
    position: relative;
    z-index: 2;
}

.combat-card--enemy.combat-card--boss-guardian .combat-card__title {
    color: #fff8e8;
    text-shadow:
        0 0 10px rgba(255, 200, 80, 0.85),
        0 0 24px rgba(255, 140, 40, 0.55),
        0 0 40px rgba(200, 100, 30, 0.25);
}

.combat-card--enemy.combat-card--boss-sboss .combat-card__title {
    color: #fff4ff;
    text-shadow:
        0 0 12px rgba(255, 140, 220, 0.85),
        0 0 28px rgba(200, 80, 255, 0.55),
        0 0 48px rgba(140, 40, 200, 0.35);
}

.combat-boss-tag {
    display: inline-block;
    margin-right: 0.45rem;
    padding: 0.14rem 0.55rem;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    vertical-align: 0.1em;
    border-radius: 6px;
    line-height: 1.2;
}

.combat-boss-tag--guardian {
    background: linear-gradient(180deg, rgba(255, 236, 180, 1), rgba(220, 150, 40, 0.98));
    color: #1a0c00;
    box-shadow:
        0 0 18px rgba(255, 200, 80, 0.55),
        0 0 36px rgba(255, 160, 40, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.45);
    animation: combat-boss-tag-breathe-g 1.9s ease-in-out infinite;
}

.combat-boss-tag--sboss {
    background: linear-gradient(180deg, rgba(230, 110, 255, 0.98), rgba(90, 20, 110, 0.99));
    color: #fff8ff;
    border: 1px solid rgba(255, 180, 250, 0.55);
    box-shadow:
        0 0 22px rgba(220, 80, 255, 0.55),
        0 0 44px rgba(160, 40, 200, 0.3),
        inset 0 1px 0 rgba(255, 200, 255, 0.35);
    animation: combat-boss-tag-breathe-s 1.7s ease-in-out infinite;
}

.combat-avatar--enemy.combat-avatar--boss {
    width: 3.25rem;
    height: 3.25rem;
    font-size: 1.52rem;
    position: relative;
    z-index: 2;
}

.combat-avatar--boss-guardian {
    border-width: 2px !important;
    border-color: rgba(255, 220, 140, 0.85) !important;
    color: #fff0c0 !important;
    background: radial-gradient(circle at 35% 30%, rgba(255, 200, 120, 0.45), rgba(40, 22, 8, 0.92)) !important;
    box-shadow:
        0 0 0 2px rgba(0, 0, 0, 0.4),
        0 0 28px rgba(255, 200, 90, 0.5),
        0 0 48px rgba(255, 140, 40, 0.22) !important;
    animation: combat-boss-avatar-glow-g 2.4s ease-in-out infinite;
}

.combat-avatar--boss-sboss {
    border-width: 2px !important;
    border-color: rgba(240, 170, 255, 0.8) !important;
    color: #ffe8ff !important;
    background: radial-gradient(circle at 35% 30%, rgba(200, 100, 240, 0.5), rgba(32, 8, 40, 0.94)) !important;
    box-shadow:
        0 0 0 2px rgba(0, 0, 0, 0.4),
        0 0 36px rgba(220, 100, 255, 0.55),
        0 0 64px rgba(160, 40, 200, 0.28) !important;
    animation: combat-boss-avatar-glow-s 2.2s ease-in-out infinite;
}

.combat-boss-aura {
    position: absolute;
    inset: -8px;
    border-radius: 16px;
    pointer-events: none;
    z-index: 1;
    animation: combat-boss-pulse 2.2s ease-in-out infinite;
}

.combat-boss-aura--guardian {
    border: 2px solid rgba(255, 210, 100, 0.55);
    box-shadow:
        0 0 20px rgba(255, 180, 60, 0.45),
        0 0 40px rgba(255, 140, 40, 0.2);
}

.combat-boss-aura--sboss {
    border: 2px solid rgba(230, 120, 255, 0.55);
    box-shadow:
        0 0 26px rgba(200, 80, 240, 0.5),
        0 0 52px rgba(160, 40, 200, 0.28);
}

.combat-boss-aura--demontower {
    border: 2px solid rgba(220, 60, 40, 0.45);
    box-shadow:
        0 0 22px rgba(180, 30, 20, 0.55),
        0 0 48px rgba(120, 20, 80, 0.35),
        inset 0 0 24px rgba(40, 8, 24, 0.5);
    animation: combat-demon-aura-pulse 2.4s ease-in-out infinite;
}

@keyframes combat-demon-aura-pulse {
    0%,
    100% {
        opacity: 0.85;
        filter: brightness(1);
    }
    50% {
        opacity: 1;
        filter: brightness(1.12);
    }
}

.combat-boss-icon--guardian,
.combat-boss-icon--sboss {
    display: inline-block;
    transform-origin: center center;
}

.combat-boss-icon--guardian {
    filter: drop-shadow(0 0 10px rgba(255, 230, 160, 0.95));
    animation: combat-boss-icon-hero-g 2s ease-in-out infinite;
}

.combat-boss-icon--sboss {
    filter: drop-shadow(0 0 12px rgba(255, 140, 220, 0.95));
    animation: combat-boss-icon-hero-s 1.8s ease-in-out infinite;
}

.combat-boss-icon--demontower {
    filter: drop-shadow(0 0 10px rgba(255, 80, 40, 0.9)) drop-shadow(0 0 18px rgba(160, 40, 120, 0.55));
    animation: combat-demon-icon-flicker 2.1s ease-in-out infinite;
}

@keyframes combat-demon-icon-flicker {
    0%,
    100% {
        transform: scale(1);
        opacity: 1;
    }
    40% {
        transform: scale(1.04);
        opacity: 0.92;
    }
    55% {
        transform: scale(0.98);
        opacity: 1;
    }
}

@keyframes combat-boss-shimmer {
    0%,
    100% {
        background-position: 130% 0;
        opacity: 0.65;
    }
    50% {
        background-position: -30% 0;
        opacity: 1;
    }
}

@keyframes combat-boss-shimmer-s {
    0%,
    100% {
        background-position: -30% 0;
        opacity: 0.5;
    }
    50% {
        background-position: 130% 0;
        opacity: 0.95;
    }
}

@keyframes combat-boss-card-glow-guardian {
    0%,
    100% {
        box-shadow:
            0 0 0 1px rgba(255, 200, 100, 0.22),
            0 0 24px rgba(255, 160, 40, 0.24),
            0 0 52px rgba(200, 100, 20, 0.1),
            inset 0 0 52px rgba(120, 60, 24, 0.16);
    }
    50% {
        box-shadow:
            0 0 0 1px rgba(255, 220, 140, 0.38),
            0 0 40px rgba(255, 180, 60, 0.42),
            0 0 72px rgba(255, 140, 40, 0.18),
            inset 0 0 56px rgba(140, 70, 30, 0.2);
    }
}

@keyframes combat-boss-card-glow-sboss {
    0%,
    100% {
        box-shadow:
            0 0 0 1px rgba(220, 100, 255, 0.28),
            0 0 32px rgba(180, 60, 220, 0.3),
            0 0 64px rgba(100, 30, 160, 0.16),
            inset 0 0 60px rgba(80, 20, 100, 0.22);
    }
    50% {
        box-shadow:
            0 0 0 1px rgba(240, 140, 255, 0.45),
            0 0 52px rgba(200, 80, 255, 0.48),
            0 0 96px rgba(140, 40, 200, 0.28),
            inset 0 0 64px rgba(100, 30, 120, 0.26);
    }
}

@keyframes combat-boss-border-breathe-g {
    0%,
    100% {
        opacity: 0.55;
    }
    50% {
        opacity: 1;
    }
}

@keyframes combat-boss-border-breathe-s {
    0%,
    100% {
        opacity: 0.45;
    }
    50% {
        opacity: 0.95;
    }
}

@keyframes combat-boss-tag-breathe-g {
    0%,
    100% {
        transform: translateY(0) scale(1);
        box-shadow:
            0 0 18px rgba(255, 200, 80, 0.55),
            0 0 36px rgba(255, 160, 40, 0.25),
            inset 0 1px 0 rgba(255, 255, 255, 0.45);
    }
    50% {
        transform: translateY(-1px) scale(1.04);
        box-shadow:
            0 0 26px rgba(255, 220, 120, 0.75),
            0 0 48px rgba(255, 160, 40, 0.38),
            inset 0 1px 0 rgba(255, 255, 255, 0.55);
    }
}

@keyframes combat-boss-tag-breathe-s {
    0%,
    100% {
        transform: translateY(0) scale(1);
        box-shadow:
            0 0 22px rgba(220, 80, 255, 0.55),
            0 0 44px rgba(160, 40, 200, 0.3),
            inset 0 1px 0 rgba(255, 200, 255, 0.35);
    }
    50% {
        transform: translateY(-1px) scale(1.05);
        box-shadow:
            0 0 32px rgba(240, 120, 255, 0.75),
            0 0 56px rgba(180, 60, 220, 0.42),
            inset 0 1px 0 rgba(255, 220, 255, 0.45);
    }
}

@keyframes combat-boss-avatar-glow-g {
    0%,
    100% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.4),
            0 0 24px rgba(255, 200, 90, 0.45),
            0 0 44px rgba(255, 140, 40, 0.18) !important;
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.4),
            0 0 40px rgba(255, 220, 120, 0.65),
            0 0 72px rgba(255, 160, 60, 0.3) !important;
    }
}

@keyframes combat-boss-avatar-glow-s {
    0%,
    100% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.4),
            0 0 32px rgba(220, 100, 255, 0.48),
            0 0 56px rgba(160, 40, 200, 0.22) !important;
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.4),
            0 0 48px rgba(240, 140, 255, 0.72),
            0 0 88px rgba(180, 60, 220, 0.35) !important;
    }
}

@keyframes combat-boss-icon-hero-g {
    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 10px rgba(255, 230, 160, 0.95));
    }
    50% {
        transform: scale(1.1);
        filter: drop-shadow(0 0 20px rgba(255, 220, 120, 1));
    }
}

@keyframes combat-boss-icon-hero-s {
    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 12px rgba(255, 140, 220, 0.95));
    }
    50% {
        transform: scale(1.12);
        filter: drop-shadow(0 0 24px rgba(255, 120, 240, 1));
    }
}

@keyframes combat-boss-pulse {
    0%,
    100% {
        opacity: 0.55;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.06);
    }
}

.combat-avatar--player {
    background: radial-gradient(circle at 30% 30%, rgba(80, 120, 200, 0.35), rgba(12, 18, 32, 0.92));
    color: #b8d4ff;
}

.combat-card__main {
    min-width: 0;
    flex: 1;
}

.combat-card__title {
    font-size: 0.95rem;
    margin: 0 0 0.2rem;
    color: var(--text);
    font-family: var(--font-ui);
    letter-spacing: 0.03em;
    line-height: 1.35;
    word-break: break-word;
}

.combat-card__subtitle {
    margin: 0;
    font-size: 0.78rem;
    color: var(--accent);
    font-weight: 600;
    letter-spacing: 0.06em;
}

.combat-card__playerline {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.65rem;
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.45;
}

.combat-card__titlebar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.35rem;
    margin-top: 0.35rem;
    min-height: 0;
}

.combat-card__titlebar--player {
    margin-top: 0;
    margin-bottom: 0;
    box-sizing: border-box;
}

.combat-title-fx {
    display: block;
    min-height: 0;
    flex: 0 1 auto;
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.combat-title-fx.combat-title-fx--active:not(.combat-title-fx--placeholder) {
    min-height: 3.25rem;
}

.combat-title-fx__stage {
    position: relative;
    display: block;
    min-height: 3.25rem;
    max-height: 7.5rem;
    width: 100%;
    max-width: 100%;
}

.combat-title-fx__stage--solo {
    min-height: 0;
}

.combat-title-fx__name {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    margin: 0;
    max-width: 100%;
    transition: opacity 0.12s ease;
}

.combat-title-fx--img-ready .combat-title-fx__name:not(.combat-title-fx__name--solo) {
    opacity: 0;
    pointer-events: none;
}

.combat-title-fx--active .combat-title-fx__name {
    font-size: 0.72rem;
    font-weight: 700;
    color: rgba(240, 215, 150, 0.98);
    letter-spacing: 0.08em;
    text-shadow: 0 0 12px rgba(212, 175, 55, 0.45);
    white-space: nowrap;
}

.combat-title-fx__name--solo {
    font-size: 0.78rem !important;
    background: linear-gradient(92deg, #c9a227, #fff8dc, #c9a227, #e8c547);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: combat-title-shimmer 2.4s ease-in-out infinite;
    filter: drop-shadow(0 0 6px rgba(212, 175, 55, 0.55));
}

@keyframes combat-title-shimmer {
    0% {
        background-position: 0% center;
    }
    50% {
        background-position: 100% center;
    }
    100% {
        background-position: 0% center;
    }
}

.combat-title-fx__img {
    max-height: 7.5rem;
    max-width: min(100%, 28rem);
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: left top;
    border-radius: 8px;
    vertical-align: middle;
}

@media (max-width: 1480px) {
    .combat-title-fx__img {
        max-height: 10.25rem;
        max-width: min(200%, 27rem);
    }
}

.modal-container--title {
    z-index: 5100 !important;
}

.modal-sheet--title {
    width: min(100%, 26rem);
    max-height: min(88dvh, 36rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.modal-sheet__head--title .modal-sheet__sub {
    font-size: 0.72rem;
    line-height: 1.45;
    color: var(--text-muted);
    margin: 0.25rem 0 0;
}

.title-modal-list {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: var(--space-sm) var(--space-md) var(--space-md);
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.title-modal__toolbar {
    flex-shrink: 0;
    margin-bottom: 0.15rem;
}

.title-modal__row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.5rem 0.75rem;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(212, 175, 55, 0.16);
    background: rgba(0, 0, 0, 0.22);
}

.title-modal__row--locked {
    opacity: 0.72;
    border-color: rgba(255, 255, 255, 0.06);
}

.title-modal__main {
    flex: 1 1 12rem;
    min-width: 0;
}

.title-modal__main h4 {
    margin: 0 0 0.2rem;
    font-size: 0.92rem;
    color: var(--gold);
    font-family: var(--font-display);
}

.title-modal__req,
.title-modal__prog,
.title-modal__fx-label {
    margin: 0.15rem 0 0;
    font-size: 0.7rem;
    color: var(--text-muted);
    line-height: 1.4;
}

.title-modal__fx {
    flex: 0 0 auto;
    width: 7.5rem;
    height: 4.5rem;
    border-radius: 8px;
    border: 1px solid rgba(212, 175, 55, 0.2);
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.title-modal__fx-img {
    max-width: 400%;
    max-height: 400%;
    object-fit: contain;
}

.title-modal__fx-fallback {
    font-size: 0.58rem;
    color: var(--text-muted);
    letter-spacing: 0.08em;
}

.title-modal__actions {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
    min-width: 5.5rem;
}

.title-modal__status {
    font-size: 0.62rem;
    letter-spacing: 0.06em;
}

.title-modal__status--ok {
    color: rgba(130, 220, 160, 0.9);
}

.title-modal__status--no {
    color: rgba(200, 100, 100, 0.85);
}

.combat-card__pname {
    font-weight: 600;
    color: var(--text);
}

.combat-card__prealm {
    font-size: 0.78rem;
    color: rgba(180, 188, 204, 0.88);
}

.combat-card__dmg {
    min-height: 1.5rem;
    margin-top: var(--space-xs);
}

/* 气血条 */
.combat-bar--hp {
    margin-top: 0.15rem;
}

.combat-bar__track {
    position: relative;
    height: 1.38rem;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.42);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.combat-bar__dmg {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    width: 100%;
    background: rgba(255, 210, 120, 0.42);
    transition: width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}

.combat-bar__fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 0.45rem;
    min-width: 0;
    box-sizing: border-box;
    font-size: 0.68rem;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.96);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
    transition: width 0.12s ease-out;
    overflow: hidden;
    white-space: nowrap;
}

.combat-bar__fill .combat-bar__pct {
    margin-left: 0.25rem;
    opacity: 0.88;
    font-size: 0.62rem;
}

.combat-bar__fill--enemy {
    background: linear-gradient(90deg, #6a1a22 0%, #c43c3c 55%, #e05555 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.combat-bar__fill--player {
    background: linear-gradient(90deg, #4a1520 0%, #a83240 50%, #d05058 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* 修为条 */
.combat-exp-block {
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(212, 175, 55, 0.12);
}

.combat-exp-block__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.combat-exp-block__lbl {
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    color: rgba(200, 190, 255, 0.88);
}

.combat-exp-block__lbl i {
    margin-right: 0.25rem;
    opacity: 0.85;
}

.combat-exp-block__nums {
    font-size: 0.7rem;
    font-variant-numeric: tabular-nums;
    color: rgba(200, 206, 220, 0.88);
}

.combat-exp-block__track {
    position: relative;
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(139, 92, 246, 0.35);
    overflow: hidden;
}

.combat-exp-block__fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    min-width: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #4c1d95 0%, #7c3aed 45%, #a78bfa 100%);
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.45);
    transition: width 0.14s ease-out;
}

/* 斗法 · 灵兽悟性条（与人物修为条结构一致，玉色） */
.combat-pet-wuxing-block {
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px solid rgba(120, 200, 150, 0.18);
}

.combat-pet-wuxing-block__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
}

.combat-pet-wuxing-block__lbl {
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    color: rgba(160, 235, 190, 0.88);
}

.combat-pet-wuxing-block__nums {
    font-size: 0.66rem;
    font-variant-numeric: tabular-nums;
    color: rgba(200, 230, 210, 0.9);
    text-align: right;
    min-width: 0;
}

.combat-pet-wuxing-block__track {
    position: relative;
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(90, 180, 130, 0.35);
    overflow: hidden;
}

.combat-pet-wuxing-block__fill {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0%;
    min-width: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #1a4a38 0%, #2d8a6a 42%, #5ab896 100%);
    box-shadow: 0 0 10px rgba(90, 200, 150, 0.35);
    transition: width 0.14s ease-out;
}

.combat-card--log {
    flex: 1;
    min-height: 8rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(212, 175, 55, 0.12);
    background: rgba(0, 0, 0, 0.28);
}

.combat-log__head {
    flex-shrink: 0;
    padding: 0.45rem 0.75rem;
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    color: rgba(212, 175, 55, 0.75);
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
    background: rgba(0, 0, 0, 0.25);
}

.combat-log__inner {
    flex: 1;
    overflow: auto;
    padding: 0.65rem 0.85rem;
    font-size: 0.84rem;
    line-height: 1.65;
    color: rgba(200, 206, 220, 0.88);
}

.combat-log__inner p {
    margin: 0 0 0.5rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
}

.combat-log__inner p:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.battle-info-panel {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

#enemyPanel {
    align-items: stretch;
}

#lvlupPanel .content {
    width: 100%;
    max-width: 24em;
    padding: var(--space-lg);
    gap: var(--space-md);
    overflow-y: auto;
}

#lvlupPanel h1 {
    text-align: center;
    font-size: 1.45rem;
    margin-bottom: 0.2rem;
}

#lvlupPanel .realm-line {
    text-align: center;
    font-size: 0.95rem;
    color: var(--text-muted, rgba(255, 255, 255, 0.65));
    margin: 0 0 0.75rem;
}

#lvlupPanel .content-head {
    padding: 0;
    align-items: center;
}

#lvlupPanel button[id^="lvlSlot"] {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    padding: var(--space-md);
    border-color: var(--border-subtle);
    background: rgba(0, 0, 0, 0.22);
    width: 100%;
    margin-bottom: var(--space-xs);
}

#lvlupPanel button[id^="lvlSlot"]:hover {
    border-color: var(--accent);
    background: var(--accent-dim);
}

#lvlupPanel button[id^="lvlSlot"] h3 {
    font-size: 0.92rem;
    margin-bottom: 0.2rem;
}

#lvlupPanel button[id^="lvlSlot"] p {
    font-size: 0.82rem;
    color: var(--text-muted);
    font-weight: 400;
}

/* 旧 stat-panel 通用（弹窗内等，不含主界面 hub-stats） */
.stat-panel:not(.hub-stats) {
    display: flex;
    margin: var(--space-sm);
    gap: var(--space-sm);
}

.stat-panel .box {
    white-space: normal;
    border-radius: var(--radius-sm);
    width: 100%;
    padding: var(--space-sm) var(--space-md);
    overflow: auto;
    font-size: 0.82rem;
}

.stat-panel .box p {
    margin: 0.2rem 0;
    color: var(--text-muted);
}

.stat-panel .box span {
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.decision-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: var(--space-sm) 0;
}

.decision-panel button {
    flex: 1;
    min-width: calc(50% - 0.2rem);
}

.decision-panel--boss-door button {
    flex: 1 1 100%;
    min-width: 100%;
}

.box-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-xs);
}

.box-head i {
    margin: 0;
}

.logBox {
    margin: var(--space-sm);
    min-height: 8rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: var(--space-md);
}

#combatLogBox {
    overflow: auto;
}

.content-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-sm);
}

.content .content-head i {
    margin: 0;
}

#dungeon-main {
    display: none;
}

#loading {
    display: none;
}

.loader {
    border: 3px solid var(--border-subtle);
    border-top-color: var(--accent);
    border-radius: 50%;
    width: 2.6rem;
    height: 2.6rem;
    animation: spin 0.85s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

#allocate-stats {
    width: 100%;
    max-width: 20rem;
}

#allocate-stats .row {
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--border-subtle);
}

#allocate-stats .row:last-of-type {
    border-bottom: none;
}

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.35);
    border-radius: 8px;
}

.scrollable {
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(212, 175, 55, 0.4) transparent;
}

.scrollable::-webkit-scrollbar {
    width: 6px;
}

.Common { color: #e2e4eb; }
.Uncommon { color: #4ade80; }
.Rare { color: #60a5fa; }
.Epic { color: #c084fc; }
.Legendary { color: var(--gold); }
.eq-enchant-tier-1 {
    color: #8be9a8;
    text-shadow: 0 0 8px rgba(139, 233, 168, 0.3);
}
.eq-enchant-tier-2 {
    color: #77c6ff;
    text-shadow: 0 0 10px rgba(119, 198, 255, 0.38);
}
.eq-enchant-tier-3 {
    color: #c695ff;
    text-shadow: 0 0 12px rgba(198, 149, 255, 0.45);
}
.eq-enchant-tier-4 {
    color: #ffd36e;
    text-shadow: 0 0 14px rgba(255, 211, 110, 0.55), 0 0 22px rgba(255, 170, 84, 0.28);
}
.Heirloom { color: #fb7185; }
.Etherbound {
    color: #5eead4;
    text-shadow: 0 0 12px rgba(94, 234, 212, 0.45);
}
.StellarSign {
    color: #a5b4fc;
    text-shadow: 0 0 14px rgba(165, 180, 252, 0.5);
}
.Nullforge {
    color: #c4b5fd;
    text-shadow: 0 0 14px rgba(196, 181, 253, 0.45);
}
.Chronarch {
    color: #fcd34d;
    text-shadow: 0 0 16px rgba(252, 211, 77, 0.55);
}
.Apexother {
    color: #f472b6;
    text-shadow: 0 0 18px rgba(244, 114, 182, 0.55), 0 0 28px rgba(167, 139, 250, 0.35);
}

.dmg-container {
    position: relative;
    min-height: 0.5rem;
}

.dmg-numbers {
    color: white;
    font-size: 1.55em;
    font-weight: 600;
    animation: dmg-numbers 0.7s ease-out forwards;
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.85);
}

.dungeon-title-buff {
    margin-top: 0.2rem;
    font-size: 0.72rem;
    line-height: 1.3;
    color: rgba(232, 224, 255, 0.95);
    text-shadow: 0 0 10px rgba(167, 139, 250, 0.35);
}

@keyframes dmg-numbers {
    0% {
        opacity: 0;
        transform: translateX(-50%) scale(1.35);
    }
    20% {
        opacity: 1;
        transform: translateX(-50%) scale(1);
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-2.25rem);
    }
}

.animation-shake {
    animation: shake 0.2s;
}

@keyframes shake {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(-2px, 1px); }
    50% { transform: translate(2px, -1px); }
    75% { transform: translate(-1px, -2px); }
}

.logBox button,
#dungeonLog button {
    margin: 0.22rem 0.12rem 0.22rem 0;
}

/* ===== 修仙市场（联网 · 嵌入主游戏） ===== */
/* 嵌入模式：覆盖 index 内联 display:none，确保修仙市场+武神坛一栏可见 */
html.dongtian-cloud-embedded #xiuMarketBar,
body.dongtian-cloud-embedded #xiuMarketBar {
    display: flex !important;
    position: relative;
    z-index: 40 !important;
}

/* 嵌入主游戏 · 任意宽度：视口高度封顶；宽屏双列时右栏「历练纪闻」在栏内滚动，避免日志撑破、底部选项被顶出视口 */
html.dongtian-cloud-embedded,
html.dongtian-cloud-embedded body {
    max-height: 100dvh;
    overflow: hidden;
}

body.dongtian-cloud-embedded .app-root {
    max-height: 100dvh;
    min-height: 0;
    overflow: hidden;
}

body.dongtian-cloud-embedded .app-root > .game-container {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
}

body.dongtian-cloud-embedded #dungeon-main.game-container.scrollable.screen--hub {
    overflow: hidden !important;
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
}

body.dongtian-cloud-embedded .app-panel.screen.screen--hub,
body.dongtian-cloud-embedded .screen--hub {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

@media (min-width: 800px) {
    body.dongtian-cloud-embedded .hub-layout {
        min-height: 0;
        max-height: 100%;
        height: 100%;
    }

    body.dongtian-cloud-embedded .hub-layout__log.log-panel {
        height: 100% !important;
        max-height: 100% !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    body.dongtian-cloud-embedded .hub-layout__log .log-panel__scroll,
    body.dongtian-cloud-embedded .hub-layout__log #dungeonLog {
        flex: 0 1 auto !important;
        min-height: 0 !important;
        max-height: min(100dvh, 50rem) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-gutter: stable;
    }
}

/* 嵌入主游戏 · 窄屏：主界面一屏排布（外层不滚动，仅「历练纪闻」正文区可滚） */
@media (max-width: 799px) {
    html.dongtian-cloud-embedded,
    html.dongtian-cloud-embedded body {
        height: 100%;
        height: 100dvh;
        overflow: hidden;
    }

    body.dongtian-cloud-embedded .app-root {
        align-items: stretch;
        justify-content: flex-start;
        padding: 0.2rem;
        padding-bottom: max(0.2rem, env(safe-area-inset-bottom, 0px));
        min-height: 100dvh;
        height: 100dvh;
        max-height: 100dvh;
        box-sizing: border-box;
        overflow: hidden;
    }

    body.dongtian-cloud-embedded .app-root > .game-container {
        flex: 1 1 auto;
        min-height: 0;
        max-width: none;
        width: 100%;
    }

    body.dongtian-cloud-embedded #dungeon-main.game-container.scrollable.screen--hub {
        overflow: hidden !important;
        flex: 1 1 auto;
        min-height: 0;
        max-height: 100%;
    }

    body.dongtian-cloud-embedded .app-panel.screen.screen--hub {
        flex: 1 1 auto;
        min-height: 0;
        max-height: 100%;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    body.dongtian-cloud-embedded .screen--hub {
        min-height: 0 !important;
        max-height: 100%;
        flex: 1 1 auto;
        overflow: hidden;
    }

    body.dongtian-cloud-embedded .hub-layout {
        flex: 1 1 auto;
        min-height: 0;
        gap: 0.28rem;
        padding: 0.35rem 0.45rem;
    }

    body.dongtian-cloud-embedded .hub-layout__primary {
        flex-shrink: 1;
        min-height: 0;
        gap: 0.28rem;
        overflow: hidden;
    }

    body.dongtian-cloud-embedded .hud-bar {
        padding: 0.45rem 0.55rem;
        gap: 0.45rem;
    }

    body.dongtian-cloud-embedded .hud-bar__avatar {
        width: 3rem;
        height: 3rem;
        font-size: 1.35rem;
    }

    body.dongtian-cloud-embedded .hud-name,
    body.dongtian-cloud-embedded .hud-realm,
    body.dongtian-cloud-embedded .hud-sect {
        font-size: 1.64rem;
    }

    body.dongtian-cloud-embedded .hud-pill {
        font-size: 1.56rem;
    }

    body.dongtian-cloud-embedded .hud-bar .btn {
        font-size: 1.52rem;
        padding: 0.38rem 0.55rem;
    }

    body.dongtian-cloud-embedded .run-bar__grid {
        gap: 0.28rem;
        padding: 0.4rem 0.45rem;
    }

    body.dongtian-cloud-embedded .run-bar__cell {
        font-size: 1.68rem;
    }

    body.dongtian-cloud-embedded .run-bar__cell--time {
        padding: 0.38rem 0.45rem;
        font-size: 2rem;
    }

    body.dongtian-cloud-embedded .run-bar__cell--time::before {
        font-size: 1.24rem;
    }

    body.dongtian-cloud-embedded .run-bar__extra-actions {
        padding: 0.4rem 0.45rem;
        gap: 0.3rem;
    }

    body.dongtian-cloud-embedded .run-bar__action {
        font-size: 1.52rem;
        letter-spacing: 0.08em;
        padding: 0.45rem 0.65rem;
    }

    body.dongtian-cloud-embedded .hub-layout__xiu-market {
        padding: 0.2rem 0 0.28rem;
    }

    body.dongtian-cloud-embedded .xiu-market-actions {
        gap: 0.28rem;
    }

    body.dongtian-cloud-embedded .wushen-arena-open-btn,
    body.dongtian-cloud-embedded .xiu-market-open-btn {
        min-height: 3.1rem;
        font-size: 1.6rem;
        padding-top: 0.32rem;
        padding-bottom: 0.32rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel {
        gap: 0.28rem;
    }

    body.dongtian-cloud-embedded .stat-card {
        padding: 0.4rem 0.45rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel .card__title {
        font-size: 1.72rem;
        margin-bottom: 0.2rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel .stat-card__body p {
        padding: 0.08rem 0;
        font-size: 1.52rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel .stat-card__lbl {
        font-size: 1.44rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel .stat-card__val {
        font-size: 1.52rem;
    }

    body.dongtian-cloud-embedded .hub-stats.stat-panel .stat-card__body p i {
        font-size: 1.4rem;
        width: 1.35rem;
    }

    body.dongtian-cloud-embedded .hub-layout__log.log-panel {
        flex: 1 1 auto;
        min-height: 0;
        padding: 0.35rem 0.5rem 0.4rem;
    }

    body.dongtian-cloud-embedded .hub-layout__log .log-panel__head {
        margin-bottom: 0.12rem;
        padding-bottom: 0.22rem;
    }

    body.dongtian-cloud-embedded .log-panel__heading {
        font-size: 2rem;
        letter-spacing: 0.14em;
    }

    body.dongtian-cloud-embedded .log-panel__status {
        font-size: 1.64rem;
        line-height: 1.38;
    }

    /* 纪闻正文：限制可视高度，长文在此区域内滚动 */
    body.dongtian-cloud-embedded .log-panel__scroll,
    body.dongtian-cloud-embedded #dungeonLog {
        font-size: 1.72rem;
        line-height: 1.5;
        max-height: min(28dvh, 11rem);
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        scrollbar-gutter: stable;
    }
}

.hub-layout__xiu-market {
    display: flex;
    justify-content: center;
    padding: 0.35rem 0 0.5rem;
    position: relative;
    z-index: 4;
    pointer-events: auto;
}
.xiu-market-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.45rem;
    width: 100%;
    max-width: 22rem;
    align-items: stretch;
    justify-content: center;
}
.xiu-market-open-btn,
.wushen-arena-open-btn {
    flex: 1 1 auto;
    min-width: 5.25rem;
    border: 1px solid var(--border) !important;
    color: var(--gold) !important;
    background: linear-gradient(180deg, rgba(228, 199, 106, 0.12), rgba(10, 13, 22, 0.5)) !important;
    border-radius: var(--radius-sm);
    font-family: var(--font-xian);
    letter-spacing: 0.08em;
}
.wushen-arena-open-btn {
    background: linear-gradient(180deg, rgba(180, 120, 220, 0.14), rgba(10, 13, 22, 0.5)) !important;
    color: #e8d4ff !important;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0.12);
    -webkit-user-select: none;
    user-select: none;
    min-height: 2.75rem;
    position: relative;
    z-index: 5;
}
body.wushen-arena-open {
    overflow: hidden;
    overscroll-behavior: none;
}
.modal-container--wushen-arena {
    z-index: 5002 !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    min-height: 100% !important;
    min-height: 100dvh !important;
    max-height: none !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    padding: var(--space-sm);
    isolation: isolate;
    pointer-events: auto;
    overscroll-behavior: contain;
    touch-action: manipulation;
}
.wushen-arena-sheet {
    position: relative;
    z-index: 2;
    width: min(100%, 38rem);
    max-height: min(92dvh, 44rem);
    display: flex;
    flex-direction: column;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.wushen-arena-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-md);
    padding: var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
}
.wushen-arena-eyebrow {
    font-size: 0.7rem;
    color: var(--text-faint);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 0.15rem;
}
.wushen-arena-title {
    font-family: var(--font-xian);
    color: #d4b8ff;
    font-size: 1.25rem;
    margin: 0;
}
.wushen-arena-sub {
    font-size: 0.72rem;
    color: var(--text-muted);
    margin-top: 0.28rem;
    line-height: 1.45;
}
.wushen-arena-head-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    flex-shrink: 0;
}
.wushen-arena-coin {
    font-size: 0.78rem;
    color: var(--text-muted);
}
.wushen-arena-coin strong {
    color: var(--gold);
}
.wushen-arena-meta {
    font-size: 0.72rem;
    color: var(--text-faint);
}
.wushen-arena-body {
    padding: var(--space-md);
    overflow: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}
.wushen-arena-panels {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
}
@media (min-width: 640px) {
    .wushen-arena-panels {
        grid-template-columns: 1fr 1fr;
    }
}
.wushen-arena-card {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    padding: var(--space-md);
    background: rgba(0, 0, 0, 0.12);
}
.wushen-arena-card-title {
    margin: 0 0 0.35rem;
    font-size: 0.95rem;
    color: var(--gold);
    font-family: var(--font-xian);
}
.wushen-arena-muted {
    font-size: 0.72rem;
    color: var(--text-muted);
    line-height: 1.45;
    margin: 0 0 0.6rem;
}
.wushen-arena-snap-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
}
.wushen-arena-snap-label {
    font-size: 0.75rem;
    color: var(--text-faint);
    margin: 0 0 0.2rem;
}
.wushen-arena-snap-preview {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0 0 0.5rem;
    min-height: 1.2em;
}
.wushen-arena-actions-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}
.wushen-arena-result {
    margin: 0.55rem 0 0;
    font-size: 0.85rem;
    color: #c8e6c9;
    min-height: 1.2em;
}
.wushen-arena-rank-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.wushen-arena-cycle {
    font-size: 0.72rem;
    color: var(--text-faint);
}
.wushen-arena-reward-hint {
    margin-top: 0.25rem;
}
.wushen-arena-rank-list {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    max-height: 14rem;
    overflow: auto;
}
.wushen-arena-rank-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.25rem;
    border-bottom: 1px solid var(--border-subtle);
    font-size: 0.8rem;
}
.wushen-rank-num {
    width: 1.6rem;
    color: var(--gold);
    font-weight: 700;
}
.wushen-rank-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.wushen-rank-wl {
    color: var(--text-muted);
    flex-shrink: 0;
    min-width: 5.2rem;
}
.wushen-rank-action {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    min-width: 4.5rem;
}
.wushen-rank-action .btn {
    padding: 0.15rem 0.45rem;
    font-size: 0.72rem;
}
.wushen-rank-wait,
.wushen-rank-self {
    font-size: 0.72rem;
    color: var(--text-faint);
}
.wushen-rank-self {
    color: var(--gold);
}
.wushen-arena-rank-empty {
    padding: 0.75rem 0.25rem;
    color: var(--text-faint);
    font-size: 0.8rem;
}
body.xiu-market-open {
    overflow: hidden;
    overscroll-behavior: none;
}
body.xiu-sell-open {
    overscroll-behavior: none;
}
.modal-container--xiu-market {
    /* 高于主界面内嵌模态（100）及 iframe 内外可能叠加的层，避免半透明遮罩能挡住指针但面板被压在下面 */
    z-index: 5000;
    padding: var(--space-sm);
    isolation: isolate;
    pointer-events: auto;
    overscroll-behavior: contain;
    touch-action: manipulation;
}
.xiu-market-sheet {
    position: relative;
    z-index: 2;
    pointer-events: auto;
    width: min(100%, 36rem);
    max-height: min(92dvh, 40rem);
    display: flex;
    flex-direction: column;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    overscroll-behavior: contain;
}
.xiu-market-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-md);
    padding: var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
}
.xiu-market-eyebrow {
    font-size: 0.7rem;
    color: var(--text-faint);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 0.15rem;
}
.xiu-market-title {
    font-family: var(--font-xian);
    color: var(--gold);
    font-size: 1.25rem;
    margin: 0;
}
.xiu-market-sub {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 0.25rem;
    line-height: 1.45;
}
.xiu-market-head-actions {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}
.xiu-market-coin {
    font-size: 0.8rem;
    color: var(--text-muted);
}
.xiu-market-coin strong {
    color: var(--accent);
}
.xiu-market-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding: 0.35rem var(--space-md);
    border-bottom: 1px solid var(--border-subtle);
    font-size: 0.82rem;
}
.xiu-market-check input {
    margin-right: 0.25rem;
}
.xiu-market-filter select {
    margin-left: 0.25rem;
    font-size: 0.8rem;
    padding: 0.25rem 0.4rem;
}
.xiu-market-equip-filters {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.65rem;
}
.xiu-market-equip-filters[hidden] {
    display: none !important;
}
.xiu-market-pet-filters {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.65rem;
}
.xiu-market-pet-filters[hidden] {
    display: none !important;
}
.xiu-market-filter--lvl {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.2rem;
}
.xiu-market-lvl-inp {
    width: 3.75rem;
    padding: 0.22rem 0.35rem;
    font-size: 0.78rem;
    margin-left: 0.25rem;
    user-select: text;
    -webkit-user-select: text;
}
/* 与主游戏无限深渊聊天输入一致：≥16px 避免 iOS 聚焦时自动放大整页/iframe */
@media (max-width: 1024px) {
    .xiu-market-lvl-inp,
    .xiu-market-inp,
    .xiu-sell-input,
    .molong-room-search,
    .molong-room-title-input,
    .molong-assist-shop-qty-input,
    .dt-alchemy-select,
    .dt-ss-pack-input,
    .shitu-pid-input,
    .lingtian-input-modal__input,
    .lingtian-input-modal input,
    .inv-batch-qty-modal__input,
    .select-field,
    .select-field--inv,
    .pet-ui__select,
    .inv-toolbar__lvl-inp,
    select,
    textarea,
    .modal-container input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
    .modal-container select,
    .modal-container textarea {
        font-size: 16px !important;
    }
}
.xiu-market-lvl-sep {
    color: var(--text-faint);
    font-size: 0.74rem;
    padding: 0 0.05rem;
}
.xiu-market-body {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    overflow: hidden;
    flex: 1;
    min-height: 0;
}
@media (min-width: 720px) {
    .xiu-market-body:not(.xiu-market-body--browse) {
        grid-template-columns: 1.1fr 0.9fr;
    }
}
.xiu-market-col {
    padding: var(--space-md);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-height: min(72dvh, 34rem);
    overscroll-behavior: contain;
    touch-action: pan-y;
}
.xiu-market-col--sell {
    border-top: 1px solid var(--border-subtle);
}
@media (min-width: 720px) {
    .xiu-market-col--sell {
        border-top: none;
        border-left: 1px solid var(--border-subtle);
    }
}
.xiu-market-h4 {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin: 0.5rem 0 0.35rem;
    letter-spacing: 0.08em;
}
.xiu-market-list {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.xiu-market-row {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    padding: 0.45rem 0.5rem;
    background: rgba(12, 16, 24, 0.55);
}
.xiu-market-row-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}
.xiu-market-row-nameblock {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex: 1;
    min-width: 0;
}
/* 长标题勿盖住「信息」按钮，避免点穿到标题文字导致按钮无响应 */
.xiu-market-row-nameblock > strong {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.xiu-market-info-btn {
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    padding: 0.12rem 0.4rem !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.04em;
}
.xiu-market-info-btn i {
    pointer-events: none;
}
.xiu-market-preview-hint {
    font-size: 0.72rem;
    color: var(--text-faint);
    margin-bottom: 0.5rem;
    letter-spacing: 0.06em;
}
#equipmentInfo.modal-container--market-preview,
#defaultModal.modal-container--market-preview {
    z-index: 12070 !important;
}
.xiu-mat-preview h4 {
    font-family: var(--font-xian);
    color: var(--gold);
    margin: 0.25rem 0 0.5rem;
    font-size: 1rem;
}
.xiu-mat-preview-desc {
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.55;
    margin-bottom: 0.75rem;
}
.pet-market-preview-wrap {
    text-align: left;
}
.xiu-market-tag {
    font-size: 0.65rem;
    padding: 0.1rem 0.35rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--accent);
}
.xiu-market-seller {
    font-size: 0.72rem;
    color: var(--text-muted);
    margin-left: auto;
}
.xiu-market-row-desc {
    font-size: 0.72rem;
    color: var(--text-muted);
    line-height: 1.45;
    margin: 0.28rem 0 0.1rem;
}
.xiu-market-row-main strong {
    font-weight: 700;
}
.xiu-market-row-meta {
    font-size: 0.72rem;
    color: var(--text-faint);
    margin-top: 0.2rem;
}
.xiu-market-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    align-items: center;
    margin-top: 0.35rem;
}
.xiu-market-inp {
    width: 5.5rem;
    max-width: 42vw;
    padding: 0.25rem 0.35rem;
    font-size: 0.8rem;
}
.xiu-market-muted {
    color: var(--text-muted);
    font-size: 0.85rem;
}
.xiu-market-err {
    color: var(--danger);
    font-size: 0.85rem;
}
.xiu-market-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin: 0.5rem 0;
    font-size: 0.78rem;
    color: var(--text-muted);
}
.xiu-market-sold {
    font-size: 0.72rem;
    color: var(--text-faint);
    max-height: 9rem;
    overflow-y: auto;
}
.xiu-market-sold-row {
    padding: 0.28rem 0;
    border-bottom: 1px dashed var(--border-subtle);
    line-height: 1.45;
    word-break: break-word;
}
.xiu-sell-scroll {
    max-height: 8rem;
    overflow-y: auto;
    font-size: 0.8rem;
}
.xiu-sell-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0;
    border-bottom: 1px solid var(--border-subtle);
}

/* 上架弹窗：结构对齐主游戏「联网装备市场」金边深色面板，配色融合洞天劫 */
.modal-container--xiu-sell {
    /* 高于灵宠法器弹窗（12061），避免从法器行囊点上架/赠送时被盖住 */
    z-index: 12070;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    overscroll-behavior: contain;
    touch-action: manipulation;
}
/* 全局 * { user-select:none } 会干扰输入框录入；上架/确认弹窗内强制可选中与可点击 */
.modal-container--xiu-sell .xiu-sell-input,
.modal-container--xiu-sell .xiu-sell-input::placeholder,
.modal-container--xiu-confirm input {
    user-select: text !important;
    -webkit-user-select: text !important;
    pointer-events: auto;
    touch-action: manipulation;
}
/* 行囊/灵宠仍打开时，可能盖住上架层导致无法聚焦输入；上架打开时让下层模态不抢指针 */
body.xiu-sell-open #inventory.modal-container,
body.xiu-sell-open #petModal.modal-container,
body.xiu-sell-open #dongtianPetEquipModal.modal-container,
body.xiu-sell-open #dongtianPetPillModal.modal-container,
body.xiu-sell-open #dongtianLingtianModal.modal-container,
body.xiu-sell-open #dongtianAlchemyModal.modal-container {
    pointer-events: none !important;
}

.inv-mat-card__market-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    margin-top: 8px;
}
.inv-slot__market-row {
    flex: 0 0 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
    align-items: center;
}

/* 行内「上架/赠送」走文档流，勿再用绝对定位（否则卡片高度不含按钮，神话卡 overflow:hidden 会裁底） */
.inv-slot__market-row .inv-slot__market,
.inv-slot__market-row .inv-slot__gift {
    position: static;
    bottom: auto;
    right: auto;
    z-index: auto;
}
.pet-roster__market-wrap {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    margin-left: 0;
    margin-top: 2px;
    width: 100%;
    justify-content: flex-start;
}
.dt-pet-pill-market-wrap {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    vertical-align: middle;
}
.xiu-sell-sheet {
    position: relative;
    z-index: 1;
    width: min(100%, 22rem);
    max-height: min(88dvh, 32rem);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, rgba(26, 26, 46, 0.98) 0%, rgba(12, 12, 22, 0.99) 100%);
    color: var(--text);
    border-radius: 14px;
    border: 2px solid rgba(255, 215, 0, 0.78);
    box-shadow: 0 0 36px rgba(255, 215, 0, 0.18), 0 20px 48px rgba(0, 0, 0, 0.65);
}
.xiu-sell-head {
    padding: var(--space-md) var(--space-lg);
    border-bottom: 1px solid var(--border-subtle);
}
.xiu-sell-eyebrow {
    font-size: 0.68rem;
    color: var(--text-faint);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 0.2rem;
}
.xiu-sell-title {
    font-family: var(--font-xian);
    color: var(--gold);
    font-size: 1.2rem;
    margin: 0;
    font-weight: 600;
}
.xiu-sell-hint {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 0.4rem;
    line-height: 1.45;
}
.xiu-sell-body {
    padding: var(--space-md) var(--space-lg);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
}
.xiu-sell-row {
    margin-bottom: 0.65rem;
}
.xiu-sell-row--warn {
    margin-bottom: 0.75rem;
}
.xiu-sell-label {
    display: block;
    font-size: 0.78rem;
    color: rgba(224, 224, 232, 0.92);
    margin-bottom: 0.3rem;
}
.xiu-sell-label--gap {
    margin-top: 0.55rem;
}
.xiu-sell-muted {
    font-size: 0.68rem;
    color: var(--text-faint);
    margin-top: 0.25rem;
}
.xiu-sell-input {
    width: 100%;
    padding: 0.45rem 0.55rem;
    font-size: 0.88rem;
    border-radius: 8px;
    border: 1px solid rgba(85, 85, 110, 0.95);
    background: rgba(42, 42, 74, 0.92);
    color: #eceff1;
    user-select: text;
    -webkit-user-select: text;
}
.xiu-sell-input:focus {
    border-color: rgba(255, 215, 0, 0.55);
    box-shadow: 0 0 0 1px rgba(255, 215, 0, 0.2);
}
.xiu-sell-input::placeholder {
    color: var(--text-faint);
}
.xiu-sell-warn {
    font-size: 0.78rem;
    color: rgba(255, 213, 130, 0.95);
    line-height: 1.45;
    margin: 0;
}
.xiu-sell-warn i {
    margin-right: 0.35rem;
    opacity: 0.9;
}
.xiu-sell-mode {
    display: flex;
    gap: 0.45rem;
    margin: 0.35rem 0 0.75rem;
}
.xiu-sell-mode-btn {
    flex: 1;
    padding: 0.45rem 0.5rem;
    font-size: 0.78rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.35);
    color: var(--text-muted);
    cursor: pointer;
    font-family: var(--font-ui);
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.xiu-sell-mode-btn:hover {
    border-color: rgba(255, 215, 0, 0.35);
    color: var(--text);
}
.xiu-sell-mode-btn--active {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.95), rgba(255, 193, 7, 0.88));
    color: #1a1a2e;
    font-weight: 700;
    border-color: rgba(255, 215, 0, 0.9);
}
.xiu-sell-fields {
    margin-bottom: 0.25rem;
}
.xiu-sell-err {
    min-height: 1.1rem;
    font-size: 0.78rem;
    color: var(--danger);
    margin-top: 0.35rem;
}
.xiu-sell-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: var(--space-md) var(--space-lg);
    border-top: 1px solid var(--border-subtle);
    background: rgba(0, 0, 0, 0.2);
}
.modal-container--xiu-confirm {
    z-index: 12072;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    overscroll-behavior: contain;
    touch-action: manipulation;
}
.xiu-confirm-sheet {
    width: min(100%, 20rem);
    padding: var(--space-lg);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(30, 32, 48, 0.98), rgba(14, 16, 24, 0.99));
    border: 2px solid rgba(255, 215, 0, 0.65);
    box-shadow: var(--shadow);
}
.xiu-confirm-text {
    font-size: 0.88rem;
    color: var(--text);
    line-height: 1.5;
    margin-bottom: var(--space-md);
}
.xiu-market-toast {
    position: fixed;
    left: 50%;
    bottom: max(1rem, env(safe-area-inset-bottom));
    transform: translateX(-50%);
    z-index: 12080;
    max-width: min(92%, 22rem);
    padding: 0.55rem 1rem;
    font-size: 0.82rem;
    text-align: center;
    border-radius: 999px;
    background: rgba(18, 22, 34, 0.94);
    border: 1px solid rgba(255, 215, 0, 0.45);
    color: rgba(255, 248, 225, 0.96);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
    pointer-events: none;
}
.xiu-market-toast--err {
    border-color: rgba(224, 82, 82, 0.55);
    color: #ffc9c9;
}
/** 副本大厅通关奖励：多行、略宽、易读完材料明细 */
.xiu-market-toast.xiu-market-toast--molong-reward {
    max-width: min(96%, 34rem);
    border-radius: 0.75rem;
    white-space: pre-wrap;
    line-height: 1.45;
    text-align: left;
    padding: 0.65rem 1rem;
}

button.molong-hall-locked,
.btn.molong-hall-locked {
    opacity: 0.55;
    cursor: not-allowed;
}

/* 助战商店：叠在副本大厅之上，修仙卷轴 / 玉色点缀 */
.modal-container--molong-assist-shop {
    z-index: 5012 !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    min-height: 100dvh !important;
    padding: var(--space-sm);
    isolation: isolate;
    overscroll-behavior: contain;
    touch-action: manipulation;
    background: rgba(6, 10, 18, 0.82);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.molong-assist-shop-sheet {
    position: relative;
    z-index: 1;
    width: min(100%, 42rem);
    max-height: min(92dvh, 46rem);
    display: flex;
    flex-direction: column;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(120, 200, 170, 0.35);
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.5),
        0 20px 48px rgba(0, 0, 0, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    background: linear-gradient(165deg, rgba(22, 36, 32, 0.97) 0%, rgba(10, 16, 22, 0.98) 55%, rgba(12, 22, 28, 0.99) 100%);
}
.molong-assist-shop-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.45;
    background:
        radial-gradient(ellipse 120% 80% at 50% -20%, rgba(160, 220, 200, 0.18), transparent 55%),
        radial-gradient(ellipse 80% 50% at 100% 50%, rgba(100, 140, 200, 0.08), transparent 50%),
        repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0, 0, 0, 0.04) 2px, rgba(0, 0, 0, 0.04) 3px);
}
.molong-assist-shop-head {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-md);
    padding: 1rem 1.1rem 0.85rem;
    border-bottom: 1px solid rgba(90, 160, 140, 0.22);
}
.molong-assist-shop-head-text {
    min-width: 0;
}
.molong-assist-shop-eyebrow {
    font-size: 0.68rem;
    color: rgba(180, 220, 200, 0.75);
    letter-spacing: 0.28em;
    text-transform: uppercase;
    margin: 0 0 0.2rem;
}
.molong-assist-shop-title {
    margin: 0;
    font-family: var(--font-xian);
    font-size: 1.35rem;
    font-weight: 600;
    background: linear-gradient(92deg, #c8f5e8 0%, #e8f8ff 40%, #b8e8d8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 24px rgba(120, 200, 180, 0.25);
}
.molong-assist-shop-sub {
    margin: 0.45rem 0 0;
    font-size: 0.72rem;
    line-height: 1.55;
    color: rgba(210, 225, 220, 0.82);
    max-width: 28rem;
}
.molong-assist-shop-sub strong {
    color: rgba(255, 230, 160, 0.95);
    font-weight: 600;
}
.molong-assist-shop-head-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
    flex-shrink: 0;
}
.molong-assist-shop-balance {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding: 0.35rem 0.65rem;
    border-radius: 10px;
    border: 1px solid rgba(212, 175, 55, 0.4);
    background: linear-gradient(180deg, rgba(30, 42, 38, 0.9), rgba(12, 18, 20, 0.92));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.molong-assist-shop-balance-label {
    font-size: 0.62rem;
    color: rgba(200, 210, 205, 0.75);
    letter-spacing: 0.12em;
}
.molong-assist-shop-balance-num {
    font-size: 1.1rem;
    font-weight: 700;
    color: #f0d78c;
    font-variant-numeric: tabular-nums;
}
.molong-assist-shop-body {
    position: relative;
    padding: 0.65rem 0.85rem 1rem;
    overflow: auto;
    flex: 1;
}
.molong-assist-shop-hint {
    margin: 0 0 0.55rem;
    font-size: 0.72rem;
    color: rgba(170, 200, 190, 0.88);
    line-height: 1.45;
}
.molong-assist-shop-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.55rem;
}
@media (min-width: 520px) {
    .molong-assist-shop-grid {
        grid-template-columns: 1fr 1fr;
    }
}
.molong-assist-shop-card {
    position: relative;
    text-align: left;
    padding: 0.65rem 0.75rem 0.55rem;
    border-radius: 12px;
    border: 1px solid rgba(100, 160, 140, 0.28);
    background: linear-gradient(145deg, rgba(28, 44, 40, 0.75), rgba(14, 22, 26, 0.88));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.molong-assist-shop-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle at 30% 20%, rgba(180, 255, 220, 0.12), transparent 55%);
    transition: opacity 0.2s ease;
}
.molong-assist-shop-card:hover {
    border-color: rgba(140, 210, 180, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 0 0 1px rgba(80, 160, 130, 0.15);
}
.molong-assist-shop-card:hover::before {
    opacity: 1;
}
.molong-assist-shop-card-name {
    margin: 0 0 0.2rem;
    font-size: 0.88rem;
    font-family: var(--font-xian);
    color: rgba(230, 248, 240, 0.96);
}
.molong-assist-shop-card-rate {
    margin: 0 0 0.45rem;
    font-size: 0.7rem;
    color: rgba(160, 190, 180, 0.9);
    line-height: 1.35;
}
.molong-assist-shop-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.molong-assist-shop-cost {
    font-size: 0.78rem;
    color: #e8c97a;
    font-weight: 600;
    white-space: nowrap;
}
.molong-assist-shop-card .btn--sm {
    flex-shrink: 0;
}
.btn.molong-assist-shop-open-btn {
    border-color: rgba(212, 175, 55, 0.45);
    color: rgba(255, 236, 190, 0.95);
}

.molong-assist-shop-batch-toolbar {
    margin-bottom: 0.65rem;
    padding: 0.55rem 0.65rem;
    border-radius: 10px;
    border: 1px solid rgba(100, 160, 140, 0.35);
    background: rgba(0, 0, 0, 0.22);
}
.molong-assist-shop-batch-tip {
    margin: 0 0 0.45rem;
    font-size: 0.72rem;
    line-height: 1.45;
    color: rgba(185, 210, 200, 0.9);
}
.molong-assist-shop-batch-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    justify-content: flex-end;
}
.molong-assist-shop-batch-sum {
    flex: 1 1 10rem;
    min-width: 0;
    font-size: 0.78rem;
    color: rgba(220, 235, 228, 0.92);
    font-variant-numeric: tabular-nums;
}
.molong-assist-shop-batch-sum--over {
    color: #f0a8a8;
}
.molong-assist-shop-card-foot--batch {
    flex-direction: column;
    align-items: stretch;
    gap: 0.4rem;
}
.molong-assist-shop-qty-label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: rgba(200, 218, 210, 0.9);
}
.molong-assist-shop-qty-input {
    width: 4.5rem;
    padding: 0.25rem 0.4rem;
    font-size: 0.82rem;
    border-radius: 8px;
    border: 1px solid rgba(120, 180, 160, 0.4);
    background: rgba(8, 14, 18, 0.85);
    color: rgba(248, 252, 250, 0.96);
}
.molong-assist-shop-qty-input:focus {
    outline: none;
    border-color: rgba(212, 175, 55, 0.55);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.15);
}
.molong-assist-shop-line-sum {
    font-size: 0.72rem;
    color: rgba(232, 201, 122, 0.92);
    font-variant-numeric: tabular-nums;
}

/* 副本大厅 · 筛选行 + 搜索 */
.molong-filter-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    margin: 0.25rem 0 0;
}
.molong-room-search-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex: 1 1 12rem;
    min-width: 0;
    max-width: 100%;
}
.molong-room-search-lbl {
    flex-shrink: 0;
    opacity: 0.9;
}
.molong-room-search {
    flex: 1 1 8rem;
    min-width: 0;
    max-width: 100%;
    padding: 0.28rem 0.5rem;
    font-size: 0.82rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.35);
    color: rgba(245, 245, 250, 0.95);
}
.molong-room-search::placeholder {
    color: rgba(200, 200, 215, 0.45);
}
.molong-room-search:focus {
    outline: none;
    border-color: rgba(212, 175, 55, 0.45);
    box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.2);
}

/* 房间列表区域：固定高度内滚动 */
.molong-room-list-scroll {
    margin-top: 0.35rem;
    max-height: min(46vh, 20rem);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.18);
}

/* 副本大厅 · 房间列表：可加入 / 已满 */
.molong-room-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.molong-room-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    padding: 0.45rem 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.82rem;
    line-height: 1.35;
}
.molong-room-row:last-child {
    border-bottom: none;
}
.molong-room-badge {
    flex-shrink: 0;
    font-size: 0.62rem;
    padding: 0.1rem 0.42rem;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.molong-room-badge--open {
    background: rgba(40, 140, 90, 0.42);
    color: rgba(210, 255, 225, 0.95);
    border: 1px solid rgba(90, 200, 140, 0.45);
}
.molong-room-badge--full {
    background: rgba(90, 90, 110, 0.4);
    color: rgba(200, 200, 215, 0.88);
    border: 1px solid rgba(140, 140, 160, 0.35);
}
.molong-room-title {
    flex: 1 1 6rem;
    min-width: 0;
    font-weight: 600;
}
.molong-room-meta {
    width: 100%;
    opacity: 0.88;
    font-size: 0.76rem;
}
.molong-room-empty {
    padding: 0.75rem 0.25rem;
    opacity: 0.75;
    font-size: 0.82rem;
}

/* 洞天菜单 · 仙府玉牒（卡片网格） */
.dongtian-hub-menu-sheet {
    max-width: 31rem;
    width: min(31rem, 94vw);
    border: 1px solid rgba(160, 200, 240, 0.2);
    background:
        radial-gradient(ellipse 100% 80% at 50% -30%, rgba(100, 160, 220, 0.14), transparent 55%),
        linear-gradient(168deg, rgba(16, 28, 44, 0.97), rgba(6, 10, 18, 0.99));
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.35),
        0 18px 48px rgba(0, 12, 28, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.dongtian-hub-menu-head .dongtian-hub-menu-eyebrow {
    color: rgba(170, 205, 235, 0.78);
    letter-spacing: 0.22em;
    font-size: 0.72rem;
}
.dongtian-hub-menu-title {
    font-family: "STKaiti", "KaiTi", "SimSun", "Georgia", serif;
    background: linear-gradient(92deg, #f5fbff, #c8e0ff, #9ec8ff, #e8f4ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 24px rgba(120, 180, 255, 0.35);
}
.dongtian-hub-menu-sub {
    color: rgba(190, 210, 235, 0.78) !important;
    font-size: 0.8rem !important;
    line-height: 1.45;
}
/* 避免标题区或下层卡片（position 子层）叠在标签条上，导致仅「副本」「休闲」点不中 */
.dongtian-hub-menu-sheet .dongtian-hub-menu-head {
    position: relative;
    z-index: 1;
}
.dongtian-hub-menu-tabs {
    position: relative;
    z-index: 20;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.35rem 0.25rem 0.5rem;
    margin: 0 -0.15rem;
    border-bottom: 1px solid rgba(100, 140, 190, 0.22);
    background: linear-gradient(180deg, rgba(12, 22, 38, 0.55), transparent);
    pointer-events: auto;
}
.dongtian-hub-menu-tab {
    position: relative;
    z-index: 1;
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 0.45rem 0.35rem;
    border: 1px solid rgba(120, 160, 210, 0.22);
    border-radius: 10px 10px 0 0;
    border-bottom: none;
    background: linear-gradient(180deg, rgba(28, 44, 68, 0.55), rgba(12, 20, 34, 0.75));
    color: rgba(170, 195, 230, 0.82);
    font-family: "STKaiti", "KaiTi", "SimSun", "Microsoft YaHei", sans-serif;
    font-size: 0.88rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition:
        color 0.15s ease,
        background 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}
.dongtian-hub-menu-tab:hover {
    color: rgba(220, 235, 255, 0.95);
    border-color: rgba(160, 200, 240, 0.35);
    background: linear-gradient(180deg, rgba(36, 56, 86, 0.65), rgba(16, 26, 44, 0.85));
}
.dongtian-hub-menu-tab--active {
    color: #f0f6ff;
    border-color: rgba(180, 210, 255, 0.42);
    background: linear-gradient(180deg, rgba(50, 78, 120, 0.75), rgba(20, 34, 56, 0.92));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 -2px 14px rgba(100, 160, 220, 0.25);
    text-shadow: 0 0 12px rgba(140, 190, 255, 0.35);
}
.dongtian-hub-menu-tab:focus-visible {
    outline: 2px solid rgba(160, 210, 255, 0.75);
    outline-offset: 2px;
}
.dongtian-hub-menu-tabpanels {
    position: relative;
    z-index: 0;
    padding-top: 0.15rem;
}
.dongtian-hub-menu-panel {
    display: none;
}
.dongtian-hub-menu-panel--active {
    display: block;
}
.dongtian-hub-menu-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    padding: 0.4rem 0 0.25rem 0;
}
@media (max-width: 420px) {
    .dongtian-hub-menu-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.dongtian-hub-menu-grid--dungeons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}
.dongtian-hub-menu-grid--solo {
    grid-template-columns: minmax(0, 14rem);
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}
.dongtian-hub-menu-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.2rem;
    min-height: 5.4rem;
    padding: 0.55rem 0.35rem 0.45rem;
    margin: 0;
    border-radius: 12px;
    border: 1px solid rgba(120, 160, 200, 0.28);
    background: linear-gradient(155deg, rgba(22, 38, 58, 0.88), rgba(10, 18, 32, 0.95));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 4px 14px rgba(0, 0, 0, 0.35);
    color: rgba(230, 240, 255, 0.95);
    font-family: "STKaiti", "KaiTi", "SimSun", "Microsoft YaHei", sans-serif;
    text-align: center;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease,
        border-color 0.15s ease;
}
.dongtian-hub-menu-card:hover {
    transform: translateY(-2px);
    border-color: rgba(200, 220, 255, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 8px 22px rgba(40, 90, 140, 0.35);
}
.dongtian-hub-menu-card:active {
    transform: translateY(0);
}
.dongtian-hub-menu-card:focus-visible {
    outline: 2px solid rgba(160, 210, 255, 0.75);
    outline-offset: 2px;
}
.dongtian-hub-menu-card__glyph {
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.1;
    color: rgba(200, 225, 255, 0.22);
    text-shadow: 0 0 16px rgba(120, 180, 255, 0.35);
    letter-spacing: 0.02em;
}
.dongtian-hub-menu-card__name {
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.2;
    color: rgba(238, 246, 255, 0.96);
}
.dongtian-hub-menu-card__hint {
    font-size: 0.62rem;
    line-height: 1.25;
    color: rgba(170, 195, 225, 0.72);
    letter-spacing: 0.06em;
}
.dongtian-hub-menu-card--shitu {
    border-color: rgba(230, 190, 120, 0.45);
    background: linear-gradient(155deg, rgba(48, 36, 22, 0.92), rgba(14, 10, 8, 0.96));
    box-shadow:
        inset 0 1px 0 rgba(255, 230, 180, 0.08),
        0 0 20px rgba(200, 150, 60, 0.2);
}
.dongtian-hub-menu-card--shitu .dongtian-hub-menu-card__glyph {
    color: rgba(255, 210, 140, 0.28);
    text-shadow: 0 0 18px rgba(220, 170, 80, 0.4);
}
.dongtian-hub-menu-card--lingtian {
    border-color: rgba(100, 200, 160, 0.35);
    background: linear-gradient(155deg, rgba(18, 42, 36, 0.9), rgba(8, 18, 16, 0.95));
}
.dongtian-hub-menu-card--lingtian .dongtian-hub-menu-card__glyph {
    color: rgba(160, 240, 200, 0.26);
    text-shadow: 0 0 16px rgba(80, 200, 150, 0.35);
}
.dongtian-hub-menu-card--word {
    border-color: rgba(160, 140, 220, 0.35);
    background: linear-gradient(155deg, rgba(32, 24, 48, 0.9), rgba(12, 10, 22, 0.95));
}
.dongtian-hub-menu-card--word .dongtian-hub-menu-card__glyph {
    color: rgba(200, 180, 255, 0.28);
    text-shadow: 0 0 16px rgba(140, 120, 220, 0.35);
}
.dongtian-hub-menu-grid--casual {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 20rem;
    margin-left: auto;
    margin-right: auto;
    gap: 0.6rem;
}
@media (max-width: 360px) {
    .dongtian-hub-menu-grid--casual {
        grid-template-columns: 1fr;
        max-width: 14rem;
    }
}
.dongtian-hub-menu-card--yunyou {
    border-color: rgba(120, 210, 200, 0.42);
    background: linear-gradient(155deg, rgba(12, 36, 40, 0.92), rgba(6, 14, 20, 0.97));
    box-shadow:
        inset 0 1px 0 rgba(180, 255, 250, 0.06),
        0 0 22px rgba(60, 180, 170, 0.22);
}
.dongtian-hub-menu-card--yunyou .dongtian-hub-menu-card__glyph {
    color: rgba(160, 240, 230, 0.3);
    text-shadow: 0 0 18px rgba(80, 200, 190, 0.45);
}
.dongtian-lingtian-sheet {
    max-width: 34rem;
}
.dongtian-lingtian-body {
    max-height: min(78vh, 38rem);
    overflow-y: auto;
}
.lingtian-tabbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.65rem;
}
.lingtian-plot-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
}
.lingtian-plot {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    padding: 0.45rem;
    background: rgba(8, 14, 22, 0.58);
}
.lingtian-plot__head {
    font-size: 0.78rem;
    opacity: 0.86;
}
.lingtian-plot__name {
    margin: 0.3rem 0 0.15rem;
    font-size: 0.86rem;
    font-weight: 600;
}
.lingtian-plot__meta {
    margin: 0;
    font-size: 0.74rem;
    opacity: 0.8;
}
.lingtian-list {
    list-style: none;
    margin: 0.4rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.lingtian-scroll-pane {
    overflow-y: auto;
    padding-right: 0.2rem;
}
.lingtian-scroll-pane--seed {
    max-height: min(32vh, 12.5rem);
}
.lingtian-scroll-pane--codex {
    max-height: min(36vh, 15rem);
}
.lingtian-scroll-pane--herb {
    max-height: min(40vh, 16.5rem);
}
.lingtian-input-modal {
    position: fixed;
    inset: 0;
    z-index: 5210;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    background: rgba(3, 6, 12, 0.68);
}
.lingtian-input-modal__card {
    width: min(92vw, 27rem);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: linear-gradient(180deg, rgba(14, 22, 34, 0.98), rgba(8, 12, 22, 0.98));
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.45);
    padding: 0.8rem;
}
.lingtian-input-modal__title {
    margin: 0 0 0.35rem;
    font-size: 0.92rem;
    font-weight: 600;
}
.lingtian-input-modal__input {
    width: 100%;
    margin-top: 0.4rem;
}
.lingtian-input-modal__actions {
    margin-top: 0.75rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.45rem;
}
.lingtian-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.45rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.03);
}
.lingtian-row > span:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    align-items: center;
    justify-content: flex-end;
    max-width: 100%;
}
.lingtian-row__meta {
    font-size: 0.78rem;
    opacity: 0.82;
}
.lingtian-codex-group-title {
    list-style: none;
    margin: 0.2rem 0 0.1rem;
    padding: 0.2rem 0.1rem;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
    color: rgba(228, 213, 160, 0.92);
}
/* 洞天劫 · 剑灵云游（玄卷分页 · 修仙向） */
.dongtian-sword-spirit-sheet {
    position: relative;
    overflow: hidden;
    max-width: 40rem;
    width: min(40rem, 96vw);
    border: 1px solid rgba(200, 165, 90, 0.35);
    background:
        radial-gradient(ellipse 100% 55% at 50% -15%, rgba(120, 85, 40, 0.18), transparent 50%),
        radial-gradient(ellipse 70% 45% at 100% 100%, rgba(40, 90, 120, 0.16), transparent 48%),
        radial-gradient(ellipse 50% 40% at 0% 80%, rgba(60, 140, 110, 0.1), transparent 45%),
        linear-gradient(172deg, rgba(8, 12, 22, 0.99), rgba(4, 8, 16, 0.995));
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(180, 140, 60, 0.08),
        0 24px 64px rgba(0, 8, 24, 0.65),
        inset 0 1px 0 rgba(255, 230, 180, 0.06);
}
.dt-ss-ambient {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-ambient__mist {
    position: absolute;
    inset: -25% -12%;
    background: radial-gradient(ellipse at 40% 15%, rgba(180, 210, 200, 0.07), transparent 52%);
    opacity: 0.95;
    animation: dt-ss-float 16s ease-in-out infinite;
}
.dt-ss-ambient__glow {
    position: absolute;
    right: -18%;
    top: 5%;
    width: 58%;
    height: 75%;
    background: radial-gradient(circle, rgba(220, 180, 90, 0.1), transparent 62%);
    filter: blur(3px);
    animation: dt-ss-pulse 9s ease-in-out infinite;
}
.dt-ss-ambient__seal {
    position: absolute;
    left: 4%;
    bottom: 6%;
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: clamp(3.8rem, 15vw, 6.2rem);
    font-weight: 700;
    color: rgba(200, 160, 80, 0.055);
    transform: rotate(-11deg);
    letter-spacing: 0.25em;
    text-shadow: 0 0 40px rgba(255, 200, 120, 0.04);
}
.dt-ss-ambient__sigil {
    position: absolute;
    right: 8%;
    top: 42%;
    width: 4.5rem;
    height: 4.5rem;
    border: 1px solid rgba(200, 170, 100, 0.12);
    border-radius: 50%;
    box-shadow:
        inset 0 0 20px rgba(255, 220, 160, 0.04),
        0 0 24px rgba(100, 180, 160, 0.06);
    opacity: 0.65;
    animation: dt-ss-pulse 11s ease-in-out infinite reverse;
}
@keyframes dt-ss-float {
    0%,
    100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(3%, 2%);
    }
}
@keyframes dt-ss-pulse {
    0%,
    100% {
        opacity: 0.55;
    }
    50% {
        opacity: 1;
    }
}
.dongtian-sword-spirit-head,
.dongtian-sword-spirit-body {
    position: relative;
    z-index: 1;
}
.dt-ss-eyebrow {
    color: rgba(220, 195, 140, 0.88) !important;
    letter-spacing: 0.22em !important;
    font-family: "STKaiti", "KaiTi", "SimSun", serif !important;
}
.dt-ss-title {
    font-family: "ZCOOL XiaoWei", "STKaiti", "KaiTi", "SimSun", serif;
    background: linear-gradient(100deg, #fff9e8, #e8c878, #c9a050, #f5ecd8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 0 14px rgba(200, 150, 60, 0.35));
}
.dt-ss-sub {
    color: rgba(195, 210, 200, 0.78) !important;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif !important;
    line-height: 1.55 !important;
}
.dt-ss-head-btn {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.08em;
}
.dongtian-sword-spirit-body {
    max-height: min(84vh, 42rem);
    overflow: hidden;
    overscroll-behavior: contain;
    padding: 0 0.55rem 0.55rem;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.dt-ss-xuan-frame {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    border: 1px solid rgba(160, 130, 70, 0.22);
    background: linear-gradient(180deg, rgba(12, 18, 28, 0.55), rgba(6, 10, 18, 0.72));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.dt-ss-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.15rem;
    padding: 0.35rem 0.35rem 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-bottom: 1px solid rgba(120, 90, 50, 0.35);
    background: linear-gradient(180deg, rgba(20, 16, 12, 0.5), transparent);
}
.dt-ss-tabs::-webkit-scrollbar {
    height: 4px;
}
.dt-ss-tabs::-webkit-scrollbar-thumb {
    background: rgba(180, 150, 90, 0.35);
    border-radius: 4px;
}
.dt-ss-tab {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.42rem 0.65rem 0.5rem;
    margin: 0;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 8px 8px 0 0;
    background: transparent;
    color: rgba(165, 185, 175, 0.72);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    cursor: pointer;
    white-space: nowrap;
    transition:
        color 0.15s,
        background 0.15s,
        border-color 0.15s;
}
.dt-ss-tab:hover {
    color: rgba(230, 220, 200, 0.92);
    background: rgba(80, 60, 30, 0.2);
}
.dt-ss-tab__glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 6px;
    font-size: 0.68rem;
    color: rgba(220, 190, 130, 0.75);
    border: 1px solid rgba(180, 150, 90, 0.28);
    background: rgba(30, 22, 14, 0.45);
}
.dt-ss-tab--active {
    color: rgba(255, 240, 210, 0.96);
    background: linear-gradient(180deg, rgba(60, 45, 25, 0.55), rgba(20, 18, 14, 0.15));
    border-bottom-color: rgba(230, 190, 100, 0.85);
    box-shadow: 0 -1px 12px rgba(200, 160, 80, 0.12);
}
.dt-ss-tab--active .dt-ss-tab__glyph {
    color: rgba(255, 230, 160, 0.95);
    border-color: rgba(230, 190, 120, 0.45);
    background: rgba(50, 38, 18, 0.65);
}
.dt-ss-tab-panels {
    flex: 1;
    min-height: 0;
    position: relative;
}
.dt-ss-tab-panel {
    display: none;
    padding: 0.5rem 0.45rem 0.55rem;
    max-height: min(58vh, 30rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.dt-ss-tab-panel--active {
    display: block;
}
.dt-ss-xuan-card {
    margin: 0;
    padding: 0.85rem 0.9rem 1rem;
    border-radius: 10px;
    border: 1px solid rgba(150, 120, 70, 0.28);
    background:
        linear-gradient(135deg, rgba(28, 32, 48, 0.88), rgba(12, 14, 22, 0.94)),
        radial-gradient(ellipse 80% 50% at 100% 0%, rgba(100, 80, 40, 0.12), transparent 55%);
    box-shadow:
        inset 0 1px 0 rgba(255, 220, 180, 0.05),
        0 8px 28px rgba(0, 0, 0, 0.35);
}
.dt-ss-xuan-verse {
    margin: 0 0 0.65rem;
    padding: 0 0 0.55rem;
    border-bottom: 1px dashed rgba(140, 120, 80, 0.28);
    font-size: 0.78rem;
    font-style: italic;
    color: rgba(200, 175, 130, 0.72);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.12em;
}
.dt-ss-panel--inner {
    margin-bottom: 0.45rem;
    border-color: rgba(110, 140, 130, 0.22);
    background: rgba(4, 10, 16, 0.78);
}
.dt-ss-panel--scroll .dt-ss-log-list {
    max-height: min(48vh, 22rem);
}
.dt-ss-panel--dream-block {
    margin-top: 0.35rem;
}
.dt-ss-jian-hint {
    margin: 0 0 0.4rem;
}
.dt-ss-btn-primary {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.1em;
}
/* 剑灵云游：主操作可点时偏亮，禁用时明显压暗 */
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled) {
    cursor: pointer;
    opacity: 1;
    color: #fffef8;
    border-color: rgba(236, 200, 110, 0.88);
    background: linear-gradient(180deg, rgba(238, 205, 95, 0.58), rgba(200, 155, 55, 0.28));
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.28), inset 0 1px 0 rgba(255, 250, 220, 0.12);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled):hover {
    border-color: rgba(255, 220, 140, 0.95);
    background: linear-gradient(180deg, rgba(250, 218, 120, 0.68), rgba(210, 165, 60, 0.34));
    box-shadow: 0 0 22px rgba(212, 175, 55, 0.42), inset 0 1px 0 rgba(255, 250, 220, 0.16);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled):active {
    transform: scale(0.98);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:disabled {
    cursor: not-allowed;
    opacity: 1;
    color: rgba(120, 118, 108, 0.72);
    border-color: rgba(55, 58, 62, 0.65);
    background: linear-gradient(180deg, rgba(38, 40, 44, 0.72), rgba(22, 24, 28, 0.88));
    box-shadow: none;
    transform: none;
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:disabled:hover {
    color: rgba(120, 118, 108, 0.72);
    border-color: rgba(55, 58, 62, 0.65);
    background: linear-gradient(180deg, rgba(38, 40, 44, 0.72), rgba(22, 24, 28, 0.88));
    box-shadow: none;
}
.dt-ss-btn-ghost {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.08em;
}
.dt-ss-dream-btn {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.06em;
}
.dt-ss-phase {
    margin: 0 0 0.35rem;
    font-size: 0.98rem;
    font-weight: 600;
    color: rgba(255, 242, 220, 0.96);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    text-shadow: 0 0 18px rgba(200, 150, 80, 0.15);
}
.dt-ss-eta {
    margin: 0 0 0.25rem;
    font-size: 0.84rem;
    color: rgba(210, 225, 200, 0.88);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
}
.dt-ss-muted {
    margin: 0.15rem 0 0;
    font-size: 0.78rem;
    color: rgba(175, 190, 180, 0.76);
    line-height: 1.5;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}
@media (max-width: 520px) {
    .dt-ss-columns {
        grid-template-columns: 1fr;
    }
}
.dt-ss-panel {
    border-radius: 11px;
    border: 1px solid rgba(100, 160, 150, 0.2);
    background: rgba(6, 14, 18, 0.72);
    padding: 0.55rem 0.6rem 0.65rem;
    margin-bottom: 0.5rem;
}
.dt-ss-panel-title {
    margin: 0 0 0.45rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: rgba(240, 225, 190, 0.95);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.04em;
}
.dt-ss-panel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(90, 70, 40, 0.45), rgba(40, 55, 50, 0.4));
    border: 1px solid rgba(200, 170, 100, 0.32);
    font-size: 0.72rem;
    color: rgba(255, 230, 180, 0.92);
}
.dt-ss-pack-hint {
    margin: 0 0 0.45rem;
}
.dt-ss-pack-form {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    max-height: min(28vh, 14rem);
    overflow-y: auto;
    padding-right: 0.15rem;
}
.dt-ss-pack-row {
    display: grid;
    grid-template-columns: 1fr 3.2rem minmax(4rem, auto);
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
}
.dt-ss-pack-lbl {
    color: rgba(200, 230, 224, 0.88);
}
.dt-ss-pack-input {
    width: 100%;
    padding: 0.28rem 0.35rem;
    border-radius: 8px;
    border: 1px solid rgba(120, 180, 170, 0.28);
    background: rgba(0, 0, 0, 0.35);
    color: inherit;
    text-align: center;
    font-size: 0.8rem;
}
.dt-ss-pack-cap {
    font-size: 0.68rem;
    color: rgba(150, 185, 180, 0.65);
    white-space: nowrap;
}
.dt-ss-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0.55rem 0 0;
}
.dt-ss-log-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: min(32vh, 16rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.dt-ss-log__empty {
    padding: 0.5rem 0.2rem;
    font-size: 0.78rem;
    color: rgba(160, 190, 185, 0.7);
}
.dt-ss-log__item {
    padding: 0.45rem 0.4rem;
    margin-bottom: 0.35rem;
    border-radius: 9px;
    border: 1px solid rgba(90, 140, 130, 0.2);
    background: linear-gradient(90deg, rgba(20, 44, 42, 0.55), rgba(8, 16, 20, 0.5));
}
.dt-ss-log__time {
    display: block;
    font-size: 0.65rem;
    color: rgba(140, 180, 175, 0.65);
    margin-bottom: 0.2rem;
}
.dt-ss-log__text {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: rgba(220, 245, 238, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-reward-box {
    font-size: 0.82rem;
    line-height: 1.5;
}
.dt-ss-reward-title {
    margin: 0 0 0.25rem;
    font-weight: 600;
    color: rgba(255, 230, 190, 0.88);
}
.dt-ss-reward-body {
    margin: 0;
    color: rgba(200, 230, 220, 0.9);
}
.dt-ss-dream-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.4rem;
}
.dt-ss-dream-effect-hint {
    margin: 0.35rem 0 0.15rem;
    font-size: 0.74rem;
    color: rgba(160, 185, 175, 0.72);
}
.dt-ss-dream-log-wrap {
    margin-top: 0.55rem;
    padding: 0.45rem 0.5rem 0.5rem;
    border-radius: 10px;
    border: 1px solid rgba(120, 100, 160, 0.22);
    background: rgba(8, 10, 22, 0.45);
}
.dt-ss-dream-log-head {
    margin: 0 0 0.35rem;
    font-size: 0.76rem;
    font-weight: 600;
    color: rgba(210, 190, 235, 0.82);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.12em;
}
.dt-ss-dream-msg-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 9.5rem;
    overflow-y: auto;
}
.dt-ss-dream-msg__item {
    margin: 0 0 0.4rem;
    padding: 0 0 0.35rem;
    border-bottom: 1px solid rgba(100, 90, 130, 0.2);
    font-size: 0.76rem;
    line-height: 1.45;
    color: rgba(195, 205, 215, 0.88);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-dream-msg__item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.dt-ss-dream-msg__time {
    display: block;
    font-size: 0.68rem;
    color: rgba(140, 155, 170, 0.75);
    margin-bottom: 0.12rem;
}
.dt-ss-dream-msg__empty {
    margin: 0;
    padding: 0.2rem 0;
    list-style: none;
    font-size: 0.74rem;
}
.dt-ss-panel--cang {
    padding-top: 0.45rem;
}
.dt-ss-subtabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.55rem;
    padding: 0.2rem 0 0.45rem;
    border-bottom: 1px solid rgba(140, 110, 60, 0.28);
}
.dt-ss-subtab {
    flex: 0 0 auto;
    padding: 0.28rem 0.75rem 0.32rem;
    margin: 0;
    border: 1px solid rgba(150, 120, 70, 0.35);
    border-radius: 999px;
    background: rgba(12, 18, 26, 0.65);
    color: rgba(175, 195, 185, 0.78);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 0.76rem;
    letter-spacing: 0.12em;
    cursor: pointer;
    transition:
        color 0.15s,
        border-color 0.15s,
        background 0.15s,
        box-shadow 0.15s;
}
.dt-ss-subtab:hover {
    color: rgba(235, 225, 200, 0.92);
    border-color: rgba(200, 170, 100, 0.45);
    background: rgba(35, 28, 18, 0.55);
}
.dt-ss-subtab--active {
    color: rgba(40, 28, 12, 0.95);
    border-color: rgba(230, 190, 110, 0.65);
    background: linear-gradient(165deg, rgba(255, 230, 170, 0.95), rgba(210, 165, 90, 0.88));
    box-shadow: 0 0 14px rgba(220, 180, 90, 0.22);
}
.dt-ss-subpanel {
    display: none;
    padding-top: 0.15rem;
}
.dt-ss-subpanel--active {
    display: block;
}
.dt-ss-cang-hint {
    margin: 0 0 0.5rem;
}
.dt-ss-curio-count-line {
    margin: 0.5rem 0 0.35rem;
    font-size: 0.86rem;
    font-weight: 600;
    color: rgba(255, 228, 190, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.04em;
}
.dt-ss-curio-bonus-head {
    margin: 0.35rem 0 0.25rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    color: rgba(200, 185, 150, 0.82);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
}
.dt-ss-curio-bonus-bits {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dt-ss-curio-bonus-bits__item {
    margin: 0 0 0.32rem;
    padding: 0.4rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(120, 100, 60, 0.25);
    background: rgba(8, 14, 22, 0.55);
    font-size: 0.8rem;
    color: rgba(220, 235, 225, 0.9);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-bonus-bits__empty {
    margin: 0;
    padding: 0.45rem 0.35rem;
    font-size: 0.78rem;
    color: rgba(165, 185, 175, 0.72);
    line-height: 1.5;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-bonus,
.dt-ss-curio-bonus-line {
    margin: 0 0 0.45rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(255, 215, 160, 0.9);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
    gap: 0.45rem;
}
#dtSsCangPanelTujian .dt-ss-curio-grid {
    max-height: min(46vh, 22rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.15rem;
}
.dt-ss-curio-lore {
    display: block;
    margin-top: 0.38rem;
    font-size: 0.66rem;
    line-height: 1.35;
    color: rgba(165, 185, 175, 0.72);
    font-style: normal;
}

@keyframes dt-ss-curio-liuguang {
    0% {
        transform: translate3d(-130%, 0, 0) skewX(-16deg);
        opacity: 0;
    }
    14% {
        opacity: 0.9;
    }
    86% {
        opacity: 0.9;
    }
    100% {
        transform: translate3d(260%, 0, 0) skewX(-16deg);
        opacity: 0;
    }
}
@keyframes dt-ss-curio-mythic-glow {
    0%,
    100% {
        box-shadow:
            inset 0 0 52px rgba(255, 160, 70, 0.16),
            inset 0 0 88px rgba(120, 80, 190, 0.07),
            0 0 22px rgba(255, 185, 95, 0.34),
            0 0 1px rgba(255, 220, 170, 0.55);
    }
    50% {
        box-shadow:
            inset 0 0 68px rgba(255, 195, 115, 0.26),
            inset 0 0 100px rgba(130, 85, 200, 0.12),
            0 0 38px rgba(255, 210, 135, 0.58),
            0 0 2px rgba(255, 248, 210, 0.9);
    }
}
@keyframes dt-ss-curio-mythic-sheen {
    0% {
        opacity: 0.62;
    }
    100% {
        opacity: 0.96;
    }
}
@media (prefers-reduced-motion: reduce) {
    .dt-ss-curio-card::before,
    .dt-ss-curio-card::after {
        animation: none !important;
        opacity: 0 !important;
    }
    .dt-ss-curio-card--quality-mythic {
        animation: none !important;
    }
}

.dt-ss-curio-card {
    border-radius: 10px;
    padding: 0.4rem 0.45rem;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(145deg, rgba(40, 52, 48, 0.92), rgba(22, 30, 28, 0.95));
    border: 1px solid rgba(180, 210, 190, 0.18);
    font-size: 0.74rem;
    line-height: 1.35;
    color: rgba(215, 235, 225, 0.95);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-card > * {
    position: relative;
    z-index: 1;
}
.dt-ss-curio-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.28rem 0.45rem;
}
.dt-ss-curio-head .dt-ss-curio-quality {
    margin-bottom: 0;
    flex-shrink: 0;
}
.dt-ss-curio-name {
    flex: 1 1 5.5rem;
    min-width: 0;
    font-weight: 600;
    font-size: 0.76rem;
    line-height: 1.35;
    color: rgba(255, 236, 200, 0.96);
    overflow-wrap: anywhere;
    word-break: break-word;
}
.dt-ss-curio-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.22rem 0.35rem;
    margin-top: 0.28rem;
    padding-top: 0.28rem;
    border-top: 1px solid rgba(120, 160, 145, 0.16);
}
.dt-ss-curio-stats--empty {
    margin-top: 0.15rem;
    padding-top: 0;
    border-top: none;
}
.dt-ss-curio-stat {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0.15rem;
    min-width: 0;
}
.dt-ss-curio-stat__k {
    flex: 0 0 auto;
    font-size: 0.65rem;
    color: rgba(165, 205, 188, 0.9);
}
.dt-ss-curio-stat__v {
    flex: 0 1 auto;
    font-size: 0.68rem;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: rgba(205, 238, 218, 0.96);
}
.dt-ss-curio-stat--empty {
    font-size: 0.68rem;
    color: rgba(150, 180, 168, 0.62);
}
@media (max-width: 420px) {
    .dt-ss-curio-stats {
        grid-template-columns: 1fr;
    }
}
.dt-ss-curio-quality {
    display: inline-block;
    font-size: 0.62rem;
    padding: 0.05rem 0.32rem;
    border-radius: 999px;
    margin-bottom: 0.14rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    letter-spacing: 0.02em;
}
.dt-ss-curio-quality--common {
    color: rgba(200, 215, 200, 0.95);
    background: rgba(55, 72, 62, 0.55);
}
.dt-ss-curio-quality--fine {
    color: rgba(165, 210, 255, 0.96);
    border-color: rgba(110, 170, 230, 0.35);
    background: rgba(40, 58, 72, 0.45);
    box-shadow: 0 0 6px rgba(95, 155, 215, 0.14);
}
.dt-ss-curio-quality--rare {
    color: rgba(210, 175, 255, 0.97);
    border-color: rgba(160, 120, 220, 0.4);
    background: rgba(48, 40, 62, 0.42);
    box-shadow: 0 0 8px rgba(180, 130, 255, 0.16);
}
.dt-ss-curio-quality--epic {
    color: rgba(255, 205, 145, 0.97);
    border-color: rgba(230, 150, 70, 0.45);
    background: rgba(62, 44, 28, 0.4);
    box-shadow: 0 0 10px rgba(255, 160, 70, 0.18);
}
.dt-ss-curio-quality--mythic {
    color: rgba(255, 245, 200, 0.98);
    border-color: rgba(255, 210, 120, 0.55);
    background: linear-gradient(135deg, rgba(80, 55, 30, 0.55), rgba(45, 32, 52, 0.55));
    box-shadow: 0 0 12px rgba(255, 190, 90, 0.2);
}

.dt-ss-curio-card--quality-common {
    border-color: rgba(150, 175, 162, 0.26);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}
.dt-ss-curio-card--quality-fine {
    border-color: rgba(115, 175, 225, 0.4);
    background: linear-gradient(152deg, rgba(34, 48, 62, 0.96), rgba(20, 28, 38, 0.98));
    box-shadow: inset 0 0 36px rgba(70, 130, 190, 0.11), 0 0 18px rgba(80, 145, 205, 0.16);
}
.dt-ss-curio-card--quality-fine::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -20%;
    width: 55%;
    height: 200%;
    background: linear-gradient(
        102deg,
        transparent 0%,
        rgba(120, 190, 255, 0) 38%,
        rgba(155, 210, 255, 0.22) 48%,
        rgba(215, 245, 255, 0.4) 50%,
        rgba(155, 210, 255, 0.22) 52%,
        rgba(120, 190, 255, 0) 64%,
        transparent 100%
    );
    transform: translate3d(-120%, 0, 0) skewX(-17deg);
    animation: dt-ss-curio-liuguang 5.8s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-rare {
    border-color: rgba(175, 130, 230, 0.45);
    background: linear-gradient(148deg, rgba(52, 38, 68, 0.96), rgba(24, 18, 36, 0.98));
    box-shadow: inset 0 0 42px rgba(130, 90, 180, 0.13), 0 0 24px rgba(150, 100, 210, 0.24);
}
.dt-ss-curio-card--quality-rare::before {
    content: "";
    position: absolute;
    top: -55%;
    left: -25%;
    width: 58%;
    height: 210%;
    background: linear-gradient(
        102deg,
        transparent 0%,
        rgba(160, 110, 220, 0) 36%,
        rgba(200, 150, 255, 0.24) 47%,
        rgba(240, 220, 255, 0.45) 50%,
        rgba(200, 150, 255, 0.24) 53%,
        rgba(160, 110, 220, 0) 66%,
        transparent 100%
    );
    transform: translate3d(-130%, 0, 0) skewX(-16deg);
    animation: dt-ss-curio-liuguang 4.35s ease-in-out infinite;
    animation-delay: 0.35s;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-epic {
    border-color: rgba(235, 155, 75, 0.5);
    background: linear-gradient(145deg, rgba(68, 44, 28, 0.96), rgba(28, 18, 14, 0.98));
    box-shadow: inset 0 0 46px rgba(255, 130, 55, 0.12), 0 0 28px rgba(220, 125, 55, 0.3);
}
.dt-ss-curio-card--quality-epic::before {
    content: "";
    position: absolute;
    top: -55%;
    left: -22%;
    width: 60%;
    height: 210%;
    background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 170, 80, 0) 34%,
        rgba(255, 200, 120, 0.3) 46%,
        rgba(255, 248, 215, 0.55) 50%,
        rgba(255, 200, 120, 0.3) 54%,
        rgba(255, 170, 80, 0) 66%,
        transparent 100%
    );
    transform: translate3d(-135%, 0, 0) skewX(-15deg);
    animation: dt-ss-curio-liuguang 3.25s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-mythic {
    border-color: rgba(255, 215, 140, 0.58);
    background: linear-gradient(128deg, rgba(72, 48, 28, 0.97), rgba(42, 26, 52, 0.98), rgba(26, 20, 16, 0.99));
    animation: dt-ss-curio-mythic-glow 3s ease-in-out infinite;
}
.dt-ss-curio-card--quality-mythic::before {
    content: "";
    position: absolute;
    top: -60%;
    left: -18%;
    width: 65%;
    height: 220%;
    background: linear-gradient(
        98deg,
        transparent 0%,
        rgba(255, 200, 90, 0) 30%,
        rgba(255, 220, 150, 0.38) 44%,
        rgba(255, 252, 235, 0.68) 50%,
        rgba(190, 225, 255, 0.45) 52%,
        rgba(255, 200, 120, 0.38) 56%,
        rgba(255, 175, 85, 0) 70%,
        transparent 100%
    );
    transform: translate3d(-140%, 0, 0) skewX(-14deg);
    animation: dt-ss-curio-liuguang 2.4s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-mythic::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(120% 90% at 28% 0%, rgba(255, 200, 110, 0.22), transparent 52%),
        radial-gradient(95% 75% at 100% 100%, rgba(160, 115, 255, 0.16), transparent 52%);
    pointer-events: none;
    z-index: 0;
    animation: dt-ss-curio-mythic-sheen 5.5s ease-in-out infinite alternate;
}

.dt-ss-curio-card--quality-epic .dt-ss-curio-name {
    text-shadow: 0 0 14px rgba(255, 180, 90, 0.22);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-name {
    color: rgba(255, 248, 225, 0.99);
    text-shadow: 0 0 18px rgba(255, 195, 110, 0.35), 0 0 42px rgba(200, 140, 255, 0.12);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-stats {
    border-top-color: rgba(255, 200, 130, 0.22);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-stat__v {
    color: rgba(230, 255, 240, 0.98);
}
.dt-ss-curio-card__name {
    font-weight: 600;
    color: rgba(255, 236, 200, 0.95);
    margin-bottom: 0.15rem;
}
.dt-ss-curio-card__bonus {
    font-size: 0.7rem;
    opacity: 0.88;
    color: rgba(190, 230, 210, 0.9);
}
.dt-ss-reward-curio {
    margin: 0.45rem 0 0;
    padding: 0.35rem 0.4rem;
    border-radius: 8px;
    background: rgba(60, 90, 72, 0.28);
    border: 1px solid rgba(200, 220, 180, 0.15);
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(230, 248, 235, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-reward-curio em {
    font-style: normal;
    color: rgba(255, 214, 150, 0.9);
}
.dt-ss-log__item--qiwen .dt-ss-log__text {
    color: rgba(255, 200, 160, 0.95);
    text-shadow: 0 0 12px rgba(255, 140, 80, 0.22);
}
.dongtian-word-guess-sheet {
    max-width: 31rem;
}
.dongtian-word-guess-body {
    max-height: min(78vh, 35rem);
    overflow-y: auto;
}
.word-guess-history-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
}
.word-guess-history-word {
    font-weight: 600;
}
.word-guess-history-score {
    opacity: 0.82;
    font-size: 0.78rem;
}
.word-guess-history-list {
    max-height: min(44vh, 16.5rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.18rem;
}
.word-guess-history-list::-webkit-scrollbar {
    width: 7px;
}
.word-guess-history-list::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(196, 168, 106, 0.45);
}
.dongtian-shitu-sheet {
    max-width: 32rem;
}
.dongtian-shitu-body {
    max-height: min(78vh, 36rem);
    overflow-y: auto;
}
.shitu-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
}
.shitu-pid-input {
    flex: 1 1 8rem;
    min-width: 0;
    max-width: 100%;
    padding: 0.35rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.35);
    color: inherit;
}
.shitu-ul {
    list-style: none;
    margin: 0.35rem 0 0 0;
    padding: 0;
}
.shitu-li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.84rem;
}
.shitu-li--empty {
    opacity: 0.75;
    justify-content: flex-start;
    border-bottom: none;
}
.shitu-actions {
    margin-top: 0.5rem;
}

/* 洞天 · 联网宗门 */
.modal-container--zongmen {
    z-index: 5001;
    padding: 0.35rem;
    isolation: isolate;
    pointer-events: auto;
}
.modal-container--dt-zm-confirm {
    z-index: 12085;
    background: rgba(4, 6, 12, 0.78);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    overscroll-behavior: contain;
    touch-action: manipulation;
}
.dt-zm-confirm-sheet {
    width: min(92vw, 22rem);
    padding: 1rem 1.05rem 0.95rem;
    border-radius: var(--radius);
    border: 1px solid rgba(160, 120, 220, 0.45);
    background:
        radial-gradient(ellipse 100% 80% at 50% -20%, rgba(140, 90, 220, 0.16), transparent 58%),
        linear-gradient(180deg, rgba(32, 22, 48, 0.98), rgba(12, 8, 22, 0.99));
    box-shadow:
        0 0 40px rgba(80, 40, 140, 0.35),
        inset 0 0 60px rgba(20, 10, 40, 0.4);
}
.dt-zm-prompt-sheet .dt-zm-input {
    width: 100%;
    margin-top: 0.35rem;
}
.dt-zm-confirm-head {
    margin-bottom: 0.55rem;
}
.dt-zm-confirm-eyebrow {
    margin: 0 0 0.2rem;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    color: rgba(190, 160, 240, 0.78);
}
.dt-zm-confirm-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: rgba(235, 220, 255, 0.96);
}
.dt-zm-confirm-desc {
    margin: 0 0 0.85rem;
    font-size: 0.8rem;
    line-height: 1.55;
    color: rgba(200, 185, 230, 0.9);
    white-space: pre-wrap;
}
.dt-zm-prompt-err {
    margin: 0.35rem 0 0;
    font-size: 0.74rem;
    color: rgba(255, 160, 160, 0.95);
}
.dt-zm-confirm-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-top: 0.85rem;
}
.dt-zm-confirm-actions .btn {
    min-width: 4.8rem;
}
.dt-zm-confirm-ok--danger {
    background: linear-gradient(180deg, #6b2a4a, #4a1830) !important;
    border-color: rgba(180, 80, 110, 0.65) !important;
    color: #ffe8f0 !important;
}
.dt-zm-confirm-ok--danger:hover {
    background: linear-gradient(180deg, #823458, #5a2040) !important;
}
.dongtian-hub-menu-card--zongmen {
    border-color: rgba(180, 140, 255, 0.48) !important;
    background: linear-gradient(155deg, rgba(36, 22, 56, 0.94), rgba(12, 8, 24, 0.98)) !important;
    box-shadow:
        inset 0 1px 0 rgba(220, 190, 255, 0.08),
        0 0 24px rgba(140, 90, 220, 0.28);
}
.dongtian-hub-menu-card--zongmen .dongtian-hub-menu-card__glyph {
    color: rgba(210, 170, 255, 0.32);
    text-shadow: 0 0 20px rgba(160, 110, 240, 0.5);
}
.dongtian-zongmen-sheet {
    width: min(96vw, 52rem);
    max-width: 52rem;
    max-height: min(92dvh, 46rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(160, 120, 220, 0.38);
    box-shadow:
        0 0 48px rgba(80, 40, 140, 0.35),
        inset 0 0 80px rgba(20, 10, 40, 0.55);
    background:
        radial-gradient(ellipse 100% 70% at 50% -15%, rgba(140, 90, 220, 0.14), transparent 58%),
        linear-gradient(168deg, rgba(18, 12, 32, 0.98), rgba(6, 4, 12, 0.99));
}
.dongtian-zongmen-head {
    flex-shrink: 0;
}
.dongtian-zongmen-head .dongtian-zongmen-eyebrow {
    color: rgba(200, 170, 255, 0.88);
    letter-spacing: 0.24em;
}
.dongtian-zongmen-title {
    font-size: 1.35rem;
    text-shadow: 0 0 24px rgba(160, 110, 240, 0.35);
}
.dongtian-zongmen-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem 1rem;
    flex-shrink: 0;
    margin: 0 1rem 0.75rem;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    border: 1px solid rgba(160, 120, 220, 0.28);
    background: linear-gradient(135deg, rgba(40, 24, 68, 0.55), rgba(12, 8, 24, 0.75));
}
.dongtian-zongmen-hero__badge {
    flex: 0 0 auto;
    width: 4.2rem;
    height: 4.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    padding: 0.2rem;
    border: 2px solid rgba(180, 140, 255, 0.45);
    background: rgba(40, 24, 68, 0.55);
    box-shadow: 0 0 28px rgba(120, 70, 200, 0.35);
}
.dongtian-zongmen-hero__badge .dt-zm-badge__img-wrap {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    background: #ececf0;
}
.dongtian-zongmen-hero__body {
    flex: 1 1 12rem;
    min-width: 0;
}
.dongtian-zongmen-hero__name {
    margin: 0 0 0.2rem;
    font-size: 1.15rem;
    letter-spacing: 0.08em;
}
.dongtian-zongmen-hero__meta,
.dongtian-zongmen-hero__role {
    margin: 0.15rem 0 0;
    font-size: 0.78rem;
    color: rgba(190, 175, 220, 0.82);
}
.dongtian-zongmen-leave {
    margin-left: auto;
}
.dongtian-zongmen-leader-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-left: auto;
}
.dongtian-zongmen-tabs--row {
    flex-wrap: nowrap;
    overflow-x: auto;
    flex-shrink: 0;
    margin: 0 1rem 0.65rem;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
}
.dongtian-zongmen-tabs--row .dongtian-zongmen-tab {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 0.78rem;
    padding: 0.42rem 0.55rem;
}
.dongtian-zongmen-announce {
    margin: 0;
}
.dt-zm-daily-group {
    margin-bottom: 0;
    min-width: 0;
}
.dt-zm-daily-group__title {
    margin: 0 0 0.35rem;
    font-size: 0.82rem;
    color: rgba(210, 190, 255, 0.9);
    letter-spacing: 0.06em;
}
.dt-zm-daily-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dt-zm-daily-li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.35rem 0.5rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.8rem;
}
.dt-zm-daily-li--done {
    opacity: 0.72;
}
.dt-zm-daily-li__label {
    min-width: 0;
    line-height: 1.35;
}
.dt-zm-daily-li__exp {
    color: rgba(180, 255, 210, 0.88);
    font-size: 0.72rem;
    white-space: nowrap;
}
.dt-zm-daily-li__state {
    font-size: 0.72rem;
    color: rgba(170, 165, 195, 0.78);
    white-space: nowrap;
    text-align: right;
}
.dt-zm-daily-li--done .dt-zm-daily-li__state {
    color: rgba(140, 220, 170, 0.9);
}
.dt-zm-announce-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.35rem;
}
.dt-zm-announce-time {
    font-size: 0.68rem;
    color: rgba(170, 160, 200, 0.72);
}
.dt-zm-announce-view {
    margin-top: 0.45rem;
    padding: 0.65rem 0.75rem;
    border-radius: 10px;
    border: 1px solid rgba(160, 120, 220, 0.22);
    background: rgba(0, 0, 0, 0.28);
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
    min-height: 3rem;
}
.dt-zm-announce-view--empty {
    opacity: 0.72;
    font-style: italic;
}
.dt-zm-textarea {
    width: 100%;
    max-width: 100%;
    margin-top: 0.5rem;
    padding: 0.55rem 0.65rem;
    border-radius: 8px;
    border: 1px solid rgba(160, 120, 220, 0.35);
    background: rgba(0, 0, 0, 0.35);
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.45;
    resize: vertical;
    min-height: 4.5rem;
}
.dt-zm-announce-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0.5rem 0 0;
}
.dongtian-zongmen-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 1rem 0.65rem;
    padding: 0.25rem;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.28);
}
.dongtian-zongmen-tab {
    flex: 1 1 auto;
    min-width: 5.5rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: rgba(200, 190, 230, 0.78);
    font-size: 0.82rem;
    cursor: pointer;
}
.dongtian-zongmen-tab.dt-zm-tab--active {
    border-color: rgba(160, 120, 220, 0.45);
    background: rgba(80, 50, 140, 0.45);
    color: rgba(245, 235, 255, 0.96);
}
.dongtian-zongmen-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0 1rem 1rem;
    -webkit-overflow-scrolling: touch;
}
.dongtian-zongmen-panel {
    display: none;
}
.dongtian-zongmen-panel.dt-zm-panel--active {
    display: block;
}
.dongtian-zongmen-panel--daily .dongtian-zongmen-card {
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.dt-zm-daily-groups {
    flex: 1 1 auto;
    min-height: 0;
    margin-top: 0.35rem;
    max-height: min(52vh, 32rem);
    overflow-y: auto;
    padding-right: 0.2rem;
    scrollbar-width: thin;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 0.65rem 1rem;
    align-content: start;
}
@media (max-width: 520px) {
    .dt-zm-daily-groups {
        grid-template-columns: 1fr;
        max-height: min(48vh, 28rem);
    }
}
.dongtian-zongmen-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
@media (max-width: 640px) {
    .dongtian-zongmen-columns {
        grid-template-columns: 1fr;
    }
}
.dongtian-zongmen-card {
    min-height: 8rem;
}
.dt-zm-ul {
    list-style: none;
    margin: 0.45rem 0 0;
    padding: 0;
    max-height: min(42vh, 22rem);
    overflow-y: auto;
}
.dt-zm-ul--sects {
    max-height: min(50vh, 26rem);
}
.dt-zm-li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.84rem;
}
.dt-zm-li--empty {
    opacity: 0.75;
    justify-content: flex-start;
    border-bottom: none;
}
.dt-zm-sect-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
}
.dt-zm-sect-badge {
    flex: 0 0 auto;
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    padding: 0.12rem;
    border: 1px solid rgba(160, 120, 220, 0.4);
    background: rgba(40, 24, 68, 0.55);
}
.dt-zm-sect-badge .dt-zm-badge__img-wrap {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    background: #ececf0;
}
.dt-zm-sect-info {
    flex: 1 1 8rem;
    min-width: 0;
}
.dt-zm-sect-name {
    display: block;
    font-size: 0.92rem;
}
.dt-zm-sect-meta {
    display: block;
    font-size: 0.72rem;
    color: rgba(180, 170, 210, 0.75);
    margin-top: 0.1rem;
}
.dt-zm-member-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
    flex: 1 1 12rem;
    min-width: 0;
}
.dt-zm-roster-host {
    margin-top: 0.35rem;
}
.dt-zm-roster-empty {
    margin: 0.5rem 0 0;
    font-size: 0.82rem;
    color: rgba(170, 165, 195, 0.78);
}
.dt-zm-roster-wrap {
    overflow-x: auto;
    margin-top: 0.15rem;
    -webkit-overflow-scrolling: touch;
}
.dt-zm-roster {
    width: 100%;
    min-width: 40rem;
    border-collapse: collapse;
    font-size: 0.78rem;
}
.dt-zm-roster th,
.dt-zm-roster td {
    padding: 0.42rem 0.45rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    text-align: left;
    vertical-align: middle;
}
.dt-zm-roster th {
    font-size: 0.72rem;
    color: rgba(200, 185, 230, 0.82);
    letter-spacing: 0.04em;
    white-space: nowrap;
    background: rgba(0, 0, 0, 0.18);
    position: sticky;
    top: 0;
    z-index: 1;
}
.dt-zm-roster-row--self {
    background: rgba(80, 50, 140, 0.12);
}
.dt-zm-roster-cell--name {
    font-weight: 600;
    white-space: nowrap;
}
.dt-zm-roster-cell--pid,
.dt-zm-roster-cell--floor,
.dt-zm-roster-cell--progress,
.dt-zm-roster-cell--contrib {
    color: rgba(170, 165, 195, 0.82);
    white-space: nowrap;
}
.dt-zm-roster-cell--realm {
    white-space: nowrap;
    color: rgba(210, 195, 255, 0.9);
}
.dt-zm-roster-cell--online {
    white-space: nowrap;
}
.dt-zm-online {
    color: rgba(120, 230, 160, 0.95);
    font-weight: 600;
}
.dt-zm-roster-cell--actions {
    min-width: 6rem;
}
.dt-zm-roster-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem 0.75rem;
    margin-top: 0.65rem;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.dt-zm-roster-pager--single {
    justify-content: flex-end;
}
.dt-zm-roster-pager__info {
    font-size: 0.72rem;
    color: rgba(170, 165, 195, 0.82);
    white-space: nowrap;
}
.dt-zm-roster-pager .btn[disabled] {
    opacity: 0.45;
    cursor: not-allowed;
}
.dongtian-zongmen-panel--gongfa .dongtian-zongmen-card {
    min-height: 0;
}
.dongtian-zongmen-gongfa {
    background:
        radial-gradient(ellipse 80% 60% at 50% 0%, rgba(120, 80, 200, 0.12), transparent 55%),
        rgba(0, 0, 0, 0.14);
}
.dt-zm-gongfa-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.65rem 1rem;
    margin-bottom: 0.75rem;
}
.dt-zm-gongfa-pool {
    text-align: right;
    padding: 0.45rem 0.75rem;
    border-radius: 10px;
    border: 1px solid rgba(180, 140, 255, 0.35);
    background: linear-gradient(135deg, rgba(50, 30, 90, 0.55), rgba(12, 8, 24, 0.75));
    min-width: 7.5rem;
}
.dt-zm-gongfa-pool__label {
    display: block;
    font-size: 0.68rem;
    color: rgba(190, 175, 220, 0.78);
    letter-spacing: 0.08em;
}
.dt-zm-gongfa-pool__val {
    display: block;
    font-size: 1.15rem;
    color: rgba(255, 220, 140, 0.95);
    font-family: var(--font-xian);
    margin-top: 0.15rem;
}
.dt-zm-gongfa-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr));
    gap: 0.65rem;
    max-height: min(52vh, 32rem);
    overflow-y: auto;
    padding-right: 0.15rem;
}
@media (max-width: 520px) {
    .dt-zm-gongfa-grid {
        grid-template-columns: 1fr;
    }
}
.dt-zm-gongfa-card {
    border-radius: 12px;
    border: 1px solid rgba(160, 120, 220, 0.28);
    background: linear-gradient(155deg, rgba(28, 18, 48, 0.88), rgba(8, 6, 16, 0.92));
    padding: 0.65rem 0.7rem 0.55rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    box-shadow: inset 0 1px 0 rgba(220, 190, 255, 0.06);
}
.dt-zm-gongfa-card__top {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
}
.dt-zm-gongfa-card__glyph {
    flex: 0 0 auto;
    width: 2.35rem;
    height: 2.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.05rem;
    font-weight: 700;
    font-family: var(--font-xian);
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(0, 0, 0, 0.25);
}
.dt-zm-gongfa-card--hp .dt-zm-gongfa-card__glyph { color: #ffb4b4; border-color: rgba(255, 120, 120, 0.45); }
.dt-zm-gongfa-card--atk .dt-zm-gongfa-card__glyph { color: #ffd08a; border-color: rgba(255, 180, 80, 0.45); }
.dt-zm-gongfa-card--def .dt-zm-gongfa-card__glyph { color: #a8d4ff; border-color: rgba(100, 160, 255, 0.45); }
.dt-zm-gongfa-card--critdmg .dt-zm-gongfa-card__glyph { color: #ff9ecf; border-color: rgba(255, 100, 180, 0.45); }
.dt-zm-gongfa-card--vamp .dt-zm-gongfa-card__glyph { color: #c8a0ff; border-color: rgba(160, 100, 255, 0.45); }
.dt-zm-gongfa-card--aspd .dt-zm-gongfa-card__glyph { color: #90f0d0; border-color: rgba(80, 220, 170, 0.45); }
.dt-zm-gongfa-card--crit .dt-zm-gongfa-card__glyph { color: #ffe080; border-color: rgba(255, 220, 80, 0.45); }
.dt-zm-gongfa-card__titles {
    flex: 1 1 auto;
    min-width: 0;
}
.dt-zm-gongfa-card__name {
    margin: 0;
    font-size: 0.88rem;
    letter-spacing: 0.06em;
    color: rgba(245, 235, 255, 0.96);
    font-family: var(--font-xian);
}
.dt-zm-gongfa-card__tag {
    margin: 0.12rem 0 0;
    font-size: 0.68rem;
    color: rgba(170, 165, 195, 0.82);
}
.dt-zm-gongfa-card__lv {
    flex: 0 0 auto;
    font-size: 0.72rem;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(180, 140, 255, 0.35);
    color: rgba(220, 200, 255, 0.92);
    background: rgba(60, 40, 100, 0.45);
}
.dt-zm-gongfa-card__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.35rem 0.25rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.dt-zm-gongfa-stat__k {
    display: block;
    font-size: 0.62rem;
    color: rgba(160, 155, 185, 0.78);
}
.dt-zm-gongfa-stat__v {
    display: block;
    font-size: 0.72rem;
    color: rgba(210, 200, 235, 0.92);
    margin-top: 0.08rem;
}
.dt-zm-gongfa-card__foot {
    margin-top: auto;
    padding-top: 0.15rem;
}
.dt-zm-gongfa-card__foot .btn {
    width: 100%;
    justify-content: center;
}
.dt-zm-gongfa-readonly {
    display: block;
    text-align: center;
    font-size: 0.72rem;
    color: rgba(140, 220, 170, 0.88);
    padding: 0.35rem 0.25rem;
}
.dt-zm-member-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}
.dt-zm-role {
    display: inline-block;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    font-size: 0.68rem;
    letter-spacing: 0.04em;
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.dt-zm-role--leader {
    color: rgba(255, 220, 140, 0.95);
    border-color: rgba(220, 170, 80, 0.45);
    background: rgba(80, 56, 16, 0.45);
}
.dt-zm-role--vice {
    color: rgba(200, 220, 255, 0.95);
    border-color: rgba(100, 150, 220, 0.45);
    background: rgba(20, 40, 80, 0.45);
}
.dt-zm-role--elder {
    color: rgba(180, 255, 210, 0.95);
    border-color: rgba(80, 180, 140, 0.45);
    background: rgba(16, 48, 36, 0.45);
}
.dt-zm-role--disciple {
    color: rgba(210, 200, 230, 0.88);
    border-color: rgba(120, 100, 160, 0.35);
    background: rgba(24, 18, 36, 0.45);
}
.dt-zm-member-name {
    font-weight: 600;
}
.dt-zm-member-pid,
.dt-zm-member-floor {
    font-size: 0.72rem;
    color: rgba(170, 165, 195, 0.78);
}
.dt-zm-create-row {
    margin: 0.5rem 0;
}
.dt-zm-label {
    display: block;
    font-size: 0.78rem;
    color: rgba(190, 175, 220, 0.85);
    margin-bottom: 0.25rem;
}
.dt-zm-input {
    width: 100%;
    max-width: 100%;
    padding: 0.45rem 0.6rem;
    border-radius: 8px;
    border: 1px solid rgba(160, 120, 220, 0.35);
    background: rgba(0, 0, 0, 0.35);
    color: inherit;
    font-size: 0.9rem;
}
.dt-zm-badge-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.45rem;
    margin: 0.35rem 0 0.75rem;
}
@media (max-width: 480px) {
    .dt-zm-badge-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
.dt-zm-badge {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(140, 100, 200, 0.35);
    background: rgba(32, 20, 52, 0.85);
    cursor: pointer;
    padding: 0.25rem;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.dt-zm-badge__img-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    background: #ececf0;
}
.dt-zm-badge__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translateY(-6%);
}
.dt-zm-sect-badge .dt-zm-badge__img {
    transform: translateY(-5px);
}
.dt-zm-badge__fallback {
    font-size: 1.35rem;
    font-weight: 700;
    color: rgba(220, 200, 255, 0.9);
}
.dt-zm-badge__fallback--hero {
    font-size: 1.85rem;
}
.dt-zm-badge--selected {
    border-color: rgba(200, 160, 255, 0.75);
    box-shadow: 0 0 16px rgba(140, 90, 220, 0.45);
    background: rgba(60, 36, 100, 0.75);
}
.dt-zm-create-actions {
    margin-top: 0.65rem;
}

/* 洞天 · 登龙塔（菜单与弹窗） */
.dongtian-hub-menu-card--dragon {
    border-color: rgba(120, 220, 200, 0.48) !important;
    background: linear-gradient(145deg, rgba(16, 52, 44, 0.92), rgba(6, 18, 22, 0.97)) !important;
    box-shadow:
        inset 0 1px 0 rgba(180, 255, 240, 0.06),
        0 0 22px rgba(64, 200, 180, 0.28);
}
.dongtian-hub-menu-card--dragon .dongtian-hub-menu-card__glyph {
    color: rgba(200, 255, 240, 0.3);
    text-shadow: 0 0 20px rgba(100, 220, 190, 0.45);
}
.dongtian-dragon-tower-sheet {
    max-width: 26.5rem;
    border: 1px solid rgba(120, 210, 190, 0.35);
    box-shadow: 0 0 40px rgba(30, 120, 100, 0.35), inset 0 0 60px rgba(10, 40, 36, 0.5);
    background:
        radial-gradient(ellipse 90% 60% at 50% -10%, rgba(120, 230, 200, 0.12), transparent 55%),
        linear-gradient(165deg, rgba(12, 28, 26, 0.97), rgba(4, 10, 14, 0.99));
}
.dongtian-dragon-tower-head .dongtian-dragon-tower-eyebrow {
    color: rgba(160, 230, 210, 0.85);
    letter-spacing: 0.28em;
}
.dongtian-dragon-tower-title {
    background: linear-gradient(90deg, #e8fff8, #7dd3c0, #b8f4e0, #5ec9a8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 28px rgba(80, 200, 170, 0.35);
}
.dongtian-dragon-tower-body {
    max-height: min(82vh, 38rem);
    overflow-y: auto;
    position: relative;
}
.dt-dragon-hero {
    position: relative;
    height: 6.5rem;
    margin: 0 0 0.75rem;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(90, 200, 170, 0.25);
    background: linear-gradient(180deg, rgba(16, 42, 38, 0.95), rgba(6, 14, 18, 0.98));
}
.dt-dragon-hero__glow {
    position: absolute;
    inset: -40%;
    background: conic-gradient(from 120deg, transparent, rgba(80, 220, 190, 0.12), transparent 55%);
    animation: dt-dragon-conic 14s linear infinite;
}
.dt-dragon-hero__pillar {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 3px;
    height: 85%;
    transform: translateX(-50%);
    background: linear-gradient(180deg, rgba(200, 255, 240, 0.9), rgba(60, 160, 140, 0.25), transparent);
    box-shadow: 0 0 12px rgba(120, 240, 210, 0.5);
    animation: dt-dragon-pillar-pulse 2.8s ease-in-out infinite;
}
.dt-dragon-hero__sigil {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -58%);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 2.85rem;
    font-weight: 700;
    color: rgba(200, 255, 240, 0.22);
    text-shadow: 0 0 22px rgba(100, 220, 190, 0.35);
    pointer-events: none;
}
@keyframes dt-dragon-conic {
    to {
        transform: rotate(360deg);
    }
}
@keyframes dt-dragon-pillar-pulse {
    0%,
    100% {
        opacity: 0.75;
        filter: brightness(1);
    }
    50% {
        opacity: 1;
        filter: brightness(1.25);
    }
}
.dt-dragon-card {
    border-color: rgba(100, 190, 170, 0.28) !important;
}
.dt-dragon-rules {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(220, 235, 230, 0.88);
}
.dt-dragon-rules li {
    margin-bottom: 0.35rem;
}
.dt-dragon-actions {
    margin-top: 0.65rem;
    display: flex;
    justify-content: center;
}

/* 斗法 · 龙塔劫主（与秘境主宰紫焰区分：青玉劫轮） */
.combat-card--enemy.combat-card--boss-dragonspire {
    position: relative;
    isolation: isolate;
    border-width: 1px;
    border-color: rgba(100, 220, 200, 0.55);
    background:
        radial-gradient(ellipse 100% 80% at 50% 0%, rgba(80, 200, 180, 0.2) 0%, transparent 50%),
        linear-gradient(160deg, rgba(12, 42, 38, 0.72) 0%, rgba(4, 12, 16, 0.94) 100%);
    box-shadow:
        0 0 0 1px rgba(90, 210, 190, 0.3),
        0 0 32px rgba(40, 180, 160, 0.35),
        inset 0 0 48px rgba(20, 80, 70, 0.2);
    animation: combat-dragonspire-card 3.2s ease-in-out infinite;
}
.combat-card--enemy.combat-card--boss-dragonspire::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: conic-gradient(from 0deg, transparent, rgba(120, 240, 220, 0.18), transparent 40%, transparent 100%);
    animation: combat-dragonspire-ring 5s linear infinite;
    pointer-events: none;
    z-index: 0;
    opacity: 0.85;
}
.combat-card--enemy.combat-card--boss-dragonspire::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
    box-shadow: inset 0 0 0 1px rgba(160, 240, 220, 0.35);
    mix-blend-mode: soft-light;
}
.combat-card--enemy.combat-card--boss-dragonspire .combat-card__row,
.combat-card--enemy.combat-card--boss-dragonspire .combat-bar,
.combat-card--enemy.combat-card--boss-dragonspire .combat-card__dmg {
    position: relative;
    z-index: 2;
}
.combat-card--enemy.combat-card--boss-dragonspire .combat-card__title {
    color: #e8fffb;
    text-shadow: 0 0 14px rgba(100, 220, 200, 0.75), 0 0 32px rgba(40, 160, 140, 0.45);
}
.combat-boss-tag--dragonspire {
    background: linear-gradient(180deg, rgba(160, 255, 235, 0.95), rgba(30, 110, 95, 0.98));
    color: #031a16;
    border: 1px solid rgba(180, 255, 240, 0.55);
    box-shadow: 0 0 16px rgba(80, 200, 180, 0.45);
    animation: combat-dragonspire-tag 2.2s ease-in-out infinite;
}
.combat-avatar--boss-dragonspire {
    border-width: 2px !important;
    border-color: rgba(120, 230, 210, 0.85) !important;
    color: #d8fff8 !important;
    background: radial-gradient(circle at 40% 35%, rgba(100, 220, 200, 0.55), rgba(8, 28, 26, 0.94)) !important;
    box-shadow:
        0 0 0 2px rgba(0, 0, 0, 0.35),
        0 0 28px rgba(60, 200, 180, 0.45),
        0 0 48px rgba(30, 120, 100, 0.25) !important;
    animation: combat-dragonspire-avatar 2.6s ease-in-out infinite;
}
@keyframes combat-dragonspire-card {
    0%,
    100% {
        filter: brightness(1);
    }
    50% {
        filter: brightness(1.06);
    }
}
@keyframes combat-dragonspire-ring {
    to {
        transform: rotate(-360deg);
    }
}
@keyframes combat-dragonspire-tag {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1px);
    }
}
@keyframes combat-dragonspire-avatar {
    0%,
    100% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.35),
            0 0 28px rgba(60, 200, 180, 0.45),
            0 0 48px rgba(30, 120, 100, 0.25);
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.35),
            0 0 36px rgba(100, 240, 210, 0.55),
            0 0 64px rgba(50, 160, 140, 0.35);
    }
}

/* 斗法 · 魔神塔主（血煞裂隙 + 垂向扫描，与秘境主宰紫焰、龙塔青轮均不同） */
.combat-card--enemy.combat-card--boss-demontower {
    position: relative;
    isolation: isolate;
    border-width: 1px;
    border-color: rgba(200, 70, 90, 0.55);
    background:
        linear-gradient(180deg, rgba(80, 10, 28, 0.15) 0%, transparent 40%),
        radial-gradient(ellipse 120% 90% at 50% 100%, rgba(160, 20, 40, 0.35), transparent 55%),
        linear-gradient(155deg, rgba(22, 8, 18, 0.96) 0%, rgba(6, 4, 12, 0.99) 100%);
    box-shadow:
        0 0 0 1px rgba(120, 30, 50, 0.4),
        0 0 36px rgba(100, 20, 40, 0.45),
        inset 0 0 40px rgba(30, 6, 18, 0.55);
    animation: combat-demontower-card 3.5s ease-in-out infinite;
}
.combat-card--enemy.combat-card--boss-demontower::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 3px,
        rgba(255, 120, 100, 0.05) 3px,
        rgba(255, 120, 100, 0.05) 4px
    );
    background-size: 100% 88px;
    animation: combat-demontower-scan 5.5s linear infinite;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: overlay;
    opacity: 0.55;
}
.combat-card--enemy.combat-card--boss-demontower::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: inherit;
    background: radial-gradient(circle at 30% 20%, rgba(255, 200, 160, 0.12), transparent 45%),
        radial-gradient(circle at 80% 80%, rgba(120, 40, 160, 0.15), transparent 40%);
    pointer-events: none;
    z-index: 0;
    animation: combat-demontower-glow 4s ease-in-out infinite alternate;
}
.combat-card--enemy.combat-card--boss-demontower .combat-card__row,
.combat-card--enemy.combat-card--boss-demontower .combat-bar,
.combat-card--enemy.combat-card--boss-demontower .combat-card__dmg {
    position: relative;
    z-index: 2;
}
.combat-card--enemy.combat-card--boss-demontower .combat-card__title {
    color: #ffe8ec;
    text-shadow: 0 0 14px rgba(220, 80, 100, 0.75), 0 0 28px rgba(80, 20, 60, 0.6);
}
.combat-boss-tag--demontower {
    background: linear-gradient(180deg, rgba(255, 200, 190, 0.95), rgba(90, 20, 40, 0.98));
    color: #1a0508;
    border: 1px solid rgba(255, 160, 140, 0.55);
    box-shadow: 0 0 14px rgba(200, 60, 80, 0.5);
    animation: combat-demontower-tag 2.5s ease-in-out infinite;
}
.combat-avatar--boss-demontower {
    border-width: 2px !important;
    border-color: rgba(220, 90, 110, 0.85) !important;
    color: #ffd0d8 !important;
    background: radial-gradient(circle at 35% 30%, rgba(180, 50, 70, 0.55), rgba(20, 6, 14, 0.95)) !important;
    box-shadow:
        0 0 0 2px rgba(0, 0, 0, 0.45),
        0 0 26px rgba(160, 40, 80, 0.5),
        inset 0 0 20px rgba(40, 10, 24, 0.6) !important;
    animation: combat-demontower-avatar 2.8s ease-in-out infinite;
}
@keyframes combat-demontower-card {
    0%,
    100% {
        filter: brightness(1);
    }
    50% {
        filter: brightness(1.05);
    }
}
@keyframes combat-demontower-scan {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 0 88px;
    }
}
@keyframes combat-demontower-glow {
    0% {
        opacity: 0.55;
    }
    100% {
        opacity: 0.95;
    }
}
@keyframes combat-demontower-tag {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-1px);
    }
}
@keyframes combat-demontower-avatar {
    0%,
    100% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.45),
            0 0 26px rgba(160, 40, 80, 0.5),
            inset 0 0 20px rgba(40, 10, 24, 0.6);
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(0, 0, 0, 0.45),
            0 0 34px rgba(220, 70, 100, 0.55),
            inset 0 0 24px rgba(60, 14, 30, 0.65);
    }
}

/* 洞天 · 魔神塔（菜单与弹窗） */
.dongtian-hub-menu-card--demon {
    border-color: rgba(200, 90, 120, 0.52) !important;
    background: linear-gradient(145deg, rgba(52, 14, 30, 0.92), rgba(10, 4, 14, 0.97)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 200, 220, 0.05),
        0 0 22px rgba(160, 40, 80, 0.32);
    color: #f5dfe8;
}
.dongtian-hub-menu-card--demon .dongtian-hub-menu-card__glyph {
    color: rgba(255, 180, 200, 0.32);
    text-shadow: 0 0 18px rgba(200, 60, 100, 0.45);
}
.modal-container--demon-tower {
    z-index: 12050;
}
.dongtian-demon-tower-sheet {
    max-width: 27rem;
    border: 1px solid rgba(180, 70, 100, 0.45);
    box-shadow:
        0 0 48px rgba(60, 12, 32, 0.55),
        inset 0 0 72px rgba(20, 4, 14, 0.65);
    background:
        radial-gradient(ellipse 100% 55% at 50% -5%, rgba(200, 80, 120, 0.18), transparent 50%),
        linear-gradient(168deg, rgba(28, 8, 18, 0.98), rgba(6, 3, 10, 0.99));
}
.dongtian-demon-tower-head .dongtian-demon-tower-eyebrow {
    color: rgba(255, 180, 200, 0.75);
    letter-spacing: 0.22em;
}
.dongtian-demon-tower-title {
    background: linear-gradient(90deg, #fff5f8, #e8a0b8, #c06090, #8a3058);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 26px rgba(180, 60, 100, 0.4);
}
.dongtian-demon-tower-sub {
    color: rgba(230, 200, 215, 0.82) !important;
    font-size: 0.82rem;
    line-height: 1.45;
}
.dongtian-demon-tower-body {
    max-height: min(84vh, 40rem);
    overflow-y: auto;
    position: relative;
}
.dt-demon-hero {
    position: relative;
    height: 7rem;
    margin: 0 0 0.85rem;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(160, 60, 90, 0.4);
    background: radial-gradient(ellipse 80% 100% at 50% 100%, rgba(80, 12, 28, 0.9), rgba(10, 4, 12, 0.98));
}
.dt-demon-hero__mist {
    position: absolute;
    inset: -20%;
    background: radial-gradient(circle at 40% 60%, rgba(200, 60, 100, 0.15), transparent 50%),
        radial-gradient(circle at 70% 30%, rgba(120, 40, 160, 0.12), transparent 45%);
    animation: dt-demon-mist-drift 10s ease-in-out infinite alternate;
}
.dt-demon-hero__spire {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 42%;
    max-width: 8rem;
    height: 92%;
    transform: translateX(-50%);
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(40, 12, 24, 0.95) 18%,
        rgba(120, 36, 56, 0.55) 50%,
        rgba(40, 12, 24, 0.95) 82%,
        transparent 100%
    );
    clip-path: polygon(15% 100%, 20% 18%, 50% 0%, 80% 18%, 85% 100%);
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.5);
    filter: drop-shadow(0 0 12px rgba(200, 60, 90, 0.35));
}
.dt-demon-hero__sigils {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 1.25rem;
    padding-bottom: 0.5rem;
    pointer-events: none;
}
.dt-demon-hero__rune {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 1.65rem;
    font-weight: 700;
    color: rgba(255, 160, 180, 0.35);
    text-shadow: 0 0 18px rgba(200, 60, 100, 0.45);
    animation: dt-demon-rune-float 3.2s ease-in-out infinite;
}
.dt-demon-hero__rune--2 {
    animation-delay: 0.4s;
    color: rgba(200, 160, 255, 0.32);
}
.dt-demon-hero__rune--3 {
    animation-delay: 0.8s;
    color: rgba(255, 200, 140, 0.3);
}
@keyframes dt-demon-mist-drift {
    0% {
        transform: translate(0, 0) scale(1);
    }
    100% {
        transform: translate(-3%, -2%) scale(1.03);
    }
}
@keyframes dt-demon-rune-float {
    0%,
    100% {
        transform: translateY(0);
        opacity: 0.85;
    }
    50% {
        transform: translateY(-4px);
        opacity: 1;
    }
}
.dt-demon-card {
    border-color: rgba(140, 50, 80, 0.35) !important;
    background: rgba(12, 4, 10, 0.35) !important;
}
.dt-demon-card--cta {
    border-color: rgba(180, 70, 100, 0.42) !important;
}
.dt-demon-rules {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.8rem;
    line-height: 1.58;
    color: rgba(235, 210, 220, 0.9);
}
.dt-demon-rules li {
    margin-bottom: 0.4rem;
}
.dt-demon-actions {
    margin-top: 0.65rem;
    display: flex;
    justify-content: center;
}
.dt-demon-challenge {
    min-width: 10rem;
    box-shadow: 0 0 18px rgba(160, 40, 80, 0.35);
}

/* 洞天 · 神界（九霄仙气） */
.dongtian-hub-menu-card--divine {
    border-color: rgba(220, 200, 140, 0.45) !important;
    background: linear-gradient(145deg, rgba(28, 32, 48, 0.94), rgba(12, 16, 28, 0.98)) !important;
    box-shadow:
        0 0 24px rgba(255, 230, 160, 0.12),
        inset 0 0 40px rgba(120, 160, 255, 0.06) !important;
}
.dongtian-hub-menu-card--divine .dongtian-hub-menu-card__glyph {
    color: rgba(255, 240, 200, 0.35);
    text-shadow: 0 0 22px rgba(255, 220, 140, 0.55);
}
.modal-container--divine-realm {
    backdrop-filter: blur(6px);
}
.dongtian-divine-realm-sheet {
    max-width: 27rem;
    border: 1px solid rgba(220, 200, 140, 0.38);
    box-shadow:
        0 0 48px rgba(255, 220, 150, 0.18),
        inset 0 0 70px rgba(80, 120, 220, 0.08);
    background:
        radial-gradient(ellipse 100% 70% at 50% -15%, rgba(255, 240, 200, 0.14), transparent 58%),
        radial-gradient(ellipse 80% 50% at 80% 100%, rgba(140, 180, 255, 0.1), transparent 55%),
        linear-gradient(165deg, rgba(18, 22, 38, 0.97), rgba(6, 8, 18, 0.99));
}
.dongtian-divine-realm-head .dongtian-divine-realm-eyebrow {
    color: rgba(255, 230, 180, 0.88);
    letter-spacing: 0.32em;
}
.dongtian-divine-realm-title {
    background: linear-gradient(90deg, #fff8e8, #ffe4a8, #fff6d0, #e8c878);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 32px rgba(255, 220, 140, 0.35);
}
.dongtian-divine-realm-sub {
    color: rgba(230, 235, 255, 0.78);
}
.dongtian-divine-realm-body {
    max-height: min(82vh, 40rem);
    overflow-y: auto;
}
.dt-divine-hero {
    position: relative;
    height: 7.5rem;
    margin: 0 0 0.85rem;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(220, 200, 140, 0.28);
    background: linear-gradient(180deg, rgba(24, 28, 48, 0.95), rgba(8, 10, 22, 0.98));
}
.dt-divine-hero__aurora {
    position: absolute;
    inset: -50%;
    background: conic-gradient(from 200deg, transparent, rgba(180, 220, 255, 0.14), rgba(255, 230, 180, 0.1), transparent 60%);
    animation: dt-divine-aurora 18s linear infinite;
}
.dt-divine-hero__clouds {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 40% at 20% 80%, rgba(255, 255, 255, 0.08), transparent 55%),
        radial-gradient(ellipse 50% 35% at 75% 70%, rgba(200, 220, 255, 0.1), transparent 50%);
    animation: dt-divine-cloud-drift 12s ease-in-out infinite alternate;
}
.dt-divine-hero__gate {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 5.5rem;
    height: 72%;
    transform: translateX(-50%);
    border: 1px solid rgba(255, 230, 180, 0.25);
    border-bottom: none;
    border-radius: 50% 50% 0 0 / 30% 30% 0 0;
    box-shadow:
        0 0 24px rgba(255, 220, 140, 0.25),
        inset 0 0 30px rgba(180, 210, 255, 0.12);
    animation: dt-divine-gate-glow 3.5s ease-in-out infinite;
}
.dt-divine-hero__petals {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.dt-divine-hero__petals span {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 240, 200, 0.55);
    box-shadow: 0 0 8px rgba(255, 220, 160, 0.6);
    animation: dt-divine-petal-fall 6s linear infinite;
}
.dt-divine-hero__petals span:nth-child(1) { left: 15%; animation-delay: 0s; }
.dt-divine-hero__petals span:nth-child(2) { left: 35%; animation-delay: 1.2s; }
.dt-divine-hero__petals span:nth-child(3) { left: 55%; animation-delay: 2.4s; }
.dt-divine-hero__petals span:nth-child(4) { left: 72%; animation-delay: 0.8s; }
.dt-divine-hero__petals span:nth-child(5) { left: 88%; animation-delay: 3.1s; }
.dt-divine-hero__sigil {
    position: absolute;
    left: 50%;
    top: 42%;
    transform: translate(-50%, -50%);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 2.6rem;
    font-weight: 700;
    color: rgba(255, 245, 220, 0.2);
    text-shadow: 0 0 28px rgba(255, 220, 150, 0.45);
    pointer-events: none;
}
@keyframes dt-divine-aurora {
    to { transform: rotate(360deg); }
}
@keyframes dt-divine-cloud-drift {
    from { transform: translateX(-3%); opacity: 0.75; }
    to { transform: translateX(3%); opacity: 1; }
}
@keyframes dt-divine-gate-glow {
    0%, 100% { opacity: 0.7; filter: brightness(1); }
    50% { opacity: 1; filter: brightness(1.2); }
}
@keyframes dt-divine-petal-fall {
    0% { top: -5%; opacity: 0; transform: scale(0.6); }
    15% { opacity: 1; }
    100% { top: 95%; opacity: 0; transform: scale(1) translateX(12px); }
}
.dt-divine-card {
    border-color: rgba(220, 200, 140, 0.25) !important;
}
.dt-divine-rules {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(235, 240, 255, 0.88);
}
.dt-divine-rules li { margin-bottom: 0.35rem; }
.dt-divine-actions {
    margin-top: 0.65rem;
    display: flex;
    justify-content: center;
}
.dt-divine-challenge {
    min-width: 11rem;
    box-shadow: 0 0 22px rgba(255, 220, 140, 0.28);
}

/* 斗法 · 神界守仙（金白仙光，区别于魔神塔暗煞） */
.combat-card--enemy.combat-card--boss-divinerealm {
    position: relative;
    isolation: isolate;
    border-width: 1px;
    border-color: rgba(255, 230, 180, 0.55);
    background:
        radial-gradient(ellipse 110% 90% at 50% -10%, rgba(255, 240, 200, 0.22) 0%, transparent 52%),
        radial-gradient(ellipse 70% 60% at 100% 100%, rgba(160, 200, 255, 0.12) 0%, transparent 50%),
        linear-gradient(165deg, rgba(28, 32, 52, 0.75) 0%, rgba(8, 10, 22, 0.94) 100%);
    box-shadow:
        0 0 0 1px rgba(255, 230, 180, 0.25),
        0 0 36px rgba(255, 220, 150, 0.28),
        inset 0 0 52px rgba(140, 180, 255, 0.12);
    animation: combat-divinerealm-card 4.2s ease-in-out infinite;
}
.combat-card--enemy.combat-card--boss-divinerealm::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(
        115deg,
        transparent 0%,
        rgba(255, 255, 255, 0.06) 35%,
        rgba(255, 230, 180, 0.18) 50%,
        rgba(180, 210, 255, 0.1) 65%,
        transparent 100%
    );
    background-size: 220% 100%;
    animation: combat-divinerealm-shimmer 5s linear infinite;
    pointer-events: none;
    z-index: 0;
    mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    padding: 1px;
}
.combat-card--enemy.combat-card--boss-divinerealm::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at 50% 0%, rgba(255, 245, 220, 0.12), transparent 55%);
    animation: combat-divinerealm-breathe 3.8s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}
.combat-card--enemy.combat-card--boss-divinerealm .combat-card__row,
.combat-card--enemy.combat-card--boss-divinerealm .combat-bar,
.combat-card--enemy.combat-card--boss-divinerealm .combat-card__dmg {
    position: relative;
    z-index: 1;
}
.combat-card--enemy.combat-card--boss-divinerealm .combat-card__title {
    text-shadow: 0 0 12px rgba(255, 230, 180, 0.35);
}
.combat-boss-tag--divinerealm {
    color: #ffe8b0;
    border-color: rgba(255, 230, 180, 0.45);
    background: rgba(255, 240, 200, 0.08);
    animation: combat-divinerealm-tag 2.8s ease-in-out infinite;
}
.combat-boss-aura--divinerealm {
    position: absolute;
    inset: -18%;
    border-radius: 50%;
    background: conic-gradient(from 0deg, transparent, rgba(255, 230, 180, 0.2), rgba(180, 210, 255, 0.15), transparent 70%);
    animation: combat-divinerealm-aura 6s linear infinite;
    pointer-events: none;
}
.combat-avatar--boss-divinerealm {
    box-shadow:
        0 0 20px rgba(255, 230, 180, 0.35),
        inset 0 0 16px rgba(180, 210, 255, 0.15);
    animation: combat-divinerealm-avatar 3.2s ease-in-out infinite;
}
.combat-boss-icon--divinerealm {
    color: #ffe8b0;
    filter: drop-shadow(0 0 8px rgba(255, 220, 150, 0.65));
}
@keyframes combat-divinerealm-card {
    0%, 100% { box-shadow: 0 0 0 1px rgba(255, 230, 180, 0.22), 0 0 28px rgba(255, 220, 150, 0.22), inset 0 0 48px rgba(140, 180, 255, 0.1); }
    50% { box-shadow: 0 0 0 1px rgba(255, 240, 200, 0.35), 0 0 42px rgba(255, 230, 180, 0.38), inset 0 0 60px rgba(160, 200, 255, 0.16); }
}
@keyframes combat-divinerealm-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
@keyframes combat-divinerealm-breathe {
    from { opacity: 0.55; }
    to { opacity: 1; }
}
@keyframes combat-divinerealm-tag {
    0%, 100% { opacity: 0.85; }
    50% { opacity: 1; text-shadow: 0 0 10px rgba(255, 230, 180, 0.5); }
}
@keyframes combat-divinerealm-aura {
    to { transform: rotate(360deg); }
}
@keyframes combat-divinerealm-avatar {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}

/* 洞天 · 炼丹阁（玉虚正派风） */
.dongtian-hub-menu-card--alchemy {
    border-color: rgba(120, 200, 160, 0.48) !important;
    background: linear-gradient(145deg, rgba(12, 42, 36, 0.92), rgba(6, 16, 22, 0.97)) !important;
    box-shadow:
        inset 0 1px 0 rgba(200, 255, 230, 0.06),
        0 0 22px rgba(60, 180, 140, 0.28);
    color: #e8f5ef;
}
.dongtian-hub-menu-card--alchemy .dongtian-hub-menu-card__glyph {
    color: rgba(180, 255, 220, 0.3);
    text-shadow: 0 0 18px rgba(80, 200, 150, 0.4);
}
.modal-container--alchemy {
    z-index: 12052;
}
.modal-container--pet-pills {
    z-index: 12060;
}
.dongtian-alchemy-sheet {
    max-width: 36rem;
    width: min(100%, 36rem);
    border: 1px solid rgba(100, 200, 160, 0.38);
    box-shadow:
        0 0 40px rgba(20, 80, 70, 0.45),
        inset 0 0 60px rgba(10, 40, 36, 0.35);
    background:
        radial-gradient(ellipse 90% 50% at 50% -10%, rgba(120, 220, 180, 0.12), transparent 55%),
        linear-gradient(168deg, rgba(10, 28, 26, 0.98), rgba(4, 10, 18, 0.99));
}
.dongtian-alchemy-head .dongtian-alchemy-eyebrow {
    color: rgba(160, 230, 200, 0.8);
    letter-spacing: 0.18em;
}
.dongtian-alchemy-title {
    background: linear-gradient(90deg, #f0fff8, #8fd4b8, #3a9d7a, #1a5c48);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 20px rgba(80, 200, 150, 0.25);
}
.dongtian-alchemy-sub {
    color: rgba(200, 230, 215, 0.88) !important;
    font-size: 0.82rem;
    line-height: 1.5;
}
.dongtian-alchemy-body {
    max-height: min(86vh, 46rem);
    overflow-y: auto;
    padding-bottom: 0.5rem;
}

/* 洞天 · 神锻阁（六星连珠 / 星轨锻锋，与炼丹阁玉虚风区分） */
.dongtian-hub-menu-card--forge {
    border-color: rgba(220, 160, 80, 0.52) !important;
    background: linear-gradient(145deg, rgba(44, 14, 8, 0.94), rgba(8, 6, 20, 0.97)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 220, 160, 0.07),
        0 0 24px rgba(255, 140, 40, 0.32),
        inset 0 0 18px rgba(60, 20, 10, 0.3);
    color: #ffe8c8;
}
.dongtian-hub-menu-card--forge .dongtian-hub-menu-card__glyph {
    color: rgba(255, 200, 120, 0.32);
    text-shadow: 0 0 18px rgba(255, 140, 60, 0.45);
}
.modal-container--forge {
    z-index: 12053;
}
.dongtian-forge-sheet {
    max-width: 28rem;
    width: min(100%, 28rem);
    border: 1px solid rgba(255, 160, 80, 0.42);
    box-shadow:
        0 0 48px rgba(120, 40, 10, 0.55),
        inset 0 0 80px rgba(30, 8, 4, 0.45);
    background:
        radial-gradient(ellipse 70% 45% at 50% 0%, rgba(255, 120, 40, 0.18), transparent 55%),
        radial-gradient(ellipse 50% 40% at 80% 100%, rgba(180, 60, 200, 0.08), transparent 50%),
        linear-gradient(168deg, rgba(22, 8, 6, 0.99), rgba(6, 4, 14, 0.99));
}
.dongtian-forge-head .dongtian-forge-eyebrow {
    color: rgba(255, 200, 140, 0.85);
    letter-spacing: 0.14em;
}
.dongtian-forge-title {
    background: linear-gradient(92deg, #fff8e8, #ffb060, #c85a20, #5a2010);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 0 12px rgba(255, 120, 40, 0.35));
}
.dongtian-forge-sub {
    color: rgba(255, 210, 180, 0.88) !important;
    font-size: 0.8rem;
    line-height: 1.45;
}
.dongtian-forge-body {
    max-height: min(88vh, 48rem);
    overflow-y: auto;
    padding-bottom: 0.6rem;
    /* 子块内若全是 absolute，flex 子项高度会为 0；勿压缩星轨区 */
    min-height: 0;
}
.dongtian-forge-body .dt-forge-intro,
.dongtian-forge-body .dt-forge-panel,
.dongtian-forge-body .dt-forge-actions {
    flex-shrink: 0;
}
.dt-forge-intro {
    font-size: 0.78rem;
    line-height: 1.55;
    color: rgba(255, 220, 190, 0.82);
    margin-bottom: 0.5rem;
    padding: 0.5rem 0.35rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 140, 60, 0.2);
    background: rgba(0, 0, 0, 0.25);
}
/* 神锻主区：文档流 + Grid，避免 absolute/三角函数在部分内核下整块不渲染 */
.dt-forge-panel {
    position: relative;
    width: 100%;
    max-width: 22rem;
    margin: 0.35rem auto 0.5rem;
    padding: 0.65rem 0.5rem 0.75rem;
    border-radius: 14px;
    border: 1px solid rgba(255, 160, 90, 0.35);
    background: linear-gradient(165deg, rgba(28, 10, 8, 0.92), rgba(8, 6, 18, 0.96));
    box-shadow: inset 0 0 28px rgba(0, 0, 0, 0.35);
    overflow: visible;
}
.dt-forge-hex-bg {
    position: absolute;
    left: 50%;
    top: 42%;
    width: 92%;
    max-width: 17rem;
    height: auto;
    transform: translate(-50%, -50%);
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
    animation: dt-forge-hex-pulse 5.5s ease-in-out infinite;
}
@keyframes dt-forge-hex-pulse {
    0%,
    100% {
        opacity: 0.45;
        filter: drop-shadow(0 0 4px rgba(255, 160, 80, 0.2));
    }
    50% {
        opacity: 0.65;
        filter: drop-shadow(0 0 10px rgba(255, 200, 120, 0.35));
    }
}
.dt-forge-stats-row {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.4rem;
    margin-bottom: 0.45rem;
}
.dt-forge-stat {
    text-align: center;
    padding: 0.35rem 0.2rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 140, 80, 0.28);
    background: rgba(0, 0, 0, 0.35);
}
.dt-forge-stat--free {
    border-color: rgba(120, 255, 180, 0.35);
    box-shadow: 0 0 12px rgba(80, 200, 120, 0.12);
}
.dt-forge-stat__k {
    display: block;
    font-size: 0.62rem;
    color: rgba(255, 200, 170, 0.75);
    letter-spacing: 0.06em;
    margin-bottom: 0.12rem;
}
.dt-forge-stat__v {
    display: block;
    font-size: 1.35rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #ffd89a;
    line-height: 1.15;
    text-shadow: 0 0 12px rgba(255, 140, 40, 0.35);
}
.dt-forge-stat__d {
    display: block;
    font-size: 0.58rem;
    color: rgba(200, 170, 150, 0.65);
    margin-top: 0.08rem;
}
.dt-forge-tower-line {
    position: relative;
    z-index: 1;
    margin: 0 0 0.5rem;
    text-align: center;
    font-size: 0.72rem;
    color: rgba(255, 210, 190, 0.82);
}
.dt-forge-star-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.45rem;
}
@media (max-width: 360px) {
    .dt-forge-star-grid {
        grid-template-columns: 1fr 1fr;
    }
}
.dt-forge-slot-btn {
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.12rem;
    min-height: 4.1rem;
    padding: 0.4rem 0.3rem !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 160, 90, 0.5) !important;
    background: linear-gradient(168deg, rgba(55, 20, 14, 0.98), rgba(14, 8, 24, 0.99)) !important;
    color: #ffe8d8 !important;
    font-family: inherit;
    line-height: 1.25;
    box-shadow:
        0 0 14px rgba(255, 100, 40, 0.18),
        inset 0 1px 0 rgba(255, 200, 160, 0.1);
    -webkit-tap-highlight-color: rgba(255, 180, 100, 0.15);
}
.dt-forge-slot-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.dt-forge-slot-btn:not(:disabled):active {
    transform: scale(0.98);
}
.dt-forge-slot__star {
    font-size: 0.75rem;
    color: #ffc46e;
    text-shadow: 0 0 10px rgba(255, 160, 60, 0.9);
    line-height: 1;
}
.dt-forge-slot__lbl {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.dt-forge-slot__pts {
    font-size: 0.62rem;
    color: rgba(200, 255, 210, 0.88);
    text-align: center;
}
.dt-forge-actions {
    text-align: center;
    margin-top: 0.35rem;
}
.dt-forge-reset-btn {
    border-color: rgba(255, 140, 100, 0.4) !important;
    color: rgba(255, 210, 190, 0.95) !important;
}

/* 洞天劫 · 御器 */
.dongtian-hub-menu-card--yuqi {
    border-color: rgba(160, 230, 200, 0.45) !important;
    background: linear-gradient(155deg, rgba(12, 42, 38, 0.92), rgba(8, 22, 32, 0.97)) !important;
    box-shadow:
        inset 0 1px 0 rgba(200, 255, 230, 0.07),
        0 0 22px rgba(60, 200, 160, 0.22);
}
.dongtian-hub-menu-card--yuqi .dongtian-hub-menu-card__glyph {
    color: rgba(140, 220, 190, 0.35);
    text-shadow: 0 0 20px rgba(80, 200, 160, 0.45);
}
.modal-container--yuqi .dongtian-yuqi-sheet {
    max-width: 56rem;
    width: 96vw;
    border: 1px solid rgba(120, 210, 180, 0.28);
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.35),
        0 18px 48px rgba(0, 20, 24, 0.65);
    background: linear-gradient(180deg, rgba(14, 36, 34, 0.98), rgba(6, 16, 22, 0.99));
}
.dongtian-yuqi-head .dongtian-yuqi-eyebrow {
    color: rgba(160, 230, 200, 0.85);
    letter-spacing: 0.12em;
}
.dongtian-yuqi-title {
    text-shadow: 0 0 24px rgba(80, 200, 160, 0.35);
}
.dongtian-yuqi-sub {
    color: rgba(190, 220, 210, 0.78);
}
.dongtian-yuqi-body {
    max-height: min(78vh, 44rem);
    overflow: auto;
    padding-bottom: 0.5rem;
}
.dt-yuqi-hero {
    position: relative;
    height: 4.5rem;
    margin: 0 0 0.75rem;
    border-radius: 0.5rem;
    overflow: hidden;
    background: radial-gradient(ellipse 120% 80% at 50% 100%, rgba(40, 120, 100, 0.35), transparent 55%),
        linear-gradient(105deg, rgba(8, 28, 26, 0.95), rgba(12, 22, 36, 0.92));
    border: 1px solid rgba(100, 200, 170, 0.2);
}
.dt-yuqi-hero__moon {
    position: absolute;
    right: 8%;
    top: 18%;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, rgba(255, 250, 220, 0.95), rgba(200, 220, 200, 0.15) 55%, transparent 70%);
    box-shadow: 0 0 28px rgba(200, 240, 220, 0.25);
    opacity: 0.85;
}
.dt-yuqi-hero__mist {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(80, 180, 160, 0.08), transparent);
    animation: dt-yuqi-mist 14s ease-in-out infinite;
}
@keyframes dt-yuqi-mist {
    0%,
    100% {
        transform: translateX(-6%);
        opacity: 0.5;
    }
    50% {
        transform: translateX(6%);
        opacity: 0.85;
    }
}
.dt-yuqi-hero__sigil {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -52%);
    font-size: 2.1rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    color: rgba(200, 255, 230, 0.12);
    text-shadow: 0 0 30px rgba(100, 220, 180, 0.35);
    font-family: "Times New Roman", "Songti SC", serif;
}
.dt-yuqi-lead {
    font-size: 0.82rem;
    color: rgba(200, 225, 215, 0.88);
    line-height: 1.55;
    margin: 0 0 0.85rem;
    padding: 0 0.15rem;
}
.dt-yuqi-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
}
.dt-yuqi-tab {
    border: 1px solid rgba(120, 200, 170, 0.35);
    background: rgba(8, 28, 26, 0.65);
    color: rgba(200, 230, 215, 0.9);
    font-size: 0.72rem;
    padding: 0.28rem 0.55rem;
    border-radius: 999px;
    cursor: pointer;
}
.dt-yuqi-tab--active {
    background: linear-gradient(135deg, rgba(60, 160, 130, 0.45), rgba(30, 90, 80, 0.75));
    border-color: rgba(180, 255, 220, 0.55);
    color: #f5fffb;
    box-shadow: 0 0 12px rgba(80, 200, 160, 0.25);
}
.dt-yuqi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
    gap: 0.65rem;
}
.dt-yuqi-card {
    position: relative;
    padding: 0.55rem 0.6rem 0.6rem;
    border-radius: 0.45rem;
    border: 1px solid rgba(100, 180, 150, 0.28);
    background: linear-gradient(165deg, rgba(16, 42, 38, 0.92), rgba(6, 18, 24, 0.96));
    box-shadow: inset 0 1px 0 rgba(200, 255, 230, 0.04);
    text-align: left;
}
.dt-yuqi-card__ribbon {
    position: absolute;
    top: 0;
    right: 0;
    width: 2.2rem;
    height: 2.2rem;
    background: linear-gradient(225deg, rgba(255, 210, 140, 0.12), transparent 60%);
    pointer-events: none;
}
.dt-yuqi-card__head {
    margin-bottom: 0.35rem;
}
.dt-yuqi-card__tier {
    display: inline-block;
    font-size: 0.62rem;
    padding: 0.08rem 0.35rem;
    border-radius: 0.25rem;
    margin-bottom: 0.2rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.dt-yuqi-card__name {
    margin: 0;
    font-size: 0.95rem;
    color: #e8fff6;
    letter-spacing: 0.04em;
}
.dt-yuqi-card__attr {
    margin: 0.15rem 0 0;
    font-size: 0.65rem;
    color: rgba(180, 210, 200, 0.75);
    line-height: 1.35;
}
.dt-yuqi-card__lv {
    font-size: 0.72rem;
    color: rgba(210, 235, 225, 0.9);
    margin-bottom: 0.2rem;
}
.dt-yuqi-card__bar {
    height: 0.28rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.35);
    overflow: hidden;
    margin-bottom: 0.35rem;
}
.dt-yuqi-card__bar > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(80, 180, 140, 0.85), rgba(200, 240, 200, 0.55));
    box-shadow: 0 0 8px rgba(120, 220, 180, 0.4);
}
.dt-yuqi-card__bonus {
    margin: 0 0 0.25rem;
    font-size: 0.68rem;
    color: rgba(220, 245, 230, 0.92);
}
.dt-yuqi-card__shards {
    margin: 0 0 0.45rem;
    font-size: 0.66rem;
    color: rgba(180, 210, 200, 0.82);
}
.dt-yuqi-up-btn {
    width: 100%;
}
.dt-yuqi-odds {
    margin-top: 1rem;
    padding: 0.55rem 0.65rem;
    border-radius: 0.4rem;
    border: 1px dashed rgba(120, 200, 170, 0.35);
    background: rgba(4, 18, 22, 0.55);
}
.dt-yuqi-odds__h {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    color: rgba(200, 240, 220, 0.95);
}
.dt-yuqi-odds__p {
    margin: 0;
    font-size: 0.68rem;
    color: rgba(180, 210, 200, 0.85);
    line-height: 1.5;
}
.inv-mat-card--yuqi-pack {
    border-color: rgba(100, 200, 160, 0.35) !important;
}

/* 洞天劫 · 灵根血脉 */
.dongtian-hub-menu-card--lgxm {
    border-color: rgba(120, 200, 255, 0.42) !important;
    background: linear-gradient(145deg, rgba(20, 44, 72, 0.9), rgba(10, 22, 42, 0.96)) !important;
    box-shadow:
        inset 0 1px 0 rgba(200, 230, 255, 0.06),
        0 0 20px rgba(80, 160, 220, 0.25);
}
.dongtian-hub-menu-card--lgxm .dongtian-hub-menu-card__glyph {
    color: rgba(180, 220, 255, 0.3);
    text-shadow: 0 0 18px rgba(100, 180, 240, 0.4);
}
.modal-container--lgxm .dongtian-lgxm-sheet {
    max-width: 52rem;
    width: 96vw;
    border: 1px solid rgba(180, 220, 255, 0.22);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35), 0 18px 48px rgba(0, 20, 40, 0.65),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    background: linear-gradient(165deg, rgba(18, 32, 52, 0.97), rgba(8, 14, 26, 0.99));
}
.dongtian-lgxm-head .dongtian-lgxm-eyebrow {
    color: rgba(160, 210, 255, 0.85);
    letter-spacing: 0.12em;
}
.dongtian-lgxm-title {
    font-family: "Georgia", "Times New Roman", serif;
    text-shadow: 0 0 24px rgba(100, 180, 255, 0.35);
}
.dongtian-lgxm-sub {
    color: rgba(200, 220, 240, 0.75);
    font-size: 0.82rem;
}
.dongtian-lgxm-body {
    max-height: min(78vh, 42rem);
    overflow: auto;
    padding-bottom: 1rem;
}
.dt-lgxm-hero {
    position: relative;
    height: 5.5rem;
    margin: 0 0 0.85rem;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(100, 160, 220, 0.3);
    background: radial-gradient(ellipse 80% 120% at 50% -20%, rgba(80, 140, 220, 0.25), transparent 55%),
        linear-gradient(180deg, rgba(15, 35, 60, 0.9), rgba(5, 10, 22, 0.95));
}
.dt-lgxm-hero__mist {
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        90deg,
        transparent,
        transparent 12px,
        rgba(120, 180, 255, 0.03) 12px,
        rgba(120, 180, 255, 0.03) 14px
    );
    animation: dt-lgxm-mist 20s linear infinite;
}
@keyframes dt-lgxm-mist {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-40px);
    }
}
.dt-lgxm-hero__sigil {
    position: absolute;
    left: 38%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.4rem;
    font-weight: 700;
    color: rgba(200, 230, 255, 0.12);
    text-shadow: 0 0 20px rgba(100, 180, 255, 0.4);
    font-family: "Georgia", "SimSun", serif;
}
.dt-lgxm-hero__sigil--2 {
    left: 62%;
    color: rgba(255, 200, 160, 0.1);
    text-shadow: 0 0 20px rgba(255, 160, 120, 0.35);
}
.dt-lgxm-coin-line {
    font-size: 0.88rem;
    color: rgba(200, 215, 235, 0.88);
    margin: 0 0 0.75rem;
}
.dt-lgxm-section {
    margin-bottom: 1rem;
}
.dt-lgxm-section--cards {
    margin-bottom: 0.5rem;
}
.dt-lgxm-h4 {
    margin: 0 0 0.45rem;
    font-size: 0.95rem;
    color: rgba(180, 220, 255, 0.95);
    border-left: 3px solid rgba(120, 190, 255, 0.55);
    padding-left: 0.5rem;
}
.dt-lgxm-formula {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.55;
    color: rgba(180, 200, 220, 0.82);
    background: rgba(0, 30, 50, 0.35);
    border-radius: 8px;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(80, 140, 180, 0.25);
}
.dt-lgxm-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}
@media (max-width: 640px) {
    .dt-lgxm-cards {
        grid-template-columns: 1fr;
    }
}
.dt-lgxm-card {
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(120, 180, 220, 0.28);
    background: linear-gradient(145deg, rgba(25, 50, 80, 0.55), rgba(10, 22, 40, 0.9));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.dt-lgxm-card--empty {
    border-style: dashed;
    opacity: 0.85;
}
.dt-lgxm-card__eyebrow {
    margin: 0 0 0.25rem;
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    color: rgba(160, 200, 240, 0.65);
    text-transform: uppercase;
}
.dt-lgxm-card__tier {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    color: rgba(255, 210, 140, 0.9);
}
.dt-lgxm-card__name {
    margin: 0 0 0.35rem;
    font-size: 1.05rem;
    color: rgba(230, 245, 255, 0.98);
}
.dt-lgxm-card__attr {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(160, 220, 200, 0.92);
}
.dt-lgxm-card__desc {
    margin: 0;
    font-size: 0.74rem;
    line-height: 1.45;
    color: rgba(170, 185, 205, 0.78);
}
.dt-lgxm-card__empty {
    margin: 0.25rem 0 0;
    font-size: 0.8rem;
    color: rgba(150, 170, 190, 0.65);
}
.dt-lgxm-odds {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.65rem;
}
.dt-lgxm-odds-chip {
    display: inline-block;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    font-size: 0.72rem;
    background: rgba(30, 55, 85, 0.65);
    border: 1px solid rgba(100, 160, 210, 0.3);
    color: rgba(200, 220, 240, 0.88);
}
.dt-lgxm-odds-chip em {
    font-style: normal;
    color: rgba(255, 220, 160, 0.95);
    margin-left: 0.15rem;
}
.dt-lgxm-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    margin: 0.35rem 0 0;
}
.dt-lgxm-open-btn {
    min-width: 11rem;
}
.dt-lgxm-table-wrap {
    max-height: 16rem;
    overflow: auto;
    border-radius: 8px;
    border: 1px solid rgba(80, 130, 170, 0.35);
    background: rgba(0, 12, 24, 0.45);
}
.dt-lgxm-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.72rem;
}
.dt-lgxm-table th,
.dt-lgxm-table td {
    padding: 0.35rem 0.45rem;
    text-align: left;
    border-bottom: 1px solid rgba(60, 100, 130, 0.35);
    vertical-align: top;
}
.dt-lgxm-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: rgba(15, 40, 65, 0.98);
    color: rgba(190, 220, 255, 0.95);
    font-weight: 600;
}
.dt-lgxm-table tbody tr:hover {
    background: rgba(40, 90, 130, 0.2);
}
.dt-lgxm-td-attr {
    white-space: normal;
    color: rgba(160, 220, 200, 0.9);
    max-width: 14rem;
}
.dt-lgxm-td-desc {
    color: rgba(165, 180, 200, 0.82);
    max-width: 18rem;
}

.dt-lgxm-pending-hint {
    margin: 0 0 0.55rem;
    padding: 0.45rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(255, 210, 160, 0.95);
    background: rgba(80, 40, 20, 0.35);
    border: 1px solid rgba(255, 180, 100, 0.35);
    border-radius: 8px;
}

.modal-container--lgxm-reveal {
    z-index: 160;
}
.dt-lgxm-reveal-sheet {
    max-width: 44rem;
    width: 94vw;
    max-height: min(88vh, 36rem);
    overflow: auto;
    border-radius: 14px;
    padding: 1rem 1.1rem 1.15rem;
    border: 1px solid rgba(200, 230, 255, 0.28);
    background: linear-gradient(165deg, rgba(22, 38, 58, 0.98), rgba(10, 18, 32, 0.99));
    box-shadow: 0 20px 56px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.dt-lgxm-reveal-head {
    margin-bottom: 0.75rem;
    border-bottom: 1px solid rgba(100, 150, 190, 0.25);
    padding-bottom: 0.65rem;
}
.dt-lgxm-reveal-eyebrow {
    margin: 0 0 0.2rem;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    color: rgba(160, 200, 240, 0.75);
}
.dt-lgxm-reveal-title {
    margin: 0 0 0.35rem;
    font-size: 1.25rem;
    color: rgba(235, 248, 255, 0.98);
    text-shadow: 0 0 18px rgba(120, 190, 255, 0.35);
}
.dt-lgxm-reveal-sub {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: rgba(190, 210, 230, 0.82);
}
.dt-lgxm-reveal-compare {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 1rem;
}
@media (max-width: 640px) {
    .dt-lgxm-reveal-compare {
        grid-template-columns: 1fr;
    }
}
.dt-lgxm-reveal-col {
    border-radius: 10px;
    padding: 0.65rem 0.7rem;
    border: 1px solid rgba(110, 160, 200, 0.3);
    background: rgba(8, 22, 38, 0.75);
}
.dt-lgxm-reveal-col--new {
    border-color: rgba(255, 200, 120, 0.45);
    box-shadow: 0 0 20px rgba(255, 180, 80, 0.12);
}
.dt-lgxm-reveal-col--cur {
    opacity: 0.95;
}
.dt-lgxm-reveal-col__title {
    margin: 0 0 0.35rem;
    font-size: 0.78rem;
    color: rgba(200, 225, 255, 0.88);
    font-weight: 600;
}
.dt-lgxm-reveal-col__tier {
    margin: 0 0 0.35rem;
    font-size: 0.75rem;
    color: rgba(255, 210, 150, 0.95);
}
.dt-lgxm-reveal-col__name {
    margin: 0 0 0.4rem;
    font-size: 1.02rem;
    color: rgba(240, 250, 255, 0.98);
}
.dt-lgxm-reveal-col__label {
    margin: 0.35rem 0 0.15rem;
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    color: rgba(150, 190, 220, 0.75);
}
.dt-lgxm-reveal-col__attr {
    margin: 0;
    font-size: 0.76rem;
    line-height: 1.45;
    color: rgba(160, 230, 200, 0.92);
}
.dt-lgxm-reveal-col__desc {
    margin: 0;
    font-size: 0.74rem;
    line-height: 1.5;
    color: rgba(175, 195, 215, 0.85);
}
.dt-lgxm-reveal-col__empty {
    margin: 0.2rem 0 0;
    font-size: 0.8rem;
    color: rgba(150, 170, 190, 0.65);
}
.dt-lgxm-reveal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
    margin: 0;
}

.dt-alchemy-hero {
    position: relative;
    height: 6.5rem;
    margin: 0 0 0.75rem;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(90, 180, 140, 0.35);
    background: linear-gradient(180deg, rgba(20, 60, 50, 0.5), rgba(6, 14, 20, 0.95));
}
.dt-alchemy-hero__clouds {
    position: absolute;
    inset: -30%;
    background: radial-gradient(circle at 30% 50%, rgba(120, 220, 180, 0.12), transparent 45%),
        radial-gradient(circle at 70% 40%, rgba(80, 160, 220, 0.08), transparent 40%);
    animation: dt-alchemy-cloud 14s ease-in-out infinite alternate;
}
.dt-alchemy-hero__gate {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 46%;
    max-width: 9rem;
    height: 88%;
    transform: translateX(-50%);
    border: 2px solid rgba(160, 220, 190, 0.25);
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    background: linear-gradient(180deg, rgba(30, 80, 70, 0.35), rgba(8, 20, 24, 0.85));
    box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.45);
}
.dt-alchemy-hero__motto {
    position: absolute;
    bottom: 0.45rem;
    left: 0;
    right: 0;
    text-align: center;
    font-family: "ZCOOL XiaoWei", "Noto Sans SC", serif;
    font-size: 0.78rem;
    color: rgba(200, 245, 220, 0.75);
    letter-spacing: 0.35em;
}
@keyframes dt-alchemy-cloud {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(-2%, 1%);
    }
}
.dt-alchemy-meta {
    font-size: 0.82rem;
    color: rgba(210, 235, 225, 0.9);
    margin-bottom: 0.65rem;
}
.dt-alchemy-furnace-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    gap: 0.65rem;
    margin-bottom: 1rem;
}
.dt-alchemy-furnace {
    position: relative;
    border-radius: 12px;
    padding: 0.65rem 0.55rem 0.75rem;
    border: 1px solid rgba(100, 170, 140, 0.35);
    background: linear-gradient(165deg, rgba(16, 42, 38, 0.92), rgba(6, 12, 18, 0.96));
    min-height: 8.5rem;
    text-align: center;
}
.dt-alchemy-furnace--busy {
    border-color: rgba(220, 180, 90, 0.45);
    box-shadow: 0 0 18px rgba(200, 140, 60, 0.15);
}
.dt-alchemy-furnace__glow {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle at 50% 80%, rgba(100, 220, 160, 0.15), transparent 55%);
}
.dt-alchemy-furnace__glow--active {
    opacity: 1;
    animation: dt-alchemy-glow-pulse 2.4s ease-in-out infinite;
}
@keyframes dt-alchemy-glow-pulse {
    0%,
    100% {
        opacity: 0.55;
    }
    50% {
        opacity: 1;
    }
}
.dt-alchemy-furnace__lid {
    width: 2.5rem;
    height: 0.55rem;
    margin: 0.2rem auto 0.35rem;
    border-radius: 4px;
    background: linear-gradient(90deg, #3a5a52, #7ab09a, #3a5a52);
    opacity: 0.65;
}
.dt-alchemy-furnace__lid--closed {
    opacity: 0.95;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.dt-alchemy-furnace__label {
    margin: 0;
    font-size: 0.68rem;
    color: rgba(180, 220, 200, 0.65);
    letter-spacing: 0.12em;
}
.dt-alchemy-furnace__status,
.dt-alchemy-furnace__recipe,
.dt-alchemy-furnace__timer {
    margin: 0.2rem 0 0;
    font-size: 0.78rem;
    color: rgba(230, 245, 238, 0.92);
}
.dt-alchemy-furnace__recipe {
    font-weight: 600;
    color: #c8f5e0;
}
.dt-alchemy-ready {
    color: #ffd88a;
    font-weight: 600;
}
.dt-alchemy-recipe-panel {
    border-radius: 12px;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(90, 160, 130, 0.28);
    background: rgba(4, 14, 18, 0.45);
}
.dt-alchemy-subtitle {
    margin: 0 0 0.5rem;
    font-size: 0.88rem;
    color: rgba(200, 235, 215, 0.95);
}
.dt-alchemy-select-wrap {
    display: block;
    font-size: 0.82rem;
    color: rgba(200, 225, 215, 0.9);
    margin-bottom: 0.5rem;
}
.dt-alchemy-select {
    display: block;
    width: 100%;
    margin-top: 0.35rem;
    padding: 0.35rem 0.45rem;
    border-radius: 8px;
    border: 1px solid rgba(100, 170, 140, 0.4);
    background: rgba(6, 18, 22, 0.9);
    color: #e8f8f0;
    font-size: 0.78rem;
}
.dt-alchemy-muted {
    font-size: 0.74rem;
    line-height: 1.45;
    color: rgba(180, 210, 200, 0.72);
    margin: 0.4rem 0 0;
}
.dt-alchemy-expand {
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px dashed rgba(100, 160, 130, 0.25);
    font-size: 0.78rem;
    color: rgba(200, 225, 215, 0.85);
}
.dt-alchemy-lock {
    text-align: center;
    padding: 1.5rem 1rem;
    color: rgba(200, 220, 210, 0.85);
}
.dt-alchemy-lock--gate {
    border-radius: 14px;
    border: 1px solid rgba(120, 160, 150, 0.3);
    background: rgba(4, 12, 16, 0.55);
}
.dt-alchemy-lock__seal {
    width: 3.2rem;
    height: 3.2rem;
    margin: 0 auto 0.75rem;
    line-height: 3.2rem;
    border-radius: 50%;
    border: 2px solid rgba(180, 200, 190, 0.35);
    font-family: "ZCOOL XiaoWei", serif;
    font-size: 1.45rem;
    color: rgba(200, 220, 210, 0.55);
}
.dt-alchemy-lock__title {
    margin: 0 0 0.5rem;
    color: #c8ebe0;
}
.dt-alchemy-lock__text {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.55;
}
.modal-sheet--pet-pills {
    max-width: 28rem;
    width: min(100%, 28rem);
    border: 1px solid rgba(140, 200, 170, 0.4);
    background: linear-gradient(168deg, rgba(14, 28, 26, 0.98), rgba(6, 10, 16, 0.99));
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
}
.modal-sheet__head--pet-pills {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 12px 14px 8px;
    border-bottom: 1px solid rgba(100, 170, 140, 0.25);
}
.dt-pet-pill-head {
    font-size: 0.85rem;
    margin: 0 0 0.65rem;
    color: rgba(220, 240, 230, 0.92);
}
.dt-pet-pill-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.76rem;
}
.dt-pet-pill-table th,
.dt-pet-pill-table td {
    border-bottom: 1px solid rgba(80, 130, 110, 0.22);
    padding: 0.35rem 0.25rem;
    text-align: left;
    vertical-align: middle;
    color: rgba(210, 235, 225, 0.9);
}
.dt-pet-pill-table th {
    color: rgba(160, 210, 185, 0.95);
    font-weight: 600;
}
.dt-pet-pill-row--full td {
    opacity: 0.72;
}
.pet-btn-pills {
    margin-left: 4px;
}

/* 魔龙洞：称号条与上方「名字+境界」左对齐，与普通斗法共用 --combat-title-fx-offset-x:-55px（勿再覆写为 0，否则会像居中偏右） */

/* ========== 洞天劫 · 藏宝图（独立卷宗风 UI） ========== */
.modal-container--treasure-map {
    align-items: center;
    justify-content: center;
    background: rgba(8, 6, 4, 0.88);
    backdrop-filter: blur(4px);
}
.dt-treasure-sheet {
    width: min(920px, 96vw);
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    border: 2px solid #8b6914;
    border-radius: 12px;
    background:
        linear-gradient(165deg, rgba(42, 28, 12, 0.98) 0%, rgba(18, 12, 8, 0.99) 55%, rgba(28, 18, 10, 0.98) 100%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M0 40h80M40 0v80' stroke='%238b6914' stroke-opacity='0.06'/%3E%3C/svg%3E");
    box-shadow:
        0 0 0 1px rgba(212, 175, 90, 0.25),
        0 24px 64px rgba(0, 0, 0, 0.65),
        inset 0 1px 0 rgba(255, 220, 140, 0.12);
    overflow: hidden;
}
.dt-treasure-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px 12px;
    border-bottom: 1px dashed rgba(212, 175, 90, 0.35);
    background: linear-gradient(180deg, rgba(120, 80, 30, 0.22), transparent);
}
.dt-treasure-eyebrow {
    margin: 0 0 4px;
    font-size: 0.72rem;
    letter-spacing: 0.28em;
    color: rgba(212, 175, 90, 0.85);
}
.dt-treasure-title {
    margin: 0;
    font-size: 1.35rem;
    color: #f5e6c8;
    text-shadow: 0 0 18px rgba(212, 160, 60, 0.35);
}
.dt-treasure-sub {
    margin: 6px 0 0;
    font-size: 0.78rem;
    color: rgba(200, 170, 120, 0.82);
}
.dt-treasure-body {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 0;
    min-height: 0;
    flex: 1;
    overflow: hidden;
}
.dt-treasure-aside {
    padding: 14px 12px;
    border-right: 1px dashed rgba(139, 105, 20, 0.4);
    background: rgba(0, 0, 0, 0.18);
    overflow-y: auto;
}
.dt-treasure-panel h4 {
    margin: 0 0 8px;
    font-size: 0.8rem;
    color: #d4af5a;
    letter-spacing: 0.12em;
}
.dt-treasure-panel--rules p {
    margin: 0 0 8px;
    font-size: 0.72rem;
    line-height: 1.55;
    color: rgba(210, 190, 150, 0.88);
}
.dt-treasure-quality-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dt-treasure-quality-li {
    display: grid;
    grid-template-columns: 1.6rem 1fr auto;
    gap: 6px;
    align-items: center;
    padding: 6px 4px;
    font-size: 0.72rem;
    border-bottom: 1px solid rgba(139, 105, 20, 0.15);
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}
.dt-treasure-quality-li:hover {
    background: rgba(139, 105, 20, 0.12);
}
.dt-treasure-quality-li.is-active {
    background: rgba(139, 105, 20, 0.22);
    box-shadow: inset 0 0 0 1px rgba(212, 175, 90, 0.35);
}
.dt-treasure-quality-li__glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 4px;
    font-weight: 800;
    color: #1a1008;
    background: linear-gradient(145deg, #d4af5a, #8b6914);
}
.dt-treasure-quality-li--jinhui .dt-treasure-quality-li__glyph {
    background: linear-gradient(145deg, #9ccc65, #4a6b32);
}
.dt-treasure-quality-li--yuzhuan .dt-treasure-quality-li__glyph {
    background: linear-gradient(145deg, #7ec8e3, #2a5f7a);
}
.dt-treasure-quality-li--xuanling .dt-treasure-quality-li__glyph {
    background: linear-gradient(145deg, #c9a0ff, #5a3d8a);
}
.dt-treasure-quality-li--shengu .dt-treasure-quality-li__glyph {
    background: linear-gradient(145deg, #ffd700, #b8860b);
}
.dt-treasure-main {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 12px 14px 14px;
}
.dt-treasure-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 0.8rem;
    color: rgba(220, 200, 160, 0.9);
}
.dt-treasure-toolbar__left {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.dt-treasure-toolbar__right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}
.dt-treasure-discard-tier-btn {
    color: rgba(255, 190, 150, 0.95) !important;
    border-color: rgba(140, 70, 40, 0.55) !important;
}
.dt-treasure-discard-tier-btn:hover {
    color: #ffd0c0 !important;
    background: rgba(80, 35, 20, 0.4) !important;
}
.dt-treasure-batch-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px dashed rgba(139, 105, 20, 0.45);
    background: rgba(40, 28, 14, 0.55);
}
.dt-treasure-batch-count {
    flex: 1;
    min-width: 5rem;
    font-size: 0.75rem;
    color: rgba(220, 200, 160, 0.9);
}
.dt-treasure-batch-discard-btn {
    background: linear-gradient(180deg, #8b3a2a, #5c2018) !important;
    border-color: #3a1510 !important;
    color: #ffe8e0 !important;
}
.dt-treasure-batch-discard-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.dt-treasure-filter-hint {
    font-size: 0.68rem;
    color: rgba(180, 150, 100, 0.75);
}
.dt-treasure-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
.dt-treasure-filter__chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    font-size: 0.72rem;
    border-radius: 999px;
    border: 1px solid rgba(139, 105, 20, 0.45);
    background: rgba(30, 22, 12, 0.85);
    color: rgba(220, 200, 160, 0.88);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.dt-treasure-filter__chip:hover {
    border-color: rgba(212, 175, 90, 0.55);
    background: rgba(50, 36, 18, 0.9);
}
.dt-treasure-filter__chip.is-active {
    border-color: rgba(212, 175, 90, 0.75);
    background: rgba(80, 55, 22, 0.55);
    box-shadow: 0 0 10px rgba(212, 160, 60, 0.25);
    color: #f5e6c8;
}
.dt-treasure-filter__chip--canjian.is-active {
    border-color: rgba(139, 115, 85, 0.8);
    box-shadow: 0 0 8px rgba(139, 115, 85, 0.35);
}
.dt-treasure-filter__chip--jinhui.is-active {
    border-color: rgba(107, 142, 78, 0.8);
    box-shadow: 0 0 8px rgba(107, 142, 78, 0.35);
}
.dt-treasure-filter__chip--yuzhuan.is-active {
    border-color: rgba(74, 143, 173, 0.8);
    box-shadow: 0 0 8px rgba(74, 143, 173, 0.35);
}
.dt-treasure-filter__chip--xuanling.is-active {
    border-color: rgba(123, 94, 167, 0.8);
    box-shadow: 0 0 8px rgba(123, 94, 167, 0.35);
}
.dt-treasure-filter__chip--shengu.is-active {
    border-color: rgba(255, 215, 0, 0.75);
    box-shadow: 0 0 12px rgba(255, 200, 60, 0.45);
}
.dt-treasure-filter__n {
    font-size: 0.65rem;
    opacity: 0.75;
}
.dt-treasure-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: min-content;
    align-items: start;
    gap: 12px;
    align-content: start;
    padding: 4px;
    -webkit-overflow-scrolling: touch;
}
.dt-treasure-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 32px 16px;
    color: rgba(180, 150, 100, 0.75);
    font-size: 0.85rem;
}
.dt-treasure-card {
    --dt-tm-glow: #8b6914;
    --dt-tm-tier: 1;
    --dt-tm-fx-intensity: 0.35;
    --dt-tm-fx-speed: 4s;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    align-self: start;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    padding: 12px 12px 12px 48px;
    min-height: 120px;
    height: auto;
    border: 1px solid rgba(139, 105, 20, 0.55);
    background:
        linear-gradient(135deg, rgba(60, 42, 18, 0.9), rgba(30, 20, 10, 0.95)),
        repeating-linear-gradient(
            -12deg,
            transparent,
            transparent 6px,
            rgba(212, 175, 90, 0.04) 6px,
            rgba(212, 175, 90, 0.04) 7px
        );
    box-shadow:
        inset 0 0 24px rgba(0, 0, 0, 0.35),
        0 0 calc(8px + var(--dt-tm-tier) * 3px) color-mix(in srgb, var(--dt-tm-glow) calc(18% + var(--dt-tm-tier) * 8%), transparent);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.dt-treasure-card__glow,
.dt-treasure-card__shine,
.dt-treasure-card__rim,
.dt-treasure-card__aura,
.dt-treasure-card__sparks,
.dt-treasure-card__halo,
.dt-treasure-card__prism {
    position: absolute;
    pointer-events: none;
    border-radius: inherit;
}
.dt-treasure-card__glow {
    inset: -4px;
    z-index: 0;
    opacity: var(--dt-tm-fx-intensity);
    background:
        radial-gradient(ellipse at 50% 115%, color-mix(in srgb, var(--dt-tm-glow) 65%, transparent), transparent 62%),
        radial-gradient(circle at 18% 22%, color-mix(in srgb, var(--dt-tm-glow) 22%, transparent), transparent 42%);
    animation: dt-tm-card-pulse var(--dt-tm-fx-speed) ease-in-out infinite;
}
.dt-treasure-card__shine {
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        105deg,
        transparent 28%,
        color-mix(in srgb, var(--dt-tm-glow) 70%, #fff8e8) 46%,
        transparent 56%
    );
    background-size: 240% 100%;
    opacity: 0;
    animation: dt-tm-card-shimmer var(--dt-tm-fx-speed) linear infinite;
}
.dt-treasure-card__rim {
    inset: -1px;
    z-index: 0;
    padding: 1px;
    border-radius: inherit;
    background: linear-gradient(
        120deg,
        transparent 30%,
        color-mix(in srgb, var(--dt-tm-glow) 80%, #fff) 50%,
        transparent 70%
    );
    background-size: 220% 220%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0.55;
    animation: dt-tm-rim-sweep calc(var(--dt-tm-fx-speed) * 0.85) linear infinite;
}
.dt-treasure-card__aura {
    inset: -8px;
    z-index: 0;
    opacity: 0.45;
    background: conic-gradient(
        from 0deg,
        transparent,
        color-mix(in srgb, var(--dt-tm-glow) 55%, transparent),
        transparent,
        color-mix(in srgb, var(--dt-tm-glow) 35%, #fff),
        transparent
    );
    filter: blur(6px);
    animation: dt-tm-aura-spin calc(var(--dt-tm-fx-speed) * 2.2) linear infinite;
}
.dt-treasure-card__sparks {
    inset: 0;
    z-index: 1;
    opacity: 0.75;
    background-image:
        radial-gradient(circle, #fff 0 1px, transparent 1.5px),
        radial-gradient(circle, color-mix(in srgb, var(--dt-tm-glow) 90%, #fff) 0 1px, transparent 1.5px);
    background-size: 28px 28px, 36px 36px;
    background-position: 8% 18%, 72% 62%;
    animation: dt-tm-sparks-drift calc(var(--dt-tm-fx-speed) * 0.7) ease-in-out infinite alternate;
    mix-blend-mode: screen;
}
.dt-treasure-card__halo {
    inset: -14px;
    z-index: 0;
    border-radius: 50%;
    opacity: 0.5;
    background: radial-gradient(circle, color-mix(in srgb, var(--dt-tm-glow) 45%, #ffd700), transparent 68%);
    animation: dt-tm-halo-breathe calc(var(--dt-tm-fx-speed) * 0.65) ease-in-out infinite;
}
.dt-treasure-card__prism {
    inset: -2px;
    z-index: 0;
    padding: 2px;
    border-radius: inherit;
    background: conic-gradient(from 0deg, #ffd700, #fff8c0, var(--dt-tm-glow), #ff9a3c, #fff, #ffd700);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0.85;
    animation: dt-tm-aura-spin 2.8s linear infinite;
    filter: drop-shadow(0 0 10px rgba(255, 210, 80, 0.55));
}
@keyframes dt-tm-card-shimmer {
    0% {
        background-position: 220% 0;
        opacity: 0;
    }
    10% {
        opacity: calc(0.35 + var(--dt-tm-tier) * 0.12);
    }
    100% {
        background-position: -60% 0;
        opacity: 0;
    }
}
@keyframes dt-tm-card-pulse {
    0%,
    100% {
        opacity: calc(var(--dt-tm-fx-intensity) * 0.55);
        transform: scale(1);
    }
    50% {
        opacity: var(--dt-tm-fx-intensity);
        transform: scale(1.02);
    }
}
@keyframes dt-tm-rim-sweep {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 200% 50%;
    }
}
@keyframes dt-tm-aura-spin {
    to {
        transform: rotate(360deg);
    }
}
@keyframes dt-tm-sparks-drift {
    0% {
        background-position: 6% 14%, 78% 58%;
        opacity: 0.45;
    }
    100% {
        background-position: 22% 28%, 58% 72%;
        opacity: 0.95;
    }
}
@keyframes dt-tm-halo-breathe {
    0%,
    100% {
        opacity: 0.35;
        transform: scale(0.92);
    }
    50% {
        opacity: 0.75;
        transform: scale(1.08);
    }
}
.dt-treasure-card__body {
    position: relative;
    z-index: 3;
}
/* 残简：淡褐微光，慢扫 */
.dt-treasure-card--canjian {
    --dt-tm-fx-intensity: 0.32;
    --dt-tm-fx-speed: 4.2s;
    border-color: color-mix(in srgb, var(--dt-tm-glow) 40%, rgba(100, 80, 55, 0.5));
}
.dt-treasure-card--canjian .dt-treasure-card__shine {
    animation-duration: 4.5s;
}
/* 锦绘：翠绿流光 + 细边框 */
.dt-treasure-card--jinhui {
    --dt-tm-fx-intensity: 0.48;
    --dt-tm-fx-speed: 3.4s;
    border-color: color-mix(in srgb, var(--dt-tm-glow) 55%, rgba(60, 90, 40, 0.55));
    box-shadow:
        inset 0 0 20px rgba(40, 60, 20, 0.25),
        0 0 16px color-mix(in srgb, var(--dt-tm-glow) 38%, transparent);
}
.dt-treasure-card--jinhui .dt-treasure-card__rim {
    opacity: 0.7;
}
.dt-treasure-card--jinhui .dt-treasure-card__glow {
    background:
        radial-gradient(ellipse at 50% 110%, rgba(120, 180, 80, 0.45), transparent 65%),
        radial-gradient(circle at 80% 20%, rgba(90, 150, 70, 0.25), transparent 40%);
}
/* 玉篆：青玉双晕 + 旋转光晕 */
.dt-treasure-card--yuzhuan {
    --dt-tm-fx-intensity: 0.58;
    --dt-tm-fx-speed: 2.8s;
    border-color: color-mix(in srgb, var(--dt-tm-glow) 62%, rgba(40, 100, 130, 0.55));
    box-shadow:
        inset 0 0 22px rgba(20, 60, 90, 0.3),
        0 0 22px color-mix(in srgb, var(--dt-tm-glow) 48%, transparent),
        0 0 40px color-mix(in srgb, var(--dt-tm-glow) 18%, transparent);
}
.dt-treasure-card--yuzhuan .dt-treasure-card__aura {
    opacity: 0.55;
    filter: blur(5px);
}
.dt-treasure-card--yuzhuan .dt-treasure-card__shine {
    background: linear-gradient(
        105deg,
        transparent 24%,
        rgba(180, 240, 255, 0.55) 42%,
        color-mix(in srgb, var(--dt-tm-glow) 75%, #fff) 48%,
        transparent 58%
    );
    background-size: 260% 100%;
}
/* 玄灵：紫霄星屑 + 强外发光 */
.dt-treasure-card--xuanling {
    --dt-tm-fx-intensity: 0.72;
    --dt-tm-fx-speed: 2.2s;
    border-color: color-mix(in srgb, var(--dt-tm-glow) 70%, rgba(120, 80, 180, 0.6));
    box-shadow:
        inset 0 0 26px rgba(60, 30, 100, 0.35),
        0 0 26px color-mix(in srgb, var(--dt-tm-glow) 55%, transparent),
        0 0 48px color-mix(in srgb, var(--dt-tm-glow) 28%, transparent);
}
.dt-treasure-card--xuanling .dt-treasure-card__rim {
    opacity: 0.9;
    animation-duration: 1.8s;
}
.dt-treasure-card--xuanling .dt-treasure-card__sparks {
    background-size: 22px 22px, 30px 30px;
    opacity: 0.9;
}
.dt-treasure-card--xuanling .dt-treasure-card__glow {
    background:
        radial-gradient(ellipse at 50% 115%, rgba(180, 120, 255, 0.5), transparent 60%),
        radial-gradient(circle at 12% 30%, rgba(140, 100, 220, 0.35), transparent 45%),
        radial-gradient(circle at 88% 70%, rgba(200, 160, 255, 0.25), transparent 38%);
}
/* 神古：金轮棱镜 + 双层扫光 + 最强光晕 */
.dt-treasure-card--shengu {
    --dt-tm-fx-intensity: 0.95;
    --dt-tm-fx-speed: 1.6s;
    border-color: rgba(255, 215, 0, 0.75);
    box-shadow:
        inset 0 0 28px rgba(80, 50, 0, 0.4),
        0 0 24px rgba(255, 200, 60, 0.55),
        0 0 52px rgba(255, 180, 40, 0.35),
        0 0 80px rgba(255, 140, 20, 0.18);
    animation: dt-tm-shengu-card-pulse 2s ease-in-out infinite;
}
.dt-treasure-card--shengu .dt-treasure-card__glow {
    opacity: 0.9;
    background:
        radial-gradient(ellipse at 50% 120%, rgba(255, 220, 100, 0.75), transparent 58%),
        radial-gradient(circle at 20% 15%, rgba(255, 248, 200, 0.45), transparent 40%),
        radial-gradient(circle at 85% 75%, rgba(255, 160, 40, 0.35), transparent 42%);
    animation-duration: 1.4s;
}
.dt-treasure-card--shengu .dt-treasure-card__shine {
    position: absolute;
    animation-duration: 1.2s;
    background: linear-gradient(
        105deg,
        transparent 20%,
        rgba(255, 248, 220, 0.85) 40%,
        #fff 46%,
        rgba(255, 200, 80, 0.75) 52%,
        transparent 62%
    );
    background-size: 280% 100%;
}
.dt-treasure-card--shengu .dt-treasure-card__shine::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        -75deg,
        transparent 35%,
        rgba(255, 230, 150, 0.5) 48%,
        transparent 58%
    );
    background-size: 200% 100%;
    animation: dt-tm-card-shimmer 2.4s linear infinite reverse;
}
.dt-treasure-card--shengu .dt-treasure-card__prism {
    opacity: 1;
    animation-duration: 2.2s;
}
.dt-treasure-card--shengu .dt-treasure-card__halo {
    opacity: 0.8;
}
.dt-treasure-card--shengu .dt-treasure-card__sparks {
    background-size: 18px 18px, 24px 24px;
    opacity: 1;
}
@keyframes dt-tm-shengu-card-pulse {
    0%,
    100% {
        box-shadow:
            inset 0 0 28px rgba(80, 50, 0, 0.4),
            0 0 20px rgba(255, 200, 60, 0.45),
            0 0 44px rgba(255, 180, 40, 0.28);
    }
    50% {
        box-shadow:
            inset 0 0 28px rgba(80, 50, 0, 0.4),
            0 0 32px rgba(255, 230, 120, 0.75),
            0 0 64px rgba(255, 200, 60, 0.45),
            0 0 96px rgba(255, 160, 30, 0.25);
    }
}
.dt-treasure-card:hover {
    transform: translateY(-3px) scale(1.01);
}
.dt-treasure-card[data-fx-tier="1"]:hover {
    box-shadow:
        inset 0 0 24px rgba(0, 0, 0, 0.35),
        0 8px 18px rgba(0, 0, 0, 0.4),
        0 0 18px color-mix(in srgb, var(--dt-tm-glow) 35%, transparent);
}
.dt-treasure-card[data-fx-tier="2"]:hover,
.dt-treasure-card[data-fx-tier="3"]:hover {
    box-shadow:
        inset 0 0 24px rgba(0, 0, 0, 0.35),
        0 10px 22px rgba(0, 0, 0, 0.42),
        0 0 28px color-mix(in srgb, var(--dt-tm-glow) 50%, transparent),
        0 0 44px color-mix(in srgb, var(--dt-tm-glow) 22%, transparent);
}
.dt-treasure-card[data-fx-tier="4"]:hover,
.dt-treasure-card[data-fx-tier="5"]:hover {
    box-shadow:
        inset 0 0 24px rgba(0, 0, 0, 0.35),
        0 12px 28px rgba(0, 0, 0, 0.45),
        0 0 36px color-mix(in srgb, var(--dt-tm-glow) 62%, transparent),
        0 0 64px color-mix(in srgb, var(--dt-tm-glow) 32%, transparent);
}
.dt-treasure-card__seal {
    position: absolute;
    left: 10px;
    top: 14px;
    z-index: 4;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.95rem;
    color: #1a0c00;
    border: 2px solid rgba(212, 175, 90, 0.6);
    background: radial-gradient(circle at 30% 25%, #f5e6a8, #8b6914);
    box-shadow: 0 0 12px rgba(212, 160, 60, 0.4);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.dt-treasure-card--jinhui .dt-treasure-card__seal {
    border-color: rgba(140, 200, 100, 0.75);
    background: radial-gradient(circle at 30% 25%, #e8ffd0, #4a6b32);
    box-shadow: 0 0 14px rgba(120, 180, 80, 0.55);
}
.dt-treasure-card--yuzhuan .dt-treasure-card__seal {
    border-color: rgba(100, 200, 230, 0.75);
    background: radial-gradient(circle at 30% 25%, #d8f4ff, #2a5f7a);
    box-shadow: 0 0 16px rgba(74, 143, 173, 0.6);
}
.dt-treasure-card--xuanling .dt-treasure-card__seal {
    border-color: rgba(200, 160, 255, 0.8);
    background: radial-gradient(circle at 30% 25%, #f0e0ff, #5a3d8a);
    box-shadow: 0 0 18px rgba(160, 120, 255, 0.65);
    animation: dt-tm-seal-glow 2s ease-in-out infinite;
}
.dt-treasure-card--shengu .dt-treasure-card__seal {
    width: 36px;
    height: 36px;
    left: 8px;
    top: 12px;
    font-size: 1.05rem;
    border-color: rgba(255, 230, 140, 0.9);
    background: radial-gradient(circle at 30% 25%, #fffce0, #d4a017);
    box-shadow:
        0 0 18px rgba(255, 220, 100, 0.75),
        0 0 32px rgba(255, 180, 40, 0.45);
    animation: dt-tm-seal-glow 1.2s ease-in-out infinite;
}
@keyframes dt-tm-seal-glow {
    0%,
    100% {
        transform: scale(1);
        filter: brightness(1);
    }
    50% {
        transform: scale(1.06);
        filter: brightness(1.2);
    }
}
@media (prefers-reduced-motion: reduce) {
    .dt-treasure-card,
    .dt-treasure-card--shengu,
    .dt-treasure-card__glow,
    .dt-treasure-card__shine,
    .dt-treasure-card__rim,
    .dt-treasure-card__aura,
    .dt-treasure-card__sparks,
    .dt-treasure-card__halo,
    .dt-treasure-card__prism,
    .dt-treasure-card__seal,
    .dt-treasure-card--shengu .dt-treasure-card__shine::after {
        animation: none !important;
    }
}
.dt-treasure-card__title {
    margin: 0 0 4px;
    font-size: 0.82rem;
    color: #f0e0c0;
}
.dt-treasure-card__layer {
    margin: 0 0 4px;
    font-size: 0.72rem;
    color: rgba(200, 180, 140, 0.9);
}
.dt-treasure-card__hint {
    margin: 0 0 8px;
    font-size: 0.65rem;
    color: rgba(160, 140, 100, 0.8);
}
.dt-treasure-card__actions {
    display: flex;
    gap: 6px;
    align-items: stretch;
}
.dt-treasure-card__use {
    flex: 1;
    width: auto;
    background: linear-gradient(180deg, #a67c2a, #6b4420) !important;
    border-color: #4a3010 !important;
    color: #fff8e8 !important;
}
.dt-treasure-card__discard {
    flex-shrink: 0;
    min-width: 3.2rem;
    padding-left: 8px;
    padding-right: 8px;
    color: rgba(200, 170, 130, 0.9) !important;
    border-color: rgba(100, 70, 40, 0.55) !important;
}
.dt-treasure-card__discard:hover {
    color: #ffc8c8 !important;
    border-color: rgba(160, 70, 50, 0.65) !important;
    background: rgba(80, 30, 20, 0.35) !important;
}
.dt-treasure-card--batch {
    cursor: pointer;
}
.dt-treasure-card.is-selected {
    border-color: rgba(212, 175, 90, 0.85);
    box-shadow:
        inset 0 0 0 1px rgba(212, 175, 90, 0.35),
        0 0 12px rgba(212, 160, 60, 0.35);
}
.dt-treasure-card__check {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 6px;
    font-size: 0.65rem;
    color: rgba(240, 220, 180, 0.95);
    background: rgba(20, 12, 6, 0.72);
    border: 1px solid rgba(139, 105, 20, 0.5);
    cursor: pointer;
}
.dt-treasure-card__check-input {
    width: 0.95rem;
    height: 0.95rem;
    margin: 0;
    accent-color: #c9a227;
}
.dt-discard-confirm-more {
    margin: 8px 0 0;
    font-size: 0.72rem;
    text-align: center;
    color: rgba(200, 180, 140, 0.85);
}
.dongtian-hub-menu-card--treasure .dongtian-hub-menu-card__glyph {
    background: linear-gradient(145deg, #c9a227, #5c3a10);
    color: #fff8e0;
}

/* 藏宝图 · 丢弃确认弹窗 */
.modal-container--dt-discard-confirm {
    z-index: 5150;
    align-items: center;
    justify-content: center;
    background: rgba(4, 3, 2, 0.72);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.dt-discard-confirm-sheet {
    width: min(100%, 22rem);
    padding: 16px 18px 14px;
    border-radius: 10px;
    border: 2px solid rgba(139, 105, 20, 0.75);
    background: linear-gradient(165deg, rgba(48, 32, 14, 0.98), rgba(20, 14, 8, 0.99));
    box-shadow:
        0 0 0 1px rgba(212, 175, 90, 0.2),
        0 16px 40px rgba(0, 0, 0, 0.55);
}
.dt-discard-confirm-head {
    margin-bottom: 12px;
    text-align: center;
}
.dt-discard-confirm-eyebrow {
    margin: 0 0 4px;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    color: rgba(200, 170, 110, 0.8);
}
.dt-discard-confirm-title {
    margin: 0;
    font-size: 1rem;
    color: #f0e0c0;
    font-weight: 700;
}
.dt-discard-confirm-preview {
    margin-bottom: 10px;
}
.dt-discard-confirm-card {
    --dt-tm-glow: #8b6914;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid color-mix(in srgb, var(--dt-tm-glow) 50%, rgba(139, 105, 20, 0.5));
    background: rgba(30, 20, 10, 0.65);
    box-shadow: 0 0 14px color-mix(in srgb, var(--dt-tm-glow) 25%, transparent);
}
.dt-discard-confirm-card__seal {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.9rem;
    color: #1a0c00;
    border: 2px solid color-mix(in srgb, var(--dt-tm-glow) 60%, #d4af5a);
    background: radial-gradient(circle at 30% 25%, #f5e6a8, color-mix(in srgb, var(--dt-tm-glow) 70%, #6b4420));
}
.dt-discard-confirm-card__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.dt-discard-confirm-card__body strong {
    font-size: 0.82rem;
    color: #f0e0c0;
}
.dt-discard-confirm-card__meta {
    font-size: 0.72rem;
    color: rgba(200, 180, 140, 0.88);
}
.dt-discard-confirm-desc {
    margin: 0 0 14px;
    font-size: 0.75rem;
    line-height: 1.5;
    text-align: center;
    color: rgba(220, 140, 100, 0.92);
}
.dt-discard-confirm-actions {
    display: flex;
    gap: 10px;
    justify-content: center;
}
.dt-discard-confirm-actions .btn {
    min-width: 5.5rem;
}
.dt-discard-confirm-ok {
    background: linear-gradient(180deg, #8b3a2a, #5c2018) !important;
    border-color: #3a1510 !important;
    color: #ffe8e0 !important;
}
.dt-discard-confirm-ok:hover {
    background: linear-gradient(180deg, #a04835, #6b2818) !important;
}
@media (max-width: 720px) {
    .dt-treasure-body {
        grid-template-columns: 1fr;
    }
    .dt-treasure-aside {
        border-right: none;
        border-bottom: 1px dashed rgba(139, 105, 20, 0.35);
        max-height: 180px;
    }
}

/* 藏宝图 BOSS：秘卷劫尊标签与金卷光晕 */
.combat-boss-tag--treasuremap {
    background: linear-gradient(180deg, rgba(255, 220, 120, 0.98), rgba(160, 90, 20, 0.99));
    color: #2a1400;
    border: 1px solid rgba(255, 240, 180, 0.65);
    box-shadow:
        0 0 20px rgba(255, 180, 60, 0.55),
        0 0 40px rgba(200, 120, 30, 0.25),
        inset 0 1px 0 rgba(255, 255, 220, 0.5);
    animation: combat-boss-tag-breathe-treasure 1.6s ease-in-out infinite;
    letter-spacing: 0.2em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}
@keyframes combat-boss-tag-breathe-treasure {
    0%,
    100% {
        filter: brightness(1);
        transform: scale(1);
    }
    50% {
        filter: brightness(1.12);
        transform: scale(1.03);
    }
}
.combat-avatar--boss-treasuremap {
    border-width: 2px !important;
    border-color: rgba(255, 210, 100, 0.9) !important;
    color: #fff4d0 !important;
    background: radial-gradient(circle at 35% 28%, rgba(255, 200, 80, 0.55), rgba(50, 28, 8, 0.94)) !important;
    box-shadow:
        0 0 0 2px rgba(80, 40, 0, 0.5),
        0 0 32px rgba(255, 180, 50, 0.55),
        0 0 56px rgba(200, 100, 20, 0.3) !important;
    animation: combat-boss-avatar-glow-treasure 2s ease-in-out infinite;
}
@keyframes combat-boss-avatar-glow-treasure {
    0%,
    100% {
        box-shadow:
            0 0 0 2px rgba(80, 40, 0, 0.5),
            0 0 28px rgba(255, 180, 50, 0.45),
            0 0 48px rgba(200, 100, 20, 0.22);
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(80, 40, 0, 0.5),
            0 0 40px rgba(255, 200, 80, 0.65),
            0 0 72px rgba(220, 130, 30, 0.38);
    }
}
.combat-boss-aura--treasuremap {
    border: 2px solid rgba(255, 200, 80, 0.5);
    box-shadow:
        0 0 24px rgba(255, 170, 40, 0.45),
        0 0 48px rgba(180, 90, 20, 0.25);
    animation: combat-treasure-aura-spin 4s linear infinite;
}
.combat-boss-aura--treasuremap::before,
.combat-boss-aura--treasuremap::after {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0.5;
}
.combat-boss-aura--treasuremap::before {
    background: conic-gradient(
        from 0deg,
        transparent 0deg,
        rgba(255, 220, 120, 0.35) 60deg,
        transparent 120deg,
        rgba(255, 180, 60, 0.25) 200deg,
        transparent 280deg
    );
}
@keyframes combat-treasure-aura-spin {
    to {
        transform: rotate(360deg);
    }
}
.combat-boss-icon--treasuremap {
    animation: combat-treasure-icon-float 2.4s ease-in-out infinite;
    filter: drop-shadow(0 0 8px rgba(255, 200, 80, 0.8));
}
@keyframes combat-treasure-icon-float {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-3px) scale(1.06);
    }
}
.combat-sheet--treasure-map .combat-sheet__head {
    color: #f5e0b0;
}
.combat-card--boss-treasuremap {
    border-color: rgba(212, 160, 60, 0.35);
    background: linear-gradient(180deg, rgba(50, 32, 12, 0.5), rgba(20, 12, 6, 0.65));
}

/* 洞天 · 灵宠法器 */
.modal-container--pet-equip {
    z-index: 12061;
}
.dt-peq-sheet {
    max-width: 42rem;
    width: min(100%, 42rem);
    max-height: min(92dvh, 44rem);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(180, 140, 255, 0.38);
    box-shadow:
        0 0 48px rgba(80, 40, 140, 0.45),
        inset 0 0 70px rgba(20, 8, 40, 0.4);
    background:
        radial-gradient(ellipse 80% 45% at 50% -5%, rgba(160, 100, 255, 0.16), transparent 55%),
        radial-gradient(ellipse 50% 35% at 90% 90%, rgba(80, 200, 180, 0.08), transparent 50%),
        linear-gradient(168deg, rgba(16, 10, 28, 0.99), rgba(4, 6, 14, 0.99));
}
.dt-peq-ambient {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.dt-peq-ambient__mist {
    position: absolute;
    inset: -20%;
    background: radial-gradient(circle at 30% 20%, rgba(140, 80, 220, 0.12), transparent 45%);
    animation: dt-peq-mist 8s ease-in-out infinite alternate;
}
.dt-peq-ambient__glow {
    position: absolute;
    bottom: -10%;
    left: 50%;
    width: 80%;
    height: 40%;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(100, 220, 180, 0.1), transparent 70%);
}
.dt-peq-ambient__seal {
    position: absolute;
    top: 12%;
    right: 8%;
    font-size: 4.5rem;
    font-weight: 700;
    color: rgba(180, 120, 255, 0.07);
    text-shadow: 0 0 30px rgba(160, 80, 255, 0.2);
    font-family: "KaiTi", "STKaiti", serif;
}
@keyframes dt-peq-mist {
    from { opacity: 0.6; transform: translateY(0); }
    to { opacity: 1; transform: translateY(-8px); }
}
.dt-peq-modal-head,
.dt-peq-body {
    position: relative;
    z-index: 1;
}
.dt-peq-eyebrow {
    color: rgba(200, 170, 255, 0.82) !important;
    letter-spacing: 0.16em;
}
.dt-peq-title {
    background: linear-gradient(92deg, #f8f0ff, #c8a0ff, #7040c0, #301860);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 0 12px rgba(160, 80, 255, 0.35));
}
.dt-peq-sub {
    color: rgba(210, 195, 240, 0.88) !important;
    font-size: 0.82rem;
}
.dt-peq-close {
    color: rgba(200, 170, 255, 0.85);
}
.dt-peq-body {
    flex: 1;
    min-height: 0;
    max-height: none;
    padding: 0 14px 16px;
    overflow-x: hidden;
    overflow-y: auto;
}
.dt-peq-ui {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 0;
    height: 100%;
}
.dt-peq-hero {
    position: relative;
    flex-shrink: 0;
    height: 3.6rem;
    margin: 0;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(140, 100, 200, 0.22);
    background: linear-gradient(145deg, rgba(28, 18, 48, 0.85), rgba(8, 6, 16, 0.92));
}
.dt-peq-hero__mist {
    position: absolute;
    inset: -20%;
    background: radial-gradient(circle at 30% 40%, rgba(140, 80, 220, 0.14), transparent 48%);
    pointer-events: none;
}
.dt-peq-hero__seal {
    position: absolute;
    right: 10%;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2.2rem;
    font-weight: 700;
    color: rgba(180, 120, 255, 0.12);
    font-family: "KaiTi", "STKaiti", serif;
    pointer-events: none;
}
.dt-peq-head {
    flex-shrink: 0;
}
.dt-peq-head__pet {
    margin: 0;
    font-size: 0.92rem;
    color: rgba(230, 215, 255, 0.95);
    font-weight: 600;
}
.dt-peq-head__rule {
    margin: 6px 0 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: rgba(180, 165, 210, 0.88);
}
.dt-peq-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap: 14px;
    min-height: 0;
    flex: 1;
    align-items: start;
}
.dt-peq-wear-col,
.dt-peq-bag-col {
    min-width: 0;
    min-height: 0;
}
.dt-peq-bag-col {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: 100%;
}
@media (max-width: 640px) {
    .dt-peq-layout {
        grid-template-columns: 1fr;
    }
    .dt-peq-bag-col {
        max-height: none;
    }
}
.dt-peq-section-title {
    margin: 0 0 10px;
    font-size: 0.82rem;
    color: rgba(200, 175, 255, 0.92);
    letter-spacing: 0.08em;
}
.dt-peq-bag-count {
    font-weight: 400;
    opacity: 0.75;
    font-size: 0.76rem;
}
.dt-peq-slots {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.dt-peq-slot {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid rgba(140, 100, 200, 0.35);
    background: linear-gradient(145deg, rgba(30, 18, 50, 0.75), rgba(10, 8, 20, 0.85));
    cursor: pointer;
    text-align: left;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.dt-peq-slot--empty {
    cursor: default;
    opacity: 0.82;
}
.dt-peq-slot--filled {
    overflow: visible;
    isolation: isolate;
    min-height: 0;
    height: auto;
}
.dt-peq-slot--filled:hover {
    border-color: rgba(180, 130, 255, 0.65);
    box-shadow: 0 0 16px rgba(120, 60, 200, 0.25);
}
.dt-peq-slot--common { --dt-peq-glow: #a8b0c8; --dt-peq-tier: 1; --dt-peq-fx: 0.22; --dt-peq-speed: 5.5s; }
.dt-peq-slot--uncommon { --dt-peq-glow: #5ee0a8; --dt-peq-tier: 2; --dt-peq-fx: 0.38; --dt-peq-speed: 4.8s; }
.dt-peq-slot--rare { --dt-peq-glow: #6eb0ff; --dt-peq-tier: 3; --dt-peq-fx: 0.52; --dt-peq-speed: 4.2s; }
.dt-peq-slot--epic { --dt-peq-glow: #d080ff; --dt-peq-tier: 4; --dt-peq-fx: 0.72; --dt-peq-speed: 3.4s; }
.dt-peq-slot--legend { --dt-peq-glow: #ffc04a; --dt-peq-tier: 5; --dt-peq-fx: 1; --dt-peq-speed: 2.6s; }
.dt-peq-slot--common { border-color: rgba(168, 176, 200, 0.38); box-shadow: inset 0 0 14px rgba(168, 176, 200, 0.04), 0 0 8px rgba(168, 176, 200, 0.06); }
.dt-peq-slot--uncommon { border-color: rgba(94, 224, 168, 0.42); box-shadow: inset 0 0 16px rgba(94, 224, 168, 0.06), 0 0 12px rgba(94, 224, 168, 0.1); }
.dt-peq-slot--rare { border-color: rgba(110, 176, 255, 0.48); box-shadow: inset 0 0 18px rgba(110, 176, 255, 0.08), 0 0 16px rgba(110, 176, 255, 0.14); animation: dt-peq-slot-breath 4s ease-in-out infinite; }
.dt-peq-slot--epic { border-color: rgba(208, 128, 255, 0.58); box-shadow: inset 0 0 22px rgba(208, 128, 255, 0.1), 0 0 20px rgba(208, 128, 255, 0.2); animation: dt-peq-slot-breath 3.2s ease-in-out infinite; }
.dt-peq-slot--legend { border-color: rgba(255, 192, 74, 0.68); box-shadow: inset 0 0 26px rgba(255, 160, 40, 0.12), 0 0 24px rgba(255, 180, 60, 0.28), 0 0 44px rgba(255, 140, 20, 0.12); animation: dt-peq-slot-breath-legend 2.6s ease-in-out infinite; }
.dt-peq-slot__halo,
.dt-peq-slot__shine,
.dt-peq-slot__rim,
.dt-peq-slot__sparks,
.dt-peq-bag-item__glow,
.dt-peq-bag-item__shine,
.dt-peq-bag-item__rim,
.dt-peq-bag-item__sparks {
    position: absolute;
    pointer-events: none;
    border-radius: inherit;
}
.dt-peq-slot__halo,
.dt-peq-bag-item__glow {
    inset: -3px;
    z-index: 0;
    opacity: var(--dt-peq-fx, 0.3);
    background:
        radial-gradient(ellipse at 50% 110%, color-mix(in srgb, var(--dt-peq-glow) 62%, transparent), transparent 58%),
        radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--dt-peq-glow) 24%, transparent), transparent 44%);
    animation: dt-peq-card-pulse var(--dt-peq-speed, 4s) ease-in-out infinite;
}
.dt-peq-slot__shine,
.dt-peq-bag-item__shine {
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        108deg,
        transparent 26%,
        color-mix(in srgb, var(--dt-peq-glow) 75%, #fff) 46%,
        transparent 58%
    );
    background-size: 240% 100%;
    opacity: 0;
}
.dt-peq-slot--rare .dt-peq-slot__shine,
.dt-peq-bag-item--rare .dt-peq-bag-item__shine,
.dt-peq-preview-card--rare .dt-peq-bag-item__shine { opacity: 0.35; animation: dt-peq-card-shimmer calc(var(--dt-peq-speed, 4s) * 1.1) linear infinite; }
.dt-peq-slot--epic .dt-peq-slot__shine,
.dt-peq-bag-item--epic .dt-peq-bag-item__shine,
.dt-peq-preview-card--epic .dt-peq-bag-item__shine { opacity: 0.55; animation: dt-peq-card-shimmer var(--dt-peq-speed, 3.4s) linear infinite; }
.dt-peq-slot--legend .dt-peq-slot__shine,
.dt-peq-bag-item--legend .dt-peq-bag-item__shine,
.dt-peq-preview-card--legend .dt-peq-bag-item__shine { opacity: 0.72; animation: dt-peq-card-shimmer calc(var(--dt-peq-speed, 2.6s) * 0.85) linear infinite reverse; }
.dt-peq-slot__rim,
.dt-peq-bag-item__rim {
    inset: -1px;
    z-index: 0;
    padding: 1px;
    border-radius: inherit;
    background: linear-gradient(
        118deg,
        transparent 28%,
        color-mix(in srgb, var(--dt-peq-glow) 82%, #fff) 50%,
        transparent 72%
    );
    background-size: 220% 220%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
}
.dt-peq-slot--epic .dt-peq-slot__rim,
.dt-peq-bag-item--epic .dt-peq-bag-item__rim,
.dt-peq-preview-card--epic .dt-peq-bag-item__rim { opacity: 0.48; animation: dt-peq-rim-sweep calc(var(--dt-peq-speed, 3.4s) * 0.9) linear infinite; }
.dt-peq-slot--legend .dt-peq-slot__rim,
.dt-peq-bag-item--legend .dt-peq-bag-item__rim,
.dt-peq-preview-card--legend .dt-peq-bag-item__rim { opacity: 0.72; animation: dt-peq-rim-sweep calc(var(--dt-peq-speed, 2.6s) * 0.75) linear infinite; }
.dt-peq-slot__sparks,
.dt-peq-bag-item__sparks {
    inset: 0;
    z-index: 1;
    opacity: 0;
    background:
        radial-gradient(circle at 12% 28%, color-mix(in srgb, var(--dt-peq-glow) 90%, #fff) 0 1px, transparent 1.5px),
        radial-gradient(circle at 78% 22%, color-mix(in srgb, var(--dt-peq-glow) 80%, #fff) 0 1px, transparent 1.5px),
        radial-gradient(circle at 88% 72%, color-mix(in srgb, var(--dt-peq-glow) 70%, #fff) 0 1px, transparent 1.5px),
        radial-gradient(circle at 22% 82%, color-mix(in srgb, var(--dt-peq-glow) 75%, #fff) 0 1px, transparent 1.5px);
    animation: dt-peq-spark-drift 3.6s ease-in-out infinite;
}
.dt-peq-slot--legend .dt-peq-slot__sparks,
.dt-peq-bag-item--legend .dt-peq-bag-item__sparks,
.dt-peq-preview-card--legend .dt-peq-bag-item__sparks { opacity: 0.85; }
.dt-peq-slot--epic .dt-peq-slot__sparks,
.dt-peq-bag-item--epic .dt-peq-bag-item__sparks,
.dt-peq-preview-card--epic .dt-peq-bag-item__sparks { opacity: 0.45; }
.dt-peq-slot__icon,
.dt-peq-slot__lbl,
.dt-peq-slot__meta,
.dt-peq-slot__lvl,
.dt-peq-slot__stats {
    position: relative;
    z-index: 2;
}
.dt-peq-slot--uncommon .dt-peq-slot__icon { filter: drop-shadow(0 0 5px rgba(94, 224, 168, 0.35)); }
.dt-peq-slot--rare .dt-peq-slot__icon { filter: drop-shadow(0 0 7px rgba(110, 176, 255, 0.42)); }
.dt-peq-slot--epic .dt-peq-slot__icon { filter: drop-shadow(0 0 9px rgba(208, 128, 255, 0.5)); }
.dt-peq-slot--legend .dt-peq-slot__icon { filter: drop-shadow(0 0 12px rgba(255, 192, 74, 0.62)); }
.dt-peq-slot--rare .dt-peq-slot__lbl,
.dt-peq-slot--epic .dt-peq-slot__lbl,
.dt-peq-slot--legend .dt-peq-slot__lbl {
    text-shadow: 0 0 10px color-mix(in srgb, var(--dt-peq-glow) 55%, transparent);
}
.dt-peq-slot__icon {
    font-size: 1.1rem;
    opacity: 0.85;
}
.dt-peq-slot__lbl {
    font-size: 0.88rem;
    font-weight: 600;
    max-width: 100%;
    word-break: break-word;
}
.dt-peq-slot__meta,
.dt-peq-slot__hint {
    font-size: 0.72rem;
    color: rgba(180, 165, 210, 0.82);
}
.dt-peq-slot__lvl {
    font-size: 0.74rem;
    color: rgba(160, 220, 200, 0.88);
}
.dt-peq-slot__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 2px;
}
.dt-peq-total {
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px dashed rgba(140, 100, 200, 0.35);
    background: rgba(20, 12, 36, 0.5);
}
.dt-peq-total__title {
    margin: 0 0 6px;
    font-size: 0.78rem;
    color: rgba(200, 175, 255, 0.9);
}
.dt-peq-total__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.dt-peq-total__note {
    margin: 8px 0 0;
    font-size: 0.72rem;
    color: rgba(160, 150, 190, 0.82);
    line-height: 1.45;
}
.dt-peq-bag-scroll {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
    min-height: 0;
    max-height: min(48vh, 26rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2px 4px 10px 0;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 640px) {
    .dt-peq-bag-scroll {
        max-height: none;
    }
}
.dt-peq-bag-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid rgba(120, 90, 180, 0.32);
    background: linear-gradient(145deg, rgba(24, 16, 40, 0.8), rgba(8, 6, 16, 0.9));
    cursor: pointer;
    text-align: left;
    transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s;
    overflow: visible;
    isolation: isolate;
    flex-shrink: 0;
}
.dt-peq-bag-item--common { --dt-peq-glow: #a8b0c8; --dt-peq-tier: 1; --dt-peq-fx: 0.24; --dt-peq-speed: 5.5s; border-left: 3px solid rgba(168, 176, 200, 0.55); box-shadow: inset 0 0 12px rgba(168, 176, 200, 0.03), 0 0 6px rgba(168, 176, 200, 0.05); }
.dt-peq-bag-item--uncommon { --dt-peq-glow: #5ee0a8; --dt-peq-tier: 2; --dt-peq-fx: 0.4; --dt-peq-speed: 4.8s; border-left: 3px solid rgba(94, 224, 168, 0.72); box-shadow: inset 0 0 14px rgba(94, 224, 168, 0.05), 0 0 10px rgba(94, 224, 168, 0.08); }
.dt-peq-bag-item--rare { --dt-peq-glow: #6eb0ff; --dt-peq-tier: 3; --dt-peq-fx: 0.55; --dt-peq-speed: 4.2s; border-left: 3px solid rgba(110, 176, 255, 0.78); box-shadow: inset 0 0 16px rgba(110, 176, 255, 0.07), 0 0 14px rgba(110, 176, 255, 0.12); animation: dt-peq-slot-breath 4.2s ease-in-out infinite; }
.dt-peq-bag-item--epic { --dt-peq-glow: #d080ff; --dt-peq-tier: 4; --dt-peq-fx: 0.75; --dt-peq-speed: 3.4s; border-left: 3px solid rgba(208, 128, 255, 0.82); box-shadow: inset 0 0 20px rgba(208, 128, 255, 0.09), 0 0 18px rgba(208, 128, 255, 0.18); animation: dt-peq-slot-breath 3.2s ease-in-out infinite; }
.dt-peq-bag-item--legend { --dt-peq-glow: #ffc04a; --dt-peq-tier: 5; --dt-peq-fx: 1; --dt-peq-speed: 2.6s; border-left: 3px solid rgba(255, 192, 74, 0.92); box-shadow: inset 0 0 24px rgba(255, 160, 40, 0.11), 0 0 22px rgba(255, 180, 60, 0.26), 0 0 40px rgba(255, 140, 20, 0.1); animation: dt-peq-slot-breath-legend 2.6s ease-in-out infinite; }
.dt-peq-bag-item:not(.dt-peq-bag-item--disabled):hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--dt-peq-glow, #a080ff) 55%, rgba(160, 120, 240, 0.5));
    box-shadow:
        inset 0 0 calc(14px + var(--dt-peq-tier, 1) * 2px) color-mix(in srgb, var(--dt-peq-glow) 12%, transparent),
        0 0 calc(12px + var(--dt-peq-tier, 1) * 4px) color-mix(in srgb, var(--dt-peq-glow) calc(18% + var(--dt-peq-tier, 1) * 6%), transparent);
}
.dt-peq-bag-item--disabled {
    opacity: 0.55;
    cursor: not-allowed;
    animation: none !important;
}
.dt-peq-bag-item--disabled .dt-peq-bag-item__glow,
.dt-peq-bag-item--disabled .dt-peq-bag-item__shine,
.dt-peq-bag-item--disabled .dt-peq-bag-item__rim,
.dt-peq-bag-item--disabled .dt-peq-bag-item__sparks {
    animation: none !important;
    opacity: 0.35 !important;
}
.dt-peq-bag-item__main,
.dt-peq-bag-item__acts {
    position: relative;
    z-index: 2;
}
.dt-peq-bag-item--rare .dt-peq-bag-item__name,
.dt-peq-bag-item--epic .dt-peq-bag-item__name,
.dt-peq-bag-item--legend .dt-peq-bag-item__name {
    text-shadow: 0 0 12px color-mix(in srgb, var(--dt-peq-glow) 50%, transparent);
}
.dt-peq-bag-item--legend .dt-peq-bag-item__name.Legendary {
    animation: dt-peq-name-gleam 2.8s ease-in-out infinite;
}
.dt-peq-bag-item--epic .dt-peq-tag.Epic,
.dt-peq-bag-item--legend .dt-peq-tag.Legendary {
    box-shadow: 0 0 8px color-mix(in srgb, var(--dt-peq-glow) 40%, transparent);
}
.dt-peq-bag-item__slot {
    font-size: 0.68rem;
    color: rgba(160, 200, 190, 0.85);
    letter-spacing: 0.06em;
}
.dt-peq-bag-item__name {
    font-size: 0.86rem;
    font-weight: 600;
    max-width: 100%;
    word-break: break-word;
    line-height: 1.35;
}
.dt-peq-bag-item__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.dt-peq-tag {
    font-size: 0.66rem;
    padding: 1px 6px;
    border-radius: 4px;
    background: rgba(60, 40, 90, 0.6);
    color: rgba(200, 190, 220, 0.9);
}
.dt-peq-bag-item__lvl {
    font-size: 0.72rem;
    color: rgba(140, 210, 190, 0.88);
}
.dt-peq-bag-item__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    width: 100%;
}
.dt-peq-bag-item__warn {
    font-size: 0.68rem;
    color: rgba(255, 160, 140, 0.9);
    line-height: 1.4;
    width: 100%;
    word-break: break-word;
}
.dt-peq-stat-chip {
    font-size: 0.66rem;
    padding: 1px 5px;
    border-radius: 4px;
    background: rgba(40, 30, 70, 0.65);
    color: rgba(210, 200, 240, 0.92);
}
.dt-peq-stat-chip--muted {
    opacity: 0.65;
}
.dt-peq-empty {
    margin: 0;
    font-size: 0.8rem;
    color: rgba(170, 160, 200, 0.85);
    line-height: 1.5;
}
.pet-btn-equip {
    border-color: rgba(160, 120, 220, 0.45) !important;
    color: rgba(210, 185, 255, 0.95) !important;
}
.pet-ui__section--peq {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed rgba(140, 100, 200, 0.28);
}
.pet-ui__peq-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}
.pet-ui__peq-item {
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(200, 190, 230, 0.9);
}
.dt-peq-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(20, 12, 36, 0.55);
    border: 1px dashed rgba(140, 100, 200, 0.28);
    flex-shrink: 0;
}
.dt-peq-auto {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.76rem;
    color: rgba(200, 185, 230, 0.92);
}
.dt-peq-select,
.dt-peq-lvl-inp {
    font-size: 0.74rem;
    padding: 3px 6px;
    border-radius: 6px;
    border: 1px solid rgba(140, 100, 200, 0.35);
    background: rgba(10, 8, 20, 0.85);
    color: rgba(220, 210, 240, 0.95);
}
.dt-peq-lvl-range {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.dt-peq-lvl-inp {
    width: 3.2rem;
}
.dt-peq-bag-item__main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    width: 100%;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    color: inherit;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-radius: 6px;
    flex-shrink: 0;
}
.dt-peq-bag-item__main--disabled {
    cursor: not-allowed;
}
.dt-peq-bag-item__acts {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed rgba(120, 90, 180, 0.25);
    width: 100%;
    flex-shrink: 0;
}
.dt-peq-bag-item--locked {
    opacity: 0.88;
}
.dt-peq-preview-wrap {
    max-width: 22rem;
}
.dt-peq-preview-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    margin: 12px 0 16px;
    padding: 16px 14px;
    border-radius: 10px;
    border: 1px solid rgba(140, 100, 200, 0.4);
    background: linear-gradient(145deg, rgba(28, 18, 48, 0.92), rgba(8, 6, 16, 0.96));
}
.dt-peq-preview-card--common { --dt-peq-glow: #a8b0c8; --dt-peq-tier: 1; --dt-peq-fx: 0.28; --dt-peq-speed: 5.5s; }
.dt-peq-preview-card--uncommon { --dt-peq-glow: #5ee0a8; --dt-peq-tier: 2; --dt-peq-fx: 0.42; --dt-peq-speed: 4.8s; }
.dt-peq-preview-card--rare { --dt-peq-glow: #6eb0ff; --dt-peq-tier: 3; --dt-peq-fx: 0.58; --dt-peq-speed: 4.2s; animation: dt-peq-slot-breath 4.2s ease-in-out infinite; }
.dt-peq-preview-card--epic { --dt-peq-glow: #d080ff; --dt-peq-tier: 4; --dt-peq-fx: 0.78; --dt-peq-speed: 3.4s; animation: dt-peq-slot-breath 3.2s ease-in-out infinite; }
.dt-peq-preview-card--legend { --dt-peq-glow: #ffc04a; --dt-peq-tier: 5; --dt-peq-fx: 1; --dt-peq-speed: 2.6s; animation: dt-peq-slot-breath-legend 2.6s ease-in-out infinite; }
.dt-peq-preview-card--rare { border-color: rgba(110, 176, 255, 0.5); box-shadow: 0 0 18px rgba(110, 176, 255, 0.15); }
.dt-peq-preview-card--epic { border-color: rgba(208, 128, 255, 0.58); box-shadow: 0 0 22px rgba(208, 128, 255, 0.22); }
.dt-peq-preview-card--legend { border-color: rgba(255, 192, 74, 0.65); box-shadow: 0 0 28px rgba(255, 180, 60, 0.3), 0 0 48px rgba(255, 140, 20, 0.12); }
.dt-peq-preview-card__body {
    position: relative;
    z-index: 2;
}
.dt-peq-preview-card__meta {
    margin: 6px 0 10px;
    font-size: 0.78rem;
    color: rgba(190, 175, 220, 0.9);
    line-height: 1.45;
}
.dt-peq-preview-card__stats {
    margin-top: 4px;
}
@keyframes dt-peq-card-pulse {
    0%, 100% { opacity: calc(var(--dt-peq-fx, 0.3) * 0.72); }
    50% { opacity: var(--dt-peq-fx, 0.3); }
}
@keyframes dt-peq-card-shimmer {
    0% { background-position: 180% 0; }
    100% { background-position: -60% 0; }
}
@keyframes dt-peq-rim-sweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}
@keyframes dt-peq-spark-drift {
    0%, 100% { transform: translateY(0); opacity: 0.6; }
    50% { transform: translateY(-3px); opacity: 1; }
}
@keyframes dt-peq-slot-breath {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.06); }
}
@keyframes dt-peq-slot-breath-legend {
    0%, 100% { filter: brightness(1); box-shadow: inset 0 0 24px rgba(255, 160, 40, 0.11), 0 0 22px rgba(255, 180, 60, 0.26), 0 0 40px rgba(255, 140, 20, 0.1); }
    50% { filter: brightness(1.1); box-shadow: inset 0 0 28px rgba(255, 160, 40, 0.16), 0 0 30px rgba(255, 180, 60, 0.38), 0 0 56px rgba(255, 140, 20, 0.18); }
}
@keyframes dt-peq-name-gleam {
    0%, 100% { text-shadow: 0 0 10px rgba(255, 192, 74, 0.45), 0 0 20px rgba(255, 160, 40, 0.2); }
    50% { text-shadow: 0 0 16px rgba(255, 210, 100, 0.75), 0 0 32px rgba(255, 160, 40, 0.35); }
}
@media (prefers-reduced-motion: reduce) {
    .dt-peq-bag-item,
    .dt-peq-slot--filled,
    .dt-peq-preview-card,
    .dt-peq-bag-item__glow,
    .dt-peq-bag-item__shine,
    .dt-peq-bag-item__rim,
    .dt-peq-bag-item__sparks,
    .dt-peq-slot__halo,
    .dt-peq-slot__shine,
    .dt-peq-slot__rim,
    .dt-peq-slot__sparks,
    .dt-peq-bag-item--legend .dt-peq-bag-item__name.Legendary {
        animation: none !important;
    }
}
.btn--xs {
    font-size: 0.68rem;
    padding: 2px 7px;
    min-height: 0;
}

/* 洞天 · 灵兽界（青玉灵息） */
.dongtian-hub-menu-card--spirit-beast {
    border-color: rgba(120, 220, 180, 0.45) !important;
    background: linear-gradient(145deg, rgba(16, 36, 32, 0.94), rgba(8, 18, 16, 0.98)) !important;
    box-shadow:
        0 0 24px rgba(80, 220, 160, 0.14),
        inset 0 0 40px rgba(60, 180, 140, 0.08) !important;
}
.dongtian-hub-menu-card--spirit-beast .dongtian-hub-menu-card__glyph {
    color: rgba(180, 255, 220, 0.35);
    text-shadow: 0 0 22px rgba(100, 240, 180, 0.55);
}
.modal-container--spirit-beast-realm {
    backdrop-filter: blur(7px);
}
.dongtian-spirit-beast-sheet {
    max-width: 27rem;
    border: 1px solid rgba(120, 220, 180, 0.38);
    box-shadow:
        0 0 48px rgba(80, 220, 160, 0.2),
        inset 0 0 70px rgba(40, 120, 90, 0.1);
    background:
        radial-gradient(ellipse 100% 70% at 50% -15%, rgba(160, 255, 210, 0.12), transparent 58%),
        radial-gradient(ellipse 80% 50% at 20% 100%, rgba(60, 200, 160, 0.1), transparent 55%),
        linear-gradient(165deg, rgba(10, 24, 22, 0.97), rgba(4, 10, 10, 0.99));
}
.dongtian-spirit-beast-head .dongtian-spirit-beast-eyebrow {
    color: rgba(180, 255, 220, 0.88);
    letter-spacing: 0.32em;
}
.dongtian-spirit-beast-title {
    background: linear-gradient(90deg, #e8fff4, #7ef0c0, #b8ffe0, #4fd4a8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 32px rgba(100, 240, 180, 0.35);
}
.dongtian-spirit-beast-sub {
    color: rgba(210, 255, 235, 0.78);
}
.dongtian-spirit-beast-body {
    max-height: min(82vh, 40rem);
    overflow-y: auto;
}
.dt-sbr-hero {
    position: relative;
    height: 8rem;
    margin: 0 0 0.85rem;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(120, 220, 180, 0.28);
    background: linear-gradient(180deg, rgba(12, 32, 28, 0.95), rgba(4, 12, 10, 0.98));
}
.dt-sbr-hero__mist {
    position: absolute;
    inset: -20%;
    background:
        radial-gradient(ellipse 70% 50% at 30% 60%, rgba(120, 255, 200, 0.12), transparent 55%),
        radial-gradient(ellipse 60% 45% at 70% 40%, rgba(80, 200, 160, 0.1), transparent 50%);
    animation: dt-sbr-mist-drift 14s ease-in-out infinite alternate;
}
.dt-sbr-hero__orbs span {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(200, 255, 230, 0.9), rgba(80, 220, 160, 0.2));
    box-shadow: 0 0 12px rgba(120, 255, 200, 0.7);
    animation: dt-sbr-orb-float 7s ease-in-out infinite;
}
.dt-sbr-hero__orbs span:nth-child(1) { left: 12%; top: 70%; animation-delay: 0s; }
.dt-sbr-hero__orbs span:nth-child(2) { left: 28%; top: 25%; animation-delay: 1.1s; width: 6px; height: 6px; }
.dt-sbr-hero__orbs span:nth-child(3) { left: 48%; top: 55%; animation-delay: 2.3s; }
.dt-sbr-hero__orbs span:nth-child(4) { left: 62%; top: 20%; animation-delay: 0.7s; width: 10px; height: 10px; }
.dt-sbr-hero__orbs span:nth-child(5) { left: 78%; top: 65%; animation-delay: 3.2s; }
.dt-sbr-hero__orbs span:nth-child(6) { left: 88%; top: 35%; animation-delay: 1.8s; width: 5px; height: 5px; }
.dt-sbr-hero__ring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 6rem;
    height: 6rem;
    transform: translate(-50%, -50%);
    border: 1px solid rgba(120, 255, 200, 0.22);
    border-radius: 50%;
    box-shadow:
        0 0 28px rgba(80, 220, 160, 0.25),
        inset 0 0 24px rgba(60, 180, 140, 0.12);
    animation: dt-sbr-ring-pulse 4s ease-in-out infinite;
}
.dt-sbr-hero__sigil {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 2.8rem;
    font-weight: 700;
    color: rgba(180, 255, 220, 0.22);
    text-shadow: 0 0 28px rgba(100, 240, 180, 0.45);
    pointer-events: none;
}
@keyframes dt-sbr-mist-drift {
    from { transform: translateX(-4%) scale(1); opacity: 0.75; }
    to { transform: translateX(4%) scale(1.05); opacity: 1; }
}
@keyframes dt-sbr-orb-float {
    0%, 100% { transform: translateY(0) scale(1); opacity: 0.5; }
    50% { transform: translateY(-18px) scale(1.15); opacity: 1; }
}
@keyframes dt-sbr-ring-pulse {
    0%, 100% { opacity: 0.65; transform: translate(-50%, -50%) scale(1); }
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1.06); }
}
.dt-sbr-card {
    border-color: rgba(120, 220, 180, 0.25) !important;
}
.dt-sbr-rules {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(210, 255, 235, 0.88);
}
.dt-sbr-rules li { margin-bottom: 0.35rem; }
.dt-sbr-actions {
    margin-top: 0.65rem;
    display: flex;
    justify-content: center;
}
.dt-sbr-challenge {
    min-width: 11rem;
    box-shadow: 0 0 22px rgba(80, 220, 160, 0.28);
}

/* 斗法 · 灵兽守劫（青玉灵雾旋纹，区别于神界金白仙光） */
.combat-card--enemy.combat-card--boss-spiritbeast {
    position: relative;
    isolation: isolate;
    border-width: 1px;
    border-color: rgba(120, 255, 200, 0.5);
    background:
        radial-gradient(ellipse 100% 80% at 50% 110%, rgba(60, 200, 150, 0.18) 0%, transparent 55%),
        radial-gradient(ellipse 60% 50% at 0% 0%, rgba(100, 255, 200, 0.1) 0%, transparent 48%),
        linear-gradient(165deg, rgba(12, 32, 28, 0.78) 0%, rgba(4, 12, 10, 0.94) 100%);
    box-shadow:
        0 0 0 1px rgba(120, 255, 200, 0.22),
        0 0 32px rgba(60, 220, 160, 0.26),
        inset 0 0 48px rgba(40, 160, 120, 0.14);
    animation: combat-spiritbeast-card 3.6s ease-in-out infinite;
}
.combat-card--enemy.combat-card--boss-spiritbeast::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: conic-gradient(from 0deg, transparent, rgba(120, 255, 200, 0.08), rgba(60, 200, 150, 0.16), transparent 70%);
    animation: combat-spiritbeast-spiral 8s linear infinite;
    pointer-events: none;
    z-index: 0;
}
.combat-card--enemy.combat-card--boss-spiritbeast::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at 50% 0%, rgba(160, 255, 220, 0.12), transparent 55%);
    animation: combat-spiritbeast-breathe 3.2s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}
.combat-card--enemy.combat-card--boss-spiritbeast .combat-card__row,
.combat-card--enemy.combat-card--boss-spiritbeast .combat-bar,
.combat-card--enemy.combat-card--boss-spiritbeast .combat-card__dmg {
    position: relative;
    z-index: 1;
}
.combat-card--enemy.combat-card--boss-spiritbeast .combat-card__title {
    text-shadow: 0 0 14px rgba(100, 240, 180, 0.35);
}
.combat-boss-tag--spiritbeast {
    border-color: rgba(120, 255, 200, 0.55);
    background: linear-gradient(135deg, rgba(20, 60, 48, 0.9), rgba(8, 28, 22, 0.95));
    color: rgba(200, 255, 230, 0.95);
    animation: combat-spiritbeast-tag 2.4s ease-in-out infinite;
}
.combat-boss-aura--spiritbeast {
    background:
        radial-gradient(circle, rgba(120, 255, 200, 0.35) 0%, transparent 65%),
        repeating-radial-gradient(circle at 50% 50%, transparent 0, transparent 8px, rgba(80, 220, 160, 0.06) 9px);
    animation: combat-spiritbeast-aura 5s ease-in-out infinite;
}
.combat-avatar--boss-spiritbeast {
    box-shadow:
        0 0 0 1px rgba(120, 255, 200, 0.35),
        0 0 24px rgba(60, 220, 160, 0.35);
    animation: combat-spiritbeast-avatar 3s ease-in-out infinite;
}
.combat-boss-icon--spiritbeast {
    color: rgba(180, 255, 220, 0.92);
    filter: drop-shadow(0 0 8px rgba(100, 240, 180, 0.65));
}
@keyframes combat-spiritbeast-card {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.08); }
}
@keyframes combat-spiritbeast-spiral {
    to { transform: rotate(360deg); }
}
@keyframes combat-spiritbeast-breathe {
    from { opacity: 0.5; }
    to { opacity: 0.95; }
}
@keyframes combat-spiritbeast-tag {
    0%, 100% { box-shadow: 0 0 8px rgba(80, 220, 160, 0.2); }
    50% { box-shadow: 0 0 16px rgba(120, 255, 200, 0.45); }
}
@keyframes combat-spiritbeast-aura {
    0%, 100% { transform: scale(1); opacity: 0.75; }
    50% { transform: scale(1.08); opacity: 1; }
}
@keyframes combat-spiritbeast-avatar {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.03); }
}

/* 洞天 · 幽魂界（紫冥魂气） */
.dongtian-hub-menu-card--ghost {
    border-color: rgba(160, 120, 255, 0.45) !important;
    background: linear-gradient(145deg, rgba(22, 14, 36, 0.94), rgba(10, 6, 18, 0.98)) !important;
    box-shadow:
        0 0 24px rgba(140, 100, 255, 0.16),
        inset 0 0 40px rgba(100, 60, 200, 0.1) !important;
}
.dongtian-hub-menu-card--ghost .dongtian-hub-menu-card__glyph {
    color: rgba(210, 180, 255, 0.4);
    text-shadow: 0 0 22px rgba(160, 120, 255, 0.6);
}
.modal-container--ghost-realm {
    backdrop-filter: blur(8px);
    background: rgba(4, 2, 10, 0.55);
}
.dongtian-ghost-realm-sheet {
    max-width: 27rem;
    border: 1px solid rgba(160, 120, 255, 0.38);
    background:
        radial-gradient(ellipse 120% 80% at 50% -10%, rgba(120, 80, 220, 0.22) 0%, transparent 55%),
        linear-gradient(165deg, rgba(18, 10, 32, 0.96) 0%, rgba(8, 4, 16, 0.99) 100%);
    box-shadow:
        0 0 0 1px rgba(180, 140, 255, 0.12),
        0 0 48px rgba(100, 60, 200, 0.28),
        inset 0 0 60px rgba(80, 40, 160, 0.12);
}
.dongtian-ghost-realm-head .dongtian-ghost-realm-eyebrow {
    color: rgba(180, 150, 255, 0.75);
    letter-spacing: 0.14em;
}
.dongtian-ghost-realm-title {
    background: linear-gradient(90deg, #e8d8ff, #b8a0ff, #d0c0ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: none;
}
.dongtian-ghost-realm-sub {
    color: rgba(200, 180, 240, 0.72);
}
.dongtian-ghost-realm-body {
    gap: 0.85rem;
}
.dt-ghost-hero {
    position: relative;
    height: 7.5rem;
    border-radius: 0.65rem;
    overflow: hidden;
    margin-bottom: 0.25rem;
    background: radial-gradient(ellipse 80% 100% at 50% 100%, rgba(60, 30, 120, 0.35) 0%, transparent 70%);
}
.dt-ghost-hero__mist {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 90% 60% at 30% 80%, rgba(140, 100, 255, 0.25) 0%, transparent 55%),
        radial-gradient(ellipse 70% 50% at 70% 20%, rgba(80, 200, 220, 0.12) 0%, transparent 50%);
    animation: dt-ghost-mist-drift 16s ease-in-out infinite alternate;
}
.dt-ghost-hero__wisps span {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(220, 200, 255, 0.9) 0%, rgba(140, 100, 255, 0.2) 70%);
    box-shadow: 0 0 12px rgba(180, 140, 255, 0.6);
    animation: dt-ghost-wisp-float 8s ease-in-out infinite;
}
.dt-ghost-hero__wisps span:nth-child(1) { left: 10%; top: 65%; animation-delay: 0s; }
.dt-ghost-hero__wisps span:nth-child(2) { left: 22%; top: 30%; animation-delay: 1.3s; width: 6px; height: 6px; }
.dt-ghost-hero__wisps span:nth-child(3) { left: 38%; top: 55%; animation-delay: 2.6s; }
.dt-ghost-hero__wisps span:nth-child(4) { left: 52%; top: 22%; animation-delay: 0.8s; width: 10px; height: 10px; }
.dt-ghost-hero__wisps span:nth-child(5) { left: 66%; top: 70%; animation-delay: 3.4s; }
.dt-ghost-hero__wisps span:nth-child(6) { left: 78%; top: 38%; animation-delay: 1.9s; width: 5px; height: 5px; }
.dt-ghost-hero__wisps span:nth-child(7) { left: 88%; top: 58%; animation-delay: 4.1s; }
.dt-ghost-hero__ring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 5.5rem;
    height: 5.5rem;
    margin: -2.75rem 0 0 -2.75rem;
    border-radius: 50%;
    border: 1px solid rgba(180, 140, 255, 0.35);
    box-shadow:
        0 0 24px rgba(140, 100, 255, 0.35),
        inset 0 0 20px rgba(100, 60, 200, 0.2);
    animation: dt-ghost-ring-pulse 4.5s ease-in-out infinite;
}
.dt-ghost-hero__sigil {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.2rem;
    font-weight: 700;
    color: rgba(220, 200, 255, 0.85);
    text-shadow: 0 0 20px rgba(180, 140, 255, 0.8);
    z-index: 2;
}
@keyframes dt-ghost-mist-drift {
    from { transform: translateX(-3%) scale(1); opacity: 0.75; }
    to { transform: translateX(3%) scale(1.05); opacity: 1; }
}
@keyframes dt-ghost-wisp-float {
    0%, 100% { transform: translateY(0) scale(1); opacity: 0.6; }
    50% { transform: translateY(-18px) scale(1.2); opacity: 1; }
}
@keyframes dt-ghost-ring-pulse {
    0%, 100% { transform: scale(1); opacity: 0.7; }
    50% { transform: scale(1.06); opacity: 1; }
}
.dt-ghost-card {
    border-color: rgba(160, 120, 255, 0.28) !important;
    background: rgba(12, 8, 22, 0.65) !important;
}
.dt-ghost-rules {
    margin: 0;
    padding-left: 1.1rem;
    color: rgba(210, 190, 245, 0.88);
    font-size: 0.82rem;
    line-height: 1.55;
}
.dt-ghost-rules li { margin-bottom: 0.35rem; }
.dt-ghost-actions {
    margin-top: 0.65rem;
    display: flex;
    justify-content: center;
}
.dt-ghost-challenge {
    min-width: 11rem;
    background: linear-gradient(135deg, rgba(100, 60, 200, 0.9), rgba(60, 30, 140, 0.95)) !important;
    border-color: rgba(200, 170, 255, 0.45) !important;
    box-shadow: 0 0 22px rgba(140, 100, 255, 0.35);
}

/* 斗法 · 幽魂守冥（紫冥魂雾飘动，区别于神界金白仙光） */
.combat-card--enemy.combat-card--boss-ghostrealm {
    position: relative;
    isolation: isolate;
    border-width: 1px;
    border-color: rgba(160, 120, 255, 0.5);
    background:
        radial-gradient(ellipse 100% 80% at 50% 110%, rgba(80, 40, 160, 0.22) 0%, transparent 55%),
        radial-gradient(ellipse 60% 50% at 100% 0%, rgba(100, 200, 220, 0.08) 0%, transparent 48%),
        linear-gradient(165deg, rgba(16, 10, 28, 0.82) 0%, rgba(6, 4, 12, 0.96) 100%);
    box-shadow:
        0 0 0 1px rgba(160, 120, 255, 0.22),
        0 0 36px rgba(100, 60, 200, 0.3),
        inset 0 0 52px rgba(60, 30, 120, 0.16);
    animation: combat-ghostrealm-card 4.2s ease-in-out infinite;
}
.combat-card--enemy.combat-card--boss-ghostrealm::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: repeating-linear-gradient(
        -12deg,
        transparent 0,
        transparent 14px,
        rgba(180, 140, 255, 0.03) 15px
    );
    pointer-events: none;
    animation: combat-ghostrealm-mist 12s linear infinite;
}
.combat-card--enemy.combat-card--boss-ghostrealm .combat-card__row,
.combat-card--enemy.combat-card--boss-ghostrealm .combat-bar,
.combat-card--enemy.combat-card--boss-ghostrealm .combat-card__dmg {
    position: relative;
    z-index: 1;
}
.combat-card--enemy.combat-card--boss-ghostrealm .combat-card__title {
    text-shadow: 0 0 14px rgba(180, 140, 255, 0.45);
}
.combat-boss-tag--ghostrealm {
    border-color: rgba(180, 140, 255, 0.55);
    background: linear-gradient(135deg, rgba(40, 20, 80, 0.9), rgba(16, 8, 32, 0.95));
    color: rgba(220, 200, 255, 0.95);
    animation: combat-ghostrealm-tag 2.6s ease-in-out infinite;
}
.combat-boss-aura--ghostrealm {
    position: absolute;
    inset: -20%;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(160, 120, 255, 0.35) 0%, transparent 62%),
        conic-gradient(from 90deg, transparent, rgba(100, 200, 220, 0.12), rgba(180, 140, 255, 0.18), transparent 75%);
    animation: combat-ghostrealm-aura 7s ease-in-out infinite;
    pointer-events: none;
}
.combat-boss-aura--ghostrealm-wisps {
    position: absolute;
    inset: -30%;
    border-radius: 50%;
    background:
        radial-gradient(circle at 20% 70%, rgba(220, 200, 255, 0.25) 0%, transparent 25%),
        radial-gradient(circle at 75% 25%, rgba(140, 100, 255, 0.2) 0%, transparent 22%),
        radial-gradient(circle at 50% 50%, rgba(100, 200, 220, 0.12) 0%, transparent 30%);
    animation: combat-ghostrealm-wisps 5s ease-in-out infinite alternate;
    pointer-events: none;
}
.combat-avatar--boss-ghostrealm {
    box-shadow:
        0 0 0 1px rgba(180, 140, 255, 0.4),
        0 0 28px rgba(120, 80, 220, 0.45);
    animation: combat-ghostrealm-avatar 3.4s ease-in-out infinite;
}
.combat-boss-icon--ghostrealm {
    color: rgba(220, 200, 255, 0.95);
    filter: drop-shadow(0 0 10px rgba(160, 120, 255, 0.75));
}
@keyframes combat-ghostrealm-card {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.1); }
}
@keyframes combat-ghostrealm-mist {
    to { background-position: 0 40px; }
}
@keyframes combat-ghostrealm-tag {
    0%, 100% { box-shadow: 0 0 8px rgba(120, 80, 220, 0.25); }
    50% { box-shadow: 0 0 18px rgba(180, 140, 255, 0.5); }
}
@keyframes combat-ghostrealm-aura {
    0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.7; }
    50% { transform: scale(1.1) rotate(8deg); opacity: 1; }
}
@keyframes combat-ghostrealm-wisps {
    from { transform: translateY(4px) scale(0.95); opacity: 0.55; }
    to { transform: translateY(-6px) scale(1.05); opacity: 0.95; }
}
@keyframes combat-ghostrealm-avatar {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.04); }
}

/* ========== 洞天劫 · 修仙股票（自 dilao 移植） ========== */
.dongtian-hub-menu-card--stock {
    border-color: rgba(210, 180, 90, 0.42);
    background: linear-gradient(155deg, rgba(28, 24, 10, 0.92), rgba(10, 10, 8, 0.97));
    box-shadow:
        inset 0 1px 0 rgba(255, 230, 150, 0.06),
        0 0 22px rgba(200, 160, 60, 0.18);
}
.dongtian-hub-menu-card--stock .dongtian-hub-menu-card__glyph {
    color: rgba(255, 220, 120, 0.32);
    text-shadow: 0 0 18px rgba(220, 180, 60, 0.45);
}
.dongtian-lingtian-sheet {
    max-width: 34rem;
}
.dongtian-lingtian-body {
    max-height: min(78vh, 38rem);
    overflow-y: auto;
}
.lingtian-tabbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.65rem;
}
.lingtian-plot-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
}
.lingtian-plot {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    padding: 0.45rem;
    background: rgba(8, 14, 22, 0.58);
}
.lingtian-plot__head {
    font-size: 0.78rem;
    opacity: 0.86;
}
.lingtian-plot__name {
    margin: 0.3rem 0 0.15rem;
    font-size: 0.86rem;
    font-weight: 600;
}
.lingtian-plot__meta {
    margin: 0;
    font-size: 0.74rem;
    opacity: 0.8;
}
.lingtian-list {
    list-style: none;
    margin: 0.4rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.lingtian-scroll-pane {
    overflow-y: auto;
    padding-right: 0.2rem;
}
.lingtian-scroll-pane--seed {
    max-height: min(32vh, 12.5rem);
}
.lingtian-scroll-pane--codex {
    max-height: min(36vh, 15rem);
}
.lingtian-scroll-pane--herb {
    max-height: min(40vh, 16.5rem);
}
.lingtian-input-modal {
    position: fixed;
    inset: 0;
    z-index: 5210;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    background: rgba(3, 6, 12, 0.68);
}
.lingtian-input-modal__card {
    width: min(92vw, 27rem);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: linear-gradient(180deg, rgba(14, 22, 34, 0.98), rgba(8, 12, 22, 0.98));
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.45);
    padding: 0.8rem;
}
.lingtian-input-modal__title {
    margin: 0 0 0.35rem;
    font-size: 0.92rem;
    font-weight: 600;
}
.lingtian-input-modal__input {
    width: 100%;
    margin-top: 0.4rem;
}
.lingtian-input-modal__actions {
    margin-top: 0.75rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.45rem;
}
.lingtian-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.45rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(255, 255, 255, 0.03);
}
.lingtian-row > span:last-child {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    align-items: center;
    justify-content: flex-end;
    max-width: 100%;
}
.lingtian-row__meta {
    font-size: 0.78rem;
    opacity: 0.82;
}
.lingtian-codex-group-title {
    list-style: none;
    margin: 0.2rem 0 0.1rem;
    padding: 0.2rem 0.1rem;
    font-size: 0.76rem;
    letter-spacing: 0.06em;
    color: rgba(228, 213, 160, 0.92);
}
/* 洞天劫 · 剑灵云游（玄卷分页 · 修仙向） */
.dongtian-sword-spirit-sheet {
    position: relative;
    overflow: hidden;
    max-width: 40rem;
    width: min(40rem, 96vw);
    border: 1px solid rgba(200, 165, 90, 0.35);
    background:
        radial-gradient(ellipse 100% 55% at 50% -15%, rgba(120, 85, 40, 0.18), transparent 50%),
        radial-gradient(ellipse 70% 45% at 100% 100%, rgba(40, 90, 120, 0.16), transparent 48%),
        radial-gradient(ellipse 50% 40% at 0% 80%, rgba(60, 140, 110, 0.1), transparent 45%),
        linear-gradient(172deg, rgba(8, 12, 22, 0.99), rgba(4, 8, 16, 0.995));
    box-shadow:
        0 0 0 1px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(180, 140, 60, 0.08),
        0 24px 64px rgba(0, 8, 24, 0.65),
        inset 0 1px 0 rgba(255, 230, 180, 0.06);
}
.dt-ss-ambient {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-ambient__mist {
    position: absolute;
    inset: -25% -12%;
    background: radial-gradient(ellipse at 40% 15%, rgba(180, 210, 200, 0.07), transparent 52%);
    opacity: 0.95;
    animation: dt-ss-float 16s ease-in-out infinite;
}
.dt-ss-ambient__glow {
    position: absolute;
    right: -18%;
    top: 5%;
    width: 58%;
    height: 75%;
    background: radial-gradient(circle, rgba(220, 180, 90, 0.1), transparent 62%);
    filter: blur(3px);
    animation: dt-ss-pulse 9s ease-in-out infinite;
}
.dt-ss-ambient__seal {
    position: absolute;
    left: 4%;
    bottom: 6%;
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: clamp(3.8rem, 15vw, 6.2rem);
    font-weight: 700;
    color: rgba(200, 160, 80, 0.055);
    transform: rotate(-11deg);
    letter-spacing: 0.25em;
    text-shadow: 0 0 40px rgba(255, 200, 120, 0.04);
}
.dt-ss-ambient__sigil {
    position: absolute;
    right: 8%;
    top: 42%;
    width: 4.5rem;
    height: 4.5rem;
    border: 1px solid rgba(200, 170, 100, 0.12);
    border-radius: 50%;
    box-shadow:
        inset 0 0 20px rgba(255, 220, 160, 0.04),
        0 0 24px rgba(100, 180, 160, 0.06);
    opacity: 0.65;
    animation: dt-ss-pulse 11s ease-in-out infinite reverse;
}
@keyframes dt-ss-float {
    0%,
    100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(3%, 2%);
    }
}
@keyframes dt-ss-pulse {
    0%,
    100% {
        opacity: 0.55;
    }
    50% {
        opacity: 1;
    }
}
.dongtian-sword-spirit-head,
.dongtian-sword-spirit-body {
    position: relative;
    z-index: 1;
}
.dt-ss-eyebrow {
    color: rgba(220, 195, 140, 0.88) !important;
    letter-spacing: 0.22em !important;
    font-family: "STKaiti", "KaiTi", "SimSun", serif !important;
}
.dt-ss-title {
    font-family: "ZCOOL XiaoWei", "STKaiti", "KaiTi", "SimSun", serif;
    background: linear-gradient(100deg, #fff9e8, #e8c878, #c9a050, #f5ecd8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 0 14px rgba(200, 150, 60, 0.35));
}
.dt-ss-sub {
    color: rgba(195, 210, 200, 0.78) !important;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif !important;
    line-height: 1.55 !important;
}
.dt-ss-head-btn {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.08em;
}
.dongtian-sword-spirit-body {
    max-height: min(84vh, 42rem);
    overflow: hidden;
    overscroll-behavior: contain;
    padding: 0 0.55rem 0.55rem;
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.dt-ss-xuan-frame {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    border: 1px solid rgba(160, 130, 70, 0.22);
    background: linear-gradient(180deg, rgba(12, 18, 28, 0.55), rgba(6, 10, 18, 0.72));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.dt-ss-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.15rem;
    padding: 0.35rem 0.35rem 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    border-bottom: 1px solid rgba(120, 90, 50, 0.35);
    background: linear-gradient(180deg, rgba(20, 16, 12, 0.5), transparent);
}
.dt-ss-tabs::-webkit-scrollbar {
    height: 4px;
}
.dt-ss-tabs::-webkit-scrollbar-thumb {
    background: rgba(180, 150, 90, 0.35);
    border-radius: 4px;
}
.dt-ss-tab {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    padding: 0.42rem 0.65rem 0.5rem;
    margin: 0;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 8px 8px 0 0;
    background: transparent;
    color: rgba(165, 185, 175, 0.72);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    cursor: pointer;
    white-space: nowrap;
    transition:
        color 0.15s,
        background 0.15s,
        border-color 0.15s;
}
.dt-ss-tab:hover {
    color: rgba(230, 220, 200, 0.92);
    background: rgba(80, 60, 30, 0.2);
}
.dt-ss-tab__glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 6px;
    font-size: 0.68rem;
    color: rgba(220, 190, 130, 0.75);
    border: 1px solid rgba(180, 150, 90, 0.28);
    background: rgba(30, 22, 14, 0.45);
}
.dt-ss-tab--active {
    color: rgba(255, 240, 210, 0.96);
    background: linear-gradient(180deg, rgba(60, 45, 25, 0.55), rgba(20, 18, 14, 0.15));
    border-bottom-color: rgba(230, 190, 100, 0.85);
    box-shadow: 0 -1px 12px rgba(200, 160, 80, 0.12);
}
.dt-ss-tab--active .dt-ss-tab__glyph {
    color: rgba(255, 230, 160, 0.95);
    border-color: rgba(230, 190, 120, 0.45);
    background: rgba(50, 38, 18, 0.65);
}
.dt-ss-tab-panels {
    flex: 1;
    min-height: 0;
    position: relative;
}
.dt-ss-tab-panel {
    display: none;
    padding: 0.5rem 0.45rem 0.55rem;
    max-height: min(58vh, 30rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.dt-ss-tab-panel--active {
    display: block;
}
.dt-ss-xuan-card {
    margin: 0;
    padding: 0.85rem 0.9rem 1rem;
    border-radius: 10px;
    border: 1px solid rgba(150, 120, 70, 0.28);
    background:
        linear-gradient(135deg, rgba(28, 32, 48, 0.88), rgba(12, 14, 22, 0.94)),
        radial-gradient(ellipse 80% 50% at 100% 0%, rgba(100, 80, 40, 0.12), transparent 55%);
    box-shadow:
        inset 0 1px 0 rgba(255, 220, 180, 0.05),
        0 8px 28px rgba(0, 0, 0, 0.35);
}
.dt-ss-xuan-verse {
    margin: 0 0 0.65rem;
    padding: 0 0 0.55rem;
    border-bottom: 1px dashed rgba(140, 120, 80, 0.28);
    font-size: 0.78rem;
    font-style: italic;
    color: rgba(200, 175, 130, 0.72);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.12em;
}
.dt-ss-panel--inner {
    margin-bottom: 0.45rem;
    border-color: rgba(110, 140, 130, 0.22);
    background: rgba(4, 10, 16, 0.78);
}
.dt-ss-panel--scroll .dt-ss-log-list {
    max-height: min(48vh, 22rem);
}
.dt-ss-panel--dream-block {
    margin-top: 0.35rem;
}
.dt-ss-jian-hint {
    margin: 0 0 0.4rem;
}
.dt-ss-btn-primary {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.1em;
}
/* 剑灵云游：主操作可点时偏亮，禁用时明显压暗 */
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled) {
    cursor: pointer;
    opacity: 1;
    color: #fffef8;
    border-color: rgba(236, 200, 110, 0.88);
    background: linear-gradient(180deg, rgba(238, 205, 95, 0.58), rgba(200, 155, 55, 0.28));
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.28), inset 0 1px 0 rgba(255, 250, 220, 0.12);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled):hover {
    border-color: rgba(255, 220, 140, 0.95);
    background: linear-gradient(180deg, rgba(250, 218, 120, 0.68), rgba(210, 165, 60, 0.34));
    box-shadow: 0 0 22px rgba(212, 175, 55, 0.42), inset 0 1px 0 rgba(255, 250, 220, 0.16);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:not(:disabled):active {
    transform: scale(0.98);
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:disabled {
    cursor: not-allowed;
    opacity: 1;
    color: rgba(120, 118, 108, 0.72);
    border-color: rgba(55, 58, 62, 0.65);
    background: linear-gradient(180deg, rgba(38, 40, 44, 0.72), rgba(22, 24, 28, 0.88));
    box-shadow: none;
    transform: none;
}
.dongtian-sword-spirit-sheet .dt-ss-btn-primary:disabled:hover {
    color: rgba(120, 118, 108, 0.72);
    border-color: rgba(55, 58, 62, 0.65);
    background: linear-gradient(180deg, rgba(38, 40, 44, 0.72), rgba(22, 24, 28, 0.88));
    box-shadow: none;
}
.dt-ss-btn-ghost {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.08em;
}
.dt-ss-dream-btn {
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.06em;
}
.dt-ss-phase {
    margin: 0 0 0.35rem;
    font-size: 0.98rem;
    font-weight: 600;
    color: rgba(255, 242, 220, 0.96);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    text-shadow: 0 0 18px rgba(200, 150, 80, 0.15);
}
.dt-ss-eta {
    margin: 0 0 0.25rem;
    font-size: 0.84rem;
    color: rgba(210, 225, 200, 0.88);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
}
.dt-ss-muted {
    margin: 0.15rem 0 0;
    font-size: 0.78rem;
    color: rgba(175, 190, 180, 0.76);
    line-height: 1.5;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}
@media (max-width: 520px) {
    .dt-ss-columns {
        grid-template-columns: 1fr;
    }
}
.dt-ss-panel {
    border-radius: 11px;
    border: 1px solid rgba(100, 160, 150, 0.2);
    background: rgba(6, 14, 18, 0.72);
    padding: 0.55rem 0.6rem 0.65rem;
    margin-bottom: 0.5rem;
}
.dt-ss-panel-title {
    margin: 0 0 0.45rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: rgba(240, 225, 190, 0.95);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.04em;
}
.dt-ss-panel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(90, 70, 40, 0.45), rgba(40, 55, 50, 0.4));
    border: 1px solid rgba(200, 170, 100, 0.32);
    font-size: 0.72rem;
    color: rgba(255, 230, 180, 0.92);
}
.dt-ss-pack-hint {
    margin: 0 0 0.45rem;
}
.dt-ss-pack-form {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    max-height: min(28vh, 14rem);
    overflow-y: auto;
    padding-right: 0.15rem;
}
.dt-ss-pack-row {
    display: grid;
    grid-template-columns: 1fr 3.2rem minmax(4rem, auto);
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
}
.dt-ss-pack-lbl {
    color: rgba(200, 230, 224, 0.88);
}
.dt-ss-pack-input {
    width: 100%;
    padding: 0.28rem 0.35rem;
    border-radius: 8px;
    border: 1px solid rgba(120, 180, 170, 0.28);
    background: rgba(0, 0, 0, 0.35);
    color: inherit;
    text-align: center;
    font-size: 0.8rem;
}
.dt-ss-pack-cap {
    font-size: 0.68rem;
    color: rgba(150, 185, 180, 0.65);
    white-space: nowrap;
}
.dt-ss-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0.55rem 0 0;
}
.dt-ss-log-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: min(32vh, 16rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.dt-ss-log__empty {
    padding: 0.5rem 0.2rem;
    font-size: 0.78rem;
    color: rgba(160, 190, 185, 0.7);
}
.dt-ss-log__item {
    padding: 0.45rem 0.4rem;
    margin-bottom: 0.35rem;
    border-radius: 9px;
    border: 1px solid rgba(90, 140, 130, 0.2);
    background: linear-gradient(90deg, rgba(20, 44, 42, 0.55), rgba(8, 16, 20, 0.5));
}
.dt-ss-log__time {
    display: block;
    font-size: 0.65rem;
    color: rgba(140, 180, 175, 0.65);
    margin-bottom: 0.2rem;
}
.dt-ss-log__text {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: rgba(220, 245, 238, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-reward-box {
    font-size: 0.82rem;
    line-height: 1.5;
}
.dt-ss-reward-title {
    margin: 0 0 0.25rem;
    font-weight: 600;
    color: rgba(255, 230, 190, 0.88);
}
.dt-ss-reward-body {
    margin: 0;
    color: rgba(200, 230, 220, 0.9);
}
.dt-ss-dream-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.4rem;
}
.dt-ss-dream-effect-hint {
    margin: 0.35rem 0 0.15rem;
    font-size: 0.74rem;
    color: rgba(160, 185, 175, 0.72);
}
.dt-ss-dream-log-wrap {
    margin-top: 0.55rem;
    padding: 0.45rem 0.5rem 0.5rem;
    border-radius: 10px;
    border: 1px solid rgba(120, 100, 160, 0.22);
    background: rgba(8, 10, 22, 0.45);
}
.dt-ss-dream-log-head {
    margin: 0 0 0.35rem;
    font-size: 0.76rem;
    font-weight: 600;
    color: rgba(210, 190, 235, 0.82);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.12em;
}
.dt-ss-dream-msg-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 9.5rem;
    overflow-y: auto;
}
.dt-ss-dream-msg__item {
    margin: 0 0 0.4rem;
    padding: 0 0 0.35rem;
    border-bottom: 1px solid rgba(100, 90, 130, 0.2);
    font-size: 0.76rem;
    line-height: 1.45;
    color: rgba(195, 205, 215, 0.88);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-dream-msg__item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.dt-ss-dream-msg__time {
    display: block;
    font-size: 0.68rem;
    color: rgba(140, 155, 170, 0.75);
    margin-bottom: 0.12rem;
}
.dt-ss-dream-msg__empty {
    margin: 0;
    padding: 0.2rem 0;
    list-style: none;
    font-size: 0.74rem;
}
.dt-ss-panel--cang {
    padding-top: 0.45rem;
}
.dt-ss-subtabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.55rem;
    padding: 0.2rem 0 0.45rem;
    border-bottom: 1px solid rgba(140, 110, 60, 0.28);
}
.dt-ss-subtab {
    flex: 0 0 auto;
    padding: 0.28rem 0.75rem 0.32rem;
    margin: 0;
    border: 1px solid rgba(150, 120, 70, 0.35);
    border-radius: 999px;
    background: rgba(12, 18, 26, 0.65);
    color: rgba(175, 195, 185, 0.78);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    font-size: 0.76rem;
    letter-spacing: 0.12em;
    cursor: pointer;
    transition:
        color 0.15s,
        border-color 0.15s,
        background 0.15s,
        box-shadow 0.15s;
}
.dt-ss-subtab:hover {
    color: rgba(235, 225, 200, 0.92);
    border-color: rgba(200, 170, 100, 0.45);
    background: rgba(35, 28, 18, 0.55);
}
.dt-ss-subtab--active {
    color: rgba(40, 28, 12, 0.95);
    border-color: rgba(230, 190, 110, 0.65);
    background: linear-gradient(165deg, rgba(255, 230, 170, 0.95), rgba(210, 165, 90, 0.88));
    box-shadow: 0 0 14px rgba(220, 180, 90, 0.22);
}
.dt-ss-subpanel {
    display: none;
    padding-top: 0.15rem;
}
.dt-ss-subpanel--active {
    display: block;
}
.dt-ss-cang-hint {
    margin: 0 0 0.5rem;
}
.dt-ss-curio-count-line {
    margin: 0.5rem 0 0.35rem;
    font-size: 0.86rem;
    font-weight: 600;
    color: rgba(255, 228, 190, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
    letter-spacing: 0.04em;
}
.dt-ss-curio-bonus-head {
    margin: 0.35rem 0 0.25rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    color: rgba(200, 185, 150, 0.82);
    font-family: "STKaiti", "KaiTi", "SimSun", serif;
}
.dt-ss-curio-bonus-bits {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dt-ss-curio-bonus-bits__item {
    margin: 0 0 0.32rem;
    padding: 0.4rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(120, 100, 60, 0.25);
    background: rgba(8, 14, 22, 0.55);
    font-size: 0.8rem;
    color: rgba(220, 235, 225, 0.9);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-bonus-bits__empty {
    margin: 0;
    padding: 0.45rem 0.35rem;
    font-size: 0.78rem;
    color: rgba(165, 185, 175, 0.72);
    line-height: 1.5;
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-bonus,
.dt-ss-curio-bonus-line {
    margin: 0 0 0.45rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(255, 215, 160, 0.9);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
    gap: 0.45rem;
}
#dtSsCangPanelTujian .dt-ss-curio-grid {
    max-height: min(46vh, 22rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.15rem;
}
.dt-ss-curio-lore {
    display: block;
    margin-top: 0.38rem;
    font-size: 0.66rem;
    line-height: 1.35;
    color: rgba(165, 185, 175, 0.72);
    font-style: normal;
}

@keyframes dt-ss-curio-liuguang {
    0% {
        transform: translate3d(-130%, 0, 0) skewX(-16deg);
        opacity: 0;
    }
    14% {
        opacity: 0.9;
    }
    86% {
        opacity: 0.9;
    }
    100% {
        transform: translate3d(260%, 0, 0) skewX(-16deg);
        opacity: 0;
    }
}
@keyframes dt-ss-curio-mythic-glow {
    0%,
    100% {
        box-shadow:
            inset 0 0 52px rgba(255, 160, 70, 0.16),
            inset 0 0 88px rgba(120, 80, 190, 0.07),
            0 0 22px rgba(255, 185, 95, 0.34),
            0 0 1px rgba(255, 220, 170, 0.55);
    }
    50% {
        box-shadow:
            inset 0 0 68px rgba(255, 195, 115, 0.26),
            inset 0 0 100px rgba(130, 85, 200, 0.12),
            0 0 38px rgba(255, 210, 135, 0.58),
            0 0 2px rgba(255, 248, 210, 0.9);
    }
}
@keyframes dt-ss-curio-mythic-sheen {
    0% {
        opacity: 0.62;
    }
    100% {
        opacity: 0.96;
    }
}
@media (prefers-reduced-motion: reduce) {
    .dt-ss-curio-card::before,
    .dt-ss-curio-card::after {
        animation: none !important;
        opacity: 0 !important;
    }
    .dt-ss-curio-card--quality-mythic {
        animation: none !important;
    }
}

.dt-ss-curio-card {
    border-radius: 10px;
    padding: 0.4rem 0.45rem;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(145deg, rgba(40, 52, 48, 0.92), rgba(22, 30, 28, 0.95));
    border: 1px solid rgba(180, 210, 190, 0.18);
    font-size: 0.74rem;
    line-height: 1.35;
    color: rgba(215, 235, 225, 0.95);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-curio-card > * {
    position: relative;
    z-index: 1;
}
.dt-ss-curio-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.28rem 0.45rem;
}
.dt-ss-curio-head .dt-ss-curio-quality {
    margin-bottom: 0;
    flex-shrink: 0;
}
.dt-ss-curio-name {
    flex: 1 1 5.5rem;
    min-width: 0;
    font-weight: 600;
    font-size: 0.76rem;
    line-height: 1.35;
    color: rgba(255, 236, 200, 0.96);
    overflow-wrap: anywhere;
    word-break: break-word;
}
.dt-ss-curio-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.22rem 0.35rem;
    margin-top: 0.28rem;
    padding-top: 0.28rem;
    border-top: 1px solid rgba(120, 160, 145, 0.16);
}
.dt-ss-curio-stats--empty {
    margin-top: 0.15rem;
    padding-top: 0;
    border-top: none;
}
.dt-ss-curio-stat {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0.15rem;
    min-width: 0;
}
.dt-ss-curio-stat__k {
    flex: 0 0 auto;
    font-size: 0.65rem;
    color: rgba(165, 205, 188, 0.9);
}
.dt-ss-curio-stat__v {
    flex: 0 1 auto;
    font-size: 0.68rem;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: rgba(205, 238, 218, 0.96);
}
.dt-ss-curio-stat--empty {
    font-size: 0.68rem;
    color: rgba(150, 180, 168, 0.62);
}
@media (max-width: 420px) {
    .dt-ss-curio-stats {
        grid-template-columns: 1fr;
    }
}
.dt-ss-curio-quality {
    display: inline-block;
    font-size: 0.62rem;
    padding: 0.05rem 0.32rem;
    border-radius: 999px;
    margin-bottom: 0.14rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    letter-spacing: 0.02em;
}
.dt-ss-curio-quality--common {
    color: rgba(200, 215, 200, 0.95);
    background: rgba(55, 72, 62, 0.55);
}
.dt-ss-curio-quality--fine {
    color: rgba(165, 210, 255, 0.96);
    border-color: rgba(110, 170, 230, 0.35);
    background: rgba(40, 58, 72, 0.45);
    box-shadow: 0 0 6px rgba(95, 155, 215, 0.14);
}
.dt-ss-curio-quality--rare {
    color: rgba(210, 175, 255, 0.97);
    border-color: rgba(160, 120, 220, 0.4);
    background: rgba(48, 40, 62, 0.42);
    box-shadow: 0 0 8px rgba(180, 130, 255, 0.16);
}
.dt-ss-curio-quality--epic {
    color: rgba(255, 205, 145, 0.97);
    border-color: rgba(230, 150, 70, 0.45);
    background: rgba(62, 44, 28, 0.4);
    box-shadow: 0 0 10px rgba(255, 160, 70, 0.18);
}
.dt-ss-curio-quality--mythic {
    color: rgba(255, 245, 200, 0.98);
    border-color: rgba(255, 210, 120, 0.55);
    background: linear-gradient(135deg, rgba(80, 55, 30, 0.55), rgba(45, 32, 52, 0.55));
    box-shadow: 0 0 12px rgba(255, 190, 90, 0.2);
}

.dt-ss-curio-card--quality-common {
    border-color: rgba(150, 175, 162, 0.26);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}
.dt-ss-curio-card--quality-fine {
    border-color: rgba(115, 175, 225, 0.4);
    background: linear-gradient(152deg, rgba(34, 48, 62, 0.96), rgba(20, 28, 38, 0.98));
    box-shadow: inset 0 0 36px rgba(70, 130, 190, 0.11), 0 0 18px rgba(80, 145, 205, 0.16);
}
.dt-ss-curio-card--quality-fine::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -20%;
    width: 55%;
    height: 200%;
    background: linear-gradient(
        102deg,
        transparent 0%,
        rgba(120, 190, 255, 0) 38%,
        rgba(155, 210, 255, 0.22) 48%,
        rgba(215, 245, 255, 0.4) 50%,
        rgba(155, 210, 255, 0.22) 52%,
        rgba(120, 190, 255, 0) 64%,
        transparent 100%
    );
    transform: translate3d(-120%, 0, 0) skewX(-17deg);
    animation: dt-ss-curio-liuguang 5.8s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-rare {
    border-color: rgba(175, 130, 230, 0.45);
    background: linear-gradient(148deg, rgba(52, 38, 68, 0.96), rgba(24, 18, 36, 0.98));
    box-shadow: inset 0 0 42px rgba(130, 90, 180, 0.13), 0 0 24px rgba(150, 100, 210, 0.24);
}
.dt-ss-curio-card--quality-rare::before {
    content: "";
    position: absolute;
    top: -55%;
    left: -25%;
    width: 58%;
    height: 210%;
    background: linear-gradient(
        102deg,
        transparent 0%,
        rgba(160, 110, 220, 0) 36%,
        rgba(200, 150, 255, 0.24) 47%,
        rgba(240, 220, 255, 0.45) 50%,
        rgba(200, 150, 255, 0.24) 53%,
        rgba(160, 110, 220, 0) 66%,
        transparent 100%
    );
    transform: translate3d(-130%, 0, 0) skewX(-16deg);
    animation: dt-ss-curio-liuguang 4.35s ease-in-out infinite;
    animation-delay: 0.35s;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-epic {
    border-color: rgba(235, 155, 75, 0.5);
    background: linear-gradient(145deg, rgba(68, 44, 28, 0.96), rgba(28, 18, 14, 0.98));
    box-shadow: inset 0 0 46px rgba(255, 130, 55, 0.12), 0 0 28px rgba(220, 125, 55, 0.3);
}
.dt-ss-curio-card--quality-epic::before {
    content: "";
    position: absolute;
    top: -55%;
    left: -22%;
    width: 60%;
    height: 210%;
    background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 170, 80, 0) 34%,
        rgba(255, 200, 120, 0.3) 46%,
        rgba(255, 248, 215, 0.55) 50%,
        rgba(255, 200, 120, 0.3) 54%,
        rgba(255, 170, 80, 0) 66%,
        transparent 100%
    );
    transform: translate3d(-135%, 0, 0) skewX(-15deg);
    animation: dt-ss-curio-liuguang 3.25s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-mythic {
    border-color: rgba(255, 215, 140, 0.58);
    background: linear-gradient(128deg, rgba(72, 48, 28, 0.97), rgba(42, 26, 52, 0.98), rgba(26, 20, 16, 0.99));
    animation: dt-ss-curio-mythic-glow 3s ease-in-out infinite;
}
.dt-ss-curio-card--quality-mythic::before {
    content: "";
    position: absolute;
    top: -60%;
    left: -18%;
    width: 65%;
    height: 220%;
    background: linear-gradient(
        98deg,
        transparent 0%,
        rgba(255, 200, 90, 0) 30%,
        rgba(255, 220, 150, 0.38) 44%,
        rgba(255, 252, 235, 0.68) 50%,
        rgba(190, 225, 255, 0.45) 52%,
        rgba(255, 200, 120, 0.38) 56%,
        rgba(255, 175, 85, 0) 70%,
        transparent 100%
    );
    transform: translate3d(-140%, 0, 0) skewX(-14deg);
    animation: dt-ss-curio-liuguang 2.4s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}
.dt-ss-curio-card--quality-mythic::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(120% 90% at 28% 0%, rgba(255, 200, 110, 0.22), transparent 52%),
        radial-gradient(95% 75% at 100% 100%, rgba(160, 115, 255, 0.16), transparent 52%);
    pointer-events: none;
    z-index: 0;
    animation: dt-ss-curio-mythic-sheen 5.5s ease-in-out infinite alternate;
}

.dt-ss-curio-card--quality-epic .dt-ss-curio-name {
    text-shadow: 0 0 14px rgba(255, 180, 90, 0.22);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-name {
    color: rgba(255, 248, 225, 0.99);
    text-shadow: 0 0 18px rgba(255, 195, 110, 0.35), 0 0 42px rgba(200, 140, 255, 0.12);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-stats {
    border-top-color: rgba(255, 200, 130, 0.22);
}
.dt-ss-curio-card--quality-mythic .dt-ss-curio-stat__v {
    color: rgba(230, 255, 240, 0.98);
}
.dt-ss-curio-card__name {
    font-weight: 600;
    color: rgba(255, 236, 200, 0.95);
    margin-bottom: 0.15rem;
}
.dt-ss-curio-card__bonus {
    font-size: 0.7rem;
    opacity: 0.88;
    color: rgba(190, 230, 210, 0.9);
}
.dt-ss-reward-curio {
    margin: 0.45rem 0 0;
    padding: 0.35rem 0.4rem;
    border-radius: 8px;
    background: rgba(60, 90, 72, 0.28);
    border: 1px solid rgba(200, 220, 180, 0.15);
    font-size: 0.78rem;
    line-height: 1.45;
    color: rgba(230, 248, 235, 0.92);
    font-family: "STKaiti", "KaiTi", "SimSun", "Noto Sans SC", sans-serif;
}
.dt-ss-reward-curio em {
    font-style: normal;
    color: rgba(255, 214, 150, 0.9);
}
.dt-ss-log__item--qiwen .dt-ss-log__text {
    color: rgba(255, 200, 160, 0.95);
    text-shadow: 0 0 12px rgba(255, 140, 80, 0.22);
}
.dongtian-word-guess-sheet {
    max-width: 31rem;
}
.dongtian-word-guess-body {
    max-height: min(78vh, 35rem);
    overflow-y: auto;
}
.word-guess-history-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
}
.word-guess-history-word {
    font-weight: 600;
}
.word-guess-history-score {
    opacity: 0.82;
    font-size: 0.78rem;
}
.word-guess-history-list {
    max-height: min(44vh, 16.5rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.18rem;
}
.word-guess-history-list::-webkit-scrollbar {
    width: 7px;
}
.word-guess-history-list::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(196, 168, 106, 0.45);
}
.modal-container--stock {
    z-index: 5002 !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    min-height: 100% !important;
    min-height: 100dvh !important;
    max-height: none !important;
    padding: max(0.65rem, env(safe-area-inset-top)) max(0.65rem, env(safe-area-inset-right))
        max(0.65rem, env(safe-area-inset-bottom)) max(0.65rem, env(safe-area-inset-left));
    isolation: isolate;
    pointer-events: auto;
    overscroll-behavior: contain;
    touch-action: manipulation;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.dongtian-stock-sheet {
    width: min(100%, 58rem);
    max-width: 58rem;
    max-height: min(94dvh, 56rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
.dongtian-stock-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding-bottom: 0.35rem;
}
.dongtian-stock-head .wushen-arena-title {
    font-size: 1.45rem;
}
.dongtian-stock-head .wushen-arena-sub {
    font-size: 0.92rem;
    line-height: 1.5;
}
.dongtian-stock-head .wushen-arena-head-actions {
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.dt-stock-head-balance {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    margin-right: 0.25rem;
    font-size: 0.74rem;
    color: rgba(210, 220, 235, 0.88);
    line-height: 1.3;
}
.dt-stock-head-balance strong {
    color: rgba(255, 230, 160, 0.95);
    font-size: 0.92rem;
    font-weight: 700;
}
.dt-stock-tick-line {
    margin-top: 0.25rem;
    font-size: 0.76rem;
    color: rgba(210, 220, 235, 0.82);
}
.dt-stock-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0 0.85rem 0.55rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dt-stock-tab {
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(8, 12, 18, 0.55);
    color: rgba(230, 235, 245, 0.82);
    border-radius: 999px;
    padding: 0.28rem 0.75rem;
    font-size: 0.78rem;
    cursor: pointer;
}
.dt-stock-tab--active {
    border-color: rgba(220, 180, 80, 0.55);
    background: rgba(60, 48, 16, 0.55);
    color: rgba(255, 230, 160, 0.95);
}
.dt-stock-panel {
    display: none;
}
.dt-stock-panel--active {
    display: block;
}
.dt-stock-trade-layout {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.dt-stock-trade-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 17.5rem);
    gap: 0.65rem;
    align-items: start;
}
.dt-stock-trade-main {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-width: 0;
}
.dt-stock-trade-side {
    position: sticky;
    top: 0;
}
.dt-stock-quote-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.45rem;
}
.dt-stock-quote-pill {
    display: inline-block;
    font-size: 0.68rem;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(8, 12, 18, 0.45);
    opacity: 0.9;
}
.dt-stock-chart-panel {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(10, 14, 22, 0.92), rgba(4, 8, 14, 0.96));
    overflow: hidden;
}
.dt-stock-chart-head--rich {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.55rem 0.65rem 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.dt-stock-chart-head--rich strong {
    display: block;
    font-size: 0.82rem;
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-chart-head--rich span {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.66rem;
    opacity: 0.72;
}
.dt-stock-chart-head__right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    font-size: 0.72rem;
    font-weight: 600;
}
.dt-stock-chart-canvas-wrap {
    padding: 0.15rem 0.35rem 0;
    background: rgba(0, 0, 0, 0.12);
}
.dt-stock-chart--main {
    min-height: 9.5rem;
}
.dt-stock-chart-ohlc {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.45rem 0.55rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.dt-stock-chart-metric {
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(8, 12, 18, 0.55);
    padding: 0.35rem 0.4rem;
    text-align: center;
}
.dt-stock-chart-metric__k {
    display: block;
    font-size: 0.64rem;
    opacity: 0.72;
}
.dt-stock-chart-metric__v {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: rgba(255, 230, 160, 0.94);
}
.dt-stock-chart-metric--up .dt-stock-chart-metric__v { color: rgba(90, 220, 160, 0.95); }
.dt-stock-chart-metric--down .dt-stock-chart-metric__v { color: rgba(240, 110, 110, 0.95); }
.dt-stock-chart-insight {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
    padding: 0.45rem 0.55rem 0.35rem;
}
.dt-stock-range-bar__head,
.dt-stock-range-bar__foot {
    display: flex;
    justify-content: space-between;
    gap: 0.35rem;
    font-size: 0.66rem;
    opacity: 0.82;
}
.dt-stock-range-bar__head { margin-bottom: 0.28rem; }
.dt-stock-range-bar__foot { margin-top: 0.22rem; opacity: 0.68; }
.dt-stock-range-bar__track {
    position: relative;
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: visible;
}
.dt-stock-range-bar__track i {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(80, 140, 200, 0.45), rgba(220, 180, 80, 0.75));
}
.dt-stock-range-bar--band .dt-stock-range-bar__track i {
    background: linear-gradient(90deg, rgba(80, 180, 120, 0.35), rgba(220, 180, 80, 0.65), rgba(200, 80, 80, 0.35));
}
.dt-stock-range-bar__track b {
    position: absolute;
    top: 50%;
    width: 10px;
    height: 10px;
    margin-left: -5px;
    margin-top: -5px;
    border-radius: 50%;
    background: rgba(255, 230, 160, 0.95);
    border: 2px solid rgba(20, 16, 8, 0.85);
    box-shadow: 0 0 8px rgba(220, 180, 80, 0.45);
}
.dt-stock-chart-foot {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.35rem 0.55rem 0.55rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.dt-stock-feed {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    padding: 0.5rem 0.55rem;
    background: rgba(6, 10, 16, 0.62);
}
.dt-stock-feed-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
}
.dt-stock-feed-head h5 {
    margin: 0;
    font-size: 0.78rem;
    color: rgba(255, 230, 160, 0.9);
}
.dt-stock-feed-head span {
    font-size: 0.66rem;
    opacity: 0.7;
}
.dt-stock-feed-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
}
.dt-stock-feed-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.35rem;
    align-items: center;
    font-size: 0.72rem;
    padding: 0.28rem 0.25rem;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.02);
}
.dt-stock-feed-main {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dt-stock-feed-empty {
    padding: 0.35rem 0.25rem;
}
.dt-stock-focus {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.dt-stock-nav {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.15rem;
}
.dt-stock-nav__btn {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(8, 12, 18, 0.75);
    color: rgba(255, 230, 160, 0.92);
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
}
.dt-stock-nav__center {
    text-align: center;
    min-width: 0;
}
.dt-stock-nav__center strong {
    display: inline;
    margin-right: 0.35rem;
    font-size: 0.92rem;
}
.dt-stock-nav__idx {
    display: block;
    font-size: 0.68rem;
    opacity: 0.65;
    margin-bottom: 0.12rem;
}
.dt-stock-nav__list {
    white-space: nowrap;
    font-size: 0.72rem;
    padding-left: 0.45rem;
    padding-right: 0.45rem;
}
.dt-stock-hero--focus {
    margin: 0;
}
.dt-stock-hero__sub {
    margin: 0.35rem 0 0;
    font-size: 0.72rem;
    opacity: 0.72;
}
.dt-stock-stat-row--focus {
    margin: 0;
}
.dt-stock-trade-box {
    border: 1px solid rgba(220, 180, 80, 0.22);
    border-radius: 10px;
    padding: 0.7rem 0.75rem;
    background: linear-gradient(180deg, rgba(20, 18, 10, 0.55), rgba(8, 10, 14, 0.82));
}
.dt-stock-trade-box__title {
    margin: 0 0 0.35rem;
    font-size: 0.88rem;
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-trade-box__meta {
    margin: 0 0 0.55rem;
    font-size: 0.74rem;
    opacity: 0.85;
}
.dt-stock-est-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
    margin-top: 0.45rem;
}
.dt-stock-trade-btns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
    margin-top: 0.55rem;
}
.dt-stock-trade-btns .btn {
    width: 100%;
}
@media (max-width: 520px) {
    .dt-stock-trade-split {
        grid-template-columns: 1fr;
    }
    .dt-stock-trade-side {
        position: static;
    }
    .dt-stock-chart-ohlc,
    .dt-stock-chart-foot {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dt-stock-chart-insight {
        grid-template-columns: 1fr;
    }
    .dt-stock-nav {
        grid-template-columns: auto 1fr auto;
    }
    .dt-stock-nav__list {
        grid-column: 1 / -1;
        justify-self: center;
    }
    .dt-stock-est-grid,
    .dt-stock-trade-btns {
        grid-template-columns: 1fr;
    }
}
.dt-stock-hero {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(135deg, rgba(18, 22, 32, 0.95), rgba(8, 10, 16, 0.98));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.dt-stock-hero.dt-stock-pct--up {
    border-color: rgba(80, 200, 140, 0.28);
    box-shadow: 0 0 24px rgba(60, 180, 120, 0.12);
}
.dt-stock-hero.dt-stock-pct--down {
    border-color: rgba(220, 90, 90, 0.28);
    box-shadow: 0 0 24px rgba(200, 70, 70, 0.1);
}
.dt-stock-hero__glyph {
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.45rem;
    font-weight: 700;
    color: rgba(255, 230, 160, 0.92);
    background: linear-gradient(160deg, rgba(80, 64, 24, 0.85), rgba(24, 18, 8, 0.95));
    border: 1px solid rgba(220, 180, 80, 0.35);
}
.dt-stock-hero__body {
    flex: 1 1 auto;
    min-width: 0;
}
.dt-stock-hero__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
}
.dt-stock-hero__title-row h4 {
    margin: 0;
    font-size: 1.05rem;
}
.dt-stock-code {
    font-size: 0.72rem;
    opacity: 0.72;
    letter-spacing: 0.05em;
}
.dt-stock-sector-badge {
    display: inline-block;
    padding: 0.08rem 0.45rem;
    border-radius: 999px;
    font-size: 0.68rem;
    border: 1px solid rgba(220, 180, 80, 0.35);
    background: rgba(50, 40, 12, 0.55);
    color: rgba(255, 230, 160, 0.9);
}
.dt-stock-sector-badge--sm {
    font-size: 0.64rem;
    padding: 0.05rem 0.35rem;
}
.dt-stock-hero__price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.45rem;
}
.dt-stock-price {
    font-weight: 700;
    color: rgba(255, 230, 160, 0.96);
}
.dt-stock-price--hero {
    font-size: 1.65rem;
    line-height: 1.1;
}
.dt-stock-diff {
    font-size: 0.78rem;
    opacity: 0.88;
}
.dt-stock-pct {
    font-size: 0.82rem;
    font-weight: 600;
}
.dt-stock-pct--up {
    color: rgba(90, 220, 160, 0.95);
}
.dt-stock-pct--down {
    color: rgba(240, 110, 110, 0.95);
}
.dt-stock-pct--flat {
    color: rgba(180, 190, 200, 0.85);
}
.dt-stock-stat-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
}
.dt-stock-stat {
    padding: 0.45rem 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(6, 10, 16, 0.72);
}
.dt-stock-stat--buy {
    border-color: rgba(80, 200, 140, 0.22);
}
.dt-stock-stat__k {
    display: block;
    font-size: 0.68rem;
    opacity: 0.72;
}
.dt-stock-stat__v {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.82rem;
    font-weight: 600;
}
.dt-stock-picker {
    display: flex;
    gap: 0.4rem;
    overflow-x: auto;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
}
.dt-stock-picker__chip {
    flex: 0 0 auto;
    min-width: 7.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(8, 12, 18, 0.65);
    padding: 0.4rem 0.5rem;
    text-align: left;
    cursor: pointer;
    color: inherit;
}
.dt-stock-picker__chip--active {
    border-color: rgba(220, 180, 80, 0.5);
    background: rgba(48, 38, 12, 0.65);
}
.dt-stock-picker__name {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
}
.dt-stock-picker__meta {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.68rem;
    opacity: 0.82;
}
.dt-stock-chart-wrap {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(4, 8, 14, 0.72);
    overflow: hidden;
}
.dt-stock-chart-wrap--main {
    margin: 0;
}
.dt-stock-chart-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0.55rem 0;
    font-size: 0.72rem;
    opacity: 0.78;
}
.dt-stock-chart,
.dt-stock-spark {
    display: block;
    width: 100%;
    height: auto;
}
.dt-stock-desk {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}
.dt-stock-desk__col {
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0.65rem;
    background: rgba(6, 10, 16, 0.62);
}
.dt-stock-desk__col--buy {
    border-color: rgba(80, 200, 140, 0.22);
    background: linear-gradient(180deg, rgba(12, 28, 22, 0.55), rgba(6, 10, 14, 0.75));
}
.dt-stock-desk__col--sell {
    border-color: rgba(220, 120, 100, 0.2);
    background: linear-gradient(180deg, rgba(28, 14, 14, 0.45), rgba(6, 10, 14, 0.75));
}
.dt-stock-desk__title {
    margin: 0 0 0.35rem;
    font-size: 0.88rem;
}
.dt-stock-desk__hint {
    margin: 0 0 0.45rem;
    font-size: 0.72rem;
    opacity: 0.82;
}
.dt-stock-desk__hint--ghost {
    min-height: 2.35rem;
    opacity: 0.45;
}
.dt-stock-desk__btn {
    width: 100%;
    margin-top: 0.45rem;
}
.dt-stock-label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.76rem;
    opacity: 0.88;
}
.dt-stock-qty {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 6px;
    background: rgba(6, 10, 16, 0.85);
    color: inherit;
    padding: 0.45rem 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
}
.dt-stock-qty-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.45rem;
}
.dt-stock-qty-preset {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    background: rgba(10, 14, 20, 0.75);
    color: inherit;
    padding: 0.18rem 0.55rem;
    font-size: 0.72rem;
    cursor: pointer;
}
.dt-stock-qty-preset--max {
    border-color: rgba(220, 180, 80, 0.4);
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-est-line {
    margin: 0.45rem 0 0;
    font-size: 0.76rem;
    opacity: 0.88;
}
.dt-stock-asset-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin-bottom: 0.75rem;
}
.dt-stock-summary-k {
    display: block;
    font-size: 0.72rem;
    opacity: 0.75;
}
.dt-stock-summary-v {
    display: block;
    margin-top: 0.15rem;
    font-size: 1rem;
}
.dt-stock-table-wrap {
    overflow-x: auto;
}
.dt-stock-table-wrap--market {
    max-height: min(52vh, 24rem);
    overflow-y: auto;
}
.dt-stock-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.76rem;
}
.dt-stock-table th,
.dt-stock-table td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.48rem 0.4rem;
    text-align: left;
    vertical-align: middle;
}
.dt-stock-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: rgba(12, 16, 24, 0.96);
    font-weight: 600;
    opacity: 0.88;
}
.dt-stock-market-table tbody tr {
    cursor: pointer;
    transition: background 0.15s ease;
}
.dt-stock-market-table tbody tr:hover {
    background: rgba(220, 180, 80, 0.08);
}
.dt-stock-asset-tip {
    margin: 0 0 0.45rem;
    font-size: 0.74rem;
}
.dt-stock-asset-table tbody tr,
.dt-stock-ledger-row {
    cursor: pointer;
    transition: background 0.15s ease;
}
.dt-stock-asset-table tbody tr:hover,
.dt-stock-ledger-row:hover {
    background: rgba(220, 180, 80, 0.08);
}
.dt-stock-market-code {
    font-weight: 700;
    letter-spacing: 0.04em;
    color: rgba(255, 230, 160, 0.88);
}
.dt-stock-market-price {
    font-weight: 600;
}
.dt-stock-market-spark-cell {
    width: 7.5rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}
.dt-stock-market-tip {
    margin: 0 0 0.5rem;
    font-size: 0.74rem;
}
.dt-stock-market-card {
    padding-bottom: 0.25rem;
}
.dt-stock-ledger {
    list-style: none;
    margin: 0.35rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.78rem;
}
.dt-stock-hero__desc {
    margin: 0.45rem 0 0;
    font-size: 0.76rem;
    line-height: 1.45;
    opacity: 0.82;
    max-width: 36rem;
}
.dt-stock-tier {
    display: inline-block;
    padding: 0.06rem 0.4rem;
    border-radius: 999px;
    font-size: 0.64rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    margin-left: 0.25rem;
}
.dt-stock-tier--common { color: rgba(200, 210, 220, 0.85); }
.dt-stock-tier--fine { color: rgba(160, 210, 255, 0.9); border-color: rgba(100, 160, 220, 0.35); }
.dt-stock-tier--rare { color: rgba(160, 230, 180, 0.92); border-color: rgba(80, 180, 120, 0.35); }
.dt-stock-tier--epic { color: rgba(220, 180, 255, 0.92); border-color: rgba(160, 100, 220, 0.35); }
.dt-stock-tier--legend { color: rgba(255, 220, 120, 0.95); border-color: rgba(220, 180, 80, 0.45); background: rgba(60, 48, 12, 0.35); }
.dt-stock-stat-row--6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dt-stock-pos-banner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(8, 12, 18, 0.55);
    font-size: 0.74rem;
}
.dt-stock-trade-box__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
    margin-bottom: 0.45rem;
}
.dt-stock-trade-box__tag {
    font-size: 0.68rem;
    opacity: 0.72;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(220, 180, 80, 0.25);
}
.dt-stock-trade-box__caps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-bottom: 0.55rem;
}
.dt-stock-cap-k {
    display: block;
    font-size: 0.68rem;
    opacity: 0.72;
}
.dt-stock-est-line--buy { border-left: 2px solid rgba(90, 220, 160, 0.65); padding-left: 0.45rem; }
.dt-stock-est-line--sell { border-left: 2px solid rgba(240, 110, 110, 0.65); padding-left: 0.45rem; }
.dt-stock-asset-summary--6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dt-stock-asset-summary--8 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
/* 资产详细 · 新排版 */
.dt-stock-assets-page {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.dt-stock-assets-split {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 0.65rem;
    align-items: stretch;
}
.dt-stock-panel-card {
    margin-bottom: 0;
}
.dt-stock-panel-card--account {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}
.dt-stock-panel-card--pl.dt-stock-pct--up {
    border-color: rgba(80, 200, 140, 0.22);
}
.dt-stock-panel-card--pl.dt-stock-pct--down {
    border-color: rgba(200, 80, 80, 0.22);
}
.dt-stock-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.55rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.dt-stock-section-head h4 {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-section-hint {
    font-size: 0.72rem;
    opacity: 0.68;
    white-space: nowrap;
}
.dt-stock-metric-grid {
    display: grid;
    gap: 0.45rem;
}
.dt-stock-metric-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dt-stock-metric-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dt-stock-metric-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.dt-stock-metric-grid--compact .dt-stock-metric {
    padding: 0.38rem 0.45rem;
}
.dt-stock-metric {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    background: rgba(8, 12, 18, 0.5);
    padding: 0.48rem 0.52rem;
    min-height: 3.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.dt-stock-metric--hero {
    border-color: rgba(220, 180, 80, 0.32);
    background: linear-gradient(160deg, rgba(40, 32, 12, 0.38), rgba(8, 12, 18, 0.62));
}
.dt-stock-metric__k {
    display: block;
    font-size: 0.7rem;
    opacity: 0.72;
    line-height: 1.3;
}
.dt-stock-metric__v {
    display: block;
    margin-top: 0.18rem;
    font-size: 0.92rem;
    font-weight: 700;
    color: rgba(255, 230, 160, 0.94);
    line-height: 1.35;
    word-break: break-word;
}
.dt-stock-metric__sub {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.68rem;
    font-weight: 500;
    opacity: 0.72;
    color: rgba(210, 220, 235, 0.88);
}
.dt-stock-metric.dt-stock-pct--up .dt-stock-metric__v {
    color: rgba(90, 220, 160, 0.95);
}
.dt-stock-metric.dt-stock-pct--down .dt-stock-metric__v {
    color: rgba(240, 110, 110, 0.95);
}
.dt-stock-pl-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.35rem;
    padding: 0.55rem 0.65rem;
    margin-bottom: 0.5rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(8, 12, 18, 0.55);
}
.dt-stock-pl-hero__k {
    font-size: 0.8rem;
    opacity: 0.82;
}
.dt-stock-pl-hero__v {
    font-size: 1.18rem;
    color: rgba(255, 230, 160, 0.95);
}
.dt-stock-composition--inline {
    margin-top: 0;
}
.dt-stock-th-num,
.dt-stock-td-num {
    text-align: right !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.dt-stock-th-share,
.dt-stock-td-share {
    width: 5.5rem;
    text-align: right !important;
    font-variant-numeric: tabular-nums;
}
.dt-stock-asset-table .dt-stock-pct {
    display: block;
    margin-top: 0.1rem;
    font-size: 0.68rem;
}
.dt-stock-table-empty {
    text-align: center;
    padding: 1.2rem 0.6rem !important;
}
.dt-stock-table-wrap--assets {
    max-height: min(42vh, 20rem);
    overflow-y: auto;
}
.dt-stock-alloc-grid--6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0;
}
.dt-stock-alloc-card {
    min-height: 4.2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.dt-stock-sector-table th:nth-child(1),
.dt-stock-sector-table td:nth-child(1) {
    min-width: 5.5rem;
}
.dt-stock-asset-overview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin-bottom: 0.65rem;
}
.dt-stock-asset-overview__card {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    background: rgba(8, 12, 18, 0.58);
    padding: 0.55rem 0.6rem;
}
.dt-stock-asset-overview__card--total {
    border-color: rgba(220, 180, 80, 0.35);
    background: linear-gradient(160deg, rgba(40, 32, 12, 0.45), rgba(8, 12, 18, 0.72));
}
.dt-stock-asset-overview__card .dt-stock-summary-v {
    display: block;
    margin-top: 0.2rem;
    font-size: 1.02rem;
    line-height: 1.35;
}
.dt-stock-asset-overview__sub {
    display: block;
    margin-top: 0.18rem;
    font-size: 0.72rem;
    font-weight: 500;
    opacity: 0.72;
}
.dt-stock-composition__labels {
    display: flex;
    justify-content: space-between;
    gap: 0.35rem;
    margin-top: 0.3rem;
    font-size: 0.72rem;
    opacity: 0.82;
}
.dt-stock-alloc-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.35rem;
    margin: 0.65rem 0 0.35rem;
}
.dt-stock-alloc-head h5 {
    margin: 0;
    font-size: 0.84rem;
    color: rgba(255, 230, 160, 0.9);
}
.dt-stock-alloc-head span {
    font-size: 0.72rem;
    opacity: 0.72;
}
.dt-stock-pl-banner {
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(8, 12, 18, 0.62);
    padding: 0.65rem 0.75rem;
    margin-bottom: 0.65rem;
}
.dt-stock-pl-banner.dt-stock-pct--up { border-color: rgba(80, 200, 140, 0.28); }
.dt-stock-pl-banner.dt-stock-pct--down { border-color: rgba(200, 80, 80, 0.28); }
.dt-stock-pl-banner__main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.35rem;
    margin-bottom: 0.55rem;
}
.dt-stock-pl-banner__main span {
    font-size: 0.82rem;
    opacity: 0.82;
}
.dt-stock-pl-banner__main strong {
    font-size: 1.25rem;
    color: rgba(255, 230, 160, 0.95);
}
.dt-stock-pl-banner__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
}
.dt-stock-pl-banner__grid em {
    font-style: normal;
    font-size: 0.82em;
    opacity: 0.88;
}
.dt-stock-composition {
    margin-top: 0.65rem;
}
.dt-stock-composition__head {
    display: flex;
    justify-content: space-between;
    gap: 0.35rem;
    font-size: 0.78rem;
    opacity: 0.82;
    margin-bottom: 0.35rem;
}
.dt-stock-composition__bar {
    display: flex;
    width: 100%;
    height: 10px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.06);
}
.dt-stock-composition__cash,
.dt-stock-composition__stock {
    display: block;
    height: 100%;
}
.dt-stock-composition__cash {
    background: linear-gradient(90deg, rgba(100, 160, 220, 0.75), rgba(120, 180, 255, 0.85));
}
.dt-stock-composition__stock {
    background: linear-gradient(90deg, rgba(220, 180, 80, 0.65), rgba(255, 230, 160, 0.85));
}
.dt-stock-sector-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
}
.dt-stock-sector-card {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(8, 12, 18, 0.55);
    padding: 0.45rem 0.5rem;
}
.dt-stock-sector-card__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.25rem;
}
.dt-stock-sector-card__count {
    font-size: 0.68rem;
    opacity: 0.72;
}
.dt-stock-sector-card__val {
    font-size: 0.88rem;
    font-weight: 700;
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-sector-card__meta {
    display: flex;
    justify-content: space-between;
    gap: 0.35rem;
    margin-top: 0.2rem;
    font-size: 0.72rem;
    opacity: 0.82;
}
.dt-stock-asset-sub {
    display: block;
    margin-top: 0.12rem;
    font-size: 0.68rem;
    opacity: 0.72;
}
.dt-stock-alloc-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.65rem;
}
.dt-stock-alloc-card {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(8, 12, 18, 0.62);
    padding: 0.45rem 0.5rem;
    text-align: left;
    cursor: pointer;
    color: inherit;
}
.dt-stock-alloc-card:hover { border-color: rgba(220, 180, 80, 0.42); }
.dt-stock-alloc-card__name { display: block; font-size: 0.76rem; font-weight: 600; }
.dt-stock-alloc-card__pct { display: block; margin-top: 0.15rem; font-size: 0.82rem; color: rgba(255, 230, 160, 0.92); }
.dt-stock-alloc-card__val { display: block; margin-top: 0.1rem; font-size: 0.68rem; opacity: 0.75; }
.dt-stock-asset-name { font-weight: 600; margin-bottom: 0.15rem; }
.dt-stock-share-bar {
    margin-top: 0.2rem;
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}
.dt-stock-share-bar i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, rgba(220, 180, 80, 0.55), rgba(255, 230, 160, 0.85));
}
.dt-stock-ledger--rich .dt-stock-ledger-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.45rem;
    align-items: start;
    padding: 0.4rem 0.35rem;
    border-radius: 6px;
}
.dt-stock-ledger-side {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
}
.dt-stock-side--buy { color: rgba(90, 220, 160, 0.95); background: rgba(40, 100, 70, 0.25); }
.dt-stock-side--sell { color: rgba(240, 110, 110, 0.95); background: rgba(100, 40, 40, 0.25); }
.dt-stock-ledger-time { font-size: 0.68rem; opacity: 0.65; white-space: nowrap; }
.dt-stock-ledger-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.45rem;
    margin-bottom: 0.15rem;
}
.dt-stock-ledger-count {
    font-size: 0.68rem;
    opacity: 0.72;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.dt-stock-ledger-scroll {
    max-height: min(42vh, 17.5rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    margin-top: 0.35rem;
    padding-right: 0.2rem;
    scrollbar-width: thin;
}
.dt-stock-ledger-scroll::-webkit-scrollbar {
    width: 6px;
}
.dt-stock-ledger-scroll::-webkit-scrollbar-thumb {
    background: rgba(220, 180, 80, 0.35);
    border-radius: 999px;
}
.dt-stock-ledger--global .dt-stock-ledger-row {
    grid-template-columns: auto minmax(3.5rem, 5rem) minmax(0, 1fr) auto;
}
.dt-stock-ledger-player {
    font-size: 0.72rem;
    font-weight: 600;
    color: rgba(200, 220, 255, 0.92);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dt-stock-player-id {
    margin-left: 0.15rem;
    font-size: 0.92em;
    font-weight: 700;
    color: rgba(255, 230, 160, 0.88);
    opacity: 0.92;
}
.dt-stock-ledger-empty {
    padding: 0.65rem 0.35rem;
}
.dt-stock-market-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.55rem;
    margin-bottom: 0.65rem;
}
.dt-stock-market-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}
.dt-stock-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.55rem;
}
.dt-stock-filter-chip {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    background: rgba(8, 12, 18, 0.55);
    color: inherit;
    font-size: 0.68rem;
    padding: 0.18rem 0.55rem;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.dt-stock-filter-chip:hover {
    border-color: rgba(220, 180, 80, 0.35);
}
.dt-stock-filter-chip--active {
    border-color: rgba(220, 180, 80, 0.55);
    background: rgba(60, 48, 12, 0.45);
    color: rgba(255, 230, 160, 0.95);
}
.dt-stock-list-scroll {
    max-height: min(58vh, 28rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.15rem;
    scrollbar-width: thin;
}
.dt-stock-list-scroll::-webkit-scrollbar {
    width: 6px;
}
.dt-stock-list-scroll::-webkit-scrollbar-thumb {
    background: rgba(220, 180, 80, 0.35);
    border-radius: 999px;
}
.dt-stock-table-wrap--market {
    margin-top: 0;
}
.dt-stock-market-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: rgba(12, 16, 22, 0.98);
}
.dt-stock-market-row {
    cursor: pointer;
    transition: background 0.12s ease;
}
.dt-stock-market-row:hover {
    background: rgba(220, 180, 80, 0.08);
}
.dt-stock-market-row.dt-stock-pct--up td:first-child {
    box-shadow: inset 3px 0 0 rgba(80, 200, 140, 0.55);
}
.dt-stock-market-row.dt-stock-pct--down td:first-child {
    box-shadow: inset 3px 0 0 rgba(200, 80, 80, 0.55);
}
.dt-stock-market-name {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 7.5rem;
}
.dt-stock-market-glyph {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 6px;
    display: grid;
    place-items: center;
    font-size: 0.72rem;
    font-weight: 700;
    background: rgba(40, 32, 12, 0.55);
    border: 1px solid rgba(220, 180, 80, 0.22);
    flex: 0 0 auto;
}
.dt-stock-market-name__body {
    min-width: 0;
}
.dt-stock-market-name__body strong {
    display: block;
    font-size: 0.78rem;
    line-height: 1.25;
}
.dt-stock-market-name__body .dt-stock-code {
    display: block;
    margin-top: 0.05rem;
}
.dt-stock-market-hold {
    display: inline-block;
    margin-top: 0.12rem;
    font-size: 0.62rem;
    color: rgba(160, 220, 200, 0.9);
    padding: 0.02rem 0.35rem;
    border-radius: 999px;
    border: 1px solid rgba(80, 180, 140, 0.28);
}
.dt-stock-market-spark-cell {
    width: 7rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}
.dt-stock-spark--row {
    display: block;
    width: 100%;
    height: 36px;
}
.dt-stock-market-action {
    text-align: right;
    white-space: nowrap;
}
.dt-stock-market-go {
    font-size: 0.68rem;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(220, 180, 80, 0.35);
    color: rgba(255, 230, 160, 0.92);
}
.dt-stock-list-split {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(13.5rem, 0.65fr);
    gap: 0.65rem;
    align-items: stretch;
}
.dt-stock-list-split__main {
    min-width: 0;
}
.dt-stock-list-split__rank {
    min-width: 0;
}
.dt-stock-rank-card {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    height: 100%;
    margin-bottom: 0;
}
.dt-stock-rank-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.45rem;
}
.dt-stock-rank-hint {
    font-size: 0.68rem;
    color: rgba(220, 180, 80, 0.72);
    white-space: nowrap;
}
.dt-stock-rank-tip {
    margin: 0;
    font-size: 0.68rem;
    line-height: 1.45;
}
.dt-stock-rank-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: min(58vh, 28rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.1rem;
    scrollbar-width: thin;
}
.dt-stock-rank-body::-webkit-scrollbar {
    width: 5px;
}
.dt-stock-rank-body::-webkit-scrollbar-thumb {
    background: rgba(220, 180, 80, 0.35);
    border-radius: 999px;
}
.dt-stock-rank-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
}
.dt-stock-rank-row {
    display: grid;
    grid-template-columns: 1.65rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.35rem;
    padding: 0.32rem 0.42rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(8, 10, 14, 0.55);
    font-size: 0.72rem;
}
.dt-stock-rank-row--r1 {
    border-color: rgba(255, 210, 80, 0.42);
    background: linear-gradient(90deg, rgba(80, 60, 10, 0.55), rgba(8, 10, 14, 0.55));
}
.dt-stock-rank-row--r2 {
    border-color: rgba(180, 200, 220, 0.28);
    background: linear-gradient(90deg, rgba(40, 48, 58, 0.55), rgba(8, 10, 14, 0.55));
}
.dt-stock-rank-row--r3 {
    border-color: rgba(180, 120, 70, 0.32);
    background: linear-gradient(90deg, rgba(50, 32, 16, 0.55), rgba(8, 10, 14, 0.55));
}
.dt-stock-rank-row--self {
    border-color: rgba(80, 200, 140, 0.38);
    box-shadow: inset 0 0 0 1px rgba(80, 200, 140, 0.12);
}
.dt-stock-rank-no {
    font-weight: 700;
    color: rgba(220, 180, 80, 0.88);
    text-align: center;
}
.dt-stock-rank-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dt-stock-rank-gold {
    font-variant-numeric: tabular-nums;
    color: rgba(255, 230, 160, 0.92);
    white-space: nowrap;
}
.dt-stock-rank-empty {
    margin: 0.35rem 0;
    font-size: 0.72rem;
    text-align: center;
}
.dt-stock-rank-self {
    margin: 0.55rem 0 0;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.68rem;
    line-height: 1.45;
    text-align: center;
}
.dt-stock-rank-page {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-bottom: 0;
}
.dt-stock-rank-body--page {
    max-height: min(62vh, 32rem);
}
.dt-stock-rank-body--page .dt-stock-rank-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem 0.55rem;
}
.dt-stock-rank-body--page .dt-stock-rank-row {
    padding: 0.38rem 0.5rem;
}
.dt-stock-shop-page {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin-bottom: 0;
}
.dt-stock-shop-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.45rem;
}
.dt-stock-shop-hint {
    font-size: 0.68rem;
    color: rgba(220, 180, 80, 0.72);
    white-space: nowrap;
}
.dt-stock-shop-tip {
    margin: 0;
    font-size: 0.68rem;
    line-height: 1.45;
}
.dt-stock-shop-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.85rem;
    align-items: center;
    padding: 0.45rem 0.55rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(8, 10, 14, 0.55);
    font-size: 0.72rem;
}
.dt-stock-shop-summary strong {
    color: rgba(255, 230, 160, 0.95);
    font-variant-numeric: tabular-nums;
}
.dt-stock-shop-reset {
    margin-left: auto;
    color: rgba(160, 200, 220, 0.88);
    font-size: 0.68rem;
}
.dt-stock-shop-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    max-height: min(62vh, 32rem);
    overflow-y: auto;
    padding-right: 0.1rem;
    scrollbar-width: thin;
}
.dt-stock-shop-grid::-webkit-scrollbar {
    width: 5px;
}
.dt-stock-shop-grid::-webkit-scrollbar-thumb {
    background: rgba(220, 180, 80, 0.35);
    border-radius: 999px;
}
.dt-stock-shop-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 0.25rem 0.35rem;
    align-items: center;
    padding: 0.55rem 0.6rem;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(160deg, rgba(14, 18, 26, 0.92), rgba(6, 8, 12, 0.96));
}
.dt-stock-shop-item--ready {
    border-color: rgba(80, 200, 140, 0.28);
}
.dt-stock-shop-item--bought {
    border-color: rgba(220, 180, 80, 0.35);
    opacity: 0.82;
}
.dt-stock-shop-item--locked {
    opacity: 0.72;
}
.dt-stock-shop-item__cost {
    grid-column: 1;
    font-size: 0.72rem;
    color: rgba(255, 230, 160, 0.92);
    font-variant-numeric: tabular-nums;
}
.dt-stock-shop-item__arrow {
    grid-column: 2;
    grid-row: 1 / span 2;
    color: rgba(220, 180, 80, 0.65);
    font-size: 0.85rem;
}
.dt-stock-shop-item__reward {
    grid-column: 3;
    text-align: right;
    font-size: 0.72rem;
    color: rgba(160, 220, 200, 0.92);
    font-variant-numeric: tabular-nums;
}
.dt-stock-shop-btn {
    grid-column: 1 / -1;
    justify-self: stretch;
    margin-top: 0.15rem;
    border-radius: 999px;
    border: 1px solid rgba(220, 180, 80, 0.45);
    background: rgba(60, 48, 16, 0.55);
    color: rgba(255, 230, 160, 0.95);
    font-size: 0.68rem;
    padding: 0.28rem 0.55rem;
    cursor: pointer;
}
.dt-stock-shop-btn:hover:not(:disabled) {
    border-color: rgba(220, 180, 80, 0.65);
    background: rgba(80, 64, 24, 0.65);
}
.dt-stock-shop-btn--disabled,
.dt-stock-shop-btn--done {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(8, 10, 14, 0.55);
    color: rgba(180, 190, 205, 0.72);
    cursor: not-allowed;
}
.dt-stock-shop-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 1rem 0.5rem;
}
.dt-stock-list-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    max-height: min(58vh, 28rem);
    overflow-y: auto;
    padding-right: 0.15rem;
}
.dt-stock-list-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    background: linear-gradient(160deg, rgba(14, 18, 26, 0.92), rgba(6, 8, 12, 0.96));
    padding: 0.55rem 0.6rem;
    text-align: left;
    cursor: pointer;
    color: inherit;
    transition: border-color 0.15s ease, transform 0.15s ease;
}
.dt-stock-list-card:hover {
    border-color: rgba(220, 180, 80, 0.45);
    transform: translateY(-1px);
}
.dt-stock-list-card.dt-stock-pct--up { border-color: rgba(80, 200, 140, 0.22); }
.dt-stock-list-card.dt-stock-pct--down { border-color: rgba(200, 80, 80, 0.22); }
.dt-stock-list-card__top {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    margin-bottom: 0.35rem;
}
.dt-stock-list-card__glyph {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    display: grid;
    place-items: center;
    font-weight: 700;
    background: rgba(40, 32, 12, 0.55);
    border: 1px solid rgba(220, 180, 80, 0.25);
    flex: 0 0 auto;
}
.dt-stock-list-card__title { flex: 1 1 auto; min-width: 0; }
.dt-stock-list-card__title strong { display: block; font-size: 0.82rem; }
.dt-stock-list-card__price-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.25rem;
}
.dt-stock-list-card__price { font-size: 1rem; font-weight: 700; color: rgba(255, 230, 160, 0.95); }
.dt-stock-list-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
    font-size: 0.68rem;
    opacity: 0.82;
}
.dt-stock-list-card__hold {
    margin-top: 0.35rem;
    font-size: 0.68rem;
    color: rgba(160, 220, 200, 0.9);
}
@media (max-width: 768px) {
    .dt-stock-list-split {
        grid-template-columns: 1fr;
    }
    .dt-stock-list-split__rank {
        order: 2;
    }
    .dt-stock-rank-body--page .dt-stock-rank-list {
        grid-template-columns: 1fr;
    }
    .dt-stock-rank-body--page {
        max-height: min(50vh, 24rem);
    }
    .dt-stock-shop-grid {
        grid-template-columns: 1fr;
    }
    .dt-stock-shop-reset {
        margin-left: 0;
        width: 100%;
    }
    .dt-stock-assets-split {
        grid-template-columns: 1fr;
    }
    .dt-stock-metric-grid--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dt-stock-alloc-grid--6 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 520px) {
    .dt-stock-stat-row,
    .dt-stock-stat-row--6 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .dt-stock-desk,
    .dt-stock-assets-split,
    .dt-stock-metric-grid--2,
    .dt-stock-metric-grid--3,
    .dt-stock-metric-grid--4,
    .dt-stock-asset-summary,
    .dt-stock-asset-summary--6,
    .dt-stock-asset-summary--8,
    .dt-stock-pl-banner__grid,
    .dt-stock-sector-grid,
    .dt-stock-alloc-grid,
    .dt-stock-alloc-grid--6,
    .dt-stock-trade-box__caps {
        grid-template-columns: 1fr;
    }
    .dt-stock-section-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2rem;
    }
    .dt-stock-ledger--global .dt-stock-ledger-row {
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
    }
    .dt-stock-ledger--global .dt-stock-ledger-time {
        grid-column: 2;
        justify-self: end;
    }
    .dt-stock-market-table th:nth-child(6),
    .dt-stock-market-table td:nth-child(6),
    .dt-stock-market-table th:nth-child(7),
    .dt-stock-market-table td:nth-child(7) {
        display: none;
    }
    .dt-stock-list-grid {
        grid-template-columns: 1fr;
    }
    .dt-stock-nav {
        grid-template-columns: auto 1fr auto;
    }
    .dt-stock-nav__list {
        grid-column: 1 / -1;
        justify-self: center;
    }
    .dt-stock-est-grid,
    .dt-stock-trade-btns {
        grid-template-columns: 1fr;
    }
}
/* 修仙股票 · 可读性增强（字号、间距、图表区） */
.dongtian-stock-head .dt-stock-tick-line {
    font-size: 0.88rem;
    color: rgba(210, 220, 235, 0.88);
}
.dongtian-stock-sheet .dt-stock-tab {
    padding: 0.38rem 0.95rem;
    font-size: 0.92rem;
}
.dongtian-stock-sheet .dt-stock-trade-split {
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 21.5rem);
    gap: 0.75rem;
}
.dongtian-stock-sheet .dt-stock-quote-pill {
    font-size: 0.82rem;
    padding: 0.16rem 0.55rem;
}
.dongtian-stock-sheet .dt-stock-chart-head--rich strong { font-size: 0.98rem; }
.dongtian-stock-sheet .dt-stock-chart-head--rich span { font-size: 0.82rem; opacity: 0.78; }
.dongtian-stock-sheet .dt-stock-chart-head__right { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-chart--main { min-height: 13.5rem; }
.dongtian-stock-sheet .dt-stock-chart-metric__k { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-chart-metric__v { font-size: 0.92rem; }
.dongtian-stock-sheet .dt-stock-range-bar__head,
.dongtian-stock-sheet .dt-stock-range-bar__foot { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-feed-head h5 { font-size: 0.92rem; }
.dongtian-stock-sheet .dt-stock-feed-head span { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-feed-row { font-size: 0.86rem; padding: 0.35rem 0.3rem; }
.dongtian-stock-sheet .dt-stock-nav__btn {
    width: 2.35rem;
    height: 2.35rem;
    font-size: 1.35rem;
}
.dongtian-stock-sheet .dt-stock-nav__center strong { font-size: 1.05rem; }
.dongtian-stock-sheet .dt-stock-nav__idx { font-size: 0.82rem; opacity: 0.72; }
.dongtian-stock-sheet .dt-stock-nav__list { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-hero__sub { font-size: 0.86rem; line-height: 1.45; }
.dongtian-stock-sheet .dt-stock-hero__desc { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-hero__title-row h4 { font-size: 1.18rem; }
.dongtian-stock-sheet .dt-stock-hero__glyph {
    width: 3.4rem;
    height: 3.4rem;
    font-size: 1.6rem;
}
.dongtian-stock-sheet .dt-stock-code { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-sector-badge { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-sector-badge--sm { font-size: 0.74rem; }
.dongtian-stock-sheet .dt-stock-tier { font-size: 0.72rem; }
.dongtian-stock-sheet .dt-stock-price--hero { font-size: 2rem; }
.dongtian-stock-sheet .dt-stock-pct { font-size: 0.95rem; }
.dongtian-stock-sheet .dt-stock-diff { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-trade-box { padding: 0.85rem 0.9rem; }
.dongtian-stock-sheet .dt-stock-trade-box__title { font-size: 1rem; }
.dongtian-stock-sheet .dt-stock-cap-k { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-trade-box__caps strong { font-size: 0.95rem; }
.dongtian-stock-sheet .dt-stock-label { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-qty {
    padding: 0.55rem 0.6rem;
    font-size: 1rem;
}
.dongtian-stock-sheet .dt-stock-qty-preset { font-size: 0.82rem; padding: 0.22rem 0.62rem; }
.dongtian-stock-sheet .dt-stock-est-line { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-stat__k { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-stat__v { font-size: 0.95rem; }
.dongtian-stock-sheet .dt-stock-pos-banner { font-size: 0.84rem; padding: 0.55rem 0.7rem; }
.dongtian-stock-sheet .dt-stock-summary-k { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-summary-v { font-size: 1.08rem; }
.dongtian-stock-sheet .dt-stock-asset-tip { font-size: 0.84rem; }
.dongtian-stock-sheet .dt-stock-table { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-table th,
.dongtian-stock-sheet .dt-stock-table td { padding: 0.55rem 0.45rem; }
.dongtian-stock-sheet .dt-stock-market-tip { font-size: 0.84rem; }
.dongtian-stock-sheet .dt-stock-filter-chip { font-size: 0.8rem; padding: 0.22rem 0.62rem; }
.dongtian-stock-sheet .dt-stock-market-name__body strong { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-market-go { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-ledger { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-ledger-side { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-ledger-player { font-size: 0.8rem; }
.dongtian-stock-sheet .dt-stock-ledger-time { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-ledger-count { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-alloc-card__name { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-alloc-card__pct { font-size: 0.92rem; }
.dongtian-stock-sheet .dt-stock-alloc-card__val { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-assets-split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.75rem;
}
.dongtian-stock-sheet .dt-stock-list-split {
    grid-template-columns: minmax(0, 1.25fr) minmax(14rem, 0.75fr);
    gap: 0.75rem;
}
.dongtian-stock-sheet .dt-stock-rank-tip { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-rank-row { font-size: 0.82rem; padding: 0.38rem 0.48rem; }
.dongtian-stock-sheet .dt-stock-rank-no { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-rank-gold { font-size: 0.86rem; }
.dongtian-stock-sheet .dt-stock-rank-self { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-rank-hint { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-rank-body--page .dt-stock-rank-row { font-size: 0.88rem; }
.dongtian-stock-sheet .dt-stock-rank-body--page .dt-stock-rank-no { font-size: 0.92rem; }
.dongtian-stock-sheet .dt-stock-rank-body--page .dt-stock-rank-gold { font-size: 0.9rem; }
.dongtian-stock-sheet .dt-stock-shop-tip { font-size: 0.78rem; }
.dongtian-stock-sheet .dt-stock-shop-summary { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-shop-item__cost,
.dongtian-stock-sheet .dt-stock-shop-item__reward { font-size: 0.82rem; }
.dongtian-stock-sheet .dt-stock-shop-btn { font-size: 0.8rem; padding: 0.32rem 0.65rem; }
.dongtian-stock-sheet .dt-stock-section-head h4 { font-size: 1rem; }
.dongtian-stock-sheet .dt-stock-section-hint { font-size: 0.8rem; }
.dongtian-stock-sheet .dt-stock-metric__k { font-size: 0.8rem; }
.dongtian-stock-sheet .dt-stock-metric__v { font-size: 1rem; }
.dongtian-stock-sheet .dt-stock-metric__sub { font-size: 0.76rem; }
.dongtian-stock-sheet .dt-stock-pl-hero__v { font-size: 1.32rem; }
.dongtian-stock-sheet .dt-stock-alloc-grid--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dongtian-stock-sheet .dt-stock-asset-summary--8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dongtian-stock-sheet .dt-stock-asset-overview { grid-template-columns: 1fr; }
.dongtian-stock-sheet .dt-stock-head-balance { width: 100%; align-items: flex-end; margin: 0 0 0.35rem; }
.dongtian-stock-sheet .dt-stock-pl-banner__main strong { font-size: 1.35rem; }
.dongtian-stock-sheet .dt-stock-sector-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dongtian-stock-sheet .dt-stock-pl-banner__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dongtian-stock-sheet .wushen-arena-card-title { font-size: 1rem; }
.dongtian-stock-sheet .btn--sm { font-size: 0.88rem; padding: 0.38rem 0.75rem; }