/* Bausteine Weltkugel und Kriege, Helfen statt Blockieren. Übernimmt die Variablen aus site.css, mit Rückfallwerten. */
.wk{
  --wk-ink:var(--ink,#0e1b32);--wk-muted:var(--ink-muted,#525b6b);--wk-navy:var(--navy,#01295b);--wk-blue:var(--blue-ink,#1f4f8f);
  --wk-surface:#ffffff;--wk-page:var(--surface,#f6f9fd);--wk-line:#d6dfeb;--wk-grid:#e3e8ef;--wk-axis:#b9c3d1;
  --wk-ocean:#dbe7f5;--wk-land:#f1f4f8;--wk-border:#aab7c9;--wk-sel:#e08a00;
  --wk-r1:#86b6ef;--wk-r2:#5598e7;--wk-r3:#2a78d6;--wk-r4:#1c5cab;--wk-r5:#0d366b;--wk-na:#c3ccd8;
  --wk-display:var(--f-display,"Montserrat","Barlow",system-ui,sans-serif);--wk-text:var(--f-text,"Barlow",system-ui,sans-serif);--wk-cond:var(--f-cond,"Barlow Condensed","Barlow",system-ui,sans-serif);
  color:var(--wk-ink);font-family:var(--wk-text);background:var(--wk-page);padding:56px 0 64px;
}
.wk *,.wk *::before,.wk *::after{box-sizing:border-box}
.wk [hidden]{display:none!important}
.wk-wrap{max-width:var(--wrap,1120px);margin:0 auto;padding:0 24px}
.wk h2{font:800 clamp(28px,4.2vw,44px)/1.08 var(--wk-display);color:var(--wk-navy);margin:0 0 14px;letter-spacing:-.01em}
.wk h3{font:700 clamp(19px,2.2vw,23px)/1.25 var(--wk-display);color:var(--wk-navy);margin:40px 0 10px}
.wk h4{font:700 17px/1.3 var(--wk-display);color:var(--wk-navy);margin:26px 0 8px;text-transform:none;letter-spacing:normal}
.wk .wk-sb-name{margin:0 0 4px}
.wk p{margin:0 0 14px;max-width:72ch;line-height:1.6}
.wk a{color:var(--wk-blue);text-underline-offset:3px}
.wk a:focus-visible,.wk button:focus-visible,.wk select:focus-visible,.wk input:focus-visible,.wk summary:focus-visible,.wk [tabindex]:focus-visible{outline:3px solid var(--wk-sel);outline-offset:2px;border-radius:4px}
.wk-lead{font-size:clamp(17px,1.9vw,20px);color:var(--wk-ink)}
.wk-stand{font:500 15px/1.4 var(--wk-cond);color:var(--wk-muted)}
.wk small{font-size:14px;color:var(--wk-muted)}

/* Bedienung */
.wk-bedienung{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:flex-end;margin:22px 0 12px}
.wk-modus{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0;border-radius:999px;background:#e7eef8;padding:4px}
.wk-modus legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wk-modus label{position:relative;display:block;cursor:pointer;font:600 16px/1.2 var(--wk-text);color:var(--wk-navy);padding:10px 16px;border-radius:999px}
.wk-modus input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.wk-modus label:has(input:checked){background:var(--wk-navy);color:#fff}
.wk-modus label:has(input:focus-visible){outline:3px solid var(--wk-sel);outline-offset:2px}
.wk-feld{display:flex;flex-direction:column;gap:4px;font:500 15px/1.2 var(--wk-cond);color:var(--wk-muted);min-width:0}
.wk-feld select{font:500 16px/1.2 var(--wk-text);color:var(--wk-ink);padding:10px 12px;border:1px solid var(--wk-border);border-radius:10px;background:#fff;max-width:100%}
.wk-feld[hidden]{display:none}

/* Bühne: Kugel und Steckbrief */
.wk-buehne{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:start}
.wk-buehne[hidden]{display:none}
.wk-kugel{margin:0}
.wk-svg svg{display:block;width:100%;height:auto;max-width:620px;margin:0 auto;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.wk-svg svg:active{cursor:grabbing}
.wk-svg svg:focus-visible{outline:3px solid var(--wk-sel);outline-offset:4px;border-radius:50%}
.wk-ocean{fill:var(--wk-ocean)}
.wk-rand{fill:none;stroke:var(--wk-navy);stroke-width:1.2}
.wk-netz{fill:none;stroke:#fff;stroke-width:.6;stroke-opacity:.9}
.wk-land{stroke:#fff;stroke-width:.5;stroke-linejoin:round}
.wk-land.wk-an{stroke:var(--wk-sel);stroke-width:2.2}
.wk-hilfe{font:400 14px/1.45 var(--wk-text);color:var(--wk-muted);margin:10px auto 0;max-width:620px}
.wk-steckbrief{background:var(--wk-surface);border:1px solid var(--wk-line);border-radius:18px;padding:22px 22px 10px;max-height:640px;overflow:auto;outline:none}
.wk-steckbrief:focus-visible{outline:3px solid var(--wk-sel)}
.wk-start{color:var(--wk-muted);font-size:17px}
.wk-sb-name{font:800 26px/1.15 var(--wk-display);color:var(--wk-navy);margin:0 0 4px}
.wk-sb-zahl{font:600 17px/1.35 var(--wk-cond);color:var(--wk-blue);margin:0 0 16px}
.wk-ak{border-top:1px solid var(--wk-line);padding:14px 0 6px}
.wk-ak h4{margin:0 0 8px;font-size:16px}
.wk-ak ul{list-style:none;margin:0;padding:0}
.wk-ak li{margin:0 0 10px;font-size:15px;line-height:1.5}
.wk-chips{display:inline-flex;flex-wrap:wrap;gap:4px;margin-right:6px;vertical-align:1px}
.wk-chip{display:inline-block;font:600 13px/1.2 var(--wk-cond);letter-spacing:.02em;padding:3px 8px;border-radius:999px;border:1px solid var(--wk-border);color:var(--wk-navy);background:#f3f6fb}
.wk-chip i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:0}
.wk-flag{display:inline-block;font:600 13px/1.2 var(--wk-cond);padding:2px 7px;border-radius:6px;background:#fff4dc;color:#6b4a00;border:1px solid #f0d08a}
.wk-flag-nz{background:#eef1f5;color:var(--wk-muted);border-color:var(--wk-line)}
.wk-qs{font-size:13.5px;color:var(--wk-muted)}
.wk-qs a{color:var(--wk-muted)}
.wk-aus{font-size:14px;color:var(--wk-muted);margin:4px 0 6px}
.wk-kontext{background:#f3f6fb;border-radius:12px;padding:12px 14px;margin:0 0 14px;font-size:15px}
.wk-weitere{margin-top:10px}
.wk-weitere>h4{color:var(--wk-muted)}
.wk-zl{display:flex;flex-direction:column;gap:6px}
.wk-zl button,.wk-org,.wk-goto{font:600 15px/1.25 var(--wk-text);color:var(--wk-blue);background:none;border:0;padding:2px 0;cursor:pointer;text-align:left;text-decoration:underline;text-underline-offset:3px}

/* Legende und Organisationen */
.wk-legende{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin:18px 0 8px;font:500 15px/1.3 var(--wk-cond);color:var(--wk-muted)}
.wk-legende[hidden],.wk-orgs[hidden]{display:none}
.wk-legende b{font-weight:600;color:var(--wk-ink);width:100%}
.wk-legende span{display:inline-flex;align-items:center;gap:6px}
.wk-legende i{display:inline-block;width:16px;height:12px;border-radius:3px;border:1px solid rgba(14,27,50,.12)}
.wk-orgs{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;margin:6px 0 18px;font:500 15px/1.3 var(--wk-cond);color:var(--wk-muted)}
.wk-org{font-size:15px}
.wk-fehler{background:#fff4dc;border-radius:10px;padding:12px 14px}

/* Tabellen */
.wk-tabelle,.wk-quellen,.wk-werte{margin:22px 0;border-top:1px solid var(--wk-line);padding-top:12px}
.wk summary{cursor:pointer;font:600 17px/1.3 var(--wk-text);color:var(--wk-navy);padding:6px 0}
.wk-tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.wk table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.45;font-variant-numeric:tabular-nums}
.wk th,.wk td{text-align:left;vertical-align:top;padding:8px 10px;border-bottom:1px solid var(--wk-grid)}
.wk thead th{font:600 14px/1.3 var(--wk-cond);color:var(--wk-muted);border-bottom:1px solid var(--wk-axis)}
.wk-tgr th{background:#eef3fa;font:700 16px/1.3 var(--wk-display);color:var(--wk-navy);padding-top:12px}
.wk-tgr th span{font:500 14px var(--wk-cond);color:var(--wk-muted);margin-left:8px}
.wk-qn{display:inline-block;min-width:1.6em;text-align:center;font-size:13px;padding:0 3px;border:1px solid var(--wk-line);border-radius:6px;text-decoration:none;margin:0 2px 2px 0}
.wk-tab td:nth-child(n+2),.wk-tab th:nth-child(n+2){text-align:right}
.wk-tab td:nth-child(2){white-space:nowrap}
.wk-quellen ol{padding-left:24px;font-size:14px;line-height:1.5;color:var(--wk-muted)}
.wk-quellen li{margin-bottom:6px;overflow-wrap:anywhere}
.wk-notiz{margin-top:24px;font-size:15px}
.wk-notiz ul,.wk-grenzen{padding-left:20px;max-width:76ch}
.wk-notiz li,.wk-grenzen li{margin-bottom:6px}
.wk-def{background:var(--wk-surface);border:1px solid var(--wk-line);border-radius:18px;padding:6px 22px 8px;margin:22px 0}
.wk-def h3{margin-top:16px}
.wk-hinweis{color:var(--wk-muted);font-style:italic}

/* Diagramme */
.wk-fig{margin:10px 0 18px}
.wk-leg{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 6px;padding:0;font:500 15px/1.3 var(--wk-cond);color:var(--wk-ink)}
.wk-leg li{display:inline-flex;align-items:center;gap:7px;margin:0}
.wk-leg i{width:12px;height:12px;border-radius:3px;display:inline-block}
.wk-chartbox{position:relative;background:var(--wk-surface);border:1px solid var(--wk-line);border-radius:14px;padding:8px 6px 2px}
.wk-chart{display:block;width:100%;height:auto}
.wk-narrow{display:none}
.wk-chart .wk-grid{stroke:var(--wk-grid);stroke-width:1}
.wk-chart .wk-base{stroke:var(--wk-axis);stroke-width:1}
.wk-chart .wk-ax{font:500 11px var(--wk-cond);fill:var(--wk-muted)}
.wk-chart .wk-hit{fill:transparent}
.wk-chart g.wk-an .wk-hit{fill:rgba(1,41,91,.07)}
.wk-tip{position:absolute;z-index:3;pointer-events:none;background:var(--wk-navy);color:#fff;font:500 14px/1.35 var(--wk-text);padding:7px 10px;border-radius:8px;max-width:260px;box-shadow:0 6px 18px rgba(1,41,91,.25)}
.wk-tip[hidden]{display:none}

@media (max-width:900px){
  .wk-buehne{grid-template-columns:minmax(0,1fr)}
  .wk-steckbrief{max-height:none}
}
@media (max-width:560px){
  .wk{padding:40px 0 48px}
  .wk-wrap{padding:0 16px}
  .wk-wide{display:none}
  .wk-narrow{display:block}
  .wk-chart .wk-ax{font-size:12px}
  .wk-bedienung{flex-direction:column;align-items:stretch}
  .wk-modus{align-self:flex-start}
  .wk-modus label{padding:9px 12px;font-size:15px}
  .wk-steckbrief{padding:18px 16px 8px}
  /* Sanktionstabelle als gestapelte Zeilen */
  .wk-tabelle[data-wk-tab] table,.wk-tabelle[data-wk-tab] tbody,.wk-tabelle[data-wk-tab] tr,.wk-tabelle[data-wk-tab] td,.wk-tabelle[data-wk-tab] th{display:block;width:100%}
  .wk-tabelle[data-wk-tab] thead{display:none}
  .wk-tabelle[data-wk-tab] tr{border-bottom:1px solid var(--wk-grid);padding:6px 0}
  .wk-tabelle[data-wk-tab] td{border:0;padding:2px 0}
  .wk-tabelle[data-wk-tab] td:first-child{display:none}
  .wk-tabelle[data-wk-tab] td::before{content:attr(data-l) ": ";font:600 13px var(--wk-cond);color:var(--wk-muted)}
  .wk-tabelle[data-wk-tab] .wk-tgr th{padding:10px 8px}
}
@media (prefers-reduced-motion:reduce){
  .wk *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media (forced-colors:active){
  .wk-land.wk-an{stroke:Highlight}
  .wk-chip,.wk-flag{border:1px solid CanvasText}
}
