/* Fleckenputzer shared screen design. Print layouts remain document-specific. */
@media screen{
:root{--fp-bg:#24292d;--fp-surface:#2b3136;--fp-input:#343b40;--fp-border:#4b565d;--fp-text:#f3f6f4;--fp-muted:#bac5bf;--fp-green:#beff53;color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--fp-bg);-webkit-text-size-adjust:100%}
body{background:var(--fp-bg);color:var(--fp-text);line-height:1.5;overflow-wrap:break-word}
header{background:#1b2023;border-bottom:1px solid #414b51;padding:18px 24px;gap:12px;flex-wrap:wrap}
header>b,header>strong{font-family:inherit;font-size:20px;letter-spacing:.2px;line-height:1.3}
header>span,header b span,header strong span{color:var(--fp-green)}
header>a,header>button{background:#343d3a!important;color:#e7eee9!important;border:1px solid #56644e;border-radius:9px;padding:10px 14px!important;min-height:42px;display:inline-flex;align-items:center;justify-content:center;font:600 13px/1.3 system-ui,sans-serif;text-decoration:none}
main{width:100%;max-width:1180px;padding:22px;margin-inline:auto;min-width:0}
.card{background:var(--fp-surface);border:1px solid var(--fp-border);border-radius:16px;padding:24px;margin-bottom:18px;box-shadow:none;min-width:0}
h1{font-size:25px;line-height:1.25;letter-spacing:-.45px;margin:0 0 16px;font-weight:750}
h2{font-size:20px;line-height:1.35;letter-spacing:-.2px;margin:0 0 16px;font-weight:700}
h3{font-size:16px;line-height:1.4}
p{margin:10px 0 16px;line-height:1.6}
.muted,small{color:var(--fp-muted);font-size:13px;line-height:1.65}
label{display:block;font-size:13px;line-height:1.45;font-weight:600;margin:16px 0 7px}
input,select,textarea{font:400 16px/1.4 system-ui,sans-serif;max-width:100%;min-width:0;min-height:46px;width:100%;padding:12px 13px;border:1px solid #66737b;border-radius:9px;background:var(--fp-input);color:var(--fp-text);box-shadow:none;scroll-margin-top:90px}
input[type=date],input[type=month]{display:block;min-inline-size:0;max-inline-size:100%;-webkit-appearance:none;appearance:none}
input[type=checkbox],input[type=radio]{width:20px;height:20px;min-height:0;padding:0;accent-color:var(--fp-green);vertical-align:middle}
input[type=file]{padding:10px;font-size:13px}
input[type=hidden]{display:none}
input::placeholder,textarea::placeholder{color:#abb6bc;opacity:1}
input[readonly]{color:#c3cdc8;background:#30373b}
textarea{min-height:116px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--fp-green);outline-offset:2px;border-color:var(--fp-green)}
button{font:650 13px/1.4 system-ui,sans-serif;min-height:44px;border:1px solid transparent;border-radius:9px;padding:11px 16px;background:var(--fp-green);color:#182018;cursor:pointer;white-space:normal}
button.secondary{background:#3b4544!important;color:#f0f5f1!important;border-color:#64716a}
button.danger{background:#50343c!important;color:#ffe9ed!important;border-color:#86545f}
button:disabled{opacity:.5;cursor:not-allowed}
button:hover:not(:disabled){filter:brightness(.94)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--fp-green);outline-offset:3px}
a{color:#d4efbb;text-underline-offset:3px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:20px 0 6px}
.actions>a{font-size:13px;padding:10px 0;overflow-wrap:anywhere}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:16px;min-width:0}
.grid>*,.row>*,.item>*,.direct-row>*{min-width:0}
.row{gap:12px}
.item,.direct-row,.entry{background:#252c30;border:1px solid #4d595f!important;border-radius:12px;padding:16px;margin:14px 0}
.item label,.direct-row label{margin-top:0}
.scroll{width:100%;max-width:100%;overflow-x:auto;border-radius:10px;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.5}
th,td{padding:12px 11px;border-bottom:1px solid #4c575e;vertical-align:top}
th{background:#343e3b!important;color:#e6ede8!important;font-size:12px;font-weight:650;letter-spacing:.1px}
td.num,th.num,td.right,th.right{font-variant-numeric:tabular-nums}
td button{font-size:12px;padding:8px 11px;min-height:38px;margin:2px 2px 2px 0}
tfoot{background:#343e3b!important}
details summary{cursor:pointer;color:#d4efbb;font-size:13px}
details pre{background:#22292d;border:1px solid #4b565d;border-radius:8px;padding:12px;font-size:12px;line-height:1.6;color:#dfe8e2}
hr{border:0;border-top:1px solid var(--fp-border);margin:24px 0}
.pill{background:#364b2b;color:#dcffc1;font-size:12px;padding:5px 10px;border-radius:20px}
.warn{background:#403925;color:#fff0c9;border:1px solid #887446;border-radius:10px;padding:14px;font-size:13px;line-height:1.6}
#notice,#message{padding:13px 16px;border-radius:10px;color:#182018;font-size:13px;line-height:1.6;box-shadow:0 3px 12px #00000014}
#slipTotal{background:#343e3b!important;border:1px solid #53634e;border-radius:12px;padding:16px;font-size:14px;line-height:1.8}
.total{font-size:19px;font-weight:750;font-variant-numeric:tabular-nums}
#invoiceMetrics>.card,#revenueTotals>.card{padding:18px;border:1px solid #53634e;background:#303a34}
#invoiceMetrics h2,#revenueTotals h2{margin:8px 0 0;font-size:25px;font-variant-numeric:tabular-nums}
#app>nav,#billingNav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:16px;margin:0 0 20px;background:var(--fp-surface);border:1px solid var(--fp-border);border-radius:15px}
#billingNav{margin-top:20px}
#app>nav>a,#app>nav>button,#billingNav>button,#billingNav>a,#navigation>button{min-width:0;width:100%;min-height:58px;display:flex;align-items:center;justify-content:flex-start;padding:12px 14px!important;border:1px solid #56644e;border-radius:10px;background:#343d3a!important;color:#e7eee9!important;box-shadow:none;font:600 13px/1.4 system-ui,sans-serif;text-align:left;text-decoration:none;overflow-wrap:anywhere}
#app>nav>button.active,#app>nav>a.active,#billingNav>button[aria-pressed=true],#navigation>button[aria-pressed=true]{background:var(--fp-green)!important;color:#182018!important;border-color:var(--fp-green);box-shadow:0 3px 12px #141b1426}
#navigation{gap:9px}
#app>.pane{background:var(--fp-surface);padding:24px}
#app>.pane h1{font-size:25px}
body:has(#navigation) main{max-width:1240px;gap:20px}
body:has(#navigation) main>.card{background:var(--fp-surface);border-color:var(--fp-border)}
body:has(#navigation) main>.card:first-of-type{padding:22px}
dialog{background:var(--fp-surface);color:var(--fp-text);width:min(420px,calc(100vw - 32px));box-shadow:0 20px 70px #0008}
dialog::backdrop{background:#111a}
}
@media screen and (max-width:600px){
header{padding:16px}
header>b,header>strong{font-size:18px}
main{padding:12px}
.card,#app>.pane{padding:18px;border-radius:14px;margin-bottom:16px}
h1,#app>.pane h1{font-size:23px}
h2{font-size:19px}
.grid{grid-template-columns:minmax(0,1fr);gap:12px}
#app>nav,#billingNav{padding:12px;gap:9px;margin-bottom:16px;border-radius:14px}
#app>nav>a,#app>nav>button,#billingNav>button,#billingNav>a,#navigation>button{font-size:12px;min-height:56px;padding:11px 12px!important}
.item,.direct-row,.entry{padding:14px}
.actions{gap:9px}
.actions>button{max-width:100%}
th,td{padding:10px 9px}
#invoiceMetrics,#revenueTotals{grid-template-columns:minmax(0,1fr)}
#invoiceMetrics>.card,#revenueTotals>.card{margin:0;padding:16px}
#invoiceMetrics h2,#revenueTotals h2{font-size:24px}
body:has(#navigation) main>.card:first-of-type{padding:18px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

@media screen{a.map-button{display:inline-flex;align-items:center;min-height:44px;padding:11px 16px;border:1px solid #64716a;border-radius:9px;background:#3b4544;color:#f0f5f1;text-decoration:none;font-size:13px;font-weight:600}a.map-button[hidden]{display:none}}

/* Slip item fields: prevent narrow labels and controls overflowing on phones. */
@media screen{
#items .item.row{display:grid;grid-template-columns:minmax(130px,1.1fr) minmax(180px,3fr) minmax(76px,.6fr) 44px;gap:12px;align-items:end}
#items .item.row>div{min-width:0!important;width:auto;flex:initial!important}
#items .item.row label{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-size:12px!important;line-height:1.4;font-weight:600;margin:0 0 7px;white-space:normal;overflow-wrap:normal;word-break:normal}
#items .item.row input,#items .item.row select{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-size:16px!important;width:100%;min-width:0;height:46px;padding:10px 11px}
#items .item.row button.danger{width:44px;height:46px;min-height:46px;padding:0;display:flex;align-items:center;justify-content:center;font-size:18px}
}
@media screen and (max-width:700px){
#items .item.row{grid-template-columns:minmax(0,1fr) minmax(76px,.55fr) 44px;gap:12px;padding:14px}
#items .item.row>div:nth-child(1){grid-column:1/-1}
#items .item.row>div:nth-child(2){grid-column:1/-1}
#items .item.row>div:nth-child(3){grid-column:1/3}
#items .item.row>div:nth-child(4){grid-column:3;align-self:end}
}