/* The private login reuses this stylesheet; its existing light layout stays intact. */
:root{color-scheme:light;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#213b30;background:#fff9f0}
*{box-sizing:border-box}body{margin:0}main{max-width:780px;margin:auto;padding:48px 24px 64px}header{margin-bottom:32px}.brand{color:#28794f;font-weight:800;letter-spacing:.12em;font-size:.75rem}h1{font-size:clamp(1.85rem,6vw,2.8rem);line-height:1.15;margin:16px 0}header>p:last-child{color:#526458;line-height:1.6}

html[data-theme="dark"]{color-scheme:dark;background:#111418;color:#f0f2ee}
.audio-page{
  --bg:#111418;--bg-card:#1a1f24;--brand:#3cb878;--brand-dark:#52d490;
  --text:#f0f2ee;--text-mid:#c8ccc4;--text-muted:#909890;
  --border:rgba(255,255,255,.08);--border-strong:rgba(255,255,255,.14);
  background:var(--bg);color:var(--text);min-height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;
}
.audio-page main{max-width:2100px;padding:32px 32px 64px}
.audio-page header{margin-bottom:30px}
.audio-page .brand{color:var(--brand);font-size:.7rem;letter-spacing:.1em;margin:0}
.audio-page h1{font-size:1.65rem;font-weight:600;margin:6px 0}
.audio-page header>p:last-child{color:var(--text-muted);font-size:.85rem;margin:0}
#status{color:var(--text-muted);font-size:.85rem}
#status:empty{display:none}
.month{margin-bottom:2rem}
.month-heading{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);padding:0 0 .6rem;border-bottom:1px solid var(--border);margin:0 0 .25rem}
.month-rows{list-style:none;margin:0;padding:0}
.lesson-row{display:flex;align-items:center;gap:1rem;position:relative;min-height:56px;margin:1px 0;padding:.65rem .75rem .65rem 1rem;border-bottom:1px solid var(--border);border-radius:0 6px 6px 0}
.lesson-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:0 2px 2px 0;background:#8b4513}
.lesson-row[data-subject="waffen"]::before{background:#2e5278}
.lesson-row[data-subject="jagdrecht"]::before{background:#7a2828}
.lesson-row[data-subject="jagdbetrieb"]::before{background:#6b3d20}
.lesson-row[data-subject="tierarten"]::before{background:#2a6040}
.lesson-row[data-subject="behandlung"]::before{background:#8a4520}
.lesson-row[data-subject="tierschutz"]::before{background:#22606e}
.lesson-row[data-subject="pruefung"]::before{background:#4a3070}
.lesson-left{flex:1;min-width:0;display:flex;align-items:center;gap:1rem}
.date{display:flex;flex-direction:column;align-items:flex-end;flex:0 0 54px;font-variant-numeric:tabular-nums;line-height:1.7}
.day{font-size:.65rem;font-weight:600;color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase}
.day-number{font-size:.85rem;font-weight:700;color:var(--text-mid)}
.lesson-number{font-size:.68rem;font-weight:700;color:var(--text-muted);font-family:"SF Mono",Consolas,monospace;flex:0 0 28px;text-align:right;opacity:.7}
.lesson-theme{flex:1;min-width:0}
.lesson-title{font-size:.88rem;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3;margin:0}
.lesson-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.lesson-tag{font-size:.62rem;padding:1px 6px;border-radius:10px;background:rgba(128,128,128,.1);color:var(--text-muted);font-weight:500;line-height:1.7}
.lesson-audios{flex:0 0 360px;display:flex;flex-direction:column;gap:4px;justify-content:center;align-self:stretch;min-width:0}
.pending{color:var(--text-muted);font-size:.72rem;padding:0 .75rem}
.lesson-right{flex:1;min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:.75rem}
.audio-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 2px rgba(58,170,112,.2);flex-shrink:0}
.instructor{font-size:.72rem;color:var(--text-muted);text-align:right;min-width:80px;overflow-wrap:anywhere}
.player{display:flex;align-items:center;gap:.55rem;padding:.5rem .75rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;min-height:44px;min-width:0}
.player audio{display:none}
.player-play{position:relative;width:26px;height:26px;flex-shrink:0;padding:0;border:0;border-radius:50%;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.player-play::before{content:"";position:absolute;inset:-9px}
.player-play:hover{background:var(--brand-dark)}
.player-play svg{width:13px;height:13px;pointer-events:none}
.player-skip{flex:0 0 27px;width:27px;height:27px;padding:0;border:1px solid var(--border-strong);border-radius:6px;background:rgba(255,255,255,.04);color:var(--text-mid);font-family:inherit;font-size:.64rem;font-weight:600;line-height:1;cursor:pointer;white-space:nowrap}
.player-skip:hover:not(:disabled){border-color:var(--brand);color:var(--text)}
.player-skip:disabled{opacity:.42;cursor:default}
.player-seek{flex:1;position:relative;min-width:40px;height:24px;display:flex;align-items:center}
.player-seek progress{width:100%;height:4px;border:0;border-radius:2px;appearance:none;background:var(--border-strong);color:var(--brand);pointer-events:none}
.player-seek progress::-webkit-progress-bar{background:var(--border-strong);border-radius:2px}
.player-seek progress::-webkit-progress-value{background:var(--brand);border-radius:2px}
.player-seek progress::-moz-progress-bar{background:var(--brand);border-radius:2px}
.player-seek input{position:absolute;inset:0;width:100%;height:24px;margin:0;background:transparent;appearance:none;cursor:pointer;touch-action:pan-y}
.player-seek input::-webkit-slider-runnable-track{height:4px;background:transparent}
.player-seek input::-moz-range-track{height:4px;background:transparent}
.player-seek input::-webkit-slider-thumb{appearance:none;width:9px;height:9px;margin-top:-2.5px;border:0;border-radius:50%;background:var(--brand-dark);opacity:0}
.player-seek input::-moz-range-thumb{width:9px;height:9px;border:0;border-radius:50%;background:var(--brand-dark);opacity:0}
.player-seek input:hover::-webkit-slider-thumb,.player-seek input:focus-visible::-webkit-slider-thumb{opacity:1}
.player-seek input:hover::-moz-range-thumb,.player-seek input:focus-visible::-moz-range-thumb{opacity:1}
.player-play:focus-visible,.player-skip:focus-visible,.player-seek input:focus-visible{outline:2px solid var(--brand-dark);outline-offset:4px;border-radius:4px}
.player-time{font-size:.65rem;color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;min-width:28px;text-align:right}
.audio-error{color:#dca782;font-size:.72rem;line-height:1.5;margin:0 0 0 .75rem}
@media(max-width:1100px){.lesson-title{white-space:normal;overflow-wrap:anywhere}.lesson-audios{flex-basis:300px}.lesson-left{gap:.65rem}.lesson-number{flex-basis:20px}.lesson-right{flex:0 0 120px}}
@media(max-width:800px){
  .audio-page main{padding:24px 20px 48px}
  .lesson-row{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:.5rem .75rem;padding:.7rem .5rem .8rem .85rem}
  .lesson-left{grid-column:1;grid-row:1}.lesson-right{grid-column:2;grid-row:1}
  .lesson-audios{grid-column:1/-1;grid-row:2;margin-left:70px}
  .lesson-tags{display:none}.instructor{min-width:0;font-size:.7rem}
  .pending{padding:0;font-size:.72rem}.player-play{width:32px;height:32px}.player-play::before{inset:-6px}
  .player-play svg{width:15px;height:15px}.player{padding:.5rem .6rem;min-height:44px}
  .player-seek{height:32px}.player-seek input{height:44px;top:-6px}.player-time{font-size:.7rem}
}
@media(max-width:480px){
  .audio-page main{padding:22px 16px 40px}.audio-page h1{font-size:1.4rem}
  .lesson-row{grid-template-columns:minmax(0,1fr) 72px;gap:.45rem .5rem;padding-left:.75rem}
  .lesson-left{gap:.55rem}.date{flex-basis:40px}.lesson-number{display:none}
  .lesson-title{font-size:.82rem}.instructor{font-size:.65rem}.lesson-right{gap:.4rem}
  .lesson-audios{margin-left:49px}.audio-dot{width:6px;height:6px}
  .player{display:grid;grid-template-columns:32px 30px 30px minmax(0,1fr);gap:.25rem .45rem}
  .player-play{grid-column:1;grid-row:1}.player-skip-back{grid-column:2;grid-row:1}.player-skip-forward{grid-column:3;grid-row:1}
  .player-skip{width:30px;height:30px}.player-time{grid-column:4;grid-row:1;justify-self:end}
  .player-seek{grid-column:1/-1;grid-row:2;width:100%;min-width:0}
}

@media(max-width:480px){body:not(.audio-page) main{padding:28px 16px 40px}body:not(.audio-page) header{margin-bottom:24px}}
