.experience { margin: 24px 0 32px; }
.experience h2 { margin: 0 0 12px; }
.mission { padding: 22px; background: var(--mint); border-radius: 16px; }
.mission h3 { margin: 12px 0; font-size: 21px; }
.mission p, .audio-panel p { line-height: 1.65; }
.mission-mark { color: var(--green); font-weight: 700; }
.tool-row, .order-bank { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 14px 0; }
.tool-row a { text-decoration: none; }
.tool-row label { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.order-bank .choice-button { background: white; }
.order-result li { margin: 8px 0; line-height: 1.5; }
.match-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: center; margin: 12px 0; }
.game-feedback { margin-top: 16px; line-height: 1.6; }
.game-board [aria-invalid="true"] { outline: 2px solid var(--red); }
select, .prompt-box textarea { min-width: 0; max-width: 100%; padding: 10px; border: 1px solid var(--line); background: white; color: var(--ink); border-radius: 8px; }
.prompt-box textarea { display: block; width: 100%; margin-top: 14px; font: inherit; }
.audio-panel { padding: 18px; margin: 18px 0; border: 1px solid var(--line); border-radius: 12px; }
summary { cursor: pointer; font-weight: 650; padding: 7px 0; }
.audit-ref, .scope-mini { font-size: 13px; line-height: 1.55; color: var(--muted); overflow-wrap: anywhere; }
.hero .scope-mini { margin-top: 16px; font-size: 13px; }
.source-strip a, .focus-item small, .source-table a { overflow-wrap: anywhere; }
.cycle-flow { display: grid; gap: 7px; max-width: 440px; margin: 24px auto; }
.cycle-node { display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--mint);padding:14px;border-radius:10px; }
.scope-note { margin-bottom: 22px; line-height: 1.6; }
.flux-display { max-width: 480px; margin: 22px auto; background: var(--mint); padding: 22px; border-radius: 15px; }
.concentration { height: 20px; background:#e1e7e3;margin:8px 0; }
.concentration > div { height:100%;background:var(--green);transition:width .2s; }
.membrane-label { border-top: 5px double var(--blue);margin-top:20px;padding-top:8px;text-align:center; }
.flux-arrow { font-size: 42px;text-align:center; }
button:disabled { cursor:default; opacity:.65; }
button:focus-visible, a:focus-visible, select:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline:3px solid var(--blue);outline-offset:3px; }
.flash-face { overflow: auto; }
@media(max-width:760px) { .match-row{grid-template-columns:1fr;gap:6px}.mission{padding:15px}.tool-row{align-items:stretch}.tool-row>*{max-width:100%}.lesson-actions{flex-wrap:wrap}.focus-item{grid-template-columns:auto minmax(0,1fr)}.focus-item>.chip{grid-column:2}.hero::after{pointer-events:none} }
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;}}
:root {
  --ink: #17312b;
  --muted: #66756f;
  --paper: #f4f7f4;
  --surface: #ffffff;
  --line: #dce5df;
  --green: #176b52;
  --green-2: #24906d;
  --mint: #e3f2eb;
  --lime: #dff05a;
  --amber: #f5b846;
  --amber-soft: #fff3d8;
  --blue: #3478c7;
  --blue-soft: #e7f0fb;
  --red: #b94c4c;
  --shadow: 0 10px 30px rgba(22, 55, 46, .08);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, select, input { font: inherit; }
button { color: inherit; }
a { color: var(--green); }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 248px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 24px 18px; background: #123e33; color: #eaf6f1; display: flex; flex-direction: column; z-index: 20; }
.brand { display: flex; gap: 12px; align-items: center; color: inherit; text-decoration: none; padding: 0 8px 26px; }
.brand-mark { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--lime); color: #17312b; font-family: Georgia, serif; font-size: 24px; font-weight: 700; }
.brand strong, .brand small { display: block; }.brand small { color: #a9c8bd; margin-top: 2px; }
nav { display: grid; gap: 5px; }
.nav-item { border: 0; background: transparent; color: #bed6cd; text-align: left; padding: 11px 13px; border-radius: 11px; cursor: pointer; display: flex; align-items: center; gap: 11px; }
.nav-item span { width: 20px; text-align: center; font-size: 18px; }
.nav-item:hover, .nav-item.active { color: white; background: rgba(255,255,255,.10); }
.side-progress { margin-top: auto; padding: 16px 8px 4px; }
.side-progress-label { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 8px; }
.progress-track { height: 8px; border-radius: 999px; background: rgba(255,255,255,.15); overflow: hidden; }
.progress-fill { height: 100%; width: 0; border-radius: inherit; background: var(--lime); transition: width .35s ease; }
.side-progress small { display: block; color: #a9c8bd; margin-top: 9px; line-height: 1.35; }
main { min-width: 0; }
.topbar { height: 76px; position: sticky; top: 0; z-index: 15; display: flex; align-items: center; gap: 16px; padding: 0 34px; background: rgba(244,247,244,.92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.breadcrumb { display: grid; gap: 2px; margin-right: auto; }.breadcrumb span { font-size: 12px; color: var(--muted); }.breadcrumb strong { font-size: 15px; }
.top-actions { display: flex; gap: 10px; }
.primary-button, .soft-button, .icon-button, .choice-button { border: 0; border-radius: 11px; padding: 10px 15px; cursor: pointer; font-weight: 650; }
.primary-button { background: var(--green); color: white; }.primary-button:hover { background: #105b44; }
.soft-button { background: var(--surface); border: 1px solid var(--line); }.soft-button[aria-pressed="true"] { background: var(--amber-soft); border-color: var(--amber); }
.icon-button { display: none; padding: 8px 10px; background: var(--surface); border: 1px solid var(--line); }
.view { display: none; padding: 30px 34px 54px; max-width: 1500px; margin: 0 auto; }.view.active { display: block; }
.hero { border-radius: 25px; padding: 34px; color: white; background: linear-gradient(130deg, #155e49, #1c8061); position: relative; overflow: hidden; box-shadow: var(--shadow); }
.hero::after { content: ""; position: absolute; width: 340px; height: 340px; right: -100px; bottom: -180px; border: 46px solid rgba(223,240,90,.16); border-radius: 50%; }
.campus-portal.course-mode { max-width: none; margin: 0; padding: 0; }
.course-mode .hero .eyebrow { color: var(--lime); }
.course-mode .brand strong { font-size: 1rem; overflow-wrap: anywhere; }
.course-mode .lesson-content { margin: 0; }
.course-mode .stats-grid { margin-top: 24px; }
.campus-home { max-width: 1240px; margin: auto; padding: 24px 34px 48px; }
.campus-home-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.campus-home-header .brand { padding:0; }.campus-home-header .brand small { color:var(--muted); }
.campus-subjects { grid-template-columns:repeat(2,minmax(0,1fr)); }
.campus-subjects .module-card { display:flex; flex-direction:column; gap:12px; cursor:default; }
.campus-subjects .module-card h3,.campus-subjects .module-card p { margin:0; }
.campus-subjects .primary-button { margin-top:auto; align-self:flex-start; }
.campus-update { margin-top:24px; }
.campus-home select,.campus-home input,.campus-home textarea { display:block; width:100%; padding:12px; margin:8px 0 18px; font:inherit; color:var(--ink); border:1px solid var(--line); border-radius:10px; background:white; }
.campus-drop { border:2px dashed var(--green); border-radius:16px; padding:20px; margin:18px 0; }
.file-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:10px 0; overflow-wrap:anywhere; }
.campus-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.sidebar .brand strong { overflow-wrap:anywhere; font-size:1rem; }
[hidden] { display:none!important; }
@media(max-width:760px){.campus-home{padding:20px 16px}.campus-subjects{grid-template-columns:1fr}.campus-home-header{align-items:flex-start;flex-direction:column}}
.lesson-roadmap { display:flex; flex-wrap:wrap; gap:8px; padding:18px 0; margin-bottom:12px; border-bottom:1px solid var(--line); }
.roadmap-step { border:1px solid var(--line); border-radius:22px; background:#f5f9f6; color:var(--green); padding:9px 13px; font-size:.875rem; cursor:pointer; text-align:left; }
.roadmap-step:hover { background:var(--mint); border-color:var(--green); }
.lesson-section { scroll-margin-top:95px; }
.lesson-section > p { max-width:74ch; line-height:1.8; }
.concept-compare { margin:24px 0; }.concept-compare h2 { font-size:1.2rem; }
.concept-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr)); gap:12px; }
.lesson-figure-small { max-width:440px; padding:12px; margin:18px auto; }
.inline-concept { margin:20px 0; padding:16px 18px; background:#f4f8f6; border:1px solid var(--line); border-radius:14px; }
.inline-concept figcaption { font-weight:700; font-size:.9375rem; margin-bottom:12px; }
.inline-concept > p { font-size:.875rem; line-height:1.6; color:var(--muted); margin:12px 0 0; }
.charge-balance,.coupled-process { list-style:none; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; padding:0; margin:0; }
.charge-balance li,.coupled-process li { text-align:center; padding:10px; }.charge-balance strong { font-size:1.6rem; color:var(--green); }
.charge-balance span,.coupled-process span { display:block; font-size:.875rem; line-height:1.7; }
.coupled-process li:not(.coupling) { background:white; border:1px solid var(--line); border-radius:10px; }
.coupling { color:var(--green); }
@media(max-width:600px){.coupled-process{flex-direction:column}.coupling span:first-child{font-size:0}.coupling span:first-child::after{content:'ATP + NADPH ↓';font-size:.875rem}.coupling span:last-child{font-size:0}.coupling span:last-child::after{content:'↑ ADP + Pᵢ + NADP⁺';font-size:.875rem}}
.mini-flow { list-style:none; display:flex; flex-wrap:wrap; align-items:stretch; gap:20px; padding:0; margin:0; }
.mini-flow li { flex:1 1 120px; position:relative; background:white; border:1px solid #c8dad0; border-radius:10px; padding:10px; font-size:.875rem; line-height:1.5; }
.mini-flow li:not(:last-child)::after { content:'→'; position:absolute; right:-18px; top:calc(50% - 12px); color:var(--green); }
@media(max-width:600px){.mini-flow{flex-direction:column;gap:18px}.mini-flow li{flex:auto}.mini-flow li:not(:last-child)::after{content:'↓';right:auto;left:50%;top:auto;bottom:-20px}}
.concept-card { padding:20px; border-radius:16px; background:var(--mint); border-top:4px solid var(--green); }
.concept-card:nth-child(2) { background:var(--blue-soft); border-color:var(--blue); }.concept-card h3 { margin:0 0 10px; }.concept-card p { margin:0; line-height:1.65; }
.lesson-figure { margin:24px 0; padding:20px; background:#f6f9fc; border:1px solid var(--line); border-radius:18px; }.lesson-figure svg { display:block; max-width:680px; width:100%; margin:auto; }.lesson-figure figcaption { font-size:.875rem; line-height:1.6; color:var(--muted); margin-top:12px; }
.label-bank { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0; }.label-bank [aria-pressed=true] { outline:3px solid var(--blue); }
.label-figure { position:relative; max-width:720px; margin:20px auto; }.label-figure svg { display:block; width:100%; }
.label-target { position:absolute; transform:translate(-50%,-50%); width:40px; height:40px; border:2px solid var(--ink); border-radius:50%; background:white; color:var(--ink); font-weight:750; cursor:pointer; }
.label-target:hover { background:var(--amber-soft); }.label-answers { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.label-answers label { display:grid; gap:7px; }
@media(max-width:760px){.concept-grid,.label-answers{grid-template-columns:1fr}.label-target{width:32px;height:32px}.lesson-roadmap{gap:6px}}
.update-chip { background:#fff0cc; color:#60430b; border:1px solid #d7b45a; white-space:normal; }
.available-count { padding:12px 16px; background:var(--mint); border-radius:10px; font-weight:650; color:var(--ink); }
.learning-guidance { margin:18px 0; padding:18px 20px; border-left:4px solid var(--blue); background:var(--blue-soft); border-radius:10px; color:var(--ink); line-height:1.65; }
.learning-guidance strong { display:block; margin-bottom:6px; }
.assessment-choice { display:flex; gap:12px; align-items:flex-start; line-height:1.5; }
.assessment-choice input { width:20px; height:20px; flex-shrink:0; accent-color:var(--green); }
[data-number] { display:block; padding:12px; margin-top:10px; border:1px solid var(--line); border-radius:10px; font:inherit; max-width:100%; }
.platform-notice { position: relative; z-index: 25; margin: 0; padding: 14px 24px; background: #fff4d6; color: #493b18; border-bottom: 1px solid #d6bd7b; font-size: .9375rem; line-height: 1.6; }
.eyebrow { text-transform: uppercase; letter-spacing: .1em; font-size: 11px; font-weight: 750; color: var(--lime); }
.campus-glossary { margin-top: 28px; padding: 22px; background: #f0f6f2; border: 1px solid #cadbd1; border-radius: 16px; color: #17312b; }
.campus-glossary dt { font-size: 1rem; font-weight: 750; margin-top: 18px; }
.campus-glossary dd { margin: 5px 0 0; font-size: 1rem; line-height: 1.65; }
/* Helle Campusflächen brauchen eigene Textfarben statt Sidebar-Vererbung. */
.campus-portal .eyebrow { color: #245747; font-size: .875rem; line-height: 1.5; letter-spacing: .08em; }
.sidebar .campus-tabs .soft-button { color: #17312b; background: #fff; border-color: #b5c9c0; font-size: 1rem; line-height: 1.45; text-align: left; }
.sidebar .campus-tabs .soft-button:hover { color: #17312b; background: #e4f1eb; border-color: #81a996; }
.sidebar .campus-tabs .soft-button:focus-visible { outline: 3px solid #d9ef77; outline-offset: 3px; }
.hero h1 { margin: 9px 0 10px; max-width: 760px; font: 500 clamp(28px, 4vw, 46px)/1.08 Georgia, serif; }.hero p { margin: 0; max-width: 690px; color: #d7ede5; line-height: 1.65; }
.hero-actions { margin-top: 23px; display: flex; gap: 10px; flex-wrap: wrap; }.hero .primary-button { background: var(--lime); color: #17312b; }.hero .soft-button { color: white; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.22); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 18px 0 28px; }
.stat-card, .panel, .module-card, .lesson-content, .exam-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 5px 18px rgba(22,55,46,.04); }
.stat-card { padding: 18px; }.stat-label { color: var(--muted); font-size: 12px; }.stat-value { margin: 6px 0 2px; font: 500 28px Georgia, serif; }.stat-sub { color: var(--muted); font-size: 12px; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 28px 0 14px; }.section-head h2 { margin: 0; font: 500 25px Georgia, serif; }.section-head p { margin: 4px 0 0; color: var(--muted); }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.module-card { padding: 20px; cursor: pointer; transition: transform .18s, box-shadow .18s; position: relative; overflow: hidden; }.module-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }.module-card.priority { border-top: 4px solid var(--amber); padding-top: 17px; }
.module-number { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--mint); color: var(--green); font-weight: 800; }.module-card.priority .module-number { background: var(--amber-soft); color: #7a4b00; }
.module-card h3 { margin: 16px 0 7px; font-size: 17px; }.module-card p { color: var(--muted); line-height: 1.5; font-size: 13px; min-height: 59px; }.meta-row, .chip-row { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.chip { display: inline-flex; gap: 5px; align-items: center; padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--mint); color: var(--green); }.chip.priority { background: var(--amber-soft); color: #7a4b00; }.chip.pdf { background: var(--blue-soft); color: #265f9d; }
.module-progress { margin-top: 16px; }.module-progress .progress-track { background: #edf1ee; height: 6px; }.module-progress .progress-fill { background: var(--green-2); }
.split-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; }.panel { padding: 21px; }.panel h3 { margin: 0 0 14px; font-size: 16px; }
.focus-list { display: grid; gap: 10px; }.focus-item { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }.focus-item:last-child { border-bottom: 0; }.focus-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--amber); }.focus-item small { color: var(--muted); }
.learn-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 18px; }.lesson-index { position: sticky; top: 96px; align-self: start; max-height: calc(100vh - 120px); overflow: auto; }.lesson-index .search { width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); margin-bottom: 10px; }.lesson-index-list { display: grid; gap: 5px; }.lesson-link { text-align: left; border: 0; background: transparent; padding: 10px 11px; border-radius: 10px; cursor: pointer; }.lesson-link small { display: block; color: var(--muted); margin-top: 3px; }.lesson-link.active { background: var(--mint); color: var(--green); }
.lesson-content { padding: clamp(20px, 4vw, 40px); }.lesson-content h1 { margin: 10px 0 12px; font: 500 clamp(28px,4vw,42px) Georgia, serif; }.lesson-lead { color: var(--muted); font-size: 16px; line-height: 1.7; max-width: 850px; }
.source-strip { margin: 22px 0; padding: 14px; border-radius: 12px; background: var(--blue-soft); }.source-strip strong { display: block; font-size: 12px; margin-bottom: 7px; }.source-strip a { margin-right: 12px; font-size: 12px; }
.lesson-section { margin: 30px 0; max-width: 920px; }.lesson-section h2 { font: 500 23px Georgia, serif; margin-bottom: 10px; }.lesson-section p, .lesson-section li { line-height: 1.72; }.lesson-section li { margin-bottom: 6px; }
.essential { padding: 18px 20px; border-left: 5px solid var(--amber); border-radius: 0 12px 12px 0; background: var(--amber-soft); margin: 22px 0; }.essential strong { display: block; margin-bottom: 6px; }.memory { padding: 16px 18px; border-radius: 12px; background: var(--mint); margin: 18px 0; }.compare { width: 100%; border-collapse: collapse; margin: 14px 0; }.compare th, .compare td { padding: 11px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }.compare th { color: var(--muted); font-size: 12px; }
.lesson-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--line); }
.visual-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }.visual-stage { background: var(--surface); border: 1px solid var(--line); border-radius: 22px; padding: 24px; min-height: 520px; }.visual-stage h2 { font: 500 26px Georgia, serif; margin: 0 0 6px; }.visual-stage > p { color: var(--muted); margin: 0 0 20px; }
.visual-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 22px; align-items: center; }.diagram { min-height: 390px; border-radius: 18px; background: linear-gradient(145deg, #eef7f2, #f7faf8); display: grid; place-items: center; padding: 18px; overflow: hidden; }.diagram svg { width: 100%; max-height: 430px; }.control-panel { display: grid; gap: 14px; }.control-panel label { font-size: 12px; font-weight: 700; }.control-panel input[type="range"] { width: 100%; accent-color: var(--green); }.result-box { padding: 16px; border-radius: 12px; background: var(--mint); }.result-box strong { display: block; margin-bottom: 5px; }
.organelle { cursor: pointer; transition: opacity .2s, transform .2s; transform-origin: center; }.organelle:hover, .organelle.selected { opacity: .72; transform: scale(1.02); }
.stepper { display: flex; gap: 7px; flex-wrap: wrap; }.step-button { border: 1px solid var(--line); background: white; padding: 8px 10px; border-radius: 9px; cursor: pointer; }.step-button.active { background: var(--green); color: white; border-color: var(--green); }
.flash-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; }.flashcard { min-height: 430px; perspective: 1000px; cursor: pointer; }.flash-inner { position: relative; width: 100%; min-height: 430px; transition: transform .55s; transform-style: preserve-3d; }.flashcard.flipped .flash-inner { transform: rotateY(180deg); }.flash-face { position: absolute; inset: 0; backface-visibility: hidden; border-radius: 22px; padding: clamp(28px, 6vw, 70px); background: var(--surface); border: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: var(--shadow); }.flash-face.back { transform: rotateY(180deg); background: #174f40; color: white; }.flash-face h2 { font: 500 clamp(25px,4vw,38px) Georgia, serif; }.flash-face p { line-height: 1.7; }.flash-hint { position: absolute; bottom: 22px; color: var(--muted); font-size: 12px; }.flash-face.back .flash-hint { color: #b9d6cc; }
.rating-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 12px; }.rating-row button { padding: 11px; border: 1px solid var(--line); background: white; border-radius: 10px; cursor: pointer; }.rating-row button:nth-child(1){color:var(--red)}.rating-row button:nth-child(3){color:var(--green)}
.quiz-shell { max-width: 860px; margin: 0 auto; }.quiz-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }.question-card { background: var(--surface); border: 1px solid var(--line); border-radius: 22px; padding: clamp(22px,4vw,38px); }.question-card h2 { font: 500 25px/1.35 Georgia, serif; }.answers { display: grid; gap: 10px; margin: 22px 0; }.choice-button { text-align: left; background: #f7f9f7; border: 1px solid var(--line); }.choice-button:hover { border-color: var(--green-2); }.choice-button.correct { background: var(--mint); border-color: var(--green-2); }.choice-button.wrong { background: #fae9e9; border-color: var(--red); }.feedback { display: none; padding: 15px; border-radius: 11px; background: var(--mint); line-height: 1.55; }.feedback.show { display: block; }
.exam-setup { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }.exam-card { padding: 22px; cursor: pointer; }.exam-card:hover { border-color: var(--green-2); }.exam-card h3 { margin-top: 0; }.exam-card p { color: var(--muted); line-height: 1.5; }.exam-running { max-width: 920px; margin: auto; }.exam-header { display: flex; gap: 15px; align-items: center; justify-content: space-between; margin-bottom: 16px; }.timer { font-size: 20px; font-variant-numeric: tabular-nums; font-weight: 750; }.exam-result { text-align: center; padding: 40px; }.score-ring { width: 150px; height: 150px; margin: 15px auto; border-radius: 50%; display: grid; place-items:center; background: conic-gradient(var(--green) var(--score), #e5ebe7 0); position: relative; }.score-ring::before { content:""; position:absolute; inset:14px; background:white; border-radius:50%; }.score-ring strong { position: relative; font: 500 34px Georgia,serif; }
.source-table-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }.source-table { width: 100%; border-collapse: collapse; min-width: 760px; }.source-table th,.source-table td { text-align:left; padding:14px; border-bottom:1px solid var(--line); vertical-align:top; }.source-table th { font-size:12px;color:var(--muted); }.source-table td { font-size:13px; }.source-table tr:last-child td { border-bottom:0; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 50; background: #17312b; color: white; padding: 12px 16px; border-radius: 11px; opacity: 0; transform: translateY(12px); pointer-events: none; transition: .25s; }.toast.show { opacity: 1; transform: translateY(0); }
.empty-state { text-align:center; color:var(--muted); padding:50px; }.muted { color: var(--muted); }.hidden { display:none!important; }
@media (max-width: 1050px){ .module-grid{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:repeat(2,1fr)}.learn-layout{grid-template-columns:230px 1fr}.visual-grid{grid-template-columns:1fr}.exam-setup{grid-template-columns:1fr}.flash-layout{grid-template-columns:1fr}.flash-sidebar{order:-1} }
@media (max-width: 760px){ .app-shell{display:block}.sidebar{position:fixed;left:-270px;width:248px;transition:left .25s}.sidebar.open{left:0}.topbar{padding:0 16px}.icon-button{display:block}.top-actions .soft-button{display:none}.view{padding:22px 16px 44px}.hero{padding:26px 22px}.module-grid,.stats-grid{grid-template-columns:1fr}.split-grid{grid-template-columns:1fr}.learn-layout{display:block}.lesson-index{position:static;max-height:none;margin-bottom:14px}.lesson-index-list{display:flex;overflow:auto}.lesson-link{min-width:190px}.visual-stage{padding:17px}.diagram{min-height:320px}.source-strip a{display:block;margin:6px 0}.top-actions .primary-button{padding:9px 11px}.breadcrumb span{display:none} }
/* Gemeinsame, kompakte Rückmeldung unter jeder Vorlesung. */
.lecture-feedback { margin-top:28px; border:1px solid #cbd9d2; border-radius:14px; background:#f5f8f6; color:#203b31; }
.lecture-feedback summary { cursor:pointer; padding:17px 20px; font-size:15px; font-weight:700; }
.lecture-feedback form { padding:0 20px 18px; display:grid; gap:14px; }
.lecture-feedback label { display:grid; gap:6px; font-size:14px; font-weight:600; }
.lecture-feedback select,.lecture-feedback textarea { box-sizing:border-box; width:100%; min-width:0; padding:11px; border:1px solid #9eb4a8; border-radius:8px; background:#fff; color:#203b31; font:inherit; font-size:16px; }
.lecture-feedback textarea { resize:vertical; }
.lecture-feedback .feedback-subject,.lecture-feedback .feedback-info,.lecture-feedback .feedback-status { margin:0; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
.feedback-actions { display:flex; flex-wrap:wrap; gap:10px; }
.lecture-feedback button:disabled { opacity:.55; cursor:not-allowed; }
.lecture-feedback :focus-visible { outline:3px solid #46775e; outline-offset:3px; }
.lecture-feedback [hidden] { display:none; }
.account-panel { margin:16px auto; width:calc(100% - 32px); max-width:1100px; box-sizing:border-box; }
.account-panel > button { margin:6px 8px 0 0; }
.account-form { max-width:520px; display:grid; gap:16px; }
.account-panel label,.account-dialog label { display:grid; gap:8px; font-size:16px; }
.account-panel input,.account-panel select,.account-dialog input { box-sizing:border-box; padding:12px; max-width:100%; font:inherit; border:1px solid #94aa9d; border-radius:8px; background:white; color:#203b31; }
.account-panel [hidden],.account-dialog [hidden] { display:none; }
.account-dialog { max-width:540px; width:calc(100% - 48px); border:1px solid #94aa9d; border-radius:16px; padding:24px; color:#203b31; }
.account-dialog form { display:grid; gap:16px; }
.account-dialog::backdrop { background:rgb(0 0 0 / .5); }
.account-panel button:disabled { opacity:.55; cursor:not-allowed; }
.account-settings { display:inline-block; margin:8px 0 0 12px; vertical-align:top; font-size:14px; }
.account-settings summary { cursor:pointer; color:#40594d; padding:8px 0; }
.account-settings button { display:block; margin-top:8px; }
.learning-stats { margin:0 0 20px; padding:16px 20px; border:1px solid #d3dfd8; border-radius:14px; background:#fff; }
.learning-stats dl { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:0; }
.learning-stats dt,.learning-stats small { font-size:14px; line-height:1.4; color:#4a6255; }
.learning-stats dd { margin:6px 0 2px; font-size:24px; font-weight:700; color:#203b31; }
.learning-stats small { display:block; }
@media(max-width:760px){.learning-stats dl{grid-template-columns:repeat(2,minmax(0,1fr));}.learning-stats{padding:14px;}}
.learning-stats { display:flex; align-items:center; gap:18px; }
.learning-stats dl { flex:1; min-width:0; }
.stats-reset { flex-shrink:0; padding:8px 10px; border:1px solid #cbd9d2; border-radius:8px; background:transparent; color:#40594d; font:inherit; font-size:14px; cursor:pointer; }
.stats-reset:hover { background:#edf3ef; }
.stats-reset:focus-visible { outline:3px solid #46775e; outline-offset:3px; }
@media(max-width:760px){.learning-stats{flex-wrap:wrap;}.learning-stats dl{flex-basis:100%;}.stats-reset{margin-left:auto;}}
.upload-rights { display:flex!important; align-items:flex-start; gap:10px; margin:18px 0; font-size:16px; line-height:1.5; }
.upload-rights input { width:auto!important; margin-top:5px; flex-shrink:0; }
/* Fachbegriffe bleiben im Lesefluss; Popup wird außerhalb des Artikels platziert. */
.term-help{display:inline!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:inherit!important;font:inherit!important;line-height:inherit!important;text-align:inherit;cursor:help;text-decoration:underline dotted #38795f;text-underline-offset:.2em;box-shadow:none!important}
.term-help:hover,.term-help:focus-visible{color:#16543e!important;text-decoration-style:solid}
.term-help:focus-visible{outline:2px solid #287657;outline-offset:3px}
.term-help-popup{position:fixed;z-index:10000;box-sizing:border-box;width:320px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;padding:16px 40px 14px 16px;border:1px solid #9bb5a8;border-radius:12px;background:#fff;color:#18372c;box-shadow:0 8px 28px #102a2433;font-size:1rem;line-height:1.5}
.term-help-popup p{margin:8px 0 0}
.term-help-close{position:absolute;right:5px;top:5px;width:32px;height:32px;padding:0;border:0;border-radius:6px;background:#edf3ef;color:#18372c;font-size:24px;cursor:pointer}
.review-wrong{border:1px solid #cf6666!important;border-left:5px solid #b42323!important;background:#fff1f1!important}
.review-wrong>summary{color:#8c1818;font-weight:700}
.review-unanswered{border-left:5px solid #9a6b13!important;background:#fff9ec!important}
.review-unanswered>summary{color:#70500d}
.module-status,.lesson-link .module-status{display:inline-block;margin:7px 0;padding:6px 11px;border:1px solid #c3cbd2;border-radius:7px;background:#f1f3f5;color:#48525d;font-size:.875rem;font-weight:800;line-height:1.4}
.module-status[data-status-kind='learned'],.lesson-link .module-status[data-status-kind='learned']{background:#17643c;color:#fff;border-color:#17643c}
.module-status[data-status-kind='viewed'],.lesson-link .module-status[data-status-kind='viewed']{background:#185ca4;color:#fff;border-color:#185ca4}
.module-card:has([data-status-kind='learned']),.lesson-link:has([data-status-kind='learned']){border-left:5px solid #17643c;background-color:#edf7ef}
.module-card:has([data-status-kind='viewed']),.lesson-link:has([data-status-kind='viewed']){border-left:5px solid #185ca4;background-color:#edf4fc}
.lesson-link.active{outline:2px solid #263c32;outline-offset:-2px}
option[data-status-kind='learned']{color:#14532d;font-weight:700}
option[data-status-kind='viewed']{color:#174c86;font-weight:700}
.source-unreleased{display:inline-block;padding:5px 0;overflow-wrap:anywhere}.source-unreleased small{color:#59665f}.upload-rights{display:flex;align-items:flex-start;gap:10px;margin:16px 0;font-size:.95rem;line-height:1.5}.upload-rights input{flex:0 0 auto;margin-top:5px}