/* VARI Contemporary Institute
   Community, publication, identity, messaging and co-creation surfaces.
   Presentation only: existing markup, content and behavior remain authoritative. */

:root {
  --vi-paper: #f2f3ee;
  --vi-paper-raised: #fafbf7;
  --vi-paper-muted: #e8ebe6;
  --vi-ink: #17211d;
  --vi-ink-2: #34423c;
  --vi-muted: #56635d;
  --vi-line: #d5dbd5;
  --vi-line-strong: #aeb9b2;
  --vi-green: #145a50;
  --vi-green-deep: #0e463e;
  --vi-green-pale: #dce9e4;
  --vi-blue: #315f7a;
  --vi-blue-pale: #e3ecf0;
  --vi-warm: #986036;
  --vi-warm-pale: #f2e7dc;
  --vi-danger: #9c3f3f;
  --vi-danger-pale: #f3e2e0;
  --vi-focus: #1f7669;
  --vi-shadow: 0 18px 42px rgba(23, 33, 29, .07);
  --vi-font: "Source Han Sans SC", "Noto Sans CJK SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --vi-serif: "Source Han Serif SC", "Noto Serif CJK SC", "Songti SC", SimSun, serif;
}

html { color-scheme: light; background: var(--vi-paper); }

body.vari-community,
body.publication-workspace,
body.identity-workspace,
body.chat-workspace,
body.cocreation-workspace {
  --text: var(--vi-ink);
  --muted: var(--vi-muted);
  --line: var(--vi-line);
  --card: var(--vi-paper-raised);
  --shadow: var(--vi-shadow);
  --studio-text: var(--vi-ink);
  --studio-muted: var(--vi-muted);
  --studio-line: var(--vi-line);
  --studio-bg: var(--vi-paper);
  --studio-card: var(--vi-paper-raised);
  --identity-text: var(--vi-ink);
  --identity-muted: var(--vi-muted);
  --identity-line: var(--vi-line);
  --identity-bg: var(--vi-paper);
  --identity-card: var(--vi-paper-raised);
  --identity-danger: var(--vi-danger);
  --chat-bg: var(--vi-paper);
  --chat-card: var(--vi-paper-raised);
  --chat-card2: var(--vi-paper-raised);
  --chat-line: var(--vi-line);
  --chat-text: var(--vi-ink);
  --chat-muted: var(--vi-muted);
  --chat-cyan: var(--vi-green);
  --chat-blue: var(--vi-blue);
  --chat-green: var(--vi-green);
  --chat-yellow: var(--vi-warm);
  --chat-red: var(--vi-danger);
  --cc-bg: var(--vi-paper);
  --cc-card: var(--vi-paper-raised);
  --cc-card-2: var(--vi-paper-raised);
  --cc-line: var(--vi-line);
  --cc-text: var(--vi-ink);
  --cc-muted: var(--vi-muted);
  --cc-cyan: var(--vi-green);
  --cc-blue: var(--vi-blue);
  --cc-green: var(--vi-green);
  --cc-yellow: var(--vi-warm);
  --cc-red: var(--vi-danger);
  margin: 0;
  min-height: 100dvh;
  overflow-x: clip;
  background: var(--vi-paper);
  background-image: none;
  color: var(--vi-ink);
  font-family: var(--vi-font);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body.vari-community ::selection,
body.publication-workspace ::selection,
body.identity-workspace ::selection,
body.chat-workspace ::selection,
body.cocreation-workspace ::selection { background: #bcd5cd; color: var(--vi-ink); }

body.vari-community :is(a, button, input, select, textarea, summary):focus-visible,
body.publication-workspace :is(a, button, input, select, textarea, summary):focus-visible,
body.identity-workspace :is(a, button, input, select, textarea, summary):focus-visible,
body.chat-workspace :is(a, button, input, select, textarea, summary):focus-visible,
body.cocreation-workspace :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--vi-focus);
  outline-offset: 3px;
  box-shadow: none;
}

body.vari-community :is(button, input, select, textarea),
body.publication-workspace :is(button, input, select, textarea),
body.identity-workspace :is(button, input, select, textarea),
body.chat-workspace :is(button, input, select, textarea),
body.cocreation-workspace :is(button, input, select, textarea) { font: inherit; }

body.vari-community :disabled,
body.publication-workspace :disabled,
body.identity-workspace :disabled,
body.chat-workspace :disabled,
body.cocreation-workspace :disabled { opacity: .45; cursor: not-allowed; filter: saturate(.35); }

/* One institutional navigation grammar across every community route. */
.community-topbar {
  position: sticky;
  inset-block-start: 0;
  z-index: 80;
  height: 68px;
  border-bottom: 1px solid var(--vi-line);
  background: rgba(250, 251, 247, .96);
  color: var(--vi-ink);
  box-shadow: none;
  backdrop-filter: blur(14px);
}

.community-topbar .topbar-inner {
  width: min(1540px, calc(100% - 48px));
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 48px);
}
.community-topbar nav { min-width: 0; }
.community-topbar [data-account-control] { flex: 0 0 auto; }

.community-topbar .brand { color: var(--vi-ink); gap: 12px; }
.community-topbar .brand-mark {
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--vi-green);
  box-shadow: none;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -.06em;
}
.community-topbar .brand b { color: var(--vi-ink); font-size: 13px; letter-spacing: .01em; }
.community-topbar .brand small { color: var(--vi-muted); font-size: 9px; letter-spacing: .08em; }
.community-topbar nav { align-self: stretch; gap: 24px; margin: 0 auto; }
.community-topbar nav a {
  padding: 0;
  color: var(--vi-muted);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .01em;
}
.community-topbar nav a:hover,
.community-topbar nav a.active { color: var(--vi-green); }
.community-topbar nav a.active::after {
  inset: auto 0 0;
  height: 3px;
  border-radius: 0;
  background: var(--vi-green);
}

/* Shared page headings and action controls. */
:is(.community-shell, .publication-shell, .identity-shell, .chat-shell, .cc-shell) {
  width: min(1440px, calc(100% - 48px));
  margin-inline: auto;
  padding-block: clamp(28px, 4vw, 58px) 88px;
}

:is(.publication-header, .identity-head, .chat-head, .cc-head) {
  align-items: flex-end;
  gap: 28px;
  margin-bottom: 30px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--vi-line-strong);
}

:is(.publication-header, .identity-head, .chat-head, .cc-head) h1 {
  margin: 3px 0 6px;
  color: var(--vi-ink);
  font-family: var(--vi-serif);
  font-size: clamp(30px, 3.2vw, 48px);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.16;
}

:is(.publication-header, .identity-head, .chat-head, .cc-head) p {
  max-width: 72ch;
  margin: 0;
  color: var(--vi-muted);
  font-size: 13px;
  line-height: 1.75;
}

:is(.eyebrow, .chat-eyebrow, .cc-eyebrow) {
  color: var(--vi-green);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .12em;
}

:is(.publication-actions, .identity-actions, .chat-actions, .cc-actions) {
  gap: 8px;
  justify-content: flex-end;
}

:is(.publication-actions a, .publication-actions button, .studio-btn,
    .identity-actions a, .identity-actions button, .identity-btn,
    .chat-btn, .chat-actions a, .chat-actions button,
    .cc-btn, .cc-actions a, .cc-actions button,
    .primary-btn, .secondary-btn, .ghost-btn) {
  min-height: 38px;
  border: 1px solid var(--vi-line-strong);
  border-radius: 5px;
  background: transparent;
  box-shadow: none;
  color: var(--vi-ink-2);
  font-weight: 700;
  text-decoration: none;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease;
}

:is(.publication-actions a, .publication-actions button, .studio-btn,
    .identity-actions a, .identity-actions button, .identity-btn,
    .chat-btn, .chat-actions a, .chat-actions button,
    .cc-btn, .cc-actions a, .cc-actions button,
    .primary-btn, .secondary-btn, .ghost-btn):hover {
  border-color: var(--vi-green);
  background: var(--vi-green-pale);
  color: var(--vi-green-deep);
}

:is(.publication-actions .primary, .studio-btn.primary,
    .identity-actions .primary, .identity-btn.primary,
    .chat-btn.primary, .chat-actions .primary,
    .cc-btn.primary, .cc-actions .primary, .primary-btn) {
  border-color: var(--vi-green);
  background: var(--vi-green);
  color: #fff;
}

:is(.studio-btn.danger, .identity-btn.danger, .chat-btn.danger, .cc-btn.danger, .danger-btn) {
  border-color: #c9a2a0;
  background: transparent;
  color: var(--vi-danger);
}

/* Research community: editorial network rather than a marketing dashboard. */
.vari-community .community-shell { padding-top: 0; }
.vari-community .community-hero {
  min-height: 0;
  margin: 0;
  padding: clamp(46px, 6vw, 84px) 0 36px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: clamp(38px, 7vw, 110px);
  align-items: end;
  overflow: visible;
  border-bottom: 1px solid var(--vi-line-strong);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--vi-ink);
}
.vari-community .hero-grid,
.vari-community .hero-orb { display: none; }
.vari-community .hero-copy { max-width: 920px; }
.vari-community .hero-copy h1 {
  max-width: 15ch;
  margin: 8px 0 14px;
  color: var(--vi-ink);
  font-family: var(--vi-serif);
  font-size: clamp(42px, 6vw, 78px);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1.05;
}
.vari-community .hero-copy p { max-width: 68ch; color: var(--vi-muted); font-size: 14px; line-height: 1.85; }
.vari-community .hero-actions { gap: 8px; margin-top: 24px; flex-wrap: wrap; }
.vari-community .hero-actions .ghost-btn { color: var(--vi-ink-2); }
.vari-community .hero-signal {
  position: static;
  width: auto;
  height: auto;
  transform: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--vi-line-strong);
  border-bottom: 1px solid var(--vi-line-strong);
}
.vari-community .signal-core {
  position: static;
  grid-column: 1 / -1;
  width: auto;
  height: auto;
  padding: 12px 0;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--vi-line);
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--vi-green);
  animation: none;
}
.vari-community .signal-core span { font-size: 18px; }
.vari-community .signal-core i { display: none; }
.vari-community .signal-node {
  position: static;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--vi-ink-2);
  font-size: 11px;
  text-align: left;
}
.vari-community .metric-grid {
  margin: 0 0 52px;
  gap: 0;
  border-bottom: 1px solid var(--vi-line-strong);
}
.vari-community .metric-card {
  min-width: 0;
  padding: 20px 22px 22px 0;
  border: 0;
  border-right: 1px solid var(--vi-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.vari-community .metric-card:not(:first-child) { padding-left: 22px; }
.vari-community .metric-card:last-child { border-right: 0; }
.vari-community .metric-card::before { display: none; }
.vari-community .metric-card b { color: var(--vi-ink); font-family: var(--vi-serif); font-size: 34px; font-variant-numeric: tabular-nums; }
.vari-community .metric-card span { color: var(--vi-muted); }
.vari-community .section-head { align-items: flex-start; margin-bottom: 16px; }
.vari-community .section-head h2 { margin: 0 0 5px; font-family: var(--vi-serif); font-size: 26px; color: var(--vi-ink); }
.vari-community .space-grid { grid-template-columns: repeat(4, 1fr); gap: 0; margin-bottom: 48px; border-block: 1px solid var(--vi-line-strong); }
.vari-community .space-card {
  padding: 19px 20px;
  border: 0;
  border-right: 1px solid var(--vi-line);
  border-radius: 0;
  background: transparent;
  transition: background-color 160ms ease;
}
.vari-community .space-card:last-child { border-right: 0; }
.vari-community .space-card::after { display: none; }
.vari-community .space-card:hover,
.vari-community .space-card.active { transform: none; border-color: var(--vi-line); background: var(--vi-green-pale); box-shadow: none; }
.vari-community .space-card i {
  width: 26px;
  height: 26px;
  border-radius: 4px;
  background: var(--vi-green-pale);
  color: var(--vi-green);
}
.vari-community .space-card h3 { margin: 14px 0 6px; color: var(--vi-ink); }
.vari-community .space-card p { min-height: 0; color: var(--vi-muted); }
.vari-community .community-layout { grid-template-columns: minmax(0, 1fr) 310px; gap: 40px; }
.vari-community .feed-toolbar {
  padding: 0 0 12px;
  border: 0;
  border-bottom: 1px solid var(--vi-line-strong);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.vari-community .view-tabs button { border-radius: 4px; color: var(--vi-muted); }
.vari-community .view-tabs button.active { background: var(--vi-green); color: #fff; }
.vari-community .search-box { border-color: var(--vi-line-strong); border-radius: 4px; background: var(--vi-paper-raised); }
.vari-community .search-box input { background: transparent; color: var(--vi-ink); }
.vari-community .search-box button { background: var(--vi-green); }
.vari-community .active-filter { border-radius: 4px; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.vari-community .post-feed { gap: 0; margin-top: 0; }
.vari-community :is(.post-card, .loading-card) {
  padding: 23px 0;
  border: 0;
  border-bottom: 1px solid var(--vi-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.vari-community .post-card:hover { transform: none; border-color: var(--vi-line-strong); box-shadow: none; }
.vari-community .post-kind { color: var(--vi-green); }
.vari-community .post-kind::before { width: 5px; height: 5px; }
.vari-community .post-card h3 { margin: 7px 0; color: var(--vi-ink); font-family: var(--vi-serif); font-size: 19px; }
.vari-community .post-card p { max-width: 78ch; color: var(--vi-ink-2); }
.vari-community .post-tags span,
.vari-community .trust-badges span { border: 1px solid var(--vi-line); border-radius: 3px; background: transparent; color: var(--vi-muted); }
.vari-community .linked-paper { border-left: 1px solid var(--vi-green); border-radius: 0; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.vari-community .post-actions { border-color: var(--vi-line); }
.vari-community :is(.post-actions button, .reaction-btn, .pagination button) { border-color: var(--vi-line); border-radius: 4px; background: transparent; color: var(--vi-muted); }
.vari-community :is(.post-actions button, .reaction-btn).active { border-color: var(--vi-green); background: var(--vi-green-pale); color: var(--vi-green-deep); }
.vari-community .community-sidebar { gap: 0; border-top: 1px solid var(--vi-line-strong); }
.vari-community .side-card {
  padding: 22px 0;
  border: 0;
  border-bottom: 1px solid var(--vi-line-strong);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.vari-community .side-card h3 { color: var(--vi-ink); font-family: var(--vi-serif); }
.vari-community .contribution-score { border-radius: 4px; background: var(--vi-green); }
.vari-community .contribution-stats span { border-radius: 3px; background: var(--vi-paper-muted); color: var(--vi-muted); }
.vari-community .contribution-stats b { color: var(--vi-ink); }
.vari-community .avatar,
.vari-community .contributor .avatar { border-radius: 4px; background: var(--vi-green); }
.vari-community .guideline-card li::before { border-radius: 3px; background: var(--vi-green); }

/* Publication studio and editor: manuscript, body and review rail. */
.publication-workspace .publication-shell { max-width: 1440px; }
.publication-workspace :is(.studio-metric, .studio-panel, .editor-card) {
  border: 1px solid var(--vi-line);
  border-radius: 6px;
  background: var(--vi-paper-raised);
  box-shadow: none;
}
.publication-workspace :is(.publication-header h1, .studio-panel h2, .studio-panel h3, .editor-card h2, .editor-card h3) { color: var(--vi-ink); }
.publication-workspace .studio-metrics { gap: 0; margin-bottom: 28px; border-block: 1px solid var(--vi-line-strong); }
.publication-workspace .studio-metric { padding: 18px 20px; border-width: 0 1px 0 0; border-radius: 0; background: transparent; }
.publication-workspace .studio-metric:last-child { border-right: 0; }
.publication-workspace .studio-metric b { color: var(--vi-ink); font-family: var(--vi-serif); font-size: 28px; font-variant-numeric: tabular-nums; }
.publication-workspace .studio-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; }
.publication-workspace .studio-panel { padding: 22px; }
.publication-workspace .studio-tabs { border-bottom: 1px solid var(--vi-line); }
.publication-workspace .studio-tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--vi-muted); }
.publication-workspace .studio-tabs button.active { border-color: var(--vi-green); background: transparent; color: var(--vi-green); }
.publication-workspace .studio-list { gap: 0; }
.publication-workspace .studio-item { padding: 16px 0; border: 0; border-bottom: 1px solid var(--vi-line); border-radius: 0; background: transparent; }
.publication-workspace .studio-item h3 { color: var(--vi-ink); }

.publication-workspace .editor-layout { grid-template-columns: minmax(0, 1fr) 350px; gap: 28px; align-items: start; }
.publication-workspace .editor-card { padding: clamp(20px, 3vw, 38px); }
.publication-workspace .editor-layout > aside { position: sticky; top: 96px; }
.publication-workspace .editor-card > label,
.publication-workspace .editor-card > .editor-grid,
.publication-workspace .project-link-panel { margin-bottom: 22px; }
.publication-workspace .editor-card label > span,
.publication-workspace .field-title { color: var(--vi-ink-2); font-size: 11px; font-weight: 700; }
.publication-workspace .editor-card :is(input, select, textarea) {
  border: 1px solid var(--vi-line-strong);
  border-radius: 4px;
  background: #fff;
  color: var(--vi-ink);
}
.publication-workspace .editor-card :is(input, select, textarea)::placeholder { color: #59665f; opacity: 1; }
.publication-workspace #editorTitle { font-family: var(--vi-serif); font-size: 20px; }
.publication-workspace #editorBody { min-height: 340px; font-family: var(--vi-serif); font-size: 15px; line-height: 1.9; }
.publication-workspace .project-link-panel { border: 1px solid var(--vi-line); border-radius: 4px; background: var(--vi-paper); }
.publication-workspace .editor-preview { color: var(--vi-ink-2); line-height: 1.85; }
.publication-workspace .editor-preview h3 { color: var(--vi-ink); }
.publication-workspace .editor-footer { position: sticky; bottom: 0; z-index: 2; margin: 24px -10px -10px; padding: 14px 10px 10px; border-top: 1px solid var(--vi-line); background: rgba(250,251,247,.96); backdrop-filter: blur(10px); }
.publication-workspace .source-summary { border-left: 1px solid var(--vi-green); border-radius: 0; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.publication-workspace .comment-summary { border-color: var(--vi-line); }

/* Identity and network: institutional CV rather than gamified profile. */
.identity-workspace :is(.identity-card, .level-card, .identity-item, .visibility-grid label) {
  border-color: var(--vi-line);
  border-radius: 6px;
  background: var(--vi-paper-raised);
  box-shadow: none;
}
.identity-workspace :is(.identity-head h1, .identity-card h2, .identity-card h3) { color: var(--vi-ink); }
.identity-workspace .identity-grid { grid-template-columns: 300px minmax(0, 1fr); gap: 28px; align-items: start; }
.identity-workspace .identity-card { padding: 22px; }
.identity-workspace .identity-profile-head { text-align: left; }
.identity-workspace .identity-avatar { width: 78px; height: 78px; margin: 0 0 16px; border-radius: 6px; background: var(--vi-green); }
.identity-workspace .badge-list,
.identity-workspace .direction-list { gap: 5px; }
.identity-workspace :is(.identity-badge, .direction-list span, .level-chip, .status-chip) { border: 1px solid var(--vi-line); border-radius: 3px; background: transparent; color: var(--vi-muted); }
.identity-workspace .identity-badge.official,
.identity-workspace .status-chip.verified { border-color: #a8c9bd; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.identity-workspace :is(.status-chip.pending, .status-chip.supplement_requested) { border-color: #d8b990; background: var(--vi-warm-pale); color: #77481f; }
.identity-workspace :is(.status-chip.rejected, .status-chip.revoked, .status-chip.expired) { border-color: #d5a9a6; background: var(--vi-danger-pale); color: var(--vi-danger); }
.identity-workspace .count-row { gap: 0; border-block: 1px solid var(--vi-line); }
.identity-workspace .count-row div { padding: 12px 4px; border: 0; border-right: 1px solid var(--vi-line); border-radius: 0; background: transparent; }
.identity-workspace .count-row div:last-child { border-right: 0; }
.identity-workspace .identity-stack { gap: 18px; }
.identity-workspace .identity-list { gap: 0; }
.identity-workspace .identity-item { padding: 16px 0; border-width: 0 0 1px; border-radius: 0; background: transparent; }
.identity-workspace .connection-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.identity-workspace .connection-layout > aside { position: sticky; top: 96px; }
.identity-workspace .identity-tabs { border-bottom: 1px solid var(--vi-line); }
.identity-workspace .identity-tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--vi-muted); }
.identity-workspace .identity-tabs button.active { border-color: var(--vi-green); background: transparent; color: var(--vi-green); }
.identity-workspace .person-row { border-color: var(--vi-line); }
.identity-workspace .person-avatar { border-radius: 4px; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.identity-workspace .notification-item.unread { border-left: 1px solid var(--vi-green); background: var(--vi-green-pale); }
.identity-workspace .identity-form :is(input, textarea, select) { border-color: var(--vi-line-strong); border-radius: 4px; background: #fff; color: var(--vi-ink); }
.identity-workspace .identity-form :is(input, textarea)::placeholder { color: #59665f; opacity: 1; }
.identity-workspace .verification-warning { border: 1px solid #d8b990; border-radius: 4px; background: var(--vi-warm-pale); color: #70451f; }
.identity-workspace .hidden-notice { border-radius: 4px; background: var(--vi-paper-muted); color: var(--vi-muted); }

/* Messaging: a familiar inbox and calm conversation canvas. */
.chat-workspace .chat-shell { max-width: 1440px; }
.chat-workspace :is(.inbox-nav, .chat-card, .chat-view) {
  border: 1px solid var(--vi-line);
  border-radius: 6px;
  background: var(--vi-paper-raised);
  box-shadow: none;
}
.chat-workspace .inbox-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 0; border: 1px solid var(--vi-line); background: var(--vi-paper-raised); }
.chat-workspace .inbox-nav { padding: 10px; border: 0; border-right: 1px solid var(--vi-line); border-radius: 0; }
.chat-workspace .inbox-nav a { border-radius: 4px; color: var(--vi-muted); }
.chat-workspace .inbox-nav a:hover,
.chat-workspace .inbox-nav a.active { background: var(--vi-green-pale); color: var(--vi-green-deep); }
.chat-workspace .inbox-grid { gap: 0; }
.chat-workspace .chat-card { border-width: 0 1px 1px 0; border-radius: 0; }
.chat-workspace .conversation-row,
.chat-workspace .request-row,
.chat-workspace .notification-row {
  padding: 12px 0;
  border: 0;
  border-bottom: 1px solid var(--vi-line);
  border-radius: 0;
  background: transparent;
  color: var(--vi-ink);
}
.chat-workspace .conversation-row:hover { border-color: var(--vi-line-strong); background: var(--vi-paper); }
.chat-workspace .conversation-avatar { border-radius: 4px; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.chat-workspace .unread-badge { background: var(--vi-green); }
.chat-workspace .chat-chip { border: 1px solid var(--vi-line); border-radius: 3px; background: transparent; color: var(--vi-muted); }
.chat-workspace :is(.chat-chip.online, .chat-chip.active, .chat-chip.accepted) { border-color: #a8c9bd; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.chat-workspace :is(.chat-chip.pending, .chat-chip.disconnected) { border-color: #d8b990; background: var(--vi-warm-pale); color: #77481f; }
.chat-workspace :is(.chat-chip.declined, .chat-chip.blocked, .chat-chip.failed) { border-color: #d5a9a6; background: var(--vi-danger-pale); color: var(--vi-danger); }
.chat-workspace .chat-empty { border-color: var(--vi-line-strong); border-radius: 4px; color: var(--vi-muted); }
.chat-workspace .chat-view { height: calc(100dvh - 150px); min-height: 560px; overflow: hidden; }
.chat-workspace .chat-view-head { padding: 15px 18px; border-color: var(--vi-line); }
.chat-workspace .chat-view-head h1 { color: var(--vi-ink); }
.chat-workspace .connection-dot { background: var(--vi-warm); }
.chat-workspace .connection-state.online .connection-dot { background: var(--vi-green); }
.chat-workspace .message-stream { background: var(--vi-paper); scrollbar-color: var(--vi-line-strong) transparent; }
.chat-workspace .message-bubble { border-color: var(--vi-line); border-radius: 6px 6px 6px 2px; background: #fff; color: var(--vi-ink); }
.chat-workspace .message.mine .message-bubble { border-color: #abc8bf; border-radius: 6px 6px 2px 6px; background: var(--vi-green-pale); }
.chat-workspace .reply-quote { border-color: var(--vi-green); color: var(--vi-muted); }
.chat-workspace .composer { border-color: var(--vi-line); background: var(--vi-paper-raised); }
.chat-workspace .composer textarea,
.chat-workspace .chat-form :is(input, select, textarea) { border-color: var(--vi-line-strong); border-radius: 4px; background: #fff; color: var(--vi-ink); }
.chat-workspace .composer textarea::placeholder,
.chat-workspace .chat-form :is(input, textarea)::placeholder { color: #59665f; opacity: 1; }
.chat-workspace .request-message { border-color: var(--vi-line); border-radius: 4px; background: var(--vi-paper); color: var(--vi-ink-2); }

/* Co-creation: governed project workspace, compact and auditable. */
.cocreation-workspace :is(.cc-card, .cc-project-card) {
  border: 1px solid var(--vi-line);
  border-radius: 6px;
  background: var(--vi-paper-raised);
  box-shadow: none;
}
.cocreation-workspace :is(.cc-card h2, .cc-card h3, .cc-card h4) { color: var(--vi-ink); }
.cocreation-workspace .cc-card p { color: var(--vi-muted); }
.cocreation-workspace .cc-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.cocreation-workspace .cc-layout > aside { position: sticky; top: 96px; }
.cocreation-workspace .cc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.cocreation-workspace .cc-project-card { min-height: 230px; }
.cocreation-workspace .cc-tabs { gap: 0; border-bottom: 1px solid var(--vi-line-strong); }
.cocreation-workspace .cc-tabs a { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--vi-muted); }
.cocreation-workspace .cc-tabs a.active { border-color: var(--vi-green); background: transparent; color: var(--vi-green); }
.cocreation-workspace .cc-list { gap: 0; }
.cocreation-workspace .cc-item { padding: 15px 0; border-width: 0 0 1px; border-color: var(--vi-line); border-radius: 0; background: transparent; }
.cocreation-workspace :is(.cc-chip, .cc-label) { border: 1px solid var(--vi-line); border-radius: 3px; background: transparent; color: var(--vi-muted); }
.cocreation-workspace :is(.cc-chip.open, .cc-chip.accepted) { border-color: #a8c9bd; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.cocreation-workspace :is(.cc-chip.pending, .cc-chip.submitted, .cc-chip.under_review) { border-color: #d8b990; background: var(--vi-warm-pale); color: #77481f; }
.cocreation-workspace :is(.cc-chip.closed, .cc-chip.rejected, .cc-chip.removed) { border-color: #d5a9a6; background: var(--vi-danger-pale); color: var(--vi-danger); }
.cocreation-workspace .cc-form :is(input, select, textarea),
.cocreation-workspace .cc-form-grid :is(input, select, textarea) { border-color: var(--vi-line-strong); border-radius: 4px; background: #fff; color: var(--vi-ink); }
.cocreation-workspace :is(.cc-form, .cc-form-grid) :is(input, textarea)::placeholder { color: #59665f; opacity: 1; }
.cocreation-workspace .cc-table { border-color: var(--vi-line); }
.cocreation-workspace .cc-table { display: block; width: 100%; overflow-x: auto; scrollbar-color: var(--vi-line-strong) transparent; }
.cocreation-workspace .cc-table :is(th, td) { border-color: var(--vi-line); }
.cocreation-workspace .cc-source { border-left: 1px solid var(--vi-green); border-radius: 0; background: var(--vi-green-pale); color: var(--vi-green-deep); }

/* Shared states, dialogs and browser surfaces. */
:is(.vari-community, .publication-workspace, .identity-workspace, .chat-workspace, .cocreation-workspace)
  :is(.empty-state, .loading-card, .chat-empty, .cc-empty) {
  min-height: 96px;
  padding: 32px 18px;
  border: 1px dashed var(--vi-line-strong);
  border-radius: 4px;
  background: transparent;
  color: var(--vi-muted);
  text-align: center;
}

:is(.form-message, .chat-notice, .cc-notice) {
  border: 1px solid #afc5d0;
  border-radius: 4px;
  background: var(--vi-blue-pale);
  color: #284e64;
}
:is(.form-message.error, .chat-notice.error, .cc-notice.error) { border-color: #d5a9a6; background: var(--vi-danger-pale); color: var(--vi-danger); }

.community-dialog {
  width: min(780px, calc(100% - 32px));
  border: 1px solid var(--vi-line-strong);
  border-radius: 8px;
  background: var(--vi-paper-raised);
  box-shadow: 0 32px 80px rgba(23, 33, 29, .22);
  color: var(--vi-ink);
}
.community-dialog::backdrop { background: rgba(17, 27, 23, .54); backdrop-filter: blur(2px); }
.community-dialog .dialog-close { border-color: var(--vi-line); border-radius: 4px; background: transparent; color: var(--vi-muted); }
.community-dialog :is(input, select, textarea) { border-color: var(--vi-line-strong); border-radius: 4px; background: #fff; color: var(--vi-ink); }
.community-dialog :is(input, textarea)::placeholder { color: #59665f; opacity: 1; }
.community-dialog footer { border-color: var(--vi-line); }
.detail-top { background: var(--vi-paper-raised); }
.detail-post h2 { color: var(--vi-ink); font-family: var(--vi-serif); }
.detail-body { color: var(--vi-ink-2); }
.detail-evidence { border-radius: 4px; background: var(--vi-green-pale); color: var(--vi-green-deep); }
.comment-section,
.comment { border-color: var(--vi-line); }
.comment.reply { border-left: 1px solid var(--vi-line-strong); }
.comment p { color: var(--vi-ink-2); }

:is(.publication-workspace, .identity-workspace, .chat-workspace, .cocreation-workspace) :is(pre, code) {
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

:is(.toast, .publication-toast, .chat-toast, .cc-toast) {
  border: 1px solid #315d53;
  border-radius: 5px;
  background: var(--vi-green-deep);
  color: #fff;
  box-shadow: var(--vi-shadow);
}
:is(.toast, .publication-toast, .chat-toast, .cc-toast).error { border-color: #7b3030; background: #762f2f; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media (max-width: 1100px) {
  .community-topbar .topbar-inner { width: min(100% - 32px, 1440px); gap: 22px; }
  .community-topbar nav { justify-content: flex-start; overflow-x: auto; }
  .vari-community .community-hero { grid-template-columns: 1fr 250px; }
  .vari-community .space-grid { grid-template-columns: repeat(2, 1fr); }
  .vari-community .space-card:nth-child(2) { border-right: 0; }
  .vari-community .space-card:nth-child(-n+2) { border-bottom: 1px solid var(--vi-line); }
  .vari-community .community-layout,
  .publication-workspace .studio-layout,
  .publication-workspace .editor-layout,
  .identity-workspace .identity-grid,
  .identity-workspace .connection-layout,
  .cocreation-workspace .cc-layout { grid-template-columns: 1fr; }
  .vari-community .community-sidebar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; border-top: 0; }
  .vari-community .side-card { border-top: 1px solid var(--vi-line-strong); }
  .publication-workspace .editor-layout > aside,
  .identity-workspace .connection-layout > aside,
  .cocreation-workspace .cc-layout > aside { position: static; }
  .cocreation-workspace .cc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  .community-topbar { height: auto; min-height: 62px; }
  .community-topbar .topbar-inner { width: calc(100% - 24px); min-height: 62px; gap: 12px; }
  .community-topbar .brand span:last-child { display: none; }
  .community-topbar .brand-mark { font-size: 24px; }
  .community-topbar nav { gap: 18px; overscroll-behavior-inline: contain; }
  .community-topbar nav a { min-height: 62px; flex: 0 0 auto; font-size: 12px; }
  :is(.community-shell, .publication-shell, .identity-shell, .chat-shell, .cc-shell) { width: calc(100% - 28px); padding-top: 28px; padding-bottom: 64px; }
  :is(.publication-header, .identity-head, .chat-head, .cc-head) { align-items: flex-start; flex-direction: column; gap: 16px; padding-bottom: 20px; }
  :is(.publication-actions, .identity-actions, .chat-actions, .cc-actions) { width: 100%; justify-content: flex-start; }
  .vari-community .community-shell { padding-top: 0; }
  .vari-community .community-hero { grid-template-columns: 1fr; gap: 26px; padding-top: 42px; }
  .vari-community .hero-copy h1 { font-size: clamp(38px, 11vw, 58px); }
  .vari-community .hero-signal { max-width: none; }
  .vari-community .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .vari-community .metric-card:nth-child(2) { border-right: 0; }
  .vari-community .metric-card:nth-child(-n+2) { border-bottom: 1px solid var(--vi-line); }
  .vari-community .feed-toolbar { align-items: stretch; flex-direction: column; }
  .vari-community .search-box { min-width: 0; }
  .vari-community .community-sidebar { grid-template-columns: 1fr; gap: 0; }
  .publication-workspace .studio-metrics { grid-template-columns: repeat(2, 1fr); }
  .publication-workspace .studio-metric:nth-child(2n) { border-right: 0; }
  .publication-workspace .editor-grid,
  .publication-workspace .field-checks,
  .identity-workspace .identity-form .form-grid,
  .identity-workspace .visibility-grid,
  .cocreation-workspace .cc-form-grid { grid-template-columns: 1fr; }
  .chat-workspace .inbox-layout { grid-template-columns: 1fr; }
  .chat-workspace .inbox-nav { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--vi-line); }
  .chat-workspace .inbox-nav a { flex: 0 0 auto; white-space: nowrap; }
  .chat-workspace .inbox-grid { grid-template-columns: 1fr; }
  .chat-workspace .chat-card { border-right: 0; }
  .chat-workspace .chat-view { height: calc(100dvh - 96px); min-height: 500px; }
  .cocreation-workspace .cc-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  :is(.community-shell, .publication-shell, .identity-shell, .chat-shell, .cc-shell) { width: calc(100% - 20px); }
  :is(.publication-header, .identity-head, .chat-head, .cc-head) h1 { font-size: 30px; }
  .vari-community .hero-actions > *,
  :is(.publication-actions, .identity-actions, .chat-actions, .cc-actions) > * { flex: 1 1 auto; justify-content: center; text-align: center; }
  .vari-community .metric-grid,
  .vari-community .space-grid { grid-template-columns: 1fr; }
  .vari-community .metric-card,
  .vari-community .metric-card:not(:first-child) { padding: 16px 0; border-right: 0; border-bottom: 1px solid var(--vi-line); }
  .vari-community .space-card { border-right: 0; border-bottom: 1px solid var(--vi-line); }
  .vari-community .space-card:last-child { border-bottom: 0; }
  .vari-community .post-card-head { flex-direction: column; }
  .publication-workspace .editor-card,
  .identity-workspace .identity-card,
  .cocreation-workspace .cc-card,
  .chat-workspace .chat-card { padding: 18px 14px; }
  .publication-workspace .editor-footer { align-items: stretch; flex-direction: column; }
  .publication-workspace .editor-footer .save-state { margin-right: 0; }
  .identity-workspace .person-row { grid-template-columns: 42px minmax(0, 1fr); }
  .identity-workspace .person-row > div:last-child { grid-column: 1 / -1; justify-content: flex-start; }
  .chat-workspace .chat-view-head { align-items: flex-start; gap: 10px; }
  .chat-workspace .message { max-width: 90%; }
  .chat-workspace .composer-toolbar { align-items: stretch; flex-direction: column; }
  .chat-workspace .composer-toolbar .primary { width: 100%; }
  .community-dialog form,
  .detail-dialog > article { padding: 18px; }
  .community-dialog footer { align-items: stretch; flex-direction: column; }
  .community-dialog footer > span { margin-right: 0; }
}
