.pathway-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 1fr); gap: 16px; }
.pathway-layout > .card { min-width: 0; }
.card .note { overflow-wrap: anywhere; }
.pathway-map { max-height: 70vh; overflow: auto; background: white; border: 1px solid var(--rule); border-radius: 8px; }
.pathway-map svg { display: block; min-width: calc(var(--pw-width, 900px) * var(--pw-zoom, 1)); width: calc(100% * var(--pw-zoom, 1)); }
.pathway-map [role="button"] { cursor: pointer; }
.pathway-map [role="button"]:focus { outline: 3px solid #2a78d6; outline-offset: 2px; }
.pathway-map .pw-node[aria-pressed="true"] text { font-weight: bold; }
.pathway-map .pw-edge[data-selected="true"] { stroke: #243c52; stroke-width: 3; }
.pathway-map .pw-node:hover { filter: brightness(.95); }
.pathway-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; }
.pw-legend-up { color: #a52b20; }
.pw-legend-down { color: #195e9d; }
.pw-legend-zero { color: #333; }
.pw-legend-unavailable { color: #555; }
#pw-zoom { width: 120px; }
.atlas-map { height: 70vh; min-height: 440px; background: white; border: 1px solid var(--rule); border-radius: 8px; overflow: hidden; }
.atlas-map svg { width: 100%; height: 100%; display: block; touch-action: none; cursor: grab; }
.atlas-map .pa-node { cursor: pointer; }
.atlas-map .pa-node:focus { outline: 3px solid #2a78d6; outline-offset: 3px; }
#pa-detail { max-height: 70vh; overflow: auto; }
#pa-matches { max-width: min(500px, 100%); }
#pw-detail { overflow: auto; max-height: 70vh; align-self: start; }
#pw-detail button { margin: 4px; }
#pw-status { min-height: 20px; margin: 8px 0; }
#pw-pathway { max-width: min(600px, 100%); }
header { flex-wrap: wrap; }
.controls .field { max-width: 100%; min-width: 0; }
.controls select { max-width: 100%; }
@media (max-width: 900px) { .pathway-layout { grid-template-columns: 1fr; } }