/* ==========================================================================
   塔科夫中文攻略站 - 主题色 CSS 变量
   ----------------------------------------------------------------------------
   默认是暗色模式（amber 主题色）。
   切换机制：
   - 主题色：html 加 data-color="<key>"，由 theme-tokens.css 提供 20 套色阶
   - 亮/暗： html 加 data-mode="light" / 默认（无属性 = 暗色）
   ========================================================================== */

:root {
    /* 默认主题色（amber，活力橙）：被 theme-tokens.css 的 [data-color] 选择器覆盖 */
    --p-50:  255 251 235;
    --p-100: 254 243 199;
    --p-200: 253 230 138;
    --p-300: 252 211 77;
    --p-400: 251 191 36;
    --p-500: 245 158 11;
    --p-600: 217 119 6;
    --p-700: 180 83 9;
    --p-800: 146 64 14;
    --p-900: 120 53 15;

    /* 全局背景/边框/文字（暗色默认） */
    --bg: 9 9 9;
    --bg-card: 22 22 22;
    --bg-card-soft: 31 31 31;
    --border: 42 42 42;
    --border-soft: 58 58 58;
    --text: 229 229 229;
    --text-dim: 168 162 158;
    --text-muted: 120 113 108;
    --note: 245 245 244;

    /* 非 Tailwind 自定义组件的主题变量 */
    --surface-1: 15 23 42;
    --surface-2: 30 41 59;
    --surface-3: 51 65 85;
    --content: 203 213 225;
    --heading: 241 245 249;
    --muted-content: 148 163 184;
    --link: 96 165 250;
    --link-hover: 147 197 253;

    /* stone 文字色（统一一个色，主题切换时由 theme.js 控制） */
    --s-text-100: 245 245 245;
    --s-text-200: 245 245 245;
    --s-text-300: 245 245 245;
    --s-text-400: 245 245 245;
    --s-text-500: 245 245 245;
    --s-text-600: 245 245 245;
    --s-text-700: 245 245 245;
    --s-text-800: 245 245 245;
    --s-text-900: 245 245 245;

    /* stone 背景色（暗黑：深色背景） */
    --s-bg-700: 39 39 42;
    --s-bg-800: 24 24 27;
    --s-bg-900: 9 9 9;
}

/* 页面根背景始终跟随当前主题，避免 body 透明时露出错误底色。 */
html, body {
    background-color: rgb(var(--bg));
    color: rgb(var(--text));
}

html {
    min-height: 100%;
}
body {
    min-height: 100vh;
}

/* === 亮色模式 === */
[data-mode="light"] {
    --bg: 250 250 250;
    --bg-card: 255 255 255;
    --bg-card-soft: 244 244 245;
    --border: 226 232 240;
    --border-soft: 203 213 225;
    --text: 24 24 27;
    --text-dim: 82 82 91;
    --text-muted: 113 113 122;
    --note: 24 24 27;

    --surface-1: 248 250 252;
    --surface-2: 241 245 249;
    --surface-3: 203 213 225;
    --content: 51 65 85;
    --heading: 15 23 42;
    --muted-content: 100 116 139;
    --link: 37 99 235;
    --link-hover: 29 78 216;

    /* 亮色模式：stone 文字 = 深色（深灰） */
    --s-text-100: 24 24 27;
    --s-text-200: 24 24 27;
    --s-text-300: 39 39 42;
    --s-text-400: 63 63 70;
    --s-text-500: 82 82 91;
    --s-text-600: 113 113 122;
    --s-text-700: 63 63 70;
    --s-text-800: 39 39 42;
    --s-text-900: 24 24 27;

    /* 亮色模式：stone 背景 = 浅灰 */
    --s-bg-700: 241 245 249;
    --s-bg-800: 226 232 240;
    --s-bg-900: 203 213 225;
}

/* 主题色选择器面板（用固定定位，不受主题切换影响） */
.theme-panel {
    position: fixed;
    z-index: 100;
    /* 背景用半透明兜底，避免纯色模式下面板变成黑/白一片 */
    background: rgb(var(--bg-card));
    border: 1px solid rgb(var(--border));
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.25);
    padding: 12px;
    color: rgb(var(--text));
}

/* ==========================================================================
   塔科夫中文攻略站 - 前台自定义样式
   配合 Tailwind CDN 使用
   ========================================================================== */

/* 全局滚动条 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: rgb(var(--surface-1));
}
::-webkit-scrollbar-thumb {
    background: rgb(var(--surface-3));
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgb(var(--surface-3));
}

/* 选中文本 */
::selection {
    background-color: rgba(16, 185, 129, 0.3);
    color: rgb(var(--heading));
}

/* HTML 渲染的文章 */
.article-content {
    line-height: 1.8;
    color: rgb(var(--content));
}
.article-content h1, .article-content h2, .article-content h3, .article-content h4 {
    color: rgb(var(--heading));
    font-weight: 700;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}
.article-content h1 { font-size: 1.75rem; }
.article-content h2 { font-size: 1.5rem; }
.article-content h3 { font-size: 1.25rem; }
.article-content p { margin: 0.75rem 0; }
.article-content ul, .article-content ol { margin: 0.75rem 0; padding-left: 1.5rem; }
.article-content ul { list-style: disc; }
.article-content ol { list-style: decimal; }
.article-content li { margin: 0.25rem 0; }
.article-content a { color: rgb(var(--link)); text-decoration: underline; }
.article-content a:hover { color: rgb(var(--link-hover)); }
.article-content code {
    background: rgb(var(--surface-2));
    color: rgb(110 231 183);
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    font-family: var(--tarkov-font) !important;
    font-size: 0.9em;
}
.article-content pre {
    background: rgb(var(--surface-1));
    border: 1px solid rgb(var(--surface-3));
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin: 1rem 0;
}
.article-content pre code {
    background: transparent;
    color: rgb(var(--content));
    padding: 0;
}
.article-content blockquote {
    border-left: 4px solid #10b981;
    background: rgba(16, 185, 129, 0.05);
    padding: 0.75rem 1rem;
    margin: 1rem 0;
    color: rgb(var(--muted-content));
}
.article-content img {
    max-width: 100%;
    border-radius: 0.5rem;
    margin: 1rem 0;
}
.article-content table {
    border-collapse: collapse;
    width: 100%;
    margin: 1rem 0;
}
.article-content th, .article-content td {
    border: 1px solid rgb(var(--surface-3));
    padding: 0.5rem 0.75rem;
    text-align: left;
}
.article-content th { background: rgb(var(--surface-2)); color: rgb(var(--heading)); }

/* 任务卡片 */
.task-card {
    transition: all 0.2s ease;
}
.task-card:hover {
    transform: translateX(4px);
    border-color: #10b981;
}

/* 物品卡片 */
.item-card {
    transition: all 0.2s ease;
}
.item-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    border-color: rgb(var(--surface-3));
}

/* 进度勾选动画 */
@keyframes checkPop {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}
.checkbox-checked {
    animation: checkPop 0.3s ease-out;
}

/* 模式切换器 */
.mode-switcher {
    display: inline-flex;
    background: rgb(var(--surface-2));
    border-radius: 0.5rem;
    padding: 0.25rem;
    gap: 0.125rem;
}
.mode-switcher button {
    padding: 0.375rem 0.875rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    color: rgb(var(--muted-content));
    transition: all 0.15s;
}
.mode-switcher button:hover {
    color: rgb(var(--heading));
}
.mode-switcher button.active {
    background: #10b981;
    color: #fff;
    font-weight: 500;
}

/* 移动端抽屉 */
@media (max-width: 768px) {
    .mobile-menu {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 60;
        display: none;
    }
    .mobile-menu.open {
        display: block;
    }
    .mobile-menu-panel {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 16rem;
        background: rgb(var(--surface-1));
        border-right: 1px solid rgb(var(--surface-2));
        overflow-y: auto;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
    }
    .mobile-menu.open .mobile-menu-panel {
        transform: translateX(0);
    }
}

/* 加载动画 */
@keyframes spin {
    to { transform: rotate(360deg); }
}
.spinner {
    width: 1.5rem;
    height: 1.5rem;
    border: 2px solid rgb(var(--surface-3));
    border-top-color: #10b981;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

/* Tooltip 简化版 */
[data-tooltip] {
    position: relative;
}
[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: rgb(var(--surface-2));
    color: rgb(var(--heading));
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    white-space: nowrap;
    z-index: 50;
    margin-bottom: 0.25rem;
    border: 1px solid rgb(var(--surface-3));
}

/* 卡片悬浮效果 */
.card-hover {
    transition: all 0.2s ease;
}
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

/* 隐藏/显示辅助 */
.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }

/* 焦点样式 */
input:focus, select:focus, textarea:focus, button:focus {
    outline: none;
}

/* 链接过渡 */
a {
    transition: color 0.15s;
}


/*
 * 圆形主题切换：底层页面在黑圈遮罩期间必须瞬间完成换肤，
 * 所有视觉动画交给 #theme-circle-transition 负责。
 */
html.theme-circle-active body,
html.theme-circle-active body *,
html.theme-circle-active body *::before,
html.theme-circle-active body *::after {
    transition: none !important;
    animation: none !important;
}

/* 主题切换动画只在用户主动切换时开启；首屏加载绝不做颜色过渡，避免闪黑/闪白。 */
html.theme-changing body,
html.theme-changing body *,
html.theme-changing body *::before,
html.theme-changing body *::after {
    transition: background-color 0.22s ease, border-color 0.22s ease, color 0.22s ease !important;
}

/* --------------------------------------------------------------------------
 * View Transition 主题圆形揭幕
 *
 * 关键点：旧页面快照必须完整、不透明地留在底层；新主题只在圆形区域内
 * 被揭开。body 也使用主题背景色，避免根画布提前变色后从快照透明区域漏出。
 * -------------------------------------------------------------------------- */
::view-transition-group(root) {
    animation-duration: 0s !important;
}

::view-transition-image-pair(root) {
    isolation: isolate;
}

::view-transition-old(root),
::view-transition-new(root) {
    animation: none !important;
    mix-blend-mode: normal !important;
    opacity: 1 !important;
    width: 100%;
    height: 100%;
}

/* 白 -> 黑：旧的白天页面始终完整铺在下面；新的黑夜页面只从圆内出现。 */
html.theme-vt-going-dark::view-transition-old(root) {
    z-index: 1;
    clip-path: none !important;
}
html.theme-vt-going-dark::view-transition-new(root) {
    z-index: 2;
    clip-path: circle(0px at var(--theme-vt-x) var(--theme-vt-y));
}

/* 黑 -> 白：新的白天页面完整铺在下面；旧的黑夜页面收缩成圆并消失。 */
html.theme-vt-going-light::view-transition-new(root) {
    z-index: 1;
    clip-path: none !important;
}
html.theme-vt-going-light::view-transition-old(root) {
    z-index: 2;
    clip-path: circle(var(--theme-vt-r) at var(--theme-vt-x) var(--theme-vt-y));
}


/* 移动端汉堡菜单：模式/外观按钮的交互边框跟随当前主题色 */
#mobile-menu .mobile-theme-hover:hover,
#mobile-menu .mobile-theme-hover:focus-visible {
    border-color: rgb(var(--p-500)) !important;
}
#mobile-menu .mobile-mode-active {
    background-color: rgb(var(--p-500)) !important;
    border-color: rgb(var(--p-500)) !important;
    color: #fff !important;
}


/* v15: 前台汉堡菜单导航视觉与后台左侧菜单统一 */
#mobile-menu .mobile-front-nav-link,
#mobile-menu .mobile-front-account-link {
    position: relative;
    color: rgb(var(--text)) !important;
    background-color: transparent !important;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
#mobile-menu .mobile-front-nav-link i {
    color: rgb(var(--text-muted)) !important;
    transition: color .15s ease;
}
#mobile-menu .mobile-front-nav-link:hover,
#mobile-menu .mobile-front-account-link:hover {
    color: rgb(var(--text)) !important;
    background-color: rgb(var(--bg-card-soft)) !important;
}
#mobile-menu .mobile-front-nav-link:hover i {
    color: rgb(var(--text)) !important;
}
#mobile-menu .mobile-front-nav-link.is-active {
    color: rgb(var(--p-400)) !important;
    background-color: rgb(var(--p-500) / .16) !important;
    box-shadow: inset 3px 0 0 rgb(var(--p-500));
}
#mobile-menu .mobile-front-nav-link.is-active i {
    color: rgb(var(--p-400)) !important;
}
#mobile-menu .mobile-front-nav-link.is-active:hover {
    color: rgb(var(--p-300)) !important;
    background-color: rgb(var(--p-500) / .22) !important;
}
#mobile-menu .mobile-front-nav-link.is-active:hover i {
    color: rgb(var(--p-300)) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link,
html[data-mode="light"] #mobile-menu .mobile-front-account-link {
    color: rgb(39 39 42) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link i {
    color: rgb(113 113 122) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link:hover,
html[data-mode="light"] #mobile-menu .mobile-front-account-link:hover {
    color: rgb(24 24 27) !important;
    background-color: rgb(244 244 245) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link:hover i {
    color: rgb(24 24 27) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link.is-active {
    color: rgb(var(--p-600)) !important;
    background-color: rgb(var(--p-500) / .12) !important;
    box-shadow: inset 3px 0 0 rgb(var(--p-500));
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link.is-active i {
    color: rgb(var(--p-600)) !important;
}
html[data-mode="light"] #mobile-menu .mobile-front-nav-link.is-active:hover {
    color: rgb(var(--p-700)) !important;
    background-color: rgb(var(--p-500) / .18) !important;
}


/* ===== v17: 页面切换/首屏性能与可读性 ===== */
.login-link:hover {
    background-color: rgb(38 38 38);
}
html[data-mode="light"] .login-link:hover {
    background-color: rgb(241 245 249);
}

/* 藏身处长列表：屏幕外模块延迟布局/绘制，滚动到附近时再渲染。 */
#hideout-cards .module-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 420px;
}


/* ===== v38: 顶部模式选择器 + 返回顶部 ===== */
.site-mode-dropdown-btn {
    width: 82px;
    min-width: 82px;
}

/* 模式菜单跟按钮同宽，避免 PVP / PVE / 赛季短文本留下过多空白。 */
.tarkov-dropdown[data-dropdown="mode"] .tarkov-dropdown-menu {
    width: 82px;
    min-width: 82px;
    right: auto;
}

/* ===== v110: 火箭式返回顶部 ===== */
.back-to-top {
    position: fixed;
    right: 22px;
    bottom: 24px;
    z-index: 45;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 1px solid rgb(var(--p-300) / .46);
    border-radius: 50%;
    background: linear-gradient(145deg, rgb(var(--p-500)), rgb(var(--p-700)));
    color: #fff;
    font-size: 17px;
    line-height: 1;
    box-shadow: 0 7px 20px rgb(var(--p-700) / .28), 0 3px 9px rgb(0 0 0 / .20);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px) scale(.84);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease,
                background-color .16s ease, border-color .16s ease, color .16s ease,
                box-shadow .16s ease;
}
.back-to-top i {
    transform: translateY(1px) rotate(-45deg);
    transition: transform .18s ease;
}
.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}
.back-to-top:hover,
.back-to-top:focus-visible {
    color: #fff;
    border-color: rgb(var(--p-200) / .75);
    background: linear-gradient(145deg, rgb(var(--p-400)), rgb(var(--p-600)));
    box-shadow: 0 10px 26px rgb(var(--p-700) / .36), 0 5px 12px rgb(0 0 0 / .22);
    transform: translateY(-3px) scale(1.04);
    outline: none;
}
.back-to-top:hover i,
.back-to-top:focus-visible i {
    transform: translateY(-3px) rotate(-45deg);
}
.back-to-top:active {
    transform: translateY(-1px) scale(.96);
}
html[data-mode="light"] .back-to-top {
    color: #fff;
    border-color: rgb(var(--p-600) / .30);
    background: linear-gradient(145deg, rgb(var(--p-500)), rgb(var(--p-700)));
    box-shadow: 0 7px 20px rgb(var(--p-600) / .24), 0 3px 9px rgb(15 23 42 / .13);
}
html[data-mode="light"] .back-to-top:hover,
html[data-mode="light"] .back-to-top:focus-visible {
    color: #fff;
    border-color: rgb(var(--p-700) / .42);
    background: linear-gradient(145deg, rgb(var(--p-400)), rgb(var(--p-600)));
    box-shadow: 0 10px 25px rgb(var(--p-600) / .30), 0 5px 12px rgb(15 23 42 / .15);
}
@media (max-width: 767px) {
    .back-to-top {
        right: 14px;
        bottom: 18px;
        width: 42px;
        height: 42px;
        font-size: 15px;
    }
}


/* 任务类型标识：Kappa 固定蓝色，不跟随站点主题色。 */
.task-kappa-filter-label {
    color: #93c5fd !important;
}
.task-kappa-filter-checkbox {
    accent-color: #3b82f6 !important;
}




/* 任务详情：提示框与目标序号在明暗主题下保持足够对比度。 */
.task-hint {
    color: rgb(var(--p-200));
    background: rgb(var(--p-500) / .10);
    border: 1px solid rgb(var(--p-500) / .42);
}
.task-hint > i {
    color: rgb(var(--p-400));
}
html[data-mode="light"] .task-hint {
    color: rgb(var(--p-800));
    background: rgb(var(--p-500) / .08);
    border-color: rgb(var(--p-500) / .42);
}
html[data-mode="light"] .task-hint > i {
    color: rgb(var(--p-600));
}
.task-objective-index {
    color: #d6d3d1;
    background: #292524;
    border: 1px solid #57534e;
}
html[data-mode="light"] .task-objective-index {
    color: #475569;
    background: #e2e8f0;
    border-color: #cbd5e1;
}


/* 个人中心任务行：hover 使用当前主题色的轻量高亮，避免白天模式整行变黑。 */
.profile-task-row {
    transition: background-color .16s ease, border-color .16s ease;
}
.profile-task-row:hover {
    background: rgb(var(--p-500) / .08) !important;
}
html[data-mode="light"] .profile-task-row:hover {
    background: rgb(var(--p-500) / .07) !important;
}

/* 任务筛选文字与任务卡片 Kappa / DSPT 标签文字保持一致。 */
.task-dspt-filter-label {
    color: #fdba74 !important;
}

/* Confirm modal: stable semantic colors. Keep this as real CSS (not escaped text),
   so dynamically inserted dialogs render correctly on the first frame. */
.tarkov-confirm-panel {
    background: #161616;
    border: 1px solid #2a2a2a;
}
.tarkov-confirm-title {
    color: #f5f5f4;
}
.tarkov-confirm-message {
    color: #d6d3d1;
}
.tarkov-confirm-cancel {
    background: #292524;
    color: #e7e5e4;
    border: 1px solid #44403c;
}
.tarkov-confirm-cancel:hover {
    background: #3f3f46;
}
html[data-mode="light"] .tarkov-confirm-panel {
    background: #ffffff;
    border-color: #e2e8f0;
}
html[data-mode="light"] .tarkov-confirm-title {
    color: #18181b;
}
html[data-mode="light"] .tarkov-confirm-message {
    color: #3f3f46;
}
html[data-mode="light"] .tarkov-confirm-cancel {
    background: #e2e8f0;
    color: #18181b;
    border-color: #cbd5e1;
}
html[data-mode="light"] .tarkov-confirm-cancel:hover {
    background: #cbd5e1;
}

/* 剧情详情：右侧状态/导航与主题统一，避免白天背景发蓝和 hover 变黑。 */
.storyline-status-card,
.storyline-nav-card {
    background: #161616 !important;
    border-color: #2a2a2a !important;
}
.storyline-side-label,
.storyline-nav-title { color: #e7e5e4 !important; }
.storyline-nav-count { color: #78716c !important; }
.storyline-nav-icon { color: rgb(var(--p-400)) !important; }
.storyline-nav-head { border-color: #2a2a2a !important; }
.storyline-nav-item { background: transparent !important; }
.storyline-nav-item .nav-index {
    color: #a8a29e !important;
    background: #292524 !important;
    border: 1px solid #44403c;
}
.storyline-nav-item .nav-title { color: #d6d3d1 !important; }
.storyline-nav-item:hover,
.storyline-nav-item.is-current {
    background: rgb(var(--p-500) / .12) !important;
}
.storyline-nav-item:hover .nav-index,
.storyline-nav-item.is-current .nav-index {
    color: rgb(var(--p-300)) !important;
    background: rgb(var(--p-500) / .18) !important;
    border-color: rgb(var(--p-500) / .38) !important;
}
.storyline-nav-item:hover .nav-title,
.storyline-nav-item.is-current .nav-title { color: rgb(var(--p-300)) !important; }
.storyline-nav-item .nav-index.is-done {
    color: #34d399 !important;
    background: rgb(16 185 129 / .18) !important;
    border-color: rgb(16 185 129 / .38) !important;
}
.storyline-nav-item .nav-title.is-done { color: #34d399 !important; text-decoration: none !important; }
.storyline-complete-btn[data-complete="0"] {
    color: #d6d3d1;
    background: #292524;
    border: 1px solid #44403c;
}
.storyline-complete-btn[data-complete="0"]:hover {
    color: rgb(var(--p-300));
    border-color: rgb(var(--p-500) / .55);
    background: rgb(var(--p-500) / .12);
}
.storyline-complete-btn[data-complete="1"] {
    color: white;
    background: #059669;
    border: 1px solid #10b981;
}
.storyline-jump-comments {
    color: rgb(var(--p-300));
    background: rgb(var(--p-500) / .08);
    border: 1px solid rgb(var(--p-500) / .42);
}
.storyline-jump-comments:hover { background: rgb(var(--p-500) / .16); }

html[data-mode="light"] .storyline-status-card,
html[data-mode="light"] .storyline-nav-card {
    background: #fff !important;
    border-color: #dbe3ee !important;
}
html[data-mode="light"] .storyline-side-label,
html[data-mode="light"] .storyline-nav-title { color: #1f2937 !important; }
html[data-mode="light"] .storyline-nav-count { color: #64748b !important; }
html[data-mode="light"] .storyline-nav-head { border-color: #e2e8f0 !important; }
html[data-mode="light"] .storyline-nav-item .nav-index {
    color: #475569 !important;
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
}
html[data-mode="light"] .storyline-nav-item .nav-title { color: #334155 !important; }
html[data-mode="light"] .storyline-nav-item:hover,
html[data-mode="light"] .storyline-nav-item.is-current {
    background: rgb(var(--p-500) / .08) !important;
}
html[data-mode="light"] .storyline-nav-item:hover .nav-index,
html[data-mode="light"] .storyline-nav-item.is-current .nav-index {
    color: rgb(var(--p-700)) !important;
    background: rgb(var(--p-500) / .12) !important;
    border-color: rgb(var(--p-500) / .32) !important;
}
html[data-mode="light"] .storyline-nav-item:hover .nav-title,
html[data-mode="light"] .storyline-nav-item.is-current .nav-title { color: rgb(var(--p-700)) !important; }
html[data-mode="light"] .storyline-nav-item .nav-index.is-done {
    color: #047857 !important;
    background: #d1fae5 !important;
    border-color: #a7f3d0 !important;
}
html[data-mode="light"] .storyline-nav-item .nav-title.is-done { color: #059669 !important; }
html[data-mode="light"] .storyline-complete-btn[data-complete="0"] {
    color: #334155;
    background: #e2e8f0;
    border-color: #cbd5e1;
}
html[data-mode="light"] .storyline-complete-btn[data-complete="0"]:hover {
    color: rgb(var(--p-700));
    border-color: rgb(var(--p-500) / .45);
    background: rgb(var(--p-500) / .08);
}
html[data-mode="light"] .storyline-jump-comments {
    color: rgb(var(--p-700));
    background: rgb(var(--p-500) / .06);
    border-color: rgb(var(--p-500) / .38);
}

/* v53 剧情目标：完成/取消状态使用稳定 CSS，避免动态 Tailwind class 未编译导致需刷新才正确。 */
.storyline-objective {
    background: #161616;
    border: 1px solid #2a2a2a;
    color: #e7e5e4;
}
.storyline-objective .obj-title { color: #f5f5f4; }
.storyline-objective .obj-index {
    color: #f59e0b;
    background: rgb(245 158 11 / .15);
}
.storyline-objective .obj-done-btn {
    border: 2px solid #3a3a3a;
    color: #78716c;
    background: transparent;
}
.storyline-objective .obj-done-btn:hover {
    border-color: rgb(var(--p-500));
    color: rgb(var(--p-400));
}
.storyline-objective[data-done="1"] {
    border-color: rgb(16 185 129 / .55);
}
.storyline-objective[data-done="1"] .obj-title { color: #34d399; }
.storyline-objective[data-done="1"] .obj-index {
    color: #34d399;
    background: rgb(16 185 129 / .18);
}
.storyline-objective[data-done="1"] .obj-done-btn {
    border-color: #10b981;
    color: #34d399;
    background: rgb(16 185 129 / .15);
}
.storyline-objective[data-done="1"] .obj-done-btn:hover {
    border-color: #34d399;
    color: #6ee7b7;
    background: rgb(16 185 129 / .22);
}

html[data-mode="light"] .storyline-objective {
    background: #fff;
    border-color: #dbe3ee;
    color: #0f172a;
}
html[data-mode="light"] .storyline-objective .obj-title { color: #0f172a; }
html[data-mode="light"] .storyline-objective .obj-index {
    color: rgb(var(--p-600));
    background: rgb(var(--p-500) / .12);
}
html[data-mode="light"] .storyline-objective .obj-done-btn {
    border-color: #dbe3ee;
    color: #64748b;
    background: #fff;
}
html[data-mode="light"] .storyline-objective .obj-done-btn:hover {
    border-color: rgb(var(--p-500));
    color: rgb(var(--p-600));
    background: rgb(var(--p-500) / .06);
}
html[data-mode="light"] .storyline-objective[data-done="1"] {
    border-color: #34d399;
}
html[data-mode="light"] .storyline-objective[data-done="1"] .obj-title { color: #059669; }
html[data-mode="light"] .storyline-objective[data-done="1"] .obj-index {
    color: #059669;
    background: #d1fae5;
}
html[data-mode="light"] .storyline-objective[data-done="1"] .obj-done-btn {
    border-color: #10b981;
    color: #059669;
    background: #ecfdf5;
}


/* 任务列表商人标签：使用固定中性色，不跟随主题色 */
.trader-badge {
    color: #e5e7eb !important;
    background: #18181b !important;
    border-color: #4b5563 !important;
}
html[data-mode="light"] .trader-badge {
    color: #111827 !important;
    background: #ffffff !important;
    border-color: #cbd5e1 !important;
}


/* 任务详情页商人：保留标签框，但使用与任务标题一致的中性色 */
.trader-badge-detail {
    color: rgb(245 245 244) !important;
    background: rgb(41 37 36) !important;
    border-color: #3a3a3a !important;
}
html[data-mode="light"] .trader-badge-detail {
    color: rgb(28 25 23) !important;
    background: rgb(226 232 240) !important;
    border-color: rgb(203 213 225) !important;
}


/* Task required item collection */
.task-item-requirements-list{display:flex;flex-direction:column;gap:0}.task-required-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 12px;border:0;border-radius:0}.task-required-item+.task-required-item{border-top:1px solid #303034}.task-required-item-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.task-required-item-image{width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex:0 0 42px;border:1px solid var(--border,#333);border-radius:7px;overflow:hidden}.task-required-item-image img{max-width:100%;max-height:100%;object-fit:contain}.task-required-item-info{min-width:0}.task-required-item-name{font-weight:600;line-height:1.35}.task-required-item-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:5px;font-size:12px;color:#a8a29e}.task-required-item-type{display:inline-flex;align-items:center;min-height:22px;padding:2px 7px;border:1px solid #3f3f46;border-radius:5px;background:#27272a;color:#d6d3d1;font-weight:500}.task-required-item-fir{color:var(--accent,#3b82f6);background:color-mix(in srgb,var(--accent,#3b82f6) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent,#3b82f6) 28%,transparent);padding:2px 7px;border-radius:5px}.task-required-item-qty{white-space:nowrap;letter-spacing:.01em}.task-required-item-counter{display:flex;align-items:center;white-space:nowrap;flex:0 0 auto;margin-left:auto}.task-required-item-stepper{height:34px;display:inline-flex;align-items:center;border:1px solid #3f3f46;border-radius:9px;background:#202022;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.18)}.task-required-item-stepper button{width:34px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:#d6d3d1;font-size:11px;transition:background-color .15s,color .15s}.task-required-item-stepper button:hover{background:color-mix(in srgb,var(--accent,#3b82f6) 14%,#202022);color:var(--accent,#3b82f6)}.task-required-item-stepper button:disabled{opacity:.45;cursor:not-allowed}.task-required-item-countbox{height:32px;min-width:66px;padding:0 9px;display:inline-flex;align-items:center;justify-content:center;gap:4px;border-left:1px solid #3f3f46;border-right:1px solid #3f3f46;background:#18181b;font-size:14px;line-height:1;font-variant-numeric:tabular-nums}.task-required-item-countbox strong,.task-required-item-countbox .task-required-item-count-total,.task-required-item-countbox .task-required-item-count-sep{font-size:14px;line-height:1;font-weight:600}.task-required-item-countbox strong{color:var(--accent,#3b82f6)}.task-required-item-countbox .task-required-item-count-sep,.task-required-item-countbox .task-required-item-count-total{color:#a8a29e}html[data-mode="light"] .task-required-item+.task-required-item{border-top-color:#e2e8f0}html[data-mode="light"] .task-required-item-name{color:#18181b}html[data-mode="light"] .task-required-item-tags{color:#71717a}html[data-mode="light"] .task-required-item-type{background:#f4f4f5;border-color:#e4e4e7;color:#3f3f46}html[data-mode="light"] .task-required-item-stepper{background:#fff;border-color:#d4d4d8;box-shadow:0 1px 2px rgba(0,0,0,.05)}html[data-mode="light"] .task-required-item-stepper button{color:#52525b}html[data-mode="light"] .task-required-item-stepper button:hover{background:color-mix(in srgb,var(--accent,#3b82f6) 8%,#fff);color:var(--accent,#3b82f6)}html[data-mode="light"] .task-required-item-countbox{background:#fafafa;border-color:#e4e4e7}html[data-mode="light"] .task-required-item-countbox .task-required-item-count-sep,html[data-mode="light"] .task-required-item-countbox .task-required-item-count-total{color:#71717a}@media(max-width:640px){.task-required-item{align-items:center;flex-direction:row;gap:10px;padding:12px 4px}.task-required-item-main{gap:8px;min-width:0}.task-required-item-image{width:38px;height:38px;flex-basis:38px}.task-required-item-tags{gap:5px;flex-wrap:wrap}.task-required-item-counter{width:auto;justify-content:flex-end;margin-left:auto}.task-required-item-stepper{margin-left:0;height:32px}.task-required-item-stepper button{width:30px;height:30px}.task-required-item-countbox{height:30px;min-width:58px;padding:0 7px;font-size:13px}.task-required-item-countbox strong,.task-required-item-countbox .task-required-item-count-total,.task-required-item-countbox .task-required-item-count-sep{font-size:13px}}

/* ===== Dedicated item collection page ===== */
.collection-page{max-width:1500px;margin:0 auto;padding:28px 16px 10px}
.collection-hero,.collection-toolbar{background:rgb(var(--bg-card));border:1px solid rgb(var(--border));border-radius:14px}
.collection-hero{display:flex;align-items:center;padding:20px 24px;margin-bottom:14px}
.collection-hero h1{margin:0;font-size:24px;font-weight:800;display:flex;align-items:center;gap:10px;color:rgb(var(--text))}
.collection-hero h1 i{color:rgb(var(--p-600))}
.collection-toolbar{padding:0 12px;display:flex;align-items:center;gap:18px;margin-bottom:18px;min-height:58px}
.collection-tabs{display:flex;align-items:stretch;gap:8px;overflow-x:auto;flex:1;align-self:stretch}
.collection-tabs button{position:relative;min-height:58px;display:inline-flex;align-items:center;gap:8px;padding:0 14px;border:0;background:transparent;color:rgb(var(--text-muted));white-space:nowrap;font-size:14px;font-weight:600;transition:color .15s ease,background-color .15s ease}
.collection-tabs button::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;border-radius:2px;background:transparent;transition:background-color .15s ease}
.collection-tabs button:hover{background:rgba(var(--p-500),.055);color:rgb(var(--text))}
.collection-tabs button.is-active{background:transparent;color:rgb(var(--p-600))}
.collection-tabs button.is-active::after{background:rgb(var(--p-600))}
.collection-search-wrap{height:38px;min-width:260px;display:flex;align-items:center;gap:8px;border:1px solid rgb(var(--border));border-radius:8px;padding:0 11px;background:rgb(var(--bg))}
.collection-search-wrap:focus-within{border-color:rgb(var(--border));box-shadow:none;outline:none}
.collection-search-wrap i{font-size:12px;color:rgb(var(--text-muted))}
.collection-search-wrap input{min-width:0;flex:1;background:transparent;border:0;outline:0;color:rgb(var(--text));font-size:13px}
.collection-search-wrap input::placeholder{color:rgb(var(--text-muted))}
.collection-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.collection-card{display:block;text-align:left;background:rgb(var(--bg-card));border:1px solid rgb(var(--border));border-radius:12px;overflow:hidden;transition:.16s ease;color:rgb(var(--text));min-width:0}
.collection-card:hover{transform:translateY(-1px);border-color:rgba(var(--p-500),.5);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.collection-card-top{display:flex;align-items:center;gap:11px;padding:13px}
.collection-thumb,.collection-modal-thumb{display:flex;align-items:center;justify-content:center;background:rgb(var(--bg-card-soft));border-radius:8px;overflow:hidden;flex:0 0 auto}
.collection-thumb{width:48px;height:48px}
.collection-thumb img,.collection-modal-thumb img{width:100%;height:100%;object-fit:contain}
.collection-thumb i{color:rgb(var(--text-muted))}
.collection-card-main{min-width:0;flex:1}
.collection-card-main strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgb(var(--text))}
.collection-card-main small{display:block;margin-top:4px;font-size:12px;color:rgb(var(--text-muted));font-variant-numeric:tabular-nums}
.collection-card-main small em{font-style:normal;color:rgb(var(--p-600));font-weight:700}
.collection-remaining{font-size:11px;color:rgb(var(--text-muted));white-space:nowrap}
.collection-remaining.is-done{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,.12);color:rgb(16 185 129)}
.collection-progress{height:3px;display:block;background:rgba(var(--text),.06);margin:0 13px}
.collection-progress i{display:block;height:100%;background:rgb(var(--p-600));border-radius:2px}
.collection-card-meta{display:flex;align-items:center;gap:14px;padding:9px 13px 11px;color:rgb(var(--text-muted));font-size:11px;border-top:1px solid rgba(var(--border),.75)}
.collection-card-meta span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.collection-card-meta span b{font-size:11px;font-weight:700;color:rgb(var(--text));font-variant-numeric:tabular-nums}
.collection-card-meta .is-fir{margin-left:auto;color:rgb(var(--p-600))}
.collection-card-meta .is-fir b{color:rgb(var(--p-600))}
.collection-key-mark{color:rgb(var(--p-600));font-size:18px}
.collection-empty{padding:70px 10px;display:flex;flex-direction:column;align-items:center;gap:10px;color:rgb(var(--text-muted))}
.collection-empty i{font-size:30px}
.collection-modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px}
.collection-modal[hidden]{display:none}
.collection-modal-backdrop{position:absolute;inset:0;z-index:0;background:rgba(0,0,0,.58);backdrop-filter:blur(3px)}
.collection-modal-panel{position:relative;z-index:1;width:min(650px,100%);max-height:min(760px,88vh);overflow:auto;background:rgb(var(--bg-card));color:rgb(var(--text));border:1px solid rgb(var(--border));border-radius:16px;box-shadow:0 24px 80px rgba(0,0,0,.35);padding:22px}
.collection-modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:8px;color:rgb(var(--text-muted));display:flex;align-items:center;justify-content:center}
.collection-modal-close:hover{background:rgb(var(--bg-card-soft));color:rgb(var(--text))}
.collection-modal-head{display:flex;align-items:center;gap:14px;padding-right:42px;padding-bottom:18px;border-bottom:1px solid rgb(var(--border))}
.collection-modal-thumb{width:68px;height:68px;border:1px solid rgb(var(--border))}
.collection-modal-head h2{font-size:20px;font-weight:800;color:rgb(var(--text))}
.collection-modal-head p{margin-top:4px;font-size:13px;color:rgb(var(--text-muted))}
.collection-source-group{margin-top:18px;color:rgb(var(--text))}
.collection-source-group h3{font-size:14px;font-weight:700;margin-bottom:9px;display:flex;align-items:center;gap:7px;color:rgb(var(--text))}
.collection-source-group h3 i{color:rgb(var(--p-600));width:16px;text-align:center}
.collection-source-group h3 span{color:rgb(var(--text-muted));font-weight:500}
.collection-source-row{display:flex;align-items:center;gap:10px;min-height:52px;background:rgb(var(--bg-card-soft));border:1px solid rgb(var(--border));border-radius:10px;padding:9px 10px;margin-top:7px;color:rgb(var(--text))}
.collection-source-title{min-width:0;flex:1;color:rgb(var(--text))}
.collection-source-title strong{display:block;font-size:13px;color:rgb(var(--text));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.collection-source-title:hover strong{color:rgb(var(--p-600))}
.collection-source-title small{display:block;margin-top:2px;font-size:11px;color:rgb(var(--text-muted))}
.collection-source-flags{display:flex;align-items:center;gap:5px}
.fir-badge,.info-badge{font-size:10px;padding:3px 6px;border-radius:5px;white-space:nowrap}
.fir-badge{color:rgb(var(--p-600));background:rgba(var(--p-500),.1);border:1px solid rgba(var(--p-500),.25)}
.info-badge{color:rgb(var(--text-muted));background:rgb(var(--bg-card));border:1px solid rgb(var(--border))}
.collection-stepper{display:flex;align-items:center;height:30px;border:1px solid rgb(var(--border));border-radius:7px;overflow:hidden;background:rgb(var(--bg-card))}
.collection-stepper button{width:30px;height:30px;color:rgb(var(--text));font-size:16px}
.collection-stepper button:hover{background:rgba(var(--p-500),.1);color:rgb(var(--p-600))}
.collection-stepper button:disabled{opacity:.4;cursor:wait}
.collection-stepper b{min-width:54px;text-align:center;border-left:1px solid rgb(var(--border));border-right:1px solid rgb(var(--border));font-size:12px;font-weight:600;color:rgb(var(--text));font-variant-numeric:tabular-nums}
.collection-stepper b [data-have]{color:rgb(var(--p-600))}
.collection-only-display{font-size:12px;color:rgb(var(--text-muted));white-space:nowrap}
.collection-key-source>i{color:rgb(var(--text-muted));font-size:11px}
@media(max-width:1100px){.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:820px){.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-toolbar{display:block;padding:0 10px 10px}.collection-tabs{min-height:54px}.collection-tabs button{min-height:54px}.collection-search-wrap{margin-top:8px;min-width:0;width:100%}.collection-hero{padding:18px}}
@media(max-width:560px){.collection-page{padding:16px 10px}.collection-hero h1{font-size:21px}.collection-grid{grid-template-columns:1fr}.collection-card-top{padding:11px}.collection-card-meta{padding:8px 11px 10px;gap:10px}.collection-thumb{width:44px;height:44px}.collection-modal{padding:10px}.collection-modal-panel{padding:17px 13px;border-radius:13px}.collection-modal-head{padding-right:38px}.collection-modal-thumb{width:58px;height:58px}.collection-source-row{gap:7px}.collection-source-flags{display:none}.collection-stepper b{min-width:48px}.collection-tabs button{padding:0 10px}}

/* ===== Collection page refinements v88 ===== */
.collection-hero{justify-content:space-between;gap:18px}
.collection-total-count{margin-left:auto;display:flex;align-items:baseline;gap:5px;color:rgb(var(--text));font-variant-numeric:tabular-nums;white-space:nowrap}
.collection-total-count strong{font-size:22px;line-height:1;font-weight:800;color:rgb(var(--p-600))}
.collection-total-count span{font-size:16px;color:rgb(var(--text-muted));font-weight:600}
.collection-tabs button{color:rgb(var(--text));font-weight:650}
.collection-tabs button:hover{color:rgb(var(--text));background:rgba(var(--p-500),.045)}
.collection-tabs button.is-active{color:rgb(var(--p-600));font-weight:750}
.collection-card-meta-split{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0;border-top:1px solid rgba(var(--border),.75);min-height:54px}
.collection-card-meta-split .collection-meta-side{display:flex;flex-wrap:wrap;align-content:center;align-items:center;gap:4px 8px;min-width:0;padding:8px 12px;color:rgb(var(--text-muted));font-size:11px}
.collection-card-meta-split .collection-meta-side:first-child{border-right:1px solid rgba(var(--border),.75)}
.collection-card-meta-split .collection-meta-title{display:flex;align-items:center;gap:5px;width:100%;font-size:11px;color:rgb(var(--text-muted));font-weight:600}
.collection-card-meta-split .collection-meta-title i{width:12px;text-align:center}
.collection-card-meta-split .collection-meta-line{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.collection-card-meta-split .collection-meta-line small{font-size:10px;color:rgb(var(--text-muted));font-weight:500}
.collection-card-meta-split .collection-meta-line b{font-size:11px;font-weight:750;color:rgb(var(--text));font-variant-numeric:tabular-nums}
.collection-card-meta-split .collection-meta-line.is-fir small,
.collection-card-meta-split .collection-meta-line.is-fir b{color:rgb(var(--p-600))}
.collection-card-meta-split .collection-meta-line.is-fir i{font-size:9px}
@media(max-width:560px){
  .collection-total-count strong{font-size:19px}
  .collection-card-meta-split .collection-meta-side{padding:7px 9px;gap:3px 6px}
  .collection-card-meta-split{min-height:50px}
}

/* ===== Collection page refinements v89 ===== */
.collection-card{transition:background-color .15s ease,border-color .15s ease;}
.collection-card:hover{transform:none;border-color:rgb(var(--border));box-shadow:none;background:rgba(var(--p-500),.11)}
.collection-card-meta-split{display:flex;align-items:stretch;min-height:54px}
.collection-card-meta-split .collection-meta-side{flex:1 1 0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;padding:8px 12px;min-width:0}
.collection-card-meta-split .collection-meta-side:only-child{flex:0 1 50%;border-right:0}
.collection-card-meta-split .collection-meta-side:first-child:not(:only-child){border-right:1px solid rgba(var(--border),.75)}
.collection-card-meta-split .collection-meta-values{display:flex;align-items:center;gap:10px;min-height:16px;white-space:nowrap}
.collection-card-meta-split .collection-meta-line{display:inline-flex;align-items:center;gap:4px;line-height:16px;height:16px}
.collection-card-meta-split .collection-meta-line small,.collection-card-meta-split .collection-meta-line b{display:inline-flex;align-items:center;line-height:16px;height:16px;margin:0}
@media(max-width:560px){
 .collection-source-flags{display:flex;flex-wrap:wrap}
 .collection-card-meta-split .collection-meta-side{padding:7px 9px}
 .collection-card-meta-split .collection-meta-values{gap:8px}
}

/* ===== Collection page refinements v91 ===== */
.collection-card-top{padding:10px 13px 7px}
.collection-card-meta-split{min-height:44px}
.collection-card-meta-split .collection-meta-side{padding:6px 12px;gap:2px}
.collection-card-meta-split .collection-meta-title{line-height:15px}
.collection-card-meta-split .collection-meta-values{min-height:15px}
.collection-card-meta-split .collection-meta-line,.collection-card-meta-split .collection-meta-line small,.collection-card-meta-split .collection-meta-line b{height:15px;line-height:15px}
.collection-stepper b{cursor:text;user-select:none}
.collection-stepper b:hover{background:rgba(var(--p-500),.08)}
.collection-stepper-input{width:54px;height:28px;padding:0 5px;border:0;outline:0;background:rgb(var(--bg-card));color:var(--accent,#3b82f6);font-family:inherit;font-size:12px;font-weight:400;line-height:28px;text-align:center;font-variant-numeric:tabular-nums;appearance:textfield;-moz-appearance:textfield;caret-color:var(--accent,#3b82f6)}
.collection-stepper-input::-webkit-inner-spin-button,.collection-stepper-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
@media(max-width:560px){
 .collection-card-top{padding:9px 11px 6px}
 .collection-card-meta-split{min-height:42px}
 .collection-card-meta-split .collection-meta-side{padding:5px 9px}
 .collection-stepper-input{width:48px}
}

/* v92: 任务详情物品数量支持点击直接输入 */
.task-required-item-countbox{cursor:text}
.task-required-item-count-input{width:54px;height:28px;border:0;outline:0;background:transparent;color:var(--accent,#3b82f6);font:inherit;font-weight:600;text-align:center;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.task-required-item-count-input::-webkit-outer-spin-button,.task-required-item-count-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
@media(max-width:640px){.task-required-item-count-input{width:46px;height:26px}}


/* ===== Collection readability + live detail sync v93 ===== */
.collection-card-main small,
.collection-remaining,
.collection-card-meta-split .collection-meta-title,
.collection-card-meta-split .collection-meta-line small{color:rgb(var(--text))}
.collection-card-meta-split .collection-meta-title i{color:inherit}
.collection-stepper b{display:inline-flex;align-items:center;justify-content:center;gap:4px;line-height:1}
.collection-stepper-sep{color:rgb(var(--text-muted));font-weight:500}
html[data-mode="light"] .collection-card-main small,
html[data-mode="light"] .collection-remaining,
html[data-mode="light"] .collection-card-meta-split .collection-meta-title,
html[data-mode="light"] .collection-card-meta-split .collection-meta-line small{color:#18181b}
html[data-mode="dark"] .collection-card-main small,
html[data-mode="dark"] .collection-remaining,
html[data-mode="dark"] .collection-card-meta-split .collection-meta-title,
html[data-mode="dark"] .collection-card-meta-split .collection-meta-line small{color:#e7e5e4}

/* v94: 全站文字字重统一，避免局部粗体造成视觉不一致。
   不使用 * 覆盖，避免破坏 Font Awesome 图标所需的 font-weight。 */
body,
h1, h2, h3, h4, h5, h6,
p, span, a, label, button, input, select, textarea,
th, td, li, dt, dd, legend, summary,
strong, b,
.font-bold, .font-semibold, .font-medium {
    font-weight: 400 !important;
}

/* v95: 任务详情物品统计当前数量跟随全站主题色 */
.task-required-item-countbox [data-task-item-count],
.task-required-item-count-input {
    color: rgb(var(--p-600)) !important;
}

/* v97: collection desktop search fills the remaining toolbar width */
@media (min-width:821px){
  .collection-tabs{flex:0 0 auto;overflow:visible}
  .collection-search-wrap{flex:1 1 auto;min-width:0;width:auto;margin-left:2px}
}

/* v102: Kappa / DSPT markers keep their semantic colors, but use stronger contrast in light mode. */
html[data-mode="light"] .task-kappa-filter-label { color: #2563eb !important; }
html[data-mode="light"] .task-dspt-filter-label { color: #ea580c !important; }
html[data-mode="light"] .task-kappa-filter-checkbox { accent-color: #2563eb !important; }
html[data-mode="light"] .task-dspt-filter-checkbox { accent-color: #ea580c !important; }
html[data-mode="light"] .task-special-kappa {
    color: #2563eb !important;
    background: #eff6ff !important;
    border-color: #60a5fa !important;
}
html[data-mode="light"] .task-special-dspt {
    color: #ea580c !important;
    background: #fff7ed !important;
    border-color: #fb923c !important;
}

/* v103: 夜间模式下任务筛选 Kappa / DSPT 文字降低亮度，避免刺眼；仅影响筛选项文字。 */
html[data-mode="dark"] .task-kappa-filter-label {
    color: #7fa9d8 !important;
}
html[data-mode="dark"] .task-dspt-filter-label {
    color: #d89b61 !important;
}

/* v105 个人中心：任务进度按商人汇总。 */
.profile-trader-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    align-items: start;
    gap: 12px;
}
@media (min-width: 700px) {
    .profile-trader-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
    .profile-trader-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1450px) {
    .profile-trader-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.profile-trader-card {
    display: block;
    min-height: 0 !important;
    height: auto !important;
    align-self: start;
    padding: 12px 14px !important;
    border-radius: 12px;
    border: 1px solid rgb(var(--border));
    background: rgb(var(--bg-card-soft) / .45);
    color: rgb(var(--text));
    transition: background-color .16s ease, border-color .16s ease;
}
.profile-trader-card:hover {
    background: rgb(var(--p-500) / .08);
    border-color: rgb(var(--p-500) / .24);
}
.profile-trader-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.profile-trader-avatar {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid rgb(var(--border-soft));
    background: rgb(var(--bg-card));
}
.profile-trader-avatar img,
.profile-trader-avatar-fallback {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.profile-trader-avatar-fallback {
    align-items: center;
    justify-content: center;
    color: rgb(var(--text-muted));
}
.profile-trader-main {
    min-width: 0;
    flex: 1;
    padding-top: 2px;
}
.profile-trader-name {
    color: rgb(var(--text));
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.profile-trader-count {
    margin-top: 5px;
    color: rgb(var(--text-dim));
    font-size: 12px;
    line-height: 1;
}
.profile-trader-percent {
    color: rgb(var(--p-500));
    font-size: 13px;
    line-height: 1.3;
    white-space: nowrap;
    padding-top: 2px;
}
.profile-trader-progress {
    height: 7px;
    margin-top: 10px;
    border-radius: 999px;
    overflow: hidden;
    background: rgb(var(--border));
}
.profile-trader-progress > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: rgb(var(--p-500));
    transition: width .2s ease;
}
html[data-mode="light"] .profile-trader-card {
    background: rgb(var(--bg-card));
}
html[data-mode="light"] .profile-trader-card:hover {
    background: rgb(var(--p-500) / .07);
}
.interactive-map{height:calc(100vh - 3.5rem);min-height:620px;display:grid;grid-template-columns:260px minmax(0,1fr) 300px;background:#0b0d10;color:#e7e5e4;overflow:hidden}.map-panel{background:#111318;border-color:#2b3038;overflow-y:auto;padding:18px}.map-panel-left{border-right:1px solid #2b3038}.map-panel-right{border-left:1px solid #2b3038}.map-panel-heading{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:16px;margin-bottom:10px;border-bottom:1px solid #2b3038}.map-panel-heading h1,.map-panel-heading h2{font-size:1.25rem;font-weight:700;color:#fafaf9}.map-panel-heading small{font-size:.75rem;color:#78716c}.map-eyebrow{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:rgb(var(--accent));margin-bottom:3px}.map-filter,.map-task{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-radius:8px;color:#a8a29e;text-align:left;font-size:.875rem;transition:.15s}.map-filter span{display:flex;align-items:center;gap:9px}.map-filter i{width:16px;text-align:center}.map-filter b{font-size:.75rem;color:#57534e}.map-filter:hover,.map-filter.is-active,.map-task:hover,.map-task.is-active{background:rgba(var(--accent),.12);color:rgb(var(--accent))}.map-task{display:block;border-bottom:1px solid #22262d;border-radius:0}.map-task span{display:block;color:inherit}.map-task small{display:block;color:#78716c;margin-top:2px}.map-empty{padding:18px 8px;color:#78716c;font-size:.8rem}.map-canvas-shell{position:relative;min-width:0;display:flex;flex-direction:column}.map-toolbar{height:52px;display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 12px;background:#111318;border-bottom:1px solid #2b3038;z-index:5}.map-toolbar button,.map-floor{height:36px;padding:0 12px;border:1px solid #363c46;border-radius:7px;color:#a8a29e;font-size:.8rem}.map-toolbar button:hover,.map-floor.is-active{color:#fff;border-color:rgb(var(--accent));background:rgba(var(--accent),.15)}.map-floor-tabs{display:flex;gap:5px;margin-right:auto}.map-viewport{position:relative;flex:1;overflow:hidden;cursor:grab;background-color:#0b0d10;background-image:linear-gradient(#20242a 1px,transparent 1px),linear-gradient(90deg,#20242a 1px,transparent 1px);background-size:48px 48px;touch-action:none}.map-viewport:active{cursor:grabbing}.map-stage{position:absolute;width:2800px;height:3100px;transform-origin:0 0;will-change:transform}.map-stage>img{display:block;width:2800px;height:3100px;user-select:none}.map-marker{position:absolute;z-index:3;width:38px;height:38px;transform:translate(-50%,-100%);border:3px solid #fff;border-radius:50% 50% 50% 0;background:var(--marker-color);color:#fff;rotate:-45deg;box-shadow:0 5px 15px #0009}.map-marker i{rotate:45deg;font-size:15px}.map-marker:hover{z-index:4;scale:1.18}.map-zoom{position:absolute;right:16px;bottom:16px;display:grid;gap:5px;z-index:6}.map-zoom button{width:38px;height:38px;border-radius:8px;background:#16191f;border:1px solid #343a44;color:#e7e5e4}.map-no-svg{display:grid;place-content:center;flex:1;text-align:center;color:#78716c;gap:12px}.map-no-svg i{font-size:3rem}.map-marker-modal{position:fixed;inset:0;z-index:90;display:none;place-items:center;padding:20px;background:#000b;backdrop-filter:blur(5px)}.map-marker-modal.is-open{display:grid}.map-marker-dialog{position:relative;width:min(520px,100%);overflow:hidden;border:1px solid #343a44;border-radius:14px;background:#15181d;box-shadow:0 24px 80px #000}.map-marker-dialog>img{width:100%;max-height:330px;object-fit:cover}.map-modal-close{position:absolute;right:10px;top:10px;width:34px;height:34px;border-radius:50%;background:#090b0dcc;color:#fff}.map-marker-dialog span{font-size:.75rem;color:rgb(var(--accent))}.map-marker-dialog h3{font-size:1.25rem;font-weight:700;margin:4px 0 8px}.map-marker-dialog p{color:#a8a29e;white-space:pre-line}.map-marker-dialog a{display:inline-flex;margin-top:14px;color:rgb(var(--accent));font-size:.875rem}.map-panel-backdrop{display:none}.map-panel-close{color:#a8a29e}.interactive-map:fullscreen{height:100vh}.interactive-map:fullscreen .map-toolbar{padding-top:8px}
@media(max-width:1023px){.interactive-map{grid-template-columns:1fr;height:calc(100vh - 3.5rem);min-height:520px}.map-panel{position:absolute;top:0;bottom:0;width:min(330px,88vw);z-index:30;transition:transform .22s}.map-panel-left{left:0;transform:translateX(-105%)}.map-panel-right{right:0;transform:translateX(105%)}.map-panel.is-open{transform:none}.map-panel-backdrop{position:absolute;inset:0;z-index:25;background:#0009}.map-panel-backdrop.is-open{display:block}.map-toolbar{justify-content:space-between}.map-floor-tabs{margin:0;overflow-x:auto}.map-toolbar button,.map-floor{padding:0 9px}.map-toolbar>button{display:inline-flex;align-items:center;gap:5px}.map-canvas-shell{height:100%}}
.map-meta{display:flex;gap:12px;margin-top:7px;color:#78716c;font-size:.75rem}.map-meta span{display:inline-flex;align-items:center;gap:5px}
.map-stage{will-change:auto!important}.map-stage>img{max-width:none}
html[data-mode="light"] .interactive-map{background:#f4f6f8;color:#1f2937}
html[data-mode="light"] .map-panel{background:#fff;border-color:#dce2e8}
html[data-mode="light"] .map-panel-left{border-right-color:#dce2e8}
html[data-mode="light"] .map-panel-right{border-left-color:#dce2e8}
html[data-mode="light"] .map-panel-heading{border-bottom-color:#e2e8f0}
html[data-mode="light"] .map-panel-heading h1,
html[data-mode="light"] .map-panel-heading h2{color:#111827}
html[data-mode="light"] .map-filter,
html[data-mode="light"] .map-task{color:#475569}
html[data-mode="light"] .map-filter b,
html[data-mode="light"] .map-task small,
html[data-mode="light"] .map-empty,
html[data-mode="light"] .map-meta{color:#64748b}
html[data-mode="light"] .map-task{border-bottom-color:#e2e8f0}
html[data-mode="light"] .map-filter:hover,
html[data-mode="light"] .map-filter.is-active,
html[data-mode="light"] .map-task:hover,
html[data-mode="light"] .map-task.is-active{background:rgba(var(--accent),.1);color:rgb(var(--p-700))}
html[data-mode="light"] .map-toolbar{background:#fff;border-bottom-color:#dce2e8}
html[data-mode="light"] .map-toolbar button,
html[data-mode="light"] .map-floor{border-color:#cbd5e1;color:#475569;background:#fff}
html[data-mode="light"] .map-toolbar button:hover,
html[data-mode="light"] .map-floor.is-active{border-color:rgb(var(--accent));color:rgb(var(--p-700));background:rgba(var(--accent),.1)}
html[data-mode="light"] .map-viewport{background-color:#f5f7f9;background-image:linear-gradient(#dce2e8 1px,transparent 1px),linear-gradient(90deg,#dce2e8 1px,transparent 1px)}

/* 地图任务跨楼层点位导航 */
.map-task-row{border-bottom:1px solid #22262d;padding-bottom:7px}
.map-task-row>.map-task{border-bottom:0}
.map-task-floors{display:flex;flex-wrap:wrap;gap:5px;padding:0 10px}
.map-task-floor{padding:3px 7px;border:1px solid #343a44;border-radius:5px;color:#78716c;font-size:.68rem;line-height:1.4}
.map-task-floor:hover{border-color:rgb(var(--p-500));color:rgb(var(--p-500));background:rgba(var(--accent),.1)}
html[data-mode="light"] .map-task-row{border-color:#dce2e8}
html[data-mode="light"] .map-task-floor{border-color:#cbd5e1;color:#64748b}
html[data-mode="light"] .map-zoom button{background:#fff;border-color:#cbd5e1;color:#334155;box-shadow:0 2px 8px #0f172a1a}
html[data-mode="light"] .map-marker-dialog{background:#fff;border-color:#d7dee7;box-shadow:0 24px 80px #0f172a33}
html[data-mode="light"] .map-marker-dialog h3{color:#111827}
html[data-mode="light"] .map-marker-dialog p{color:#64748b}

/* Keep the pin tip anchored to the exact SVG coordinate. */
.map-marker{
  transform:translate(-50%,calc(-100% - 8px)) rotate(-45deg);
  transform-origin:50% 50%;
  rotate:none;
}
.map-marker i{
  display:block;
  transform:rotate(45deg);
  rotate:none;
}

/* Mobile map panels must be positioned below the site header, not the page. */
.interactive-map{
  position:relative;
}

@media(max-width:1023px){
  .map-panel{
    top:0;
    bottom:0;
    max-height:100%;
  }
  .map-toolbar{
    justify-content:flex-start;
    gap:5px;
    padding:7px 8px;
    overflow:hidden;
  }
  .map-toolbar>button{
    flex:0 0 auto;
    white-space:nowrap;
  }
  .map-floor-tabs{
    flex:1 1 auto;
    min-width:0;
    margin:0;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .map-floor-tabs::-webkit-scrollbar{
    display:none;
  }
  .map-floor{
    flex:0 0 auto;
    min-width:max-content;
    padding:0 10px;
    white-space:nowrap;
  }
}

/* ===== 互动地图 v4：分类树 / 自定义图标 / 标记名称 / 任务快捷完成 ===== */
.map-category-node .map-filter{padding-left:calc(10px + var(--category-depth,0) * 18px)}
.map-category-node .map-filter span{min-width:0}.map-category-node .map-filter span i{flex:0 0 16px}.map-category-node .map-filter span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 标记悬停不再放大；坐标点保持稳定 */
.map-marker,.map-marker:hover{scale:1!important}

/* 楼层快捷键提示：仅电脑端显示 */
.map-floor-hint{height:36px;padding:0 12px;border:1px solid #363c46;border-radius:7px;display:inline-flex;align-items:center;flex:0 0 auto;color:#a8a29e;font-size:.72rem;font-weight:400;line-height:1;white-space:nowrap;user-select:none;pointer-events:none;cursor:default}html[data-mode="light"] .map-floor-hint{border-color:#cbd5e1;background:#fff;color:#64748b}@media(max-width:1023px){.map-floor-hint{display:none!important}}
.map-marker{width:auto;height:auto;min-width:30px;min-height:30px;border:0;border-radius:0;background:transparent;box-shadow:none;color:#fff;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px;overflow:visible;white-space:nowrap}
.map-marker-icon{width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:0;background:transparent;box-shadow:none;flex:0 0 auto}
.map-marker-icon img{width:32px;height:32px;object-fit:contain;display:block;border:0;border-radius:0;box-shadow:none;background:transparent}
.map-marker.has-title .map-marker-title{display:block;max-width:220px;padding:4px 7px;border-radius:5px;background:#0b0d10e8;border:1px solid #343a44;color:#fff;font-size:.72rem;line-height:1.2;text-shadow:0 1px 2px #000;box-shadow:0 2px 8px #0006;overflow:hidden;text-overflow:ellipsis}
html[data-mode="light"] .map-marker.has-title .map-marker-title{background:#fffffff2;border-color:#cbd5e1;color:#1f2937;text-shadow:none;box-shadow:0 2px 8px #0f172a1f}

.map-task-main{display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;gap:5px}.map-task-main>.map-task{min-width:0;border-bottom:0}.map-task-complete{width:30px;height:30px;border:1px solid #3f4651;border-radius:7px;color:#94a3b8;display:grid;place-items:center;transition:.15s}.map-task-complete:hover{border-color:#10b981;background:#10b9811f;color:#34d399}.map-task-complete:disabled{opacity:.45;cursor:not-allowed}html[data-mode="light"] .map-task-complete{border-color:#cbd5e1;color:#64748b}html[data-mode="light"] .map-task-complete:hover{border-color:#10b981;background:#10b98114;color:#059669}

/* 标记弹窗：取消右上角关闭按钮，攻略入口放到内容右上角 */
.map-marker-dialog{max-height:min(84vh,860px);overflow:auto}.map-modal-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:22px}.map-modal-topline #map-modal-task{margin:0 0 0 auto;white-space:nowrap;font-weight:600}.map-modal-images{display:grid;gap:8px;margin-top:16px}.map-modal-images img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain;background:#0b0d10;border-radius:8px;cursor:zoom-in}html[data-mode="light"] .map-modal-images img{background:#eef2f6}.map-image-lightbox{position:fixed;inset:0;z-index:110;display:none;place-items:center;padding:24px;background:#000d;cursor:zoom-out}.map-image-lightbox.is-open{display:grid}.map-image-lightbox img{display:block;max-width:min(96vw,1600px);max-height:94vh;width:auto;height:auto;object-fit:contain;border-radius:8px;box-shadow:0 18px 70px #000}

/* ===== 互动地图 v5：夜间模式左侧筛选选中态增强 ===== */
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active{
  color:rgb(var(--p-300));
  background:rgb(var(--p-500) / .18);
  box-shadow:inset 3px 0 0 rgb(var(--p-500));
}
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active i{
  color:rgb(var(--p-300));
}
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active b{
  color:rgb(var(--p-300));
}
html:not([data-mode="light"]) .map-panel-left .map-filter:hover:not(.is-active){
  color:rgb(var(--p-400));
  background:rgb(var(--p-500) / .10);
}

/* ===== 互动地图 v6：夜间模式右侧任务筛选选中态增强 ===== */
html:not([data-mode="light"]) .map-panel-right .map-task.is-active{
  color:rgb(var(--p-300));
  background:rgb(var(--p-500) / .18);
  box-shadow:inset 3px 0 0 rgb(var(--p-500));
}
html:not([data-mode="light"]) .map-panel-right .map-task.is-active span,
html:not([data-mode="light"]) .map-panel-right .map-task.is-active i{
  color:rgb(var(--p-300));
}
html:not([data-mode="light"]) .map-panel-right .map-task.is-active small{
  color:rgb(var(--p-200));
}
html:not([data-mode="light"]) .map-panel-right .map-task:hover:not(.is-active){
  color:rgb(var(--p-400));
  background:rgb(var(--p-500) / .10);
}

/* ===== 互动地图 v8：夜间左右选中态仅使用当前主题色 ===== */
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active,
html:not([data-mode="light"]) .map-panel-right .map-task.is-active{
  color:rgb(var(--p-400));
  background:transparent;
  box-shadow:none;
}
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active i,
html:not([data-mode="light"]) .map-panel-left .map-filter.is-active b,
html:not([data-mode="light"]) .map-panel-right .map-task.is-active span,
html:not([data-mode="light"]) .map-panel-right .map-task.is-active i,
html:not([data-mode="light"]) .map-panel-right .map-task.is-active small{
  color:rgb(var(--p-400));
}
html:not([data-mode="light"]) .map-panel-left .map-filter:hover:not(.is-active),
html:not([data-mode="light"]) .map-panel-right .map-task:hover:not(.is-active){
  color:rgb(var(--p-400));
  background:transparent;
}

/* ===== 互动地图 v12：截图文件名定位当前位置 ===== */
.map-locate-modal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px;background:#000b;backdrop-filter:blur(5px)}
.map-locate-modal.is-open{display:grid}
.map-locate-dialog{width:min(560px,100%);padding:20px;border:1px solid #343a44;border-radius:14px;background:#15181d;box-shadow:0 24px 80px #000}
.map-locate-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px}.map-locate-head h3{font-size:1.25rem;font-weight:700;color:#fafaf9}.map-locate-close{width:34px;height:34px;display:grid;place-items:center;border:1px solid #343a44;border-radius:8px;color:#a8a29e}.map-locate-close:hover{border-color:rgb(var(--p-500));color:rgb(var(--p-500))}
.map-locate-tip{margin-bottom:12px;color:#a8a29e;font-size:.85rem;line-height:1.6}.map-locate-dialog textarea{width:100%;min-height:92px;resize:vertical;padding:11px 12px;border:1px solid #343a44;border-radius:8px;background:#0b0d10;color:#e7e5e4;font-size:.82rem;line-height:1.55;outline:none}.map-locate-dialog textarea:focus{border-color:rgb(var(--p-500));box-shadow:0 0 0 2px rgb(var(--p-500) / .12)}.map-locate-error{margin-top:9px;color:#f87171;font-size:.78rem}.map-locate-actions{display:flex;justify-content:flex-end;margin-top:14px}.map-locate-actions button{min-width:120px;height:38px;padding:0 20px;border:1px solid rgb(var(--p-600));border-radius:7px;background:rgb(var(--p-500));color:#fff;font-size:.84rem;font-weight:700;cursor:pointer}.map-locate-actions button:hover{background:rgb(var(--p-600))}.map-locate-actions button:focus-visible{outline:2px solid rgb(var(--p-300));outline-offset:2px}
.map-player-location{position:absolute;z-index:8;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none;white-space:nowrap}.map-player-location-dot{display:block;width:18px;height:18px;border:3px solid #a3e635;border-radius:50%;background:#8b5cf6;box-shadow:0 0 0 3px #0b0d10aa,0 0 14px #8b5cf699}.map-player-location-label{position:absolute;left:25px;top:50%;transform:translateY(-50%);padding:4px 7px;border:1px solid #a3e635;border-radius:5px;background:#0b0d10e8;color:#fff;font-size:.72rem;font-weight:600;box-shadow:0 2px 8px #0006}
html[data-mode="light"] .map-locate-dialog{border-color:#d7dee7;background:#fff;box-shadow:0 24px 80px #0f172a33}html[data-mode="light"] .map-locate-head h3{color:#111827}html[data-mode="light"] .map-locate-tip{color:#64748b}html[data-mode="light"] .map-locate-close{border-color:#cbd5e1;color:#64748b}html[data-mode="light"] .map-locate-dialog textarea{border-color:#cbd5e1;background:#f8fafc;color:#1f2937}html[data-mode="light"] .map-player-location-label{background:#fffffff2;color:#1f2937;box-shadow:0 2px 8px #0f172a1f}
@media(max-width:639px){.map-locate-dialog{padding:16px}.map-locate-tip{font-size:.8rem}.map-player-location-label{display:none}}

/* ===== 互动地图 v13：标记/当前位置名称统一放到图标上方，名称不再影响坐标锚点 ===== */
.map-marker{
  width:32px;
  height:32px;
  min-width:32px;
  min-height:32px;
  display:block;
  transform:translate(-50%,-50%);
  overflow:visible;
}
.map-marker-icon{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
}
.map-marker.has-title .map-marker-title,
.map-player-location-label{
  position:absolute;
  left:50%;
  bottom:calc(100% + 6px);
  top:auto;
  transform:translateX(-50%);
  display:block;
  max-width:220px;
  padding:4px 7px;
  border:1px solid #343a44;
  border-radius:5px;
  background:#0b0d10e8;
  color:#fff;
  font-size:.72rem;
  font-weight:600;
  line-height:1.2;
  text-shadow:0 1px 2px #000;
  box-shadow:0 2px 8px #0006;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  pointer-events:none;
}
.map-player-location-label{
  left:50%;
}
html[data-mode="light"] .map-marker.has-title .map-marker-title,
html[data-mode="light"] .map-player-location-label{
  border-color:#cbd5e1;
  background:#fffffff2;
  color:#1f2937;
  text-shadow:none;
  box-shadow:0 2px 8px #0f172a1f;
}

/* ===== 互动地图 v14：左侧地图名称切换器 ===== */
.map-heading-main{min-width:0;flex:1}
.map-switcher{display:block;width:100%;max-width:210px;height:38px;padding:0 34px 0 10px;border:1px solid #363c46;border-radius:7px;background:#111318;color:#fafaf9;font-size:1.05rem;font-weight:700;line-height:1.2;cursor:pointer;outline:none}
.map-switcher:hover,.map-switcher:focus{border-color:rgb(var(--p-500));box-shadow:0 0 0 2px rgba(var(--p-500),.12)}
.map-switcher option{background:#111318;color:#fafaf9;font-size:.95rem;font-weight:500}
html[data-mode="light"] .map-switcher{background:#fff;color:#111827;border-color:#cbd5e1}
html[data-mode="light"] .map-switcher:hover,html[data-mode="light"] .map-switcher:focus{border-color:rgb(var(--p-500));box-shadow:0 0 0 2px rgba(var(--p-500),.10)}
html[data-mode="light"] .map-switcher option{background:#fff;color:#111827}
@media(max-width:1023px){.map-switcher{max-width:220px}}

/* ===== 互动地图 v14：地图选择间距/对齐 + 手机端精简工具栏 ===== */
.map-switcher{
  width:100%;
  max-width:none;
  box-sizing:border-box;
}
.map-meta{
  margin-top:11px;
}
@media(max-width:1023px){
  #map-locate,
  #map-reset,
  #map-fullscreen{
    display:none!important;
  }
}

/* ===== 互动地图 v15：手机端地图选择器避让关闭按钮 ===== */
@media(max-width:1023px){
  .map-panel-heading{gap:10px;}
  .map-panel-heading .map-heading-main{min-width:0;flex:1 1 auto;}
  .map-panel-heading .map-switcher{width:100%;max-width:100%;}
  .map-panel-heading .map-panel-close{flex:0 0 28px;width:28px;height:38px;display:inline-flex;align-items:center;justify-content:center;}
}

/* ===== 互动地图 v17：当前位置圆点跟随主题色 ===== */
.map-player-location-dot{
  border-color:rgb(var(--p-300));
  background:rgb(var(--p-500));
  box-shadow:0 0 0 3px #0b0d10aa,0 0 14px rgb(var(--p-500) / .6);
}
html[data-mode="light"] .map-player-location-dot{
  border-color:rgb(var(--p-300));
  background:rgb(var(--p-500));
  box-shadow:0 0 0 3px #ffffffcc,0 0 12px rgb(var(--p-500) / .35);
}

/* ===== 互动地图 v18：截图目录自动定位 ===== */
.map-auto-locate{
  margin-top:14px;
  padding:13px;
  border:1px solid #343a44;
  border-radius:9px;
  background:#0f1217;
}
.map-auto-locate-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  color:#e7e5e4;
  font-size:.84rem;
  font-weight:600;
  cursor:pointer;
  user-select:none;
}
.map-auto-locate-toggle input{
  width:16px;
  height:16px;
  margin:0;
  accent-color:rgb(var(--p-500));
  cursor:pointer;
}
.map-auto-locate-directory{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  margin-top:11px;
}
.map-auto-locate-directory button{
  flex:0 0 auto;
  height:34px;
  padding:0 12px;
  border:1px solid #3b4350;
  border-radius:7px;
  background:#171b21;
  color:#e7e5e4;
  font-size:.8rem;
  font-weight:600;
  cursor:pointer;
}
.map-auto-locate-directory button:hover{
  border-color:rgb(var(--p-500));
  color:rgb(var(--p-400));
}
.map-auto-locate-directory button:disabled{
  opacity:.5;
  cursor:not-allowed;
}
.map-auto-locate-directory span{
  min-width:0;
  overflow:hidden;
  color:#a8a29e;
  font-size:.78rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.map-auto-locate-status{
  margin-top:9px;
  color:#78716c;
  font-size:.76rem;
  line-height:1.45;
}
.map-auto-locate-status[data-state="active"]{color:rgb(var(--p-400))}
.map-auto-locate-status[data-state="warning"]{color:#f59e0b}
.map-auto-locate-status[data-state="error"]{color:#f87171}
html[data-mode="light"] .map-auto-locate{
  border-color:#d7dee7;
  background:#f8fafc;
}
html[data-mode="light"] .map-auto-locate-toggle{color:#1f2937}
html[data-mode="light"] .map-auto-locate-directory button{
  border-color:#cbd5e1;
  background:#fff;
  color:#334155;
}
html[data-mode="light"] .map-auto-locate-directory span{color:#64748b}
html[data-mode="light"] .map-auto-locate-status{color:#64748b}
html[data-mode="light"] .map-auto-locate-status[data-state="active"]{color:rgb(var(--p-600))}
@media(max-width:639px){
  .map-auto-locate-directory{align-items:stretch;flex-direction:column;gap:7px}
  .map-auto-locate-directory button{width:100%}
  .map-auto-locate-directory span{white-space:normal;word-break:break-all}
}
\n\n/* ===== 互动地图 v19：当前位置显示截图四元数朝向 ===== */
.map-player-location{overflow:visible}
.map-player-location-direction{
  position:absolute;
  z-index:1;
  left:50%;
  top:50%;
  width:4px;
  height:18px;
  margin-left:-2px;
  background:rgb(var(--p-500));
  border-radius:999px;
  transform-origin:50% 0;
  transform:rotate(var(--player-heading,0deg)) translateY(7px);
  box-shadow:0 0 7px rgb(var(--p-500) / .38);
}
.map-player-location-direction::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-5px;
  width:0;
  height:0;
  transform:translateX(-50%);
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:7px solid rgb(var(--p-500));
}
.map-player-location-dot{position:relative;z-index:2}
.map-player-location-label{z-index:3}

/* ===== 互动地图 v21：加长方向定位针，并恢复尖头黑色外框 ===== */
.map-player-location{
  width:26px;
  height:26px;
  overflow:visible;
}
.map-player-location-direction{
  position:absolute;
  z-index:1;
  left:50%;
  top:50%;
  width:24px;
  height:24px;
  margin:0;
  border:3px solid rgb(var(--p-300));
  border-radius:50%;
  background:transparent;
  box-shadow:0 0 0 2px #15181d,0 0 10px rgb(var(--p-500) / .35);
  transform-origin:50% 50%;
  transform:translate(-50%,-50%) rotate(var(--player-heading,0deg));
}
/* 外层黑色尖头：比主题色尖头略大，形成完整黑色描边 */
.map-player-location-direction::before{
  content:"";
  position:absolute;
  z-index:-2;
  left:50%;
  bottom:-20px;
  width:0;
  height:0;
  transform:translateX(-50%);
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:20px solid #15181d;
}
/* 内层主题色尖头：明显加长，与圆环连成一体 */
.map-player-location-direction::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:50%;
  bottom:-16px;
  width:0;
  height:0;
  transform:translateX(-50%);
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:16px solid rgb(var(--p-300));
}
.map-player-location-dot{
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  width:12px;
  height:12px;
  margin:0;
  border:0;
  border-radius:50%;
  background:rgb(var(--p-500));
  box-shadow:0 0 0 2px #15181d;
  transform:translate(-50%,-50%);
}
html[data-mode="light"] .map-player-location-direction{
  box-shadow:0 0 0 2px #27313b,0 0 9px rgb(var(--p-500) / .25);
}
html[data-mode="light"] .map-player-location-direction::before{
  border-top-color:#27313b;
}
html[data-mode="light"] .map-player-location-dot{
  border:0;
  background:rgb(var(--p-500));
  box-shadow:0 0 0 2px #27313b;
}


/* ===== 互动地图 v22：当前位置改为一体式 SVG 方向针，圆环与尖头无接缝 ===== */
.map-player-location{
  width:26px;
  height:26px;
  overflow:visible;
}
.map-player-location-direction{
  position:absolute;
  z-index:2;
  left:-4px;
  top:-4px;
  width:34px;
  height:48px;
  margin:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  transform-origin:17px 17px;
  transform:rotate(var(--player-heading,0deg));
}
.map-player-location-direction::before,
.map-player-location-direction::after{content:none!important}
.map-player-location-direction svg{
  display:block;
  width:34px;
  height:48px;
  overflow:visible;
  filter:drop-shadow(0 0 5px rgb(var(--p-500) / .28));
}
.map-player-location-pin-body{
  fill:rgb(var(--p-300));
  stroke:#15181d;
  stroke-width:3;
  stroke-linejoin:round;
}
.map-player-location-pin-core{
  fill:rgb(var(--p-500));
  stroke:#15181d;
  stroke-width:3;
}
.map-player-location-dot{display:none!important}
.map-player-location-label{z-index:4}
html[data-mode="light"] .map-player-location-pin-body,
html[data-mode="light"] .map-player-location-pin-core{stroke:#27313b}


/* ===== 互动地图 v20：电脑端左右侧栏可独立收起，折叠按钮固定顶部 ===== */
@media(min-width:1024px){
  .interactive-map{
    --map-left-panel-width:260px;
    --map-right-panel-width:300px;
    grid-template-columns:var(--map-left-panel-width) minmax(0,1fr) var(--map-right-panel-width);
    transition:grid-template-columns .2s ease;
  }
  .interactive-map.is-left-collapsed{--map-left-panel-width:0px;}
  .interactive-map.is-right-collapsed{--map-right-panel-width:0px;}
  .interactive-map.is-left-collapsed .map-panel-left,
  .interactive-map.is-right-collapsed .map-panel-right{
    padding-left:0;
    padding-right:0;
    border-width:0;
    overflow:hidden;
    opacity:0;
    pointer-events:none;
  }
  .map-panel-left,.map-panel-right{
    min-width:0;
    transition:opacity .16s ease,padding .2s ease;
  }
  .map-desktop-panel-toggle{
    position:absolute;
    top:0;
    z-index:18;
    width:26px;
    height:52px;
    display:grid;
    place-items:center;
    transform:none;
    border:1px solid #363c46;
    background:#111318;
    color:#a8a29e;
    box-shadow:0 3px 12px #0005;
    cursor:pointer;
    transition:left .2s ease,right .2s ease,color .15s ease,border-color .15s ease,background .15s ease;
  }
  .map-desktop-panel-toggle:hover{
    color:rgb(var(--p-400));
    border-color:rgb(var(--p-500));
    background:#171a20;
  }
  .map-desktop-panel-toggle-left{
    left:calc(var(--map-left-panel-width) - 13px);
    border-radius:0 8px 8px 0;
  }
  .map-desktop-panel-toggle-right{
    right:calc(var(--map-right-panel-width) - 13px);
    border-radius:8px 0 0 8px;
  }
  .interactive-map.is-left-collapsed .map-desktop-panel-toggle-left{left:0;}
  .interactive-map.is-right-collapsed .map-desktop-panel-toggle-right{right:0;}
  html[data-mode="light"] .map-desktop-panel-toggle{
    border-color:#cbd5e1;
    background:#fff;
    color:#64748b;
    box-shadow:0 3px 12px #0f172a1a;
  }
  html[data-mode="light"] .map-desktop-panel-toggle:hover{
    color:rgb(var(--p-600));
    border-color:rgb(var(--p-500));
    background:#f8fafc;
  }
}
@media(max-width:1023px){.map-desktop-panel-toggle{display:none!important}}

/* ===== 互动地图 v23：桌面侧栏折叠按钮回到 50% 高度并严格压在线上；当前位置去除容器外框 ===== */
@media(min-width:1024px){
  .map-desktop-panel-toggle{
    top:50%;
    height:54px;
    transform:translateY(-50%);
  }
  .map-desktop-panel-toggle-left{
    left:var(--map-left-panel-width);
    transform:translate(-50%,-50%);
  }
  .map-desktop-panel-toggle-right{
    right:var(--map-right-panel-width);
    transform:translate(50%,-50%);
  }
  .interactive-map.is-left-collapsed .map-desktop-panel-toggle-left{
    left:0;
    transform:translateY(-50%);
  }
  .interactive-map.is-right-collapsed .map-desktop-panel-toggle-right{
    right:0;
    transform:translateY(-50%);
  }
}
.map-player-location,
html[data-mode="light"] .map-player-location{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.map-player-location-direction,
html[data-mode="light"] .map-player-location-direction{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* ===== 互动地图 v24：桌面侧栏折叠按钮边缘与分隔线对齐 ===== */
@media(min-width:1024px){
  .map-desktop-panel-toggle-left{
    left:var(--map-left-panel-width);
    transform:translateY(-50%);
  }
  .map-desktop-panel-toggle-right{
    right:var(--map-right-panel-width);
    transform:translateY(-50%);
  }
  .interactive-map.is-left-collapsed .map-desktop-panel-toggle-left{
    left:0;
    transform:translateY(-50%);
  }
  .interactive-map.is-right-collapsed .map-desktop-panel-toggle-right{
    right:0;
    transform:translateY(-50%);
  }
}

/* ===== 互动地图 v25：当前位置文字上移，避免遮挡方向针 ===== */
.map-player-location-label{
  bottom:calc(100% + 20px);
}