/* ============================================================
   Design-Token
   Erscheinungsbild der Segeberger Kliniken: Magenta als Leitfarbe,
   warmes Grau als Textfarbe, weiße Karten auf hellgrauem Grund,
   leichte Überschriften, Schaltflächen mit 10 px Radius.
   Schrift Roboto, selbst gehostet und mitgeliefert.

   Die Werte sind als eigene Tokens nachgebaut, nicht aus fremdem
   Quelltext übernommen. Ein Wechsel des Erscheinungsbildes betrifft
   nur diesen Block.
   ============================================================ */
:root{
  --paper:#F2F2F2;
  --surface:#FFFFFF;
  --ink:#333333;
  --ink-2:#4F4F4F;
  --ink-3:#757575;
  --line:#D0D0D0;
  --line-soft:#E6E6E6;
  --brand:#B80E80;
  --brand-deep:#800D5B;
  --brand-soft:#F2DCEA;
  --brand-softer:#FBF2F7;
  --accent:#FF0092;
  --amber:#8A5A00;
  --amber-deep:#6E4800;
  --amber-soft:#FBF0DA;
  --crit:#A4161A;
  --crit-deep:#7F1113;
  --crit-soft:#F9E8E8;
  --radius:10px;
  --radius-s:8px;
  --font-body:'Roboto',Helvetica,Arial,system-ui,'Segoe UI',sans-serif;
  --font-display:'Roboto',Helvetica,Arial,system-ui,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,'Cascadia Mono','Segoe UI Mono',Menlo,Consolas,monospace;
  --shadow:0 1px 2px rgba(51,51,51,.05),0 10px 28px rgba(51,51,51,.08);
  --shadow-s:0 1px 2px rgba(51,51,51,.07);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink-2);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.6;
}
::selection{background:var(--brand-soft)}
h1,h2,h3{font-family:var(--font-display);font-weight:400;line-height:1.2;margin:0 0 .6rem;color:var(--brand-deep)}
h1{font-size:2rem;color:var(--brand)}
h2{font-size:1.5rem}
h3{font-size:1.2rem}
p{margin:.35rem 0 .8rem}
a{color:var(--brand);text-underline-offset:2px}
a:hover{color:var(--brand-deep)}
button{font-family:inherit}
.mono{font-family:var(--font-mono)}
.small{font-size:.86rem;color:var(--ink-2)}
.tiny{font-size:.78rem;color:var(--ink-3)}
.hidden{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Grundlayout ---------- */
.wrap{max-width:780px;margin:0 auto;padding:0 20px 72px}
.wrap-wide{max-width:1120px;margin:0 auto;padding:0 20px 72px}
.topbar{
  position:sticky;top:0;z-index:40;
  background:rgba(242,242,242,.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.topbar-in{
  max-width:1120px;margin:0 auto;padding:10px 20px;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  background:linear-gradient(150deg,var(--brand) 0%,var(--brand-deep) 100%);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.02em;
}
.brand-name{font-family:var(--font-display);font-weight:500;font-size:1rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar-spacer{flex:1}
.progress-box{display:flex;flex-direction:column;gap:4px;min-width:170px}
.progress-label{font-size:.78rem;color:var(--ink-2)}
.progress-track{height:5px;background:var(--line-soft);border-radius:99px;overflow:hidden}
.progress-fill{height:100%;background:var(--brand);border-radius:99px;transition:width .35s ease}
.timer{
  font-family:var(--font-mono);font-size:.95rem;font-weight:500;
  padding:6px 12px;border-radius:9px;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);white-space:nowrap;
}
.timer.warn{background:var(--amber-soft);border-color:#EAD6AC;color:var(--amber-deep)}
.timer.crit{background:var(--crit-soft);border-color:#EFC5C0;color:var(--crit-deep)}

/* ---------- Karten & Chips ---------- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-s);
  padding:26px 28px;
  margin:18px 0;
}
.card.elevated{box-shadow:var(--shadow)}
.chip{
  display:inline-flex;align-items:center;gap:6px;
  font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--brand-deep);background:var(--brand-softer);
  border:1px solid var(--brand-soft);
  border-radius:99px;padding:3px 11px;
}
.chip.neutral{color:var(--ink-2);background:var(--line-soft);border-color:var(--line)}
.chip.amber{color:var(--amber-deep);background:var(--amber-soft);border-color:#EAD6AC}
.chip.crit{color:var(--crit-deep);background:var(--crit-soft);border-color:#EFC5C0}
.chip-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border-radius:var(--radius);border:1px solid transparent;
  font-size:.95rem;font-weight:600;
  padding:11px 22px;cursor:pointer;
  transition:background .15s ease,border-color .15s ease,transform .05s ease;
  text-decoration:none;
}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover:not(:disabled){background:var(--brand-deep)}
.btn-ghost{background:transparent;color:var(--ink-2);border-color:var(--line)}
.btn-ghost:hover:not(:disabled){border-color:var(--ink-3);color:var(--ink)}
.btn-quiet{background:transparent;color:var(--ink-3);border:none;padding:8px 10px;font-weight:500;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:.88rem}
.btn-quiet:hover{color:var(--ink)}
.btn-danger{background:transparent;color:var(--crit-deep);border-color:#EFC5C0}
.btn-danger:hover{background:var(--crit-soft)}
.btn-sm{padding:7px 14px;font-size:.85rem;border-radius:9px}
:is(button,a,input,textarea,select,label.option):focus-visible{
  outline:2px solid var(--brand);outline-offset:2px;border-radius:6px;
}

/* ---------- Formulare ---------- */
.field{margin:0 0 14px}
.field label{display:block;font-size:.85rem;font-weight:600;color:var(--ink-2);margin-bottom:5px}
.field input[type=text],.field input[type=email],.field input[type=password],.field select,.field textarea{
  width:100%;border:1px solid var(--line);border-radius:9px;
  padding:10px 12px;font-size:.95rem;font-family:inherit;color:var(--ink);
  background:var(--surface);
}
.field textarea{min-height:150px;resize:vertical;line-height:1.6}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--brand);outline:none;box-shadow:0 0 0 3px var(--brand-soft)}
.check{display:flex;gap:10px;align-items:flex-start;margin:16px 0}
.check input{margin-top:4px;accent-color:var(--brand);width:17px;height:17px;flex:0 0 auto}

/* ---------- Aufgaben ---------- */
.stem{font-size:1.02rem;margin:0 0 6px}
.question-line{font-family:var(--font-display);font-weight:500;font-size:1.14rem;color:var(--ink);margin:14px 0 16px}
.baseline-note{font-size:.83rem;color:var(--ink-3);margin:-6px 0 14px}
.options{display:flex;flex-direction:column;gap:10px;margin:0}
label.option{
  position:relative;
  display:flex;gap:14px;align-items:flex-start;
  border:1.5px solid var(--line);border-radius:12px;
  padding:13px 16px;cursor:pointer;background:var(--surface);
  transition:border-color .12s ease,background .12s ease;
}
label.option:hover{border-color:var(--ink-3)}
label.option:focus-within{outline:2px solid var(--brand);outline-offset:2px}
label.option.selected{border-color:var(--brand);background:var(--brand-softer)}
label.option .key{
  font-family:var(--font-mono);font-size:.8rem;font-weight:600;
  width:26px;height:26px;flex:0 0 auto;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  background:var(--line-soft);color:var(--ink-2);margin-top:1px;
}
label.option.selected .key{background:var(--brand);color:#fff}
label.option .opt-text{flex:1;font-size:.96rem}
label.option input{position:absolute;opacity:0;pointer-events:none}
.task-footer{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin-top:22px;padding-top:18px;border-top:1px solid var(--line-soft);
}
.lock-hint{display:flex;align-items:center;gap:7px;font-size:.8rem;color:var(--ink-3);flex:1;min-width:220px}
.wordcount{font-family:var(--font-mono);font-size:.82rem;color:var(--ink-3)}
.wordcount.over{color:var(--crit-deep);font-weight:600}

/* ---------- Fallverlauf (Signatur-Element) ----------
   Progressive Fallinformationen erscheinen wie Einträge einer
   Patientenakte an einer vertikalen Petrol-Leiste. */
.casefile{margin:4px 0 20px;padding:0}
.casefile-title{
  font-size:.75rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:10px;
}
.cf-entry{
  position:relative;padding:2px 0 14px 22px;
  border-left:3px solid var(--brand-soft);
  margin-left:5px;
}
.cf-entry:last-child{padding-bottom:2px}
.cf-entry::before{
  content:"";position:absolute;left:-7.5px;top:7px;
  width:12px;height:12px;border-radius:50%;
  background:var(--surface);border:3px solid var(--brand-soft);
}
.cf-entry.new{border-left-color:var(--brand)}
.cf-entry.new::before{border-color:var(--brand);background:var(--brand)}
.cf-label{
  font-size:.72rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-3);display:flex;align-items:center;gap:8px;margin-bottom:2px;
}
.cf-entry.new .cf-label{color:var(--brand-deep)}
.cf-new-tag{
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;
  background:var(--brand);color:#fff;border-radius:5px;padding:1px 6px;
}
.cf-text{font-size:.95rem;color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .cf-entry.new{animation:cfIn .45s ease both}
  @keyframes cfIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* ---------- Lernkarte ---------- */
.learning-card{border-left:5px solid var(--brand)}
.learning-card h2{display:flex;align-items:center;gap:10px}

/* ---------- Hinweise / Banner ---------- */
.note{
  border:1px solid var(--line);border-radius:var(--radius-s);
  background:var(--line-soft);padding:12px 16px;font-size:.88rem;color:var(--ink-2);
  margin:14px 0;
}
.note.amber{background:var(--amber-soft);border-color:#EAD6AC;color:var(--amber-deep)}
.banner-crit{
  border:1px solid #EFC5C0;border-left:5px solid var(--crit);
  background:var(--crit-soft);border-radius:var(--radius-s);
  padding:16px 18px;margin:18px 0;
}
.banner-crit h3{color:var(--crit-deep);margin-bottom:4px}
.banner-crit p{margin:.2rem 0;font-size:.9rem;color:var(--ink)}

/* ---------- Admin ---------- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-s);padding:14px 16px}
.stat .v{font-family:var(--font-mono);font-size:1.5rem;font-weight:600;color:var(--ink)}
.stat .l{font-size:.78rem;color:var(--ink-3);margin-top:2px}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--surface)}
table.table{border-collapse:collapse;width:100%;font-size:.88rem;min-width:720px}
table.table th{
  text-align:left;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-3);font-weight:600;padding:10px 14px;border-bottom:1px solid var(--line);
  background:var(--paper);white-space:nowrap;
}
table.table td{padding:10px 14px;border-bottom:1px solid var(--line-soft);vertical-align:top}
table.table tr:last-child td{border-bottom:none}
table.table tr.row-click{cursor:pointer}
table.table tr.row-click:hover td{background:var(--brand-softer)}
.badge{
  display:inline-flex;align-items:center;gap:6px;border-radius:8px;
  font-size:.76rem;font-weight:600;padding:3px 10px;white-space:nowrap;
}
.badge-a{background:var(--brand);color:#fff}
.badge-b{background:var(--amber-soft);color:var(--amber-deep);border:1px solid #EAD6AC}
.badge-c{background:var(--crit-soft);color:var(--crit-deep);border:1px solid #EFC5C0}
.badge-neutral{background:var(--line-soft);color:var(--ink-2)}
.badge-brand-soft{background:var(--brand-softer);color:var(--brand-deep);border:1px solid var(--brand-soft)}
.flag-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.flag-dot.red{background:var(--crit)}
.flag-dot.green{background:var(--brand)}
.bar-row{display:grid;grid-template-columns:230px 1fr 74px;gap:14px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.bar-row:last-child{border-bottom:none}
.bar-name{font-size:.9rem;font-weight:500}
.bar-name .en{display:block;font-size:.72rem;color:var(--ink-3);font-weight:400}
.bar-track{height:9px;background:var(--line-soft);border-radius:99px;overflow:hidden}
.bar-fill{height:100%;background:var(--brand);border-radius:99px}
.bar-fill.low{background:var(--crit)}
.bar-fill.mid{background:#C08A1E}
.bar-val{font-family:var(--font-mono);font-size:.86rem;text-align:right;white-space:nowrap}
.score-hero{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.score-hero .num{font-family:var(--font-mono);font-size:2.9rem;font-weight:600;line-height:1;color:var(--ink)}
.score-hero .den{font-family:var(--font-mono);font-size:1.1rem;color:var(--ink-3)}
.kv{display:grid;grid-template-columns:190px 1fr;gap:5px 16px;font-size:.9rem}
.kv dt{color:var(--ink-3)}
.kv dd{margin:0}
.freetext-box{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-s);
  padding:14px 16px;font-size:.93rem;white-space:pre-wrap;line-height:1.65;
}
.probe{
  border:1px solid var(--line);border-left:4px solid var(--brand);
  border-radius:var(--radius-s);padding:13px 16px;margin:10px 0;background:var(--surface);
}
.probe .p-title{font-weight:600;font-size:.92rem;margin-bottom:3px}
.probe .p-reason{font-size:.78rem;color:var(--ink-3);margin-bottom:6px}
.probe .p-text{font-size:.9rem}
.crit-list{margin:6px 0 0;padding-left:18px;font-size:.88rem}
.section-h{
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  margin:30px 0 8px;
}
.section-h h2{margin:0}
.section-h .sub{font-size:.82rem;color:var(--ink-3)}
.hr{border:none;border-top:1px solid var(--line);margin:26px 0}
.landing-cols{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start}
.hero{padding:52px 0 8px}
.hero .eyebrow{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-deep);margin-bottom:12px}
.hero h1{font-size:2.15rem;max-width:620px}
.hero p{max-width:600px;color:var(--ink-2)}
.module-list{list-style:none;margin:10px 0 0;padding:0}
.module-list li{
  display:flex;gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line-soft);
  font-size:.9rem;
}
.module-list li:last-child{border-bottom:none}
.module-list .m-key{font-family:var(--font-mono);font-size:.78rem;color:var(--brand-deep);font-weight:600;width:18px;flex:0 0 auto}
.module-list .m-pts{margin-left:auto;font-family:var(--font-mono);font-size:.8rem;color:var(--ink-3);white-space:nowrap}
.footer-note{margin-top:40px;padding-top:18px;border-top:1px solid var(--line);font-size:.78rem;color:var(--ink-3);line-height:1.7}
.review-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:12px 0}
.review-grid .field{margin:0}
.storage-pill{display:inline-flex;align-items:center;gap:7px;font-size:.75rem;color:var(--ink-3)}
.auto-parts{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.auto-part{font-family:var(--font-mono);font-size:.76rem;background:var(--line-soft);border-radius:6px;padding:3px 8px;color:var(--ink-2)}
.done-center{max-width:560px;margin:9vh auto 0;text-align:center}
.done-center .mark{width:54px;height:54px;border-radius:16px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin:0 auto 18px}

@media (max-width:860px){
  .landing-cols,.grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .bar-row{grid-template-columns:1fr 74px;grid-template-areas:"n v" "t t"}
  .bar-name{grid-area:n}.bar-val{grid-area:v}.bar-track{grid-area:t}
  .review-grid{grid-template-columns:1fr 1fr}
  .kv{grid-template-columns:1fr}
  .kv dt{margin-top:6px}
  .hero h1{font-size:1.7rem}
  .card{padding:20px 18px}
}
@media print{
  .no-print,.topbar{display:none !important}
  body{background:#fff}
  .card{box-shadow:none;border-color:#bbb;break-inside:avoid}
  .wrap-wide,.wrap{max-width:100%;padding:0}
}

/* ============================================================
   Ergänzungen der Serverversion
   (Navigation, Meldungen, Formulare, Statistik, Druck)
   ============================================================ */

/* Optionale, selbst gehostete Schriften.
   Liegen keine Dateien unter assets/fonts, greifen die Systemschriften
   aus den Variablen weiter oben. Es werden keine fremden Server geladen. */

.nav{display:flex;gap:2px;flex-wrap:wrap;align-items:center}
.nav a{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;border-radius:9px;
  font-size:.88rem;font-weight:500;color:var(--ink-2);text-decoration:none;
}
.nav a:hover{background:var(--line-soft);color:var(--ink)}
.nav a.active{background:var(--brand-softer);color:var(--brand-deep);font-weight:600}
.user-pill{
  font-size:.8rem;color:var(--ink-2);background:var(--line-soft);
  border:1px solid var(--line);border-radius:99px;padding:4px 12px;white-space:nowrap;
}

.flash{
  border-radius:var(--radius-s);padding:12px 16px;margin:14px 0;
  font-size:.92rem;border:1px solid var(--line);background:var(--surface);
}
.flash.ok{background:var(--brand-softer);border-color:var(--brand-soft);color:var(--brand-deep)}
.flash.warn{background:var(--amber-soft);border-color:#EAD6AC;color:var(--amber-deep)}
.flash.err{background:var(--crit-soft);border-color:#EFC5C0;color:var(--crit-deep)}

.token-box{
  font-family:var(--font-mono);font-size:1.15rem;font-weight:600;letter-spacing:.06em;
  background:var(--brand-softer);border:1px dashed var(--brand-soft);
  color:var(--brand-deep);border-radius:var(--radius-s);padding:12px 16px;
  display:inline-block;margin:6px 0;user-select:all;
}

.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 16px}
.inline-form{display:inline}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}

.filterbar{
  display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-s);
  padding:12px 14px;margin:14px 0;
}
.filterbar .field{margin:0;min-width:180px}
.filterbar .field label{margin-bottom:3px}

.pbar{height:6px;background:var(--line-soft);border-radius:99px;overflow:hidden;min-width:60px}
.pbar span{display:block;height:100%;background:var(--brand)}
.pbar.low span{background:var(--crit)}
.pbar.mid span{background:var(--amber)}

.dist{display:flex;gap:3px;align-items:center;font-family:var(--font-mono);font-size:.74rem}
.dist b{font-weight:600;color:var(--brand-deep)}

.meta-line{font-size:.8rem;color:var(--ink-3);margin-top:22px;line-height:1.7}
.log-list{list-style:none;padding:0;margin:0;font-size:.86rem}
.log-list li{padding:7px 0;border-bottom:1px solid var(--line-soft);display:flex;gap:12px;flex-wrap:wrap}
.log-list li:last-child{border-bottom:none}
.log-list .lt{font-family:var(--font-mono);font-size:.76rem;color:var(--ink-3);min-width:130px}
.log-list .ly{font-family:var(--font-mono);font-size:.72rem;color:var(--brand-deep);min-width:120px}

.sticky-actions{
  position:sticky;bottom:0;background:rgba(242,242,242,.94);backdrop-filter:blur(6px);
  border-top:1px solid var(--line);padding:12px 0;margin-top:20px;
}

@media print{
  .nav,.user-pill,.sticky-actions,.filterbar{display:none !important}
  .card{break-inside:avoid;box-shadow:none}
}

/* ---------- Logo der Einrichtung (optional) ---------- */
.brand-logo{height:34px;width:auto;max-width:230px;display:block;flex:0 0 auto}

/* ============================================================
   Aufmerksamkeitsuebung (PVT-B)
   Grosse, ruhige Flaeche, hoher Kontrast, keine Ablenkung.
   ============================================================ */
.pvt-stage{
  position:relative;
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  min-height:340px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#1F1F23;
  color:#fff;
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
  margin:18px 0;
  text-align:center;
  padding:24px;
}
.pvt-stage:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.pvt-counter{
  font-family:var(--font-mono);
  font-size:clamp(2.6rem,9vw,4.4rem);
  font-weight:600;letter-spacing:.04em;
  color:#FFDA6B;
  min-height:1.2em;line-height:1.2;
}
.pvt-hint{font-size:.95rem;color:#C9C9CF;margin-top:14px;max-width:44ch}
.pvt-flash{color:#FF8FA3}
.pvt-good{color:#7ADFA0}
.pvt-progress{
  position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.14);
  border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius);overflow:hidden;
}
.pvt-progress span{display:block;height:100%;width:0;background:var(--accent)}
.pvt-meta{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:14px;font-size:.85rem;color:var(--ink-2)}
.pvt-meta b{font-family:var(--font-mono);color:var(--ink);font-weight:600}
.pvt-key{
  display:inline-block;border:1px solid #55555F;border-radius:6px;
  padding:1px 8px;font-family:var(--font-mono);font-size:.85rem;background:#2C2C33;color:#fff;
}
@media (prefers-reduced-motion:reduce){
  .pvt-progress span{transition:none}
}

/* ---------- Fusszeile mit den Pflichtangaben ---------- */
.site-footer{
  border-top:1px solid var(--line);
  background:var(--surface);
  margin-top:40px;
}
.site-footer-in{
  max-width:1120px;margin:0 auto;padding:16px 20px 22px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-size:.85rem;color:var(--ink-2);
}
.site-footer a{color:var(--brand);text-decoration:none;font-weight:500}
.site-footer a:hover{text-decoration:underline}
.site-footer .dot{color:var(--ink-3)}
.site-footer .footer-spacer{flex:1;min-width:20px}
.site-footer .tiny{max-width:52ch}
@media (max-width:860px){
  .site-footer .footer-spacer{display:none}
}