/* 1. 基础与变量 */
html { font-size:16px; }
html, body { height:100%; overflow-x:hidden; }
:root {
  /* 语义色 */
  --fc-color-primary:#2563eb;
  --fc-color-primary-hover:#1d4ed8;
  --fc-color-primary-active:#194ec0;
  --fc-color-primary-light:#3B82F6;
  --fc-color-primary-lighter:#7fbbff38;

  --fc-color-success:#10B981;
  --fc-color-success-hover:#0ea373;
  --fc-color-success-active:#0c8d63;

  --fc-color-danger:#dc2626;
  --fc-color-danger-hover:#b91c1c;
  --fc-color-danger-active:#991b1b;
  --fc-color-danger-light:#ef4444;

  --fc-color-info:#2563eb;

  /* 旧别名 */
  --brand-green:#10B981;
  --brand-green-hover:#0ea373;
  --brand-green-dark:#198f63;
  --brand-green-dark-hover:#147452;
  --danger:#dc2626;
  --danger-hover:#b91c1c;
  --primary:#2563eb;
  --primary-hover:#1d4ed8;
  --primary-dark:#194ec0;
  --muted:#6b7280;

  /* 基础色与结构变量 */
  --bg-primary:#f9fafb;
  --bg-secondary:#ffffff;
  --text-primary:#1f2937;
  --text-secondary:#4b5563;
  --text-muted:#6b7280;
  --text-gray:#9ca3af;
  --border-color:#e5e7eb;
  --shadow-color:rgba(0,0,0,0.12);
  
  /* 统一阴影变量 */
  --shadow-sm:0 2px 6px rgba(0,0,0,0.08);
  --shadow-md:0 4px 12px rgba(0,0,0,0.12);
  --shadow-lg:0 6px 20px rgba(0,0,0,0.18);
  --shadow-strong:0 8px 24px rgba(0,0,0,0.22);
  
  /* Hover 背景色 */
  --row-hover-bg:rgba(0,0,0,0.04);
  --hover-overlay:rgba(60,120,255,.05);
  --hover-bg-neutral:rgba(0,0,0,0.04);
  
  /* 白色常量 */
  --color-white:#fff;
  
  /* 徽章/奖牌颜色 */
  --medal-gold:#FFD700;
  --medal-silver:#C0C0C0;
  --medal-bronze:#CD7F32;
  /* 动态暗色渐变占位：默认无（light 模式不会显示） */
  --dark-rand-gradient:none;
  /* 暗色主题时 JS 会写入 --dark-rand-base 作为真正的底色（导出等回退） */
  --dark-rand-base:#111827;

  --transition-speed:.25s;
  --transition-speed-bg:.25s;

  --toast-bg:#ffffff;
  --toast-border:#e5e7eb;
  --toast-text:#1f2937;
  --toast-success:#059669;
  --toast-error:#dc2626;
  --toast-loading:#2563eb;

  --control-height:46px;
  --control-radius:10px;
  --control-h-padding:14px;
  --control-btn-h-padding:18px;
  --form-row-gap:16px;

  --content-left-gutter:25px;
  --content-right-gutter:25px;
  --content-bottom-gap:12px;
  --bottom-title-gap:10px;

  --sidebar-footer-h:32px;
  --footer-v-pad:16px;
  --sbw:16px;

  --item-like-w:24px;
  --item-remove-w:16px;
  --item-actions-gap:12px;

  --action-restore-col-w:16px;
  --action-like-col-w:24px;
  --action-add-col-w:16px;
  --action-gap:12px;

  --seg-btn-w:80px;
  --gesture-close-zone-width:24px;
  --left-search-min-w: 320px;

  --site-tooltip-bg:#ffffff;
  --site-tooltip-text:#1f2937;
  --site-tooltip-border:rgba(0,0,0,.18);
  --site-tooltip-shadow:0 8px 24px rgba(0,0,0,.18);
  --fc-caution-bg:#ffd97a;
  --fc-caution-tag-text:#9a3412;

  --scrollbar-track: var(--bg-secondary);
  --scrollbar-thumb: var(--border-color);
  --scrollbar-thumb-hover: var(--text-secondary);
  --scrollbar-thumb-active: var(--text-primary);
  --scrollbar-corner: var(--bg-secondary);
}

[data-theme="dark"] {
  --bg-primary:#111827;
  --bg-secondary:#202b39a7;
  --text-primary:#f3f4f6;
  --text-secondary:#d1d5db;
  --text-muted:#9ca3af;
  --text-gray:#6b7280;
  --border-color:#374151;
  --shadow-color:rgba(0,0,0,0.55);
  --fc-color-primary:#3B82F6;
  
  /* 统一阴影变量（深色主题） */
  --shadow-sm:0 2px 6px rgba(0,0,0,0.30);
  --shadow-md:0 4px 12px rgba(0,0,0,0.38);
  --shadow-lg:0 6px 20px rgba(0,0,0,0.45);
  --shadow-strong:0 8px 24px rgba(0,0,0,0.55);
  
  /* Hover 背景色（深色主题） */
  --row-hover-bg:rgba(255,255,255,0.06);
  --hover-overlay:rgba(255,255,255,0.06);
  --hover-bg-neutral:rgba(255,255,255,0.06);
  --dark-hover-bg:#2a3545;

  --toast-bg:#1f2937;
  --toast-border:#374151;
  --toast-text:#f3f4f6;

  --site-tooltip-bg:#1f2937e3;
  --site-tooltip-text:#f3f4f6;
  --site-tooltip-border:rgba(255,255,255,.14);
  --site-tooltip-shadow:0 8px 28px rgba(0,0,0,.45);

  --scrollbar-track: rgba(255,255,255,0.08);
  --scrollbar-thumb: var(--border-color);
  --scrollbar-thumb-hover: var(--text-secondary);
  --scrollbar-thumb-active: var(--text-primary);
  --scrollbar-corner: var(--bg-primary);
}

html {
  /* Firefox 使用的主色（thumb）与背景（track） */
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
  /* 可选：让 Firefox 使用细滚动条 */
  scrollbar-width: thin;
  /* 让浏览器在可行时自动对内置控件使用适配配色 */
  color-scheme: light dark;
}

a, p, button {
  color: var(--text-primary);
  transition: color var(--transition-speed-bg) ease, background-color var(--transition-speed-bg) ease, border-color var(--transition-speed-bg) ease;
}

/* ===== 拆分背景，允许注入渐变 ===== */
body {
  /* 基础底色：亮色使用 --bg-primary；暗色时 JS 会把 --dark-rand-base 改成深色并保留在 background-color */
  background-color:var(--bg-primary)!important;
  /* 渐变层：默认 none，暗色模式 JS 写入 --dark-rand-gradient */
  color:var(--text-primary);
  font-family:system-ui,-apple-system,"Segoe UI","Helvetica Neue","Microsoft YaHei",Arial,sans-serif;
  transition:background-color var(--transition-speed-bg) ease, color var(--transition-speed-bg) ease;
  animation:fc-bg-fade-in .6s ease;
}

/* 渐变层，用透明度过渡淡入/淡出 */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: var(--dark-rand-gradient);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;         /* 确保随视口固定，不跟随滚动抖动 */
  opacity: var(--grad-opacity, 0);
  transition: opacity var(--transition-speed-bg) ease; /* 与背景色时长一致 */
  will-change: opacity;
  z-index: -1; /* 放在 body 背景之上、普通内容（默认 z-index:auto）之下的安全层级 */
}

/* 深色主题时让渐变层显现 */
[data-theme="dark"] {
  --grad-opacity: 1;
}

@keyframes fc-bg-fade-in {
  from { opacity:0; }
  to { opacity:1; }
}

/* Tailwind 适配覆写 */
.bg-white { background:var(--bg-secondary)!important; }
.text-gray-600,.text-gray-500,.text-gray-700 { color:var(--text-secondary)!important; }
.border-gray-200,.border-gray-300 { border-color:var(--border-color)!important; }
.shadow-md { box-shadow:0 4px 10px var(--shadow-color)!important; }
a, button { color:var(--text-primary); }

/* 2. 表单与输入 */
.fc-form-grid { display:grid; grid-template-columns:1fr; row-gap:var(--form-row-gap); }
.fc-form-row label { display:block; margin-bottom:5px; font-size:15px; }

.fc-field,
.fc-btn,
.fc-select {
  box-sizing:border-box;
  height:var(--control-height)!important;
  padding:0 var(--control-h-padding)!important;
  border:1px solid var(--border-color);
  border-radius:var(--control-radius);
  background-color:var(--bg-secondary);
  color:var(--text-primary);
  font-size:14px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  font-weight:500;
  transition:.18s;
}
select.fc-field {
  appearance:none;
  background:
    var(--bg-secondary)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234b5563' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E")
    no-repeat right 12px center / 14px 14px;
  padding-right:40px!important;
}
[data-theme="dark"] select.fc-field {
  background:
    var(--bg-secondary)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23d1d5db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E")
    no-repeat right 12px center / 14px 14px!important;
  padding-right:40px!important;
}
select.fc-field::-ms-expand { display:none; }

.fc-field:focus,
.fc-select:focus,
.fc-btn:focus {
  outline:none;
  border-color:var(--fc-color-primary);
  box-shadow:0 0 0 2px rgba(59,130,246,.35);
}

input.fc-field, select.fc-field { appearance:none; }
input.fc-field::-webkit-inner-spin-button,
input.fc-field::-webkit-outer-spin-button { appearance:none; margin:0; }
input.fc-field[type=number] { -moz-appearance:textfield; appearance: textfield;}

[data-theme="dark"] .fc-field,
[data-theme="dark"] .fc-select {
  background:var(--bg-secondary)!important;
  border-color:var(--border-color)!important;
  color:var(--text-primary)!important;
}

/* 3. 按钮 */
.fc-btn {
  cursor:pointer;
  padding:0 var(--control-btn-h-padding)!important;
  justify-content:center;
  font-weight:600;
  letter-spacing:.5px;
  font-size:14px;
  background:var(--fc-color-primary);
  color:var(--color-white);
  border-color:var(--fc-color-primary);
  transition:background .2s;
}
.fc-btn:hover { background:var(--fc-color-primary-hover); }
.fc-btn:active { background:var(--fc-color-primary-active); }

.fc-btn--primary { background:var(--fc-color-primary)!important; border-color:var(--fc-color-primary)!important; color:var(--color-white)!important; }
.fc-btn--primary:hover { background:var(--fc-color-primary-hover)!important; }
.fc-btn--primary:active { background:var(--fc-color-primary-active)!important; }

.fc-btn--success { background:var(--fc-color-success)!important; border-color:var(--fc-color-success)!important; color:var(--color-white)!important; }
.fc-btn--success:hover { background:var(--fc-color-success-hover)!important; }
.fc-btn--success:active { background:var(--fc-color-success-active)!important; }

.fc-btn--danger { background:var(--fc-color-danger)!important; border-color:var(--fc-color-danger)!important; color:var(--color-white)!important; }
.fc-btn--danger:hover { background:var(--fc-color-danger-hover)!important; }
.fc-btn--danger:active { background:var(--fc-color-danger-active)!important; }

[data-theme="dark"] .fc-btn,
[data-theme="dark"] .fc-btn--primary { background:var(--fc-color-primary)!important; }
[data-theme="dark"] .fc-btn:hover,
[data-theme="dark"] .fc-btn--primary:hover { background:var(--fc-color-primary-hover)!important; }
[data-theme="dark"] .fc-btn--success { background:var(--brand-green-dark)!important; }
[data-theme="dark"] .fc-btn--success:hover { background:var(--brand-green-dark-hover)!important; }
[data-theme="dark"] .fc-btn--danger { background:var(--fc-color-danger)!important; }
[data-theme="dark"] .fc-btn--danger:hover { background:var(--fc-color-danger-hover)!important; }

#sidebar .like-button,
#sidebar .fc-icon-remove,
#sidebar .fc-icon-restore,
#recentlyRemovedList .js-restore-fan {
  cursor: pointer;
}

/* 4. 小型添加按钮 / 图标按钮 */
.fc-btn-icon-add {
  background:transparent!important;
  color:var(--fc-color-success)!important;
  border:none;
  border-radius:6px;
  padding:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:color .2s, transform .2s;
  font-size:14px;
}
.fc-btn-icon-add i { font-size:18px; line-height:1; }
/* 图标旋转过渡（add=0deg / remove=45deg），使用 transform 不影响布局 */
.fc-btn-icon-add i {
  transition: transform .22s cubic-bezier(.22,.7,.26,1);
  transform: rotate(0deg);
}
/* remove 态旋转 45°；颜色仍用既有的 data-mode 样式控制 */
.fc-btn-icon-add[data-mode="remove"] i {
  transform: rotate(45deg);
}
.fc-btn-icon-add:hover { transform:translateY(-1px); color:var(--fc-color-success-hover)!important; }
.fc-btn-icon-add[data-mode="remove"] { color:var(--fc-color-danger)!important; }
.fc-btn-icon-add[data-mode="remove"]:hover { color:var(--fc-color-danger-hover)!important; }

[data-theme="dark"] .fc-btn-icon-add { color:var(--brand-green-dark)!important; }
[data-theme="dark"] .fc-btn-icon-add:hover { color:var(--brand-green-dark-hover)!important; }
[data-theme="dark"] .fc-btn-icon-add[data-mode="remove"] { color:var(--fc-color-danger)!important; }
[data-theme="dark"] .fc-btn-icon-add[data-mode="remove"]:hover { color:var(--fc-color-danger-light)!important; }

@media (prefers-reduced-motion: reduce) {
  .fc-btn-icon-add i { transition: none !important; }
}

.fc-icon-restore { color:var(--fc-color-success)!important; }
.fc-icon-restore:hover { color:var(--fc-color-success-hover)!important; }
[data-theme="dark"] .fc-icon-restore { color:var(--brand-green-dark)!important; }
[data-theme="dark"] .fc-icon-restore:hover { color:var(--brand-green-dark-hover)!important; }

.fc-icon-remove { color:var(--fc-color-danger)!important; }
.fc-icon-remove:hover { color:var(--fc-color-danger-hover)!important; }

/* 5. Tabs / Segmented */
.fc-tabs {
  display:flex;
  gap:.5rem;
  border-bottom:2px solid var(--border-color);
  margin-bottom:1rem;
}
.fc-tabs__item {
  padding:.7rem 1.2rem;
  cursor:pointer;
  font-weight:700;
  color:var(--text-secondary);
  border-bottom:2px solid transparent;
  margin-bottom:-2px;
  transition:.25s;
  user-select:none;
  font-size:16px;
  letter-spacing:.5px;
}
.fc-tabs__item:hover { color:var(--text-primary); }
.fc-tabs__item.active {
  color:var(--fc-color-primary-light);
  border-bottom-color:var(--fc-color-primary-light);
}
.fc-tabs[data-tab-group="sidebar-top"],
.fc-tabs[data-tab-group="left-panel"] { gap:0!important; }
.fc-tabs[data-tab-group="sidebar-top"] .fc-tabs__item,
.fc-tabs[data-tab-group="left-panel"] .fc-tabs__item {
  flex:1 1 0; text-align:center;
}
.fc-tabs[data-tab-group="sidebar-top"] .fc-tabs__item--icon-only {
  flex:0 0 auto;
  min-width:0;
  border-right:2px solid var(--border-color);
}

.fc-seg {
  position:relative;
  display:inline-flex;
  gap:0;
  padding:3px;
  border:1px solid rgba(37,99,235,.30);
  border-radius:9999px;
  background:rgba(37,99,235,.06);
}
.fc-seg__btn {
  position:relative;
  z-index:1;
  padding:6px 12px;
  border-radius:9999px;
  font-weight:600;
  color:var(--text-secondary);
  background:none;
  border:none;
  cursor:pointer;
  transition:.2s;
  font-size:13px;
}
.fc-seg__btn.is-active { color:#fff; }
.fc-seg__thumb {
  position:absolute;
  inset:3px auto 3px 3px;
  /* Default (2-btn): thumb is 50% minus the left inset */
  width:calc(50% - 3px);
  border-radius:9999px;
  background:var(--fc-color-primary);
  box-shadow:0 1px 4px rgba(37,99,235,.35);
  transition:transform .25s ease;
}
/* 2-tab thumb positioning */
.fc-seg[data-active$="likes-panel"] .fc-seg__thumb { transform:translateX(100%); }
/* Rankings sub-tab (2-tab): thumb slides right when 性能榜 active */
.fc-seg[data-active="perf-board"]:not(.fc-seg--3btn) .fc-seg__thumb { transform:translateX(100%); }

/* ── 3-button segmented control ────────────────────────────────────────── */
.fc-seg--3btn .fc-seg__thumb {
  /* Each slot is 1/3 of the track; the 3px left inset is already baked in */
  width:calc(33.333% - 2px);
}
/* Slot 0 (leftmost – default) */
.fc-seg--3btn[data-active="lighting-board"] .fc-seg__thumb { transform:translateX(0); }
/* Slot 1 */
.fc-seg--3btn[data-active="heat-board"]     .fc-seg__thumb { transform:translateX(100%); }
/* Slot 2 (rightmost) */
.fc-seg--3btn[data-active="perf-board"]     .fc-seg__thumb { transform:translateX(200%); }

[data-theme="dark"] .fc-seg {
  border-color:rgba(96,165,250,.35);
  background:rgba(96,165,250,.08);
}
[data-theme="dark"] .fc-seg__thumb {
  background:#3b82f6;
  box-shadow:0 1px 6px rgba(59,130,246,.45);
}

/* Lighting like badge on mini-radar card --------------------------------- */
.fc-mini-radar-lighting-badge {
  position: absolute;
  top: 6px;
  right: 6px;
  display: flex;
  align-items: center;
  pointer-events: none;
  z-index: 5;
}
.fc-mini-radar-whistle-badge {
  position: absolute;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 11px;
  line-height: 1.2;
  color: var(--text-primary);
  border: none;
  pointer-events: auto;
  white-space: nowrap;
  cursor: default;
}
.fc-mini-radar-canvas,
.rpv2-mini-radar-body {
  --fc-whistle-badge-y-nudge: 1px;
}
.fc-condition-radar-canvas {
  --fc-whistle-badge-y-nudge: 0.5px;
}
.fc-mini-radar-whistle-badge[data-anchor="left"] {
  transform: translate(calc(-100% - 6px), calc(-50% + var(--fc-whistle-badge-y-nudge, 0px)));
}
.fc-mini-radar-whistle-badge[data-anchor="right"] {
  transform: translate(6px, calc(-50% + var(--fc-whistle-badge-y-nudge, 0px)));
}
.fc-mini-radar-whistle-badge.is-level-low { background: #86efac; }
.fc-mini-radar-whistle-badge.is-level-mid { background: #fdba74; }
.fc-mini-radar-whistle-badge.is-level-high { background: #fca5a5; }
.fc-mini-radar-whistle-badge:focus-visible {
  outline: 2px solid var(--fc-color-primary, #2563eb);
  outline-offset: 1px;
}
[data-theme="dark"] .fc-mini-radar-whistle-badge.is-level-low { background: #14532d; }
[data-theme="dark"] .fc-mini-radar-whistle-badge.is-level-mid { background: #7c2d12; }
[data-theme="dark"] .fc-mini-radar-whistle-badge.is-level-high { background: #7f1d1d; }
.fc-radar-lighting-like-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: none;
  border-radius: 50%;
  background: var(--radar-lbl-inactive-bg, #e5e7eb);
  font-size: 12px;
  cursor: pointer;
  line-height: 1;
  color: #9ca3af;
  padding: 0;
  user-select: none;
  transition: color .18s ease, box-shadow .18s ease, opacity .2s ease, transform .2s ease;
}
.fc-radar-lighting-like-btn:hover { box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.30); }
.fc-radar-lighting-like-btn.is-liked { color: #ef4444; }
[data-theme="dark"] .fc-radar-lighting-like-btn {
  background: #374151;
  color: #6b7280;
}
[data-theme="dark"] .fc-radar-lighting-like-btn.is-liked { color: #f87171; }

/* Radar header lighting-like strip (above ECharts radar) ----------------- */
.radar-lighting-like-strip {
  position: absolute;
  right: 50%;
  top: 2px;
  transform: translateX(50%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  min-height: 26px;
  z-index: 5;
  width: max-content;
  --radar-lighting-liked-shift: 25px;
  --radar-lighting-liked-shift-left: calc(-1 * var(--radar-lighting-liked-shift));
  --radar-lighting-gap: 6px;
  /* Positive values move the lighting thumb right from its base position; negative values move it left. */
  --radar-lighting-thumb-x: 32px;
}
.rpv2-mi-rgb-tag.fc-radar-rgb-tag {
  font-size: 10px;
  padding: 1px 5px;
  line-height: 1.3;
  transform: translateY(-0.5px) translateX(0);
  transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1),
              opacity .2s ease, filter .2s ease;
}
.radar-lighting-like-strip .fc-radar-lighting-like-btn {
  position: absolute;
  right: 0;
  top: 50%;
  margin: 0;
  transform: translate(calc(-100% - var(--radar-lighting-gap) + var(--radar-lighting-thumb-x)), -50%);
}
.radar-lighting-like-strip.is-rgb-enabled .fc-radar-lighting-like-btn {
  opacity: 0;
  pointer-events: none;
}
.radar-lighting-like-strip.is-rgb-enabled.has-persist .fc-radar-lighting-like-btn {
  opacity: 1;
  pointer-events: auto;
}
.radar-lighting-like-strip.is-rgb-enabled.has-persist .rpv2-mi-rgb-tag.fc-radar-rgb-tag {
  transform: translateY(-0.5px) translateX(var(--radar-lighting-liked-shift-left));
}
.rpv2-mi-rgb-tag.is-muted {
  color: #6b7280;
  background: #d1d5db;
}
[data-theme="dark"] .rpv2-mi-rgb-tag.is-muted {
  color: #9ca3af;
  background: #4b5563;
}
.radar-lighting-like-strip.is-rgb-disabled .fc-radar-lighting-like-btn {
  display: none;
}


.fc-tabs__subseg {
  display:flex;
  align-items:center;
  gap:.5rem;
  min-height:42px;
  flex:0 0 auto;
}
.fc-tabs__subseg .fc-seg { flex:0 0 auto; white-space:nowrap; touch-action:pan-x pan-y; }
.fc-tabs__subseg .fc-seg .fc-seg__btn {
  flex:0 0 var(--seg-btn-w);
  min-width:var(--seg-btn-w);
  text-align:center;
}

.fc-site-hero {
  text-align: center;
}

.fc-site-hero__title-row {
  display: inline-block;
  max-width: 100%;
}

.fc-site-hero__titles {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
}

.fc-site-hero__heading {
  position: relative;
  display: inline-block;
  max-width: 100%;
}

.fc-site-hero__title {
  width: 175px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  margin-bottom: 8px;
}

.fc-site-hero__subtitle {
  margin: 0;
}

.fc-lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  position: absolute;
  left: 100%;
  bottom: 8px;
  padding: 2px;
  margin: 0 0 0 8px;
  border: 1px solid var(--border-color);
  border-radius: 999px;
  background: var(--bg-secondary);
  box-shadow: var(--shadow-sm);
}

.fc-lang-switch__btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  min-width: 34px;
  height: 18px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  font-weight: 600;
  transition: background-color var(--transition-speed-bg) ease, color var(--transition-speed-bg) ease;
}

.fc-lang-switch__btn:hover {
  color: var(--text-primary);
}

.fc-lang-switch__btn.is-active {
  background: var(--fc-color-primary);
  color: #fff;
}

[data-theme="dark"] .fc-lang-switch {
  background: rgba(17, 24, 39, 0.78);
}

@media (max-width: 600px) {
  .fc-site-hero__heading {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
  }

  .fc-lang-switch {
    position: static;
    margin: 0 0 8px 0;
  }
}

/* Score profile compact dropdown (right-panel header row) */
.fc-right-panel-header-row {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 8px;
  pointer-events: none;
}

.fc-right-panel-header-row > * {
  pointer-events: auto;
}

.fc-right-panel-header-left {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  pointer-events: auto;
}

.fc-sps-dropdown {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}
/* Compact trigger button for the score-profile custom dropdown */
.fc-sps-btn {
  display:inline-flex;
  align-items:center;
  gap:4px;
  border:none;
  background:transparent;
  color:var(--text-secondary);
  font-size:12px;
  cursor:pointer;
  padding:1px 0;
  outline:none;
  line-height:1.4;
}
.fc-sps-btn:hover { color:var(--text-primary); }
.fc-sps-btn:focus-visible { outline:2px solid var(--fc-color-primary,#3b82f6); outline-offset:2px; }
[data-theme="dark"] .fc-sps-btn { color:var(--text-secondary); }
[data-theme="dark"] .fc-sps-btn:hover { color:var(--text-primary); }
#ladderOpenBtn { margin-left: 8px; }
#fileShareEntryBtn { margin-left: 8px; }
.fc-sps-arrow { font-size:10px; transition:transform .2s; flex-shrink:0; }
.fc-sps-arrow--open { transform:rotate(-180deg); }
/* Native select fallback (hidden by JS when custom dropdown is built) */
.fc-sps-select {
  border:none;
  background:transparent;
  color:var(--text-secondary);
  font-size:12px;
  cursor:pointer;
  padding:1px 0;
  outline:none;
  -webkit-appearance:auto;
  appearance:auto;
}
.fc-sps-select:hover { color:var(--text-primary); }
[data-theme="dark"] .fc-sps-select { color:var(--text-secondary); }
[data-theme="dark"] .fc-sps-select:hover { color:var(--text-primary); }
.fc-right-query-count {
  font-size:12px;
  color:var(--text-secondary);
}

/* ---- 评分规则说明按钮 ---- */
.fc-sps-explain-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 13px;
  cursor: pointer;
  padding: 1px 4px;
  outline: none;
  line-height: 1;
  opacity: .7;
  transition: opacity .15s, color .15s;
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  pointer-events: auto;
}
.fc-sps-explain-btn:hover,
.fc-sps-explain-btn:focus-visible { opacity:1; color:var(--fc-color-primary,#3b82f6); }
.fc-sps-explain-btn:focus-visible { outline:2px solid var(--fc-color-primary,#3b82f6); outline-offset:2px; border-radius:3px; }

/* ---- 评分规则说明弹层 (fc-sr-*) ---- */
.fc-sr-modal {
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.fc-sr-modal[hidden] { display:none; }

.fc-sr-backdrop {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(2px);
}

.fc-sr-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  width: auto;
  max-width: 600px;
  max-height: 90vh;
  min-width: 0;
  background: var(--bg-primary);
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0,0,0,.28);
}
.fc-sr-header {
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-bottom:1px solid var(--border-color);
  flex-shrink:0;
  flex-wrap:wrap;
}
.fc-sr-title {
  font-size:15px;
  font-weight:600;
  color:var(--text-primary);
  white-space:nowrap;
}
.fc-sr-tabs {
  display:flex;
  gap:4px;
  flex-wrap:wrap;
}
.fc-sr-tab {
  padding:3px 10px;
  border:1px solid var(--border-color);
  border-radius:20px;
  background:transparent;
  color:var(--text-secondary);
  font-size:12px;
  cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
  white-space:nowrap;
}
.fc-sr-tab:hover { border-color:var(--fc-color-primary,#3b82f6); color:var(--fc-color-primary,#3b82f6); }
.fc-sr-tab.active {
  background:var(--fc-color-primary,#3b82f6);
  border-color:var(--fc-color-primary,#3b82f6);
  color:#fff;
}
.fc-sr-close {
  margin-left:auto;
  flex-shrink:0;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  background:transparent;
  color:var(--text-secondary);
  font-size:20px;
  cursor:pointer;
  border-radius:50%;
  transition:background .15s, color .15s;
}
.fc-sr-close:hover { background:var(--bg-secondary); color:var(--text-primary); }

.fc-sr-desc {
  font-size:12px;
  color:var(--text-secondary);
  padding:8px 16px 4px;
  margin:0;
  flex-shrink:0;
}

.fc-sr-body {
  flex: 1;
  width: 100%;
  max-width: 100%;
  overflow: auto;
  padding: 0;
  -webkit-overflow-scrolling: touch;
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
}

.fc-sr-body-inner {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 8px 16px 16px;
  box-sizing: border-box;
}

.fc-sr-content-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.fc-sr-loading {
  padding:40px 0;
  text-align:center;
  color:var(--text-secondary);
  font-size:13px;
}

/* 工况按列、维度按行的得分规则表格 */
.fc-sr-table-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: auto;
  margin-bottom: 12px;
  box-sizing: border-box;
}
.fc-sr-algo-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(680px, 100%);
  max-width: 100%;
}
.fc-sr-algo-item h4 {
  margin: 0 0 4px;
  font-size: 13px;
  color: var(--text-primary);
  font-weight: 600;
}
.fc-sr-algo-item p {
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  color: var(--text-secondary);
  white-space: pre-line;
}
.fc-sr-table {
  border-collapse: collapse;
  font-size: 12px;
  width: max-content;
  table-layout: auto;
}
.fc-sr-table th,
.fc-sr-table td {
  border:1px solid var(--border-color);
  padding:5px 8px;
  vertical-align:middle;
  white-space:nowrap;
}
.fc-sr-table thead th {
  background:var(--bg-secondary);
  font-weight:600;
  text-align:center;
  color:var(--text-primary);
  min-width:120px;
  white-space:nowrap;
}
/* 第一列：维度标签列 */
.fc-sr-table .fc-sr-dim-cell {
  background:var(--bg-secondary);
  font-weight:600;
  color:var(--text-primary);
  text-align:left;
  white-space:nowrap;
  vertical-align:top;
}
.fc-sr-table .fc-sr-dim-name {
  display:block;
  font-weight:600;
  margin-bottom:2px;
}
.fc-sr-table .fc-sr-dim-formula {
  display:block;
  font-family:'Cascadia Code','Fira Code','Menlo','Consolas',monospace;
  font-size:10px;
  color:var(--text-secondary);
  white-space:nowrap;
  font-weight:400;
  line-height:1.4;
  margin-top:4px;
  padding-top:4px;
  border-top:1px dashed var(--border-color);
}
/* 数值 / 参考值行 */
.fc-sr-table td:not(.fc-sr-dim-cell) {
  text-align:center;
  vertical-align:top;
  white-space:nowrap;
}
.fc-sr-table .fc-sr-ref-db {
  display:block;
  font-weight:500;
  margin-bottom:2px;
}
.fc-sr-table .fc-sr-model-tag {
  display:inline-block;
  max-width:90px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  vertical-align:bottom;
  font-size:10px;
  color:var(--text-secondary);
}
.fc-sr-table .fc-sr-best-score {
  display:block;
  font-weight:500;
  padding-top:4px;
  margin-top:2px;
  border-top:1px dashed var(--border-color);
}
.fc-sr-table .fc-sr-best-score.fc-sr-best-solo {
  border-top:none;
  padding-top:0;
  margin-top:0;
}
.fc-sr-table .fc-sr-best-label {
  font-size:10px;
  color:var(--text-secondary);
  display:block;
}
/* 分隔线：每个维度块底部加粗 */
.fc-sr-table tr.fc-sr-dim-row td {
  border-bottom:2px solid var(--border-color);
}

/* 注释区 */
.fc-sr-footnote {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.6;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  contain: inline-size;
}
.fc-sr-footnote h4 {
  font-size:12px;
  font-weight:600;
  color:var(--text-primary);
  margin:8px 0 4px;
}
.fc-sr-footnote ul {
  margin:0;
  padding-left:16px;
}
.fc-sr-footnote li {
  margin-bottom: 4px;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.fc-sr-header,
.fc-sr-desc {
  width: 100%;
  box-sizing: border-box;
}
.fc-sr-footnote h4,
.fc-sr-footnote ul,
.fc-sr-footnote li {
  max-width: 100%;
  min-width: 0;
}

/* 综合评分工况权重简表 — scrollable wrapper prevents the table from expanding the panel */
.fc-sr-wt-wrap {
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
}
.fc-sr-weight-table {
  border-collapse:collapse;
  font-size:11px;
  margin-top:4px;
  width:auto;
}
.fc-sr-weight-table th,
.fc-sr-weight-table td {
  border:1px solid var(--border-color);
  padding:3px 10px;
  text-align:center;
  white-space:nowrap;
}
.fc-sr-weight-table th {
  background:var(--bg-secondary);
  font-weight:600;
  color:var(--text-primary);
}
.fc-sr-weight-table td {
  color:var(--text-secondary);
}

.fc-marquee-cell { overflow:hidden; }
.fc-marquee-inner,
#sidebar .fan-item .fc-sidebar-marquee-inner,
#recentLikesList .fc-recent-marquee-inner {
  display:inline-block;
  will-change:transform;
  transition:transform .35s ease;
}

/* 7. 主题切换按钮 */
.fc-theme-toggle {
  position:fixed;
  top:10px; right:25px;
  z-index:1000;
  background:var(--bg-secondary);
  border:1px solid var(--border-color);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 2px 6px var(--shadow-color);
  width:44px;
  height:44px;
  border-radius:50%;
  transition:background .25s, transform .25s;
}
.fc-theme-toggle:active { transform:scale(.95); }

/* 8. Toast */
#toastContainer {
  position:fixed;
  top:12px; left:50%;
  transform:translateX(-50%);
  z-index:2000;
  display:flex;
  flex-direction:column;
  gap:10px;
  width:clamp(260px,60vw,520px);
  pointer-events:none;
}
.fc-toast {
  background:var(--toast-bg);
  color:var(--toast-text);
  border:1px solid var(--toast-border);
  box-shadow:0 4px 12px rgba(0,0,0,0.18);
  padding:.75rem 1rem;
  border-radius:10px;
  font-size:14px;
  line-height:1.3;
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  opacity:0;
  transform:translateY(-8px);
  animation:toast-in .35s cubic-bezier(.4,0,.2,1) forwards;
  pointer-events:auto;
  position:relative;
}
.fc-toast--success { border-color:var(--toast-success)!important; }
.fc-toast--error   { border-color:var(--toast-error)!important; }
.fc-toast--loading { border-color:var(--toast-loading)!important; }
.fc-toast__close { position:absolute; top:4px; right:8px; cursor:pointer; font-weight:600; }
@keyframes toast-in { to { opacity:1; transform:translateY(0); } }
@keyframes toast-out { to { opacity:0; transform:translateY(-6px); } }

/* 9. Tooltip */
#appTooltip {
  position:fixed;
  z-index:3000;
  max-width:min(70vw,320px);
  padding:8px 10px;
  font-size:12px;
  line-height:1.35;
  color:var(--site-tooltip-text);
  background:var(--site-tooltip-bg);
  border:1px solid var(--site-tooltip-border);
  border-radius:8px;
  box-shadow:var(--site-tooltip-shadow);
  pointer-events:none;
  opacity:0;
  transform:translateY(-6px);
  transition:opacity .15s ease, transform .15s ease;
  white-space:normal;
}
#appTooltip[data-measuring="1"] {
  visibility:hidden;
  opacity:0;
  transform:none !important;
  transition:none;
}
#appTooltip[data-show="1"] { opacity:1; transform:translateY(0); }
#appTooltip::after {
  content:"";
  position:absolute;
  left:50%; transform:translateX(-50%);
  bottom:-6px;
  border-width:6px 6px 0 6px;
  border-style:solid;
  border-color:var(--site-tooltip-bg) transparent transparent transparent;
}
#appTooltip[data-placement="bottom"]::after {
  top:-6px; bottom:auto;
  border-width:0 6px 6px 6px;
  border-color:transparent transparent var(--site-tooltip-bg) transparent;
}
/* 说明型 tooltip：箭头跟随锚点位置而非 tooltip 中心 */
#appTooltip[data-info-mode="1"] {
  box-sizing:border-box;
}
#appTooltip[data-info-mode="1"]::after {
  left: var(--tip-caret, 50%);
}

/* 10. 文本/辅助标签 */
.fc-condition-label {
  font-size:14px;
  color:var(--text-secondary);
  margin:4px 0 8px 2px;
  line-height:1.3;
  opacity:.9;
  letter-spacing:.5px;
  font-weight:500;
}
[data-theme="dark"] .fc-condition-label { color:var(--text-secondary); }

.fc-clear-confirm { display:flex; gap:.5rem; }
.fc-clear-confirm button {
  flex:1;
  font-size:14px;
  padding:.55rem .75rem;
  border-radius:8px;
  font-weight:500;
}

.share-fail-url { word-break:break-all; white-space:normal; font-family:monospace; }

/* 11. 侧栏结构 */
#sidebar {
  position:fixed;
  top: var(--announce-offset);
  left:0;
  height: calc(100vh - var(--announce-offset));
  width:450px;
  background:var(--bg-secondary);
  border-right:1px solid var(--border-color);
  box-shadow:2px 0 10px var(--shadow-color);
  z-index:50;
  display:flex;
  flex-direction:column;
  transform:translateX(0);
  transition:transform 0.25s ease;
  overflow:hidden;
}
#sidebar.collapsed { transform:translateX(-100%); }
/* Perf: 折叠动画结束后由 JS 追加 is-content-skipped，让整块侧栏内容
   （含数十张迷你雷达卡）不再参与文档重排。展开时同步移除。 */
#sidebar.collapsed.is-content-skipped { content-visibility: hidden; }

#sidebar-resizer {
  position:absolute;
  top:0; right:0;
  width:6px;
  height:100%;
  cursor:ew-resize;
  z-index:70;
  pointer-events:auto;
  touch-action:none;
}
#sidebar-resizer:hover { background:rgba(0,0,0,.08); }

.fc-sidebar-panel { display:flex; flex-direction:column; overflow:hidden; }

.fc-sidebar-panel__content {
  --sp-pad-top:8px;
  --sp-pad-x:0;
  --sp-pad-bottom:24px;
  flex-grow:1;
  padding:var(--sp-pad-top) var(--sp-pad-x) var(--sp-pad-bottom);
  scrollbar-color:var(--border-color) var(--bg-secondary);
}
#top-panel .fc-sidebar-panel__content { overflow-y:hidden!important; overflow-x:hidden!important; }
#top-panel .fc-tab-container { min-height:0!important; }
/* top-panel fills entire sidebar body */
#top-panel { flex:1 1 0; min-height:0; }

#sidebar-header {
  padding:14px 18px 10px;
  position:relative;
}
#sidebar-header::after {
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:1px;
  background:var(--border-color);
  pointer-events:none;
}

/* 顶部 Tab 底线缩进 */
#top-panel .fc-sidebar-panel__content > nav.fc-tabs {
  position:relative;
  margin:0;
  padding:0 var(--content-left-gutter);
  padding-top:0;
  border-bottom:none;
}
#top-panel .fc-sidebar-panel__content > nav.fc-tabs::after {
  content:"";
  position:absolute;
  bottom:0;
  left:var(--content-left-gutter);
  right:var(--content-left-gutter);
  height:2px;
  background:var(--border-color);
}

/* 顶部水平滑动容器 */
#sidebar-top-container {
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scrollbar-width:none;
  position:relative;
  width:100%;
  height:200px;
}
#sidebar-top-wrapper {
  display:flex;
  width:auto;
  min-width:100%;
  height:100%;
}
#sidebar-top-wrapper .fc-tab-pane {
  flex:0 0 100%;
  width:100%;
  height:100%;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  display:flex;
  flex-direction:column;
  min-height:0;
  padding-left:0;
  padding-right:0;
}
/* Perf: 滚动停止后，非当前页签的内容整体退出渲染（盒子尺寸保留，
   scroll-snap 偏移不受影响）。滚动期间由 JS 移除该类，滑动动画正常。 */
#sidebar-top-wrapper .fc-tab-pane.is-pane-skipped { content-visibility: hidden; }

#top-panel #recentlyRemovedList,
#top-panel #recentLikesList,
#top-panel #fileShareList {
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  padding-left:var(--content-left-gutter)!important;
  padding-right:max(0px, calc(var(--content-right-gutter) - var(--sbw)))!important;
  padding-top:var(--content-bottom-gap);
  scrollbar-gutter:stable;
}
#top-panel #recentlyRemovedList .fan-item {
  display:grid!important;
  grid-template-columns:1fr var(--action-restore-col-w);
  align-items:center;
  column-gap:var(--action-gap);
}
#top-panel #recentlyRemovedList .fan-item .fc-icon-restore {
  width:var(--action-restore-col-w)!important;
  display:flex; justify-content:center;
  margin:0;
}

#top-panel .recent-like-group .actions {
  display:grid!important;
  grid-template-columns:var(--action-like-col-w) var(--action-add-col-w);
  column-gap:var(--action-gap);
  justify-content:end;
  align-items:center;
  pointer-events:auto;
  position:relative;
  z-index:1;
}
#top-panel .recent-like-group .actions .like-button,
#top-panel .recent-like-group .actions .fc-btn-icon-add {
  display:flex!important;
  justify-content:center;
  margin:0!important;
}
#top-panel .recent-like-group .actions .like-button { width:var(--action-like-col-w)!important; }
#top-panel .recent-like-group .actions .fc-btn-icon-add {
  width:var(--action-add-col-w)!important;
  height:28px;
  padding:0;
}

#sidebar .fan-item .truncate { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* 侧栏浮动主按钮 */
#sidebar-toggle {
  all:unset;
  position:fixed;
  top:10px; left:10px;
  width:44px; height:44px;
  border-radius:50%;
  background:var(--bg-secondary);
  border:1px solid var(--border-color);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 2px 6px var(--shadow-color);
  z-index:1100;
  transition:background .25s, border-color .25s, box-shadow .25s, transform .2s;
}
#sidebar-toggle .icon-sidebar {
  position:relative;
  width:20px; height:20px;
  display:block;
  box-sizing:border-box;
  border:2px solid currentColor;
  border-radius:4px;
  background:linear-gradient(to right, rgba(128,128,128,0.5) 0 30%, transparent 0 100%);
}
#sidebar-toggle .icon-sidebar::before {
  content:"";
  position:absolute;
  top:0; bottom:0; left:30%;
  width:0;
  border-left:2px solid currentColor;
}
#sidebar-toggle:focus { outline:none; box-shadow:0 2px 6px var(--shadow-color); }
#sidebar-toggle:active { transform:scale(.95); }
[data-theme="dark"] #sidebar-toggle {
  background:var(--bg-secondary);
  border-color:var(--border-color);
}

/* Overlay 模式 */
.sidebar-overlay-mode #sidebar {
  width:100vw;
  max-width:100vw;
  left:0; top:0;
  height:100vh;
  transform:translateX(-100%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  z-index:300;
  background:var(--bg-secondary);
  backdrop-filter:saturate(120%) blur(8px);
}
.sidebar-overlay-mode #sidebar:not(.collapsed) { transform:translateX(0); }
.sidebar-overlay-mode #main-content { margin-left:0; transform:none; }

#sidebar-gesture-close-zone {
  position:absolute;
  top:0; right:0;
  width:var(--gesture-close-zone-width);
  height:100%;
  z-index:350;
  touch-action:none;
  cursor:ew-resize;
  background:linear-gradient(to left, rgba(80,80,80,0.4), rgba(80,80,80,0));
}

/* 顶部 Tab 补丁 */
#top-panel .fc-tabs .fc-tabs__item { margin-bottom:0!important; }
#top-panel .fc-tabs .fc-tabs__item.active { border-bottom-color:var(--fc-color-primary-light)!important; z-index:60; }

/* 12. 主内容 / Tab 容器 */
#main-content { margin-left:0; transition:margin-left var(--transition-speed) ease; }

.fc-tab-container { overflow:hidden; position:relative; min-height:460px; }
.fc-tab-wrapper { display:flex; width:200%; transition:transform .45s cubic-bezier(.4,0,.2,1); }
.fc-tab-pane { width:50%; flex-shrink:0; padding:0 2px; }

/* 左侧横滑 */
/* NEW: 限制“主布局中包含左侧搜索容器的那一列”本身不被继续压缩 */
#main-panels > *:has(#left-panel-container) {
  min-width: var(--left-search-min-w);
  /* 防止 flex 把它压到小于 min-width；0 1 auto 允许在超过 min 时参与布局 */
  flex: 0 1 auto;
  /* 使内部的 nav + container 垂直堆叠，以便 container flex-grow */
  display: flex;
  flex-direction: column;
}

#left-panel-container {
  overflow-x:auto;
  overflow-y:visible;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  scrollbar-width:none;
  touch-action:pan-x pan-y;
  /* 填满父容器剩余高度（在 flex-column 容器内） */
  flex: 1 1 0;
  min-height: 0;
}
#left-panel-container::-webkit-scrollbar { display:none; }
#left-panel-wrapper {
  display:flex;
  width:auto;
  min-width:100%;
  height:100%;
}
#left-panel-wrapper .fc-tab-pane {
  flex:0 0 100%;
  width:100%;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  height:100%;
}

/* 按型号添加 tab：使表单填满整个面板高度，雷达图自动填充剩余空间 */
#fanForm.fc-form-grid {
  display: flex;
  flex-direction: column;
  height: 100%;
}
#add-by-model-pane .fc-form-row:has(#conditionMulti) {
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
/* 雷达图容器：自适应高度，填充父 row 的剩余空间 */
.fc-condition-multi.fc-radar-multi {
  height: auto !important;
  flex: 1 1 0;
  min-height: 60px;
}
/* "进阶搜索" form: fill container height so its submit button pins to the
   bottom, matching the "按型号添加" tab and preventing visible vertical
   mismatch when switching tabs in narrow mode. */
#searchForm.fc-form-grid {
  display: flex;
  flex-direction: column;
  height: 100%;
}
#filter-by-scenario-pane .fc-form-row:last-child {
  margin-top: auto;
}

/* 5a: Slightly wider column gap between paired controls (尺寸/风扇厚度, RGB/价格) */
#filter-by-scenario-pane .fc-form-row > .grid-cols-3 {
  column-gap: 1rem;
}

/* 5b: Tighter spacing around the "-" separator in all dual-input range rows */
#filter-by-scenario-pane .fc-form-row div.flex.items-center {
  gap: 4px;
}

#query-count-display.fc-right-query-count {
  position: static;
  z-index: auto;
  font-size: 12px;
  color: var(--text-muted);
  background: transparent;
  padding: 2px 0;
  flex: 0 0 auto;
  pointer-events: auto;
}

/* 搜索建议 */
#searchSuggestions {
  font-size:14px;
  line-height:1.4;
  background:var(--bg-secondary);
  color:var(--text-primary);
  border:1px solid var(--border-color);
  border-radius:8px;
  overflow:hidden;
  z-index:100;
}
#searchSuggestions > div { padding:8px 12px; cursor:pointer; }
#searchSuggestions > div:hover { background:var(--hover-overlay); }
[data-theme="dark"] #searchSuggestions > div:hover { background:var(--dark-hover-bg); }

/* Info 按钮 */
.fc-info-btn {
  width:24px; height:24px;
  opacity:.55;
  transition:opacity .25s ease, transform .25s ease;
}
.fc-info-btn:hover,
.fc-info-btn:focus {
  opacity:1;
  transform:translateY(-2px);
}
.fc-info-btn:focus {
  outline:none;
  box-shadow:0 0 0 2px rgba(0,0,0,.12);
}

/* 强制竖排 (自适应) */
.fc-force-col { flex-direction:column!important; }
.fc-force-col > * {
  width:100%!important;
  max-width:100%!important;
  transition:width .25s, flex .25s;
}
@media (min-width:1024px){
  .fc-force-col > * { width:100%!important; }
}


/* Scenario row text (kept for any remaining uses) */
#recentLikesList .scenario-row .scenario-text {
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


/* 13. 工具色类 */
.fc-bg-primary { background:var(--fc-color-primary)!important; color:var(--color-white)!important; }
.fc-bg-success { background:var(--fc-color-success)!important; color:var(--color-white)!important; }
.fc-bg-danger  { background:var(--fc-color-danger)!important; color:var(--color-white)!important; }

.fc-text-primary { color:var(--fc-color-primary)!important; }
.fc-text-success { color:var(--fc-color-success)!important; }
.fc-text-danger  { color:var(--fc-color-danger)!important; }

:root {
  --toast-glass-bg: rgb(255, 255, 255);
  --toast-glass-border: rgba(255,255,255,0.55);
  --toast-glass-shadow: 0 4px 18px -2px rgba(0,0,0,0.18), 0 0 0 1px rgba(0,0,0,0.06);
}
[data-theme="dark"] {
  --toast-glass-bg: rgba(31,41,55,0.58);
  --toast-glass-border: rgba(255,255,255,0.10);
  --toast-glass-shadow: 0 4px 22px -4px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.06);
}


.fc-toast {
  background: var(--toast-glass-bg) !important;
  border: 1px solid var(--toast-glass-border) !important;
  box-shadow: var(--toast-glass-shadow) !important;
  display: flex;
  align-items: center;            
  gap: .65rem;
  padding: .85rem 1.05rem;
  line-height: 1.35;
  border-radius: 14px;            
  position: relative;
}

/*Toast 深色主题毛玻璃效果*/
[data-theme="dark"] .fc-toast {
  background-color: var(--toast-glass-bg) !important;
  backdrop-filter: blur(8px) saturate(120%);
  -webkit-backdrop-filter: blur(8px) saturate(120%);
  border: 1px solid var(--toast-glass-border) !important;
  box-shadow: var(--toast-glass-shadow) !important;

  display: flex;
  align-items: center;            
  gap: .65rem;
  padding: .85rem 1.05rem;
  line-height: 1.35;
  border-radius: 14px;            
  position: relative;
  transition: background-color .25s ease, box-shadow .25s ease;
}




.fc-toast .icon,
.fc-toast i.icon,
.fc-toast > i.fa-solid,
.fc-toast > i.fa-regular {
  line-height: 1;                 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  font-size: 20px;                
  min-width: 20px;
  margin-top: 2px;
  transform: translateY(-1px);    
}

.fc-toast .msg {
  flex: 1 1 auto;
  min-width: 0;
  word-break: break-word;
  white-space: normal;
  font-size: 15px;
  font-weight: 500;
}

.fc-toast__close {
  top: 6px;
  right: 8px;
  font-size: 16px;
  line-height: 1;
  opacity: .55;
  transition: opacity .2s;
}
.fc-toast__close:hover { opacity: .95; }

.fc-toast--success { border-color: rgba(16,185,129,0.6) !important; }
.fc-toast--error   { border-color: rgba(220,38,38,0.6) !important; }
.fc-toast--loading { border-color: rgba(37,99,235,0.60) !important; }

@keyframes toast-in {
  from { opacity:0; transform:translateY(-8px) scale(.96); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes toast-out {
  to { opacity:0; transform:translateY(-6px) scale(.96); }
}

/* =========================================================
   搜索模块自定义下拉框和复选框
   ========================================================= */
/* 多选工况容器：高度≈两行控件，内部滚动条主题适配 */
.fc-condition-multi{
  box-sizing: border-box;
  height: calc(var(--control-height) * 2 + var(--form-row-gap) + 26px) !important;
  overflow: auto;
  display: block;
  align-items: initial;
  scrollbar-color: var(--border-color) var(--bg-secondary);
  /* 让滚动条在内容内侧留出上下间隙，减少贴边覆盖圆角的观感 */
  scrollbar-gutter: stable;
  padding-block: 4px;          /* Firefox/通用：顶部/底部打一点缓冲 */
  background-clip: padding-box; /* 防止背景越过圆角边界 */
}

/* 雷达图容器：自适应高度，flex 填充（具体高度由 #fanForm 布局决定） */
.fc-condition-multi.fc-radar-multi {
  overflow: hidden;
  display: flex;
  align-items: stretch;
  padding: 0px;
  margin-bottom: 0px;
}

/* WebKit 滚动条主题适配 */
.fc-condition-multi::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.fc-condition-multi::-webkit-scrollbar-thumb {
  background: var(--border-color);
  border-radius: 4px;
  /* 为滚动条滑块创造内边距感，避免顶底贴边 */
  border: 3px solid transparent;
  background-clip: content-box;
}
.fc-condition-multi::-webkit-scrollbar-thumb:hover {
  background: var(--text-secondary);
  background-clip: content-box;
}
.fc-condition-multi::-webkit-scrollbar-track {
  background: var(--bg-secondary);
  margin: 6px 0;               /* 关键：轨道上下留白（Chrome/Safari 有效） */
  border-radius: 8px;
}

#conditionMulti { position: relative; }

/* 覆盖式的加载层，不占用文档流高度 */
#conditionLoading {
  position: absolute;
  inset: 0;
  place-items: center;    /* 居中菊花/文案 */
  pointer-events: none;   /* 不挡交互 */
  z-index: 2;
}

/* 关键：不要无条件 display:grid，改为仅当不含 hidden 时显示 */
#conditionLoading:not(.hidden) { display: grid; }
/* 兜底（确保任何来源的 .hidden 都能生效） */
#conditionLoading.hidden { display: none !important; }

/* 多选项对齐：让复选框与文字垂直居中 */
#conditionMulti #condList label {
  display: flex;
  align-items: center;  /* 核心：垂直居中 */
  gap: 8px;
  line-height: 1.2;
  padding: 2px 0;
}

#conditionMulti #condList .fc-cond-extra {
  color: var(--text-secondary) !important;  /* 与侧栏一致的偏灰色 */
}

/* 统一复选框尺寸与主题颜色 */
#conditionMulti input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;             /* 去掉默认外边距，避免基线偏移 */
  accent-color: var(--fc-color-primary);
  flex: 0 0 auto;
}

/* “全部”置顶区背景跟随主题（如果用了 sticky header） */
#conditionMulti .sticky {
  background: var(--bg-secondary) !important;
}

/* =========================================================
   雷达图工况选择器 (Radar Chart Condition Selector)
   ========================================================= */
#conditionRadarChart {
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
}

.fc-condition-radar-canvas {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
}

.fc-condition-radar-canvas .fc-radar-svg {
  overflow: visible;
}

#fc-radar-svg,
.fc-radar-svg {
  display: block;
  width: 100%;
  height: 100%;
}

.fc-radar-ring {
  fill: none;
  stroke: var(--border-color);
  stroke-width: 0.6;
}

/* Shared grid <symbol> reference. CSS class selectors do not match inside a
   <use> shadow tree, so the ring/axis stroke color is set here on the <use>
   element itself and inherited by the referenced shapes (stroke is an
   inherited SVG property). Per-shape stroke-width lives on the shapes. */
.fc-radar-grid-use {
  fill: none;
  stroke: var(--border-color);
}

.fc-radar-axis {
  stroke: var(--border-color);
  stroke-width: 0.8;
}

.fc-radar-area {
  fill: var(--fc-color-primary);
  fill-opacity: 0.12;
  stroke: var(--fc-color-primary);
  stroke-width: 1.5;
  stroke-linejoin: round;
  pointer-events: none;
}

.fc-radar-vertex {
  fill: var(--bg-secondary);
  stroke: var(--border-color);
  stroke-width: 1.5;
  cursor: default;
  display: none;
}
.fc-radar-vertex.available {
  stroke: var(--fc-color-primary);
  cursor: pointer;
  transition: fill 0.15s;
  display: none;
}
.fc-radar-vertex.available:hover,
.fc-radar-vertex.available:focus {
  stroke-width: 2.5;
  outline: none;
}
.fc-radar-vertex.available.sel {
  fill: var(--fc-color-primary);
}
.fc-radar-vertex.unavail {
  opacity: 0.25;
  display: none;
}

.fc-radar-score-lbl {
  font-size: 12px;
  fill: var(--fc-color-primary);
  font-weight: 600;
  pointer-events: none;
}

.fc-radar-lbl {
  font-size: 13px;
  font-weight: 500;
  fill: var(--text-primary);
  pointer-events: none;
}
.fc-radar-lbl-group {
  cursor: pointer;
}
.fc-radar-lbl-group:focus {
  outline: none;
}
.fc-radar-lbl-pill {
  fill: var(--bg-secondary);
  stroke: var(--border-color);
  stroke-width: 1;
  /* No transition: prevents blue flash when mouse leaves */
}
.fc-radar-lbl-group:hover .fc-radar-lbl-pill,
.fc-radar-lbl-group:focus-visible .fc-radar-lbl-pill {
  fill: var(--fc-color-primary);
  fill-opacity: 0.08;
  stroke: var(--fc-color-primary);
  stroke-opacity: 0.6;
}
.fc-radar-lbl-group.sel .fc-radar-lbl-pill {
  fill: var(--fc-color-primary);
  fill-opacity: 0.15;
  stroke: var(--fc-color-primary);
}
.fc-radar-lbl-group.sel .fc-radar-lbl {
  fill: var(--fc-color-primary);
  font-weight: 700;
}
.fc-radar-lbl.unavail {
  fill: var(--text-secondary);
  opacity: 0.5;
}

.fc-radar-center {
  fill: var(--bg-secondary);
  stroke: var(--border-color);
  stroke-width: 1;
  cursor: pointer;
}
.fc-radar-center:focus {
  outline: none;
}
.fc-radar-center:hover,
.fc-radar-center:focus-visible {
  fill: var(--fc-color-primary);
  fill-opacity: 0.15;
}
.fc-radar-center.all-sel {
  fill: var(--fc-color-primary);
  fill-opacity: 0.22;
  stroke: var(--fc-color-primary);
}
/* Display-only variant (add-model tab): slightly larger, borderless, non-interactive */
.fc-radar-center-display {
  fill: var(--fc-color-primary);
  fill-opacity: 0.08;
  stroke: none;
  pointer-events: none;
  cursor: default;
}
/* Center score badge (pill rect) — geometry mirrors .rpv2-score-badge so all views match.
   fill / fill-opacity are always overridden by inline styles from buildMiniRadarSVG();
   the values here serve as last-resort fallbacks only. */
.fc-radar-center-badge {
  fill: var(--fc-color-primary);
  fill-opacity: 0.10;
  stroke: none;
  pointer-events: none;
  cursor: default;
}
/* fill is always set via inline style from buildMiniRadarSVG(); this is a fallback only. */
.fc-radar-center-badge-lbl {
  fill: var(--text-primary);
  pointer-events: none;
}
.fc-radar-center-lbl {
  font-size: 11px;
  fill: var(--text-secondary);
  pointer-events: none;
  font-weight: 500;
}
/* Bold score text for the display-only center circle */
.fc-radar-center-lbl--bold {
  font-size: 13px;
  fill: var(--text-primary);
  font-weight: 700;
  pointer-events: none;
}

/* 自定义下拉：作用范围从搜索页扩展到型号添加页 */
#searchForm .fc-custom-select,
#fanForm .fc-custom-select { 
  position: relative; 
  scrollbar-color: var(--border-color) var(--bg-secondary);
}

/* 自定义下拉按钮禁用态：让显示文字变灰（占位风格） */
.fc-custom-select .fc-custom-button[aria-disabled="true"] .fc-custom-label,
.fc-custom-select .fc-custom-button:disabled .fc-custom-label {
  color: var(--text-secondary) !important;
}
/* 自定义下拉按钮禁用态：整体视觉变暗，不可点击 */
.fc-custom-select .fc-custom-button[aria-disabled="true"],
.fc-custom-select .fc-custom-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  background: var(--bg-secondary, #f3f4f6) !important;
}
/* 数字输入框禁用态：视觉区分 */
input.fc-field:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  background: var(--bg-secondary, #f3f4f6) !important;
}

/* 按钮：与原生一致（JS 会覆盖圆角与字号），两处表单共用 */
#searchForm .fc-custom-button,
#fanForm .fc-custom-button {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: .375rem;
  padding: .5rem .75rem;
  background: var(--bg-primary);
  color: inherit;
  font: inherit;
  line-height: 1.5;
  transition: color var(--transition-speed-bg) ease,
              background-color var(--transition-speed-bg) ease,
              border-color var(--transition-speed-bg) ease,
              box-shadow var(--transition-speed-bg) ease;
}

/* 面板：背景与自定义下拉一致，不透明深色（暗色主题） */
.fc-custom-options:not(.fc-portal) {
  position: absolute; 
  left: 0; 
  right: 0; 
  margin-top: 4px;
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: .375rem;
  box-shadow: var(--shadow-md, 0 4px 10px rgba(0,0,0,.08));
  max-height: 240px; overflow: auto;
  z-index: 40;
  font: inherit;
}

.fc-custom-options.hidden { display: none !important; }
/* 允许自定义下拉面板越过父容器裁切：门户面板样式 */
.fc-custom-options.fc-portal {
  box-sizing: border-box;  
  max-width: calc(100vw - 8px);
  position: fixed;          /* 关键：相对视口定位 */
  left: 0; top: 0;          /* 实际坐标由 JS 设置 */
  margin-top: 0;
  background: var(--bg-primary);
  border: 1px solid var(--border-color);
  border-radius: .375rem;
  box-shadow: var(--shadow-md, 0 4px 10px rgba(0,0,0,.08));
  max-height: 320px;
  overflow-x: hidden;
  z-index: 1200;            /* 高于侧栏内容、表单等 */
  font: inherit;
  scrollbar-gutter: stable;                /* 预留滚动条空间，避免跳动 */
  scrollbar-color: var(--border-color) var(--bg-secondary); /* Firefox 主题色 */
}

/* 全局选项条目样式（避免仅限某表单作用域） */
.fc-custom-options .fc-option {
  padding: .375rem .625rem;
  cursor: pointer;
  font: inherit;
}

.fc-custom-options .fc-option--multi {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.fc-custom-options .fc-option-multi-check {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.fc-custom-options span.fc-option-multi-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 1.4px solid #717171;
  border-radius: 2.2px;
  color: transparent;
  user-select: none;
  background-color: #3e3e3e;
}

.fc-custom-options span.fc-option-multi-check:hover {
  border-color: #a4a4a4;
}

.fc-custom-options .fc-option-multi-icon {
  width: 12px;
  height: 12px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fc-custom-options .fc-option-multi-icon--exclude {
  width: 12px;
  height: 12px;
  stroke-width: 2.7;
}

.fc-custom-options span.fc-option-multi-check.is-include {
  background: var(--fc-color-primary-light);
  border-color: var(--fc-color-primary-light);
  color: var(--color-white);
}

.fc-custom-options span.fc-option-multi-check.is-exclude {
  background: rgba(220, 38, 38, 0.12);
  border-color: var(--fc-color-danger);
  color: var(--fc-color-danger);
}

.fc-custom-options .fc-option-multi-content {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.fc-color-swatch {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  flex: 0 0 auto;
  background: #64748b;
  border: 1px solid rgba(148, 163, 184, 0.65);
}
.fc-color-swatch.is-black { background: #111827; }
.fc-color-swatch.is-white {
  background: #fff;
  border-color: #cbd5e1;
}
.fc-color-swatch.is-silver { background: #adadad; }
.fc-color-swatch.is-noctua { background: linear-gradient(135deg, #ffca8e 20%, #4b1d00 80%); }
.fc-color-swatch.is-other { background: linear-gradient(135deg, #22d3ee 0%, #a855f7 50%, #f59e0b 100%); }

.fc-search-color-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.fc-search-color-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fc-custom-options .fc-option:hover {
  background: var(--bg-secondary);
}

/* Score-profile dropdown panel header (non-selectable label row) */
.fc-sps-panel-header {
  padding: .3rem .625rem;
  font-size: 11px;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border-color);
  margin-bottom: .125rem;
  pointer-events: none;
  user-select: none;
}

/* Model dropdown option: name + score badge in a flex row */
.fc-model-option-with-badge {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  width: 100%;
}

/* In dropdown option rows the badge should sit close to the model text instead
   of being pushed to the far right edge of the full-width option row.
   The selected-value display (inside .fc-custom-button) keeps space-between. */
.fc-option .fc-model-option-with-badge {
  justify-content: flex-start;
  width: auto;
}

/* 工况后缀置灰与略缩小：两处表单共用 */
#searchForm .fc-cond-extra,
#fanForm .fc-cond-extra,
#conditionMulti #condList .fc-cond-extra {
  color: var(--text-secondary);
  font-size: 0.92em;
}

/* 深色主题下的候选面板背景与自定义下拉一致（不透明深色） */
[data-theme="dark"] #searchSuggestions, 
[data-theme="dark"] .fc-custom-options.fc-portal {
  background: var(--bg-primary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* 追加：移动端（≤600px）整体收紧边距/内边距，提升可视内容占比 */
@media (max-width: 600px) {
  /* 全局内容 gutter 更窄 */
  :root {
    --content-left-gutter: 12px;
    --content-right-gutter: 12px;
    --content-bottom-gap: 8px;
    --bottom-title-gap: 6px;
  }

  /* 顶层容器左右/上下 padding 收紧（不改模板类） */
  .container.mx-auto {
    padding-left: 8px !important;
    padding-right: 8px !important;
    padding-top: 12px !important;
    padding-bottom: 8px !important;
  }

  /* 通用卡片（左/右主卡）内边距从 24px 降到 12px */
  .p-6 { padding: 12px !important; }

  /* 图表容器（覆盖模板里的 p-4）进一步收紧 */
  .fc-chart-container { padding: 8px !important; }
}

/* ==== 公告栏样式与位移变量 ==== */
:root {
  --announce-offset: 0px; /* 公告栏高度（显示时写入） */
}

body {
  padding-top: var(--announce-offset); /* 推动整体内容下移 */
}

/* 顶部固定元素改为跟随公告偏移 */
#sidebar-toggle { top: calc(10px + var(--announce-offset)); }
.fc-theme-toggle { top: calc(10px + var(--announce-offset)); }

/* 右上 info 按钮包裹容器 */
.fc-info-btn-wrap {
  position: fixed;
  top: calc(20px + var(--announce-offset));
  right: 100px;
  z-index: 1000;
}

/* 公告栏 */
.fc-announce {
  position: fixed;
  top: 0; left: 0; right: 0;
  padding-left: 10px;
  padding-right: 5px;
  z-index: 200;
  background: var(--bg-secondary);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border-color);
  font-size: 15px;
  line-height: 1.4;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 6px var(--shadow-color);
}
.fc-announce.hidden { display: none; }

.fc-announce-inner {
  position: relative;
  flex: 1;
  overflow: hidden;
  text-align: center; 
}

.fc-announce-roller {
  position: relative;
  will-change: transform;
}

/* 每条公告文本占一行，便于垂直堆叠滑动 */
.fc-announce-roller > .fc-announce-text {
  display: block;
  margin: 0;
  padding: 0;
}

/* 切换时添加该类，控制过渡曲线与时长（可调） */
.fc-announce-roller.is-sliding {
  transition: transform var(--announce-slide-duration, .38s) cubic-bezier(.22,.7,.26,1);
}

/* 系统开启“减少动态效果”时关闭切换过渡 */
@media (prefers-reduced-motion: reduce) {
  .fc-announce-roller.is-sliding { transition: none !important; }
}

.fc-announce-text {
  display: inline-block;
  white-space: nowrap;
  will-change: transform;
  transition: transform .35s ease;
  /* 初始不滚动 */
}

.fc-announce-close {
  background: transparent;
  border: none;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 4px 6px;
  color: var(--text-secondary);
  transition: color .2s;
}
.fc-announce-close:hover {
  color: var(--text-primary);
}

/* 悬停跑马灯时添加类 */
.fc-announce-text.is-marquee {
  transition: none; /* 改用动画帧驱动 */
}

/* 触摸拖动（添加时可有反馈，非必需） */
.fc-announce-text.dragging {
  cursor: grabbing;
}
/* =========================================================
   迷你雷达卡片系统 (Mini Radar Card System)
   ========================================================= */

/* Card wrapper */
.fc-mini-radar-card {
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--bg-secondary);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Header spans the full card width (not compressed by quick-add column) */
.fc-card-header {
  padding: 5px 8px 0;
  /* single-line, left-priority */
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  margin-bottom: 3px;
  gap: 0;
  min-height: 20px;
}

/* Body row: radar SVG + optional quick-add column */
.fc-mini-radar-body-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
}

/* Legacy inner/content wrappers — kept for any residual markup */
.fc-mini-radar-card-inner {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.fc-mini-radar-card-content {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/*
 * Left: brand + model + price — higher priority.
 * Uses flex: 0 1 auto (shrink-to-content) so the background only covers
 * the actual text width, not the full remaining row width.  max-width: 80%
 * ensures the left side doesn't completely crowd out the right-side text.
 * Works correctly in both light and dark themes without any JS measurement.
 */
.fc-card-header-left {
  position: relative;
  flex: 0 1 auto;
  max-width: 80%;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
  font-size: 14px;
  z-index: 2;
  /* Solid background shields right text that bleeds under this element */
  background: var(--bg-secondary);
}

/* Soft right-edge fade on the left element — fades the last ~28 px */
.fc-card-header-left::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0; right: 0;
  width: 8px;
  /* Fade from card background to itself-transparent; the card background is
     always a near-neutral color so the gradient looks correct in both themes. */
  background: linear-gradient(to right, transparent 0%, var(--bg-secondary) 100%);
  pointer-events: none;
}

/* Right: RPM + size — lower priority, positioned absolutely behind left */
.fc-card-header-right {
  position: absolute;
  right: 8px; top: 0; bottom: 0;
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-size: 0.75rem;
  color: var(--text-secondary);
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  text-overflow: clip;
}

/* Mini radar body: relative for thumb overlays.
   Height raised to 130px to match the "按型号添加" container baseline (131px),
   ensuring the SVG renders at a comparable scale in sidebar cards. */
.fc-mini-radar-body {
  --mini-radar-h: 130px;
  position: relative;
  height: var(--mini-radar-h);
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* SVG canvas: reproduces `preserveAspectRatio="xMidYMid meet"` in CSS so the
   rendered SVG box has no letterbox padding.
   width = min(container width, height * 300/120) keeps it inside the body on
   both axes; aspect-ratio then derives the height.  Because the box matches the
   viewBox exactly, the thumb buttons' percentage offsets are pixel-accurate
   without any JS measurement. */
.fc-mini-radar-canvas {
  position: relative;
  width: min(100%, calc(var(--mini-radar-h) * 300 / 120));
  aspect-ratio: 300 / 120;
  flex: 0 0 auto;
}

/* Let edge labels paint into the extra body width while keeping the canvas box
   ratio-locked for thumb positioning stability during sidebar resizes. */
.fc-mini-radar-canvas .fc-radar-svg {
  overflow: visible;
}

/* Part 1: Sidebar radar condition labels must match the "按型号添加" mini-radar
   baseline. The base SVG font-sizes are used (same viewBox 300×120), so the
   visual size matches at equivalent container widths. */
.fc-mini-radar-body .fc-radar-lbl       { font-size: 13px; }
.fc-mini-radar-body .fc-radar-score-lbl { font-size: 12px; }
.fc-mini-radar-body .fc-radar-center-lbl--bold { font-size: 13px; }

/* Like thumb buttons: absolutely positioned over the mini radar canvas.
   Slightly smaller than PR 318 (24×24, font-size 13px) for a less
   oversized appearance while remaining tappable. The canvas box matches the
   SVG viewBox exactly, so the percentage offsets need no JS correction. */
.fc-radar-thumb-btn {
  position: absolute;
  transform: translate(-50%, -50%);
  background: var(--radar-lbl-inactive-bg, #e5e7eb);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  z-index: 10;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: #9ca3af;
  user-select: none;
  transition: color .18s ease, box-shadow .18s ease, opacity .2s ease, transform .2s ease;
}
.fc-radar-thumb-btn:hover {
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.30);
}
.fc-radar-thumb-btn:focus { outline: none; }
[data-theme="dark"] .fc-radar-thumb-btn {
  background: #374151;
  color: #6b7280;
}

/* Quick-add column: right side of body row, vertically centered. */
.fc-mini-radar-add-col {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
}

.fc-mini-radar-add-col-lighting-like {
  position: absolute;
  top: 0.5px;
  left: 0;
}

/* =========================================================
   Radar Toggle Button — reusable flat-top hexagon add/remove button
   Two states driven by data-state="add" (default) / data-state="added"
   ========================================================= */

/* Button shell */
.fc-radar-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 24px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.fc-radar-toggle-btn:focus { outline: none; }
.fc-radar-toggle-btn:focus-visible {
  outline: 2px solid var(--fc-color-primary);
  outline-offset: 2px;
  border-radius: 2px;
}

/* SVG container with subtle depth shadow */
.fc-radar-toggle-svg {
  display: block;
  width: 28px;
  height: 24px;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.20));
}

/* Hexagon fill — green (add state) */
.fc-radar-toggle-bg {
  fill: var(--fc-color-success);
  transition: fill 0.18s;
}
/* Added state: red hexagon */
.fc-radar-toggle-btn[data-state="added"] .fc-radar-toggle-bg {
  fill: var(--fc-color-danger);
}
/* Hover / active — add state */
.fc-radar-toggle-btn:hover  .fc-radar-toggle-bg { fill: var(--fc-color-success-hover); }
.fc-radar-toggle-btn:active .fc-radar-toggle-bg { fill: var(--fc-color-success-active); }
/* Hover / active — added state */
.fc-radar-toggle-btn[data-state="added"]:hover  .fc-radar-toggle-bg { fill: var(--fc-color-danger-hover); }
.fc-radar-toggle-btn[data-state="added"]:active .fc-radar-toggle-bg { fill: var(--fc-color-danger-active); }

/* Icon bars: pseudo-transparent (painted in card background color) */
.fc-radar-toggle-bar { fill: var(--bg-secondary); }

/* Icon group: rotates 0° (shows +) in add state, 45° (shows ×) in added state.
   transform-box: fill-box makes transform-origin relative to the element bounds. */
.fc-radar-toggle-icon {
  transform-box: fill-box;
  transform-origin: center;
  transform: rotate(0deg);
  transition: transform 0.20s ease;
}
.fc-radar-toggle-btn[data-state="added"] .fc-radar-toggle-icon {
  transform: rotate(45deg);
}


/* Sidebar card list spacing */
#recentlyRemovedList .fc-mini-radar-card,
#recentLikesList .fc-mini-radar-card {
  margin-bottom: 6px;
  /* Perf: keep每张卡片的布局/绘制自包含，并让离屏卡片完全跳过渲染。
     没有这两条时，侧栏里几十张迷你雷达卡（每张 ~40 个 SVG 盒子）会全部
     参与文档级重排；拖动拟合指针 / 侧栏分隔条时每帧的强制同步布局都会
     乘上这些盒子，导致明显掉帧。
     contain-intrinsic-size 给出占位高度（header ~26px + body 130px + 边框），
     避免滚动条在跳过渲染时抖动；auto 关键字让浏览器记住实测尺寸。 */
  contain: content;
  content-visibility: auto;
  contain-intrinsic-size: auto 158px;
}

/* =========================================================
   Card header CSS mask — generalized priority layout
   ========================================================= */
.fc-mini-radar-card .fc-card-header .fc-card-header-left {
  z-index: 2;
}

/* =========================================================
   雷达操作栏 (Radar Actions Bar) — Part 7: centered, inside radarOverviewPanel
   ========================================================= */
.fc-radar-actions-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 8px 6px;
  /* Push to the bottom of radar-overview-content (flex column) */
  margin-top: auto;
  width: 100%;
  flex-wrap: wrap;
  flex-shrink: 0;
}

.fc-radar-actions-trigger {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: 3px 8px;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
}
.fc-radar-actions-trigger:hover {
  color: var(--fc-color-danger);
  border-color: var(--fc-color-danger);
}
.fc-radar-actions-trigger.active {
  color: var(--fc-color-danger);
  border-color: var(--fc-color-danger);
}

.fc-radar-actions-expanded {
  display: flex;
  align-items: center;
  gap: 6px;
}
.fc-radar-actions-expanded[hidden] { display: none !important; }

.fc-radar-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: 3px 8px;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
  white-space: nowrap;
}
.fc-radar-action-btn:hover {
  color: var(--fc-color-danger);
  border-color: var(--fc-color-danger);
  background: rgba(220,38,38,0.05);
}
/* 取消工况激活 uses blue hover in expanded state */
#clearRadarConds:hover {
  color: var(--fc-color-primary);
  border-color: var(--fc-color-primary);
  background: rgba(37,99,235,0.05);
}

/* 重置配色 uses accent/teal hover in expanded state */
.fc-radar-action-btn--color:hover {
  color: var(--fc-color-accent, #0d9488);
  border-color: var(--fc-color-accent, #0d9488);
  background: rgba(13,148,136,0.06);
}

/* Browsing history card adjustments - same as recently removed */
#top-panel #recentlyRemovedList .fc-mini-radar-card {
  display: flex;
}

/* ---- 天梯图弹层 (fc-ladder-*) ---- */
.fc-ladder-panel {
  width: min(648px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
}

.fc-ladder-body {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: auto;
  padding: 0;
  min-height: 0;
  box-sizing: border-box;
}

.fc-ladder-body-inner {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 12px 16px;
  box-sizing: border-box;
}

.fc-ladder-content-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.fc-ladder-modal-note {
  font-size: 11px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin: 0 0 10px;
}

#ladderCanvasWrap {
  width: 100%;
  max-width: 600px;
  min-width: 0;
  margin: 0 auto;
  box-sizing: border-box;
}

#ladderCanvas {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.fc-ladder-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-top: 1px solid var(--border-color);
  flex-shrink: 0;
}

.fc-ladder-download-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--fc-color-primary, #3b82f6);
  background: transparent;
  color: var(--fc-color-primary, #3b82f6);
  font-size: 12px;
  cursor: pointer;
  padding: 4px 10px;
  border-radius: 4px;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.fc-ladder-download-btn:hover {
  background: var(--fc-color-primary, #3b82f6);
  color: #fff;
}
.fc-ladder-download-btn:focus-visible {
  outline: 2px solid var(--fc-color-primary, #3b82f6);
  outline-offset: 2px;
}

.fc-ladder-update-hint {
  font-size: 11px;
  color: var(--text-secondary);
}

/* ---- Narrow-screen modal optimisation ---- */
/* Reduces lateral whitespace in both the ladder and score-rule modals on
   small viewports so the canvas / table fills the available width and the
   scrollbar sits close to the panel edge. */
@media (max-width: 680px) {
  .fc-sr-modal {
    padding: 12px;
  }

  .fc-ladder-panel {
    width: min(648px, calc(100vw - 24px));
  }

  .fc-sr-panel,
  .fc-ladder-panel {
    max-width: calc(100vw - 24px);
  }

  .fc-sr-body-inner,
  .fc-ladder-body-inner {
    padding-left: 12px;
    padding-right: 12px;
  }

  .fc-ladder-footer {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* ================================================================
   fc-model-detail — neutral model detail panel component
   Used by model-detail-panel.js; shared between right-panel and
   chart extra review area.
   ================================================================ */

.fc-model-detail {
  /* Base container; no fixed width/height — consumers control sizing */
}

/* Top section: photo (optional) + attrs side-by-side */
.fc-model-detail__top {
  display: grid;
  grid-template-columns: minmax(88px, 34%) minmax(0, 1fr);
  gap: 10px;
}

/* Photo box */
.fc-model-detail__photo {
  background: var(--bg-secondary, #fff);
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  min-height: 88px;
}
[data-theme="dark"] .fc-model-detail__photo {
  background: #202b39;
  border-color: #374151;
}
.fc-model-detail__photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
  font-size: 13px;
}
.fc-model-detail__photo-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Attributes table */
.fc-model-detail__attrs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  min-width: 0;
}
.fc-model-detail__attr-row {
  display: grid;
  grid-template-columns: 94px 1fr;
  gap: 6px;
  align-items: center;
  font-size: 13px;
}
.fc-model-detail__attr-key {
  color: var(--text-secondary, #6b7280);
  white-space: nowrap;
}
.fc-model-detail__attr-val {
  color: var(--text-primary, #374151);
  min-width: 0;
}
[data-theme="dark"] .fc-model-detail__attr-val { color: #d1d5db; }
.fc-model-detail__empty { color: #9ca3af; }

/* Color chips */
.fc-model-detail__color-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.fc-model-detail__color-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.12);
  padding: 1px 7px 1px 5px;
  white-space: nowrap;
}
.fc-model-detail__color-chip-text {
  font-size: 13px;
  color: var(--text-primary, #374151);
}
[data-theme="dark"] .fc-model-detail__color-chip-text { color: #e5e7eb; }
/* Color swatch size within fc-model-detail (shares fc-color-swatch base styles) */
.fc-model-detail__color-swatch {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

/* Purchase section */
.fc-model-detail__purchase {
  margin-top: 10px;
  border-top: 1px dashed #d1d5db;
  padding-top: 8px;
}
[data-theme="dark"] .fc-model-detail__purchase { border-top-color: #4b5563; }
.fc-model-detail__purchase-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary, #6b7280);
  margin-bottom: 3px;
}
.fc-model-detail__purchase-empty {
  font-size: 13px;
  color: #9ca3af;
}
.fc-model-detail__purchase-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fc-model-detail__purchase-link {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 4px 6px;
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #f8fafc;
  color: var(--text-primary, #1f2937);
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.fc-model-detail__purchase-link:hover {
  background: #f1f5f9;
  border-color: #bfdbfe;
  transform: translateY(-1px);
}
.fc-model-detail__purchase-link:focus-visible {
  outline: 2px solid #60a5fa;
  outline-offset: 2px;
}
.fc-model-detail__purchase-link-text {
  min-width: 0;
  font-size: 13px;
  line-height: 1.4;
}
.fc-model-detail__purchase-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  flex-shrink: 0;
  color: #fff;
}
.fc-model-detail__purchase-badge.is-jd { background: #E6162D; }
.fc-model-detail__purchase-badge.is-taobao { background: #FF4400; }
.fc-model-detail__purchase-badge.is-pdd { background: #E4393C; }
.fc-model-detail__purchase-badge.is-other { background: #64748b; }
[data-theme="dark"] .fc-model-detail__purchase-link {
  background: rgba(30, 41, 59, 0.75);
  border-color: #334155;
  color: #e5e7eb;
}
[data-theme="dark"] .fc-model-detail__purchase-link:hover {
  background: rgba(30, 41, 59, 0.95);
  border-color: #60a5fa;
}

/* ----------------------------------------------------------------
   extra-panel-model-detail — model detail panel inside chart extra
   review section (no photo; purchase section shown below attrs).
   ---------------------------------------------------------------- */
.extra-panel-model-detail {
  flex: 0 0 auto;
  overflow: hidden;
  margin-bottom: 4px;
}
.extra-panel-model-detail .fc-model-detail__purchase-list {
  max-height: 120px;
  overflow-y: auto;
  min-height: 0;
  padding: 2px;
}
.extra-panel-model-detail:empty {
  display: none;
}
.extra-panel-model-detail .fc-model-detail__top {
  grid-template-columns: minmax(0, 1fr);
}
.extra-panel-model-detail .fc-model-detail__photo {
  display: none;
}

.fc-chart-container.is-narrow .extra-panel-model-detail {
  max-width: 100%;
}
.fc-chart-container.is-narrow .extra-panel-model-detail .fc-model-detail__top {
  grid-template-columns: minmax(88px, 34%) minmax(0, 1fr);
}
.fc-chart-container.is-narrow .extra-panel-model-detail .fc-model-detail__photo {
  display: block;
}

/* ----------------------------------------------------------------
   反馈问题 — issue feedback feature
   ---------------------------------------------------------------- */

/* Subtitle row: "测试点评" label + "反馈问题" button side by side */
.extra-panel-review-subtitle-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.extra-panel-review-subtitle-row .extra-panel-review-subtitle {
  margin-bottom: 0;
}

/* "反馈问题" open button */
.fc-feedback-open-btn {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font-size: 11px;
  line-height: 1.5;
  border-radius: 4px;
  border: 1px solid var(--fc-color-primary, #3b82f6);
  color: var(--fc-color-primary, #3b82f6);
  background: transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, color .15s;
  flex-shrink: 0;
}
.fc-feedback-open-btn:hover {
  background: var(--fc-color-primary, #3b82f6);
  color: #fff;
}

/* Feedback modal panel width */
.fc-feedback-panel {
  width: min(480px, 96vw);
}

/* Disclaimer text */
.fc-feedback-disclaimer {
  color: var(--text-secondary);
  font-weight: 700;
  font-size: 13px;
}

/* Model name display at top of submit pane */
.fc-feedback-model-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 10px;
}

/* Options list */
.fc-feedback-options-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}
.fc-feedback-option-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--text-primary);
  cursor: pointer;
  user-select: none;
}
.fc-feedback-option-label:hover {
  color: var(--fc-color-primary, #3b82f6);
}
.fc-feedback-option-cb {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: var(--fc-color-primary, #3b82f6);
}

/* "其他" text input */
.fc-feedback-other-wrap {
  margin-bottom: 10px;
}
.fc-feedback-other-input {
  width: 100%;
  padding: 6px 10px;
  font-size: 13px;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--bg-primary);
  color: var(--text-primary);
  outline: none;
  box-sizing: border-box;
  transition: border-color .15s;
}
.fc-feedback-other-input:focus {
  border-color: var(--fc-color-primary, #3b82f6);
}

/* Action row */
.fc-feedback-actions {
  margin-top: 4px;
}
.fc-feedback-submit-btn {
  min-width: 90px;
}

/* Submit result message */
.fc-feedback-msg {
  margin-top: 8px;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 6px;
}
.fc-feedback-msg--success {
  color: var(--fc-color-success, #16a34a);
  background: rgba(22,163,74,.08);
}
.fc-feedback-msg--error {
  color: var(--fc-color-danger, #dc2626);
  background: rgba(220,38,38,.08);
}
.fc-feedback-msg--info {
  color: var(--text-secondary);
}

/* My Feedback tab */
.fc-feedback-my-empty {
  font-size: 13px;
  color: var(--text-secondary);
  padding: 20px 0;
  text-align: center;
}
.fc-feedback-my-group {
  margin-bottom: 14px;
}
.fc-feedback-my-group-header {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-color);
}
.fc-feedback-my-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-size: 13px;
  color: var(--text-primary);
  transition: opacity .3s;
}
.fc-feedback-my-row--revoked {
  opacity: 0;
}
.fc-feedback-my-label {
  flex: 1;
  min-width: 0;
  word-break: break-all;
}
.fc-feedback-revoke-btn {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background: transparent;
  color: var(--text-secondary);
  font-size: 14px;
  cursor: pointer;
  line-height: 1;
  transition: background .15s, color .15s, border-color .15s;
}
.fc-feedback-revoke-btn:hover {
  background: var(--fc-color-danger, #dc2626);
  border-color: var(--fc-color-danger, #dc2626);
  color: #fff;
}
.fc-feedback-revoke-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

/* Carry over the border-top rule for the new row wrapper */
.extra-panel-model-detail:not(:empty) + .extra-panel-review-subtitle-row {
  border-top: 2px solid var(--border-color);
  padding-top: 6px;
}

/* Reset subtitle margin when inside the flex row — row handles spacing */
.extra-panel-review-subtitle-row .extra-panel-review-subtitle {
  margin: 0;
}

.fc-review-inline-jump {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--fc-color-primary, #2563eb);
  font: inherit;
  font-weight: 600;
  line-height: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.fc-review-inline-jump:hover {
  color: #1d4ed8;
}

.fc-review-inline-jump:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 2px;
  border-radius: 2px;
}

/* =========================================================
   资源下载 (File Share) — Sidebar tab
   ========================================================= */

/* Container for file share list */
.fc-file-share-list {
  flex: 1 1 auto;
  min-height: 0;
}

/* Category header row */
.fc-file-share-category {
  margin-bottom: 6px;
}

.fc-file-share-category-header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 4px;
  cursor: pointer;
  user-select: none;
  font-weight: 600;
  font-size: 13px;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border-color);
  margin-bottom: 4px;
}

.fc-file-share-category-header:hover {
  color: var(--text);
}

.fc-file-share-category-chevron {
  font-size: 11px;
  transition: transform .2s;
  flex-shrink: 0;
}

.fc-file-share-category.is-collapsed .fc-file-share-category-chevron {
  transform: rotate(-90deg);
}

.fc-file-share-category-items {
  overflow: hidden;
}

.fc-file-share-category.is-collapsed .fc-file-share-category-items {
  display: none;
}

/* File item card */
.fc-file-share-card {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  background: var(--bg-secondary);
  overflow: hidden;
  margin-bottom: 6px;
  min-height: 64px;
}

.fc-file-share-card-thumb {
  flex: 0 0 128px;
  width: 128px;
  height: 128px;
  background: var(--bg-tertiary, #f3f4f6);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  overflow: hidden;
  flex-shrink: 0;
}

.fc-file-share-card-thumb img {
  width: 128px;
  height: 128px;
  object-fit: cover;
  display: block;
}

.fc-file-share-card-thumb-placeholder {
  font-size: 24px;
  color: var(--text-secondary);
  opacity: .4;
}

.fc-file-share-card-body {
  flex: 1 1 auto;
  min-width: 0;
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.fc-file-share-card-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
}

.fc-file-share-card-desc {
  font-size: 12px;
  color: var(--text-secondary);
  overflow: hidden;
  white-space: pre-wrap;
  flex: 1 1 auto;
  min-height: 0;
}

.fc-file-share-card-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 4px;
}

.fc-file-share-download-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--border-color);
  color: var(--text-secondary);
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, color .15s, border-color .15s;
}

.fc-file-share-download-btn:hover {
  background: var(--fc-color-primary, #2563eb);
  border-color: var(--fc-color-primary, #2563eb);
  color: #fff;
}

/* File-share specific lightbox (shares the same #galleryLightbox overlay) */