/* theme-tokens.css — 主题 token 协议基础层
   当前第一阶段只迁移顶部标签栏。后续模块按计划逐步迁移。 */

:root {
    --tabbar-height: 42px;
    --tabbar-gap: 0;
    --tabbar-padding: 0 10px;
    --tabbar-bg: linear-gradient(180deg, #f8fafc 0%, #eef3f8 100%);
    --tabbar-border-bottom: 1px solid rgba(186, 199, 216, 0.78);
    --tabbar-shadow:
        inset 0 1px 0 rgba(255,255,255,0.82),
        inset 0 -1px 0 rgba(255,255,255,0.72),
        inset 0 -10px 18px rgba(148, 163, 184, 0.08);

    --tab-item-height: 28px;
    --tab-item-padding: 0 12px;
    --tab-item-gap: 7px;
    --tab-item-min-width: 44px;
    --tab-item-max-width: 154px;
    --tab-item-bg: transparent;
    --tab-item-text: rgba(51, 65, 85, 0.64);
    --tab-item-border: none;
    --tab-item-radius: 9px 9px 0 0;
    --tab-item-shadow: none;
    --tab-item-font-weight: 500;
    --tab-item-transform: none;

    --tab-divider-bg: rgba(148, 163, 184, 0.26);
    --tab-divider-display: block;

    --tab-hover-bg: rgba(255, 255, 255, 0.46);
    --tab-hover-text: rgba(15, 23, 42, 0.86);
    --tab-hover-border: var(--tab-item-border);
    --tab-hover-shadow: var(--tab-item-shadow);
    --tab-hover-transform: var(--tab-item-transform);

    --tab-active-bg: linear-gradient(180deg, #ffffff 0%, #fdfefe 100%);
    --tab-active-text: #0f172a;
    --tab-active-border: var(--tab-item-border);
    --tab-active-radius: var(--tab-item-radius);
    --tab-active-shadow:
        0 1px 0 rgba(255,255,255,0.96) inset,
        0 14px 28px rgba(15, 23, 42, 0.11),
        0 4px 10px rgba(15, 23, 42, 0.05),
        -1px 0 0 rgba(203, 213, 225, 0.78),
        1px 0 0 rgba(203, 213, 225, 0.78),
        0 -1px 0 #ffffff inset,
        0 2px 0 rgba(255,255,255,0.65);
    --tab-active-font-weight: 600;
    --tab-active-transform: translateY(-1px);

    --tab-active-bridge-display: block;
    --tab-active-bridge-bg: linear-gradient(180deg, #f3f7ff 0%, #e4ecff 100%);
    --tab-active-bridge-shadow: 0 6px 14px rgba(37, 66, 243, 0.08);
    --tab-active-indicator-display: block;
    --tab-active-indicator-bg: #1d35c9;
    --tab-active-indicator-border: #2034ae;
    --tab-active-indicator-shadow: 0 4px 10px rgba(37, 66, 243, 0.28);

    --tab-dot-bg: #1d35c9;
    --tab-dot-border: #2034ae;
    --tab-dot-shadow: 0 0 0 2px rgba(37, 66, 243, 0.18);

    --tab-close-text: rgba(100, 116, 139, 0.72);
    --tab-close-bg: transparent;
    --tab-close-hover-text: #dc2626;
    --tab-close-hover-bg: rgba(239, 68, 68, 0.08);
    --tab-close-border: none;

    --tab-home-bg: var(--node-neu-bg);
    --tab-home-text: var(--text-soft);
    --tab-home-border: 1px solid rgba(203, 213, 225, 0.45);
    --tab-home-radius: var(--radius-sm, 8px);
    --tab-home-shadow: var(--neu-shadow);
    --tab-home-hover-bg: rgba(255, 255, 255, 0.7);
    --tab-home-hover-text: var(--text);
    --tab-home-hover-border: 1px solid rgba(203, 213, 225, 0.35);
    --tab-home-hover-shadow: var(--neu-inset);
    --tab-home-hover-transform: translateY(-1px);

    --tab-add-bg: transparent;
    --tab-add-text: rgba(71, 85, 105, 0.72);
    --tab-add-border: none;
    --tab-add-radius: 0;
    --tab-add-shadow: none;
    --tab-add-hover-bg: rgba(255, 255, 255, 0.42);
    --tab-add-hover-text: #2440ED;
    --tab-add-hover-transform: none;
}


/* === Dock 栏 token：第二阶段迁移 === */
:root {
    --dock-bg: var(--node-neu-bg);
    --dock-filter: blur(16px);
    --dock-border: 1px solid rgba(203, 213, 225, 0.45);
    --dock-radius: var(--radius-lg);
    --dock-shadow: var(--neu-shadow);
    --dock-hover-shadow: var(--neu-shadow-hover);
    --dock-drag-shadow: var(--neu-shadow-hover);
    --dock-padding: 6px 8px;
    --dock-vertical-padding: 8px 6px;
    --dock-gap: 4px;
    --dock-height: 44px;

    --dock-btn-bg: transparent;
    --dock-btn-text: var(--text-soft);
    --dock-btn-border: 1px solid transparent;
    --dock-btn-radius: var(--radius-sm);
    --dock-btn-shadow: none;
    --dock-btn-hover-bg: rgba(255, 255, 255, 0.7);
    --dock-btn-hover-text: var(--text);
    --dock-btn-hover-border: 1px solid rgba(203, 213, 225, 0.35);
    --dock-btn-hover-shadow: var(--neu-inset);
    --dock-btn-hover-transform: translateY(-1px);
    --dock-btn-active-shadow: var(--neu-inset-deep);

    --dock-primary-bg: linear-gradient(145deg, var(--accent), var(--accent-hover));
    --dock-primary-text: #fff;
    --dock-primary-border: 1px solid transparent;
    --dock-primary-shadow: 0 4px 12px color-mix(in srgb, var(--accent) 35%, transparent), inset 0 1px 0 rgba(255,255,255,.2);
    --dock-primary-hover-bg: linear-gradient(145deg, var(--accent-hover), var(--accent));
    --dock-primary-hover-text: #fff;
    --dock-primary-hover-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 45%, transparent), inset 0 1px 0 rgba(255,255,255,.25);
    --dock-primary-hover-transform: translateY(-2px);

    --dock-divider-bg: linear-gradient(180deg, transparent, var(--line), transparent);
    --dock-divider-vertical-bg: linear-gradient(90deg, transparent, var(--line), transparent);
    --dock-handle-bg: transparent;
    --dock-handle-text: var(--text-muted);
    --dock-handle-border: 1px solid transparent;
    --dock-handle-hover-bg: rgba(255,255,255,.7);
    --dock-handle-hover-text: var(--accent);
    --dock-handle-hover-border: 1px solid rgba(203,213,225,.35);
    --dock-handle-hover-shadow: var(--neu-inset);
    --dock-handle-unlocked-bg: var(--accent-soft);
    --dock-handle-unlocked-text: var(--accent);
    --dock-handle-unlocked-border: 1px solid var(--accent-line);
}

/* === Modal / 设置窗口 / 说明窗口 token：第二阶段迁移 === */
:root {
    --modal-overlay-bg: rgba(15,23,42,.38);
    --modal-overlay-filter: blur(8px);
    --modal-bg: var(--node-neu-bg);
    --modal-border: 1px solid rgba(203,213,225,.45);
    --modal-radius: var(--radius-xl);
    --modal-shadow: var(--neu-shadow-active);
    --modal-header-bg: linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,0));
    --modal-header-border: 1px solid rgba(203,213,225,.35);
    --modal-body-bg: var(--surface-soft);
    --modal-footer-bg: var(--surface-soft);
    --modal-footer-border: 1px solid rgba(203,213,225,.35);
    --modal-title-text: var(--text);
    --modal-close-bg: transparent;
    --modal-close-text: var(--text-muted);
    --modal-close-border: 1px solid transparent;
    --modal-close-hover-bg: rgba(255,255,255,.6);
    --modal-close-hover-text: var(--text);
    --modal-close-hover-border: 1px solid rgba(203,213,225,.35);
    --modal-close-hover-shadow: var(--neu-inset);
    --control-bg: var(--surface);
    --control-text: var(--text);
    --control-border: 1px solid rgba(203,213,225,.45);
    --control-radius: var(--radius-sm);
    --control-shadow: var(--neu-inset);
    --control-focus-border: var(--accent);
    --control-focus-shadow: var(--neu-inset), 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
    /* 自定义下拉浮层（settings/api/storage 等所有 select 替换为统一组件后使用） */
    --custom-select-dropdown-bg: var(--surface);
    --custom-select-dropdown-border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    --custom-select-dropdown-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
    --custom-select-search-bg: var(--surface);
    --custom-select-search-border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    --custom-select-search-text: var(--text);
    --custom-select-search-focus-border: var(--accent);
    --custom-select-option-text: var(--text);
    --custom-select-option-hover-bg: var(--surface-soft);
    --custom-select-option-hover-text: var(--text);
    --custom-select-option-selected-bg: var(--accent-soft);
    --custom-select-option-selected-text: var(--accent);
    --custom-select-option-selected-hover-bg: color-mix(in srgb, var(--accent-soft) 75%, var(--accent) 12%);
    --custom-select-group-text: var(--text-muted);
    --custom-select-empty-text: var(--text-muted);
    --settings-tabs-bg: var(--surface-soft);
    --settings-tabs-border: 1px solid rgba(203,213,225,.35);
    --settings-tab-bg: transparent;
    --settings-tab-text: var(--text-muted);
    --settings-tab-border: 1px solid transparent;
    --settings-tab-radius: 999px;
    --settings-tab-active-bg: var(--accent-soft);
    --settings-tab-active-text: var(--accent);
    --settings-tab-active-border: 1px solid var(--accent-line);
    --settings-card-bg: var(--surface-strong);
    --settings-card-border: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
    --settings-card-radius: 16px;
    --settings-card-shadow: 0 8px 24px rgba(15,23,42,.05);
    --settings-intro-bg: linear-gradient(135deg, var(--surface-strong), color-mix(in srgb, var(--accent-soft) 42%, var(--surface-soft)));
    --help-header-bg: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.96));
    --help-body-bg: var(--modal-body-bg);
    --help-body-text: var(--text-soft);
    --help-column-bg: var(--surface-strong);
    --help-column-border: 1px solid var(--line);
    --help-column-radius: 18px;
    --help-column-shadow: var(--shadow-soft);
    --help-title-bg: var(--surface-soft);
    --help-title-text: var(--text);
    --help-meta-bg: rgba(219,234,254,.72);
    --help-meta-text: #2563eb;
    --help-meta-border: 1px solid rgba(147,197,253,.88);
    --help-section-bg: var(--surface-strong);
    --help-section-border: 1px solid var(--line);
    --guide-search-bg: rgba(248,250,252,.96);
    --guide-search-border: 1px solid #dbe4f0;
    --guide-searchbox-bg: #fff;
    --guide-content-bg: #f8fafc;
    --guide-content-text: #1e293b;
    --guide-heading-text: #0f172a;
    --guide-code-bg: #e2e8f0;
    --guide-code-text: #0f172a;
    --guide-pre-bg: #0f172a;
    --guide-pre-text: #e2e8f0;
    --guide-table-bg: #fff;
    --guide-table-border: #dbe4f0;
    --guide-hit-bg: #fde68a;
    --guide-hit-text: #78350f;
    --guide-hit-active-bg: #f97316;
    --guide-hit-active-text: #fff7ed;
}

/* === Sidebar / Home / Feedback / Chat token：第三阶段迁移 === */
:root {
    --sidebar-bg: var(--node-neu-bg);
    --sidebar-filter: blur(18px) saturate(1.1);
    --sidebar-border: 1px solid rgba(203,213,225,.45);
    --sidebar-radius: var(--radius-xl);
    --sidebar-shadow: var(--neu-shadow-active);
    --sidebar-header-bg: linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,0));
    --sidebar-header-border: 1px solid rgba(203,213,225,.35);
    --sidebar-item-bg: var(--surface);
    --sidebar-item-border: 1px solid rgba(203,213,225,.45);
    --sidebar-item-radius: var(--radius-md);
    --sidebar-item-shadow: 3px 3px 8px rgba(163,177,198,.2), -3px -3px 8px rgba(255,255,255,.7);
    --sidebar-item-hover-shadow: 5px 5px 12px rgba(163,177,198,.25), -5px -5px 12px rgba(255,255,255,.8);
    --sidebar-control-bg: var(--surface-soft);
    --sidebar-control-border: 1px solid rgba(203,213,225,.45);
    --sidebar-control-radius: 999px;
    --sidebar-control-shadow: var(--neu-inset);
    --home-bg: var(--canvas-bg, #eef2f7);
    --home-hero-bg: var(--node-neu-bg);
    --home-hero-border: 1px solid rgba(203,213,225,.38);
    --home-hero-shadow: 4px 0 18px rgba(15,23,42,.06), inset -1px 0 0 rgba(255,255,255,.72);
    --home-card-bg: var(--node-neu-bg);
    --home-card-border: 1px solid rgba(203,213,225,.38);
    --home-card-radius: var(--radius-sm);
    --home-card-shadow: var(--neu-shadow);
    --home-card-hover-shadow: var(--neu-shadow-hover);
    --home-primary-bg: linear-gradient(145deg, var(--accent), var(--accent-hover));
    --home-primary-text: #fff;
    --home-footer-border: 1px solid rgba(203,213,225,.32);
    --toast-bg: var(--node-neu-bg);
    --toast-filter: blur(12px);
    --toast-text: var(--text);
    --toast-border: 1px solid rgba(203,213,225,.45);
    --toast-radius: 999px;
    --toast-shadow: var(--neu-shadow);
    --progress-bg: var(--node-neu-bg);
    --progress-border: 1px solid rgba(203,213,225,.45);
    --progress-radius: var(--radius-xl);
    --progress-shadow: var(--neu-shadow-active);
    --navigator-bg: var(--node-neu-bg);
    --navigator-border: 1px solid rgba(203,213,225,.45);
    --navigator-radius: var(--radius-lg);
    --navigator-shadow: var(--neu-shadow);
    --navigator-filter: blur(16px) saturate(1.08);
    --navigator-map-bg: linear-gradient(rgba(37,99,235,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(37,99,235,.04) 1px, transparent 1px), radial-gradient(circle at 20% 18%, rgba(191,219,254,.46), transparent 36%), linear-gradient(135deg, #f8fbff, var(--canvas-bg));
    --navigator-map-border: 1px solid var(--line);
    --navigator-hint-text: var(--text-muted);
    --navigator-node-bg: rgba(37,99,235,.56);
    --navigator-node-border: rgba(29,78,216,.30);
    --navigator-node-ai-bg: rgba(16,32,51,.72);
    --navigator-node-ai-border: rgba(16,32,51,.36);
    --navigator-node-preview-bg: rgba(16,185,129,.66);
    --navigator-node-preview-border: rgba(5,150,105,.35);
    --navigator-node-image-bg: rgba(245,158,11,.68);
    --navigator-node-image-border: rgba(217,119,6,.34);
    --navigator-node-chat-bg: rgba(99,102,241,.62);
    --navigator-node-chat-border: rgba(79,70,229,.34);
    --navigator-viewport-bg: rgba(37,99,235,.08);
    --navigator-viewport-shadow: 0 0 0 1px rgba(255,255,255,.75), 0 8px 20px rgba(37,99,235,.18);

    --resource-status-bg: var(--node-neu-bg);
    --resource-status-border: 1px solid rgba(203,213,225,.45);
    --resource-status-shadow: var(--toast-shadow);
    --resource-status-filter: blur(16px) saturate(1.08);
    --resource-status-text: var(--text-soft);
    --resource-status-title: var(--text);
    --resource-status-value: var(--text-soft);
    --resource-status-muted: var(--text-muted);
    --resource-status-sep: #cbd5e1;
    --resource-status-save: var(--success);
    --resource-status-dot-bg: var(--success);
    --resource-status-dot-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 12%, transparent);
    --resource-status-toggle-bg: color-mix(in srgb, var(--node-neu-bg) 86%, #fff 14%);
    --resource-status-toggle-border: 1px solid rgba(203,213,225,.48);
    --resource-status-toggle-text: var(--text-muted);
    --resource-status-toggle-shadow: var(--neu-shadow);
    --resource-status-toggle-hover-bg: var(--resource-status-toggle-bg);
    --resource-status-toggle-hover-text: var(--accent);
    --resource-status-collapsed-ok-border: rgba(16,185,129,.36);
    --resource-status-collapsed-ok-shadow: 0 12px 28px rgba(16,185,129,.12), var(--neu-shadow);
    --resource-status-collapsed-warn-shadow: 0 12px 30px rgba(245,158,11,.18), 0 0 0 1px rgba(245,158,11,.08) inset;
    --resource-status-collapsed-danger-shadow: 0 12px 32px rgba(239,68,68,.20), 0 0 0 1px rgba(239,68,68,.10) inset;
    --resource-status-collapsed-unsaved-outline: rgba(249,115,22,.18);
    --resource-status-warn-bg: rgba(255,251,235,.92);
    --resource-status-warn-border: rgba(245,158,11,.38);
    --resource-status-warn-shadow: 0 14px 34px rgba(245,158,11,.12);
    --resource-status-warn-title: #92400e;
    --resource-status-warn-dot-bg: #f59e0b;
    --resource-status-warn-dot-shadow: 0 0 0 4px rgba(245,158,11,.14);
    --resource-status-danger-bg: rgba(255,247,237,.94);
    --resource-status-danger-border: rgba(239,68,68,.36);
    --resource-status-danger-shadow: 0 14px 36px rgba(239,68,68,.14);
    --resource-status-danger-title: #b91c1c;
    --resource-status-danger-dot-bg: var(--danger);
    --resource-status-danger-dot-shadow: 0 0 0 4px rgba(239,68,68,.14);
    --resource-status-unsaved-save: #f97316;

    --toggle-bg: var(--line-strong);
    --toggle-knob-bg: #fff;
    --toggle-knob-shadow: 0 1px 3px rgba(0,0,0,.15);
    --toggle-checked-bg: var(--accent);
    --toggle-checked-knob-bg: var(--toggle-knob-bg);
    --toggle-focus-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 20%, transparent);
    --chat-panel-bg: var(--node-neu-surface);
    --chat-panel-border: none;
    --chat-panel-radius: 14px;
    --chat-panel-shadow: var(--neu-inset);
    --chat-bubble-bg: var(--node-neu-surface);
    --chat-bubble-text: var(--text);
    --chat-bubble-radius: 14px;
    --chat-bubble-shadow: var(--neu-shadow);
    --chat-user-bubble-bg: color-mix(in srgb, var(--type-chat) 15%, var(--node-neu-surface));
    --chat-ai-bubble-bg: var(--node-neu-surface);
    --chat-ai-bubble-shadow: var(--neu-inset);
}

/* === Node / Canvas interaction / Model dropdown / API memory token：第四阶段迁移 === */
:root {
    --node-shell-bg: var(--node-neu-bg);
    --node-shell-border: 1px solid rgba(203,213,225,.45);
    --node-shell-radius: 20px;
    --node-shell-shadow: var(--neu-shadow);
    --node-shell-hover-shadow: var(--neu-shadow-hover);
    --node-shell-hover-transform: translateY(-2px);
    --node-selected-border: var(--accent);
    --node-selected-shadow: var(--neu-shadow-active), 0 0 0 2.5px var(--accent), 0 0 24px color-mix(in srgb, var(--accent) 25%, transparent);
    --node-selected-transform: translateY(-2px);
    --node-health-bg: linear-gradient(180deg, rgba(127,29,29,.72), rgba(185,28,28,.56));
    --node-health-text: #fff;
    --node-stripe-height: 3px;
    --node-stripe-radius: 0 0 3px 3px;
    --node-port-bg: #ffffff;
    --node-port-border: 2px solid rgba(37,66,243,.52);
    --node-port-shadow: 0 0 0 2px rgba(37,66,243,.12), 0 2px 6px rgba(15,23,42,.08);

    --preview-feather-bg: color-mix(in srgb, var(--node-neu-surface) 88%, var(--accent) 5%);
    --preview-feather-border: 1px solid color-mix(in srgb, var(--line, rgba(203,213,225,.45)) 72%, transparent);
    --preview-feather-shadow: var(--neu-inset);
    --preview-feather-text: var(--text);
    --preview-feather-label-text: var(--text-soft);
    --preview-feather-accent: var(--accent);
    --preview-feather-reset-bg: color-mix(in srgb, var(--accent) 12%, transparent);
    --preview-feather-reset-hover-bg: color-mix(in srgb, var(--accent) 20%, transparent);
    --preview-feather-hint-text: var(--text-muted);
    --preview-feather-disabled-opacity: 0.66;
    --preview-feather-visual-border: rgba(56, 189, 248, 0.95);
    --preview-feather-visual-shadow: 0 0 0 var(--feather-band, 12px) rgba(56, 189, 248, 0.16), 0 0 0 9999px rgba(15, 23, 42, 0.10), 0 0 14px rgba(56, 189, 248, 0.55);
    --preview-feather-visual-label-bg: rgba(14, 116, 144, 0.82);
    --preview-feather-visual-label-text: #fff;

    --edge-hover-stroke: var(--accent);
    --edge-hover-width: 3;
    --selection-border: 1px solid rgba(59,130,246,.8);
    --selection-bg: rgba(59,130,246,.15);
    --snap-guide-core: repeating-linear-gradient(to bottom, rgba(37,66,243,0) 0, rgba(37,66,243,0) 4px, rgba(96,165,250,.98) 4px, rgba(96,165,250,.98) 10px, rgba(37,66,243,0) 10px, rgba(37,66,243,0) 16px);
    --model-dropdown-bg: var(--surface);
    --model-dropdown-border: 1px solid rgba(203,213,225,.4);
    --model-dropdown-radius: 18px;
    --model-dropdown-shadow: 12px 12px 28px rgba(163,177,198,.35), -12px -12px 28px rgba(255,255,255,.7), 0 0 0 1px rgba(255,255,255,.5) inset;
    --model-search-bg: var(--node-neu-surface);
    --model-search-border: 1px solid rgba(203,213,225,.3);
    --model-item-hover-bg: var(--node-neu-surface);
    --model-item-hover-shadow: var(--neu-inset);
    --api-memory-bg: var(--settings-card-bg);
    --api-memory-border: var(--settings-card-border);
    --api-memory-radius: var(--settings-card-radius);
    --api-memory-list-bg: var(--surface-soft);
    --api-memory-title: var(--text);
    --api-memory-desc: var(--text-muted);

    --api-vtabs-bg: var(--modal-body-bg, #f9fafb);
    --api-vtabs-border: 2px solid var(--control-border-color, #e2e8f0);
    --api-vtab-text: var(--text-muted, #64748b);
    --api-vtab-hover-bg: var(--hover-bg, #f1f5f9);
    --api-vtab-hover-text: var(--text, #0f172a);
    --api-vtab-active-bg: #2340EC;
    --api-vtab-active-text: #fff;
    --api-vtab-active-hover-bg: #1d35c9;
    --api-vtab-active-hover-text: #fff;

    --custom-select-scrollbar-color: rgba(0,0,0,0.18) transparent;
    --custom-select-scrollbar-thumb: rgba(0,0,0,0.18);
    --custom-select-scrollbar-thumb-hover: rgba(0,0,0,0.32);
}

/* === Remaining help / reward / Dock customizer token：第五阶段迁移 === */
:root {
    --changelog-scroll-bg: linear-gradient(180deg, rgba(248,250,252,.74), rgba(241,245,249,.82));
    --changelog-card-bg: rgba(255,255,255,.96);
    --changelog-card-border: 1px solid rgba(203,213,225,.88);
    --changelog-card-shadow: 0 10px 24px rgba(15,23,42,.055);
    --changelog-accent-bg: linear-gradient(180deg, var(--accent), #38bdf8);
    --changelog-title-text: var(--text);
    --log-group-bg: var(--surface-strong);
    --log-group-border: 1px solid var(--line);
    --log-group-text: var(--text-soft);
    --reward-card-bg: radial-gradient(circle at 18% 0%, rgba(219,234,254,.96), transparent 42%), linear-gradient(135deg, rgba(239,246,255,.98), rgba(255,255,255,.96) 58%, rgba(248,250,252,.98));
    --reward-card-border: 1px solid rgba(147,197,253,.82);
    --reward-badge-bg: var(--help-meta-bg);
    --reward-badge-text: var(--help-meta-text);
    --reward-badge-border: var(--help-meta-border);
    --reward-qr-bg: var(--surface-strong);
    --reward-qr-border: 1px solid var(--line);
    --reward-preview-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
    --reward-preview-border: 1px solid rgba(219,228,240,.92);
    --dkc-bar-bg: var(--dock-bg);
    --dkc-bar-border: var(--dock-border);
    --dkc-bar-radius: var(--dock-radius);
    --dkc-bar-shadow: var(--dock-shadow);
    --dkc-bar-filter: var(--dock-filter);
    --dkc-bar-btn-bg: var(--dock-btn-bg);
    --dkc-bar-btn-text: var(--dock-btn-text);
    --dkc-bar-btn-border: var(--dock-btn-border);
    --dkc-bar-btn-radius: var(--dock-btn-radius);
    --dkc-bar-btn-hover-bg: var(--dock-btn-hover-bg);
    --dkc-bar-btn-hover-text: var(--dock-btn-hover-text);
    --dkc-bar-btn-hover-border: var(--dock-btn-hover-border);
    --dkc-bar-btn-hover-shadow: var(--dock-btn-hover-shadow);
    --dkc-bar-btn-primary-bg: var(--dock-primary-bg);
    --dkc-bar-btn-primary-text: var(--dock-primary-text);
    --dkc-bar-btn-primary-border: var(--dock-primary-border);
    --dkc-bar-btn-primary-shadow: var(--dock-primary-shadow);
    --dkc-bar-sep-bg: var(--dock-divider-bg);

    /* ===== 快捷键设置面板 ===== */
    --shortcut-toolbar-bg: var(--modal-body-bg);
    --shortcut-toolbar-border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    --shortcut-search-bg: var(--surface);
    --shortcut-search-text: var(--text);
    --shortcut-search-placeholder: var(--text-muted);
    --shortcut-search-border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    --shortcut-search-focus-border: var(--accent);
    --shortcut-search-focus-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
    --shortcut-search-icon-color: var(--text-muted);
    --shortcut-reset-btn-bg: transparent;
    --shortcut-reset-btn-text: var(--text-muted);
    --shortcut-reset-btn-border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    --shortcut-reset-btn-hover-bg: color-mix(in srgb, var(--accent) 6%, transparent);
    --shortcut-reset-btn-hover-text: var(--text);
    --shortcut-reset-btn-hover-border: var(--accent);
    --shortcut-group-title-text: var(--text-muted);
    --shortcut-list-bg: var(--surface);
    --shortcut-list-border: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    --shortcut-list-radius: 10px;
    --shortcut-row-divider: 1px solid color-mix(in srgb, var(--line) 50%, transparent);
    --shortcut-row-hover-bg: color-mix(in srgb, var(--text) 4%, transparent);
    --shortcut-row-conflict-bg: color-mix(in srgb, var(--danger) 8%, transparent);
    --shortcut-row-conflict-hover-bg: color-mix(in srgb, var(--danger) 12%, transparent);
    --shortcut-name-text: var(--text);
    --shortcut-name-unbound-text: var(--text-muted);
    --shortcut-conflict-dot-bg: var(--danger);
    --shortcut-conflict-dot-shadow: 0 0 0 2px color-mix(in srgb, var(--danger) 25%, transparent);
    --shortcut-combo-bg: color-mix(in srgb, var(--text) 5%, transparent);
    --shortcut-combo-border: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
    --shortcut-combo-text: var(--text);
    --shortcut-combo-radius: 7px;
    --shortcut-combo-hover-bg: color-mix(in srgb, var(--accent) 8%, transparent);
    --shortcut-combo-hover-border: var(--accent);
    --shortcut-combo-capturing-bg: color-mix(in srgb, var(--accent) 12%, transparent);
    --shortcut-combo-capturing-border: var(--accent);
    --shortcut-combo-capturing-pulse: color-mix(in srgb, var(--accent) 30%, transparent);
    --shortcut-key-bg: var(--modal-body-bg);
    --shortcut-key-border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    --shortcut-key-text: var(--text);
    --shortcut-key-radius: 4px;
    --shortcut-empty-text: var(--text-muted);
    --shortcut-capturing-text: var(--accent);
    --shortcut-capturing-hint: var(--text-muted);
    --shortcut-clear-text: var(--text-muted);
    --shortcut-clear-hover-text: var(--danger);
    --shortcut-clear-hover-bg: color-mix(in srgb, var(--danger) 10%, transparent);
    --shortcut-scrollbar-thumb: var(--line-strong);
    --shortcut-scrollbar-track: transparent;
}