*{box-sizing:border-box}body{font:15px/1.4 system-ui,sans-serif;margin:0;background:#f4f6f9;color:#1d2733}
header{background:#123a63;color:#fff;padding:12px 16px}h1{margin:0 0 8px;font-size:1.3em}
nav button{background:#2b5a8a;color:#fff;border:0;padding:8px 12px;margin:2px;border-radius:6px;cursor:pointer}nav button.on{background:#fff;color:#123a63}
main{max-width:1000px;margin:auto;padding:12px}.card{background:#fff;border-radius:10px;padding:14px;margin-bottom:12px;box-shadow:0 1px 3px #0002}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}label{display:flex;flex-direction:column;font-size:.85em;gap:3px}
input,select{padding:6px;font-size:1em;border:1px solid #bbc;border-radius:5px}.cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
table{border-collapse:collapse;width:100%;margin:8px 0}td,th{border-bottom:1px solid #dde;padding:5px;text-align:left}td.n,th.n{text-align:right}
.roles input,.roles select{width:100%}.out table tr.tot{font-weight:bold;background:#eef3f8}.note{font-size:.85em;color:#556}
.formula{font-size:.82em;color:#445;background:#f7f9fb;padding:8px;border-radius:6px;white-space:pre-wrap}button{padding:7px 12px;margin:3px;cursor:pointer}
.big{font-size:1.2em;font-weight:bold;color:#0a6b2e}
@media(max-width:640px){.cols{grid-template-columns:1fr}.roles thead{display:none}.roles td{display:block;border:0}.roles tr{display:block;border-bottom:2px solid #ccd}}
@media print{header nav,.noprint{display:none}body{background:#fff}.card{box-shadow:none}.tab[hidden]{display:none}}
.warn{color:#a40000;font-weight:bold}
.tw{overflow-x:auto}.roles{display:block;overflow-x:auto}@media(max-width:640px){.roles{display:table}}