:root { --blue:#1d4e89; --bg:#f4f6f9; --text:#1b1f24; --line:#c9d1da; --red:#b00020; --green:#14702e; }
* { box-sizing: border-box; }
body { margin:0; font:1.0625rem/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--text); }
h1,h2 { line-height:1.2; }
h2 { font-size:1.25rem; margin:1.2rem 0 .6rem; }
.skip { position:absolute; left:-999px; }
.skip:focus { left:8px; top:8px; background:#fff; padding:.5rem; z-index:10; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.bar { display:flex; align-items:center; gap:1rem; background:var(--blue); color:#fff; padding:.6rem 1rem; flex-wrap:wrap; }
.bar h1 { margin:0; font-size:1.3rem; flex:1; }
main { max-width:60rem; margin:0 auto; padding:0 1rem 2rem; }
.card { background:#fff; border:1px solid var(--line); border-radius:12px; padding:1rem; margin-top:1rem; }
.narrow { max-width:26rem; margin:3rem auto; }
label { display:block; font-weight:600; margin:.7rem 0 .2rem; }
label.inline { display:inline-block; font-weight:400; margin-right:1rem; }
input, select, button { font:inherit; min-height:44px; border:1px solid #7a8794; border-radius:8px; padding:.4rem .7rem; background:#fff; color:inherit; }
input, select { width:100%; }
input[type=radio] { width:auto; min-height:0; }
input[type=checkbox] { width:1.25rem; height:1.25rem; min-height:0; vertical-align:middle; }
button { cursor:pointer; width:auto; }
button.primary { background:var(--blue); color:#fff; border-color:var(--blue); font-weight:600; }
button.danger { background:var(--red); color:#fff; border-color:var(--red); font-weight:600; }
.bar button { background:#fff; color:var(--blue); }
:focus-visible { outline:3px solid #ffbf47; outline-offset:2px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(10rem,1fr)); gap:.5rem 1rem; align-items:end; }
.actions { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.8rem; }
.row { display:flex; gap:.8rem; align-items:center; flex-wrap:wrap; }
.row label { margin:0; } .row select { width:auto; }
.row.space { justify-content:space-between; }
.stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(9rem,1fr)); gap:.8rem; margin-bottom:.8rem; }
.stat { background:#fff; border:1px solid var(--line); border-radius:12px; padding:.8rem; }
.stat span { display:block; font-size:.9rem; color:#46515c; }
.stat strong { font-size:1.4rem; }
.scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; background:#fff; margin-top:.6rem; }
th, td { text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
.num { text-align:right; white-space:nowrap; }
.income { color:var(--green); } .expense { color:var(--red); }
td button { min-height:40px; margin:0 .2rem .2rem 0; }
.error { color:var(--red); font-weight:600; }
.empty { background:#fff8e1; border:1px solid #e6c34a; border-radius:8px; padding:.8rem; }
.hint { font-size:.9rem; color:#46515c; margin-top:1.5rem; }
fieldset { border:0; padding:0; margin:.5rem 0 0; }
dialog { border:1px solid var(--line); border-radius:12px; width:min(30rem, 94vw); padding:1rem; }
dialog::backdrop { background:rgba(0,0,0,.45); }
@media (max-width:600px) { body { font-size:1rem; } .actions button { flex:1; } }
.tabs { display:flex; gap:.5rem; margin-top:1rem; flex-wrap:wrap; }
.tab { font-weight:600; }
.tab[aria-current=page] { background:var(--blue); color:#fff; border-color:var(--blue); }
h3 { font-size:1.05rem; margin:1rem 0 .3rem; }
.deadlines, .files { list-style:none; padding:0; margin:.4rem 0; }
.deadlines li, .files li, .contract { border:1px solid var(--line); border-left-width:6px; border-radius:8px; padding:.6rem .8rem; margin:.4rem 0; background:#fff; }
.files li { border-left-width:1px; display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; justify-content:space-between; }
.st-due_soon { border-left-color:#b45f06; } .st-ended { border-left-color:#6b7280; }
.st-active { border-left-color:var(--green); } .st-cancelled { border-left-color:#6b7280; }
.badge { display:inline-block; font-size:.85rem; font-weight:700; padding:.05rem .5rem; border-radius:99px; background:#eef2f6; border:1px solid #7a8794; }
.contract h3 { margin:0 0 .3rem; }
.contract dl { display:grid; grid-template-columns:max-content 1fr; gap:.1rem .8rem; margin:.4rem 0; }
.contract dt { color:#46515c; } .contract dd { margin:0; }
.count { display:inline-block; min-width:1.5rem; font-size:.85rem; padding:0 .4rem; border-radius:99px; background:#b45f06; color:#fff; }
.status-line { margin:.2rem 0 .4rem; color:#46515c; }
.mail-columns { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 24rem),1fr)); gap:0 1rem; }
.mail-columns > section { min-width:0; }
.mail .meta span, .mail .sum { overflow-wrap:anywhere; }
.mails { list-style:none; padding:0; margin:.4rem 0; }
.mail { border:1px solid var(--line); border-left:6px solid var(--blue); border-radius:8px; padding:.6rem .8rem; margin:.5rem 0; background:#fff; }
.mail.low { border-left-color:#7a8794; }
.mail.done { opacity:.6; } .mail.done .subj { text-decoration:line-through; }
.mail .meta { font-size:.9rem; color:#46515c; display:flex; gap:.5rem; flex-wrap:wrap; justify-content:space-between; }
.mail .subj { font-weight:700; margin:.15rem 0; overflow-wrap:anywhere; }
.mail .sum { margin:.2rem 0; } .mail .snip { font-size:.9rem; color:#46515c; margin:.2rem 0; overflow-wrap:anywhere; }
.mail .facts { display:flex; gap:.4rem; flex-wrap:wrap; margin:.3rem 0; }
.mail .actions { margin-top:.4rem; } .mail .actions button { min-height:40px; }
.cat-rechnung, .cat-zahlung { background:#fff1e0; border-color:#b45f06; }
.cat-termin { background:#e6f0fb; border-color:var(--blue); }
.cat-behoerde, .cat-sicherheit { background:#fde8ea; border-color:var(--red); }
.cat-auftrag { background:#e7f5ea; border-color:var(--green); }
