.map-page{max-width:980px;margin:auto;padding:32px 24px 90px}.map-brand{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:48px}.map-brand a{color:inherit;text-decoration:none}.map-brand img{width:46px;height:46px}.map-konto{display:flex;align-items:center;gap:20px}.map-konto button{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer}.map-konto button:hover,.map-brand a:hover{text-decoration:underline}.map-brand .brand-name{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800}.map-page h1{margin:12px 0 18px}.map-page h2{margin:0 0 16px}.map-page h3{margin:0 0 10px}.map-intro{max-width:65ch;color:var(--tinte-weich);font-size:1.12rem;margin-bottom:30px}.map-panel{background:var(--papier);border:1px solid var(--linie);border-radius:var(--radius);padding:26px;margin:20px 0}.map-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.map-actions .knopf{font-size:.94rem}.map-row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:19px 0;border-top:1px solid var(--linie)}.map-row:first-child{border-top:0}.map-row h3{font-size:1.18rem;margin:0 0 6px}.map-row p{margin:0;color:var(--tinte-weich);font-size:.94rem}.map-code{font-family:var(--font-mono);font-size:2rem;letter-spacing:.14em}.map-join{max-width:540px;margin:60px auto}.map-join input{text-transform:uppercase;letter-spacing:.14em;font-family:var(--font-mono);font-size:1.6rem}.map-page input,.map-page select,dialog input{width:100%;padding:12px;border:1px solid var(--linie);border-radius:7px;background:white;color:var(--tinte);font:inherit}.map-page label,dialog label{display:block;margin:16px 0}.map-page .quiet-note{color:var(--tinte-weich);font-size:.94rem;margin:16px 0}.map-page details{margin:20px 0}.map-page summary{cursor:pointer;font-weight:700}.map-page details .map-actions{margin-top:15px}.map-empty{padding:22px 0;color:var(--tinte-weich)}.map-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.map-tabs [aria-pressed=true]{background:var(--tinte);color:white}.map-preview p{white-space:pre-wrap;overflow-wrap:anywhere}.map-preview article{padding:18px 0;border-top:1px solid var(--linie)}.map-preview h3{font-size:1rem}.map-guide{width:100%;height:65vh;border:1px solid var(--linie);margin-top:16px;background:white}.error{color:var(--fehler)}.map-page .error{margin:18px 0}.map-page .success{color:var(--ok)}dialog{max-width:min(900px,calc(100vw - 32px));width:580px;padding:28px;border:1px solid var(--linie);border-radius:12px;color:var(--tinte);background:var(--papier)}dialog h2{margin:0 0 16px}dialog .knopf{margin:8px 8px 0 0}dialog::backdrop{background:#14213d66}.worksheet-bar{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 24px;background:#fff;border-bottom:2px solid var(--wuerfel);font-size:.9rem}.worksheet-message{display:block;color:var(--tinte-weich);font-size:.82rem;max-width:65ch}.worksheet-bar .knopf{font-size:.85rem;padding:9px 13px}.worksheet-bar .text-button{background:none;border:0;color:var(--tinte);text-decoration:underline;cursor:pointer;font:inherit}.worksheet-bar~#app .heft-kopf{top:var(--worksheet-height,0px)}.worksheet-bar~#app .leiste{top:calc(var(--worksheet-height,0px) + 72px);max-height:calc(100vh - var(--worksheet-height,0px) - 72px);overflow-y:auto}.map-home{display:inline-block;margin:12px}.teacher-preview-note{padding:10px;background:#fff3d6;border-radius:8px;margin:10px 0}.map-page button:disabled{opacity:.55;cursor:wait}@media(max-width:650px){.map-page{padding:20px 16px 60px}.map-brand{margin-bottom:28px}.map-row{align-items:flex-start;flex-direction:column;gap:12px}.map-panel{padding:20px}.map-join{margin:25px auto}.worksheet-bar{padding:10px 12px;align-items:flex-start;flex-direction:column;gap:7px}.worksheet-bar .map-actions{gap:6px}.worksheet-bar~#app .leiste{top:auto;max-height:none}.map-actions .knopf{white-space:normal}.map-code{font-size:1.7rem}}@media print{.worksheet-bar,.map-brand,.map-actions{display:none!important}}

.map-name,.worksheet-name{border:0;background:none;color:inherit;padding:0;text-align:left;font:inherit;font-weight:700;cursor:pointer}.map-name:hover,.worksheet-name:hover{text-decoration:underline}.map-page a:not(.knopf):visited{color:var(--tinte)}.map-page a.knopf:visited{color:white}.map-page a.knopf.zweit:visited{color:var(--tinte)}.map-page a.knopf.gelb:visited{color:var(--tinte)}

/* Keep every dialog reachable at short heights and browser zoom. */
dialog{box-sizing:border-box;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;margin:auto;overflow-wrap:anywhere}dialog select{max-width:100%;font:inherit;padding:10px}dialog .dialog-head{position:sticky;top:-28px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--papier);padding:12px 0;border-bottom:1px solid var(--linie)}dialog .dialog-head h2{margin:0;font-size:1.35rem}dialog .dialog-head .knopf{flex-shrink:0;margin:0}dialog:has(.dialog-head){padding-top:16px}dialog:has(.dialog-head) .dialog-head{top:-16px}@media(max-width:550px){dialog{padding:16px}dialog .dialog-head{align-items:flex-start;top:-16px;gap:10px}dialog .dialog-head h2{font-size:1.1rem}dialog .dialog-head .knopf{font-size:.85rem;padding:9px 12px}}

/* ---- Startseite: Klassenkarten, Zeitstrahl, eingeklappte Verwaltung ---- */
.map-start{padding:32px 28px}.map-start h2{margin-top:0}
.map-classes{display:grid;gap:14px;margin:8px 0 12px}
.map-class{background:var(--papier);border:1px solid var(--linie);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--schatten)}
.map-class-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px}
.map-class-head h2{margin:0;font-size:1.35rem}.map-class-head h2 a{color:inherit;text-decoration:none}.map-class-head h2 a:hover{text-decoration:underline}
.map-class-code{font-size:.9rem;color:var(--tinte-weich)}.map-class-code strong{font-family:var(--font-mono);letter-spacing:.12em;color:var(--tinte)}
.map-dots{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;margin:12px 0 14px;padding:0;font-size:.85rem;color:var(--tinte-weich)}
.map-dots li{display:flex;align-items:center;gap:7px}
.map-dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--kiste);background:transparent}
.map-dots li[data-zustand=laeuft] .map-dot{background:var(--wuerfel);border-color:var(--wuerfel-dunkel)}
.map-dots li[data-zustand=laeuft]{color:var(--tinte);font-weight:700}
.map-dots li[data-zustand=archiviert] .map-dot{background:var(--ok);border-color:var(--ok)}
.map-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 26px}
.map-quiet h2{font-size:1.1rem;margin-bottom:4px}
.map-more{margin-top:28px;padding:0 4px}.map-more>summary{cursor:pointer;font-weight:700;color:var(--tinte-weich);padding:8px 0}
.map-more h3{margin:18px 0 6px;font-size:.95rem}.map-more .map-actions{margin-top:10px}
.map-timeline{list-style:none;margin:22px 0 0;padding:0 0 0 30px;position:relative}
.map-timeline::before{content:"";position:absolute;left:9px;top:12px;bottom:12px;width:2px;background:var(--linie)}
.map-timeline>li{position:relative;margin:0 0 16px}
.map-timeline>li::before{content:"";position:absolute;left:-28px;top:26px;width:16px;height:16px;border-radius:50%;background:var(--papier);border:3px solid var(--kiste)}
.map-timeline>li[data-zustand=laeuft]::before{border-color:var(--wuerfel-dunkel);background:var(--wuerfel)}
.map-timeline>li[data-zustand=archiviert]::before{border-color:var(--ok);background:var(--ok)}
.map-timeline>li[data-aktuell=true] .map-step{border-color:var(--tinte);box-shadow:var(--schatten)}
.map-step{background:var(--papier);border:1px solid var(--linie);border-radius:var(--radius);padding:18px 22px}
.map-step h2{margin:2px 0 6px;font-size:1.3rem}.map-state{margin:0 0 12px;color:var(--tinte-weich);font-size:.92rem}
.map-history{margin-top:14px;font-size:.9rem}.map-history>summary{cursor:pointer;color:var(--tinte-weich)}
.zugang-zeile{margin:6px 0 10px}
@media(max-width:650px){.map-timeline{padding-left:24px}.map-timeline>li::before{left:-22px}.map-step{padding:14px 16px}.map-class{padding:16px}}

/* Sendestatus in der Arbeitsblattleiste */
.worksheet-message[data-zustand="wartet"],.worksheet-message[data-zustand="fehler"]{color:#a3231c;font-weight:600}
.worksheet-message[data-zustand="sendet"]{color:#4e555c}
