.wwsr-shell .bildung-modul {
    --bildung-ink: #202b2a;
    --bildung-paper: #faf5e9;
    --bildung-teal: #135a52;
    background: var(--bildung-paper);
    color: var(--bildung-ink);
    margin-block: 2rem;
    padding: clamp(.9rem, 3vw, 1.7rem);
    border: 1px solid #cec3a6;
    border-left: 4px solid var(--bildung-teal);
    border-radius: .6rem;
    min-width: 0;
    overflow-wrap: anywhere;
}
.bildung-modul h3:first-child { margin-top: 0; }
.bildung-modul [hidden] { display: none !important; }
.bildung-modul a { color: #144d45; }
.bildung-modul fieldset { border: 1px solid #bcb294; margin-block: .65rem; min-width: 0; }
.bildung-modul legend { font-weight: 700; }
.bildung-modul fieldset label { display: inline-flex; align-items: center; min-height: 44px; gap: .35rem; margin-right: .8rem; padding-block: .25rem; }
.bildung-modul input { accent-color: var(--bildung-teal); }
.bildung-modul [data-bildung-steuerung] { display: grid; gap: .3rem; font-weight: 650; }
.bildung-modul select { font: inherit; width: 100%; min-width: 0; max-width: 29rem; min-height: 44px; padding: .4rem; background: #fff; color: inherit; border: 1px solid #524e42; border-radius: .3rem; }
.bildung-balkendiagramm { margin: .7rem 0 1rem; }
.bildung-balkenzeile, .bildung-schaetzung { display: grid; gap: .32rem; margin: .65rem 0; }
.bildung-balken, .bildung-schaetzachse { display: block; height: .72rem; background: #e2dece; }
.bildung-balken i { display: block; height: 100%; background: var(--bildung-teal); }
.bildung-achse, .bildung-achsenzeile { display: flex; justify-content: space-between; position: relative; font-size: .85rem; }
.bildung-schaetzachse { position: relative; }
.bildung-schaetzachse::before { content: ''; position: absolute; left: 21.42857%; top: -.28rem; bottom: -.26rem; border-left: 1px solid #514e40; z-index: 1; }
.bildung-schaetzachse i { position: absolute; top: .3rem; height: .15rem; background: var(--bildung-teal); }
.bildung-schaetzachse b { position: absolute; top: 50%; transform: translate(-50%, -50%); background: var(--bildung-teal); border: 1px solid #fff; width: .6rem; height: .6rem; border-radius: 50%; }
.bildung-nulllabel { position: absolute; left: 21.42857%; transform: translateX(-50%); }
.bildung-bruchachse { margin: 2.2rem 1rem 1rem; display: flex; justify-content: space-between; border-top: 2px solid #382d22; position: relative; }
.bildung-bruchachse b { position: absolute; transform: translate(-50%, -105%); color: var(--bildung-teal); }
.bildung-bruchachse b::after { position: absolute; content: ''; width: 2px; height: .5rem; background: currentColor; left: 50%; top: 95%; }
.bildung-modul button {
    background: var(--bildung-teal);
    color: #fff;
    border: 1px solid var(--bildung-teal);
    border-radius: .3rem;
    font: inherit;
    font-weight: 700;
    text-align: start;
    min-height: 44px;
    padding: .45rem .8rem;
}
.bildung-modul button:is(:disabled, [aria-disabled="true"]) { opacity: .75; }
.bildung-modul :is(a, button, input, select, summary):focus-visible { outline: 3px solid #1a527a; outline-offset: 3px; }
.bildung-ergebnis { padding: .7rem .85rem; background: #e7ede4; border-radius: .35rem; }
.bildung-schalter { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
.bildung-doppelbild { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.bildung-doppelbild figure { margin: 0; min-width: 0; }
.bildung-doppelbild svg { display: block; width: 100%; height: auto; background: #fffefa; border-radius: .3rem; font-size: .33px; fill: #152320; }
.bildung-ablauf { counter-reset: punkt; padding-inline-start: 0; list-style: none; }
.bildung-ablauf li { position: relative; margin: .8rem 0; padding: .8rem 1rem .8rem 2.65rem; border: 1px solid #bcb294; border-radius: .35rem; background: #fffefa; counter-increment: punkt; }
.bildung-ablauf li::before { content: counter(punkt); position: absolute; left: .8rem; font-weight: 700; color: var(--bildung-teal); }
.bildung-ablauf li + li::after { content: '↓'; position: absolute; left: .85rem; top: -1.12rem; color: var(--bildung-teal); line-height: 1.1; }
.bildung-luecke { display: inline-block; padding: .25rem .5rem; border-left: .2rem solid #93470d; color: #633210; font-size: .88rem; }
.bildung-modul [data-bildung-rechner] fieldset label,
.bildung-modul [data-bildung-belege] fieldset label {
    display: grid;
    margin-right: 0;
}
.bildung-modul input[type="number"] {
    min-height: 44px;
    width: min(8rem, 100%);
    padding-inline: .45rem;
    border: 1px solid #524e42;
    border-radius: .3rem;
    background: #fff;
    color: inherit;
    font: inherit;
}
.bildung-raster {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: .18rem;
    max-width: 12rem;
    margin-block: .7rem;
}
.bildung-raster i { aspect-ratio: 1; background: var(--bildung-teal); border: 1px solid var(--bildung-teal); }
.bildung-raster i.bildung-raster-leer { background: #e2dece; border-color: #aeaa9c; }
.bildung-belegkarte { padding: .8rem 1rem; border: 1px solid #bcb294; border-radius: .35rem; margin-block: .7rem; background: #fffefa; }
.bildung-belegkarte h4 { margin-top: 0; }
@media (max-width: 560px) {
    .bildung-doppelbild { grid-template-columns: 1fr; }
}
