body{font-family:Arial,sans-serif;margin:10px}
header{display:flex;justify-content:space-between;align-items:center}
.logo{height:48px}
iframe{width:100%;height:70vh;border:1px solid #ddd;border-radius:10px}
input,select{width:100%;padding:10px;font-size:16px}
button{width:100%;padding:12px;font-size:16px;margin-top:10px}

.checkbox{display:flex;gap:6px;align-items:center}
.checkbox input[type=checkbox]{width:auto;padding:0;margin:0}

.pdfDirectLink a{display:block;text-align:center;padding:12px;border:1px solid #ddd;border-radius:10px;text-decoration:none}

.pdfjs-topbar{display:flex;gap:10px;align-items:center;padding:10px;border-bottom:1px solid #eee}
.pdfjs-container{padding:10px}

.card{border:1px solid #ddd;border-radius:12px;padding:12px;margin:12px 0}
.qblock .in{width:100%;padding:10px;font-size:16px;box-sizing:border-box;margin:6px 0}
.qblock .small{max-width:120px}
.hint{opacity:.8}


h1{font-size:1.2rem; margin:0}
h2{font-size:1.2rem}
label{display:block; margin:10px 0}
/*input, select{width:100%; padding:10px; font-size:16px; box-sizing:border-box}*/
.confirm{position:sticky; bottom:0; background:#fff; padding:10px 0}
.quiz fieldset{border:1px solid #ddd; border-radius:12px; padding:10px; margin:12px 0}
.quiz legend{padding:0 6px}
.opt{display:block; padding:8px 0}
.quizimg{max-width:100%; border-radius:12px; margin:10px 0; border:1px solid #ddd}
.result{font-size:1.1rem}
.list{margin:10px 0 18px}
@media(min-width:900px){
  body{max-width:900px; margin:20px auto}
  h1{font-size:1.5rem}
}



/* Admin Drag & Drop + Upload */
.dndlist{display:flex;flex-direction:column;gap:12px}
.qitem{display:flex;gap:10px;border:1px solid #ddd;border-radius:12px;padding:10px;background:#fff}
.qitem.over{outline:2px dashed #999}
.handle{user-select:none;cursor:grab;font-size:22px;line-height:1;padding:8px 10px;border-radius:10px;border:1px solid #eee;background:#fafafa;height:fit-content}
.qbody{flex:1}
.qhead{display:flex;gap:10px;align-items:center}
.imgrow{display:flex;gap:10px;align-items:flex-start;margin-top:10px}
.adminthumb{width:110px;height:80px;object-fit:cover;border-radius:10px;border:1px solid #ddd}
.imgcontrols{flex:1}
.smalllbl{display:block;font-size:.85rem;opacity:.8;margin-top:6px}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
button.secondary{background:#f2f2f2}
button.danger{background:#ffecec}

/* Quiz: Antworten in einer Zeile + Highlight + Auswertung */
.opt{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:10px;
  border:1px solid transparent;
}
.opt input{ transform: scale(1.1); }
.opt:hover{ background:#f5f5f5; }

/* ausgewählte Antwort */
.opt.selected{
  background:#eef5ff;
  border-color:#cfe2ff;
}

/* nach Auswertung */
.opt.correct{
  background:#e9f7ef;
  border-color:#b7e1c1;
}
.opt.wrong{
  background:#fdecea;
  border-color:#f5c2c7;
}
.opt .icon{
  margin-left:auto;
  font-weight:700;
  font-size:18px;
}

/* Button-Leiste nach Auswertung */
.afterEval{
  position:sticky;
  bottom:0;
  background:#fff;
  padding:10px 0;
  border-top:1px solid #eee;
  margin-top:10px;
}


/* v7: Saubere Ausrichtung Radio + Text + Icon (3 Spalten) */
.opt{
  display:grid;
  grid-template-columns: 28px 1fr 28px;
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:10px;
  border:1px solid transparent;
}
.opt input{
  margin:0;
  justify-self:center;
  transform: scale(1.1);
}
.opt .txt{
  line-height:1.4;
}
.opt .icon{
  justify-self:center;
  font-weight:700;
  font-size:18px;
  margin-left:0; /* override old flex layout */
}