/* kinux-ui.css: Produktansichten im echten kinux-Light-Mode («Polar»).
   Tokens 1:1 aus SIIE-v2/frontend/src/styles/polar-tokens.css, Abschnitt
   [data-theme="light"]. Jede Ansicht ist ein eigener Container (inline-size)
   und waehlt ihr Layout per Container Query: breit ab 880 px, mittel 560 bis
   879 px, schmal unter 560 px. Kein Text unter 13 px, keine Verlaeufe, keine
   Glows ausser der Kugel, Rand oder Schatten, nie beides. Keine CSS-Transitions
   fuer den Ablauf: alle Bewegung kommt aus render(t) in kinux-ui.js. */

/* ---------- Schriften (IBM Plex, Dateien im Website-Repo) ---------- */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:100 700;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-sans-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:100 700;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-sans-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-mono-400.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-mono-400-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-mono-500.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("../../assets/fonts/ibm-plex-mono-500-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Ansicht: Container, Tokens, Grundschrift ---------- */
.kx-view{
  --bg:#F5F7F9;--sb:#EDF1F4;--card:#FFFFFF;--card2:#F0F3F6;
  --line:rgba(15,32,44,.09);--line2:rgba(15,32,44,.17);--hov:rgba(15,32,44,.05);
  --t1:#17242E;--t2:#5C6C79;--t3:#60707C;
  --acc:#0C7CB8;--acc2:#3E9ED1;--accInk:#FFFFFF;
  --tint:rgba(12,124,184,.08);--tint2:rgba(12,124,184,.15);--accbr:rgba(12,124,184,.4);--glow:rgba(12,124,184,.18);
  --ok:#1F8A4C;--okT:rgba(31,138,76,.10);--err:#C4453A;--errT:rgba(196,69,58,.10);--errbr:rgba(196,69,58,.35);
  --warn:#9A7B1F;--warnT:rgba(154,123,31,.12);--rec:#C4453A;--track:rgba(15,32,44,.10);
  --sh:0 8px 28px rgba(15,32,44,.14);--r1:9px;--r2:13px;--r3:18px;
  --acc-rgb:12,124,184;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
  --sans:"IBM Plex Sans",-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Sans",-apple-system,"Segoe UI",sans-serif;   /* Owner 27.09.: keine Schreibmaschinenschrift, Zahlen in Plex Sans mit Tabellenziffern */
  container-type:inline-size;container-name:kx;
  position:relative;box-sizing:border-box;width:100%;min-width:0;
  background:var(--bg);color:var(--t1);border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;
  display:flex;flex-direction:column;
  font-family:var(--sans);font-size:17px;line-height:1.5;font-weight:400;letter-spacing:0;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;text-align:left}
.kx-view *,.kx-view *::before,.kx-view *::after{box-sizing:border-box}
.kx-view p,.kx-view h1,.kx-view h2{margin:0;font-size:inherit;font-weight:inherit}
.kx-view b{font-weight:500}
.kx-view svg{display:block;flex:none}
.kx-inner{display:flex;flex-direction:column;flex:1 0 auto;min-width:0;width:100%}
.kx-ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.kx-mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* ---------- Kopfzeile: Marke, Seitentitel, ein Statuselement ---------- */
.kx-top{display:flex;align-items:center;gap:12px;height:56px;flex:none;padding:0 22px;border-bottom:1px solid var(--line);min-width:0}
.kx-brand{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16px;letter-spacing:.01em;color:var(--t1);flex:none}
.kx-brand svg{width:19px;height:19px;fill:currentColor}
.kx-sep{width:1px;height:20px;background:var(--line2);flex:none}
.kx-ttl{display:flex;align-items:center;gap:8px;min-width:0;font-size:15px;color:var(--t2);font-weight:500;white-space:nowrap;overflow:hidden}
.kx-ttl span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.kx-ttl b{color:var(--t1);font-weight:500}
.kx-ttl i{font-style:normal;color:var(--t3);flex:none}
.kx-topr{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.kx-timer{font-family:var(--mono);font-size:14.5px;color:var(--t2);font-variant-numeric:tabular-nums}
@container kx (max-width:559.98px){
  .kx-top{padding:10px 16px;gap:10px;height:auto;min-height:56px}
  .kx-ttl{white-space:normal;overflow:visible;line-height:1.3}
  .kx-ttl>*:not(.keep){display:none}
  .kx-ttl span,.kx-ttl b{overflow:visible;overflow-wrap:anywhere}
  .kx-topr .kx-chip{display:none}
}

/* ---------- Bausteine ---------- */
.kx-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:99px;font-size:13.5px;line-height:1.35;border:1px solid var(--line2);color:var(--t2);white-space:nowrap;font-weight:400}
.kx-chip.pf{background:var(--tint2);border-color:transparent;color:var(--acc);font-weight:500}
.kx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--r2);font-size:15px;font-weight:500;line-height:1.3;border:1px solid transparent;font-family:inherit;white-space:nowrap}
.kx-btn.pri{background:var(--acc);color:var(--accInk)}
.kx-btn .kx-ic{width:16px;height:16px}
.kx-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r3)}
.kx-ava{width:32px;height:32px;border-radius:50%;background:var(--tint2);color:var(--acc);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;flex:none;letter-spacing:.01em}
.kx-body{padding:26px 24px 28px;width:100%;min-width:0}
.kx-body.kx-max{max-width:960px;margin:0 auto}
.kx-view .kx-h1{font-size:24px;font-weight:600;letter-spacing:-.015em;line-height:1.25}
.kx-view .kx-sub{color:var(--t2);font-size:16px;margin-top:6px;max-width:64ch}
.kx-view .kx-sec{font-size:15px;font-weight:600;margin:24px 0 8px}
.kx-note{display:flex;gap:10px;align-items:flex-start;margin-top:16px;font-size:15px;color:var(--t2);line-height:1.5}
.kx-note .kx-ic{width:16px;height:16px;color:var(--t3);margin-top:3px}
.kx-list{border:1px solid var(--line);border-radius:var(--r2);background:var(--card);overflow:hidden}
.kx-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-top:1px solid var(--line);min-width:0}
.kx-row:first-child{border-top:0}
.kx-row .t{flex:1;min-width:0}
.kx-row .t b{font-weight:500;display:block;font-size:16px;line-height:1.35}
.kx-row .t span{display:block;font-size:14px;color:var(--t2);margin-top:2px}
.kx-row .sc{font-family:var(--mono);font-size:16px;width:36px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.kx-fade{opacity:0}

/* ---------- call: Uebungsgespraech ---------- */
.kx-call .kx-stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 24px 22px;min-width:0}
.kx-orb{position:relative;width:clamp(150px,40cqw,236px);aspect-ratio:1;--amp:0;flex:none}
/* Glow wie call.css (inset -24 %, Skalierung 1 + amp*.16), hier ueber inset statt transform:
   so rastert der Browser den Verlauf je Bild neu und Einzelbilder bleiben bit-identisch. */
.kx-orb .kx-glow{position:absolute;inset:calc(-24% - var(--amp)*11.84%);border-radius:50%;background:radial-gradient(circle,var(--glow) 0%,transparent 62%);opacity:.85;pointer-events:none}
.kx-orb canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;transform:scale(calc(1 + var(--amp)*.045)) translateZ(0);filter:saturate(1.04)}
.kx-persona{margin-top:22px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.kx-persona b{font-size:24px;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.kx-status{margin-top:8px;font-size:16px;color:var(--t2);min-height:24px;text-align:center}
.kx-status b{color:var(--t1);font-weight:500}
.kx-meta{margin-top:14px;display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;justify-content:center}
.kx-meta .kx-lang{font-size:14px;color:var(--t3)}
.kx-caps{margin-top:24px;width:100%;max-width:640px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;font-size:17px;line-height:1.5;min-height:calc(1.5em*4 + 8px)}
.kx-caps p{margin:0;color:var(--t1);overflow-wrap:anywhere}
.kx-caps p b{font-weight:500;color:var(--t1)}
.kx-caps p.prev,.kx-caps p.prev b{color:var(--t3)}
.kx-caps p:empty{display:none}
.kx-ctrls{display:flex;align-items:flex-start;justify-content:center;gap:36px;padding:26px 0 0}
.kx-ctrl{display:flex;flex-direction:column;align-items:center;gap:6px;width:80px}
.kx-ctrl span{font-size:13px;color:var(--t3)}
.kx-round{width:56px;height:56px;border-radius:99px;border:1px solid var(--line2);background:var(--card2);display:grid;place-items:center;color:var(--t1)}
.kx-round .kx-ic{width:22px;height:22px}
.kx-round.hang{width:68px;height:68px;background:var(--errT);border-color:var(--errbr);color:var(--err);margin-top:-6px}
.kx-round.hang .kx-ic{width:26px;height:26px;transform:rotate(135deg)}
@container kx (max-width:559.98px){
  .kx-call .kx-top{min-height:52px;padding:8px 16px}
  .kx-call .kx-stage{padding:16px 16px 14px}
  .kx-orb{width:clamp(110px,32cqw,236px)}
  .kx-persona{margin-top:12px;gap:8px}
  .kx-persona b{font-size:20px}
  .kx-status{margin-top:4px;font-size:15px;min-height:22px}
  .kx-meta{margin-top:8px;gap:6px 10px}
  .kx-meta .kx-chip{font-size:13px;padding:3px 10px}
  .kx-meta .kx-lang{font-size:13px}
  .kx-caps{margin-top:14px;font-size:15px;line-height:1.45;min-height:calc(1.45em*4 + 6px);gap:6px}
  .kx-ctrls{gap:24px;padding:16px 0 0}
  .kx-ctrl{gap:5px;width:70px}
  .kx-round{width:48px;height:48px}
  .kx-round .kx-ic{width:20px;height:20px}
  .kx-round.hang{width:56px;height:56px;margin-top:-4px}
  .kx-round.hang .kx-ic{width:22px;height:22px}
}

/* ---------- result: Auswertung ---------- */
.kx-result .kx-grid{display:grid;gap:24px;align-items:start}
.kx-score{display:flex;flex-direction:column;align-items:center;text-align:center;padding:26px 22px 24px}
.kx-ring{position:relative;width:200px;height:200px;flex:none}
.kx-ring svg{width:100%;height:100%;overflow:visible}
.kx-ring circle{fill:none;stroke-width:10}
.kx-ring .tr{stroke:var(--track)}
.kx-ring .pr{stroke:var(--acc);stroke-linecap:round}
.kx-ring .n{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.kx-ring .n b{font-family:var(--mono);font-size:56px;font-weight:500;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kx-ring .n span{font-size:13px;color:var(--t3);margin-top:8px}
.kx-out{margin-top:20px;display:flex;flex-direction:column;align-items:center;gap:6px}
.kx-out .o{display:inline-flex;align-items:center;gap:8px;font-size:18px;font-weight:500;color:var(--t1)}
.kx-out .o .kx-ic{width:18px;height:18px;color:var(--ok)}
.kx-out .d{font-size:15px;color:var(--ok);font-weight:500}
.kx-fields{padding:22px 22px 24px}
.kx-fields .h{font-size:15px;font-weight:600;margin-bottom:16px}
.kx-bars{display:flex;flex-direction:column;gap:14px}
.kx-bar{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 36px;gap:6px 16px;align-items:center}
.kx-bar .lb{font-size:15px;color:var(--t2);line-height:1.3}
.kx-bar .tr{height:6px;border-radius:3px;background:var(--track);overflow:hidden}
.kx-bar .tr i{display:block;height:100%;background:var(--acc);border-radius:3px;width:0}
.kx-bar.weak .tr i{background:var(--acc2)}
.kx-bar .nm{font-family:var(--mono);font-size:15px;text-align:right;font-variant-numeric:tabular-nums}
.kx-lever{background:var(--tint);border:1px solid var(--accbr);border-radius:var(--r3);padding:20px 22px 22px}
.kx-lever .h{font-size:14.5px;font-weight:500;color:var(--acc)}
.kx-lever p{margin-top:8px;font-size:17px;font-weight:500;line-height:1.45;color:var(--t1);max-width:60ch}
.kx-lever p.q{font-weight:400;color:var(--t2);font-style:italic;font-size:16px;margin-top:8px}
.kx-lever .kx-btn{margin-top:18px}
@container kx (min-width:880px){
  .kx-result .kx-grid{grid-template-columns:320px minmax(0,1fr);grid-template-areas:"score fields" "score lever"}
  .kx-result .kx-score{grid-area:score}.kx-result .kx-fields{grid-area:fields}.kx-result .kx-lever{grid-area:lever}
}
@container kx (min-width:560px) and (max-width:879.98px){
  .kx-result .kx-score{flex-direction:row;justify-content:center;gap:34px;text-align:left}
  .kx-result .kx-out{margin-top:0;align-items:flex-start}
}
/* Mittlere Breite ab 640 px: Score und Gesprächsfelder nebeneinander, damit die Auswertung nicht höher als der Bildschirm wird */
@container kx (min-width:640px) and (max-width:879.98px){
  .kx-result .kx-grid{grid-template-columns:230px minmax(0,1fr);grid-template-areas:"score fields" "lever lever"}
  .kx-result .kx-score{grid-area:score;flex-direction:column;gap:0;text-align:center}
  .kx-result .kx-out{margin-top:16px;align-items:center}
  .kx-result .kx-fields{grid-area:fields}.kx-result .kx-lever{grid-area:lever}
  .kx-result .kx-ring{width:160px;height:160px}.kx-result .kx-ring .n b{font-size:46px}
}
@container kx (max-width:559.98px){
  .kx-bar{grid-template-columns:minmax(0,1fr) 36px}
  .kx-bar .lb{grid-column:1;grid-row:1}
  .kx-bar .nm{grid-column:2;grid-row:1}
  .kx-bar .tr{grid-column:1 / -1;grid-row:2}
  .kx-ring{width:170px;height:170px}
  .kx-ring .n b{font-size:48px}
}

/* ---------- answer: Fachfrage im Chat ---------- */
.kx-answer .kx-body{padding:0}
.kx-answer .kx-lay{display:grid;grid-template-columns:minmax(0,1fr);flex:1;min-width:0}
.kx-thread{display:flex;flex-direction:column;gap:22px;padding:24px 24px 4px;width:100%;max-width:800px;margin:0 auto;min-width:0}
.kx-msg-u{align-self:flex-end;max-width:82%;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);border-bottom-right-radius:6px;padding:12px 16px;font-size:17px;line-height:1.5;overflow-wrap:anywhere}
.kx-think{display:flex;align-items:center;gap:10px;color:var(--t2);font-size:15px;min-height:24px}
.kx-think .dots{display:flex;gap:4px}
.kx-think .dots i{width:5px;height:5px;border-radius:50%;background:var(--acc);display:block}
.kx-msg-a{font-size:17px;line-height:1.62;max-width:70ch;overflow-wrap:anywhere}
.kx-msg-a b{font-weight:600}
.kx-cite{font-family:var(--mono);font-size:13px;color:var(--acc);background:var(--tint);border-radius:5px;padding:1px 6px;white-space:nowrap;margin:0 2px;font-weight:400}
.kx-srcs{border:1px solid var(--line);border-radius:var(--r2);background:var(--card);overflow:hidden;max-width:70ch}
.kx-srcs .h{padding:10px 14px;font-size:14px;color:var(--t2);font-weight:500}
.kx-src{display:flex;align-items:flex-start;gap:12px;padding:11px 14px;border-top:1px solid var(--line);font-size:15px;line-height:1.4}
.kx-src .n{font-family:var(--mono);font-size:13px;color:var(--acc);width:18px;flex:none;padding-top:2px}
.kx-src .kx-ic{width:16px;height:16px;color:var(--t3);margin-top:3px}
.kx-src .t{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 14px;align-items:baseline}
.kx-src .t b{display:block;font-weight:500;grid-column:1}
.kx-src .t span.s{display:block;font-size:14px;color:var(--t3);grid-column:1}
.kx-src .t span.w{font-family:var(--mono);font-size:13px;color:var(--t3);grid-column:2;grid-row:1;white-space:nowrap}
.kx-cite{margin:0 3px}
.kx-msg-a .kx-cite{margin:0 2px 0 4px}
.kx-dock{width:100%;max-width:800px;margin:0 auto;padding:16px 24px 6px}
.kx-comp{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:14px 14px 10px}
.kx-comp.focus{border-color:var(--acc2);box-shadow:0 0 0 3px var(--tint)}
.kx-comp .kx-in{min-height:26px;font-size:16px;line-height:1.55;color:var(--t1);white-space:pre-wrap;overflow-wrap:anywhere}
.kx-comp .kx-in.ph{color:var(--t3)}
.kx-caret{display:inline-block;width:1.5px;height:1.15em;background:var(--t1);vertical-align:-.22em;margin-left:1px}
.kx-crow{display:flex;align-items:center;margin-top:8px}
.kx-send{margin-left:auto;width:34px;height:34px;border-radius:10px;background:var(--acc);color:var(--accInk);display:flex;align-items:center;justify-content:center}
.kx-send.off{opacity:.35}
.kx-send.press{transform:translateY(1px)}
.kx-foot{font-size:13px;color:var(--t3);text-align:center;padding:8px 24px 14px;line-height:1.45}
.kx-srcpane{min-width:0}
.kx-srcpane .ph{display:flex;align-items:center;gap:6px 10px;font-size:15px;margin-bottom:14px;flex-wrap:wrap;min-width:0}
.kx-srcpane .ph .kx-cite{margin:0}
.kx-srcpane .ph b{font-weight:500}
.kx-srcpane .ph span{color:var(--t3)}
.kx-srcpane .ph .lbl{margin-left:auto;font-size:14px;color:var(--t2);white-space:nowrap;flex:none}
.kx-srcpane .ph>span:not(.lbl):not(.kx-cite){min-width:0;overflow-wrap:anywhere}
.kx-doc{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:20px 22px 22px;font-size:15px;line-height:1.7;color:var(--t1);overflow-wrap:anywhere}
.kx-doc .dt{font-size:17px;font-weight:600;margin-bottom:10px;line-height:1.3}
.kx-doc p{margin-top:10px}
.kx-doc p:first-of-type{margin-top:0}
.kx-doc p.after{color:var(--t2)}
.kx-doc .hl span{border-radius:3px;padding:1px 0;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.kx-doc .hl span.on{background:none}   /* keine Markierung: das Produkt öffnet die Seite der Quelle, markiert aber nichts */
@container kx (min-width:880px){
  .kx-answer .kx-lay{grid-template-columns:minmax(0,1fr) minmax(300px,36%);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"thread src" "dock src"}
  .kx-answer .kx-tcol{grid-area:thread}.kx-answer .kx-dock{grid-area:dock;align-self:end}
  .kx-answer .kx-srcpane{grid-area:src;background:var(--sb);border-left:1px solid var(--line);padding:24px 24px 28px}
  .kx-answer .kx-srcpane.off{visibility:hidden}
  .kx-answer .kx-srcpane.solo{background:transparent;border-left:0;padding:0}
}
@container kx (max-width:879.98px){
  .kx-answer .kx-tcol{order:1}.kx-answer .kx-srcpane{order:2}.kx-answer .kx-dock{order:3}
  .kx-answer .kx-srcpane{padding:0 24px 6px;max-width:800px;margin:0 auto;width:100%}
  .kx-answer .kx-srcpane.off{display:none}
  .kx-answer .kx-srcpane .kx-doc{background:var(--card)}
}
@container kx (max-width:559.98px){
  .kx-src .t{display:block}
  .kx-src .t span.w{display:block;margin-top:2px}
  .kx-thread{padding:18px 16px 4px;gap:18px}
  .kx-dock{padding:14px 16px 4px}
  .kx-answer .kx-srcpane{padding:0 16px 6px}
  .kx-msg-u{max-width:92%}
  .kx-doc{padding:16px 16px 18px}
}
.kx-answer.solo-src .kx-body,.kx-answer.kx-part-source .kx-body{padding:24px}
.kx-answer.solo-src .kx-lay,.kx-answer.kx-part-source .kx-lay{display:block}
/* Teil «source» allein: nur der Innenabstand des Körpers, keine doppelte Einrückung der Originalstelle */
.kx-answer.solo-src .kx-srcpane,.kx-answer.kx-part-source .kx-srcpane{padding:0;max-width:none;margin:0}
@container kx (max-width:559.98px){.kx-answer.solo-src .kx-body,.kx-answer.kx-part-source .kx-body{padding:16px}}

/* ---------- compare: Police und Offerte ---------- */
.kx-docs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.kx-docchip{display:inline-flex;align-items:center;gap:9px;padding:7px 12px 7px 9px;border-radius:var(--r1);border:1px solid var(--line2);font-size:14px;color:var(--t1);background:var(--card);max-width:100%;min-width:0}
.kx-docchip .ab{font-family:var(--mono);font-size:13px;color:var(--acc);background:var(--tint);border-radius:5px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;flex:none}
.kx-docchip .kx-ic{color:var(--t3)}
.kx-docchip span.f{overflow-wrap:anywhere}
.kx-tbl{border:1px solid var(--line);border-radius:var(--r2);overflow:hidden;background:var(--card)}
.kx-tr{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:8px 18px;padding:14px 18px;border-top:1px solid var(--line);align-items:center;min-width:0}
.kx-tr.h{background:var(--card2);border-top:0;font-size:14px;color:var(--t2);font-weight:500;padding:11px 18px}
.kx-tr.h .ab{font-family:var(--mono);color:var(--acc);margin-right:8px}
.kx-tr .k{font-size:16px;line-height:1.35;overflow-wrap:anywhere;hyphens:manual}
.kx-tr .v{font-size:16px;color:var(--t2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.kx-tr .v.num{font-family:var(--mono)}
.kx-tr .v.b{color:var(--t1)}
.kx-tr .v .val{display:block}
.kx-tr .tag{display:block;font-size:13.5px;font-weight:500;margin-top:3px;font-family:var(--sans);line-height:1.35}
.kx-tr .tag.plus{color:var(--ok)}.kx-tr .tag.warn{color:var(--warn)}.kx-tr .tag.gap{color:var(--err)}
.kx-sum{margin-top:16px;background:var(--tint);border:1px solid var(--accbr);border-radius:var(--r3);padding:18px 20px}
.kx-sum .h{font-size:14.5px;font-weight:500;color:var(--acc)}
.kx-sum p{margin-top:6px;font-size:17px;line-height:1.45;max-width:64ch}
.kx-fine{margin-top:12px;font-size:13.5px;color:var(--t3);display:flex;gap:8px;align-items:flex-start;line-height:1.45}
.kx-fine .kx-ic{width:15px;height:15px;margin-top:2px}
/* schmal: kompakte dreispaltige Tabelle (Leistung, A, B), Markierung als Kurzwort unter dem B-Wert */
@container kx (max-width:559.98px){
  .kx-compare .kx-top{min-height:48px;padding:6px 14px}
  .kx-compare .kx-body{padding:10px 10px 10px}
  .kx-docs{flex-direction:column;gap:0;margin-bottom:6px}
  .kx-docchip{border:0;background:transparent;padding:0;font-size:13px;line-height:1.25;gap:7px;border-radius:0}
  .kx-docchip .ab{width:18px;height:18px;font-size:13px}
  .kx-docchip .kx-ic{display:none}
  .kx-tr{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr) minmax(0,1fr);gap:2px 8px;padding:4px 9px;align-items:start}
  .kx-tr.h{padding:5px 9px;font-size:13px;line-height:1.25}
  .kx-tr.h .ab{margin-right:4px}
  .kx-tr .k{font-size:13px;line-height:1.25}
  .kx-tr .v{font-size:13px;line-height:1.25;font-family:var(--sans);font-variant-numeric:tabular-nums}
  .kx-tr .tag{font-size:13px;margin-top:1px;line-height:1.2}
  .kx-tr .tag .long{display:none}
  .kx-sum{margin-top:6px;padding:8px 11px 9px}
  .kx-compare .kx-fine{margin-top:6px}
  .kx-sum .h{font-size:13px}
  .kx-sum p{font-size:14px;line-height:1.3;margin-top:2px}
  .kx-fine{margin-top:6px;font-size:13px;line-height:1.3}
}

/* ---------- team: Ueberblick der Leitung ---------- */
.kx-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r3);background:var(--card);overflow:hidden}
.kx-kpi{padding:18px 20px 16px;border-left:1px solid var(--line);min-width:0}
.kx-kpi:first-child{border-left:0}
.kx-kpi .l{font-size:14px;color:var(--t2);line-height:1.35}
.kx-kpi .v{font-family:var(--mono);font-size:30px;font-weight:500;margin-top:6px;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap}
.kx-kpi .v small{font-family:var(--sans);font-size:15px;font-weight:400;color:var(--t2);margin-left:4px}
@container kx (max-width:559.98px){
  .kx-kpis{grid-template-columns:minmax(0,1fr)}
  .kx-kpi{display:flex;align-items:baseline;justify-content:space-between;gap:12px;border-left:0;border-top:1px solid var(--line);padding:13px 16px}
  .kx-kpi:first-child{border-top:0}
  .kx-kpi .v{margin-top:0;font-size:24px}
}

/* ---------- board: Bestenliste ---------- */
.kx-blist{position:relative;margin-top:18px}
.kx-brow{display:flex;align-items:center;gap:14px;padding:12px 16px;border-top:1px solid var(--line);will-change:transform;position:relative;min-width:0;background:var(--card)}
.kx-brow:first-child{border-top:0}
/* eigene Zeile: tint (rgba(12,124,184,.08)) deckend auf card gerechnet, damit die Zeile beim Rangwechsel ueber den anderen liegt */
.kx-brow.me{background:#ECF4F9}
/* ---------- Dark-Mode: Tokens 1:1 aus polar-tokens.css :root (kinux Dark) ---------- */
.kx-view[data-kx-theme="dark"],[data-kx-theme="dark"] .kx-view{
  --bg:#0E1113;--sb:#0A0D0F;--card:#191F25;--card2:#212830;
  --line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);--hov:rgba(255,255,255,.06);
  --t1:#F2F5F7;--t2:#A9B4BD;--t3:#8B98A3;
  --acc:#7AD4FF;--acc2:#4E93B8;--accInk:#04222F;--acc-rgb:122,212,255;
  --tint:rgba(122,212,255,.09);--tint2:rgba(122,212,255,.17);--accbr:rgba(122,212,255,.35);--glow:rgba(122,212,255,.2);
  --ok:#8CD9A8;--okT:rgba(140,217,168,.12);--err:#E8837B;--errT:rgba(232,131,123,.12);--errbr:rgba(232,131,123,.32);
  --warn:#E8C57B;--warnT:rgba(232,197,123,.12);--rec:#E05B4F;--track:rgba(255,255,255,.09);
  --sh:0 8px 28px rgba(0,0,0,.45)}
.kx-view[data-kx-theme="dark"] .kx-brow.me,[data-kx-theme="dark"] .kx-view .kx-brow.me{background:#212E38}
.kx-brow .rk{font-family:var(--mono);font-size:15px;color:var(--t3);width:22px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.kx-brow.top .rk{color:var(--acc);font-weight:500}
.kx-brow .t{flex:1;min-width:0}
.kx-brow .t b{font-weight:500;font-size:16px;line-height:1.35}
.kx-brow .t .du{display:inline-block;font-family:var(--mono);font-size:13px;color:var(--acc);background:var(--tint2);border-radius:99px;padding:0 7px;margin-left:8px;vertical-align:1px;line-height:1.5}
.kx-brow .t span.s{display:block;font-size:14px;color:var(--t2);margin-top:2px}
.kx-brow .me{text-align:right;flex:none}
.kx-brow .me span{display:block;font-size:13px;color:var(--t3);line-height:1.2}
.kx-brow .me b{display:block;font-family:var(--mono);font-size:18px;font-weight:500;line-height:1.2;margin-top:2px}
@container kx (max-width:559.98px){
  .kx-brow{gap:10px;padding:12px 14px;flex-wrap:wrap}
  .kx-brow .t{flex:1 1 140px}
  .kx-brow .me{width:100%;display:flex;align-items:baseline;gap:8px;text-align:left;padding-left:calc(22px + 32px + 20px);margin-top:-2px}
  .kx-brow .me b{margin-top:0}
}
.kx-brow .t span.s,.kx-row .t span{overflow-wrap:anywhere}

/* ---------- Bewegungsreduktion: Endzustand steht, nichts bewegt sich ---------- */
@media (prefers-reduced-motion:reduce){
  .kx-view *{animation:none!important;transition:none!important}
}

/* Zahlen in Plex Sans: gleich breite Ziffern, damit Zähler und Spalten ruhig stehen */
.kx-view .kx-timer,.kx-view .kx-row .sc,.kx-view .kx-ring .n b,.kx-view .kx-bar .nm,.kx-view .kx-kpi .v,.kx-view .kx-brow .rk,.kx-view .kx-brow .me b,.kx-view .kx-tr .v{font-variant-numeric:tabular-nums lining-nums}