/* tabua-anim.css – Rechnung auf der Matrix 441 (P1) und Gesamtbild der Aktivierung (P2), js/tabua-anim.js */
.ta{--ta-t:#9be15d;--ta-e:#fff04d;--ta-s:#ffb627;--ta-gold:var(--gold,#e3bf6e)}
.ta .mx-ov,.ta .mx-mks{pointer-events:none}

/* ---------- Steuerung ---------- */
.ta-top{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px}
.ta-ctrl{display:flex;align-items:center;gap:8px}
.ta-ctrl .icon-btn{cursor:pointer;font-size:13px}
.ta-ctrl .icon-btn:disabled{opacity:.35;cursor:default;border-color:var(--line);color:var(--text)}
.ta-play{min-width:128px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;font-size:13px}
.ta-play em{font-style:normal}
.ta-play[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:rgba(227,191,110,.12)}
.ta-prog{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.ta-prog button{display:flex;align-items:center;gap:7px;padding:6px 11px 6px 6px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);font:500 12.5px/1.2 var(--font);cursor:pointer;white-space:nowrap}
.ta-prog button i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:700 11px var(--font);font-style:normal;background:rgba(255,255,255,.07);color:var(--faint)}
.ta-prog button b{font-weight:700;color:var(--text)}
.ta-prog button:hover{border-color:var(--gold);color:var(--text)}
.ta-prog button.done i{background:rgba(227,191,110,.25);color:var(--gold)}
.ta-prog button[aria-current]{border-color:var(--gold);background:rgba(227,191,110,.14);color:var(--text);box-shadow:0 0 18px -6px rgba(227,191,110,.7)}
.ta-prog button[aria-current] i{background:var(--gold);color:#1a1405}
.ta-bar{height:4px;border-radius:4px;background:rgba(255,255,255,.07);margin:16px 0 0;overflow:hidden}
.ta-bar i{display:block;height:100%;width:calc(var(--ta-p,0) * 100%);background:linear-gradient(90deg,var(--violet),var(--gold),var(--cyan));border-radius:4px;transition:width .5s ease}
.ta-cap{margin:14px 0 16px;color:var(--text);font-size:15.5px;line-height:1.6;min-height:3.2em}
.ta-cap b{color:var(--gold)}
.ta-cap .ta-n{color:var(--muted);font-weight:600;margin-right:4px}
.ta-keys{margin-top:14px}

/* ---------- Bühne ---------- */
.ta-view{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:18px;align-items:start}
.ta-mx .mx-host{max-width:760px}
.ta-mx .tb-mx-head h3{font-size:15px}
.ta-stage{min-height:200px}
.ta-stage svg.mx{animation:ta-in .55s ease both}
.ta-info{display:grid;gap:10px;align-content:start}
.ta-iv{padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.035);min-width:0}
.ta-iv small{display:block;font:600 10.5px/1.25 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:7px}
.ta-iv b{display:block;font:700 24px/1.15 var(--font);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ta-iv span{display:block;font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.35}
.ta-iv.k-ph b{color:#e3bf6e}.ta-iv.k-t b{color:var(--ta-t)}.ta-iv.k-e b{color:var(--ta-e)}.ta-iv.k-s b{color:var(--ta-s)}
.ta-iv.k-m{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.07)}.ta-iv.k-m b{color:#fff}
.ta-iv.k-ke b{color:#b9a3ff}.ta-iv.k-psi b{color:#7fe3c4}
.ta-count b{font-size:34px;color:var(--gold)}
.ta-iv b span.ta-cnt{display:inline;font-size:inherit;color:inherit;margin:0}

/* Leuchten, Vorpunkte, Werte-Abzeichen (SVG) */
.ta-glow{opacity:.34;filter:blur(5px);animation:ta-pulse 1.8s ease-in-out infinite}
.ta .mx-mks .mx-ring,.ta .mx-mks .mx-tag{animation:ta-pop .5s .3s cubic-bezier(.2,1.6,.4,1) both;transform-box:fill-box;transform-origin:center}
.ta .mx-mks .mx-ring{stroke-width:3}
.ta-prev circle{stroke:#0d1130;stroke-width:1.5}
.ta-prev text{font:700 7.5px var(--font);fill:#111;text-anchor:middle;pointer-events:none}
.ta-prev text.w2{font-size:6px;letter-spacing:-.02em}
.ta-badge rect{stroke:#0d1130;stroke-width:2;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
.ta-badge text{font:800 30px var(--font);fill:#111;text-anchor:middle;font-variant-numeric:tabular-nums}
.ta-badge{animation:ta-pop .5s .25s cubic-bezier(.2,1.6,.4,1) both;transform-box:fill-box;transform-origin:center}
.ta-axis{fill:rgba(227,191,110,.06);stroke:rgba(227,191,110,.75);stroke-width:1.6;stroke-dasharray:5 4}
.ta-gate{fill:none;stroke:#e3bf6e;stroke-width:1.6;stroke-dasharray:3 2.5}
.ta-spiral{fill:none;stroke:rgba(227,191,110,.22);stroke-width:1.2;stroke-linejoin:round}
.ta-trail{fill:none;stroke:#e3bf6e;stroke-width:3;stroke-linejoin:round;stroke-linecap:round;opacity:.9;filter:drop-shadow(0 0 3px rgba(227,191,110,.8))}
.ta-dot{fill:#fff;stroke:#e3bf6e;stroke-width:3;filter:drop-shadow(0 0 6px #fff)}
.ta-mx.pending .mx-mks,.ta-mx.pending .ta-end{opacity:0}
.ta-mx .mx-mks,.ta-mx .ta-end{transition:opacity .4s}

/* Schritt 5: drei Matrizen wie Blatt 05 */
.ta-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ta-m3 .tb-mx-head{gap:6px 10px}
.ta-m3 .tb-mx-head h3{font-size:14px}
.ta-m3 .tb-mx-legend{display:none}
.ta-m3 .tb-mx-zoom{padding:5px 10px;font-size:11px}
.ta-stage [data-col]{transition:opacity .45s ease}
.ta-stage .ta-m3[data-col]:not(.on){opacity:.18}
.ta-sum td[data-col]:not(.on),.ta-sum th[data-col]:not(.on){opacity:.2}
.ta-sum .ta-ift [data-col]:not(.on){display:none}
.ta-sum .ta-ift i{font-style:normal;font-weight:500;color:var(--muted)}
.ta-sum .ta-ift b{color:var(--gold);font-size:16px}
.ta-sum{margin-top:16px}
.ta-sum tr.sum b{color:var(--gold);font-size:16px}
.ta-sum .ta-s{display:none}
.ta-pt{display:inline-grid;place-items:center;min-width:30px;height:24px;padding:0 7px;border-radius:7px;font:700 12px var(--font);color:#111}
.ta-pt.k-t{background:var(--ta-t)}.ta-pt.k-e{background:var(--ta-e)}.ta-pt.k-s{background:var(--ta-s)}

/* Ergebniskette */
.ta-chain{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.ta-ch{display:grid;gap:2px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);min-width:64px;opacity:.32;transition:opacity .4s,border-color .4s}
.ta-ch.on{opacity:1}
.ta-ch small{font:600 10px/1.2 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.ta-ch b{font:700 18px/1.15 var(--font);font-variant-numeric:tabular-nums}
.ta-ch em{font-style:normal;font-size:11px;color:var(--muted)}
.ta-ch.k-ph.on{border-color:#e3bf6e}.ta-ch.k-t.on{border-color:var(--ta-t)}.ta-ch.k-e.on{border-color:var(--ta-e)}.ta-ch.k-s.on{border-color:var(--ta-s)}
.ta-ch.k-m.on{border-color:#fff}.ta-ch.k-ke.on{border-color:#b9a3ff}.ta-ch.k-psi.on{border-color:#7fe3c4}

@keyframes ta-in{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@keyframes ta-pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
@keyframes ta-pulse{50%{opacity:.14}}

/* ---------- P2 Gesamtbild ---------- */
/* Reiter „Originalgrafik | Rechenansicht“: css/mx.css */
.ta-orig h3{margin-bottom:6px}
.ta-vpanel[hidden],.ta-opts[hidden]{display:none}
.ta-opts{display:grid;gap:10px}
.ta-seg{display:flex;flex-wrap:wrap;gap:6px}
.ta-seg .chip[aria-pressed=true]{border-color:var(--gold);color:#1a1405;background:var(--gold)}
.ta-seg .ta-tg[aria-pressed=true]{color:var(--gold);background:rgba(227,191,110,.14)}
.ta-seg .ta-tg[aria-pressed=true]::before{content:'✓ '}
.ta-full .mx-c.mk text{font-size:9.5px}
.ta-full .mx-c.mk text.sm{font-size:7px}
.ta-full .mx-c.ta-on rect:first-child{stroke:#fff;stroke-width:2.6}
.ta-full .mx-mk.ta-on .mx-ring{stroke-width:4.2}
.ta-full .mx-mks .mx-ring{stroke-width:2.6}
.ta-axwrap{max-width:842px;margin:0 auto}
.ta-axwrap .mx-host{max-width:none}
.ta-ax-top,.ta-ax-left{display:none}
.ta-axwrap.on{display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-areas:". top" "left mx"}
.ta-axwrap.on .mx-host{grid-area:mx}
.ta-axwrap.on .ta-ax-top{grid-area:top;display:grid;grid-template-columns:22fr 210fr 210fr 210fr 4fr;gap:0;margin-bottom:4px}
.ta-axwrap.on .ta-ax-left{grid-area:left;display:grid;grid-template-rows:22fr 210fr 210fr 210fr 4fr}
.ta-ax-top span{text-align:center;padding:4px 4px 5px;border-bottom:2px solid rgba(227,191,110,.35);min-width:0;margin:0 3px}
.ta-ax-top span:first-child,.ta-ax-top span:last-child,.ta-ax-left span:first-child,.ta-ax-left span:last-child{border:0;margin:0;padding:0}
.ta-ax-top b{display:block;font:700 12.5px/1.2 var(--font);color:var(--text)}
.ta-ax-top small{display:block;font-size:10.5px;line-height:1.25;color:var(--faint)}
.ta-ax-left span{display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;transform:rotate(180deg);border-left:2px solid rgba(123,92,196,.6);margin:3px 0}
.ta-ax-left b{font:700 11.5px/1 var(--font);color:var(--text);letter-spacing:.06em;white-space:nowrap}
.ta-blk{stroke:rgba(227,191,110,.75);stroke-width:2.4}
.ta-esf-b circle.o{fill:#ffc000;stroke:#0d1130;stroke-width:1.5}
.ta-esf-b circle.b{fill:#5b9bd5;stroke:#0d1130;stroke-width:1.5}
.ta-esf-b text{font:800 11px var(--font);fill:#111;text-anchor:middle}
.ta-psi{fill:none;stroke-width:2;stroke-dasharray:3.5 2.5}
.ta-psi.p{stroke:#7fe3c4}.ta-psi.e{stroke:#ff9ad5}
.ta-sun{fill:none;stroke:#f3f1ea;stroke-width:1.8}
.ta-ray{stroke:#f3f1ea;stroke-width:1.6;stroke-linecap:round}
.ta-hk{stroke-width:1.5;stroke-opacity:.55}
.ta-hk.on{stroke-width:3;stroke-opacity:1}
.ta-hk-today{stroke:#fff;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 4px rgba(255,255,255,.9))}
.ta-st{fill:none;stroke:rgba(220,225,255,.6);stroke-width:1.4}
.ta-st.on{stroke:#e3bf6e;stroke-width:2.6;filter:drop-shadow(0 0 4px rgba(227,191,110,.8))}
/* Bereichsbeschriftungen („Grupos da planilha“): halbtransparent, unter den Punktmarken; ohne freien Platz blasser */
.ta-gl{opacity:.9;pointer-events:none}
.ta-gl.dim{opacity:.5}
.ta-gl circle{fill:#e3bf6e}
.ta-gl line{stroke:#e3bf6e;stroke-width:1;stroke-dasharray:2 2;stroke-opacity:.7}
.ta-gl rect{fill:rgba(7,10,28,.72);stroke:#e3bf6e;stroke-width:1}
.ta-gl text{font:700 8.4px var(--font);fill:#f3f1ea;letter-spacing:.02em}
.ta-leg2{margin-top:12px}
.ta-esf-l{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ta-esf-l li{display:grid;grid-template-columns:auto auto 1fr;gap:6px;align-items:start;padding:10px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:12.5px;min-width:0}
.ta-esf-l i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:800 11px var(--font);font-style:normal;color:#111}
.ta-esf-l i.o{background:#ffc000}.ta-esf-l i.b{background:#5b9bd5}
.ta-esf-l span{min-width:0;color:var(--muted)}
.ta-esf-l b{color:var(--text)}
.ta-esf-l small{display:block;color:var(--faint);font-size:11.5px;margin-top:2px}
.ta-tab{min-width:860px;font-size:13px}
.ta-tab .ta-grp th{background:rgba(123,92,196,.22);color:var(--gold);font:600 11px/1.3 var(--font);letter-spacing:.08em;text-transform:none;text-align:left}
.ta-tab tr.ta-on td{background:rgba(227,191,110,.13)}
.ta-tab tr.ta-none td{color:var(--faint)}
.ta .pt{white-space:nowrap}
.ta .ta-k-ph{background:#e3bf6e}.ta .ta-k-t{background:#f0c94a}.ta .ta-k-e{background:#5fd4f0}.ta .ta-k-s{background:#ff6f66}.ta .ta-k-m{background:#fff}
.ta .ta-k-psi{background:#7fe3c4}.ta .ta-k-ke{background:#b9a3ff}.ta .ta-k-lt{background:#ff7ad9}.ta .ta-k-hk{background:#9fb4ff}.ta .ta-k-st{background:#c6f06b}
.ta .ta-k-sf{background:#ffb347}.ta .ta-k-fh{background:#ff8fa3}.ta .ta-k-cp{background:#8fd3ff}.ta .ta-k-moap{background:#f59f6b}.ta .ta-k-urh{background:#5fe0a0}
.ta .ta-k-d,.ta .ta-k-g,.ta .ta-k-an,.ta .ta-k-at,.ta .ta-k-o{background:#d2a8ff}

/* ---------- Originalgrafik | Rechenansicht in den Rechenbereichen (js/mx-original.js; P1 + tabua.js, tabua-panels-c.js); gemeinsame Stile in css/mx.css ---------- */
.ta-vis{min-width:0}
.ta-calc > .mxo-tabs{margin:0 0 12px}
.ta-oh{margin:0 0 6px;font-size:15px}
.ta-view.ta-wide:has(> .ta-vis > .ta-c:not([hidden])){grid-template-columns:minmax(0,1fr)}
.ta-view.ta-wide:has(> .ta-vis > .ta-c:not([hidden])) > .ta-info{display:none}
/* .mxo-* (Info-Zeile, Hervorhebung über der Originalgrafik): css/mx.css */

@media (max-width:1100px){
  .ta-view{grid-template-columns:1fr}
  .ta-info{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .ta-esf-l{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .ta-tri{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ta-top{flex-direction:column;align-items:stretch}
  .ta-ctrl{justify-content:space-between}
  .ta-prog{flex:none;width:100%}
  .ta-prog button span{display:none}
  .ta-prog button{padding:5px 9px 5px 5px}
  .ta-prog{gap:5px}
  .ta-cap{font-size:14.5px}
  .ta-iv b{font-size:20px}
  .ta-count b{font-size:28px}
  .ta-ax-top small{display:none}
  .ta-ax-top b{font-size:11px}
  .ta-esf-l{grid-template-columns:1fr}
  .ta-play{min-width:0}
  .ta-sum .ta-l,.ta-sum .ta-ift i{display:none}
  .ta-sum .ta-s{display:inline}
  .ta-sum th,.ta-sum td{padding:7px 4px;font-size:12px}
  .ta-sum thead th{letter-spacing:.03em;font-size:9.5px}
  .ta-sum .ta-ift b,.ta-sum tr.sum b{font-size:14px}
  .ta-sum tr.sum td:first-child{font-size:11px}
  .ta-sum .ta-pt{min-width:24px;padding:0 5px}
  .ta-sum .ta-ift span{white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  .ta *,.ta *::before{animation:none!important;transition:none!important}
}
@media print{
  .ta-ctrl,.ta-prog,.ta-bar,.ta-keys,.ta-opts{display:none!important}
  .ta-ch{opacity:1}
}