/* ============================================================
   components.css — 护妍 v4.0 「L'Atelier」 · 组件层
   锐角 · 发丝线 · 墨块按钮 · 排印徽章
   ============================================================ */

/* ═══════════ 按钮 · Editorial Buttons ═══════════ */
.c-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 30px;
  font-size: var(--fs-2xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  border-radius: var(--r-pill);
  transition: color var(--dur-ui) var(--ease-soft), border-color var(--dur-ui) var(--ease-soft),
              background-color var(--dur-ui) var(--ease-soft), transform var(--dur-ui) var(--ease-soft);
  overflow: hidden;
  white-space: nowrap;
}

/* 主按钮：墨块 + 金色扫过 */
.c-btn--primary {
  background: var(--bg-ink);
  color: var(--on-ink);
}
.c-btn--primary::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--gold-deep);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.5s var(--ease-out);
}
.c-btn--primary > * { position: relative; z-index: 1; }
.c-btn--primary:hover::before { transform: scaleX(1); }
.c-btn--primary:disabled { opacity: 0.45; pointer-events: none; }

/* 次按钮：发丝线描边 */
.c-btn--secondary {
  border: 1px solid var(--line);
  color: var(--ink-2);
  background: transparent;
}
.c-btn--secondary:hover {
  border-color: var(--gold);
  color: var(--gold-deep);
}
.c-btn--secondary:disabled { opacity: 0.45; pointer-events: none; }

/* 幽灵按钮：下划线文字 */
.c-btn--ghost {
  padding: 13px 6px;
  color: var(--ink-3);
}
.c-btn--ghost::after {
  content: '';
  position: absolute;
  left: 6px;
  right: 6px;
  bottom: 8px;
  height: 1px;
  background: currentColor;
  opacity: 0.4;
  transform: scaleX(1);
  transform-origin: left;
  transition: transform 0.4s var(--ease-out), opacity var(--dur-ui) var(--ease-soft);
}
.c-btn--ghost:hover { color: var(--ink); }
.c-btn--ghost:hover::after { opacity: 1; }

.c-btn--sm { padding: 9px 18px; font-size: 10px; }
.c-btn--xs { padding: 7px 14px; font-size: 9px; letter-spacing: 0.16em; }

/* 箭头符号（文字级） */
.c-btn-arrow {
  display: inline-block;
  transition: transform 0.4s var(--ease-out);
  font-family: var(--font-body);
}
.c-btn:hover .c-btn-arrow { transform: translateX(5px); }

/* ═══════════ 卡片 · Solid Ivory Panel ═══════════ */
.c-card {
  background: var(--bg-card);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  padding: var(--sp-8);
  position: relative;
  transition: border-color var(--dur-ui) var(--ease-soft), box-shadow var(--dur-ui) var(--ease-soft),
              transform var(--dur-ui) var(--ease-soft);
}
.c-card:hover { border-color: var(--line); box-shadow: var(--sh-soft); }

.c-card__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
  padding-bottom: var(--sp-4);
  border-bottom: 1px solid var(--line-faint);
}
.c-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 600;
  letter-spacing: 0.01em;
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.c-card__title::before {
  content: '';
  width: 18px;
  height: 1px;
  background: var(--gold);
  align-self: center;
  flex-shrink: 0;
}

/* ═══════════ 徽章 · Typographic Badges ═══════════ */
.c-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  border-radius: var(--r-pill);
  border: 1px solid var(--line);
  color: var(--ink-2);
  background: transparent;
  white-space: nowrap;
}
.c-badge--muted { color: var(--ink-3); border-color: var(--line-soft); }
.c-badge--safe { color: var(--safe); border-color: var(--safe-line); background: var(--safe-bg); }
.c-badge--warn { color: var(--warn); border-color: var(--warn-line); background: var(--warn-bg); }
.c-badge--danger { color: var(--danger); border-color: var(--danger-line); background: var(--danger-bg); }
.c-badge--ai { color: var(--ai); border-color: var(--ai-line); background: var(--ai-bg); }
.c-badge--lg { padding: 7px 14px; font-size: var(--fs-2xs); }

/* ═══════════ 表单 · Hairline Fields ═══════════ */
.c-label {
  display: block;
  font-size: var(--fs-2xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-3);
  margin-bottom: var(--sp-3);
}

.c-input, .c-textarea, .c-select {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 12px 2px;
  font-size: var(--fs-md);
  color: var(--ink);
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-input::placeholder, .c-textarea::placeholder { color: var(--ink-4); }
.c-input:focus, .c-textarea:focus, .c-select:focus {
  outline: none;
  border-bottom-color: var(--gold);
}

.c-textarea {
  border: 1px solid var(--line-soft);
  background: var(--bg-card-hi);
  padding: var(--sp-4);
  border-radius: var(--r);
  line-height: var(--lh-body);
  resize: vertical;
  min-height: 96px;
}
.c-textarea:focus { border-color: var(--gold-line); }

.c-select {
  appearance: none;
  border: 1px solid var(--line-soft);
  border-radius: var(--r);
  padding: 8px 30px 8px 12px;
  font-size: var(--fs-xs);
  background: var(--bg-card-hi) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%237C7263'/%3E%3C/svg%3E") no-repeat right 12px center;
  cursor: var(--cursor-magnifier);
}

.c-input-group {
  display: flex;
  gap: var(--sp-4);
  align-items: flex-end;
}
.c-input-group .c-input { flex: 1; }

.c-form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  margin-top: var(--sp-4);
}
.c-form-actions { display: flex; align-items: center; gap: var(--sp-3); }
.c-counter {
  font-family: var(--font-mono);
  font-size: var(--fs-2xs);
  color: var(--ink-4);
  letter-spacing: 0.06em;
}
.c-hint {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  line-height: 1.6;
  margin-top: var(--sp-3);
}

/* ═══════════ 案例芯片 · Text Chips ═══════════ */
.c-chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2);
  margin-top: var(--sp-5);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--line-faint);
}
.c-chips-title {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-4);
  margin-right: var(--sp-2);
}
.c-chip {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  color: var(--ink-2);
  cursor: var(--cursor-magnifier);
  transition: all var(--dur-ui) var(--ease-soft);
}
.c-chip:hover {
  border-color: var(--gold);
  color: var(--gold-deep);
  background: var(--gold-soft);
}

/* ═══════════ 拖拽上传 · Hairline Dropzone ═══════════ */
.c-dropzone {
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  padding: var(--sp-16) var(--sp-8);
  text-align: center;
  cursor: var(--cursor-magnifier);
  transition: border-color var(--dur-ui) var(--ease-soft), background-color var(--dur-ui) var(--ease-soft);
  position: relative;
}
.c-dropzone::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 1px solid var(--line-faint);
  border-radius: var(--r);
  pointer-events: none;
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-dropzone:hover, .c-dropzone.is-dragover {
  border-color: var(--gold);
  background: var(--gold-soft);
}
.c-dropzone:hover::before, .c-dropzone.is-dragover::before { border-color: var(--gold-line); }
.c-dropzone__text {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  color: var(--ink);
  margin-bottom: var(--sp-2);
}
.c-dropzone__hint {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  letter-spacing: 0.04em;
}

.c-upload-info {
  display: flex;
  justify-content: space-between;
  margin-top: var(--sp-3);
  font-size: var(--fs-xs);
  color: var(--ink-3);
}

.c-thumb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: var(--sp-3);
  margin-top: var(--sp-4);
}
.c-thumb-item {
  position: relative;
  aspect-ratio: 1;
  border: 1px solid var(--line-soft);
  border-radius: var(--r);
  overflow: hidden;
}
.c-thumb-item img { width: 100%; height: 100%; object-fit: cover; }
.c-thumb-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-ink);
  color: var(--on-ink);
  font-size: 12px;
  line-height: 1;
  border-radius: var(--r-sm);
  cursor: var(--cursor-magnifier);
  opacity: 0;
  transition: opacity var(--dur-micro) var(--ease-soft);
}
.c-thumb-item:hover .c-thumb-remove { opacity: 1; }

/* ═══════════ 加载 · Pipeline Stages ═══════════ */
.c-loading {
  margin-top: var(--sp-8);
  padding: var(--sp-12);
  text-align: center;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  background: var(--bg-card);
}
.c-loading__spinner {
  position: relative;
  width: 44px;
  height: 44px;
  margin: 0 auto var(--sp-5);
}
.c-loading__spinner::before,
.c-loading__spinner::after {
  content: "";
  position: absolute;
  border-radius: 50px;
  box-shadow: 0 0 0 2px inset var(--gold);
  animation: u-orbit 2.5s infinite;
}
.c-loading__spinner::after {
  box-shadow: 0 0 0 2px inset var(--ink-4);
  animation-delay: -1.25s;
}
@keyframes u-orbit {
  0%    { inset: 0 24px 24px 0; }
  12.5% { inset: 0 24px 0 0; }
  25%   { inset: 24px 24px 0 0; }
  37.5% { inset: 24px 0 0 0; }
  50%   { inset: 24px 0 0 24px; }
  62.5% { inset: 0 0 0 24px; }
  75%   { inset: 0 0 24px 24px; }
  87.5% { inset: 0 0 24px 0; }
  100%  { inset: 0 24px 24px 0; }
}
@media (prefers-reduced-motion: reduce) {
  .c-loading__spinner::before,
  .c-loading__spinner::after { animation: none; inset: 0; }
  .c-loading__spinner::after { inset: 12px; }
}
.c-loading__title {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  margin-bottom: var(--sp-1);
}
.c-loading__sub {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  letter-spacing: var(--ls-caps-soft);
  text-transform: uppercase;
  margin-bottom: var(--sp-6);
}

.c-stages {
  list-style: none;
  max-width: 520px;
  margin: 0 auto;
  text-align: left;
}
.c-stage-item {
  display: flex;
  align-items: baseline;
  gap: var(--sp-4);
  padding: 10px 2px;
  border-bottom: 1px solid var(--line-faint);
  color: var(--ink-4);
  font-size: var(--fs-sm);
  transition: color var(--dur-ui) var(--ease-soft);
}
.c-stage-num {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--ink-4);
  transition: color var(--dur-ui) var(--ease-soft);
}
.c-stage-item.is-active { color: var(--ink); }
.c-stage-item.is-active .c-stage-num { color: var(--gold-deep); }
.c-stage-item.is-done { color: var(--ink-3); }
.c-stage-item.is-done .c-stage-num { color: var(--safe); }
.c-stage-item .c-stage-tag { margin-left: auto; }

/* ═══════════ 错误与预览 ═══════════ */
.c-errorbox {
  display: none;
  margin-top: var(--sp-6);
  padding: var(--sp-5) var(--sp-6);
  border-left: 2px solid var(--danger);
  background: var(--danger-bg);
  border-radius: var(--r);
}
.c-errorbox.is-show { display: block; }
.c-errorbox p { color: var(--danger); font-size: var(--fs-sm); }

.c-urlprev {
  display: none;
  margin-top: var(--sp-5);
  padding: var(--sp-5);
  border: 1px solid var(--line-soft);
  border-left: 2px solid var(--gold);
  border-radius: var(--r);
  background: var(--bg-card-hi);
}
.c-urlprev.is-show { display: block; }
.c-urlprev__title {
  font-family: var(--font-display);
  font-size: var(--fs-md);
  margin-bottom: var(--sp-2);
}
.c-urlprev__body {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  max-height: 140px;
  overflow: auto;
  margin-top: var(--sp-2);
  white-space: pre-wrap;
}

/* ═══════════ 折叠面板 · Plus/Minus ═══════════ */
.c-collapse-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-4) 0;
  font-size: var(--fs-2xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-2);
  cursor: var(--cursor-magnifier);
}
.c-collapse-sign {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: 400;
  color: var(--gold-deep);
  line-height: 1;
  transition: transform 0.4s var(--ease-out);
}
.c-collapse-panel.is-open .c-collapse-sign { transform: rotate(45deg); }
.c-collapse-body {
  display: none;
  padding-top: var(--sp-4);
}
.c-collapse-panel.is-open .c-collapse-body { display: block; }

/* ═══════════ 裁决横幅 · Verdict Banner ═══════════ */
.c-verdict {
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  background: var(--bg-card);
  padding: var(--sp-10);
  margin-bottom: var(--sp-6);
  position: relative;
  overflow: hidden;
}
.c-verdict::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--gold);
}
.c-verdict--safe::before { background: var(--safe); }
.c-verdict--warn::before { background: var(--warn); }
.c-verdict--danger::before { background: var(--danger); }
.c-verdict--ai::before { background: var(--ai); }

.v-gaugehead {
  display: flex;
  align-items: center;
  gap: var(--sp-10);
  flex-wrap: wrap;
}
.c-gauge-wrap { position: relative; width: 132px; height: 132px; flex-shrink: 0; }
.c-gauge { width: 132px; height: 132px; transform: rotate(-90deg); }
.c-gauge__track { fill: none; stroke: var(--line-soft); stroke-width: 2; }
.c-gauge__fill {
  fill: none;
  stroke: var(--gold);
  stroke-width: 2;
  stroke-linecap: round;
  transition: stroke 0.4s var(--ease-soft);
}
.c-verdict--safe .c-gauge__fill { stroke: var(--safe); }
.c-verdict--danger .c-gauge__fill { stroke: var(--danger); }
.c-verdict--warn .c-gauge__fill { stroke: var(--warn); }
.c-verdict--ai .c-gauge__fill { stroke: var(--ai); }
.c-gauge__val {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.c-gauge__val span {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 500;
  color: var(--ink);
  line-height: 1;
}
.c-gauge__val small {
  font-size: 9px;
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--ink-4);
  margin-top: 6px;
}

.v-gaugehead__meta { flex: 1; min-width: 280px; }
.v-verdict-title {
  font-size: var(--fs-4xl);
  font-weight: 500;
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-tight);
  margin-bottom: var(--sp-3);
}
.v-verdict-summary {
  margin-top: var(--sp-4);
  font-size: var(--fs-md);
  color: var(--ink-2);
  max-width: 70ch;
}
.v-meta-list {
  display: flex;
  gap: var(--sp-8);
  margin-top: var(--sp-5);
  flex-wrap: wrap;
}
.v-meta-list div { display: flex; align-items: baseline; gap: 8px; }
.v-meta-list dt {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-4);
}
.v-meta-list dd { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--ink-2); }

/* ═══════════ 专家矩阵 ═══════════ */
.c-expert-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-4);
}
.c-expert-card {
  border: 1px solid var(--line-soft);
  border-radius: var(--r);
  padding: var(--sp-5);
  background: var(--bg-card-hi);
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-expert-card:hover { border-color: var(--gold-line); }
.c-expert-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-bottom: var(--sp-3);
  flex-wrap: wrap;
}
.c-expert-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--ink);
}
.c-expert-num {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-sm);
  color: var(--gold-deep);
}
.c-expert-opinion {
  font-size: var(--fs-sm);
  color: var(--ink-2);
  line-height: 1.65;
}
.c-expert-findings {
  list-style: none;
  margin-top: var(--sp-3);
  padding-top: var(--sp-3);
  border-top: 1px solid var(--line-faint);
}
.c-expert-findings li {
  font-size: var(--fs-xs);
  color: var(--ink-3);
  padding: 3px 0 3px 14px;
  position: relative;
}
.c-expert-findings li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 11px;
  width: 6px;
  height: 1px;
  background: var(--gold);
}

/* ═══════════ 疑点 / 发现 / 建议列表 ═══════════ */
.c-point-list, .c-finding-list, .c-rec-list { list-style: none; }
.c-point-item, .c-finding-item {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
  padding: 11px 2px;
  border-bottom: 1px solid var(--line-faint);
  font-size: var(--fs-sm);
  color: var(--ink-2);
}
.c-point-item:last-child, .c-finding-item:last-child, .c-rec-item:last-child { border-bottom: none; }
.c-point-mark, .c-finding-mark {
  width: 6px;
  height: 6px;
  flex-shrink: 0;
  transform: rotate(45deg) translateY(-1px);
  background: var(--warn);
}
.c-point-mark--safe { background: var(--safe); }
.c-point-mark--danger { background: var(--danger); }
.c-point-mark--warn { background: var(--warn); }
.c-finding-mark { background: var(--gold); }

.c-rec-item {
  display: flex;
  align-items: baseline;
  gap: var(--sp-4);
  padding: 11px 2px;
  border-bottom: 1px solid var(--line-faint);
  font-size: var(--fs-sm);
  color: var(--ink-2);
}
.c-rec-num {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--gold-deep);
  letter-spacing: 0.1em;
  flex-shrink: 0;
}

/* ═══════════ 断言证据链 ═══════════ */
.c-claim-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.c-claim-item {
  border: 1px solid var(--line-soft);
  border-radius: var(--r);
  padding: var(--sp-4) var(--sp-5);
  background: var(--bg-card-hi);
  cursor: var(--cursor-magnifier);
  transition: border-color var(--dur-ui) var(--ease-soft), background-color var(--dur-ui) var(--ease-soft);
}
.c-claim-item:hover { border-color: var(--line); }
.c-claim-item.is-selected { border-color: var(--gold); background: var(--gold-soft); }
.c-claim-header {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-2);
  flex-wrap: wrap;
}
.c-claim-text {
  font-family: var(--font-display);
  font-size: var(--fs-md);
  color: var(--ink);
  line-height: 1.5;
}
.c-claim-reason {
  margin-top: var(--sp-2);
  font-size: var(--fs-xs);
  color: var(--ink-3);
  line-height: 1.6;
}
.c-claim-citation {
  display: block;
  font-size: var(--fs-xs);
  color: var(--ink-3);
  padding-left: 14px;
  border-left: 1px solid var(--gold-line);
  line-height: 1.6;
}
.c-claim-citation strong { color: var(--gold-deep); font-weight: 600; }

/* ═══════════ 正文高亮标注 ═══════════ */
.c-hlview {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  line-height: 2.1;
  color: var(--ink-2);
  letter-spacing: 0.01em;
}
.c-hl-tag {
  background: transparent;
  padding: 2px 0;
  margin: 0 1px;
  cursor: var(--cursor-magnifier);
  border-bottom: 1px solid;
  transition: background-color var(--dur-ui) var(--ease-soft);
}
.c-hl-tag--violation, .c-hl-tag--refuted { color: var(--danger); border-color: var(--danger-line); }
.c-hl-tag--violation:hover, .c-hl-tag--refuted:hover { background: var(--danger-bg); }
.c-hl-tag--warn, .c-hl-tag--exaggerated, .c-hl-tag--suspicious { color: var(--warn); border-color: var(--warn-line); }
.c-hl-tag--warn:hover { background: var(--warn-bg); }
.c-hl-tag--safe, .c-hl-tag--confirmed { color: var(--safe); border-color: var(--safe-line); }
.c-hl-tag--safe:hover { background: var(--safe-bg); }
.c-hl-tag--ai, .c-hl-tag--unverifiable { color: var(--ai); border-color: var(--ai-line); }
.c-hl-tag--ai:hover { background: var(--ai-bg); }

/* ═══════════ ELA 卷帘对比器 ═══════════ */
.c-ela-compare {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: var(--r-card);
  min-height: 320px;
  cursor: col-resize;
  user-select: none;
  background: var(--bg-ink);
}
.c-ela-img { width: 100%; height: 100%; object-fit: cover; }
.c-ela-layer-top {
  position: absolute;
  inset: 0 auto 0 0;
  overflow: hidden;
  border-right: 1px solid var(--gold);
}
.c-ela-layer-top .c-ela-img { position: absolute; inset: 0; }
.c-ela-label {
  position: absolute;
  bottom: 12px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--on-ink);
  background: rgba(22, 18, 12, 0.6);
  padding: 4px 10px;
  border-radius: var(--r-pill);
  pointer-events: none;
}
.c-ela-label-left { left: 12px; }
.c-ela-label-right { right: 12px; }
.c-ela-slider-handle {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--gold);
  transform: translateX(-50%);
  pointer-events: none;
}
.c-ela-grip {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid var(--gold);
  background: var(--bg-ink);
}
.c-ela-grip::before, .c-ela-grip::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 5px;
  height: 1px;
  background: var(--gold);
}
.c-ela-grip::before { left: 9px; }
.c-ela-grip::after { right: 9px; }

/* ═══════════ 推理链路 ═══════════ */
.c-reasoning-panel {
  margin-top: var(--sp-4);
  padding: var(--sp-4);
  border: 1px solid var(--line-soft);
  border-radius: var(--r);
  background: var(--bg-ink);
  color: var(--on-ink-2);
  font-size: var(--fs-xs);
  line-height: 1.8;
  white-space: pre-wrap;
  max-height: 420px;
  overflow: auto;
}

/* ═══════════ 时间线 · Hairline Rail ═══════════ */
.c-timeline-list {
  list-style: none;
  position: relative;
  padding-left: var(--sp-6);
}
.c-timeline-list::before {
  content: '';
  position: absolute;
  left: 3px;
  top: 6px;
  bottom: 6px;
  width: 1px;
  background: var(--line-soft);
}
.c-tl-item {
  position: relative;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-4);
  padding: 10px 0;
}
.c-tl-item::before {
  content: '';
  position: absolute;
  left: calc(-1 * var(--sp-6) + 1px);
  top: 18px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 3px var(--bg-card);
}
.c-tl-title { font-size: var(--fs-sm); font-weight: 600; color: var(--ink); }
.c-tl-summary { font-size: var(--fs-xs); color: var(--ink-3); margin-left: var(--sp-3); }
.c-tl-time { font-family: var(--font-mono); font-size: 10px; color: var(--ink-4); letter-spacing: 0.08em; flex-shrink: 0; }

/* ═══════════ 悬浮操作坞 · Dock ═══════════ */
.c-dock {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: var(--sp-6);
  z-index: var(--z-dock);
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  background: var(--bg-veil);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-pill);
  box-shadow: var(--sh-float);
  padding: var(--sp-2) var(--sp-5);
}

/* ═══════════ KPI 与大屏 ═══════════ */
.c-kpi-row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--sp-4);
  margin-bottom: var(--sp-6);
}
.c-kpi { padding: var(--sp-5) var(--sp-5) var(--sp-4); }
.c-kpi__label {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-3);
  margin-bottom: var(--sp-3);
}
.c-kpi__value {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 500;
  color: var(--ink);
  line-height: 1;
  letter-spacing: var(--ls-tight);
}
.c-kpi__value small { font-size: 0.5em; color: var(--ink-4); }

.c-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--sp-6);
}
.c-chart-card { grid-column: span 4; }
.c-chart-card--wide { grid-column: span 8; }
.c-chart-wrap { height: 280px; position: relative; }

/* ═══════════ 表格 · Editorial Table ═══════════ */
.c-table-wrap { overflow-x: auto; }
.c-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}
.c-table th {
  text-align: left;
  font-size: var(--fs-2xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-3);
  padding: 10px var(--sp-4) 10px 2px;
  border-bottom: 1px solid var(--line);
}
.c-table td {
  padding: 12px var(--sp-4) 12px 2px;
  border-bottom: 1px solid var(--line-faint);
  color: var(--ink-2);
  vertical-align: middle;
}
.c-table tbody tr { transition: background-color var(--dur-micro) var(--ease-soft); }
.c-table tbody tr:hover { background: var(--gold-soft); }

/* ═══════════ 指令面板 · Command Palette (L'Index · v4.3 脱框编辑风)
   无描边、无图标盒：象牙纸面 + 柔影浮层，层级由排印、发丝线与
   香槟金悬停承担，与全站「脱卡化」编辑语言保持一致 ═══════════ */
.c-cmd-modal {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 2100);
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh var(--sp-6) var(--sp-6);
  background: rgba(22, 18, 12, 0.38);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.c-cmd-modal.is-open { display: flex; }
.c-cmd-box {
  width: min(680px, 100%);
  background: var(--bg-card-hi, #FFFEFA);
  border: none;
  border-radius: 14px;
  box-shadow: 0 24px 80px rgba(22, 18, 12, 0.22), 0 2px 10px rgba(22, 18, 12, 0.05);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  will-change: transform, opacity;
}
.c-cmd-header {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  padding: 22px 28px 18px;
  border-bottom: 1px solid var(--line-faint);
  background: transparent;
}
.c-cmd-input {
  flex: 1;
  border: none;
  background: transparent;
  font-family: var(--font-display), var(--font-body), sans-serif;
  font-size: var(--fs-lg);
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--ink);
  outline: none;
  padding: 2px 0;
}
.c-cmd-input::placeholder {
  font-family: var(--font-display);
  font-style: italic;
  color: var(--ink-4);
}
/* 面板内 ESC：去框排印化（仅作用于面板，不影响导航全局 .c-kbd） */
.c-cmd-close {
  border: none;
  background: transparent;
  padding: 0;
  color: var(--ink-4);
  letter-spacing: 0.14em;
  transition: color var(--dur-micro) var(--ease-soft);
}
.c-cmd-close:hover { color: var(--gold-deep); }
.c-cmd-list {
  list-style: none;
  max-height: 380px;
  overflow-y: auto;
  padding: 10px 14px 14px;
  overscroll-behavior: contain;
}
.c-cmd-group-title {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 12px 8px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--gold-deep);
}
.c-cmd-group-title::before {
  content: '';
  width: 18px;
  height: 1px;
  background: var(--gold);
  opacity: 0.7;
  flex: none;
}
.c-cmd-item {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  padding: 11px 12px;
  border-radius: 8px;
  cursor: var(--cursor-magnifier);
  transition: background-color var(--dur-micro) var(--ease-soft),
              transform var(--dur-micro) var(--ease-soft);
}
.c-cmd-item__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.c-cmd-item__title {
  font-family: var(--font-display);
  font-size: var(--fs-md);
  font-weight: 600;
  color: var(--ink);
  letter-spacing: 0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color var(--dur-micro) var(--ease-soft);
}
.c-cmd-item__sub {
  font-size: 11px;
  color: var(--ink-3);
  letter-spacing: 0.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.c-cmd-item__meta {
  flex: none;
  display: flex;
  align-items: center;
}
/* 回车提示：无框字符，默认隐入，悬停/选中时金色浮现 */
.c-cmd-action-key {
  font-size: 14px;
  line-height: 1;
  color: var(--gold-deep);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity var(--dur-micro) var(--ease-soft),
              transform var(--dur-micro) var(--ease-soft);
}
.c-cmd-item.is-active,
.c-cmd-item:hover { background: var(--gold-soft); }
.c-cmd-item.is-active .c-cmd-item__title,
.c-cmd-item:hover .c-cmd-item__title { color: var(--gold-deep); }
.c-cmd-item.is-active .c-cmd-action-key,
.c-cmd-item:hover .c-cmd-action-key {
  opacity: 1;
  transform: translateX(0);
}
.c-cmd-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  row-gap: 6px;
  gap: var(--sp-4);
  padding: 12px 28px 16px;
  border-top: 1px solid var(--line-faint);
  background: transparent;
  font-size: 11px;
  color: var(--ink-3);
}
.c-cmd-tips {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
}
/* 底部键位：去框，纯排印提示 */
.c-cmd-tip kbd {
  font-family: var(--font-mono);
  font-size: 10px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--ink-2);
  margin-right: 4px;
}
.c-cmd-brand {
  font-size: 10px;
  letter-spacing: var(--ls-caps);
  color: var(--gold-deep);
  white-space: nowrap;
}
.c-cmd-empty {
  padding: var(--sp-8) var(--sp-5);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.c-cmd-empty__icon {
  font-size: var(--fs-2xl);
  font-weight: 300;
  color: var(--ink-4);
}
.c-cmd-empty__text {
  font-size: var(--fs-sm);
  color: var(--ink-2);
}
.c-cmd-empty__hint {
  font-size: 10px;
  letter-spacing: var(--ls-caps);
  color: var(--ink-4);
}

/* ═══════════ 脱卡化 · Transparent Editorial Sections (v4.2) ═══════════
   视图级容器去面去框，内容直接坐在象牙画布上；
   层级由区首发丝线与留白承担。保留交互面：裁决横幅、加载卡、
   错误框、指令面板、操作坞、ELA 媒体框、深色推理面板 */

#view-results .c-card,
#view-text .c-card,
#view-image .c-card,
#view-dashboard .c-card,
#view-about .c-card {
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}
#view-results .c-card:hover,
#view-text .c-card:hover,
#view-image .c-card:hover,
#view-dashboard .c-card:hover,
#view-about .c-card:hover { box-shadow: none; }

/* 区首：发丝顶线 + 小大写标签，编辑式分节 */
#view-results .c-card__header,
#view-dashboard .c-card__header {
  border-top: 1px solid var(--line-soft);
  padding-top: var(--sp-5);
  margin-bottom: var(--sp-6);
}

/* 裸区间距放开，呼吸感优先 */
#view-results .grid-12 { gap: var(--sp-12) var(--sp-6); }
#view-image .grid-12 { gap: var(--sp-10); }

/* 专家卡去小盒：以发丝顶线分节，hover 金线 */
.c-expert-card {
  background: transparent;
  border: none;
  border-radius: 0;
  border-top: 1px solid var(--line-soft);
  padding: var(--sp-4) 0 var(--sp-2);
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-expert-card:hover { border-top-color: var(--gold-line); }

/* 断言条目：透明底，线框只作为可点 affordance */
.c-claim-item { background: transparent; }

/* KPI：编辑式统计条 —— 顶发丝 + 衬线大数字 */
.c-kpi {
  background: transparent;
  border: none;
  border-radius: 0;
  border-top: 1px solid var(--line-soft);
  padding: var(--sp-4) var(--sp-3) 0 0;
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-kpi:hover { border-top-color: var(--gold-line); box-shadow: none; }

/* 大屏控制条：上下发丝界定 */
#view-dashboard .v-dashbar {
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
  padding: var(--sp-4) var(--sp-2);
  margin-bottom: var(--sp-10);
}

/* 关于页特色卡：区首发丝 */
#view-about .c-card {
  border-top: 1px solid var(--line-soft);
  padding-top: var(--sp-5);
}
#view-about .c-card:hover { border-color: var(--line); }

/* 文本视图：脱盒后补回垂直节奏 */
#view-text .v-split__main .c-card + .c-card { margin-top: var(--sp-8); }
#view-text .v-split__main .c-card { padding-bottom: var(--sp-2); }

/* ═══════════ 2.0 鲁班升级 · 高定组件体系 ═══════════ */

/* ── 1. 即时悬浮安全胶囊 (Floating Safety Capsule) ── */
.c-safety-capsule {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 950;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  pointer-events: auto;
}
.c-safety-capsule__pill {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px 8px 14px;
  background: var(--bg-card-hi);
  border: 1px solid var(--gold-line);
  border-radius: var(--r-pill);
  box-shadow: 0 8px 30px rgba(22, 18, 12, 0.12), 0 2px 6px rgba(168, 140, 85, 0.2);
  cursor: pointer;
  user-select: none;
  transition: transform 0.26s var(--ease-soft), box-shadow 0.26s var(--ease-soft), border-color 0.2s ease;
}
.c-safety-capsule__pill:hover {
  transform: translateY(-2px) scale(1.02);
  border-color: var(--gold);
  box-shadow: 0 12px 36px rgba(168, 140, 85, 0.25);
}
.c-safety-capsule__lamp {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 2px rgba(168, 140, 85, 0.25);
  animation: pulse-lamp 2.4s infinite ease-in-out;
}
.c-safety-capsule__pill.is-safe .c-safety-capsule__lamp { background: var(--safe); box-shadow: 0 0 0 2px var(--safe-line); }
.c-safety-capsule__pill.is-warn .c-safety-capsule__lamp { background: var(--warn); box-shadow: 0 0 0 2px var(--warn-line); }
.c-safety-capsule__pill.is-danger .c-safety-capsule__lamp { background: var(--danger); box-shadow: 0 0 0 2px var(--danger-line); }
.c-safety-capsule__pill.is-ai .c-safety-capsule__lamp { background: var(--ai); box-shadow: 0 0 0 2px var(--ai-line); }

@keyframes pulse-lamp {
  0%, 100% { transform: scale(1); opacity: 0.85; }
  50% { transform: scale(1.3); opacity: 1; filter: drop-shadow(0 0 4px currentColor); }
}

.c-safety-capsule__label {
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: var(--ls-caps);
  color: var(--ink);
}
.c-safety-capsule__conf {
  font-size: 11px;
  color: var(--gold-deep);
  font-weight: 500;
}
.c-safety-capsule__drawer {
  width: 320px;
  background: var(--bg-card-hi);
  border: 1px solid var(--gold-line);
  border-radius: var(--r-card);
  box-shadow: var(--sh-float);
  padding: var(--sp-4);
  animation: fadeInDown 0.24s var(--ease-soft);
}
.c-safety-capsule__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--sp-2);
  padding-bottom: var(--sp-2);
  border-bottom: 1px solid var(--line-soft);
}
.c-safety-capsule__dtitle {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ink);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
}
.c-safety-capsule__close {
  background: none;
  border: none;
  font-size: 18px;
  color: var(--ink-3);
  cursor: pointer;
}
.c-safety-capsule__summary {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  line-height: 1.5;
  margin-bottom: var(--sp-3);
}
.c-safety-capsule__tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: var(--sp-3);
}
.c-safety-capsule__footer {
  display: flex;
  justify-content: flex-end;
}

/* ── 2. Miro 全景视觉证据板 (Evidence Board) ── */
.c-board-container {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: var(--sp-2) 0;
  -webkit-overflow-scrolling: touch;
}
.c-board-wrap {
  position: relative;
  min-width: 1020px;
  background: transparent;
  border: none;
  overflow: hidden;
}
.c-board-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--line-faint);
  background: transparent;
}
.c-board-toolbar__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ink);
  letter-spacing: var(--ls-caps);
}
.c-board-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
}
.c-board-canvas {
  position: relative;
  padding: var(--sp-6) 0 var(--sp-2);
}
.c-board-cables {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
.c-board-lanes {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
}
.c-board-lane {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.c-board-lane__head {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-3);
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line-soft);
}
.c-board-lane__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.c-board-node {
  background: transparent;
  border: none;
  border-top: 1px solid var(--line-soft);
  border-radius: 0;
  padding: 10px 2px 2px;
  transition: transform 0.24s var(--ease-soft), border-color 0.24s var(--ease-soft), opacity 0.2s ease;
  cursor: pointer;
}
.c-board-node:hover {
  transform: translateY(-1px);
  border-top-color: var(--gold-line);
}
.c-board-node.is-active-conn {
  border-top-color: var(--gold);
  opacity: 1 !important;
}
.c-board-node.is-dimmed {
  opacity: 0.25;
}
.c-board-node__header {
  margin-bottom: 6px;
}
.c-board-node__tag {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  padding: 2px 8px;
  border-radius: var(--r-pill);
}
.c-board-node__title {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
  margin-bottom: 4px;
}
.c-board-node__sub {
  font-size: 11px;
  color: var(--ink-3);
  line-height: 1.3;
}
.c-board-cable {
  transition: stroke 0.2s ease, stroke-width 0.2s ease;
}
.c-board-cable.is-active-cable {
  filter: drop-shadow(0 0 3px rgba(168, 140, 85, 0.8));
}

/* ── 3. 不确定性警告 (Uncertainty Box) ── */
.c-card--uncertainty {
  border: none;
  background: transparent;
}
.c-uncertainty-pulsar {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--warn);
  box-shadow: 0 0 0 2px var(--warn-line);
}
.c-uncertainty-guide {
  font-size: var(--fs-sm);
  color: var(--ink-2);
  margin-bottom: var(--sp-4);
  line-height: 1.6;
}
.c-uncertainty-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0 28px;
}
.c-uncertainty-item {
  background: transparent;
  border: none;
  border-top: 1px solid var(--line-soft);
  border-radius: 0;
  padding: 12px 0 4px;
  margin-top: 14px;
}
.c-uncertainty-item__header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.c-uncertainty-item__title {
  font-size: var(--fs-xs);
  color: var(--ink);
}
.c-uncertainty-item__msg {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  line-height: 1.45;
  margin-bottom: 8px;
}
.c-uncertainty-item__action {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--gold-deep);
  font-weight: 500;
  line-height: 1.35;
}

/* ── 4. 三级违规体系与一键改写 (Tiered Violations & Smart Rewriter) ── */
.c-tiered-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.c-tiered-card {
  background: transparent;
  border: none;
  border-top: 2px solid var(--line-soft);
  border-radius: 0;
  padding: var(--sp-4) 0 var(--sp-1);
  transition: border-color var(--dur-ui) var(--ease-soft);
}
.c-tiered-card:hover {
  border-top-color: var(--gold-line);
}
.c-tiered-card--tier1 { border-top-color: rgba(168, 64, 47, 0.55); }
.c-tiered-card--tier2 { border-top-color: rgba(162, 112, 31, 0.55); }
.c-tiered-card--tier3 { border-top-color: rgba(124, 84, 148, 0.5); }

.c-tiered-card__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.c-tiered-card__rule {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--ink);
}
.c-tiered-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.c-tiered-card__orig, .c-tiered-card__basis {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  line-height: 1.5;
}
.c-hl-matched {
  background: transparent;
  color: var(--danger);
  padding: 0;
  border-bottom: 1px solid var(--danger-line);
  font-weight: 600;
}
.c-label-gold {
  color: var(--gold-deep);
  font-weight: 600;
}
.c-tiered-card__rewrite {
  margin-top: 10px;
  background: transparent;
  border: none;
  border-left: 1px solid var(--gold-line);
  border-radius: 0;
  padding: 2px 0 2px 16px;
}
.c-rewrite-text {
  font-size: var(--fs-sm);
  color: var(--ink);
  line-height: 1.6;
  font-weight: 500;
}

/* ── 5. C2PA & INCI 卡片 ── */
.c-c2pa-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.c-c2pa-evidence-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.c-c2pa-evidence-list li {
  font-size: var(--fs-xs);
  color: var(--ink-2);
  position: relative;
  padding-left: 14px;
}
.c-c2pa-evidence-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 6px;
  height: 1px;
  background: var(--gold);
}
.c-inci-item {
  background: transparent;
  border: none;
  border-top: 1px solid var(--line-soft);
  border-radius: 0;
  padding: 12px 0 4px;
  margin-bottom: 14px;
}
.c-inci-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* ═══════════ S4b 庭审记录 · Trial Record (Editorial) ═══════════
   象牙卷宗 + 香槟金发丝线：延续全站编辑风语言，以字排层级构建庭审仪式感 */
.c-card--trial {
  border-top: 2px solid var(--gold);
  background: var(--bg-card);
}

.c-trial__header { border-bottom: 1px solid var(--gold-line); }
.c-trial__heading { display: flex; flex-direction: column; gap: 6px; }
.c-trial__sub {
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps-soft);
  color: var(--gold-deep);
}

/* ── 判决横幅 · Verdict Spread ── */
.c-trial-gavel {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
  padding: var(--sp-6);
  border: 1px solid var(--gold-line);
  background:
    linear-gradient(135deg, var(--gold-soft) 0%, rgba(168, 140, 85, 0.03) 60%),
    var(--bg-card-hi);
  margin-bottom: var(--sp-8);
  flex-wrap: wrap;
}
.c-trial-gavel__avatar {
  width: 64px;
  height: 80px;
  flex: none;
  object-fit: cover;
  object-position: center 22%;
  filter: grayscale(0.35) sepia(0.10) contrast(1.02);
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  border: 1px solid var(--gold-line);
  padding: 3px;
  background: var(--bg-card);
}
.c-trial-gavel__body { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 220px; }
.c-trial-gavel__label {
  font-size: var(--fs-2xs);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--gold-deep);
}
.c-trial-gavel__verdict {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: var(--lh-heading);
  color: var(--ink);
}
.c-trial-gavel__verdict em { color: var(--gold-deep); }
.c-trial-gavel__en {
  color: var(--ink-3);
  font-size: var(--fs-2xs);
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

/* 置信度 · 细金线度量 */
.c-trial-gavel__conf {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 148px;
  flex: none;
}
.c-trial-gavel__confnum {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 500;
  line-height: 1;
  color: var(--gold-deep);
}
.c-trial-gavel__confnum small {
  font-size: var(--fs-sm);
  color: var(--ink-3);
  margin-left: 2px;
}
.c-trial-confbar {
  height: 1px;
  background: var(--line-soft);
  position: relative;
}
.c-trial-confbar i {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  background: linear-gradient(90deg, var(--gold), var(--gold-deep));
  transition: width 1.1s var(--ease-out);
}
.c-trial-gavel__conflabel {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--ink-3);
}

/* ── 指控条目 · Counts ── */
.c-trial-list { display: flex; flex-direction: column; gap: var(--sp-5); }

.c-trial-count {
  border: 1px solid var(--line-soft);
  background: var(--bg-card-hi);
  transition: border-color var(--dur-ui) var(--ease-soft),
              box-shadow var(--dur-ui) var(--ease-soft);
}
.c-trial-count:hover {
  border-color: var(--gold-line);
  box-shadow: var(--sh-soft);
}
.c-trial-count__head {
  display: flex;
  align-items: baseline;
  gap: var(--sp-4);
  padding: var(--sp-4) var(--sp-5);
  border-bottom: 1px solid var(--line-faint);
}
.c-trial-count__num {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-2xl);
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px var(--gold);
  flex: none;
  transform: translateY(2px);
}
.c-trial-count__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.c-trial-count__id {
  color: var(--gold-deep);
  font-size: var(--fs-2xs);
  letter-spacing: 0.12em;
}
.c-trial-count__charge {
  font-family: var(--font-display);
  font-size: var(--fs-md);
  font-weight: 600;
  color: var(--ink);
  letter-spacing: 0.01em;
}

/* ── 对峙席 · The Duel ── */
.c-trial-duel { position: relative; display: grid; grid-template-columns: 1fr 1fr; }
.c-trial-duel::before {
  content: '';
  position: absolute;
  top: 14px; bottom: 14px; left: 50%;
  width: 1px;
  background: linear-gradient(180deg,
    transparent 0%, var(--gold-line) 14%,
    var(--gold-line) 86%, transparent 100%);
  pointer-events: none;
}
.c-trial-vs {
  position: absolute;
  top: 8px; left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-xs);
  letter-spacing: 0.08em;
  color: var(--gold-deep);
  background: var(--bg-card-hi);
  padding: 1px 12px;
  z-index: 1;
}
.c-trial-speech { padding: var(--sp-5); }
.c-trial-speech--pros { padding-right: calc(var(--sp-5) + 10px); }
.c-trial-speech--def  { padding-left: calc(var(--sp-5) + 10px); }
.c-trial-speech__who {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: var(--sp-3);
}
.c-trial-speech img {
  width: 36px; height: 36px;
  border-radius: 50%;
  flex: none;
  object-fit: cover;
  object-position: center 20%;
  filter: grayscale(0.35) sepia(0.08);
  border: 1px solid var(--line-soft);
  transition: filter var(--dur-ui) var(--ease-soft),
              border-color var(--dur-ui) var(--ease-soft),
              transform var(--dur-ui) var(--ease-soft);
}
.c-trial-speech:hover img {
  filter: grayscale(0.05) sepia(0.02);
  border-color: var(--gold-line);
  transform: scale(1.06);
}
.c-trial-role {
  display: block;
  color: var(--ink-3);
  font-size: var(--fs-2xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}
.c-trial-speech--pros .c-trial-role { color: var(--danger); }
.c-trial-speech--def .c-trial-role { color: var(--safe); }
.c-trial-speech p, .c-trial-ruling p {
  font-size: var(--fs-sm);
  color: var(--ink-2);
  line-height: 1.75;
  margin: 0;
}

/* ── 法官裁定 · Ruling ── */
.c-trial-ruling {
  padding: var(--sp-4) var(--sp-5);
  border-top: 1px dashed var(--gold-line);
  background: var(--bg-subtle);
  display: flex;
  gap: var(--sp-4);
  align-items: baseline;
}
.c-trial-ruling .c-trial-role {
  flex: none;
  color: var(--gold-deep);
}
.c-trial-ruling p { font-style: italic; }

/* ── 庭审结语 · Editorial Pull Quote ── */
.c-trial-proceedings {
  margin: var(--sp-6) 0 0;
  padding: var(--sp-5) var(--sp-6);
  border-left: 2px solid var(--gold);
  background: var(--gold-soft);
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-lg);
  line-height: 1.8;
  color: var(--ink-2);
}

/* ═══════════ 响应式 ═══════════ */
@media (max-width: 1120px) {
  .c-kpi-row { grid-template-columns: repeat(3, 1fr); }
  .c-chart-card, .c-chart-card--wide { grid-column: span 12; }
  .c-expert-grid { grid-template-columns: 1fr; }
  .c-safety-capsule { bottom: 18px; right: 18px; }
}
@media (max-width: 720px) {
  .c-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .c-card { padding: var(--sp-6); }
  .c-verdict { padding: var(--sp-6); }
  .c-dock { width: calc(100vw - 32px); justify-content: center; flex-wrap: wrap; }
  .c-trial-duel { grid-template-columns: 1fr; }
  .c-trial-duel::before { display: none; }
  .c-trial-speech--pros { order: 1; padding-right: var(--sp-5); }
  .c-trial-vs {
    position: static;
    transform: none;
    order: 2;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 2px var(--sp-5);
    background: transparent;
  }
  .c-trial-vs::before, .c-trial-vs::after { content: ''; flex: 1; height: 1px; }
  .c-trial-vs::before { background: linear-gradient(90deg, transparent, var(--gold-line)); }
  .c-trial-vs::after  { background: linear-gradient(270deg, transparent, var(--gold-line)); }
  .c-trial-speech--def { order: 3; padding-left: var(--sp-5); }
  .c-trial-count__head { flex-wrap: wrap; }
  .c-trial-gavel { padding: var(--sp-5); }
  .c-trial-gavel__conf { min-width: 100%; }
}

