:root{--bg:#f5f6f8;--card:#fff;--ink:#1d2430;--mut:#5d6878;--line:#d9dee5;--acc:#2f5d8a;--accs:#e8eff8;--ok:#2e7d4a;--oks:#e9f6ec;--warn:#b3261e;--of:#7a5af8;--ofs:#efeaff;--pr:#b26a00;--prs:#fff3dc;--ins:#d7f5dd;--del:#fbe0de}
[hidden]{display:none!important}
*{box-sizing:border-box}
body{margin:0;font:14px/1.5 "Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--acc)}
header{background:var(--card);border-bottom:1px solid var(--line);padding:10px 16px 0;position:sticky;top:0;z-index:20}
.hrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;padding-bottom:8px}
.logo{background:var(--acc);color:#fff;border-radius:6px;padding:1px 7px}
.sub,small{color:var(--mut);font-size:12.5px}
nav{display:flex;flex-wrap:wrap;gap:4px;align-items:flex-end}
nav a{padding:6px 12px;border:1px solid var(--line);border-bottom:none;border-radius:6px 6px 0 0;text-decoration:none;color:var(--ink);background:#fafbfc}
nav a.on{background:var(--acc);color:#fff;border-color:var(--acc)}
nav .suche{margin-left:auto;padding-bottom:6px}
main{padding:14px 16px 60px;max-width:1800px;margin:0 auto}
h1{font-size:19px;margin:6px 0 12px}h2{font-size:16px;margin:4px 0 8px}h3{font-size:14px;margin:12px 0 6px}
.inl{display:inline-block;margin:0 6px 0 0;vertical-align:middle}
.btns{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:4px 0}
button,select,input,textarea{font:inherit;font-size:13px;color:var(--ink)}
button,.chip{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:4px 10px;cursor:pointer;text-decoration:none;color:var(--ink);display:inline-block}
button:hover,.chip:hover{border-color:var(--acc)}
button.pri,.chip.on{background:var(--acc);color:#fff;border-color:var(--acc)}
button.ok{background:var(--oks);border-color:var(--ok);color:var(--ok)}
button.del{color:var(--warn)}
button.x{border:none;background:none;padding:0 2px;color:var(--warn)}
input,select,textarea{border:1px solid var(--line);border-radius:5px;padding:5px 7px;background:#fff;max-width:100%}
textarea{width:100%;display:block;margin:4px 0;line-height:1.45}
label{display:block;margin:8px 0}label input,label select{display:block;width:100%;margin-top:3px}
label.inl,label.chip{display:inline-block}label.inl input,label.chip input{display:inline;width:auto}
.karte{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin:0 0 12px}
.karte.schmal{max-width:440px;margin:30px auto}
.meldung{border-radius:6px;padding:8px 12px;margin:0 0 10px;background:var(--oks);border:1px solid var(--ok)}
.meldung.fehler{background:#fdecea;border-color:var(--warn)}
.b{display:inline-block;font-size:11.5px;border-radius:9px;padding:0 7px;margin:0 3px 2px 0;background:#eef1f5;color:var(--mut);white-space:nowrap}
.b.ge{background:var(--accs);color:var(--acc)}.b.ok{background:var(--oks);color:var(--ok)}.b.of{background:var(--ofs);color:var(--of)}.b.pr{background:var(--prs);color:var(--pr)}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-bottom:12px}
.kachel{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:10px 12px;text-decoration:none;color:var(--ink)}
.kachel span{font-size:12px;color:var(--mut);display:block}
.balken{height:6px;background:#eef1f5;border-radius:3px;margin:6px 0}.balken i{display:block;height:100%;background:var(--ok);border-radius:3px}
.tab{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:8px}
.tab th,.tab td{padding:5px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tab th{background:#eef1f5;font-size:12.5px}.tab td.zahl{white-space:nowrap;font-variant-numeric:tabular-nums}.tab td.fertig{background:var(--oks)}
.mut{color:var(--mut)}
.kopfzeile{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px}
.raster{display:grid;grid-template-columns:74px repeat(var(--n,4),minmax(0,1fr));background:var(--card);border:1px solid var(--line);border-radius:8px;margin-top:8px}
.kz{position:sticky;top:96px;z-index:5;background:#eef1f5;font-weight:600;font-size:12.5px;padding:6px 10px;border-bottom:1px solid var(--line)}
.rand{padding:8px 6px;border-bottom:1px solid var(--line);font-size:11px;color:var(--mut);text-align:center;background:#fafbfc;scroll-margin-top:130px}
.rand b{color:var(--ink);font-size:11.5px}
.zelle{padding:7px 10px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);min-width:0}
.zelle.frei{background:#f6fbf7}.zelle.geaendert .txt{border-left-color:var(--acc)}
.zk{margin-bottom:3px}
.txt{white-space:pre-wrap;overflow-wrap:anywhere;border-left:3px solid transparent;padding-left:6px}
.txt.art-h{font-weight:700}.txt.art-cap{font-style:italic;color:#3d4757}
.vs{border:1px solid var(--of);background:#fbfaff;border-radius:6px;padding:6px 8px;margin:8px 0}
.vs.alt{border-color:var(--pr);background:#fffaf0}
.vk{font-size:12px;margin-bottom:3px}
.diff{white-space:pre-wrap;overflow-wrap:anywhere}
ins{background:var(--ins);text-decoration:none}del{background:var(--del);color:#8a2b22}
.ent input{width:100%;margin:4px 0}
.zf{margin-top:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start}
.zf details{flex:1 1 100%}.zf summary{cursor:pointer;color:var(--acc);font-size:12.5px}
.ver{border-left:3px solid var(--line);padding:4px 10px;margin:6px 0}.ver.akt{border-left-color:var(--ok)}
.kom{border-bottom:1px dashed var(--line);padding:4px 0}
code.key{font-size:15px;letter-spacing:1px;background:#eef1f5;padding:2px 6px;border-radius:4px}
#qr{margin:10px 0}#qr img,#qr canvas{max-width:200px}
.hide-de .sp-de,.hide-en .sp-en,.hide-ru .sp-ru,.hide-uk .sp-uk{display:none}
mark{background:#fff1a8}
@media (max-width:860px){
 .raster{display:block}.kz{display:none}
 .rand{text-align:left;background:#eef1f5}
 .zelle{border-left:none}
 .zelle::before{content:attr(data-lg);font-weight:600;font-size:11px;color:var(--mut)}
 nav .suche{margin-left:0;width:100%}
}
.b.ki{background:#e6f4f4;color:#0f6b6b}.vs.ki{border-style:dashed}
.kapwahl{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:6px;padding:6px 8px;margin:6px 0}
