.m5-page{--math-blue:#315fb5;--math-soft:#eaf1ff;--math-gold:#f2bd45;--ok:#18765d;--danger:#9a402f;background:radial-gradient(circle at 95% 3%,rgba(49,95,181,.14),transparent 28rem),var(--paper)}
.m5-shell{width:min(1160px,calc(100% - 32px));margin-inline:auto}.m5-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,6vw,72px);align-items:center;padding:46px 0 34px}.m5-hero h1{font-size:clamp(2.7rem,6.4vw,5.6rem)}.m5-hero p{max-width:690px;color:var(--muted);font-size:1.1rem}.m5-brand-panel{padding:26px;border:1px solid rgba(20,43,54,.08);border-radius:28px;background:rgba(255,255,255,.64);box-shadow:var(--shadow)}.m5-brand-panel img{width:100%;height:auto}.m5-motto{padding:14px 16px;border-left:4px solid var(--math-blue);border-radius:12px;background:var(--math-soft);font-weight:800}
.m5-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;align-items:start}.m5-map{position:sticky;top:12px;padding:16px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.9);box-shadow:0 10px 28px rgba(20,43,54,.08)}.m5-map strong{display:block;margin:4px 8px 10px}.m5-map a{display:flex;gap:10px;align-items:center;padding:10px;border-radius:11px;color:var(--muted);text-decoration:none;font-size:.9rem;font-weight:800}.m5-map a:hover,.m5-map a:focus{color:var(--navy);background:var(--math-soft);outline:none}.m5-map span{display:grid;place-items:center;flex:0 0 28px;height:28px;border-radius:9px;background:var(--paper);color:var(--math-blue)}
.m5-content{min-width:0}.m5-section{margin-bottom:28px;padding:clamp(24px,4vw,42px);scroll-margin-top:20px;border:1px solid var(--line);border-radius:28px;background:rgba(255,255,255,.78);box-shadow:0 12px 34px rgba(20,43,54,.06)}.m5-section>header{max-width:790px;margin-bottom:25px}.m5-section h2{font-size:clamp(2rem,4.3vw,3.25rem);letter-spacing:-.045em}.m5-section h3{margin-bottom:8px}.m5-section p{color:var(--muted)}.m5-kicker{display:inline-flex;margin-bottom:8px;color:var(--math-blue);font-size:.77rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}.m5-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.m5-card{padding:21px;border:1px solid var(--line);border-radius:18px;background:#fff}.m5-card p:last-child{margin-bottom:0}.m5-rule{padding:16px 18px;border-left:5px solid var(--math-gold);border-radius:14px;background:#fff7dd;color:#5e4709}.m5-error{padding:16px 18px;border-left:5px solid #ce725d;border-radius:14px;background:#fff0ec;color:#743a2e}
.lab{margin-top:24px;padding:clamp(20px,4vw,32px);border:1px solid #cdd9ef;border-radius:22px;background:#f8fbff}.lab-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;align-items:start}.lab h3{font-size:1.45rem}.control-row{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin:16px 0}.control-row label{display:grid;gap:5px;color:var(--muted);font-size:.83rem;font-weight:800}.control-row input,.control-row select,.answer-input{min-height:45px;padding:9px 12px;border:1px solid #b9c6dc;border-radius:11px;background:#fff;color:var(--ink);font:inherit}.control-row input[type=range]{min-width:220px;padding:0}.lab button,.m5-button{min-height:44px;padding:9px 14px;border:1px solid #b9c6dc;border-radius:11px;background:#fff;color:var(--navy);font-weight:850;cursor:pointer}.lab button.primary,.m5-button.primary{border-color:var(--navy);background:var(--navy);color:#fff}.lab button.help{background:#fff7dd}.feedback{display:none;margin-top:14px;padding:14px 16px;border-radius:12px;font-weight:700}.feedback.show{display:block}.feedback.good{background:#e5f5ed;color:#175a48}.feedback.try{background:#fff0ec;color:#743a2e}.feedback.info{background:var(--math-soft);color:#264d91}
.place-table{display:grid;grid-template-columns:repeat(7,minmax(62px,1fr));gap:6px;overflow:auto;margin:18px 0}.place-cell{min-width:62px;padding:10px 6px;text-align:center;border:1px solid #cad5e7;border-radius:10px;background:#fff}.place-cell small{display:block;color:var(--muted);font-size:.72rem}.place-cell strong{font-size:1.5rem}.place-cell.selected{outline:3px solid var(--math-gold)}.number-display{font-variant-numeric:tabular-nums;font-size:clamp(1.8rem,5vw,3.2rem);font-weight:950;letter-spacing:.04em}.number-line-instruction{margin-bottom:2px;padding:10px 13px;border-left:4px solid var(--math-gold);border-radius:9px;background:#fff8dd}.number-line{position:relative;height:64px;margin:12px 10px 0}.number-line-scale{position:absolute;top:27px;left:0;right:0;height:5px;background:var(--navy);pointer-events:none}.number-line-scale span{position:absolute;top:-6px;width:2px;height:17px;transform:translateX(-50%);background:var(--navy)}.number-line-scale span.major{top:-9px;width:3px;height:23px}.number-line-slider{position:absolute;inset:4px -10px auto;width:calc(100% + 20px);height:48px;margin:0;appearance:none;background:transparent;cursor:grab;z-index:2}.number-line-slider:active{cursor:grabbing}.number-line-slider::-webkit-slider-runnable-track{height:5px;background:transparent}.number-line-slider::-webkit-slider-thumb{width:24px;height:34px;margin-top:-15px;appearance:none;border:3px solid #fff;border-radius:10px;background:var(--math-gold);box-shadow:0 0 0 3px var(--navy)}.number-line-slider::-moz-range-track{height:5px;background:transparent}.number-line-slider::-moz-range-thumb{width:20px;height:30px;border:3px solid #fff;border-radius:10px;background:var(--math-gold);box-shadow:0 0 0 3px var(--navy)}.number-line-slider:focus-visible{outline:3px solid rgba(49,95,181,.28);outline-offset:5px}.number-labels{display:flex;justify-content:space-between;margin:0 10px;font-weight:850}.scale-prompt{font-size:1.12rem;font-weight:850}
.level-row,.operation-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.level-row button.active,.operation-tabs button.active{border-color:var(--math-blue);background:var(--math-soft);color:var(--math-blue)}.calculation{overflow:auto;margin:18px 0;padding:18px;border-radius:16px;background:#fff;font:700 1.08rem ui-monospace,SFMono-Regular,Consolas,monospace}.column-step{display:grid;grid-template-columns:minmax(110px,1fr) minmax(90px,150px) minmax(90px,150px);gap:10px;align-items:center;margin:9px 0;padding:10px;border-bottom:1px solid var(--line)}.column-step input{width:100%;min-height:42px;padding:8px;border:1px solid #b9c6dc;border-radius:9px}.step-done{background:#eaf7f1}.division-board{margin-top:18px;padding:20px;border-radius:17px;background:#fff}.division-expression{font:900 clamp(1.5rem,4vw,2.25rem) ui-monospace,SFMono-Regular,Consolas,monospace}.division-history{display:grid;gap:8px;margin:16px 0}.division-history div{padding:10px 12px;border-left:3px solid var(--ok);background:#eff8f4;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.division-current{padding:16px;border:2px solid #b9cae8;border-radius:14px;background:#f7faff}.help-levels{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.proof-box{display:none;margin-top:18px;padding:16px;border-radius:14px;background:#eff8f4}.proof-box.show{display:block}
.language-equation{padding:17px;text-align:center;border-radius:15px;background:var(--navy);color:#fff;font:900 clamp(1.45rem,4vw,2.1rem) ui-monospace,SFMono-Regular,Consolas,monospace}.term-parts{display:flex;flex-wrap:wrap;gap:9px;margin:15px 0}.term-parts span{padding:8px 11px;border-radius:10px;background:var(--math-soft);font-weight:800}.strategy-options{display:grid;gap:9px;margin:14px 0}.strategy-options label,.choice-list label{display:flex;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:#fff}.unit-note{font-weight:800;color:#634d10}.process-list{counter-reset:process;display:grid;gap:10px;padding:0}.process-list li{list-style:none;display:flex;gap:12px;align-items:start}.process-list li::before{counter-increment:process;content:counter(process);display:grid;place-items:center;flex:0 0 32px;height:32px;border-radius:10px;background:var(--math-blue);color:#fff;font-weight:900}.progress-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.progress-summary div{padding:16px;border-radius:15px;background:#fff}.progress-summary strong{display:block;font-size:1.7rem}.test-question{margin:15px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fff}.test-question h3{font-size:1.1rem}.test-result{margin:22px 0;padding:24px;border-radius:20px;background:var(--navy);color:#fff}.test-result p{color:#d9e5e9}
.written-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0}.written-examples article{padding:18px;border:1px solid var(--line);border-radius:17px;background:#fff}.written-examples span{display:block;color:var(--math-blue);font-weight:900}.written-examples pre{overflow:auto;margin:12px 0;padding:14px;border-radius:10px;background:linear-gradient(#fff 31px,#dfe9fb 32px);background-size:100% 32px;color:var(--navy);font:800 1rem/2 ui-monospace,SFMono-Regular,Consolas,monospace}.written-examples small{color:var(--muted);font-weight:700}.order-row{margin:8px 0}.order-row label{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}.order-row select{min-width:70px;padding:8px;border:1px solid #b9c6dc;border-radius:9px}.progress-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.progress-details>div{display:grid;grid-template-columns:1fr auto;gap:7px;padding:14px;border:1px solid var(--line);border-radius:13px;background:#fff}.progress-details progress{grid-column:1/-1;width:100%;accent-color:var(--math-blue)}
.live-paper{width:max-content;min-width:min(100%,280px);overflow:auto;margin:16px 0;padding:16px 24px;border:1px solid #d5dfef;border-radius:13px;background:repeating-linear-gradient(#fff,#fff 31px,#dfe9fb 32px);color:var(--navy);font:900 1.18rem/2 ui-monospace,SFMono-Regular,Consolas,monospace;text-align:right}
.classic-division{overflow:auto;margin:8px 0 18px;padding:20px;border:1px solid #d4dfef;border-radius:14px;background:repeating-linear-gradient(#fff,#fff 35px,#dce8fa 36px);color:var(--navy);font:900 clamp(1.25rem,4vw,1.8rem)/1.8 ui-monospace,SFMono-Regular,Consolas,monospace}.classic-head{display:flex;gap:.55em;align-items:baseline;white-space:nowrap}.dividend-digits{display:inline-flex}.dividend-digits b{padding:0 .06em;border-radius:4px}.dividend-digits b.active-digit{background:#fff0a8;box-shadow:inset 0 -3px 0 var(--math-gold)}.classic-row{display:grid;grid-template-columns:minmax(7ch,max-content) 1fr;gap:18px;align-items:center;min-width:360px}.classic-row span{white-space:pre;text-align:right}.classic-row small{color:var(--muted);font:700 .78rem/1.3 system-ui,sans-serif}.classic-row.result-line span{border-top:2px solid var(--navy)}.division-orientation{margin:14px 0;padding:14px 16px;border-left:5px solid var(--math-gold);border-radius:12px;background:#fff8dd;color:#503f10}.step-label{display:block;margin-bottom:7px;color:var(--math-blue);font-size:.75rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.write-here{margin-top:7px;font-size:.92rem}
@media(max-width:900px){.m5-hero{grid-template-columns:1fr}.m5-brand-panel{max-width:550px}.m5-layout{grid-template-columns:1fr}.m5-map{position:static;display:flex;overflow:auto}.m5-map strong{display:none}.m5-map a{flex:0 0 auto}.m5-grid{grid-template-columns:1fr}}
@media(max-width:640px){.m5-shell{width:min(100% - 22px,1160px)}.m5-hero{padding-top:26px}.m5-section{padding:21px 16px}.column-step{grid-template-columns:1fr}.progress-summary,.progress-details,.written-examples{grid-template-columns:1fr}.place-table{grid-template-columns:repeat(7,66px)}.control-row>*{max-width:100%}.control-row input[type=range]{min-width:190px}.m5-map span{display:none}}
.division-current .control-row::before{content:'Hier nur die Zahl aus diesem Schritt eintragen:';flex:0 0 100%;color:var(--navy);font-size:.86rem;font-weight:900}
