/* One state language for frozen output and draft previews. */
:root {
  --lane-fact: #ffffff;
  --lane-derived: #eef2f5;
  --lane-hypothetical: #fcf3dc;
  --lane-authored: #faf6e9;
  --lane-ai: #efe9f6;
  --alarm: #b3261e;
  --alarm-bg: #fde8e6;
  --attention: #713b53;
  --quiet: #4b535a;
}
.decision-brief {
  border: 1px solid #a8afb5;
  border-radius: 8px;
  padding: 18px;
  margin-bottom: 18px;
  background: #f9fafb;
  color: #23272b;
  box-shadow: inset 0 2px 6px #24334312;
}
.decision-brief h2 {
  font-size: 20px;
  margin: 3px 0 6px;
}
.decision-brief h3 {
  font-size: 14px;
  margin: 8px 0;
}
.decision-brief p {
  margin: 6px 0;
}
.brief-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
  gap: 15px;
}
.brief-readiness {
  display: flex;
  align-items: center;
  text-align: left;
  gap: 10px;
  border: 1px solid #9da8b1;
  background-color: #fff;
  color: #23272b;
}
.brief-readiness svg {
  width: 56px;
  min-width: 56px;
  fill: none;
  stroke-width: 4;
  transform: rotate(-90deg);
}
.brief-ring-track {
  stroke: #d9dfe4;
}
.brief-ring-value {
  stroke: var(--attention);
}
.brief-readiness small {
  display: block;
  line-height: 1.35;
  margin-top: 4px;
}
.brief-critical,
.brief-disagreements {
  background: var(--alarm-bg);
  color: var(--alarm);
  padding: 9px 12px;
  border-left: 3px solid var(--alarm);
}
.brief-middle {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 14px;
  margin: 10px 0;
}
.brief-middle > section {
  padding: 10px;
  border: 1px solid #c5cdd3;
  border-radius: 5px;
}
.brief-attention-list {
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
}
.brief-attention-list > li {
  border: 1px solid #b6bec5;
  border-radius: 4px;
  margin: 6px 0;
  background: #fff;
}
.brief-attention-list > li[data-attention-kind="conflict"],
.brief-attention-list > li[data-attention-kind="safety_caution"],
.brief-attention-list > li[data-attention-kind="stale_basis"] {
  background: var(--alarm-bg);
  border-color: var(--alarm);
}
.brief-attention-button {
  display: flex;
  align-items: start;
  gap: 8px;
  width: 100%;
  text-align: left;
  background: none !important;
  box-shadow: none !important;
  border: 0;
  border-radius: 4px;
  color: inherit;
  padding: 8px;
}
.brief-attention-button small {
  display: block;
  line-height: 1.4;
  margin-top: 3px;
}
.brief-state-glyph {
  font-size: 16px;
  font-weight: bold;
}
[data-attention-kind="conflict"] .brief-state-glyph,
[data-attention-kind="safety_caution"] .brief-state-glyph,
[data-attention-kind="stale_basis"] .brief-state-glyph {
  color: var(--alarm);
}
[data-attention-primary] {
  outline: 2px solid var(--attention);
  outline-offset: 2px;
}
[data-queue-selected="true"] {
  outline: 3px solid #263744;
  outline-offset: 2px;
}
.brief-treatment {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
}
.brief-treatment dt {
  font-size: 11px;
  color: #414b54;
}
.brief-treatment dd {
  margin: 3px 0 0;
  font-weight: 600;
  font-size: 12px;
}
.brief-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 3px;
}
.brief-option {
  border: 1px solid #aeb8c0;
  border-radius: 4px;
  padding: 10px;
  min-width: 0;
}
.brief-option h4 {
  min-height: 2.8em;
  font-size: 12px;
  margin: 0 0 8px;
}
.brief-option dl {
  margin: 0;
}
.brief-option dl > div {
  display: flex;
  gap: 6px;
  font-size: 11px;
  margin: 5px 0;
}
.brief-option dt {
  flex: 0 0 58px;
  font-weight: bold;
}
.brief-option dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.brief-option details {
  font-size: 11px;
}
.brief-measurements {
  margin: 12px 0;
  border-top: 1px solid #c6cdd3;
  padding-top: 5px;
}
[data-lane="fact"] {
  background-color: var(--lane-fact);
  border-left: 3px solid #26313a;
}
[data-lane="derived"] {
  background-color: var(--lane-derived);
  border-left: 3px dotted #617485;
}
[data-lane="hypothetical"] {
  background: repeating-linear-gradient(
    135deg,
    #fcf3dc,
    #fcf3dc 8px,
    #f7ebca 8px,
    #f7ebca 10px
  );
  border-left: 3px dashed #725918;
}
[data-lane="hypothetical"] .nx-value,
[data-lane="hypothetical"] .brief-option dd {
  font-style: italic;
}
[data-lane="authored"] {
  background-color: var(--lane-authored);
  border-left: 3px solid #76674c;
}
[data-lane="ai"] {
  background-color: var(--lane-ai);
  border-left: 3px solid #675174;
}
[data-lane="ai"]::before {
  content: "AI origin";
  display: inline-block;
  padding: 2px 5px;
  font-size: 10px;
  font-weight: bold;
}
html[data-run-state="stale"] .content {
  background: #f7f3f0;
}
html[data-run-state="saved"] .content {
  background: #edf2f6;
}
.brief-svg-scroll {
  overflow: auto;
  max-height: 420px;
  border: 1px solid #c8d0d7;
  background: #fff;
}
.brief-svg-scroll svg {
  display: block;
  min-width: 800px;
  width: 100%;
}
.dag-edge {
  stroke: #ccd2d7;
  fill: none;
  stroke-width: 1;
}
.dag-edge.dag-downstream {
  stroke: var(--attention);
  stroke-width: 1.5;
}
.dag-node rect {
  fill: #f7f8f9;
  stroke: #8293a0;
  stroke-width: 1;
}
.dag-node.dag-downstream rect {
  stroke: var(--attention);
  stroke-width: 3;
}
.dag-node[data-cell-state="disputed"] rect,
.dag-node[data-cell-state="invalid"] rect {
  fill: var(--alarm-bg);
  stroke: var(--alarm);
}
.dag-node text {
  fill: #26313a;
  font: 11px monospace;
}
.dag-node .dag-state {
  font: 10px sans-serif;
}
.timeline-axis,
.timeline-cutoff line {
  stroke: #485a68;
  stroke-width: 1.5;
}
.timeline-cutoff text,
.timeline-event text {
  fill: #26313a;
  font: 11px sans-serif;
}
.timeline-event circle {
  fill: #344c61;
}
.timeline-event[data-event-state="excluded"] {
  opacity: 0.82;
}
.timeline-event[data-event-state="excluded"] circle {
  fill: #69757e;
}
.inspector-tabs {
  display: flex;
  gap: 5px;
  margin: 10px 0;
}
.inspector-tabs [aria-selected="true"] {
  outline: 2px solid var(--attention);
}
.graph-paths {
  padding-left: 20px;
}
.graph-paths li {
  padding: 6px 2px;
  border-bottom: 1px solid #d3d8dd;
}
.graph-path-edge {
  padding: 6px 10px;
  margin: 3px 0 3px 14px;
  border-left: 2px solid #8797a3;
}
.graph-path-edge[data-relation="contradicts"] {
  color: var(--alarm);
  background: var(--alarm-bg);
  border-color: var(--alarm);
}
.graph-path-edge[data-basis="inferred"] {
  color: var(--quiet);
  border-left-style: dotted;
}
.brief-queue-telemetry {
  border: 1px solid #aab6bf;
  padding: 8px;
  background: #f2f5f7;
}
.brief-whatif {
  margin-top: 10px;
  padding: 10px;
}
.brief-whatif label {
  display: block;
  margin: 8px 0;
}
.brief-whatif input,
.brief-whatif select {
  max-width: 100%;
}
.preview-chip {
  border: 1px dashed #705823;
  background: var(--lane-hypothetical);
  color: #4c401e;
  padding: 5px 8px;
  border-radius: 4px;
  display: inline-block;
  font-size: 12px;
}
/* Legacy state markers remain static. Only one canonical attention item moves. */
button.oc-attention,
.oc-pulse {
  animation: none !important;
}
.oc-attention-bounded {
  animation: oc-attention-bounded 2.3s ease-in-out 3;
}
@keyframes oc-attention-bounded {
  0%,
  100% {
    box-shadow: 0 0 0 0 #713b5300;
  }
  50% {
    box-shadow: 0 0 0 5px #713b5333;
  }
}
.oc-change-sweep {
  animation: oc-change-sweep 0.6s ease-out 1;
}
@keyframes oc-change-sweep {
  from {
    background-color: #eee0e8;
  }
  to {
    background-color: transparent;
  }
}
html[data-oc-motion="off"] .oc-attention-bounded,
html[data-oc-motion="off"] .oc-change-sweep {
  animation: none;
}
@media (prefers-reduced-motion: reduce) {
  .oc-attention-bounded,
  .oc-change-sweep,
  .oc-roll {
    animation: none !important;
  }
  .oc-needle {
    transition: none;
  }
}
@media (max-width: 850px) {
  .brief-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .brief-heading,
  .brief-middle {
    grid-template-columns: 1fr;
  }
  .brief-options {
    max-height: 360px;
  }
}
@media (max-width: 480px) {
  .decision-brief {
    padding: 10px;
  }
  .brief-options {
    grid-template-columns: 1fr;
  }
  .brief-treatment {
    grid-template-columns: 1fr;
  }
}
@media print {
  .oc-attention-bounded,
  .oc-change-sweep,
  .oc-roll {
    animation: none !important;
  }
  .brief-options,
  .brief-svg-scroll {
    max-height: none;
    overflow: visible;
  }
  .decision-brief button {
    border: 0;
    box-shadow: none;
  }
  [data-attention-primary] {
    outline: 2px solid #26313a;
  }
  .brief-option {
    break-inside: avoid;
  }
}

@media (min-width: 1000px) {
  .brief-middle > section {
    max-height: 230px;
    overflow: auto;
  }
  .decision-brief > .hint:last-child {
    font-size: 10px;
    line-height: 1.3;
  }
  .brief-attention-button small {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* Resolved records use neutral ink, retaining text and contrast. */
.tag.green,
.calculation-current {
  color: #3d4b55;
  background-color: #edf1f4;
  border-color: #aebac3;
}