/* VARI Research Hub · soft research palette v2
 * Loaded after page CSS. Colour, contrast and type legibility only; no routes,
 * layout structure or interaction contracts are changed here.
 */
:root {
  color-scheme: light;
  --theme-x: 50vw;
  --theme-y: 18vh;

  --vari-canvas: #f5f1e8;
  --vari-canvas-2: #f8f5ee;
  --vari-paper: #fcfaf5;
  --vari-blue: #99cdd8;
  --vari-blue-soft: #dceef1;
  --vari-mint: #ddece8;
  --vari-peach: #fde0d3;
  --vari-coral: #f3c3b8;
  --vari-sage: #cdd4c4;
  --vari-ink: #34413d;
  --vari-body: #657166;
  --vari-muted: #748078;
  --vari-line: #d6ddd4;
  --vari-line-strong: #b9c5bb;
  --vari-danger: #9b5d56;
  --vari-success: #587b6e;
  --vari-shadow: 0 12px 34px rgba(73, 86, 77, 0.09);

  /* Compatibility with the existing page families. */
  --void: var(--vari-canvas);
  --bg: var(--vari-canvas);
  --paper: var(--vari-paper);
  --card: var(--vari-paper);
  --soft: var(--vari-mint);
  --panel: var(--vari-paper);
  --panel-2: var(--vari-canvas-2);
  --surface: var(--vari-paper);
  --surface-2: var(--vari-canvas-2);
  --navy: var(--vari-paper);
  --navy2: var(--vari-mint);
  --navy-2: var(--vari-mint);
  --ink: var(--vari-ink);
  --text: var(--vari-ink);
  --muted: var(--vari-muted);
  --line: var(--vari-line);
  --border: var(--vari-line);
  --blue: #6fa9b5;
  --cyan: #6fa9b5;
  --cyan-2: var(--vari-blue);
  --cyan-soft: var(--vari-blue-soft);
  --accent: var(--vari-blue);
  --accent-2: var(--vari-mint);
  --green: #6d9b8a;
  --red: var(--vari-danger);
  --danger: var(--vari-danger);
  --orange: #c78b6e;
  --amber: #c78b6e;
  --violet: #91889f;
  --success: var(--vari-success);

  --vari-void: var(--vari-canvas);
  --vari-header: rgba(252, 250, 245, 0.94);
  --vari-surface: var(--vari-paper);
  --vari-surface-2: var(--vari-canvas-2);
  --vari-surface-3: var(--vari-mint);
  --vari-text: var(--vari-ink);
  --vari-dim: var(--vari-muted);
  --vari-cyan: #6fa9b5;
  --vari-cyan-strong: #568b95;
  --vari-control: var(--vari-paper);
  --vari-control-hover: var(--vari-mint);
  --vari-control-soft: var(--vari-canvas-2);
  --vari-green: #6d9b8a;
  --vari-red: var(--vari-danger);
  --vari-amber: #c78b6e;
  --vari-violet: #91889f;
  --vari-shadow: 0 12px 34px rgba(73, 86, 77, 0.09);

  --identity-bg: var(--vari-canvas);
  --identity-card: var(--vari-paper);
  --identity-text: var(--vari-ink);
  --identity-muted: var(--vari-muted);
  --identity-line: var(--vari-line);
  --identity-blue: #6fa9b5;
  --identity-cyan: #6fa9b5;
  --identity-danger: var(--vari-danger);
  --cc-bg: var(--vari-canvas);
  --cc-card: var(--vari-paper);
  --cc-card-2: var(--vari-canvas-2);
  --cc-text: var(--vari-ink);
  --cc-muted: var(--vari-muted);
  --cc-line: var(--vari-line);
  --cc-blue: #6fa9b5;
  --cc-cyan: #6fa9b5;
  --cc-green: var(--vari-success);
  --cc-yellow: #997157;
  --cc-red: var(--vari-danger);
  --chat-bg: var(--vari-canvas);
  --chat-card: var(--vari-paper);
  --chat-card2: var(--vari-canvas-2);
  --chat-text: var(--vari-ink);
  --chat-muted: var(--vari-muted);
  --chat-line: var(--vari-line);
  --chat-blue: #6fa9b5;
  --chat-cyan: #6fa9b5;
  --chat-green: var(--vari-success);
  --chat-yellow: #997157;
  --chat-red: var(--vari-danger);
  --entry-void: var(--vari-canvas);
  --entry-surface: var(--vari-paper);
  --entry-panel: var(--vari-canvas-2);
  --entry-text: var(--vari-ink);
  --entry-muted: var(--vari-muted);
  --entry-line: var(--vari-line);
  --entry-cyan: #6fa9b5;
  --reg-void: var(--vari-canvas);
  --reg-surface: var(--vari-paper);
  --reg-panel: var(--vari-canvas-2);
  --reg-text: var(--vari-ink);
  --reg-muted: var(--vari-muted);
  --reg-line: var(--vari-line);
  --reg-cyan: #6fa9b5;
  --studio-bg: var(--vari-canvas);
  --studio-card: var(--vari-paper);
  --studio-text: var(--vari-ink);
  --studio-muted: var(--vari-muted);
  --studio-line: var(--vari-line);
  --studio-navy: var(--vari-paper);
  --studio-blue: #6fa9b5;
  --studio-cyan: #6fa9b5;
}

html {
  background: var(--vari-canvas) !important;
}

body,
body.vari-ui,
body.vari-login,
body.vari-register,
body.vari-landing,
body.identity-workspace,
body.publication-workspace,
body.cocreation-workspace,
body.chat-workspace {
  color: var(--vari-body) !important;
  background-color: var(--vari-canvas) !important;
  background-image:
    radial-gradient(620px circle at var(--theme-x) var(--theme-y), rgba(153, 205, 216, 0.30), transparent 72%),
    radial-gradient(760px circle at 92% 16%, rgba(253, 224, 211, 0.34), transparent 65%),
    radial-gradient(680px circle at 8% 86%, rgba(221, 236, 232, 0.50), transparent 68%),
    linear-gradient(135deg, #f4efe5 0%, #faf7f0 48%, #f0f4ee 100%) !important;
  background-attachment: fixed !important;
  font-size: 15px;
}

body::before,
body::after,
.vari-ui::before,
.vari-ui::after {
  background: transparent !important;
}

/* Readability floor: legacy pages used 7–10 px labels that became invisible. */
body small,
body .meta,
body .muted,
body [class*="-meta"],
body [class*="-hint"],
body [class*="-note"],
body [class*="-eyebrow"],
body .eyebrow,
body .kicker,
body .overline {
  color: var(--vari-muted) !important;
  font-size: max(11px, 0.72em) !important;
  line-height: 1.55 !important;
  text-shadow: none !important;
}

body p,
body li,
body td,
body label,
body .description,
body .summary,
body .lead {
  color: var(--vari-body) !important;
  line-height: 1.7;
  text-shadow: none !important;
}

body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body b,
body strong,
body legend,
body th {
  color: var(--vari-ink) !important;
  text-shadow: none !important;
}

/* Header system */
body.vari-ui .topbar,
body.vari-ui .project-topbar,
body.vari-ui .obs-topbar,
body.vari-ui .community-topbar,
body.vari-ui .broadcast-topbar,
body.vari-ui .studio-top,
body.vari-ui .compare-topbar,
body.vari-ui .app-topbar,
body.vari-ui > header.top,
.global-header,
.entry-topbar,
.community-topbar,
.app-topbar,
.studio-top,
.broadcast-topbar {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: 0 4px 20px rgba(73, 86, 77, 0.07) !important;
  backdrop-filter: blur(18px) saturate(120%);
}

body.vari-ui .product-nav .nav-menu,
.account-menu,
.menu-panel,
.drawer,
.dropdown,
[class*="dropdown-menu"] {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.98) !important;
  border-color: var(--vari-line-strong) !important;
  box-shadow: var(--vari-shadow) !important;
}

body header a,
body header button,
body header nav > a,
body header nav > button,
body .brand,
body .brand-lockup,
body .compare-brand,
body .entry-brand,
body .entry-institute {
  color: var(--vari-body) !important;
}

body header nav > a:hover,
body header nav > a.active,
body header nav > button:hover,
body header nav > button.active,
body.vari-ui .product-nav .nav-root:hover,
body.vari-ui .product-nav .nav-group.active .nav-root,
body.vari-ui .product-nav .nav-group.open .nav-root {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
}

body.vari-ui .brand-mark::after,
body.vari-ui .obs-topbar .brand > span::after,
body.vari-ui .studio-top .brand > span::after,
body.vari-ui .compare-brand > span::after {
  color: #527f88 !important;
  text-shadow: none !important;
}

.brand-mark,
.account-avatar,
.identity-avatar,
.avatar {
  background: var(--vari-blue) !important;
  border-color: #7fb5c0 !important;
  color: var(--vari-ink) !important;
  box-shadow: none !important;
}

.subnav,
.feature-nav,
.project-subnav,
.intelligence-subnav,
.page-tabs,
.admin-tabs,
.ticker {
  color: var(--vari-body) !important;
  background: rgba(221, 236, 232, 0.72) !important;
  border-color: var(--vari-line) !important;
}

/* Shared large surfaces */
body.vari-ui .card,
body.vari-ui .panel,
body.vari-ui .workspace-card,
body.vari-ui .module-panel,
body.vari-ui .filter-console,
body.vari-ui .table-card,
body.vari-ui .detail-panel,
body.vari-ui .project-sidebar,
body.vari-ui .project-stage,
.workspace-card,
.editor-card,
.publication-card,
.identity-card,
.profile-card,
.verification-card,
.connection-card,
.notification-card,
.cc-card,
.chat-card,
.chat-view,
.inbox-nav,
.auth-card,
.settings-card,
.admin-card,
.review-card,
.studio-card,
.broadcast-card,
.post-card,
.side-card,
.content-card,
.source-card,
.evidence-card,
.graph-card,
.task-card,
.run-card,
.surface,
.detail-card,
.module-panel,
dialog,
[role="dialog"] {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: var(--vari-shadow) !important;
}

.card-head,
.panel-head,
.table-toolbar,
.workspace-head,
.project-head,
.editor-head,
.chat-view-head,
.section-head {
  color: var(--vari-ink) !important;
  background: rgba(221, 236, 232, 0.52) !important;
  border-color: var(--vari-line) !important;
}

.empty,
.empty-state,
.loading,
.loading-card,
.placeholder,
.notice,
.info-box,
.hint-box,
.callout,
.status-panel,
.activity-item,
.list-item,
.result-item,
.message-item,
.notification-item,
.audit-item,
.cc-empty,
.chat-empty {
  color: var(--vari-body) !important;
  background: rgba(221, 236, 232, 0.52) !important;
  border-color: var(--vari-line-strong) !important;
}

/* Reusable six-colour rhythm for summaries and card grids. */
.metric-grid > :nth-child(6n + 1),
.metrics > :nth-child(6n + 1),
.project-metrics > :nth-child(6n + 1),
.portfolio-metrics > :nth-child(6n + 1),
.overview-grid > :nth-child(6n + 1),
.community-grid > :nth-child(6n + 1),
.card-grid > :nth-child(6n + 1) { background: #dceef1 !important; }

.metric-grid > :nth-child(6n + 2),
.metrics > :nth-child(6n + 2),
.project-metrics > :nth-child(6n + 2),
.portfolio-metrics > :nth-child(6n + 2),
.overview-grid > :nth-child(6n + 2),
.community-grid > :nth-child(6n + 2),
.card-grid > :nth-child(6n + 2) { background: #ddece8 !important; }

.metric-grid > :nth-child(6n + 3),
.metrics > :nth-child(6n + 3),
.project-metrics > :nth-child(6n + 3),
.portfolio-metrics > :nth-child(6n + 3),
.overview-grid > :nth-child(6n + 3),
.community-grid > :nth-child(6n + 3),
.card-grid > :nth-child(6n + 3) { background: #fde0d3 !important; }

.metric-grid > :nth-child(6n + 4),
.metrics > :nth-child(6n + 4),
.project-metrics > :nth-child(6n + 4),
.portfolio-metrics > :nth-child(6n + 4),
.overview-grid > :nth-child(6n + 4),
.community-grid > :nth-child(6n + 4),
.card-grid > :nth-child(6n + 4) { background: #f3c3b8 !important; }

.metric-grid > :nth-child(6n + 5),
.metrics > :nth-child(6n + 5),
.project-metrics > :nth-child(6n + 5),
.portfolio-metrics > :nth-child(6n + 5),
.overview-grid > :nth-child(6n + 5),
.community-grid > :nth-child(6n + 5),
.card-grid > :nth-child(6n + 5) { background: #cdd4c4 !important; }

.metric-grid > :nth-child(6n),
.metrics > :nth-child(6n),
.project-metrics > :nth-child(6n),
.portfolio-metrics > :nth-child(6n),
.overview-grid > :nth-child(6n),
.community-grid > :nth-child(6n),
.card-grid > :nth-child(6n) { background: #f8f5ee !important; }

.metric-grid > *,
.metrics > *,
.project-metrics > *,
.portfolio-metrics > *,
.overview-grid > *,
.community-grid > *,
.card-grid > * {
  color: var(--vari-ink) !important;
  border-color: rgba(101, 113, 102, 0.20) !important;
  box-shadow: none !important;
}

/* Landing page */
body.vari-landing {
  --void: var(--vari-canvas);
  --panel: var(--vari-paper);
  --panel-2: var(--vari-mint);
  --text: var(--vari-ink);
  --muted: var(--vari-body);
  --cyan: #6fa9b5;
  --cyan-2: var(--vari-blue);
}

.vari-landing .ambient {
  background-color: transparent !important;
  background-image:
    linear-gradient(rgba(101, 113, 102, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(101, 113, 102, 0.035) 1px, transparent 1px) !important;
}

.vari-landing .aura-a { background: var(--vari-blue) !important; opacity: 0.24; }
.vari-landing .aura-b { background: var(--vari-peach) !important; opacity: 0.30; }
.vari-landing .beam { background: linear-gradient(112deg, transparent 43%, rgba(205, 212, 196, 0.18) 48%, transparent 53%) !important; }

.vari-landing .landing-hero {
  color: var(--vari-ink) !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(153, 205, 216, 0.34), transparent 28%),
    radial-gradient(circle at 50% 92%, rgba(253, 224, 211, 0.40), transparent 39%),
    rgba(248, 245, 238, 0.68) !important;
}

.vari-landing .hero-grid {
  background-image: radial-gradient(circle, rgba(101, 113, 102, 0.17) 1px, transparent 1.5px) !important;
  opacity: 0.40 !important;
}

.vari-landing .orbit { border-color: rgba(111, 169, 181, 0.30) !important; }
.vari-landing .signal { background: #6fa9b5 !important; box-shadow: 0 0 0 7px rgba(153, 205, 216, 0.18), 0 0 22px rgba(111, 169, 181, 0.50) !important; }
.vari-landing .landing-logo { color: var(--vari-ink) !important; background: none !important; -webkit-text-fill-color: var(--vari-ink) !important; text-shadow: none !important; }
.vari-landing .hero-cn { color: var(--vari-body) !important; font-size: clamp(20px, 1.65vw, 29px) !important; }
.vari-landing .hero-copy h2 { color: var(--vari-ink) !important; }
.vari-landing .hero-description { color: var(--vari-body) !important; font-size: clamp(16px, 1.18vw, 20px) !important; }
.vari-landing .hero-kicker,
.vari-landing .institute-mark small,
.vari-landing .hero-trust span,
.vari-landing .scroll-cue small { color: var(--vari-body) !important; font-size: 11px !important; }

.vari-landing .enter-platform {
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  border-color: #78b3bf !important;
  box-shadow: 0 12px 30px rgba(111, 169, 181, 0.20) !important;
}

.vari-landing .hero-trust span {
  background: var(--vari-sage) !important;
  border-color: #b8c1b1 !important;
}

.vari-landing .mission-section {
  background: linear-gradient(115deg, rgba(221, 236, 232, 0.72), rgba(220, 238, 241, 0.60)) !important;
}

.vari-landing .mission-grid article,
.vari-landing .capability-grid article {
  color: var(--vari-ink) !important;
  border-color: rgba(101, 113, 102, 0.22) !important;
  box-shadow: 0 12px 30px rgba(73, 86, 77, 0.08) !important;
}

.vari-landing .mission-grid article:nth-child(1) { background: var(--vari-blue-soft) !important; }
.vari-landing .mission-grid article:nth-child(2) { background: var(--vari-mint) !important; }
.vari-landing .mission-grid article:nth-child(3) { background: var(--vari-peach) !important; }
.vari-landing .capability-grid article:nth-child(1) { background: var(--vari-sage) !important; }
.vari-landing .capability-grid article:nth-child(2) { background: var(--vari-blue-soft) !important; }
.vari-landing .capability-grid article:nth-child(3) { background: var(--vari-mint) !important; }
.vari-landing .capability-grid article:nth-child(4) { background: var(--vari-coral) !important; }
.vari-landing .capability-grid article:nth-child(5) { background: var(--vari-peach) !important; }
.vari-landing .mission-grid article:hover,
.vari-landing .capability-grid article:hover { border-color: #7fb5c0 !important; filter: saturate(1.05); }
.vari-landing .mission-grid article > b { color: rgba(52, 65, 61, 0.20) !important; }
.vari-landing .mission-grid h3,
.vari-landing .capability-grid h3 { color: var(--vari-ink) !important; }
.vari-landing .mission-grid p,
.vari-landing .capability-grid p,
.vari-landing .mission-grid small,
.vari-landing .capability-grid small { color: var(--vari-body) !important; }
.vari-landing .mission-grid p,
.vari-landing .capability-grid p { font-size: 16px !important; }
.vari-landing .mission-icon { color: var(--vari-ink) !important; background: rgba(252, 250, 245, 0.55) !important; border-color: rgba(101, 113, 102, 0.25) !important; }
.vari-landing .network-visual { background: radial-gradient(circle at 50% 38%, rgba(153, 205, 216, 0.46), transparent 38%) !important; }
.vari-landing .institute-section { background: rgba(253, 224, 211, 0.38) !important; border-color: var(--vari-line) !important; }
.vari-landing footer { color: var(--vari-body) !important; background: var(--vari-sage) !important; border-color: var(--vari-line-strong) !important; }

/* Authentication pages */
.entry-topbar { background: rgba(205, 212, 196, 0.76) !important; }
.vari-login .auth-shell,
.vari-register .auth-shell,
body[data-page="forgot"] .auth-shell,
body[data-page="reset"] .auth-shell,
body[data-page="verify"] .auth-shell { background: transparent !important; }

.vari-login .auth-aside,
.vari-register .auth-aside,
body[data-page="forgot"] .auth-aside,
body[data-page="reset"] .auth-aside,
body[data-page="verify"] .auth-aside {
  color: var(--vari-ink) !important;
  background: linear-gradient(145deg, rgba(221, 236, 232, 0.78), rgba(220, 238, 241, 0.62)) !important;
}

.vari-login .auth-main,
.vari-register .auth-main,
body[data-page="forgot"] .auth-main,
body[data-page="reset"] .auth-main,
body[data-page="verify"] .auth-main { background: rgba(248, 245, 238, 0.56) !important; }

.vari-login .auth-card,
.vari-register .auth-card,
body[data-page="forgot"] .auth-card,
body[data-page="reset"] .auth-card,
body[data-page="verify"] .auth-card { background: rgba(252, 250, 245, 0.96) !important; border-color: var(--vari-line-strong) !important; box-shadow: var(--vari-shadow) !important; }
.auth-aside-copy p,
.entry-description,
.auth-card .lead,
.field-note,
.remember-note { color: var(--vari-body) !important; font-size: 13px !important; }
.portal-tabs { background: var(--vari-mint) !important; }
.portal-tabs button.active { background: var(--vari-blue-soft) !important; color: var(--vari-ink) !important; }
.scene-core { background: var(--vari-blue) !important; color: var(--vari-ink) !important; box-shadow: 0 16px 34px rgba(111, 169, 181, 0.16) !important; }
.scene-node { background: rgba(252, 250, 245, 0.88) !important; border-color: var(--vari-line-strong) !important; box-shadow: var(--vari-shadow) !important; }
.scene-status { background: var(--vari-sage) !important; border-color: var(--vari-line-strong) !important; color: var(--vari-ink) !important; }

/* Dashboard, intelligence and research discovery */
.vari-dashboard .research-console,
.vari-dashboard .workspace-board,
.vari-dashboard .workspace-panel,
.vari-dashboard .table-card,
.vari-dashboard .high-risk-card,
.vari-dashboard .comparison-report,
.vari-intelligence .detail-card,
.vari-intelligence .source-card,
.vari-intelligence .fact-card {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: var(--vari-shadow) !important;
}

.vari-dashboard .research-hero,
.vari-dashboard .page-head,
.vari-intelligence .detail-hero,
.vari-discovery .hero,
.vari-observatory .hero,
.vari-community .community-hero,
.vari-projects .project-hero,
.vari-broadcast .broadcast-hero,
.vari-broadcast-studio .studio-hero {
  color: var(--vari-ink) !important;
  background: linear-gradient(115deg, rgba(153, 205, 216, 0.76), rgba(221, 236, 232, 0.82), rgba(253, 224, 211, 0.72)) !important;
  border-color: rgba(101, 113, 102, 0.18) !important;
  box-shadow: var(--vari-shadow) !important;
}

.vari-dashboard .research-hero p,
.vari-dashboard .page-head p,
.vari-intelligence .detail-hero p,
.vari-discovery .hero p,
.vari-observatory .hero p,
.vari-community .community-hero p,
.vari-projects .project-hero p { color: var(--vari-body) !important; }

.vari-dashboard .intel-list,
.vari-dashboard .high-risk-list,
.vari-dashboard .workspace-list,
.vari-dashboard .research-latest,
.vari-dashboard .research-side,
.vari-dashboard .quality-grid,
.vari-dashboard .comparison-grid { background: transparent !important; }

.vari-discovery aside,
.vari-discovery .panel,
.vari-discovery .run,
.vari-observatory .module-tabs,
.vari-observatory .module-panel,
.vari-observatory .repo-card,
.vari-observatory .surface,
.vari-observatory .detail-panel {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: var(--vari-shadow) !important;
}

.vari-discovery .run.active,
.vari-discovery .run:hover,
.vari-observatory .module-tabs button.active,
.vari-observatory .repo-card.active { background: var(--vari-blue-soft) !important; border-color: #8dbfc9 !important; color: var(--vari-ink) !important; }
.vari-discovery .loop { background: rgba(252, 250, 245, 0.58) !important; border-color: rgba(101, 113, 102, 0.22) !important; }

/* Research projects: every stage remains distinct but no dark islands. */
.vari-projects .project-sidebar,
.vari-projects .project-stage,
.vari-projects .panel,
.vari-projects .research-canvas,
.vari-projects .execution-center,
.vari-projects .passport-panel,
.vari-projects .agent-workbench,
.vari-projects .consensus-dashboard,
.vari-projects .phase2-readiness,
.vari-projects .phase2-panel,
.vari-projects .phase2-candidate-panel,
.vari-projects .phase2-graph-panel,
.vari-projects .phase2-candidate-card,
.vari-projects .phase2-graph__group,
.vari-projects .phase2-dialog,
.vari-projects .phase2-trace__item,
.vari-projects .phase3-status,
.vari-projects .phase3-evidence-card,
.vari-projects .phase3-filterbar,
.vari-projects .phase3-panel,
.vari-projects .phase3-source,
.vari-projects .phase3-diff-body section,
.vari-projects .phase4-status,
.vari-projects .phase4-panel,
.vari-projects .phase4-matrix-wrap,
.vari-projects .phase4-conflict-card,
.vari-projects .phase4-conflict-side,
.vari-projects .phase4-gap-card,
.vari-projects .phase4-probe-card,
.vari-projects .phase4-idea-card,
.vari-projects .phase56-generator,
.vari-projects .phase56-plan,
.vari-projects .phase56-run,
.vari-projects .phase56-artifact,
.vari-projects .phase56-tool-results,
.vari-projects .phase7-card,
.vari-projects .phase7-item,
.vari-projects .claim-card,
.vari-projects .claim-evidence,
.vari-projects .execution-run,
.vari-projects .execution-run-detail,
.vari-projects .execution-log {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

.vari-projects .phase2-chain__step,
.vari-projects .phase2-node,
.vari-projects .phase3-metrics button,
.vari-projects .phase4-subtabs button,
.vari-projects .phase4-op-gaps li,
.vari-projects .phase56-metrics > *,
.vari-projects .phase7-result {
  color: var(--vari-ink) !important;
  background: var(--vari-mint) !important;
  border-color: var(--vari-line-strong) !important;
}

.vari-projects .phase2-node:nth-child(3n + 1),
.vari-projects .phase3-metrics button:nth-child(3n + 1),
.vari-projects .phase56-metrics > :nth-child(3n + 1) { background: var(--vari-blue-soft) !important; }
.vari-projects .phase2-node:nth-child(3n + 2),
.vari-projects .phase3-metrics button:nth-child(3n + 2),
.vari-projects .phase56-metrics > :nth-child(3n + 2) { background: var(--vari-peach) !important; }
.vari-projects .phase2-node:nth-child(3n),
.vari-projects .phase3-metrics button:nth-child(3n),
.vari-projects .phase56-metrics > :nth-child(3n) { background: var(--vari-sage) !important; }

.vari-projects .phase2-trace__quote,
.vari-projects .phase3-source,
.vari-projects .phase4-probe-query,
.vari-projects pre,
.vari-projects code { background: var(--vari-canvas-2) !important; color: var(--vari-ink) !important; border-color: var(--vari-line) !important; }

/* Community, identity, co-creation and messaging */
body.identity-workspace .identity-card,
body.identity-workspace .level-card,
body.identity-workspace .count-row div,
body.identity-workspace .identity-item,
body.identity-workspace .visibility-grid label,
body.identity-workspace .hidden-notice,
body.cocreation-workspace .cc-card,
body.cocreation-workspace .cc-item,
body.cocreation-workspace .cc-source,
body.cocreation-workspace .cc-notice,
body.chat-workspace .inbox-nav,
body.chat-workspace .chat-card,
body.chat-workspace .chat-view,
body.chat-workspace .message-bubble,
body.chat-workspace .composer,
body.chat-workspace .chat-notice {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: var(--vari-shadow) !important;
}

body.chat-workspace .message.mine .message-bubble { background: var(--vari-blue-soft) !important; border-color: #9bc8d1 !important; }
body.chat-workspace .message:not(.mine) .message-bubble { background: var(--vari-mint) !important; }
body.identity-workspace .identity-tabs button.active,
body.cocreation-workspace .cc-tabs a.active,
body.chat-workspace .inbox-nav a.active { background: var(--vari-blue) !important; color: var(--vari-ink) !important; border-color: #7fb5c0 !important; }

/* Graphs and code surfaces */
.graph-stage,
.graph-canvas,
.research-map,
.network-canvas,
.phase2-graph,
.phase7-graph {
  background: rgba(221, 236, 232, 0.56) !important;
  border-color: var(--vari-line-strong) !important;
}

.graph-node,
.phase2-node,
.phase7-node { background: var(--vari-blue-soft) !important; border-color: #8dbfc9 !important; color: var(--vari-ink) !important; box-shadow: none !important; }
.graph-node.attack,
.graph-node.vulnerability,
.graph-node[data-type="attack"],
.graph-node[data-type="vulnerability"] { background: var(--vari-peach) !important; border-color: var(--vari-coral) !important; }
.graph-node.repository,
.graph-node.defense,
.graph-node[data-type="repository"],
.graph-node[data-type="defense"] { background: var(--vari-sage) !important; border-color: #abb6a4 !important; }
.graph-node.model,
.graph-node[data-type="model"] { background: #e8e3eb !important; border-color: #c7becd !important; }
.graph-legend span,
.matrix-head { background: var(--vari-sage) !important; color: var(--vari-ink) !important; }

pre,
code,
.code-block,
.json-view,
.log-view,
.terminal,
.message-stream { color: var(--vari-ink) !important; background: var(--vari-canvas-2) !important; border-color: var(--vari-line) !important; }

/* Forms and actions */
input,
textarea,
select,
[contenteditable="true"],
body.identity-workspace .identity-form input,
body.identity-workspace .identity-form textarea,
body.identity-workspace .identity-form select,
body.cocreation-workspace .cc-form input,
body.cocreation-workspace .cc-form textarea,
body.cocreation-workspace .cc-form select,
body.chat-workspace .chat-form input,
body.chat-workspace .chat-form textarea,
body.chat-workspace .chat-form select {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.96) !important;
  border-color: var(--vari-line-strong) !important;
  box-shadow: none !important;
}

input::placeholder,
textarea::placeholder { color: #87918a !important; opacity: 1 !important; }
input:focus,
textarea:focus,
select:focus,
[contenteditable="true"]:focus { border-color: #79b2bd !important; box-shadow: 0 0 0 3px rgba(153, 205, 216, 0.30) !important; outline: none !important; }

button,
.button,
.btn,
[class$="-btn"],
[class$="-button"] { color: var(--vari-ink) !important; background-image: none !important; border-color: var(--vari-line-strong) !important; box-shadow: none !important; }

button:not(.primary):not([class*="primary"]):not(.danger),
.button:not(.primary):not([class*="primary"]):not(.danger),
.btn:not(.primary):not([class*="primary"]):not(.danger),
[class$="-btn"]:not(.primary):not([class*="primary"]):not(.danger) { background-color: rgba(252, 250, 245, 0.94) !important; }

button.primary,
button[class*="primary"],
.primary-action,
.primary-btn,
.solid-btn,
.action-primary,
a.primary { color: var(--vari-ink) !important; background: var(--vari-blue) !important; border-color: #7fb5c0 !important; }
button:hover,
.button:hover,
.btn:hover,
[class$="-btn"]:hover { color: var(--vari-ink) !important; background-color: var(--vari-mint) !important; border-color: #8dbfc9 !important; }
button.danger,
.danger-btn,
.destructive { color: var(--vari-danger) !important; background: var(--vari-peach) !important; border-color: var(--vari-coral) !important; }
button:disabled,
[aria-disabled="true"],
.disabled { color: #8d958f !important; background: #e9e9e2 !important; border-color: var(--vari-line) !important; }

.badge,
.tag,
.chip,
.pill,
.status-pill,
[class$="-badge"],
[class$="-chip"] { color: var(--vari-ink) !important; background: var(--vari-mint) !important; border-color: var(--vari-line-strong) !important; }
.success,
.accepted,
.published,
.status-success { color: #45695d !important; background: var(--vari-mint) !important; border-color: #aac8bd !important; }
.warning,
.pending,
.needs-review,
.status-warning { color: #84624f !important; background: var(--vari-peach) !important; border-color: #edc4b2 !important; }
.error,
.failed,
.rejected,
.status-error { color: var(--vari-danger) !important; background: #f8d7cf !important; border-color: var(--vari-coral) !important; }

table,
thead,
tbody,
tr,
td,
th { border-color: var(--vari-line) !important; }
thead,
th { color: var(--vari-ink) !important; background: var(--vari-sage) !important; }

a { color: #4d7f89; }
a:hover { color: var(--vari-ink); }
hr,
.divider,
.separator { border-color: var(--vari-line) !important; background: var(--vari-line) !important; }

* { scrollbar-color: var(--vari-sage) var(--vari-canvas); }
::selection { color: var(--vari-ink); background: var(--vari-blue); }
::-webkit-scrollbar-track { background: var(--vari-canvas); }
::-webkit-scrollbar-thumb { background: var(--vari-sage); border: 3px solid var(--vari-canvas); }

.toast,
#toast,
[class$="-toast"] { color: #fff !important; background: var(--vari-ink) !important; border-color: var(--vari-ink) !important; }

@media (prefers-reduced-motion: reduce) {
  body { background-image: linear-gradient(135deg, #f4efe5, #f0f4ee) !important; }
}

/* Final high-specificity bridge for legacy !important rules in vari-ui.css. */
body[class].vari-ui p,
body[class].vari-ui li,
body[class].vari-ui td,
body[class].vari-ui label,
body[class].vari-ui small,
body[class].vari-ui .muted {
  color: var(--vari-body) !important;
}

body[class].vari-ui h1,
body[class].vari-ui h2,
body[class].vari-ui h3,
body[class].vari-ui h4,
body[class].vari-ui b,
body[class].vari-ui strong {
  color: var(--vari-ink) !important;
}

body.vari-discovery .protocol > div,
body.vari-discovery .cards > .card,
body.vari-discovery .direct-answer,
body.vari-discovery .gap,
body.vari-discovery .relation,
body.vari-discovery .scores > span,
body.vari-discovery .why div,
body.vari-discovery .boundary,
body.vari-discovery .result-card,
body.vari-discovery .source-card,
body.vari-discovery .material-card,
body.vari-discovery .idea-card {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-discovery .protocol > div:nth-child(3n + 1),
body.vari-discovery .cards > .card:nth-child(3n + 1),
body.vari-discovery .why div:nth-child(3n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-discovery .protocol > div:nth-child(3n + 2),
body.vari-discovery .cards > .card:nth-child(3n + 2),
body.vari-discovery .why div:nth-child(3n + 2) { background: var(--vari-mint) !important; }
body.vari-discovery .protocol > div:nth-child(3n),
body.vari-discovery .cards > .card:nth-child(3n),
body.vari-discovery .why div:nth-child(3n) { background: var(--vari-peach) !important; }

body.vari-discovery .discovery-actions button,
body.vari-discovery .actions button {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.vari-projects .portfolio-metrics > *,
body.vari-projects .project-metrics > *,
body.vari-projects .project-list > button,
body.vari-projects .research-command,
body.vari-projects .panel,
body.vari-projects .tag,
body.vari-projects .candidate,
body.vari-projects .material-row,
body.vari-projects .evidence-row,
body.vari-projects .claim-card,
body.vari-projects .task-card,
body.vari-projects .artifact-card,
body.vari-projects .output-actions > *,
body.vari-projects .canvas-question,
body.vari-projects .canvas-flow > section,
body.vari-projects .research-gap-board > article,
body.vari-projects .agent-workbench,
body.vari-projects .agent-workbench button,
body.vari-projects .today-actions button,
body.vari-projects .secondary-btn,
body.vari-projects .menu-panel,
body.vari-projects .material-filters,
body.vari-projects .task-column,
body.vari-projects .export-card,
body.vari-projects .note-history article,
body.vari-projects .dialog-subject {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-projects .project-list > button.active,
body.vari-projects .research-command {
  background: var(--vari-blue-soft) !important;
  border-color: #8dbfc9 !important;
}

body.vari-projects .portfolio-metrics > :nth-child(6n + 1),
body.vari-projects .project-metrics > :nth-child(6n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-projects .portfolio-metrics > :nth-child(6n + 2),
body.vari-projects .project-metrics > :nth-child(6n + 2) { background: var(--vari-mint) !important; }
body.vari-projects .portfolio-metrics > :nth-child(6n + 3),
body.vari-projects .project-metrics > :nth-child(6n + 3) { background: var(--vari-peach) !important; }
body.vari-projects .portfolio-metrics > :nth-child(6n + 4),
body.vari-projects .project-metrics > :nth-child(6n + 4) { background: var(--vari-coral) !important; }
body.vari-projects .portfolio-metrics > :nth-child(6n + 5),
body.vari-projects .project-metrics > :nth-child(6n + 5) { background: var(--vari-sage) !important; }
body.vari-projects .portfolio-metrics > :nth-child(6n),
body.vari-projects .project-metrics > :nth-child(6n) { background: var(--vari-canvas-2) !important; }

body.vari-projects select,
body.vari-projects input,
body.vari-projects textarea,
body.vari-projects .status-select {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.vari-dashboard .workspace-panel.wide .card-head,
body.vari-dashboard .research-method,
body.vari-dashboard .linked-paper,
body.vari-dashboard .drawer-status,
body.vari-dashboard .map-hint,
body.vari-dashboard .comparison-summary,
body.vari-dashboard .evidence-strip span,
body.vari-dashboard .topic-choices button,
body.vari-dashboard .topic,
body.vari-dashboard .map-legend-item,
body.vari-dashboard .trend-stats span,
body.vari-dashboard .page-btn,
body.vari-dashboard .outline-btn,
body.vari-dashboard .workspace-remove {
  color: var(--vari-ink) !important;
  background: var(--vari-mint) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard .donut::after,
body.vari-dashboard .big-score::after,
body.vari-observatory .big-score::after { background: var(--vari-paper) !important; }

body.vari-community .metric-card,
body.vari-community .space-card,
body.vari-community .feed-toolbar,
body.vari-community .post-card,
body.vari-community .loading-card,
body.vari-community .side-card,
body.vari-community .detail-top,
body.vari-community .contribution-stats span,
body.vari-community .post-tags span,
body.vari-community .post-actions button,
body.vari-community .reaction-btn,
body.vari-community .pagination button,
body.vari-community .secondary-btn,
body.vari-community .dialog-close,
body.vari-community .space-card i,
body.vari-community .linked-paper {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-community .metric-card:nth-child(4n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-community .metric-card:nth-child(4n + 2) { background: var(--vari-mint) !important; }
body.vari-community .metric-card:nth-child(4n + 3) { background: var(--vari-peach) !important; }
body.vari-community .metric-card:nth-child(4n) { background: var(--vari-sage) !important; }

body.vari-broadcast .broadcast-directory > a,
body.vari-broadcast #priorityOptions label,
body.vari-broadcast #gradeOptions label,
body.vari-broadcast .panel,
body.vari-broadcast .settings-panel,
body.vari-broadcast .settings-panel > header,
body.vari-broadcast .broadcast-channel-picker,
body.vari-broadcast .field,
body.vari-broadcast .email-delivery,
body.vari-broadcast .score-fields,
body.vari-broadcast .history-pagination,
body.vari-broadcast .empty-icon,
body.vari-broadcast .analysis-box,
body.vari-broadcast .brief-card,
body.vari-broadcast .summary-metrics > *,
body.vari-broadcast .time-chip,
body.vari-broadcast .channel-tabs button,
body.vari-broadcast .option-cloud label,
body.vari-broadcast .check-row label,
body.vari-broadcast .github-toggle,
body.vari-broadcast .ccf-broadcast-filter {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-broadcast .summary-metrics > :nth-child(4n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-broadcast .summary-metrics > :nth-child(4n + 2) { background: var(--vari-mint) !important; }
body.vari-broadcast .summary-metrics > :nth-child(4n + 3) { background: var(--vari-peach) !important; }
body.vari-broadcast .summary-metrics > :nth-child(4n) { background: var(--vari-sage) !important; }

body.vari-broadcast .score-fields select,
body.vari-broadcast .score-fields input,
body.vari-broadcast #recipientEmail,
body.vari-broadcast #newTime,
body.vari-broadcast #voiceSelect {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.vari-broadcast-studio .metrics div,
body.vari-broadcast-studio .panel,
body.vari-broadcast-studio .template-card,
body.vari-broadcast-studio .draft-row,
body.vari-broadcast-studio .publication-row,
body.vari-broadcast-studio .workflow-actions button,
body.vari-broadcast-studio .section-head,
body.vari-broadcast-studio .section-head textarea,
body.vari-broadcast-studio .studio-item,
body.vari-broadcast-studio .item-actions button,
body.vari-broadcast-studio .analyst-input,
body.vari-broadcast-studio .preview-overview,
body.vari-broadcast-studio .preview-item aside,
body.vari-broadcast-studio .confirm-check {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.94) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-comparison .executive {
  color: var(--vari-ink) !important;
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-mint)) !important;
  border-color: var(--vari-line) !important;
}

body.vari-comparison .matrix-wrap thead th,
body.vari-comparison .matrix-wrap tbody th { color: var(--vari-ink) !important; background: var(--vari-sage) !important; }

body.vari-ui .product-context-rail {
  color: var(--vari-body) !important;
  background: rgba(221, 236, 232, 0.94) !important;
  border-color: var(--vari-line) !important;
  box-shadow: 0 4px 14px rgba(73, 86, 77, 0.05) !important;
}

body.vari-ui .product-context-home,
body.vari-ui .product-context-link,
body.vari-ui .product-context-title {
  color: var(--vari-body) !important;
}

body.vari-ui .product-context-link:hover,
body.vari-ui .product-context-link.current,
body.vari-ui .product-context-home.current {
  color: var(--vari-ink) !important;
  background: rgba(153, 205, 216, 0.34) !important;
}

body.vari-ui .product-nav .nav-menu a {
  color: var(--vari-body) !important;
}

body.vari-ui .product-nav .nav-menu a:hover,
body.vari-ui .product-nav .nav-menu a.current {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
}

body.vari-ui .product-nav .nav-menu::before {
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

.vari-login .entry-brand > span,
.vari-login .entry-institute > span {
  color: var(--vari-ink) !important;
  background: none !important;
  -webkit-text-fill-color: var(--vari-ink) !important;
  text-shadow: none !important;
}

.vari-login .trust-list span {
  color: var(--vari-ink) !important;
  background: var(--vari-sage) !important;
  border-color: #b5c0af !important;
  font-size: 11px !important;
}

/* ========================================================================== */
/* 2026-08-31 v4 · authenticated product workspace                            */
/* This final layer intentionally wins over legacy phase CSS and removes the   */
/* remaining dark islands without changing business layout or route contracts. */
/* ========================================================================== */

body.vari-ui:not(.vari-login):not(.vari-register) {
  --vari-app-paper: rgba(252, 250, 245, 0.96);
  --vari-app-quiet: rgba(221, 236, 232, 0.68);
  --vari-app-line: rgba(101, 113, 102, 0.18);
  --vari-app-shadow: 0 10px 28px rgba(73, 86, 77, 0.075);
  min-height: 100vh;
}

body.vari-ui > header,
body.vari-ui .topbar,
body.vari-ui .obs-topbar,
body.vari-ui .project-topbar,
body.vari-ui .community-topbar,
body.vari-ui .broadcast-topbar,
body.vari-ui .studio-top,
body.vari-ui .compare-topbar,
body.vari-ui .app-topbar,
body.vari-ui > header.top {
  min-height: 72px !important;
  background: rgba(252, 250, 245, 0.96) !important;
  border-bottom: 1px solid var(--vari-line) !important;
  box-shadow: 0 5px 24px rgba(73, 86, 77, 0.06) !important;
}

body.vari-ui .brand,
body.vari-ui .brand-lockup,
body.vari-ui .compare-brand {
  min-width: max-content;
}

body.vari-ui .brand-mark,
body.vari-ui .project-topbar .brand > span,
body.vari-ui .obs-topbar .brand > span,
body.vari-ui .project-topbar .brand > span,
body.vari-ui .studio-top .brand > span,
body.vari-ui .compare-brand > span {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  box-shadow: inset 0 0 0 1px rgba(82, 127, 136, 0.16) !important;
}

body.vari-ui .brand b,
body.vari-ui .brand-lockup b,
body.vari-ui .compare-brand b {
  font-size: 14px !important;
  color: var(--vari-ink) !important;
}

body.vari-ui .brand small,
body.vari-ui .brand-lockup small,
body.vari-ui .compare-brand small {
  margin-top: 3px !important;
  font-size: 10px !important;
  color: var(--vari-muted) !important;
}

body.vari-ui .workspace,
body.vari-ui .detail-workspace,
body.vari-ui .obs-shell,
body.vari-ui .project-shell,
body.vari-ui .community-shell,
body.vari-ui .studio-shell,
body.vari-ui .broadcast-shell,
body.vari-ui .compare-shell,
body.vari-ui .publication-shell,
body.vari-ui .identity-shell,
body.vari-ui .cc-shell,
body.vari-ui .chat-shell,
body.vari-ui > main {
  background: transparent !important;
}

/* One predictable button hierarchy across workspaces. */
body.vari-ui button,
body.vari-ui a[class*="btn"],
body.vari-ui a[class*="action"],
body.vari-ui .link-button {
  min-height: 38px;
  border-radius: 10px !important;
  font-weight: 700 !important;
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

body.vari-ui button:hover:not(:disabled),
body.vari-ui a[class*="btn"]:hover,
body.vari-ui a[class*="action"]:hover,
body.vari-ui .link-button:hover {
  transform: translateY(-1px);
}

body.vari-ui .primary,
body.vari-ui .primary-btn,
body.vari-ui .primary-action,
body.vari-ui .solid-btn,
body.vari-ui button.primary,
body.vari-ui a.primary {
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  border: 1px solid #7fb5c0 !important;
  box-shadow: 0 5px 14px rgba(111, 169, 181, 0.14) !important;
}

body.vari-ui .secondary-btn,
body.vari-ui .secondary-action,
body.vari-ui .outline-btn,
body.vari-ui .ghost-btn,
body.vari-ui .research-ghost,
body.vari-ui button:not(.primary):not(.primary-btn):not(.solid-btn):not(.danger):not(.destructive):not(.nav-root) {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
  box-shadow: none !important;
}

body.vari-ui .secondary-btn:hover,
body.vari-ui .secondary-action:hover,
body.vari-ui .outline-btn:hover,
body.vari-ui .ghost-btn:hover,
body.vari-ui .research-ghost:hover,
body.vari-ui button:not(.primary):not(.primary-btn):not(.solid-btn):not(.danger):not(.destructive):not(.nav-root):hover {
  background: var(--vari-mint) !important;
  border-color: #9dbab1 !important;
}

body.vari-ui button:disabled,
body.vari-ui a[aria-disabled="true"] {
  color: #8b948e !important;
  background: #e8e8e1 !important;
  border-color: #d4d8d1 !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: not-allowed !important;
}

/* Dashboard / intelligence hub. */
body.vari-dashboard .ticker {
  min-height: 34px !important;
  color: var(--vari-body) !important;
  background: rgba(221, 236, 232, 0.78) !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard .workspace {
  padding-top: 30px !important;
}

body.vari-dashboard .page-head,
body.vari-dashboard .research-hero,
body.vari-dashboard .workspace-head {
  padding: clamp(28px, 3vw, 48px) !important;
  border: 1px solid var(--vari-app-line) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(153, 205, 216, 0.50), transparent 31%),
    linear-gradient(118deg, rgba(221, 236, 232, 0.90), rgba(252, 250, 245, 0.94) 54%, rgba(253, 224, 211, 0.75)) !important;
  box-shadow: var(--vari-app-shadow) !important;
}

body.vari-dashboard .page-head h1,
body.vari-dashboard .research-hero h1,
body.vari-dashboard .workspace-head h1 {
  color: var(--vari-ink) !important;
}

body.vari-dashboard .update-pill {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.78) !important;
  border: 1px solid var(--vari-line-strong) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}

body.vari-dashboard .metric-grid > .metric,
body.vari-dashboard .metric {
  min-height: 132px !important;
  border: 1px solid var(--vari-app-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}

body.vari-dashboard .metric:nth-child(6n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-dashboard .metric:nth-child(6n + 2) { background: var(--vari-mint) !important; }
body.vari-dashboard .metric:nth-child(6n + 3) { background: var(--vari-peach) !important; }
body.vari-dashboard .metric:nth-child(6n + 4) { background: var(--vari-coral) !important; }
body.vari-dashboard .metric:nth-child(6n + 5) { background: var(--vari-sage) !important; }
body.vari-dashboard .metric:nth-child(6n) { background: var(--vari-canvas-2) !important; }

body.vari-dashboard .card,
body.vari-dashboard .filter-console,
body.vari-dashboard .table-card,
body.vari-dashboard .research-console,
body.vari-dashboard .research-card,
body.vari-dashboard .research-method,
body.vari-dashboard .workspace-panel,
body.vari-dashboard .comparison-grid article,
body.vari-dashboard .topic-workspace article,
body.vari-dashboard .report-grid section {
  color: var(--vari-body) !important;
  background: var(--vari-app-paper) !important;
  border: 1px solid var(--vari-app-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--vari-app-shadow) !important;
}

body.vari-dashboard .card-head,
body.vari-dashboard .workspace-panel.wide .card-head {
  background: rgba(221, 236, 232, 0.58) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard .seg-tabs,
body.vari-dashboard .research-tabs,
body.vari-dashboard .research-filter-grid {
  background: rgba(248, 245, 238, 0.88) !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard .seg-tabs button.active,
body.vari-dashboard .research-tabs button.active {
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  border-color: #7fb5c0 !important;
}

body.vari-dashboard .intel-row:hover,
body.vari-dashboard .high-risk-item:hover,
body.vari-dashboard tbody tr:hover,
body.vari-dashboard .research-latest a:hover {
  background: rgba(221, 236, 232, 0.58) !important;
}

body.vari-dashboard .search-row,
body.vari-dashboard .research-search,
body.vari-dashboard input,
body.vari-dashboard select,
body.vari-dashboard textarea {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
  border-bottom-color: var(--vari-line-strong) !important;
}

body.vari-dashboard .region-map,
body.vari-dashboard .research-visual,
body.vari-dashboard .research-focus {
  color: var(--vari-ink) !important;
  background:
    radial-gradient(circle at 72% 22%, rgba(153, 205, 216, 0.44), transparent 34%),
    linear-gradient(145deg, var(--vari-mint), var(--vari-blue-soft)) !important;
}

body.vari-dashboard .region-map .svgMap-country {
  fill: #cdd4c4 !important;
  stroke: #91aaa2 !important;
}

body.vari-dashboard .drawer {
  color: var(--vari-body) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line) !important;
  box-shadow: -18px 0 45px rgba(73, 86, 77, 0.14) !important;
}

/* Intelligence detail: remove the dark rails and bar-shaped container bleed. */
body.vari-intelligence .detail-workspace {
  max-width: 1480px !important;
  padding-top: 28px !important;
}

body.vari-intelligence #detail,
body.vari-intelligence .detail-grid,
body.vari-intelligence .detail-main,
body.vari-intelligence .detail-side,
body.vari-intelligence .detail-grid > * {
  color: var(--vari-body) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.vari-intelligence .detail-hero {
  border-radius: 22px !important;
  background: linear-gradient(118deg, var(--vari-blue-soft), var(--vari-mint) 56%, var(--vari-peach)) !important;
}

body.vari-intelligence .detail-card,
body.vari-intelligence .fact-card,
body.vari-intelligence .source-card,
body.vari-intelligence .score-pair article {
  color: var(--vari-body) !important;
  background: var(--vari-app-paper) !important;
  border: 1px solid var(--vari-app-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--vari-app-shadow) !important;
  overflow: hidden;
}

body.vari-intelligence .card-head {
  background: rgba(221, 236, 232, 0.58) !important;
}

body.vari-intelligence .brief-grid section,
body.vari-intelligence .research-analysis-grid section,
body.vari-intelligence .notice,
body.vari-intelligence .score-note {
  color: var(--vari-body) !important;
  background: rgba(248, 245, 238, 0.92) !important;
  border-color: var(--vari-line) !important;
}

body.vari-intelligence .research-focus {
  color: var(--vari-ink) !important;
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-mint)) !important;
}

/* Discovery, research projects and evidence observatory. */
body.vari-discovery .hero,
body.vari-projects .project-hero,
body.vari-observatory .hero {
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 86% 12%, rgba(153, 205, 216, 0.52), transparent 31%),
    linear-gradient(118deg, var(--vari-mint), var(--vari-paper) 55%, var(--vari-peach)) !important;
}

body.vari-discovery .metrics > *,
body.vari-observatory .metrics > *,
body.vari-projects .portfolio-metrics > *,
body.vari-projects .project-metrics > * {
  min-height: 112px !important;
  border: 1px solid var(--vari-app-line) !important;
  border-radius: 15px !important;
  box-shadow: none !important;
}

body.vari-discovery .workspace > aside,
body.vari-discovery .workspace > .panel,
body.vari-discovery .panel,
body.vari-observatory .module-panel,
body.vari-observatory .repo-card,
body.vari-observatory .detail-panel,
body.vari-observatory .surface,
body.vari-observatory .toolbar,
body.vari-projects .project-sidebar,
body.vari-projects .project-stage,
body.vari-projects .panel,
body.vari-projects .menu-panel,
body.vari-projects .agent-workbench,
body.vari-projects .agent-workbench button {
  color: var(--vari-body) !important;
  background: var(--vari-app-paper) !important;
  border-color: var(--vari-app-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--vari-app-shadow) !important;
}

body.vari-discovery .runs button,
body.vari-observatory .module-tabs button,
body.vari-projects .project-tabs button {
  color: var(--vari-body) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line) !important;
  border-radius: 12px !important;
}

body.vari-discovery .runs button.active,
body.vari-observatory .module-tabs button.active,
body.vari-projects .project-tabs button.active {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
  border-color: #8dbfc9 !important;
  box-shadow: 0 6px 18px rgba(111, 169, 181, 0.12) !important;
}

body.vari-observatory .graph-stage {
  background:
    radial-gradient(circle at 50% 45%, rgba(153, 205, 216, 0.62), transparent 40%),
    linear-gradient(145deg, var(--vari-mint), var(--vari-blue-soft)) !important;
  border: 1px solid var(--vari-line) !important;
}

body.vari-observatory .graph-stage::before {
  background-image: linear-gradient(rgba(101,113,102,.09) 1px,transparent 1px), linear-gradient(90deg,rgba(101,113,102,.09) 1px,transparent 1px) !important;
}

body.vari-observatory .graph-legend span {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, 0.90) !important;
}

/* Interactive product demonstration on the public landing page. */
.vari-landing .product-demo {
  position: relative;
}

.vari-landing .demo-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  min-height: 650px;
  padding: clamp(28px, 4vw, 64px);
  border: 1px solid var(--vari-line);
  border-radius: 36px;
  background: linear-gradient(135deg, rgba(221,236,232,.88), rgba(252,250,245,.95) 52%, rgba(253,224,211,.74));
  box-shadow: 0 24px 70px rgba(73, 86, 77, .10);
  overflow: hidden;
}

.vari-landing .demo-visual {
  --demo-rx: 0deg;
  --demo-ry: 0deg;
  position: relative;
  min-height: 520px;
  perspective: 1100px;
}

.vari-landing .demo-network {
  position: absolute;
  inset: 7% 4%;
  transform: rotateX(var(--demo-rx)) rotateY(var(--demo-ry));
  transform-style: preserve-3d;
  transition: transform .18s ease-out;
}

.vari-landing .demo-network::before,
.vari-landing .demo-network::after {
  content: "";
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(111, 169, 181, .30);
  border-radius: 50%;
}

.vari-landing .demo-network::after {
  inset: 25%;
  border-color: rgba(101, 113, 102, .20);
}

.vari-landing .demo-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.vari-landing .demo-lines path {
  fill: none;
  stroke: rgba(82, 127, 136, .30);
  stroke-width: 1.2;
  stroke-dasharray: 5 7;
  vector-effect: non-scaling-stroke;
}

.vari-landing .demo-lines path.active {
  stroke: #6fa9b5;
  stroke-width: 2.4;
  stroke-dasharray: none;
  filter: drop-shadow(0 0 5px rgba(111,169,181,.34));
}

.vari-landing .demo-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 170px;
  height: 170px;
  transform: translate(-50%, -50%) translateZ(36px);
  display: grid;
  place-items: center;
  text-align: center;
  border: 1px solid #87b7c0;
  border-radius: 42% 58% 52% 48%;
  color: var(--vari-ink);
  background: rgba(153, 205, 216, .86);
  box-shadow: 0 24px 55px rgba(111,169,181,.22), inset 0 0 0 13px rgba(252,250,245,.28);
  animation: demoMorph 9s ease-in-out infinite;
}

.vari-landing .demo-core b,
.vari-landing .demo-core small { display: block; }
.vari-landing .demo-core b { font-size: 23px; }
.vari-landing .demo-core small { margin-top: 7px; font: 700 10px/1.4 Consolas, monospace; letter-spacing: .12em; }

.vari-landing .demo-node {
  position: absolute;
  width: 150px;
  min-height: 74px;
  padding: 12px 14px;
  border: 1px solid rgba(101,113,102,.22);
  border-radius: 16px;
  color: var(--vari-body);
  background: rgba(252,250,245,.92);
  box-shadow: 0 10px 26px rgba(73,86,77,.08);
  text-align: left;
  cursor: pointer;
  transform: translate(-50%, -50%) translateZ(12px);
}

.vari-landing .demo-node b,
.vari-landing .demo-node small { display: block; }
.vari-landing .demo-node b { color: var(--vari-ink); font-size: 14px; }
.vari-landing .demo-node small { margin-top: 5px; color: var(--vari-muted); font-size: 11px; }
.vari-landing .demo-node:nth-of-type(1) { left: 18%; top: 18%; background: var(--vari-blue-soft); }
.vari-landing .demo-node:nth-of-type(2) { left: 80%; top: 19%; background: var(--vari-mint); }
.vari-landing .demo-node:nth-of-type(3) { left: 90%; top: 65%; background: var(--vari-peach); }
.vari-landing .demo-node:nth-of-type(4) { left: 50%; top: 88%; background: var(--vari-coral); }
.vari-landing .demo-node:nth-of-type(5) { left: 10%; top: 66%; background: var(--vari-sage); }

.vari-landing .demo-node:hover,
.vari-landing .demo-node.active {
  border-color: #6fa9b5;
  box-shadow: 0 16px 34px rgba(73,86,77,.14), 0 0 0 4px rgba(153,205,216,.18);
  transform: translate(-50%, -50%) translateZ(42px) scale(1.035);
}

.vari-landing .demo-copy {
  min-height: 440px;
  padding: clamp(24px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgba(101,113,102,.18);
  border-radius: 24px;
  background: rgba(252,250,245,.82);
}

.vari-landing .demo-step {
  color: #527f88;
  font: 800 11px/1 Consolas, monospace;
  letter-spacing: .14em;
}

.vari-landing .demo-copy h3 {
  margin: 17px 0 12px;
  color: var(--vari-ink);
  font-size: clamp(28px, 3vw, 46px);
  line-height: 1.12;
}

.vari-landing .demo-copy > p {
  margin: 0;
  color: var(--vari-body);
  font-size: 16px;
  line-height: 1.85;
}

.vari-landing .demo-points {
  display: grid;
  gap: 10px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}

.vari-landing .demo-points li {
  display: flex;
  gap: 10px;
  color: var(--vari-body);
  font-size: 14px;
}

.vari-landing .demo-points li::before {
  content: "";
  width: 9px;
  height: 9px;
  margin-top: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #6fa9b5;
  box-shadow: 0 0 0 5px rgba(153,205,216,.20);
}

.vari-landing .demo-progress {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 7px;
  margin-top: auto;
  padding-top: 32px;
}

.vari-landing .demo-progress button {
  height: 7px;
  min-height: 7px;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: var(--vari-sage);
  cursor: pointer;
}

.vari-landing .demo-progress button.active { background: #6fa9b5; }

@keyframes demoMorph {
  0%, 100% { border-radius: 42% 58% 52% 48%; transform: translate(-50%, -50%) translateZ(36px) rotate(-2deg); }
  50% { border-radius: 57% 43% 44% 56%; transform: translate(-50%, -50%) translateZ(46px) rotate(3deg); }
}

@media (max-width: 980px) {
  .vari-landing .demo-shell { grid-template-columns: 1fr; }
  .vari-landing .demo-copy { min-height: 360px; }
}

@media (max-width: 620px) {
  .vari-landing .demo-shell { padding: 18px; border-radius: 24px; }
  .vari-landing .demo-visual { min-height: 430px; }
  .vari-landing .demo-core { width: 130px; height: 130px; }
  .vari-landing .demo-node { width: 116px; padding: 10px; }
  .vari-landing .demo-node small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .vari-landing .demo-core { animation: none !important; }
  .vari-landing .demo-network { transform: none !important; }
}

/* Final residual cleanup: legacy page styles must not leave isolated dark rails. */
body.vari-ui.vari-intelligence .breadcrumb {
  padding: 0 !important;
  color: var(--vari-muted) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.vari-ui.vari-intelligence .breadcrumb a {
  color: #527f88 !important;
}

body.vari-ui.vari-projects .workflow-map {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .82) !important;
  border-color: rgba(101, 113, 102, .20) !important;
  box-shadow: 0 16px 38px rgba(73, 86, 77, .10) !important;
}

body.vari-ui.vari-projects .workflow-map span {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
  border-color: #b7d6dc !important;
}

body.vari-ui.vari-projects .workflow-map span:nth-of-type(2) { background: var(--vari-mint) !important; }
body.vari-ui.vari-projects .workflow-map span:nth-of-type(3) { background: var(--vari-peach) !important; }
body.vari-ui.vari-projects .workflow-map span:nth-of-type(4) { background: var(--vari-coral) !important; }
body.vari-ui.vari-projects .workflow-map i { background: #6fa9b5 !important; }
body.vari-ui.vari-projects .workflow-map i::after { border-left-color: #6fa9b5 !important; }

/* ========================================================================
 * VARI Research Hub · internal product convergence v6
 * Point-to-point cleanup for legacy modules that still declared dark
 * component surfaces after the shared palette was introduced.
 * ====================================================================== */

/* Shared internal canvas: calm paper, visible text and centred work areas. */
body.vari-dashboard,
body.vari-intelligence,
body.vari-projects,
body.vari-observatory,
body.vari-comparison,
body.vari-community,
body.publication-workspace,
body.vari-broadcast,
body.vari-broadcast-studio {
  color: var(--vari-ink) !important;
  background-color: var(--vari-canvas) !important;
  background-image:
    radial-gradient(circle at 8% 18%, rgba(153, 205, 216, .27), transparent 28%),
    radial-gradient(circle at 92% 10%, rgba(253, 224, 211, .30), transparent 30%),
    radial-gradient(circle at 52% 94%, rgba(221, 236, 232, .34), transparent 34%) !important;
  background-attachment: fixed !important;
}

/* Intelligence command centre: all four views and both research views. */
body.vari-dashboard .screen,
body.vari-dashboard .screen.active,
body.vari-dashboard .dashboard-grid,
body.vari-dashboard .research-layout,
body.vari-dashboard .workspace-layout,
body.vari-dashboard .workspace-board,
body.vari-dashboard .intel-list,
body.vari-dashboard .high-risk-list,
body.vari-dashboard .research-grid,
body.vari-dashboard .research-latest,
body.vari-dashboard .topic-cloud,
body.vari-dashboard .table-wrap {
  color: var(--vari-body) !important;
  background-color: transparent !important;
  background-image: none !important;
}

body.vari-dashboard .workspace {
  width: min(1780px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.vari-dashboard .page-head,
body.vari-dashboard .research-hero,
body.vari-dashboard .workspace-head {
  min-height: 200px !important;
  padding: clamp(28px, 3vw, 48px) !important;
  color: var(--vari-ink) !important;
  background:
    radial-gradient(circle at 88% 16%, rgba(153,205,216,.45), transparent 28%),
    linear-gradient(118deg, var(--vari-mint), var(--vari-paper) 56%, var(--vari-peach)) !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--vari-shadow) !important;
}

body.vari-dashboard .page-head p,
body.vari-dashboard .research-hero p,
body.vari-dashboard .workspace-head p,
body.vari-dashboard .metric span,
body.vari-dashboard .metric small,
body.vari-dashboard .intel-row p,
body.vari-dashboard .research-card p,
body.vari-dashboard .research-latest small {
  color: var(--vari-body) !important;
}

body.vari-dashboard .card,
body.vari-dashboard .table-card,
body.vari-dashboard .filter-console,
body.vari-dashboard .research-console,
body.vari-dashboard .workspace-panel,
body.vari-dashboard .research-side > *,
body.vari-dashboard .research-latest > *,
body.vari-dashboard .intel-row,
body.vari-dashboard .high-risk-item,
body.vari-dashboard .topic,
body.vari-dashboard .research-card,
body.vari-dashboard .comparison-card,
body.vari-dashboard .workspace-item {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .95) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-dashboard .research-card header,
body.vari-dashboard .research-card-cover,
body.vari-dashboard .research-visual,
body.vari-dashboard .research-focus,
body.vari-dashboard .map-card,
body.vari-dashboard .chart-card {
  color: var(--vari-ink) !important;
  background: linear-gradient(135deg, var(--vari-blue-soft), var(--vari-mint) 58%, var(--vari-peach)) !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard table,
body.vari-dashboard thead,
body.vari-dashboard tbody,
body.vari-dashboard tr,
body.vari-dashboard th,
body.vari-dashboard td {
  color: var(--vari-body) !important;
  background: transparent !important;
  border-color: var(--vari-line) !important;
}

body.vari-dashboard thead th {
  color: var(--vari-ink) !important;
  background: var(--vari-mint) !important;
}

/* Intelligence detail: use the available viewport and keep the reading rail centred. */
body.vari-intelligence .detail-workspace {
  width: min(1760px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}

body.vari-intelligence #detail,
body.vari-intelligence .detail-grid {
  width: 100% !important;
  margin-inline: auto !important;
}

body.vari-intelligence .detail-grid {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
  gap: 18px !important;
  align-items: start !important;
}

body.vari-intelligence .detail-main,
body.vari-intelligence .detail-side {
  min-width: 0 !important;
}

body.vari-intelligence .detail-hero {
  width: 100% !important;
  min-height: 190px !important;
  padding: clamp(26px, 3vw, 44px) !important;
  box-shadow: var(--vari-shadow) !important;
}

/* Research project workbench: tab rail, execution actions and later phases. */
body.vari-ui.vari-projects .project-shell {
  width: min(1860px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.vari-ui.vari-projects .project-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 10px !important;
  color: var(--vari-body) !important;
  background: rgba(221, 236, 232, .66) !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 15px !important;
}

body.vari-ui.vari-projects .project-tabs button {
  min-height: 40px !important;
  padding: 9px 15px !important;
  color: var(--vari-body) !important;
  background: var(--vari-paper) !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 10px !important;
}

body.vari-ui.vari-projects .project-tabs button.active {
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  border-color: #83b8c3 !important;
}

body.vari-ui.vari-projects .execution-center,
body.vari-ui.vari-projects .execution-action,
body.vari-ui.vari-projects .execution-action.blocked,
body.vari-ui.vari-projects .execution-run,
body.vari-ui.vari-projects .execution-run-detail,
body.vari-ui.vari-projects .execution-review-dialog,
body.vari-ui.vari-projects .phase56-run,
body.vari-ui.vari-projects .phase56-artifact,
body.vari-ui.vari-projects .phase56-plan article,
body.vari-ui.vari-projects .phase56-checks article,
body.vari-ui.vari-projects .phase56-tool-results article,
body.vari-ui.vari-projects .phase56-metrics article,
body.vari-ui.vari-projects .phase56-generator,
body.vari-ui.vari-projects .phase7-card,
body.vari-ui.vari-projects .phase7-section,
body.vari-ui.vari-projects .phase7-item,
body.vari-ui.vari-projects .phase7-result {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .96) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-ui.vari-projects .execution-action:nth-child(3n + 1),
body.vari-ui.vari-projects .phase56-checks article:nth-child(3n + 1),
body.vari-ui.vari-projects .phase7-card:nth-child(3n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-ui.vari-projects .execution-action:nth-child(3n + 2),
body.vari-ui.vari-projects .phase56-checks article:nth-child(3n + 2),
body.vari-ui.vari-projects .phase7-card:nth-child(3n + 2) { background: var(--vari-mint) !important; }
body.vari-ui.vari-projects .execution-action:nth-child(3n),
body.vari-ui.vari-projects .phase56-checks article:nth-child(3n),
body.vari-ui.vari-projects .phase7-card:nth-child(3n) { background: var(--vari-peach) !important; }

body.vari-ui.vari-projects .execution-center h3,
body.vari-ui.vari-projects .execution-center h4,
body.vari-ui.vari-projects .execution-action h4,
body.vari-ui.vari-projects .execution-run h4,
body.vari-ui.vari-projects .phase56-metrics strong,
body.vari-ui.vari-projects .phase56-plan dd {
  color: var(--vari-ink) !important;
}

body.vari-ui.vari-projects .execution-center p,
body.vari-ui.vari-projects .execution-action p,
body.vari-ui.vari-projects .execution-run p,
body.vari-ui.vari-projects .phase56-run p,
body.vari-ui.vari-projects .phase56-artifact p,
body.vari-ui.vari-projects .phase56-plan p,
body.vari-ui.vari-projects .phase56-checks span,
body.vari-ui.vari-projects .phase56-metrics span {
  color: var(--vari-body) !important;
}

body.vari-ui.vari-projects .execution-center button,
body.vari-ui.vari-projects .execution-run > footer button,
body.vari-ui.vari-projects .execution-run-detail > [data-close-run-detail] {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.vari-ui.vari-projects .execution-action.ready > footer button,
body.vari-ui.vari-projects .execution-center > header button:first-of-type {
  background: var(--vari-blue) !important;
  border-color: #83b8c3 !important;
}

body.vari-ui.vari-projects .execution-progress,
body.vari-ui.vari-projects .phase56-progress {
  background: var(--vari-sage) !important;
}

body.vari-ui.vari-projects .execution-run-detail pre,
body.vari-ui.vari-projects .phase56-artifact pre {
  color: var(--vari-body) !important;
  background: var(--vari-canvas-2) !important;
  border: 1px solid var(--vari-line) !important;
}

body.vari-ui.vari-projects .phase56-policy,
body.vari-ui.vari-projects .phase56-empty,
body.vari-ui.vari-projects .phase7-badge {
  color: var(--vari-body) !important;
  background: var(--vari-mint) !important;
  border-color: var(--vari-line) !important;
}

/* Research observatory / GitHub deep research. */
body.vari-observatory .obs-shell {
  width: min(1800px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.vari-observatory .hero-flow {
  color: var(--vari-ink) !important;
  background: rgba(252, 250, 245, .84) !important;
  border-color: var(--vari-line) !important;
  box-shadow: 0 12px 28px rgba(73,86,77,.08) !important;
}

body.vari-observatory .hero-flow span,
body.vari-observatory .scoreline span,
body.vari-observatory .profile-stats span,
body.vari-observatory .artifact-list span,
body.vari-observatory .diff-grid span,
body.vari-observatory .relation,
body.vari-observatory .mini-timeline article,
body.vari-observatory .relation-list article,
body.vari-observatory .change dl div,
body.vari-observatory .matrix > div,
body.vari-observatory .score-hero {
  color: var(--vari-body) !important;
  background: var(--vari-canvas-2) !important;
  border-color: var(--vari-line) !important;
}

body.vari-observatory .hero-flow span:nth-of-type(1),
body.vari-observatory .scoreline span:nth-child(4n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-observatory .hero-flow span:nth-of-type(2),
body.vari-observatory .scoreline span:nth-child(4n + 2) { background: var(--vari-mint) !important; }
body.vari-observatory .hero-flow span:nth-of-type(3),
body.vari-observatory .scoreline span:nth-child(4n + 3) { background: var(--vari-peach) !important; }

body.vari-observatory .matrix-head {
  color: var(--vari-ink) !important;
  background: var(--vari-mint) !important;
}

body.vari-observatory .graph-node,
body.vari-observatory .graph-node.attack,
body.vari-observatory .graph-node.repository,
body.vari-observatory .graph-node.model,
body.vari-observatory .graph-node.vulnerability,
body.vari-observatory .graph-node.defense {
  color: var(--vari-ink) !important;
  background: rgba(252,250,245,.94) !important;
  border-color: #83b8c3 !important;
  box-shadow: 0 8px 20px rgba(73,86,77,.10) !important;
}

/* Comparison report: remove the dark left rail and dark welcome island. */
body.vari-comparison .compare-shell {
  width: min(1840px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
  grid-template-columns: 320px minmax(0, 1fr) !important;
  gap: 18px !important;
  padding: 24px 0 70px !important;
}

body.vari-comparison .report-sidebar,
body.vari-comparison .report-stage,
body.vari-comparison .compare-welcome,
body.vari-comparison .deep-report > section,
body.vari-comparison .report-titlebar,
body.vari-comparison .profile-grid article,
body.vari-comparison .analysis-grid > div,
body.vari-comparison .decision-grid article,
body.vari-comparison .matrix-wrap {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .95) !important;
  background-image: none !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--vari-shadow) !important;
}

body.vari-comparison .report-sidebar {
  align-self: start !important;
  position: sticky !important;
  top: 96px !important;
  padding: 22px !important;
  border-right: 1px solid var(--vari-line) !important;
}

body.vari-comparison .report-stage {
  min-width: 0 !important;
  padding: 28px !important;
}

body.vari-comparison .compare-welcome {
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(34px, 5vw, 72px) !important;
  background: linear-gradient(128deg, var(--vari-blue-soft), var(--vari-paper) 54%, var(--vari-peach)) !important;
}

body.vari-comparison .capability-grid article:nth-child(4n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-comparison .capability-grid article:nth-child(4n + 2) { background: var(--vari-mint) !important; }
body.vari-comparison .capability-grid article:nth-child(4n + 3) { background: var(--vari-peach) !important; }
body.vari-comparison .capability-grid article:nth-child(4n) { background: var(--vari-sage) !important; }

body.vari-comparison .report-list button,
body.vari-comparison .report-actions button {
  color: var(--vari-body) !important;
  background: var(--vari-canvas-2) !important;
  border-color: var(--vari-line) !important;
}

body.vari-comparison .report-list button.active,
body.vari-comparison .report-list button:hover {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
}

/* Research Hub square: visible contribution status and no dark content islands. */
body.vari-community .community-shell {
  width: min(1760px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.vari-community .contribution-score {
  color: var(--vari-ink) !important;
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-mint)) !important;
  border: 1px solid var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-community .contribution-score small,
body.vari-community .contribution-score strong,
body.vari-community .contribution-score b {
  color: var(--vari-ink) !important;
}

/* Community creator/editor/source pages had their own late dark theme reset. */
body.publication-workspace {
  --studio-text: var(--vari-ink) !important;
  --studio-muted: var(--vari-muted) !important;
  --studio-line: var(--vari-line) !important;
  --studio-bg: var(--vari-canvas) !important;
  --studio-card: var(--vari-paper) !important;
}

body.publication-workspace .publication-shell {
  width: min(1720px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.publication-workspace .publication-header,
body.publication-workspace .studio-metric,
body.publication-workspace .studio-panel,
body.publication-workspace .editor-card,
body.publication-workspace .studio-item,
body.publication-workspace .source-summary,
body.publication-workspace .project-link-panel,
body.publication-workspace .comment-summary,
body.publication-workspace .empty-state {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .95) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.publication-workspace .publication-header {
  padding: 28px !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 20px !important;
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-paper) 54%, var(--vari-peach)) !important;
}

body.publication-workspace .studio-metric:nth-child(6n + 1) { background: var(--vari-blue-soft) !important; }
body.publication-workspace .studio-metric:nth-child(6n + 2) { background: var(--vari-mint) !important; }
body.publication-workspace .studio-metric:nth-child(6n + 3) { background: var(--vari-peach) !important; }
body.publication-workspace .studio-metric:nth-child(6n + 4) { background: var(--vari-coral) !important; }
body.publication-workspace .studio-metric:nth-child(6n + 5) { background: var(--vari-sage) !important; }
body.publication-workspace .studio-metric:nth-child(6n) { background: var(--vari-canvas-2) !important; }

body.publication-workspace .publication-header h1,
body.publication-workspace .studio-panel h2,
body.publication-workspace .studio-panel h3,
body.publication-workspace .studio-item h3,
body.publication-workspace .editor-card h2,
body.publication-workspace .editor-card h3,
body.publication-workspace .studio-metric b {
  color: var(--vari-ink) !important;
}

body.publication-workspace .studio-tabs button,
body.publication-workspace .publication-actions a,
body.publication-workspace .publication-actions button,
body.publication-workspace .studio-btn {
  color: var(--vari-body) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.publication-workspace .studio-tabs button.active,
body.publication-workspace .publication-actions .primary,
body.publication-workspace .studio-btn.primary {
  color: var(--vari-ink) !important;
  background: var(--vari-blue) !important;
  border-color: #83b8c3 !important;
}

body.publication-workspace .editor-card input,
body.publication-workspace .editor-card select,
body.publication-workspace .editor-card textarea,
body.publication-workspace .editor-preview {
  color: var(--vari-ink) !important;
  background: var(--vari-canvas-2) !important;
  border-color: var(--vari-line-strong) !important;
}

body.publication-workspace .status-chip {
  color: var(--vari-body) !important;
  background: var(--vari-mint) !important;
}

/* Broadcast: the page uses `.hero`, not `.broadcast-hero`. */
body.vari-broadcast .broadcast-shell {
  width: min(1780px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

body.vari-broadcast .hero {
  min-height: 220px !important;
  padding: clamp(30px, 3.5vw, 54px) !important;
  color: var(--vari-ink) !important;
  background:
    radial-gradient(circle at 90% 10%, rgba(153,205,216,.52), transparent 30%),
    linear-gradient(120deg, var(--vari-blue-soft), var(--vari-mint) 56%, var(--vari-peach)) !important;
  border: 1px solid var(--vari-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--vari-shadow) !important;
}

body.vari-broadcast .hero h1,
body.vari-broadcast .hero p,
body.vari-broadcast .hero .eyebrow {
  color: var(--vari-ink) !important;
}

body.vari-broadcast .broadcast-directory > a:nth-child(5n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-broadcast .broadcast-directory > a:nth-child(5n + 2) { background: var(--vari-mint) !important; }
body.vari-broadcast .broadcast-directory > a:nth-child(5n + 3) { background: var(--vari-peach) !important; }
body.vari-broadcast .broadcast-directory > a:nth-child(5n + 4) { background: var(--vari-coral) !important; }
body.vari-broadcast .broadcast-directory > a:nth-child(5n) { background: var(--vari-sage) !important; }

body.vari-broadcast .broadcast-directory > a.active {
  outline: 2px solid #6fa9b5 !important;
  outline-offset: 1px !important;
}

body.vari-broadcast .briefing-status,
body.vari-broadcast .briefing-status > div,
body.vari-broadcast .broadcast-items,
body.vari-broadcast .history-list,
body.vari-broadcast .empty-state {
  color: var(--vari-body) !important;
  background: rgba(252, 250, 245, .94) !important;
  border-color: var(--vari-line) !important;
}

body.vari-broadcast .briefing-status > div:nth-child(5n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-broadcast .briefing-status > div:nth-child(5n + 2) { background: var(--vari-mint) !important; }
body.vari-broadcast .briefing-status > div:nth-child(5n + 3) { background: var(--vari-peach) !important; }
body.vari-broadcast .briefing-status > div:nth-child(5n + 4) { background: var(--vari-coral) !important; }
body.vari-broadcast .briefing-status > div:nth-child(5n) { background: var(--vari-sage) !important; }

/* The editorial broadcast studio uses its own studio family. */
body.vari-broadcast-studio .studio-hero,
body.vari-broadcast-studio .studio-directory > a,
body.vari-broadcast-studio .metrics > *,
body.vari-broadcast-studio .panel,
body.vari-broadcast-studio .template-card,
body.vari-broadcast-studio .draft-row,
body.vari-broadcast-studio .publication-row,
body.vari-broadcast-studio .studio-item,
body.vari-broadcast-studio .preview-overview,
body.vari-broadcast-studio .preview-item aside {
  color: var(--vari-body) !important;
  background: rgba(252,250,245,.95) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-broadcast-studio .studio-hero {
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-paper) 55%, var(--vari-peach)) !important;
}

@media (max-width: 1000px) {
  body.vari-intelligence .detail-grid,
  body.vari-comparison .compare-shell {
    grid-template-columns: 1fr !important;
  }

  body.vari-comparison .report-sidebar {
    position: static !important;
  }
}

@media (max-width: 720px) {
  body.vari-dashboard .workspace,
  body.vari-intelligence .detail-workspace,
  body.vari-ui.vari-projects .project-shell,
  body.vari-observatory .obs-shell,
  body.vari-comparison .compare-shell,
  body.vari-community .community-shell,
  body.publication-workspace .publication-shell,
  body.vari-broadcast .broadcast-shell {
    width: calc(100% - 24px) !important;
  }
}

/* ========================================================================
 * VARI Research Hub · visual refinement v7
 * Final pass for legacy dark islands, contrast and brand chrome.
 * ====================================================================== */

/* Keep every internal product surface on the same warm paper canvas. */
body.vari-ui,
body.vari-ui .project-shell,
body.vari-ui .obs-shell,
body.vari-ui .broadcast-shell,
body.vari-ui .community-shell,
body.vari-ui .compare-shell,
body.vari-ui .report-stage,
body.vari-ui .deep-report {
  background-color: var(--vari-canvas) !important;
  background-image: none !important;
}

/* The project workbench had several late-loaded phase styles with navy fills. */
body.vari-projects [class*="phase"],
body.vari-projects [class*="execution"],
body.vari-projects [class*="knowledge"],
body.vari-projects [class*="pipeline"],
body.vari-projects [class*="workflow"] {
  color: var(--vari-body) !important;
  background-color: var(--vari-paper) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
  box-shadow: none !important;
}

body.vari-projects .research-command,
body.vari-projects .collaboration-callout {
  color: var(--vari-ink) !important;
  background: linear-gradient(120deg, var(--vari-blue-soft), var(--vari-paper) 56%, var(--vari-peach)) !important;
  border: 1px solid var(--vari-line) !important;
}

body.vari-projects .research-command p,
body.vari-projects .collaboration-callout p,
body.vari-projects .execution-action p,
body.vari-projects .execution-run p,
body.vari-projects .phase56-run p,
body.vari-projects .phase56-artifact p,
body.vari-projects .phase56-plan p {
  color: var(--vari-body) !important;
}

body.vari-projects .execution-action,
body.vari-projects .execution-action.blocked,
body.vari-projects .execution-run,
body.vari-projects .execution-run-detail,
body.vari-projects .execution-review-dialog,
body.vari-projects .phase56-run,
body.vari-projects .phase56-artifact,
body.vari-projects .phase56-plan article,
body.vari-projects .phase56-checks article,
body.vari-projects .phase56-tool-results article,
body.vari-projects .phase56-metrics article,
body.vari-projects .phase56-generator,
body.vari-projects .phase7-card,
body.vari-projects .phase7-section,
body.vari-projects .phase7-item,
body.vari-projects .phase7-result {
  background: var(--vari-paper) !important;
  color: var(--vari-body) !important;
  border-color: var(--vari-line) !important;
}

body.vari-projects .execution-action:nth-child(3n + 1),
body.vari-projects .phase56-checks article:nth-child(3n + 1),
body.vari-projects .phase7-card:nth-child(3n + 1) { background: var(--vari-blue-soft) !important; }
body.vari-projects .execution-action:nth-child(3n + 2),
body.vari-projects .phase56-checks article:nth-child(3n + 2),
body.vari-projects .phase7-card:nth-child(3n + 2) { background: var(--vari-mint) !important; }
body.vari-projects .execution-action:nth-child(3n),
body.vari-projects .phase56-checks article:nth-child(3n),
body.vari-projects .phase7-card:nth-child(3n) { background: var(--vari-peach) !important; }

body.vari-projects .execution-action h4,
body.vari-projects .execution-run h4,
body.vari-projects .execution-run-detail h4,
body.vari-projects .phase56-metrics strong,
body.vari-projects .phase56-plan dd,
body.vari-projects .progress-stages div,
body.vari-projects .progress-stages b,
body.vari-projects .scope-panel dt,
body.vari-projects .scope-panel dd,
body.vari-projects .pipeline-row,
body.vari-projects .pipeline-row b {
  color: var(--vari-ink) !important;
}

body.vari-projects .execution-center button,
body.vari-projects .execution-run > footer button,
body.vari-projects .execution-run-detail > [data-close-run-detail],
body.vari-projects .execution-review-dialog button {
  color: var(--vari-ink) !important;
  background: var(--vari-paper) !important;
  border-color: var(--vari-line-strong) !important;
}

body.vari-projects .execution-progress,
body.vari-projects .phase56-progress,
body.vari-projects .progress-stages i,
body.vari-projects .pipeline-row > i { background: #dbe6e3 !important; }

/* Comparison report gutters are parent backgrounds, not report content. */
body.vari-comparison .compare-shell,
body.vari-comparison .report-stage,
body.vari-comparison #reportView,
body.vari-comparison .deep-report,
body.vari-comparison .deep-report > section,
body.vari-comparison .analysis-grid,
body.vari-comparison .analysis-grid > div {
  background-color: var(--vari-canvas) !important;
  background-image: none !important;
}
body.vari-comparison .deep-report > section,
body.vari-comparison .report-titlebar,
body.vari-comparison .profile-grid article,
body.vari-comparison .decision-grid article {
  background: var(--vari-paper) !important;
}
body.vari-comparison .deep-report p,
body.vari-comparison .deep-report li,
body.vari-comparison .deep-report dd,
body.vari-comparison .deep-report td,
body.vari-comparison .deep-report small {
  color: var(--vari-body) !important;
}
body.vari-comparison .deep-report h1,
body.vari-comparison .deep-report h2,
body.vari-comparison .deep-report h3,
body.vari-comparison .deep-report h4,
body.vari-comparison .deep-report strong,
body.vari-comparison .deep-report b { color: var(--vari-ink) !important; }

/* Broadcast archive and controls should read as one light editorial surface. */
body.vari-broadcast .history-panel,
body.vari-broadcast .history-panel > header,
body.vari-broadcast .history-search,
body.vari-broadcast .history-list,
body.vari-broadcast .history-pagination,
body.vari-broadcast .history-item,
body.vari-broadcast .history-item:hover,
body.vari-broadcast .history-item.active {
  color: var(--vari-body) !important;
  background: var(--vari-paper) !important;
  background-image: none !important;
  border-color: var(--vari-line) !important;
}
body.vari-broadcast .history-search { background: var(--vari-blue-soft) !important; }
body.vari-broadcast .history-item:hover,
body.vari-broadcast .history-item.active { background: var(--vari-mint) !important; }
body.vari-broadcast .history-panel h2,
body.vari-broadcast .history-panel b,
body.vari-broadcast .history-panel label { color: var(--vari-ink) !important; }
body.vari-broadcast .history-panel small,
body.vari-broadcast .history-panel span { color: var(--vari-body) !important; }

/* A quieter, more premium brand mark and editorial top navigation. */
body.vari-ui .topbar,
body.vari-ui .project-topbar,
body.vari-ui .obs-topbar,
body.vari-ui .community-topbar,
body.vari-ui .broadcast-topbar,
body.vari-ui .studio-top,
body.vari-ui .compare-topbar,
body.vari-ui .app-topbar,
body.vari-ui > header.top {
  background: rgba(252, 250, 245, .97) !important;
  color: var(--vari-ink) !important;
  border-bottom: 1px solid var(--vari-line) !important;
  box-shadow: 0 8px 24px rgba(73, 86, 77, .08) !important;
}
body.vari-ui .brand-mark,
body.vari-ui .obs-topbar .brand > span,
body.vari-ui .studio-top .brand > span,
body.vari-ui .compare-brand > span,
body.vari-ui .community-topbar .brand > span {
  background: linear-gradient(145deg, #34413d 0%, #53645d 58%, #718178 100%) !important;
  color: #fcfaf5 !important;
  border: 1px solid rgba(52, 65, 61, .45) !important;
  border-radius: 12px !important;
  letter-spacing: .06em !important;
  box-shadow: 0 8px 18px rgba(52, 65, 61, .18), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
html body.vari-ui header.project-topbar .brand > .brand-mark,
html body.vari-ui header.obs-topbar .brand > span,
html body.vari-ui header.studio-top .brand > span,
html body.vari-ui header.compare-topbar .compare-brand > span {
  background: linear-gradient(145deg, #34413d 0%, #53645d 58%, #718178 100%) !important;
  background-color: #34413d !important;
  color: transparent !important;
}
body.vari-ui .brand-mark::after,
body.vari-ui .project-topbar .brand > span::after,
body.vari-ui .obs-topbar .brand > span::after,
body.vari-ui .studio-top .brand > span::after,
body.vari-ui .compare-brand > span::after {
  content: "VARI" !important;
  color: #fcfaf5 !important;
  background: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  text-shadow: none !important;
  animation: none !important;
  box-shadow: none !important;
}
body.vari-ui .project-topbar nav a,
body.vari-ui .obs-topbar nav a,
body.vari-ui .studio-top nav a,
body.vari-ui .compare-topbar nav a,
body.vari-ui .community-topbar nav a,
body.vari-ui .broadcast-topbar nav a,
body.vari-ui .app-topbar nav a {
  color: var(--vari-body) !important;
  background: transparent !important;
  border-radius: 0 !important;
  transition: color .18s ease, background-color .18s ease;
}
body.vari-ui .project-topbar nav a:hover,
body.vari-ui .project-topbar nav a.active,
body.vari-ui .obs-topbar nav a:hover,
body.vari-ui .obs-topbar nav a.active,
body.vari-ui .studio-top nav a:hover,
body.vari-ui .studio-top nav a.active,
body.vari-ui .compare-topbar nav a:hover,
body.vari-ui .compare-topbar nav a.active {
  color: var(--vari-ink) !important;
  background: var(--vari-blue-soft) !important;
}
body.vari-ui .project-topbar nav a.active::after,
body.vari-ui .obs-topbar nav a.active::after,
body.vari-ui .studio-top nav a.active::after {
  background: #6fa9b5 !important;
}

body.vari-projects .portfolio-metrics span,
body.vari-projects .project-metrics span,
body.vari-projects .portfolio-metrics small,
body.vari-projects .project-metrics small {
  color: var(--vari-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
body.vari-projects .portfolio-metrics b,
body.vari-projects .project-metrics b {
  color: var(--vari-ink) !important;
}

/* Ensure every visible caption has enough contrast even inside legacy modules. */
body.vari-ui [class*="phase"] small,
body.vari-ui [class*="phase"] span,
body.vari-ui [class*="execution"] small,
body.vari-ui [class*="execution"] span,
body.vari-ui [class*="workflow"] small,
body.vari-ui [class*="workflow"] span {
  color: var(--vari-body) !important;
  text-shadow: none !important;
}
