@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
/* Red, white and blue. A navy sidebar frames a white page; links, buttons and
   selected states are navy; DC-flag red is reserved for accents (the active
   tab underline, the active sidebar marker, tags). Status colors (error red,
   success green, warning brown) keep their own meaning. Text pairs meet WCAG
   AA (4.5:1); control borders and chart marks meet 3:1
   (test/assets/stylesheet_test.rb checks both). */
:root {
  --paper:#FFFFFF;
  --white:#FFFFFF;
  --ink:#0E1A2B;
  --muted:#5A6478;
  --text-body:#33405A;
  --brand-navy:#1D3F7A;
  --brand-navy-dark:#14284B;
  --brand-sky:#DCE5F3;
  --surface-soft:#F4F6FA;
  --line:#DDE3EC;
  --control-border:#8792A8;
  --control-error:#A12D28;
  --accent-red:#C8102E;
  --accent-red-soft:#FCEBEE;
  --accent-red-line:#F4C6CE;
  --sidebar-line:#2E4A7D;
  --sidebar-label:#9FB2D4;
  --chart-mark:#3A64A8;
  --font:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --heading:'Manrope',var(--font)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:28px
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:14px/1.6 var(--font);
  -webkit-font-smoothing:antialiased
}

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

a:hover {
  color:var(--brand-navy)
}

button,input,select,textarea {
  font:inherit
}

button,input[type=submit],summary {
  cursor:pointer
}

button {
  border:0
}

h1,h2,h3,p {
  margin:0
}

h1,h2,h3 {
  font-family:var(--heading);
  line-height:1.25;
  font-weight:700
}

h1 {
  font-size:42px;
  letter-spacing:-1.65px;
  max-width:850px
}

h2 {
  font-size:21px;
  letter-spacing:-.6px
}

h3 {
  font-size:17px;
  letter-spacing:-.25px
}

p+p {
  margin-top:14px
}

::selection {
  background:var(--brand-sky);
  color:var(--ink)
}

:focus-visible {
  outline:3px solid var(--brand-navy);
  outline-offset:4px
}

.sidebar :focus-visible {
  outline-color:var(--white)
}

::placeholder {
  color:var(--muted)
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}

.skip-link {
  position:fixed;
  top:-60px;
  left:20px;
  padding:12px 20px;
  background:var(--white);
  z-index:100
}

.skip-link:focus {
  top:12px
}

.sidebar {
  position:fixed;
  inset:0 auto 0 0;
  width:236px;
  background:var(--brand-navy-dark);
  color:var(--white);
  display:flex;
  flex-direction:column;
  padding:29px 20px 18px;
  z-index:20
}

.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font:750 20px/1.3 var(--heading);
  letter-spacing:-.7px;
  color:var(--white)!important
}

.brand-mark {
  display:block;
  width:28px;
  height:28px;
  flex-shrink:0;
  background:currentColor;
  -webkit-mask:url("/flag-disc.png") center / contain no-repeat;
  mask:url("/flag-disc.png") center / contain no-repeat
}

.sidebar nav {
  margin-top:28px
}

.status-dot {
  display:inline-block;
  flex-shrink:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--brand-navy)
}

.nav-link {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--brand-sky);
  padding:12px 13px;
  border-radius:5px;
  font-size:12px;
  font-weight:500;
  margin:4px 0
}

.nav-link:hover {
  background:var(--brand-navy);
  color:var(--white)
}

.nav-link.is-active {
  background:var(--brand-sky);
  color:var(--brand-navy-dark);
  box-shadow:inset 3px 0 var(--accent-red)
}

.nav-icon {
  font-size:18px;
  line-height:1;
  width:19px;
  text-align:center;
  font-weight:400
}

.sidebar-account {
  margin-top:auto;
  padding:19px 2px 0;
  border-top:1px solid var(--sidebar-line);
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap
}

.avatar {
  width:32px;
  height:32px;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--brand-sky);
  color:var(--brand-navy-dark);
  font-size:11px;
  font-weight:650
}

.sidebar-account-link {
  display:flex;
  gap:10px;
  align-items:center;
  color:inherit;
  text-decoration:none;
  min-width:0
}

.sidebar-account-link:hover {
  color:inherit
}

.sidebar-account-link:hover strong {
  text-decoration:underline
}

.sidebar-account strong {
  font-size:11px;
  font-weight:500;
  display:block
}

.sidebar-account small {
  display:block;
  color:var(--brand-sky);
  font-size:10px
}

.sidebar-account .text-button {
  font-size:10px;
  color:var(--brand-sky);
  padding:2px 0;
  background:none
}

.app-shell {
  margin-left:236px;
  min-height:100vh;
  display:flex;
  flex-direction:column
}

.main-content {
  padding:41px 44px 48px;
  width:100%;
  max-width:1600px;
  margin:0 auto;
  flex:1
}

.sign-in-panel {
  max-width:480px;
  margin:5vh auto;
  padding:32px
}

.sign-in-panel h1 {
  margin-bottom:28px;
  font-size:32px;
  letter-spacing:-.8px
}

.eyebrow {
  font-size:9px;
  line-height:1.5;
  letter-spacing:1.55px;
  font-weight:650;
  color:var(--brand-navy);
  text-transform:uppercase
}

.page-heading {
  display:flex;
  justify-content:space-between;
  gap:28px;
  align-items:flex-start;
  margin:0 0 30px
}

.page-heading .eyebrow {
  margin-bottom:12px
}

.page-heading-actions {
  display:flex;
  align-items:center;
  gap:18px;
  flex-shrink:0
}

.page-description {
  font-size:13px;
  line-height:1.8;
  color:var(--muted);
  margin-top:14px;
  max-width:720px
}

.page-description a {
  color:var(--brand-navy)
}

.metric-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:33px 0 35px;
  border:1px solid var(--line);
  border-radius:7px;
  overflow:hidden;
  background:var(--white)
}

.metric {
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  border-right:1px solid var(--line);
  min-width:0
}

.metric:last-child {
  border:0
}

.metric-label {
  font-size:11px;
  font-weight:500;
  color:var(--muted)
}

.metric strong {
  font:650 34px/1.3 var(--heading);
  letter-spacing:-1px;
  margin:9px 0 5px
}

.metric small {
  font-size:10px;
  color:var(--muted)
}

.metric--accent {
  background:var(--brand-sky)
}

.metric--accent .metric-label,.metric--accent strong {
  color:var(--brand-navy-dark)
}

.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin:31px 0 18px
}

.section-heading p {
  font-size:12px;
  color:var(--muted);
  margin-top:6px
}

.subtle-label {
  font-size:8px;
  font-weight:550;
  letter-spacing:1.1px;
  color:var(--muted)
}

.agency-monogram {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--surface-soft);
  border:1px solid var(--brand-sky);
  border-radius:5px;
  width:54px;
  height:49px;
  font:750 14px var(--heading);
  letter-spacing:-.4px;
  color:var(--brand-navy)
}

.tags {
  display:flex;
  flex-wrap:wrap;
  gap:6px
}

.tag {
  font-size:9px;
  padding:3px 7px;
  border-radius:3px;
  background:var(--accent-red-soft);
  color:var(--accent-red);
  border:1px solid var(--accent-red-line)
}

/* A contract's status is information, not a warning, so its tag is neutral:
   navy on the light blue tint for a current contract, muted gray once it has
   ended. Red stays with the marks that ask for attention ($1M+, AI-generated,
   Key section, Found during memo research). */
.tag.library-term-status--current {
  background:var(--brand-sky);
  border-color:var(--brand-sky);
  color:var(--brand-navy)
}

.tag.library-term-status--ended {
  background:var(--surface-soft);
  border-color:var(--line);
  color:var(--muted)
}

.badge {
  display:inline-flex;
  align-items:center;
  gap:5px;
  font:500 9px/1.5 var(--font);
  white-space:nowrap;
  letter-spacing:.1px;
  border:1px solid var(--line);
  padding:3px 7px;
  border-radius:4px;
  background:var(--surface-soft);
  color:var(--muted);
  vertical-align:middle
}

.badge--pending,.badge--queued {
  background:#FFF3DE;
  border-color:#E7D2B5;
  color:#785126
}

.badge--verified,.badge--fetched,.badge--completed {
  background:#EDF6E9;
  border-color:#CCDCC5;
  color:#376144
}

.badge--running {
  background:var(--surface-soft);
  border-color:var(--brand-sky);
  color:var(--brand-navy)
}

.badge--failed {
  background:#FFF0E7;
  border-color:#E6C6B4;
  color:#8D452F
}

/* A document whose text could not be captured is not an error a reader can act
   on, so its badge is a quiet gray rather than the failed tint above. */
.badge--not-captured {
  background:var(--surface-soft);
  border-color:var(--line);
  color:var(--muted)
}

.dashboard-bottom {
  display:block;
  margin-top:28px
}

.panel {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:6px;
  overflow:hidden
}

.panel-heading {
  padding:19px 22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:13px;
  border-bottom:1px solid var(--line)
}

.panel-heading h2 {
  font-size:15px;
  letter-spacing:-.3px
}

.panel-copy {
  padding:21px 22px
}

.panel-copy>p {
  font-size:12px;
  color:var(--muted);
  line-height:1.8
}

.activity-row {
  display:flex;
  gap:13px;
  align-items:center;
  padding:17px 21px;
  border-bottom:1px solid var(--line)
}

.activity-row:last-child {
  border-bottom:0
}

.activity-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  width:29px;
  height:29px;
  background:var(--surface-soft);
  border:1px solid var(--line);
  color:var(--brand-navy);
  border-radius:4px
}

.activity-row>div {
  flex:1;
  min-width:0
}

.activity-row strong {
  display:block;
  font-size:11px;
  font-weight:550
}

.activity-row small {
  display:block;
  font-size:9px;
  color:var(--muted);
  margin-top:3px
}

.back-link {
  display:inline-block;
  color:var(--muted);
  font-size:10px;
  margin-bottom:20px
}

.agency-heading h1 {
  font-size:35px;
  max-width:730px;
  letter-spacing:-1.25px
}

.agency-monogram--large {
  width:75px;
  height:71px;
  font-size:18px;
  flex-shrink:0;
  margin-top:5px
}

/* The agency's two tabs are its primary navigation, so they read as such: large
   labels, a navy active tab with the red underline, and a hover state. The
   AI-generated tag stays small and sits centred beside the memo label. */
.tabs {
  display:flex;
  gap:36px;
  border-bottom:1px solid var(--line);
  margin:25px 0 27px;
  overflow:auto
}

.tabs>a {
  display:inline-flex;
  align-items:center;
  font-size:17px;
  font-weight:600;
  line-height:1.3;
  color:var(--text-body);
  padding:4px 2px 12px;
  white-space:nowrap;
  gap:8px;
  border-bottom:3px solid transparent
}

.tabs>a:hover {
  color:var(--brand-navy);
  border-bottom-color:var(--brand-sky)
}

.tabs>a.active {
  color:var(--brand-navy);
  font-weight:700;
  border-bottom-color:var(--accent-red)
}

/* .tabs scrolls (overflow:auto), which clips an outline drawn outside a tab, so
   the focus ring is drawn just inside the tab's edge instead. */
.tabs>a:focus-visible {
  outline-offset:-3px
}

.dossier-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  gap:25px
}

.dossier-main,.dossier-aside {
  min-width:0
}

.dossier-main>.panel,.dossier-aside>.panel {
  margin-bottom:22px
}

.dossier-aside .panel-heading {
  padding:18px 20px
}

.dossier-aside .panel-copy {
  padding:18px 20px
}

.research-panel {
  border-color:var(--brand-sky)
}

.research-panel .panel-heading {
  background:var(--surface-soft)
}

.research-panel .panel-heading>span {
  color:var(--brand-navy);
  font-size:19px
}

.field {
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
  margin:0 0 20px
}

.field label {
  font-size:13px;
  font-weight:600;
  line-height:1.5;
  color:var(--ink)
}

.field input,.field select,.field textarea {
  border:1px solid var(--control-border);
  border-radius:6px;
  padding:10px 12px;
  min-height:46px;
  min-width:0;
  width:100%;
  background:var(--white);
  color:var(--ink);
  font-size:16px;
  line-height:1.5
}

.field select {
  appearance:none;
  padding-right:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%235A6478' stroke-width='1.5'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-position:right 12px center;
  background-size:16px;
  background-repeat:no-repeat;
  cursor:pointer
}

.field textarea {
  resize:vertical;
  min-height:120px;
  line-height:1.6
}

.field small {
  font-size:12px;
  color:var(--muted);
  line-height:1.6
}

.field :is(input,select,textarea):hover:where(:not(:disabled)) {
  border-color:var(--muted)
}

.field :is(input,select,textarea):focus {
  border-color:var(--brand-navy);
  outline:2px solid var(--brand-navy);
  outline-offset:2px
}

.field :is(input,select,textarea):disabled {
  background-color:var(--surface-soft);
  color:var(--muted);
  cursor:not-allowed
}

.field :is(input,select,textarea)[aria-invalid="true"],
.field :is(input,select,textarea):user-invalid,
.field_with_errors :is(input,select,textarea) {
  border-color:var(--control-error)
}

.field_with_errors {
  display:contents
}

.stacked-form {
  display:grid;
  gap:20px
}

.stacked-form .field {
  margin:0
}

.stacked-form>.button {
  justify-self:start
}

.panel-copy>p+.stacked-form {
  margin-top:20px
}

.form-error {
  border:1px solid var(--control-error);
  border-radius:6px;
  padding:12px 14px;
  background:#FFF5F2;
  color:var(--control-error);
  font-size:14px;
  line-height:1.5
}

.currency-input {
  position:relative
}

.currency-input span {
  position:absolute;
  left:13px;
  top:50%;
  transform:translateY(-50%);
  font-size:16px;
  pointer-events:none;
  color:var(--muted)
}

.currency-input input {
  padding-left:30px
}

.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  border:1px solid transparent;
  border-radius:6px;
  padding:11px 18px;
  min-height:46px;
  max-width:100%;
  font-size:14px;
  font-weight:600;
  line-height:1.5;
  white-space:normal;
  text-align:center
}

.button--primary {
  background:var(--brand-navy);
  color:var(--white)
}

.button--primary:hover:not(:disabled) {
  background:var(--brand-navy-dark);
  color:var(--white)
}

.button--secondary {
  border-color:var(--control-border);
  background:var(--white);
  color:var(--brand-navy)
}

.button--secondary:hover:not(:disabled) {
  border-color:var(--brand-navy);
  background:var(--surface-soft)
}

.button:disabled {
  opacity:.65;
  cursor:not-allowed
}

form[aria-busy="true"] .button:disabled {
  cursor:wait
}

.button--full {
  width:100%
}

.text-link {
  color:var(--brand-navy);
  font-size:10px;
  font-weight:550
}

.text-link:hover {
  text-decoration:underline
}

.small-copy {
  font-size:10px!important;
  line-height:1.8;
  color:var(--muted);
  margin-top:14px
}

.muted {
  color:var(--muted);
  font-size:12px
}

.prose {
  font-size:13px;
  line-height:1.9;
  color:var(--text-body);
  overflow-wrap:anywhere
}

.prose p {
  margin-bottom:15px;
  line-height:1.9
}

.prose p:last-child {
  margin-bottom:0
}

.prose strong {
  color:var(--ink);
  font-weight:600
}

.quiet-placeholder {
  font-size:12px;
  color:var(--muted);
  padding:25px 0
}

.finding-topline {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:13px
}

.finding-topline .eyebrow {
  font-size:8px;
  letter-spacing:1.25px
}

.run-mini {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:14px 20px;
  border-bottom:1px solid var(--line)
}

.run-mini:last-child {
  border-bottom:0
}

.run-mini strong {
  font-size:10px;
  font-weight:550
}

.run-mini small {
  display:block;
  font-size:9px;
  color:var(--muted);
  margin-top:3px
}

.empty-state {
  text-align:center;
  padding:43px 28px;
  color:var(--muted)
}

.empty-symbol {
  width:41px;
  height:43px;
  border:1px solid var(--line);
  background:var(--surface-soft);
  color:var(--brand-navy);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:5px;
  font-size:22px;
  margin-bottom:17px
}

.empty-state h3 {
  color:var(--brand-navy-dark);
  font-size:16px;
  margin-bottom:11px
}

.empty-state p {
  font-size:11px;
  line-height:1.9;
  max-width:470px;
  margin:auto
}

.empty-action {
  margin-top:20px
}

.flash {
  padding:15px 18px;
  border:1px solid var(--line);
  background:#EDF6E9;
  border-radius:5px;
  color:#376144;
  margin-bottom:23px;
  font-size:12px;
  border-color:#CCDCC5
}

.flash--alert {
  background:#FFF0E7;
  border-color:#E6C6B4;
  color:#8D452F
}

.notice-banner {
  display:flex;
  gap:13px;
  align-items:flex-start;
  padding:17px 21px;
  border:1px solid var(--line);
  border-radius:5px;
  background:var(--surface-soft);
  color:var(--text-body);
  margin-bottom:26px;
  border-color:var(--brand-sky)
}

.notice-banner>span {
  font-size:18px;
  line-height:1.3;
  color:var(--brand-navy);
  flex-shrink:0
}

.notice-banner .status-dot {
  margin-top:8px
}

.notice-banner p {
  font-size:11px;
  line-height:1.8
}

.notice-banner strong {
  font-weight:600;
  color:var(--brand-navy-dark)
}

.report-grid {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:31px;
  align-items:start
}

.report-toc {
  position:sticky;
  top:28px;
  padding-top:12px
}

/* The library's left navigation: a bold navy heading over the section links,
   each with a quiet rule on its left that turns navy on hover. */
.report-toc .eyebrow {
  font-size:12px;
  font-weight:700;
  letter-spacing:1.5px;
  margin-bottom:12px;
  color:var(--brand-navy)
}

.report-toc a {
  display:block;
  font-size:15px;
  font-weight:500;
  color:var(--text-body);
  line-height:1.4;
  padding:9px 0 9px 14px;
  border-left:2px solid var(--line)
}

.report-toc a:hover {
  color:var(--brand-navy);
  border-left-color:var(--brand-navy)
}

.report-document {
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--white);
  padding:4px 40px
}

.report-section {
  padding:34px 0;
  border-bottom:1px solid var(--line)
}

.report-section:last-child {
  border-bottom:0
}

.report-section>.eyebrow {
  margin-bottom:10px
}

.report-section>h2 {
  font-size:23px;
  line-height:1.4;
  margin-bottom:20px
}

.document-title {
  font-size:31px!important;
  line-height:1.45;
  letter-spacing:-.85px!important
}

.source-text {
  padding:26px 30px;
  white-space:pre-wrap;
  font-size:12px;
  line-height:1.95;
  overflow-wrap:anywhere;
  color:var(--text-body);
  max-height:85vh;
  overflow:auto
}

.metadata-list {
  padding:20px;
  margin:0
}

.metadata-list dt {
  font-size:9px;
  color:var(--muted);
  margin-top:15px
}

.metadata-list dt:first-child {
  margin-top:0
}

.metadata-list dd {
  font-size:11px;
  margin:4px 0 0;
  color:var(--text-body);
  line-height:1.8
}

.metadata-list dd a {
  color:var(--brand-navy)
}

.break-anywhere {
  overflow-wrap:anywhere
}

.fingerprint {
  font:9px/1.8 ui-monospace,SFMono-Regular,monospace!important;
  overflow-wrap:anywhere;
  color:var(--muted)!important
}

.citation-usage {
  padding:16px 20px;
  border-bottom:1px solid var(--line)
}

.citation-usage p {
  font-size:9px;
  color:var(--muted);
  margin-top:7px
}

.run-metrics .metric {
  padding:22px 20px
}

.metric .metric-word {
  font-size:25px;
  letter-spacing:-.8px
}

.metric .metric-model {
  font-size:17px;
  line-height:1.5;
  letter-spacing:-.5px;
  overflow-wrap:anywhere
}

.metric-denominator {
  font-size:20px;
  color:var(--muted)
}

.result-banner {
  border:1px solid var(--line);
  background:var(--surface-soft);
  border-radius:6px;
  padding:25px 29px;
  display:flex;
  gap:25px;
  align-items:center;
  justify-content:space-between;
  margin-bottom:25px;
  border-color:var(--brand-sky)
}

.result-banner h2 {
  font-size:23px;
  margin-top:9px
}

.result-banner p:not(.eyebrow) {
  font-size:11px;
  color:var(--muted);
  margin-top:8px
}

.workflow-steps {
  padding:0 25px
}

.workflow-step {
  display:flex;
  gap:20px;
  padding:25px 0;
  border-bottom:1px solid var(--line)
}

.workflow-step:last-child {
  border-bottom:0
}

.step-number {
  width:31px;
  height:31px;
  border:1px solid var(--line);
  background:var(--surface-soft);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--brand-navy);
  font-size:10px;
  flex-shrink:0
}

.workflow-step-body {
  flex:1;
  min-width:0
}

.workflow-step h3 {
  font-size:14px
}

.workflow-step p {
  font-size:10px;
  color:var(--muted);
  margin:7px 0
}

.workflow-step .finding-topline {
  margin-bottom:0
}

.workflow-step details {
  margin-top:12px
}

.workflow-step summary {
  font-size:10px;
  color:var(--brand-navy)
}

.json-output {
  margin-top:12px;
  background:var(--surface-soft);
  border:1px solid var(--line);
  border-radius:4px;
  padding:18px;
  font:10px/1.7 ui-monospace,SFMono-Regular,monospace;
  color:var(--muted);
  max-height:420px;
  overflow:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}

.error-text {
  color:#8D452F!important
}

.run-provenance {
  display:flex;
  gap:25px;
  flex-wrap:wrap;
  font-size:9px;
  color:var(--muted);
  margin-top:20px
}

@media(min-width:1600px) {
  .main-content {
    padding-top:55px
  }

  .metric {
    padding-top:28px;
    padding-bottom:28px
  }

}

@media(max-width:1200px) {
  .sidebar {
    width:207px;
    padding:26px 15px 18px;
    background:var(--brand-navy-dark);
    color:var(--white)
  }

  .brand {
    font-size:18px;
    color:var(--white)!important
  }

  .app-shell {
    margin-left:207px
  }

  .main-content {
    padding:33px 30px 40px
  }

  h1 {
    font-size:35px
  }

  .metric {
    padding:20px 18px
  }

  .metric small {
    font-size:9px
  }

  .dossier-grid {
    grid-template-columns:minmax(0,1fr) 280px;
    gap:20px
  }

  /* 210px for the library navigation leaves "Oversight & performance" room to
     stay on one line (its text is about 180px wide next to the 16px rule and
     padding); the gap gives back the same 10px, so the document column is
     as wide as it was. */
  .report-grid {
    grid-template-columns:210px minmax(0,1fr);
    gap:13px
  }

  .report-document {
    padding:0 27px
  }

}

@media(max-width:980px) {
  .sidebar {
    width:186px;
    padding-left:12px;
    padding-right:12px;
    background:var(--brand-navy-dark);
    color:var(--white)
  }

  .brand {
    font-size:16px;
    gap:8px;
    color:var(--white)!important
  }

  .nav-link {
    font-size:11px;
    padding:11px 9px;
    gap:9px;
    color:var(--brand-sky)
  }

  .app-shell {
    margin-left:186px
  }

  .main-content {
    padding-left:24px;
    padding-right:24px
  }

  .page-heading h1 {
    font-size:30px
  }

  .page-description {
    font-size:12px
  }

  .metric-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .metric:nth-child(2) {
    border-right:0
  }

  .metric:nth-child(-n+2) {
    border-bottom:1px solid var(--line)
  }

  .agency-monogram {
    width:45px;
    height:43px;
    font-size:12px;
    background:var(--surface-soft);
    color:var(--brand-navy);
    border:1px solid var(--brand-sky)
  }

  .dossier-grid {
    grid-template-columns:1fr
  }

  .dossier-aside {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px
  }

  .dossier-aside>.panel {
    margin-bottom:0
  }

  .dossier-aside>.panel:first-child {
    grid-column:1/-1
  }

  .dossier-aside .research-panel .panel-copy>p {
    max-width:590px
  }

  .report-grid {
    grid-template-columns:1fr
  }

  .report-toc {
    display:none
  }

  .report-document {
    padding:0 27px
  }

  .run-metrics .metric .metric-model {
    font-size:18px
  }

  .document-title {
    font-size:27px!important
  }

  .source-text {
    max-height:65vh;
    color:var(--text-body)
  }

}

@media(max-width:700px) {
  .sidebar {
    position:static;
    width:auto;
    padding:16px 19px 11px;
    display:block;
    background:var(--brand-navy-dark);
    color:var(--white)
  }

  .brand {
    font-size:20px;
    color:var(--white)!important
  }

  .sidebar-account {
    display:none
  }

  .sidebar nav {
    display:flex;
    justify-content:space-between;
    gap:3px;
    margin:15px -8px 0
  }

  .nav-link {
    margin:0;
    font-size:9px;
    gap:6px;
    padding:9px 7px;
    border-radius:4px;
    color:var(--brand-sky)
  }

  .nav-icon {
    font-size:14px;
    width:13px
  }

  .nav-link.is-active {
    box-shadow:inset 0 -2px var(--accent-red);
    background:var(--brand-sky);
    color:var(--brand-navy-dark)
  }

  .app-shell {
    margin-left:0
  }

  .main-content {
    padding:29px 21px 36px
  }

  .page-heading {
    margin-bottom:24px;
    gap:12px
  }

  .page-heading h1 {
    font-size:31px;
    letter-spacing:-1.1px
  }

  .page-heading .eyebrow {
    font-size:8px;
    margin-bottom:10px
  }

  .page-description {
    font-size:11px;
    margin-top:12px
  }

  .metric-grid {
    margin:26px 0
  }

  .metric {
    padding:17px 18px
  }

  .metric strong {
    font-size:29px
  }

  .metric-label {
    font-size:10px
  }

  .metric small {
    font-size:8px
  }

  .section-heading {
    margin-top:25px
  }

  .section-heading h2 {
    font-size:19px
  }

  .section-heading p {
    font-size:10px
  }

  .subtle-label {
    font-size:7px
  }

  .agency-monogram {
    width:51px;
    height:47px;
    font-size:14px;
    background:var(--surface-soft);
    color:var(--brand-navy);
    border:1px solid var(--brand-sky)
  }

  .panel-heading {
    padding:17px 19px
  }

  .panel-copy {
    padding:19px
  }

  .activity-row {
    padding:15px 18px
  }

  .agency-heading h1 {
    font-size:28px
  }

  .agency-monogram--large {
    display:none
  }

  .tabs {
    gap:14px;
    margin-top:21px
  }

  .tabs>a {
    font-size:15px;
    gap:6px;
    padding-left:0;
    padding-right:0
  }

  .dossier-aside {
    grid-template-columns:1fr
  }

  .finding-topline {
    gap:10px
  }

  .report-document {
    padding:0 23px
  }

  .report-section {
    padding:28px 0
  }

  .report-section>h2 {
    font-size:22px
  }

  .prose {
    font-size:12px;
    color:var(--text-body)
  }

  .document-title {
    font-size:26px!important;
    line-height:1.4
  }

  .page-heading>.button {
    font-size:9px;
    white-space:normal;
    padding:8px 10px;
    flex-shrink:0;
    max-width:100px
  }

  .notice-banner {
    padding:14px 16px;
    background:var(--surface-soft);
    border-color:var(--brand-sky);
    color:var(--text-body)
  }

  .notice-banner p {
    font-size:10px
  }

  .result-banner {
    padding:22px;
    display:block;
    background:var(--surface-soft);
    border-color:var(--brand-sky)
  }

  .result-banner .button {
    margin-top:19px
  }

  .result-banner h2 {
    font-size:22px
  }

  .workflow-steps {
    padding:0 19px
  }

  .workflow-step {
    gap:13px;
    padding:21px 0
  }

  .workflow-step h3 {
    font-size:12px
  }

  .workflow-step p {
    font-size:9px
  }

  .workflow-step .badge {
    font-size:8px
  }

  .step-number {
    width:27px;
    height:27px;
    font-size:9px;
    color:var(--brand-navy)
  }

  .run-provenance {
    gap:8px;
    font-size:8px
  }

  .run-metrics .metric .metric-model {
    font-size:15px
  }

  .source-text {
    padding:22px;
    font-size:11px;
    color:var(--text-body)
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

  * {
    transition:none!important
  }

}

@media print {
  .sidebar,.report-toc,.back-link,.tabs,.notice-banner,.page-foot,.export-actions {
    display:none!important
  }

  .app-shell {
    margin:0
  }

  .main-content {
    padding:0;
    max-width:none
  }

  .report-grid,.dossier-grid {
    display:block
  }

  .report-document {
    border:0;
    padding:0
  }

  .report-section {
    break-inside:avoid
  }

  .page-heading h1 {
    font-size:28px
  }

  .prose {
    font-size:11px;
    color:var(--text-body)
  }

  body {
    background:var(--white)
  }

}

.form-actions {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px
}

@media(max-width:480px) {
  .sign-in-panel {
    padding:24px;
    margin:24px auto
  }
}

/* At 15px the two tabs and the AI-generated tag need 369px of screen; this
   keeps them on one line on a 360px phone. */
@media(max-width:368px) {
  .tabs {
    gap:12px
  }

  .tabs>a {
    font-size:14px
  }
}

.rejected-finding {
  padding:17px 0;
  border-bottom:1px solid var(--line);
  font-size:11px;
  color:var(--muted);
  line-height:1.9
}

.rejected-finding strong {
  font-size:12px;
  display:block;
  color:var(--brand-navy-dark);
  margin-bottom:6px
}

::selection {
  background:var(--brand-sky);
  color:var(--brand-navy-dark)
}

.reasoning-overrides {
  padding:12px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.reasoning-overrides summary,.run-stage-settings summary {
  color:var(--brand-navy);
  font-size:13px;
  font-weight:600;
}

.reasoning-overrides>p,.run-stage-settings>p {
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
  margin-top:12px;
}

.run-settings-panel {
  margin-bottom:25px;
}

.run-settings-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  margin:0;
}

.run-settings-grid dt,.stage-reasoning-list dt {
  color:var(--muted);
  font-size:10px;
}

.run-settings-grid dd {
  color:var(--text-body);
  font-size:12px;
  line-height:1.8;
  margin:6px 0 0;
}

.run-settings-grid .model-version {
  font-size:11px;
  overflow-wrap:anywhere;
}

.panel-copy>.model-snapshot-note {
  font-size:10px;
  margin-top:17px;
}

.run-stage-settings {
  border-top:1px solid var(--line);
  margin-top:20px;
  padding-top:17px;
}

.stage-reasoning-list {
  margin:16px 0 0;
  max-width:500px;
}

.stage-reasoning-list>div {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:8px 0;
  border-bottom:1px solid var(--line);
}

.stage-reasoning-list dd {
  color:var(--brand-navy);
  font-size:10px;
  font-weight:550;
  margin:0;
}

@media(max-width:700px) {
  .run-settings-grid {
    grid-template-columns:1fr;
    gap:17px;
  }
}

/* Administration */
.nav-section {
  display:block;
  margin:18px 13px 2px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--sidebar-label)
}

/* The mobile top nav is one non-wrapping row; the admin section label would push it past a 375px screen.
   This must follow the base rule above, which would otherwise win at equal specificity. */
@media(max-width:700px) {
  .nav-section {
    display:none
  }
}

.analytics-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  margin-top:24px
}

@media (max-width:900px) {
  .analytics-grid {
    grid-template-columns:minmax(0,1fr)
  }
}

.data-table {
  width:100%;
  border-collapse:collapse;
  font-size:12px
}

.data-table th,.data-table td {
  text-align:left;
  padding:9px 24px;
  border-bottom:1px solid var(--line);
  vertical-align:top
}

.data-table th {
  font-size:10px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted)
}

.data-table tr:last-child td {
  border-bottom:0
}

.data-table .numeric {
  text-align:right;
  font-variant-numeric:tabular-nums;
  white-space:nowrap
}

/* Visits per day: one series, one hue, thin columns on a hairline baseline */
.visits-chart {
  margin:0;
  padding:22px 24px 18px
}

.visits-chart .bars {
  display:flex;
  align-items:flex-end;
  gap:2px;
  height:160px;
  border-bottom:1px solid var(--line)
}

.visits-chart .bar {
  flex:1 1 0;
  max-width:24px;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  position:relative
}

.visits-chart .bar-fill {
  display:block;
  width:100%;
  height:calc(var(--size,0) * 1%);
  background:var(--chart-mark);
  border-radius:4px 4px 0 0
}

.visits-chart .bar:hover .bar-fill {
  background:var(--brand-navy-dark)
}

.visits-chart .bar-value {
  font-size:10px;
  font-weight:600;
  color:var(--text-body);
  margin-bottom:3px;
  font-variant-numeric:tabular-nums
}

.visits-chart .axis {
  display:flex;
  justify-content:space-between;
  margin-top:6px;
  font-size:10px;
  color:var(--muted)
}

.visits-chart figcaption {
  margin-top:10px;
  font-size:11px;
  color:var(--muted)
}

.visits-chart .table-view {
  margin-top:12px;
  font-size:12px
}

.visits-chart .table-view summary {
  cursor:pointer;
  color:var(--brand-navy-dark);
  font-weight:550
}

.visits-chart .table-view .data-table th,.visits-chart .table-view .data-table td {
  padding:6px 0
}

/* Horizontal bars for counts by category */
.bar-rows {
  padding:12px 24px 18px
}

.bar-row {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) 2fr auto;
  gap:12px;
  align-items:center;
  padding:6px 0;
  font-size:12px
}

.bar-row-label {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}

.bar-row .track {
  display:block;
  height:10px
}

.bar-row .fill {
  display:block;
  height:100%;
  width:calc(var(--size,0) * 1%);
  min-width:2px;
  background:var(--chart-mark);
  border-radius:0 4px 4px 0
}

.bar-row-value {
  font-variant-numeric:tabular-nums;
  color:var(--text-body);
  font-weight:550
}

/* Account settings and people management */
.settings-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  align-items:start
}

@media (max-width:900px) {
  .settings-grid {
    grid-template-columns:minmax(0,1fr)
  }
}

.settings-panel {
  max-width:640px
}

.people-table td {
  vertical-align:middle
}

.row-actions {
  display:flex;
  flex-wrap:wrap;
  gap:4px 14px;
  align-items:center;
  white-space:nowrap
}

.row-actions .text-button {
  padding:0;
  background:none;
  border:0;
  color:var(--brand-navy);
  font:inherit;
  font-size:12px;
  text-decoration:underline;
  cursor:pointer
}

/* Notes and lists shared by the agency pages */
.section-note,.section-empty {
  font-size:12px;
  line-height:1.8;
  color:var(--muted)
}

.section-empty {
  padding:14px 16px;
  border:1px dashed var(--line);
  border-radius:4px;
  background:var(--surface-soft)
}

.section-note+.section-empty {
  margin-top:22px
}

.citation-ref {
  color:var(--brand-navy);
  font-size:11px;
  white-space:nowrap
}

.citation-ref:hover {
  text-decoration:underline
}

.evidence-year {
  margin-top:10px
}

.evidence-year h4 {
  font:650 11px/1.6 var(--heading);
  color:var(--ink);
  margin-bottom:2px
}

.evidence-list {
  list-style:none;
  padding:0;
  margin:0
}

.evidence-list li {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:4px 12px;
  padding:9px 0;
  border-bottom:1px solid var(--line);
  font-size:11px;
  line-height:1.6
}

.evidence-list li:last-child {
  border-bottom:0
}

.evidence-title {
  flex:1 1 320px;
  min-width:0;
  font-weight:550
}

.evidence-title a {
  color:var(--ink)
}

.evidence-title a:hover {
  color:var(--brand-navy)
}

.evidence-meta {
  font-size:10px;
  color:var(--muted)
}

.evidence-status {
  font-size:9px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.6px;
  white-space:nowrap
}

.evidence-note {
  flex-basis:100%;
  font-size:10px;
  color:var(--muted)
}

.see-original {
  display:inline-flex;
  align-items:center;
  border:1px solid var(--brand-navy);
  border-radius:4px;
  padding:2px 9px;
  font-size:11px;
  font-weight:650;
  white-space:nowrap
}

.see-original:hover {
  background:var(--brand-navy);
  color:var(--white);
  text-decoration:none
}

.research-launcher>summary {
  cursor:pointer;
  color:var(--brand-navy);
  font-size:13px;
  font-weight:600
}

.research-launcher>p {
  font-size:12px;
  color:var(--muted);
  line-height:1.8;
  margin-top:12px
}

.research-launcher .stacked-form {
  margin-top:16px
}

/* Document library: the report's two-column page, evidence lists and data
   table, plus the summary lines, Code sub-lists, row tags and a contracts
   table (contract number above its title, the status as a tag under the term
   dates) that scrolls inside its column on a narrow screen only. */
/* Under 980px .report-grid becomes a single 1fr (= minmax(auto, 1fr)) column,
   so a grid item's automatic minimum size is its content's min-content width.
   An overflow-x:auto wrapper does not lower an ancestor's min-content width,
   so without this the contracts table stretches the whole page column and the
   page pans sideways instead of the table scrolling inside .library-table-wrap. */
.library-document {
  min-width:0
}

.library-summary {
  font-size:12px;
  line-height:1.8;
  color:var(--text-body);
  margin-bottom:10px
}

.library-subheading {
  font-size:10px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:var(--muted);
  margin:18px 0 4px
}

.library-tags {
  flex-basis:100%
}

.library-table-wrap {
  overflow-x:auto;
  margin-top:14px
}

.library-contracts th,.library-contracts td,.library-capital th,.library-capital td,.library-financed-rows th,.library-financed-rows td {
  padding:9px 8px
}

.library-contracts th:first-child,.library-contracts td:first-child,.library-capital th:first-child,.library-capital td:first-child,
.library-financed-rows th:first-child,.library-financed-rows td:first-child {
  padding-left:0
}

.library-contracts th:last-child,.library-contracts td:last-child,.library-capital th:last-child,.library-capital td:last-child,
.library-financed-rows th:last-child,.library-financed-rows td:last-child {
  padding-right:0
}

/* The Contract column's minimum keeps the table inside the library column at
   a 1280px window with either scrollbar style: the column is 608px wide with
   a classic scrollbar and 623px with overlay scrollbars. DHCD's table needs
   604px at this minimum. */
.library-contracts td:nth-child(3) {
  min-width:175px
}

.library-contracts td:nth-child(4) {
  min-width:90px
}

.library-contracts .tag {
  margin-left:6px
}

/* The term cell's status tag sits on its own line under the dates. */
.library-contracts .library-term-status {
  display:block;
  width:fit-content;
  margin:5px 0 0;
  white-space:nowrap
}

/* A record that repeats another listed contract is information, not a
   warning, so its tag takes the ended status's muted gray. It stays in one
   piece, moving under the title when the line is full. */
.tag.library-contract-repeats {
  background:var(--surface-soft);
  border-color:var(--line);
  color:var(--muted);
  white-space:nowrap
}

.library-contract-number {
  display:block;
  font-size:10px;
  font-weight:600;
  font-variant-numeric:tabular-nums;
  color:var(--muted)
}

/* The value column: bold tabular figures, so the sizes line up and read first. */
.library-contract-value {
  font-weight:650;
  font-variant-numeric:tabular-nums;
  color:var(--ink)
}

/* What the agency's contracts are worth and how many fall in each size band,
   set off above the table. */
.contract-sizes {
  margin-top:14px;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:4px;
  background:var(--surface-soft)
}

.contract-sizes p {
  font-size:12px;
  line-height:1.7;
  color:var(--text-body)
}

.contract-sizes p+p {
  margin-top:2px
}

.contract-sizes .contract-sizes-total {
  font-size:14px;
  font-weight:650;
  color:var(--ink)
}

/* Capital projects: two parts, each a heading and a plain explanation over
   its tables, with a rule between them so the agency's own projects and the
   outside projects it helps finance never read as one list. */
.library-part+.library-part {
  margin-top:30px;
  padding-top:26px;
  border-top:1px solid var(--line)
}

.library-part>h3 {
  font-size:16px;
  margin-bottom:4px
}

.library-part-intro {
  font-size:12px;
  line-height:1.8;
  color:var(--muted);
  margin-bottom:14px
}

/* The Project column's minimum is what keeps these tables inside the library
   column (623px at a 1280px viewport). Measured on the real FY2027 chapters
   and DC Open Data lists: at 220px the tables needed 640 to 669px and clipped
   their last column mid-figure; at 160px the widest (DHCD's affordable housing
   list) needs 609px, and a long project name just wraps. */
.library-capital td:first-child,.library-financed-rows td:first-child {
  min-width:160px
}

.library-capital th {
  white-space:nowrap
}

.library-financed+.library-financed {
  margin-top:24px
}

/* A long DC Open Data or capital chapter table folds under its count. */
.library-details {
  margin-top:10px
}

.library-details>summary {
  color:var(--brand-navy);
  font-size:12px;
  font-weight:600
}

/* Briefing memo */
.memo-document {
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--white);
  padding:4px 40px;
  max-width:860px
}

.memo-header {
  padding:30px 0 26px;
  border-bottom:1px solid var(--line)
}

.memo-kicker {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px
}

.memo-meta {
  display:flex;
  flex-wrap:wrap;
  gap:6px 28px;
  margin:0;
  font-size:13px;
  line-height:1.8;
  color:var(--text-body)
}

.memo-meta>div {
  display:flex;
  gap:6px
}

.memo-meta dt {
  font-weight:600;
  color:var(--ink)
}

.memo-meta dd {
  margin:0
}

.memo-section {
  padding:30px 0;
  border-bottom:1px solid var(--line)
}

.memo-section:last-child {
  border-bottom:0
}

.memo-section>h2 {
  font-size:19px;
  margin-bottom:14px
}

/* The title line of a memo with its downloads beside it, which wrap under the
   title on a narrow screen. */
.memo-header-top {
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:12px 20px;
  margin-bottom:14px
}

.memo-header-top .memo-kicker {
  margin-bottom:0
}

.export-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}

.button--compact {
  min-height:36px;
  padding:6px 14px;
  font-size:13px
}

/* A part of a heading ("History") and the appendices' subheadings. */
.memo-part {
  font-size:16px;
  margin:28px 0 10px;
  color:var(--brand-navy-dark)
}

.memo-section>h2+.memo-part {
  margin-top:4px
}

/* Section 6 of a review brief: the library's oversight, budget and plan documents. */
.brief-links {
  display:grid;
  gap:12px;
  margin:0 0 18px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--surface-soft);
  font-size:14px
}

.brief-links dt {
  font-weight:600;
  color:var(--ink)
}

.brief-links dd {
  margin:4px 0 0;
  color:var(--text-body)
}

.brief-links ul,.memo-library-links {
  margin:0;
  padding-left:18px;
  list-style:disc
}

.brief-links li+li,.memo-sources li+li {
  margin-top:4px
}

.brief-links a,.memo-sources a,.memo-library-links a {
  color:var(--brand-navy)
}

.brief-links a:hover,.memo-sources a:hover,.memo-library-links a:hover {
  text-decoration:underline
}

/* Section 4 of a review brief: the leadership chart, the same for every
   agency. The head on top, then the executive team, then each group of unit
   heads under the person they report to; cards wrap, one column on a phone. */
.org-chart {
  margin:0 0 18px
}

.org-chart-head {
  display:grid;
  grid-template-columns:minmax(0,320px);
  justify-content:center
}

.org-chart-level {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:10px
}

.org-chart-executives,.org-chart-units,.org-chart-others {
  margin-top:16px;
  padding-top:14px;
  border-top:2px solid var(--line)
}

.org-chart-group+.org-chart-group {
  margin-top:14px
}

.org-chart-group-label {
  margin:0 0 6px;
  font-size:12px;
  color:var(--muted)
}

.org-card {
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-left:3px solid var(--brand-navy);
  border-radius:6px;
  background:var(--white);
  font-size:13px;
  line-height:1.4;
  break-inside:avoid
}

.org-card--head {
  border-left-color:var(--accent-red);
  background:var(--surface-soft)
}

.org-card-name {
  font-size:14px;
  color:var(--ink)
}

.org-card-title {
  color:var(--text-body)
}

.org-card-unit {
  font-size:12px;
  color:var(--muted)
}

.org-card-source {
  margin-top:2px;
  font-size:11px
}

.org-card-date {
  font-size:11px;
  color:var(--muted)
}

/* A position no source gives a holder. */
.org-card--placeholder {
  border-style:dashed;
  background:transparent
}

.org-card--placeholder .org-card-name {
  font-style:italic;
  color:var(--muted)
}

.org-chart figcaption {
  margin-top:12px;
  font-size:12px;
  line-height:1.6;
  color:var(--muted)
}

@media(max-width:700px) {
  .org-chart-head,.org-chart-level {
    grid-template-columns:minmax(0,1fr)
  }
}

/* Section 4 of a review brief when there is no chart to draw. */
.brief-chart-missing {
  margin:0 0 18px;
  font-size:14px;
  color:var(--brand-navy)
}

.memo-sources {
  margin:0;
  padding-left:22px;
  list-style:decimal;
  font-size:14px;
  line-height:1.6
}

.memo-library-links {
  columns:2 220px;
  font-size:14px;
  line-height:1.8
}

.memo-prose .citation-ref {
  font-size:inherit;
  white-space:normal
}

/* At the 860px reading width, 13px prose runs about 125 characters a line;
   16px brings it to about 95. Phones and print keep the smaller .prose sizes. */
@media screen and (min-width:701px) {
  .memo-prose {
    font-size:16px
  }

  .memo-prose p {
    line-height:1.75
  }
}

.tabs .tag,.panel-heading .tag {
  margin-left:6px;
  vertical-align:middle;
  white-space:nowrap;
  flex:none
}

/* The gap on .tabs>a spaces the tag from the label. */
.tabs .tag {
  margin-left:0
}

.dossier-grid--single {
  grid-template-columns:minmax(0,1fr)
}

.dossier-grid--single .memo-document {
  margin:0 auto
}

.research-launcher .reasoning-overrides>.field {
  margin-top:16px
}

@media(max-width:700px) {
  .memo-document {
    padding:4px 20px
  }
}

.citation-usage .memo-citing-sentence {
  font-size:11px;
  line-height:1.8;
  color:var(--text-body);
  margin-top:0
}

.run-memo-panel {
  margin-bottom:25px
}

/* Agencies index: one table, scrolled sideways inside its panel on a phone */
.table-scroll {
  overflow-x:auto
}

.agency-table td {
  vertical-align:middle
}

.agency-table td:first-child {
  min-width:220px
}

/* "Prepared Sep 29, 2026" and "Not generated yet" read as one unit, not three lines. */
.agency-table .agency-memo-col {
  white-space:nowrap
}

/* Page foot: the downloads and quiet links under the memo and document pages. */
.page-foot {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px;
  margin-top:28px;
  padding-top:14px;
  border-top:1px solid var(--line)
}

.page-foot .text-link {
  font-size:12px
}

/* Reporting requirements (library): the AI-assisted tag on the section's
   heading, one block per requirement (a plain title, neutral labels for how
   often, when and to whom, who, the quoted Code text and its citation), the
   collapsed lists and the administrators' form under them. */
.report-section>h2 .tag {
  margin-left:8px;
  vertical-align:middle;
  white-space:nowrap
}

.reporting-list {
  list-style:none;
  padding:0;
  margin:0 0 8px
}

.reporting-requirement {
  padding:14px 0;
  border-bottom:1px solid var(--line)
}

.reporting-requirement:last-child {
  border-bottom:0
}

.reporting-title {
  font-size:13px;
  font-weight:650;
  color:var(--ink);
  margin:0 0 6px
}

.reporting-labels {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:0 0 6px
}

.reporting-label {
  font-size:9px;
  padding:3px 7px;
  border-radius:3px;
  background:var(--brand-sky);
  border:1px solid var(--brand-sky);
  color:var(--brand-navy)
}

.reporting-who {
  font-size:11px;
  color:var(--muted);
  margin:0 0 6px
}

.reporting-quote {
  margin:0 0 6px;
  padding:8px 12px;
  border-left:3px solid var(--brand-sky);
  background:var(--surface-soft);
  font-size:12px;
  line-height:1.7;
  color:var(--text-body)
}

/* A quote whose Code text has changed since it was identified asks the
   reader to check the section, in the red kept for marks that ask for
   attention. */
.reporting-changed {
  font-size:11px;
  color:var(--accent-red);
  margin:0 0 6px
}

.reporting-citation {
  margin:0
}

/* A section of a chapter is cited with the chapter's name, which on a phone
   is wider than the line; unlike a memo's inline labels this one may wrap. */
.reporting-citation .citation-ref {
  white-space:normal
}

.reporting-details {
  margin-top:16px
}

.reporting-details>summary {
  cursor:pointer;
  color:var(--brand-navy);
  font-size:12px;
  font-weight:600
}

.reporting-unmatched .evidence-note {
  line-height:1.7
}

.reporting-admin {
  margin-top:24px;
  padding-top:16px;
  border-top:1px dashed var(--line)
}

/* When the library was last checked for newer documents; the admin's details and button. */
.library-freshness {
  margin: 0 0 1.25rem;
  padding: 0.75rem 1rem;
  border-left: 3px solid var(--brand-sky);
  background: var(--surface-soft);
}

.library-freshness .small-copy {
  margin: 0 0 0.35rem;
}

.library-freshness .freshness-form {
  margin-top: 0.5rem;
}