/* GENERATED FILE - DO NOT EDIT DIRECTLY.
   Source entry point: assets/css/app.css
   Rebuild: php bin/build_css_assets.php
   Runtime delivery uses this fingerprinted bundle so nested CSS modules cannot be served stale. */

/* CodeIntent application stylesheet entry point.
   Keep this file as the single linked CSS asset; modules are grouped by ownership and purpose. */

/* Settings */
/* BEGIN imported module: assets/css/settings/tokens.css */
/* CodeIntent CSS module: Design tokens and CSS custom properties.
   Source order preserved from the monolithic app.css split. */

/*
  Application stylesheet. Runtime display name is controlled by APP_NAME.
  Order: tokens, fonts, base, shell, shared components, feature sections, responsive rules.
  Approved breakpoints: 1420px, 1180px, 960px, 760px, 620px.
  Keep Trace and Semantic Map runtime classes stable unless related JavaScript is updated.
*/

:root {
  /* Core surfaces and text */
  --shell-surface: #1A2B2B;
  --shell-surface-deep: #122020;
  --shell-border: #2c4242;
  --text-primary: #16202a;
  --text-secondary: #37474a;
  --text-muted: #647079;
  --text-subtle: #8a949c;
  --border-default: #e3e8e8;
  --border-subtle: #eef2f2;
  --page-surface: #f1f5f4;
  --surface-card: #ffffff;
  --surface-subtle: #f8fafa;

  /* Intent and status roles */
  --accent-primary: #00A67E;
  --accent-positive: #1FB35E;
  --accent-primary-strong: #0E7C66;
  --success-text: #0a5f4c;
  --success-bg: #e8f7f2;
  --success-border: #b6e6d6;
  --review-text: #9a5e08;
  --review-bg: #fbf0dd;
  --review-border: #eccf95;
  --info-text: #235ea0;
  --info-bg: #e8f0f9;
  --info-border: #c2d6ee;
  --net-new-text: #62519a;
  --net-new-bg: #efeaf8;
  --net-new-border: #d6cdee;
  --risk-text: #bb392b;
  --risk-bg: #fbe8e6;
  --risk-border: #f0c4be;
  --neutral-text: #3a5a63;
  --neutral-bg: #e7f0f1;
  --neutral-border: #c8dcde;
  --neutral-status-bg: #eef1f1;
  --neutral-status-line: #dde3e3;

  /* Code and trace surfaces */
  --code-surface: #0f1c1c;
  --code-text: #cfe5df;
  --code-gutter-text: #5c7470;
  /* .16 alpha measured at ~1.3:1 contrast against the surrounding dark
     background (rgb(15,28,28)) -- essentially imperceptible as a
     highlight, confirmed live and by a reviewer independently flagging
     it twice ("if inside an else... barely visible"). .40 measures
     ~2:1, a real, visually confirmed tint (screenshotted live at this
     value) without approaching the much stronger
     .boundary-selected-precise (solid --code-selected-bg) reserved for
     the actively-selected line. */
  --trace-source-highlight-bg: rgba(31,179,94,.40);
  --trace-source-highlight-border: #1FB35E;
  --trace-target-highlight-bg: rgba(0,166,126,.40);
  --trace-target-highlight-border: #00A67E;
  /* Step-segmentation overlay (2026-08-07) -- a translucent black wash
     layered on top of trace-pane-highlight-bg for every other real step
     inside a multi-step fact's ambient range, so adjacent steps read as
     distinct bands instead of one flat block. Dark-theme surfaces are
     already low-luminance, so a light dark-mix reads clearly without
     crushing the underlying source/target hue. */
  --trace-step-shade: rgba(0,0,0,.22);

  /* Selection outline (2026-08-07) -- the click-selected block used to be
     marked only by a background-color shift, which read as too subtle once
     the ambient wash + step zebra-striping share the same green palette
     (confirmed by direct user feedback: "the section selected is hard to
     see"). Orange appears nowhere else in this view, so an outline in this
     color stays legible no matter what's painted underneath it. */
  --trace-selection-outline: #FF8A00;

  /* Interaction colors */
  --selection-bg: rgba(0,166,126,.22);
  --focus-ring: rgba(0,166,126,.42);
  --success-ring: rgba(0,166,126,.18);

  /* Code interaction states */
  --code-selected-bg: #174d41;
  --code-selected-ink: #f3fffb;
  --trace-boundary-bg: rgba(0,166,126,.16);
  --trace-boundary-bg-hover: rgba(0,166,126,.22);
  --trace-boundary-ink: inherit;
  --trace-boundary-gutter: #8fcfc2;
  --trace-boundary-code: inherit;

  /* Semantic Map states */
  --sem-map-verified: #16A37C;
  --sem-map-preserved: #0B6B57;
  --sem-map-allowed: #46656E;
  --sem-map-net: #62519A;
  --sem-map-review: #C98A1E;
  --sem-map-governed: #235ea0;
  --sem-map-orphaned: #AEB8B8;
  --sem-map-boundary: #f3c66b;
  --sem-map-boundary-ring: #c98a1e;
  --sem-map-label-ink: #ffffff;
  --sem-map-orphan-label-ink: #263432;
  --sem-map-help-ink: #7fa79e;
  --sem-map-tooltip-bg: var(--shell-surface-deep);
  --sem-map-tooltip-ink: #eaf3f1;
  --sem-map-tooltip-title: #ffffff;
  --sem-map-tooltip-subtle: #9fc7bd;
  --sem-map-tooltip-strong: #bff0e0;

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 8px;
  --space-4: 10px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 20px;
  --space-8: 24px;
  --space-9: 32px;

  /* Radius scale */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-pill: 999px;

  /* Layer scale */
  --z-header: 5;
  --z-dropdown: 20;
  --z-drawer: 60;
  --z-modal: 80;
  --z-tooltip: 1000;

  /* Shared effects */
  --shadow: 0 1px 2px rgba(16,32,32,.06),0 6px 18px rgba(16,32,32,.06);
  --shadow-lg: 0 8px 30px rgba(16,32,32,.16);

  /* Font families */
  --font-ui: "Inter";
  --font-mono: "SF Mono Local";
  --font-math: "STIX Two Math Local";
  --font-icons: "Material Symbols Outlined";
  --formula-size: 20px;
}
/* END imported module: assets/css/settings/tokens.css */
/* BEGIN imported module: assets/css/settings/fonts.css */
/* CodeIntent CSS module: Local font-face declarations.
   Source order preserved from the monolithic app.css split. */

/* Local application fonts. */
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter/Inter-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "SF Mono Local";
  src: url("/assets/fonts/sfmono/SFMonoRegular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "SF Mono Local";
  src: url("/assets/fonts/sfmono/SFMonoMedium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "SF Mono Local";
  src: url("/assets/fonts/sfmono/SFMonoSemibold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "STIX Two Math Local";
  src: url("/assets/fonts/stixtwomath/STIXTwoMath-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/fonts/MaterialSymbolsOutlined.woff2") format("woff2");
  font-display: swap;
}

/* CodeIntent icon font base class. */
.ci-icon {
  font-family: var(--font-icons);
  font-weight: normal;
  font-style: normal;
  font-size: 16px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-flex;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "liga";
}
/* END imported module: assets/css/settings/fonts.css */

/* Base */
/* BEGIN imported module: assets/css/base/foundation.css */
/* CodeIntent CSS module: Reset and base element styling.
   Source order preserved from the monolithic app.css split. */

/* Foundation: reset and base elements. */
* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family: var(--font-ui);
  color: var(--text-primary);
  background: var(--page-surface);
  font-size: 13.5px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

.mono,
code,
.ci-code-view {
  font-family: var(--font-mono);
}

button {
  font-family: inherit;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

::selection {
  background: var(--selection-bg);
}
/* END imported module: assets/css/base/foundation.css */

/* Layout */
/* BEGIN imported module: assets/css/layout/app-shell.css */
/* CodeIntent CSS module: Application shell, navigation, header, and shared page layout. */

/* Application shell: navigation, header, and page layout. */
.app {
  display: grid;
  grid-template-columns: 230px 1fr;
  grid-template-rows: auto 1fr;
  height: 100vh;
  grid-template-areas: "nav header" "nav main";
}

.app-nav {
  grid-area: nav;
  background: linear-gradient(180deg,#203535,var(--shell-surface) 30%,var(--shell-surface-deep));
  color: #dfeae8;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #0c1717;
}

.header {
  grid-area: header;
  background: var(--surface-card);
  border-bottom: 1px solid var(--border-default);
  z-index: var(--z-header);
}

.main {
  grid-area: main;
  overflow: auto;
  position: relative;
}

.app-brand {
  padding: 16px 18px 14px;
  border-bottom: 1px solid var(--shell-border);
}

.app-brand .app-brand-logo {
  font-weight: 700;
  letter-spacing: .6px;
  font-size: 15px;
  color: var(--sem-map-tooltip-title);
  display: flex;
  align-items: center;
  gap: 8px;
}

.app-brand .app-brand-logo .app-brand-mark {
  width: 24px;
  height: 22px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.app-brand .app-brand-logo .app-brand-mark img {
  width: 24px;
  height: 22px;
  display: block;
  object-fit: contain;
}

.app-brand .app-brand-logo b {
  color: var(--accent-positive);
  font-weight: 700;
}

.app-brand .app-brand-sub {
  font-size: 10px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--sem-map-help-ink);
  margin-top: 6px;
  font-weight: 600;
}

.app-nav-list {
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}

.app-nav-link {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 11px;
  border-radius: 7px;
  color: #cfe0dc;
  font-size: 13.5px;
  border: 1px solid transparent;
  text-align: left;
  background: none;
  width: 100%;
  transition: background .12s,color .12s;
}

.app-nav-link .app-nav-icon {
  width: 17px;
  height: 17px;
  flex: none;
  opacity: .85;
  display: block;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-nav-link .app-nav-count {
  margin-left: auto;
  font-size: 11px;
  color: var(--sem-map-help-ink);
  background: rgba(255,255,255,.06);
  border-radius: 20px;
  padding: 1px 7px;
  min-width: 22px;
  text-align: center;
}

.app-nav-link:hover {
  background: rgba(255,255,255,.06);
  color: var(--sem-map-tooltip-title);
}

.app-nav-link.is-active {
  background: rgba(0,166,126,.16);
  border-color: rgba(0,166,126,.42);
  color: var(--sem-map-tooltip-title);
}

.app-nav-link.is-active .app-nav-count {
  color: var(--sem-map-tooltip-strong);
  background: var(--selection-bg);
}

.app-nav-section {
  margin: 0;
}

.app-nav-section > summary {
  list-style: none;
  cursor: pointer;
}

.app-nav-section > summary::-webkit-details-marker {
  display: none;
}

.app-nav-section-summary span:not(.app-nav-chevron) {
  min-width: 0;
}

.app-nav-chevron {
  margin-left: auto;
  font-size: 18px;
  line-height: 1;
  color: var(--sem-map-help-ink);
  transform: rotate(0deg);
  transition: transform .12s ease;
}

.app-nav-section[open] .app-nav-chevron {
  transform: rotate(90deg);
}

.app-nav-submenu {
  display: flex;
  flex-direction: column;
  gap: 1px;
  margin: 2px 0 5px 28px;
  padding-left: 9px;
  border-left: 1px solid rgba(255,255,255,.12);
}

.app-nav-sublink {
  display: block;
  padding: 6px 8px;
  border-radius: 6px;
  color: #9fbdb6;
  font-size: 12.5px;
  line-height: 1.25;
}

.app-nav-sublink:hover {
  background: rgba(255,255,255,.05);
  color: var(--sem-map-tooltip-title);
}

.app-nav-sublink.is-active {
  background: rgba(0,166,126,.10);
  color: var(--sem-map-tooltip-title);
  font-weight: 700;
}

.nav-footer {
  padding: 12px 16px;
  border-top: 1px solid var(--shell-border);
  font-size: 11px;
  color: #789e95;
}

.nav-footer-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 4px;
}

.nav-footer b {
  color: #cfe0dc;
  font-weight: 600;
  text-align: right;
}

.nav-footer-row b {
  max-width: 132px;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.25;
}

.job-header {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 11px 22px;
}

.job-crumb {
  font-size: 11px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
}

.job-title {
  font-size: 16px;
  margin: 0;
  font-weight: 700;
  letter-spacing: .1px;
  color: var(--text-primary);
}

.job-meta {
  display: flex;
  gap: 18px;
  margin-left: auto;
  align-items: center;
}

.job-meta-item {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.job-meta-label {
  font-size: 9.5px;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--text-subtle);
  font-weight: 600;
}

.job-meta-value {
  font-size: 12.5px;
  color: var(--text-secondary);
  font-weight: 600;
  max-width: 320px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.job-meta-value.mono {
  font-size: 11.5px;
}

.status-ready {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--success-bg);
  color: var(--success-text);
  border: 1px solid var(--success-border);
  border-radius: 20px;
  padding: 4px 11px;
  font-size: 12px;
  font-weight: 700;
}

.status-ready .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-primary);
  box-shadow: 0 0 0 3px var(--success-ring);
}

.status-ready.status-review {
  background: #fff7e6;
  color: #8a5400;
  border-color: #f2c36b;
}

.status-ready.status-review .dot {
  background: #c98613;
  box-shadow: 0 0 0 3px rgba(201, 134, 19, 0.14);
}


.account-menu {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.account-menu-button {
  width: 36px;
  height: 36px;
  border: 1px solid var(--border-default);
  border-radius: 50%;
  background: var(--surface-card);
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 2px rgba(16,32,32,.04);
}

.account-menu-button:hover,
.account-menu-button:focus-visible {
  border-color: var(--accent-primary);
  color: var(--accent-primary-strong);
  outline: none;
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.account-menu-button .ci-icon {
  font-size: 23px;
}

.account-menu-panel {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: var(--z-dropdown);
  min-width: 220px;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 8px;
}

.account-menu-identity {
  padding: 9px 10px 10px;
  border-bottom: 1px solid var(--border-subtle);
  margin-bottom: 4px;
  display: grid;
  gap: 2px;
}

.account-menu-identity strong {
  font-size: 13px;
  color: var(--text-primary);
}

.account-menu-identity span,
.account-menu-identity small {
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.25;
}

.account-menu-panel a,
.account-menu-form button {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  border-radius: var(--radius-md);
  padding: 8px 10px;
  display: flex;
  align-items: center;
  text-align: left;
  font-size: 13px;
}

.account-menu-panel a:hover,
.account-menu-panel a:focus-visible,
.account-menu-form button:hover,
.account-menu-form button:focus-visible {
  background: var(--surface-subtle);
  color: var(--accent-primary-strong);
  outline: none;
}

.account-menu-form {
  margin: 4px 0 0;
  padding-top: 4px;
  border-top: 1px solid var(--border-subtle);
}


.mobile-nav {
  display: none;
  margin: 10px 0 0 14px;
  border: 1px solid var(--border-default);
  background: #fff;
  border-radius: 7px;
  padding: 6px 10px;
  color: var(--text-primary);
}

.page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: var(--space-6);
  padding: 22px 24px 60px;
  max-width: none;
  animation: fadeUp .22s ease;
}

.page.full {
  max-width: none;
}


.page-heading {
  display: grid;
  gap: var(--space-1);
}

.secttitle {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0;
}

.secttitle h2 {
  font-size: 15px;
  margin: 0;
  font-weight: 700;
}

.secttitle .desc {
  font-size: 12.5px;
  color: var(--text-muted);
}

.sectsub {
  font-size: 12.5px;
  color: var(--text-muted);
  margin: 0;
  max-width: 820px;
}

.section-divider {
  height: 1px;
  background: var(--border-default);
  border: 0;
  margin: 20px 0;
}

.hidden,
[hidden] {
  display: none !important;
}

/* Application shell: responsive navigation refinements. */
.app-nav-group {
  font-size: 9.5px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: #6f9990;
  font-weight: 700;
  padding: 12px 13px 5px;
}

.app-nav-group + .app-nav-link {
  margin-top: 0;
}

.nav-footer-row span {
  white-space: nowrap;
}

/* Application shell overlay and page animation support. */
.scrim {
  display: none;
}

@keyframes fadeUp {
  from {
    opacity: .4;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}
/* END imported module: assets/css/layout/app-shell.css */
/* BEGIN imported module: assets/css/layout/responsive.css */
/* CodeIntent CSS module: Shared shell and stack responsive behavior.
   Source order preserved from the monolithic app.css split. */

/* Responsive: Application shell at 1180px. */
@media (max-width:1180px) {
  .job-meta {
    gap: 10px;
  }

  .job-meta-item:nth-child(2) {
    display: none;
  }
}

/* Responsive: Application shell, navigation drawer, and shared stack layout at 760px. */
@media (max-width:760px) {
  .app {
    display: block;
    height: auto;
  }

  .app-nav {
    position: fixed;
    inset: 0 auto 0 0;
    width: 250px;
    z-index: var(--z-dropdown);
    transform: translateX(-102%);
    transition: transform .16s;
  }

  .app-nav.open {
    transform: none;
  }

  .scrim.show {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 15;
  }

  .mobile-nav {
    display: inline-flex;
  }

  .header {
    position: sticky;
    top: 0;
  }

  .job-header {
    padding: 8px 14px;
    align-items: flex-start;
  }

  .job-meta .job-meta-item,
  .job-meta .status-ready {
    display: none;
  }

  .account-menu-panel {
    min-width: 210px;
  }

  .page {
    padding: 16px;
  }

  .ci-card-grid {
    grid-template-columns: 1fr;
  }

  .workflow-steps {
    display: grid;
    gap: 12px;
  }

  .workflow-step::before {
    display: none;
  }

  .hero h2 {
    font-size: 24px;
  }
}
/* END imported module: assets/css/layout/responsive.css */

/* Primitives */
/* BEGIN imported module: assets/css/components/primitives/actions.css */
/* CodeIntent CSS module: Shared hero, actions, and button primitives. */
.hero {
  background: linear-gradient(135deg,#ffffff,#f2fbf8 62%,#e8f7f2);
  border: 1px solid var(--success-border);
  border-radius: 14px;
  padding: 26px;
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}

.hero:after {
  content: "";
  position: absolute;
  right: -80px;
  top: -80px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(0,166,126,.12);
}

.hero .eyebrow {
  font-size: 10.5px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent-primary-strong);
  font-weight: 800;
  margin: 0 0 6px;
}

.hero h2 {
  font-size: 30px;
  line-height: 1.05;
  margin: 0 0 8px;
  color: var(--text-primary);
  letter-spacing: -.5px;
}

.hero p {
  max-width: 760px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
}

.ci-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.ci-action-row-compact {
  gap: 6px;
}

.ci-action-row-top-xs {
  margin-top: 9px;
}

.ci-action-row-top-sm {
  margin-top: 10px;
}


.ci-action-row-end {
  justify-content: flex-end;
}

.ci-action-row-nowrap .btn {
  white-space: nowrap;
}

.ci-action-row form {
  margin: 0;
}

.btn {
  border: 1px solid var(--border-default);
  background: #fff;
  color: var(--text-primary);
  border-radius: 7px;
  padding: 8px 12px;
  font-size: 12.5px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: auto;
  max-width: 100%;
}

.btn.small {
  min-height: 0;
  padding: 7px 10px;
  font-size: 12px;
}

.btn.compact {
  min-height: 29px;
  padding: 5px 9px;
  font-size: 11px;
}

.btn.danger {
  border-color: var(--risk-border);
  color: var(--risk-text);
  background: var(--risk-bg);
}

.btn.danger:hover,
.btn.danger:focus-visible {
  border-color: var(--risk-text);
  color: var(--risk-text);
}

.btn.ghost {
  background: transparent;
  border-color: var(--border-default);
  color: var(--accent-primary-strong);
}

.btn.ghost:hover {
  background: var(--success-bg);
  border-color: var(--success-border);
}

.btn:hover {
  box-shadow: var(--shadow);
}
/* Responsive: Shared action alignment helper at 960px. */
@media (max-width: 960px) {
  .ci-action-row-end-to-start-960 {
    justify-content: flex-start;
  }
}

.ci-action-row-vertical {
  display: grid;
  gap: 8px;
}

.ci-action-row-vertical .btn {
  justify-content: flex-start;
  text-align: left;
  width: 100%;
}

.btn.is-active {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}
/* END imported module: assets/css/components/primitives/actions.css */
/* BEGIN imported module: assets/css/components/primitives/cards-panels.css */
/* CodeIntent CSS module: Shared card, panel, and grid primitives. */
/* Shared components: panels, cards, metrics, chips, buttons, tables, and form controls. */
.ci-card,
.ci-panel {
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  box-shadow: var(--shadow);
}

.ci-panel {
  padding: 16px;
}

.ci-panel-header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-subtle);
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--surface-subtle);
  border-radius: 10px 10px 0 0;
}

.ci-panel-header h3,
.ci-panel h3 {
  margin: 0;
  font-size: 13px;
}

.ci-panel-header p {
  margin: 3px 0 0;
  color: var(--text-muted);
  font-size: 12.5px;
  line-height: 1.4;
}

.ci-panel-body {
  padding: 16px;
}

.ci-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(168px,1fr));
  gap: 12px;
}

.ci-card-grid-wide {
  grid-template-columns: repeat(auto-fit,minmax(260px,1fr));
}

.ci-panel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(360px,1fr));
  gap: 14px;
}

.ci-card-list {
  display: grid;
  gap: 12px;
}

/* Collapsible category grouping for long ci-card-list pages (e.g. Governed Boundaries). */
.ci-boundary-group {
  margin-bottom: 18px;
}

.ci-boundary-group-summary {
  cursor: pointer;
  list-style: revert;
  padding: 6px 2px 10px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--text-primary);
}

.ci-boundary-group-count {
  color: var(--text-muted);
  font-weight: 600;
  margin-left: 2px;
}

.ci-boundary-group[open] > .ci-boundary-group-summary {
  margin-bottom: 4px;
}

.ci-boundary-group > .ci-card-list {
  margin-top: 6px;
}

.ci-card-list .ci-link-card {
  min-height: 0;
}

.ci-link-card {
  display: grid;
  align-content: start;
  gap: 6px;
  padding: 12px;
  color: var(--text-secondary);
  min-width: 0;
  overflow-wrap: anywhere;
  text-decoration: none;
}


button.ci-link-card {
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.ci-link-card.c-verified,
.ci-link-card.c-preserved,
.ci-link-card.c-allowed,
.ci-link-card.c-review,
.ci-link-card.c-governed,
.ci-link-card.c-net,
.ci-link-card.c-orphaned,
.ci-link-card.c-blocked,
.ci-link-card.c-reg {
  background: var(--status-bg, var(--surface-card));
  border-color: var(--status-border, var(--border-default));
}

.ci-link-card.c-verified .ci-meta-label,
.ci-link-card.c-preserved .ci-meta-label,
.ci-link-card.c-allowed .ci-meta-label,
.ci-link-card.c-review .ci-meta-label,
.ci-link-card.c-governed .ci-meta-label,
.ci-link-card.c-net .ci-meta-label,
.ci-link-card.c-orphaned .ci-meta-label,
.ci-link-card.c-blocked .ci-meta-label,
.ci-link-card.c-reg .ci-meta-label {
  color: var(--status-color, var(--text-primary));
}

.ci-link-card.is-active {
  border-color: var(--status-color, var(--accent-primary));
  box-shadow:
    inset 0 0 0 1px var(--status-color, var(--accent-primary)),
    0 0 0 2px var(--status-border, rgba(0,166,126,.16));
}

a.ci-link-card:hover,
button.ci-link-card:hover {
  background: var(--status-bg, var(--surface-card));
  border-color: var(--status-border, var(--border-default));
  text-decoration: none;
}

.ci-link-card strong,
.ci-link-card h4 {
  color: var(--text-primary);
  font-size: 12.5px;
}

.ci-link-card h4 {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
}


.ci-link-card .ci-status-chip {
  justify-self: start;
  max-width: 100%;
  white-space: normal;
}

.ci-link-card > span:not(.ci-status-chip):not(.ci-status-dot),
.ci-link-card > em {
  color: var(--text-muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.35;
}

/* Responsive: Shared panel and wide card grids stack at 760px. */
@media (max-width: 760px) {
  .ci-panel-grid,
  .ci-card-grid-wide {
    grid-template-columns: 1fr;
  }
}

/* Horizontal rail for selectable card lists. */
.ci-card-rail,
.ci-chip-row.ci-card-rail {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  margin-bottom: 0;
  padding: 1px 1px 6px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}

.ci-card-rail .ci-link-card {
  flex: 0 0 clamp(220px, 22vw, 300px);
  min-height: 58px;
  gap: 4px;
  scroll-snap-align: start;
}


/* Responsive: Shared card rails use wider touch targets at 760px. */
@media (max-width: 760px) {
  .ci-card-rail .ci-link-card {
    flex-basis: min(86vw, 340px);
  }
}


/* Canonical Change evaluation presentation: dense audit data stays readable and padded. */
.ci-evaluation-card {
  padding: 14px 16px;
}

.ci-evaluation-card > :first-child {
  margin-top: 0;
}

.ci-evaluation-card > :last-child {
  margin-bottom: 0;
}

.ci-evaluation-scope-disclosure > .ci-card-list,
.ci-evaluation-scope-disclosure > .ci-table-wrap {
  margin: 0 14px 14px;
}

.ci-evaluation-item {
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.ci-evaluation-item > summary {
  cursor: pointer;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  list-style: none;
  padding: 12px 14px;
  color: var(--text-primary);
}

.ci-evaluation-item > summary::-webkit-details-marker {
  display: none;
}

.ci-evaluation-item > summary::before {
  content: '›';
  color: var(--text-muted);
  font-size: 18px;
  line-height: 1;
  transition: transform .12s ease;
}

.ci-evaluation-item[open] > summary {
  background: var(--surface-subtle);
  border-bottom: 1px solid var(--border-subtle);
}

.ci-evaluation-item[open] > summary::before {
  transform: rotate(90deg);
}

.ci-evaluation-item-body {
  padding: 14px 16px 16px;
}

.ci-evaluation-item-body > :first-child {
  margin-top: 0;
}

.ci-evaluation-item-body > :last-child {
  margin-bottom: 0;
}

.ci-evaluation-detail-list {
  max-width: 900px;
  margin-top: 10px;
  padding: 8px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--surface-subtle);
}

.ci-evaluation-detail-list .ci-detail-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.ci-evaluation-detail-list .ci-detail-row:last-child {
  padding-bottom: 0;
}

.ci-evaluation-item-body > .intent-diff-value > .ci-card-list,
.ci-evaluation-item-body > .intent-diff-value > ul {
  margin: 0 14px 14px;
}

.ci-evaluation-resolution-list {
  padding-left: 20px;
}

.ci-evaluation-disposition-summary {
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
}

@media (max-width: 620px) {
  .ci-evaluation-item > summary,
  .ci-evaluation-item-body,
  .ci-evaluation-card {
    padding-left: 12px;
    padding-right: 12px;
  }

  .ci-evaluation-scope-disclosure > .ci-card-list,
  .ci-evaluation-scope-disclosure > .ci-table-wrap {
    margin-left: 10px;
    margin-right: 10px;
  }
}
/* END imported module: assets/css/components/primitives/cards-panels.css */
/* BEGIN imported module: assets/css/components/primitives/forms.css */
/* CodeIntent CSS module: Shared form and control primitives.
   Shared ci-form classes provide the site-level form foundation for explicit primitive markup and legacy label/input form markup migrated to ci-form containers. */

.ci-form {
  display: grid;
  gap: 16px;
}

/* Selective governance decisions need enough room for a meaningful rationale.
   This modifier intentionally overrides the compact disclosure width used by
   technical/audit disclosures without making the form span the full card. */
.ci-disclosure.ci-governance-decision-disclosure {
  width: min(100%, 760px);
  max-width: 760px;
}

.ci-governance-decision-disclosure .ci-form {
  width: 100%;
}

.ci-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: 12px;
}

.ci-form-grid-wide {
  grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
}

.ci-form-card {
  padding: 16px;
  align-content: start;
}

.ci-form-card h4 {
  margin: 0;
  color: var(--text-primary);
  font-size: 14px;
}

.ci-form-card .btn {
  justify-content: center;
}

.ci-form-full {
  grid-column: 1 / -1;
}

/* M8 Change creation is a focused working form, not an inline label row. */
.ci-change-create-form {
  width: min(100%, 900px);
}

.ci-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
  gap: 12px;
}

.ci-choice-card {
  border: 1px solid var(--border-default);
  border-radius: 12px;
  background: var(--surface-subtle);
  padding: 12px;
  display: grid;
  gap: 8px;
}

.ci-choice-card legend {
  padding: 0 4px;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .65px;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ci-choice-option {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  align-items: start;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: #fff;
  padding: 10px;
}

.ci-choice-option input {
  grid-row: 1 / span 2;
  margin-top: 2px;
  width: auto;
}

.ci-choice-option span {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.ci-choice-option small {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.35;
}

.ci-form-field,
.ci-field,
.ci-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ci-form-label,
.ci-field > span,
.ci-form label > span {
  font-size: 11px;
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 800;
}

.ci-form-control,
.ci-field input:not([type="checkbox"]):not([type="radio"]),
.ci-field textarea,
.ci-field select,
.ci-form input:not([type="checkbox"]):not([type="radio"]),
.ci-form textarea,
.ci-form select {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--border-default);
  border-radius: 9px;
  padding: 10px 12px;
  font-size: 13px;
  font-family: inherit;
  color: var(--text-primary);
  background: #fff;
}

.ci-form-control:focus,
.ci-field input:not([type="checkbox"]):not([type="radio"]):focus,
.ci-field textarea:focus,
.ci-field select:focus,
.ci-form input:not([type="checkbox"]):not([type="radio"]):focus,
.ci-form textarea:focus,
.ci-form select:focus {
  outline: none;
  border-color: var(--accent-primary);
  box-shadow: 0 0 0 4px rgba(0,166,126,.14);
}

.ci-form-control.is-valid,
.ci-field input:not([type="checkbox"]):not([type="radio"]).is-valid,
.ci-field textarea.is-valid,
.ci-field select.is-valid,
.ci-form input:not([type="checkbox"]):not([type="radio"]).is-valid,
.ci-form textarea.is-valid,
.ci-form select.is-valid {
  border-color: rgba(0,166,126,.65);
}

.ci-form-control.is-invalid,
.ci-field input:not([type="checkbox"]):not([type="radio"]).is-invalid,
.ci-field textarea.is-invalid,
.ci-field select.is-invalid,
.ci-form input:not([type="checkbox"]):not([type="radio"]).is-invalid,
.ci-form textarea.is-invalid,
.ci-form select.is-invalid {
  border-color: rgba(191,77,77,.75);
}

.ci-form .ci-checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}

.ci-form .ci-checkbox-row > input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin: 1px 0 0;
  padding: 0;
  flex: 0 0 18px;
  accent-color: var(--accent-primary);
}

.ci-form .ci-checkbox-row > span {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
}

.ci-field-validation {
  font-size: 11px;
  line-height: 1.35;
  color: var(--text-muted);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ci-field-validation.is-valid {
  color: var(--accent-primary);
}

.ci-field-validation.is-invalid {
  color: #9f2f2f;
}

.ci-field-validation.is-info,
.ci-field-validation.is-pending {
  color: var(--text-muted);
}

.ci-field-note {
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.ci-action-row-stack {
  gap: 10px;
}

/* Shared filter and search primitives. */
.ci-filter-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 12px;
}

.ci-filter-bar-compact {
  margin-bottom: 10px;
}

.ci-filter-bar-flush {
  margin: 0 0 14px;
}

.ci-filter-bar select {
  border: 1px solid var(--border-default);
  border-radius: 7px;
  background: #fff;
  padding: 8px 10px;
  color: var(--text-secondary);
  font-size: 12.5px;
}

.ci-filter-bar .btn {
  min-height: 36px;
}

.ci-filter-search {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--border-default);
  border-radius: 7px;
  background: #fff;
  padding: 7px 9px;
  min-width: 280px;
  flex: 1;
  color: var(--text-muted);
}

.ci-filter-search-wide {
  min-width: 340px;
}

.ci-filter-search input {
  border: 0;
  outline: 0;
  width: 100%;
  min-width: 0;
  font: inherit;
  background: transparent;
}

.ci-form .ci-filter-search input:not([type="checkbox"]):not([type="radio"]) {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.ci-form .ci-filter-search input:not([type="checkbox"]):not([type="radio"]):focus {
  border-color: transparent;
  box-shadow: none;
}

.ci-filter-search:focus-within {
  border-color: var(--accent-primary);
  box-shadow: 0 0 0 4px rgba(0,166,126,.14);
}

.ci-filter-search .ci-icon {
  font-size: 17px;
  color: var(--text-muted);
}

.ci-filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
  gap: 12px;
  padding: 18px;
  align-items: end;
}

.ci-filter-grid-wide {
  grid-template-columns: repeat(auto-fit,minmax(210px,1fr));
}

.ci-filter-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.ci-filter-grid label span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .45px;
}

.ci-filter-grid input,
.ci-filter-grid select {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--border-default);
  border-radius: 9px;
  padding: 9px 10px;
  background: #fff;
  color: var(--text-primary);
}

/* Responsive: Shared form grids and stackable action rows at 760px. */
@media (max-width: 760px) {
  .ci-form-grid,
  .ci-form-grid-wide {
    grid-template-columns: 1fr;
  }

  .ci-filter-search {
    min-width: 0;
  }

  .ci-filter-grid,
  .ci-filter-grid-wide {
    grid-template-columns: 1fr;
  }

  .ci-action-row-stack .btn {
    width: 100%;
    justify-content: center;
  }
}
/* END imported module: assets/css/components/primitives/forms.css */
/* BEGIN imported module: assets/css/components/primitives/tables-links.css */
/* CodeIntent CSS module: Shared table, link, and compact chip primitives. */
.ci-table-wrap {
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  box-shadow: var(--shadow);
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

.ci-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}

.ci-table thead th {
  text-align: left;
  font-size: 10.5px;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
  padding: 11px 14px;
  background: var(--surface-subtle);
  border-bottom: 1px solid var(--border-default);
  position: sticky;
  top: 0;
  white-space: nowrap;
}

.ci-table tbody td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-subtle);
  vertical-align: middle;
}

.ci-table tbody tr {
  transition: background .1s;
}

.ci-table tbody tr:hover {
  background: #f5faf9;
}

.ci-table tbody tr:last-child td {
  border-bottom: 0;
}


.ci-table-wrap-compact {
  box-shadow: none;
  border: 0;
  border-radius: 0;
}

.ci-table-wrap-spaced {
  margin-top: 14px;
}

.ci-table-nowrap {
  width: max-content;
  min-width: 100%;
}

.ci-table-nowrap td,
.ci-table-nowrap th {
  white-space: nowrap;
}

.ci-cell-nowrap {
  white-space: nowrap;
}

/* Responsive: Shared table minimum-width scroll helper at 1180px. */
@media (max-width: 1180px) {
  .ci-table-min-1180 {
    width: max-content;
    min-width: 1180px;
  }
}

td .art {
  font-weight: 600;
}

td .sub {
  font-size: 11px;
  color: var(--text-muted);
}


.evlink {
  color: var(--accent-primary-strong);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px dashed rgba(14,124,102,.5);
}

.evlink:hover {
  color: var(--success-text);
}

.scope-detail-link {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.source-formula-chiprow {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}

.source-formula-chip,
.source-formula-more {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 20px;
  padding: 2px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  background: var(--surface-subtle);
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.source-formula-chip:hover {
  color: var(--accent-primary-strong);
  border-color: var(--success-border);
  background: var(--success-bg);
}

.source-formula-more {
  color: var(--text-muted);
}

/* Temporal Evidence tables keep categorical values intact while still allowing long paths and reasons to wrap. */
.ci-temporal-stable-cell {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}

.ci-temporal-artifact-table,
.ci-temporal-rule-table,
.ci-temporal-evidence-table {
  min-width: 720px;
}

.ci-temporal-artifact-table th:first-child,
.ci-temporal-artifact-table td:first-child,
.ci-temporal-artifact-table th:last-child,
.ci-temporal-artifact-table td:last-child {
  width: 1%;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}

.ci-temporal-artifact-path {
  overflow-wrap: anywhere;
  word-break: normal;
}


/* Temporal Evidence dashboard density and disclosure controls. */
.ci-temporal-artifact-summary {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
}

.ci-temporal-artifact-summary .ci-metric-card {
  align-self: stretch;
  min-width: 0;
}

.ci-temporal-explainer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.ci-temporal-explainer-grid .ci-callout {
  min-width: 0;
}

.ci-temporal-detail-region {
  display: grid;
  gap: 10px;
}

.ci-temporal-detail-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ci-temporal-detail-toolbar .ci-action-row {
  margin: 0;
  flex: 0 0 auto;
}

.ci-temporal-disclosure-list {
  display: grid;
  gap: 10px;
}

.ci-temporal-disclosure {
  margin: 0;
  border: 1px solid var(--border-default);
  border-radius: 10px;
  background: var(--surface-card);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.ci-temporal-disclosure-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
  background: var(--surface-subtle);
  color: var(--text-primary);
  user-select: none;
}

.ci-temporal-disclosure-summary::-webkit-details-marker {
  display: none;
}

.ci-temporal-disclosure-summary::before {
  content: "›";
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform .15s ease;
}

.ci-temporal-disclosure[open] > .ci-temporal-disclosure-summary::before {
  transform: rotate(90deg);
}

.ci-temporal-disclosure[open] > .ci-temporal-disclosure-summary {
  border-bottom: 1px solid var(--border-subtle);
}

.ci-temporal-disclosure-title {
  min-width: 0;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.ci-temporal-disclosure-count {
  margin-left: auto;
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}

.ci-temporal-disclosure-alert {
  flex: 0 0 auto;
  border: 1px solid var(--review-border);
  border-radius: 999px;
  padding: 2px 7px;
  background: var(--review-bg);
  color: var(--review-text);
  font-size: 10.5px;
  font-weight: 800;
  white-space: nowrap;
}

.ci-temporal-disclosure-body {
  padding: 12px;
}

.ci-temporal-disclosure-body > .ci-table-wrap {
  margin: 0;
}

@media (max-width: 1100px) {
  .ci-temporal-artifact-summary {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }
}

@media (max-width: 820px) {
  .ci-temporal-explainer-grid {
    grid-template-columns: 1fr;
  }

  .ci-temporal-detail-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .ci-temporal-disclosure-summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .ci-temporal-disclosure-count {
    margin-left: 0;
  }
}

@media (max-width: 620px) {
  .ci-temporal-artifact-summary {
    grid-template-columns: 1fr 1fr;
  }

  .ci-temporal-artifact-summary .ci-metric-card:first-child {
    grid-column: 1 / -1;
  }

  .ci-temporal-detail-toolbar .ci-action-row {
    width: 100%;
  }
}
/* END imported module: assets/css/components/primitives/tables-links.css */
/* BEGIN imported module: assets/css/components/primitives/metadata.css */
/* CodeIntent CSS module: Shared metadata and detail primitives.
   Shared ci-* primitives for compact label/value metadata and detail rows. */

.ci-detail-field {
  margin-bottom: 15px;
}

.ci-detail-field .ci-detail-label {
  font-size: 10px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 800;
  margin-bottom: 5px;
}

.ci-detail-field .ci-detail-value {
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.5;
}

.ci-detail-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border-subtle);
  font-size: 12.5px;
  min-width: 0;
}

.ci-detail-row .ci-detail-key {
  color: var(--text-muted);
}

.ci-detail-row .ci-detail-value {
  font-weight: 700;
  color: var(--text-secondary);
  text-align: right;
  min-width: 0;
  max-width: 68%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.ci-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 9px;
  margin-top: 12px;
}

.ci-meta-item {
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 9px 10px;
  background: var(--surface-subtle);
  min-width: 0;
}

.ci-meta-label {
  display: block;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.ci-meta-value {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

/* Single-line variant of ci-meta-grid for cards whose Type/Owner/Detail values are short
   enough that three boxed tiles are pure vertical padding. */
.ci-meta-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 5px 10px;
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--text-secondary);
}

.ci-meta-inline .ci-meta-label {
  display: inline;
  margin-bottom: 0;
  margin-right: 4px;
}

.ci-meta-inline-sep {
  color: var(--border-default);
}

/* Responsive: Shared metadata primitives stack at 620px. */
@media (max-width: 620px) {
  .ci-meta-grid {
    grid-template-columns: 1fr;
  }

  .ci-detail-row {
    display: block;
  }

  .ci-detail-row .ci-detail-value {
    display: block;
    text-align: left;
    max-width: none;
    margin-top: 4px;
  }
}


.ci-detail-list {
  display: grid;
  gap: 6px;
  margin: 0;
}

.ci-detail-list .ci-detail-row {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  gap: 8px;
  border-top: 1px solid var(--border-subtle);
  border-bottom: 0;
  padding: 7px 0 0;
}

.ci-detail-list dt {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .45px;
}

.ci-detail-list dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
  color: var(--text-primary);
  font-size: 12px;
}

.ci-disclosure {
  margin-top: 8px;
  max-width: 320px;
}

.ci-disclosure summary {
  cursor: pointer;
  color: var(--text-muted);
  font-size: 11.5px;
  font-weight: 800;
}

.ci-disclosure pre {
  max-height: 220px;
  overflow: auto;
  margin: 8px 0 0;
  padding: 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: rgba(12,18,32,.04);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* Responsive: Shared detail lists stack at 620px. */
@media (max-width: 620px) {
  .ci-detail-list .ci-detail-row {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

/* Semantic-snapshot history keeps superseded producer output visible without
   giving prior immutable snapshots the same visual weight as the current handoff. */
.ci-snapshot-history {
  margin: 0;
}

.ci-snapshot-history > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--surface-subtle);
  color: var(--text-secondary);
  font-size: 12px;
}

.ci-snapshot-history > summary::marker {
  color: var(--text-muted);
}

.ci-snapshot-history-body {
  margin-top: 12px;
}

@media (max-width: 620px) {
  .ci-snapshot-history > summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
}

/* Revision provenance keeps machine identity available for audit without
   letting it dominate human-facing revision selection. */
.ci-revision-provenance {
  max-width: 720px;
}

.ci-revision-provenance .ci-detail-list {
  margin-top: 7px;
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--surface-subtle);
}

.ci-revision-provenance .ci-detail-list .ci-detail-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.ci-revision-provenance .ci-detail-list .ci-detail-row:last-child {
  padding-bottom: 0;
}


/* Human governance is shown as a compact Decision Record beneath the source-established Intent Item. */
.ci-intent-decision-record {
  width: min(100%, 760px);
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--surface-subtle);
}

.ci-intent-decision-record-title {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 4px;
}

.ci-intent-decision-record .ci-detail-list {
  gap: 4px;
}

.ci-intent-decision-record .ci-detail-list .ci-detail-row {
  grid-template-columns: minmax(100px, 140px) minmax(0, 1fr);
  padding-top: 6px;
}

@media (max-width: 620px) {
  .ci-intent-decision-record .ci-detail-list .ci-detail-row {
    grid-template-columns: 1fr;
  }
}
/* END imported module: assets/css/components/primitives/metadata.css */
/* BEGIN imported module: assets/css/components/primitives/status.css */
/* CodeIntent CSS module: Shared chip, badge, and status primitives. */
.ci-status-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 20px;
  padding: 2px 9px;
  border: 1px solid;
  white-space: nowrap;
  letter-spacing: .1px;
}

.ci-status-chip,
.ci-status-badge {
  color: var(--status-color, var(--neutral-text));
  background: var(--status-bg, var(--neutral-bg));
  border-color: var(--status-border, var(--neutral-border));
}

.ci-status-chip .ci-status-dot,
.ci-status-badge .ci-status-dot {
  display: inline-block;
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  min-width: 6px;
  border-radius: 50%;
  background: var(--status-dot, currentColor);
}

.c-verified,
.c-test {
  --status-color: var(--success-text);
  --status-bg: var(--success-bg);
  --status-border: var(--success-border);
  --status-dot: var(--accent-primary);
}


.c-preserved {
  --status-color: var(--success-text);
  --status-bg: var(--success-bg);
  --status-border: var(--success-border);
  --status-dot: var(--accent-primary-strong);
}

.c-allowed {
  --status-color: var(--neutral-text);
  --status-bg: var(--neutral-bg);
  --status-border: var(--neutral-border);
  --status-dot: var(--neutral-text);
}

.c-review {
  --status-color: var(--review-text);
  --status-bg: var(--review-bg);
  --status-border: var(--review-border);
  --status-dot: var(--review-text);
}

.c-governed {
  --status-color: var(--info-text);
  --status-bg: var(--info-bg);
  --status-border: var(--info-border);
  --status-dot: var(--info-text);
}

.c-orphaned {
  --status-color: var(--text-muted);
  --status-bg: var(--neutral-status-bg);
  --status-border: var(--neutral-status-line);
  --status-dot: var(--text-subtle);
}

.c-net {
  --status-color: var(--net-new-text);
  --status-bg: var(--net-new-bg);
  --status-border: var(--net-new-border);
  --status-dot: var(--net-new-text);
}

.c-blocked {
  --status-color: var(--risk-text);
  --status-bg: var(--risk-bg);
  --status-border: var(--risk-border);
  --status-dot: var(--risk-text);
}

.c-reg {
  --status-color: var(--info-text);
  --status-bg: var(--info-bg);
  --status-border: var(--info-border);
  --status-dot: var(--info-text);
}

.ci-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 5px;
  padding: 2px 7px;
  border: 1px solid;
  letter-spacing: .2px;
}

.ci-deterministic {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  font-weight: 700;
  color: var(--success-text);
  text-transform: uppercase;
  letter-spacing: .6px;
}

.ci-deterministic .ci-deterministic-mark {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--accent-primary);
  transform: rotate(45deg);
}


.ci-chip-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.ci-chip-row .ci-status-chip {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
/* END imported module: assets/css/components/primitives/status.css */
/* BEGIN imported module: assets/css/components/primitives/metrics.css */
/* CodeIntent CSS module: Shared metric and progress primitives. */
.ci-metric-card {
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  padding: 13px 14px;
  box-shadow: var(--shadow);
  position: relative;
  align-self: start;
}

/* Fill the leftover tracks in a short trailing row of .ci-card-grid (auto-fill leaves the
   last row's unused columns blank rather than re-flowing items to fill them). */
.ci-metric-card.ci-metric-span-3 {
  grid-column: span 3;
}

.ci-metric-card.ci-metric-span-2 {
  grid-column: span 2;
}


.ci-metric-card[href],
a.ci-metric-card {
  display: block;
  color: var(--text-primary);
  text-decoration: none;
}

a.ci-metric-card:hover {
  border-color: var(--success-border);
  transform: translateY(-1px);
  box-shadow: var(--shadow-lg);
  text-decoration: none;
}

.ci-metric-card .ci-metric-label .info.ci-icon {
  font-size: 14px;
  line-height: 1;
  color: var(--text-subtle);
  margin-left: auto;
  font-variation-settings: "FILL" 0,"wght" 300,"GRAD" 0,"opsz" 20;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}

.ci-metric-card .ci-metric-label .info.ci-icon:hover,
.ci-metric-card .ci-metric-label .info.ci-icon:focus {
  color: var(--neutral-text);
}

.ci-metric-card .ci-metric-label {
  font-size: 10.5px;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 5px;
}

.ci-metric-card .ci-metric-value {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.4px;
  margin-top: 5px;
  color: var(--text-primary);
}

.ci-metric-card .ci-metric-value small {
  font-size: 13px;
  color: var(--text-muted);
  font-weight: 600;
}

.ci-metric-card .ci-metric-foot {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 3px;
}

.ci-metric-card .ci-progress {
  height: 5px;
  border-radius: 4px;
  background: var(--border-subtle);
  margin-top: 9px;
  overflow: hidden;
}

.ci-metric-card .ci-progress i,
.ci-metric-card .ci-progress-fill {
  display: block;
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg,var(--accent-primary),var(--accent-positive));
}

.ci-metric-card .ci-metric-value.ci-metric-value-warning {
  color: var(--review-text);
}

.ci-metric-card .ci-metric-value.ci-metric-value-success {
  color: var(--accent-primary-strong);
}

.ci-metric-card .ci-metric-value.ci-metric-value-build-status {
  font-size: 18px;
  padding-top: 5px;
}

.ci-progress-fill {
  width: var(--fill-pct, 0%);
  transition: width .3s ease;
}

.ci-metric-card.is-accent {
  border-color: var(--success-border);
  background: linear-gradient(180deg,#fbfffd,#f2fbf8);
}

.ci-metric-card.is-warning {
  border-color: var(--review-border);
  background: linear-gradient(180deg,#fffdfa,#fbf0dd);
}

.info {
  cursor: help;
  color: var(--text-subtle);
  font-weight: 700;
}
/* END imported module: assets/css/components/primitives/metrics.css */
/* BEGIN imported module: assets/css/components/primitives/feedback.css */
/* CodeIntent CSS module: Shared callout and empty-state primitives. */
.ci-callout {
  display: block;
  padding: 12px 14px;
  border: 1px solid var(--border-default);
  border-radius: 10px;
  background: var(--surface-card);
  color: var(--text-secondary);
  box-shadow: var(--shadow);
}

.ci-callout-body {
  display: grid;
  gap: 4px;
}

.ci-callout-title {
  color: var(--text-primary);
  font-weight: 800;
}

.ci-callout-text {
  color: var(--text-secondary);
}

.ci-callout.is-success {
  border-color: var(--success-border);
  background: var(--success-bg);
  color: var(--success-text);
}

.ci-callout.is-error {
  border-color: var(--risk-border);
  background: var(--risk-bg);
  color: var(--risk-text);
}

.ci-callout.is-warning {
  border-color: var(--review-border);
  background: var(--review-bg);
  color: var(--review-text);
}

.ci-callout.is-info {
  border-color: var(--border-default);
  background: #fbfcfc;
  color: var(--text-muted);
}

.ci-empty-state {
  border: 1px dashed var(--border-default);
  border-radius: 10px;
  background: var(--surface-subtle);
  padding: 18px;
  color: var(--text-secondary);
}

.ci-empty-title {
  color: var(--text-primary);
  font-weight: 800;
  margin-bottom: 6px;
}

.ci-empty-state p {
  margin: 0 0 8px;
  max-width: 760px;
}

.ci-empty-foot {
  color: var(--text-muted);
  font-size: 12px;
}

.ci-empty-row {
  text-align: center;
  color: var(--text-muted);
  padding: 18px;
}

.ci-text-block {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

.ci-text-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* END imported module: assets/css/components/primitives/feedback.css */
/* BEGIN imported module: assets/css/components/primitives/pipeline.css */
/* CodeIntent CSS module: Shared pipeline, callout-strip, and common layout primitives. */
.ci-callout-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px dashed var(--border-default);
  border-radius: 8px;
  font-size: 11.3px;
  color: var(--text-muted);
  background: #fbfcfc;
}

.ci-callout-strip b {
  color: var(--text-secondary);
}

.ci-callout-strip .btn {
  margin-left: auto;
  padding: 5px 10px;
  font-size: 11.5px;
  background: #fff;
  color: var(--text-primary);
  border-color: var(--border-default);
}

.ci-callout-strip .ci-icon {
  font-size: 14px;
  color: var(--text-muted);
}

.workflow-strip {
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: 10px;
  padding: 16px 20px;
  box-shadow: var(--shadow);
}

.workflow-strip .workflow-title {
  font-size: 11px;
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 14px;
}

.workflow-steps {
  display: flex;
  align-items: flex-start;
}

.workflow-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  padding: 0 4px;
}

.workflow-step .workflow-step-node {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--accent-primary);
  color: var(--sem-map-tooltip-title);
  font-weight: 700;
  font-size: 13px;
  z-index: 2;
  box-shadow: 0 0 0 4px rgba(0,166,126,.14);
}

.workflow-step.is-current .workflow-step-node {
  background: var(--shell-surface);
  box-shadow: 0 0 0 4px rgba(26,43,43,.14);
}


.workflow-step .workflow-step-label {
  font-size: 11.5px;
  font-weight: 600;
  margin-top: 8px;
  color: var(--text-secondary);
}

.workflow-step .workflow-step-subtext {
  font-size: 10.5px;
  color: var(--text-muted);
  margin-top: 1px;
}

.workflow-step::before {
  content: "";
  position: absolute;
  top: 15px;
  left: -50%;
  width: 100%;
  height: 2px;
  background: var(--accent-primary);
  z-index: 1;
}

.workflow-step:first-child::before {
  display: none;
}


.workflow-step.is-current::before {
  background: var(--accent-primary);
}

.two-col-main-aside {
  grid-template-columns: minmax(0,1fr) minmax(280px,360px);
  align-items: start;
}

/* Responsive: Shared main/aside page grids stack at the approved 1180px breakpoint. */
@media (max-width:1180px) {
  .two-col-main-aside {
    grid-template-columns: 1fr;
  }
}

/* Responsive: Shared callout strips stack at 760px. */
@media (max-width:760px) {
  .ci-callout-strip {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .ci-callout-strip .btn {
    margin-left: 0;
  }
}
/* END imported module: assets/css/components/primitives/pipeline.css */

/* Components */
/* BEGIN imported module: assets/css/components/code-view.css */
/* CodeIntent CSS module: Shared CodeIntent code-view contract and desktop source table behavior.
   Source order preserved from the monolithic app.css split. */

/* Shared CodeIntent code-view contract. CodeIntent owns line identity and state;
   Highlight.js only decorates the inner code text when enabled. */
.ci-code-view {
  background: var(--code-surface);
  color: var(--code-text);
  padding: 9px 0;
  overflow: auto;
  font-size: 12px;
  line-height: 1.45;
  max-height: 420px;
  --ci-code-gutter-pad: 8px;
  --ci-code-gutter-measure: 0ch;
  --ci-code-row-gap: 10px;
  --ci-code-row-padding: 1px 12px;
}

.ci-code-lines {
  counter-reset: ci-code-line var(--ci-code-line-offset, 0);
  list-style: none;
  margin: 0;
  padding: 0;
}

.ci-code-lines > li {
  display: grid;
  grid-template-columns: calc(var(--ci-code-gutter-measure, 0ch) + 1ch + var(--ci-code-gutter-pad, 8px)) minmax(0,1fr);
  gap: var(--ci-code-row-gap);
  padding: var(--ci-code-row-padding);
  border-left: 3px solid transparent;
  counter-increment: ci-code-line;
  white-space: pre;
  cursor: pointer;
}


.ci-code-lines > li::before {
  content: counter(ci-code-line);
  color: var(--code-gutter-text);
  display: block;
  font-variant-numeric: tabular-nums;
  justify-self: stretch;
  min-width: 0;
  text-align: right;
  user-select: none;
  width: 100%;
}

.ci-code-lines > li > a {
  color: inherit;
  display: block;
  min-width: 0;
  text-decoration: none;
}

.ci-code-lines > li code {
  display: block;
  min-width: 0;
  overflow: visible;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  white-space: pre;
}

.ci-code-lines > li code.hljs {
  padding: 0;
  background: transparent;
}

.ci-code-lines > li code.hljs * {
  background: transparent;
}

.ci-code-view[data-syntax-highlighting="0"] code {
  color: inherit;
}

/* Real bound-range vs. padding-context distinction (Trace Explorer code panes).
   TraceLineWindowReader::artifactLineWindow() pads a few extra lines of context
   around the real traced range; .trace-line-in-range marks the actual bound
   lines so the padding reads as plain/dimmer context instead of looking like
   part of the claimed mapping. Reuses the same source/target accent tokens
   already used for lineage highlighting, scoped per pane via custom properties
   so source and target keep their distinct colors. */
.source-pane {
  --trace-pane-highlight-bg: var(--trace-source-highlight-bg);
  --trace-pane-highlight-border: var(--trace-source-highlight-border);
}

.target-pane {
  --trace-pane-highlight-bg: var(--trace-target-highlight-bg);
  --trace-pane-highlight-border: var(--trace-target-highlight-border);
}

.ci-code-lines > li.trace-line-in-range {
  background: var(--trace-pane-highlight-bg, transparent);
  border-left-color: var(--trace-pane-highlight-border, transparent);
}

.ci-code-lines > li.hot {
  background: var(--trace-target-highlight-bg);
  border-left-color: var(--trace-target-highlight-border);
  color: #f0fff9;
}

.ci-code-lines > li.hot::before {
  color: #a9d8ce;
}

.ci-code-lines > li:focus,
.ci-code-lines > li:focus-within {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}

.ci-code-lines > li.selected,
.ci-code-lines > li:target {
  background: var(--code-selected-bg);
  border-left-color: var(--focus-ring);
  color: var(--code-selected-ink);
}

.ci-code-lines > li.selected::before,
.ci-code-lines > li:target::before {
  color: var(--code-selected-ink);
}


/* Feature: User-selectable code viewer theme. */
body[data-code-theme="light"] {
  --code-surface: #f8fafb;
  --code-text: #243038;
  --code-gutter-text: #8b9aa0;
  --code-selected-bg: #cdeee3;
  --code-selected-ink: #0f3d34;
  /* Same visibility fix as the dark theme's tokens.css (.16 -> .40,
     confirmed live) -- scaled by the same ratio here since this theme
     wasn't independently visually verified (no light-themed session
     open to test against); revisit if a light-theme user reports the
     opposite problem (too strong). */
  --trace-source-highlight-bg: rgba(31,179,94,.35);
  --trace-target-highlight-bg: rgba(0,166,126,.35);
  --trace-boundary-bg: rgba(0,166,126,.12);
  --trace-boundary-bg-hover: rgba(0,166,126,.18);
  --trace-boundary-gutter: #0a705b;
  /* Light surfaces are already high-luminance, so the step-segmentation
     overlay (see tokens.css's dark-theme value) needs a much lighter touch
     to stay a visible band instead of crushing the pale ambient tint. */
  --trace-step-shade: rgba(0,0,0,.08);
}

body[data-code-theme="light"] .ci-code-view {
  border-color: #dce6e6;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

body[data-code-theme="light"] .ci-code-lines > li.hot {
  color: #143c35;
}

body[data-code-theme="light"] .ci-code-lines > li.hot::before {
  color: #0d705b;
}
/* END imported module: assets/css/components/code-view.css */
/* BEGIN imported module: assets/css/components/drawer.css */
/* CodeIntent CSS module: Drawer shell, interactions, tooltips, and row actions.
   Consolidated from the former components/drawers/* manifest to keep the drawer contract in one place. */

.ux-drawer-scrim {
  position: fixed;
  inset: 0;
  background: rgba(15,28,28,.34);
  z-index: 80;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s;
}

.ux-drawer-scrim.open {
  opacity: 1;
  pointer-events: auto;
}

.ux-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: max(35%, 440px);
  max-width: 92vw;
  background: var(--surface-card);
  z-index: 90;
  box-shadow: -12px 0 40px rgba(16,32,32,.2);
  transform: translateX(100%);
  transition: transform .2s cubic-bezier(.4,0,.2,1);
  display: flex;
  flex-direction: column;
}

.ux-drawer.open {
  transform: translateX(0);
}

.ux-drawer-head {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-default);
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.ux-drawer-head > div {
  min-width: 0;
  flex: 1 1 auto;
}

.ux-drawer-title {
  color: var(--text-primary);
  font-size: 15px;
  font-weight: 800;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ux-drawer-sub {
  color: var(--text-muted);
  font-size: 12px;
  margin-top: 4px;
}

.ux-drawer-close {
  margin-left: auto;
  border: 0;
  background: none;
  font-size: 20px;
  color: var(--text-muted);
  line-height: 1;
  padding: 0 4px;
  cursor: pointer;
}

.ux-drawer-close:hover {
  color: var(--text-primary);
}

.ux-drawer-body {
  padding: 18px 20px;
  overflow: auto;
  flex: 1;
}


[data-validation-rule] {
  cursor: pointer;
}

[data-validation-rule]:hover {
  background: #f6fffb;
}

.evidence-focus {
  box-shadow: 0 0 0 3px var(--success-ring);
  border-radius: 5px;
  background: #e8faf3;
}


.metric-tip {
  position: fixed;
  z-index: var(--z-tooltip);
  width: min(280px,calc(100vw - 24px));
  background: #102020;
  color: var(--sem-map-tooltip-title);
  border-radius: 8px;
  box-shadow: var(--shadow-lg);
  padding: 10px 12px;
  font: 700 12px/1.45 var(--font-ui);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-3px);
  transition: opacity .12s ease,transform .12s ease;
}

.metric-tip.on {
  opacity: 1;
  transform: translateY(0);
}

.ci-icon.action-arrow {
  font-size: 16px;
  line-height: 1;
  color: currentColor;
  font-variation-settings: "FILL" 0,"wght" 250,"GRAD" 0,"opsz" 20;
  vertical-align: -3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
/* END imported module: assets/css/components/drawer.css */
/* BEGIN imported module: assets/css/components/scope-rail.css */
/* CodeIntent CSS module: Scope rail, filters, and rule tab component. */
.scope-layout {
  display: grid;
  grid-template-columns: 306px minmax(0,1fr);
  align-items: start;
  gap: 14px;
}

.scope-control-rail {
  position: sticky;
  top: 8px;
  max-height: calc(100vh - 136px);
  overflow: auto;
  padding-right: 2px;
}

.scope-rail-tabs {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}

.scope-rail-tabs-three {
  grid-template-columns: repeat(3,minmax(0,1fr));
}

.scope-rail-tabs .btn {
  justify-content: center;
  min-width: 0;
}

.scope-rail-top-tabs {
  padding: 0 2px;
}

.scope-rail-summary {
  position: relative;
  top: auto;
  max-height: none;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}

.scope-rail-summary .scope-tree-body {
  min-height: 0;
  max-height: none;
  overflow: visible;
}

.scope-workarea {
  min-width: 0;
  min-height: 0;
}

.scope-tree-heading {
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.scope-tree-heading .ci-icon {
  color: var(--text-muted);
  font-size: 16px;
}

.scope-tree-heading .scope-tree-count {
  margin-left: auto;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--text-muted);
  font-size: 10.5px;
}

.scope-tree-reset-row {
  padding: 7px 6px 4px;
}

.scope-tree-reset {
  width: 100%;
  justify-content: center;
}

.scope-tree-body {
  overflow: auto;
  padding: 5px 5px 10px;
}

.scope-rail-summary .ci-detail-row {
  margin: 0 6px;
  padding: 8px 0;
}

.scope-rail-summary .ci-detail-row .ci-detail-value {
  white-space: nowrap;
}

.scope-control-rail .scope-rail-controls {
  gap: 8px;
  align-items: stretch;
}

.scope-control-rail .ci-filter-search {
  min-width: 0;
}

/* Scope and inventory tree controls. */
.scope-tree-node {
  width: 100%;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 12.5px;
  color: var(--text-secondary);
  user-select: none;
  text-align: left;
}

.scope-tree-node:hover {
  background: #eef7f3;
}

.scope-tree-node.is-active {
  background: #e3f3ec;
  color: var(--accent-primary-strong);
  font-weight: 700;
}

.scope-tree-node .scope-tree-caret {
  width: 13px;
  flex: 0 0 13px;
  color: var(--text-muted);
  transition: transform .12s;
  font-size: 16px;
  cursor: pointer;
}

.scope-tree-node.is-open .scope-tree-caret {
  transform: rotate(90deg);
}

.scope-tree-node .scope-tree-name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.scope-tree-node .scope-tree-node-count {
  font-size: 10.5px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.scope-tree-node.scope-tree-domain {
  font-weight: 700;
  color: var(--text-primary);
}

.scope-tree-node.scope-tree-entry {
  padding-left: 24px;
}

.scope-tree-node.scope-tree-entry .scope-tree-name {
  font-family: var(--font-mono);
  font-size: 11.3px;
}

.scope-tree-node.scope-tree-role-node .scope-tree-name {
  font-family: inherit;
  font-size: 12px;
}

.scope-tree-node.scope-tree-directory-node {
  padding-left: 42px;
}

.scope-tree-node.scope-tree-directory-node .scope-tree-name {
  font-family: var(--font-mono);
  font-size: 11.1px;
}

.scope-tree-node .scope-tree-node-icon {
  font-size: 14px;
  color: var(--text-subtle);
}

.scope-tree-children[hidden] {
  display: none;
}

.scope-loading {
  margin-left: 8px;
  color: var(--accent-primary-strong);
  font-weight: 700;
}
/* END imported module: assets/css/components/scope-rail.css */

/* Features */
/* BEGIN imported module: assets/css/features/artifact-markdown.css */
/* CodeIntent CSS module: Artifact Detail Markdown rendering.
   This file owns generated Markdown artifact preview presentation, not row-addressable source code views. */

/* Artifact Detail Markdown rendering. */
.artifact-markdown-shell {
  background: var(--surface-card);
  min-height: 420px;
  padding: 22px;
  overflow: auto;
}

.artifact-markdown-status {
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .35px;
  margin-bottom: 14px;
  text-transform: uppercase;
}

.artifact-markdown-body {
  color: var(--text-primary);
  max-width: 980px;
  overflow-wrap: anywhere;
}

.artifact-markdown-body > :first-child {
  margin-top: 0;
}

.artifact-markdown-body h1,
.artifact-markdown-body h2,
.artifact-markdown-body h3,
.artifact-markdown-body h4,
.artifact-markdown-body h5,
.artifact-markdown-body h6 {
  color: var(--text-primary);
  line-height: 1.25;
  margin: 1.45em 0 .55em;
}

.artifact-markdown-body h1 {
  font-size: 28px;
  border-bottom: 1px solid var(--border-default);
  padding-bottom: 10px;
}

.artifact-markdown-body h2 {
  font-size: 22px;
  border-bottom: 1px solid var(--border-default);
  padding-bottom: 8px;
}

.artifact-markdown-body h3 {
  font-size: 18px;
}

.artifact-markdown-body p,
.artifact-markdown-body li,
.artifact-markdown-body td,
.artifact-markdown-body th {
  line-height: 1.62;
}

.artifact-markdown-body a {
  color: var(--accent-primary-strong);
  font-weight: 700;
}

.artifact-markdown-body blockquote {
  border-left: 4px solid var(--accent-primary);
  color: var(--text-secondary);
  margin: 18px 0;
  padding: 6px 0 6px 16px;
}

.artifact-markdown-body code {
  background: var(--surface-subtle);
  border: 1px solid var(--border-default);
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: .92em;
  padding: 1px 5px;
}

.artifact-markdown-body pre {
  background: var(--code-surface);
  border: 1px solid var(--border-default);
  border-radius: 12px;
  overflow: auto;
  padding: 14px;
}

.artifact-markdown-body pre code {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: inherit;
  display: block;
  padding: 0;
  white-space: pre;
}

.artifact-markdown-body table {
  border-collapse: collapse;
  display: block;
  margin: 18px 0;
  overflow: auto;
  width: 100%;
}

.artifact-markdown-body th,
.artifact-markdown-body td {
  border: 1px solid var(--border-default);
  padding: 8px 10px;
  text-align: left;
}

.artifact-markdown-body th {
  background: var(--surface-subtle);
  font-size: 12px;
  letter-spacing: .35px;
  text-transform: uppercase;
}

.artifact-markdown-body img {
  border-radius: 10px;
  max-width: 100%;
}

.artifact-markdown-fallback-source,
.artifact-markdown-noscript {
  white-space: pre-wrap;
}
/* END imported module: assets/css/features/artifact-markdown.css */
/* BEGIN imported module: assets/css/features/artifact-detail.css */
/* CodeIntent CSS module: Artifact detail and shared artifact table controls.
   Source order preserved from the monolithic app.css split. */

/* Feature: Artifact Detail and shared artifact table controls. */
.artifact-table .art {
  font-weight: 800;
  color: var(--accent-primary-strong);
}

.artifact-table .art:hover {
  text-decoration: underline;
}

.artifact-detail-grid {
  display: grid;
  grid-template-columns: minmax(520px,1fr) 360px;
  gap: 14px;
  align-items: start;
  margin-top: 0;
}

.artifact-codepane {
  overflow: hidden;
}

.artifact-source-heading {
  min-width: 0;
}

.artifact-codebox {
  max-height: 720px;
}

.artifact-codebox .ci-code-lines > li {
  text-decoration: none;
  color: inherit;
}

.artifact-codebox .ci-code-lines > li:not(.selected):not(:target):hover {
  background: #17302f;
}

.artifact-codebox .ci-code-lines > li.hot:not(.selected):not(:target):hover {
  background: var(--trace-target-highlight-bg);
}

body[data-code-theme="light"] .artifact-codebox .ci-code-lines > li:not(.selected):not(:target):hover {
  background: #edf7f4;
}

body[data-code-theme="light"] .artifact-codebox .ci-code-lines > li.hot:not(.selected):not(:target):hover {
  color: #143c35;
}

.artifact-sidepanel {
  margin-top: 0;
}

.artifact-sidepanel .ci-detail-row {
  align-items: flex-start;
}



/* Responsive: Artifact Detail at 1180px. */
@media (max-width:1180px) {
  .artifact-detail-grid {
    grid-template-columns: 1fr;
  }

  .artifact-sidepanel {
    order: -1;
  }
}
/* END imported module: assets/css/features/artifact-detail.css */
/* BEGIN imported module: assets/css/features/artifact-source-viewer.css */
/* CodeIntent CSS module: Artifact source viewer progressive loading controls.
   Source order preserved from the monolithic app.css split. */

/* Artifact source viewer progressive loading controls. */
.artifact-source-header {
  gap: 14px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.artifact-source-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-default);
  background: var(--surface-subtle);
  position: sticky;
  top: 0;
  z-index: 3;
}

.artifact-source-status {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  margin-right: auto;
}

.artifact-jump-form {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.artifact-jump-form .ci-form-control {
  width: 96px;
  min-height: 34px;
  padding: 6px 8px;
  background: var(--surface-card);
}

.artifact-source-foot {
  min-height: 28px;
  padding: 7px 12px;
  border-top: 1px solid var(--border-default);
  color: var(--text-muted);
  font-size: 12px;
  background: var(--surface-subtle);
}

/* Responsive: Artifact source viewer toolbar at 760px. */
@media (max-width: 760px) {
  .artifact-source-toolbar {
    align-items: stretch;
  }

  .artifact-source-status,
  .artifact-jump-form,
  .artifact-source-toolbar .btn {
    width: 100%;
  }

  .artifact-jump-form {
    display: grid;
    grid-template-columns: 1fr auto;
  }

  .artifact-jump-form .ci-form-label {
    grid-column: 1 / -1;
  }

  .artifact-jump-form .ci-form-control {
    width: 100%;
  }
}


/* Artifact lineage grouping: one semantic rule with nested detailed mappings. */
.artifact-lineage-rule-list {
  gap: 14px;
}

.artifact-lineage-rule-card {
  gap: 10px;
}

.artifact-lineage-rule-heading {
  justify-content: flex-start;
}

.artifact-lineage-primary {
  display: grid;
  gap: 7px;
  padding-top: 10px;
  border-top: 1px solid var(--border-subtle);
}

.artifact-lineage-map-row,
.artifact-lineage-detail-row {
  display: grid;
  grid-template-columns: minmax(0, max-content) auto minmax(0, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.artifact-lineage-arrow {
  color: var(--text-muted);
  font-size: 17px;
}

.artifact-lineage-validation {
  justify-self: start;
}

.artifact-lineage-disclosure {
  margin-top: 4px;
  padding-top: 9px;
  border-top: 1px solid var(--border-subtle);
}

.artifact-lineage-disclosure summary {
  cursor: pointer;
  width: fit-content;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 800;
}

.artifact-lineage-disclosure[open] summary {
  color: var(--text-primary);
}

.artifact-lineage-detail-list {
  display: grid;
  gap: 6px;
  margin-top: 9px;
}

.artifact-lineage-detail-row {
  padding: 8px 10px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--surface-subtle);
}

.artifact-lineage-detail-location {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.artifact-lineage-detail-location > [data-full-path] {
  max-width: 100%;
}

.artifact-lineage-filter-note {
  margin: 0;
}

@media (max-width: 760px) {
  .artifact-lineage-map-row,
  .artifact-lineage-detail-row {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  .artifact-lineage-validation,
  .artifact-lineage-detail-row > .ci-status-badge,
  .artifact-lineage-detail-row > .muted {
    grid-column: 1 / -1;
  }
}

.artifact-lineage-section-note {
  margin: 4px 0 0;
  max-width: 760px;
  font-size: 12px;
}
/* END imported module: assets/css/features/artifact-source-viewer.css */
/* BEGIN imported module: assets/css/features/auth.css */
/* CodeIntent CSS module: Authentication gate and runtime chrome.
   Source order preserved from the monolithic app.css split. */

/* Feature: Authentication gate and runtime chrome. */
.auth-body {
  min-height: 100vh;
  background: radial-gradient(circle at 18% 20%,rgba(0,166,126,.22),transparent 32%),linear-gradient(135deg,var(--shell-surface-deep),var(--shell-surface) 48%,#0b1515);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  color: #e8f3f1;
}

.login-shell {
  width: min(100%,430px);
}

.login-panel {
  background: rgba(255,255,255,.97);
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 18px;
  box-shadow: 0 26px 90px rgba(0,0,0,.32);
  padding: 30px;
  color: var(--text-primary);
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 18px;
  font-weight: 700;
  color: var(--shell-surface);
  letter-spacing: .5px;
  margin-bottom: 28px;
}

.login-brand .mark {
  width: 34px;
  height: 30px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.login-brand .mark img {
  width: 34px;
  height: 30px;
  display: block;
  object-fit: contain;
}

.login-brand b {
  color: var(--accent-primary-strong);
}

.login-copy .eyebrow {
  font-size: 10.5px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--accent-primary-strong);
  font-weight: 800;
  margin: 0 0 7px;
}

.login-copy h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: 25px;
  line-height: 1.08;
  letter-spacing: -.35px;
}

.login-copy p {
  margin: 9px 0 0;
  color: var(--text-muted);
  font-size: 13.5px;
}

.login-feedback {
  margin-top: 18px;
}

.login-form {
  gap: 14px;
  margin-top: 22px;
}

.login-submit {
  justify-content: center;
  border-color: var(--accent-primary);
  background: var(--accent-primary);
  color: var(--sem-map-tooltip-title);
  border-radius: 9px;
  padding: 11px 14px;
  font-weight: 800;
  font-size: 13.5px;
  box-shadow: 0 12px 24px rgba(0,166,126,.2);
}

.login-submit:hover,
.login-submit:focus-visible {
  background: var(--accent-primary-strong);
  border-color: var(--accent-primary-strong);
}


/* Responsive: Authentication gate and mobile job metadata at 620px. */
@media (max-width:620px) {
  .login-panel {
    padding: 24px;
  }

  .job-meta {
    gap: 8px;
  }
}



.login-footnote {
  margin: 14px 0 0;
  color: var(--text-muted);
  font-size: 12.5px;
  text-align: center;
}

.login-footnote a {
  color: var(--accent-primary-strong);
  font-weight: 800;
  text-decoration: none;
}

.login-footnote a:hover,
.login-footnote a:focus-visible {
  text-decoration: underline;
  outline: none;
}

.invitation-panel .login-copy p:last-child {
  margin-bottom: 0;
}
/* END imported module: assets/css/features/auth.css */
/* BEGIN imported module: assets/css/features/admin.css */
/* CodeIntent CSS module: Administration-specific presentation. */

.ci-admin-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 5px 9px;
  border: 1px solid var(--border-default);
  border-radius: 999px;
  background: #fff;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  margin-left: auto;
}

.ci-admin-panel-note {
  margin: 10px 2px 0;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.45;
}

.ci-lifecycle-stack {
  display: grid;
  grid-template-columns: minmax(260px,.85fr) minmax(420px,1.35fr);
  align-items: start;
  gap: 12px;
}

.ci-lifecycle-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 12px;
  background: #fff;
}

.ci-lifecycle-card p {
  margin: 0;
  max-width: 980px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

.ci-lifecycle-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.ci-lifecycle-card-header h4 {
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.3;
}

.ci-lifecycle-kicker {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .75px;
  text-transform: uppercase;
}

.ci-lifecycle-danger {
  border-color: var(--risk-border);
  background: linear-gradient(180deg, #fff 0%, rgba(251,232,230,.28) 100%);
}

.ci-lifecycle-danger .ci-lifecycle-kicker,
.ci-lifecycle-danger h4 {
  color: var(--risk-text);
}

.ci-lifecycle-state {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid var(--border-default);
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.ci-lifecycle-state.is-restricted {
  border-color: var(--border-default);
  background: var(--surface-subtle);
  color: var(--text-muted);
}

.ci-lifecycle-state.is-blocked {
  border-color: var(--review-border);
  background: var(--review-bg);
  color: var(--review-text);
}

.ci-lifecycle-state.is-ready {
  border-color: var(--risk-border);
  background: var(--risk-bg);
  color: var(--risk-text);
}

.ci-lifecycle-dependencies {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: 8px;
  margin-top: 2px;
}

.ci-lifecycle-dependency {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 9px;
  background: rgba(255,255,255,.85);
  color: var(--text-secondary);
  font-size: 12px;
}

.ci-lifecycle-dependency span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ci-lifecycle-dependency strong {
  color: var(--text-primary);
  font-size: 13px;
}

.ci-lifecycle-delete-form {
  max-width: 720px;
  gap: 10px;
  padding-top: 2px;
}

.ci-lifecycle-delete-form .ci-form-label {
  color: var(--risk-text);
}

.ci-lifecycle-delete-form .ci-form-control:focus {
  border-color: var(--risk-text);
  box-shadow: 0 0 0 4px rgba(187,57,43,.11);
}

@media (max-width: 960px) {
  .ci-lifecycle-stack {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ci-admin-count {
    margin-left: 0;
  }

  .ci-lifecycle-card-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .ci-lifecycle-dependencies {
    grid-template-columns: 1fr;
  }
}

/* Administration: scope-aware Users directory. */
.ci-admin-users-toolbar {
  display: grid;
  grid-template-columns: auto minmax(300px,1fr) auto auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border-subtle);
}

.ci-admin-users-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px;
  border: 1px solid var(--border-default);
  border-radius: 9px;
  background: var(--surface-subtle);
}

.ci-admin-users-view-switch .btn {
  border-color: transparent;
  box-shadow: none;
}

.ci-admin-users-view-switch .btn.is-active {
  border-color: var(--success-border);
  background: #fff;
  box-shadow: var(--shadow);
}

.ci-admin-users-search {
  min-width: 0;
}

.ci-admin-users-search > span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .6px;
}

.ci-admin-users-toolbar > select {
  min-height: 36px;
  border: 1px solid var(--border-default);
  border-radius: 7px;
  background: #fff;
  padding: 7px 10px;
  color: var(--text-secondary);
  font-size: 12.5px;
}

.ci-admin-users-expand-actions {
  justify-content: flex-end;
}

.ci-admin-users-directory-note {
  margin: 0 0 12px;
}

.ci-access-directory {
  display: grid;
  gap: 10px;
}

.ci-access-directory-scope,
.ci-access-directory-subscope,
.ci-access-directory-project {
  border: 1px solid var(--border-default);
  border-radius: 10px;
  background: #fff;
  overflow: clip;
}

.ci-access-directory-system {
  border-color: var(--info-border);
}

.ci-access-directory-summary,
.ci-access-directory-subsummary {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  list-style: none;
  color: var(--text-primary);
}

.ci-access-directory-summary {
  min-height: 60px;
  padding: 12px 14px;
  background: var(--surface-subtle);
}

.ci-access-directory-system > .ci-access-directory-summary {
  background: var(--info-bg);
}

.ci-access-directory-subsummary {
  min-height: 50px;
  padding: 10px 12px;
  background: rgba(247,250,249,.78);
}

.ci-access-directory-summary::-webkit-details-marker,
.ci-access-directory-subsummary::-webkit-details-marker {
  display: none;
}

.ci-access-directory-summary::before,
.ci-access-directory-subsummary::before {
  content: "chevron_right";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: var(--text-muted);
  font-family: var(--font-icons);
  font-size: 20px;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "liga";
}

.ci-access-directory-scope[open] > .ci-access-directory-summary::before,
.ci-access-directory-subscope[open] > .ci-access-directory-subsummary::before,
.ci-access-directory-project[open] > .ci-access-directory-subsummary::before {
  content: "expand_more";
}

.ci-access-directory-scope[open] > .ci-access-directory-summary,
.ci-access-directory-subscope[open] > .ci-access-directory-subsummary,
.ci-access-directory-project[open] > .ci-access-directory-subsummary {
  border-bottom: 1px solid var(--border-subtle);
}

.ci-access-directory-context-title {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ci-access-directory-context-title strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 13.5px;
  line-height: 1.3;
}

.ci-access-directory-kicker {
  color: var(--text-muted);
  font-size: 9.5px;
  font-weight: 850;
  letter-spacing: .75px;
  text-transform: uppercase;
}

.ci-access-directory-summary-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px 10px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.ci-access-directory-body,
.ci-access-directory-subbody {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.ci-access-directory-subbody {
  padding: 10px;
}

.ci-access-directory-branch {
  display: grid;
  gap: 8px;
}

.ci-access-directory-branch + .ci-access-directory-branch {
  padding-top: 12px;
  border-top: 1px solid var(--border-subtle);
}

.ci-access-directory-branch-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
}

.ci-access-directory-branch-heading h4 {
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: 12.5px;
}

.ci-access-directory-branch-heading > span {
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 700;
  white-space: nowrap;
}

.ci-access-directory-subscopes,
.ci-access-directory-projects,
.ci-access-directory-member-list {
  display: grid;
  gap: 7px;
}

.ci-access-directory-subscope {
  border-color: var(--border-subtle);
  box-shadow: none;
}

.ci-access-directory-project {
  border-color: var(--border-subtle);
  border-radius: 8px;
  box-shadow: none;
}

.ci-access-directory-project > .ci-access-directory-subsummary {
  min-height: 46px;
  padding-top: 8px;
  padding-bottom: 8px;
  background: #fff;
}

.ci-access-directory-project > .ci-access-directory-member-list {
  padding: 8px;
  background: var(--surface-subtle);
}

.ci-access-directory-member {
  display: grid;
  grid-template-columns: minmax(0,1.45fr) minmax(190px,1fr) 100px 216px;
  align-items: center;
  gap: 10px 14px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: #fff;
}

.ci-access-directory-member:hover {
  border-color: var(--border-default);
  box-shadow: 0 4px 12px rgba(22,49,45,.05);
}

.ci-access-directory-identity {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.ci-access-directory-identity strong {
  color: var(--text-primary);
  font-size: 12.5px;
}

.ci-access-directory-identity > span {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}

.ci-access-directory-roles {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.ci-access-role {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid var(--neutral-border);
  border-radius: 999px;
  background: var(--neutral-bg);
  color: var(--neutral-text);
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.ci-access-role.is-inactive {
  border-style: dashed;
  color: var(--text-muted);
  background: var(--surface-subtle);
}

.ci-access-directory-user-status {
  justify-self: start;
  width: 100%;
}

.ci-access-directory-actions {
  display: grid;
  grid-template-columns: repeat(3, 68px);
  gap: 6px;
  justify-self: end;
  width: 216px;
}

.ci-access-directory-actions > a,
.ci-access-directory-actions > form,
.ci-access-directory-actions > form > button {
  width: 100%;
}

.ci-access-directory-actions > a,
.ci-access-directory-actions > form > button {
  justify-content: center;
}

.ci-admin-users-empty {
  margin-top: 12px;
  padding: 16px;
  border: 1px dashed var(--border-default);
  border-radius: 9px;
  background: var(--surface-subtle);
  color: var(--text-muted);
  font-size: 12.5px;
  text-align: center;
}

.ci-admin-users-flat-table {
  margin-top: 2px;
}

@media (max-width: 1180px) {
  .ci-admin-users-toolbar {
    grid-template-columns: auto minmax(260px,1fr) auto;
  }

  .ci-admin-users-expand-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .ci-access-directory-member {
    grid-template-columns: minmax(230px,1fr) minmax(180px,1fr) auto;
  }

  .ci-access-directory-actions {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

@media (max-width: 820px) {
  .ci-admin-users-toolbar {
    grid-template-columns: 1fr;
  }

  .ci-admin-users-view-switch,
  .ci-admin-users-expand-actions {
    justify-self: start;
  }

  .ci-access-directory-summary,
  .ci-access-directory-subsummary {
    grid-template-columns: auto minmax(0,1fr);
  }

  .ci-access-directory-summary-meta {
    grid-column: 2;
    justify-content: flex-start;
  }

  .ci-access-directory-member {
    grid-template-columns: minmax(0,1fr) auto;
  }

  .ci-access-directory-roles {
    grid-column: 1;
  }

  .ci-access-directory-user-status {
    grid-column: 2;
    grid-row: 1;
  }

  .ci-access-directory-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 560px) {
  .ci-admin-users-view-switch {
    display: grid;
    width: 100%;
  }

  .ci-admin-users-view-switch .btn {
    justify-content: center;
  }

  .ci-access-directory-member {
    grid-template-columns: 1fr;
  }

  .ci-access-directory-roles,
  .ci-access-directory-user-status,
  .ci-access-directory-actions {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }
}

/* Project import live progress ------------------------------------------------ */
.ci-import-live-run {
  margin-top: 14px;
}

.ci-import-live-run .ci-callout-body {
  gap: 10px;
}

.ci-import-live-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ci-import-live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  border: 1px solid var(--success-border);
  border-radius: 999px;
  background: var(--success-bg);
  color: var(--success-text);
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1;
}

.ci-import-live-indicator .ci-icon {
  font-size: 14px;
  animation: ci-import-live-spin 1.15s linear infinite;
}

.ci-import-live-progress {
  display: grid;
  gap: 9px;
  padding: 12px 13px;
  border: 1px solid var(--border-subtle);
  border-radius: 9px;
  background: var(--surface-subtle);
}

.ci-import-live-progress-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.ci-import-live-progress-head > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ci-import-live-progress-head strong {
  color: var(--text-primary);
  font-size: 12.5px;
  overflow-wrap: anywhere;
}

.ci-import-live-kicker,
.ci-import-live-log-head {
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .45px;
  text-transform: uppercase;
}

.ci-import-live-progress-value {
  color: var(--text-secondary);
  font-size: 11.5px;
  font-weight: 750;
  white-space: nowrap;
}

.ci-import-progress-bar {
  position: relative;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--border-subtle);
}

.ci-import-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--fill-pct, 0%);
  border-radius: inherit;
  background: linear-gradient(90deg,var(--accent-primary),var(--accent-positive));
  transition: width .25s ease;
}

.ci-import-progress-bar.is-indeterminate .ci-import-progress-fill {
  width: 28%;
  animation: ci-import-progress-indeterminate 1.15s ease-in-out infinite;
}

.ci-import-live-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 18px;
  color: var(--text-muted);
  font-size: 11px;
}

.ci-import-live-meta b {
  color: var(--text-secondary);
  font-weight: 750;
}

.ci-import-live-log-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 2px;
}

.ci-import-live-log-head span:last-child {
  color: var(--text-subtle);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.ci-import-live-log {
  max-height: 420px;
  margin: 0;
  padding: 11px 12px;
  overflow: auto;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  background: var(--surface-card);
  color: var(--text-secondary);
  font-size: 11.5px;
  line-height: 1.45;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.ci-import-live-error {
  margin: 0;
  color: var(--risk-text);
  font-weight: 650;
}

@keyframes ci-import-live-spin {
  to { transform: rotate(360deg); }
}

@keyframes ci-import-progress-indeterminate {
  from { transform: translateX(-120%); }
  to { transform: translateX(370%); }
}

@media (prefers-reduced-motion: reduce) {
  .ci-import-live-indicator .ci-icon,
  .ci-import-progress-bar.is-indeterminate .ci-import-progress-fill {
    animation: none;
  }
}

@media (max-width: 700px) {
  .ci-import-live-progress-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .ci-import-live-progress-value {
    white-space: normal;
  }

  .ci-import-live-log {
    max-height: 340px;
  }
}
/* END imported module: assets/css/features/admin.css */
/* BEGIN imported module: assets/css/features/ask.css */
/* CodeIntent CSS module: Ask CodeIntent execution transparency and retrieved-context presentation. */

[data-ask-execution-trace] .ci-panel-header {
  flex-wrap: wrap;
}

.ci-ask-trace-header-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.ci-ask-trace-id {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  color: var(--text-secondary);
}

.ci-ask-trace-id .mono {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ci-ask-trace-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: baseline;
  color: var(--text-muted);
  font-size: 12px;
}

.ci-ask-trace-summary-item {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  min-width: 0;
}

.ci-ask-trace-summary-item .ci-meta-label {
  display: inline;
  margin: 0;
}

.ci-ask-trace-step-list {
  display: grid;
  gap: 12px;
}

.ci-ask-trace-step {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  min-width: 0;
}

.ci-ask-trace-step-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  min-width: 0;
}

.ci-ask-trace-step-number {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 800;
}

.ci-ask-trace-origin {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
}

.ci-ask-trace-tool {
  display: inline-flex;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--surface-subtle);
  color: var(--text-secondary);
  font-size: 11px;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.ci-inline-code {
  padding: 1px 5px;
  border: 1px solid var(--border-default);
  border-radius: 6px;
  background: var(--surface-subtle);
  color: var(--text-primary);
  font-size: .92em;
}

.ci-ask-trace-step-title {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.ci-ask-trace-arguments {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 16px;
  margin: 0;
  padding: 0;
}

.ci-ask-trace-argument {
  display: flex;
  align-items: baseline;
  gap: 5px;
  min-width: 0;
}

.ci-ask-trace-argument dt {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ci-ask-trace-argument dd {
  margin: 0;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 12px;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ci-ask-trace-result {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 10px;
  align-items: baseline;
  padding-top: 9px;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
}

.ci-ask-trace-result .ci-meta-label {
  margin: 0;
}

.ci-ask-trace-identifiers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.ci-ask-trace-identifier {
  display: inline-flex;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--surface-subtle);
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}

.ci-ask-context-group {
  display: grid;
  gap: 12px;
}

.ci-ask-context-heading {
  padding: 0 2px;
}

.ci-ask-context-heading h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 13px;
}

.ci-ask-context-heading p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.45;
}



/* D2.19 Ask result-density polish: keep lower answer sections compact and let
   retrieved context use practical card widths instead of narrow auto-fill tracks. */
[data-ask-answer] {
  gap: 12px;
}

[data-ask-execution-trace] {
  padding: 12px;
}

[data-ask-execution-trace] > .ci-panel-header {
  padding: 10px 14px;
}

[data-ask-execution-trace] > .ci-panel-body {
  gap: 12px;
  padding: 12px 14px;
}

.ci-ask-trace-step-list {
  gap: 10px;
}

.ci-ask-trace-step {
  gap: 8px;
  padding: 12px 14px;
}

.ci-ask-trace-result {
  padding-top: 8px;
}

.ci-ask-context-group {
  gap: 8px;
}

.ci-ask-context-heading p {
  margin-top: 3px;
}

.ci-ask-context-group > .ci-form {
  gap: 10px;
}

.ci-ask-context-group article.ci-panel {
  padding: 12px;
}

.ci-ask-context-group article.ci-panel > .ci-panel-header {
  padding: 10px 14px;
}

.ci-ask-context-group article.ci-panel > .ci-panel-body {
  padding: 12px 14px;
}

.ci-ask-context-group .ci-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 10px;
  align-items: start;
}

.ci-ask-context-group .ci-link-card {
  gap: 5px;
  padding: 12px 14px;
}

/* Keep long recent-activity result labels contained inside the Ask side rail.
   Shared status chips remain single-line elsewhere in the application. */
[data-ask-surface] > aside,
[data-ask-surface] > aside .ci-form,
[data-ask-surface] > aside .ci-detail-field {
  min-width: 0;
}

[data-ask-surface] > aside .ci-status-chip {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* D4 investigation goal cards use a dedicated responsive grid rather than the
   generic auto-fill card primitive. This lets a short goal set consume the
   available execution-path width and keeps status, goal, and authority on
   distinct readable rows. */
[data-ask-investigation] {
  min-width: 0;
}

.ci-ask-investigation-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.ci-ask-investigation-goal {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 6px;
  min-width: 0;
  padding: 12px 14px;
}

.ci-ask-investigation-status {
  justify-self: start;
  max-width: 100%;
}

.ci-ask-investigation-goal-label,
.ci-ask-investigation-authority {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
}

.ci-ask-investigation-goal-label {
  color: var(--text-primary);
  line-height: 1.35;
}

.ci-ask-investigation-authority {
  line-height: 1.4;
}

.ci-ask-investigation-finding,
.ci-ask-live-goal-finding {
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 1.4;
}

.ci-ask-live-goal-outcome {
  color: var(--text-muted);
  font-size: 0.8rem;
  font-weight: 600;
}

@media (max-width: 760px) {
  .ci-ask-trace-header-meta {
    width: 100%;
    justify-content: flex-start;
  }

  .ci-ask-trace-result {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  .ci-ask-context-group .ci-card-grid {
    grid-template-columns: 1fr;
  }

  .ci-ask-investigation-grid {
    grid-template-columns: 1fr;
  }
}


/* Keep the Answer label visually attached to the answer card instead of
   floating between the external-provider status callout and the answer. */
.ci-ask-answer-section {
  margin-top: 6px;
}

.ci-ask-answer-section > .ci-detail-label {
  margin-bottom: 8px;
  padding-left: 2px;
}

/* Successful external-provider answers may use sanitized GitHub-flavored
   Markdown. Keep presentation scoped to Ask and contain wide code/tables. */
.ci-ask-answer-callout,
.ci-ask-markdown-body {
  min-width: 0;
}

.ci-ask-markdown-body {
  white-space: normal;
  line-height: 1.55;
}

.ci-ask-markdown-body > :first-child {
  margin-top: 0;
}

.ci-ask-markdown-body > :last-child {
  margin-bottom: 0;
}

.ci-ask-markdown-body h1,
.ci-ask-markdown-body h2,
.ci-ask-markdown-body h3,
.ci-ask-markdown-body h4,
.ci-ask-markdown-body h5,
.ci-ask-markdown-body h6 {
  margin: 18px 0 8px;
  line-height: 1.25;
}

.ci-ask-markdown-body h1 { font-size: 1.2rem; }
.ci-ask-markdown-body h2 { font-size: 1.12rem; }
.ci-ask-markdown-body h3 { font-size: 1.04rem; }
.ci-ask-markdown-body h4,
.ci-ask-markdown-body h5,
.ci-ask-markdown-body h6 { font-size: 1rem; }

.ci-ask-markdown-body p,
.ci-ask-markdown-body ul,
.ci-ask-markdown-body ol,
.ci-ask-markdown-body blockquote,
.ci-ask-markdown-body pre,
.ci-ask-markdown-body table {
  margin: 0 0 12px;
}

.ci-ask-markdown-body ul,
.ci-ask-markdown-body ol {
  padding-left: 24px;
}

.ci-ask-markdown-body li + li {
  margin-top: 4px;
}

.ci-ask-markdown-body blockquote {
  padding-left: 12px;
  border-left: 3px solid var(--border-strong);
}

.ci-ask-markdown-body :not(pre) > code {
  font-family: var(--font-mono);
  font-size: 0.92em;
  padding: 1px 5px;
  border: 1px solid var(--border-soft);
  border-radius: 5px;
  background: var(--surface-soft);
}

.ci-ask-markdown-body pre {
  max-width: 100%;
  overflow-x: auto;
  padding: 12px 14px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
}

.ci-ask-markdown-body pre code {
  white-space: pre;
}

.ci-ask-markdown-body .ci-markdown-table-scroll {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 12px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.ci-ask-markdown-body .ci-markdown-table-scroll table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  border-collapse: collapse;
  table-layout: auto;
}

.ci-ask-markdown-body th,
.ci-ask-markdown-body td {
  min-width: 0;
  padding: 7px 10px;
  border: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.ci-ask-markdown-body th {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

.ci-ask-markdown-body .ci-markdown-table-scroll table tr > :first-child {
  min-width: 7rem;
}

.ci-ask-markdown-body th code,
.ci-ask-markdown-body td code {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.ci-ask-markdown-body img {
  display: none !important;
}

.ci-ask-markdown-fallback {
  white-space: pre-wrap;
}

/* Ask keeps server-side progress live while presenting only the current
   activity. Full investigation detail remains available in the persisted trace. */
.ci-ask-live-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--text-secondary);
  line-height: 1.45;
}

.ci-ask-live-status > span:last-child {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Ask Markdown math rendering. Math delimiters are protected before Marked runs,
   then rendered through KaTeX after sanitization. Malformed LaTeX stays readable
   as its original source text instead of breaking the answer. */
.ci-ask-markdown-body .ci-markdown-math {
  max-width: 100%;
}

.ci-ask-markdown-body .ci-markdown-math-inline {
  display: inline-block;
  vertical-align: -0.08em;
}

.ci-ask-markdown-body .ci-markdown-math-display {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 12px 0;
  overflow-x: auto;
  overflow-y: hidden;
  text-align: center;
}

.ci-ask-markdown-body .ci-markdown-math-display .katex-display {
  margin: .35em 0;
}

.ci-ask-markdown-body .ci-markdown-math-fallback {
  font-family: var(--font-mono);
  white-space: pre-wrap;
}


.ci-ask-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ci-ask-submit-spinner {
  display: none;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
}

.ci-ask-submit[aria-busy="true"] .ci-ask-submit-spinner {
  display: inline-block;
  animation: ci-ask-submit-spin 0.8s linear infinite;
}

@keyframes ci-ask-submit-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .ci-ask-submit[aria-busy="true"] .ci-ask-submit-spinner {
    animation-duration: 1.8s;
  }
}

/* Ask claim provenance is stored canonically as
   [Epistemic status | Knowledge level]. Render that machine-readable contract
   as two intentional badges so the UI communicates two independent dimensions
   without exposing raw delimiter syntax. */
.ci-ask-markdown-body .ci-ask-claim-label-row,
.ci-ask-claim-label-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 10px;
  white-space: normal;
}

.ci-ask-claim-badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 22px;
  padding: 2px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.ci-ask-claim-badge-epistemic {
  font-weight: 700;
}

.ci-ask-claim-badge-epistemic.is-established {
  color: var(--success-text);
  background: var(--success-bg);
  border-color: var(--success-border);
}

.ci-ask-claim-badge-epistemic.is-inference {
  color: var(--info-text);
  background: var(--info-bg);
  border-color: var(--info-border);
}

.ci-ask-claim-badge-epistemic.is-judgment {
  color: var(--neutral-text);
  background: var(--neutral-bg);
  border-color: var(--neutral-border);
}

.ci-ask-claim-badge-epistemic.is-unresolved {
  color: var(--review-text);
  background: var(--review-bg);
  border-color: var(--review-border);
}

.ci-ask-claim-badge-ontology {
  color: var(--text-muted);
  background: transparent;
  border-color: var(--border-strong);
  font-weight: 600;
}
/* END imported module: assets/css/features/ask.css */
/* BEGIN imported module: assets/css/features/changes.css */
/* CodeIntent CSS module: Change and authorization experience. */

/*
 * The shared disclosure primitive is intentionally compact for metadata.
 * Authorize is an editing surface, so its affected-Intent chooser must use
 * the available working width rather than collapsing into a narrow column.
 */
.ci-authorize-intent-scope {
  width: 100%;
  max-width: none;
}

.ci-authorize-intent-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
  align-items: stretch;
}

.ci-form .ci-authorize-intent-option {
  min-height: 58px;
  padding: 10px 12px;
  cursor: pointer;
}

.ci-form .ci-authorize-intent-option > span {
  min-width: 0;
}

.ci-form .ci-authorize-intent-option strong {
  color: var(--text-primary);
}

.ci-form .ci-authorize-intent-option:hover {
  border-color: var(--border-strong);
}

.ci-form .ci-authorize-intent-option:has(input[type="checkbox"]:checked) {
  border-color: var(--accent-primary);
  background: var(--surface-subtle);
}

@media (max-width: 620px) {
  .ci-authorize-intent-grid {
    grid-template-columns: 1fr;
  }
}
/* END imported module: assets/css/features/changes.css */
/* BEGIN imported module: assets/css/features/canonical-experience.css */
/* Canonical M13 human product experience. */

/* Canonical record rows use the same breathing room regardless of which object list renders them. */
.ci-canonical-record-card {
  padding: var(--space-5);
  min-width: 0;
  overflow-wrap: anywhere;
}

.ci-canonical-record-card > :first-child {
  margin-top: 0;
}

.ci-canonical-record-card > :last-child {
  margin-bottom: 0;
}

.ci-canonical-inline-card {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-2);
  padding: var(--space-4);
  min-width: 0;
}

.ci-overview-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
  margin: 0 0 var(--space-6);
}

.ci-overview-metric-grid .ci-metric-card {
  display: grid;
  align-content: start;
  gap: var(--space-2);
  min-height: 118px;
}

.ci-overview-metric-grid .ci-metric-card > strong {
  font-size: 26px;
  line-height: 1.05;
  color: var(--text-primary);
}

.ci-overview-metric-grid .ci-metric-card > span:last-child {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.4;
}


.ci-canonical-intent-browser {
  display: grid;
  gap: var(--space-5);
}

.ci-canonical-intent-tools {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) auto;
  align-items: end;
  gap: var(--space-4);
}

.ci-canonical-intent-search {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
}

.ci-canonical-intent-search > span:first-child {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-secondary);
}

.ci-canonical-intent-search .ci-filter-search {
  width: 100%;
  min-width: 0;
}

.ci-canonical-intent-tools-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--space-3);
  min-height: 36px;
}

.ci-canonical-intent-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-5);
}

.ci-intent-card {
  display: grid;
  align-content: start;
  gap: var(--space-3);
  padding: var(--space-6);
  min-width: 0;
}

.ci-intent-card h4,
.ci-evidence-canonical-list h4 {
  margin: 0;
  overflow-wrap: anywhere;
}

.ci-intent-card p,
.ci-evidence-canonical-list p {
  margin: 0;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

/* Apply the evidence-list grid only to top-level Evidence records.
   Nested source/target anchor cards deliberately retain ci-canonical-inline-card's flex layout
   so their role chips render as compact pills instead of stretching across the row. */
.ci-evidence-canonical-list > .ci-canonical-record-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-6);
}

@media (max-width: 1500px) {
  .ci-canonical-intent-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .ci-overview-metric-grid,
  .ci-canonical-intent-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ci-canonical-intent-tools {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .ci-canonical-intent-tools-meta {
    justify-content: space-between;
  }
}

@media (max-width: 620px) {
  .ci-overview-metric-grid,
  .ci-canonical-intent-grid {
    grid-template-columns: 1fr;
  }
}
/* END imported module: assets/css/features/canonical-experience.css */
/* BEGIN imported module: assets/css/features/contextual-ask.css */
/* M13 contextual Ask: secondary, multi-turn interaction beside canonical objects. */
.contextual-ask-launcher {
  position: fixed;
  right: var(--space-6);
  bottom: var(--space-6);
  z-index: 95;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  box-shadow: var(--shadow-lg);
}

.contextual-ask-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 110;
  width: clamp(780px, 58vw, 1100px);
  max-width: 96vw;
  transform: translateX(102%);
  transition: transform 180ms ease;
  background: var(--surface-card);
  border-left: 1px solid var(--border-default);
  box-shadow: var(--shadow-lg);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.contextual-ask-drawer.is-open {
  transform: translateX(0);
}

.contextual-ask-scrim {
  position: fixed;
  inset: 0;
  z-index: 105;
  background: rgba(18, 32, 32, .34);
}

.contextual-ask-head {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  padding: var(--space-6);
  border-bottom: 1px solid var(--border-default);
  background: var(--surface-subtle);
}

.contextual-ask-head h2 {
  margin: 0;
  font-size: 16px;
}

.contextual-ask-context {
  display: block;
  margin-top: var(--space-1);
  color: var(--text-muted);
  font-size: 12px;
}

.contextual-ask-close {
  margin-left: auto;
}

.contextual-ask-body {
  min-height: 0;
  overflow: auto;
  padding: var(--space-6);
}

.contextual-ask-empty,
.contextual-ask-status {
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.5;
}

.contextual-ask-empty[hidden],
.contextual-ask-status[hidden] {
  display: none;
}

.contextual-ask-conversation {
  display: grid;
  gap: var(--space-4);
}

.contextual-ask-message {
  max-width: 92%;
  padding: var(--space-4);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-card);
  box-shadow: var(--shadow-sm);
}

.contextual-ask-message.is-user {
  justify-self: end;
  background: var(--surface-subtle);
}

.contextual-ask-message.is-assistant {
  justify-self: start;
}

.contextual-ask-message-label {
  margin-bottom: var(--space-2);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.contextual-ask-message-body {
  white-space: pre-wrap;
  line-height: 1.55;
}

.contextual-ask-message-body.ci-ask-markdown-body {
  white-space: normal;
}

.contextual-ask-status {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--border-subtle);
}

.contextual-ask-status.is-error {
  color: var(--danger-text, var(--text-default));
}

.contextual-ask-foot {
  padding: var(--space-6);
  border-top: 1px solid var(--border-default);
  background: var(--surface-card);
}

.contextual-ask-foot textarea {
  min-height: 92px;
  resize: vertical;
}

@media (max-width: 760px) {
  .contextual-ask-launcher {
    right: var(--space-4);
    bottom: var(--space-4);
  }

  .contextual-ask-drawer {
    width: 100vw;
  }

  .contextual-ask-message {
    max-width: 100%;
  }
}
/* END imported module: assets/css/features/contextual-ask.css */
/* BEGIN imported module: assets/css/features/explore.css */
.explore-shell{display:grid;grid-template-columns:minmax(220px,290px) minmax(0,1fr);min-height:0;border:1px solid var(--border-default);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-card);box-shadow:var(--shadow)}
.explore-session-rail{display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;background:var(--surface-subtle);border-right:1px solid var(--border-default);min-width:0;min-height:0}.explore-session-rail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--border-default)}.explore-provider-label{margin-top:4px;color:var(--text-secondary);font-size:12px;overflow-wrap:anywhere}.explore-session-list{display:grid;align-content:start;gap:4px;padding:8px;max-height:none;min-height:0;overflow-y:auto;overflow-x:hidden}.explore-session-item{display:block;width:100%;min-width:0;box-sizing:border-box;padding:10px 12px;border:1px solid transparent;border-radius:var(--radius-md);background:transparent;color:var(--text-primary);text-align:left;cursor:pointer}.explore-session-item:hover{background:var(--surface-card);border-color:var(--border-default)}.explore-session-item.is-active{background:var(--surface-card);border-color:var(--success-border);box-shadow:0 0 0 2px var(--success-ring)}.explore-session-item-title{display:block;font-weight:700;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.35}.explore-session-item-meta{display:flex;justify-content:space-between;gap:8px;margin-top:5px;color:var(--text-muted);font-size:11px;min-width:0;flex-wrap:wrap;overflow-wrap:anywhere}
.explore-conversation{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;overflow:hidden;min-width:0;min-height:0}.explore-conversation-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--border-default)}.explore-conversation-head h2{margin:3px 0 0;font-size:18px}.explore-revision-warning{margin:12px 20px 0}.explore-messages{display:flex;flex-direction:column;gap:18px;padding:24px;overflow:auto;min-width:0;min-height:0}.explore-welcome{max-width:780px;margin:auto;padding:28px;text-align:center}.explore-welcome h3{margin-top:0}.explore-suggestion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}.explore-suggestion{padding:12px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-card);color:var(--text-primary);font:inherit;cursor:pointer}.explore-suggestion:hover{border-color:var(--accent-primary);box-shadow:0 0 0 2px var(--success-ring)}
.explore-message{display:grid;gap:7px;max-width:920px}.explore-message.is-user{align-self:flex-end;max-width:min(760px,88%)}.explore-message.is-assistant{align-self:flex-start;width:min(920px,100%)}.explore-message-label{display:flex;align-items:center;gap:8px;color:var(--text-muted);font-size:11px;font-weight:700}.explore-message.is-user .explore-message-label{justify-content:flex-end}.explore-message-body{padding:12px 14px;border-radius:var(--radius-lg);line-height:1.55;overflow-wrap:anywhere}.explore-message.is-user .explore-message-body{background:var(--success-bg);border:1px solid var(--success-border)}.explore-message.is-assistant .explore-message-body{background:var(--surface-subtle);border:1px solid var(--border-default)}.explore-message-tools{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--text-muted)}.explore-trace-copy{border:0;background:none;color:var(--accent-primary-strong);font:inherit;font-weight:700;cursor:pointer;padding:0}.explore-status{min-height:20px;padding:0 20px 8px}.explore-status:empty{min-height:0;padding-bottom:0}.explore-live-progress{display:grid;gap:8px;padding:11px 13px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-subtle);box-shadow:var(--shadow)}.explore-progress-head{display:flex;align-items:center;gap:9px;min-width:0}.explore-progress-head strong{font-size:13px}.explore-progress-pulse{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--accent-primary);box-shadow:0 0 0 0 var(--success-ring);animation:explore-progress-pulse 1.35s ease-out infinite}.explore-live-progress.is-complete .explore-progress-pulse{background:var(--accent-positive);animation:none}.explore-live-progress.is-failed .explore-progress-pulse{background:var(--risk-text);animation:none}.explore-progress-count{margin-left:auto;color:var(--text-muted);font-size:11px;white-space:nowrap}.explore-progress-current{font-size:13px;color:var(--text-secondary);font-weight:700}.explore-progress-steps{display:grid;gap:4px}.explore-progress-step{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:9px;padding-top:5px;border-top:1px solid var(--border-subtle);font-size:11px}.explore-progress-step-state{min-width:38px;color:var(--accent-positive);font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:9px}.explore-progress-step.is-failed .explore-progress-step-state{color:var(--risk-text)}.explore-progress-step-copy{display:grid;gap:1px;min-width:0}.explore-progress-step-copy strong{font-size:11px}.explore-progress-step-copy span{color:var(--text-muted);overflow-wrap:anywhere}.explore-progress-step-time{color:var(--text-muted);white-space:nowrap}.explore-progress-trace{color:var(--text-muted);font-size:10px;overflow-wrap:anywhere}@keyframes explore-progress-pulse{0%{box-shadow:0 0 0 0 var(--success-ring)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}@media(prefers-reduced-motion:reduce){.explore-progress-pulse{animation:none}}.explore-composer{padding:14px 18px 18px;border-top:1px solid var(--border-default);background:var(--surface-card)}.explore-composer textarea{display:block;width:100%;resize:vertical;min-height:76px;max-height:240px}.explore-composer-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:10px}
@media(min-width:961px){.main:has(.explore-shell){overflow:hidden}.page.full:has(.explore-shell){display:flex;flex-direction:column;height:100%;min-height:0;box-sizing:border-box;gap:14px;padding:18px 24px}.page.full:has(.explore-shell)>.page-heading,.page.full:has(.explore-shell)>.ci-callout{flex:0 0 auto}.page.full:has(.explore-shell)>.explore-shell{flex:1 1 auto;min-height:0}}
@media(max-width:960px){.explore-shell{grid-template-columns:1fr}.explore-session-rail{border-right:0;border-bottom:1px solid var(--border-default)}.explore-session-list{display:grid;overflow-y:auto;overflow-x:hidden;max-height:260px}.explore-session-item{min-width:0}.explore-suggestion-grid{grid-template-columns:1fr}.explore-messages{padding:16px}.explore-conversation-head{padding:14px 16px}}

.explore-empty-sessions{padding:10px}
.explore-admin-transcript{display:grid;gap:12px}
/* END imported module: assets/css/features/explore.css */
/* BEGIN imported module: assets/css/features/intent-diff.css */
/* M5 Visa-first Intent Diff experience. The five customer buckets remain
   distinct from later artifact dispositions and formal Change Outcomes. */
.intent-diff-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.intent-diff-summary-card {
  display: grid;
  gap: 3px;
  padding: 14px;
  border: 1px solid var(--status-border, var(--border-default));
  border-radius: var(--radius-md);
  background: var(--status-bg, var(--surface-card));
  color: var(--status-color, var(--text-primary));
  text-decoration: none;
  box-shadow: var(--shadow);
}

.intent-diff-summary-card:hover,
.intent-diff-summary-card.is-active {
  border-color: var(--status-color, var(--accent-primary));
  box-shadow: inset 0 0 0 1px var(--status-color, var(--accent-primary)), var(--shadow);
  text-decoration: none;
}

.intent-diff-summary-card strong {
  font-size: 28px;
  line-height: 1;
}

.intent-diff-summary-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.intent-diff-summary-card.is-changed,
.intent-diff-status.is-changed,
.intent-diff-entry-card.is-changed {
  --status-color: var(--review-text);
  --status-bg: var(--review-bg);
  --status-border: var(--review-border);
}

.intent-diff-summary-card.is-preserved,
.intent-diff-status.is-preserved,
.intent-diff-entry-card.is-preserved {
  --status-color: var(--success-text);
  --status-bg: var(--success-bg);
  --status-border: var(--success-border);
}

.intent-diff-summary-card.is-introduced,
.intent-diff-status.is-introduced,
.intent-diff-entry-card.is-introduced {
  --status-color: var(--net-new-text);
  --status-bg: var(--net-new-bg);
  --status-border: var(--net-new-border);
}

.intent-diff-summary-card.is-removed,
.intent-diff-status.is-removed,
.intent-diff-entry-card.is-removed {
  --status-color: var(--risk-text);
  --status-bg: var(--risk-bg);
  --status-border: var(--risk-border);
}

.intent-diff-summary-card.is-cannot-establish,
.intent-diff-status.is-cannot-establish,
.intent-diff-entry-card.is-cannot-establish {
  --status-color: var(--neutral-text);
  --status-bg: var(--neutral-bg);
  --status-border: var(--neutral-border);
}

.intent-diff-status {
  color: var(--status-color);
  background: var(--status-bg);
  border-color: var(--status-border);
}

.intent-diff-entry-card {
  border-left: 4px solid var(--status-color, var(--border-default));
}

.intent-diff-entry-card > span,
.intent-diff-entry-card > em {
  max-width: 980px;
}

.intent-diff-pair-grid,
.intent-diff-side-grid,
.intent-diff-evidence-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

.intent-diff-pair-grid {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
}

.intent-diff-revision-card,
.intent-diff-side-card,
.intent-diff-evidence-card {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-subtle);
  padding: 14px;
}

.intent-diff-revision-card h3,
.intent-diff-side-card h3 {
  margin: 4px 0 8px;
}

.intent-diff-side {
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .08em;
}

.intent-diff-pair-arrow {
  color: var(--accent-primary-strong);
  font-size: 24px;
  font-weight: 800;
}

.intent-diff-pair-line {
  display: flex;
  align-items: center;
  gap: 16px;
}

.intent-diff-pair-line > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.intent-diff-bucket-section + .intent-diff-bucket-section {
  border-top: 1px solid var(--border-subtle);
  margin-top: 18px;
  padding-top: 18px;
}

.intent-diff-section-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.intent-diff-section-heading h3 {
  margin: 0;
}

.intent-diff-section-heading > span {
  color: var(--text-muted);
  font-size: 12px;
}

.intent-diff-secondary-groups {
  display: grid;
  gap: 12px;
}

.intent-diff-secondary-groups > details,
.intent-diff-provenance details,
.intent-diff-value {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-subtle);
}

.intent-diff-secondary-groups summary,
.intent-diff-provenance summary,
.intent-diff-value summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
}

.intent-diff-secondary-groups details > .ci-card-list,
.intent-diff-secondary-groups details > .ci-callout,
.intent-diff-provenance details > .ci-detail-row {
  margin-left: 12px;
  margin-right: 12px;
}

.intent-diff-secondary-groups details > .ci-card-list:last-child,
.intent-diff-provenance details > .ci-detail-row:last-child {
  margin-bottom: 12px;
}

.intent-diff-value pre {
  margin: 0 12px 12px;
  overflow: auto;
  white-space: pre-wrap;
}

.intent-diff-empty-side {
  border: 1px dashed var(--border-default);
  border-radius: var(--radius-md);
  color: var(--text-muted);
  padding: 14px;
}

.intent-diff-entry-actions {
  margin: -4px 0 12px;
}

.intent-diff-code-view {
  max-height: 70vh;
  --trace-pane-highlight-bg: color-mix(in srgb, var(--accent) 16%, transparent);
  --trace-pane-highlight-border: var(--accent);
}

.intent-diff-code-view .ci-code-lines > li.trace-line-in-range {
  box-shadow: inset 3px 0 0 var(--trace-pane-highlight-border);
}

@media (max-width: 960px) {
  .intent-diff-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .intent-diff-summary,
  .intent-diff-pair-grid,
  .intent-diff-side-grid,
  .intent-diff-evidence-grid {
    grid-template-columns: 1fr;
  }

  .intent-diff-pair-arrow {
    transform: rotate(90deg);
    justify-self: center;
  }

  .intent-diff-pair-line {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

.intent-diff-summary-compact {
  margin: 0;
}

.intent-diff-summary-compact .intent-diff-summary-card {
  padding: 10px 12px;
  box-shadow: none;
}

.intent-diff-summary-compact .intent-diff-summary-card strong {
  font-size: 20px;
}

.intent-diff-affected-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}

.intent-diff-path-list {
  margin: var(--space-2) 0 0;
  padding-left: 1.1rem;
}

.intent-diff-path-list li + li {
  margin-top: var(--space-1);
}

.intent-diff-contextual-ask textarea {
  width: 100%;
  resize: vertical;
  min-height: 5.5rem;
}

.intent-diff-ai-answer {
  margin-top: var(--space-4);
  white-space: normal;
}

@media (max-width: 760px) {
  .intent-diff-affected-grid {
    grid-template-columns: 1fr;
  }
}

/* M5 hardening: the five summary cards are persistent, independent filters.
   Selected/unselected behavior intentionally mirrors Trace Explorer. */
button.intent-diff-summary-card {
  width: 100%;
  appearance: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.intent-diff-summary-card.is-selected {
  border-color: var(--status-color, var(--accent-primary));
  box-shadow: inset 0 0 0 1px var(--status-color, var(--accent-primary)), var(--shadow);
}

.intent-diff-summary-card.is-unselected {
  background: var(--surface-card);
  border-color: var(--border-default);
  color: var(--text-muted);
  box-shadow: none;
  opacity: .58;
}

.intent-diff-summary-card.is-unselected:hover {
  opacity: .82;
  border-color: var(--status-color, var(--border-strong));
  box-shadow: none;
}

.intent-diff-summary-card:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.intent-diff-bucket-section[hidden] {
  display: none !important;
}

.intent-diff-filter-empty {
  padding: 22px;
  border: 1px dashed var(--border-default);
  border-radius: var(--radius-md);
  color: var(--text-muted);
  text-align: center;
}

.intent-diff-advisory-chip {
  margin-left: auto;
}

.intent-diff-contextual-ask-result,
.intent-diff-contextual-ask-progress {
  margin-top: 14px;
}

.intent-diff-ask-progress {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-subtle);
}

.intent-diff-ask-progress strong {
  min-width: 0;
  color: var(--text-primary);
}

.intent-diff-ask-answer {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-card);
}

.intent-diff-ask-answer h3 {
  margin: 0 0 12px;
}
/* END imported module: assets/css/features/intent-diff.css */
/* BEGIN imported module: assets/css/features/scope-ledger.css */
/* CodeIntent CSS module: Scope Ledger grouped, pivot, rail, and compact result views.
   Source order preserved from the monolithic app.css split. */

/* Feature: Scope Ledger grouped and pivot views. */
.scope-explorer {
  overflow: hidden;
}

.scope-aggregate-row td {
  background: #fff;
}

.scope-expand,
.scope-pivot-cell,
.scope-pivot-total {
  border: 0;
  background: transparent;
  color: var(--accent-primary-strong);
  font: inherit;
  font-weight: 800;
  padding: 0;
  text-align: left;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.scope-expand .ci-icon {
  font-size: 17px;
  color: var(--accent-primary-strong);
}

.scope-expand:hover,
.scope-pivot-cell:hover,
.scope-pivot-total:hover {
  text-decoration: none;
  color: var(--success-text);
}

.scope-expand.active,
.scope-pivot-cell.active,
.scope-pivot-total.active {
  color: var(--success-text);
}

.scope-drill-row > td {
  background: #f7fbfa;
  padding: 0;
}

.scope-drilldown {
  box-shadow: none;
}

.scope-drill-head {
  justify-content: space-between;
}

.scope-drill-head strong {
  color: var(--text-primary);
  font-size: 13px;
}

.scope-drill-table-wrap {
  max-height: 420px;
  overflow: auto;
  box-shadow: none;
}


.scope-expand-label {
  max-width: 340px;
}

.scope-expand-label span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Responsive: Scope Ledger rail controls at 960px. */
@media (max-width:960px) {
  .scope-rail-tabs-three {
    grid-template-columns: 1fr;
  }
}

/* Feature: Scope Ledger polish. */
.scope-explorer .scope-view-panel[data-scope-panel="detail"] .ci-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.scope-explorer .scope-view-panel[data-scope-panel="detail"] #scope-table {
  min-width: 980px;
}


.scope-explorer .scope-pager {
  margin: 0;
  padding: 14px 18px;
  border-top: 1px solid var(--border-default);
  background: linear-gradient(180deg,#fff,#f8fbfa);
  box-shadow: none;
  border-radius: 0;
  min-height: 52px;
}

.scope-explorer .scope-pager .btn {
  min-width: 86px;
  justify-content: center;
}

.scope-expand,
.scope-expand:hover,
.scope-expand:focus,
.scope-expand:active,
.scope-expand span,
.scope-expand:hover span,
.scope-expand:focus span,
.scope-expand:active span {
  text-decoration: none;
  border-bottom: 0;
}

.scope-expand {
  cursor: pointer;
}



/* Feature: Scope Ledger header click sorting. */
th:has(> .scope-sort-button) {
  cursor: pointer;
  transition: background-color .12s ease, color .12s ease;
}

th:has(> .scope-sort-button:hover) {
  background: var(--neutral-status-bg);
  color: var(--text-primary);
}

.scope-sort-button {
  appearance: none;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  display: block;
  position: relative;
  width: 100%;
  padding: 2px 16px 2px 0;
  margin: 0;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
  text-align: left;
  outline: 0;
}

.scope-sort-button:hover {
  color: var(--text-primary);
}

.scope-sort-button:focus-visible {
  color: var(--text-primary);
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  border-radius: 4px;
}

.scope-sort-button::before,
.scope-sort-button::after {
  color: var(--text-subtle);
  font-size: 8px;
  line-height: 1;
  opacity: .55;
  position: absolute;
  right: 2px;
}

.scope-sort-button::before {
  content: "▲";
  top: 2px;
}

.scope-sort-button::after {
  content: "▼";
  bottom: 2px;
}

.scope-sort-button[data-sort-direction="asc"]::before,
.scope-sort-button[data-sort-direction="desc"]::after {
  color: var(--text-primary);
  opacity: 1;
}

/* Feature: Scope Ledger compact workbench results. */
.scope-result-summary {
  margin: 0;
}

.scope-result-summary b {
  color: var(--text-secondary);
}

/* Desktop: Scope Ledger constrained rail and result scrolling. */
@media (min-width:1181px) {
  .main:has(.scope-layout) {
    overflow: hidden;
  }

  .page.full:has(.scope-layout) {
    height: 100%;
    overflow: hidden;
    padding-bottom: 22px;
    animation: none;
  }

  .scope-layout {
    height: 100%;
    min-height: 0;
  }

  .scope-control-rail {
    position: relative;
    top: auto;
    max-height: 100%;
    min-height: 0;
  }

  .scope-workarea,
  .scope-explorer {
    height: 100%;
  }

  .scope-explorer {
    display: flex;
    flex-direction: column;
  }

  .scope-view-panel {
    min-height: 0;
  }

  .scope-view-panel:not(.hidden) {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .scope-view-panel:not(.hidden) .ci-table-wrap {
    flex: 1;
    min-height: 0;
    overflow: auto;
  }

  .scope-view-panel[data-scope-panel="detail"] .scope-pager {
    flex: 0 0 auto;
  }
}

/* Scope Ledger pager and aggregate rows. */
.scope-pager {
  justify-content: center;
}

.scope-pager .btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}


.scope-total-row td {
  background: var(--surface-subtle);
  border-top: 2px solid var(--border-default);
  color: var(--text-primary);
  font-weight: 800;
}

/* Responsive: Scope Ledger layout at 1180px. */
@media (max-width:1180px) {
  .scope-layout {
    grid-template-columns: 1fr;
  }

  .scope-control-rail {
    position: relative;
    top: auto;
    max-height: none;
  }
}
/* END imported module: assets/css/features/scope-ledger.css */
/* BEGIN imported module: assets/css/features/semantic-map.css */
/* CodeIntent CSS module: Semantic Map shell, legend, sectioned readability, SVG layout, and compact label modes. */
/* Semantic Map: JS generates .sem-* status, .smtile-svg, and .sem-svg-label-* classes. */

.semmap .semantic-map-header {
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}

.semantic-map-heading {
  flex: 1 1 320px;
  min-width: 0;
}

.semantic-map-legend {
  flex: 0 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px 13px;
  margin-left: auto;
  padding-top: 2px;
}

.semantic-map-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-primary);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}

.semantic-map-legend-marker {
  display: inline-block;
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: var(--status-dot, currentColor);
}

.semantic-map-legend-item.c-verified .semantic-map-legend-marker { background: var(--sem-map-verified); }
.semantic-map-legend-item.c-accepted .semantic-map-legend-marker { background: var(--sem-map-verified); }
.semantic-map-legend-item.c-preserved .semantic-map-legend-marker { background: var(--sem-map-preserved); }
.semantic-map-legend-item.c-allowed .semantic-map-legend-marker { background: var(--sem-map-allowed); }
.semantic-map-legend-item.c-net .semantic-map-legend-marker { background: var(--sem-map-net); }
.semantic-map-legend-item.c-review .semantic-map-legend-marker { background: var(--sem-map-review); }
.semantic-map-legend-item.c-governed .semantic-map-legend-marker { background: var(--sem-map-governed); }
.semantic-map-legend-item.c-orphaned .semantic-map-legend-marker { background: var(--sem-map-orphaned); }
.semantic-map-legend-item.c-candidate .semantic-map-legend-marker { background: var(--sem-map-governed); }
.semantic-map-legend-item.c-gap .semantic-map-legend-marker { background: var(--sem-map-review); }

.semantic-map-boundary-marker .semantic-map-legend-marker {
  position: relative;
  flex-basis: 14px;
  width: 14px;
  height: 14px;
  border: 2px solid var(--sem-map-boundary-ring);
  border-radius: 50%;
  background: var(--surface-card);
  box-sizing: border-box;
}

.semantic-map-boundary-marker .semantic-map-legend-marker::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sem-map-boundary);
  transform: translate(-50%, -50%);
}

.semantic-map-body {
  display: grid;
  gap: 14px;
}

#semmapSvg {
  width: 100%;
  height: auto;
  display: none;
}

.sem-tile-help {
  color: var(--sem-map-help-ink);
  font-size: 10px;
}

.semantic-map-tooltip {
  position: fixed;
  z-index: 120;
  background: var(--sem-map-tooltip-bg);
  color: var(--sem-map-tooltip-ink);
  border-radius: 8px;
  box-shadow: var(--shadow-lg);
  padding: 10px 12px;
  font-size: 11.5px;
  line-height: 1.5;
  width: 252px;
  pointer-events: none;
  opacity: 0;
  transition: opacity .1s;
}

.semantic-map-tooltip.is-visible {
  opacity: 1;
}

.semantic-map-tooltip .semantic-map-tooltip-title {
  font-weight: 700;
  font-size: 12.5px;
  color: var(--sem-map-tooltip-title);
}

.semantic-map-tooltip .semantic-map-tooltip-summary {
  color: var(--sem-map-tooltip-subtle);
  font-size: 10.5px;
  margin-bottom: 5px;
}

.semantic-map-tooltip .semantic-map-tooltip-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.semantic-map-tooltip .semantic-map-tooltip-row b {
  color: var(--sem-map-tooltip-strong);
}

.semmap-board {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 14px;
}

.sem-section {
  flex: var(--sem-section-grow, 1) 1 0;
  min-width: 360px;
}

.sem-section-head {
  justify-content: space-between;
  min-width: 0;
}

.sem-section-title {
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 800;
  line-height: 1.35;
  min-width: 0;
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sem-section-meta {
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.sem-section-body {
  overflow: hidden;
}

/* Responsive: Semantic Map legend and section flow at 960px. */
@media (max-width:960px) {
  .semantic-map-legend {
    justify-content: flex-start;
    margin-left: 0;
  }

  .sem-section {
    flex-basis: 100%;
    min-width: 0;
  }
}

/* Responsive: Semantic Map section headers at 620px. */
@media (max-width:620px) {
  .sem-section-head {
    display: grid;
    gap: 4px;
  }

  .sem-section-meta {
    white-space: normal;
  }
}

.sem-section-svg {
  overflow: hidden;
}

.sem-section-map {
  display: block;
  width: 100%;
  height: auto;
  min-height: 146px;
  overflow: visible;
}

.smtile-svg {
  cursor: pointer;
  outline: none;
}

.smtile-svg .smtile-bg {
  stroke: rgba(255,255,255,.28);
  stroke-width: 1;
  transition: filter .12s ease, stroke .12s ease, stroke-width .12s ease;
}

.smtile-svg.sem-verified .smtile-bg { fill: var(--sem-map-verified); }
.smtile-svg.sem-accepted .smtile-bg { fill: var(--sem-map-verified); }
.smtile-svg.sem-preserved .smtile-bg { fill: var(--sem-map-preserved); }
.smtile-svg.sem-allowed .smtile-bg { fill: var(--sem-map-allowed); }
.smtile-svg.sem-net .smtile-bg { fill: var(--sem-map-net); }
.smtile-svg.sem-review .smtile-bg { fill: var(--sem-map-governed); }
.smtile-svg.sem-held .smtile-bg { fill: var(--sem-map-review); }
.smtile-svg.sem-orphaned .smtile-bg { fill: var(--sem-map-orphaned); }
.smtile-svg.sem-candidate .smtile-bg { fill: var(--sem-map-governed); }
.smtile-svg.sem-gap .smtile-bg { fill: var(--sem-map-review); }

.smtile-svg:hover .smtile-bg,
.smtile-svg:focus .smtile-bg {
  filter: brightness(1.06);
  stroke: var(--sem-map-label-ink);
  stroke-width: 2;
}

.smtile-svg:focus-visible .smtile-bg {
  stroke: var(--sem-map-label-ink);
  stroke-width: 3;
}

.sem-svg-wash {
  fill: rgba(255,255,255,.09);
  pointer-events: none;
}

.sem-svg-boundary {
  fill: var(--sem-map-boundary);
  stroke: var(--sem-map-label-ink);
  stroke-width: 3;
  filter: drop-shadow(0 0 0 var(--sem-map-boundary-ring));
  pointer-events: none;
}

.sem-svg-label {
  width: 100%;
  height: 100%;
  color: var(--sem-map-label-ink);
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: var(--font-ui);
  overflow: hidden;
  pointer-events: none;
  line-height: 1.2;
  position: relative;
}

.sem-svg-label-has-key {
  padding-bottom: 16px;
}

.sem-orphaned .sem-svg-label {
  color: var(--sem-map-orphan-label-ink);
}

.sem-section-svg-mount {
  width: 100%;
}

.sem-svg-title,
.sem-svg-meta,
.sem-svg-key,
.sem-svg-note {
  transform: none;
  overflow-wrap: normal;
  word-break: normal;
}

.sem-svg-title {
  font-size: 12px;
  font-weight: 800;
  line-height: 1.18;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sem-svg-meta {
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1.15;
  opacity: .94;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sem-svg-key {
  position: absolute;
  inset: auto 0 0 0;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.15;
  opacity: .9;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sem-svg-note {
  font-size: 10.5px;
  line-height: 1.25;
  opacity: .86;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sem-svg-label-small {
  gap: 3px;
}

.sem-svg-label-small .sem-svg-title {
  font-size: 11.5px;
  line-height: 1.14;
  -webkit-line-clamp: 2;
  white-space: normal;
}

.sem-svg-label-small .sem-svg-meta {
  font-size: 10px;
  line-height: 1.12;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sem-svg-label-medium .sem-svg-title {
  font-size: 13px;
  line-height: 1.18;
}

.sem-svg-label-medium .sem-svg-meta {
  font-size: 10.75px;
}

.sem-svg-label-large .sem-svg-title {
  font-size: 14px;
  line-height: 1.2;
}

.sem-svg-label-large .sem-svg-meta {
  font-size: 11px;
}

.sem-svg-label-strip {
  align-items: center;
  display: flex;
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 850;
  height: 100%;
  line-height: 1;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

.sem-svg-label-strip span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sem-svg-label-micro {
  height: 100%;
  overflow: hidden;
}
/* END imported module: assets/css/features/semantic-map.css */
/* BEGIN imported module: assets/css/features/source-map.css */
/* Source Map: full-height system-exploration workspace.
   Mermaid owns node/cluster geometry; CodeIntent owns the surrounding
   workspace, pan/zoom behavior, custom relationship edges, and detail drawer. */

.source-map-workspace {
  --source-map-tier-v: #2f9468;
  --source-map-tier-s: #b3922c;
  --source-map-tier-o: #3b6fa5;
  --source-map-tier-n: #c3c8c5;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--surface-card);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: 0 1px 2px rgba(16,32,32,.05);
  transition: margin-right .2s cubic-bezier(.4,0,.2,1);
}

.source-map-workspace-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-7);
  padding: 12px 14px;
  border-bottom: 1px solid var(--border-default);
  background: linear-gradient(180deg,#fff,var(--surface-subtle));
  flex: 0 0 auto;
}

.source-map-workspace-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
  flex: 1 1 360px;
}

.source-map-workspace-kicker {
  color: var(--accent-primary-strong);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 1.15px;
  text-transform: uppercase;
}

.source-map-workspace-title-row {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-width: 0;
}

.source-map-workspace-title-row h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.2;
}

.source-map-workspace-count {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 650;
}

.source-map-workspace-copy p {
  margin: 0;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.source-map-workspace-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  min-width: 0;
  margin-left: auto;
}

.source-map-legend-stack {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.source-map-legend-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.source-map-legend-row.is-secondary {
  color: var(--text-muted);
}

.source-map-legend-heading {
  color: var(--text-muted);
  font-size: 9.5px;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
}

.source-map-legend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-secondary);
}

.source-map-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.source-map-legend-sample {
  position: relative;
  width: 18px;
  height: 0;
  border-top: 2px solid currentColor;
  display: inline-block;
  flex: none;
}

.source-map-legend-sample.tier-v { color: var(--source-map-tier-v); }
.source-map-legend-sample.tier-s { color: var(--source-map-tier-s); }
.source-map-legend-sample.tier-o { color: var(--source-map-tier-o); }
.source-map-legend-sample.tier-n {
  color: var(--source-map-tier-n);
  border-top-width: 1px;
  opacity: .7;
}

.source-map-legend-sample.type-call {
  color: var(--text-muted);
}

.source-map-legend-sample.type-call::after {
  content: '';
  position: absolute;
  right: -1px;
  top: -4px;
  width: 0;
  height: 0;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 5px solid currentColor;
}

.source-map-legend-sample.type-access {
  color: var(--text-muted);
  border-top-style: dashed;
}

.source-map-legend-sample.type-other {
  color: var(--text-muted);
}

.source-map-region-note {
  color: var(--text-muted);
  font-size: 10px;
  white-space: nowrap;
}

.source-map-legend-empty {
  color: var(--text-muted);
  font-size: 10.5px;
}

.source-map-zoom-toolbar {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-left: 12px;
  border-left: 1px solid var(--border-default);
  flex: none;
}

.source-map-zoom-toolbar .btn {
  box-shadow: none;
}

.source-map-icon-button {
  width: 30px;
  height: 30px;
  padding: 0;
  justify-content: center;
}

.source-map-icon-button .ci-icon,
.source-map-fit-button .ci-icon {
  font-size: 17px;
}

.source-map-fit-button {
  height: 30px;
}

.source-map-zoom-readout {
  min-width: 3.6em;
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: var(--text-muted);
  font-size: 11px;
}

.source-map-viewport {
  position: relative;
  width: 100%;
  height: clamp(520px,70vh,760px);
  min-height: 520px;
  overflow: hidden;
  cursor: grab;
  background-color: #fbfcfc;
  background-image: radial-gradient(circle,rgba(100,112,121,.13) 1px,transparent 1px);
  background-size: 22px 22px;
  flex: 1 1 auto;
}

.source-map-viewport.dragging {
  cursor: grabbing;
}

.source-map-stage {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: 0 0;
}

.source-map-stage svg {
  display: block;
  overflow: visible;
}

.source-map-stage g.node,
.source-map-stage .source-map-custom-edge {
  cursor: pointer;
}

/* Mermaid groups are topology regions, not content cards. Keep them quiet so
   nodes and relationships remain the visual subject of the workspace. */
.source-map-stage g.cluster rect {
  rx: 8px;
  ry: 8px;
  stroke-width: 1px;
}

.source-map-stage .cluster-label,
.source-map-stage .cluster-label span,
.source-map-stage .cluster-label p {
  color: var(--text-secondary);
  font-weight: 750;
  letter-spacing: .015em;
}

/* Nodes should read like compact CodeIntent cards rather than default diagram
   boxes. Do not alter Mermaid transforms here; layout.js depends on them. */
.source-map-stage g.node {
  transition: opacity .14s ease,filter .14s ease;
  filter: drop-shadow(0 1px 1px rgba(16,32,32,.08));
}

.source-map-stage g.node:hover {
  filter: drop-shadow(0 2px 4px rgba(16,32,32,.16));
}

.source-map-stage g.node .label,
.source-map-stage g.node .nodeLabel {
  font-weight: 650;
}

/* Selection keeps the geographic context visible while making the active
   program/entity and its immediate relationships unmistakable. */
.source-map-viewport.has-source-map-selection g.node {
  opacity: .34;
}

.source-map-viewport.has-source-map-selection g.node.is-source-map-connected {
  opacity: .82;
}

.source-map-viewport.has-source-map-selection g.node.is-source-map-selected {
  opacity: 1;
  filter: drop-shadow(0 0 4px rgba(0,166,126,.5)) drop-shadow(0 2px 4px rgba(16,32,32,.14));
}

.source-map-viewport.has-source-map-selection .source-map-custom-edge {
  opacity: .12;
}

.source-map-viewport.has-source-map-selection .source-map-custom-edge.is-source-map-connected {
  opacity: 1;
}

/* Edges are drawn by layout.js, not Mermaid. Background edges stay quiet;
   hovered/selected relationships are raised into the foreground SVG group. */
.source-map-edge-line {
  fill: none;
  pointer-events: none;
}

.source-map-edge-hit {
  stroke: transparent;
  stroke-width: 16px;
  fill: none;
  pointer-events: stroke;
  cursor: pointer;
}

/* Drawer body: node detail (source/target code + idioms). */
.source-map-codebox {
  max-height: 420px;
  overflow: auto;
  font-size: .82rem;
}

.source-map-idiom-card {
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: .6rem .75rem;
  margin-bottom: .5rem;
}

.source-map-idiom-title {
  font-weight: 600;
  color: var(--text-primary);
}

.source-map-idiom-notation {
  font-family: var(--font-mono,monospace);
  color: var(--text-muted);
  font-size: .82rem;
}

/* Hover tooltip: business-logic text for the node/edge under the cursor. */
.source-map-tooltip {
  position: fixed;
  z-index: 120;
  background: var(--surface-card);
  color: var(--text-primary);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.5;
  width: 320px;
  max-height: 220px;
  overflow: auto;
  pointer-events: none;
  opacity: 0;
  transition: opacity .1s;
}

.source-map-tooltip.is-visible {
  opacity: 1;
}

.source-map-tooltip-title {
  font-weight: 700;
  font-size: 13px;
  color: var(--text-primary);
}

.source-map-tooltip-meta {
  color: var(--text-muted);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 5px;
}

.source-map-tooltip-body {
  color: var(--text-secondary);
}

/* Desktop Source Map is a workspace, not a vertically scrolling dashboard.
   The app header remains fixed by the shell grid; the map consumes exactly
   the main area's remaining height. */
@media (min-width:1181px) {
  /* Source Map is an application workspace, not a document page. Lock the
     Source Map shell to the dynamic viewport and make the second grid track
     explicitly shrinkable. This removes the browser/document scrollbar for
     any graph size while leaving normal CodeIntent pages unchanged. */
  html.source-map-page,
  body.source-map-page {
    overflow: hidden;
  }

  body.source-map-page .app {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    grid-template-rows: auto minmax(0,1fr);
    overflow: hidden;
  }

  body.source-map-page .main {
    min-height: 0;
    overflow: hidden;
  }

  /* The standard .page is content-sized. Anchor this one workspace directly
     to .main's definite content box so graph dimensions can never increase
     document height. */
  body.source-map-page .page.full {
    position: absolute;
    inset: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    animation: none;
  }

  body.source-map-page .source-map-workspace {
    height: auto;
    min-height: 0;
    flex: 1 1 0%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .source-map-viewport {
    height: auto;
    min-height: 0;
    flex: 1 1 0%;
  }
}

/* On wide screens the Source Map detail drawer behaves like an inspector:
   no modal dimmer, and the workspace yields the drawer width so the map stays
   visible instead of being hidden underneath it. */
@media (min-width:1420px) {
  body.source-map-page .ux-drawer-scrim.open {
    opacity: 0;
    pointer-events: none;
  }

  body.source-map-page:has(.ux-drawer.open) .source-map-workspace {
    margin-right: max(35vw,440px);
  }

  body.source-map-page .ux-drawer.open {
    border-left: 1px solid var(--border-default);
    box-shadow: -8px 0 26px rgba(16,32,32,.14);
  }
}

@media (max-width:1420px) {
  .source-map-workspace-head {
    align-items: flex-start;
  }

  .source-map-workspace-controls {
    display: grid;
    justify-items: end;
    gap: 8px;
  }
}

@media (max-width:960px) {
  .source-map-workspace-head {
    display: grid;
    gap: 10px;
  }

  .source-map-workspace-controls {
    justify-items: start;
  }

  .source-map-legend-stack {
    justify-items: start;
  }

  .source-map-legend-row {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .source-map-legend {
    justify-content: flex-start;
  }

  .source-map-region-note {
    white-space: normal;
  }

  .source-map-zoom-toolbar {
    padding-left: 0;
    border-left: 0;
  }
}
/* END imported module: assets/css/features/source-map.css */
/* BEGIN imported module: assets/css/features/trace-explorer/core-layout.css */
/* CodeIntent CSS module: Trace Explorer core layout and compact review workbench. */
/* Trace Explorer workbench shell. */
.trace-section {
  display: none;
}

.trace-section.active {
  display: block;
}

.trace-parity-section {
  min-width: 0;
}

.trace-workbench-grid {
  display: grid;
  grid-template-columns: minmax(300px,1fr) 360px minmax(300px,1fr);
  gap: 12px;
  align-items: start;
}


.trace-workbench-index {
  margin: 0;
}

.trace-workbench-index .ci-panel-body {
  display: grid;
  gap: 12px;
}

.trace-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 14px;
}

.trace-filter-pills {
  flex: 1 1 auto;
}

.trace-filter-chip {
  appearance: none;
  font: inherit;
  cursor: pointer;
  transition: opacity 120ms ease, background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.trace-filter-chip.is-selected {
  opacity: 1;
  box-shadow: 0 0 0 1px currentColor;
}

.trace-filter-chip.is-unselected {
  opacity: .48;
  background: transparent;
}

.trace-filter-chip:focus-visible {
  outline: 2px solid var(--accent-primary);
  outline-offset: 2px;
}

.trace-filter-chip:disabled {
  cursor: default;
  opacity: .28;
}

.trace-filter-summary {
  flex: 0 0 auto;
  white-space: nowrap;
}

.trace-filter-empty {
  padding: 4px 1px 0;
}

.trace-thread {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr 0.7fr 1.15fr;
  gap: 14px;
  align-items: start;
  margin-top: 0;
  min-width: 0;
  max-width: 100%;
}

.trace-codepane,
[data-trace-inspector-panel] {
  position: relative;
  z-index: 1;
}


.trace-parity-section.source-only-trace .trace-thread.source-only-thread {
  grid-template-columns: minmax(0, 1.25fr) minmax(520px, 1fr);
}

.trace-parity-section.source-only-trace [data-trace-inspector-panel] > .ci-panel-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.trace-parity-section.source-only-trace [data-trace-inspector-panel] > .ci-panel-header h3 {
  min-width: 0;
  font-size: 14px;
  line-height: 1.35;
}

.trace-parity-section.source-only-trace [data-trace-inspector-panel] > .ci-panel-header .ci-action-row {
  flex-wrap: nowrap;
  flex-shrink: 0;
}

.trace-parity-section.source-only-trace [data-trace-inspector-panel] > .ci-panel-header .ci-status-badge {
  white-space: nowrap;
}

.trace-codepane {
  display: flex;
  flex-direction: column;
  height: clamp(520px, 62vh, 760px);
  min-width: 0;
  max-width: 100%;
}

.trace-codepane .ci-code-view {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  max-height: none;
  overflow: auto;
  font-size: 12px;
  line-height: 1.47;
  padding: 10px 0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

[data-trace-inspector-panel] {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.trace-parity-section.is-inspector-expanded .trace-thread {
  isolation: isolate;
}

.trace-parity-section.is-inspector-expanded .source-pane {
  grid-column: 1;
  grid-row: 1;
}

.trace-parity-section.is-inspector-expanded .target-pane {
  grid-column: 3;
  grid-row: 1;
}

.trace-parity-section.is-inspector-expanded [data-trace-inspector-panel] {
  position: relative;
  z-index: 5;
  grid-column: 1 / -1;
  grid-row: 1;
  justify-self: center;
  align-self: start;
  width: min(1120px, calc(100% - 96px));
  max-width: calc(100% - 48px);
  max-height: none;
  overflow: visible;
  background: var(--surface-card);
  border-color: rgba(0, 166, 126, .32);
  box-shadow: 0 16px 44px rgba(13, 31, 31, .24), 0 0 0 1px rgba(0, 166, 126, .22);
}

.trace-parity-section.is-inspector-expanded [data-trace-inspector-panel] .ci-panel-body {
  max-height: none;
  overflow: visible;
}

.trace-parity-section.is-inspector-expanded .trace-thread [data-trace-inspector-panel]::before,
.trace-parity-section.is-inspector-expanded .trace-thread [data-trace-inspector-panel]::after,
.trace-parity-section.is-inspector-expanded .trace-evidence-connector {
  display: none;
}

.trace-thread [data-trace-inspector-panel]::before,
.trace-thread [data-trace-inspector-panel]::after {
  content: '';
  position: absolute;
  top: 58px;
  width: 14px;
  height: 2px;
  background: rgba(0,166,126,.72);
  pointer-events: none;
}

.trace-thread [data-trace-inspector-panel]::before {
  left: -14px;
}

.trace-thread [data-trace-inspector-panel]::after {
  right: -14px;
}

.trace-thread.source-only-thread [data-trace-inspector-panel]::after {
  display: none;
}

[data-trace-inspector-panel] .ci-panel-body {
  min-width: 0;
  padding: 14px 15px 13px;
}

.trace-evcard {
  position: relative;
  margin-top: 22px;
  overflow: visible;
}


/* Trace runtime strips own their compact equivalence/source-mode composition. */
.trace-runtime-strip {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px 16px;
  align-items: center;
}

.trace-runtime-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.trace-runtime-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.trace-runtime-strip .ci-callout {
  grid-column: 1 / -1;
  box-shadow: none;
}

/* Responsive: Trace runtime strips stack at 760px. */
@media (max-width: 760px) {
  .trace-runtime-strip {
    grid-template-columns: 1fr;
  }

  .trace-runtime-actions {
    justify-content: flex-start;
  }
}
/* END imported module: assets/css/features/trace-explorer/core-layout.css */
/* BEGIN imported module: assets/css/features/trace-explorer/responsive-layout.css */
/* CodeIntent CSS module: Trace Explorer responsive layout and stacked inspector policy. */
/* Responsive: Trace Explorer layout at 1420px. */
@media (max-width:1420px) {
  .job-header,
  .job-header > div,
  .job-meta,
  .job-meta-item {
    min-width: 0;
  }

  .job-meta {
    flex-wrap: wrap;
    justify-content: flex-end;
    row-gap: 6px;
  }

  .job-title,
  .job-meta-value {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .job-meta-value {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  .job-meta-value.mono {
    max-width: min(320px, 45vw);
  }

  .trace-thread {
    grid-template-columns: minmax(0,1fr);
  }

  .trace-thread > .source-pane {
    order: 1;
  }

  .trace-thread > [data-trace-inspector-panel] {
    order: 2;
  }

  .trace-thread > .target-pane {
    order: 3;
  }

  .trace-connector-stage,
  .trace-thread,
  .trace-codepane,
  [data-trace-inspector-panel] {
    width: 100%;
  }

  .trace-codepane {
    height: clamp(430px, 58vh, 640px);
  }

  .trace-thread [data-trace-inspector-panel]::before,
  .trace-thread [data-trace-inspector-panel]::after,
  .trace-evidence-connector {
    display: none;
  }

  .trace-inspector-toggle {
    display: none;
  }

  .trace-parity-section.is-inspector-expanded .source-pane,
  .trace-parity-section.is-inspector-expanded .target-pane,
  .trace-parity-section.is-inspector-expanded [data-trace-inspector-panel] {
    grid-column: auto;
    grid-row: auto;
  }

  .trace-parity-section.is-inspector-expanded [data-trace-inspector-panel] {
    z-index: 1;
    justify-self: stretch;
    align-self: auto;
    width: auto;
  }
}

/* Responsive: Trace Explorer evidence cards and rail tabs at 760px. */
.trace-connector-stage {
  position: relative;
  margin-top: 0;
  min-width: 0;
  max-width: 100%;
}

.trace-connector-stage .trace-workbench-grid,
.trace-connector-stage .trace-evcard {
  position: relative;
  z-index: 2;
}


.trace-evidence-connector {
  position: absolute;
  left: var(--trace-evidence-connector-left, 50%);
  top: var(--trace-evidence-connector-top, 0px);
  width: 2px;
  height: var(--trace-evidence-connector-height, 0px);
  transform: translateX(-1px);
  background: rgba(0,166,126,.52);
  border-radius: 999px;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}

.trace-evidence-connector[data-connected="1"] {
  opacity: 1;
}

.trace-codepane .ci-code-lines > li {
  --ci-code-row-padding: 1px 12px;
  border-left-width: 0;
}

.trace-codepane .ci-code-lines > li.hot {
  border-left-width: 3px;
}

.trace-codepane .ci-code-lines > li code {
  font-weight: 500;
}

.trace-codepane .ci-code-lines > li.hot code {
  font-weight: 700;
}

.trace-inspector-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border: 1px solid var(--success-border);
  border-radius: 999px;
  background: #fff;
  color: var(--success-text);
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}

.trace-inspector-toggle:hover,
.trace-inspector-toggle:focus-visible {
  border-color: var(--accent-primary);
  box-shadow: 0 0 0 3px rgba(0, 166, 126, .14);
  outline: 0;
}

.trace-inspector-toggle:active {
  transform: translateY(1px);
}

.trace-inspector-toggle .ci-icon {
  font-size: 20px;
  line-height: 1;
}


/* Responsive: Trace Explorer disables inspector expansion once the workbench is stacked. */
@media (max-width:1420px) {
  .trace-inspector-toggle,
  .trace-inspector-toggle:not([hidden]) {
    display: none;
  }
}
/* END imported module: assets/css/features/trace-explorer/responsive-layout.css */
/* BEGIN imported module: assets/css/features/trace-explorer/semantic-states.css */
/* CodeIntent CSS module: Trace Explorer semantic boundary and selected-block states. */
.trace-snapbar {
  display: none;
}


/* Feature: Trace Explorer selected-block and arrow states. */
.trace-codepane .ci-code-lines > li.boundary-selected,
.trace-codepane .ci-code-lines > li.hot.boundary-selected,
.trace-codepane .ci-code-lines > li.boundary-selected:focus {
  background: var(--trace-boundary-bg);
  color: inherit;
  outline: 0;
  /* Side rails only, no top/bottom cap -- this class also covers the wide
     ~15+ line fact-level fallback (see the 2026-08-06 comment below), and a
     full box around that whole range reads as "everything is highlighted"
     (confirmed live: clicking one line inside a 12-line fact range framed
     the entire range, direct user feedback that this looked wrong). The
     precise 1-3 line step match below is where a full box genuinely helps
     it pop against a busy background -- this class stays a side accent. */
  box-shadow:
    inset 2px 0 0 var(--accent-primary),
    inset -2px 0 0 var(--trace-selection-outline);
}

.trace-codepane .ci-code-lines > li.boundary-selected::before,
.trace-codepane .ci-code-lines > li.hot.boundary-selected::before {
  color: var(--trace-boundary-gutter);
  font-weight: 700;
}

.trace-codepane .ci-code-lines > li.boundary-selected code,
.trace-codepane .ci-code-lines > li.hot.boundary-selected code {
  color: inherit;
  font-weight: 650;
}

.trace-codepane .ci-code-lines > li.boundary-selected:hover {
  background: var(--trace-boundary-bg-hover);
}

body[data-code-theme="light"] .trace-codepane .ci-code-lines > li.boundary-selected,
body[data-code-theme="light"] .trace-codepane .ci-code-lines > li.hot.boundary-selected,
body[data-code-theme="light"] .trace-codepane .ci-code-lines > li.boundary-selected:focus {
  color: #143c35;
}


/* Sub-tracing (2026-08-06): a step-level match (export_codeintent.py's
   granularity: "step" bindings) is a precise 1-3 line selection, not the
   wide ~15+ line ambient context .boundary-selected above was designed
   for -- that same subtle overlay read as barely-visible at this size
   (confirmed live). Reuses the existing, much higher-contrast .selected/
   :target tokens (solid background + inverted text) rather than
   inventing new ones, so it stays visually consistent with every other
   "this is the precise thing" state already in this codebase. */
.trace-codepane .ci-code-lines > li.boundary-selected-precise,
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise,
.trace-codepane .ci-code-lines > li.boundary-selected-precise:focus {
  --trace-selection-top: var(--trace-selection-outline);
  --trace-selection-bottom: var(--trace-selection-outline);
  background: var(--code-selected-bg);
  color: var(--code-selected-ink);
  outline: 0;
  box-shadow:
    inset 3px 0 0 var(--accent-primary),
    inset -2px 0 0 var(--trace-selection-outline),
    inset 0 2px 0 var(--trace-selection-top),
    inset 0 -2px 0 var(--trace-selection-bottom);
}

.trace-codepane .ci-code-lines > li.boundary-selected-precise + li.boundary-selected-precise,
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise + li.hot.boundary-selected-precise {
  --trace-selection-top: transparent;
}

.trace-codepane .ci-code-lines > li.boundary-selected-precise:has(+ li.boundary-selected-precise),
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise:has(+ li.hot.boundary-selected-precise) {
  --trace-selection-bottom: transparent;
}

.trace-codepane .ci-code-lines > li.boundary-selected-precise::before,
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise::before {
  color: var(--code-selected-ink);
  font-weight: 700;
}

.trace-codepane .ci-code-lines > li.boundary-selected-precise code,
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise code {
  color: inherit;
  font-weight: 650;
}

/* The `color: inherit` above never reaches highlight.js's own token spans
   (`.hljs-keyword`, `.hljs-string`, ...) -- vendored in assets/vendor/
   highlightjs/styles/github-dark.min.css, each with its own explicit
   color rule, which wins over an ancestor's `inherit` by specificity.
   Confirmed live and measured: `.hljs-keyword` (COBOL/Java reserved
   words -- IF, ELSE, PERFORM, MOVE, DISPLAY, TO, if, else, ...) stayed
   its vendored salmon (#ff7b72) against this class's own solid green
   background (#174d41) -- 3.83:1 contrast, below the 4.5:1 WCAG AA
   minimum for normal text. Every hljs token needs the SAME explicit
   override, not just `.hljs-keyword` -- don't vendor-patch the theme
   file for one class and leave the others exposed to the same clash. */
.trace-codepane .ci-code-lines > li.boundary-selected-precise code [class^="hljs-"],
.trace-codepane .ci-code-lines > li.hot.boundary-selected-precise code [class^="hljs-"] {
  color: inherit;
}

.trace-codepane .ci-code-lines > li.boundary-selected-precise:hover {
  background: var(--code-selected-bg);
}


/* Feature: Trace Explorer semantic boundary line states. */

/* Ambient-wash dimming while a click-selection is active (2026-08-07).
   Once a real boundary-selected/-precise range exists on one side, the
   OTHER side's whole-fact ambient wash (.trace-line-in-range) used to stay
   painted at full strength no matter what -- confirmed live: "the entire
   right side stays highlighted no matter what's clicked on the left,"
   competing for attention with the side that actually has a precise
   selection. trace-selection.js's syncAmbientDimming() toggles
   .ambient-dimmed onto the .ci-code-view box(es) that do NOT currently
   hold a real click-selection; clearTraceSelection() removes it from every
   box in the panel again, restoring the flat ambient wash on both sides. */
.ci-code-view.ambient-dimmed .ci-code-lines > li.trace-line-in-range {
  background: transparent;
  border-left-color: transparent;
}

/* Per-step ambient segmentation (2026-08-07). The ambient wash used to
   paint a fact's whole source/target range as one undifferentiated band,
   with zero visual distinction between the fact's own separate steps --
   confirmed live on COTRN01C-f4: the EVALUATE (source line 280) read as
   engulfed in the READ (source lines 269-278), the same solid color as one
   flat block. TraceStepBindingReader (see its own doc comment) segments a
   fact's own ambient range into per-step bands, but only for idioms that
   have real step-level trace_bindings; a fact with only one step (or no
   step-level data at all) never gets these classes and keeps today's flat
   .trace-line-in-range color unchanged. .trace-step-odd/-even zebra-stripe
   the real bands so any one step is always visually distinct from its
   immediate neighbor, and .trace-step-start marks where a new step's band
   begins. */
.ci-code-lines > li.trace-line-in-range.trace-step-even {
  background: linear-gradient(var(--trace-step-shade), var(--trace-step-shade)), var(--trace-pane-highlight-bg, transparent);
}

.ci-code-lines > li.trace-line-in-range.trace-step-start {
  border-top: 1px solid color-mix(in srgb, var(--trace-pane-highlight-border, transparent) 55%, transparent);
}
/* END imported module: assets/css/features/trace-explorer/semantic-states.css */
/* BEGIN imported module: assets/css/features/trace-explorer/equation-view.css */
/* CodeIntent CSS module: Trace Explorer Equation View. */

.equation-card {
  padding: 11px;
  border: 1px solid #d3e8e2;
  border-radius: 10px;
  background: linear-gradient(180deg,#f8fdfb,#eef8f5);
}

.equation-card[hidden] {
  display: none;
}

.equation-card-body p,
.equation-summary {
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: 11.7px;
  line-height: 1.45;
}

.equation-rendered,
.equation-math {
  min-width: 0;
  max-width: 100%;
}

.equation-family,
.equation-title-row span {
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 700;
}

.equation-family {
  margin-bottom: 8px;
}

.equation-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  margin-bottom: 3px;
}

.equation-math {
  padding: 10px;
  border: 1px solid #d8e8e4;
  border-radius: 9px;
  background: var(--surface-card);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.equation-latex-render {
  width: max-content;
  min-width: 100%;
  color: var(--text-primary);
  font-size: var(--formula-size);
  line-height: 1.55;
}

.equation-latex-render .katex-display {
  margin: 0;
}

.equation-latex pre {
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 10.5px;
}

.equation-latex,
.source-formula-variable-map-body {
  margin-top: 8px;
}

.source-formula-latex-source {
  max-width: 100%;
  overflow: visible;
}

.equation-latex summary,
.equation-mapping summary {
  cursor: pointer;
  font-size: 10.5px;
  font-weight: 800;
  color: var(--success-text);
}

.eqsym,
.eqsym.katex-failed {
  font-family: var(--font-math);
  font-size: 18px;
  color: var(--success-text);
  text-align: center;
  overflow-wrap: anywhere;
}

.eqsym .katex {
  font-size: 1em;
}

.equation-mapping {
  margin-top: 10px;
}

.equation-mapping[open] {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #d7e8e5;
}

.equation-map-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  padding: 9px 0;
  border-bottom: 1px solid #e4efed;
  font-size: 10.8px;
}

.equation-map-row:last-child,
.equation-mapping[open] .equation-map-row:last-child {
  border-bottom: 0;
}

.equation-map-display {
  color: var(--text-primary);
}

.equation-map-display b {
  font-weight: 800;
}

.equation-map-explanation {
  line-height: 1.45;
}

.equation-map-identifiers {
  display: block;
  color: var(--text-muted);
  font-size: 9.7px;
  line-height: 1.35;
}

.equation-state {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 9px;
  border-radius: 8px;
  font-size: 11.5px;
  line-height: 1.4;
}

.equation-state.muted {
  background: #f4f8f8;
  color: var(--text-muted);
}

.equation-state.warn {
  background: #fff8eb;
  color: #7a5112;
  border: 1px solid #edd5a7;
}

.equation-math.katex-failed .equation-latex-render {
  display: none;
}

/* KaTeX fallback: keep MathML accessible if vendor CSS loads late. */
.katex .katex-mathml {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0;
  border: 0;
  height: 1px;
  width: 1px;
  overflow: hidden;
}
/* END imported module: assets/css/features/trace-explorer/equation-view.css */

/* Utilities */
/* BEGIN imported module: assets/css/utilities/utilities.css */
/* CodeIntent CSS module: Shared utility primitives and semantic ownership helpers.
   Source order preserved from the monolithic app.css split. */

/* Shared utility primitives used to avoid one-off inline styles. */
.muted,
.subtle {
  color: var(--text-muted);
}

.subtle {
  font-size: 12px;
  line-height: 1.4;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: var(--surface-card);
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 4px 9px;
  white-space: nowrap;
}

.push-right {
  margin-left: auto;
}

.breakable {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Semantic class ownership for shell, metrics, detail rows, Ask answers, and modals. */
.source-pane,
.target-pane {
  min-width: 0;
}
/* END imported module: assets/css/utilities/utilities.css */