@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/IBMPlexSans-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/IBMPlexSans-500.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/IBMPlexSans-600.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400 600;font-style:italic;font-display:swap;src:url(fonts/IBMPlexSans-400italic.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/IBMPlexMono-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Serif";font-weight:400;font-style:italic;font-display:swap;src:url(fonts/IBMPlexSerif-400italic.woff2) format("woff2")}
/* Schriften: IBM Plex (SIL Open Font License 1.1, fonts/OFL.txt) */
/* Design v4 (13.10.2026, ux-audit/charts-v4/spec.md): nur #000 / #555 / #767676 / #BBB / #C8C8C8 / #FFF.
   H1 40/600 · Headline 24/600 · große Zahl 56/600 · Kicker 13 versal +6 % · Fußnote 13 #555. Zahlen im Diagramm: Plex Mono. */
/* Theme tokens (dark-mode spec 2026-10-17 §1/§2; identical in style.css and landing.css, tests/test_dark_mode.py checks).
   Light = today's greys, unchanged; dark = perceptual inversion, page #000, ink #eee, focus #fff. Dark applies on screen only: print stays light.
   --g-XX: the remaining greys (light #XXXXXX; dark = spec mapping 255*(1-v/255)^0.85), so light mode stays pixel-identical.
   Chart role --c2 is #7a7a7a in dark (not the text token --off #969696): waffle holder/other >= 3:1. */
:root{color-scheme:light;--bg:#fff;--surface:#fff;--ink:#000;--sec:#555;--off:#767676;--ctx:#949494;--empty:#bbb;--rule:#c8c8c8;--rule-strong:#000;--focus:#000;--sel-bg:#000;--sel-fg:#fff;--inv-bg:#000;--inv-fg:#fff;--c1:#111;--c2:#767676;--c3:#9a9a9a;--c4:#b5b5b5;--c5:#d4d4d4;--c6:#e4e4e4;--c7:#ececec;--c-hatch:#141414;--sw-line:#bbb;--g-22:#222222;--g-3d:#3d3d3d;--g-5c:#5c5c5c;--g-5e:#5e5e5e;--g-66:#666666;--g-6b:#6b6b6b;--g-7f:#7f7f7f;--g-88:#888888;--g-99:#999999;--g-a6:#a6a6a6;--g-a8:#a8a8a8;--g-aa:#aaaaaa;--g-bd:#bdbdbd;--g-c4:#c4c4c4;--g-cf:#cfcfcf;--g-d6:#d6d6d6;--g-dd:#dddddd;--g-e0:#e0e0e0;--g-e3:#e3e3e3;--g-e6:#e6e6e6;--g-ee:#eeeeee;--g-ef:#efefef;--g-f0:#f0f0f0;--g-f2:#f2f2f2;--g-f4:#f4f4f4;--g-f6:#f6f6f6;--shadow:0 -8px 24px rgba(0,0,0,.08)}
@media screen{:root[data-theme=dark]{color-scheme:dark;--bg:#000;--surface:#111;--ink:#eee;--sec:#b5b5b5;--off:#969696;--ctx:#7a7a7a;--empty:#535353;--rule:#454545;--rule-strong:#eee;--focus:#fff;--sel-bg:#eee;--sel-fg:#000;--inv-bg:#eee;--inv-fg:#000;--c1:#eee;--c2:#7a7a7a;--c3:#747474;--c4:#595959;--c5:#383838;--c6:#262626;--c7:#1c1c1c;--c-hatch:#eee;--sw-line:#7a7a7a;--g-22:#e2e2e2;--g-3d:#cacaca;--g-5c:#aeaeae;--g-5e:#acacac;--g-66:#a5a5a5;--g-6b:#a1a1a1;--g-7f:#8e8e8e;--g-88:#858585;--g-99:#757575;--g-a6:#686868;--g-a8:#666666;--g-aa:#646464;--g-bd:#515151;--g-c4:#494949;--g-cf:#3e3e3e;--g-d6:#363636;--g-dd:#2e2e2e;--g-e0:#2b2b2b;--g-e3:#272727;--g-e6:#232323;--g-ee:#1a1a1a;--g-ef:#181818;--g-f0:#171717;--g-f2:#141414;--g-f4:#121212;--g-f6:#0f0f0f;--shadow:none}}
@media screen and (prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--bg:#000;--surface:#111;--ink:#eee;--sec:#b5b5b5;--off:#969696;--ctx:#7a7a7a;--empty:#535353;--rule:#454545;--rule-strong:#eee;--focus:#fff;--sel-bg:#eee;--sel-fg:#000;--inv-bg:#eee;--inv-fg:#000;--c1:#eee;--c2:#7a7a7a;--c3:#747474;--c4:#595959;--c5:#383838;--c6:#262626;--c7:#1c1c1c;--c-hatch:#eee;--sw-line:#7a7a7a;--g-22:#e2e2e2;--g-3d:#cacaca;--g-5c:#aeaeae;--g-5e:#acacac;--g-66:#a5a5a5;--g-6b:#a1a1a1;--g-7f:#8e8e8e;--g-88:#858585;--g-99:#757575;--g-a6:#686868;--g-a8:#666666;--g-aa:#646464;--g-bd:#515151;--g-c4:#494949;--g-cf:#3e3e3e;--g-d6:#363636;--g-dd:#2e2e2e;--g-e0:#2b2b2b;--g-e3:#272727;--g-e6:#232323;--g-ee:#1a1a1a;--g-ef:#181818;--g-f0:#171717;--g-f2:#141414;--g-f4:#121212;--g-f6:#0f0f0f;--shadow:none}}
::selection{background:var(--sel-bg);color:var(--sel-fg)}
:root[data-theme=dark] *{scrollbar-color:var(--empty) var(--bg)}
input,select,textarea{background:var(--bg);color:var(--ink)}::placeholder{color:var(--off)}
*{box-sizing:border-box;margin:0;padding:0}
html{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:16px;line-height:1.45;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
body{min-width:0;overflow-wrap:anywhere}
svg text{font-family:"IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums}
/* Default SVG text colour (dark-mode fix): zero specificity so role classes win; skips text that has its own fill attr or inherits one from a parent */
:where(svg text:not([fill]):not([fill] *)){fill:var(--ink)}
svg text.m,.mono,.big{font-variant-numeric:tabular-nums}
svg text.m,.mono{font-family:"IBM Plex Mono",monospace}
.mono{font-size:13px;letter-spacing:-.01em}
a{color:var(--ink);text-decoration:none}
main a{border-bottom:1px solid currentColor}
main svg a{border:0}
.m{color:var(--sec)} .dv{font-style:italic}
sup.a{font-size:.35em;font-weight:400;color:var(--sec);margin-left:2px;vertical-align:1.2em;line-height:0}
.wrap{max-width:1040px;margin:0 auto;padding:40px 48px 32px}

/* Kopf: Wortmarke links, Links rechts, 1-px-Linie */
header.top{display:flex;justify-content:space-between;align-items:baseline;gap:24px;border-bottom:1px solid var(--ink);padding-bottom:12px;font-size:14px}
.brand{font-weight:600}
header nav{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;justify-content:flex-end}
header nav a{color:var(--sec)}
header nav a.on{color:var(--ink)}
form.out{display:inline}
.linkbtn{background:none;border:0;font:inherit;font-size:14px;color:var(--sec);cursor:pointer;padding:0}
.linkbtn:hover,header nav a:hover{color:var(--ink)}
main{padding-bottom:24px}

/* Typo */
h1{font-size:40px;font-weight:600;letter-spacing:-.01em;line-height:1.15;margin:40px 0 4px}
.sub{color:var(--sec);margin:0 0 40px}
.blk{margin:0 0 56px}
.kicker{font-size:13px;color:var(--sec);text-transform:uppercase;letter-spacing:.06em;margin:0 0 6px}
h2{font-size:24px;font-weight:600;line-height:1.3;margin:0 0 8px}
.big{font-size:56px;font-weight:600;line-height:1.05;letter-spacing:-.02em;margin:8px 0 20px}
.big small{font-size:18px;font-weight:400;color:var(--sec);margin-left:8px;letter-spacing:0;white-space:nowrap}
.big.gapv{font-size:32px;color:var(--sec)}
.fn{font-size:13px;color:var(--sec);margin:12px 0 0}
.hint{border-bottom:1px dotted var(--off);cursor:help}

/* Diagramme: volle Inhaltsbreite per viewBox */
svg.chart{display:block;width:100%;max-width:100%;height:auto}
.chartbox{margin-top:24px}
.only-mob{display:none}

/* Ökosystem mobil: vertikale Liste */
.ecolist .anchor{border:3px solid var(--ink);padding:12px 14px;display:flex;flex-direction:column;gap:2px;margin-bottom:16px}
.ecolist .anchor b{font-size:20px}
.ecolist .anchor .m{font-family:"IBM Plex Mono",monospace;font-size:13px}
.ecolist .cl{border-top:1px solid var(--rule);padding:10px 0}
.ecolist .cl .kt{display:flex;align-items:center;gap:8px;margin:0 0 6px}
.ecolist .row{display:flex;justify-content:space-between;gap:12px;padding:3px 0}
.ecolist .row .mono{font-size:15px;font-weight:600;white-space:nowrap}
.ecolist .cl.empty,.ecolist .cl.empty .kt{color:var(--off)}

/* Firmenliste */
table{width:100%;border-collapse:collapse}
th{font-size:13px;color:var(--sec);font-weight:400;text-align:left;padding:0 0 10px;border-bottom:1px solid var(--ink)}
td{padding:16px 0;border-bottom:1px solid var(--rule);vertical-align:middle;font-variant-numeric:tabular-nums}
th.r,td.r{text-align:right}
th+th,td+td{padding-left:16px}
td.n{font-weight:600}
td.n a{border:0}
td.n a:hover{border-bottom:1px solid var(--ink)}
.tk{color:var(--off);font-size:13px;margin-left:8px;font-weight:400}
.cur{color:var(--sec);font-size:13px;margin-left:4px}
td .nv{font-weight:600;font-family:"IBM Plex Mono",monospace}
td.spark svg{display:inline-block;vertical-align:middle}
section.first{margin-top:8px}

/* Steuerung */
a.more{display:inline-block;margin:0 0 32px;font-size:15px}
.back{display:inline-block;color:var(--sec);font-size:15px;margin-top:32px;border:0 !important}
.back + h1{margin-top:12px}
.pills{display:flex;gap:8px;margin-top:8px}
.pills a{border:1px solid var(--ctx);border-radius:999px;padding:4px 12px;font-size:14px;color:var(--sec)}
.pills a.on{border-color:var(--ink);color:var(--ink)}
.sel{margin-top:24px}
.sel .k{font-size:14px;color:var(--sec)}
.sel .big{margin-top:4px}
.sel .d{font-size:15px}

/* Quellen: ein <details> am Seitenende */
details.src{border-top:1px solid var(--rule);padding:14px 0;font-size:14px;color:var(--sec)}
details.src>summary{cursor:pointer;color:var(--ink)}
.srcbody{margin-top:12px;color:var(--sec);font-size:13px;line-height:1.5;max-width:100%;overflow-x:auto}
.srcbody ul{list-style:none}
.srcbody li{padding:6px 0;border-bottom:1px solid var(--rule)}
.srcbody .sl{color:var(--ink)}
.srcbody .sx,.srcbody .calc,.srcbody .loc{font-style:italic;word-break:break-word}
.srcbody a{color:var(--sec)}
.srcnote{margin:8px 0}
dl.dl{display:grid;grid-template-columns:140px minmax(0,1fr);gap:6px 16px}
dl.dl dt{color:var(--off)} dl.dl dd{color:var(--ink);word-break:break-word}
.kt{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--sec);margin:16px 0 6px}
table.vers td,table.vtab td{padding:6px 12px 6px 0;font-size:13px}
table.vtab th{font-size:12px;padding:0 12px 6px 0}
tr.old td{color:var(--off)}
tr.on td{font-weight:600;color:var(--ink)}
tr.gap td{color:var(--off)}
.tree .tg{margin-bottom:8px}
.tree ul{list-style:none;columns:2;column-gap:24px}
.tree li{padding:2px 0;break-inside:avoid}
.tree a{border:0;color:var(--ink)}
.tree a.on{font-weight:600;border-bottom:1px solid var(--ink)}

/* Fußzeile: Datenstand + a-Legende */
footer.ft{border-top:1px solid var(--ink);padding-top:10px;font-size:13px;color:var(--sec);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* Login */
.login{max-width:420px}
.login form{margin-top:8px;display:flex;flex-direction:column;gap:10px}
.login label{font-size:14px;color:var(--sec)}
.login input{font:inherit;padding:10px 12px;border:1px solid var(--ink);border-radius:0}
.login button{font:inherit;padding:10px 16px;background:var(--inv-bg);color:var(--inv-fg);border:0;cursor:pointer;align-self:flex-start}
.err{margin:12px 0;color:var(--ink);font-weight:600}

/* Tooltip (tip.js) */
#tip{display:none;position:fixed;z-index:10;max-width:340px;background:var(--surface);border:1px solid var(--ink);padding:6px 9px;font-size:12px;line-height:1.4;pointer-events:none}

/* Draw-in: einmalig 600 ms, Linien und Balken gleichzeitig; Boxen/Zahlen stehen ab 0 ms. Nur mit <html class="anim"> (tip.js). */
.anim svg .gb{transform-box:fill-box;transform-origin:50% 100%;animation:df-grow 600ms cubic-bezier(.2,0,0,1) both}
.anim svg .gb.n{transform-origin:50% 0}
.anim svg .dl{stroke-dasharray:1;stroke-dashoffset:1;animation:df-draw 600ms cubic-bezier(.2,0,0,1) forwards}
@keyframes df-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes df-draw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.anim svg .gb,.anim svg .dl{animation:none;stroke-dasharray:none;stroke-dashoffset:0;transform:none}}
@media print{.anim svg .gb,.anim svg .dl{animation:none;stroke-dasharray:none;transform:none}}

/* Mobil 390 px */
@media (max-width:600px){
  .wrap{padding:24px 20px 24px}
  .only-desk{display:none}.only-mob{display:block}
  h1{font-size:32px;margin-top:28px}
  h2{font-size:21px}
  .big{font-size:40px}
  .big small{display:block;margin:6px 0 0;white-space:normal}
  .hide-s{display:none}
  .tree ul{columns:1}
  dl.dl{grid-template-columns:1fr}
  dl.dl dt{margin-top:6px}
  header.top{flex-wrap:wrap}
}
/* Beziehungen (Radar-Kern) */
.tw{overflow-x:auto;max-width:100%}
table.bez th,table.bez td{padding:10px 24px 10px 0;font-size:14px;vertical-align:top}
table.bez th{padding-top:0}
table.bez th:last-child,table.bez td:last-child{padding-right:0}
table.bez td.mono{white-space:nowrap}
@media (max-width:600px){
  table.bez thead{display:none}
  table.bez,table.bez tbody,table.bez tr{display:block;width:100%}
  table.bez tr{display:flex;flex-wrap:wrap;column-gap:16px;padding:12px 0;border-bottom:1px solid var(--rule)}
  table.bez td{border:0;padding:0 0 4px;font-size:13px;text-align:left}
  table.bez td.t{flex:0 0 100%;color:var(--sec)}
  table.bez td.o{flex:0 0 100%;font-size:15px;font-weight:600;padding-bottom:6px}
  table.bez td:not(.t):not(.o)::before{content:attr(data-l) " ";color:var(--sec);font-family:"IBM Plex Sans",sans-serif;font-weight:400}
}
.wm span{font-weight:400}.wm{letter-spacing:-.02em}
.kgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:30px 40px;border-top:1px solid var(--ink);padding-top:22px}
.kfirm{border-top:1px solid var(--rule);padding-top:12px;scroll-margin-top:20px}.kfirm.on{border-top:2px solid var(--ink)}
.kfirm h3{font-size:15px;font-weight:600}.kfirm h3 a{text-decoration:none}
.kfirm .kt{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:10px 0 2px;font-weight:400}.kfirm .klast{margin:0 0 4px}
.kfirm p.u{font-size:11.5px;color:var(--faint);margin:2px 0 6px}
ul.klist{list-style:none;margin:0;padding:0}ul.klist li{padding:2px 0;font-size:13px;line-height:1.35}
@media (max-width:760px){.kgrid{grid-template-columns:1fr 1fr;gap:24px 18px}}

/* a11y: one visible focus ring everywhere, black, 2px, offset so it also works on black chips */
:focus{outline:none}:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:0}
.skip{position:absolute;left:8px;top:-48px;background:var(--inv-bg);color:var(--inv-fg);padding:8px 12px;z-index:20;text-decoration:none}.skip:focus-visible{top:8px;outline-color:var(--focus)}
/* a11y 16.10.2026: tap targets >= 44 x 44 px on phones (WCAG 2.5.5) for header, nav and footer links; visual size unchanged where possible */
@media (max-width:640px){header.top .brand,header.top nav a,header.top .linkbtn,footer.ft a,.sortsw a{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center}footer.ft .info{position:relative}footer.ft .info::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}}

/* Company list: never break tickers or amounts mid-word (Design 390 px: 'NV DA', '$215. 9B'); search */
table.firmen .tk,table.firmen .nv,table.firmen .cur,table.firmen td.r{white-space:nowrap;font-variant-numeric:tabular-nums}
table.firmen td.r .m{white-space:normal}
@media (max-width:600px){table.firmen td.n a{overflow-wrap:normal;word-break:normal}table.firmen .tk{display:block;margin:2px 0 0}table.firmen td.r .m{font-size:12px}table.firmen th,table.firmen td{padding-right:8px}table.firmen th:last-child,table.firmen td:last-child{display:none}table.firmen{width:100%;table-layout:fixed}table.firmen th:first-child{width:38%}table.firmen td.n a{overflow-wrap:anywhere}table.firmen .nv{font-size:14px}table.firmen td.r .m{display:block;font-size:11px}table.firmen td.r{white-space:normal}table.firmen td.r .nv{white-space:nowrap}.srch button{padding:10px 12px}}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.srch{display:flex;gap:8px;margin:20px 0 8px;max-width:560px}
.srch input{flex:1;min-width:0;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--ink);border-radius:0;background:var(--bg);color:var(--ink)}
.srch button{font:inherit;font-size:16px;padding:10px 16px;border:1px solid var(--ink);background:var(--inv-bg);color:var(--inv-fg);cursor:pointer;white-space:nowrap}
.srch input:focus-visible,.srch button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
footer.ft a{color:inherit;text-decoration:underline;text-underline-offset:2px}   /* axe link-in-text-block: links inside footer text are underlined, not colour-only */

/* Dark mode: footer theme toggle (spec §5): quiet text buttons, pressed = ink + underline; >= 44 px targets on phones. Print stays light (spec §6;
   the dark tokens live in @media screen, so print never sees them). */
.thm{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:2px;font-size:13px;color:var(--sec)}.thm[hidden]{display:none}
.thm::before{content:attr(data-l);margin-right:6px}
.thm button{font:inherit;background:none;color:inherit;border:0;padding:0 4px;cursor:pointer;text-underline-offset:3px}
.thm button:hover{color:var(--ink)}.thm button[aria-pressed=true]{color:var(--ink);text-decoration:underline}
@media (max-width:640px){.thm{align-items:center}.thm button{min-height:44px;min-width:44px}}
@media print{:root{color-scheme:light}.thm{display:none}}
/* question H1 on customers / country / segment pages (SEO spec 2026-10-17): 40px desktop, 28px below 700px so it fits in <= 2 lines at 390 */
.pf-hd h1.qh{font-size:40px;line-height:1.15}
@media(max-width:699px){.pf-hd h1.qh{font-size:28px}}
.hl b.n,.wo-list b{white-space:nowrap}
/* ⓘ disclosure without JS (<details>): tap/Enter/Space toggles; text stays in the HTML. Greyscale, theme vars only. */
details.ii{display:inline-block;position:relative;vertical-align:1px}
details.ii>summary{list-style:none;-webkit-tap-highlight-color:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;box-sizing:border-box;margin-left:6px;border:1px solid var(--g-99);border-radius:50%;background:var(--bg);color:var(--g-66);font:italic 12px 'IBM Plex Serif',Georgia,serif;line-height:1}
details.ii>summary::-webkit-details-marker{display:none}
details.ii>summary:hover,details.ii[open]>summary{border-color:var(--ink);color:var(--ink)}
details.ii>summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
details.ii .ii-t{position:absolute;right:0;top:28px;z-index:5;width:max-content;max-width:min(300px,calc(100vw - 32px));white-space:normal;text-align:left;font-size:12px;line-height:1.4;color:var(--ink);background:var(--surface);border:1px solid var(--ink);padding:6px 9px;font-variant-numeric:normal;overflow-wrap:anywhere}
td.r details.ii{white-space:nowrap}
div.h-ii{margin:40px 0}div.h-ii h1{display:inline;margin:0}div.h-ii details.ii{display:inline;position:static}div.h-ii details.ii>summary{vertical-align:6px;margin-left:8px}div.h-ii details.ii .ii-t{display:block;position:static;width:auto;max-width:36em;margin:8px 0 0;box-sizing:border-box;font-size:13px;padding:10px 12px}
@media (max-width:640px){details.ii>summary{position:relative}details.ii>summary::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}}
/* Row ⓘ in flow at ≤640: the open panel pushes the next row down (real table, no JS) */
@media (max-width:640px){
 table.firmen td details.ii{display:block;position:static;white-space:normal}
 table.firmen td details.ii>summary{margin-left:0;margin-top:4px}
 table.firmen td details.ii .ii-t{display:block;position:static;width:auto;max-width:none;margin:8px 0 2px;box-sizing:border-box;font-size:13px;padding:10px 12px}
 table.firmen tr:has(>td details.ii[open])>td{vertical-align:top}
}
@media (max-width:600px){
 /* full row width: 40px = page padding 2×20, .38 = first column (600px rule), 16px = td padding-left */
 table.firmen td details.ii .ii-t{width:calc(100vw - 40px);margin-left:calc(-.38*(100vw - 40px) - 16px)}
}
.cur:empty{display:none}
/* /companies 'Period' column: break only at the dash, never inside 'Q2 FY2027' (601-700 px broke letter by letter) */
table.firmen td.per span{white-space:nowrap}
