/* CC_193 — Sprungkette: Kommandopult, Navigation, Energieverteilung */

.jump-sequence-panel {
    border-left: 4px solid var(--accent-cyan, #22d3ee);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.jump-sequence-panel.phase-calculation_flawed,
.jump-sequence-panel.phase-declined { border-left-color: var(--accent-red, #f87171); }
.jump-sequence-panel.phase-preparation { border-left-color: var(--accent-orange, #f5a623); }
.jump-sequence-panel.phase-completed { border-left-color: var(--accent-green, #34d399); }

.jump-sequence-panel .warning-label { color: #ff7a45; font-weight: bold; }
.jump-sequence-panel .ok-label { color: #00c853; }

.jump-label {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-right: 0.35rem;
}
.jump-hint { opacity: 0.7; font-size: 0.85em; margin: 0; }
.jump-error {
    color: #ff7a6e;
    border: 1px solid rgba(255, 122, 110, 0.5);
    border-radius: 4px;
    padding: 0.4rem 0.6rem;
}
.jump-message { font-size: 0.9rem; }

.jump-target-line, .jump-row, .jump-current-sector {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.6rem;
}
.jump-origin {
    font-size: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 3px;
    padding: 0 0.35rem;
}

.jump-order-form { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.jump-order-form .jump-target-select { flex: 1 1 14rem; min-width: 0; }
.jump-order-form .jump-hint { flex-basis: 100%; }

/* Schrittleiste */
.jump-steps {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    counter-reset: jumpstep;
}
.jump-steps li {
    counter-increment: jumpstep;
    flex: 1 1 7rem;
    font-size: 0.78rem;
    padding: 0.3rem 0.45rem;
    border-radius: 4px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.5);
}
.jump-steps li::before { content: counter(jumpstep) ". "; }
.jump-steps li[data-state="done"] { color: #00c853; border-color: rgba(0, 200, 83, 0.5); }
.jump-steps li[data-state="done"]::before { content: "✓ "; }
.jump-steps li[data-state="current"] { color: #fff; border-color: var(--accent-cyan, #22d3ee); background: rgba(34, 211, 238, 0.12); }
.jump-steps li[data-state="alert"] { color: #fff; border-color: #ff5252; background: rgba(255, 82, 82, 0.18); }

.jump-actor { font-size: 0.9rem; }

.jump-alert, .jump-order-box {
    border-radius: 6px;
    padding: 0.6rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.jump-alert { border: 2px solid #ff5252; background: rgba(255, 82, 82, 0.12); }
.jump-alert p, .jump-order-box p { margin: 0; }
.jump-order-box { border: 1px solid var(--accent-cyan, #22d3ee); background: rgba(34, 211, 238, 0.08); }
.jump-alert-title { font-weight: bold; letter-spacing: 0.05em; }
.jump-alert .jump-alert-title { color: #ff8a80; animation: jump-alert-pulse 1.2s ease-in-out infinite alternate; }
@keyframes jump-alert-pulse { from { opacity: 1; } to { opacity: 0.55; } }

.jump-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.jump-actions .btn-action:disabled { opacity: 0.35; cursor: not-allowed; }
.jump-execute { font-weight: bold; letter-spacing: 0.08em; }
.jump-calc-btn { font-size: 1rem; padding: 0.7rem 1.2rem; }

.jump-decline form { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.4rem; }
.jump-decline input[type="text"] { flex: 1 1 12rem; min-width: 0; }

/* Bereitschaft */
.jump-readiness-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.jump-readiness-list li {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.6rem;
    padding: 0.25rem 0.45rem;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.04);
    font-size: 0.85rem;
}
.jump-readiness-console { flex: 1 1 8rem; }
.jump-readiness-list li[data-state="ready"] .jump-readiness-state { color: #00c853; }
.jump-readiness-list li[data-state="not_ready"] .jump-readiness-state { color: #ff5252; font-weight: bold; }
.jump-readiness-list li[data-state="waiting"] .jump-readiness-state { color: #f5a623; }
.jump-readiness-unmanned { color: rgba(255, 255, 255, 0.45); font-style: italic; }
.jump-readiness-reason { flex-basis: 100%; color: #ff8a80; font-size: 0.8rem; }

.jump-log summary { cursor: pointer; font-size: 0.8rem; opacity: 0.7; }
.jump-log ul { margin: 0.3rem 0 0; padding-left: 1rem; font-size: 0.8rem; opacity: 0.8; }

.jump-sequence-engineering { margin-bottom: 1rem; }
.ftl-block-reason { flex-basis: 100%; font-size: 0.85rem; opacity: 0.85; }

/* ── CC_196: Korridor-Scan (Navigation + Science) ─────────────────────────── */
.jump-science-panel.is-idle { display: none; }
.jump-science-panel { margin-bottom: 1rem; }
.jump-corridor { display: flex; flex-direction: column; gap: 0.25rem; }
.jump-corridor .jump-row { flex-wrap: wrap; }
.jump-corridor-progress { display: flex; align-items: center; gap: 0.6rem; margin: 0.4rem 0; }
.jump-corridor-bar {
    flex: 1 1 auto;
    height: 8px;
    background: rgba(0, 150, 220, 0.15);
    border: 1px solid rgba(0, 150, 220, 0.4);
    border-radius: 4px;
    overflow: hidden;
}
.jump-corridor-fill { height: 100%; background: #00c8ff; transition: width 0.8s linear; }

/* CC_199 — Transit im Sprungkorridor */
.jump-sequence-panel.phase-jumping { border-left-color: var(--accent-purple, #a78bfa); }

.jump-transit {
    border: 1px solid rgba(167, 139, 250, 0.6);
    background: rgba(167, 139, 250, 0.08);
    border-radius: 6px;
    padding: 0.6rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
.jump-transit.is-window { border-color: #00e5ff; background: rgba(0, 229, 255, 0.1); }
.jump-transit.is-unstable { border-color: #ff5252; }
.jump-transit.is-done { border-color: rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.03); }

.jump-transit-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.3rem 0.7rem; }
.jump-transit-title { font-weight: bold; letter-spacing: 0.08em; color: #c4b5fd; }
.jump-transit-clock { font-variant-numeric: tabular-nums; }
.jump-transit-window {
    color: #00e5ff;
    letter-spacing: 0.05em;
    animation: jump-alert-pulse 0.8s ease-in-out infinite alternate;
}

/* Balken: Fortschritt, Fenster (cyan), Austrittspunkt (Strich) */
.jump-transit-bar {
    position: relative;
    height: 0.7rem;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}
.jump-transit-bar-fill {
    position: absolute;
    inset: 0 auto 0 0;
    background: linear-gradient(90deg, rgba(167, 139, 250, 0.35), rgba(167, 139, 250, 0.8));
}
.jump-transit-bar-window {
    position: absolute;
    top: 0;
    bottom: 0;
    background: rgba(0, 229, 255, 0.35);
}
.jump-transit-bar-point {
    position: absolute;
    top: -2px;
    bottom: -2px;
    width: 2px;
    margin-left: -1px;
    background: #fff;
    z-index: 1;
}

.jump-transit-stability { font-variant-numeric: tabular-nums; }
.jump-transit-stability[data-tone="ok"] { color: #00c853; }
.jump-transit-stability[data-tone="warn"] { color: #f5a623; }
.jump-transit-stability[data-tone="danger"] { color: #ff5252; }

.jump-exit-btn { font-weight: bold; letter-spacing: 0.08em; font-size: 1rem; padding: 0.7rem 1.2rem; }

.jump-transit-incidents { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.jump-transit-incidents li {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.2rem 0.6rem;
    padding: 0.3rem 0.45rem;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.04);
    font-size: 0.85rem;
    border-left: 3px solid #f5a623;
}
.jump-transit-incidents li[data-state="resolved"] { border-left-color: #00c853; opacity: 0.75; }
.jump-transit-incidents li[data-state="failed"] { border-left-color: #ff5252; }
.jump-transit-incidents li[data-state="withdrawn"] { border-left-color: rgba(255, 255, 255, 0.25); opacity: 0.6; }
.jump-transit-incident-console { color: rgba(255, 255, 255, 0.6); min-width: 6rem; }
.jump-transit-incident-state { margin-left: auto; font-variant-numeric: tabular-nums; }
.jump-transit-incidents li[data-state="open"] .jump-transit-incident-state { color: #f5a623; }
.jump-transit-incidents li[data-state="failed"] .jump-transit-incident-state { color: #ff5252; font-weight: bold; }
.jump-transit-incident-effect { flex-basis: 100%; font-size: 0.78rem; opacity: 0.75; }
.jump-transit-incident-fix { flex-basis: 100%; display: flex; flex-direction: column; gap: 0.15rem; font-size: 0.8rem; }
.jump-transit-incident-fix a { color: #00e5ff; align-self: flex-start; }

.jump-transit-result { font-weight: bold; color: #00c853; }
.jump-transit-result.is-wild { color: #ff7a45; }

@media (prefers-reduced-motion: reduce) {
    .jump-transit-window { animation: none; }
}

/* FTL-Panel: Ankunft nur für den Systemwarp; der eingebettete Warp ohne zweiten Rahmen. */
.ftl-order-form .ftl-arrival { flex: 0 1 10rem; }
.jump-sequence-panel .warp-panel { margin: 0.5rem 0 0; border: 0; background: none; box-shadow: none; }
.jump-sequence-panel .warp-panel > .sos-panel__header { padding-left: 0; padding-right: 0; }
.jump-sequence-panel .warp-panel > .sos-panel__body { padding-left: 0; padding-right: 0; }

/* ── Galaxiekarte der Navigation: Suche, Filter, Liste, Karte (ftl-target-picker.js) ── */
.ftl-picker { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
.ftl-picker > * { flex-shrink: 0; }
.ftl-picker > .jump-label { align-self: flex-start; }
.ftl-filter-bar, .ftl-chip-bar, .ftl-map-tools { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.ftl-search {
    flex: 1 1 16rem; min-width: 0;
    background: rgba(255, 255, 255, 0.04); color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 4px;
    padding: 0.45rem 0.6rem; font: inherit;
}
.ftl-search:focus { outline: none; border-color: var(--accent-cyan, #22d3ee); }
.ftl-region, .ftl-sort {
    flex: 0 1 11rem; background: rgba(255, 255, 255, 0.04); color: inherit;
    border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 4px; padding: 0.4rem; font: inherit;
}
.ftl-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.ftl-chip {
    background: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 999px;
    padding: 0.2rem 0.65rem; font: inherit; font-size: 0.8rem; cursor: pointer;
}
.ftl-chip span { opacity: 0.6; margin-left: 0.2rem; }
.ftl-chip:hover { border-color: rgba(34, 211, 238, 0.6); }
.ftl-chip.is-on { background: rgba(34, 211, 238, 0.18); border-color: var(--accent-cyan, #22d3ee); color: #fff; }
.ftl-chip--svc.is-on { background: rgba(52, 211, 153, 0.18); border-color: var(--accent-green, #34d399); }
.ftl-reach { font-size: 0.8rem; opacity: 0.8; display: inline-flex; gap: 0.3rem; align-items: center; }

.ftl-panel-target { display: flex; flex-wrap: wrap; gap: 0.3rem 0.6rem; align-items: baseline; }
.ftl-results {
    display: flex; flex-direction: column; gap: 2px;
    min-height: 0; overflow-y: auto;
    border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; padding: 3px;
}
.ftl-row {
    display: grid; grid-template-columns: auto auto 1fr auto auto; gap: 0.55rem; align-items: center;
    padding: 0.35rem 0.5rem; border-radius: 4px; cursor: pointer;
    border: 1px solid transparent;
}
.ftl-row[hidden] { display: none; }
.ftl-row:hover { background: rgba(255, 255, 255, 0.05); }
.ftl-row.is-selected { background: rgba(34, 211, 238, 0.12); border-color: rgba(34, 211, 238, 0.6); }
.ftl-row.is-blocked { opacity: 0.5; cursor: not-allowed; }
.ftl-row input[type=radio] { accent-color: var(--accent-cyan, #22d3ee); margin: 0; }
.ftl-row-icon {
    width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center;
    font-size: 0.75rem; font-weight: bold; background: rgba(255, 255, 255, 0.08);
}
.ftl-row[data-kind=warp] .ftl-row-icon { background: rgba(34, 211, 238, 0.2); color: #a5f3fc; }
.ftl-row[data-kind=system] .ftl-row-icon { background: rgba(167, 139, 250, 0.22); color: #ddd6fe; }
.ftl-row[data-kind=remote] .ftl-row-icon { background: rgba(245, 158, 11, 0.18); color: #fde68a; }
.ftl-row-main { display: flex; flex-wrap: wrap; column-gap: 0.5rem; min-width: 0; }
.ftl-row-name { font-weight: 600; }
.ftl-row-type { opacity: 0.65; font-size: 0.85em; }
.ftl-row-detail { flex-basis: 100%; opacity: 0.55; font-size: 0.8em; }
.ftl-row-tags { display: flex; flex-wrap: wrap; gap: 0.2rem; justify-content: flex-end; }
.ftl-tag {
    font-size: 0.7rem; padding: 0.05rem 0.4rem; border-radius: 3px;
    background: rgba(52, 211, 153, 0.12); color: #a7f3d0;
}
.ftl-tag--sec { background: transparent; color: var(--sec, #a7f3d0); border: 1px solid var(--sec, #a7f3d0); }
.ftl-row-dist { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 0.9em; }
.ftl-row-block { display: block; color: #fca5a5; font-size: 0.75rem; }
.ftl-empty { opacity: 0.6; margin: 0.5rem; }
.ftl-selected { font-size: 0.95rem; }

.ftl-map-open {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.5rem; text-align: left;
    background: rgba(34, 211, 238, 0.08); color: inherit; font: inherit; font-weight: 600; cursor: pointer;
    border: 1px solid rgba(34, 211, 238, 0.45); border-radius: 6px; padding: 0.45rem 0.6rem;
}
.ftl-map-open:hover { background: rgba(34, 211, 238, 0.16); }
/* Fenster über der Seite: links Suche, Filter, Liste; rechts die Karte; unten Ziel + „Sprungziel setzen".
   Die Karte zeichnet in Bildschirmpixeln (drawMap setzt die viewBox). */
.ftl-map {
    /* dvh: auf dem Handy die sichtbare Höhe (mit Browserleisten), sonst rutscht die Fußleiste darunter. */
    width: min(97vw, 2200px); max-width: none; height: 94vh; height: 94dvh; max-height: none; box-sizing: border-box;
    margin: auto; inset: 0; flex-direction: column; gap: 0.5rem;
    background: #070d18; color: #e2e8f0;
    border: 1px solid rgba(34, 211, 238, 0.45); border-radius: 8px; padding: 0.6rem 0.8rem;
}
.ftl-map[open] { display: flex; }
.ftl-map::backdrop { background: rgba(0, 0, 0, 0.75); }
.ftl-map-head, .ftl-map-foot { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; flex: 0 0 auto; }
.ftl-map-head > strong { font-size: 1.05rem; }
.ftl-map-body { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(20rem, 27rem) minmax(0, 1fr); gap: 0.7rem; }
.ftl-map-side { display: flex; flex-direction: column; gap: 0.45rem; min-height: 0; }
.ftl-map-side .ftl-results { flex: 1 1 auto; }
.ftl-map-main { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
.ftl-map-zoom { font-size: 0.8rem; min-width: 5.5rem; text-align: center; font-variant-numeric: tabular-nums; opacity: 0.85; }
.ftl-map-foot { border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 0.5rem;
    padding-bottom: env(safe-area-inset-bottom, 0px); }
.ftl-map-picked { min-width: 0; overflow-wrap: anywhere; }
.ftl-map-picked { font-size: 1rem; font-weight: 600; color: var(--accent-cyan, #22d3ee); }
.ftl-map-foot [data-ftl-submit]:disabled { opacity: 0.45; cursor: not-allowed; }
.ftl-map-foot select.ftl-arrival { width: auto; min-width: 14rem; }
.ftl-submit { font-size: 1rem; padding: 0.5rem 1.4rem; }
.ftl-map-side .ftl-filter-bar { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.ftl-map-side .ftl-search { grid-column: 1 / -1; }
.ftl-map-side .ftl-region, .ftl-map-side .ftl-sort { min-width: 0; font-size: 0.85rem; padding: 0.3rem; }
.ftl-map-sub { opacity: 0.55; font-weight: normal; font-size: 0.8em; }
.ftl-map-tools { margin: 0.4rem 0; }
.ftl-map-spacer { flex: 1; }
.ftl-map-svg { display: block; flex: 1 1 auto; min-height: 0; width: 100%; touch-action: none; cursor: grab;
    border-radius: 6px; user-select: none; }
.ftl-map-svg:active { cursor: grabbing; }
.ftl-map-legend { margin: 0.2rem 0 0; font-size: 0.75rem; opacity: 0.55; }
.ftl-map-bg { fill: #050a14; }
.ftl-map-range { fill: rgba(34, 211, 238, 0.04); stroke: rgba(34, 211, 238, 0.45); stroke-dasharray: 6 5; }
.ftl-map-lane { stroke: rgba(255, 255, 255, 0.12); stroke-width: 1; }
.ftl-map-lane.is-selected { stroke: var(--accent-cyan, #22d3ee); stroke-width: 2; stroke-dasharray: 5 4; }
.ftl-map-sec { fill: none; stroke-width: 2; opacity: 0.9; }
.ftl-map-belt { fill: none; stroke: rgba(168, 162, 158, 0.28); stroke-dasharray: 2 3; }
.ftl-map-zone { fill: rgba(148, 163, 184, 0.06); stroke-width: 1; stroke-dasharray: 3 4; opacity: 0.7; }
.ftl-map-node { cursor: pointer; }
.ftl-map-node.is-far { cursor: default; opacity: 0.45; }
.ftl-map-node.is-dim { opacity: 0.18; }
.ftl-map-hit { fill: transparent; }
.ftl-map-node:hover .ftl-map-dot { stroke: #fff; stroke-width: 1.5; }
.ftl-map-here { fill: none; stroke: #fff; stroke-width: 1.5; }
.ftl-map-sel { fill: none; stroke: var(--accent-cyan, #22d3ee); stroke-width: 2; }
.ftl-map-label { fill: #e2e8f0; font-size: 14px; }
.ftl-map-svg .ftl-map-sub { fill: #94a3b8; font-size: 11px; opacity: 1; }
.ftl-map-range, .ftl-map-lane, .ftl-map-zone, .ftl-map-belt, .ftl-map-sec, .ftl-map-ship, .ftl-map-scale { pointer-events: none; }
.ftl-map-node text { user-select: none; }
.ftl-map-ship { fill: #fbbf24; }
.ftl-map-scale { stroke: #94a3b8; stroke-width: 1.5; }
/* Mehrere Objekte auf einem Fleck: Ring um die Gruppe, Schilder daneben mit Führungslinie zur Lage. */
.ftl-map-cluster { fill: rgba(226, 232, 240, 0.04); stroke: rgba(226, 232, 240, 0.45); stroke-dasharray: 3 3; pointer-events: none; }
.ftl-map-leader { stroke: rgba(226, 232, 240, 0.5); stroke-width: 1; pointer-events: none; }
.ftl-map-ship .ftl-map-label { fill: #fbbf24; }
.ftl-map-ship .ftl-map-leader { stroke: rgba(251, 191, 36, 0.6); }

/* Unter 1100 px: Karte oben, Suche und Liste darunter. */
@media (max-width: 1099px) {
    .ftl-map-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(10rem, 1.3fr) minmax(8rem, 1fr); }
    .ftl-map-main { grid-row: 1; }
    .ftl-map-side { grid-row: 2; overflow-y: auto; }
    /* Hier rollt die ganze Spalte (Filter + Liste), sonst bleibt der Liste unter den Filtern kein Platz. */
    .ftl-map-side .ftl-results { flex: 0 0 auto; overflow: visible; }
}
@media (max-width: 759px) {
    .ftl-map { width: 100vw; height: 100dvh; border-radius: 0; padding: 0.5rem; }
    .ftl-map-legend { display: none; }
}
/* Schmale Liste (Handy, schmale Seitenleiste der Galaxiekarte): Dienste und Sicherheit unter den Namen,
   nie den Namen zusammenquetschen. */
.ftl-map-side { container-type: inline-size; container-name: ftl; }
@container ftl (max-width: 34rem) {
    .ftl-row { grid-template-columns: auto auto minmax(0, 1fr) auto; }
    .ftl-row-tags { grid-column: 3 / -1; grid-row: 2; justify-content: flex-start; }
    .ftl-row-name { overflow-wrap: anywhere; }
}
@container ftl (max-width: 20rem) {
    .ftl-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.4rem; }
    .ftl-row-icon { display: none; }
    .ftl-row-tags { grid-column: 1 / -1; }
}

