/* =========================================================================
   CASI -- Lower Cost: der Kern der Hero-Grafik im ICCA-Rahmen, rechts die
   Berichte, die aus dem Ledger entstehen. Alle Masse in em (Grundschrift
   15 px); die Flaeche verkleinert sich mit ihrer Spalte (Container-Einheit),
   sobald diese schmaler ist als die Zeichnung.
   ========================================================================= */
.isys{width:100%;container-type:inline-size;margin:0;}
.isys-flaeche{position:relative;margin:0 auto;font-family:'Mori',system-ui,sans-serif;font-size:min(15px,calc(100cqw / 37.4667));width:37.4667em;height:26.4em;color:var(--tinte,#0E4D49);}
.isys-flaeche > *{position:absolute;box-sizing:border-box;}
/* Alle Masse sind bei der Grundschrift 15 px ganze Pixel -- so stehen die
   Linien scharf und treffen genau (1.10.: "der Strich zu den Boxen rechts
   ist ungenau"). Die Pixel stehen in den Kommentaren. */
/* der Rahmen = ICCA (400 x 396), farbig hervorgehoben; der Name steht oben darin */
.isys-icca{left:0;top:0;width:26.66667em;height:26.4em;background:var(--tinte,#0E4D49);border-radius:1.6em;}
.isys-name{left:0;top:1.6em;width:26.66667em;text-align:center;font-weight:600;line-height:1.33333em;color:var(--papier,#fff);}
/* Linien im Rahmen: vom Ledger zu den vier Abschluessen, weiss auf dem
   dunklen Rahmen (staerker als casi-wp.css Abschnitt 79, der sonst alle
   Linien in --strich zieht). Keine Zuleitung von aussen. */
.isys-l-led{left:12.6em;top:14.2em;width:0.86667em;height:0;border-top:var(--fein,1px) solid var(--papier,#fff);}
.isys-l-stamm{left:13.46667em;top:6.4em;height:15.66667em;width:0;border-left:var(--fein,1px) solid var(--papier,#fff);}
.isys-l-st1{left:13.53333em;top:6.4em;width:0.8em;height:0;border-top:var(--fein,1px) solid var(--papier,#fff);}
.isys-l-st2{left:13.53333em;top:11.6em;width:0.8em;height:0;border-top:var(--fein,1px) solid var(--papier,#fff);}
.isys-l-st3{left:13.53333em;top:16.8em;width:0.8em;height:0;border-top:var(--fein,1px) solid var(--papier,#fff);}
.isys-l-st4{left:13.53333em;top:22em;width:0.8em;height:0;border-top:var(--fein,1px) solid var(--papier,#fff);}
.isys .isys-flaeche .isys-l-led,.isys .isys-flaeche .isys-l-stamm,
.isys .isys-flaeche .isys-l-st1,.isys .isys-flaeche .isys-l-st2,
.isys .isys-flaeche .isys-l-st3,.isys .isys-flaeche .isys-l-st4{border-color:var(--papier,#fff);}
/* vom Rahmen zu den Standards: die Linie verlaesst den Rahmen auf der Hoehe
   des Ledgers, genau zwischen dem zweiten und dritten Abschluss (213), und
   trifft die Sammelleitung genau zwischen dem fuenften und sechsten
   Standard; die Spalte rechts ist darum um 15 px nach unten gerueckt (37-389). */
.isys-l-raus{left:26.66667em;top:14.2em;width:2.86667em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-bus{left:29.53333em;top:3.4em;height:21.66667em;width:0;border-left:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n1{left:29.6em;top:3.4em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n2{left:29.6em;top:5.8em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n3{left:29.6em;top:8.2em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n4{left:29.6em;top:10.6em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n5{left:29.6em;top:13em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n6{left:29.6em;top:15.4em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n7{left:29.6em;top:17.8em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n8{left:29.6em;top:20.2em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n9{left:29.6em;top:22.6em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-l-n10{left:29.6em;top:25em;width:0.93333em;height:0;border-top:var(--fein,1px) solid var(--strich,#0E4D49);}
.isys-box{display:flex;align-items:center;gap:0.53333em;padding:0 0.73333em;border-radius:var(--rad-klein,8px);line-height:1.2em;}
.isys-box svg{flex:0 0 1.86667em;width:1.86667em;height:1.86667em;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;}
/* die Kaesten im Rahmen weiss (Schrift der Abschluesse in Tinte: casi-wp.css 79) */
.isys-ledger{left:2em;top:11.06667em;width:10.6em;height:6.26667em;background:var(--papier,#fff);font-weight:600;}
.isys-st{left:14.33333em;width:10.26667em;height:4.53333em;background:var(--papier,#fff);color:#8B1538;}
.isys-st1{top:4.13333em;}
.isys-st2{top:9.33333em;}
.isys-st3{top:14.53333em;}
.isys-st4{top:19.73333em;}
/* die Standards in derselben Schrift wie die Kaesten (15 px), zehn mit "..." */
.isys-norm{left:30.53333em;width:6.93333em;height:1.86667em;display:flex;align-items:center;justify-content:center;border:var(--fein,1px) solid var(--strich,#0E4D49);border-radius:var(--rad-klein,8px);white-space:nowrap;}
.isys-norm > span{font-size:1em;line-height:1;}
.isys-n1{top:2.46667em;}
.isys-n2{top:4.86667em;}
.isys-n3{top:7.26667em;}
.isys-n4{top:9.66667em;}
.isys-n5{top:12.06667em;}
.isys-n6{top:14.46667em;}
.isys-n7{top:16.86667em;}
.isys-n8{top:19.26667em;}
.isys-n9{top:21.66667em;}
.isys-n10{top:24.06667em;}

/* =========================================================================
   Die Zeichen der vier Statements-Kacheln: nur das Symbol des Kastens aus
   der Hero-Grafik, als .sym wie bei Rigorous Carbon Accounting (48 px,
   Tinte, Haarlinie -- casi-proposal.css). Sie stehen immer da, wie die
   Zeichen bei Rigorous Carbon Accounting (seit 2.10.). Kommt man ueber
   einen Kasten der Hero-Grafik (html[data-casi-ziel], aus dem Anker), wird
   nur das angeklickte hervorgehoben: es wartet unsichtbar, bis die Fahrt
   steht (html.casi-sym-wartet), und zeichnet sich dann einmal nach
   (html.casi-glanz, Vorschlag B vom 1.10.).
   ========================================================================= */
/* Nachzeichnen braucht Striche, die mit dem Zeichen skalieren (sonst rechnet
   der Browser die Strichlaenge in Bildschirmpixeln und das Zeichen bleibt
   gestrichelt): statt der festen Haarlinie aus casi-proposal.css (1,53 px,
   non-scaling) dieselbe Staerke ueber die Groesse -- 48 px: 0,765; 40 px: 0,918,
   geteilt durch den Massstab der Zeichnung (--s, casi-icca-system.php). */
.sym.tafel-sym svg *{vector-effect:none;stroke-width:calc(.765 / var(--s,1));}
@media (max-width:900px){.sym.tafel-sym svg *{stroke-width:calc(.918 / var(--s,1));}}
html.casi-sym-wartet[data-casi-ziel="1"] .tafel-sym[data-z="1"] svg *,
html.casi-sym-wartet[data-casi-ziel="2"] .tafel-sym[data-z="2"] svg *,
html.casi-sym-wartet[data-casi-ziel="3"] .tafel-sym[data-z="3"] svg *,
html.casi-sym-wartet[data-casi-ziel="4"] .tafel-sym[data-z="4"] svg *{stroke-dasharray:1 2;stroke-dashoffset:1.05;}
html.casi-glanz[data-casi-ziel="1"] .tafel-sym[data-z="1"] svg *,
html.casi-glanz[data-casi-ziel="2"] .tafel-sym[data-z="2"] svg *,
html.casi-glanz[data-casi-ziel="3"] .tafel-sym[data-z="3"] svg *,
html.casi-glanz[data-casi-ziel="4"] .tafel-sym[data-z="4"] svg *{stroke-dasharray:1 2;animation:casi-sym-zeichnen 1.1s cubic-bezier(.45,0,.25,1) both;}
html.casi-glanz .tafel-sym svg *:nth-child(2){animation-delay:.12s;}
html.casi-glanz .tafel-sym svg *:nth-child(3){animation-delay:.24s;}
html.casi-glanz .tafel-sym svg *:nth-child(4){animation-delay:.36s;}
html.casi-glanz .tafel-sym svg *:nth-child(5){animation-delay:.48s;}
/* Strich 1, Luecke 2, Start knapp vor dem Anfang: so blitzt vor dem
   Nachzeichnen kein Ende und keine runde Kappe auf */
@keyframes casi-sym-zeichnen{from{stroke-dashoffset:1.05}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){html .tafel-sym svg *{animation:none !important;stroke-dashoffset:0 !important;}}
.abb-legende .m.leer{min-width:2.2em;}