/* 彩色类型人物与判准封面：与既有视觉层同层，避免 unlayered important 被旧书法标题覆盖。 */
@layer debater-visual-system {
.jpc-cover-wrap {
  --jpc-surface: var(--ft-bg-card, #302723);
  --jpc-text: var(--ft-text-primary, #f4e8da);
  --jpc-muted: var(--ft-text-secondary, #cbbcad);
  --jpc-line: var(--ft-border, #59483e);
  --jpc-accent: var(--ft-claret, #dd9077);
  --jpc-serif: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'STSong', 'SimSun', serif;
  min-width: 0;
}
html body .jpc-cover-wrap > .jpc-cover {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr) !important;
  align-items: center !important;
  gap: 24px 44px !important;
  width: 100% !important;
  min-height: 420px !important;
  margin: 0 0 24px !important;
  padding: 38px 44px !important;
  border: 1px solid var(--jpc-line) !important;
  border-radius: 18px !important;
  background: var(--jpc-surface) !important;
  color: var(--jpc-text) !important;
  box-shadow: none !important;
  overflow: hidden;
  text-align: left !important;
}
.jpc-cover-wrap .jpc-cover *, .jpc-cover-wrap .jpc-cover *::before, .jpc-cover-wrap .jpc-cover *::after { box-sizing: border-box; }
html body .jpc-cover-wrap .jpc-cover :is(.hero-copy, .jpc-cover-copy) {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important;
  grid-column: 1; grid-row: 1; min-width: 0 !important; padding: 0 !important; gap: 0;
}
html body .jpc-cover-wrap .jpc-cover :is(.hero-aside, .quick-type-visual) {
  display: flex !important; align-items: center !important; justify-content: center !important;
  grid-column: 2; grid-row: 1; order: 0 !important; min-width: 0 !important;
  width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important;
}
html body .jpc-cover-wrap .jpc-cover :is(.single-portrait, .tendency-card) {
  min-width: 0; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
}
html body .jpc-cover-wrap .jpc-cover :is(.type-portrait, .quick-type-portrait) {
  width: 100% !important; max-width: 390px !important; height: 370px !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 14px !important;
  background: transparent !important; box-shadow: none !important; overflow: hidden;
}
html body .jpc-cover-wrap .jpc-cover :is(.type-portrait, .quick-type-portrait) img {
  display: block !important; width: 100% !important; height: 100% !important; object-fit: contain !important;
  filter: none !important; opacity: 1 !important; mix-blend-mode: normal !important; border-radius: 14px !important;
}
html body .jpc-cover-wrap .jpc-cover :is(h1, #profile-title) {
  margin: 14px 0 14px !important; color: var(--jpc-text) !important;
  font-family: var(--jpc-serif) !important; font-size: clamp(42px, 4.8vw, 68px) !important;
  line-height: 1.2 !important; font-weight: 700 !important; letter-spacing: .02em !important; overflow-wrap: anywhere;
}
html body .jpc-cover-wrap .jpc-cover :is(h1, #profile-title).dual-title { font-size: clamp(30px, 3.2vw, 44px) !important; }
html body .jpc-cover-wrap .jpc-cover :is(h1, #profile-title).dual-title > span { display: block !important; font-size: .72em !important; margin-top: 12px; }
html body .jpc-cover-wrap .jpc-cover :is(.hero-kicker, .eyebrow) {
  margin: 0 0 12px !important; color: var(--jpc-accent) !important; font-size: 12px !important; line-height: 1.6 !important; letter-spacing: .08em;
}
html body .jpc-cover-wrap .jpc-cover .public-user {
  display: flex !important; align-items: center !important; flex-wrap: wrap; gap: 10px !important;
  padding: 0 !important; margin: 0 0 12px !important; border: 0 !important; text-align: left !important; min-width: 0;
}
html body .jpc-cover-wrap .jpc-cover .public-user > img { width: 38px !important; height: 38px !important; border-radius: 50%; object-fit: cover; }
html body .jpc-cover-wrap .jpc-cover .public-user > div > span { color: var(--jpc-text) !important; font-size: 16px !important; font-weight: 650; }
html body .jpc-cover-wrap .jpc-cover .public-user small { display: block; margin-top: 3px; font-size: 12px !important; line-height: 1.6; color: var(--jpc-muted) !important; }
html body .jpc-cover-wrap .jpc-cover .full-label { margin: 0 0 12px !important; font-size: 14px !important; line-height: 1.8 !important; color: var(--jpc-muted) !important; }
html body .jpc-cover-wrap .jpc-cover :is(.full-label, .type-seal, .public-user, .eyebrow, .hero-kicker) { font-family: var(--ft-font-sans, 'Microsoft YaHei', sans-serif) !important; }
html body .jpc-cover-wrap .jpc-cover :is(.seal-row, .type-seal) { margin: 0 !important; }
html body .jpc-cover-wrap .jpc-cover .type-seal { display: inline-flex; padding: 4px 9px !important; font-size: 12px !important; line-height: 1.5; border: 1px solid var(--jpc-line) !important; color: var(--jpc-muted) !important; background: transparent !important; }
html body .jpc-cover-wrap .jpc-cover :is(.rep-chip, .tendency-label, .single-portrait > span) { display: none !important; }
html body .jpc-cover-wrap .jpc-cover :is(.jp-reading-lede, .jpc-cover-meaning, blockquote) {
  margin: 8px 0 0 !important; padding: 16px 0 0 !important; max-width: 34em;
  border: 0 !important; border-top: 1px solid var(--jpc-line) !important; color: var(--jpc-text) !important;
  font-family: var(--jpc-serif) !important; font-size: 22px !important; line-height: 1.75 !important; font-weight: 500 !important;
}
html body .jpc-cover-wrap .jpc-cover .dual-portraits { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; width: 100%; gap: 16px !important; }
html body .jpc-cover-wrap .jpc-cover .dual-portraits .type-portrait { height: 270px !important; max-width: none !important; }
html body .jpc-cover-wrap .jpc-cover .tendency-card > span { display: block; font-size: 12px !important; line-height: 1.6; color: var(--jpc-muted) !important; }
html body .jpc-cover-wrap .jpc-cover .tendency-card > strong { display: block; margin-top: 10px; font: 700 23px/1.45 var(--jpc-serif) !important; color: var(--jpc-text) !important; }
html body .jpc-cover-wrap .jpc-cover .tendency-card > small { display: block; font-size: 12px !important; line-height: 1.7; color: var(--jpc-muted) !important; }
html body .jpc-cover-wrap .jpc-cover .portrait-fallback { width: 100% !important; min-height: 240px; display: grid; place-items: center; color: var(--jpc-accent); background: transparent !important; font: 700 64px var(--jpc-serif); }
html body .jpc-cover-wrap .jpc-cover-quick :is(h1, #profile-title) { font-size: clamp(26px, 3vw, 38px) !important; line-height: 1.5 !important; margin: 12px 0 !important; }
.jpc-direction-badge { display: inline-block; padding: 4px 10px; border-radius: 4px; background: var(--ft-claret-tint, rgba(190, 115, 87, .12)); color: var(--jpc-accent); font-size: 13px; line-height: 1.5; font-weight: 650; }
html body .jpc-cover-wrap .jpc-cover .provisional-note { display: block !important; margin: 10px 0 0 !important; color: var(--jpc-accent) !important; font-size: 14px !important; line-height: 1.8 !important; }
html body .jpc-cover-wrap .jpc-cover-copy > p:not(.eyebrow):not(.provisional-note) { font-size: 13px !important; line-height: 1.8 !important; color: var(--jpc-muted) !important; }
html body .jpc-cover-wrap .jpc-cover .hero-actions { display: flex !important; flex-wrap: wrap; gap: 10px; margin-top: 18px !important; width: 100%; }
html body .jpc-cover-wrap .jpc-cover .hero-actions > * { max-width: 100%; white-space: normal !important; min-height: 44px; }
.jpc-cover-wrap .jpc-cover-explanation { padding: 24px 0; margin: 0 0 24px; border-bottom: 1px solid var(--jpc-line); color: var(--jpc-text); }
.jpc-cover-explanation > h2 { margin: 0 0 12px; font: 700 26px/1.5 var(--jpc-serif); }
.jpc-cover-explanation .style-commentary { font-size: 16px; line-height: 1.9; color: var(--jpc-muted); }
.jpc-cover-explanation .hero-insights { margin-top: 20px; }
html body .jpc-cover-wrap.jp-reading .jp-reading-layout { grid-template-columns: 220px minmax(0, 1fr) !important; }
html body .jpc-cover-wrap.jp-reading .jp-reading-rail-inner { padding: 22px 18px !important; }
html body .jpc-cover-wrap.jp-reading .jp-reading-toc { margin-top: 0 !important; }
html body .jpc-cover-wrap.jp-reading .jp-reading-intro { margin-bottom: 12px !important; }
html body .jpc-cover-wrap.jp-reading-quick .jp-reading-intro .jpc-quick-repeat { display: none !important; }
app-criteria-list #profile-panel .jpc-directory-note { margin: 4px 0 14px !important; font-size: 12px; line-height: 1.7; color: var(--cr-secondary); }
html body app-criteria-list #profile-panel .criteria-profile-visual img { filter: none !important; opacity: 1 !important; mix-blend-mode: normal !important; }
html body app-criteria-list #profile-panel [data-jpc-provisional='true'] .criteria-profile-primary-copy > :not(.jpc-directory-direction) { display: none !important; }
.jpc-directory-direction { display: block; color: var(--cr-text); font: 650 18px/1.5 var(--ft-font-serif, serif); }
@media (max-width: 1000px) {
  html body .jpc-cover-wrap > .jpc-cover { grid-template-columns: minmax(0, 1.1fr) minmax(220px, .9fr) !important; gap: 24px !important; padding: 28px !important; min-height: 350px !important; }
  html body .jpc-cover-wrap .jpc-cover :is(.type-portrait, .quick-type-portrait) { height: 300px !important; }
  html body .jpc-cover-wrap .jpc-cover .dual-portraits { gap: 10px !important; }
  html body .jpc-cover-wrap .jpc-cover .dual-portraits .type-portrait { height: 210px !important; }
  html body .jpc-cover-wrap .jpc-cover :is(.jp-reading-lede, .jpc-cover-meaning, blockquote) { font-size: 19px !important; }
  html body .jpc-cover-wrap.jp-reading .jp-reading-layout { grid-template-columns: 190px minmax(0, 1fr) !important; }
  .jpc-directory-direction { font-size: 15px; }
}
@media (max-width: 760px) {
  html body .jpc-cover-wrap > .jpc-cover { display: flex !important; flex-direction: column !important; gap: 22px !important; min-height: 0 !important; padding: 24px 20px !important; margin-bottom: 16px !important; border-radius: 14px !important; }
  html body .jpc-cover-wrap .jpc-cover :is(.hero-copy, .jpc-cover-copy) { width: 100% !important; order: 1 !important; }
  html body .jpc-cover-wrap .jpc-cover :is(.hero-aside, .quick-type-visual) { order: 0 !important; max-width: 420px; }
  html body .jpc-cover-wrap .jpc-cover :is(.type-portrait, .quick-type-portrait) { height: 260px !important; max-width: 100% !important; }
  html body .jpc-cover-wrap .jpc-cover :is(h1, #profile-title) { font-size: 42px !important; line-height: 1.3 !important; margin: 12px 0 !important; }
  html body .jpc-cover-wrap .jpc-cover :is(h1, #profile-title).dual-title { font-size: 30px !important; }
  html body .jpc-cover-wrap .jpc-cover-quick :is(h1, #profile-title) { font-size: 25px !important; line-height: 1.55 !important; }
  html body .jpc-cover-wrap .jpc-cover :is(.jp-reading-lede, .jpc-cover-meaning, blockquote) { font-size: 18px !important; line-height: 1.75 !important; }
  html body .jpc-cover-wrap .jpc-cover .dual-portraits .type-portrait { height: 190px !important; }
  html body .jpc-cover-wrap .jpc-cover .tendency-card > strong { font-size: 20px !important; }
  html body .jpc-cover-wrap .jpc-cover .public-user small { max-width: none !important; }
  html body .jpc-cover-wrap.jp-reading .jp-reading-layout { display: flex !important; }
  html body .jpc-cover-wrap.jp-reading .jp-reading-rail-inner { padding: 16px !important; }
  html body .jpc-cover-wrap .jpc-cover .hero-actions > * { flex: 1 1 100%; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .jpc-cover-wrap * { scroll-behavior: auto !important; } }
html body .jpc-cover-wrap .jpc-cover .jpc-cover-repeated { display: none !important; }
}