/* =====================================================================
   ATLAS · Skin Studio — werkzeuge.css
   Bereich „Werkzeuge“ (Kreis-Generator, Nether-Rechner …). Baut auf info.css
   und spieler.css auf: gleiche Farben, Karten, Knöpfe und Kopfzeile.
   ===================================================================== */
.werkzeug{padding:28px 20px 56px}
/* Ausgeblendete Teile bleiben aus, auch wenn eine Regel unten display setzt */
.werkzeug [hidden]{display:none!important}
.wz-brot{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.wz-brot a{color:var(--green-text);text-decoration:none}
.wz-brot a:hover{text-decoration:underline}
.wz-brot span{color:var(--mute)}

/* Werkzeug-Karte: links die Einstellungen, rechts das Ergebnis */
.wz-app{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:22px;padding:20px;margin-bottom:22px;align-items:start}
.wz-steuer{display:grid;gap:14px}
.wz-feld{display:grid;gap:6px;min-width:0}
.wz-label,.wz-feld>label,.wz-feld>span{font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.wz-feld input[type=number],.wz-feld input[type=text],.wz-feld select{width:100%;height:42px;padding:0 12px;border-radius:10px;
  border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;font-size:16px}
.wz-feld input:focus,.wz-feld select:focus,.wz-seg button:focus-visible,.wz-klein:focus-visible{outline:2px solid var(--green-text);outline-offset:1px}
.wz-reihe{display:flex;gap:8px;align-items:center}
.wz-reihe>*{flex:1;min-width:0}
.wz-check{display:flex;align-items:center;gap:9px;font-size:15px;color:var(--dim);cursor:pointer}
.wz-check input{width:18px;height:18px;accent-color:var(--green)}
.wz-feld>label.wz-check{font-size:15px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--dim)}
.wz-seg{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--hi);border:1px solid var(--line)}
.wz-seg button{flex:1;min-width:0;height:36px;padding:0 8px;border:0;border-radius:9px;background:none;color:var(--dim);
  font:600 14px/1 inherit;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wz-seg button:hover{color:var(--text)}
.wz-seg button[aria-checked="true"]{background:var(--green);color:#fff;box-shadow:inset 0 -2px 0 var(--green-edge)}
.wz-ebene{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
.wz-ebene input[type=range]{width:100%;accent-color:var(--green)}
.wz-ebene output{grid-column:1/-1;font-size:14px;color:var(--dim)}
.wz-klein{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:34px;padding:0 11px;border-radius:9px;
  border:1px solid var(--line);background:var(--hi);color:var(--text);font:600 13.5px/1 inherit;cursor:pointer;text-decoration:none}
.wz-klein:hover{background:var(--line)}
.wz-klein[disabled]{opacity:.45;cursor:default}
.wz-klein svg{width:16px;height:16px}

/* Ergebnis */
.wz-ausgabe{display:grid;gap:12px;min-width:0}
.wz-zahlen{display:flex;flex-wrap:wrap;gap:8px}
.wz-zahl{padding:8px 12px;border-radius:10px;background:var(--hi);border:1px solid var(--line);min-width:0}
.wz-zahl b{display:block;font-size:19px;line-height:1.2;color:var(--text)}
.wz-zahl span{font-size:12.5px;color:var(--mute)}
.wz-leinwand{position:relative;overflow:auto;max-height:min(72vh,760px);border-radius:12px;border:1px solid var(--line);
  background:var(--bg);overscroll-behavior:contain}
.wz-leinwand canvas{display:block;image-rendering:pixelated;touch-action:none;cursor:crosshair}
.wz-info{min-height:22px;font-size:14px;color:var(--dim);font-variant-numeric:tabular-nums}
.wz-knoepfe{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.wz-knoepfe .trenner{flex:1}

/* Nether-Rechner */
.wz-nether{grid-template-columns:1fr}
.wz-welten{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}
.wz-welt{padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--hi)}
.wz-welt h3{display:flex;align-items:center;gap:8px;font-size:15px;margin-bottom:10px}
.wz-welt h3 i{width:14px;height:14px;border-radius:4px;flex:none}
.wz-welt.ober h3 i{background:#5e9e38}
.wz-welt.nether h3 i{background:#a2382c}
.wz-xyz{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.wz-xyz label{display:grid;gap:4px;font-size:12.5px;font-weight:700;color:var(--mute)}
.wz-xyz input{width:100%;height:42px;padding:0 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--text);
  font:inherit;font-size:16px;font-variant-numeric:tabular-nums}
.wz-pfeil{font:400 26px/1 'Atlas Pixel',monospace;color:var(--green-text);text-align:center}
.wz-ergebnis{padding:14px 16px;border-radius:12px;background:rgba(127,211,92,.1);border:1px solid rgba(127,211,92,.35);color:var(--text)}
.wz-ergebnis p{color:var(--text)}
.wz-ergebnis p.hinweis{color:var(--mute);margin-top:8px}
.wz-ergebnis code,.wz-cmd code{font:500 13.5px/1.5 ui-monospace,Consolas,monospace;color:var(--dim);overflow-wrap:anywhere}
.wz-warnung{padding:10px 14px;border-radius:10px;background:rgba(241,185,63,.12);border:1px solid rgba(241,185,63,.35);color:var(--text);font-size:14.5px}
.wz-warnung[hidden],.wz-ergebnis[hidden]{display:none}
.wz-cmd{display:flex;align-items:flex-start;gap:8px;margin-top:8px}
.wz-cmd code{min-width:0}

.wz-portale{display:grid;gap:12px}
.wz-portal{display:grid;grid-template-columns:minmax(120px,1.3fr) minmax(130px,1fr) repeat(3,minmax(70px,.7fr)) auto;gap:8px;align-items:end;
  padding:12px;border-radius:12px;background:var(--hi);border:1px solid var(--line)}
.wz-portal label{display:grid;gap:4px;font-size:12px;font-weight:700;color:var(--mute);min-width:0}
.wz-portal input,.wz-portal select{width:100%;height:38px;padding:0 9px;border-radius:9px;border:1px solid var(--line);background:var(--card);
  color:var(--text);font:inherit;font-size:15px;min-width:0}
.wz-portal .ziel{grid-column:1/-1;font-size:14px;color:var(--dim)}
.wz-portal .ziel b{color:var(--text)}
.wz-portal .ziel .ok{color:var(--green-text);font-weight:700}
.wz-portal .ziel .neu{color:var(--gold);font-weight:700}
.wz-portal .ziel .falsch{color:#ff8a93;font-weight:700}
.wz-portal.ober{box-shadow:inset 4px 0 0 #5e9e38}
.wz-portal.nether{box-shadow:inset 4px 0 0 #a2382c}

/* Verzauberungs-Reihenfolge */
.wz-ergebnis:empty{display:none}
.vz-liste{display:grid;gap:4px;max-height:min(60vh,540px);overflow:auto;padding-right:4px;margin-top:4px}
.vz-zeile{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:center;padding:7px 10px;border-radius:10px;
  background:var(--hi);border:1px solid transparent}
.vz-zeile.an{border-color:rgba(127,211,92,.45)}
.vz-zeile.aus{opacity:.55}
.vz-zeile input[type=checkbox]{width:18px;height:18px;accent-color:var(--green)}
.vz-zeile label{font-size:15px;color:var(--text);cursor:pointer;min-width:0}
.vz-zeile select{height:32px;padding:0 6px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--text);font:inherit;font-size:14px}
.vz-max{font-size:14px;color:var(--mute);padding:0 8px}
.vz-konflikt{grid-column:2/-1;font-size:12.5px;color:var(--gold)}
.vz-konflikt:empty{display:none}
.vz-gruppe{font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);margin:10px 0 2px}
.vz-schritte{list-style:none;display:grid;gap:8px}
.vz-schritte:empty{display:none}
.vz-schritte li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;
  background:var(--hi);border:1px solid var(--line)}
.vz-nr{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--green);color:#fff;
  font:400 18px/1 'Atlas Pixel',monospace;box-shadow:inset 0 -3px 0 var(--green-edge);-webkit-font-smoothing:none}
.vz-schritt{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
.vz-teil{padding:4px 9px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-size:14px;color:var(--text);line-height:1.4}
.vz-teil.item{border-color:rgba(44,199,186,.55)}
.vz-teil.buch{border-color:rgba(168,85,247,.5)}
.vz-teil small{color:var(--mute)}
.vz-plus{color:var(--mute);font-weight:700}
.vz-kosten{display:grid;justify-items:end;text-align:right}
.vz-kosten b{font-size:17px;color:var(--green-text);white-space:nowrap}
.vz-kosten.hoch b{color:var(--gold)}
.vz-kosten small{font-size:11.5px;color:var(--mute)}

/* Befehls-Generator */
.bf-app{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.bf-modus{grid-column:1/-1;flex-wrap:wrap}
.bf-modus button{flex:1 1 auto}
.bf-formular{min-width:0}
.bf-rechts{position:sticky;top:76px;align-self:start}
.bf-text{width:100%;min-height:42px;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:var(--hi);color:var(--text);
  font:inherit;font-size:16px;resize:vertical}
.bf-textfeld{display:grid;gap:6px}
.bf-textopt{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bf-farbwahl{display:inline-flex;align-items:center;gap:6px}
.wz-feld .bf-farbwahl select{height:34px;width:auto;font-size:14px;padding:0 8px}
.bf-punkt{width:14px;height:14px;border-radius:4px;border:1px solid var(--line);flex:none}
.bf-punkt.leer{background:repeating-linear-gradient(45deg,var(--line) 0 3px,transparent 3px 6px)}
.bf-hex{width:44px;height:34px;padding:0 2px;border:1px solid var(--line);border-radius:8px;background:var(--hi);cursor:pointer}
.bf-stile{display:inline-flex;gap:4px}
.bf-stil{width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:var(--hi);color:var(--dim);font:700 14px/1 inherit;cursor:pointer}
.bf-stil[aria-pressed="true"]{background:var(--green);color:#fff;border-color:var(--green-edge)}
.bf-stil.s-italic{font-style:italic}
.bf-stil.s-underlined{text-decoration:underline}
.bf-stil.s-strikethrough{text-decoration:line-through}
.bf-liste{display:grid;gap:8px}
.wz-feld>.wz-klein{justify-self:start}
.bf-liste:empty{display:none}
.bf-zeile{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:start}
.bf-ench{grid-template-columns:1fr 92px auto}
.bf-combo{position:relative}
.bf-suche{width:100%;height:42px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;font-size:16px}
.bf-suche:focus{outline:2px solid var(--green-text);outline-offset:1px}
.bf-treffer{position:absolute;z-index:6;left:0;right:0;top:46px;max-height:300px;overflow:auto;list-style:none;padding:6px;border-radius:12px;
  background:var(--bg);border:1px solid var(--line);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.bf-treffer li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:7px 10px;border-radius:8px;cursor:pointer}
.bf-treffer li.aktiv,.bf-treffer li:hover{background:var(--card)}
.bf-treffer b{font-weight:600;color:var(--text)}
.bf-treffer small{color:var(--mute);font:12px ui-monospace,Consolas,monospace;overflow-wrap:anywhere;text-align:right}
.bf-ausgabe{display:grid;gap:10px}
.bf-befehl{display:grid;gap:8px;padding:12px;border-radius:12px;background:var(--bg);border:1px solid var(--line)}
.bf-befehl code{display:block;font:500 13.5px/1.55 ui-monospace,Consolas,monospace;color:var(--text);overflow-wrap:anywhere;white-space:pre-wrap;
  max-height:340px;overflow:auto}
.bf-info{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;font-size:13px}
.bf-info .ok{color:var(--green-text)}
.bf-info .lang{color:var(--gold)}
.bf-kopieren{height:38px;font-size:14px;cursor:pointer}
.bf-flags{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px}
.bf-regler{display:grid;grid-template-columns:auto 1fr 52px;gap:8px;align-items:center;font-size:13px;color:var(--mute)}
.bf-regler input[type=range]{width:100%;accent-color:var(--green)}
.bf-regler output{font-size:13px;color:var(--dim);text-align:right;font-variant-numeric:tabular-nums}
.bf-teilpose{display:grid;gap:4px;padding:8px 10px;border-radius:10px;background:var(--hi);margin-top:8px}
.bf-teilpose b{font-size:13.5px}
.bf-mehr summary{cursor:pointer;font-weight:600;color:var(--dim);padding:6px 0}
.bf-ausruestung{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.bf-schildzeilen{display:grid;gap:6px}
.bf-schildzeilen input{text-align:center}
.bf-segment{display:grid;gap:8px;padding:10px;border-radius:12px;background:var(--hi);border:1px solid var(--line)}
.bf-weg{justify-self:end}

/* Übersicht aller Werkzeuge */
.wz-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:26px}
a.wz-karte{display:grid;grid-template-columns:52px 1fr;gap:4px 14px;align-items:start;padding:18px;border-radius:16px;background:var(--card);
  border:1px solid var(--line);box-shadow:inset 0 1px 0 var(--hi);text-decoration:none;color:var(--text);transition:transform .15s,border-color .15s}
a.wz-karte:hover{transform:translateY(-2px);border-color:rgba(127,211,92,.5)}
.wz-karte .ikon{grid-row:span 2;width:52px;height:52px;border-radius:12px;display:grid;place-items:center;background:var(--hi);
  border:1px solid var(--line)}
.wz-karte .ikon svg{width:32px;height:32px}
.wz-karte b{font-size:17px;line-height:1.3}
.wz-karte span{font-size:14.5px;color:var(--dim);line-height:1.5}

/* Erklärtext und Fragen unter dem Werkzeug */
.wz-artikel{max-width:780px;margin:8px 0 26px}
.wz-artikel h2{margin:26px 0 10px}
.wz-artikel h3{margin:18px 0 6px}
.wz-artikel p+p{margin-top:10px}
.wz-artikel ul,.wz-artikel ol{margin:10px 0 0 22px;color:var(--dim)}
.wz-artikel li+li{margin-top:6px}
.wz-faq{max-width:780px;margin-bottom:26px}
.wz-faq h2{margin-bottom:12px}

@media (max-width:820px){
  .wz-app,.bf-app{grid-template-columns:1fr}
  .bf-rechts{position:static}
  .wz-welten{grid-template-columns:1fr}
  .wz-pfeil{font-size:20px}
  .wz-portal{grid-template-columns:1fr 1fr 1fr}
  .wz-portal label.name,.wz-portal label.welt{grid-column:span 3}
}
@media (max-width:560px){
  .vz-schritte li{grid-template-columns:auto 1fr}
  .vz-kosten{grid-column:2;justify-items:start;text-align:left}
}
@media (max-width:420px){
  .werkzeug{padding:20px 14px 44px}
  .wz-app{padding:14px}
}

/* Seed-Karte: eine Ansicht so hoch wie das Fenster – links die Leiste mit Reitern (scrollt in sich),
   rechts die Karte, die immer sichtbar bleibt */
.werkzeug:has(.sk-app) .kopfbereich{padding:8px 0 12px}
.werkzeug:has(.sk-app) .kopfbereich h1{font-size:clamp(26px,3.2vw,36px);margin:4px 0 6px}
.werkzeug:has(.sk-app) .kopfbereich .lead{margin-bottom:0;font-size:16px;max-width:900px}
.sk-app{display:grid;grid-template-columns:340px minmax(0,1fr);gap:0;padding:0;margin-bottom:10px;align-items:stretch;
  height:clamp(380px,calc(100vh - 190px),980px);height:clamp(380px,calc(100dvh - 190px),980px)}
@media (min-width:861px) and (max-height:800px){
  /* niedrige Fenster (Laptops): Kopf kürzer, damit Karte und Leiste ganz ins Bild passen */
  .werkzeug:has(.sk-app){padding-top:14px}
  .werkzeug:has(.sk-app) .kopfbereich{padding:2px 0 10px}
  .werkzeug:has(.sk-app) .kopfbereich h1{font-size:28px;margin:2px 0 0}
  .werkzeug:has(.sk-app) .kopfbereich .lead{display:none}
}
/* Breite Ansicht wie im Editor: Kopfleiste, Titel und Karte nutzen die Fensterbreite (bis 2000 px).
   Artikel, Fragen und die anderen Werkzeuge darunter bleiben in der gewohnten Spalte (1020 px, mittig). */
body:has(.sk-app) .bar-in,.wrap.werkzeug:has(.sk-app){max-width:2000px}
.werkzeug:has(.sk-app)>:is(h2.klein,.wz-raster){max-width:1020px;margin-left:auto;margin-right:auto}
.werkzeug:has(.sk-app)>:is(.wz-artikel,.wz-faq){margin-left:max(0px,calc(50% - 510px))}
.sk-leiste{display:flex;flex-direction:column;min-height:0;min-width:0;border-right:1px solid var(--line)}
.sk-reiter{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:10px 8px 0;border-bottom:1px solid var(--line);flex:none}
.sk-reiter button{position:relative;display:grid;justify-items:center;gap:3px;padding:8px 2px 9px;border:0;border-radius:10px 10px 0 0;
  background:none;color:var(--mute);font:600 12.5px/1.15 inherit;cursor:pointer;min-width:0}
.sk-reiter button span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sk-reiter svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.sk-reiter button:hover{color:var(--text);background:var(--hi)}
.sk-reiter button[aria-selected="true"]{color:var(--text)}
.sk-reiter button[aria-selected="true"]::after{content:'';position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:var(--green-text)}
.sk-reiter button:focus-visible{outline:2px solid var(--green-text);outline-offset:-2px}
.sk-tafel{flex:1;min-height:0;overflow-y:auto;padding:16px 16px 20px;overscroll-behavior:contain;align-content:start}
.sk-tafel[hidden]{display:none}
.sk-schalter{display:grid;gap:8px}
.sk-hilfe{font-size:12.5px;color:var(--mute);line-height:1.45}
.sk-karte-feld{min-width:0;min-height:0;position:relative}
.sk-karte{position:relative;height:100%;min-height:0;overflow:hidden;background:#15181d;user-select:none;-webkit-user-select:none}
.sk-karte canvas{position:absolute;inset:0;display:block;touch-action:none;cursor:grab;outline:none}
.sk-karte.zieht canvas{cursor:grabbing}
.sk-karte canvas:focus-visible{box-shadow:inset 0 0 0 2px var(--green-text)}
.sk-knoepfe{position:absolute;top:10px;right:10px;display:grid;gap:6px}
.sk-knoepfe button{width:36px;height:36px;display:grid;place-items:center;padding:0;border-radius:9px;border:1px solid rgba(255,255,255,.14);
  background:rgba(18,21,27,.86);color:#eef2f6;font:600 20px/1 inherit;cursor:pointer}
.sk-knoepfe button:hover{background:rgba(44,50,60,.95)}
.sk-knoepfe button:focus-visible{outline:2px solid var(--green-text);outline-offset:1px}
.sk-knoepfe svg{width:17px;height:17px}
.sk-info{position:absolute;left:10px;bottom:10px;max-width:calc(100% - 20px);padding:6px 10px;border-radius:8px;background:rgba(18,21,27,.88);
  color:#eef2f6;font-size:13.5px;font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-info:empty{display:none}
.sk-lade{position:absolute;left:50%;top:12px;transform:translateX(-50%);padding:6px 12px;border-radius:999px;background:rgba(18,21,27,.88);
  color:#eef2f6;font-size:13px;pointer-events:none;white-space:nowrap}
.sk-lade.fehler{top:50%;transform:translate(-50%,-50%);width:min(90%,420px);white-space:normal;text-align:center;border-radius:12px;
  padding:12px 16px;font-size:14.5px;background:rgba(70,24,30,.94)}
.sk-popup{position:absolute;z-index:3;width:max-content;max-width:min(300px,calc(100% - 16px));padding:10px 12px;border-radius:12px;
  background:#23252b;border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.35);display:grid;gap:6px}
[data-theme="light"] .sk-popup{background:#fff}
.sk-pop-kopf{display:flex;align-items:center;gap:8px}
.sk-pop-kopf b{flex:1;font-size:15px;color:var(--text)}
.sk-zu{width:26px;height:26px;padding:0;border:0;border-radius:7px;background:none;color:var(--mute);font:400 20px/1 inherit;cursor:pointer}
.sk-zu:hover{background:var(--hi);color:var(--text)}
.sk-pop-xz{font-variant-numeric:tabular-nums;color:var(--text);font-size:14.5px}
.sk-pop-klein{font-size:13px;color:var(--mute)}
.sk-ikon{flex:none;display:block}
.sk-seedreihe input{font-variant-numeric:tabular-nums}
.sk-wuerfel{flex:none!important;width:42px;height:42px;padding:0}
.sk-wuerfel svg{width:20px;height:20px}
.sk-seedinfo{font-size:13px;color:var(--mute)}
.sk-seedinfo:empty{display:none}
.sk-hoehe{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.sk-hoehe input{width:100%;accent-color:var(--green)}
.sk-hoehe output{font-size:14px;color:var(--dim);min-width:84px;text-align:right;font-variant-numeric:tabular-nums}
.sk-ebenen-kopf{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.sk-ebenen-kopf>span:last-child{font-size:13px;color:var(--mute)}
.sk-text{padding:2px;border:0;background:none;color:var(--green-text);font:600 13px/1 inherit;cursor:pointer}
.sk-text:hover{text-decoration:underline}
.sk-ebenen{display:grid;gap:1px}
.sk-ebene{display:grid;grid-template-columns:auto auto 1fr;align-items:center;column-gap:8px;padding:5px 6px;border-radius:8px;cursor:pointer;
  font-size:14.5px;color:var(--dim)}
.sk-ebene:hover{background:var(--hi)}
.sk-ebene input{width:17px;height:17px;margin:0;accent-color:var(--green)}
.sk-ebene small{grid-column:3;font-size:12px;color:var(--gold)}
.sk-ebene small:empty{display:none}
.sk-gehe input{height:42px;padding:0 10px;border-radius:10px;border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;font-size:16px}
.sk-gehe button{flex:none!important;height:42px}
.sk-app .wz-seg button{white-space:normal;line-height:1.15;height:auto;min-height:36px;padding:4px 6px}
.sk-quelle{font-size:12.5px;color:var(--mute);line-height:1.5;margin:0 4px 22px}
.sk-quelle a{color:var(--green-text)}
.sk-karte.sk-vollbild{position:fixed;inset:0;z-index:1000;height:auto;min-height:0;border-radius:0;border:0}
.sk-karte:fullscreen{height:100%;border-radius:0;border:0}
.sk-karte:-webkit-full-screen{height:100%;border-radius:0;border:0}
.sk-fehler{position:absolute;inset:0;display:grid;place-items:center;color:#eef2f6}
@media (max-width:860px){
  /* Handy und Tablet: Karte oben, darunter die Leiste mit Reitern (die Seite scrollt normal) */
  .sk-app{grid-template-columns:1fr;height:auto}
  .sk-karte-feld{order:-1}
  .sk-karte{height:58vh;min-height:320px}
  .sk-leiste{border-right:0;border-top:1px solid var(--line)}
  .sk-tafel{overflow:visible}
}

/* Hauptwerkzeug oben in der Übersicht (Seed-Karte) */
.wz-highlight{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:20px 22px;margin:0 0 18px;
  border-radius:16px;background:linear-gradient(135deg,rgba(42,109,179,.28),rgba(94,158,56,.2));border:1px solid rgba(127,211,92,.35);
  color:var(--text);text-decoration:none}
.wz-highlight:hover{border-color:var(--green-text)}
.wz-highlight .ikon svg{width:58px;height:58px;display:block}
.wz-highlight .text{display:grid;gap:3px;min-width:0}
.wz-highlight small{font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--green-text)}
.wz-highlight b{font-size:22px;line-height:1.25}
.wz-highlight .text span{color:var(--dim);font-size:15.5px}
.wz-highlight .pfeil{font-size:26px;color:var(--green-text)}
@media (max-width:560px){
  .wz-highlight{grid-template-columns:auto 1fr;gap:14px;padding:16px}
  .wz-highlight .pfeil{display:none}
  .wz-highlight .ikon svg{width:44px;height:44px}
  .wz-highlight b{font-size:19px}
}

/* Seed-Karte: Finden, Biome in der Ansicht, Markierungen, Fenster auf der Karte */
.sk-finden .wz-reihe select{flex:1;min-width:0;height:42px;padding:0 10px;border-radius:10px;border:1px solid var(--line);background:var(--hi);
  color:var(--text);font:inherit;font-size:15px}
.sk-finden .wz-reihe button{flex:none;height:42px}
.sk-finde-info{font-size:12.5px;color:var(--mute);line-height:1.45}
.sk-finde-info:empty{display:none}
.sk-treffer{list-style:none;display:grid;gap:4px;padding:0;margin:0}
.sk-treffer:empty{display:none}
.sk-treffer .leer{font-size:13.5px;color:var(--mute);padding:4px 2px}
.sk-treffer-knopf{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;width:100%;padding:7px 9px;border-radius:10px;
  border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;text-align:left;cursor:pointer}
.sk-treffer-knopf:hover{border-color:var(--green-text)}
.sk-treffer-knopf span{display:grid;gap:1px;min-width:0}
.sk-treffer-knopf b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-treffer-knopf small{font-size:12.5px;color:var(--mute);font-variant-numeric:tabular-nums}
.sk-farbe{display:block;width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
.sk-biomliste{list-style:none;display:grid;gap:2px;padding:0;margin:0}
.sk-biomliste:empty{display:none}
.sk-biom{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;width:100%;padding:5px 7px;border-radius:8px;border:1px solid transparent;
  background:none;color:var(--dim);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.sk-biom:hover{background:var(--hi)}
.sk-biom.an{border-color:var(--green-text);background:var(--hi);color:var(--text)}
.sk-biom i{width:15px;height:15px;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
.sk-biom span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-biom small{font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}
.sk-marker{list-style:none;display:grid;gap:4px;padding:0;margin:0}
.sk-marker:empty{display:none}
.sk-marker li{display:grid;grid-template-columns:1fr auto;gap:4px;align-items:center}
.sk-marker-go{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:9px;align-items:center;padding:6px 9px;border-radius:10px;
  border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;text-align:left;cursor:pointer;min-width:0}
.sk-marker-go:hover{border-color:var(--green-text)}
.sk-marker-go .sk-pin{grid-row:1/3}
.sk-marker-go b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-marker-go small{font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}
.sk-pin{display:block;width:12px;height:12px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#e8453c;box-shadow:inset 0 0 0 3px #e8453c,inset 0 0 0 5px #fff}
.sk-x{width:32px;height:32px;padding:0;border:0;border-radius:8px;background:none;color:var(--mute);font:400 20px/1 inherit;cursor:pointer}
.sk-x:hover{background:var(--hi);color:var(--text)}
.sk-pop-knoepfe{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.sk-pop-knoepfe .wz-klein{height:32px;font-size:13px}
.sk-pop-form{display:flex;gap:6px;margin-top:2px}
.sk-pop-form input{flex:1;min-width:0;height:34px;padding:0 9px;border-radius:9px;border:1px solid var(--line);background:var(--hi);color:var(--text);font:inherit;font-size:15px}
.sk-pop-gut{font-size:13.5px;color:var(--green-text);font-weight:600}
.sk-popup{max-width:min(340px,calc(100% - 16px))}
/* Seed-Ideen unter dem Seed-Feld */
.sk-ideen{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.sk-ideen span{width:100%;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.sk-ideen button{padding:5px 10px;border-radius:999px;border:1px solid var(--line);background:var(--hi);color:var(--dim);font:500 12.5px/1.25 inherit;cursor:pointer;text-align:left}
.sk-ideen button:hover{border-color:var(--green-text);color:var(--text)}