:root{color-scheme:light;--ink:#171b20;--line:#c7cbd0;--accent:#1767ab;--danger:#a61e27;--paper:#fafaf8;--shadow:0 5px 20px #0003}
.vp-form-row>.field.investment-amount-mode{flex-basis:19rem}
.vp-form-row>.field.bank-purpose{flex-basis:20rem}
.prepayment-grid>.accountbox{flex-basis:25rem}.prepayment-grid .large-number small{display:block;font-size:.85rem;font-weight:500}.prepayment-months small{display:block;font-size:.7rem;font-weight:400}.prepayment-months caption{text-align:left;font-weight:700;margin-bottom:.6rem}.prepayment-months td{text-align:right;white-space:nowrap}.prepayment-months tbody th{background:transparent;font-weight:500}.prepayment-months .current-month{background:#e5f0f8}.prepayment-months .current-month th{font-weight:700}.prepayment-months tfoot{border-top:2px solid #aeb9bf}.prepayment-archive{margin-top:1rem}
.subaccountblock td:first-child,.subaccountblock td:last-child{white-space:nowrap}.subaccountblock td:last-child,.subaccountblock thead th:last-child{text-align:right}
@media(max-width:700px){.subaccountblock th,.subaccountblock td{padding-left:.35rem;padding-right:.35rem}}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,sans-serif;color:var(--ink);background:#3c444b url('../img/background.jpg') center/cover fixed}a{color:#125b96}a:hover{text-decoration:underline}h1,h2,h3,h4,p{margin-top:0}h2{color:#fff;text-shadow:0 1px 3px #000;margin-bottom:1.4rem}h3{font-size:1.2rem;margin-bottom:1rem}h4{font-size:1.05rem}small,.muted{display:block;font-size:.83rem;color:#666}strong,dd{font-variant-numeric:tabular-nums}[hidden]{display:none!important}
#sitehead{position:sticky;top:0;z-index:5;background:#12171dee;color:#fff;border-bottom:1px solid #777;box-shadow:var(--shadow)}#sitehead-inner{display:flex;align-items:center;gap:1.5rem;max-width:1500px;margin:auto;padding:.7rem 3%;font-size:.9rem}.brand{font-size:1.5rem;font-weight:700;text-decoration:none;color:#fff}.user-nav{margin-left:auto;display:flex;align-items:center;gap:.6rem}.user-nav form{margin:0}.user-nav button{padding:.3rem .6rem;border-color:#777;background:transparent}#topnav{display:flex;gap:1.5rem;flex-wrap:wrap;max-width:1500px;margin:auto;padding:.5rem 3%;border-top:1px solid #ffffff1a}#topnav a{color:#eee;text-decoration:none}#topnav a:hover{color:#fff;text-decoration:underline}
#container{padding:2rem 0;min-height:calc(100vh - 170px)}#mainContent{width:94%;max-width:1450px;margin:auto}.vp-box,.budgettype,.accountbox,.subaccountblock,.accountstatementbox{background:var(--paper);border:1px solid #555;border-radius:3px;box-shadow:var(--shadow);margin-bottom:1.5rem;min-width:0}.vp-box{padding:1.5rem}.vp-grid{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:flex-start}.vp-grid>section{flex:1 1 25rem;max-width:100%}.vp-grid>.budgettype{flex-basis:27rem}.boxhead,.blockhead,.typeheader{padding:1rem 1.3rem;background:#20262c;color:#fff}.boxhead h3,.blockhead h3,.typeheader h3{margin:0}.boxhead small,.blockhead small{color:#ccc}.boxbody,.blockbody,.typebody{padding:1.2rem}.boxfooter,.typefooter{background:#eceeec;padding:1rem 1.2rem;border-top:1px solid #bbb}.typefooter{display:flex;justify-content:space-between}.categoryheader{background:#e1e4e4;padding:.6rem .8rem;margin:0;font-size:1rem}.categorybody{padding:.8rem}.budgetcategoryblock{border:1px solid #bcc3c6;margin-bottom:1rem}.budgetentryrow{display:flex;justify-content:space-between;gap:1rem}.budgetentryrow strong{white-space:nowrap}.badge{background:#ddd;padding:.1rem .4rem;border-radius:2px;font-size:.7rem;font-weight:400}.large-number{font-size:1.8rem;font-weight:700;margin-bottom:1rem}
.vp-tabs{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1rem}.vp-tabs a,.vp-button,button{background:#20262c;color:#fff;text-decoration:none;padding:.65rem 1rem;border:1px solid #20262c;border-radius:3px;font:inherit;display:inline-block;cursor:pointer}.vp-tabs a.active{background:var(--accent);border-color:var(--accent)}button:hover,.vp-button:hover{background:#384956}.vp-danger{background:var(--danger);border-color:var(--danger)}form{margin:.6rem 0 1rem}.vp-form-row{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;margin:.8rem 0}.vp-form-row>.field{flex:1 1 12rem;min-width:0}.field{display:block;margin-bottom:.8rem;max-width:100%}.field>span{display:block;font-weight:600;font-size:.9rem;margin-bottom:.3rem}input,select,textarea{width:100%;min-height:2.65rem;padding:.5rem .6rem;border:1px solid #959ca1;border-radius:2px;background:#fff;color:#111;font:inherit}input[type=checkbox]{width:1rem;min-height:1rem;margin-right:.4rem}input:focus,select:focus,button:focus,a:focus{outline:3px solid #68a5d4;outline-offset:2px}.check{display:block;padding:.5rem 0;margin-bottom:.7rem}summary{cursor:pointer;font-weight:600;padding:.3rem 0}details>form{margin-top:1rem}details details{border-top:1px solid #ddd;margin-top:.5rem}details>summary{list-style-position:inside}details[open]>summary{margin-bottom:.7rem}.inline{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.delete-form{font-size:.85rem;color:var(--danger);padding:.6rem 0}.delete-form button{padding:.3rem .6rem}.operation{border-bottom:1px solid #ddd;padding:.5rem 0}
.vp-info,.vp-warning,.vp-error,.vp-success{padding:1rem 1.2rem;margin-bottom:1.2rem;border:1px solid #aab1b6;border-left:5px solid #517d9d;background:#f0f5fa;box-shadow:var(--shadow)}.vp-warning,.vp-error{border-left-color:var(--danger);background:#fff5e7;color:#6a151b}.vp-success{border-left-color:#32754b;background:#eff9ee;color:#245235}.negative{color:var(--danger);font-weight:700}.vp-warning ul{margin:.5rem 0}.month-picker{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;background:#fffc;padding:.6rem 1rem;margin-bottom:1rem}.month-picker select{width:auto;min-width:12rem}dl{margin:0}dl>div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid #d9ddda;padding:.4rem 0}dl>div:last-child{border:0;font-weight:700}dd{margin:0;text-align:right;white-space:nowrap}#budgetconclusion{max-width:650px;margin-left:auto;margin-right:auto}.table-scroll{overflow-x:auto;width:100%}table{width:100%;border-collapse:collapse;font-size:.9rem}th,td{border-bottom:1px solid #ddd;padding:.55rem .6rem;vertical-align:top;text-align:left}th{background:#e5e8e7;font-weight:600}td:not(:first-child){font-variant-numeric:tabular-nums}thead th{white-space:nowrap}tbody tr:nth-child(even){background:#f0f1ef}tfoot{font-weight:700}#accountbook td{text-align:right;white-space:nowrap}#accountbook th:first-child{min-width:6rem}#accountbook th{min-width:9rem}.accountstatementbox{flex-basis:100%!important}.login-box{max-width:30rem;margin:3rem auto}.plan-list{list-style:none;padding:0}.plan-list li{padding:.4rem 0;border-bottom:1px solid #ddd}#footer{text-align:center;background:#12171dee;color:#bbb;padding:1rem;font-size:.8rem}
@media(max-width:700px){body{background-attachment:scroll}#sitehead{position:static}#sitehead-inner{flex-wrap:wrap;gap:.5rem}.brand{font-size:1.25rem}#sitehead-inner>span{display:none}#topnav{gap:.8rem;font-size:.85rem}#container{padding:1rem 0}.vp-box{padding:1rem}.vp-grid{gap:1rem}.vp-form-row>.field{flex-basis:100%}.vp-tabs a{padding:.45rem .6rem;font-size:.85rem}h2{margin-bottom:1rem}dl>div{font-size:.9rem}.large-number{font-size:1.5rem}}@media print{#sitehead,.vp-tabs,form,details,#footer,.month-picker{display:none!important}body{background:#fff}#mainContent{width:100%}h2{color:#000;text-shadow:none}.vp-box,.accountstatementbox,.subaccountblock,.accountbox,.budgettype{box-shadow:none;break-inside:avoid}}
.bank-color-0{--bank-color:#235b9b}.bank-color-1{--bank-color:#39713c}.bank-color-2{--bank-color:#794b91}.bank-color-3{--bank-color:#a85821}.bank-color-4{--bank-color:#a33856}.bank-color-5{--bank-color:#366e75}
.bank-colored .boxhead,.bank-colored .blockhead{background:var(--bank-color,#235b9b)}
.bank-pot-group{margin:1.7rem 0 2.2rem;border-top:5px solid var(--bank-color);padding-top:1rem}
.bank-pot-heading{display:flex;gap:1rem;justify-content:space-between;align-items:center;background:var(--paper);border-left:5px solid var(--bank-color);padding:1rem 1.3rem;margin-bottom:1rem;box-shadow:var(--shadow)}
.bank-pot-heading h3,.bank-pot-heading p{margin:0}.bank-pot-heading strong{display:block;font-size:1.3rem;text-align:right}.bank-pot-heading small{text-align:right}
.bank-colored .subaccountblock{border-color:var(--bank-color)}.bank-colored .subaccount-system-row{background:#f6f7e9}
.transfer-pending-note{border-left:4px solid var(--bank-color);background:#edf3f8;padding:.7rem 1rem}
@media(max-width:700px){.bank-pot-heading{align-items:flex-start;flex-direction:column}.bank-pot-heading small,.bank-pot-heading strong{text-align:left}}

/* Kompakte, monatsbezogene Haushaltsplan-Kategorien; native details ohne JS. */
.budget-area-tools { padding: .85rem 1.2rem 0; }
.vp-button.budget-add-button { display: inline-block; padding: .55rem .8rem; border: 1px solid #546269; border-radius: .2rem; font-weight: 600; text-decoration: none; color: #20282d; background: #fff; }
.vp-button.budget-add-button:hover { background: #edf2f4; }
.budget-category-disclosure > .categoryheader { display: flex; align-items: center; gap: .55rem; cursor: pointer; list-style: none; }
.budget-category-disclosure > summary::-webkit-details-marker { display: none; }
.budget-category-disclosure h4 { flex: 1; margin: 0; font-size: 1rem; overflow-wrap: anywhere; }
.budget-chevron { width: .5rem; height: .5rem; margin: 0 .35rem .25rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .2s ease; flex-shrink: 0; }
.budget-category-disclosure[open] > summary .budget-chevron { transform: rotate(225deg); margin-top: .25rem; }
.budget-category-disclosure[data-expanded="false"] > summary .budget-chevron { transform: rotate(45deg); }
.budget-category-total { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; padding: .65rem .8rem; background: #f5f7f7; border-top: 1px solid #ccd2d4; font-weight: 600; }
.budget-category-total strong { white-space: nowrap; }
.budgetcategoryblock .categorybody { padding: 0 .8rem .8rem; }
.budgetitem .budgetentryrow > span { flex: 1; overflow-wrap: anywhere; }
.budgetentryrow strong { white-space: nowrap; }
.budget-drag-handle { background: transparent; color: #526168; padding: .15rem .3rem; border: 0; cursor: grab; touch-action: none; flex-shrink: 0; }
.budget-drag-handle:active { cursor: grabbing; }
.budget-dragging { opacity: .55; outline: 2px dashed #617d8c; }
.budget-drop-before { box-shadow: 0 -4px 0 #28759a; }
.budget-drop-end { outline: 2px solid #28759a; outline-offset: 2px; }
.budget-drag-form, .budget-category-drag-form { display: none; }
.budget-drag-status:empty { display: none; }
.budget-area-tools [data-context-actions] { color: #20282d; }
@media (prefers-reduced-motion: reduce) { .budget-chevron { transition: none; } }
#budgetplan { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; gap: 1.4rem; }
#budgetplan > .budgettype { min-width: 0; width: auto; }
@media (max-width: 1050px) { #budgetplan { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 720px) { #budgetplan { grid-template-columns: minmax(0,1fr); } }

/* Abschluss als verständliche Vorschau, danach eine einzige Hauptaktion. */
.month-close { max-width: 1100px; margin-left: auto; margin-right: auto; }
.close-budget-group { margin: 1.3rem 0; padding: 1rem 1.2rem; border: 1px solid #c5d0d2; border-left: 4px solid #32754b; background: #f5f8f5; }
.close-overdraft { border-left-color: #a66717; background: #fff8ed; }
.close-review { border-left-color: #ac2633; background: #fff5ef; }
.close-covered { border-left-color: #517d9d; background: #f2f6fa; }
.close-group-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.close-group-heading h4 { margin-bottom: .5rem; }
.close-group-heading > strong { font-size: 1.35rem; white-space: nowrap; }
.close-budget-group > p { margin-bottom: .6rem; }
.close-bank-group h5 { font-size: .95rem; margin: .8rem 0 .2rem; }
.close-budget-rows { list-style: none; padding: 0; margin: 0; }
.close-budget-rows li { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1.2fr); gap: .5rem 1.2rem; align-items: center; padding: .75rem 0; border-top: 1px solid #d6dede; }
.close-budget-rows strong { overflow-wrap: anywhere; }
.close-budget-amount { white-space: nowrap; text-align: right; }
.close-budget-destination { overflow-wrap: anywhere; }
.close-bank-total { text-align: right; font-size: .9rem; margin: .3rem 0; }
.close-cover-form,.close-cash { padding: 1rem 1.2rem; margin: 1.2rem 0; border: 1px solid #d5c7b3; background: #fff8ed; }
.close-cover-form { scroll-margin-top: 8.5rem; }
.close-cover-form .field { margin-bottom: 0; }
.close-cover-choice { flex: 1 1 16rem; min-width: 0; }
.close-cover-choice p { margin: .35rem 0 0; font-size: .9rem; }
.close-cover-form p:last-child,.close-cash ul { margin-bottom: 0; }
.close-status { box-shadow: none; margin-top: 1.3rem; }
.close-status p { margin-bottom: 0; }
.close-next-step { border-top: 1px solid #d1d8d9; padding-top: 1rem; }
.close-extra-options { margin-bottom: 1rem; font-size: .9rem; }
.close-finish-form button { margin-bottom: .75rem; }
.close-finish-form button:disabled { background: #e0e5e6; border-color: #bbc3c7; color: #5a6369; cursor: not-allowed; }
@media(max-width:700px) { .close-budget-group,.close-cover-form,.close-cash { padding: .8rem; } .close-group-heading { flex-wrap: wrap; gap: .1rem .8rem; } .close-budget-rows li { grid-template-columns: minmax(0,1fr) auto; gap: .4rem .8rem; } .close-budget-destination { grid-column: 1 / -1; } .close-budget-destination small { display: inline; margin-right: .35rem; } .close-bank-total { text-align: left; } .close-finish-form button { max-width: 100%; white-space: normal; } }
@media(max-width:700px) { .close-cover-form { scroll-margin-top: 1rem; } }
.bank-plan-table .bank-opening-row { font-weight: 600; }
.bank-plan-table .bank-pending-balance { color: #637178; font-size: .85rem; text-align: right; }
.bank-plan-table .bank-running-balance { font-variant-numeric: tabular-nums; }
.bank-plan-closing { font-weight: 700; }
.bank-plan-table.bank-orderable { min-width: 55.5rem; }
.bank-plan-table.bank-orderable .bank-date-col { width: 9rem; }
.bank-row-drag { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 2rem; padding: 0; margin: 0 .2rem 0 0; background: transparent; color: #637178; border: 0; cursor: grab; touch-action: none; vertical-align: middle; }
.bank-row-drag[hidden] { display: none; }
.bank-row-drag:active { cursor: grabbing; }
.bank-row-drag:hover,.bank-row-drag:focus-visible { background: #e3ebee; color: #20282d; }
.bank-statement-order-form { display: none; }
.bank-statement-sort-form button { margin: .65rem 0; padding: .35rem .65rem; font-size: .85rem; background: transparent; color: var(--ink); border-color: var(--line); }
.balance-planned summary { font-weight: normal; }
.balance-planned ul { margin: .5rem 0; padding-left: 1.2rem; }
.boxfooter .balance-planned dd { align-self: flex-start; }