/* =============================================================================
   Hadron Carbon — Domain Architecture (#domain)
   The architecture canvas (network.css) in the domain domain: reference areas, the capabilities the code
   realises, the bounded contexts that realise them and the entities they own; the placement, sector, kind
   and findings lenses; the context and element drawers; the Capability Map, Contexts, Glossary, Rules &
   Lifecycles and Method tabs; and the Capability Portfolio. Colours are the shared tokens, as in
   js/views/views_domain_arch.js.
   ============================================================================= */

/* Every colour is a shared token (tokens.css), which switches with the theme on its own: placement strength on the
   status scale, findings on the severity scale, sectors and dependency traces on the categorical palette. The canvas
   (views_domain_arch.js) reads the same tokens. */
.nx-root[data-domain="domain"] {
  --dm-strong: var(--hx-status-ok); --dm-likely: var(--hx-sev-info); --dm-weak: var(--hx-status-degraded); --dm-unplaced: var(--hx-status-unknown);
  --dm-sev-critical: var(--hx-sev-critical); --dm-sev-high: var(--hx-sev-high); --dm-sev-medium: var(--hx-sev-medium); --dm-sev-low: var(--hx-sev-low);
  --dm-sev-info: var(--hx-sev-info); --dm-sev-clean: var(--hx-status-ok);
  --dm-sector-0: var(--hx-cat-0); --dm-sector-1: var(--hx-cat-1); --dm-sector-2: var(--hx-cat-2); --dm-sector-3: var(--hx-cat-3); --dm-sector-4: var(--hx-cat-4);
  --dm-sector-5: var(--hx-cat-5); --dm-sector-6: var(--hx-cat-6); --dm-sector-7: var(--hx-cat-7); --dm-sector-8: var(--hx-cat-8); --dm-sector-9: var(--hx-cat-9);
  --dm-dep-references: var(--hx-cat-0); --dm-dep-reads: var(--hx-cat-1); --dm-dep-writes: var(--hx-sev-medium); --dm-dep-publishes: var(--hx-status-ok);
  --dm-bad-text: var(--hx-sev-high-text); --dm-good-text: var(--hx-status-ok-text);
}

/* ---------------------------------------------------------------- Colour classes (pills, dots, swatches) */
.nx-root[data-domain="domain"] .dm-st-strong { --c: var(--dm-strong); }
.nx-root[data-domain="domain"] .dm-st-likely { --c: var(--dm-likely); }
.nx-root[data-domain="domain"] .dm-st-weak { --c: var(--dm-weak); }
.nx-root[data-domain="domain"] .dm-st-unplaced { --c: var(--dm-unplaced); }
.nx-root[data-domain="domain"] .dm-strength {
  display: inline-flex; align-items: center; gap: var(--cds-spacing-03); padding: 1px var(--cds-spacing-03) 1px var(--cds-spacing-03); border-radius: var(--hx-radius-chip); font-size: var(--f-xs); line-height: 18px; font-weight: var(--fw-medium);
  white-space: nowrap; color: var(--cds-text-primary);
  background: color-mix(in srgb, var(--c) 18%, transparent); border: 1px solid color-mix(in srgb, var(--c) 55%, transparent);
}
.nx-root[data-domain="domain"] .dm-strength small { color: var(--cds-text-secondary); font-variant-numeric: tabular-nums; }
.nx-root[data-domain="domain"] .dm-strength::before,
.nx-root[data-domain="domain"] .dm-dot { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: var(--hx-radius-round); background: var(--c); flex: none; }
.nx-root[data-domain="domain"] .dm-dot { margin-right: var(--cds-spacing-02); }
.nx-root[data-domain="domain"] .dm-sw { display: inline-block; width: 10px; height: 10px; border-radius: var(--hx-radius-xs); background: var(--c); flex: none; }
.nx-root[data-domain="domain"] .dm-bad, .nx-root[data-domain="domain"] .dm-kpi-bad { color: var(--dm-bad-text); font-weight: var(--fw-semibold); }
.nx-root[data-domain="domain"] .nx-chip.dm-st-strong, .nx-root[data-domain="domain"] .nx-chip.dm-st-likely,
.nx-root[data-domain="domain"] .nx-chip.dm-st-weak, .nx-root[data-domain="domain"] .nx-chip.dm-st-unplaced { border-left: 3px solid var(--c) !important; }
.nx-root[data-domain="domain"] .dm-term { font-family: var(--mono); font-size: var(--f-xs); }
.nx-root[data-domain="domain"] .dm-muted-link { color: var(--cds-text-helper); }

/* ---------------------------------------------------------------- Cards and lenses */
.nx-root[data-domain="domain"] .dm-meta {
  display: flex; align-items: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--f-xs); line-height: 16px; color: var(--cds-text-helper);
}
.nx-root[data-domain="domain"] .dm-meta.dm-sub { display: block; color: var(--cds-text-secondary); }
.nx-root[data-domain="domain"] .dm-best { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cds-text-secondary); }

.nx-root[data-domain="domain"][data-lens="strength"] .nx-card[data-strength="strong"] { --k: var(--dm-strong) !important; }
.nx-root[data-domain="domain"][data-lens="strength"] .nx-card[data-strength="likely"] { --k: var(--dm-likely) !important; }
.nx-root[data-domain="domain"][data-lens="strength"] .nx-card[data-strength="weak"] { --k: var(--dm-weak) !important; }
.nx-root[data-domain="domain"][data-lens="strength"] .nx-card[data-strength="unplaced"] { --k: var(--dm-unplaced) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card,
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card { --k: var(--cds-border-subtle-02) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="0"] { --k: var(--dm-sector-0) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="1"] { --k: var(--dm-sector-1) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="2"] { --k: var(--dm-sector-2) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="3"] { --k: var(--dm-sector-3) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="4"] { --k: var(--dm-sector-4) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="5"] { --k: var(--dm-sector-5) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="6"] { --k: var(--dm-sector-6) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="7"] { --k: var(--dm-sector-7) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="8"] { --k: var(--dm-sector-8) !important; }
.nx-root[data-domain="domain"][data-lens="sector"] .nx-card[data-sector-ix="9"] { --k: var(--dm-sector-9) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="critical"] { --k: var(--dm-sev-critical) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="high"] { --k: var(--dm-sev-high) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="medium"] { --k: var(--dm-sev-medium) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="low"] { --k: var(--dm-sev-low) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="info"] { --k: var(--dm-sev-info) !important; }
.nx-root[data-domain="domain"][data-lens="severity"] .nx-card[data-sev="clean"] { --k: var(--dm-sev-clean) !important; }

/* ---------------------------------------------------------------- The drawer */
.nx-root[data-domain="domain"] .dm-ctx-head { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-03); align-items: center; margin-bottom: var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .dm-wait { display: flex; align-items: center; gap: var(--cds-spacing-03); color: var(--cds-text-helper); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-err { color: var(--dm-bad-text); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-place, .nx-root[data-domain="domain"] .dm-across, .nx-root[data-domain="domain"] .dm-list,
.nx-root[data-domain="domain"] .dm-facts, .nx-root[data-domain="domain"] .dm-lifecycles, .nx-root[data-domain="domain"] .dm-cover { list-style: none; margin: 0; padding: 0; }
.nx-root[data-domain="domain"] .dm-place li, .nx-root[data-domain="domain"] .dm-real {
  border-left: 3px solid var(--c); padding: var(--cds-spacing-03) 0 var(--cds-spacing-03) var(--cds-spacing-04); margin: 0 0 var(--cds-spacing-03);
  background: color-mix(in srgb, var(--c) 6%, transparent);
}
.nx-root[data-domain="domain"] .dm-place-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-place-title { font-weight: var(--fw-semibold); }
.nx-root[data-domain="domain"] .dm-why { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-02); margin-top: var(--cds-spacing-02); font-size: var(--f-xs); }
.nx-root[data-domain="domain"] .dm-why .nx-muted { margin-right: var(--cds-spacing-01); }
.nx-root[data-domain="domain"] .dm-across li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); padding: var(--cds-spacing-02) 0; border-top: 1px solid var(--cds-border-subtle-01); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-across li:first-child { border-top: 0; }
.nx-root[data-domain="domain"] .dm-model { min-width: 84px; font-weight: var(--fw-semibold); }
.nx-root[data-domain="domain"] .dm-across-el { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .dm-list li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); padding: var(--cds-spacing-01) 0; font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-facts li { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-03); align-items: center; font-size: var(--f-sm); padding: var(--cds-spacing-01) 0; }
.nx-root[data-domain="domain"] .dm-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); margin: var(--cds-spacing-01) 0 var(--cds-spacing-04); font-size: var(--f-sm); color: var(--cds-text-secondary); }
.nx-root[data-domain="domain"] .dm-crumb-sep { color: var(--cds-text-helper); }
.nx-root[data-domain="domain"] .dm-def {
  margin: 0; padding: var(--cds-spacing-03) var(--cds-spacing-04); border-left: 3px solid var(--cds-border-strong-01); background: var(--cds-layer-02);
  font-size: var(--f-sm); line-height: 19px; color: var(--cds-text-primary);
}
.nx-root[data-domain="domain"] .dm-cite { margin: var(--cds-spacing-03) 0 0; font-size: var(--f-xs); }
.nx-root[data-domain="domain"] .nx-pill.dm-dep-references { border-color: var(--dm-dep-references); }
.nx-root[data-domain="domain"] .nx-pill.dm-dep-reads { border-color: var(--dm-dep-reads); }
.nx-root[data-domain="domain"] .nx-pill.dm-dep-writes { border-color: var(--dm-dep-writes); }
.nx-root[data-domain="domain"] .nx-pill.dm-dep-publishes { border-color: var(--dm-dep-publishes); }
.nx-root[data-domain="domain"] .dm-chip-note.is-live svg { color: var(--dm-likely); }

/* ---------------------------------------------------------------- Console tabs */
.nx-root[data-domain="domain"] .dm-td-terms { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--cds-text-secondary); }
.nx-root[data-domain="domain"] .dm-td-def {
  max-width: 520px; margin-top: var(--cds-spacing-01); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--f-xs); color: var(--cds-text-helper);
}
.nx-root[data-domain="domain"] .dm-td-current { background: color-mix(in srgb, var(--cds-link-primary) 6%, transparent); }
.nx-root[data-domain="domain"] .dm-across-cell { display: inline-flex; align-items: center; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-rules, .nx-root[data-domain="domain"] .dm-method {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: var(--cds-spacing-04); padding: var(--cds-spacing-03) var(--cds-spacing-05) var(--cds-spacing-05);
}
.nx-root[data-domain="domain"] .dm-method p { font-size: var(--f-sm); line-height: 19px; margin: 0 0 var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .dm-row-bad td:first-child, .nx-root[data-domain="domain"] .dm-lifecycles li.dm-row-bad { box-shadow: inset 3px 0 0 var(--dm-sev-medium); }
.nx-root[data-domain="domain"] .dm-lifecycles > li { padding: var(--cds-spacing-03) 0 var(--cds-spacing-03) var(--cds-spacing-04); border-top: 1px solid var(--cds-border-subtle-01); }
.nx-root[data-domain="domain"] .dm-lifecycles > li:first-child { border-top: 0; }
.nx-root[data-domain="domain"] .dm-lc-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-lc-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03); margin-top: var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .dm-states { display: flex; flex-wrap: wrap; align-items: center; gap: 0; list-style: none; margin: 0; padding: 0; font-size: var(--f-xs); }
.nx-root[data-domain="domain"] .dm-states li {
  padding: 1px var(--cds-spacing-03); border: 1px solid var(--cds-border-strong-01); border-radius: var(--hx-radius-chip); margin: var(--cds-spacing-01) 0;
  font-family: var(--mono);
}
.nx-root[data-domain="domain"] .dm-states li + li { margin-left: var(--hx-space-20); position: relative; }
.nx-root[data-domain="domain"] .dm-states li + li::before { content: "→"; position: absolute; left: -15px; color: var(--cds-text-helper); font-family: inherit; }
.nx-root[data-domain="domain"] .dm-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-03) var(--cds-spacing-04); margin-top: var(--cds-spacing-02); font-size: var(--f-sm); }

/* ---------------------------------------------------------------- Capability Portfolio */
.nx-root[data-domain="domain"] .dm-pf-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .dm-pf-profile { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--cds-spacing-02) var(--cds-spacing-03); min-width: 0; max-width: 100%; font-size: var(--f-sm); color: var(--cds-text-secondary); }
.nx-root[data-domain="domain"] .dm-pf-profile select {
  font: inherit; font-size: var(--f-ms); color: var(--cds-text-primary); background: var(--cds-field-01);
  border: 0; border-bottom: 1px solid var(--cds-border-strong-01); padding: var(--cds-spacing-03) var(--cds-spacing-03); min-width: 0;
}
.nx-root[data-domain="domain"] .dm-pf-tools { display: flex; flex-wrap: wrap; gap: var(--cds-spacing-03); align-items: center; min-width: 0; max-width: 100%; }
/* A narrow panel: the model picker shrinks to the panel instead of running past its edge. */
.nx-root[data-domain="domain"] .dm-pf-profile select { flex: 1 1 12rem; max-width: 100%; text-overflow: ellipsis; }
.nx-root[data-domain="domain"] .dm-pf-check { display: inline-flex; align-items: center; gap: var(--cds-spacing-03); font-size: var(--f-sm); color: var(--cds-text-secondary); }
.nx-root[data-domain="domain"] .dm-pf-note { margin: 0 0 var(--cds-spacing-03); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-row-shared td:first-child { box-shadow: inset 3px 0 0 var(--dm-weak); }
.nx-root[data-domain="domain"] .dm-cover { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: var(--cds-spacing-03) var(--cds-spacing-06); }
.nx-root[data-domain="domain"] .dm-cover li { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(80px, 1fr) auto; align-items: center; gap: var(--cds-spacing-04); font-size: var(--f-sm); }
.nx-root[data-domain="domain"] .dm-cover-lab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nx-root[data-domain="domain"] .dm-cover-lab .nx-mono { color: var(--cds-text-helper); }
.nx-root[data-domain="domain"] .dm-cover-bar { display: block; height: 8px; border-radius: var(--hx-radius-sm); background: var(--cds-layer-accent-01); overflow: hidden; }
.nx-root[data-domain="domain"] .dm-cover-bar i { display: block; height: 100%; background: var(--c); border-radius: var(--hx-radius-sm); }
.nx-root[data-domain="domain"] .dm-cover-n { font-variant-numeric: tabular-nums; }
.nx-root[data-domain="domain"] .dm-cover-n small { color: var(--cds-text-helper); }

@media (max-width: 671px) {
  .nx-root[data-domain="domain"] .dm-cover li { grid-template-columns: minmax(0, 1fr) 72px auto; }
  .nx-root[data-domain="domain"] .dm-td-def, .nx-root[data-domain="domain"] .dm-td-terms { max-width: 220px; }
}

/* ---- enterprise pass --------------------------------------------------------------------------------------------- */
.nx-estate-root[data-domain="domain"] .dm-pf-cover-note { margin: 0 0 var(--cds-spacing-04); padding: var(--cds-spacing-03) var(--cds-spacing-04); font-size: var(--f-ms); color: var(--cds-text-secondary);
  background: var(--cds-layer-01); border-left: 3px solid var(--cds-support-info); }

/* ---------------------------------------------------------------- Hostile text (overflow pass, 2026-10-02)
   Repository, module, file, entity and finding names, evidence paths, reasons and user names come from repositories
   and people: one unbroken 220-character token, CJK with no spaces or a Windows path must wrap inside its card, drawer,
   finding or console tab, never widen it. `anywhere` also lowers min-content, so a grid or flex item holding such a word
   cannot push its track wider than the screen. Controls and table headers carry our own short copy and keep whole
   words. A chip holds a value and wraps inside its box. An evidence path keeps its file name and line whole until the
   name alone is wider than the line. (The same rules for every estate belong in network.css: requested of its owner.) */
.nx-root[data-domain="domain"] { overflow-wrap: anywhere; }
.nx-root[data-domain="domain"] :is(th, .nx-btn, .nx-tab, .nx-fchip, .nx-pill, .nx-count, .nx-kbd, .nx-seg button, .nx-th-sort) { overflow-wrap: normal; }
.nx-root[data-domain="domain"] .nx-chip { max-width: 100%; height: auto; min-height: 20px; white-space: normal; overflow-wrap: anywhere; }
.nx-root[data-domain="domain"] :is(.nx-ev-leaf, .nx-ev-tail) { white-space: normal; overflow-wrap: anywhere; }
.nx-root[data-domain="domain"] :is(.nx-caps, .nx-finding, .nx-sec, .nx-dl dd) { min-width: 0; }
/* A phone: the console's filter rows (findings, connections, glossary facets) wrap instead of running past the
   console, and its tab strip scrolls instead of drawing tabs over the tools. */
.nx-root[data-domain="domain"] .nx-hud-subbar { flex-wrap: wrap; height: auto; row-gap: var(--cds-spacing-03); }
.nx-root[data-domain="domain"] .nx-hud-subbar > * { min-width: 0; max-width: 100%; }
.nx-root[data-domain="domain"] .nx-hud-bar > .nx-tabs { min-width: 0; overflow-x: auto; scrollbar-width: thin; }
/* The Rules and Evidence tabs' cards: one column when the console is narrower than a 340px card. */
.nx-root[data-domain="domain"] :is(.dm-rules, .dm-method) { grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); }
/* A table's screen-reader text (position: absolute) took the console as its containing block and escaped the
   table's scroller, widening the console by the table's width on a phone: the scroller now contains it. */
.nx-root[data-domain="domain"] .nx-table-wrap { position: relative; }
/* The Evidence tab's sources table scrolls inside its card rather than running past it. */
.nx-root[data-domain="domain"] :is(.dm-method, .dm-rules) .nx-panel { min-width: 0; overflow-x: auto; }
/* The findings' gate and export group, and a facet's chip row, wrap on a phone instead of running past the console. */
.nx-root[data-domain="domain"] :is(.nx-gov, .nx-facet) { flex-wrap: wrap; flex-shrink: 1; min-width: 0; max-width: 100%; }
