.program-page {max-width:1200px;margin:auto;padding:38px 24px 90px}
.program-page h1 {font-size:clamp(25px,4vw,40px);line-height:1.22;max-width:24ch;margin:16px 0}
.program-page h2 {font-size:19px;line-height:1.5}
.program-page p {max-width:82ch}
/* Inline examples such as the correspondence.json array are one unbreakable
   word; on a phone they must wrap inside the paragraph, not widen the page. */
.program-page :is(p,li) code {overflow-wrap:anywhere}
.program-page button,.program-page select,.program-page textarea {font:inherit;color:var(--ink);background:var(--cream-raised);border:1px solid var(--rule);padding:9px 12px}
.program-page button {cursor:pointer;text-align:left}
.program-page button:hover,.program-page button[aria-pressed=true] {border-color:var(--focus);color:var(--focus)}
.program-page :focus-visible {outline:2px solid var(--focus);outline-offset:4px}
.program-toolbar {display:flex;align-items:center;gap:18px;padding:20px 0;border-top:1px solid var(--rule);font-size:12px}
.program-toolbar button {white-space:nowrap}
.program-toolbar {flex-wrap:wrap}
.program-map {background:var(--code-bg);padding:8px}
.program-map svg {display:block;max-width:100%;height:auto;overflow:visible;color:var(--focus)}
.program-group {fill:#111e28;stroke:#749899;stroke-width:1;stroke-dasharray:4 3}
.program-group.depth-1 {fill:#142930;stroke:#467d77}
.program-definition {fill:#071318;stroke:#3a625f}
.program-label {fill:var(--ink);font:12px var(--mono);pointer-events:none}
.program-toggle {fill:var(--focus);font:16px var(--mono)}
.program-repeat {fill:var(--violet);font:18px var(--mono)}
.program-map g[role=button] {cursor:pointer}
.program-map g[role=button]:hover text,.program-map g[role=button]:focus text {fill:var(--focus)}
.program-edge {fill:none;stroke:#62e8ca;stroke-width:1.5;opacity:.36;cursor:pointer;pointer-events:stroke}
.program-edge:hover,.program-edge.selected {opacity:1;stroke-width:3}
.program-caption {font-size:11px;color:var(--ink-muted);margin:12px}
.program-relations {margin:12px;font-size:12px}
.program-relations button {display:block;margin:6px 0}
.program-comparison {margin:32px 0;border-top:1px solid var(--rule)}
.program-roles {display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:0;background:var(--cream);padding:10px 0;z-index:1}
.program-inspector {border-top:1px solid var(--violet);padding-top:16px}
.program-layout > * {min-width:0}
.program-inspector {margin-top:24px;max-height:75vh;overflow:auto}
.program-evidence-shortcut,.program-evidence-close {display:none}
@media(max-width:1099px) {
 .program-inspector {display:none}
 .program-page .program-evidence-shortcut:not([hidden]) {display:block;position:fixed;bottom:12px;left:12px;right:12px;z-index:20;border-color:var(--focus);box-shadow:0 0 0 5px var(--cream);font-size:12px}
 .program-evidence-open .program-inspector {display:block;position:fixed;inset:auto 8px 8px;z-index:21;max-height:70dvh;margin:0;padding:16px;background:var(--cream-raised);border:1px solid var(--violet);box-shadow:0 -12px 40px #0008;overscroll-behavior:contain}
 .program-evidence-open .program-evidence-close {display:block;position:sticky;top:0;margin-left:auto;z-index:1}
}
@media(min-width:1100px) {
 .program-layout {display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 24px}
 .program-toolbar {grid-column:1 / -1}
 .program-map,.program-comparison {grid-column:1}
 .program-inspector {grid-column:2;grid-row:2 / span 2;position:sticky;top:16px;align-self:start;margin-top:0}
 .program-inspector h3 {font-size:14px}
}
.program-inspector code,.program-inspector h3 {overflow-wrap:anywhere}
.program-page pre {overflow:auto;max-height:440px;padding:16px;background:var(--code-bg);font-size:12px;line-height:1.6}
.program-inspector > button {font-size:11px;margin:8px 4px 8px 0}
.program-inspector h2 {font-size:16px;overflow-wrap:anywhere}
.program-inspector p,.program-inspector code {font-size:12px;line-height:1.5}
.program-path {padding-left:18px}
.program-path button {font-size:11px;overflow-wrap:anywhere;max-width:100%}
.program-review-switches,.program-review-changes {margin:18px 0;padding:16px;border:1px solid var(--rule)}
.program-review-switches button {margin-right:10px}
.program-review-switches button[aria-pressed=true] {color:var(--focus);border-color:var(--focus)}
.program-review-switches code {display:block;overflow-wrap:anywhere;font-size:11px}
.program-review-changes li {margin:10px 0;font-size:12px;overflow-wrap:anywhere}
.program-review-changes button {font-size:11px;margin:4px}
.program-page textarea {width:100%;height:340px;tab-size:2;font-size:12px;line-height:1.6}
.program-page details {margin-top:18px}
.program-page summary {cursor:pointer}
.program-controls {display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:16px 0}
.program-status {color:var(--focus);min-height:1.5em}
.program-status[data-error=true] {color:var(--danger)}
@media(max-width:600px) {
 .program-page {padding:24px 12px 70px}
 .program-toolbar {display:block}.program-toolbar span {display:block;margin-top:12px}
 .program-label {font-size:11px}
}

.program-group.contains-pin,.program-definition.contains-pin {stroke:var(--violet);stroke-width:1.5}
.program-definition.selected-definition {stroke:var(--focus);stroke-width:3}
.program-cells {display:table;width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed}
.program-cells th,.program-cells td {padding:10px;vertical-align:top;border:1px solid var(--rule);overflow-wrap:anywhere;text-align:left}
.program-cells th {color:var(--violet);font-weight:normal}
.program-cells button {font-size:11px;padding:7px;max-width:100%;overflow-wrap:anywhere}
.program-cells span {color:var(--ink-muted);font-size:11px}
.program-canvas {max-height:600px;overflow:auto;scrollbar-color:var(--rule) var(--code-bg)}
.program-mini {max-width:500px;margin:auto}
.program-mini p {font-size:11px;color:var(--ink-muted)}
.program-mini svg {width:100%;max-height:210px}
.program-mini .expanded-location {fill:#24433f;stroke:var(--focus)}
.program-caption strong {display:inline-block;color:var(--focus);margin-top:8px;font-weight:normal}
@media(max-width:600px) {
 .program-cells,.program-cells tbody,.program-cells tr,.program-cells td {display:block;width:100%}
 .program-cells thead {display:none}
 .program-cells tbody th {display:block;border:0;padding:12px 10px 6px}
 .program-cells td {display:grid;grid-template-columns:1fr 1fr;gap:8px;border-width:0 0 1px}
 .program-cells td::before {content:attr(data-handler);color:var(--ink-muted)}
 .program-cells tr {border:1px solid var(--rule);margin-bottom:14px}
 .program-canvas {max-height:430px}
 .program-mini svg {max-height:175px}
}