/* Kompakter Modul-9-Arbeitsbereich mit stabilen Graphkoordinaten und sichtbarem Wertverlauf. */
.dijkstra-app { --dj-border: #cbd5df; --dj-active: #2563eb; --dj-done: #d7efda; min-width: 0; }
.dijkstra-controls, .dijkstra-auto, .dijkstra-entry, .dijkstra-value-form, .dijkstra-init { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; }
.dijkstra-controls { padding-bottom: 12px; border-bottom: 1px solid var(--dj-border); }
.dijkstra-app label { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; }
.dijkstra-app button, .dijkstra-app select, .dijkstra-app input { font: inherit; border: 1px solid var(--dj-border); border-radius: 4px; background: white; color: #1f2937; min-height: 36px; padding: 5px 9px; max-width: 100%; }
.dijkstra-app button { cursor: pointer; }
.dijkstra-app button:disabled { opacity: .45; cursor: default; }
.dijkstra-app button:focus-visible { outline: 3px solid #d68b00; outline-offset: 2px; }
.dijkstra-app svg.lucide { width: 19px; height: 19px; vertical-align: middle; }
.dijkstra-auto { padding: 8px 0; }
.dijkstra-app [hidden] { display: none !important; }
.dijkstra-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(350px, 1fr); grid-template-areas: "graph code" "tools tools" "visited messages"; gap: 0 16px; padding-top: 12px; }
.dijkstra-left { grid-area: graph; }
.dijkstra-code { grid-area: code; align-self: start; }
.dijkstra-visited-wrap { grid-area: visited; align-self: start; }
.dijkstra-messages { grid-area: messages; }
.dijkstra-left, .dijkstra-code, .dijkstra-messages { min-width: 0; }
.dijkstra-goal { font-weight: 600; padding-bottom: 8px; }
.dijkstra-viewport { overflow-x: auto; }
.dijkstra-graph { width: 100%; height: 450px; position: relative; background: radial-gradient(#d8e0e5 1px, transparent 1px) 0 0 / 18px 18px, #fff; border: 1px solid var(--dj-border); overflow: hidden; }
.dijkstra-app[data-dense="true"] .dijkstra-graph { height: 560px; }
.dijkstra-edges { position: absolute; inset: 0; width: 100%; height: 100%; }
.dijkstra-edges line { stroke: #8294a3; stroke-width: 2; vector-effect: non-scaling-stroke; }
.dijkstra-edges line.active { stroke: #2563eb; stroke-width: 3; }
.dijkstra-node { position: absolute; transform: translate(-50%, -50%); z-index: 2; }
.dijkstra-node-button { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 70px; height: 54px; border-radius: 8px !important; padding: 2px !important; background: #edf2f7 !important; touch-action: none; user-select: none; }
.dijkstra-label { font-size: 13px; line-height: 16px; max-width: 95%; overflow-wrap: anywhere; }
.dijkstra-distance { font-size: 18px; line-height: 23px; }
.dijkstra-node-button.visited { background: var(--dj-done) !important; border-color: #21863c; }
.dijkstra-node-button.current { border: 3px solid #2563eb; }
.dijkstra-node-button.pending { background: #fff2c6 !important; }
.dijkstra-node-button.selected { outline: 2px solid #bd7800; outline-offset: 2px; }
.dijkstra-history { position: absolute; top: 57px; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; gap: 3px; white-space: nowrap; font-size: 12px; color: #7b3434; background: #fffdf8; }
.dijkstra-weight { position: absolute; transform: translate(-50%, -50%); border: 1px solid #cbd5df; padding: 0 3px; border-radius: 3px; background: white; font-size: 12px; line-height: 17px; z-index: 1; }
.dijkstra-toolbar { grid-area: tools; display: flex; align-items: end; flex-wrap: wrap; gap: 8px 16px; margin: 12px 0; container-type: inline-size; }
/* Vertikaler Trenner zwischen Knoteneingabe und Initialisierung */
.dijkstra-toolbar .dijkstra-init { padding: 0 0 0 16px; border-left: 1px solid var(--dj-border); }
/* Passt die Leiste nicht in eine Zeile (ca. 1000px), bricht init um und braucht keinen Trenner. */
@container (max-width: 1010px) { .dijkstra-toolbar .dijkstra-init { padding-left: 0; border-left: 0; } }
.dijkstra-value { width: 100px; }
.dijkstra-visited-wrap { display: flex; align-items: center; gap: 10px; }
.dijkstra-visited { min-height: 52px; flex: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 5px; border: 2px dashed #85a391; padding: 6px; }
.dijkstra-visited[aria-disabled="true"] { border-color: #cbd5df; color: #687482; }
.dijkstra-chip { padding: 3px 7px; border-radius: 4px; border: 1px solid #8fba98; background: #d7efda; font-size: 13px; }
.dijkstra-code { background: #f4f6f8; padding: 8px 0; border: 1px solid var(--dj-border); font-family: Consolas, monospace; font-size: 13px; line-height: 1.55; }
.dijkstra-code .pseudocode-line { display: flex; gap: 8px; padding: 5px 8px; min-width: 0; }
.dijkstra-code .pseudocode-num { flex: 0 0 18px; color: #697586; }
.dijkstra-code .pseudocode-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.dijkstra-code .active { background: #dceaff; border-left: 3px solid #2563eb; padding-left: 5px; }
.dijkstra-help { background: #eef4ff; border-left: 3px solid #2563eb; padding: 10px; font-size: .9rem; }
.dijkstra-feedback { color: #a92828; min-height: 42px; padding: 8px 0; }
.dijkstra-result { font-weight: 600; color: #166534; overflow-wrap: anywhere; }
@media(max-width: 1150px) { .dijkstra-layout { grid-template-columns: minmax(0,1fr); grid-template-areas: "graph" "tools" "visited" "code" "messages"; } .dijkstra-code { margin-top: 12px; } }
@media(max-width: 600px) {
  /* Lokales Scrollen erhaelt lesbare Staedtenamen statt winziger Knoten. */
  .dijkstra-graph { min-width: 620px; }
}