body { min-width: 320px; overflow: auto; }
.topbar { position: sticky; z-index: 20; top: 0; }
.conformance-main { display: block; width: min(1500px, 100%); height: auto; min-height: calc(100dvh - 52px); padding: 28px; }
.conformance-main h1 { margin: 0 0 6px; font-size: clamp(24px, 3vw, 34px); line-height: 1.08; letter-spacing: -.03em; }
.conformance-main h2 { margin: 0; font-size: 17px; }
.conformance-main h3 { color: var(--text-primary); font-size: 12px; }

.report-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; padding: 8px 0 24px; border-bottom: 1px solid var(--border-standard); }
.report-head > div:first-child p { margin: 0; color: var(--text-secondary); font-size: 13px; }
.live-state { display: flex; min-width: 285px; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border-standard); border-radius: 6px; background: var(--soil-925); }
.live-state strong, .live-state small { display: block; }
.live-state strong { font-size: 12px; }
.live-state small { margin-top: 2px; color: var(--text-tertiary); font-size: 10px; }
.state-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--atmosphere); }
.live-state[data-state=aligned] .state-dot { background: var(--canopy); }
.live-state[data-state=drift] .state-dot, .live-state[data-state=error] .state-dot { background: var(--rust); }

.scope-section, .breadth-section, .suite-section, .ledger-section, .contract-section, .release-gap { margin-top: 28px; }
.section-heading { margin-bottom: 12px; }
.section-heading > div { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; }
.section-heading p { max-width: 720px; margin: 0; color: var(--text-tertiary); font-size: 11px; text-align: right; }
.scope-note { max-width: 1120px; margin: 10px 0 0; color: var(--text-tertiary); font-size: 11px; line-height: 1.55; }

.scope-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--border-standard); border-bottom: 1px solid var(--border-standard); }
.scope-summary > div { min-width: 0; padding: 14px 16px; border-right: 1px solid var(--border-soft); }
.scope-summary > div:first-child { padding-left: 0; }
.scope-summary > div:last-child { border-right: 0; }
.scope-summary dt { color: var(--text-tertiary); font-size: 10px; }
.scope-summary dd { display: flex; align-items: baseline; gap: 8px; margin: 4px 0 0; }
.scope-summary strong { color: var(--ivory); font: 22px/1 var(--mono); white-space: nowrap; }
.scope-summary dd > span { overflow: hidden; color: var(--text-secondary); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.coverage-bar { display: flex; width: 100%; height: 12px; overflow: hidden; border: 1px solid var(--border-standard); border-radius: 3px; background: var(--soil-950); }
.coverage-bar span { display: block; height: 100%; }
.coverage-advertised { background: var(--canopy); }
.coverage-mapped { background: var(--atmosphere); }
.coverage-absent { background: var(--slate-850); }
.coverage-unknown { background: var(--rust); }
.coverage-key { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 10px; }
.coverage-key > div { display: grid; grid-template-columns: 8px auto 1fr; gap: 6px; align-items: baseline; padding-right: 16px; color: var(--text-tertiary); font-size: 10px; }
.coverage-key strong { color: var(--text-primary); font: 13px var(--mono); }
.key-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-muted); }
.key-dot.advertised { background: var(--canopy); }
.key-dot.mapped { background: var(--atmosphere); }
.key-dot.absent { background: var(--text-muted); }
.key-dot.unknown { background: var(--rust); }

.suite-section { padding: 16px; border: 1px solid var(--border-standard); border-radius: 6px; background: var(--soil-925); }
.suite-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); }
.suite-summary > div { display: flex; gap: 8px; align-items: baseline; padding: 12px; border-right: 1px solid var(--border-soft); }
.suite-summary > div:first-child { padding-left: 0; }
.suite-summary > div:last-child { border-right: 0; }
.suite-summary strong { color: var(--ivory); font: 18px/1 var(--mono); }
.suite-summary span { color: var(--text-secondary); font-size: 10px; }
.suite-boundary { display: grid; grid-template-columns: 150px 1fr; gap: 12px; padding: 12px 0; }
.suite-boundary strong { color: var(--text-tertiary); font-size: 10px; }
.suite-boundary p { margin: 0; color: var(--text-secondary); font-size: 11px; }
.suite-table-wrap { overflow-x: auto; border: 1px solid var(--border-soft); border-radius: 4px; }
.suite-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.suite-table th, .suite-table td { padding: 8px 10px; border-bottom: 1px solid var(--border-soft); text-align: left; vertical-align: top; }
.suite-table tr:last-child td { border-bottom: 0; }
.suite-table th { color: var(--text-tertiary); font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.suite-table td { color: var(--text-secondary); }
.suite-table .suite-gate { min-width: 170px; color: var(--text-primary); font-family: var(--mono); }
.suite-table .suite-pass { color: var(--recovery); font-family: var(--mono); }
.suite-table .suite-fail { color: var(--rust); font-family: var(--mono); }
.suite-table .suite-skip { color: var(--atmosphere); font-family: var(--mono); }
.suite-table .suite-scope-cell { min-width: 320px; }
.suite-footnotes { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 12px; }
.suite-footnotes h3 { margin: 0 0 5px; color: var(--text-tertiary); font-size: 10px; }
.suite-footnotes ul { margin: 0; padding-left: 16px; }
.suite-footnotes li, .suite-footnotes summary, .suite-pins { color: var(--text-tertiary); font-size: 10px; line-height: 1.5; }
.suite-footnotes summary { cursor: pointer; color: var(--text-secondary); }
.suite-pins { margin: 8px 0; font-family: var(--mono); overflow-wrap: anywhere; }
.suite-footnotes code { color: var(--atmosphere); font: 9px var(--mono); }

.ledger-controls { display: grid; grid-template-columns: minmax(240px, 1fr) auto; gap: 16px; align-items: end; padding: 12px; border: 1px solid var(--border-standard); border-bottom: 0; border-radius: 6px 6px 0 0; background: var(--soil-925); }
.ledger-controls label { margin: 0; }
.scope-filters { display: flex; gap: 4px; padding: 3px; border: 1px solid var(--border-soft); border-radius: 5px; background: var(--soil-950); }
.scope-filters button { border: 0; background: transparent; color: var(--text-tertiary); white-space: nowrap; }
.scope-filters button[aria-pressed=true] { background: var(--slate-850); color: var(--text-primary); }
.process-columns, .process-row > summary { display: grid; grid-template-columns: minmax(220px, 1.35fr) repeat(5, minmax(95px, .7fr)); gap: 12px; }
.process-columns { padding: 8px 34px 8px 12px; border: 1px solid var(--border-standard); border-bottom-color: var(--border-soft); color: var(--text-tertiary); font: 9px/1 var(--mono); letter-spacing: .05em; text-transform: uppercase; }
.process-list { border: 1px solid var(--border-standard); border-top: 0; border-radius: 0 0 6px 6px; }
.process-row { margin: 0; padding: 0; border: 0; border-bottom: 1px solid var(--border-soft); background: var(--slate-900); }
.process-row:last-child { border-bottom: 0; }
.process-row[open] { background: var(--slate-850); }
.process-row > summary { align-items: center; min-height: 48px; margin: 0; padding: 8px 12px; list-style: none; }
.process-row > summary::-webkit-details-marker { display: none; }
.process-identity { min-width: 0; }
.process-identity strong, .process-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.process-identity strong { color: var(--ivory); font: 11px/1.4 var(--mono); }
.process-identity small { margin-top: 2px; color: var(--text-tertiary); font-size: 10px; }
.support-mark { display: inline-flex; width: fit-content; align-items: center; gap: 5px; color: var(--text-secondary); font-size: 9px; }
.support-mark::before { width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: var(--text-muted); content: ""; }
.support-mark.yes::before { background: var(--canopy); }
.support-mark.pending::before { background: var(--atmosphere); }
.process-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 12px 16px 16px; border-top: 1px solid var(--border-soft); }
.process-detail h4 { margin: 0 0 6px; color: var(--text-tertiary); font-size: 10px; font-weight: 600; }
.process-detail p, .process-detail li { color: var(--text-secondary); font-size: 11px; }
.process-detail ul { margin: 0; padding-left: 16px; }
.process-detail code { color: var(--atmosphere); font: 10px var(--mono); }
.empty-state { padding: 28px; border: 1px solid var(--border-standard); color: var(--text-tertiary); text-align: center; }

.workflow-list { border: 1px solid var(--border-standard); border-radius: 6px; }
.workflow-row { margin: 0; padding: 0; border: 0; border-bottom: 1px solid var(--border-soft); }
.workflow-row:last-child { border-bottom: 0; }
.workflow-row > summary { display: grid; grid-template-columns: 110px minmax(200px, .8fr) minmax(300px, 1.4fr); gap: 16px; align-items: center; margin: 0; padding: 11px 14px; list-style: none; }
.workflow-row > summary::-webkit-details-marker { display: none; }
.workflow-row strong { font: 11px/1.4 var(--mono); }
.workflow-row .shape { color: var(--text-secondary); font-size: 11px; }
.workflow-detail { padding: 0 14px 14px 140px; color: var(--text-secondary); font-size: 11px; }
.workflow-detail code { color: var(--atmosphere); font: 10px/1.6 var(--mono); }
.state-label { display: inline-block; width: fit-content; padding: 3px 6px; border: 1px solid var(--border-soft); border-radius: 3px; color: var(--text-tertiary); font: 9px/1 var(--mono); text-transform: uppercase; }
.state-label.accepted { border-color: #6da58a80; color: var(--recovery); }
.state-label.refused, .state-label.excluded, .state-label.outside-pilot { border-color: #e5a17e70; color: var(--rust); }
.state-label.pending, .state-label.configured-unmeasured { color: var(--atmosphere); }

.contract-grid { display: grid; grid-template-columns: 1.2fr .9fr .9fr; border: 1px solid var(--border-standard); border-radius: 6px; }
.contract-grid > div { padding: 14px; border-right: 1px solid var(--border-soft); }
.contract-grid > div:last-child { border-right: 0; }
.contract-list article { padding: 10px 0; border-top: 1px solid var(--border-soft); }
.contract-list article:first-child { border-top: 0; }
.contract-list header { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.contract-list strong { font: 10px/1.4 var(--mono); }
.contract-list p { margin: 5px 0 0; color: var(--text-tertiary); font-size: 10px; }
.release-gap { padding: 16px; border: 1px solid #e5a17e70; border-radius: 6px; background: var(--soil-925); }
.release-gap p { max-width: 1100px; color: var(--text-secondary); font-size: 11px; }
.release-gap details { margin-top: 12px; padding-top: 10px; }
.release-gap li { color: var(--text-tertiary); font: 10px/1.6 var(--mono); }

@media (max-width: 1100px) {
  .process-columns { display: none; }
  .process-row > summary { grid-template-columns: minmax(220px, 1.4fr) repeat(5, minmax(90px, .7fr)); }
  .ledger-controls { grid-template-columns: 1fr; }
  .scope-filters { overflow-x: auto; }
  .coverage-key { grid-template-columns: 1fr 1fr; gap: 8px; }
}

@media (max-width: 720px) {
  .conformance-main { padding: 18px 12px 36px; }
  .report-head, .section-heading > div { display: block; }
  .live-state { min-width: 0; margin-top: 16px; }
  .section-heading p { margin-top: 5px; text-align: left; }
  .scope-summary { grid-template-columns: 1fr 1fr; }
  .scope-summary > div, .scope-summary > div:first-child { padding: 12px; border-top: 1px solid var(--border-soft); }
  .scope-summary > div:nth-child(odd) { border-right: 1px solid var(--border-soft); }
  .scope-summary > div:nth-child(even) { border-right: 0; }
  .scope-summary dd { display: block; }
  .scope-summary dd > span { display: block; margin-top: 5px; white-space: normal; }
  .coverage-key, .suite-summary, .suite-footnotes { grid-template-columns: 1fr; }
  .suite-summary > div, .suite-summary > div:first-child { padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--border-soft); }
  .suite-summary > div:last-child { border-bottom: 0; }
  .suite-boundary { grid-template-columns: 1fr; gap: 4px; }
  .process-row > summary { grid-template-columns: 1fr auto; }
  .process-row > summary > :nth-child(n+3) { display: none; }
  .process-detail, .contract-grid { display: block; }
  .contract-grid > div { border-right: 0; border-bottom: 1px solid var(--border-soft); }
  .contract-grid > div:last-child { border-bottom: 0; }
  .workflow-row > summary { grid-template-columns: 90px 1fr; }
  .workflow-row .shape { grid-column: 1 / -1; }
  .workflow-detail { padding-left: 14px; }
  .topbar-actions .cloud-link { display: none; }
}
