/* Black, white, and neutral gray visual language. */
:root {
  --visual-accent: #171717;
  --visual-ink: #202020;
  --visual-muted: #666666;
  --visual-border: #e4e4e4;
  --visual-surface: #f5f5f5;
}

/* Layered grays keep the connected architecture legible. */
.project-intro > p { color: var(--visual-muted); }
.project-system { border-color: var(--visual-border); }
.project-layer-tabs.layer-tabs { border-bottom-color: var(--visual-border); }
.project-layer-tabs .layer-tab:not(:first-child) { border-left-color: var(--visual-border); }
.project-layer-tabs .layer-tab:hover { background: #fafafa; }
.project-layer-tabs .layer-tab[aria-selected='true'] { background: #f2f2f2; }
.project-layer-tabs .layer-tab[aria-selected='true']:after { background: var(--visual-accent); }
.project-tab-category { color: #666666; }
.project-tab-category > span { color: #888888; }
.project-tab-product { color: var(--visual-ink); }
.project-tab-caption { color: #737373; }
.project-layer-tabs .layer-tab[aria-selected='true'] .project-tab-category { color: var(--visual-accent); }

.project-system .architecture-visual {
  background: #f6f6f6;
  border-color: var(--visual-border);
}
.project-system .diagram-note .mono,
.project-system .diagram-indicator { color: #737373; }
.project-system .diagram-indicator > span { background: #333333; }
.project-system .diagram-guide { border-color: #cdcdcd; }
.project-system .layer-ring { border-color: #f6f6f6; }
.project-system .ring-work { background: #e3e3e3; }
.project-system .ring-harness { background: #bbbbbb; }
.project-system .architecture-orbit[data-active] .ring-model {
  background: #242424;
  border-color: #f6f6f6;
}
.project-system .architecture-orbit[data-active='work'] .ring-work {
  background: #cecece;
  border-color: #f6f6f6;
}
.project-system .architecture-orbit[data-active='work'] .ring-harness,
.project-system .architecture-orbit[data-active='harness'] .ring-harness {
  background: #666666;
  border-color: #f6f6f6;
}
.project-system .orbit-label { color: #303030; }
.project-system .orbit-label-model { color: #ffffff; }
.project-system .orbit-label-model > span { opacity: 1; }
.project-system .architecture-orbit[data-active='work'] .orbit-label-harness,
.project-system .architecture-orbit[data-active='harness'] .orbit-label-harness { color: #ffffff; }
.project-system .diagram-footer { border-color: #dddddd; color: #737373; }
.project-system .layer-panel > .small-label { color: #737373; }
.project-system .layer-panel > p { color: var(--visual-muted); }
.project-layer-fact { border-color: var(--visual-border); }
.project-layer-fact > span { color: #737373; }
.project-layer-fact > strong { color: var(--visual-accent); }
.project-system .layer-panel > .project-panel-note { color: #737373; }
.project-panel-note strong { color: #444444; }
.project-system .feature-list { color: #5c5c5c; }
.project-system .feature-list .icon,
.project-system .project-panel-link { color: var(--visual-accent); }
.project-system-note { background: #fafafa; border-color: var(--visual-border); }
.project-system-note > p { color: #737373; }
.project-system-note .text-link { color: #333333; }

/* Research scale stays prominent without a color accent. */
.agensh-visual { background: #f7f7f7; box-shadow: inset 0 0 0 1px #e9e9e9; }
.agensh-visual figcaption { color: #666666; }
.agensh-visual figcaption > span:last-child { color: #777777; }
.agensh-scale-callout > span { color: #666666; }
.agensh-scale-callout > strong { color: var(--visual-accent); }

/* Monochrome editorial product illustrations. */
.document-scene, .sheet-scene, .slides-scene, .code-scene { background: #f4f4f4; }
.document-page { border-color: #e0e0e0; box-shadow: 0 8px 22px #0000000b; }
.doc-meta, .document-page p { color: #777777; }
.doc-kicker { color: #555555; }
.doc-rule { background: #dddddd; }
.doc-lines i { background: #e9e9e9; }
.doc-highlight { background: #efefef; color: #444444; }
.note-icon { background: #eeeeee; color: #333333; }
.floating-note { border-color: #e0e0e0; color: #666666; box-shadow: 0 6px 16px #0000000b; }
.floating-note strong { color: #303030; }

.sheet-window { border-color: #dcdcdc; }
.sheet-toolbar { background: #f3f3f3; color: #444444; }
.sheet-toolbar > span, .sheet-formula { color: #777777; }
.sheet-formula { border-color: #e4e4e4; }
.sheet-formula > span { color: #555555; }
.sheet-content table { color: #666666; }
.sheet-content thead { background: #f3f3f3; }
.sheet-content th, .sheet-content td { border-color: #e4e4e4; }
.mini-chart { border-color: #cccccc; }
.mini-chart i { background: #bdbdbd; }
.mini-chart i:nth-child(2) { background: #404040; }
.mini-chart span { color: #777777; }

.slide-preview { background: #e8e8e8; border-color: #dcdcdc; box-shadow: 0 8px 22px #0000000b; }
.slide-preview > span, .slide-foot { color: #666666; }
.slide-thumbnails div { background: #eeeeee; border-color: #dddddd; color: #777777; }
.slide-thumbnails .selected { background: #e4e4e4; border-color: #444444; color: #222222; }
.slide-orbs i { background: linear-gradient(140deg, #bdbdbd, #727272); opacity: .75; }
.slide-orbs i:nth-child(2) { background: linear-gradient(140deg, #969696, #444444); }
.slide-orbs i:nth-child(3) { background: linear-gradient(140deg, #666666, #202020); }

.code-window { background: #202020; border-color: #383838; }
.code-window-top { background: #2b2b2b; border-color: #444444; }
.code-window-top i { background: #777777; }
.code-window-top > span { color: #bbbbbb; }
.code-map > div { color: #dedede; }
.code-comment { color: #aaaaaa; }
.code-number { color: #888888; }
.code-blue { color: #f2f2f2; }

/* Keep Agens 2.0 a clear landmark in the neutral palette. */
.learner-section > .container { background: #f3f3f3; border-color: #e2e2e2; }
.learner-horizon { color: #666666; border-color: #d6d6d6; }
.learner-heading h2, .learner-heading h2 > span { color: #202020; }
.learner-heading > .learner-tagline { color: #333333; }
.learner-copy > p { color: #666666; }
.learning-loop { color: #737373; }
.learning-modes, .learning-modes details { border-color: #d8d8d8; }
.learning-number, .learning-details > span { color: #737373; }
.learning-details p { color: #666666; }