/* ============================================================
   mock.css — «PRÜFUNGSRAUM» · Goethe-Zertifikat va telc mock-imtihoni

   DIZAYN TIZIMI o'sha «SIGNAL» (style.css bilan bir xil):
     · tekis yuza + 1px hairline, shisha/gradient/emoji YO'Q
     · raqamlar doim --font-mono (imtihon varaqasi hissi)
     · qizil FAQAT signal: taymer ogohlantirishi, tanlangan javob, xato
     · oltin FAQAT natija/progress

   MAQSAD — ekran haqiqiy imtihon VARAQASIGA o'xshasin: keng oq maydon,
   chap tomonda matn, o'ng tomonda javob katakchalari, tepada taymer.
   ============================================================ */

/* ---------- 1. Umumiy izoh va to'plamlar ---------- */
.mk-note{
  display:flex;gap:12px;align-items:flex-start;
  padding:14px 16px;margin-bottom:18px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  font-size:.9rem;line-height:1.55;color:var(--text-2);
}
.mk-note b{color:var(--text);}

.mk-set-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;}
.mk-set{
  position:relative;display:flex;flex-direction:column;gap:6px;text-align:left;
  padding:18px 18px 16px;min-width:0;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
  cursor:pointer;transition:border-color var(--t),background var(--t);
}
.mk-set:hover{border-color:var(--border-strong);background:var(--surface-2);}
.mk-set-ghost{
  position:absolute;top:8px;right:14px;
  font-family:var(--font-ghost);font-size:3.1rem;line-height:1;
  color:var(--text);opacity:.06;pointer-events:none;
}
.mk-set-code{font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:var(--text);}
.mk-set-thema{font-size:.8rem;color:var(--text-3);min-height:2.2em;}
.mk-set-bar{display:block;height:3px;background:var(--surface-2);border-radius:2px;overflow:hidden;margin-top:4px;}
.mk-set-bar i{display:block;height:100%;background:var(--gold);}
.mk-set-meta{font-family:var(--font-mono);font-size:.72rem;color:var(--text-3);}

/* ---------- 2. Modullar ---------- */
.mk-mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;}
.mk-mod{
  display:flex;flex-direction:column;gap:8px;text-align:left;min-width:0;
  padding:16px 18px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg);
  cursor:pointer;transition:border-color var(--t),background var(--t);
}
.mk-mod:hover:not(:disabled){border-color:var(--border-strong);background:var(--surface-2);}
.mk-mod.is-off{opacity:.45;cursor:not-allowed;}
.mk-mod-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.mk-mod-name{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--text);}
.mk-mod-min{font-family:var(--font-mono);font-size:.74rem;color:var(--text-3);}
.mk-mod-de{font-size:.8rem;color:var(--text-3);}
.mk-mod-foot{display:flex;align-items:center;gap:10px;padding-top:8px;border-top:1px solid var(--border);}
.mk-mod-note{font-size:.74rem;color:var(--text-3);}
.mk-badge{
  font-family:var(--font-mono);font-size:.74rem;font-weight:700;
  padding:2px 8px;border-radius:var(--radius-pill);
  border:1px solid var(--border);color:var(--text-2);
}
.mk-badge.is-ok{color:#15803D;border-color:#15803D;}
.mk-badge.is-bad{color:var(--red);border-color:var(--red);}
.mk-badge.is-new{color:var(--text-3);}

/* ---------- 3. Deckblatt ---------- */
.mk-deck{
  max-width:720px;margin:0 auto;padding:30px 32px 26px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
}
.mk-deck-head{padding-bottom:14px;margin-bottom:16px;border-bottom:2px solid var(--red);}
.mk-deck-kicker{
  display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--text-3);margin-bottom:6px;
}
.mk-deck-title{font-family:var(--font-display);font-size:2rem;font-weight:700;margin:0;color:var(--text);}
.mk-deck-min{font-family:var(--font-mono);font-size:.95rem;color:var(--red);font-weight:700;}
.mk-deck-list{margin:0 0 14px;padding-left:20px;color:var(--text-2);font-size:.92rem;line-height:1.65;}
.mk-deck-uz{font-size:.86rem;color:var(--text-3);line-height:1.6;margin:0 0 14px;}
.mk-deck-warn{
  padding:12px 14px;margin-bottom:18px;font-size:.85rem;line-height:1.6;
  background:var(--surface-2);border-left:3px solid var(--red);border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  color:var(--text-2);
}
.mk-deck-btns{display:flex;gap:10px;flex-wrap:wrap;}

/* ---------- 4. Imtihon paneli (taymer) ---------- */
.mk-bar{
  position:sticky;top:var(--header-h);z-index:40;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:10px 16px;margin-bottom:14px;
  background:var(--ink);border-radius:var(--radius);color:#F5F1E8;
}
.mk-bar-l{display:flex;flex-direction:column;gap:2px;min-width:0;}
.mk-bar-tag{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;opacity:.62;}
.mk-bar-mod{font-family:var(--font-display);font-size:.98rem;font-weight:700;}
.mk-bar-r{display:flex;align-items:center;gap:12px;}
.mk-count{font-family:var(--font-mono);font-size:.82rem;opacity:.75;font-variant-numeric:tabular-nums;}
.mk-timer{
  font-family:var(--font-mono);font-size:1.35rem;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
}
.mk-timer.is-warn{color:var(--red-300);}
.mk-bar .btn{border-color:rgba(245,241,232,.32);color:#F5F1E8;background:transparent;}
.mk-bar .btn:hover{background:rgba(245,241,232,.12);border-color:#F5F1E8;}

/* ---------- 5. Teil navigatsiyasi ---------- */
.mk-teilnav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;}
.mk-tn{
  display:flex;flex-direction:column;align-items:flex-start;gap:0;
  padding:6px 12px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  cursor:pointer;transition:border-color var(--t),background var(--t);
}
.mk-tn:hover{border-color:var(--border-strong);}
.mk-tn.is-cur{border-color:var(--red);background:var(--red-100);}
[data-theme="dark"] .mk-tn.is-cur{background:rgba(179,18,43,.22);}
.mk-tn b{font-family:var(--font-display);font-size:.84rem;font-weight:700;color:var(--text);}
.mk-tn i{font-family:var(--font-mono);font-size:.68rem;font-style:normal;color:var(--text-3);}

/* ---------- 6. Varaqa ---------- */
.mk-sheet{
  padding:26px 28px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg);
}
.mk-kopf{
  display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding-bottom:10px;margin-bottom:14px;border-bottom:2px solid var(--ink);
}
.mk-kopf-l{display:flex;flex-direction:column;gap:2px;}
.mk-kopf-teil{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--text);}
.mk-kopf-min{font-family:var(--font-mono);font-size:.76rem;color:var(--text-3);}
.mk-kopf-nr{font-family:var(--font-mono);font-size:.8rem;color:var(--red);font-weight:700;}

.mk-anw{font-size:.95rem;line-height:1.65;color:var(--text);margin:0 0 8px;}
.mk-anw-uz{font-size:.84rem;line-height:1.6;color:var(--text-3);margin:0 0 14px;padding-left:12px;border-left:2px solid var(--border);}
.mk-titel{font-family:var(--font-display);font-size:1.5rem;font-weight:700;text-align:center;margin:20px 0 4px;color:var(--text);}
.mk-unter{text-align:center;font-style:italic;color:var(--text-3);margin:0 0 16px;font-size:.9rem;}
.mk-bsp{
  padding:8px 12px;margin:0 0 14px;font-size:.86rem;color:var(--text-2);
  background:var(--surface-2);border-radius:var(--radius-sm);
}
.mk-quelle{font-family:var(--font-mono);font-size:.72rem;color:var(--text-3);font-weight:400;}

/* Ikki ustunli tartib: chapda matn, o'ngda javoblar */
.mk-two{display:grid;grid-template-columns:1.15fr .85fr;gap:24px;align-items:start;}
.mk-texts{display:flex;flex-direction:column;gap:14px;min-width:0;}
.mk-items{display:flex;flex-direction:column;gap:8px;min-width:0;}

.mk-person,.mk-anzeige{
  padding:14px 16px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--radius);
}
.mk-person h4,.mk-anzeige h4{
  display:flex;align-items:center;gap:8px;margin:0 0 8px;
  font-family:var(--font-display);font-size:.95rem;font-weight:700;color:var(--text);
}
.mk-person p,.mk-anzeige p{margin:0;font-size:.9rem;line-height:1.68;color:var(--text-2);}
.mk-pk{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;flex:0 0 22px;
  font-family:var(--font-mono);font-size:.78rem;font-weight:700;
  background:var(--ink);color:#F5F1E8;border-radius:5px;text-transform:lowercase;
}

/* Maqola matni */
.mk-artikel{
  padding:18px 20px;margin-bottom:16px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);
  font-size:.94rem;line-height:1.78;color:var(--text);
}
.mk-artikel p{margin:0 0 12px;}
.mk-artikel p:last-child{margin-bottom:0;}
.mk-artikel.is-brief{font-family:var(--font-elegant);font-size:1rem;}
.mk-gap{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:22px;padding:0 6px;margin:0 3px;
  font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--red);background:var(--surface);
  border:1px dashed var(--red);border-radius:5px;vertical-align:middle;
}

/* Gap banki / so'z qutisi / mundarija */
.mk-bank{display:flex;flex-direction:column;gap:5px;margin-bottom:16px;}
.mk-bank-i{
  padding:8px 12px;font-size:.88rem;line-height:1.5;color:var(--text-2);
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);
}
.mk-bank-i b{
  display:inline-block;min-width:18px;
  font-family:var(--font-mono);color:var(--red);font-weight:700;
}
.mk-kasten{
  display:flex;flex-wrap:wrap;gap:6px;padding:14px;margin-bottom:16px;
  background:var(--surface-2);border:1px dashed var(--border-strong);border-radius:var(--radius);
}
.mk-kw{
  padding:4px 10px;font-size:.86rem;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-pill);
}
.mk-kw b{font-family:var(--font-mono);color:var(--red);margin-right:5px;}
.mk-inhalt{
  padding:14px 18px;margin-bottom:16px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-inhalt b{font-family:var(--font-display);display:block;margin-bottom:8px;}
.mk-inhalt ul{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:4px;}
.mk-inhalt li{font-size:.88rem;color:var(--text-2);}
.mk-inhalt li b{display:inline;font-family:var(--font-mono);color:var(--red);margin-right:6px;}

/* Paragraf / matn bloki */
.mk-para{
  padding:16px 18px;margin-bottom:14px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-para.is-bsp{background:var(--surface-2);border-style:dashed;}
.mk-para h4{
  margin:0 0 8px;font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--text);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.mk-para p{margin:0 0 10px;font-size:.92rem;line-height:1.72;color:var(--text-2);}
.mk-bsp-tag{
  font-family:var(--font-mono);font-size:.7rem;font-weight:400;
  padding:2px 8px;color:var(--text-3);border:1px solid var(--border);border-radius:var(--radius-pill);
}

/* ---------- 7. Javob katakchalari ---------- */
.mk-item{
  display:flex;align-items:flex-start;gap:10px;
  padding:9px 10px;background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-sm);
}
.mk-item.is-mc{align-items:flex-start;}
.mk-inr{
  flex:0 0 26px;display:inline-flex;align-items:center;justify-content:center;
  height:24px;font-family:var(--font-mono);font-size:.8rem;font-weight:700;
  color:var(--text-3);background:var(--surface-2);border-radius:5px;
}
.mk-iq{flex:1 1 auto;min-width:0;font-size:.89rem;line-height:1.55;color:var(--text);}
.mk-mcbody{flex:1 1 auto;min-width:0;}
.mk-mcbody .mk-iq{margin:0 0 8px;font-weight:600;}
/* A1 Lesen Teil 3 — savolning ustidagi qisqa e'lon (eshikdagi, bekatdagi
   yozuv). Tekis yuza + hairline, gradient va soya yo'q (QOIDA 73–90). */
.mk-schild{
  display:block;margin:0 0 9px;padding:10px 12px;
  background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--radius-sm);
  font-size:.9rem;line-height:1.6;color:var(--text-2);white-space:pre-line;
}
.mk-schild b{
  display:block;margin-bottom:5px;
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-3);
}
.mk-mcopts{display:flex;flex-direction:column;gap:5px;}
.mk-mcopts.is-row{flex-direction:row;flex-wrap:wrap;}
.mk-optrow{display:flex;gap:5px;flex-wrap:wrap;flex:0 0 auto;}

.mk-opt{
  display:inline-flex;align-items:center;gap:7px;
  min-width:32px;min-height:32px;padding:5px 11px;
  font-family:var(--font-mono);font-size:.82rem;font-weight:700;
  color:var(--text-2);background:var(--surface);
  border:1px solid var(--border-strong);border-radius:6px;
  cursor:pointer;transition:border-color var(--t),background var(--t),color var(--t);
  justify-content:center;text-align:left;
}
.mk-opt:hover{border-color:var(--red);color:var(--red);}
.mk-opt.is-on{background:var(--red);border-color:var(--red);color:#FFF;}
.mk-opt.is-wide{width:100%;justify-content:flex-start;font-family:var(--font);font-weight:500;font-size:.88rem;line-height:1.45;}
.mk-opt.is-wide b{font-family:var(--font-mono);flex:0 0 14px;}
.mk-opt.is-mid{font-family:var(--font);font-weight:500;font-size:.86rem;}
.mk-opt.is-mid b{font-family:var(--font-mono);color:var(--red);}
.mk-opt.is-mid.is-on b{color:#FFF;}
.mk-opt.is-rf{min-width:88px;letter-spacing:.04em;}
.mk-opt.is-fix{cursor:default;opacity:.85;}
.mk-opt.is-fix:hover{border-color:var(--border-strong);color:var(--text-2);}
.mk-opt.is-fix.is-on{background:var(--ink);border-color:var(--ink);color:#F5F1E8;}

.mk-wer{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.mk-wp{
  padding:6px 12px;font-size:.86rem;color:var(--text);
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-pill);
}
.mk-wp b{font-family:var(--font-mono);color:var(--red);margin-right:6px;}

/* Goethe B1 Lesen Teil 4 — Leserbriefe: matn va Ja/Nein birga turadi.
   Boshqa Teil larda javob o'ng ustunda, bu yerda esa har fikrning
   tagida — rasmiy varaqada ham shunday. */
.mk-meinung{
  padding:14px 16px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--radius);
}
.mk-meinung h4{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 8px;
  font-family:var(--font-display);font-size:.95rem;font-weight:700;color:var(--text);
}
.mk-meinung p{margin:0 0 10px;font-size:.9rem;line-height:1.68;color:var(--text-2);}
.mk-meinung.is-bsp{background:var(--surface);border-style:dashed;}

/* ---------- 8. Hören pleyeri ---------- */
.mk-player{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:14px 16px;margin-bottom:16px;
  background:var(--ink);border-radius:var(--radius);color:#F5F1E8;
}
.mk-player.is-done{opacity:.62;}
.mk-player.is-warn{
  display:block;background:var(--red-100);color:var(--text);
  border:1px solid var(--red);line-height:1.6;font-size:.88rem;
}
[data-theme="dark"] .mk-player.is-warn{background:rgba(179,18,43,.2);color:#F5F1E8;}
.mk-play{
  padding:10px 22px;font-family:var(--font-display);font-size:.92rem;font-weight:700;
  color:#191510;background:var(--gold);border:none;border-radius:var(--radius-pill);
  cursor:pointer;transition:background var(--t);
}
.mk-play:hover:not(:disabled){background:var(--gold-300);}
.mk-play:disabled{opacity:.4;cursor:not-allowed;}
.mk-play-info{font-size:.84rem;line-height:1.5;}
.mk-play-info i{display:block;font-family:var(--font-mono);font-size:.74rem;font-style:normal;opacity:.7;}
.mk-player.is-thin{padding:9px 14px;margin-bottom:10px;font-size:.82rem;}
.mk-voice-steps{margin:10px 0;padding-left:22px;font-size:.86rem;line-height:1.75;}
.mk-voice-steps b{color:var(--text);}
.mk-player.is-warn .btn{margin-top:6px;}

/* Transkription — natija ekranida */
.mk-transkript .mk-tr-teil{
  padding:12px 0;border-top:1px solid var(--border);
}
.mk-transkript .mk-tr-teil:first-of-type{border-top:none;}
.mk-transkript h5{
  margin:0 0 8px;font-family:var(--font-display);font-size:.92rem;color:var(--red);
}
.mk-transkript p{margin:0 0 8px;font-size:.9rem;line-height:1.72;color:var(--text-2);}
.mk-transkript p b{color:var(--text);font-family:var(--font-mono);font-size:.8rem;margin-right:6px;}

/* ---------- 9. Schreiben ---------- */
.mk-aufgabe{margin-bottom:16px;}
.mk-zitat{
  margin:0 0 14px;padding:14px 18px;
  background:var(--surface-2);border-left:3px solid var(--red);
  border-radius:0 var(--radius) var(--radius) 0;
  font-size:.94rem;line-height:1.72;color:var(--text-2);
}
/* A1 Schreiben Teil 1 — to'ldiriladigan blank: qatorlar saqlanadi */
.mk-zitat.is-formular{
  font-family:var(--font-mono);font-size:.86rem;line-height:1.95;
  white-space:pre-line;
}
.mk-punkte{margin:0 0 12px;padding-left:22px;font-size:.92rem;line-height:1.7;color:var(--text-2);}
.mk-hinweis{font-size:.8rem;line-height:1.55;color:var(--text-3);}
.mk-situation{
  padding:12px 14px;margin:0 0 12px;font-size:.92rem;line-height:1.65;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);
}
.mk-frage{
  padding:16px;margin:0 0 14px;text-align:center;
  font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:var(--text);
  background:var(--gold-100);border:1px solid var(--gold);border-radius:var(--radius);
}
[data-theme="dark"] .mk-frage{background:rgba(201,162,39,.16);}
.mk-write{display:flex;flex-direction:column;gap:8px;}
.mk-text{
  width:100%;min-height:340px;padding:16px 18px;resize:vertical;
  font-family:var(--font);font-size:.98rem;line-height:1.85;color:var(--text);
  background:var(--surface-2);border:1px solid var(--border-strong);border-radius:var(--radius);
}
.mk-text:focus{outline:none;border-color:var(--red);}
.mk-write-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.mk-wc{
  font-family:var(--font-mono);font-size:.84rem;font-weight:700;
  padding:3px 10px;color:var(--red);border:1px solid var(--red);border-radius:var(--radius-pill);
}
.mk-wc.is-ok{color:#15803D;border-color:#15803D;}

.mk-themen{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;margin-bottom:18px;}
.mk-thema{
  padding:16px 18px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--radius);
}
.mk-thema.is-sm{padding:12px 14px;}
.mk-thema h4{margin:0 0 10px;font-family:var(--font-display);font-size:1.05rem;color:var(--red);}
.mk-thema h5{margin:0 0 8px;font-family:var(--font-display);font-size:.92rem;color:var(--text);}
.mk-thema p{font-size:.88rem;line-height:1.6;color:var(--text-2);margin:0 0 8px;}
.mk-anzeige-box{
  padding:14px 16px;margin:0 0 12px;
  background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);
}
.mk-anzeige-box b{font-family:var(--font-display);font-size:1rem;color:var(--text);}
.mk-anzeige-box p{margin:6px 0 8px;font-size:.9rem;line-height:1.55;}
.mk-anzeige-box ul{margin:0 0 10px;padding-left:18px;font-size:.86rem;line-height:1.6;color:var(--text-2);}
.mk-anzeige-box address{font-style:normal;font-size:.82rem;color:var(--text-3);line-height:1.5;}

/* ---------- 10. Sprechen ---------- */
.mk-kand{
  padding:14px 16px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--radius);
}
.mk-kand h4{margin:0 0 10px;font-family:var(--font-display);font-size:1rem;color:var(--red);}
.mk-redemittel{
  margin:14px 0;padding:10px 14px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-redemittel summary{cursor:pointer;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--text);}
.mk-redemittel ul{margin:10px 0 0;padding-left:20px;font-size:.88rem;line-height:1.7;color:var(--text-2);}
.mk-prep{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:14px 16px;margin-top:14px;
  background:var(--surface-2);border:1px dashed var(--border-strong);border-radius:var(--radius);
}
.mk-prep-t{font-family:var(--font-mono);font-size:1.3rem;font-weight:700;color:var(--red);font-variant-numeric:tabular-nums;}

/* ---------- 11. Pastki panel ---------- */
.mk-foot{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 4px 0;
}
.mk-foot-mid{font-family:var(--font-mono);font-size:.8rem;color:var(--text-3);}

/* ---------- 12. Natija ---------- */
.mk-res{max-width:960px;margin:0 auto;}
.mk-res-head{
  padding:26px 28px;margin-bottom:18px;text-align:center;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
  border-top:4px solid var(--red);
}
.mk-res-head.is-ok{border-top-color:#15803D;}
.mk-res-kicker{
  display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--text-3);
}
.mk-res-head h2{font-family:var(--font-display);font-size:1.7rem;margin:6px 0 14px;color:var(--text);}
.mk-res-big{display:flex;align-items:baseline;justify-content:center;gap:16px;flex-wrap:wrap;}
.mk-res-pct{font-family:var(--font-mono);font-size:3rem;font-weight:700;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;}
.mk-res-head.is-ok .mk-res-pct{color:#15803D;}
.mk-res-head.is-bad .mk-res-pct{color:var(--red);}
.mk-res-pt{font-family:var(--font-mono);font-size:1rem;color:var(--text-3);}
.mk-res-verdict{display:block;margin-top:10px;font-size:.9rem;color:var(--text-2);}
.mk-res-note{display:block;margin-top:6px;font-size:.8rem;color:var(--red);}

.mk-res-sum{
  display:flex;gap:22px;flex-wrap:wrap;justify-content:center;
  padding:12px;margin-bottom:16px;font-size:.9rem;color:var(--text-2);
  background:var(--surface-2);border-radius:var(--radius);
}
.mk-res-teil{
  padding:14px 16px;margin-bottom:12px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-res-teil h4{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 0 10px;font-family:var(--font-display);font-size:1rem;color:var(--text);
}
.mk-res-teil h4 span{font-family:var(--font-mono);font-size:.85rem;color:var(--text-3);}
.mk-res-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:6px;}
.mk-res-i{
  display:flex;align-items:center;gap:5px;padding:5px 8px;
  font-family:var(--font-mono);font-size:.78rem;
  border:1px solid var(--border);border-radius:6px;background:var(--surface-2);
}
.mk-res-i.is-ok{border-color:#15803D;}
.mk-res-i.is-bad{border-color:var(--red);}
.mk-res-nr{font-weight:700;color:var(--text-3);flex:0 0 auto;}
.mk-res-a{color:#15803D;font-weight:700;}
.mk-res-i.is-bad .mk-res-my{color:var(--red);text-decoration:line-through;}
.mk-res-i.is-ok .mk-res-my{display:none;}
.mk-res-text{
  white-space:pre-wrap;word-break:break-word;margin:0;padding:14px 16px;
  font-family:var(--font);font-size:.92rem;line-height:1.75;color:var(--text-2);
  background:var(--surface-2);border-radius:var(--radius-sm);
}
.mk-res-ex{
  padding:16px 18px;margin-bottom:14px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-res-ex h4{margin:0 0 12px;font-family:var(--font-display);font-size:1.05rem;color:var(--red);}
.mk-res-exi{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--border);}
.mk-res-exi:first-of-type{border-top:none;}
.mk-res-exi p{margin:0 0 3px;font-size:.88rem;color:var(--text);}
.mk-res-exi i{font-size:.84rem;color:var(--text-3);line-height:1.55;}

.mk-crit{display:flex;flex-direction:column;gap:6px;margin:14px 0 8px;}
.mk-crit-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:9px 12px;background:var(--surface-2);border-radius:var(--radius-sm);
}
.mk-crit-name{font-size:.88rem;color:var(--text-2);flex:1 1 220px;min-width:0;}
.mk-crit-btns{display:flex;gap:4px;}
.mk-crit-b{
  width:32px;height:32px;font-family:var(--font-mono);font-size:.85rem;font-weight:700;
  color:var(--text-2);background:var(--surface);
  border:1px solid var(--border-strong);border-radius:6px;cursor:pointer;
  transition:border-color var(--t),background var(--t),color var(--t);
}
.mk-crit-b:hover{border-color:var(--gold);}
.mk-crit-b.is-on{background:var(--gold);border-color:var(--gold);color:#191510;}
.mk-muster{
  margin:10px 0;padding:10px 14px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-muster summary{cursor:pointer;font-family:var(--font-display);font-size:.9rem;font-weight:700;color:var(--text);}
.mk-muster pre{
  white-space:pre-wrap;word-break:break-word;margin:10px 0 0;
  font-family:var(--font);font-size:.9rem;line-height:1.8;color:var(--text-2);
}
.mk-res-frei{
  padding:16px 18px;margin-bottom:16px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
}
.mk-res-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px;}

/* ---------- 13. Mobil ---------- */
@media (max-width:900px){
  .mk-two{grid-template-columns:1fr;gap:16px;}
  .mk-sheet{padding:18px 16px;}
  .mk-deck{padding:22px 18px;}
}
@media (max-width:560px){
  .mk-bar{position:static;}
  .mk-timer{font-size:1.15rem;}
  .mk-res-pct{font-size:2.3rem;}
  .mk-opt.is-rf{min-width:76px;font-size:.76rem;}
  .mk-artikel{padding:14px;}
  .mk-text{min-height:280px;padding:12px;}
}