:root {
    --primary: #0B2D4D;
    --accent: #2D7DD2;
    --page: #F4F7FB;
    --surface: #FFFFFF;
    --text: #172434;
    --muted: #66778A;
    --line: #DCE4EC;
    --danger: #B42318;
    --success: #138A4B;
    --warning: #9A6700;
    --radius: 18px;
    --shadow: 0 14px 35px rgba(11, 45, 77, .10);
    --topbar-h: 64px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color-scheme: light;
}

/* Keep grade entry columns only wide enough for values such as 3,5. */
.gradebook-table-scroll { overflow-x: auto; }
.gradebook-overview-table {
    width: calc(150px + 46px * var(--grade-data-columns, 1));
    min-width: 100%;
    max-width: none;
    table-layout: fixed;
}
.gradebook-overview-table col.gradebook-data-col,
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    padding: 2px 1px !important;
}
.gradebook-overview-table .gradebook-score-cell {
    width: 40px;
    max-width: 40px;
    min-width: 0;
    padding-inline: 1px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--page); }
body { margin: 0; min-height: 100vh; background: var(--page); color: var(--text); -webkit-tap-highlight-color: transparent; }
button, input { font: inherit; }
button, a { touch-action: manipulation; }
button { cursor: pointer; }
a { color: inherit; }
[hidden] { display: none !important; }

.topbar {
    position: fixed; z-index: 70; top: 0; left: 0; right: 0; height: calc(var(--topbar-h) + env(safe-area-inset-top));
    padding: env(safe-area-inset-top) max(14px, env(safe-area-inset-right)) 0 max(14px, env(safe-area-inset-left));
    display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 8px;
    background: var(--primary); color: #fff; box-shadow: 0 4px 18px rgba(0,0,0,.16);
}
.hamburger { width: 44px; height: 44px; border: 0; border-radius: 12px; background: rgba(255,255,255,.12); display: grid; place-items: center; }
.hamburger span, .hamburger span::before, .hamburger span::after { width: 22px; height: 2px; background: #fff; border-radius: 4px; display: block; position: relative; }
.hamburger span::before, .hamburger span::after { content: ""; position: absolute; left: 0; }
.hamburger span::before { top: -7px; }
.hamburger span::after { top: 7px; }
.topbar-brand { text-decoration: none; display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.05rem; justify-self: start; }
.topbar-mark, .brand-mark, .auth-logo { display: grid; place-items: center; background: #fff; color: var(--primary); font-weight: 900; border-radius: 11px; }
.topbar-mark { width: 32px; height: 32px; }
.topbar-user { font-size: .9rem; font-weight: 700; opacity: .9; padding-right: 6px; }

.drawer-overlay { position: fixed; z-index: 79; inset: 0; background: rgba(4,17,30,.45); opacity: 0; visibility: hidden; transition: .2s ease; }
.drawer-overlay.open { opacity: 1; visibility: visible; }
.drawer {
    position: fixed; z-index: 80; top: 0; bottom: 0; left: 0; width: min(88vw, 340px);
    padding: max(20px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));
    background: #fff; box-shadow: 20px 0 50px rgba(0,0,0,.22); transform: translateX(-105%); transition: transform .22s ease;
    display: flex; flex-direction: column; overflow-y: auto;
}
.drawer.open { transform: translateX(0); }
.drawer-brand { display: flex; align-items: center; gap: 12px; padding: 6px 8px 18px; border-bottom: 1px solid var(--line); }
.brand-mark { width: 44px; height: 44px; background: var(--primary); color: #fff; font-size: 1.35rem; }
.drawer-brand strong, .drawer-brand small { display: block; }
.drawer-brand small { color: var(--muted); margin-top: 2px; }
.drawer-nav { padding: 12px 0; flex: 1; }
.nav-section { margin: 16px 10px 6px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; font-weight: 800; }
.nav-link { width: 100%; min-height: 48px; padding: 12px 14px; border-radius: 12px; display: flex; align-items: center; text-decoration: none; border: 0; background: transparent; color: var(--text); font-weight: 700; text-align: left; }
.nav-link:hover, .nav-link:focus-visible, .nav-link.active { background: color-mix(in srgb, var(--accent) 12%, white); color: var(--primary); outline: none; }
.nav-button { cursor: pointer; }
.drawer-user { padding: 14px; border-radius: 14px; background: var(--page); }
.drawer-user strong, .drawer-user span { display: block; }
.drawer-user span { margin-top: 3px; color: var(--muted); font-size: .84rem; overflow-wrap: anywhere; }

.page-container { width: min(1180px, calc(100% - 28px)); margin: 0 auto; padding: calc(var(--topbar-h) + env(safe-area-inset-top) + 28px) 0 max(34px, env(safe-area-inset-bottom)); }
.app-page-container { width: min(1400px, calc(100% - 24px)); }
.content-section { display: grid; gap: 18px; }
.narrow-section { max-width: 720px; margin-inline: auto; }

h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(1.7rem, 4vw, 2.5rem); line-height: 1.08; margin-bottom: 10px; }
h2 { font-size: 1.25rem; margin-bottom: 8px; }
h3 { font-size: 1rem; margin: 0; }
.eyebrow { margin: 0 0 6px; color: var(--accent); text-transform: uppercase; letter-spacing: .09em; font-weight: 900; font-size: .74rem; }
.muted { color: var(--muted); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin: 8px 0 14px; }
.section-heading h1, .section-heading h2, .section-heading p { margin-bottom: 0; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; }
.btn { min-height: 44px; border: 0; border-radius: 12px; padding: 10px 16px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
.btn:disabled { opacity: .45; cursor: default; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { filter: brightness(1.08); }
.btn-secondary { background: #EAF0F5; color: var(--primary); }
.btn-ghost { background: transparent; color: var(--primary); border: 1px solid var(--line); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-danger-soft { background: #FDECEA; color: var(--danger); }
.btn-large { min-height: 52px; padding-inline: 22px; }
.btn-small { min-height: 38px; padding: 8px 12px; font-size: .88rem; }
.btn-full { width: 100%; }
.button-row { display: flex; flex-wrap: wrap; gap: 8px; }

.flash { margin-bottom: 18px; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: #fff; font-weight: 700; }
.flash.success { border-color: #9BD5B6; background: #F0FBF5; }
.flash.error { border-color: #F1B5AF; background: #FEF3F2; color: #8A1C13; }
.flash.warning { border-color: #F0D38A; background: #FFFAEB; color: #7A5200; }
.copy-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 10px; }
.copy-row input { min-width: 0; }

.auth-shell { min-height: calc(100vh - 150px); display: grid; place-items: center; }
.auth-card { width: min(100%, 520px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); padding: clamp(22px, 5vw, 38px); }
.auth-logo { width: 58px; height: 58px; background: var(--primary); color: #fff; font-size: 1.7rem; margin-bottom: 22px; }
.text-link { display: inline-block; margin-top: 18px; color: var(--accent); font-weight: 800; }
.form-stack { display: grid; gap: 14px; }
.form-stack label, .app-dialog label { display: grid; gap: 7px; font-size: .86rem; font-weight: 800; color: var(--text); }
input[type="text"], input[type="email"], input[type="password"], input[type="date"], input:not([type]) { width: 100%; min-height: 48px; border: 1px solid #C9D4DE; border-radius: 12px; padding: 10px 12px; background: #fff; color: var(--text); }
input:focus { outline: 3px solid color-mix(in srgb, var(--accent) 22%, transparent); border-color: var(--accent); }
.form-hint { color: var(--muted); font-size: .82rem; margin: -4px 0 0; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.touch-choice { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.touch-choice legend { width: 100%; margin-bottom: 6px; font-size: .86rem; font-weight: 800; }
.touch-choice label { position: relative; }
.touch-choice input { position: absolute; opacity: 0; pointer-events: none; }
.touch-choice span, .category-choice-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 12px; padding: 9px 15px; background: #fff; font-weight: 800; }
.touch-choice input:checked + span { background: var(--primary); color: #fff; border-color: var(--primary); }
.toggle-line { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 10px !important; }
.toggle-line input { width: 24px; height: 24px; accent-color: var(--primary); }
.admin-grid { display: grid; grid-template-columns: minmax(300px, .75fr) minmax(0, 1.5fr); gap: 18px; align-items: start; }
.user-list { display: grid; gap: 14px; }
.user-card { display: grid; gap: 16px; }
.card-title-row { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.card-title-row h2, .card-title-row p { margin-bottom: 2px; }
.status-pill { border-radius: 999px; padding: 6px 10px; font-size: .76rem; font-weight: 900; }
.status-pill.ok { background: #E8F7EF; color: var(--success); }
.status-pill.off { background: #F1F3F5; color: #667085; }
.compact-form { padding-top: 4px; border-top: 1px solid var(--line); }

.sync-banner { position: sticky; top: calc(var(--topbar-h) + env(safe-area-inset-top) + 8px); z-index: 40; min-height: 42px; margin-bottom: 14px; padding: 8px 12px; border-radius: 13px; background: #ECF8F1; color: #17653A; border: 1px solid #B8E1C9; display: flex; align-items: center; gap: 8px; box-shadow: 0 4px 14px rgba(0,0,0,.06); font-weight: 800; font-size: .82rem; }
.sync-banner.offline { background: #FFF7E6; color: #805A00; border-color: #EED18C; }
.sync-banner.pending { background: #EEF5FF; color: #245C99; border-color: #BFD5EE; }
.sync-dot { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: currentColor; }
.syncing .sync-dot { animation: pulse 1s infinite; }
.sync-action { margin-left: auto; border: 0; background: transparent; color: inherit; font-weight: 900; padding: 6px 8px; }
@keyframes pulse { 50% { opacity: .3; transform: scale(.72); } }

.gradebook-app { display: grid; gap: 10px; }
.app-view { min-width: 0; }
.hero-panel { border-radius: 24px; padding: clamp(22px, 4vw, 38px); background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 72%, var(--accent))); color: #fff; display: flex; align-items: end; justify-content: space-between; gap: 20px; box-shadow: var(--shadow); }
.hero-panel .eyebrow { color: #CDE6FF; }
.hero-panel h1 { max-width: 650px; }
.hero-panel p:not(.eyebrow) { margin: 0; opacity: .86; }
.hero-panel .btn-primary { background: #fff; color: var(--primary); flex: 0 0 auto; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 14px 0 22px; }
.metric-card { min-height: 100px; background: #fff; border: 1px solid var(--line); border-radius: 17px; padding: 18px; display: flex; flex-direction: column; justify-content: center; box-shadow: 0 8px 20px rgba(11,45,77,.06); }
.metric-card strong { font-size: 1.8rem; color: var(--primary); }
.metric-card span { color: var(--muted); font-weight: 700; }
.course-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.course-summary-card { min-height: 140px; text-align: left; border: 1px solid var(--line); border-radius: 18px; background: #fff; padding: 20px; box-shadow: 0 8px 20px rgba(11,45,77,.06); display: grid; align-content: center; gap: 8px; color: var(--text); }
.course-summary-card strong { font-size: 1.2rem; }
.course-summary-card span { color: var(--muted); }
.course-summary-card i { font-style: normal; color: var(--accent); font-weight: 900; margin-top: 7px; }

.course-tabs, .touch-selector { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 10px; scrollbar-width: thin; }
.touch-chip { flex: 0 0 auto; min-height: 46px; border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: 10px 16px; font-weight: 900; color: var(--text); }
.touch-chip.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.course-workspace-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.course-workspace-head h2, .course-workspace-head p { margin-bottom: 3px; }
.manage-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.manage-panel { min-width: 0; }
.mini-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 12px; margin-bottom: 8px; border-bottom: 1px solid var(--line); }
.mini-heading > div { display: flex; align-items: center; gap: 9px; }
.mini-heading span { color: var(--muted); font-size: .82rem; font-weight: 800; }
.weight-ok { color: var(--success) !important; }
.weight-warning { color: var(--warning) !important; }
.student-manage-list, .category-list { display: grid; gap: 7px; max-height: 460px; overflow-y: auto; }
.manage-row { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 6px 8px 10px; border-radius: 12px; background: #F7F9FB; }
.manage-row strong, .manage-row small { display: block; }
.manage-row small { color: var(--muted); margin-top: 2px; }
.manage-name-button { border: 0; background: transparent; text-align: left; padding: 0; color: inherit; flex: 1; }
.icon-action { width: 38px; height: 38px; flex: 0 0 auto; border: 0; border-radius: 11px; background: #EEF2F5; font-size: 1.25rem; font-weight: 800; }
.icon-action.danger { color: var(--danger); background: #FDECEA; }
.category-row { display: grid; grid-template-columns: 1fr 38px; gap: 7px; align-items: center; }
.category-card { min-height: 58px; width: 100%; display: grid; grid-template-columns: 9px 1fr auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: #fff; padding: 8px 10px; text-align: left; color: var(--text); }
.category-card strong, .category-card small { display: block; }
.category-card small { color: var(--muted); margin-top: 2px; }
.category-card i { font-style: normal; color: var(--accent); font-size: .8rem; font-weight: 900; }
.category-swatch, .context-color { background: var(--category-color); border-radius: 999px; }
.category-swatch { width: 8px; height: 38px; }
.assessments-panel { margin-top: 14px; }
.assessment-grid { display: grid; gap: 9px; }
.assessment-card { min-height: 82px; border: 1px solid var(--line); border-radius: 15px; background: #fff; display: grid; grid-template-columns: 8px 1fr auto; overflow: hidden; }
.assessment-color { background: var(--category-color); }
.assessment-content { padding: 13px; display: grid; gap: 3px; }
.assessment-content small, .assessment-content span { color: var(--muted); }
.assessment-content strong { font-size: 1rem; }
.assessment-actions { display: flex; align-items: center; gap: 6px; padding: 10px; }
.notice-line { color: var(--warning); font-weight: 800; }
.inline-empty { padding: 18px; border: 1px dashed #C8D3DD; border-radius: 13px; color: var(--muted); text-align: center; }
.inline-empty.wide { min-width: min(420px, 90vw); }
.empty-state { min-height: 140px; border: 1px dashed #C8D3DD; border-radius: 17px; display: grid; place-content: center; gap: 5px; padding: 20px; text-align: center; color: var(--muted); background: rgba(255,255,255,.5); }
.empty-state strong { color: var(--text); }

.grade-heading { align-items: center; }
.grade-context { display: flex; align-items: center; gap: 9px; min-height: 48px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 8px 12px; }
.grade-context strong, .grade-context small { display: block; }
.grade-context small { color: var(--muted); margin-top: 2px; }
.context-color { width: 8px; height: 34px; }
.assessment-selector { padding-bottom: 12px; }
.assessment-chip { flex: 0 0 auto; min-width: 190px; min-height: 60px; border: 1px solid var(--line); border-left: 7px solid var(--category-color); border-radius: 14px; background: #fff; text-align: left; padding: 9px 12px; color: var(--text); }
.assessment-chip span, .assessment-chip small { display: block; }
.assessment-chip span { font-weight: 900; }
.assessment-chip small { color: var(--muted); margin-top: 3px; }
.assessment-chip.active { box-shadow: inset 0 0 0 2px var(--primary); border-color: var(--primary); border-left-color: var(--category-color); }
.grade-layout { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 14px; align-items: start; }
.grade-layout.score-pad-closed { grid-template-columns: minmax(0, 1fr); }
.student-grade-list { background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; box-shadow: var(--shadow); min-height: 300px; }
.student-grade-row { width: 100%; min-height: 64px; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--line); background: #fff; display: grid; grid-template-columns: 34px 1fr 54px; align-items: center; gap: 10px; text-align: left; color: var(--text); }
.student-grade-row:last-child { border-bottom: 0; }
.student-grade-row.active { background: color-mix(in srgb, var(--accent) 10%, white); box-shadow: inset 5px 0 0 var(--accent); }
.student-index { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #EEF2F5; color: var(--muted); font-size: .78rem; font-weight: 900; }
.student-name strong, .student-name small { display: block; }
.student-name small { color: var(--muted); margin-top: 3px; }
.student-score { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; background: #EEF2F5; font-size: 1.25rem; font-weight: 900; color: var(--muted); }
.student-score.has-score { background: var(--category-color, var(--primary)); color: #fff; }
.score-pad { position: sticky; top: calc(var(--topbar-h) + env(safe-area-inset-top) + 62px); background: #fff; border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); padding: 14px; }
.score-pad-head { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 4px 4px 12px; }
.score-pad-head small, .score-pad-head strong { display: block; }
.score-pad-controls { display: flex; align-items: center; gap: 8px; }
.score-pad-close { width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #EEF2F5; color: var(--muted); font-size: 1.55rem; line-height: 1; font-weight: 900; cursor: pointer; }
.score-pad-close:active { transform: scale(.94); }
.score-pad-head small { color: var(--muted); margin-bottom: 2px; }
.current-score { min-width: 54px; height: 54px; display: grid; place-items: center; border-radius: 15px; background: var(--primary); color: #fff; font-size: 1.6rem; font-weight: 900; }
.score-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.score-button { aspect-ratio: 1.22 / 1; min-height: 54px; border: 1px solid #CBD5DF; border-radius: 13px; background: #F8FAFC; color: var(--primary); font-size: 1.2rem; font-weight: 900; }
.score-button.active { background: var(--accent); color: #fff; border-color: var(--accent); transform: scale(.97); }
.score-button:active { transform: scale(.95); }
.score-nav { display: grid; grid-template-columns: 58px 1fr 58px; gap: 8px; margin-top: 10px; }
.score-nav-btn, .score-clear { min-height: 52px; border: 0; border-radius: 13px; font-weight: 900; }
.score-nav-btn { background: var(--primary); color: #fff; font-size: 1.4rem; }
.score-clear { background: #EEF2F5; color: var(--text); }
.score-nav-btn:disabled, .score-clear:disabled { opacity: .35; }

.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.theme-form { display: grid; gap: 12px; }
.color-row { min-height: 56px; display: flex !important; grid-template-columns: unset !important; align-items: center; justify-content: space-between; gap: 14px !important; padding: 8px 10px 8px 14px; border: 1px solid var(--line); border-radius: 13px; }
input[type="color"] { width: 72px; height: 40px; border: 0; padding: 0; border-radius: 10px; background: transparent; }
.offline-explainer { margin-top: 16px; padding: 14px; background: var(--page); border-radius: 13px; }
.offline-explainer strong, .offline-explainer span { display: block; }
.offline-explainer span { color: var(--muted); margin-top: 4px; }

.app-dialog, .confirm-dialog { width: min(92vw, 560px); border: 0; border-radius: 20px; padding: 0; box-shadow: 0 30px 80px rgba(0,0,0,.28); color: var(--text); }
.app-dialog::backdrop, .confirm-dialog::backdrop { background: rgba(4,17,30,.55); }
.app-dialog form, .confirm-dialog form { padding: 20px; display: grid; gap: 16px; }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dialog-head h2 { margin: 0; }
.icon-close { width: 42px; height: 42px; border: 0; border-radius: 12px; background: #EEF2F5; font-size: 1.5rem; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.exam-makeup-destination { display: grid; gap: 7px; color: var(--text); font-weight: 800; }
.exam-makeup-destination select { width: 100%; min-height: 46px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--text); font: inherit; }
.stepper-field { display: grid; gap: 7px; font-size: .86rem; font-weight: 800; }
.weight-stepper { display: grid; grid-template-columns: 54px 1fr 54px; gap: 8px; }
.weight-stepper button, .weight-stepper output { min-height: 50px; border: 1px solid var(--line); border-radius: 13px; display: grid; place-items: center; background: #F8FAFC; color: var(--primary); font-weight: 900; font-size: 1.1rem; }
.weight-stepper button { font-size: 1.5rem; }
.category-choice { display: flex; flex-wrap: wrap; gap: 8px; }
.category-choice legend { width: 100%; }
.category-choice-button { gap: 8px; color: var(--text); }
.category-choice-button > span { width: 9px; height: 28px; border-radius: 999px; background: var(--category-color); padding: 0; min-height: 0; border: 0; }
.category-choice-button.active { border-color: var(--primary); box-shadow: inset 0 0 0 2px var(--primary); }

.toast { position: fixed; z-index: 120; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); transform: translate(-50%, 20px); max-width: min(90vw, 520px); padding: 12px 16px; border-radius: 13px; background: #172434; color: #fff; font-weight: 800; opacity: 0; visibility: hidden; transition: .18s ease; box-shadow: 0 12px 34px rgba(0,0,0,.25); text-align: center; }
.toast.show { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

@media (max-width: 900px) {
    .admin-grid, .manage-grid, .settings-grid { grid-template-columns: 1fr; }
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
    .grade-layout { grid-template-columns: 1fr 340px; }
    .score-button { min-height: 50px; }
}

@media (max-width: 720px) {
    :root { --topbar-h: 58px; }
    .page-container, .app-page-container { width: min(100% - 16px, 1400px); padding-top: calc(var(--topbar-h) + env(safe-area-inset-top) + 18px); }
    .topbar { grid-template-columns: 46px 1fr auto; }
    .topbar-user { display: none; }
    .topbar-brand { font-size: .98rem; }
    .hero-panel { align-items: stretch; flex-direction: column; }
    .hero-panel .btn-primary { width: 100%; }
    .metric-grid { gap: 8px; }
    .metric-card { min-height: 84px; padding: 14px; }
    .metric-card strong { font-size: 1.5rem; }
    .section-heading { align-items: center; }
    .section-heading.grade-heading { align-items: stretch; flex-direction: column; }
    .grade-context { width: 100%; }
    .course-workspace-head { align-items: stretch; flex-direction: column; }
    .assessment-card { grid-template-columns: 7px 1fr; }
    .assessment-actions { grid-column: 2; padding-top: 0; flex-wrap: wrap; }
    .two-col { grid-template-columns: 1fr; }
    .copy-row { grid-template-columns: 1fr; }

    .grades-view { padding-bottom: 360px; }
    .grades-view.score-pad-closed { padding-bottom: 0; }
    .grade-layout { display: block; }
    .student-grade-list { min-height: 180px; }
    .score-pad {
        position: fixed; z-index: 55; left: max(8px, env(safe-area-inset-left)); right: max(8px, env(safe-area-inset-right)); bottom: max(8px, env(safe-area-inset-bottom)); top: auto;
        border-radius: 18px; padding: 10px; box-shadow: 0 -12px 40px rgba(7,30,53,.22);
    }
    .score-pad-head { padding-bottom: 8px; }
    .score-pad-close { width: 34px; height: 34px; font-size: 1.35rem; }
    .current-score { min-width: 46px; height: 46px; font-size: 1.35rem; }
    .score-grid { gap: 6px; }
    .score-button { min-height: 44px; aspect-ratio: auto; border-radius: 11px; font-size: 1.05rem; }
    .score-nav { margin-top: 7px; grid-template-columns: 52px 1fr 52px; gap: 6px; }
    .score-nav-btn, .score-clear { min-height: 46px; }
    .student-grade-row { min-height: 60px; padding-inline: 9px; }
    .sync-banner { top: calc(var(--topbar-h) + env(safe-area-inset-top) + 6px); }
}

/* Compact grade columns keep the entry fields tight and reduce horizontal scrolling. */
.gradebook-table-scroll {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}
.gradebook-overview-table {
    width: calc(150px + 64px * var(--grade-data-columns, 1));
    min-width: 100%;
    max-width: none;
    table-layout: fixed;
}
.gradebook-overview-table col.gradebook-student-col,
.gradebook-overview-table th:first-child,
.gradebook-overview-table td:first-child,
.gradebook-overview-table thead th.gradebook-student-head {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
}
.gradebook-overview-table col.gradebook-data-col,
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
}
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    padding: 3px 2px !important;
}
.gradebook-overview-table .gradebook-assessment-head {
    min-width: 0;
    padding-inline: 1px;
}
.gradebook-overview-table .gradebook-score-cell {
    width: 48px;
    max-width: 48px;
}

@media (max-width: 430px) {
    .metric-grid { grid-template-columns: 1fr 1fr; }
    .btn { padding-inline: 12px; }
    .section-heading > .btn { flex: 0 0 auto; }
    .assessment-actions .btn { flex: 1; }
    .grade-context { font-size: .9rem; }
    .student-name strong { font-size: .92rem; }
    .student-name small { font-size: .76rem; }
    .grades-view { padding-bottom: 344px; }
    .grades-view.score-pad-closed { padding-bottom: 0; }
}

@media (orientation: landscape) and (min-width: 900px) {
    .score-pad { position: sticky; }
    .student-grade-list { max-height: calc(100vh - 260px); overflow-y: auto; }
}

.summary-panel { margin-top: 14px; }
.summary-scroll { overflow-x: auto; }
.grade-summary-table { width: 100%; min-width: 620px; border-collapse: collapse; }
.grade-summary-table th, .grade-summary-table td { padding: 11px 12px; border-bottom: 1px solid var(--line); text-align: center; white-space: nowrap; }
.grade-summary-table th:first-child, .grade-summary-table td:first-child { text-align: left; position: sticky; left: 0; background: #fff; z-index: 1; }
.grade-summary-table th { color: var(--muted); font-size: .8rem; vertical-align: bottom; }
.grade-summary-table th small { display: block; margin-top: 3px; }
.grade-summary-table tbody tr:last-child td { border-bottom: 0; }
.summary-category-dot { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: var(--category-color); }
.summary-total { font-weight: 900; color: var(--primary); }

/* Kursarten & Schülerimport */
.button-row.compact { gap: 6px; }
.student-title-line, .selected-student-line { display: inline-flex; align-items: center; gap: 7px; flex-wrap: wrap; min-width: 0; }
.student-title-line strong { min-width: 0; }
.manage-name-button small { overflow-wrap: anywhere; }
.course-type-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; padding: 3px 8px; border-radius: 999px; font-size: .68rem; line-height: 1; font-weight: 950; letter-spacing: .035em; white-space: nowrap; border: 1px solid transparent; vertical-align: middle; }
/* Jede bekannte Kursart hat eine eigene, dauerhaft eindeutige Badge-Farbe. */
.course-type-badge.type-lk  { background: #E0F2FE; color: #075985; border-color: #38BDF8; }
.course-type-badge.type-gks { background: #DCFCE7; color: #166534; border-color: #4ADE80; }
.course-type-badge.type-gkm { background: #FEF3C7; color: #92400E; border-color: #F59E0B; }
.course-type-badge.type-ab3 { background: #FCE7F3; color: #9D174D; border-color: #F472B6; }
.course-type-badge.type-ab4 { background: #EDE9FE; color: #5B21B6; border-color: #A78BFA; }
.course-type-badge.other    { background: #F1F5F9; color: #475569; border-color: #CBD5E1; }
.course-type-choice button { min-height: 46px; border: 1px solid var(--line); border-radius: 12px; padding: 9px 15px; background: #fff; color: var(--text); font-weight: 900; }
.course-type-choice button.active { background: var(--primary); color: #fff; border-color: var(--primary); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.score-pad-head .selected-student-line { justify-content: flex-start; }
.grade-summary-table .student-title-line { flex-wrap: nowrap; }

@media (max-width: 430px) {
    .course-type-badge { min-height: 22px; padding: 3px 7px; font-size: .64rem; }
    .mini-heading .button-row.compact .btn { padding-inline: 10px; }
}

/* Benutzerverwaltung 0.3.0 */
.info-panel { margin-bottom: 18px; }
.info-panel p { margin: 6px 0 0; }
.user-admin-actions { display: grid; gap: 10px; }
.user-admin-actions form { margin: 0; }

/* Kategorienhierarchie, Schnellanlage & kompakter Sync-Status 0.4.0 */
.drawer-sync {
    margin: 14px 8px 4px;
    min-height: 34px;
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 7px 9px;
    border-radius: 10px;
    background: #F1F8F4;
    color: #17653A;
    font-size: .72rem;
    font-weight: 800;
    border: 1px solid #D5EBDD;
}
.drawer-sync.offline { background: #FFF8E8; color: #805A00; border-color: #F0DEAB; }
.drawer-sync.pending { background: #F2F6FC; color: #245C99; border-color: #D8E3F0; }
.drawer-sync button { border: 0; background: transparent; color: inherit; padding: 4px 3px; font-weight: 900; font-size: .7rem; }
.drawer-sync .sync-dot { width: 7px; height: 7px; }

.grade-create-bar {
    margin: 0 0 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.grade-create-bar strong, .grade-create-bar small { display: block; }
.grade-create-bar small { margin-top: 2px; color: var(--muted); font-size: .78rem; }

.structure-panel { margin-top: 14px; }
.structure-help { margin: -2px 0 14px; font-size: .85rem; }
.category-tree { display: grid; gap: 12px; }
.category-tree-node {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--category-color) 3%, white);
    overflow: hidden;
}
.category-tree-node .category-tree-node { box-shadow: none; }
.category-tree-head {
    min-height: 58px;
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-bottom: 1px solid color-mix(in srgb, var(--category-color) 18%, var(--line));
}
.category-tree-head > .category-swatch { width: 9px; height: 38px; border-radius: 999px; background: var(--category-color); }
.category-tree-title { border: 0; background: transparent; padding: 4px 2px; color: var(--text); text-align: left; min-width: 0; }
.category-tree-title strong, .category-tree-title small { display: block; }
.category-tree-title small { color: var(--muted); margin-top: 3px; font-size: .75rem; }
.category-tree-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.btn-tiny { min-height: 34px; padding: 6px 9px; border-radius: 10px; font-size: .76rem; }
.structure-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
    gap: 10px;
    padding: 10px;
    background: rgba(255,255,255,.68);
}
.structure-items > .category-tree-node { align-self: start; }
.structure-assessment {
    min-height: 76px;
    display: grid;
    grid-template-columns: 7px minmax(0, 1fr) auto;
    border: 1px solid var(--line);
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
}
.structure-assessment .assessment-color { background: var(--category-color); }
.structure-assessment .assessment-content { padding: 10px; min-width: 0; }
.structure-assessment .assessment-content strong,
.structure-assessment .assessment-content small,
.structure-assessment .assessment-content span { display: block; }
.structure-assessment .assessment-content small,
.structure-assessment .assessment-content span { color: var(--muted); font-size: .76rem; }
.structure-assessment .assessment-content strong { margin: 2px 0 3px; overflow-wrap: anywhere; }
.structure-assessment .assessment-actions { padding: 8px; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 5px; }
.inline-empty.compact { min-height: 50px; padding: 12px; }
.student-manage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 8px; }

.app-dialog-wide { width: min(94vw, 680px); }
.category-parent-choice, .category-choice { max-height: 245px; overflow-y: auto; align-content: start; padding: 2px 2px 4px; }
.category-parent-choice .category-choice-button,
.category-choice .category-choice-button { text-align: left; justify-content: flex-start; }
.dialog-hint { margin: -5px 0 0; color: var(--muted); font-size: .78rem; line-height: 1.4; }

@media (max-width: 720px) {
    .grade-create-bar { align-items: stretch; flex-direction: column; }
    .grade-create-bar .button-row { display: grid; grid-template-columns: 1fr 1fr; }
    .category-tree-head { grid-template-columns: 8px minmax(0, 1fr); }
    .category-tree-actions { grid-column: 2; justify-content: flex-start; }
    .structure-items { grid-template-columns: 1fr; }
    .structure-assessment { grid-template-columns: 6px minmax(0, 1fr); }
    .structure-assessment .assessment-actions { grid-column: 2; justify-content: flex-start; padding-top: 0; }
}

/* Strukturverwaltung & frei definierbare Noten-Kennzeichnungen 0.5.1 */
.standalone-structure-panel { margin-top: 14px; }
.structure-order-actions .icon-action { font-size: 1rem; font-weight: 950; }
.assessment-label-badge {
    --label-color: #2D7DD2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    max-width: 100%;
    padding: 3px 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--label-color) 15%, white);
    color: color-mix(in srgb, var(--label-color) 78%, #111827);
    border: 1px solid color-mix(in srgb, var(--label-color) 45%, white);
    font-size: .68rem;
    line-height: 1.15;
    font-weight: 950;
    white-space: nowrap;
    vertical-align: middle;
}
.assessment-chip-title { display: flex !important; align-items: center; flex-wrap: wrap; gap: 6px; }
.grade-context strong .assessment-label-badge { margin-left: 5px; }
.structure-assessment .assessment-content small { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.label-settings-panel { grid-column: span 2; }
.label-admin-list { display: grid; gap: 8px; margin-top: 14px; }
.label-admin-row {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
}
.label-choice { max-height: 220px; overflow-y: auto; padding: 2px; }
.label-choice-button {
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 9px 13px;
    background: #fff;
    color: var(--text);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 850;
}
.label-choice-button.active { border-color: var(--primary); box-shadow: inset 0 0 0 2px var(--primary); }
.label-choice-dot { width: 11px; height: 11px; border-radius: 999px; background: var(--label-color); flex: 0 0 auto; }
[data-move-target-choice] { max-height: 330px; overflow-y: auto; }

@media (max-width: 800px) {
    .label-settings-panel { grid-column: auto; }
    .label-admin-row { align-items: flex-start; flex-direction: column; }
    .structure-order-actions { width: 100%; justify-content: flex-start; }
}

/* 0.5.2: robuster Start bei blockiertem/temporär nicht verfügbarem Offline-Speicher */
.runtime-banner {
    margin: 0 0 14px;
    padding: 11px 13px;
    border: 1px solid rgba(11,45,77,.14);
    border-radius: 14px;
    background: rgba(255,255,255,.94);
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 3px 10px;
    align-items: center;
    box-shadow: 0 8px 22px rgba(11,45,77,.06);
}
.runtime-banner strong { font-size: .86rem; }
.runtime-banner span { grid-column: 1; color: var(--muted); font-size: .76rem; line-height: 1.35; }
.runtime-banner button { grid-column: 2; grid-row: 1 / span 2; }
.runtime-banner.warning { border-color: rgba(199,127,0,.3); background: #fffaf0; }
.runtime-banner.error { border-color: rgba(181,53,53,.3); background: #fff5f5; }
.runtime-banner.info { border-color: rgba(45,125,210,.25); background: #f4f9ff; }
.drawer-sync.server-only .sync-dot { opacity: .65; }

@media (max-width: 640px) {
    .runtime-banner { grid-template-columns: 1fr; }
    .runtime-banner span, .runtime-banner button { grid-column: 1; grid-row: auto; }
    .runtime-banner button { justify-self: start; margin-top: 4px; }
}

.drawer-sync.conflict .sync-dot {
    background: #d97706;
}
.drawer-sync.conflict [data-sync-now] {
    opacity: .75;
}


/* 0.5.3: Long-Press zum Bearbeiten einer Note in der Noteneingabe */
.assessment-longpress-hint {
    margin: -5px 2px 10px;
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.3;
}
.assessment-chip,
.grade-context-longpress {
    -webkit-touch-callout: none;
    user-select: none;
}
.assessment-chip.long-press-pending,
.grade-context-longpress.long-press-pending {
    box-shadow: inset 0 0 0 2px var(--accent), 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
    transform: scale(.985);
}
.grade-context-longpress {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 9px;
    border-radius: 10px;
    cursor: pointer;
    touch-action: pan-y;
}
.grade-context-longpress:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent);
    outline-offset: 3px;
}
.assessment-chip { touch-action: pan-x pan-y; transition: transform .12s ease, box-shadow .12s ease; }
@media (max-width: 640px) {
    .assessment-longpress-hint { font-size: .68rem; margin-bottom: 8px; }
}


/* 0.5.4: Note direkt als Overlay über der Noteneingabe bearbeiten */
.app-dialog.grade-assessment-edit-overlay {
    width: min(94vw, 680px);
    max-height: min(88dvh, 760px);
    overflow: hidden;
}
.app-dialog.grade-assessment-edit-overlay form {
    max-height: min(88dvh, 760px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.app-dialog.grade-assessment-edit-overlay::backdrop {
    background: rgba(4,17,30,.42);
    backdrop-filter: blur(2px);
}
@media (max-width: 700px) {
    .app-dialog.grade-assessment-edit-overlay {
        width: min(calc(100vw - 28px), 620px);
        max-width: 620px;
        max-height: min(86dvh, 720px);
        margin: auto;
        inset: 0;
        border-radius: 24px;
    }
    .app-dialog.grade-assessment-edit-overlay form {
        max-height: min(86dvh, 720px);
        padding-bottom: calc(20px + env(safe-area-inset-bottom));
    }
    .app-dialog.grade-assessment-edit-overlay .dialog-actions {
        position: sticky;
        bottom: calc(-20px - env(safe-area-inset-bottom));
        margin: 0 -20px calc(-20px - env(safe-area-inset-bottom));
        padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
        background: rgba(255,255,255,.96);
        border-top: 1px solid var(--line);
        backdrop-filter: blur(10px);
    }
}

/* 0.5.5: Dashboard -> Kursauswahl -> kursbezogene Notenübersicht */
.home-course-heading { margin-top: 24px; }
.quick-course-dialog form { gap: 14px; }
.quick-course-list { display: grid; gap: 10px; }
.quick-course-button {
    min-height: 68px;
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fff;
    color: var(--text);
    padding: 13px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    text-align: left;
    box-shadow: 0 5px 14px rgba(11,45,77,.05);
}
.quick-course-button strong { font-size: 1.02rem; }
.quick-course-button span { color: var(--muted); font-size: .82rem; font-weight: 800; white-space: nowrap; }
.quick-course-button:active { transform: scale(.985); }

.grade-overview-workspace { margin-top: 12px; }
.grade-entry-workspace { margin-top: 4px; }
.grade-entry-toolbar { display: flex; justify-content: flex-start; margin: 2px 0 10px; }
.gradebook-overview-panel { min-width: 0; }
.gradebook-overview-hint { color: var(--muted); font-size: .78rem; font-weight: 800; }
.gradebook-table-scroll {
    overflow: auto;
    max-width: 100%;
    border: 1px solid var(--line);
    border-radius: 15px;
    overscroll-behavior-inline: contain;
}
.gradebook-overview-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}
.gradebook-overview-table th,
.gradebook-overview-table td {
    min-width: 82px;
    padding: 8px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    text-align: center;
    vertical-align: middle;
}
.gradebook-overview-table tr:last-child td { border-bottom: 0; }
.gradebook-overview-table th:last-child,
.gradebook-overview-table td:last-child { border-right: 0; }
.gradebook-overview-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #F8FAFC;
}
.gradebook-overview-table th:first-child,
.gradebook-overview-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 3;
    min-width: 220px;
    max-width: 260px;
    background: #fff;
    text-align: left;
}
.gradebook-overview-table thead th:first-child { z-index: 4; background: #F8FAFC; }
.gradebook-student-cell { display: flex; align-items: center; gap: 8px; }
.gradebook-student-index {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #EEF2F5;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 900;
}
.gradebook-assessment-head {
    width: 100%;
    min-width: 112px;
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 3px 2px;
    display: grid;
    justify-items: center;
    gap: 3px;
}
.gradebook-assessment-head strong { max-width: 150px; font-size: .82rem; line-height: 1.2; white-space: normal; }
.gradebook-assessment-head small { color: var(--muted); font-size: .7rem; }
.gradebook-assessment-color { width: 34px; height: 5px; border-radius: 999px; background: var(--category-color); }
.gradebook-score-cell {
    width: 48px;
    height: 44px;
    border: 1px solid #D4DCE4;
    border-radius: 12px;
    background: #F8FAFC;
    color: var(--muted);
    font-size: 1rem;
    font-weight: 900;
}
.gradebook-score-cell.has-score { background: var(--category-color); border-color: var(--category-color); color: var(--score-text-color, #fff); }
.gradebook-score-cell:active,
.gradebook-assessment-head:active { transform: scale(.96); }
.grade-overview-name-list { display: grid; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; margin-top: 12px; }
.grade-overview-name-row { min-height: 54px; padding: 9px 12px; display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.grade-overview-name-row:last-child { border-bottom: 0; }
.grade-overview-name-row > span:first-child { color: var(--muted); font-weight: 900; font-size: .78rem; }

@media (max-width: 720px) {
    .home-course-heading { margin-top: 20px; }
    .quick-course-dialog { width: min(94vw, 560px); }
    .gradebook-overview-panel { padding: 12px; }
    .gradebook-overview-panel .mini-heading { align-items: flex-start; }
    .gradebook-overview-hint { display: none; }
    .gradebook-overview-table th:first-child,
    .gradebook-overview-table td:first-child { min-width: 174px; max-width: 190px; }
    .gradebook-student-cell { gap: 6px; }
    .gradebook-student-cell strong { font-size: .86rem; }
    .gradebook-assessment-head { min-width: 92px; }
    .gradebook-assessment-head strong { max-width: 112px; font-size: .76rem; }
    .gradebook-score-cell { width: 44px; height: 42px; }
}

/* 0.6.0: Kursimport, Halbjahres-Vorlagen und fokussierte Schnelleingabe */
.course-create-import {
    display: grid;
    gap: 9px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #F8FAFC;
}
.course-create-import[hidden] { display: none !important; }
.course-create-import input[type="file"] {
    width: 100%;
    min-height: 48px;
    padding: 9px;
    border: 1px dashed #B9C5D1;
    border-radius: 12px;
    background: #fff;
}
.course-import-preview {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--accent) 9%, white);
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
}
.course-import-preview strong { overflow-wrap: anywhere; }
.course-import-preview span { color: var(--muted); font-size: .8rem; font-weight: 750; }

.quick-course-button.active {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 2px var(--accent), 0 5px 14px rgba(11,45,77,.06);
    background: color-mix(in srgb, var(--accent) 7%, white);
}
.template-admin-panel { margin-top: 12px; }
.template-overwrite-warning {
    display: grid;
    gap: 5px;
    padding: 12px 14px;
    border: 1px solid #E7B768;
    border-radius: 14px;
    background: #FFF8E8;
    color: #6E4D11;
}
.template-overwrite-warning span { font-size: .82rem; line-height: 1.4; }
.template-overwrite-warning[hidden] { display: none !important; }

.student-focus-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.28fr) minmax(0, 1fr);
    gap: 7px;
    margin: 0 0 10px;
    align-items: stretch;
}
.student-focus-card {
    min-width: 0;
    min-height: 66px;
    padding: 7px 8px;
    border: 1px solid #D6DEE6;
    border-radius: 13px;
    background: #F8FAFC;
    color: var(--text);
    display: grid;
    align-content: center;
    gap: 2px;
    text-align: center;
    overflow: hidden;
}
.student-focus-card small {
    color: var(--muted);
    font-size: .62rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .035em;
}
.student-focus-card strong {
    display: block;
    min-width: 0;
    font-size: .76rem;
    line-height: 1.12;
    white-space: normal;
    overflow-wrap: anywhere;
}
.student-focus-card.active {
    background: #fff;
    border-color: var(--primary);
    box-shadow: inset 0 0 0 2px var(--primary), 0 5px 15px rgba(11,45,77,.13);
    transform: translateY(-2px);
}
.student-focus-card.active strong { font-size: .84rem; }
.student-focus-card.placeholder { opacity: 0; pointer-events: none; }
.student-focus-meta {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    min-height: 20px;
}
.student-focus-meta b {
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    border-radius: 8px;
    background: var(--primary);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: .7rem;
}
.student-focus-card:not(.active) .course-type-badge { transform: scale(.86); transform-origin: center; }

@media (max-width: 720px) {
    .score-pad-head { padding-bottom: 6px; }
    .student-focus-strip { gap: 5px; margin-bottom: 7px; }
    .student-focus-card { min-height: 58px; padding: 5px 4px; border-radius: 11px; }
    .student-focus-card strong { font-size: .66rem; }
    .student-focus-card.active strong { font-size: .75rem; }
    .student-focus-card small { font-size: .54rem; }
    .student-focus-meta { gap: 2px; }
}

/* 0.6.1: Schülerverwaltung, Long-Press im Kurs und globale Schülerübersicht */
.student-longpress-row,
.student-directory-card {
    -webkit-touch-callout: none;
    user-select: none;
    touch-action: pan-y;
    cursor: pointer;
    transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
}
.student-longpress-row.long-press-pending,
.student-directory-card.long-press-pending {
    box-shadow: inset 0 0 0 2px var(--accent), 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
    transform: scale(.988);
    background: color-mix(in srgb, var(--accent) 7%, #fff);
}
.student-longpress-row:focus-visible,
.student-directory-card:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 42%, transparent);
    outline-offset: 2px;
}
.longpress-indicator {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: .67rem;
    font-weight: 800;
    white-space: nowrap;
}
.student-directory-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.student-sort-choice {
    margin: 0;
    display: flex;
    gap: 7px;
}
.student-sort-choice button {
    min-height: 42px;
}
.student-directory-list {
    display: grid;
    gap: 10px;
}
.student-directory-card {
    display: grid;
    grid-template-columns: minmax(180px, .9fr) minmax(260px, 1.4fr) auto;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(18, 43, 67, .05);
}
.student-directory-main strong,
.student-directory-main small {
    display: block;
}
.student-directory-main strong {
    font-size: 1rem;
}
.student-directory-main small {
    color: var(--muted);
    margin-top: 3px;
    overflow-wrap: anywhere;
}
.student-directory-courses,
.student-assigned-course-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.student-course-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 5px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #F7F9FB;
    color: var(--text);
    font-size: .76rem;
}
.student-course-chip strong {
    font-size: .76rem;
}
.student-course-chip.empty {
    color: var(--muted);
    font-weight: 700;
}
.student-assigned-courses {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #F7F9FB;
}
.student-dialog-actions {
    align-items: center;
}
.dialog-action-spacer {
    flex: 1 1 auto;
}

@media (max-width: 760px) {
    .student-directory-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .student-sort-choice {
        width: 100%;
    }
    .student-sort-choice button {
        flex: 1 1 0;
    }
    .student-directory-card {
        grid-template-columns: 1fr;
        gap: 9px;
        padding: 13px 14px;
    }
    .student-directory-card .longpress-indicator {
        justify-self: start;
    }
    .student-longpress-row {
        padding-right: 10px;
    }
    .student-longpress-row .longpress-indicator {
        font-size: .62rem;
    }
    .student-dialog-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .student-dialog-actions [data-remove-student-from-course-dialog] {
        grid-column: 1 / -1;
    }
    .student-dialog-actions .dialog-action-spacer {
        display: none;
    }
}


/* 0.6.2: reduzierte Meta-Hinweise, kompakte Notenübersicht und Listenfokus */
.student-focus-strip,
.assessment-longpress-hint,
.gradebook-overview-hint,
.longpress-indicator { display: none !important; }

.student-directory-card {
    grid-template-columns: minmax(180px, .9fr) minmax(260px, 1.4fr);
}

.student-grade-row.active {
    background: color-mix(in srgb, var(--accent) 11%, white);
    box-shadow: inset 0 0 0 3px var(--primary), inset 6px 0 0 var(--accent);
    position: relative;
    z-index: 1;
}

.gradebook-overview-table th,
.gradebook-overview-table td {
    min-width: 68px;
    padding: 6px 5px;
}
.gradebook-overview-table th:first-child,
.gradebook-overview-table td:first-child {
    min-width: 168px;
    width: 168px;
    max-width: 168px;
}
.gradebook-assessment-head {
    min-width: 68px;
    width: 72px;
    padding: 2px 1px;
    gap: 2px;
}
.gradebook-assessment-head strong {
    max-width: 72px;
    font-size: .72rem;
    line-height: 1.12;
    overflow-wrap: anywhere;
}
.gradebook-assessment-head small {
    font-size: .62rem;
    white-space: nowrap;
}
.gradebook-assessment-color { width: 28px; height: 4px; }
.gradebook-score-cell { width: 40px; height: 40px; border-radius: 10px; font-size: .92rem; }

@media (max-width: 720px) {
    .grade-create-bar { gap: 8px; }
    .gradebook-overview-panel { padding: 10px; }
    .gradebook-overview-table th,
    .gradebook-overview-table td { min-width: 64px; padding: 5px 4px; }
    .gradebook-overview-table th:first-child,
    .gradebook-overview-table td:first-child {
        min-width: 142px;
        width: 142px;
        max-width: 142px;
    }
    .gradebook-student-cell { gap: 5px; }
    .gradebook-student-index { width: 24px; height: 24px; font-size: .67rem; }
    .gradebook-student-cell strong { font-size: .76rem; line-height: 1.08; overflow-wrap: anywhere; }
    .gradebook-student-cell .course-type-badge { min-height: 20px; padding: 2px 5px; font-size: .58rem; }
    .gradebook-assessment-head { min-width: 62px; width: 66px; }
    .gradebook-assessment-head strong { max-width: 66px; font-size: .67rem; }
    .gradebook-assessment-head small { font-size: .57rem; }
    .gradebook-score-cell { width: 36px; height: 36px; font-size: .86rem; }

    .student-grade-list {
        max-height: calc(100dvh - var(--topbar-h) - 150px);
        overflow-y: auto;
        overscroll-behavior-y: contain;
        /* Kein Smooth-Scrolling in der Noteneingabe: iOS/WebKit kann sonst
           nach automatischem Weiterscrollen falsche Touch-Ziele treffen. */
        scroll-behavior: auto;
    }
    .student-grade-row { scroll-margin-block: 72px; }
}

@media (max-width: 760px) {
    .student-directory-card { grid-template-columns: 1fr; }
}

/* 0.6.3: Spaltenkoepfe der Leistungsnachweise explizit zentrieren */
.gradebook-overview-table thead th:not(:first-child) {
    text-align: center;
}
.gradebook-overview-table thead th:not(:first-child) .gradebook-assessment-head {
    margin-inline: auto;
    justify-items: center;
    align-content: center;
    text-align: center;
}
.gradebook-overview-table thead th:not(:first-child) .gradebook-assessment-head strong,
.gradebook-overview-table thead th:not(:first-child) .gradebook-assessment-head small {
    width: 100%;
    text-align: center;
}
.gradebook-overview-table thead th:not(:first-child) .gradebook-assessment-color {
    margin-inline: auto;
}


/* 0.6.4: Note bearbeiten ohne Tastatur-Autofokus, mittiges Mobile-Overlay, Löschen im Dialog */
.assessment-dialog-actions { align-items: center; }
@media (max-width: 700px) {
    .assessment-dialog-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .assessment-dialog-actions [data-delete-assessment-dialog] { grid-column: 1 / -1; }
    .assessment-dialog-actions .dialog-action-spacer { display: none; }
}

/* 0.6.5: Kategorien und Unterkategorien in der Notenübersicht */
.gradebook-category-index {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    padding: 1px 1px 10px;
    margin-bottom: 2px;
    scrollbar-width: thin;
    overscroll-behavior-inline: contain;
}
.gradebook-category-chip {
    flex: 0 0 auto;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border: 1px solid color-mix(in srgb, var(--category-color) 32%, var(--line));
    border-radius: 999px;
    background: color-mix(in srgb, var(--category-color) 8%, white);
    color: var(--text);
    font-size: .7rem;
    line-height: 1.15;
    font-weight: 850;
    white-space: nowrap;
}
.gradebook-category-chip-dot {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--category-color);
}

/* Mehrzeiliger Tabellenkopf: nur die echte Schülerspalte bleibt horizontal sticky. */
.gradebook-overview-table thead th {
    position: static;
    top: auto;
    text-align: center;
}
.gradebook-overview-table thead th:not(.gradebook-student-head) {
    left: auto;
    z-index: 1;
    min-width: 64px;
    width: auto;
    max-width: none;
    background: #F8FAFC;
    text-align: center;
}
.gradebook-overview-table thead th.gradebook-student-head {
    position: sticky;
    left: 0;
    z-index: 5;
    min-width: 168px;
    width: 168px;
    max-width: 168px;
    background: #F8FAFC;
    text-align: left;
    vertical-align: middle;
}
.gradebook-category-row th.gradebook-category-group {
    min-height: 28px;
    padding: 5px 6px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--category-color) 12%, #F8FAFC);
    color: var(--text);
    font-size: .68rem;
    font-weight: 900;
    line-height: 1.12;
    text-align: center;
    white-space: normal;
}
.gradebook-category-row th.gradebook-category-group > span {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.gradebook-category-row th.gradebook-category-group-empty {
    background: #F8FAFC;
}
.gradebook-assessment-row th {
    border-top: 0;
}

@media (max-width: 720px) {
    .gradebook-overview-table thead th.gradebook-student-head {
        min-width: 142px;
        width: 142px;
        max-width: 142px;
    }
    .gradebook-category-row th.gradebook-category-group {
        padding: 4px 4px;
        font-size: .61rem;
    }
    .gradebook-category-index {
        gap: 5px;
        padding-bottom: 8px;
    }
    .gradebook-category-chip {
        min-height: 27px;
        padding: 4px 7px;
        font-size: .63rem;
    }
}

/* 0.6.6: Vorlagenübernahme, zentrierte Leistungskoepfe und Konto */
.template-apply-mode-choice {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.template-apply-mode-choice button {
    min-height: 50px;
}
.template-apply-target-choice {
    max-height: min(38dvh, 360px);
    overflow-y: auto;
    overscroll-behavior-y: contain;
    padding-right: 2px;
}
.template-overwrite-warning:empty { display: none; }
.account-panel + .account-panel { margin-top: 14px; }
.account-panel h2 { margin-top: 0; }

/* Leistungsnachweis-Spalten: Farbe, Bezeichnung und Datum wirklich im Zellzentrum. */
.gradebook-overview-table .gradebook-assessment-row th:not(.gradebook-student-head) {
    padding-inline: 0;
    text-align: center;
    vertical-align: middle;
}
.gradebook-overview-table .gradebook-assessment-row .gradebook-assessment-head {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    margin: 0 auto;
    padding-inline: 2px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.gradebook-overview-table .gradebook-assessment-row .gradebook-assessment-head > strong {
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
    text-align: center;
}
.gradebook-overview-table .gradebook-assessment-row .gradebook-assessment-head > small,
.gradebook-overview-table .gradebook-assessment-row .gradebook-assessment-color {
    align-self: center;
    margin-inline: auto;
    text-align: center;
}

@media (max-width: 720px) {
    .template-apply-mode-choice { grid-template-columns: 1fr; }
    .template-apply-mode-choice button { min-height: 46px; }
}

/* 0.6.7: unveränderte Notenübersicht mit Score-Overlay, Kennzeichnungsfarben und Kursfilter */
.student-directory-toolbar {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr);
    align-items: start;
    gap: 16px;
}
.student-directory-control {
    display: grid;
    gap: 8px;
}
.student-course-filter {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.student-course-filter button {
    min-height: 42px;
}

/* Der Farbfleck der Kennzeichnung darf nicht von .touch-choice span überschrieben werden. */
.label-choice .label-choice-dot {
    width: 22px;
    height: 22px;
    min-height: 22px;
    flex: 0 0 22px;
    padding: 0;
    border: 2px solid color-mix(in srgb, var(--label-color) 72%, #ffffff);
    border-radius: 7px;
    background: var(--label-color);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--label-color) 32%, #cbd5df);
}

.gradebook-assessment-label {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2px;
}
.gradebook-assessment-label .assessment-label-badge {
    max-width: 100%;
    margin: 0;
    font-size: .58rem;
    line-height: 1.05;
    white-space: normal;
    text-align: center;
}
.gradebook-assessment-head.active {
    border-radius: 9px;
    box-shadow: inset 0 0 0 2px var(--primary);
    background: color-mix(in srgb, var(--accent) 7%, transparent);
}
.gradebook-student-row-active > td {
    background: color-mix(in srgb, var(--accent) 8%, #fff);
}
.gradebook-student-row-active > td:first-child {
    background: color-mix(in srgb, var(--accent) 11%, #fff);
    box-shadow: inset 4px 0 0 var(--primary);
}

/* Die Tabelle bleibt bestehen; nur das Punktefeld liegt darüber. */
.grade-score-overlay {
    position: fixed;
    z-index: 70;
    left: 50%;
    right: auto;
    bottom: max(12px, env(safe-area-inset-bottom));
    top: auto;
    width: min(680px, calc(100vw - 28px));
    max-height: calc(100dvh - var(--topbar-h) - env(safe-area-inset-top) - 24px);
    overflow-y: auto;
    transform: translateX(-50%);
    border-radius: 20px;
    box-shadow: 0 -14px 48px rgba(7,30,53,.25);
}
.grades-view:not(.score-pad-closed) {
    padding-bottom: 360px;
}
.grades-view.score-pad-closed {
    padding-bottom: 0;
}

/* Auf der Notenübersicht folgt nach der Überschrift unmittelbar die Kursauswahl. */
.grades-view .grade-heading {
    margin-bottom: 4px;
}
.grades-view .grade-heading h1 {
    margin-bottom: 0;
}

@media (max-width: 760px) {
    .student-directory-toolbar {
        grid-template-columns: 1fr;
        gap: 13px;
    }
    .student-course-filter {
        width: 100%;
    }
    .student-course-filter button {
        flex: 1 1 auto;
    }
    .grade-score-overlay {
        left: max(8px, env(safe-area-inset-left));
        right: max(8px, env(safe-area-inset-right));
        width: auto;
        transform: none;
        bottom: max(8px, env(safe-area-inset-bottom));
    }
    .grades-view:not(.score-pad-closed) {
        padding-bottom: 344px;
    }
    .gradebook-assessment-label .assessment-label-badge {
        font-size: .54rem;
        padding: 2px 5px;
    }
}

.student-sort-choice button,
.student-course-filter button {
    min-height: 42px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 8px 13px;
    background: #fff;
    color: var(--text);
    font-weight: 850;
}
.student-sort-choice button.active,
.student-course-filter button.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.15);
}

/* 0.6.8: automatische kontrastreiche Textfarbe auf farbigen Notenfeldern */


/* 0.6.9: Kategorien berechnen rekursiv; Durchschnittsspalten optional */
.gradebook-category-index { display: none !important; }

.calculation-choice,
.average-visibility-choice {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.calculation-choice button,
.average-visibility-choice button {
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 9px 13px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-weight: 850;
}
.calculation-choice button.active,
.average-visibility-choice button.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}

.gradebook-average-column-head,
.gradebook-empty-category-head {
    min-width: 58px !important;
    width: 58px !important;
    padding-inline: 3px !important;
}
.gradebook-average-head,
.gradebook-empty-category-head {
    min-height: 42px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-align: center;
}
.gradebook-average-head strong {
    font-size: .82rem;
    font-weight: 950;
}
.gradebook-average-cell {
    min-width: 58px !important;
    width: 58px !important;
    background: color-mix(in srgb, var(--category-color) 8%, #fff);
}
.gradebook-average-cell > span {
    min-width: 42px;
    min-height: 36px;
    padding: 6px 5px;
    display: inline-grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--category-color) 42%, var(--line));
    border-radius: 10px;
    background: color-mix(in srgb, var(--category-color) 14%, #fff);
    color: var(--text);
    font-size: .78rem;
    font-weight: 950;
    white-space: nowrap;
}
.gradebook-empty-category-cell {
    color: var(--muted);
    background: #fbfcfd;
}

@media (max-width: 720px) {
    .calculation-choice button,
    .average-visibility-choice button { min-height: 44px; }
    .gradebook-average-column-head,
    .gradebook-empty-category-head,
    .gradebook-average-cell { min-width: 52px !important; width: 52px !important; }
    .gradebook-average-cell > span { min-width: 38px; min-height: 34px; font-size: .72rem; }
}

/* 0.7.0 – mobile Strukturverwaltung: immer nur eine Hierarchieebene */
.structure-level-panel { overflow: hidden; }
.structure-level-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.structure-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 0;
}
.structure-breadcrumb > span { color: var(--muted); font-weight: 900; }
.structure-crumb {
    border: 0;
    background: transparent;
    color: var(--muted);
    min-height: 36px;
    padding: 6px 8px;
    border-radius: 10px;
    font-weight: 850;
    text-align: left;
}
.structure-crumb.active { background: var(--soft); color: var(--primary); }
.structure-level-create { flex: 0 0 auto; }
.structure-level-context {
    display: grid;
    grid-template-columns: 8px minmax(0,1fr) auto;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--category-color) 24%, var(--line));
    border-radius: 14px;
    background: color-mix(in srgb, var(--category-color) 6%, white);
}
.structure-level-context > span { width: 8px; height: 38px; border-radius: 999px; background: var(--category-color); }
.structure-level-context strong, .structure-level-context small { display: block; }
.structure-level-context small { color: var(--muted); margin-top: 2px; }
.structure-level-summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 2px 8px;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 800;
}
.structure-level-list { display: grid; gap: 9px; }
.structure-level-row {
    --category-color: #2D7DD2;
    display: grid;
    grid-template-columns: 8px minmax(0,1fr) 48px;
    align-items: stretch;
    min-height: 68px;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
}
.structure-level-row.category-row { background: color-mix(in srgb, var(--category-color) 4%, white); }
.structure-level-color { background: var(--category-color); }
.structure-level-main {
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 12px 13px;
    min-width: 0;
    text-align: left;
}
.structure-level-main strong, .structure-level-main small { display: block; }
.structure-level-main strong { font-size: .98rem; overflow-wrap: anywhere; }
.structure-level-main small { margin-top: 4px; color: var(--muted); font-size: .76rem; line-height: 1.3; }
.structure-level-actions {
    border: 0;
    border-left: 1px solid var(--line);
    background: rgba(255,255,255,.72);
    color: var(--primary);
    font-size: 1.2rem;
    font-weight: 950;
    letter-spacing: 1px;
}
.structure-level-main:active, .structure-level-actions:active { background: var(--soft); }
.element-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.element-action-grid .btn-full { grid-column: 1 / -1; }

/* Alte rekursive Baumdarstellung bleibt nur als Fallback im Code, wird aber nicht mehr gerendert. */
.structure-level-panel .category-tree { display: none; }

@media (max-width: 720px) {
    .structure-level-toolbar { display: grid; grid-template-columns: 1fr; }
    .structure-level-create { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); width: 100%; }
    .structure-level-create > :only-child { grid-column: 1 / -1; }
    .structure-level-create .btn { min-width: 0; }
    .structure-breadcrumb { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
    .structure-breadcrumb::-webkit-scrollbar { display: none; }
    .structure-crumb { white-space: nowrap; }
    .structure-level-context { grid-template-columns: 7px minmax(0,1fr); }
    .structure-level-context .btn { grid-column: 2; justify-self: start; }
    .structure-level-row { grid-template-columns: 7px minmax(0,1fr) 46px; min-height: 72px; }
    .structure-level-main { padding: 12px 10px; }
    .element-action-grid { grid-template-columns: 1fr; }
    .element-action-grid .btn-full { grid-column: auto; }
}

/* 0.7.1 – Long-Press in Strukturvorlagen */
.structure-level-main[data-template-node-longpress] {
    -webkit-touch-callout: none;
    user-select: none;
    touch-action: pan-y;
    transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease;
}
.structure-level-main[data-template-node-longpress].long-press-pending {
    box-shadow: inset 0 0 0 2px var(--accent), 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
    transform: scale(.992);
    background: color-mix(in srgb, var(--accent) 6%, transparent);
}


/* 0.7.3 – robuste Kategorienaktionen */
.structure-level-actions {
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
.category-dialog-actions { align-items: center; }
@media (max-width: 720px) {
    .category-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .category-dialog-actions [data-delete-category-dialog] { grid-column: 1 / -1; }
    .category-dialog-actions .dialog-action-spacer { display: none; }
    .category-dialog-actions [data-save-category-and-assessment] { grid-column: 1 / -1; }
}

/* 0.8.0: Klausurenmodul */
.exams-app { min-width: 0; }
.exam-page { display: grid; gap: 14px; }
.exam-main-heading { margin-bottom: 0; }
.exam-course-selector { margin-bottom: 2px; }
.exam-workspace { min-width: 0; }
.exam-card-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 12px; }
.exam-card { border: 1px solid var(--line); background: #fff; border-radius: 18px; min-height: 92px; padding: 14px 15px; display: flex; align-items: center; justify-content: space-between; gap: 14px; text-align: left; box-shadow: 0 8px 22px rgba(11,45,77,.06); color: var(--text); }
.exam-card > span:first-child { min-width: 0; display: grid; gap: 4px; }
.exam-card strong { font-size: 1rem; }
.exam-card small { color: var(--muted); }
.exam-card-meta { flex: 0 0 auto; display: grid; justify-items: end; gap: 4px; }
.exam-card-meta b { font-size: 1.1rem; color: var(--primary); }
.exam-empty { min-height: 180px; border: 1px dashed #CBD5DF; border-radius: 18px; display: grid; place-items: center; align-content: center; gap: 14px; background: rgba(255,255,255,.66); }
.exam-detail-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-bottom: 10px; }
.exam-title-block { min-width: 0; }
.exam-title-block h2 { margin: 0 0 3px; font-size: 1.25rem; }
.exam-title-block span { color: var(--muted); font-size: .88rem; }
.exam-tabs { display: flex; gap: 7px; overflow-x: auto; padding: 2px 1px 9px; scrollbar-width: none; }
.exam-tabs::-webkit-scrollbar { display: none; }
.exam-tabs button { flex: 0 0 auto; border: 1px solid var(--line); background: #fff; color: var(--text); border-radius: 999px; padding: 9px 14px; font-weight: 850; }
.exam-tabs button.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.exam-student-strip { display: flex; gap: 7px; overflow-x: auto; padding: 4px 2px 10px; scrollbar-width: none; }
.exam-student-strip::-webkit-scrollbar { display: none; }
.exam-student-strip button { flex: 0 0 auto; min-width: 88px; border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 7px 10px; color: var(--text); display: grid; grid-template-columns: auto 1fr; gap: 6px; align-items: center; text-align: left; }
.exam-student-strip button small { width: 22px; height: 22px; border-radius: 50%; background: #EEF2F5; display: grid; place-items: center; color: var(--muted); font-weight: 800; }
.exam-student-strip button span { font-weight: 850; white-space: nowrap; }
.exam-student-strip button.active { border: 2px solid var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent); }
.exam-student-strip button.active small { background: var(--accent); color: #fff; }
.exam-student-strip button.is-print-selected:not(.active) { border-color: var(--primary); background: color-mix(in srgb,var(--accent) 7%,#fff); }
.exam-student-strip button.is-print-selected:not(.active) small { background: var(--primary); color: #fff; }
.exam-student-strip button.is-absent:not(.active) { border-color: #e68a2e; background: #fff8ef; }
.exam-student-strip button.is-absent:not(.active) small { background: #ffead6; color: #99500a; }
.exam-student-strip button.is-absent.active { border-color: #e68a2e; box-shadow: 0 0 0 3px rgba(230,138,46,.18); }
.exam-student-strip button.is-absent.active small { background: #e68a2e; color: #fff; }
.exam-serial-print-actions { display: grid; justify-items: end; gap: 5px; min-width: 0; max-width: 100%; }
.exam-print-selection-status { color: var(--muted); font-size: .76rem; font-weight: 750; text-align: right; }
.exam-serial-print-actions .button-row { justify-content: flex-end; }
.exam-correct-head { display: grid; grid-template-columns: 48px 1fr 48px; gap: 8px; align-items: center; margin-bottom: 10px; }
.exam-nav-button { width: 48px; height: 48px; border: 0; border-radius: 14px; background: var(--primary); color: #fff; font-size: 1.35rem; font-weight: 900; }
.exam-selected-student { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 9px 12px; text-align: center; display: grid; gap: 2px; }
.exam-selected-student strong { font-size: 1rem; }
.exam-selected-student span { color: var(--muted); font-size: .82rem; }
.exam-result-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin-bottom: 12px; }
.exam-result-summary > div { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 10px; min-width: 0; }
.exam-result-summary > div.wide { grid-column: 1/-1; }
.exam-result-summary small,.exam-result-summary strong { display: block; }
.exam-result-summary small { color: var(--muted); font-size: .72rem; }
.exam-result-summary strong { margin-top: 3px; font-size: .98rem; overflow-wrap: anywhere; }
.exam-result-summary.complete > div:nth-child(3) { border-color: color-mix(in srgb,var(--accent) 55%,var(--line)); background: color-mix(in srgb,var(--accent) 8%,#fff); }
.exam-task-entry-list { display: grid; gap: 12px; }
.exam-task-group { background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.exam-task-group h3 { margin: 0; padding: 10px 13px; background: #F5F7FA; border-bottom: 1px solid var(--line); font-size: .9rem; }
.exam-task-entry { width: 100%; border: 0; border-bottom: 1px solid #EDF1F4; background: #fff; min-height: 58px; padding: 9px 13px; display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--text); text-align: left; }
.exam-task-entry:last-child { border-bottom: 0; }
.exam-task-entry span { display: grid; gap: 2px; }
.exam-task-entry small { color: var(--muted); font-size: .76rem; }
.exam-task-entry > b { min-width: 74px; text-align: right; font-size: 1.05rem; color: var(--muted); }
.exam-task-entry.entered > b { color: var(--primary); }
.exam-task-toolbar,.exam-results-toolbar { display: flex; justify-content: space-between; gap: 8px; align-items: center; margin-bottom: 10px; }
.exam-task-toolbar { justify-content: flex-end; }
.exam-task-edit-hint { margin: -2px 2px 10px; color: var(--muted); font-size: .88rem; line-height: 1.35; }
.exam-structure-list { display: grid; gap: 10px; }
.exam-structure-section { background: #fff; border: 1px solid var(--line); border-radius: 17px; overflow: hidden; }
.exam-structure-section-head { min-height: 52px; padding: 7px 10px 7px 13px; background: #F5F7FA; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.exam-section-title { flex: 1; border: 0; background: transparent; color: var(--text); display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; padding: 7px 0; }
.exam-section-title span { color: var(--muted); font-size: .82rem; }
.mini-action { border: 1px solid var(--line); background: #fff; border-radius: 11px; padding: 8px 10px; font-weight: 850; color: var(--primary); }
.exam-structure-task { width: 100%; min-height: 48px; padding: 8px 13px; border: 0; border-top: 1px solid #EDF1F4; background: #fff; display: flex; justify-content: space-between; align-items: center; gap: 10px; color: var(--text); text-align: left; touch-action: pan-y; -webkit-user-select: none; user-select: none; transition: transform .12s ease, background .12s ease; }
.exam-structure-task.is-long-pressing { background: color-mix(in srgb,var(--accent) 10%,#fff); transform: scale(.992); }
.exam-structure-task b { color: var(--primary); }
.exam-structure-empty { color: var(--muted); padding: 12px 13px; border-top: 1px solid #EDF1F4; }
.exam-grading-card { margin-top: 13px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 13px; }
.exam-grading-card h3 { margin: 0 0 4px; }
.exam-grading-card p { margin: 0; color: var(--muted); }
.exam-threshold-grid { margin-top: 10px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
.exam-threshold-grid > div { border: 1px solid var(--line); border-radius: 10px; padding: 7px; display: flex; justify-content: space-between; gap: 5px; font-size: .78rem; }
.exam-threshold-grid span { color: var(--muted); }
.exam-results-toolbar > div span { color: var(--muted); }
.exam-results-actions { display: flex; align-items: center; gap: 8px; }
.exam-results-actions [aria-pressed="true"] { background: var(--primary); color: #fff; }
.exam-interim-note { display: block; margin-top: 2px; color: var(--muted); font-size: .72rem; }
.exam-results-scroll { overflow-x: auto; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.exam-results-table { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; }
.exam-results-table th,.exam-results-table td { border-bottom: 1px solid #EDF1F4; padding: 9px 11px; text-align: center; white-space: nowrap; }
.exam-results-table th { position: sticky; top: 0; background: #F5F7FA; z-index: 2; font-size: .78rem; color: var(--muted); }
.exam-results-table th:first-child,.exam-results-table td:first-child { position: sticky; left: 0; text-align: left; background: #fff; z-index: 1; min-width: 160px; }
.exam-results-table th:first-child { background: #F5F7FA; z-index: 3; }
.exam-results-table tbody tr:last-child td { border-bottom: 0; }
.exam-results-sort { border: 0; padding: 0; background: transparent; color: inherit; font: inherit; font-weight: inherit; cursor: pointer; white-space: nowrap; }
.exam-results-sort:hover { color: var(--ink, #0B2D4D); }
.exam-results-average th,.exam-results-average td { background: #F5F7FA; font-weight: 700; border-top: 2px solid var(--line); }
.exam-results-average th:first-child { background: #F5F7FA; z-index: 2; }
.exam-percent-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 58px; padding: 3px 8px; border: 1px solid transparent; border-radius: 999px; font-size: .82rem; font-weight: 700; line-height: 1.25; }
.exam-grade-badge { display: inline-flex; align-items: center; justify-content: center; padding: 3px 8px; border: 1px solid transparent; border-radius: 999px; font-size: .82rem; font-weight: 700; line-height: 1.25; }
.exam-percent-badge.is-grade-0,.exam-grade-badge.is-grade-0 { color: #8f2525; background: #fee2e2; border-color: #fecaca; }
.exam-percent-badge.is-grade-1,.exam-grade-badge.is-grade-1 { color: #8f2525; background: #fecaca; border-color: #fca5a5; }
.exam-percent-badge.is-grade-2,.exam-grade-badge.is-grade-2 { color: #8f2525; background: #fca5a5; border-color: #f87171; }
.exam-percent-badge.is-grade-3,.exam-grade-badge.is-grade-3 { color: #7f1d1d; background: #f87171; border-color: #ef4444; }
.exam-percent-badge.is-grade-4,.exam-grade-badge.is-grade-4 { color: #8f2525; background: #f87171; border-color: #ef4444; }
.exam-percent-badge.is-grade-5,.exam-grade-badge.is-grade-5 { color: #7f1d1d; background: #dc5050; border-color: #c83c3c; }
.exam-percent-badge.is-grade-6,.exam-grade-badge.is-grade-6 { color: #765000; background: #fef3c7; border-color: #fde68a; }
.exam-percent-badge.is-grade-7,.exam-grade-badge.is-grade-7 { color: #765000; background: #fde68a; border-color: #fcd34d; }
.exam-percent-badge.is-grade-8,.exam-grade-badge.is-grade-8 { color: #765000; background: #fcd34d; border-color: #fbbf24; }
.exam-percent-badge.is-grade-9,.exam-grade-badge.is-grade-9 { color: #684500; background: #fbbf24; border-color: #f59e0b; }
.exam-percent-badge.is-grade-10,.exam-grade-badge.is-grade-10 { color: #17633a; background: #dcfce7; border-color: #bbf7d0; }
.exam-percent-badge.is-grade-11,.exam-grade-badge.is-grade-11 { color: #17633a; background: #bbf7d0; border-color: #86efac; }
.exam-percent-badge.is-grade-12,.exam-grade-badge.is-grade-12 { color: #14532d; background: #a7f3d0; border-color: #6ee7b7; }
.exam-percent-badge.is-grade-13,.exam-grade-badge.is-grade-13 { color: #14532d; background: #86efac; border-color: #4ade80; }
.exam-percent-badge.is-grade-14,.exam-grade-badge.is-grade-14 { color: #fff; background: #3ebd70; border-color: #22a45a; }
.exam-percent-badge.is-grade-15,.exam-grade-badge.is-grade-15 { color: #fff; background: #22a45a; border-color: #168747; }
.exam-analysis-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin-bottom: 12px; }
.exam-analysis-kpis > div { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 10px; }
.exam-analysis-kpis small,.exam-analysis-kpis strong { display: block; }
.exam-analysis-kpis small { color: var(--muted); }
.exam-analysis-kpis strong { margin-top: 4px; font-size: 1.05rem; }
.exam-analysis-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(260px,.8fr); gap: 12px; }
.exam-analysis-grid > section { min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 12px; }
.exam-analysis-grid h3 { margin: 0 0 10px; }
.exam-distribution { display: grid; gap: 5px; }
.exam-dist-row { display: grid; grid-template-columns: 24px 1fr 30px; gap: 7px; align-items: center; font-size: .78rem; }
.exam-dist-row span { height: 9px; border-radius: 999px; background: #EDF1F4; overflow: hidden; }
.exam-dist-row i { display: block; height: 100%; background: var(--accent); border-radius: inherit; }
.exam-dist-row.is-grade-0 i,.exam-dist-row.is-grade-1 i,.exam-dist-row.is-grade-2 i { background: #ef4444; }
.exam-dist-row.is-grade-3 i,.exam-dist-row.is-grade-4 i,.exam-dist-row.is-grade-5 i { background: #dc5050; }
.exam-dist-row.is-grade-6 i,.exam-dist-row.is-grade-7 i,.exam-dist-row.is-grade-8 i,.exam-dist-row.is-grade-9 i { background: #fbbf24; }
.exam-dist-row.is-grade-10 i,.exam-dist-row.is-grade-11 i,.exam-dist-row.is-grade-12 i,.exam-dist-row.is-grade-13 i { background: #4ade80; }
.exam-dist-row.is-grade-14 i { background: #3ebd70; }
.exam-dist-row.is-grade-15 i { background: #22a45a; }
.exam-dist-row em { font-style: normal; text-align: right; color: var(--muted); }
.exam-grade-analysis-title { margin-top: 22px !important; }
.exam-grade-analysis { display: grid; gap: 7px; }
.exam-grade-analysis-row { display: grid; grid-template-columns: minmax(0,1fr) 32px 52px; gap: 8px; align-items: center; }
.exam-grade-analysis-row .exam-grade-badge { justify-self: start; flex-direction: column; align-items: flex-start; }
.exam-grade-analysis-row .exam-grade-badge small { font-size: .66rem; font-weight: 600; }
.exam-grade-analysis-row > strong,.exam-grade-analysis-row > em { text-align: right; font-size: .82rem; }
.exam-grade-analysis-row > em { color: var(--muted); font-style: normal; }
.field-hint { color: var(--muted); font-size: .75rem; font-weight: 500; }
.exam-copy-choice { max-height: 180px; overflow-y: auto; }
.exam-mark-dialog { width: min(94vw,520px); }
.exam-mark-requirement {
    margin: -2px 0 9px;
    padding: 7px 9px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #F8FAFC;
    color: var(--muted);
    font-size: .76rem;
    line-height: 1.25;
    font-weight: 500;
    max-height: 3.7em;
    overflow: hidden;
}
.exam-mark-requirement[hidden] { display: none !important; }
.exam-mark-requirement p,.exam-mark-requirement div { margin: 0; }
.exam-mark-requirement mjx-container { margin: 0 .08em !important; font-size: .92em !important; }
.exam-mark-current { min-height: 80px; border: 1px solid var(--line); border-radius: 17px; display: flex; align-items: baseline; justify-content: center; gap: 8px; background: #F8FAFC; margin-bottom: 10px; }
.exam-mark-current strong { font-size: 2rem; color: var(--primary); }
.exam-mark-current span { color: var(--muted); font-weight: 800; }
.exam-mark-grid { max-height: min(46vh,390px); overflow-y: auto; display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.exam-mark-grid button { min-height: 48px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--primary); font-weight: 900; font-size: 1rem; }
.exam-mark-grid button.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.exam-mark-stepper { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; margin-top: 9px; }
.exam-mark-stepper button { min-height: 44px; border: 0; border-radius: 11px; background: #EEF2F5; color: var(--text); font-weight: 850; }
.choice-color-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--choice-color,#2D7DD2); display: inline-block; margin-right: 6px; }

@media (max-width: 760px) {
    .exam-detail-head { grid-template-columns: auto 1fr; }
    .exam-detail-head > .btn:last-child { grid-column: 1/-1; justify-self: end; margin-top: -4px; }
    .exam-result-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exam-threshold-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exam-analysis-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exam-analysis-grid { grid-template-columns: 1fr; }
    .exam-results-toolbar { align-items: stretch; flex-direction: column; }
    .exam-results-toolbar .btn { width: 100%; }
    .exam-results-actions { flex-direction: column; align-items: stretch; }
}

@media (max-width: 460px) {
    .exam-main-heading { align-items: flex-end; }
    .exam-card-grid { grid-template-columns: 1fr; }
    .exam-card { min-height: 78px; padding: 11px 12px; border-radius: 15px; }
    .exam-detail-head { gap: 8px; }
    .exam-title-block h2 { font-size: 1.08rem; }
    .exam-title-block span { font-size: .78rem; }
    .exam-tabs button { padding: 8px 11px; font-size: .82rem; }
    .exam-student-strip button { min-width: 78px; padding: 6px 8px; }
    .exam-correct-head { grid-template-columns: 44px 1fr 44px; }
    .exam-nav-button { width: 44px; height: 44px; }
    .exam-result-summary > div { padding: 8px; }
    .exam-task-entry { min-height: 53px; padding: 8px 11px; }
    .exam-mark-grid { grid-template-columns: repeat(4,1fr); gap: 5px; }
    .exam-mark-grid button { min-height: 43px; }
    .exam-mark-stepper { grid-template-columns: repeat(2,1fr); }
}

/* Klausuren 0.8.1 ------------------------------------------------------- */
.exams-app button { -webkit-appearance: none; appearance: none; }
.exam-main-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.exam-course-picker {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 8px 22px rgba(11,45,77,.06);
}
.exam-course-picker-title { margin-bottom: 10px; color: var(--muted); font-size: .78rem; font-weight: 900; text-transform: uppercase; letter-spacing: .055em; }
.exam-course-selector { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 9px; }
.exam-course-option {
    min-width: 0;
    min-height: 70px;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 11px 13px;
    background: #F8FAFC;
    color: var(--text);
    text-align: left;
    display: grid;
    align-content: center;
    gap: 4px;
    box-shadow: none;
}
.exam-course-option strong { font-size: .98rem; overflow-wrap: anywhere; }
.exam-course-option span { color: var(--muted); font-size: .74rem; font-weight: 750; }
.exam-course-option.active { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 8px 18px rgba(11,45,77,.16); }
.exam-course-option.active span { color: rgba(255,255,255,.76); }
.exam-course-empty { grid-column: 1/-1; min-height: 60px; display: grid; place-items: center; color: var(--muted); border: 1px dashed #CBD5DF; border-radius: 14px; }
.exam-empty { min-height: 150px; padding: 24px; text-align: center; color: var(--muted); }
.exam-empty strong { color: var(--text); font-size: 1rem; }
.exam-empty span { max-width: 360px; }

.exam-card,.exam-task-entry,.exam-structure-task,.exam-section-title,.exam-student-strip button,.exam-tabs button,.exam-nav-button,.exam-mark-grid button,.exam-mark-stepper button,.exam-scheme-option,.exam-scheme-list-card { font: inherit; }
.exam-card:focus-visible,.exam-course-option:focus-visible,.exam-tabs button:focus-visible,.exam-task-entry:focus-visible,.exam-structure-task:focus-visible,.exam-scheme-option:focus-visible,.exam-scheme-list-card:focus-visible { outline: 3px solid color-mix(in srgb,var(--accent) 24%,transparent); outline-offset: 2px; }

.exam-grading-settings { border: 1px solid var(--line); border-radius: 16px; padding: 13px; background: #F8FAFC; display: grid; gap: 13px; }
.exam-dialog-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.exam-dialog-section-head > div { display: grid; gap: 2px; }
.exam-dialog-section-head small { color: var(--muted); font-weight: 650; }
.exam-scheme-choice { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 8px; }
.exam-scheme-choice legend { width: 100%; margin-bottom: 6px; font-size: .82rem; font-weight: 850; }
.exam-scheme-option { min-height: 58px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: var(--text); padding: 9px 11px; text-align: left; display: grid; gap: 2px; }
.exam-scheme-option strong { font-size: .88rem; }
.exam-scheme-option span { color: var(--muted); font-size: .7rem; font-weight: 750; }
.exam-scheme-option.active { border-color: var(--primary); box-shadow: inset 0 0 0 2px var(--primary); background: color-mix(in srgb,var(--accent) 6%,#fff); }
.exam-top-deduction { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; }
.exam-top-deduction > div:first-child { display: grid; gap: 3px; }
.exam-top-deduction small { color: var(--muted); font-weight: 650; }
.exam-half-stepper { display: grid; grid-template-columns: 44px minmax(68px,auto) 44px; gap: 6px; align-items: center; }
.exam-half-stepper button,.exam-half-stepper output { min-height: 44px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--primary); display: grid; place-items: center; font-weight: 900; }
.exam-half-stepper button { font-size: 1.25rem; }
.exam-half-stepper output { padding-inline: 8px; }

.exam-scheme-dialog { width: min(94vw,880px); }
.exam-scheme-manager { display: grid; grid-template-columns: minmax(190px,.7fr) minmax(0,1.4fr); gap: 14px; align-items: start; }
.exam-scheme-list-wrap { min-width: 0; display: grid; gap: 9px; }
.exam-scheme-list-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.exam-scheme-list { display: grid; gap: 7px; max-height: 480px; overflow-y: auto; }
.exam-scheme-list-card { width: 100%; min-height: 58px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: var(--text); padding: 9px 11px; display: grid; gap: 2px; text-align: left; }
.exam-scheme-list-card span { color: var(--muted); font-size: .72rem; font-weight: 750; }
.exam-scheme-list-card.active { border-color: var(--primary); background: color-mix(in srgb,var(--accent) 7%,#fff); box-shadow: inset 4px 0 0 var(--primary); }
.exam-scheme-editor { min-width: 0; display: grid; gap: 12px; }
.exam-scheme-editor input[type="text"],
.exam-threshold-row input[type="number"],
.exam-dialog input[type="number"] { width: 100%; min-height: 46px; border: 1px solid #C9D4DE; border-radius: 12px; padding: 9px 11px; background: #fff; color: var(--text); }
.exam-threshold-editor-head { display: grid; gap: 2px; }
.exam-threshold-editor-head small { color: var(--muted); }
.exam-threshold-editor { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; max-height: min(52vh,520px); overflow-y: auto; padding-right: 2px; }
.exam-threshold-row { min-width: 0; min-height: 58px; border: 1px solid var(--line); border-radius: 13px; background: #fff; padding: 7px 8px 7px 11px; display: grid !important; grid-template-columns: 1fr 92px; gap: 8px !important; align-items: center; }
.exam-threshold-row > span:first-child { min-width: 0; display: grid; gap: 1px; }
.exam-threshold-row b { font-size: .84rem; }
.exam-threshold-row small { color: var(--muted); font-size: .68rem; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exam-threshold-input-wrap { display: grid; grid-template-columns: 1fr auto; gap: 4px; align-items: center; }
.exam-threshold-input-wrap input { min-width: 0; text-align: right; font-weight: 850; }
.exam-threshold-input-wrap em { color: var(--muted); font-style: normal; font-weight: 800; }

.exam-grading-card { overflow: hidden; }
.exam-threshold-grid > div { align-items: center; background: #F8FAFC; }
.exam-threshold-grid > div b { color: var(--primary); }

@media (max-width: 700px) {
    .exam-main-heading { align-items: start; }
    .exam-main-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .exam-main-heading { display: grid; grid-template-columns: 1fr; }
    .exam-main-actions .btn { min-width: 0; padding-inline: 10px; }
    .exam-course-picker { padding: 11px; border-radius: 16px; }
    .exam-course-selector { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .exam-course-option { min-height: 66px; padding: 9px 10px; border-radius: 14px; }
    .exam-course-option strong { font-size: .9rem; }
    .exam-course-option span { font-size: .66rem; }
    .exam-dialog-section-head { align-items: stretch; flex-direction: column; }
    .exam-dialog-section-head .btn { width: 100%; }
    .exam-scheme-choice { grid-template-columns: 1fr 1fr; }
    .exam-top-deduction { grid-template-columns: 1fr; }
    .exam-half-stepper { grid-template-columns: 48px 1fr 48px; }
    .exam-scheme-manager { grid-template-columns: 1fr; }
    .exam-scheme-list { display: flex; overflow-x: auto; overflow-y: hidden; max-height: none; padding-bottom: 3px; }
    .exam-scheme-list-card { min-width: 165px; width: auto; }
    .exam-threshold-editor { grid-template-columns: 1fr; max-height: 48vh; }
    .exam-threshold-row { grid-template-columns: 1fr 104px; }
}

@media (max-width: 390px) {
    .exam-course-selector,.exam-scheme-choice { grid-template-columns: 1fr; }
    .exam-main-actions { grid-template-columns: 1fr; }
}
.exams-app .touch-choice > button {
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 9px 14px;
    background: #fff;
    color: var(--text);
    font-weight: 850;
}
.exams-app .touch-choice > button.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}


/* 0.8.2 – Datum-first Notenerfassung und direkt bearbeitbare Kategorie-/Ø-Köpfe */
.assessment-name-control { display: grid; gap: 7px; }
.assessment-name-label { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.assessment-name-edit {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
    border-radius: 12px;
    padding: 0;
    background: color-mix(in srgb, var(--accent) 9%, #fff);
    color: var(--primary);
    display: inline-grid;
    place-items: center;
    box-shadow: 0 1px 2px rgba(11,45,77,.06);
    -webkit-tap-highlight-color: transparent;
}
.assessment-name-edit svg {
    width: 19px;
    height: 19px;
    fill: currentColor;
}
.assessment-name-edit:active {
    transform: scale(.96);
    background: color-mix(in srgb, var(--accent) 16%, #fff);
}
.assessment-name-control input[readonly] {
    background: #F7F9FC;
    color: var(--text);
    cursor: default;
}
.gradebook-category-row th.gradebook-category-group {
    padding: 0;
    min-height: 52px;
    cursor: pointer;
}
.gradebook-category-head {
    width: 100%;
    min-height: 52px;
    border: 0;
    padding: 10px 8px;
    display: grid;
    place-items: center;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 950;
    line-height: 1.15;
    text-align: center;
    touch-action: pan-x pan-y;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
}
.gradebook-category-head.long-press-pending {
    background: color-mix(in srgb, var(--category-color) 18%, transparent);
}
.gradebook-category-group.long-press-pending .gradebook-category-head,
.gradebook-category-touch-cell.long-press-pending .gradebook-category-head {
    background: color-mix(in srgb, var(--category-color) 18%, transparent);
}
.gradebook-average-head.gradebook-category-head {
    min-height: 66px;
    padding: 9px 5px;
}
.gradebook-category-touch-cell { cursor: pointer; }
.gradebook-category-touch-cell .gradebook-assessment-color {
    width: 42px;
    height: 6px;
}
@media (max-width: 720px) {
    .gradebook-category-row th.gradebook-category-group { min-height: 54px; }
    .gradebook-category-head { min-height: 54px; padding: 10px 6px; font-size: .69rem; }
    .gradebook-average-head.gradebook-category-head { min-height: 68px; }
}

/* Klausur-Grobstruktur: Teil A/B plus schnelle Mehrfachauswahl */
.exam-quick-structure {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}
.exam-dialog-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.exam-dialog-section-head > div { display: grid; gap: 3px; }
.exam-dialog-section-head small { color: var(--muted); font-size: .78rem; }
.exam-quick-structure-summary { display: flex; flex-wrap: wrap; gap: 7px; }
.exam-structure-summary-chip {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: #F7F9FC;
    font-size: .76rem;
    font-weight: 900;
}
.exam-structure-picker { display: grid; gap: 16px; }
.exam-structure-part { padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.exam-structure-part-head { display: grid; gap: 3px; margin-bottom: 10px; }
.exam-structure-part-head strong { font-size: 1rem; }
.exam-structure-part-head span { color: var(--muted); font-size: .78rem; }
.exam-structure-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 8px; }
.exam-structure-option {
    min-height: 48px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-weight: 900;
}
.exam-structure-option.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.exam-structure-more {
    width: 100%;
    margin-top: 9px;
    min-height: 42px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: #F7F9FC;
    color: var(--primary);
    font: inherit;
    font-weight: 850;
}
@media (max-width: 620px) {
    .exam-dialog-section-head { align-items: stretch; flex-direction: column; }
    .exam-dialog-section-head .btn { width: 100%; }
    .exam-structure-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Klausuren 0.8.5 – Teilaufgaben je großer Aufgabe ---------------------- */
.exam-task-dialog {
    max-height: min(94vh, 900px);
}
.exam-task-dialog > form {
    max-height: min(94vh, 900px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.exam-subtask-editor {
    display: grid;
    gap: 10px;
}
.exam-subtask-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.exam-subtask-editor-head > div {
    display: grid;
    gap: 2px;
}
.exam-subtask-editor-head small {
    color: var(--muted);
    font-size: .75rem;
    font-weight: 650;
}
.exam-subtask-list {
    display: grid;
    gap: 10px;
}
.exam-subtask-card {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #F8FAFC;
    padding: 11px;
    display: grid;
    gap: 10px;
}
.exam-subtask-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.exam-subtask-card-head > div {
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.exam-subtask-card-head strong {
    color: var(--primary);
    font-size: 1rem;
}
.exam-subtask-card-head span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
}
.exam-subtask-remove {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 11px;
    background: #FDECEC;
    color: #B42318;
    font-size: 1.2rem;
    font-weight: 900;
}
.exam-subtask-point-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
}
.exam-subtask-point-grid button {
    min-height: 44px;
    padding: 5px 3px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #fff;
    color: var(--primary);
    font: inherit;
    font-size: .84rem;
    font-weight: 900;
    touch-action: manipulation;
}
.exam-subtask-point-grid button.active {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
    box-shadow: 0 5px 12px rgba(11,45,77,.14);
}
.exam-subtask-free {
    grid-template-columns: minmax(0,1fr) minmax(110px,160px) !important;
    align-items: center;
    gap: 10px !important;
}
.exam-subtask-free span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 750;
}
.exam-task-live-totals {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 7px;
}
.exam-task-live-totals > div {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    padding: 9px 10px;
    display: grid;
    gap: 2px;
}
.exam-task-live-totals small {
    color: var(--muted);
    font-size: .7rem;
    font-weight: 750;
}
.exam-task-live-totals strong {
    color: var(--primary);
    font-size: .94rem;
}
.exam-structure-major-task > span {
    min-width: 0;
    display: grid;
    gap: 2px;
}
.exam-structure-major-task > span small {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 650;
}
.exam-structure-major-task > b {
    flex: 0 0 auto;
}

@media (max-width: 560px) {
    .exam-task-dialog {
        width: min(96vw, 680px);
        max-height: 96vh;
    }
    .exam-task-dialog > form {
        max-height: 96vh;
        padding: 16px;
        gap: 13px;
    }
    .exam-subtask-editor-head {
        align-items: stretch;
        flex-direction: column;
    }
    .exam-subtask-editor-head .btn {
        width: 100%;
    }
    .exam-subtask-point-grid {
        grid-template-columns: repeat(4, minmax(0,1fr));
        gap: 5px;
    }
    .exam-subtask-point-grid button {
        min-height: 43px;
    }
    .exam-subtask-free {
        grid-template-columns: 1fr !important;
    }
    .exam-task-live-totals {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}


/* 0.8.7 - Anforderungen & Seriendruck */
.exam-subtask-requirement { display:grid !important; gap:6px !important; }
.exam-subtask-requirement span { color:var(--muted); font-size:.78rem; font-weight:800; }
.exam-subtask-requirement textarea,
.exam-requirement-row textarea { width:100%; resize:vertical; min-height:70px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--text); padding:10px 12px; font:inherit; line-height:1.35; }
.exam-subtask-requirement textarea:focus,
.exam-requirement-row textarea:focus { outline:3px solid color-mix(in srgb,var(--accent) 18%,transparent); border-color:var(--accent); }
.exam-requirements-page { display:grid; gap:12px; }
.exam-requirements-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.exam-requirements-head h3 { margin:0 0 3px; }
.exam-requirements-head p { margin:0; color:var(--muted); }
.exam-requirements-list { display:grid; gap:9px; }
.exam-requirement-row { display:grid !important; grid-template-columns:minmax(90px,120px) minmax(0,1fr); align-items:stretch; gap:10px !important; border:1px solid var(--line); background:#fff; border-radius:16px; padding:10px; }
.exam-requirement-code { display:grid; align-content:center; gap:3px; padding:4px 6px; border:0; border-radius:10px; background:transparent; font:inherit; text-align:left; cursor:pointer; }
.exam-requirement-code:hover { background:color-mix(in srgb,var(--accent) 8%,transparent); }
.exam-requirement-code:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.exam-requirement-code strong { color:var(--primary); font-size:1rem; }
.exam-requirement-code small { color:var(--muted); font-weight:800; }
.exam-requirements-footer { display:flex; justify-content:flex-end; padding-top:4px; }
.exam-serial-page { display:grid; gap:14px; }
.exam-report-settings { border:1px solid var(--line); border-radius:18px; background:#fff; padding:14px; display:grid; gap:12px; }
.exam-report-settings-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.exam-report-settings-grid label { display:grid; gap:5px; color:var(--muted); font-size:.78rem; font-weight:800; }
.exam-report-settings-grid input { min-height:42px; border:1px solid var(--line); border-radius:11px; padding:8px 10px; font:inherit; color:var(--text); background:#fff; }
.exam-serial-toolbar { display:flex; gap:10px; align-items:center; }
.exam-serial-toolbar .exam-student-strip { flex:1; min-width:0; }
.exam-serial-nav { margin-top:-4px; }
.exam-report-sheet { width:min(100%, 980px); margin:0 auto; background:#fff; border:1px solid #dce3ea; border-radius:22px; box-shadow:0 14px 38px rgba(11,45,77,.08); padding:24px; color:#17212b; }
.exam-report-header { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:12px; font-size:.78rem; font-weight:800; border-bottom:1px solid #d5dce4; padding-bottom:7px; }
.exam-report-header span:nth-child(2){text-align:center}.exam-report-header span:last-child{text-align:right}
.exam-report-sheet h2 { text-align:center; font-size:1.12rem; margin:18px 0 20px; }
.exam-report-name { display:flex; gap:22px; align-items:baseline; margin-bottom:10px; font-size:.94rem; }
.exam-report-table-wrap { overflow-x:auto; border:1px solid #cfd7df; border-radius:14px; }
.exam-report-table { width:100%; min-width:720px; border-collapse:separate; border-spacing:0; font-size:.78rem; line-height:1.22; }
.exam-report-table th,.exam-report-table td { padding:6px 8px; border-right:1px solid #d6dde5; border-bottom:1px solid #d6dde5; vertical-align:top; }
.exam-report-table th:last-child,.exam-report-table td:last-child { border-right:0; }
.exam-report-table tbody tr:last-child td { border-bottom:0; }
.exam-report-table thead th { background:#f4f7fa; font-size:.7rem; text-align:center; vertical-align:middle; }
.exam-report-table th:first-child { width:78px; }.exam-report-table th:nth-child(3),.exam-report-table th:nth-child(4){width:105px}
.exam-report-table td:first-child,.exam-report-table td:nth-child(3),.exam-report-table td:nth-child(4){text-align:center;font-weight:750}
.exam-report-subtotal td { background:#eef3f8 !important; font-weight:900; }
.exam-report-subtotal td:first-child,.exam-report-total td:first-child { text-align:right; }
.exam-report-total td { background:#e4ebf2 !important; font-weight:950; }
.exam-report-grade { text-align:center; font-size:1.12rem; margin:16px 0 10px; }
.exam-report-signline { text-align:right; font-size:.75rem; margin:14px 0 26px; }
.exam-report-key { display:grid; gap:5px; font-size:.66rem; }
.exam-report-key-scroll { overflow-x:auto; }
.exam-report-key table { width:100%; min-width:650px; border-collapse:collapse; }
.exam-report-key th,.exam-report-key td { border:1px solid #cfd7df; padding:3px 5px; text-align:center; }
.exam-report-key th { text-align:left; white-space:nowrap; background:#f4f7fa; }
.exam-report-key small { color:#526170; }
@media (max-width:700px){
  .exam-requirement-row{grid-template-columns:1fr}.exam-requirement-code{grid-template-columns:auto 1fr;align-items:baseline}
  .exam-report-settings-grid{grid-template-columns:1fr}.exam-requirements-head{flex-direction:column}.exam-requirements-head .btn{width:100%}
  .exam-serial-toolbar{align-items:stretch;flex-direction:column}.exam-serial-toolbar>.btn{width:100%}
  .exam-report-sheet{padding:14px;border-radius:16px}.exam-report-header{grid-template-columns:1fr;font-size:.72rem}.exam-report-header span:nth-child(2),.exam-report-header span:last-child{text-align:left}
}
@media print {
  body * { visibility:hidden !important; }
  .exam-report-sheet,.exam-report-sheet * { visibility:visible !important; }
  .exam-report-sheet { position:absolute; left:0; top:0; width:100%; max-width:none; margin:0; border:0; border-radius:0; box-shadow:none; padding:8mm 10mm; }
  .exam-report-table-wrap { overflow:visible; border-radius:0; }
  .exam-report-table { min-width:0; font-size:8pt; }
  .exam-report-key-scroll { overflow:visible; }
  .exam-report-key table { min-width:0; }
  @page { size:A4 portrait; margin:8mm; }
}


/* 0.8.8 - konsequent ohne horizontales Scrollen + A4-Seriendruck */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

img,
svg,
canvas,
video,
iframe {
    max-width: 100%;
}

.page-container,
.app-page-container,
.content-section,
.gradebook-app,
.exams-app,
[data-exam-workspace],
[data-exam-tab-workspace],
.exam-serial-page,
.exam-report-settings,
.exam-report-sheet {
    min-width: 0;
    max-width: 100%;
}

/* Alle bisher horizontal scrollenden Auswahlleisten umbrechen stattdessen. */
.course-tabs,
.touch-selector,
.gradebook-category-index,
.exam-tabs,
.exam-student-strip,
.exam-scheme-list {
    display: flex;
    flex-wrap: wrap;
    overflow-x: visible;
    overflow-y: visible;
    max-width: 100%;
    overscroll-behavior-inline: auto;
}

.course-tabs > *,
.touch-selector > *,
.gradebook-category-index > *,
.exam-tabs > *,
.exam-student-strip > *,
.exam-scheme-list > * {
    min-width: 0;
    max-width: 100%;
}

.gradebook-category-chip,
.exam-student-strip button {
    flex: 0 1 auto;
}

.gradebook-category-chip,
.exam-student-strip button span,
.structure-crumb,
.gradebook-assessment-head small,
.quick-course-button span,
.assessment-label-badge,
.longpress-indicator,
.gradebook-average-cell > span {
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Breadcrumbs werden ebenfalls mehrzeilig statt seitlich verschoben. */
@media (max-width: 720px) {
    .structure-breadcrumb {
        flex-wrap: wrap;
        overflow-x: visible;
        padding-bottom: 0;
    }
    .structure-crumb {
        min-width: 0;
        max-width: 100%;
    }
}

/* Zusammenfassungen und Notentabellen bleiben innerhalb des Viewports. */
.summary-scroll,
.gradebook-table-scroll,
.exam-results-scroll {
    max-width: 100%;
    overflow-x: hidden;
}

.grade-summary-table,
.gradebook-overview-table,
.exam-results-table {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    table-layout: fixed;
}

.grade-summary-table th,
.grade-summary-table td,
.gradebook-overview-table th,
.gradebook-overview-table td,
.exam-results-table th,
.exam-results-table td {
    min-width: 0 !important;
    max-width: none;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

.gradebook-overview-table th:first-child,
.gradebook-overview-table td:first-child,
.gradebook-overview-table thead th.gradebook-student-head {
    min-width: 0 !important;
    width: clamp(96px, 24vw, 168px) !important;
    max-width: clamp(96px, 24vw, 168px) !important;
}

.gradebook-assessment-head {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.gradebook-assessment-head strong,
.gradebook-assessment-head small {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.gradebook-score-cell {
    width: 100%;
    max-width: 40px;
    min-width: 0;
    margin-inline: auto;
}

.gradebook-average-cell {
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

.gradebook-average-cell > span {
    width: 100%;
    min-width: 0;
    max-width: 44px;
    margin-inline: auto;
}

.exam-results-table th:first-child,
.exam-results-table td:first-child {
    position: static;
    left: auto;
    min-width: 0;
    width: 42%;
}

/* Seriendruck: Schülerchips umbrechen; Vorschau steht immer darunter. */
.exam-serial-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
    max-width: 100%;
}

.exam-serial-toolbar .exam-student-strip {
    width: 100%;
    min-width: 0;
    align-content: start;
    padding-bottom: 2px;
}

.exam-serial-toolbar .exam-student-strip button {
    min-width: 0;
    max-width: 100%;
}

.exam-report-settings-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.exam-serial-nav,
.exam-report-sheet {
    width: 100%;
}

/* A4-Hochformat als Bildschirmvorschau (210 : 297), responsiv verkleinert. */
.exam-report-sheet {
    width: min(100%, 794px);
    margin: 0 auto;
    padding: clamp(10px, 2.6vw, 22px);
    border-radius: 18px;
    aspect-ratio: 210 / 297;
}

.exam-report-header {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(4px, 1.5vw, 12px);
    font-size: clamp(.58rem, 1.6vw, .78rem);
}

.exam-report-header span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.exam-report-header span:nth-child(2) { text-align: center; }
.exam-report-header span:last-child { text-align: right; }

.exam-report-sheet h2 {
    font-size: clamp(.82rem, 2.2vw, 1.08rem);
    margin: clamp(10px, 2vw, 16px) 0 clamp(10px, 2.2vw, 18px);
}

.exam-report-name {
    min-width: 0;
    flex-wrap: wrap;
    gap: 6px 16px;
    font-size: clamp(.72rem, 1.9vw, .92rem);
}

.exam-report-table-wrap,
.exam-report-key-scroll {
    width: 100%;
    max-width: 100%;
    overflow: visible;
}

.exam-report-table {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    table-layout: fixed;
    font-size: clamp(.56rem, 1.45vw, .76rem);
    line-height: 1.16;
}

.exam-report-table th,
.exam-report-table td {
    min-width: 0;
    padding: clamp(3px, .8vw, 6px) clamp(3px, .9vw, 7px);
    overflow-wrap: anywhere;
    hyphens: auto;
}

.exam-report-table th:first-child { width: 11%; }
.exam-report-table th:nth-child(2) { width: 63%; }
.exam-report-table th:nth-child(3),
.exam-report-table th:nth-child(4) { width: 13%; }

.exam-report-table thead th {
    font-size: clamp(.5rem, 1.2vw, .68rem);
    line-height: 1.08;
}

.exam-report-grade {
    font-size: clamp(.82rem, 2vw, 1.08rem);
    overflow-wrap: anywhere;
}

.exam-report-signline {
    overflow-wrap: anywhere;
}

.exam-report-key {
    min-width: 0;
    font-size: clamp(.48rem, 1.15vw, .64rem);
}

.exam-report-key table {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    table-layout: fixed;
}

.exam-report-key th,
.exam-report-key td {
    min-width: 0;
    padding: 2px 1px;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.05;
}

.exam-report-key th {
    width: clamp(46px, 16%, 78px);
}

@media (max-width: 700px) {
    .exam-serial-toolbar {
        grid-template-columns: 1fr;
    }
    .exam-serial-print-actions { justify-items: stretch; }
    .exam-print-selection-status { text-align: left; }
    .exam-serial-print-actions .button-row > button { flex: 1 1 auto; }
    .exam-serial-toolbar > .btn {
        width: 100%;
    }
    .exam-report-header {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .exam-report-header span:nth-child(2) { text-align: center; }
    .exam-report-header span:last-child { text-align: right; }
    .exam-report-table th:first-child { width: 12%; }
    .exam-report-table th:nth-child(2) { width: 58%; }
    .exam-report-table th:nth-child(3),
    .exam-report-table th:nth-child(4) { width: 15%; }
}

@media (max-width: 460px) {
    .exam-student-strip {
        gap: 5px;
    }
    .exam-student-strip button {
        min-width: 0;
        padding: 6px 7px;
    }
    .exam-student-strip button span {
        font-size: .76rem;
    }
    .exam-report-sheet {
        padding: 9px 7px;
        border-radius: 12px;
    }
    .exam-report-table th,
    .exam-report-table td {
        padding: 3px 2px;
    }
}

@media print {
    html,
    body {
        width: 100%;
        max-width: none;
        overflow: visible !important;
        background: #fff !important;
    }

    .exam-report-sheet {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        max-width: none;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        aspect-ratio: auto;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .exam-report-header {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 3mm;
        padding-bottom: 1.5mm;
        font-size: 7.2pt;
    }

    .exam-report-sheet h2 {
        margin: 3.2mm 0 4mm;
        font-size: 10.5pt;
        line-height: 1.1;
    }

    .exam-report-name {
        margin-bottom: 2.2mm;
        gap: 5mm;
        font-size: 8.5pt;
    }

    .exam-report-table-wrap,
    .exam-report-key-scroll {
        overflow: visible !important;
        border-radius: 0;
    }

    .exam-report-table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
        font-size: 7pt;
        line-height: 1.08;
    }

    .exam-report-table th,
    .exam-report-table td {
        padding: 1.05mm 1.25mm;
        hyphens: auto;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .exam-report-table thead th {
        font-size: 6.4pt;
        line-height: 1.02;
    }

    .exam-report-table tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .exam-report-grade {
        margin: 3mm 0 2mm;
        font-size: 10pt;
        line-height: 1.1;
    }

    .exam-report-signline {
        margin: 2mm 0 4mm;
        font-size: 7pt;
    }

    .exam-report-key {
        gap: 1mm;
        font-size: 5.8pt;
        line-height: 1.05;
    }

    .exam-report-key table {
        width: 100%;
        min-width: 0;
        table-layout: fixed;
    }

    .exam-report-key th,
    .exam-report-key td {
        padding: .65mm .3mm;
        font-size: 5.6pt;
        line-height: 1;
    }

    .exam-report-key th {
        width: 20mm;
    }

    @page {
        size: A4 portrait;
        margin: 8mm;
    }
}


/* 0.8.9 – kompakte Tablet-Notenübersicht, feste Farbpalette und manuelles PWA-Update */
.drawer-update {
    padding: 8px 6px 0;
}
.drawer-update-button {
    min-height: 34px;
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 10px;
    font-size: .75rem;
    font-weight: 850;
}
.drawer-update-button span {
    font-size: 1rem;
    line-height: 1;
}
.drawer-update-button:hover,
.drawer-update-button:focus-visible {
    color: var(--primary);
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
    outline: none;
}
.drawer-update-button.is-updating span { animation: notenapp-refresh-spin .8s linear infinite; }
@keyframes notenapp-refresh-spin { to { transform: rotate(360deg); } }

/* Native freie Farbauswahl wird durch eine appweit einheitliche 8er-Palette ersetzt. */
.fixed-color-input {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.color-row:has(.fixed-color-picker) {
    display: grid !important;
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) !important;
    align-items: center;
}
.fixed-color-picker {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(8, minmax(30px, 1fr));
    gap: 7px;
}
.fixed-color-swatch {
    position: relative;
    min-width: 0;
    height: 38px;
    border: 2px solid transparent;
    border-radius: 10px;
    background: var(--swatch-color);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}
.fixed-color-swatch.active {
    border-color: #fff;
    box-shadow: 0 0 0 3px var(--primary), inset 0 0 0 1px rgba(0,0,0,.08);
}
.fixed-color-swatch:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 35%, transparent);
    outline-offset: 2px;
}
@media (max-width: 560px) {
    .color-row:has(.fixed-color-picker) { grid-template-columns: 1fr !important; }
    .fixed-color-picker { grid-template-columns: repeat(4, minmax(42px, 1fr)); }
}

/* Durchschnittsspalten der Kategorien: echte flächige Kategoriefarbe statt blasser Innenbox. */
.gradebook-average-column-head {
    background: var(--category-color) !important;
    color: var(--average-text-color, #fff) !important;
}
.gradebook-average-column-head .gradebook-category-head,
.gradebook-average-column-head .gradebook-average-head,
.gradebook-average-column-head strong {
    color: var(--average-text-color, #fff) !important;
}
.gradebook-average-column-head .gradebook-assessment-color {
    background: currentColor;
    opacity: .7;
}
.gradebook-average-cell,
.gradebook-student-row-active > td.gradebook-average-cell {
    background: var(--category-color) !important;
    color: var(--average-text-color, #fff) !important;
}
.gradebook-average-cell > span {
    width: 100%;
    max-width: none;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-weight: 950;
}

/* Feste, gleichmäßig verteilte Spalten ohne horizontales Scrollen. */
.gradebook-overview-table col.gradebook-student-col {
    width: clamp(120px, 18vw, 168px);
}
.gradebook-overview-table col.gradebook-data-col {
    width: calc((100% - clamp(120px, 18vw, 168px)) / var(--grade-data-columns, 1));
}
.gradebook-overview-table th:first-child,
.gradebook-overview-table td:first-child,
.gradebook-overview-table thead th.gradebook-student-head {
    width: clamp(120px, 18vw, 168px) !important;
    max-width: clamp(120px, 18vw, 168px) !important;
}

/* Tablets: deutlich kompaktere Noteneingabe als auf Desktop. */
@media (min-width: 721px) and (max-width: 1180px) {
    .grades-view {
        gap: 8px;
    }
    .grades-view .grade-heading {
        margin: 2px 0 5px;
    }
    .grades-view .grade-heading h1 {
        font-size: clamp(1.45rem, 3vw, 1.9rem);
        line-height: 1.02;
    }
    .grades-view .touch-selector,
    .grades-view .course-tabs {
        gap: 6px;
        padding-bottom: 5px;
    }
    .grades-view .touch-chip {
        min-height: 36px;
        padding: 7px 11px;
        border-radius: 11px;
        font-size: .82rem;
    }
    .grades-view .grade-create-bar {
        margin-bottom: 7px;
        padding: 7px 9px;
        border-radius: 12px;
        gap: 8px;
    }
    .grades-view .grade-create-bar strong { font-size: .86rem; }
    .grades-view .grade-create-bar .btn {
        min-height: 34px;
        padding: 6px 10px;
        border-radius: 10px;
        font-size: .78rem;
    }
    .gradebook-overview-panel {
        padding: 10px !important;
        border-radius: 14px;
    }
    .gradebook-overview-panel .mini-heading {
        padding-bottom: 7px;
        margin-bottom: 5px;
    }
    .gradebook-overview-panel .mini-heading h3 { font-size: .88rem; }
    .gradebook-table-scroll { border-radius: 12px; }
    .gradebook-overview-table col.gradebook-student-col { width: 150px; }
    .gradebook-overview-table col.gradebook-data-col { width: calc((100% - 150px) / var(--grade-data-columns, 1)); }
    .gradebook-overview-table th:first-child,
    .gradebook-overview-table td:first-child,
    .gradebook-overview-table thead th.gradebook-student-head {
        width: 150px !important;
        max-width: 150px !important;
    }
    .gradebook-overview-table th,
    .gradebook-overview-table td {
        padding: 3px 3px !important;
        font-size: .72rem;
    }
    .gradebook-category-row th.gradebook-category-group,
    .gradebook-category-head {
        min-height: 32px !important;
    }
    .gradebook-category-head {
        padding: 4px 4px !important;
        font-size: .66rem;
        line-height: 1.05;
    }
    .gradebook-overview-table .gradebook-assessment-row th:not(.gradebook-student-head) {
        height: 48px;
        padding: 2px 2px !important;
    }
    .gradebook-overview-table .gradebook-assessment-row .gradebook-assessment-head {
        min-height: 44px;
        padding: 3px 2px;
        gap: 1px;
    }
    .gradebook-assessment-head strong {
        font-size: .66rem !important;
        line-height: 1.02 !important;
    }
    .gradebook-assessment-head small {
        font-size: .55rem !important;
        line-height: 1 !important;
    }
    .gradebook-assessment-color {
        width: 24px !important;
        height: 3px !important;
    }
    .gradebook-assessment-label .assessment-label-badge {
        font-size: .49rem;
        padding: 1px 4px;
    }
    .gradebook-student-cell { gap: 5px; }
    .gradebook-student-index {
        width: 22px;
        height: 22px;
        font-size: .61rem;
    }
    .gradebook-student-cell strong {
        font-size: .74rem;
        line-height: 1.02;
    }
    .gradebook-student-cell .course-type-badge {
        min-height: 17px;
        padding: 1px 5px;
        font-size: .52rem;
    }
    .gradebook-score-cell {
        width: 34px;
        max-width: 34px;
        height: 32px;
        min-height: 32px;
        border-radius: 8px;
        font-size: .76rem;
    }
    .gradebook-average-head.gradebook-category-head {
        min-height: 44px !important;
        padding: 3px 2px !important;
    }
    .gradebook-average-head strong { font-size: .72rem; }
    .gradebook-average-cell > span { font-size: .72rem; }
}

/* 0.9.0 – Dashboard-Schnellzugriff, kompakte Mittelwert-Badges und Anforderungen-Schnelleingabe */
.dashboard-heading { margin-bottom: 12px; }
.dashboard-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.dashboard-action-panel {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 14px;
}
.dashboard-action-head h2 { margin-bottom: 4px; }
.dashboard-action-head p:last-child { margin: 0; color: var(--muted); font-size: .9rem; }
.dashboard-course-buttons { display: grid; gap: 9px; }
.dashboard-course-button {
    width: 100%;
    min-width: 0;
    min-height: 66px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--page) 72%, #fff);
    color: var(--text);
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    text-align: left;
}
.dashboard-course-button:hover,
.dashboard-course-button:focus-visible {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
    box-shadow: 0 6px 18px rgba(11,45,77,.08);
    outline: none;
}
.dashboard-course-button > span:nth-child(2) { min-width: 0; }
.dashboard-course-button strong,
.dashboard-course-button small { display: block; overflow-wrap: anywhere; }
.dashboard-course-button small { margin-top: 2px; color: var(--muted); font-size: .75rem; font-weight: 700; }
.dashboard-course-button > i { font-style: normal; color: var(--primary); font-weight: 950; }
.dashboard-course-button-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: var(--accent);
    color: #fff;
    font-weight: 950;
}
.dashboard-course-button-icon-exam { background: var(--primary); }

@media (max-width: 760px) {
    .dashboard-action-grid { grid-template-columns: 1fr; gap: 12px; }
    .dashboard-action-panel { padding: 15px; }
}

.average-decimals-choice {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.average-decimals-choice button {
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 9px 13px;
    background: #fff;
    color: var(--text);
    font: inherit;
    font-weight: 850;
}
.average-decimals-choice button.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}

/* Die Durchschnittsspalte bleibt neutral. Nur der Wert selbst trägt die Kategoriefarbe. */
.gradebook-average-column-head {
    background: color-mix(in srgb, var(--page) 72%, #fff) !important;
    color: var(--text) !important;
}
.gradebook-average-column-head .gradebook-category-head,
.gradebook-average-column-head .gradebook-average-head,
.gradebook-average-column-head strong {
    color: var(--text) !important;
}
.gradebook-average-column-head .gradebook-assessment-color {
    background: var(--category-color) !important;
    opacity: 1 !important;
}
.gradebook-average-cell,
.gradebook-student-row-active > td.gradebook-average-cell {
    background: #fff !important;
    color: var(--text) !important;
}
.gradebook-average-cell > span {
    width: auto !important;
    min-width: 36px !important;
    max-width: 100% !important;
    min-height: 32px !important;
    margin-inline: auto;
    padding: 5px 7px !important;
    border: 0 !important;
    border-radius: 9px !important;
    display: inline-grid !important;
    place-items: center;
    background: var(--category-color) !important;
    color: var(--average-text-color, #fff) !important;
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}
.gradebook-average-cell.long-press-pending > span {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--category-color) 28%, transparent);
}

.exam-requirements-head .button-row,
.exam-requirements-footer {
    flex-wrap: wrap;
}
.exam-requirement-quick-dialog { width: min(680px, calc(100vw - 24px)); }
.exam-requirement-quick-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: -2px 0 12px;
    color: var(--muted);
    font-size: .86rem;
}
.exam-requirement-quick-meta strong { color: var(--primary); }
.exam-requirement-quick-field { display: grid; gap: 7px; }
.exam-requirement-quick-field > span { font-weight: 850; }
.exam-requirement-quick-field textarea {
    width: 100%;
    min-height: 220px;
    resize: vertical;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 13px 14px;
    background: #fff;
    color: var(--text);
    font: inherit;
    line-height: 1.45;
}
.exam-requirement-quick-field textarea:focus {
    outline: 3px solid color-mix(in srgb, var(--accent) 22%, transparent);
    border-color: var(--accent);
}
.exam-requirement-quick-hint { margin: 9px 0 0; font-size: .8rem; }
.exam-requirement-quick-actions { margin-top: 14px; }
@media (max-width: 560px) {
    .exam-requirement-quick-field textarea { min-height: 180px; }
    .exam-requirement-quick-actions { display: grid; grid-template-columns: auto minmax(0, 1fr); }
    .exam-requirement-quick-actions .dialog-action-spacer { display: none; }
    .exam-requirement-quick-actions .btn-primary { width: 100%; }
}

/* 0.9.1 - volle Desktopbreite + tabellarische Klausur-Punkteingabe */
@media (min-width: 901px) {
    .page-container,
    .app-page-container {
        width: calc(100% - 32px);
        max-width: none;
        margin-inline: 16px;
    }

    .content-section,
    .gradebook-app,
    .exam-page,
    .exam-workspace,
    [data-exam-workspace],
    [data-exam-tab-workspace],
    .app-view,
    .panel {
        width: 100%;
        max-width: none;
    }
}

.exam-mark-sheet-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}
.exam-mark-sheet-toolbar > div { display: grid; gap: 2px; min-width: 0; }
.exam-mark-sheet-toolbar strong { font-size: .92rem; }
.exam-mark-sheet-toolbar span { color: var(--muted); font-size: .75rem; font-weight: 650; }

.exam-mark-sheet-wrap {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}
.exam-mark-sheet {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font-size: clamp(.66rem, .72vw, .82rem);
}
.exam-mark-sheet th,
.exam-mark-sheet td {
    min-width: 0;
    padding: 5px 4px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    text-align: center;
    vertical-align: middle;
    overflow: hidden;
}
.exam-mark-sheet tr > *:last-child { border-right: 0; }
.exam-mark-sheet tbody tr:last-child > * { border-bottom: 0; }
.exam-mark-sheet thead th {
    background: #F7F9FB;
    color: var(--text);
    font-weight: 900;
}
.exam-mark-sheet-group {
    padding-block: 6px !important;
    background: #EEF3F7 !important;
    color: var(--primary) !important;
    font-size: .72rem;
}
.exam-mark-sheet-student-head { width: clamp(150px, 15vw, 220px); text-align: left !important; padding-left: 10px !important; }
.exam-mark-sheet-total-head { width: 58px; }
.exam-mark-sheet-grade-head { width: 72px; }
.exam-mark-sheet-task-head { padding: 5px 2px !important; }
.exam-mark-sheet-task-head strong,
.exam-mark-sheet-task-head small { display: block; overflow-wrap: anywhere; }
.exam-mark-sheet-task-head strong { font-size: .72rem; }
.exam-mark-sheet-task-head small { margin-top: 2px; color: var(--muted); font-size: .58rem; font-weight: 750; }
.exam-mark-sheet-student {
    text-align: left !important;
    background: #FBFCFD;
    padding: 6px 7px !important;
}
.exam-mark-sheet-student > span:last-child { min-width: 0; display: grid; gap: 1px; }
.exam-mark-sheet-student strong { font-size: .76rem; line-height: 1.08; overflow-wrap: anywhere; }
.exam-mark-sheet-student small { color: var(--muted); font-size: .59rem; font-weight: 700; }
.exam-mark-sheet-student-index {
    float: left;
    width: 22px;
    height: 22px;
    margin: 1px 6px 1px 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #EEF2F5;
    color: var(--muted);
    font-size: .62rem;
    font-weight: 900;
}
.exam-mark-sheet-cell {
    width: min(100%, 46px);
    min-height: 36px;
    margin-inline: auto;
    border: 1px solid #CBD7E2;
    border-radius: 9px;
    background: #F8FAFC;
    color: var(--primary);
    display: grid;
    place-items: center;
    gap: 0;
    padding: 3px 2px;
    font: inherit;
}
.exam-mark-sheet-cell strong { font-size: .78rem; line-height: 1; }
.exam-mark-sheet-cell small { display: none; color: inherit; opacity: .72; font-size: .52rem; font-weight: 750; }
.exam-mark-sheet-cell.entered {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.exam-mark-sheet-cell:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 28%, transparent);
    outline-offset: 1px;
}
.exam-mark-sheet-total strong,
.exam-mark-sheet-grade strong { display: block; color: var(--primary); font-size: .78rem; }
.exam-mark-sheet-total small,
.exam-mark-sheet-grade small { display: block; margin-top: 1px; color: var(--muted); font-size: .52rem; font-weight: 700; overflow-wrap: anywhere; }

@media (max-width: 900px) {
    .exam-mark-sheet-wrap { border: 0; border-radius: 0; background: transparent; overflow: visible; }
    .exam-mark-sheet { display: block; font-size: .78rem; }
    .exam-mark-sheet thead { display: none; }
    .exam-mark-sheet tbody { display: grid; gap: 10px; }
    .exam-mark-sheet tbody tr {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
        gap: 6px;
        padding: 8px;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: #fff;
        box-shadow: 0 5px 14px rgba(11,45,77,.05);
    }
    .exam-mark-sheet tbody tr > * {
        min-width: 0;
        border: 0;
        border-radius: 10px;
        background: #F8FAFC;
        padding: 5px !important;
    }
    .exam-mark-sheet-student {
        grid-column: 1 / -1;
        min-height: 42px;
        background: #EEF3F7 !important;
    }
    .exam-mark-sheet-score,
    .exam-mark-sheet-total,
    .exam-mark-sheet-grade {
        display: grid;
        gap: 3px;
        align-content: start;
    }
    .exam-mark-sheet-score::before,
    .exam-mark-sheet-total::before,
    .exam-mark-sheet-grade::before {
        content: attr(data-task-label);
        display: block;
        color: var(--muted);
        font-size: .56rem;
        font-weight: 900;
        line-height: 1;
        text-align: center;
    }
    .exam-mark-sheet-cell {
        width: 100%;
        max-width: none;
        min-height: 38px;
    }
    .exam-mark-sheet-cell small { display: block; }
    .exam-mark-sheet-total,
    .exam-mark-sheet-grade { text-align: center; background: #EEF3F7 !important; }
}

@media (max-width: 520px) {
    .exam-mark-sheet-toolbar { padding: 9px 10px; }
    .exam-mark-sheet-toolbar span { font-size: .7rem; }
    .exam-mark-sheet tbody tr { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 0.9.2 - Bewertungsbogen: Punktzahlen konsequent zentrieren */
.exam-report-table th:nth-child(3),
.exam-report-table th:nth-child(4),
.exam-report-table tbody tr:not(.exam-report-subtotal):not(.exam-report-total) td:nth-child(3),
.exam-report-table tbody tr:not(.exam-report-subtotal):not(.exam-report-total) td:nth-child(4),
.exam-report-subtotal td:nth-child(2),
.exam-report-subtotal td:nth-child(3),
.exam-report-total td:nth-child(2),
.exam-report-total td:nth-child(3) {
    text-align: center !important;
    vertical-align: middle !important;
    font-variant-numeric: tabular-nums;
}


/* 0.9.3 – Kurslisten-Diff vor erneutem Schülerimport */
.student-import-diff-dialog { width: min(96vw, 860px); }
.student-import-diff-dialog form { max-height: min(88vh, 860px); overflow: hidden; grid-template-rows: auto auto auto minmax(0, 1fr) auto auto; }
.import-diff-intro { margin: -4px 0 0; }
.import-diff-pending { display: grid; gap: 3px; padding: 11px 13px; border: 1px solid rgba(45,125,210,.32); border-radius: 14px; background: rgba(45,125,210,.09); }
.import-diff-pending strong { color: var(--primary); font-size: .88rem; }
.import-diff-pending span { color: var(--muted); font-size: .78rem; line-height: 1.35; }

.import-diff-file { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(244,247,251,.78); }
.import-diff-file strong { overflow-wrap: anywhere; }
.import-diff-file span { color: var(--muted); font-weight: 800; }
.import-diff-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); gap: 8px; margin-top: 10px; }
.import-diff-stat { min-width: 0; padding: 10px 9px; border: 1px solid rgba(45,125,210,.22); border-radius: 13px; background: rgba(45,125,210,.08); text-align: center; }
.import-diff-stat strong { display: block; font-size: 1.15rem; line-height: 1.05; color: var(--primary); }
.import-diff-stat span { display: block; margin-top: 4px; font-size: .72rem; line-height: 1.15; font-weight: 800; color: var(--muted); overflow-wrap: anywhere; }
.import-diff-stat.is-zero { opacity: .52; background: rgba(120,138,154,.06); border-color: var(--line); }
.student-import-diff-details { min-height: 0; overflow-y: auto; overflow-x: hidden; padding-right: 3px; display: grid; gap: 12px; align-content: start; }
.import-diff-section { border: 1px solid var(--line); border-radius: 15px; overflow: hidden; background: #fff; }
.import-diff-section h3 { margin: 0; padding: 10px 13px; font-size: .86rem; background: rgba(45,125,210,.08); border-bottom: 1px solid var(--line); }
.import-diff-danger h3 { color: #a02222; background: rgba(214,69,69,.10); }
.import-diff-warning h3, .import-diff-missing h3 { background: rgba(242,140,40,.10); }
.import-diff-list { display: grid; }
.import-diff-row { min-width: 0; display: grid; grid-template-columns: minmax(160px, .9fr) minmax(0, 1.7fr); gap: 10px 16px; padding: 10px 13px; border-top: 1px solid var(--line); }
.import-diff-row:first-child { border-top: 0; }
.import-diff-row > div, .import-diff-row p { min-width: 0; }
.import-diff-row strong { display: block; overflow-wrap: anywhere; }
.import-diff-row small { display: block; margin-top: 3px; color: var(--muted); overflow-wrap: anywhere; }
.import-diff-row p { margin: 0; font-size: .82rem; line-height: 1.35; overflow-wrap: anywhere; }
.import-diff-row-danger { background: rgba(214,69,69,.045); }
.import-diff-safety { padding: 10px 12px; border-radius: 13px; background: rgba(242,140,40,.10); border: 1px solid rgba(242,140,40,.28); font-size: .79rem; line-height: 1.35; }
.import-diff-empty { display: grid; gap: 4px; padding: 16px; border: 1px dashed var(--line); border-radius: 14px; text-align: center; color: var(--muted); }
.import-diff-empty strong { color: var(--text); }
@media (max-width: 640px) {
    .student-import-diff-dialog form { max-height: 92vh; padding: 16px; }
    .import-diff-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .import-diff-row { grid-template-columns: 1fr; gap: 5px; }
}

/* 0.9.5 – kompakter Aufgaben-Dialog, feste Teile A/B und Teilaufgaben-Badges */
.exam-task-dialog {
    width: min(96vw, 980px);
    max-height: min(96vh, 920px);
}
.exam-task-dialog > form {
    max-height: min(96vh, 920px);
    padding: 16px;
    gap: 10px;
}
.exam-task-meta {
    display: grid;
    grid-template-columns: minmax(180px, .65fr) minmax(280px, 1fr);
    gap: 12px;
    align-items: end;
}
.exam-task-meta > label,
.exam-task-meta > fieldset {
    min-width: 0;
}
.exam-task-meta input[name="name"] {
    min-height: 42px;
    padding-block: 7px;
}
.exam-task-section-choice {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px !important;
}
.exam-task-section-choice legend {
    grid-column: 1 / -1;
    margin-bottom: 0;
}
.exams-app .exam-task-section-choice > button {
    min-height: 42px;
    padding: 7px 12px;
}
.exam-subtask-editor {
    gap: 7px;
}
.exam-subtask-editor-head {
    gap: 8px;
}
.exam-subtask-editor-head .btn {
    min-height: 38px;
    padding: 7px 11px;
}
.exam-subtask-list {
    gap: 7px;
}
.exam-subtask-card {
    grid-template-columns: minmax(220px, .8fr) minmax(430px, 1.45fr);
    grid-template-areas:
        "head head"
        "requirement points"
        "free free";
    gap: 7px 10px;
    padding: 9px;
    border-radius: 13px;
}
.exam-subtask-card-head { grid-area: head; }
.exam-subtask-requirement { grid-area: requirement; align-self: stretch; }
.exam-subtask-point-grid { grid-area: points; align-self: end; }
.exam-subtask-free { grid-area: free; justify-self: end; width: min(100%, 330px); }
.exam-subtask-card-head strong { font-size: .95rem; }
.exam-subtask-card-head span { font-size: .72rem; }
.exam-subtask-remove {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    font-size: 1rem;
}
.exam-subtask-requirement {
    gap: 4px !important;
}
.exam-subtask-requirement span {
    font-size: .72rem;
}
.exam-subtask-requirement textarea {
    min-height: 66px;
    height: 66px;
    padding: 7px 9px;
    border-radius: 10px;
    font-size: .84rem;
}
.exam-subtask-point-grid {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 4px;
}
.exam-subtask-point-grid button {
    min-width: 0;
    min-height: 31px;
    padding: 3px 1px;
    border-radius: 8px;
    font-size: .72rem;
    line-height: 1;
}
.exam-subtask-free {
    grid-template-columns: auto minmax(110px, 150px) !important;
    gap: 7px !important;
}
.exam-subtask-free span {
    font-size: .72rem;
}
.exam-subtask-free input {
    min-height: 34px;
    padding: 5px 8px;
    border-radius: 9px;
}
.exam-task-live-totals {
    gap: 5px;
}
.exam-task-live-totals > div {
    padding: 6px 8px;
    border-radius: 10px;
}
.exam-task-live-totals small { font-size: .65rem; }
.exam-task-live-totals strong { font-size: .86rem; }
.exam-section-title-static {
    cursor: default;
}
.exam-structure-subtask-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 4px;
}
.exam-structure-subtask-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 25px;
    padding: 3px 7px;
    border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line));
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 8%, #fff);
    color: var(--text);
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
}
.exam-structure-subtask-badge b {
    color: var(--primary);
    font-size: .72rem;
}
.exam-structure-subtask-badge em {
    color: var(--muted);
    font-style: normal;
    font-weight: 800;
}
.exam-structure-subtask-badge.is-empty {
    color: var(--muted);
    background: #F7F9FC;
}
.exam-structure-major-total {
    min-width: 58px;
    text-align: right;
    font-size: .92rem;
}
.exam-structure-legacy-warning {
    padding: 10px 12px;
    border: 1px solid #F2D28B;
    border-radius: 12px;
    background: #FFF9E8;
    color: #74520A;
    font-size: .78rem;
    font-weight: 750;
}

@media (max-width: 760px) {
    .exam-task-dialog > form {
        padding: 12px;
        gap: 8px;
    }
    .exam-task-meta {
        grid-template-columns: minmax(125px, .7fr) minmax(170px, 1.3fr);
        gap: 8px;
    }
    .exam-subtask-editor-head {
        flex-direction: row;
        align-items: center;
    }
    .exam-subtask-editor-head .btn {
        width: auto;
        flex: 0 0 auto;
    }
    .exam-subtask-card {
        grid-template-columns: 1fr;
        grid-template-areas:
            "head"
            "requirement"
            "points"
            "free";
        gap: 6px;
        padding: 8px;
    }
    .exam-subtask-requirement textarea {
        min-height: 52px;
        height: 52px;
    }
    .exam-subtask-point-grid {
        grid-template-columns: repeat(10, minmax(0, 1fr));
        gap: 3px;
    }
    .exam-subtask-point-grid button {
        min-height: 30px;
        font-size: .67rem;
    }
    .exam-subtask-free {
        width: 100%;
        grid-template-columns: minmax(0,1fr) minmax(95px,130px) !important;
    }
    .exam-task-live-totals {
        grid-template-columns: repeat(4, minmax(0,1fr));
    }
    .exam-structure-major-task {
        align-items: flex-start;
    }
}

@media (max-width: 430px) {
    .exam-task-meta {
        grid-template-columns: 1fr;
    }
    .exam-task-section-choice {
        grid-template-columns: 1fr 1fr;
    }
    .exam-subtask-point-grid button {
        min-height: 28px;
        font-size: .62rem;
        letter-spacing: -.02em;
    }
    .exam-subtask-card-head > div {
        gap: 5px;
    }
    .exam-task-live-totals {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
    .exam-structure-task.exam-structure-major-task {
        flex-direction: column;
        align-items: stretch;
    }
    .exam-structure-major-total {
        min-width: 0;
        text-align: left;
    }
}

/* 0.9.6 – Rich-Text-/Formelanforderungen (Word-Paste + MathML/MathJax) */
.exam-rich-editor {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--text);
    padding: 10px 12px;
    font: inherit;
    line-height: 1.38;
    overflow-wrap: anywhere;
    word-break: normal;
    white-space: normal;
    cursor: text;
}
.exam-rich-editor:focus {
    outline: 3px solid color-mix(in srgb,var(--accent) 18%,transparent);
    border-color: var(--accent);
}
.exam-rich-editor:empty::before {
    content: attr(data-placeholder);
    color: #7A8796;
    pointer-events: none;
}
.exam-rich-editor p,
.exam-rich-output p { margin: 0 0 .28em; }
.exam-rich-editor p:last-child,
.exam-rich-output p:last-child { margin-bottom: 0; }
.exam-rich-editor ul,
.exam-rich-editor ol,
.exam-rich-output ul,
.exam-rich-output ol { margin: .2em 0 .2em 1.35em; padding: 0; }
.exam-rich-editor sup,
.exam-rich-editor sub,
.exam-rich-output sup,
.exam-rich-output sub { line-height: 0; }
.exam-rich-editor math,
.exam-rich-output math {
    max-width: 100%;
    font-size: 1em;
}
.exam-rich-editor math[display="block"],
.exam-rich-output math[display="block"] { margin: .24em 0; }
.exam-rich-output {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    line-height: 1.3;
}
.exam-rich-output mjx-container {
    max-width: 100%;
    margin: .08em 0 !important;
    font-size: 1em !important;
}
.exam-requirement-editor { min-height: 76px; }
.exam-subtask-requirement-editor {
    min-height: 66px;
    height: auto;
    padding: 7px 9px;
    border-radius: 10px;
    font-size: .84rem;
}
.exam-requirement-quick-editor { min-height: 180px; }
.exam-requirement-quick-preview-wrap {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}
.exam-requirement-quick-preview-wrap > span {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 850;
}
.exam-requirement-quick-preview {
    min-height: 58px;
    padding: 10px 12px;
    border: 1px dashed color-mix(in srgb,var(--accent) 36%,var(--line));
    border-radius: 12px;
    background: color-mix(in srgb,var(--accent) 4%,#fff);
}
.exam-report-table .exam-rich-output { text-align: left; font-weight: 400; }

@media (max-width: 760px) {
    .exam-subtask-requirement-editor { min-height: 54px; }
    .exam-requirement-quick-editor { min-height: 150px; }
}

@media print {
    .exam-report-table .exam-rich-output {
        font-size: 1em;
        line-height: 1.18;
    }
    .exam-report-table .exam-rich-output mjx-container,
    .exam-report-table .exam-rich-output math {
        break-inside: avoid;
        page-break-inside: avoid;
        max-width: 100%;
    }
}


/* 1.0.0 – Teilaufgaben unten ergänzen, frei sortieren und einzeln löschen */
.exam-subtask-actions {
    display: inline-flex !important;
    align-items: center;
    gap: 5px !important;
    flex: 0 0 auto;
}
.exam-subtask-action {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    color: var(--primary);
    font: inherit;
    font-size: .9rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}
.exam-subtask-action:hover:not(:disabled),
.exam-subtask-action:focus-visible:not(:disabled) {
    border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
    background: color-mix(in srgb, var(--accent) 8%, #fff);
}
.exam-subtask-action:disabled {
    opacity: .28;
    cursor: default;
}
.exam-subtask-action.exam-subtask-remove {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(180,35,24,.15);
    background: #FDECEC;
    color: #B42318;
    font-size: 1rem;
}
.exam-subtask-action.exam-subtask-remove:disabled {
    background: #F3F5F7;
    border-color: var(--line);
    color: var(--muted);
}
.exam-subtask-add-bottom {
    display: flex;
    justify-content: flex-end;
    padding-top: 1px;
}
.exam-subtask-add-bottom .btn {
    min-height: 38px;
    padding: 7px 11px;
}
@media (max-width: 520px) {
    .exam-subtask-card-head { align-items: flex-start; }
    .exam-subtask-actions { gap: 4px !important; }
    .exam-subtask-action,
    .exam-subtask-action.exam-subtask-remove { width: 30px; height: 30px; border-radius: 8px; }
    .exam-subtask-add-bottom .btn { width: 100%; }
}


/* 1.0.1 – Anforderungen immer in Normalschnitt; mathematische Typografie bleibt MathJax/MathML überlassen */
.exam-rich-editor,
.exam-rich-output,
.exam-requirement-quick-preview {
    font-style: normal;
    font-weight: 400;
}
.exam-rich-editor :where(p, div, span, ul, ol, li, u, s, sup, sub),
.exam-rich-output :where(p, div, span, ul, ol, li, u, s, sup, sub),
.exam-requirement-quick-preview :where(p, div, span, ul, ol, li, u, s, sup, sub) {
    font-style: normal;
    font-weight: 400;
}

/* 1.0.2 – farblich gruppierte Klausurkorrektur mit Aufgabenfiltern und Anforderungsvorschau */
.exam-correction-filterbar {
    display: grid;
    gap: 8px;
    margin: 0 0 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}
.exam-correction-filterbar-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
}
.exam-correction-filterbar-head strong { font-size: .84rem; }
.exam-correction-filterbar-head span { color: var(--muted); font-size: .7rem; font-weight: 650; }
.exam-correction-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.exam-correction-filter {
    min-height: 30px;
    border: 1px solid color-mix(in srgb, var(--filter-color, var(--primary)) 34%, var(--line));
    border-radius: 999px;
    background: #fff;
    color: var(--primary);
    padding: 5px 10px;
    font: inherit;
    font-size: .7rem;
    font-weight: 900;
    line-height: 1;
}
.exam-correction-filter:hover,
.exam-correction-filter:focus-visible {
    border-color: var(--filter-color, var(--primary));
    outline: none;
}
.exam-correction-filter.active {
    background: color-mix(in srgb, var(--filter-color, var(--primary)) 24%, #fff);
    border-color: var(--filter-color, var(--primary));
    color: var(--primary);
    box-shadow: 0 2px 7px color-mix(in srgb, var(--filter-color, var(--primary)) 18%, transparent);
}
.exam-correction-filter-empty {
    margin: 0 0 10px;
    padding: 11px 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: #fff;
    color: var(--muted);
    font-size: .76rem;
    font-weight: 750;
}

.exam-mark-sheet-task-head {
    position: relative;
    background: color-mix(in srgb, var(--task-color, #2D7DD2) 22%, #fff) !important;
    border-top: 3px solid var(--task-color, #2D7DD2);
}
.exam-mark-sheet-task-head.has-requirement { cursor: help; }
.exam-mark-sheet-task-head:focus-visible {
    outline: 2px solid var(--task-color, var(--accent));
    outline-offset: -2px;
    z-index: 3;
}
.exam-mark-sheet-max-badge {
    display: inline-flex;
    min-width: 23px;
    min-height: 18px;
    margin-top: 3px;
    align-items: center;
    justify-content: center;
    padding: 2px 5px;
    border: 1px solid color-mix(in srgb, var(--task-color, #2D7DD2) 42%, #fff);
    border-radius: 999px;
    background: color-mix(in srgb, var(--task-color, #2D7DD2) 24%, #fff);
    color: color-mix(in srgb, var(--task-color, #2D7DD2) 78%, #071d31);
    font-size: .58rem;
    font-weight: 950;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.exam-mark-sheet-requirement-summary {
    display: -webkit-box;
    margin-top: 4px;
    max-height: 2.3em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: #496177;
    font-size: .49rem;
    font-weight: 400;
    font-style: normal;
    line-height: 1.15;
    text-align: left;
    overflow-wrap: anywhere;
    pointer-events: none;
}
.exam-mark-sheet-requirement-summary.is-empty {
    opacity: .45;
    text-align: center;
}
.exam-mark-sheet-requirement-summary p,
.exam-mark-sheet-requirement-summary div { display: inline; margin: 0; }
.exam-mark-sheet-requirement-summary br { display: none; }
.exam-mark-sheet-requirement-summary mjx-container,
.exam-mark-sheet-requirement-summary math {
    display: inline !important;
    margin: 0 !important;
    font-size: .92em !important;
}
.exam-mark-sheet-score {
    background: color-mix(in srgb, var(--task-color, #2D7DD2) 12%, #fff);
}
.exam-mark-sheet-score .exam-mark-sheet-cell {
    background: color-mix(in srgb, var(--task-color, #2D7DD2) 8%, #fff);
    border-color: color-mix(in srgb, var(--task-color, #2D7DD2) 30%, #cbd7e2);
}
.exam-mark-sheet-score .exam-mark-sheet-cell.entered {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.exam-correction-requirement-popover {
    position: fixed;
    z-index: 5000;
    max-height: min(46vh, 360px);
    overflow: auto;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 42px rgba(11,45,77,.24);
    color: var(--text);
    font-size: .82rem;
    line-height: 1.4;
}
.exam-correction-requirement-popover[hidden] { display: none !important; }
.exam-correction-requirement-popover-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    padding-bottom: 7px;
    border-bottom: 1px solid var(--line);
}
.exam-correction-requirement-popover-head strong { color: var(--primary); font-size: .82rem; }
.exam-correction-requirement-popover-head span {
    flex: 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    background: #eef3f7;
    color: var(--primary);
    font-size: .68rem;
    font-weight: 900;
}
.exam-correction-requirement-popover .exam-rich-output {
    font-weight: 400;
    font-style: normal;
}
.exam-correction-requirement-popover .exam-rich-output mjx-container { margin: 0 .04em !important; }

@media (max-width: 900px) {
    .exam-correction-filterbar { padding: 9px 10px; }
    .exam-correction-filter { min-height: 32px; padding-inline: 10px; font-size: .72rem; }
    .exam-mark-sheet tbody tr > .exam-mark-sheet-score {
        background: color-mix(in srgb, var(--task-color, #2D7DD2) 9%, #fff) !important;
        box-shadow: inset 0 3px 0 color-mix(in srgb, var(--task-color, #2D7DD2) 48%, transparent);
    }
}

@media (max-width: 520px) {
    .exam-correction-filterbar-head { display: grid; gap: 2px; }
    .exam-correction-filters { gap: 5px; }
    .exam-correction-filter { min-height: 30px; padding: 5px 9px; font-size: .68rem; }
    .exam-correction-requirement-popover { font-size: .78rem; }
}


/* 1.0.3 – persönliche Unterschrift im Konto und Seriendruck */
.account-signature-help {
    margin: -2px 0 14px;
    line-height: 1.45;
}
.account-signature-pad-wrap {
    position: relative;
    width: 100%;
    height: 190px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: inset 0 1px 2px rgba(11,45,77,.04);
}
.account-signature-pad {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    touch-action: none;
    cursor: crosshair;
    z-index: 2;
}
.account-signature-line {
    position: absolute;
    left: 6%;
    right: 6%;
    bottom: 44px;
    height: 1px;
    background: color-mix(in srgb,var(--muted) 35%,transparent);
    pointer-events: none;
}
.account-signature-hint {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    color: var(--muted);
    font-size: .92rem;
    pointer-events: none;
    transition: opacity .15s ease;
}
.account-signature-hint.hidden { opacity: 0; }
.account-signature-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.account-signature-actions .btn-primary { margin-left: auto; }

.exam-report-signature-block {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0;
    margin-top: 4px;
    min-height: 20px;
}
.exam-report-signature-block .exam-report-signline {
    width: 100%;
    text-align: right;
}
.exam-report-signature {
    display: block;
    flex: 0 0 auto;
    width: auto;
    height: 17px;
    max-width: 75px;
    margin-top: 1px;
    margin-left: auto;
    object-fit: contain;
    object-position: right center;
    mix-blend-mode: multiply;
}

@media (max-width: 620px) {
    .account-signature-pad-wrap { height: 165px; }
    .account-signature-actions .btn { flex: 1 1 auto; }
    .account-signature-actions .btn-primary { margin-left: 0; flex-basis: 100%; }
    .exam-report-signature { height: 13px; max-width: 60px; }
}

@media print {
    .exam-report-signature-block {
        gap: 0;
        margin-top: 1mm;
        min-height: 5mm;
    }
    .exam-report-signature {
        height: 3.5mm;
        max-width: 17mm;
        margin-top: .2mm;
        margin-left: auto;
    }
}

/* 1.0.5 – hochauflösende Signatur mit frei einstellbarem Zuschnitt */
.account-signature-crop[hidden] { display: none !important; }
.account-signature-crop {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--page-bg, #f4f7fb) 62%, #fff);
}
.account-signature-crop-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.account-signature-crop-heading strong { display: block; }
.account-signature-crop-heading span {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: .85rem;
    line-height: 1.35;
}
.account-signature-crop-stage {
    position: relative;
    width: 100%;
    height: 190px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background:
        linear-gradient(45deg, rgba(11,45,77,.035) 25%, transparent 25%) 0 0/16px 16px,
        linear-gradient(-45deg, rgba(11,45,77,.035) 25%, transparent 25%) 0 8px/16px 16px,
        #fff;
    touch-action: none;
    user-select: none;
}
.account-signature-crop-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
}
.account-signature-crop-box {
    position: absolute;
    z-index: 2;
    min-width: 28px;
    min-height: 24px;
    border: 2px solid var(--accent, #2d7dd2);
    border-radius: 8px;
    background: rgba(45,125,210,.05);
    box-shadow: 0 0 0 9999px rgba(16,34,56,.18);
    cursor: move;
    touch-action: none;
}
.account-signature-crop-handle {
    position: absolute;
    width: 18px;
    height: 18px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: var(--accent, #2d7dd2);
    box-shadow: 0 1px 5px rgba(16,34,56,.24);
}
.account-signature-crop-handle.is-nw { left: -10px; top: -10px; cursor: nwse-resize; }
.account-signature-crop-handle.is-ne { right: -10px; top: -10px; cursor: nesw-resize; }
.account-signature-crop-handle.is-sw { left: -10px; bottom: -10px; cursor: nesw-resize; }
.account-signature-crop-handle.is-se { right: -10px; bottom: -10px; cursor: nwse-resize; }
.account-signature-crop-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 10px;
}

/* Direkt unter dem Datum, eng rechtsbündig. Der manuelle Zuschnitt sorgt dafür,
   dass die sichtbare Signatur den vorhandenen Platz vollständig ausnutzt. */
.exam-report-signature-block {
    gap: 0;
    margin-top: 1px;
    min-height: 18px;
}
.exam-report-signature {
    height: 19px;
    max-width: 88px;
    margin-top: -1px;
    margin-right: 0;
    margin-left: auto;
    object-position: right top;
}

@media (max-width: 620px) {
    .account-signature-crop-stage { height: 165px; }
    .account-signature-crop-actions .btn { flex: 1 1 auto; }
    .exam-report-signature { height: 16px; max-width: 74px; }
}

@media print {
    .exam-report-signature-block {
        margin-top: 0;
        min-height: 4.6mm;
    }
    .exam-report-signature {
        height: 4mm;
        max-width: 19mm;
        margin-top: -.2mm;
        margin-right: 0;
        margin-left: auto;
    }
}
/* 1.0.6 – Signatur im Seriendruck höher, 30 % größer und kräftiger */
.exam-report-signature-block {
    margin-top: 0;
    min-height: 0;
    align-items: flex-end;
}
.exam-report-signature-block .exam-report-signline {
    margin: 0 !important;
    padding: 0;
    line-height: 1.15;
}
.exam-report-signature {
    height: 25px;
    max-width: 114px;
    margin-top: -3px;
    margin-right: 0;
    margin-left: auto;
    object-position: right top;
    transform: translateY(-2px);
    filter: contrast(1.15) drop-shadow(0 0 .45px #102238) drop-shadow(0 0 .2px #102238);
}

@media (max-width: 620px) {
    .exam-report-signature {
        height: 21px;
        max-width: 96px;
        margin-top: -3px;
        transform: translateY(-2px);
    }
}

@media print {
    .exam-report-signature-block {
        margin-top: 0;
        min-height: 0;
    }
    .exam-report-signature-block .exam-report-signline {
        margin: 0 !important;
        line-height: 1.05;
    }
    .exam-report-signature {
        height: 5.2mm;
        max-width: 24.7mm;
        margin-top: -.8mm;
        transform: translateY(-1mm);
        filter: contrast(1.18) drop-shadow(0 0 .12mm #102238) drop-shadow(0 0 .06mm #102238);
    }
}


/* 1.0.7 – Signaturgröße und -position pro Benutzer administrierbar */
.account-signature-placement {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: color-mix(in srgb, var(--page-bg, #f4f7fb) 58%, #fff);
}
.account-signature-placement-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.account-signature-placement-head strong { display: block; }
.account-signature-placement-head span {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.4;
}
.account-signature-placement-preview {
    position: relative;
    min-height: 112px;
    overflow: visible;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}
.account-signature-placement-date {
    position: absolute;
    top: 18px;
    right: 18px;
    color: var(--ink);
    font-size: .88rem;
    line-height: 1.1;
    white-space: nowrap;
}
.account-signature-placement-image {
    position: absolute;
    z-index: 2;
    top: 40px;
    right: 18px;
    display: block;
    width: auto;
    height: 19px;
    max-width: 88px;
    object-fit: contain;
    object-position: right top;
    transform-origin: right top;
    transform: translate(var(--signature-x, 0mm), var(--signature-y, -1mm)) scale(var(--signature-scale, 1.3));
    filter: contrast(1.15) drop-shadow(0 0 .45px #102238) drop-shadow(0 0 .2px #102238);
    cursor: grab;
    touch-action: none;
    user-select: none;
    -webkit-user-drag: none;
}
.account-signature-placement-image:active { cursor: grabbing; }
.account-signature-placement-image[hidden] { display: none !important; }
.account-signature-placement-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}
.account-signature-placement-controls label {
    display: grid;
    gap: 7px;
    min-width: 0;
}
.account-signature-placement-controls label > span {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: var(--ink);
    font-weight: 700;
    font-size: .88rem;
}
.account-signature-placement-controls output {
    color: var(--muted);
    font-weight: 700;
    white-space: nowrap;
}
.account-signature-placement-controls input[type="range"] {
    width: 100%;
    accent-color: var(--accent, #2d7dd2);
}

/* Die gespeicherte Signatur bleibt im Zeichenfeld proportional und wird von
   JavaScript optisch mittig eingepasst. Sie wird dabei nicht neu gespeichert. */
.account-signature-pad { object-position: center; }

/* Basisgröße entspricht 1.0.5. Die persönlichen Werte werden über CSS-Variablen
   aus dem Konto gesetzt; 130 % / 0 mm / -1,0 mm entspricht der bisherigen 1.0.6-Darstellung. */
.exam-report-signature {
    height: 19px;
    max-width: 88px;
    margin-top: -1px;
    transform-origin: right top;
    transform: translate(var(--signature-x, 0mm), var(--signature-y, -1mm)) scale(var(--signature-scale, 1.3));
    filter: contrast(1.15) drop-shadow(0 0 .45px #102238) drop-shadow(0 0 .2px #102238);
}

@media (max-width: 620px) {
    .account-signature-placement-head { flex-direction: column; }
    .account-signature-placement-controls { grid-template-columns: 1fr; }
    .account-signature-placement-preview { min-height: 104px; }
    .account-signature-placement-date { top: 16px; right: 14px; font-size: .82rem; }
    .account-signature-placement-image { top: 38px; right: 14px; }
    .exam-report-signature { height: 16px; max-width: 74px; }
}

@media print {
    .exam-report-signature {
        height: 4mm;
        max-width: 19mm;
        margin-top: -.2mm;
        transform-origin: right top;
        transform: translate(var(--signature-x, 0mm), var(--signature-y, -1mm)) scale(var(--signature-scale, 1.3));
        filter: contrast(1.18) drop-shadow(0 0 .12mm #102238) drop-shadow(0 0 .06mm #102238);
    }
}

/* 1.1.0: Home-Assistant-SSO im Konto */
.account-panel .ha-sso-status {
    margin: 12px 0;
    padding: 12px 14px;
    border: 1px solid #d7e0ea;
    border-radius: 14px;
    background: #f7f9fc;
    line-height: 1.45;
}
.account-panel .ha-sso-status strong { display: block; margin-bottom: 3px; }
.account-panel .ha-sso-status.is-warning {
    border-color: #e7c98c;
    background: #fff9ec;
}
.account-panel .ha-sso-status + form { margin-top: 10px; }

/* 1.1.3: Freie Notizen pro Schüler und Leistungsnachweis */
.score-note-field {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}
.score-note-field > span {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    color: var(--text);
    font-size: .78rem;
    font-weight: 900;
}
.score-note-field > span small {
    color: var(--muted);
    font-size: .68rem;
    font-weight: 700;
}
.score-note-field textarea {
    width: 100%;
    min-height: 62px;
    max-height: 120px;
    resize: vertical;
    padding: 10px 11px;
    border: 1px solid #CBD5DF;
    border-radius: 12px;
    background: #F8FAFC;
    color: var(--text);
    font: inherit;
    font-size: .92rem;
    line-height: 1.35;
}
.score-note-field textarea:focus {
    outline: 2px solid color-mix(in srgb, var(--accent) 45%, transparent);
    outline-offset: 1px;
    border-color: var(--accent);
    background: #fff;
}
.score-note-field textarea:disabled { opacity: .55; }
.gradebook-score-cell { position: relative; }
.gradebook-score-note-mark {
    position: absolute;
    top: 2px;
    right: 3px;
    font-size: .58rem;
    line-height: 1;
    font-weight: 900;
    color: var(--accent);
    pointer-events: none;
}
.gradebook-score-cell.has-score .gradebook-score-note-mark {
    color: currentColor;
    opacity: .82;
}

@media (max-width: 720px) {
    .grades-view { padding-bottom: 430px; }
    .grades-view.score-pad-closed { padding-bottom: 0; }
    .score-note-field { margin-top: 7px; gap: 4px; }
    .score-note-field > span { font-size: .72rem; }
    .score-note-field > span small { font-size: .62rem; }
    .score-note-field textarea {
        min-height: 52px;
        max-height: 78px;
        resize: none;
        padding: 8px 9px;
        border-radius: 10px;
        font-size: .88rem;
    }
}

@media (max-width: 430px) {
    .grades-view { padding-bottom: 420px; }
    .grades-view.score-pad-closed { padding-bottom: 0; }
}


/* 1.1.6 – optionale Teilaufgaben-Bezeichnung und zweite Gliederungsebene */
.exam-subtask-card-head {
    flex-wrap: wrap;
}
.exam-subtask-actions {
    margin-left: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.exam-subtask-card.is-level-2 {
    width: calc(100% - 28px);
    margin-left: 28px;
    border-left: 4px solid color-mix(in srgb, var(--accent) 55%, var(--line));
    background: color-mix(in srgb, var(--accent) 3%, #F8FAFC);
}
.exam-subtask-card.is-level-2 .exam-subtask-card-head strong::before {
    content: "↳ ";
    color: var(--accent);
}
.exam-structure-subtask-badge-single {
    padding-inline: 10px;
}
.exam-structure-subtask-badge-single em {
    font-style: normal;
    font-weight: 850;
}
@media (max-width: 640px) {
    .exam-subtask-card.is-level-2 {
        width: calc(100% - 14px);
        margin-left: 14px;
    }
    .exam-subtask-card-head > div:first-child {
        min-width: 0;
        flex: 1 1 150px;
    }
    .exam-subtask-actions {
        flex: 1 1 100%;
        width: 100%;
    }
}

/* 1.1.8 – Nachschreiber und umschaltbare Punkteingabe */
.exam-mark-sheet-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}
.exam-correction-mode {
    display: inline-flex;
    padding: 2px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #F3F6F9;
}
.exam-correction-mode button {
    min-height: 30px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    padding: 5px 10px;
    font: inherit;
    font-size: .7rem;
    font-weight: 900;
}
.exam-correction-mode button.active {
    background: #fff;
    color: var(--primary);
    box-shadow: 0 1px 5px rgba(11,45,77,.12);
}
.exam-create-makeup:disabled { opacity: .48; cursor: default; }
.exam-makeup-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    border: 1px solid #D7E0E8;
    border-radius: 999px;
    background: #fff;
    color: #657789;
    padding: 3px 7px;
    font: inherit;
    font-size: .55rem;
    font-weight: 850;
    line-height: 1;
}
.exam-makeup-toggle.active {
    border-color: #E68A2E;
    background: #FFF1E3;
    color: #9A4D00;
}
.exam-mark-sheet tbody tr.is-makeup-required .exam-mark-sheet-student {
    box-shadow: inset 3px 0 0 #E68A2E;
}
.exam-mark-sheet-input {
    display: block;
    width: min(100%, 52px);
    min-width: 0;
    min-height: 36px;
    margin-inline: auto;
    border: 1px solid #CBD7E2;
    border-radius: 8px;
    background: rgba(255,255,255,.9);
    color: var(--primary);
    padding: 4px 3px;
    text-align: center;
    font: inherit;
    font-size: .78rem;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
}
.exam-mark-sheet-input.entered {
    border-color: color-mix(in srgb, var(--task-color, var(--accent)) 54%, #A8B8C6);
    background: #fff;
}
.exam-mark-sheet-score .exam-mark-sheet-input,
.exam-mark-sheet-score .exam-mark-sheet-input.entered {
    background: color-mix(in srgb, var(--task-color, #2D7DD2) 8%, #fff);
}
.exam-mark-sheet-input:focus {
    outline: 2px solid var(--accent);
    outline-offset: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent);
}
.exam-mark-sheet-input[aria-invalid="true"] {
    border-color: #C93434;
    background: #FFF1F1;
}

/* The global text-input rule adds roomy form padding, which is too large for
   the compact correction grid and clips decimal scores in narrow columns. */
.exam-mark-sheet.is-excel tbody td { padding-block: 3px; }
.exam-mark-sheet.is-excel input.exam-mark-sheet-input {
    width: 100%;
    min-height: 36px;
    padding: 2px 1px;
    line-height: 1;
}

@media (max-width: 900px) {
    .exam-mark-sheet-toolbar { align-items: flex-start; }
    .exam-mark-sheet-toolbar-actions { justify-content: flex-start; }
    .exam-makeup-toggle span { display: inline; }

    .exam-mark-sheet-wrap.is-excel {
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: #fff;
    }
    .exam-mark-sheet.is-excel { display: table; width: 100%; table-layout: fixed; font-size: .66rem; }
    .exam-mark-sheet.is-excel thead { display: table-header-group; }
    .exam-mark-sheet.is-excel tbody { display: table-row-group; }
    .exam-mark-sheet.is-excel tr { display: table-row; padding: 0; border: 0; border-radius: 0; box-shadow: none; }
    .exam-mark-sheet.is-excel tr > * { display: table-cell; border-radius: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 4px 2px !important; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-student { width: 132px; min-height: 0; background: #FBFCFD !important; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-student-index { display: none; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-student strong { font-size: .64rem; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-student small { font-size: .5rem; }
    .exam-mark-sheet.is-excel .exam-makeup-toggle { padding: 3px 5px; font-size: .5rem; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-score::before,
    .exam-mark-sheet.is-excel .exam-mark-sheet-total::before,
    .exam-mark-sheet.is-excel .exam-mark-sheet-grade::before { content: none; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-score,
    .exam-mark-sheet.is-excel .exam-mark-sheet-total,
    .exam-mark-sheet.is-excel .exam-mark-sheet-grade { background: initial; }
    .exam-mark-sheet.is-excel input.exam-mark-sheet-input { min-height: 34px; font-size: .72rem; }
}

@media (max-width: 560px) {
    .exam-mark-sheet-toolbar { display: grid; }
    .exam-mark-sheet-toolbar-actions { width: 100%; }
    .exam-create-makeup { flex: 1 1 auto; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-student { width: 104px; }
    .exam-mark-sheet.is-excel .exam-makeup-toggle span { display: none; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-requirement-summary { display: none; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-task-head strong { font-size: .62rem; }
    .exam-mark-sheet.is-excel .exam-mark-sheet-max-badge { min-width: 18px; padding-inline: 3px; font-size: .52rem; }
}

/* 1.1.9 – Korrekturtabelle mit fixierter Kopfzeile und separater Anwesenheit */
@media (min-width: 901px) {
    .exam-mark-sheet-wrap {
        max-height: min(72vh, 760px);
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
    }
    .exam-mark-sheet thead tr:first-child > th {
        position: sticky;
        top: 0;
        z-index: 12;
        height: 34px;
        min-height: 34px;
        box-shadow: 0 1px 0 var(--line);
    }
    .exam-mark-sheet thead tr:nth-child(2) > th {
        position: sticky;
        top: 34px;
        z-index: 11;
        box-shadow: 0 1px 0 var(--line);
    }
    .exam-mark-sheet thead tr:first-child > th[rowspan="2"] {
        z-index: 13;
    }
}

.exam-mark-sheet-student {
    vertical-align: middle;
}
.exam-mark-sheet-student > strong {
    display: block;
    font-size: .76rem;
    line-height: 1.12;
    overflow-wrap: anywhere;
}

/* Keep every entered task score readable on narrow screens; scroll the sheet instead. */
.exam-mark-sheet-wrap {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}
.exam-mark-sheet {
    min-width: max(100%, calc(var(--exam-task-count, 1) * 62px + 330px));
    table-layout: fixed;
}
.exam-mark-sheet-student-head,
.exam-mark-sheet-student { width: 210px; }
.exam-mark-sheet-total-head,
.exam-mark-sheet-total { width: 64px; }
.exam-mark-sheet-grade-head,
.exam-mark-sheet-grade { width: 76px; }
.exam-mark-sheet-task-head,
.exam-mark-sheet-score { width: 62px; }

@media (max-width: 900px) {
    .exam-mark-sheet-wrap {
        overflow-x: auto;
        overflow-y: visible;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: #fff;
    }
    .exam-mark-sheet {
        display: table;
        width: max-content;
        min-width: max(100%, calc(var(--exam-task-count, 1) * 62px + 330px));
        font-size: .78rem;
    }
    .exam-mark-sheet thead { display: table-header-group; }
    .exam-mark-sheet tbody { display: table-row-group; }
    .exam-mark-sheet tr { display: table-row; }
    .exam-mark-sheet tr > * {
        display: table-cell;
        border-radius: 0;
        border-right: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        padding: 5px 4px !important;
        background: #fff;
    }
    .exam-mark-sheet thead th { display: table-cell; }
    .exam-mark-sheet thead tr:first-child > th[rowspan="2"] { display: table-cell; }
    .exam-mark-sheet thead .exam-mark-sheet-student-head,
    .exam-mark-sheet-student {
        position: sticky;
        left: 0;
        z-index: 3;
        width: 210px;
        min-height: 0;
        background: #FBFCFD !important;
    }
    .exam-mark-sheet thead .exam-mark-sheet-student-head { z-index: 5; }
    .exam-mark-sheet tbody tr > .exam-mark-sheet-score,
    .exam-mark-sheet tbody tr > .exam-mark-sheet-total,
    .exam-mark-sheet tbody tr > .exam-mark-sheet-grade {
        display: table-cell;
        background: #fff;
        vertical-align: middle;
    }
    .exam-mark-sheet-score::before,
    .exam-mark-sheet-total::before,
    .exam-mark-sheet-grade::before { content: none; }
    .exam-mark-sheet-cell { width: min(100%, 46px); min-height: 38px; }
    .exam-mark-sheet-cell small { display: none; }
}

.exam-attendance-panel {
    display: grid;
    gap: 12px;
}
.exam-attendance-head,
.exam-attendance-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}
.exam-attendance-head > div:first-child {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.exam-attendance-head strong {
    color: var(--text);
    font-size: .95rem;
}
.exam-attendance-head > div:first-child > span,
.exam-attendance-footer > span {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 650;
    line-height: 1.35;
}
.exam-attendance-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}
.exam-attendance-summary span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 900;
    white-space: nowrap;
}
.exam-attendance-summary .present {
    background: #E7F7ED;
    color: #187544;
}
.exam-attendance-summary .absent {
    background: #FFF0E4;
    color: #9A4D00;
}
.exam-attendance-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 8px;
}
.exam-attendance-student {
    width: 100%;
    min-width: 0;
    min-height: 62px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    color: var(--text);
    text-align: left;
    font: inherit;
}
.exam-attendance-student.is-absent {
    border-color: #E8AD74;
    background: #FFF8F1;
    box-shadow: inset 3px 0 0 #E68A2E;
}
.exam-attendance-state {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #E7F7ED;
    color: #187544;
    font-size: .88rem;
    font-weight: 950;
}
.exam-attendance-student.is-absent .exam-attendance-state {
    background: #FFE7D0;
    color: #A44D00;
}
.exam-attendance-name {
    min-width: 0;
    display: grid;
    gap: 2px;
}
.exam-attendance-name strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .82rem;
}
.exam-attendance-name small {
    color: var(--muted);
    font-size: .68rem;
    font-weight: 750;
}
.exam-attendance-student.is-absent .exam-attendance-name small {
    color: #9A4D00;
}
.exam-attendance-action {
    color: var(--muted);
    font-size: .63rem;
    font-weight: 800;
    white-space: nowrap;
}
.exam-attendance-student:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 25%, transparent);
    outline-offset: 2px;
}
.exam-attendance-footer .exam-create-makeup {
    flex: 0 0 auto;
}

@media (max-width: 700px) {
    .exam-attendance-head,
    .exam-attendance-footer {
        display: grid;
        align-items: stretch;
    }
    .exam-attendance-summary {
        justify-content: flex-start;
    }
    .exam-attendance-list {
        grid-template-columns: 1fr;
    }
    .exam-attendance-action {
        display: none;
    }
    .exam-attendance-student {
        grid-template-columns: 36px minmax(0, 1fr);
    }
    .exam-attendance-footer .exam-create-makeup {
        width: 100%;
    }
}

/* 1.1.11 – Abwesende Schüler in der Korrekturtabelle sperren */
.exam-mark-sheet tbody tr.is-absent > * {
    background: #F2F4F6 !important;
    color: #8A96A3 !important;
}
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-student strong,
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-total strong,
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-grade strong {
    color: #7D8995 !important;
}
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-cell,
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-input {
    background: #E9EDF1 !important;
    border-color: #D5DCE3 !important;
    color: #8A96A3 !important;
    box-shadow: none !important;
    cursor: not-allowed;
}
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-cell.entered,
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-input.entered {
    background: #E2E7EB !important;
    border-color: #CDD5DC !important;
    color: #7B8793 !important;
}
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-cell:disabled,
.exam-mark-sheet tbody tr.is-absent .exam-mark-sheet-input:disabled {
    opacity: 1;
    pointer-events: none;
    -webkit-text-fill-color: #8A96A3;
}

/* Klausurergebnisse mit Teil- und Aufgabenprozentspalten */
.exam-results-scroll { overflow-x: auto; }
.exam-results-table { width: max-content; min-width: 100%; max-width: none; table-layout: auto; }
.exam-results-table th:first-child,
.exam-results-table td:first-child { position: sticky; left: 0; min-width: 160px; width: auto; background: #fff; z-index: 1; }
.exam-results-table th:first-child { background: #F5F7FA; z-index: 3; }

/* Auf Smartphones brauchen die Notenspalten genug Platz für Datum und Note.
   Die Tabelle bleibt dabei innerhalb ihres eigenen horizontalen Scrollbereichs. */
@media (max-width: 720px) {
    .gradebook-table-scroll {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }
    .gradebook-overview-table {
        width: calc(150px + 60px * var(--grade-data-columns, 1));
        min-width: 100%;
        max-width: none;
        table-layout: fixed;
    }
    .gradebook-overview-table col.gradebook-student-col {
        width: 150px !important;
    }
    .gradebook-overview-table col.gradebook-data-col {
        width: 60px !important;
    }
    .gradebook-overview-table th:not(:first-child),
    .gradebook-overview-table td:not(:first-child) {
        min-width: 60px !important;
        width: 60px !important;
        max-width: 60px !important;
    }
    .gradebook-overview-table .gradebook-assessment-head small {
        white-space: nowrap;
    }
    .gradebook-overview-table .gradebook-score-cell {
        width: 32px;
        max-width: 32px;
        height: 30px;
        min-height: 30px;
        font-size: .7rem;
    }
    .gradebook-overview-table .gradebook-assessment-label .assessment-label-badge {
        min-height: 15px;
        padding: 1px 4px;
        font-size: .48rem;
        line-height: 1;
    }
}

/* Final compact sizing for grade entry columns. */
.gradebook-table-scroll { overflow-x: auto; }
.gradebook-overview-table {
    width: calc(150px + 46px * var(--grade-data-columns, 1));
    min-width: 100%;
    max-width: none;
    table-layout: fixed;
}
.gradebook-overview-table col.gradebook-data-col,
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    padding: 2px 1px !important;
}
.gradebook-overview-table .gradebook-score-cell {
    width: 40px;
    max-width: 40px;
    min-width: 0;
    padding-inline: 1px;
}

/* Extra tight score cells: 3,5 fits with minimal horizontal padding. */
.gradebook-overview-table {
    width: calc(150px + 38px * var(--grade-data-columns, 1));
}
.gradebook-overview-table col.gradebook-data-col,
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    padding: 1px 0 !important;
}
.gradebook-overview-table .gradebook-score-cell {
    width: 36px;
    max-width: 36px;
    padding: 0;
    font-size: .78rem;
    letter-spacing: -.04em;
}

/* Preserve complete decimal grades while keeping the score boxes compact. */
.gradebook-overview-table {
    width: calc(150px + 44px * var(--grade-data-columns, 1));
}
.gradebook-overview-table col.gradebook-data-col,
.gradebook-overview-table th:not(:first-child),
.gradebook-overview-table td:not(:first-child) {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    padding: 1px 0 !important;
}
.gradebook-overview-table .gradebook-score-cell {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    padding: 0 !important;
    white-space: nowrap;
    overflow: visible;
    font-size: .72rem !important;
    letter-spacing: 0 !important;
}


/* 1.1.37 – Einheitliche Arial-Schrift im Bewertungsbogen; nur mathematische
   Formeln (MathJax/MathML) verwenden weiterhin eigene Formelschriften. */
.exam-report-sheet,
.exam-report-sheet :not(mjx-container):not(mjx-container *):not(math):not(math *) {
    font-family: Arial, Helvetica, sans-serif !important;
}