/* laborbuch — Stil aus dem Werk „Wuchs“ */
:root{
  --bg:#f6f7f4; --panel:#ffffff; --ink:#1b1f1a; --muted:#5f6b58; --line:#d6dbd0;
  --accent:#4a6b2f; --accent2:#7a5c2f; --warn:#8a3b1f; --grid:#e8ece2;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 "DejaVu Sans",system-ui,Arial,sans-serif}
header{background:var(--accent);color:#fff;padding:14px 18px}
header h1{margin:0;font-size:18px;letter-spacing:.3px}
header .sub{font-size:12.5px;opacity:.9;margin-top:3px}
.bar{display:flex;flex-wrap:wrap;gap:8px;padding:10px 18px;background:#eceee8;border-bottom:1px solid var(--line)}
button{font:inherit;padding:6px 12px;border:1px solid var(--line);background:#fff;border-radius:5px;cursor:pointer}
button:hover{border-color:var(--accent)}
button.p{background:var(--accent);color:#fff;border-color:var(--accent)}
button.d{border-color:#c9a9a0;color:var(--warn)}
main{padding:18px;max-width:1180px;margin:0 auto}
section{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:16px}
h2{margin:0 0 10px;font-size:16px;border-bottom:1px solid var(--line);padding-bottom:6px}
h3{margin:14px 0 6px;font-size:14px;color:var(--muted)}
label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:2px}
input,select,textarea{font:inherit;width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:#fff}
textarea{min-height:64px;resize:vertical}
.row{display:grid;gap:10px;margin-bottom:10px}
.r2{grid-template-columns:1fr 1fr}.r3{grid-template-columns:1fr 1fr 1fr}.r4{grid-template-columns:1fr 1fr 1fr 1fr}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th,td{border:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
th{background:#f0f2ec;font-weight:600}
.muted{color:var(--muted);font-size:12.5px}
.tag{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11.5px;border:1px solid var(--line);background:#f3f5ef}
.tag.ok{border-color:#9ab87f;background:#eef5e6}
.tag.bad{border-color:#d3a396;background:#f9ece7;color:var(--warn)}
.en{color:var(--muted);font-size:11.5px;display:block}
.hide{display:none !important}
#arena{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;max-width:480px;border:1px solid var(--line);padding:4px;background:var(--grid)}
#arena div{aspect-ratio:1;background:#fff;border:1px solid #e3e7dd;cursor:pointer;font-size:10px;display:flex;align-items:center;justify-content:center}
#arena div.food{background:#d9c28a;border-color:#b79b56}
#arena div.start{background:#c7d9b0;border-color:#8aa86a}
#arena div.rep{background:#e2b7a8;border-color:#c08b78}
.note{border-left:3px solid var(--accent2);background:#faf7f0;padding:8px 10px;font-size:13px;margin:10px 0}
.warnbox{border-left:3px solid var(--warn);background:#fbf1ed;padding:8px 10px;font-size:13px;margin:10px 0}
@media(max-width:760px){
  .g2,.g3,.g4,.g5{grid-template-columns:1fr}
  button{white-space:normal}
  main{padding:10px}
  /* Rasterfelder duerfen schmaler werden als ihr Inhalt — ohne min-width:0
     schiebt ein breiter Inhalt die ganze Seite quer */
  main>*,main>*>*{min-width:0}
  /* Tabellen scrollen in ihrem Abschnitt, statt die Seite breit zu machen */
  section{overflow-x:auto}
  table{min-width:540px}
  img,canvas,svg{max-width:100%}
  header h1{font-size:16px}
}
@media print{
  .bar,button,.noprint{display:none !important}
  body{background:#fff}section{break-inside:avoid;border-color:#999}
}