/* ============================================================
   Sektoren-Liste „Wo finde ich was"
   ============================================================ */
.sek-main { padding: 2rem 1.25rem 5rem; }
.sek-toolbar { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-bottom:1rem; }
.sek-toolbar .input { flex:1; min-width:200px; }
.sek-chips { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.4rem; }
.sek-chip { font-size:.74rem; padding:.4rem .8rem; border:1px solid var(--line); border-radius:99px; background:var(--bg); color:var(--muted); cursor:pointer; font-family:inherit; transition:all .15s; }
.sek-chip:hover { color:var(--text); }
.sek-chip.active { border-color:var(--red); color:#fff; background:linear-gradient(135deg,var(--red),var(--red-deep,#b21d18)); }

.sek-grid { display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:720px){ .sek-grid { grid-template-columns:1fr 1fr; } }
@media (min-width:1100px){ .sek-grid { grid-template-columns:1fr 1fr 1fr; } }

.sek-card { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:1.2rem 1.3rem; display:flex; flex-direction:column; gap:.7rem; }
.sek-card .top { display:flex; align-items:flex-start; justify-content:space-between; gap:.6rem; }
.sek-card h3 { font-size:1.05rem; font-weight:800; line-height:1.2; }
.sek-card .sys { font-size:.72rem; color:var(--muted); letter-spacing:.04em; }
.sek-tier { flex:none; font-size:.62rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:.25rem .55rem; border-radius:99px; border:1px solid; white-space:nowrap; }
.sek-tier[data-t="Frühgame"] { color:#6ee7a0; border-color:#1f5132; background:#0e1f14; }
.sek-tier[data-t="Midgame"]  { color:#f5c542; border-color:#6e5420; background:#241d10; }
.sek-tier[data-t="Endgame"]  { color:#ff8d92; border-color:#6e2730; background:#241214; }

.sek-sec { font-size:.66rem; letter-spacing:.12em; text-transform:uppercase; color:var(--red); margin-bottom:.3rem; }
.sek-tags { display:flex; flex-wrap:wrap; gap:.35rem; }
.sek-tag { font-size:.76rem; padding:.28rem .6rem; border-radius:7px; background:var(--bg); border:1px solid var(--line); }
.sek-tag.svc { border-left:2px solid var(--red); }
.sek-notes { font-size:.82rem; color:var(--muted); line-height:1.5; }
.sek-empty { grid-column:1/-1; text-align:center; color:var(--muted); padding:2rem; border:1px dashed var(--line); border-radius:12px; }

/* ── Ansicht-Umschalter Liste/Karte ── */
.sek-view { display:flex; gap:2px; background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:2px; }
.sek-vbtn { font-family:inherit; font-size:.76rem; padding:.4rem .9rem; border:0; border-radius:6px; background:transparent; color:var(--muted); cursor:pointer; }
.sek-vbtn.active { background:linear-gradient(135deg,var(--red),var(--red-deep,#b21d18)); color:#fff; }

/* ── Galaxie-Karte ── */
.sek-mapwrap { display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:880px){ .sek-mapwrap { grid-template-columns:1fr 300px; } }
.sek-map-stage { position:relative; border:1px solid var(--line); border-radius:14px; overflow:hidden;
  background:radial-gradient(120% 100% at 50% 0%, #0e2236, #081320 75%); min-height:420px; }
.sek-map-stage::before { content:""; position:absolute; inset:0; pointer-events:none;
  background-image:radial-gradient(rgba(130,190,230,.10) 1px, transparent 1.4px); background-size:30px 30px; }
#sek-svg { display:block; width:100%; height:100%; min-height:420px; }

.sek-edges line { stroke:#2c5066; stroke-width:.45; stroke-linecap:round; opacity:.7; }
.sek-node { cursor:pointer; }
.sek-node circle { stroke:#08131f; stroke-width:.5; transition:r .12s, filter .12s; }
.sek-node circle[data-t="Frühgame"] { fill:#3ad17a; }
.sek-node circle[data-t="Midgame"]  { fill:#f5c542; }
.sek-node circle[data-t="Endgame"]  { fill:#ff5a60; }
.sek-node text { fill:#cfe0ea; font-size:2.3px; font-weight:700; paint-order:stroke; stroke:#06121e; stroke-width:.7px; pointer-events:none; }
.sek-node:hover circle, .sek-node:focus circle { r:3; filter:drop-shadow(0 0 3px currentColor); outline:none; }
.sek-node.sel circle { r:3.2; stroke:#fff; stroke-width:.7; }
.sek-node.dim { opacity:.18; }

.sek-detail { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:1.1rem 1.2rem; align-self:start; }
.sek-detail .sek-detail-empty { color:var(--muted); font-size:.86rem; line-height:1.5; }
.sek-detail h3 { font-size:1.1rem; font-weight:800; margin-bottom:.15rem; }
.sek-detail .sys { font-size:.72rem; color:var(--muted); margin-bottom:.7rem; }
.sek-legend { display:flex; gap:1rem; flex-wrap:wrap; margin-top:.9rem; font-size:.72rem; color:var(--muted); }
.sek-legend span { display:inline-flex; align-items:center; gap:.35rem; }
.sek-legend i { width:10px; height:10px; border-radius:99px; display:inline-block; }

/* ── Echte Karte (SpaceCraft.tools-Einbettung) ── */
.sek-embed { display:flex; flex-direction:column; gap:.9rem; }
.sek-embed-head { display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; justify-content:space-between;
  background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:.9rem 1.1rem; }
.sek-embed-head strong { display:block; font-size:1rem; }
.sek-embed-head span { display:block; font-size:.82rem; color:var(--muted); margin-top:.15rem; }
.sek-embed-stage { position:relative; min-height:540px; border:1px solid var(--line); border-radius:14px; overflow:hidden;
  background:#0a1622 center/cover no-repeat; background-image:linear-gradient(rgba(8,18,32,.45),rgba(8,18,32,.55)), url('https://spacecraft.tools/scdb-map-og.webp'); }
.sek-embed-stage iframe { display:block; width:100%; height:540px; border:0; background:#0a1622; }
.sek-embed-preview { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem;
  background:transparent; border:0; cursor:pointer; color:#fff; font-family:inherit; }
.sek-embed-preview .play { font-size:1.05rem; font-weight:800; padding:.7rem 1.4rem; border-radius:99px;
  background:linear-gradient(135deg,var(--red),var(--red-deep,#b21d18)); box-shadow:0 8px 30px rgba(226,40,40,.4); }
.sek-embed-preview .sub { font-size:.78rem; color:#cfe0ea; text-shadow:0 1px 3px #000; }
.sek-embed-preview:hover .play { filter:brightness(1.08); }
.sek-galaxies { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.sek-galaxies .lbl { font-size:.78rem; color:var(--muted); margin-right:.2rem; }
.sek-galaxies a { font-size:.78rem; padding:.4rem .8rem; border:1px solid var(--line); border-radius:99px; color:var(--text); text-decoration:none; }
.sek-galaxies a:hover { border-color:var(--red); color:#fff; }
.sek-embed-note { font-size:.78rem; color:var(--muted); line-height:1.5; }

/* ── Eigene Galaxie-Sternenkarte ── */
.sek-galaxy { display:grid; grid-template-columns:1fr; grid-template-areas:"bar" "stage" "detail"; gap:1rem; }
@media (min-width:880px){ .sek-galaxy { grid-template-columns:1fr 300px; grid-template-areas:"bar bar" "stage detail"; } }
.sek-gbar { grid-area:bar; display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; }
.sek-gctrl { display:flex; gap:.3rem; }
.sek-gctrl button { width:34px; height:34px; border:1px solid var(--line); background:var(--surface); color:var(--text);
  border-radius:8px; font-size:1.1rem; cursor:pointer; line-height:1; }
.sek-gctrl button:hover { border-color:var(--red); color:#fff; }
.sek-ghint { font-size:.74rem; color:var(--muted); flex:1; min-width:160px; }
.sek-glegend { display:flex; gap:.9rem; font-size:.72rem; color:var(--muted); }
.sek-glegend span { display:inline-flex; align-items:center; gap:.35rem; }
.sek-glegend i { width:10px; height:10px; border-radius:99px; display:inline-block; box-shadow:0 0 6px currentColor; }

.sek-gstage { grid-area:stage; position:relative; border:1px solid #143049; border-radius:14px; overflow:hidden;
  width:100%; aspect-ratio:114 / 80; min-height:340px; max-height:660px; cursor:grab; background:#050d18; box-shadow:inset 0 0 80px rgba(0,0,0,.6); }
.sek-gstage:active { cursor:grabbing; }
#sek-gsvg { display:block; width:100%; height:100%; touch-action:none; }

.sek-stars circle { fill:#cfe6ff; }
.sek-lanes line { stroke:#5aa8d8; stroke-width:.32; opacity:.5; stroke-linecap:round; stroke-dasharray:1.4 2.2; animation:laneflow 1.4s linear infinite; }
@keyframes laneflow { to { stroke-dashoffset:-7.2; } }

.sek-sys { cursor:pointer; }
.sek-sys .halo { pointer-events:none; transition:opacity .15s; opacity:.55; }
.sek-sys .hit  { fill:transparent; }
.sek-sys .core { stroke:#eaf6ff; stroke-width:.4; transition:r .12s; }
.sek-sys .core[data-t="Frühgame"] { fill:#7ef0a8; }
.sek-sys .core[data-t="Midgame"]  { fill:#ffd874; }
.sek-sys .core[data-t="Endgame"]  { fill:#ff878c; }
.sek-sys .lbl { fill:#dceaf5; font-size:2.2px; font-weight:700; paint-order:stroke; stroke:#040a12; stroke-width:.7px; pointer-events:none; }
.sek-sys:hover .halo, .sek-sys:focus .halo { opacity:.95; }
.sek-sys:hover .core, .sek-sys:focus .core { r:2; outline:none; }
.sek-sys.sel .core { r:2.2; stroke:#fff; stroke-width:.6; }
.sek-sys.sel .halo { opacity:1; }
.sek-sys.dim { opacity:.16; }

/* ── SpaceCraft.tools-Stil: HUD + Sektor-Overlays ── */
.sek-galaxy { grid-template-areas:"hud" "stage" "detail"; }
@media (min-width:880px){ .sek-galaxy { grid-template-areas:"hud hud" "stage detail"; } }

.sek-hud { grid-area:hud; display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1.1rem;
  font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Courier New",monospace;
  background:linear-gradient(180deg,#0a1826,#08131f); border:1px solid #163450; border-radius:12px; padding:.7rem 1rem; }
.sek-hud-title { font-weight:800; letter-spacing:.14em; color:#5fe0d4; text-shadow:0 0 12px rgba(95,224,212,.45); font-size:.84rem; }
.sek-hud-title span { color:#5f7e92; font-weight:600; }
.sek-hud-counts { font-size:.72rem; letter-spacing:.1em; color:#7fa6ba; }
.sek-hud-counts b { color:#cfe6ff; font-weight:800; }
.sek-hud-toggles { display:flex; gap:.35rem; flex-wrap:wrap; }
.sek-hud-toggles button { font-family:inherit; font-size:.7rem; letter-spacing:.05em; padding:.35rem .6rem; border-radius:6px;
  background:#0c1f30; color:#6f93a8; border:1px solid #1a3650; cursor:pointer; transition:all .12s; }
.sek-hud-toggles button:hover { color:#cfe6ff; border-color:#2a5570; }
.sek-hud-toggles button.on { color:#06151f; background:linear-gradient(135deg,#5fe0d4,#2f9f96); border-color:transparent; font-weight:700; }
.sek-hud-res { display:flex; align-items:center; gap:.4rem; margin-left:auto; }
.sek-hud-res label { font-size:.66rem; letter-spacing:.12em; color:#5f7e92; }
.sek-hud-res select { font-family:inherit; font-size:.74rem; background:#0c1f30; color:#cfe6ff; border:1px solid #1a3650; border-radius:6px; padding:.32rem .5rem; cursor:pointer; }

/* Sektor-Overlays (farbige Zonen) */
#sek-sectors path { stroke-width:.45; stroke-dasharray:1.4 1.5; fill-opacity:.07; stroke-opacity:.45; }
#sek-sectors path[data-t="Frühgame"] { fill:#3ad17a; stroke:#3ad17a; }
#sek-sectors path[data-t="Midgame"]  { fill:#f5c542; stroke:#f5c542; }
#sek-sectors path[data-t="Endgame"]  { fill:#ff5a60; stroke:#ff5a60; }
#sek-sectors text { font-size:2.5px; font-weight:800; letter-spacing:.14em; opacity:.55; paint-order:stroke; stroke:#040a12; stroke-width:.6px; }
#sek-sectors text[data-t="Frühgame"] { fill:#7ef0a8; }
#sek-sectors text[data-t="Midgame"]  { fill:#ffd874; }
#sek-sectors text[data-t="Endgame"]  { fill:#ff878c; }

/* Layer-Umschalter */
#sek-gsvg.hide-sectors #sek-sectors { display:none; }
#sek-gsvg.hide-lanes .sek-lanes { display:none; }
#sek-gsvg.hide-systems .sek-systems { display:none; }
#sek-gsvg.hide-labels .sek-sys .lbl { display:none; }

/* Zoom-Overlay + Hinweis */
.sek-zoom { position:absolute; right:.6rem; bottom:.6rem; display:flex; flex-direction:column; gap:.3rem; z-index:3; }
.sek-zoom button { width:32px; height:32px; background:rgba(10,26,40,.85); color:#cfe6ff;
  border:1px solid #1d4660; border-radius:7px; font-size:1.05rem; cursor:pointer; line-height:1; }
.sek-zoom button:hover { border-color:#5fe0d4; color:#fff; }
.sek-ghint { position:absolute; left:.7rem; bottom:.6rem; z-index:3; font-family:ui-monospace,Consolas,monospace;
  font-size:.66rem; color:#6f93a8; background:rgba(8,19,31,.6); padding:.22rem .5rem; border-radius:6px; }

/* Ressourcen-Hervorhebung */
.sek-sys.res-dim { opacity:.4; }
#sek-gsvg.filtering .sek-lanes { opacity:.25; }
#sek-gsvg.filtering #sek-sectors { opacity:.4; }
.sek-sys.res-hit .core { stroke:#fff; stroke-width:.7; r:1.9; }
.sek-sys.res-hit .halo, .sek-sys.sel .halo { opacity:1; animation:halopulse 1.5s ease-in-out infinite; }
@keyframes halopulse { 0%,100% { r:4.6; opacity:.7; } 50% { r:5.8; opacity:1; } }
