body{font-family:system-ui,sans-serif;margin:0;background:#f4f5f7;color:#222}
nav{background:#2b3a55;padding:.7rem 1rem;display:flex;gap:1rem;flex-wrap:wrap}
nav a,nav strong{color:#fff;text-decoration:none}nav .right{margin-left:auto}
main{max-width:1100px;margin:1rem auto;padding:0 1rem}
table{border-collapse:collapse;width:100%;background:#fff}
th,td{padding:.4rem .6rem;border-bottom:1px solid #e1e4e8;text-align:left;font-size:.92rem}
th{background:#eceff3}td.num,th.num{text-align:right;white-space:nowrap}
form.box{background:#fff;padding:1rem;border-radius:6px;max-width:640px}
label{display:block;margin:.6rem 0 .2rem;font-weight:600}
input,select{width:100%;padding:.45rem;box-sizing:border-box}
input[type=checkbox]{width:auto}
button,.btn{background:#2b3a55;color:#fff;border:0;padding:.5rem 1rem;border-radius:4px;cursor:pointer;text-decoration:none;display:inline-block;font-size:.95rem;width:auto}
button.danger{background:#a33}.err{background:#fde8e8;border:1px solid #c66;padding:.5rem;margin:.5rem 0}
.bar{display:flex;gap:.6rem;align-items:end;flex-wrap:wrap;margin:.8rem 0}.bar input,.bar select{width:auto}
.in{color:#16722f}.out{color:#a33}form.inline{display:inline}
textarea{width:100%;padding:.45rem;box-sizing:border-box;font:inherit}
.ok{background:#e6f6ea;border:1px solid #6b9;padding:.5rem;margin:.5rem 0}
.cancel{text-decoration:line-through;color:#888}
td form.inline input{width:auto}
footer{max-width:1100px;margin:2rem auto 1rem;padding:.8rem 1rem 0;border-top:1px solid #d0d4da;font-size:.8rem;color:#555}
footer .f1{display:flex;justify-content:space-between;gap:.5rem 1.5rem;flex-wrap:wrap}footer a{color:#2b3a55}
.hint{font-size:.85rem;color:#555}code{background:#eceff3;padding:0 .25rem;border-radius:3px}
/* Version 0.11: Symbolbuttons, Aktionsreihen, Farben */
.ibtn{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border:0;border-radius:4px;background:#1565c0;color:#fff;cursor:pointer;text-decoration:none;vertical-align:middle;font-size:1.2rem;line-height:1}
.ibtn:hover,.ibtn:focus{background:#0d47a1}
.ibtn svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ibtn.danger,button.ibtn.danger{background:#a33}.ibtn.danger:hover{background:#7f2222}
.btn-orange{background:#c25400}.btn-orange:hover{background:#9c4300}
.btn-red{background:#a33;color:#fff}.btn-red:hover{background:#7f2222}
.btnrow{display:flex;justify-content:space-between;align-items:center;gap:.6rem;margin-top:1rem}
.btnrow p{margin:0}
.rows2{display:flex;flex-direction:column;gap:.4rem}.rows2 .row{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
td.right,th.right{text-align:right}.checks label{display:inline-block;margin:.2rem .8rem .2rem 0;font-weight:400}
table.cat{table-layout:auto}.cat td:last-child{text-align:right;white-space:nowrap}
/* Version 0.12: Benutzermenü und Avatar */
.usermenu{margin-left:auto;position:relative}
.dd summary{list-style:none;cursor:pointer;color:#fff;display:block;white-space:nowrap;padding:.15rem .4rem;border-radius:4px}
.usermenu summary .avatar{vertical-align:middle;margin-right:.5rem}.usermenu summary span+span{vertical-align:middle}
.dd summary::-webkit-details-marker{display:none}
.dd summary:hover,.dd[open] summary{background:rgba(255,255,255,.18)}
.dd summary:focus-visible{outline:2px solid #fff;outline-offset:1px}
.dd .caret{display:inline-block;width:.4rem;height:.4rem;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);margin:0 .2rem .2rem .6rem;vertical-align:middle}
.dd .menu{position:absolute;right:0;top:calc(100% + .4rem);background:#fff;color:#222;border:1px solid #c5cad3;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.25);min-width:12rem;z-index:20;padding:.3rem 0}
nav .dd .menu a{display:block;padding:.55rem 1rem;color:#222;text-decoration:none}
nav .dd .menu a:hover,nav .dd .menu a:focus{background:#eceff3}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:1.9rem;height:1.9rem;border-radius:50%;color:#fff;font-size:.8rem;font-weight:700;object-fit:cover;flex:none}
.avatar.big{width:5.5rem;height:5.5rem;font-size:2rem}
.profile-photo{display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:.3rem 1rem;margin:0 0 .5rem}dl.kv dt{font-weight:600}dl.kv dd{margin:0}
/* Version 0.14: Schlagwörter */
.chip{display:inline-block;background:#eceff3;color:#222;border:1px solid #c5cad3;border-radius:999px;padding:.1rem .65rem;margin:.1rem .15rem;font-size:.85rem;text-decoration:none;cursor:pointer;width:auto}
a.chip:hover,button.chip:hover,button.chip:focus{background:#dfe4ec}
/* Version 0.15 */
.navmenu{position:relative}.navmenu .menu{right:auto;left:0}
.warn{background:#fff6e0;border:1px solid #d9a441;padding:.5rem;margin:.5rem 0}
.btn-blue{background:#1565c0;color:#fff}.btn-blue:hover{background:#0d47a1}
.login-logo{display:block;margin:0 auto 1rem;max-width:300px;max-height:225px;width:auto;height:auto}
dl.kv{margin:0 0 .5rem}
/* Version 0.16: Menü auf gemeinsamer Mittellinie, einheitliche Höhe der Felder und Schaltflächen */
nav{align-items:center}
:root{--ctl-h:2.4rem}
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):not([type=range]):not([type=color]),select{height:var(--ctl-h);padding:0 .55rem;font-size:.95rem;border:1px solid #b9c0cc;border-radius:4px;background:#fff;color:inherit}
.bar button,.bar .btn,td .btn,td form.inline button:not(.ibtn){height:var(--ctl-h);display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}
td form.inline input,td form.inline select{vertical-align:middle}
h3{font-size:1.05rem;margin:1.1rem 0 .3rem}
/* Version 0.17 */
button,.btn,.ibtn{box-sizing:border-box}
.navright{margin-left:auto}
.navmenu.navright .menu{left:auto;right:0}
.navright + .usermenu{margin-left:2.5rem}
.rows2 form.inline{display:inline-flex;align-items:center;gap:.4rem}
.fee{display:inline-flex;align-items:center;justify-content:center;width:1.35rem;height:1.35rem;border-radius:50%;font-size:.8rem;font-weight:700;color:#fff;cursor:default}
.fee-open{background:#c75b00}.fee-over{background:#c62828}
/* Version 0.18 */
th.c,td.c{text-align:center;vertical-align:middle}
/* Version 0.19: Druckansicht der Wiederherstellungscodes */
.rc-print{display:none}
@media print{header,nav,footer,.noprint,main>*:not(.rc-box){display:none!important}.rc-print{display:block!important}.rc-box{border:0;box-shadow:none;padding:0}.rc-box pre{font-size:14pt}}
.ret-over{color:#c62828;font-weight:600}.ret-soon{color:#c75b00;font-weight:600}
.dsgvo-btns{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;max-width:calc(640px + 2rem)}   /* gleiche Breite wie das Formular (Inhalt 640px plus Innenabstand) */.dsgvo-btns .right{margin-left:auto}
/* Version 0.24 */
.eur-off{position:relative;display:inline-block;line-height:1}.eur-off::after{content:"";position:absolute;left:-3px;right:-3px;top:50%;border-top:2px solid currentColor;transform:rotate(-45deg)}
.legend-eur{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;border-radius:4px;background:#1565c0;color:#fff;font-weight:700;font-size:.85rem;vertical-align:middle}.legend-eur.legend-off{background:#a33}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:1rem;align-items:start;margin:1rem 0}
.dash-card{background:#d6dfee;border:1px solid #bbc7dd;border-radius:6px;padding:1rem}.dash-card h2{margin:0 0 .5rem;font-size:1.1rem}.dash-card p{margin:.3rem 0}.dash-card table{background:#fff}
/* Version 0.25: Finanzstatus als Zeilen */
.dash-card table.fin{background:transparent;margin:.2rem 0;width:100%}
.fin td,.fin th{border-bottom:0;padding:.15rem .4rem;font-size:.95rem}
.fin th.sub{background:transparent;color:#555;font-weight:600;font-size:.85rem;padding-top:.6rem}
.fin tr:first-child th.sub{padding-top:.1rem}
.fin tr.tot td{border-top:1px solid #8a9bbd;font-weight:700}
.fin td.num{width:1%}
/* Version 0.26: Reiter der Einstellungen */
.tabs{display:flex;gap:.25rem;overflow-x:auto;border-bottom:2px solid #bbc7dd;margin:0 0 1rem;white-space:nowrap}
.tabs a{padding:.5rem .9rem;border-radius:6px 6px 0 0;text-decoration:none;color:#2b3a55;background:#e9edf4}
.tabs a:hover{background:#d6dfee}
.tabs a.active{background:#2b3a55;color:#fff;font-weight:600}
.tabs a:focus-visible{outline:2px solid #1565c0;outline-offset:-2px}
