/* DiffMind colors tokens — from the supplied V3 reference.
   V3 category / tier / 热荐 colours live in tones.css and are scoped there:
   tone-* = icon strokes only; tier-flagship-* = 旗舰 label only; tag-highlight-* = 热/荐 label only.
   Permission labels (Plus+ / Pro+ 专享) use status-warning-surface + status-warning.
   Cost 高 / 极高 use status-warning; 低 / 中 use text-secondary. */
.dm-v3{
  --brand-blue:#3370FF;
  --brand-teal:#00D6B9;
  --brand-overlap:#133C9A;
  --brand-wordmark:#1A1A1C;
  --brand-wordmark-inverse:#FFFFFF;
  --brand-bg-black:#000000;
  --brand-bg-white:#FFFFFF;
  --surface-canvas:#FFFFFF;
  --surface-rail:#FAFAFA;
  --surface-hover:#F7F8FA;
  --surface-selected:#F2F3F5;
  --surface-panel:#FFFFFF;
  --surface-raised:#FFFFFF;
  --surface-group:#FAFAFA;
  --surface-inverse:#1A1A1C;
  --surface-scrim:rgba(26,26,28,0.40);
  --text-primary:#1A1A1C;
  --text-secondary:#4B5563;
  --text-muted:#5F6B7A;
  --text-on-action:#FFFFFF;
  --text-on-inverse:#FFFFFF;
  --text-link:#2458C7;
  --border-hairline:#E5E7EB;
  --border-control:#8994A5;
  --action-primary:#2458C7;
  --action-hover:#1B48AB;
  --action-pressed:#173F92;
  --focus-visible:#2458C7;
  --caret:#2458C7;
  --status-success:#087968;
  --status-warning:#855300;
  --status-error:#B42332;
  --status-success-surface:#EAF7F3;
  --status-warning-surface:#FFF6E7;
  --status-error-surface:#FFF0F0;
  --skeleton-base:#EEF0F3;
  --skeleton-sheen:#F7F8FA;
}

/* DiffMind tone tokens — V3 (2026/10/10).
   Scope (strict):
   - tone-*: category icon strokes and the glyph inside an icon block ONLY.
     Icon-block grounds are always --surface-group. Never on buttons, tabs, text or large fills.
   - tier-flagship-*: the 「旗舰」 tier label only. 高级 / 基础 use surface-selected + text-secondary.
   - tag-highlight-*: the 「热 / 荐」 label only — the one exception to "no blue info tint". Never for info bars, status or selection. */
.dm-v3{
  --tone-explore:oklch(0.47 0.09 195);
  --tone-literature:oklch(0.48 0.16 262);
  --tone-create:oklch(0.48 0.16 295);
  --tone-norms:oklch(0.52 0.12 65);
  --tone-protect:oklch(0.47 0.11 155);
  --tone-mine:oklch(0.52 0.15 22);
  --tier-flagship-surface:oklch(0.95 0.025 295);
  --tier-flagship-text:oklch(0.45 0.1 295);
  --tag-highlight-surface:oklch(0.95 0.03 262);
  --tag-highlight-text:var(--action-primary);
}

/* DiffMind typography tokens — from tokens.json */
.dm-v3{
  --font-sans:-apple-system, BlinkMacSystemFont, "PingFang SC", "MiSans", "Microsoft YaHei", sans-serif;
  --font-mono:ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
  --fs-12:12px;
  --fs-13:13px;
  --fs-14:14px;
  --fs-16:16px;
  --fs-20:20px;
  --fs-24:24px;
  --fs-28:28px;
  --fs-32:32px;
  --fw-regular:400; /* @kind other */
  --fw-medium:500; /* @kind other */
  --fw-semibold:600; /* @kind other */
  --fw-bold:700; /* @kind other */
  --lh-tight:1.3; /* @kind other */
  --lh-snug:1.4; /* @kind other */
  --lh-normal:1.5; /* @kind other */
  --lh-relaxed:1.6; /* @kind other */
  --ls-display:-0.02em; /* @kind other */
  --ls-normal:0; /* @kind other */
}

/* DiffMind spacing tokens — from tokens.json */
.dm-v3{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;
  --space-12:48px;
  --space-16:64px;
  --control-sm:32px;
  --control-md:40px;
  --control-lg:48px;
  --control-touch:44px;
  --sidebar-width:272px;
  --sidebar-collapsed:64px;
  --topbar-height:64px;
  --content-max:850px;
  --content-project:1100px;
  --content-wide:1680px;
  --page-gutter:clamp(24px,3.2vw,64px); /* @kind spacing */
  --grid-gap:clamp(16px,1.2vw,24px);
  --compare-pane-max:880px;
  --compare-pane-single-max:960px;
  --control-composer-hero:104px;
  --control-composer-hero-max:320px;
}

/* DiffMind radius tokens — from tokens.json */
.dm-v3{
  --border-width:1px;
  --focus-ring-width:2px;
  --focus-ring-offset:2px;
  --radius-xs:4px;
  --radius-sm:6px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-pill:999px;
  --radius-full:50%;
}

/* DiffMind shadows tokens — from tokens.json */
.dm-v3{
  --shadow-xs:0 1px 2px rgba(31,41,55,0.05);
  --shadow-input:0 1px 2px rgba(31,41,55,0.04);
  --shadow-card:0 2px 8px rgba(31,41,55,0.06);
  --shadow-lift:0 6px 16px rgba(31,41,55,0.10);
  --shadow-dropdown:0 4px 16px rgba(31,41,55,0.12);
  --shadow-pop:0 4px 12px rgba(31,41,55,0.14);
  --shadow-modal:0 8px 30px rgba(31,41,55,0.16);
}

/* DiffMind brand tokens — from tokens.json */
.dm-v3{
  --brand-lockup-mark:368; /* @kind other */
  --brand-lockup-gap:112; /* @kind other */
  --brand-lockup-word:1088; /* @kind other */
}

/* Dark theme — unverified: contrast has not been checked against the spec. Activate with <html data-theme="dark">. */
.dark .dm-v3{
  --surface-canvas:#000000;
  --surface-rail:#1D2129;
  --surface-hover:#39414D;
  --surface-selected:#2A313C;
  --surface-panel:#1D2129;
  --surface-raised:#252B35;
  --surface-group:#1D2129;
  --surface-inverse:#F2F3F5;
  --surface-scrim:rgba(0,0,0,0.55);
  --text-primary:#FFFFFF;
  --text-secondary:#C9CDD4;
  --text-muted:#96A5BA;
  --text-on-action:#FFFFFF;
  --text-on-inverse:#1A1A1C;
  --text-link:#416DFF;
  --border-hairline:#2B3036;
  --border-control:#5A6B7F;
  --action-primary:#416DFF;
  --action-hover:#5571FF;
  --action-pressed:#3257DB;
  --focus-visible:#5571FF;
  --caret:#416DFF;
  --status-success:#3DD6AE;
  --status-warning:#F5C463;
  --status-error:#FF8A8A;
  --status-success-surface:rgba(19,190,150,0.16);
  --status-warning-surface:rgba(250,173,20,0.16);
  --status-error-surface:rgba(245,63,63,0.14);
  --skeleton-base:#252B35;
  --skeleton-sheen:#2F3742;
  --tone-explore:oklch(0.78 0.09 195);
  --tone-literature:oklch(0.76 0.12 262);
  --tone-create:oklch(0.77 0.12 295);
  --tone-norms:oklch(0.80 0.11 65);
  --tone-protect:oklch(0.78 0.11 155);
  --tone-mine:oklch(0.78 0.11 22);
  --tier-flagship-surface:oklch(0.32 0.05 295);
  --tier-flagship-text:oklch(0.85 0.07 295);
  --tag-highlight-surface:oklch(0.32 0.06 262);
  --shadow-xs:0 1px 2px rgba(0,0,0,0.30);
  --shadow-input:0 1px 2px rgba(0,0,0,0.30);
  --shadow-card:0 2px 8px rgba(0,0,0,0.40);
  --shadow-lift:0 6px 16px rgba(0,0,0,0.45);
  --shadow-dropdown:0 4px 16px rgba(0,0,0,0.55);
  --shadow-pop:0 4px 12px rgba(0,0,0,0.50);
  --shadow-modal:0 8px 30px rgba(0,0,0,0.65);
  color-scheme:dark}

/* DiffMind — what tokens.json does not declare: type-role aliases, border
   shorthands, motion, keyframes and base rules. Colour, type, spacing, radius
   and shadow values live in tokens.json only. */
.dm-v3{
  /* Type roles (spec §4) — aliases of the scale where a step exists. */
  --role-entry-size:var(--fs-32);--role-entry-weight:var(--fw-bold);--role-entry-lh:var(--lh-tight);
  --role-page-size:var(--fs-20);--role-page-weight:var(--fw-bold);--role-page-lh:var(--lh-snug);
  --role-section-size:var(--fs-16);--role-section-weight:var(--fw-semibold);--role-section-lh:var(--lh-snug);
  --role-card-size:15px;--role-card-weight:var(--fw-semibold);--role-card-lh:var(--lh-snug);
  --role-body-size:var(--fs-14);--role-body-weight:var(--fw-regular);--role-body-lh:var(--lh-relaxed);
  --role-dense-size:var(--fs-13);--role-dense-weight:var(--fw-regular);--role-dense-lh:var(--lh-normal);
  --role-meta-size:var(--fs-12);--role-meta-weight:var(--fw-regular);--role-meta-lh:var(--lh-normal);

  /* Border shorthands. */
  --border-line:var(--border-width) solid var(--border-hairline);
  --border-line-control:var(--border-width) solid var(--border-control);

  /* Motion (spec §5): 动效只解释状态变化。 */
  --ease-standard:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-enter:cubic-bezier(0.2,0,0,1); /* @kind other */
  --ease-exit:cubic-bezier(0.4,0,1,1); /* @kind other */
  --dur-fast:150ms; /* @kind other */ /* hover、淡底切换、箭头翻转 */
  --dur-base:200ms; /* @kind other */ /* 填色、边界、开关滑块、浮层退出 */
  --dur-slow:300ms; /* @kind other */ /* 主题切换等少数整页变化 */
  --transition-colors:background-color var(--dur-base),color var(--dur-base),border-color var(--dur-base);
}

@keyframes dm-fade-in{from{opacity:0}to{opacity:1}}
@keyframes dm-fade-out{from{opacity:1}to{opacity:0}}
@keyframes dm-fade-in-up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes dm-scale-in{from{opacity:0;transform:scale(0.98)}to{opacity:1;transform:scale(1)}}
@keyframes dm-shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}
@keyframes dm-spin{to{transform:rotate(360deg)}}
/* 流式输出的光标。这是文本插入点，不是装饰性呼吸动画。 */
@keyframes dm-caret{0%,45%{opacity:1}55%,100%{opacity:0}}

.dm-v3 .animate-fade-in{animation:dm-fade-in var(--dur-base) var(--ease-standard)}
.dm-v3 .animate-fade-in-up{animation:dm-fade-in-up var(--dur-base) var(--ease-enter)}
.dm-v3 .animate-scale-in{animation:dm-scale-in var(--dur-base) var(--ease-enter)}
.dm-v3 .animate-spin{animation:dm-spin 0.8s linear infinite}
.dm-v3 .animate-shimmer{background:linear-gradient(90deg,var(--skeleton-base) 25%,var(--skeleton-sheen) 37%,var(--skeleton-base) 63%);background-size:400% 100%;animation:dm-shimmer 1.4s ease infinite}
.dm-v3 .dm-caret{animation:dm-caret 1s steps(1,end) infinite}

@media (prefers-reduced-motion:reduce){
  .dm-v3 .animate-fade-in,.dm-v3 .animate-fade-in-up,.dm-v3 .animate-scale-in,.dm-v3 .animate-shimmer,.dm-v3 .dm-caret{animation:none}
  .dm-v3 *{transition-duration:1ms!important}
}

/* 计数、点数、时长等动态数字用等宽数字，重要数值同时写明单位。 */
.dm-v3 .dm-nums{font-variant-numeric:tabular-nums}

/* ---- Base ---------------------------------------------------------------- */
.dm-v3 *{box-sizing:border-box}
.dm-v3{margin:0;font-family:var(--font-sans);font-size:var(--role-body-size);line-height:var(--role-body-lh);background:var(--surface-canvas);color:var(--text-primary);-webkit-font-smoothing:antialiased;transition:background-color var(--dur-slow),color var(--dur-slow)}

/* 正文链接用动作色，不能只靠 hover 才能辨认。 */
.dm-v3 a{color:var(--text-link);text-decoration:underline;text-underline-offset:2px;transition:color var(--dur-fast)}
.dm-v3 a:hover{color:var(--action-hover)}

/* 键盘到达时出现 2px 可见环；鼠标/触摸焦点不额外加外环。 */
.dm-v3 :focus-visible{outline:var(--focus-ring-width) solid var(--focus-visible);outline-offset:var(--focus-ring-offset)}
.dm-v3 :focus:not(:focus-visible){outline:none}

.dm-v3 ::-webkit-scrollbar{width:8px;height:8px}
.dm-v3 ::-webkit-scrollbar-track{background:transparent;border-radius:4px}
.dm-v3 ::-webkit-scrollbar-thumb{background:var(--border-hairline);border-radius:4px}
.dm-v3 ::-webkit-scrollbar-thumb:hover{background:var(--border-control)}
.dm-v3 .dm-noscrollbar{scrollbar-width:none;-ms-overflow-style:none}
.dm-v3 .dm-noscrollbar::-webkit-scrollbar{display:none}
.dm-v3 .dm-autohide{scrollbar-width:thin;scrollbar-color:transparent transparent}
.dm-v3 .dm-autohide::-webkit-scrollbar{width:5px}

.dm-v3 textarea,.dm-v3 input,.dm-v3 button{font-family:var(--font-sans)}
.dm-v3 input,.dm-v3 textarea{caret-color:var(--caret)}

/* 长研究标题、文件名与模型回答允许换行，不为了卡片整齐截断关键材料。 */
.dm-v3 .dm-wrap{overflow-wrap:anywhere;text-wrap:pretty}
/* 单行紧凑列表可中间省略，但要提供查看全称的办法。 */
.dm-v3 .dm-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 触屏可操作目标至少 44px，不依赖 hover。 */
@media (hover:none){.dm-v3 .dm-touch{min-height:var(--control-touch);min-width:var(--control-touch)}}

.dm-v3-shell { overflow: hidden; }
.dm-v3 { color: var(--text-primary); font-family: var(--font-sans); }
.dm-v3 button { font-family: inherit; }
.dm-v3 button:focus-visible { outline: 2px solid var(--focus-visible); outline-offset: 2px; }
.dm-v3-sidebar { flex-shrink: 0; height: 100%; min-height: 0; display: flex; flex-direction: column; background: var(--surface-rail); border-right: 1px solid var(--border-hairline); transition: width 200ms var(--ease-standard); }
.dm-v3-side-head { height: 56px; display: flex; align-items: center; padding: 0 12px; gap: 8px; flex-shrink: 0; }
.dm-v3-history-skeleton-row { height: 36px; padding: 0 10px; display: flex; align-items: center; gap: 10px; }
.dm-v3-history-skeleton-row > :first-child { flex-shrink: 0; }
.dm-v3-side-head img { height: 42px; width: auto; margin-left: -4px; display: block; }
.dm-v3-nav { display: flex; flex-direction: column; gap: 2px; padding: 4px 12px 12px; flex-shrink: 0; }
.dm-v3-nav-row { position: relative; }
.dm-v3-new-task-tip { position: absolute; left: 90px; top: -5px; z-index: 1; width: -moz-max-content; width: max-content; white-space: nowrap; box-sizing: border-box; padding: 6px 12px; border: 1px solid color-mix(in srgb, var(--action-primary) 20%, var(--surface-panel)); border-radius: 12px; background: color-mix(in srgb, var(--action-primary) 4%, var(--surface-panel)); box-shadow: 0 3px 12px color-mix(in srgb, var(--action-primary) 10%, transparent); color: var(--text-secondary); font-size: 12px; font-weight: 500; line-height: 18px; pointer-events: none; }
.dm-v3-new-task-tip::before { content: ''; position: absolute; left: -6px; top: 16px; width: 10px; height: 10px; transform: rotate(45deg) skew(-12deg, -12deg); border-radius: 2.5px; background: inherit; border-left: inherit; border-bottom: inherit; }
.dm-v3-new-task-tip strong { color: var(--action-primary); font-weight: 600; }
.dm-v3-project-detail { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.dm-v3-project-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 32px clamp(24px,3.2vw,64px) 48px; }
.dm-v3-project-content { max-width: 1100px; width: 100%; margin: 0; display: flex; flex-direction: column; }
.dm-v3-project-back { align-self: flex-start; display: flex; align-items: center; gap: 2px; height: 28px; padding: 0 6px 0 2px; margin-left: -2px; border: 0; border-radius: var(--radius-md); background: transparent; font-size: 13px; color: var(--text-secondary); cursor: pointer; }
.dm-v3-project-back:hover, .dm-v3-project-footer > button:hover { background: var(--surface-hover); }
.dm-v3-project-title { margin-top: 16px; display: flex; align-items: center; gap: 12px; }
.dm-v3-project-title h1 { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.dm-v3-project-folder { width: 40px; height: 40px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: var(--radius-md); background: var(--surface-group); color: var(--tone-literature); }
.dm-v3-project-tabs { position: relative; margin-top: 20px; }
.dm-v3-project-tools-button { position: absolute; right: 0; top: 4px; }
.dm-v3-project-filters { margin-top: 16px; display: flex; min-width: 0; overflow-x: auto; }
.dm-v3-project-records { margin-top: 8px; display: flex; flex-direction: column; }
.dm-v3-project-record-skeleton { display: flex; align-items: center; gap: 12px; height: 56px; padding: 0 8px; border-bottom: 1px solid var(--border-hairline); }
.dm-v3-project-record-skeleton-title { flex: 1; min-width: 0; }
.dm-v3-project-empty { padding: 40px 0; text-align: center; font-size: 13px; color: var(--text-muted); }
.dm-v3-project-pagination { margin-top: 0; padding-top: 16px; display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.dm-v3-history-panel { height: min(660px, calc(100dvh - 168px)); min-height: 0; display: flex; flex-direction: column; gap: 16px; overflow: hidden; }
.dm-v3-history-toolbar { flex-shrink: 0; display: flex; flex-direction: column; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border-hairline); }
.dm-v3-history-toolbar .dm-v3-project-filters { margin-top: 0; }
.dm-v3-history-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.dm-v3-history-list .dm-v3-project-records { margin-top: 0; }
.dm-v3-history-list .dm-v3-project-empty { padding: 80px 16px; }
.dm-v3-history-footer { flex: 0 0 49px; border-top: 1px solid var(--border-hairline); }
.dm-v3-history-footer .dm-v3-project-pagination { padding-top: 16px; }
.dm-v3-project-pagination > span { display: inline-flex; align-items: center; justify-content: center; min-width: 64px; height: 32px; line-height: 1; font-variant-numeric: tabular-nums; }
.dm-v3-project-pagination > button.dm-nums { min-width: 32px; height: 32px; padding: 0 8px; border: 1px solid var(--border-hairline); border-radius: var(--radius-md); background: transparent; font-size: 13px; font-weight: 400; color: var(--text-primary); cursor: pointer; }
.dm-v3-project-pagination > button.dm-nums[aria-current="page"] { background: var(--surface-selected); font-weight: 600; }
.dm-v3-project-pagination > button.dm-nums:hover { background: var(--surface-hover); }
.dm-v3-project-settings { max-width: 860px; display: flex; flex-direction: column; }
.dm-v3-project-setting { display: flex; align-items: center; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--border-hairline); }
.dm-v3-project-setting:last-child { border-bottom: 0; }
.dm-v3-project-setting-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dm-v3-project-setting-copy strong { font-size: 14px; font-weight: 600; }
.dm-v3-project-setting-copy small { font-size: 12px; color: var(--text-muted); }
.dm-v3-project-setting-value { font-size: 14px; color: var(--text-secondary); max-width: 320px; text-align: right; overflow-wrap: anywhere; }
.dm-v3-project-setting-value-clamped { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; min-width: 0; overflow: hidden; line-height: 1.6; max-height: 3.2em; }
.dm-v3-project-setting-value-wrapper { position: relative; min-width: 0; }
.dm-v3-project-setting-value-more { position: absolute; right: 0; bottom: 0; padding-left: 6px; background: var(--surface-canvas); line-height: 1.6; }
.dm-v3-project-setting:first-child .dm-v3-project-setting-value { color: var(--text-primary); }
.dm-v3-project-coming { color: var(--text-muted); }
.dm-v3-projects { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; padding: 40px clamp(24px,3.2vw,64px) 120px; }
.dm-v3-projects-content { max-width: 1680px; width: 100%; margin: 0; display: flex; flex-direction: column; }
.dm-v3-projects-heading { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.dm-v3-projects-heading h1 { margin: 0; flex: 1; font-size: 20px; font-weight: 700; line-height: 1.4; }
.dm-v3-projects h2 { margin: 0; font-size: 16px; font-weight: 600; }
.dm-v3-projects-heading h2 { flex: 1; }
.dm-v3-my-projects-heading { margin-top: 40px; }
.dm-v3-project-card-grid, .dm-v3-project-template-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(min(300px,100%),1fr)); gap: clamp(16px,1.2vw,24px); margin-top: 16px; }
.dm-v3-project-template-grid { grid-template-columns: repeat(auto-fill,minmax(min(260px,100%),1fr)); }
.dm-v3-project-card { display: flex; flex-direction: column; gap: 12px; padding: 20px; border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); background: var(--surface-panel); text-align: left; cursor: pointer; }
.dm-v3-project-card:hover { background: var(--surface-hover); }
.dm-v3-project-card:disabled { cursor: wait; }
.dm-v3-project-card-title { display: flex; align-items: center; gap: 12px; }
.dm-v3-project-card-title strong { font-size: 16px; font-weight: 600; color: var(--text-primary); overflow-wrap: anywhere; }
.dm-v3-project-card-icon { width: 36px; height: 36px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: var(--radius-md); background: var(--surface-group); }
.dm-v3-project-card-meta { font-size: 12px; color: var(--text-muted); }
.dm-v3-project-template-description { font-size: 13px; line-height: 1.6; color: var(--text-secondary); text-wrap: pretty; }
.dm-v3-projects h2.dm-v3-from-templates { margin: 64px 0 0; }
.dm-v3-projects-empty { padding: 24px 0; font-size: 13px; color: var(--text-muted); }
.dm-v3-project-create-dialog { display: flex; flex-direction: column; gap: 16px; }
.dm-v3-project-create-dialog > p[role="alert"] { margin: 0; font-size: 12px; color: var(--status-error); }
.dm-v3-project-create-error { margin: 12px 0 0; font-size: 12px; color: var(--status-error); }
.dm-v3-project-footer { flex-shrink: 0; padding: 16px clamp(24px,3.2vw,64px) 20px; border-top: 1px solid var(--border-hairline); }
.dm-v3-project-footer > button { width: 100%; max-width: 1100px; margin: 0; display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 20px; border: 1px solid var(--border-control); border-radius: var(--radius-lg); background: var(--surface-panel); font-size: 14px; color: var(--text-secondary); cursor: pointer; text-align: left; }
.dm-v3-project-dialog { display: flex; flex-direction: column; gap: 12px; }
.dm-v3-project-dialog-defaults { gap: 16px; }
.dm-v3-project-dialog p { margin: 0; font-size: 14px; line-height: 1.5; }
.dm-v3-project-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; }
.dm-v3-project-choice-group { display: flex; flex-direction: column; gap: 8px; }
.dm-v3-project-choice-group > strong { font-size: 13px; font-weight: 600; }
.dm-v3-project-choice-group > small { font-size: 12px; color: var(--text-muted); }
.dm-v3-project-choice-group > div { display: flex; flex-wrap: wrap; gap: 6px; }
.dm-v3-project-choice { height: 32px; padding: 0 12px; border: 1px solid var(--border-hairline); border-radius: var(--radius-pill); background: transparent; font-size: 13px; font-weight: 400; color: var(--text-primary); cursor: pointer; }
.dm-v3-project-choice[aria-pressed="true"] { background: var(--surface-selected); font-weight: 600; }
.dm-v3-project-choice:hover { background: var(--surface-hover); }
.dm-v3-project-choice:disabled { color: var(--text-muted); cursor: not-allowed; }
.dm-v3-project-tool-list { display: flex; flex-direction: column; gap: 2px; }
.dm-v3-project-tool-list > button { display: flex; align-items: center; gap: 12px; padding: 10px; border: 0; border-radius: var(--radius-md); background: transparent; text-align: left; cursor: pointer; }
.dm-v3-project-tool-list > button:hover { background: var(--surface-hover); }
.dm-v3-project-tool-list .dm-v3-project-folder { width: 36px; height: 36px; }
.dm-v3-project-tool-list > button > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.dm-v3-project-tool-list strong { font-size: 14px; font-weight: 500; color: var(--text-primary); }
.dm-v3-project-tool-list small { font-size: 12px; color: var(--text-muted); }
@media (max-width: 640px) { .dm-v3-project-tools-button { position: static; margin-top: 12px; } .dm-v3-project-setting { flex-wrap: wrap; gap: 12px; } .dm-v3-project-setting-copy { flex-basis: 100%; } .dm-v3-project-filters { overflow-x: auto; } }
.dm-v3-records { flex: 1; min-height: 0; overflow-y: auto; padding: 0 12px 12px; display: flex; flex-direction: column; gap: 16px; }
.dm-v3-project-row { display: flex; align-items: center; height: 36px; border-radius: var(--radius-md); }
.dm-v3-project-row:hover { background: var(--surface-hover); }
.dm-v3-project-row button { height: 36px; display: flex; align-items: center; gap: 8px; border: 0; background: transparent; cursor: pointer; color: var(--text-primary); text-align: left; }
.dm-v3-project-row button:first-child { width: 28px; flex-shrink: 0; justify-content: center; color: var(--text-muted); }
.dm-v3-project-row .dm-v3-project-name { flex: 1; min-width: 0; font-size: 13px; padding: 0 8px 0 0; }
.dm-v3-project-row .dm-v3-project-new { flex: 0 0 28px; justify-content: center; padding: 0; color: var(--text-muted); opacity: 0.6; }
.dm-v3-project-row .dm-v3-project-new:hover { color: var(--text-muted); opacity: 1; background: var(--surface-hover); border-radius: var(--radius-md); }
.dm-v3-project-row .dm-v3-project-pin { flex: 0 0 28px; justify-content: center; padding: 0; color: var(--text-muted); opacity: 0.6; }
.dm-v3-project-row .dm-v3-project-pin:hover { opacity: 1; background: var(--surface-hover); border-radius: var(--radius-md); }
.dm-v3-project-row .dm-v3-project-pin.is-pinned { color: var(--text-link); opacity: 1; }
.dm-v3-project-row .dm-v3-project-pin:disabled { cursor: wait; opacity: 0.4; }
.dm-v3-project-row button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-v3-empty { padding: 6px 8px; font-size: 12px; color: var(--text-muted); }
.dm-v3-more { height: 28px; padding: 0 8px; border: 0; background: transparent; font-size: 12px; color: var(--text-muted); text-align: left; cursor: pointer; border-radius: var(--radius-md); }
.dm-v3-more:hover { background: var(--surface-hover); }
.dm-v3-history-action { display: inline-flex; align-items: center; justify-content: center; height: 24px; flex-shrink: 0; }
.dm-v3-account { position: relative; border-top: 1px solid var(--border-hairline); padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.dm-v3-guest-title { font-size: 14px; font-weight: 600; color: var(--text-primary); line-height: 1.4; }
.dm-v3-guest-actions { display: flex; gap: 8px; }
.dm-v3-guest-actions > button { flex: 1; min-width: 0; }
.dm-v3-account-trigger { display: flex; align-items: center; gap: 8px; border: 0; background: transparent; padding: 6px; margin: -6px; border-radius: var(--radius-md); cursor: pointer; text-align: left; color: var(--text-muted); }
.dm-v3-account-trigger:hover { background: var(--surface-hover); }
.dm-v3-account-trigger b { font-size: 18px; font-weight: 600; color: var(--text-primary); }
.dm-v3-email { font-size: 12px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-v3-account-upgrade { width: 100%; min-height: 40px; margin-top: 8px; border: 0; border-radius: var(--radius-md); background: #2456cf; color: #fff; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.dm-v3-account-upgrade:hover { background: #1e4bb8; }
.dm-v3-account-menu { position: absolute; bottom: 100%; left: 0; width: 280px; z-index: 100; border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); background: var(--surface-panel); box-shadow: var(--shadow-dropdown); max-height: calc(100vh - 152px); overflow-y: auto; }
.dm-v3-account-menu-header { display: flex; align-items: center; gap: 4px; padding: 6px 8px 4px; }
.dm-v3-account-menu-header > span { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dm-v3-account-menu-body { padding: 0 8px 8px; display: flex; flex-direction: column; }
.dm-v3-account-menu-row { width: 100%; display: flex; align-items: center; gap: 10px; height: 40px; flex-shrink: 0; padding: 0 8px; border: 0; border-radius: var(--radius-md); background: transparent; font-size: 14px; line-height: 1.4; color: var(--text-primary); text-align: left; }
button.dm-v3-account-menu-row { cursor: pointer; }
button.dm-v3-account-menu-row:hover { background: var(--surface-hover); }
.dm-v3-account-menu-label { flex: 1; min-width: 0; }
.dm-v3-account-menu-icon { display: flex; flex-shrink: 0; color: var(--text-secondary); }
.dm-v3-account-menu-arrow { display: flex; flex-shrink: 0; color: var(--text-muted); }
.dm-v3-account-menu-row b { font-size: 14px; font-weight: 600; white-space: nowrap; }
.dm-v3-account-menu-upgrade > span:not(.dm-v3-account-menu-label) { color: var(--text-link); font-weight: 500; }
.dm-v3-account-menu-divider { height: 1px; flex-shrink: 0; background: var(--border-hairline); margin: 6px 8px; }
.dm-v3-account-menu-danger, .dm-v3-account-menu-danger .dm-v3-account-menu-icon { color: #F53F3F; }
.dm-v3-home { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; display: flex; justify-content: center; padding: clamp(56px,14vh,152px) 32px 120px; background: var(--surface-canvas); }
.dm-v3-home-content { width: 100%; max-width: 850px; display: flex; flex-direction: column; }
.dm-v3-home h1 { margin: 0; display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; font-size: 32px; font-weight: 700; line-height: 1.3; letter-spacing: -.02em; }
.dm-v3-home h1 img { height: 30px; width: auto; display: block; }
.dm-v3-mode { display: flex; justify-content: center; margin-top: 28px; }
.dm-v3-description { margin: 14px 0 0; text-align: center; font-size: 14px; line-height: 1.6; color: var(--text-secondary); text-wrap: pretty; }
.dm-v3-composer { position: relative; margin-top: 32px; }
.dm-v3-common { margin-top: 24px; }
.dm-v3-tools { margin-top: 80px; display: flex; flex-direction: column; gap: 16px; }
.dm-v3-tools-heading { display: flex; justify-content: space-between; align-items: center; padding: 0 4px; }
.dm-v3-tools-heading h2 { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.4; }
.dm-v3-tools-heading button { border: 0; background: transparent; padding: 0; font-size: 13px; color: var(--text-link); cursor: pointer; }
.dm-v3-tool-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); gap: 4px 8px; }
.dm-v3-tool-grid > button { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 0; border-radius: var(--radius-md); background: transparent; text-align: left; cursor: pointer; }
.dm-v3-tool-grid > button:hover { background: var(--surface-hover); }
.dm-v3-tool-icon { width: 36px; height: 36px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: var(--radius-md); background: var(--surface-group); }
.dm-v3-tool-copy { display: flex; flex-direction: column; gap: 2px; }
.dm-v3-tool-copy > span { font-size: 14px; font-weight: 500; color: var(--text-primary); }
.dm-v3-tool-copy small { font-size: 12px; color: var(--text-muted); }
.dm-v3-tool-copy > span { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.dm-v3-tool-copy .dm-v3-coming-soon-tag { display: inline-flex; align-items: center; flex-shrink: 0; padding: 2px 7px; border: 1px solid var(--border-subtle); border-radius: 999px; background: var(--surface-group); color: var(--text-secondary); font-size: 10px; font-weight: 500; line-height: 1.4; white-space: nowrap; }
@media (max-width: 760px) { .dm-v3-home { padding-left: 16px; padding-right: 16px; } .dm-v3-home h1 { font-size: 24px; } .dm-v3-home h1 img { height: 24px; } }
.dm-v3-library-page { flex: 1; min-width: 0; min-height: 0; overflow-y: auto; padding: 40px clamp(24px,3.2vw,64px) 120px; background: var(--surface-canvas); }
.dm-v3-library-content { max-width: 1680px; width: 100%; margin: 0; display: flex; flex-direction: column; }
.dm-v3-library-heading { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.dm-v3-library-heading > h1, .dm-v3-library-heading > div { flex: 1; }
.dm-v3-library-heading h1 { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.4; }
.dm-v3-library-page h2, .dm-v3-library-page h3 { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.4; }
.dm-v3-library-page p { margin: 0; font-size: 13px; color: var(--text-secondary); line-height: 1.5; }
.dm-v3-library-filters { margin-top: 16px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.dm-v3-library-filters button[aria-pressed] { display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; border: 0; border-radius: var(--radius-md); background: transparent; font-size: 14px; color: var(--text-secondary); cursor: pointer; }
.dm-v3-library-filters button[aria-pressed=true] { background: var(--surface-selected); font-weight: 600; color: var(--text-primary); }
.dm-v3-library-filters button[aria-pressed]:hover { background: var(--surface-hover); }
.dm-v3-library-filters small, .dm-v3-library-count, .dm-v3-common-settings small { font-size: 12px; color: var(--text-muted); }
.dm-v3-library-count { margin-left: auto; font-size: 13px; }
.dm-v3-library-sections { margin-top: 20px; display: flex; flex-direction: column; gap: 24px; }
.dm-v3-library-sections section { display: flex; flex-direction: column; gap: 12px; }
.dm-v3-library-section { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }
.dm-v3-model-grid, .dm-v3-combo-grid, .dm-v3-skill-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(min(320px,100%),1fr)); gap: clamp(16px,1.2vw,24px); }
.dm-v3-combo-grid { grid-template-columns: repeat(auto-fill,minmax(min(340px,100%),1fr)); }
.dm-v3-skill-grid { margin-top: 20px; grid-template-columns: repeat(auto-fill,minmax(min(300px,100%),1fr)); }
.dm-v3-category-filters { flex: 1; display: flex; gap: 4px; flex-wrap: wrap; }
.dm-v3-library-scope { margin-top: 12px; display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-secondary); }
.dm-v3-library-empty { padding: 24px 0; font-size: 13px; color: var(--text-muted); }
.dm-v3-common-settings { margin-top: 20px; display: flex; flex-direction: column; gap: 12px; }
.dm-v3-common-settings + .dm-v3-common-settings { margin-top: 32px; }
.dm-v3-common-settings p { font-size: 12px; color: var(--text-muted); }
.dm-v3-common-settings-list { border: 1px solid var(--border-hairline); border-radius: var(--radius-lg); overflow: hidden; }
.dm-v3-common-settings-list > div:not(.dm-v3-library-empty) { display: flex; align-items: center; gap: 12px; height: 48px; padding: 0 8px 0 16px; border-bottom: 1px solid var(--border-hairline); }
.dm-v3-common-settings-list > div:last-child { border-bottom: 0; }
.dm-v3-common-settings-list span { flex: 1; font-size: 14px; }
.dm-v3-common-settings-list small { width: 16px; }
.dm-v3-prompt-form { display: flex; flex-direction: column; gap: 16px; }
.dm-v3-prompt-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; }
.dm-v3-prompt-form textarea { min-height: 120px; }
.dm-v3-library-heading > .dm-v3-common-add { position: relative; flex: 0 0 auto; }
.dm-v3-common-add-popover { position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; width: 320px; max-width: calc(100vw - 40px); padding: 16px 8px 8px; box-sizing: border-box; border: 1px solid var(--border-hairline); border-radius: 12px; background: var(--surface-raised); box-shadow: 0 4px 16px rgba(0, 0, 0, .1); }
.dm-v3-common-add-popover h3 { margin: 0 8px 10px; font-size: 13px; font-weight: 600; line-height: 20px; }
.dm-v3-add-common-list { max-height: 280px; overflow-y: auto; overscroll-behavior: contain; }
.dm-v3-common-add-option { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 8px; border: 0; border-radius: 6px; background: transparent; color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.dm-v3-common-add-option:hover, .dm-v3-common-add-option:focus-visible { background: var(--surface-hover); }
.dm-v3-common-add-option:focus-visible { outline: 2px solid var(--border-control); outline-offset: -2px; }
.dm-v3-common-add-option > span, .dm-v3-common-add-option > small { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 20px; }
.dm-v3-common-add-option > span { font-size: 13px; }
.dm-v3-common-add-option > small { font-size: 12px; color: var(--text-muted); }
.dm-v3-common-add-option:disabled { opacity: .5; cursor: not-allowed; }
.dm-v3-common-add-empty { margin: 8px; }

/* Issue fixes: ordered model picker, upload progress, account balance. */
.dm-v3-preset-editor label { display: grid; gap: 8px; }
.dm-v3-preset-dialog { background: transparent; }
.dm-v3-preset-editor { font-size: 13px; line-height: 1.5; }
.dm-v3-preset-editor label > strong { font-weight: 600; }
.dm-v3-preset-editor label > div { width: 100%; }
.dm-v3-preset-editor button { cursor: pointer; font: inherit; }
.dm-v3-preset-editor button:disabled { cursor: not-allowed; }
.dm-v3-preset-hint { margin: 14px 0 0; color: var(--text-muted); font-size: 12px; }
.dm-v3-preset-editor [role="alert"] { color: var(--status-error); font-size: 12px; margin: 8px 0 0; }
.dm-v3-preset-count { display: flex; justify-content: space-between; margin: 20px 0 10px; }
.dm-v3-preset-selected { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.dm-v3-preset-selected button { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 20px; padding: 5px 9px; background: var(--surface-selected); color: var(--text-primary); }
.dm-v3-preset-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; max-height: clamp(120px, calc(100dvh - 510px), 260px); overflow-y: auto; padding: 2px; overscroll-behavior: contain; }
.dm-v3-preset-grid button { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 40px; padding: 8px; border: 1px solid var(--border-hairline); border-radius: 8px; background: var(--surface-panel); color: var(--text-primary); text-align: left; }
.dm-v3-preset-grid button span { overflow: hidden; text-overflow: ellipsis; }
.dm-v3-preset-grid button[aria-pressed="true"] { border-color: var(--action-primary); background: var(--surface-selected); font-weight: 600; }
.dm-v3-preset-grid button:disabled { opacity: .6; }
.dm-v3-upload-spinner { width: 10px; height: 10px; border: 1px solid var(--border-hairline); border-top-color: var(--action-primary); border-radius: 50%; animation: dm-v3-upload-spin .8s linear infinite; }
@keyframes dm-v3-upload-spin { to { transform: rotate(360deg); } }
.dm-v3-points { position: relative; }
.dm-v3-points-detail { position: fixed; z-index: 900; width: 292px; max-height: 65vh; overflow: auto; padding: 16px; background: var(--surface-panel); border: 1px solid var(--border-hairline); border-radius: 12px; box-shadow: var(--shadow-modal); }
.dm-v3-points-detail header { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; }
.dm-v3-points-section { margin-top: 12px; }
.dm-v3-points-section small { display: block; margin-top: 4px; color: var(--text-muted); }
.dm-v3-points-detail > button { display: block; margin: 14px 0 0 auto; border: 0; background: transparent; color: var(--action-primary); cursor: pointer; }
@media (max-width: 640px) {
  .dm-v3-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dm-v3-points-detail { position: fixed; left: 16px; right: 16px; bottom: 100px; width: auto; }
}

.dm-v3-library-mode-options { display:flex; flex-direction:column; gap:8px; }
.dm-v3-library-mode-option { display:flex; align-items:flex-start; gap:12px; padding:16px; border:1px solid var(--border-hairline); border-radius:12px; cursor:pointer; }
.dm-v3-library-mode-option:has(input:checked) { background:var(--surface-hover); border-color:var(--action-primary); }
.dm-v3-library-mode-option input { margin-top:4px; accent-color:var(--action-primary); }
.dm-v3-library-mode-option span { min-width:0; }
.dm-v3-library-mode-option strong { font-size:14px; }
.dm-v3-library-mode-option small { display:block; margin-top:4px; color:var(--text-secondary); line-height:1.6; }

/* 骨架屏 - 对应 骨架屏.css */

.HomeSkeletonScreen_screen__0QAL8 {
  position: fixed;
  inset: 0;
  z-index: 99999;
  width: 100%;
  height: 100%;
  background: #fafbfc;
  overflow: hidden;
}

.HomeSkeletonScreen_skBox__QPrdo {
  background: #f3f3f3;
  border-radius: 3px;
  flex-shrink: 0;
  animation: HomeSkeletonScreen_skeleton-pulse__1mlzJ 1.5s ease-in-out infinite;
}

@keyframes HomeSkeletonScreen_skeleton-pulse__1mlzJ {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

/* ===================== 顶部导航栏 ===================== */
.HomeSkeletonScreen_navbar__xMK2d {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 56px;
  background: #fff;
  box-shadow: 0 1px 0 #b9b9b9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  z-index: 10;
  box-sizing: border-box;
}

.HomeSkeletonScreen_navbarLeft__K6xgt {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-left: 36px;
}

.HomeSkeletonScreen_navIcon__wjOpK {
  width: 34px;
  height: 34px;
  border-radius: 8px;
}

.HomeSkeletonScreen_navLogo__OQ3vc {
  width: 76px;
  height: 34px;
  border-radius: 8px;
}

.HomeSkeletonScreen_navbarCenter__XRmOd {
  display: flex;
  align-items: center;
  gap: 19px;
}

.HomeSkeletonScreen_navMenuIcon__rTXCB {
  width: 21px;
  height: 21px;
  border-radius: 3px;
}

.HomeSkeletonScreen_navSearch__y63_e {
  width: 263px;
  height: 39px;
  border-radius: 3px;
}

.HomeSkeletonScreen_navbarRight___sj3y {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-shrink: 0;
}

.HomeSkeletonScreen_navFilter__Z0mEB {
  width: min(445px, 28vw);
  height: 38px;
  border-radius: 8px;
}

.HomeSkeletonScreen_navAction__1v94e {
  width: 37px;
  height: 36px;
  border-radius: 3px;
}

/* ===================== 主体布局 ===================== */
.HomeSkeletonScreen_mainWrapper__k_NVW {
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ===================== 左侧边栏 ===================== */
.HomeSkeletonScreen_sidebar__ncoP4 {
  width: 224px;
  height: 100%;
  background: #fff;
  box-shadow: 1px 0 0 #eee;
  display: flex;
  flex-direction: column;
  padding: 70px 18px 18px;
  flex-shrink: 0;
  z-index: 5;
  box-sizing: border-box;
}

.HomeSkeletonScreen_sidebarItemLg__h9aWb {
  width: 100%;
  max-width: 189px;
  height: 46px;
  border-radius: 8px;
  margin-bottom: 20px;
}

.HomeSkeletonScreen_sidebarItem__hIAzf {
  width: 100%;
  max-width: 189px;
  height: 33px;
  border-radius: 8px;
  margin-bottom: 14px;
}

.HomeSkeletonScreen_sidebarDividerSection__s_hIX {
  margin-top: 12px;
  margin-bottom: 12px;
}

.HomeSkeletonScreen_sidebarLabels__eCz78 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0 8px;
}

.HomeSkeletonScreen_sidebarLabelText__vP2WQ {
  display: block;
  width: 47px;
  height: 11px;
  background: #c9cdd4;
  border-radius: 2px;
}

.HomeSkeletonScreen_sidebarLabelText__vP2WQ.HomeSkeletonScreen_short__MQ1W_ {
  width: 23px;
  background: #96a5ba;
}

.HomeSkeletonScreen_sidebarDivider__NcYzO {
  width: 100%;
  max-width: 190px;
  height: 1px;
  background: #e9e9f3;
}

.HomeSkeletonScreen_sidebarItemSm__hCb__ {
  width: 100%;
  max-width: 189px;
  height: 35px;
  border-radius: 8px;
  margin-bottom: 12px;
}

.HomeSkeletonScreen_sidebarSpacer__h1cYJ {
  flex: 1;
}

.HomeSkeletonScreen_sidebarThumb__eKrya {
  width: 100%;
  max-width: 190px;
  height: 151px;
  border-radius: 8px;
  margin-top: auto;
}

/* ===================== 内容区域 ===================== */
.HomeSkeletonScreen_contentArea__oWsaP {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 68px 12px 0 11px;
  gap: 12px;
  box-sizing: border-box;
}

.HomeSkeletonScreen_panelsRow__wSKpt {
  display: flex;
  gap: 12px;
  flex: 1;
  min-height: 0;
}

.HomeSkeletonScreen_panel__j__Bf {
  flex: 1;
  min-width: 0;
  background: #fff;
  border: 1px solid #eaeaef;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.HomeSkeletonScreen_panelHeader__AW5u2 {
  height: 40px;
  background: #fff;
  border-bottom: 1px solid #eaeaef;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  flex-shrink: 0;
}

.HomeSkeletonScreen_panelHeaderLeft__gBtjk {
  display: flex;
  align-items: center;
  gap: 10px;
}

.HomeSkeletonScreen_panelHeaderRight__MuRwh {
  display: flex;
  align-items: center;
  gap: 7px;
}

.HomeSkeletonScreen_panelCloseBtn__3_aes {
  width: 20px;
  height: 20px;
  border-radius: 3px;
}

.HomeSkeletonScreen_panelTab__LO1Dz {
  width: 140px;
  height: 23px;
  border-radius: 6px;
}

.HomeSkeletonScreen_panelDivider__xYMCk {
  width: calc(100% - 50px);
  height: 1px;
  background: #f3f3f3;
  margin: 0 auto;
}

.HomeSkeletonScreen_panelBody__X4uQb {
  flex: 1;
}

/* ===================== 底部操作栏 ===================== */
.HomeSkeletonScreen_bottomBar__0MjlZ {
  display: flex;
  gap: 23px;
  padding: 0 0 24px;
  justify-content: center;
  flex-shrink: 0;
}

.HomeSkeletonScreen_bottomActionMain__e8hWG {
  flex: 1;
  max-width: 1057px;
  height: 61px;
  border-radius: 8px;
}

.HomeSkeletonScreen_bottomActionSecondary__x8r_8 {
  width: 60px;
  height: 61px;
  border-radius: 8px;
  flex-shrink: 0;
}

/* ===================== 暗色模式 ===================== */
.dark .HomeSkeletonScreen_screen__0QAL8 {
  background: #16181d;
}

.dark .HomeSkeletonScreen_navbar__xMK2d {
  background: #1d2129;
  box-shadow: 0 1px 0 #3c434c;
}

.dark .HomeSkeletonScreen_sidebar__ncoP4 {
  background: #1d2129;
  box-shadow: 1px 0 0 #3c434c;
}

.dark .HomeSkeletonScreen_skBox__QPrdo {
  background: #2a2d35;
}

.dark .HomeSkeletonScreen_sidebarLabelText__vP2WQ {
  background: #4e5969;
}

.dark .HomeSkeletonScreen_sidebarLabelText__vP2WQ.HomeSkeletonScreen_short__MQ1W_ {
  background: #6b7785;
}

.dark .HomeSkeletonScreen_sidebarDivider__NcYzO {
  background: #3c434c;
}

.dark .HomeSkeletonScreen_panel__j__Bf {
  background: #1d2129;
  border-color: #3c434c;
}

.dark .HomeSkeletonScreen_panelHeader__AW5u2 {
  background: #1d2129;
  border-bottom-color: #3c434c;
}

.dark .HomeSkeletonScreen_panelDivider__xYMCk {
  background: #2a2d35;
}

/* ===================== 响应式 ===================== */
@media (max-width: 1200px) {
  .HomeSkeletonScreen_panelsRow__wSKpt {
    gap: 8px;
  }

  .HomeSkeletonScreen_panelTab__LO1Dz {
    width: 100px;
  }

  .HomeSkeletonScreen_navFilter__Z0mEB {
    display: none;
  }
}

@media (max-width: 768px) {
  .HomeSkeletonScreen_sidebar__ncoP4 {
    display: none;
  }

  .HomeSkeletonScreen_navbarLeft__K6xgt {
    margin-left: 0;
  }

  .HomeSkeletonScreen_navSearch__y63_e {
    width: 160px;
  }

  .HomeSkeletonScreen_panelsRow__wSKpt {
    flex-direction: column;
  }

  .HomeSkeletonScreen_panel__j__Bf {
    min-height: 200px;
  }

  .HomeSkeletonScreen_bottomBar__0MjlZ {
    padding-left: 0;
  }
}

.GlobalLoading_global-loading__iKhSb {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
  pointer-events: auto;
}

.GlobalLoading_global-loading-dark__knOPp {
  background: #000000;
}

.GlobalLoading_loading-content__kYfc3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.GlobalLoading_loading-text__2DNG6 {
  font-size: 18px;
  font-weight: 500;
  color: #333;
  font-family: 'Microsoft YaHei', sans-serif;
  margin-top: 12px;
  letter-spacing: 0.5px;
  background: linear-gradient(135deg, #5757FF 0%, #24EAFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: GlobalLoading_fadeInUp__fW8uy 0.6s ease-out;
}

@keyframes GlobalLoading_fadeInUp__fW8uy {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 隐藏时的样式 */
.GlobalLoading_global-loading__iKhSb[data-hidden="true"] {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}