:root { --bg:#f4f5f7; --card:#fff; --line:#d7dbe0; --accent:#2d6cdf; --warn:#c0392b; --muted:#6b7280; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:#1f2430; }
header { background:#1f2937; color:#fff; padding:1rem 1.5rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
header h1 { margin:0; font-size:1.4rem; }
.help-btn { width:2rem; height:2rem; flex:0 0 auto; border-radius:50%; border:1px solid #c3cad6; background:transparent; color:#fff; font-size:1.1rem; font-weight:700; line-height:1; cursor:pointer; padding:0; }
.help-btn:hover { background:rgba(255,255,255,.12); }
.help-steps { margin:.4rem 0 1rem; padding-left:1.2rem; font-size:.9rem; line-height:1.5; }
.help-steps li { margin-bottom:.4rem; }
main { max-width:1000px; margin:1.2rem auto; padding:0 1rem; }
section { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1rem 1.2rem; margin-bottom:1.2rem; }
h2 { margin-top:0; font-size:1.15rem; }
h3 { font-size:1rem; }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:.6rem 1rem; }
.grid label.wide { grid-column:1 / -1; }
label { display:flex; flex-direction:column; font-size:.85rem; color:var(--muted); gap:.25rem; }
input, select, textarea { font:inherit; padding:.4rem .5rem; border:1px solid var(--line); border-radius:5px; background:#fff; color:#1f2430; }
input:focus, select:focus, textarea:focus { outline:2px solid var(--accent); outline-offset:0; }
button { font:inherit; padding:.45rem .8rem; border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:5px; cursor:pointer; }
button.secondary, .filebtn { background:#fff; color:var(--accent); }
.toolbar { display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:.8rem; align-items:center; }
.filebtn { display:inline-block; border:1px solid var(--accent); padding:.45rem .8rem; border-radius:5px; cursor:pointer; font-size:.9rem; }
.status { margin-left:.6rem; color:var(--muted); font-size:.85rem; }
.cat { border:1px solid var(--line); border-radius:6px; margin-bottom:.6rem; }
.cat > summary { cursor:pointer; padding:.55rem .8rem; font-weight:600; display:flex; justify-content:space-between; gap:1rem; }
.cat .crit { display:flex; align-items:center; gap:.6rem; padding:.3rem .8rem; }
.cat .crit span { flex:1; font-size:.85rem; }
.cat .crit input { width:5rem; }
.catnote { color:var(--muted); font-weight:500; font-size:.85rem; }
.live-grade { margin-top:.8rem; font-size:1.05rem; }
.live-grade strong { color:var(--accent); }
.btn-stop { margin-left:.6rem; background:#fff; color:var(--warn); border-color:var(--warn); }
.progress { list-style:none; padding:0; margin:.8rem 0 0; font-size:.88rem; }
.progress li { padding:.15rem 0; color:var(--muted); }
.progress li.ok::before { content:"✓ "; color:#1e9e57; }
.progress li.warn::before { content:"⚠ "; color:var(--warn); }
.block { margin-bottom:.9rem; }
.block label { font-weight:600; color:#1f2430; margin-bottom:.2rem; }
.block textarea { width:100%; min-height:5rem; resize:vertical; line-height:1.4; }
table { border-collapse:collapse; width:100%; font-size:.9rem; }
th, td { border:1px solid var(--line); padding:.4rem .6rem; text-align:left; }
tr.total td { font-weight:700; background:#f0f4ff; }
tr.sub td:first-child { padding-left:1.6rem; font-size:.82rem; color:var(--muted); }
dialog { border:1px solid var(--line); border-radius:8px; max-width:520px; }
#sessions-list { list-style:none; padding:0; }
#sessions-list li { display:flex; justify-content:space-between; gap:1rem; padding:.4rem 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.hint { font-size:.82rem; color:var(--muted); margin:.2rem 0 .8rem; }
.gen-status { margin-top:.6rem; font-weight:600; color:var(--accent); font-size:.95rem; min-height:1.2em; }
.score-table { table-layout:fixed; }
.score-table th:nth-child(2), .score-table th:nth-child(3) { width:8rem; text-align:center; }
.score-table input { width:5rem; }
.score-table td { vertical-align:middle; }
.score-table td.crit-label { font-size:.85rem; }
.score-table tr.cat-head td { background:#eef2f9; font-weight:600; }
.score-table tr.cat-head em { color:var(--muted); font-weight:500; }
.score-table tr.cat-head .catw { font-weight:500; color:var(--muted); white-space:nowrap; }
.weight-input { width:3.4rem; }
#weights-sum.warn { color:var(--warn); }
.score-table td.critnote, .score-table td.catnote { text-align:center; color:var(--muted); white-space:nowrap; }

/* Verfeinern (Per-Block-Chat) */
.block-actions { display:flex; gap:.5rem; margin-top:.3rem; }
.refine-btn, .copy-btn { padding:.25rem .6rem; font-size:.82rem; }
.refine-dialog { max-width:640px; width:92vw; }
.refine-input-row { display:flex; gap:.5rem; align-items:flex-start; margin:.4rem 0 .3rem; }
.refine-input-row textarea { flex:1; resize:vertical; line-height:1.4; }
.refine-input-row button { white-space:nowrap; }
.refine-transcript { max-height:46vh; overflow-y:auto; margin:.4rem 0; display:flex; flex-direction:column; gap:.5rem; }
.refine-bubble { border:1px solid var(--line); border-radius:6px; padding:.4rem .6rem; }
.refine-bubble.base { background:#f7f8fb; }
.refine-bubble.instruction { background:#eef2f9; border-color:var(--accent); }
.refine-bubble.output { background:#fff; }
.refine-bubble-label { font-size:.72rem; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:.15rem; }
.refine-bubble-text { white-space:pre-wrap; line-height:1.4; font-size:.92rem; }
.refine-footer { display:flex; gap:.6rem; justify-content:flex-end; margin-top:.5rem; }
