.iso{
  --anatomy-page:#0b0b0b;--anatomy-card:#131313;--anatomy-text:#a3a3a3;--anatomy-strong:#e6e6e6;--anatomy-muted:#6e6e6e;
  --anatomy-paper:#131313;--anatomy-face:#1b1b1b;--anatomy-top:#1c1c1c;
  --anatomy-shade-0:#0f0f0f;--anatomy-shade-1:#121212;--anatomy-shade-2:#151515;--anatomy-shade-3:#181818;
  --anatomy-lit-top:#262626;--anatomy-lit-shade:#1d1d1d;
  --anatomy-hi:#d4d4d4;--anatomy-mid:#6a6a6a;--anatomy-lo:#3e3e3e;--anatomy-faint:#2a2a2a;--anatomy-lit:#ffffff;
  --anatomy-halo:#050505;--anatomy-halo-opacity:.9;--anatomy-dot:#e6e6e6;
  --anatomy-red:#ff6b6b;--anatomy-green:#6be0a0;--anatomy-blue:#6b9bff;
  --anatomy-weight:.6px;--anatomy-ease:cubic-bezier(.32,.72,0,1);
  --anatomy-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --anatomy-lift:inset 0 1px 0 0 #ffffff0a,inset 0 0 0 1px #ffffff06,0 0 0 1px #00000026,0 1px 1px -.5px #00000014,0 3px 3px -1.5px #00000014,0 6px 6px -3px #00000014,0 12px 12px -6px #00000014;
}
.iso[data-theme="light"]{
  --anatomy-page:#f2f2ef;--anatomy-card:#fbfbfa;--anatomy-text:#57575a;--anatomy-strong:#18181a;--anatomy-muted:#8c8c90;
  --anatomy-paper:#fbfbfa;--anatomy-face:#ffffff;--anatomy-top:#ffffff;
  --anatomy-shade-0:#dcdcd9;--anatomy-shade-1:#e5e5e2;--anatomy-shade-2:#ededea;--anatomy-shade-3:#f4f4f1;
  --anatomy-lit-top:#ffffff;--anatomy-lit-shade:#eeeeeb;
  --anatomy-hi:#26262a;--anatomy-mid:#8a8a8f;--anatomy-lo:#b4b4b8;--anatomy-faint:#d4d4d6;--anatomy-lit:#000000;
  --anatomy-halo:#8a8a80;--anatomy-halo-opacity:.32;--anatomy-dot:#3a3a3e;
  --anatomy-red:#e5484d;--anatomy-green:#30a46c;--anatomy-blue:#3e63dd;
  --anatomy-lift:inset 0 1px 0 0 #ffffff,0 0 0 1px #0000000f,0 1px 1px -.5px #0000000a,0 3px 3px -1.5px #0000000a,0 6px 6px -3px #0000000a,0 12px 12px -6px #0000000a;
}
.iso-svg{display:block;width:100%;height:auto;overflow:visible}
.iso-svg path,.iso-svg circle{vector-effect:non-scaling-stroke}
.iso-fill{fill:var(--anatomy-paper);stroke:none}
.iso-solid[data-lit]>.iso-fill{fill:var(--anatomy-face)}
.iso-shade,.iso-top{stroke:none}
.iso-shade[data-shade="0"]{fill:var(--anatomy-shade-0)}
.iso-shade[data-shade="1"]{fill:var(--anatomy-shade-1)}
.iso-shade[data-shade="2"]{fill:var(--anatomy-shade-2)}
.iso-shade[data-shade="3"]{fill:var(--anatomy-shade-3)}
.iso-top{fill:var(--anatomy-top)}
.iso-solid[data-lit]>.iso-top{fill:var(--anatomy-lit-top)}
.iso-solid[data-lit]>.iso-shade{fill:var(--anatomy-lit-shade)}
.iso-solid[data-seamless]>.iso-shade,.iso-solid[data-seamless]>.iso-top{stroke-width:.4;stroke-linejoin:round}
.iso-solid[data-seamless]>.iso-shade[data-shade="0"]{stroke:var(--anatomy-shade-0)}
.iso-solid[data-seamless]>.iso-shade[data-shade="1"]{stroke:var(--anatomy-shade-1)}
.iso-solid[data-seamless]>.iso-shade[data-shade="2"]{stroke:var(--anatomy-shade-2)}
.iso-solid[data-seamless]>.iso-shade[data-shade="3"]{stroke:var(--anatomy-shade-3)}
.iso-solid[data-seamless]>.iso-top{stroke:var(--anatomy-top)}
.iso-solid[data-seamless][data-lit]>.iso-top{stroke:var(--anatomy-lit-top)}
.iso-solid[data-seamless][data-lit]>.iso-shade{stroke:var(--anatomy-lit-shade)}
.iso-solid[data-lit]>.iso-edge{stroke:var(--anatomy-lit)}
.iso-halo{fill:var(--anatomy-halo);stroke:none;filter:blur(9px);opacity:var(--anatomy-halo-opacity);transform:translateY(3px)}
.iso-line{fill:none;stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight);stroke-linecap:round;stroke-linejoin:round}
.iso-line[data-tone="hi"]{stroke:var(--anatomy-hi)}
.iso-line[data-tone="mid"]{stroke:var(--anatomy-mid)}
.iso-line[data-tone="lo"]{stroke:var(--anatomy-lo)}
.iso-line[data-tone="faint"]{stroke:var(--anatomy-faint)}
.iso-line[data-tone="lit"]{stroke:var(--anatomy-lit)}
.iso-line[data-tone="red"]{stroke:var(--anatomy-red)}
.iso-line[data-tone="green"]{stroke:var(--anatomy-green)}
.iso-line[data-tone="blue"]{stroke:var(--anatomy-blue)}
.iso-line[data-dotted]{stroke-dasharray:.01 3.5;stroke-width:1}
.iso-line[data-dashed]{stroke-dasharray:3 3}
.iso-line[data-flow]{stroke-dasharray:2 6}
.iso-wire-end{fill:var(--anatomy-paper);stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight)}
.iso-wire[data-tone="hi"] .iso-wire-end{stroke:var(--anatomy-hi)}
.iso-wire[data-tone="mid"] .iso-wire-end{stroke:var(--anatomy-mid)}
.iso-wire[data-tone="faint"] .iso-wire-end{stroke:var(--anatomy-faint)}
.iso-wire[data-tone="lit"] .iso-wire-end{stroke:var(--anatomy-lit)}
.iso-dots circle{fill:var(--anatomy-dot);stroke:none;opacity:.32}
.iso-dots[data-tone="hi"] circle{opacity:.85}
.iso-dots[data-tone="mid"] circle{opacity:.45}
.iso-dots[data-tone="lo"] circle{opacity:.22}
.iso-dots[data-tone="faint"] circle{opacity:.12}
.iso-face-text{fill:var(--anatomy-mid);font-family:var(--anatomy-mono);letter-spacing:.04em}
.iso-face-text[data-tone="hi"]{fill:var(--anatomy-hi)}
.iso-face-text[data-tone="lo"]{fill:var(--anatomy-lo)}
.iso-face-text[data-tone="faint"]{fill:var(--anatomy-faint)}
.tb-body{fill:var(--anatomy-shade-2);stroke:none}
.tb-shine{fill:var(--anatomy-top);stroke:none}
.tb-shade{fill:var(--anatomy-shade-0);stroke:none}
.tb-ring{fill:none;stroke:var(--anatomy-lo);stroke-width:.45;stroke-linecap:butt;stroke-linejoin:round}
.tb-ring[data-tone="mid"]{stroke:var(--anatomy-mid)}
.tb-ring[data-tone="faint"]{stroke:var(--anatomy-faint)}
.tb-ring[data-tone="hi"]{stroke:var(--anatomy-hi)}
@keyframes iso-flow{to{stroke-dashoffset:-32}}
@keyframes iso-pulse{0%,100%{opacity:.18}12%{opacity:1}40%{opacity:.18}}
.iso-line[data-flow]{animation:iso-flow 1600ms linear infinite}
.iso-dots circle[data-pulse]{animation:iso-pulse 1600ms steps(1,end) infinite;animation-delay:var(--pulse-at,0ms)}
.iso-figure{margin:32px 0 36px}
.iso-plate{position:relative;padding:52px 24px;border-radius:0;background:var(--anatomy-card);box-shadow:0 0 0 1px var(--anatomy-mid);--anatomy-paper:var(--anatomy-card)}
.iso-plate-corners{position:absolute;inset:18px 20px;pointer-events:none}
.iso-plate-corner{position:absolute;color:var(--anatomy-muted);font-family:var(--anatomy-mono);font-size:10.5px;line-height:1;letter-spacing:.04em;white-space:nowrap}
.iso-plate-corner[data-corner="fig"]{top:0;left:0;color:var(--anatomy-text)}
.iso-plate-corner[data-corner="title"]{top:0;right:0;text-transform:uppercase;letter-spacing:.1em}
.iso-plate-corner[data-corner="hint"]{bottom:0;left:0;text-transform:uppercase;letter-spacing:.1em}
.iso-plate-corner[data-corner="readout"]{right:0;bottom:0;color:var(--anatomy-text);font-variant-numeric:tabular-nums}
.iso-plate .iso-svg{margin:0 auto}
.iso-legend{display:grid;gap:8px;margin-top:12px;color:var(--anatomy-muted);font-size:13px;line-height:1.55}
.iso-keys{display:flex;flex-wrap:wrap;gap:6px 18px}
.iso-key{display:inline-flex;align-items:center;gap:7px}
.iso-swatch{width:16px;height:10px;flex:none;overflow:visible}
.iso-swatch path{fill:none;stroke:var(--anatomy-hi);stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.iso-swatch[data-mark="raised"] path,.iso-swatch[data-mark="flat"] path{stroke:var(--anatomy-mid)}
.iso-swatch[data-mark="lit"] path{stroke:var(--anatomy-lit)}
.iso-swatch[data-mark="dim"] path{stroke:var(--anatomy-lo)}
.iso-swatch[data-mark="dotted"] path{stroke-dasharray:.01 3;stroke-width:1.4}
.iso-swatch[data-mark="dashed"] path{stroke-dasharray:3 2.5}
.iso-swatch[data-mark="red"] path{stroke:var(--anatomy-red)}
.iso-swatch[data-mark="green"] path{stroke:var(--anatomy-green)}
.iso-swatch[data-mark="blue"] path{stroke:var(--anatomy-blue)}
.iso-swatch-crease{stroke:var(--anatomy-lo)!important}
@media (max-width:560px){.iso-plate{padding:48px 12px 70px}.iso-plate-corner[data-corner="hint"]{bottom:18px}}
@media (prefers-reduced-motion:reduce){.iso-line[data-flow],.iso-dots circle[data-pulse]{animation:none}}

/* Farben der Website: Papier = Seitenhintergrund, einziger Akzent = Signalrot */
.cm-anatomy.iso{
  --anatomy-page:#0A0A0A;--anatomy-card:#0A0A0A;--anatomy-paper:#0A0A0A;--anatomy-face:#121212;--anatomy-top:#141414;
  --anatomy-shade-0:#070707;--anatomy-shade-1:#0a0a0a;--anatomy-shade-2:#0d0d0d;--anatomy-shade-3:#101010;
  --anatomy-lit-top:#3a0a0a;--anatomy-lit-shade:#260707;--anatomy-lit:var(--c,#D00000);
  --anatomy-hi:#d0d0d0;--anatomy-mid:#686868;--anatomy-lo:#3a3a3a;--anatomy-faint:#242424;
  --anatomy-halo:#000;--anatomy-halo-opacity:.85;--anatomy-text:var(--dim-l,#a3a3a3);--anatomy-muted:var(--dim,#6e6e6e);
}
html[data-theme="light"] .cm-anatomy.iso{
  --anatomy-page:#f5f4f2;--anatomy-card:#f5f4f2;--anatomy-paper:#f5f4f2;--anatomy-face:#fdfcfa;--anatomy-top:#fdfcfa;
  --anatomy-shade-0:#d8d7d3;--anatomy-shade-1:#e1e0dc;--anatomy-shade-2:#e9e8e4;--anatomy-shade-3:#efeeea;
  --anatomy-lit-top:#f0b4b4;--anatomy-lit-shade:#e39a9a;
  --anatomy-hi:#26262a;--anatomy-mid:#8a8a8f;--anatomy-lo:#b2b2b6;--anatomy-faint:#d2d2d4;
  --anatomy-halo:#8a8a80;--anatomy-halo-opacity:.3;--anatomy-dot:#3a3a3e;
}
.cm-anatomy-track{margin-top:clamp(48px,6vw,88px)}
.cm-anatomy{--w:min(1240px,calc(100vw - 48px),calc((100svh - 300px) * var(--arn,1.778)));width:var(--w);max-width:none;margin:0 0 0 calc(50% - var(--w) / 2);text-align:left}
/* Sticky-Scrub: Die Figur bleibt stehen, während der Abschnitt weiterscrollt.
   Nur mit JavaScript und ohne reduzierte Bewegung (Klasse setzt js/anatomy.js). */
.cm-anatomy-track.is-sticky::after{content:'';display:block;height:var(--travel,110vh)}
/* Gezählte Stockmusik-Hüllen werden matt, so zeigt das Endbild 13 von 21 */
.cm-anatomy [data-kind="s"][data-counted="1"] .iso-edge,.cm-anatomy [data-kind="s"][data-counted="1"] .iso-crease{stroke:var(--anatomy-faint);transition:stroke .3s}
.cm-anatomy .iso-stage{contain:paint}
.cm-anatomy-track.is-sticky .cm-anatomy{position:sticky;top:var(--stick,12vh)}
.cm-anatomy .iso-stage{aspect-ratio:var(--ar,16/9);width:100%}
.cm-anatomy .iso-stage svg{display:block;width:100%;height:auto}
/* Text unter der Figur steht im Raster der Kennzahlen darunter (.stats-row):
   gleiche Breite, gleicher Rand, drei Spalten mit gleichem Abstand. */
.cm-fig-text{--cw:min(1200px,100vw);width:var(--cw);margin-left:calc(50% - var(--cw) / 2);padding:0 clamp(24px,4vw,64px);box-sizing:border-box}
.cm-fig-meta{display:flex;justify-content:space-between;gap:16px;margin-top:8px;font-family:var(--anatomy-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--anatomy-muted);font-variant-numeric:tabular-nums}
.cm-fig-meta [data-readout]{color:var(--fg,#fff);text-transform:none;letter-spacing:.02em}
.cm-fig-meta span{white-space:nowrap}
.cm-fig-cap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px clamp(24px,4vw,48px);margin-top:28px}
.cm-fig-copy{grid-column:1 / span 2}
.cm-fig-legend{grid-column:3}
.cm-fig-lead{font-family:var(--serif,serif);font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.15;color:var(--fg,#fff);margin:0 0 10px}
.cm-fig-body{font-size:1rem;line-height:1.7;color:var(--dim-l,#a3a3a3);margin:0;max-width:60ch}
.cm-fig-keys{list-style:none;margin:6px 0 14px;padding:0;display:grid;gap:8px;font-size:.92rem;color:var(--fg,#fff)}
.cm-fig-keys li{display:flex;align-items:center;gap:10px}
.cm-fig-keys i{width:16px;height:11px;border:1px solid var(--anatomy-lo);flex:none}
.cm-fig-keys i[data-key="own"]{border-color:var(--anatomy-hi)}
.cm-fig-keys i[data-key="red"]{border-color:var(--c,#D00000);background:var(--c,#D00000)}
.cm-fig-src{font-size:.8rem;line-height:1.6;color:var(--dim,#6e6e6e);margin:0}
@media(max-width:820px){.cm-fig-cap{grid-template-columns:1fr;gap:18px;text-align:center;justify-items:center}.cm-fig-copy,.cm-fig-legend{grid-column:auto}.cm-fig-body{margin:0 auto}.cm-fig-keys{justify-items:center}.cm-fig-keys li{justify-content:center;width:fit-content;max-width:100%;text-align:left}.cm-fig-meta{flex-wrap:wrap;justify-content:center;row-gap:6px;column-gap:14px;text-align:center}.cm-fig-meta span{white-space:normal}}
@media(max-width:600px){.cm-anatomy-track{margin-top:40px}.cm-anatomy .iso-stage{margin:0 calc(50% - 50% * var(--mz,1.14));width:calc(100% * var(--mz,1.14))}}
/* Figuren in Blog und Case Studies: Regeln des Artikeltexts nicht übernehmen */
.cm-inline-fig{margin:clamp(40px,6vw,72px) 0}
main .cm-inline-fig .cm-fig-lead{font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.15;color:var(--fg,#fff);margin:0 0 10px}
main .cm-inline-fig .cm-fig-body{font-size:1rem;line-height:1.7;color:var(--dim-l,#a3a3a3);margin:0;max-width:60ch}
main .cm-inline-fig .cm-fig-src{font-size:.8rem;line-height:1.6;color:var(--dim,#6e6e6e);margin:0}
main .cm-inline-fig .cm-fig-keys{list-style:none;padding:0;margin:6px 0 14px}
main .cm-inline-fig .cm-fig-keys li{font-size:.92rem;line-height:1.5;color:var(--fg,#fff);margin:0}
@media(max-width:820px){main .cm-inline-fig .cm-fig-body{margin:0 auto}}

/* Mischpult: Displayglas bleibt in beiden Themes dunkel, Logos leuchten weiß */
.cm-anatomy{--cm-glass:#030303;--cm-glass-in:#000}
html[data-theme="light"] .cm-anatomy{--cm-glass:#2a2a2c;--cm-glass-in:#141416}
.cm-anatomy .cm-glass{fill:var(--cm-glass)}
.cm-anatomy .cm-glass-in{fill:var(--cm-glass-in)}
.cm-anatomy .cm-grille{stroke:var(--cm-glass-in);stroke-width:.7px;fill:none;vector-effect:non-scaling-stroke}
.cm-anatomy .cm-meter{fill:#e8e8e8}
.cm-anatomy .cm-meter.cm-own{fill:var(--c,#D00000);opacity:0;transition:opacity .3s}
.cm-anatomy.cm-own-on .cm-meter.cm-own{opacity:1}
.cm-anatomy .cm-logo{opacity:.22;transition:opacity .35s var(--ease,ease)}
.cm-anatomy .cm-logo[data-on]{opacity:1}
.cm-anatomy .cm-own-text{fill:var(--c,#D00000);font:600 3.4px/1 var(--anatomy-mono);letter-spacing:.3px}
.cm-anatomy .cm-logo.cm-own{opacity:.12}
.cm-anatomy .cm-logo.cm-own[data-on]{opacity:1}
.cm-anatomy .cm-nums text{fill:var(--anatomy-muted);font:500 1.9px/1 var(--anatomy-mono)}
.cm-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cm-fig-cta{display:inline-flex;align-items:center;gap:10px;margin-top:16px;padding:12px 26px;border-radius:100px;background:var(--c,#D00000);color:#fff;font-weight:600;font-size:.95rem;text-decoration:none}
@media(hover:hover){.cm-fig-cta:hover{filter:brightness(1.08)}}
.cm-kanaele{position:relative;z-index:2;padding:clamp(48px,7vw,96px) clamp(24px,5vw,64px) clamp(80px,12vw,160px)}
.cm-kanaele .cm-anatomy-track{margin-top:0}
/* Pult größer: Stage breiter als der Textblock, auf dem Handy fast randlos */
.cm-kanaele .cm-anatomy{--w:min(1360px,calc(100vw - 24px),calc((100svh - 260px) * var(--arn,2)))}
@media(max-width:600px){.cm-kanaele .cm-anatomy .iso-stage{margin:0 -4%;width:108%}}
.cm-kanaele .cm-anatomy-track.is-sticky::after{height:90vh}

/* Fig. 4 Pfanne: REC-Licht ist das einzige Rot */
.cm-anatomy .cm-rec{fill:var(--c,#D00000);opacity:.14;transition:opacity .25s}
.cm-anatomy .cm-rec[data-on]{opacity:1}
.cm-anatomy [data-part="glow"] path{transition:stroke .3s}
.cm-anatomy .cm-done{opacity:.12;transition:opacity .3s}
.cm-anatomy .cm-done[data-on]{opacity:1}
.cm-anatomy .cm-cap[data-on] .iso-edge{stroke:var(--c,#D00000)}
.cm-anatomy .cm-cap[data-on] .iso-top,.cm-anatomy .cm-cap[data-on] .iso-shade{fill:var(--anatomy-lit-top)}
.cm-anatomy .cm-script{transition:stroke .25s}
.cm-anatomy .cm-script[data-state="now"]{stroke:var(--c,#D00000)}
.cm-anatomy .cm-script[data-state="done"]{stroke:var(--anatomy-hi)}
.cm-anatomy .cm-vu-face{fill:#e9e3d3}
html[data-theme="light"] .cm-anatomy .cm-vu-face{fill:#f3eee2}
.cm-anatomy .cm-target{fill:var(--c,#D00000)}
.cm-anatomy .cm-spk{opacity:.1}
.cm-anatomy .cm-motif{fill:var(--c,#D00000);opacity:.08;transition:opacity .3s}
.cm-anatomy .cm-motif[data-on]{opacity:1}
.cm-anatomy .cm-wire{opacity:.35;transition:opacity .3s}
.cm-anatomy .cm-wire[data-on]{opacity:1}

/* Fig. 1 musicproduc.ing: Referenz-Mastering */
.cm-anatomy .cm-grid{stroke:rgba(255,255,255,.09);stroke-width:.5px;fill:none;vector-effect:non-scaling-stroke}
.cm-anatomy .cm-ref-line{stroke:var(--c,#D00000);stroke-width:1.1px;stroke-dasharray:2.5 2;fill:none;vector-effect:non-scaling-stroke}
.cm-anatomy .cm-curve{stroke:#e8e8e8;stroke-width:1.1px;fill:none;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cm-anatomy .cm-ceil{fill:#e8e8e8}
.cm-fig-sat{padding:clamp(24px,4vw,48px) 0 clamp(64px,9vw,120px)}
.cm-fig-sat .cm-anatomy-track{margin-top:0}

/* Fig. 1 audiobrand.ing: Sonic Score */
.cm-anatomy .cm-lamp{fill:var(--anatomy-faint);transition:fill .25s}
.cm-anatomy .cm-lamp[data-on]{fill:#e8e8e8}
.cm-anatomy .cm-lamp.cm-lamp-q[data-on]{fill:var(--anatomy-mid)}
.cm-anatomy .cm-scale{stroke:#3a3a3a;stroke-width:.7px;fill:none;vector-effect:non-scaling-stroke}
.cm-anatomy .cm-needle{stroke:var(--c,#D00000);stroke-width:1.4px;stroke-linecap:round;fill:none;vector-effect:non-scaling-stroke}