@font-face{font-family:'TeX Gyre Pagella';src:url('fonts/texgyrepagella-regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'TeX Gyre Pagella';src:url('fonts/texgyrepagella-bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'TeX Gyre Pagella';src:url('fonts/texgyrepagella-italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'TeX Gyre Pagella';src:url('fonts/texgyrepagella-bolditalic.otf') format('opentype');font-weight:700;font-style:italic;font-display:swap}
:root{--tinte:#1a1a1a;--papier:#fbfaf7;--akzent:#8a1f11;--linie:#e2ddd2;--dim:#7a756a;--flaeche:#fff;--einschub:#f1ede4;--wl-hover:#f6e8e5;--zitat:#f7f3ea;--kasten:#f4f1e8;--kopf:rgba(251,250,247,.96);--canvasbg:#fbfaf7;--text2:#3d3a33}
*{box-sizing:border-box}
body{margin:0;background:var(--papier);color:var(--tinte);font:17px/1.7 'TeX Gyre Pagella',Palatino,Georgia,serif}
header{position:sticky;top:0;background:var(--kopf);backdrop-filter:blur(4px);border-bottom:1px solid var(--linie);padding:.7rem 1.2rem;display:flex;gap:1rem;align-items:center;z-index:10}
.logo{font:700 1.15rem/1 'Helvetica Neue',Arial,sans-serif;letter-spacing:.06em;color:var(--akzent);text-decoration:none}
#suche{flex:1;max-width:34rem;font:15px 'Helvetica Neue',Arial,sans-serif;padding:.5rem .8rem;border:1px solid var(--linie);border-radius:6px;background:var(--flaeche)}
#resultate{position:absolute;top:100%;left:0;right:0;background:var(--flaeche);border-bottom:1px solid var(--linie);max-height:60vh;overflow:auto;box-shadow:0 8px 24px rgba(0,0,0,.08)}
#resultate a{display:block;padding:.6rem 1.2rem;text-decoration:none;color:var(--tinte);border-top:1px solid var(--linie)}
#resultate a:hover{background:var(--papier)}
#resultate .r-ordner{color:var(--dim);font:12px 'Helvetica Neue',Arial,sans-serif;margin-left:.5rem}
#resultate .r-x{display:block;color:var(--dim);font-size:13px;line-height:1.4}
.rahmen{max-width:46rem;margin:0 auto;padding:2rem 1.2rem 4rem}
h1{font-size:1.9rem;line-height:1.25;margin:.4rem 0 1rem}
h2{font-size:1.35rem;margin-top:2rem;border-bottom:1px solid var(--linie);padding-bottom:.25rem}
h3{font-size:1.1rem}
a{color:var(--akzent)}
a.wl{text-decoration:none;border-bottom:1px solid #d8b5ae}
a.wl:hover{background:var(--wl-hover)}
.wl-tot{color:var(--dim);border-bottom:1px dashed var(--linie);cursor:help}
a.ext::after{content:'↗';font-size:.75em;margin-left:.15em}
code{background:var(--einschub);padding:.1em .35em;border-radius:4px;font:14px ui-monospace,Menlo,monospace}
pre{background:var(--einschub);padding:1rem;border-radius:8px;overflow:auto}
pre code{background:none;padding:0}
blockquote{margin:1rem 0;padding:.2rem 1rem;border-left:3px solid var(--akzent);background:var(--zitat);color:var(--text2)}
table{border-collapse:collapse;margin:1rem 0;font-size:.92em;width:100%}
th,td{border:1px solid var(--linie);padding:.4rem .6rem;text-align:left}
th{background:var(--einschub);font-family:'Helvetica Neue',Arial,sans-serif;font-size:.85em}
hr{border:0;border-top:1px solid var(--linie);margin:2rem 0}
.seitenkopf{display:flex;gap:.7rem;align-items:center;font:13px 'Helvetica Neue',Arial,sans-serif;color:var(--dim)}
.badge{background:var(--bf);color:#fff;padding:.15rem .55rem;border-radius:99px;font-weight:600;font-size:12px}
.anlage{color:var(--dim);font-style:italic}
.dv{color:var(--dim)}
.backlinks{margin-top:3rem;background:var(--kasten);border:1px solid var(--linie);border-radius:10px;padding:1rem 1.3rem}
.backlinks h2{margin-top:0;border:0;font:600 .95rem 'Helvetica Neue',Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.backlinks ul{margin:0;padding-left:1.1rem}
.bl-ordner{color:var(--dim);font:11px 'Helvetica Neue',Arial,sans-serif;margin-left:.4rem}
.start .untertitel{color:var(--dim);margin-top:-0.4rem}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1rem;margin:2rem 0}
.kachel{display:flex;flex-direction:column;gap:.2rem;background:var(--flaeche);border:1px solid var(--linie);border-radius:12px;padding:1.1rem;text-decoration:none;color:var(--tinte);transition:transform .12s}
.kachel:hover{transform:translateY(-2px);border-color:var(--akzent)}
.k-zahl{font:700 1.7rem 'Helvetica Neue',Arial,sans-serif;color:var(--akzent)}
.k-name{font:14px 'Helvetica Neue',Arial,sans-serif;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
#ordner-liste ul{list-style:none;padding:0;columns:2;column-gap:2rem}
#ordner-liste li{margin:.25rem 0;break-inside:avoid}
#popover{position:absolute;max-width:22rem;background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;padding:.8rem 1rem;box-shadow:0 10px 30px rgba(0,0,0,.12);font-size:14px;line-height:1.5;z-index:50;pointer-events:none}
#popover .p-t{font:600 15px 'TeX Gyre Pagella',Palatino,serif;margin-bottom:.25rem}
#popover .p-x{color:var(--dim)}
footer{text-align:center;color:var(--dim);font:12px 'Helvetica Neue',Arial,sans-serif;padding:2rem 0;border-top:1px solid var(--linie)}
@media(max-width:640px){#ordner-liste ul{columns:1}.rahmen{padding:1.2rem .9rem 3rem}}
.callout{margin:1rem 0;border:1px solid var(--linie);border-radius:10px;background:var(--flaeche);overflow:hidden}
.callout summary{cursor:pointer;padding:.55rem 1rem;font:600 14px 'Helvetica Neue',Arial,sans-serif;background:#eef2f6;color:#31506b;list-style:none}
.callout summary::before{content:'▸ ';transition:transform .1s}
.callout[open] summary::before{content:'▾ '}
.callout p{margin:.5rem 1rem}
.c-warning summary{background:#faf0dc;color:#7a5a12}
.c-info summary{background:#e8eff7;color:#2b5279}
.dv-tabelle{font-size:.9em}
.dv-tabelle td:last-child,.dv-datum{white-space:nowrap;color:var(--dim)}
.dv-zahl{color:var(--akzent)}
.dv-hinweis{color:var(--dim);font:13px 'Helvetica Neue',Arial,sans-serif;border:1px dashed var(--linie);border-radius:8px;padding:.5rem .8rem}
.rahmen{max-width:72rem;display:grid;grid-template-columns:17rem minmax(0,46rem);gap:2.5rem;justify-content:center}
#sidebar{font:14px 'Helvetica Neue',Arial,sans-serif;line-height:1.5;position:sticky;top:4.2rem;align-self:start;max-height:calc(100vh - 5.5rem);overflow:auto;padding-right:.5rem;border-right:1px solid var(--linie)}
#sidebar details{margin:.1rem 0}
#sidebar summary{cursor:pointer;list-style:none;padding:.2rem .3rem;border-radius:6px;color:var(--text2);font-weight:600}
#sidebar summary:hover{background:var(--einschub)}
#sidebar summary::before{content:'▸ ';color:var(--dim)}
#sidebar details[open]>summary::before{content:'▾ '}
#sidebar .anz{color:var(--dim);font-weight:400;font-size:12px}
#sidebar ul{list-style:none;margin:0;padding-left:1rem}
#sidebar li a{display:block;padding:.14rem .3rem;border-radius:6px;color:var(--tinte);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sidebar li a:hover{background:var(--einschub)}
#sidebar li a.aktiv{background:var(--wl-hover);color:var(--akzent);font-weight:600}
#nav-toggle{display:none;font-size:1.2rem;background:none;border:1px solid var(--linie);border-radius:6px;padding:.2rem .55rem;cursor:pointer;color:var(--tinte)}
@media(max-width:900px){
.rahmen{grid-template-columns:1fr}
#nav-toggle{display:block}
#sidebar{display:none;position:static;max-height:none;border-right:0;border-bottom:1px solid var(--linie);padding-bottom:1rem}
#sidebar.offen{display:block}
}
a.zot{color:#a5352c;text-decoration:none;border-bottom:1px dotted #a5352c}
a.zot::before{content:'📖 ';font-size:.85em}
#nav-toggle{display:block}
body.nav-zu .rahmen{grid-template-columns:minmax(0,46rem)}
body.nav-zu #sidebar{display:none}

.graph-link{margin-left:auto;font-size:1.3rem;text-decoration:none;line-height:1;padding:.15rem .3rem;border-radius:8px}
.graph-link:hover{background:rgba(0,0,0,.06)}

#lokalgraph{margin-top:2.6rem}
#lokalgraph h2{border-top:1px solid var(--linie);padding-top:1.2rem}
#lokalgraph canvas{width:100%;display:block;border:1px solid var(--linie);border-radius:10px;background:var(--canvasbg)}

html[data-thema="dunkel"]{--tinte:#d9d4c9;--papier:#201d1a;--akzent:#46d28c;--linie:#3a352e;--dim:#958d7e;
  --flaeche:#2a2621;--einschub:#322d26;--wl-hover:#25382d;--zitat:#2c2822;--kasten:#2b2722;
  --kopf:rgba(32,29,26,.94);--canvasbg:#252119;--text2:#c6c0b3}
html[data-thema="dunkel"] .callout summary{background:#2b3440;color:#a9c1d9}
html[data-thema="dunkel"] .c-warning summary{background:#403528;color:#d9b36b}
html[data-thema="dunkel"] .c-info summary{background:#2a3644;color:#a9c1d9}
html[data-thema="dunkel"] img{opacity:.88}
#thema-toggle{background:none;border:1px solid var(--linie);border-radius:8px;font-size:1rem;line-height:1;padding:.28rem .45rem;cursor:pointer;color:var(--tinte)}
#thema-toggle:hover{background:var(--einschub)}

.mitwirken{margin-top:1.6rem;padding:.65rem .9rem;border:1px dashed var(--linie);border-radius:10px;font-size:.88rem;color:var(--dim)}
.mitwirken a{text-decoration:none}
.mitwirken a:hover{text-decoration:underline}

/* --- Public-Feinschliff Einmaleins.Schule (21.08.2026) --- */
body.public .logo{font:400 1.35rem/1 'TeX Gyre Pagella','Palatino Linotype',Palatino,serif;letter-spacing:.02em}
@media(min-width:641px){body.public:not(.nav-zu) .rahmen{grid-template-columns:14rem minmax(0,46rem)}}

.anlage-bild { max-width: 100%; height: auto; display: block; margin: 1.2rem auto; }