:root{color-scheme:dark;--bg:#070d15;--panel:#0e1825;--surface:#111e2d;--line:#24364a;--muted:#91a3b7;--text:#edf5fc;--blue:#64c7ff;--blue-deep:#168bd2;--green:#70d8ad;--danger:#ffab9d;--radius:22px;font-family:"Segoe UI",Inter,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at 78% 0,#10283c 0,transparent 35%),var(--bg);color:var(--text);font-size:16px}button,input{font:inherit}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button,input,[tabindex]{outline-offset:4px}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--blue)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.topbar{height:90px;padding:0 clamp(22px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;background:#07101ae8;backdrop-filter:blur(14px)}.brand{font-size:24px;font-weight:650;letter-spacing:.22em;background:linear-gradient(112deg,#91a4b4,#fff 43%,#8fa6b9 59%,#f5f9fc 78%);-webkit-background-clip:text;background-clip:text;color:transparent}.brand-sub,.login-brand>span{display:block;margin-top:7px;font-size:10px;letter-spacing:.32em;color:#76bcf0}.top-right{display:flex;align-items:center;gap:15px}.demo-badge{padding:7px 10px;border:1px solid #64c7ff35;border-radius:7px;color:#a8ddff;font-size:11px;letter-spacing:.08em}.signed-user{font-size:12px;color:var(--muted)}
.ghost,.primary{border-radius:11px;padding:12px 17px;display:inline-flex;align-items:center;justify-content:center;gap:12px}.ghost{border:1px solid var(--line);background:#ffffff04;font-size:13px}.ghost:hover{border-color:#54789a;background:#ffffff09}.primary{border:1px solid #b6e6ff;background:linear-gradient(112deg,#bce8ff,#78c9ff);color:#06243a;font-weight:700;box-shadow:0 10px 30px #168bd21c}.primary:hover{background:#d5f1ff}
.app-shell{max-width:1240px;margin:auto;padding:42px 32px 28px}.page-top{display:flex;justify-content:space-between;align-items:flex-end;gap:26px;margin-bottom:28px}.overline{font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--blue)}h1{font-size:clamp(34px,4vw,52px);line-height:1.05;letter-spacing:-.055em;margin:13px 0 14px;font-weight:580}.page-top p,.login-card>p{color:var(--muted);margin:0;line-height:1.7}.steps{display:flex;list-style:none;padding:0;margin:0 0 5px;gap:14px}.steps li{display:flex;align-items:center;gap:8px;font-size:12px;color:#8293a6}.steps li+li:before{content:"";width:20px;height:1px;background:var(--line);margin-right:5px}.steps b{width:26px;height:26px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:10px}.steps [aria-current="step"]{color:var(--blue)}.steps [aria-current="step"] b{border-color:#4ca9e1;background:#11344d}
.workspace{display:grid;grid-template-columns:1.15fr .85fr;gap:22px}.panel{background:linear-gradient(140deg,#111d2b,#0b131e);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 24px 72px #0003;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:25px 28px 0}.panel-head h2{font-size:17px;margin:0;font-weight:600}.count{font-size:10px;letter-spacing:.13em;color:var(--muted)}
.search{position:relative;margin:18px 27px 0}.search>span{position:absolute;left:15px;top:8px;font-size:27px;line-height:1;color:#8297ab;transform:rotate(-18deg)}.search input{width:100%;height:48px;border:1px solid var(--line);border-radius:12px;background:#08111c;color:var(--text);padding:0 44px;font-size:14px}.search input::placeholder{color:#71859c}.search button{position:absolute;right:7px;top:7px;width:34px;height:34px;border:0;background:transparent;font-size:20px;color:#9cadbd}
.wheel-stage{height:348px;position:relative;margin:10px 18px 0;isolation:isolate}.wheel-stage:before,.wheel-stage:after{content:"";position:absolute;z-index:3;left:0;right:0;height:92px;pointer-events:none}.wheel-stage:before{top:0;background:linear-gradient(#0f1926f3,transparent)}.wheel-stage:after{bottom:0;background:linear-gradient(transparent,#0d1621f5)}.selection-band{position:absolute;z-index:0;left:5px;right:5px;top:132px;height:84px;border:1px solid #6ec9ff8c;border-radius:16px;background:linear-gradient(100deg,#16405d6b,#16283c52);box-shadow:inset 0 0 22px #54bbff0a,0 0 35px #168bd212}.selection-band:before{content:"";position:absolute;left:-1px;top:26px;width:3px;height:30px;border-radius:4px;background:#8bd8ff;box-shadow:0 0 15px #62c6ff}.wheel{height:348px;padding:132px 12px;overflow-y:auto;scrollbar-width:none;scroll-snap-type:y mandatory;overscroll-behavior:contain;position:relative;z-index:1;perspective:720px}.wheel::-webkit-scrollbar{display:none}.customer-option{height:84px;padding:12px 16px;display:flex;align-items:center;gap:15px;scroll-snap-align:center;cursor:pointer;user-select:none;transform-origin:center;transform:rotateX(var(--tilt,0deg)) scale(var(--scale,1));opacity:var(--opacity,1);transition:opacity .12s}.monogram{width:44px;height:44px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #ffffff13;border-radius:13px;background:#203247;color:#bfd0df;font-weight:700;font-size:13px}.customer-option strong{display:block;font-size:17px;letter-spacing:-.025em}.customer-option small{display:block;margin-top:5px;color:var(--muted);font-size:11px}.option-check{margin-left:auto;color:var(--blue);font-size:22px;opacity:0}.customer-option[aria-selected="true"] .option-check{opacity:1}.customer-option[aria-selected="true"] .monogram{background:linear-gradient(140deg,#285f89,#16334c);border-color:#70caff5c;color:#e1f4ff}.wheel-hint{padding:0 27px 22px;display:flex;justify-content:space-between;align-items:center;gap:15px}.wheel-hint p{margin:0;color:#8294a8;font-size:11px;line-height:1.65}.wheel-hint>div{display:flex;gap:7px}.wheel-hint button{width:35px;height:33px;border:1px solid var(--line);border-radius:8px;background:#121f2d}.empty{position:absolute;inset:0;z-index:4;display:grid;place-content:center;text-align:center;color:var(--muted);gap:7px}.empty strong{color:var(--text);font-size:18px}
.detail{padding:29px;display:flex;flex-direction:column}.detail-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.status{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--green)}.status:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}.detail-icon{width:62px;height:62px;display:grid;place-items:center;border:1px solid #5ea8d74a;border-radius:17px;background:linear-gradient(145deg,#244b69,#122536);font-size:21px;color:#d7efff;font-weight:700}.detail h2{font-size:clamp(25px,3vw,34px);line-height:1.15;letter-spacing:-.045em;margin:20px 0 8px}.sector{color:var(--muted);font-size:13px;margin:0}.facts{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:27px 0 22px;padding:20px 0;border-block:1px solid var(--line)}.facts dt{font-size:10px;color:#8194a7;margin-bottom:7px}.facts dd{font-size:13px;margin:0}.detail-note{color:var(--muted);font-size:12px;line-height:1.75;margin:0 0 24px}.detail .primary{width:100%;margin-top:auto}
.history{margin-top:22px}.history .panel-head{padding-bottom:22px}.history .panel-head>div h2{margin-top:7px}.document-list{border-top:1px solid var(--line)}.document-row{display:grid;grid-template-columns:42px 1fr auto auto;align-items:center;gap:15px;padding:16px 28px;border-bottom:1px solid #ffffff0d}.file-badge{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#182d40;color:#9edaff;font-size:9px;font-weight:800}.document-copy{min-width:0}.document-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.document-copy small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.document-size{font-size:11px;color:#a8b8c8}.download{padding:9px 12px;border:1px solid var(--line);border-radius:9px;color:#bfe8ff;text-decoration:none;font-size:11px}.empty-history{padding:25px 28px;margin:0;color:var(--muted);font-size:13px}.bottom-note{display:flex;justify-content:space-between;gap:20px;padding:22px 2px;color:#718399;font-size:11px}
dialog{width:min(650px,calc(100% - 28px));max-height:92svh;padding:0;border:1px solid #405a74;border-radius:23px;background:linear-gradient(145deg,#142335,#09121d);color:var(--text);box-shadow:0 45px 130px #000b}dialog::backdrop{background:#020811c7;backdrop-filter:blur(8px)}.modal-body{padding:30px}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.dialog-head h2{margin:9px 0 0;font-size:29px;letter-spacing:-.04em}.close{width:36px;height:36px;border:1px solid var(--line);border-radius:9px;background:#ffffff06;font-size:22px}.customer-lock{display:flex;align-items:center;gap:12px;margin:22px 0;padding:13px 15px;border:1px solid #42617d;border-radius:11px;background:#173149}.customer-lock span{width:34px;height:34px;border-radius:8px;background:#285574;display:grid;place-items:center;font-size:11px}.customer-lock strong{font-size:13px}.dropzone{padding:29px 20px;text-align:center;border:1px dashed #4e7493;border-radius:16px;background:#0a1724;transition:.2s}.dropzone.dragover{background:#133c57;border-color:#98dcff}.upload-icon{font-size:36px;color:#8dd5ff}.dropzone p{font-size:16px;font-weight:600;margin:8px 0}.dropzone small{display:block;margin-bottom:16px;color:var(--muted);font-size:11px}.modal-meta{color:#8ea1b5;font-size:11px;line-height:1.6}.file-list{list-style:none;padding:0;margin:15px 0;max-height:190px;overflow:auto}.file-list li{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}.file-list strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-list small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.remove{border:0;background:transparent;color:#a9b9c8;font-size:20px}.form-message{min-height:19px;font-size:12px;line-height:1.55}.form-message.error{color:var(--danger)}.progress{height:5px;border-radius:9px;background:#213a4f;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#3caeec,#b1e8ff);transition:width .15s}.modal-actions{display:flex;justify-content:flex-end;gap:11px;margin-top:20px}.success-panel{text-align:center;padding:23px 0 8px}.success-icon{width:68px;height:68px;margin:0 auto 20px;border:1px solid #4a8d72;border-radius:50%;display:grid;place-items:center;background:#153b2e;color:#a8e8ca;font-size:28px}.success-panel h3{font-size:27px;margin:14px 0 8px}.success-panel p{color:var(--muted);line-height:1.7}.success-panel .primary{width:100%;margin-top:15px}
.login-page{display:grid;place-items:center;padding:24px}.login-shell{width:min(980px,100%);min-height:620px;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:#0b1521;box-shadow:0 45px 130px #0008}.login-brand{position:relative;padding:48px;overflow:hidden;background:radial-gradient(circle at 65% 50%,#164766 0,transparent 44%),#07111c}.login-brand p{position:absolute;bottom:46px;left:48px;right:48px;color:#a3b7ca;line-height:1.8;max-width:360px}.login-visual{position:absolute;inset:24% 12%;display:grid;place-items:center}.login-visual i{position:absolute;width:260px;height:260px;border:1px solid #57c4ff36;border-radius:50%;box-shadow:0 0 55px #138dd41a}.login-visual i:nth-child(2){width:190px;height:190px;border-style:dashed;animation:orbit 18s linear infinite}.login-visual i:nth-child(3){width:70px;height:70px;border-color:#a7e3ff;background:#65c7ff0d;box-shadow:0 0 45px #55c5ff4f}@keyframes orbit{to{transform:rotate(360deg)}}.login-card{padding:64px 55px;display:flex;flex-direction:column;justify-content:center}.login-card h1{font-size:42px}.login-card form{margin-top:24px}.login-card label{display:block;margin:17px 0 8px;color:#b2c2d1;font-size:12px}.login-card input{width:100%;height:48px;border:1px solid #3b526a;border-radius:11px;background:#07111d;color:var(--text);padding:0 14px}.password-field{position:relative}.password-field input{padding-right:85px}.password-field button{position:absolute;right:7px;top:7px;height:34px;border:0;background:transparent;color:#8fcff5;font-size:11px}.login-card .primary{width:100%;margin-top:20px}.demo-credentials{display:grid;gap:5px;margin-top:25px;padding:14px;border:1px solid #34516a;border-radius:11px;background:#10263a;color:#bad4e7;font-size:11px}.demo-credentials strong{color:#73cfff;text-transform:uppercase;letter-spacing:.12em;font-size:9px}.login-card>small{color:#718499;font-size:10px;margin-top:18px}
@media(max-width:850px){.steps{display:none}.workspace{grid-template-columns:1fr}.login-shell{grid-template-columns:1fr;min-height:auto}.login-brand{min-height:210px}.login-brand p{bottom:25px}.login-visual{display:none}.login-card{padding:45px}.signed-user{display:none}}
@media(max-width:600px){.topbar{height:78px;padding:0 18px}.brand{font-size:19px}.demo-badge{display:none}.app-shell{padding:28px 14px}.page-top{margin-bottom:20px}.wheel-stage,.wheel{height:306px}.wheel{padding-block:111px}.selection-band{top:111px}.customer-option strong{font-size:15px}.detail{padding:23px}.history .panel-head{align-items:flex-start}.document-row{grid-template-columns:38px 1fr auto;padding:14px 18px}.document-size{display:none}.modal-body{padding:22px}.modal-actions{flex-wrap:wrap}.modal-actions .primary{flex:1}.login-page{padding:0}.login-shell{border:0;border-radius:0;min-height:100vh}.login-brand{min-height:175px;padding:30px}.login-brand p{left:30px;bottom:20px}.login-card{padding:36px 25px}.login-card h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.customer-option{transform:none!important}}

/* POC 2.0 — persistent customer management */
.panel-tools{display:flex;align-items:center;gap:14px}.compact-action{border:1px solid #4c7596;border-radius:9px;background:#10283b;color:#bfe8ff;padding:8px 11px;font-size:11px;font-weight:650}.compact-action:hover{border-color:#75c9f7;background:#16344b}.facts{grid-template-columns:repeat(3,1fr)}.dialog-intro{margin:18px 0 22px;color:var(--muted);font-size:13px;line-height:1.65}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.field{display:grid;gap:8px}.field-wide{grid-column:1/-1}.field span{color:#b8c9d8;font-size:12px}.field input,.field select{width:100%;height:48px;border:1px solid #3b526a;border-radius:11px;background:#07111d;color:var(--text);padding:0 14px}.field input::placeholder{color:#60758a}.field select{color-scheme:dark}.customer-form .form-message{margin-bottom:0}
@media(max-width:600px){.panel-head{align-items:flex-start}.panel-tools{align-items:flex-end;flex-direction:column;gap:8px}.compact-action{white-space:nowrap}.facts{grid-template-columns:1fr 1fr}.facts>div:last-child{grid-column:1/-1}.form-grid{grid-template-columns:1fr}.field-wide{grid-column:auto}}

/* Docker 1.4 — account and safe customer management */
.detail-actions{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-top:auto}.detail-actions .primary{width:auto;margin-top:0}.danger-action{color:#ffc2b8;border-color:#6e413d}.danger-action:hover{border-color:#c76d62;background:#4b2422}.danger-button{border:1px solid #e58a7d;border-radius:11px;padding:12px 17px;background:#6f2d2a;color:#fff;font-weight:700}.danger-button:hover{background:#8b3732}.danger-button:disabled{opacity:.45}.compact-dialog{max-width:610px}.password-form-fields{display:grid;gap:15px}.password-hint{margin:12px 0 0;color:var(--muted);font-size:11px;line-height:1.55}.success-message{color:var(--green)}
@media(max-width:600px){.detail-actions{grid-template-columns:1fr}.top-right{gap:7px}.top-right .ghost{padding:9px 10px;font-size:11px}}

/* Docker 1.5 — guided client interview */
.facts{grid-template-columns:repeat(2,1fr)}.detail-actions{grid-template-columns:auto 1fr}.detail-actions .primary{grid-column:1/-1}.interview-action{border:1px solid #80d4ff;border-radius:11px;padding:12px 17px;background:linear-gradient(120deg,#173d59,#102b42);color:#d6f2ff;font-weight:700}.interview-action:hover{background:#1b4969}.interview-action:disabled{opacity:.4}.interview-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.interview-benefits span{padding:11px;border:1px solid var(--line);border-radius:10px;background:#0a1724;color:#b9d8ea;font-size:11px}.copy-field{display:grid;grid-template-columns:1fr auto}.copy-field input{border-radius:11px 0 0 11px}.copy-field button{border:1px solid #5592ba;border-left:0;border-radius:0 11px 11px 0;background:#17344b;color:#bde8ff;padding:0 15px}.link-expiry{color:var(--muted);font-size:11px;margin:11px 0}.profile-link{color:#8ed9ff;text-underline-offset:3px}
.interview-page{min-height:100vh;background:radial-gradient(circle at 80% 10%,#123b58 0,transparent 34%),linear-gradient(145deg,#050c14,#091522 58%,#07101a);color:var(--text)}.interview-topbar{height:82px;padding:0 clamp(20px,5vw,70px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#07111bd9;backdrop-filter:blur(16px)}.secure-label{font-size:11px;color:#91dcbb;letter-spacing:.04em}.interview-shell{width:min(880px,calc(100% - 30px));margin:clamp(28px,6vh,68px) auto}.interview-progress{margin-bottom:19px}.interview-progress>div:first-child{display:flex;justify-content:space-between;color:#9fb2c3;font-size:11px;letter-spacing:.05em}.progress-track{height:4px;margin-top:10px;border-radius:10px;background:#1a2a39;overflow:hidden}.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#209ee6,#a7e4ff);box-shadow:0 0 15px #4cc2ff;transition:width .3s ease}.conversation-card{min-height:460px;display:grid;grid-template-columns:54px 1fr;gap:22px;padding:clamp(25px,5vw,52px);border:1px solid #29465d;border-radius:24px;background:linear-gradient(145deg,#111f2d,#09131e);box-shadow:0 30px 90px #0005}.assistant-mark{width:52px;height:52px;border:1px solid #76cffd;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#225a80,#102e45);color:#d7f2ff;font-size:13px;font-weight:800;box-shadow:0 0 30px #31aee424}.assistant-name{color:#6dc9fa;font-size:10px;font-weight:800;letter-spacing:.16em}.conversation-card h1{max-width:680px;margin:13px 0 12px;font-size:clamp(27px,4vw,42px);line-height:1.14;letter-spacing:-.045em}.context-line,.question-help,.complete-card p,.error-card p{color:var(--muted);line-height:1.7;font-size:14px}.context-line{margin:9px 0 4px}.question-help{margin:0 0 24px}.answer-area{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.answer-option{position:relative}.answer-option input{position:absolute;opacity:0;pointer-events:none}.answer-option span{min-height:52px;padding:14px 16px;display:flex;align-items:center;border:1px solid #344d62;border-radius:12px;background:#091622;color:#c0d0dd;font-size:13px;cursor:pointer;transition:.15s}.answer-option span:before{content:"";width:9px;height:9px;margin-right:11px;border:1px solid #65839b;border-radius:50%;box-shadow:inset 0 0 0 2px #091622}.answer-option input:checked+span{border-color:#6ecbfc;background:#15344b;color:#effaff;box-shadow:0 0 25px #1aa3e614}.answer-option input:checked+span:before{background:#74d0ff;border-color:#b9ebff}.answer-option input:focus-visible+span{outline:2px solid #a8e3ff;outline-offset:2px}.number-answer{display:flex;align-items:center;width:min(320px,100%);height:58px;border:1px solid #41617a;border-radius:13px;background:#07121d}.number-answer input{width:100%;height:100%;border:0;background:transparent;color:var(--text);padding:0 17px;font-size:22px}.number-answer span{padding-right:17px;color:var(--muted);font-size:12px}.answer-area textarea{grid-column:1/-1;width:100%;resize:vertical;border:1px solid #41617a;border-radius:13px;background:#07121d;color:var(--text);padding:16px;font:inherit;line-height:1.6}.interview-nav{display:flex;justify-content:space-between;gap:12px;margin-top:25px}.complete-card,.error-card{align-items:center;min-height:330px}.complete-card .success-icon{margin:0}.interview-notice{display:flex;gap:18px;margin:16px 4px;color:#75899b;font-size:10px;line-height:1.55}.interview-notice strong{flex:0 0 auto;color:#9badbc}
@media(max-width:650px){.interview-benefits{grid-template-columns:1fr}.interview-topbar{height:72px}.secure-label{font-size:9px}.conversation-card{grid-template-columns:1fr;min-height:500px}.assistant-mark{width:44px;height:44px}.answer-area{grid-template-columns:1fr}.interview-nav{align-items:stretch;flex-direction:column-reverse}.interview-nav button{width:100%}.interview-notice{flex-direction:column;gap:4px}.copy-field{grid-template-columns:1fr}.copy-field input{border-radius:11px}.copy-field button{height:42px;border:1px solid #5592ba;border-radius:11px;margin-top:8px}}

/* Docker 1.6 — controlled deletion and office upload policy */
.action-notice{margin:-8px 0 22px;padding:14px 17px;border:1px solid #43866d;border-radius:12px;background:#103126;color:#b9efd7;font-size:14px;line-height:1.5}.delete-warning,.zip-risk{padding:16px;border:1px solid #75504b;border-radius:13px;background:#351d1c;color:#ffd1c9}.delete-warning{display:grid;gap:6px;margin:-3px 0 20px}.delete-warning strong,.zip-risk strong{font-size:14px}.delete-warning span,.zip-risk p{color:#d8aaa4;font-size:13px;line-height:1.6}.confirmation-check{display:flex;align-items:flex-start;gap:11px;color:#cbd8e3;font-size:14px;line-height:1.55}.confirmation-check input{width:18px;height:18px;flex:0 0 auto;margin-top:2px;accent-color:#49b9f5}#settingsDialog{width:min(760px,calc(100% - 28px))}.settings-dialog{width:100%}.settings-section{padding:24px 0;border-bottom:1px solid var(--line)}.settings-section>div:first-child h3{margin:0 0 6px;font-size:20px}.settings-section>div:first-child p{margin:0 0 18px;color:var(--muted);font-size:14px;line-height:1.6}.format-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.format-choice{position:relative}.format-choice input{position:absolute;opacity:0;pointer-events:none}.format-choice>span{min-height:67px;padding:13px 15px;display:grid;align-content:center;border:1px solid #344d62;border-radius:12px;background:#091622;cursor:pointer;transition:.15s}.format-choice b{font-size:14px}.format-choice small{margin-top:5px;color:var(--muted);font-size:12px}.format-choice input:checked+span{border-color:#61c8ff;background:#15384f;box-shadow:inset 3px 0 #70d1ff}.format-choice input:focus-visible+span{outline:2px solid var(--blue);outline-offset:3px}.zip-choice{grid-column:1/-1}.zip-choice input:checked+span{border-color:#d89479;background:#40261f;box-shadow:inset 3px 0 #ffad8a}.zip-risk{margin-top:13px}.zip-risk p{margin:7px 0 14px}.zip-risk .confirmation-check{color:#ffe0da}.settings-footer{display:flex;justify-content:flex-end;padding-top:20px}
@media(max-width:600px){.format-grid{grid-template-columns:1fr}.zip-choice{grid-column:auto}.settings-section{padding:20px 0}.settings-dialog{width:100%}}
#uploadSettingsDialog{width:min(760px,calc(100% - 28px))}.detail-actions{grid-template-columns:auto auto 1fr}.detail-actions .primary{grid-column:1/-1}.format-action{color:#bfe8ff}
@media(max-width:600px){.detail-actions{grid-template-columns:1fr}}

/* Docker 1.7 — complete customer record and append-only history */
.field textarea{width:100%;min-height:112px;resize:vertical;border:1px solid #3b526a;border-radius:11px;background:#07111d;color:var(--text);padding:13px 14px;font:inherit;line-height:1.55}.file-action{color:#d9f2ff;border-color:#477693}.customer-file-dialog{width:100%}#customerFileDialog{width:min(900px,calc(100% - 28px))}.customer-record-grid{margin-top:22px}.audit-section{margin-top:30px;padding-top:25px;border-top:1px solid var(--line)}.audit-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.audit-head h3{margin:7px 0 0;font-size:21px}.audit-seal{padding:7px 10px;border:1px solid #3e8069;border-radius:999px;background:#102f26;color:#9fe2c2;font-size:11px}.audit-seal.invalid{border-color:#9c554c;background:#3a211f;color:#ffc2b8}.audit-list{display:grid;gap:10px;max-height:330px;overflow:auto;margin-top:18px;padding-right:5px}.audit-entry{display:grid;grid-template-columns:14px 1fr;gap:12px;padding:14px;border:1px solid #263d51;border-radius:12px;background:#081522}.audit-entry:before{content:"";width:8px;height:8px;margin-top:5px;border-radius:50%;background:#5cc8ff;box-shadow:0 0 12px #5cc8ff66}.audit-entry strong{font-size:13px}.audit-entry small{display:block;margin-top:5px;color:var(--muted);font-size:11px}.audit-changes{margin:9px 0 0;padding-left:18px;color:#b9c9d6;font-size:12px;line-height:1.55}.status[data-state="wartend"]{color:#e6c271}.status[data-state="inaktiv"]{color:#9aa8b4}.status[data-state="aktiv"]{color:var(--green)}
@media(max-width:600px){#customerFileDialog{width:calc(100% - 16px)}.audit-head{align-items:flex-start;flex-direction:column}.customer-file-dialog{padding:20px}.detail-actions{grid-template-columns:1fr}}
.customer-view-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 18px 0}.customer-view-controls label{display:grid;gap:5px}.customer-view-controls span{color:#8194a7;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.customer-view-controls select{height:38px;border:1px solid #30485d;border-radius:9px;background:#091522;color:#c9d8e4;padding:0 10px;font-size:12px;color-scheme:dark}

/* Docker 1.8 — document workspace and animated MAIXXIAM mark */
.page-top-brand{display:grid;justify-items:end;gap:12px}.brand-logo-stage{position:relative;display:inline-grid;width:168px;height:78px;perspective:560px;isolation:isolate;vertical-align:middle}.brand-logo-stage>.brand-name{grid-area:1/1;align-self:start;z-index:2}.brand-logo-orbit{position:absolute;z-index:1;left:-.55px;top:-4px;width:calc(100% + 1.1px);height:74px;overflow:visible;pointer-events:none}.brand-logo-orbit path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}.brand-orbit-rear-glow{stroke:rgba(21,157,255,.18);stroke-width:3;filter:blur(1.2px)}.brand-orbit-rear-line{stroke:rgba(82,194,255,.34);stroke-width:.54}.brand-orbit-front-glow{stroke:rgba(21,157,255,.44);stroke-width:3.4;filter:drop-shadow(0 0 3px rgba(21,157,255,.82)) drop-shadow(0 0 7px rgba(21,157,255,.42))}.brand-orbit-front-line{stroke:#55cbff;stroke-width:.78;filter:drop-shadow(0 0 1.5px rgba(216,247,255,.9))}.brand-name{position:relative;display:inline-grid;width:168px;height:54px;transform-origin:50% 50%;transform-style:preserve-3d;animation:maixxiam-horizontal-turn 8s linear infinite;font-size:20px;font-weight:600;letter-spacing:.17em}.brand-name>span{grid-area:1/1;display:grid;place-items:center;white-space:nowrap;font:inherit;letter-spacing:inherit}.brand-face{position:relative;width:100%;height:100%;backface-visibility:hidden}.brand-logo-word{position:relative;z-index:2;display:block;line-height:54px;top:-8px}.brand-logo-arrows{position:absolute;z-index:1;inset:-3px -10px;width:calc(100% + 20px);height:60px;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.logo-arrow-solid-depth,.logo-arrow-solid{stroke:none}.logo-arrow-solid-depth{opacity:.88;filter:drop-shadow(0 1.5px 1.5px rgba(0,0,0,.78))}.logo-arrow-depth-far{opacity:.66;filter:drop-shadow(0 2px 2px rgba(0,0,0,.82))}.logo-arrow-specular{fill:none;stroke-width:.39;opacity:.80}.logo-arrow-blue-depth{fill:#034b78}.logo-arrow-blue-solid{fill:#079de9;filter:drop-shadow(0 0 3px rgba(21,157,255,.5))}.logo-arrow-blue-specular{stroke:#46c7ff}.logo-arrow-metal-depth{fill:#444d52}.logo-arrow-metal-solid{fill:#aeb8bd;filter:drop-shadow(0 2px 2px rgba(0,0,0,.65))}.logo-arrow-metal-specular{stroke:#f4f7f8}.brand-arrow-face{position:absolute;z-index:1;inset:0;transform:translateZ(-2.8px);transform-style:preserve-3d}.brand-front{color:#fff;transform:translateZ(4px);text-shadow:0 0 8px rgba(255,255,255,.16)}.brand-front .brand-logo-word{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(110deg,#6f7d84 0%,#f8fbfc 22%,#aab4b9 43%,#fff 56%,#7c8a91 75%,#e5ecef 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(1px 3px 2px rgba(0,0,0,.72))}.brand-front .brand-ai{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(110deg,#0568ac,#1eb5ff 45%,#087fc7 72%,#52c5ff);-webkit-background-clip:text;background-clip:text;text-shadow:0 0 9px rgba(21,157,255,.48)}.brand-back{color:#159dff;transform:rotateY(180deg) translateZ(4px) scaleX(-1);text-shadow:0 0 9px rgba(21,157,255,.45)}.brand-back .brand-logo-word{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(110deg,#0568ac,#25b9ff 42%,#087fc7 70%,#54c8ff);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(1px 3px 2px rgba(0,0,0,.72))}.brand-back .brand-ai{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(110deg,#6f7d84,#f8fbfc 35%,#9ca8ae 65%,#fff);-webkit-background-clip:text;background-clip:text;text-shadow:0 0 8px rgba(255,255,255,.30)}.brand-depth{position:relative;top:-8px;color:#0c6fa8;transform:translateZ(var(--brand-z));text-shadow:0 0 5px rgba(21,157,255,.18);line-height:54px}@keyframes maixxiam-horizontal-turn{from{transform:rotateY(0deg)}to{transform:rotateY(360deg)}}
.document-controls{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(3,minmax(145px,1fr));gap:10px;padding:0 28px 20px}.document-controls label{display:grid;gap:6px}.document-controls label>span{color:#8194a7;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.document-controls input,.document-controls select{height:42px;border:1px solid #30485d;border-radius:10px;background:#081521;color:#d7e6f0;padding:0 12px;font:inherit;font-size:12px;color-scheme:dark}.document-controls input:focus,.document-controls select:focus{outline:2px solid #50bdf2;outline-offset:1px}.document-row{grid-template-columns:42px minmax(0,1fr) auto auto}.document-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.document-tags span{padding:4px 7px;border:1px solid #2c4a60;border-radius:999px;background:#0f2333;color:#a9c4d7;font-size:9px;text-transform:uppercase;letter-spacing:.06em}.document-tags [data-document-state="pruefung"]{border-color:#74602e;color:#ead28c}.document-tags [data-document-state="rueckfrage"]{border-color:#814b42;color:#ffb8aa}.document-tags [data-document-state="erledigt"]{border-color:#347258;color:#9de2bf}.document-actions{display:flex;gap:7px;align-items:center}.document-actions button{background:transparent;font:inherit;cursor:pointer}.document-lock{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid #2e4b61;border-radius:13px;background:#091725}.document-lock>span{width:46px;height:46px;display:grid;place-items:center;border-radius:10px;background:#17344a;color:#9fddff;font-size:10px;font-weight:800}.document-lock div{min-width:0}.document-lock strong,.document-lock small{display:block}.document-lock strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.document-lock small{margin-top:5px;color:var(--muted);font-size:11px}.document-quick-actions{display:flex;gap:9px;margin:14px 0 22px}.ghost-link{padding:10px 13px;border:1px solid #395a71;border-radius:9px;color:#bfe8ff;text-decoration:none;font-size:12px}.document-form-grid{margin-top:0}#documentDialog{width:min(760px,calc(100% - 28px))}
@media(prefers-reduced-motion:reduce){.brand-name{animation:none!important}.brand-depth,.brand-back{display:none}}
@media(max-width:850px){.page-top{align-items:flex-start}.page-top-brand{display:none}.document-controls{grid-template-columns:1fr 1fr}.document-search{grid-column:1/-1}.document-row{grid-template-columns:42px minmax(0,1fr)}.document-size{display:none}.document-actions{grid-column:2;flex-wrap:wrap}}
@media(max-width:600px){.document-controls{grid-template-columns:1fr;padding:0 18px 18px}.document-search{grid-column:auto}.document-actions{grid-column:1/-1}.document-actions .download{flex:1;text-align:center}.document-quick-actions{flex-direction:column}.ghost-link{text-align:center}}

/* Docker 1.8 layout refinements */
.topbar-logo-slot{display:block;width:168px;height:78px;flex:0 0 168px;color:inherit;text-decoration:none}.topbar-logo-slot .brand-logo-stage{display:inline-grid}.page-top-brand>.hub-brand-logo{visibility:hidden}.topbar-link{padding:10px 12px;border:1px solid var(--line);border-radius:10px;color:#bfe8ff;text-decoration:none;font-size:13px}.topbar-link:hover{border-color:#54789a;background:#ffffff09}.brand-logo-word{position:absolute!important;left:50%!important;top:50%!important;line-height:1!important;transform:translate(-50%,-50%)!important}.brand-depth{top:auto!important;line-height:1!important}.detail-actions .interview-action{grid-column:1/-1;width:100%;white-space:nowrap;font-size:13px}.detail-actions .primary{width:100%}
@media(max-width:700px){.topbar-logo-slot{width:145px;height:70px;flex-basis:145px;transform:scale(.86);transform-origin:left center;margin-right:-20px}.topbar-link{display:none}}

/* Dedicated document library */
.documents-page .app-shell{max-width:1440px}.library-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.library-heading h1{margin-bottom:8px}.library-heading p{margin:0;color:var(--muted)}.library-actions{display:flex;gap:10px}.library-panel{overflow:visible}.library-controls{display:grid;grid-template-columns:minmax(230px,1.7fr) repeat(4,minmax(145px,1fr));gap:10px;padding:24px}.library-controls label{display:grid;gap:6px}.library-controls span{color:#8194a7;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.library-controls input,.library-controls select{width:100%;height:44px;border:1px solid #30485d;border-radius:10px;background:#081521;color:#d7e6f0;padding:0 12px;font:inherit;font-size:13px;color-scheme:dark}.library-summary{display:flex;justify-content:space-between;gap:15px;padding:0 25px 18px;color:var(--muted);font-size:12px}.library-table{border-top:1px solid var(--line)}.library-row{display:grid;grid-template-columns:46px minmax(220px,1.5fr) minmax(170px,1fr) 115px 115px auto;align-items:center;gap:14px;padding:16px 24px;border-bottom:1px solid #ffffff0d}.library-customer strong,.library-customer small{display:block}.library-customer small{margin-top:5px;color:var(--muted);font-size:11px}.library-row-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}.library-row-actions button{background:transparent;cursor:pointer}.library-delete{color:#ffc2b8;border-color:#6e413d}.library-upload-note{margin:12px 0 0;color:var(--muted);font-size:12px;line-height:1.6}.library-empty{padding:44px 24px;text-align:center;color:var(--muted)}#libraryEditDialog,#libraryUploadDialog,#libraryDeleteDialog{width:min(720px,calc(100% - 28px))}
@media(max-width:1050px){.library-controls{grid-template-columns:1fr 1fr 1fr}.library-controls .library-search{grid-column:1/-1}.library-row{grid-template-columns:42px minmax(0,1fr) 120px auto}.library-customer{grid-column:2}.library-row .library-type,.library-row .library-year{display:none}}
@media(max-width:650px){.library-heading{align-items:stretch;flex-direction:column}.library-actions{display:grid}.library-controls{grid-template-columns:1fr;padding:18px}.library-controls .library-search{grid-column:auto}.library-row{grid-template-columns:38px minmax(0,1fr);padding:15px 18px}.library-row>.document-status,.library-row>.document-size{display:none}.library-row-actions{grid-column:1/-1;justify-content:stretch}.library-row-actions>*{flex:1;text-align:center}.library-summary{flex-direction:column}.top-right .demo-badge{display:none}}
.document-status{font-size:12px;color:#a9c4d7}.document-status[data-document-state="pruefung"]{color:#ead28c}.document-status[data-document-state="rueckfrage"]{color:#ffb8aa}.document-status[data-document-state="erledigt"]{color:#9de2bf}

/* Docker 2.0 — Outlook-inspired customer document workspace */
.records-page{height:100vh;overflow:hidden}.records-page .topbar{height:72px;padding-inline:28px}.records-page .topbar-logo-slot{height:66px}.records-shell{height:calc(100vh - 72px);padding:22px 28px 28px;display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:16px;max-width:1920px;margin:auto}.records-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.records-heading h1{font-size:clamp(28px,3vw,42px);margin:7px 0 5px}.records-heading p{margin:0;color:var(--muted);font-size:13px}.records-heading-actions{display:flex;align-items:flex-end;gap:10px}.records-heading-actions label{display:grid;gap:6px}.records-heading-actions label span{font-size:9px;letter-spacing:.12em;color:#8194a7;text-transform:uppercase}.records-heading-actions select{min-width:310px;height:43px;border:1px solid #35516a;border-radius:10px;background:#0a1724;color:var(--text);padding:0 12px}.records-heading-actions .primary{height:43px;padding-block:0}.ledger-switcher{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.ledger-card{min-height:82px;display:flex;align-items:center;gap:15px;padding:14px 18px;text-align:left;border:1px solid var(--line);border-radius:15px;background:linear-gradient(135deg,#111f2e,#0b1520);color:var(--text);transition:.18s}.ledger-card:hover{border-color:#456985;transform:translateY(-1px)}.ledger-card.active{border-color:#5bbff2;background:linear-gradient(135deg,#17354d,#0c1d2c);box-shadow:0 8px 30px #168bd216,inset 0 0 35px #3abaff08}.ledger-card>span:last-child{display:grid;gap:2px}.ledger-card small{font-size:8px;letter-spacing:.16em;color:#7fa1b9}.ledger-card strong{font-size:17px}.ledger-card em{font-style:normal;font-size:10px;color:var(--muted)}.ledger-icon{width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #ffffff18;border-radius:12px;font-size:20px}.ledger-icon.expense{color:#ffc29f;background:#4a2a1e}.ledger-icon.income{color:#8ce1bc;background:#123d31}.ledger-icon.general{color:#9bdcff;background:#16354b}
.records-workbench{min-height:0;display:grid;grid-template-columns:245px minmax(460px,1fr) 355px;border:1px solid #294057;border-radius:18px;overflow:hidden;background:#09131d;box-shadow:0 25px 80px #0004}.folder-pane,.inspector-pane{min-width:0;background:#0d1926}.folder-pane{display:flex;flex-direction:column;border-right:1px solid var(--line)}.inspector-pane{border-left:1px solid var(--line);overflow:auto}.pane-title{padding:18px 19px 13px;display:grid;gap:5px;border-bottom:1px solid #ffffff0b}.pane-title strong{font-size:15px}.folder-path{display:flex;align-items:center;gap:7px;padding:12px 17px;color:#6f879a;font-size:9px;border-bottom:1px solid #ffffff0b}.folder-path span:last-child{color:#b8d8eb}.folder-tree{padding:8px;overflow:auto}.folder-group{display:grid}.folder-item,.folder-child{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:8px;background:transparent;color:#9db0c1;text-align:left}.folder-item{padding:9px 10px;font-size:11px}.folder-child{padding:7px 10px 7px 29px;font-size:10px}.folder-item b,.folder-child b{font-size:9px;font-weight:500;color:#61778a}.folder-item:hover,.folder-child:hover{background:#ffffff08;color:#d8e8f3}.folder-item.active,.folder-child.active{background:#16344a;color:#96ddff}.folder-group.disabled{opacity:.4}.folder-help{margin-top:auto;padding:15px 17px;border-top:1px solid #ffffff0b;background:#08121c}.folder-help span{color:#6fc9f8;font-size:8px;letter-spacing:.14em;text-transform:uppercase}.folder-help p{margin:6px 0 0;color:#72879a;font-size:9px;line-height:1.55}
.message-pane{min-width:0;display:grid;grid-template-rows:auto auto minmax(0,1fr);background:#08121c}.message-toolbar{display:grid;grid-template-columns:minmax(200px,1fr) 120px 130px;gap:8px;padding:13px;border-bottom:1px solid var(--line)}.message-toolbar input,.message-toolbar select{height:38px;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 10px;font-size:10px}.message-search{position:relative}.message-search span{position:absolute;left:12px;top:5px;color:#7591a6;font-size:21px;transform:rotate(-17deg)}.message-search input{width:100%;padding-left:37px}.message-list-head{display:grid;grid-template-columns:1fr 95px 95px 34px;gap:10px;padding:10px 18px;border-bottom:1px solid #ffffff0d;color:#637b90;font-size:8px;letter-spacing:.09em}.message-list{min-height:0;overflow:auto}.message-row{position:relative;display:grid;grid-template-columns:5px 38px minmax(170px,1fr) 95px 95px 34px;align-items:center;gap:11px;min-height:67px;padding:9px 17px;border-bottom:1px solid #ffffff0b;cursor:pointer;transition:.12s}.message-row:hover{background:#0e1c2a}.message-row.selected{background:linear-gradient(90deg,#17384f,#102639);box-shadow:inset 3px 0 #68ccff}.message-state{width:5px;height:5px;border-radius:50%;background:#6c8294}.message-state[data-state="neu"]{background:#69caff;box-shadow:0 0 8px #69caff}.message-state[data-state="rueckfrage"]{background:#ffb99d}.message-state[data-state="erledigt"]{background:#6ed8ab}.message-row .file-badge{width:36px;height:36px;border-radius:8px}.message-copy{min-width:0}.message-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.message-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px;color:#73899c;font-size:9px}.message-row time,.message-row>b{font-size:9px;color:#9eb1c1;font-weight:500}.message-row>b{text-align:right;color:#d8e8f2}.row-trash{width:31px;height:31px;display:grid;place-items:center;border:1px solid transparent;border-radius:8px;background:transparent;color:#8da0af;font-size:14px;cursor:pointer;opacity:.58;transition:.15s}.message-row:hover .row-trash,.row-trash:focus-visible{opacity:1;border-color:#684542;background:#2a191b;color:#ffb2a7}.row-trash:focus-visible{outline:2px solid #78d2fb;outline-offset:2px}.message-empty{height:100%;display:grid;place-content:center;justify-items:center;padding:30px;color:#71869a;text-align:center}.message-empty>span{font-size:37px;color:#314c62}.message-empty strong{margin-top:8px;color:#b9ccd9;font-size:13px}.message-empty p{max-width:260px;font-size:10px;line-height:1.55}
.customer-inspector,.document-inspector{padding:18px}.inspector-customer,.selected-file{display:flex;align-items:center;gap:12px;padding-bottom:17px;border-bottom:1px solid var(--line)}.inspector-customer>span,.selected-file>span{width:43px;height:43px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #4c87ad;border-radius:11px;background:#193a52;color:#bde9ff;font-weight:750;font-size:11px}.inspector-customer strong,.inspector-customer small,.selected-file strong,.selected-file small{display:block}.inspector-customer strong,.selected-file strong{font-size:12px}.inspector-customer small,.selected-file small{margin-top:5px;color:#7f94a7;font-size:9px;line-height:1.4}.inspector-facts,.document-facts{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:18px 0}.inspector-facts .wide,.document-facts .wide{grid-column:1/-1}.inspector-facts dt,.document-facts dt{font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:#658096}.inspector-facts dd,.document-facts dd{margin:5px 0 0;color:#d6e4ed;font-size:10px;line-height:1.4;overflow-wrap:anywhere}.inspector-empty{margin:20px 0 0;padding:14px;border:1px solid #263e52;border-radius:10px;background:#09141f;color:#71869a;font-size:9px;line-height:1.65}.inline-preview{height:250px;margin:14px 0;border:1px solid #304a60;border-radius:10px;overflow:hidden;background:#e8edf0}.inline-preview iframe,.inline-preview img{display:block;width:100%;height:100%;border:0;object-fit:contain}.preview-fallback{height:100%;display:grid;place-content:center;gap:12px;padding:20px;color:#263746;text-align:center;font-size:11px}.preview-hint{padding:10px;border:1px dashed #314a5e;border-radius:8px;color:#6f8798;font-size:9px;text-align:center}.inspector-actions{display:flex;flex-wrap:wrap;gap:7px;position:sticky;bottom:0;z-index:2;margin:14px -18px -18px;padding:12px 18px 18px;background:#0d1926;box-shadow:0 -10px 14px -10px #000a}.inspector-actions .ghost,.inspector-actions .ghost-link,.inspector-actions .danger-button{min-height:35px;padding:8px 10px;font-size:9px}.inspector-actions .danger-button{margin-left:auto}
html[data-theme="light"] .inspector-actions{background:#f7fafc;box-shadow:0 -10px 14px -10px #0002}.records-page dialog{width:min(800px,calc(100% - 28px))}.records-page .field textarea{width:100%;border:1px solid #3b526a;border-radius:11px;background:#07111d;color:var(--text);padding:12px;font:inherit}.upload-record-grid{margin-top:20px}
@media(max-width:1180px){.records-workbench{grid-template-columns:220px minmax(420px,1fr) 300px}.records-heading p{display:none}.records-heading-actions select{min-width:240px}}
@media(max-width:900px){.records-page{height:auto;overflow:auto}.records-shell{height:auto}.records-workbench{grid-template-columns:210px minmax(0,1fr)}.inspector-pane{grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}.ledger-switcher{grid-template-columns:1fr}.records-heading{align-items:stretch;flex-direction:column}.records-heading-actions{align-items:stretch}.records-heading-actions label{flex:1}.records-heading-actions select{width:100%;min-width:0}}
@media(max-width:650px){.records-shell{padding:16px 12px}.records-heading-actions{flex-direction:column}.records-workbench{display:block}.folder-pane{border-right:0}.folder-tree{max-height:230px}.message-pane{height:560px}.message-toolbar{grid-template-columns:1fr 1fr}.message-search{grid-column:1/-1}.message-row{grid-template-columns:5px 34px 1fr 34px}.message-row time,.message-row>b{display:none}.message-list-head{grid-template-columns:1fr 34px}.message-list-head span:nth-child(2),.message-list-head span:nth-child(3){display:none}.ledger-card{min-height:70px}.records-page .top-right .topbar-link{display:none}}

/* Docker 2.0 usability refinements: collapsible folders, page scrolling, larger preview */
.records-page{height:auto;min-height:100vh;overflow-x:hidden;overflow-y:auto}.records-shell{height:auto;min-height:calc(100vh - 72px);grid-template-rows:auto auto minmax(570px,1fr)}.records-workbench{grid-template-columns:245px minmax(460px,1fr) 430px;min-height:570px}.folder-tree{flex:1;min-height:0}.folder-children{display:grid}.folder-item i{display:inline-block;width:13px;color:#6fc9f8;font-style:normal;font-size:15px;line-height:8px;text-align:center}.inline-preview{height:min(48vh,460px);min-height:330px}.inspector-pane{overscroll-behavior:contain}
.preview-canvas{height:calc(100% - 43px);display:grid;place-items:center;overflow:auto;background:#dfe4e8}.preview-canvas img{width:auto;max-width:100%;height:auto;max-height:none;object-fit:contain;box-shadow:0 3px 18px #0003}.preview-navigation{height:43px;display:flex;align-items:center;justify-content:center;gap:12px;padding:5px;background:#0b1824;color:#b8cad8;font-size:10px}.preview-navigation .ghost{min-width:38px;min-height:30px;padding:4px 9px}.preview-loading{height:100%;display:grid;place-items:center;color:#345064;font-size:11px}.simple-upload-intro{display:flex;gap:14px;margin:18px 0 4px;padding:16px;border:1px solid #2d536c;border-radius:13px;background:#0c2231}.simple-upload-intro>span{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#183e56;color:#79d5ff}.simple-upload-intro strong{display:block;color:#d8effb;font-size:13px}.simple-upload-intro p{margin:6px 0 0;color:#8299aa;font-size:10px;line-height:1.55}.simple-file-field{padding:10px;border:1px dashed transparent;border-radius:13px}.simple-file-field.dragging{border-color:#75d1fb;background:#112b3d}.simple-file-field input{min-height:74px;padding:22px;border-style:dashed}.records-heading-actions>#toggleLibraryTrash.active{border-color:#74cff7;color:#a8e5ff}.message-state[data-state="deleted"]{background:#d79263;box-shadow:0 0 9px #d7926366}
@media(max-width:1180px){.records-workbench{grid-template-columns:220px minmax(400px,1fr) 350px}}
@media(max-width:900px){.records-workbench{grid-template-columns:210px minmax(0,1fr)}.inspector-pane{grid-column:1/-1}.inline-preview{height:430px}}
@media(max-width:650px){.records-workbench{display:block}.inline-preview{height:65vh;min-height:300px}}

/* Docker 2.3 — immediate uploads and richer invoice extraction */
.detail-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-actions>.ghost{width:100%}.ai-action.active{border-color:#48b98c;color:#9ce2c3;background:#123328}
.message-pane{position:relative}.drop-overlay{position:absolute;inset:10px;z-index:20;display:none;place-content:center;justify-items:center;gap:8px;border:2px dashed #70d1ff;border-radius:14px;background:#071725ee;color:#c9efff;text-align:center;pointer-events:none}.drop-overlay span{color:#86a9bd;font-size:10px}.message-pane.dragging .drop-overlay,.message-pane.uploading .drop-overlay{display:grid}.message-pane.uploading .drop-overlay strong::after{content:' …'}
.message-state[data-state="ki_analyse"]{background:#bf92ff;box-shadow:0 0 9px #bf92ff;animation:analysis-pulse 1.3s ease-in-out infinite}@keyframes analysis-pulse{50%{opacity:.35;transform:scale(.75)}}
.line-items{margin:16px 0;border:1px solid #29465a;border-radius:10px;overflow:hidden}.line-items h3{margin:0;padding:11px 12px;background:#102333;color:#b9d9ea;font-size:10px;letter-spacing:.04em}.line-item{display:grid;grid-template-columns:minmax(0,1fr) 52px 74px;gap:8px;align-items:center;padding:10px 12px;border-top:1px solid #ffffff0d}.line-item:first-child{border-top:0}.line-item strong,.line-item small{display:block}.line-item strong{font-size:9px}.line-item small{margin-top:4px;color:#758da0;font-size:8px}.line-item>span,.line-item>b{font-size:8px;text-align:right}.line-item>b{color:#cfe7f4}

/* Docker 2.4 — stable notices, compact customer wheel and visible AI progress */
.records-page #libraryNotice{position:fixed;top:84px;left:50%;z-index:120;width:min(920px,calc(100% - 32px));margin:0;transform:translateX(-50%);box-shadow:0 16px 46px #0009}
.compact-customer-picker{display:grid;gap:5px;min-width:300px}.compact-customer-picker>span{font-size:8px;letter-spacing:.12em;color:#8194a7;text-transform:uppercase}.compact-customer-picker>input{height:31px;border:1px solid #29465d;border-radius:8px;background:#091724;color:#dcebf4;padding:0 10px;font:inherit;font-size:10px}.compact-wheel-frame{display:grid;grid-template-columns:28px minmax(0,1fr) 28px;align-items:center;gap:5px}.compact-wheel-frame>button{height:35px;border:1px solid #315069;border-radius:8px;background:#0b1a27;color:#a9daf3;cursor:pointer}.compact-wheel-frame>button:hover{border-color:#67c8f6;background:#123049}.compact-customer-wheel{height:35px;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;border:1px solid #35516a;border-radius:9px;background:#0a1724}.compact-customer-wheel::-webkit-scrollbar{display:none}.compact-customer-wheel>p{margin:0;padding:9px;color:#8195a7;font-size:10px;text-align:center}.compact-customer-option{width:100%;height:35px;display:flex;align-items:center;justify-content:space-between;gap:9px;scroll-snap-align:center;border:0;background:transparent;color:#9fb2c1;padding:0 11px;cursor:pointer}.compact-customer-option strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.compact-customer-option small{flex:0 0 auto;color:#69849a;font-size:8px}.compact-customer-option.active{background:#173a52;color:#d8f2ff;box-shadow:inset 3px 0 #65cbfb}.compact-customer-option.active small{color:#95cce7}.ai-row-progress{display:inline-flex;align-items:center;gap:5px;color:#c9a8ff}.ai-row-progress i{width:9px;height:9px;flex:0 0 auto;border:2px solid #8861bd;border-top-color:#decaff;border-radius:50%;animation:ai-row-spin .8s linear infinite}@keyframes ai-row-spin{to{transform:rotate(360deg)}}
.empty-trash-button{height:43px;padding:0 13px;white-space:nowrap;font-size:10px}.back-home{white-space:nowrap}
@media(max-width:1250px){.records-heading{align-items:flex-start}.records-heading-actions{flex-wrap:wrap;justify-content:flex-end}.compact-customer-picker{min-width:270px}}
@media(max-width:900px){.compact-customer-picker{width:100%;min-width:0}.records-heading-actions{justify-content:flex-start}.records-heading-actions>.primary,.records-heading-actions>.ghost,.records-heading-actions>.danger-button{flex:1}}

/* Docker 2.5 — configurable Outlook-style ledger and accessible themes */
.records-shell{grid-template-rows:auto auto minmax(570px,1fr) auto}.records-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 2px;color:var(--muted);font-size:11px}.records-footer .back-home{display:inline-flex}.inspector-upload{width:calc(100% - 28px);min-height:50px;margin:14px 14px 0;border-radius:11px;font-size:14px}.inspector-pane>.pane-title{margin-top:6px}
.compact-customer-picker{position:relative;display:block;min-width:330px}.compact-customer-picker>summary{height:58px;display:grid;align-content:center;gap:4px;padding:8px 36px 8px 13px;list-style:none;border:1px solid #35516a;border-radius:11px;background:#0a1724;cursor:pointer}.compact-customer-picker>summary::-webkit-details-marker{display:none}.compact-customer-picker>summary:after{content:'⌄';position:absolute;right:14px;top:19px;color:#88bdd9}.compact-customer-picker[open]>summary:after{content:'⌃'}.compact-customer-picker>summary span{font-size:8px;letter-spacing:.12em;color:#8194a7}.compact-customer-picker>summary strong{max-width:285px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.compact-picker-menu{position:absolute;z-index:80;top:64px;right:0;width:100%;padding:10px;border:1px solid #41627d;border-radius:13px;background:#0a1724;box-shadow:0 24px 70px #000c}.compact-picker-menu>input{width:100%;height:37px;margin-bottom:8px;border:1px solid #29465d;border-radius:8px;background:#07121d;color:var(--text);padding:0 11px;font-size:12px}.compact-wheel-frame{display:grid;grid-template-columns:1fr;grid-template-rows:28px 210px 28px;gap:5px}.compact-wheel-frame>button{height:28px}.compact-customer-wheel{box-sizing:border-box;height:210px;padding-block:84px;scroll-padding-block:84px;border-radius:9px}.compact-customer-option{height:42px;padding:0 12px;scroll-snap-stop:always}.compact-customer-option strong{font-size:13px}.compact-customer-option small{font-size:10px}
.message-pane{grid-template-rows:auto auto minmax(0,1fr)}.message-toolbar{grid-template-columns:minmax(220px,1fr) 115px 130px 105px}.message-toolbar input,.message-toolbar select{font-size:12px}.library-count-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;border-bottom:1px solid #ffffff0d;color:#839aae;font-size:11px}.status-legend{display:flex;align-items:center;gap:5px;white-space:nowrap}.status-legend i{width:7px;height:14px;margin-left:5px}.status-legend .red{background:#d94e4e}.status-legend .yellow{background:#e3b53f}.status-legend .green{background:#36b879}.message-table-scroll{min-height:0;overflow:auto;overscroll-behavior:contain}.message-table-scroll>.message-list{overflow:visible}.message-list-head,.message-row{display:grid;grid-template-columns:var(--record-grid);min-width:1060px}.message-list-head{position:sticky;z-index:5;top:0;gap:6px;padding:0 12px;border-bottom:1px solid var(--line);background:#0a1723}.column-head{height:39px;padding:0 5px;border:0;background:transparent;color:#7f98ac;text-align:left;font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.column-head:hover,.column-head.active{color:#bfe9ff;background:#ffffff06}.column-head span{color:#67caff}.message-row{gap:6px;min-height:72px;padding:0 12px;border-bottom:1px solid #ffffff0d}.message-row>*{min-width:0}.message-row time,.message-row .money-cell,.message-row .table-text{font-size:12px;color:#c7d7e2}.money-cell{text-align:right}.category-cell{display:grid;gap:5px}.category-cell strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.category-cell small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7f9bb0;font-size:11px}.file-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-label{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:650}.status-label:before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor}.status-label.red{color:#ff9187}.status-label.yellow{color:#f1ca62}.status-label.green{color:#66d6a6}.row-status-strip{align-self:stretch;width:7px;margin-right:-12px}.row-status-strip.red{background:#d94e4e}.row-status-strip.yellow{background:#e3b53f}.row-status-strip.green{background:#36b879}.pending-upload{background:#102437}.row-upload-spinner{width:20px;height:20px;justify-self:center;border:2px solid #3f6882;border-top-color:#80d8ff;border-radius:50%;animation:ai-row-spin .7s linear infinite}.row-trash{align-self:center}
.column-chooser{position:relative}.column-chooser>summary{height:38px;display:grid;place-items:center;list-style:none;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#b5cddd;font-size:11px;cursor:pointer}.column-chooser>summary::-webkit-details-marker{display:none}.column-chooser>div{position:absolute;z-index:90;top:44px;right:0;width:260px;padding:10px;border:1px solid #3a5972;border-radius:12px;background:#0b1926;box-shadow:0 22px 65px #000c}.column-choice{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px}.column-choice label{display:flex;align-items:center;gap:8px;font-size:12px}.column-choice input{width:16px;height:16px;accent-color:#59c5fa}.column-move{display:flex;gap:4px}.column-move button{width:25px;height:24px;border:1px solid #34536b;border-radius:6px;background:#12283a;color:#b9def1;font-size:11px}.column-chooser small{display:block;padding:8px 6px 3px;color:#758ca0;font-size:9px;line-height:1.45}
.folder-item{font-size:14px}.folder-child{font-size:13px}.folder-item b,.folder-child b{font-size:11px}.folder-path{font-size:12px}.folder-help p{font-size:11px}.pane-title strong{font-size:17px}.inspector-customer strong,.selected-file strong{font-size:15px}.inspector-customer small,.selected-file small{font-size:12px}.inspector-facts dt,.document-facts dt{font-size:11px}.inspector-facts dd,.document-facts dd{font-size:13px}.inspector-empty,.preview-hint{font-size:12px}.line-items h3{font-size:13px}.line-item{grid-template-columns:minmax(0,1fr) 58px 82px 62px}.line-item-route{min-width:0;padding:0;border:0;background:transparent;color:var(--text);text-align:left}.line-item-route strong{font-size:12px}.line-item-route small{font-size:10px}.line-item-route:hover strong{color:var(--blue)}.line-item>span,.line-item>b{font-size:11px}.line-item-open{width:62px;height:30px;border:1px solid #35556d;border-radius:7px;background:#102537;color:#9edcff;font-size:10px}.inspector-actions .ghost,.inspector-actions .ghost-link,.inspector-actions .danger-button{font-size:11px}
html[data-theme="light"]{color-scheme:light;--bg:#eef4f8;--panel:#fff;--surface:#f5f9fc;--line:#c6d5e0;--muted:#536b7d;--text:#102333;--blue:#087cb9;--blue-deep:#0878b2;--green:#16734e;--danger:#a32f27}html[data-theme="light"] body{background:radial-gradient(circle at 78% 0,#d9edf9 0,transparent 36%),var(--bg)}html[data-theme="light"] .topbar{border-color:#cbd9e3;background:#fffffff2}html[data-theme="light"] .panel,html[data-theme="light"] dialog{background:linear-gradient(145deg,#fff,#edf4f8);box-shadow:0 20px 55px #4562731c}html[data-theme="light"] .search input,html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea{background:#fff;color:#102333}html[data-theme="light"] .wheel-stage:before{background:linear-gradient(#fff,transparent)}html[data-theme="light"] .wheel-stage:after{background:linear-gradient(transparent,#f7fafc)}html[data-theme="light"] .selection-band{background:#dceff9}html[data-theme="light"] .monogram,html[data-theme="light"] .file-badge{background:#dceaf3;color:#315b73}html[data-theme="light"] .ledger-card{background:linear-gradient(135deg,#fff,#eef4f8)}html[data-theme="light"] .ledger-card.active{background:linear-gradient(135deg,#e1f3fd,#f5fbff)}html[data-theme="light"] .records-workbench,html[data-theme="light"] .folder-pane,html[data-theme="light"] .inspector-pane,html[data-theme="light"] .message-pane{background:#f7fafc}html[data-theme="light"] .message-list-head{background:#e8f0f5}html[data-theme="light"] .message-row:hover{background:#eaf4fa}html[data-theme="light"] .message-row.selected{background:linear-gradient(90deg,#d8effb,#edf8fd)}html[data-theme="light"] .compact-customer-picker>summary,html[data-theme="light"] .compact-picker-menu,html[data-theme="light"] .column-chooser>div{background:#fff;color:#102333}html[data-theme="light"] .compact-customer-option.active{background:#d9effb;color:#12384d}html[data-theme="light"] .message-toolbar input,html[data-theme="light"] .message-toolbar select,html[data-theme="light"] .column-chooser>summary{background:#fff;color:#173246}html[data-theme="light"] .drop-overlay{background:#edf8fbee;color:#14384d}html[data-theme="light"] .document-lock,html[data-theme="light"] .simple-upload-intro{background:#edf6fb}html[data-theme="light"] .topbar-link,html[data-theme="light"] .ghost{background:#fff;color:#185675}html[data-theme="light"] .brand{background:linear-gradient(112deg,#426274,#102333 43%,#597788 70%,#102333);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="light"] .message-row time,html[data-theme="light"] .message-row .money-cell,html[data-theme="light"] .message-row .table-text,html[data-theme="light"] .inspector-facts dd,html[data-theme="light"] .document-facts dd,html[data-theme="light"] .line-item-route{color:#213d50}html[data-theme="light"] .category-cell small,html[data-theme="light"] .folder-item,html[data-theme="light"] .folder-child,html[data-theme="light"] .library-count-bar{color:#536f82}html[data-theme="light"] .folder-item:hover,html[data-theme="light"] .folder-child:hover{background:#e4f0f6;color:#153b51}html[data-theme="light"] .folder-item.active,html[data-theme="light"] .folder-child.active{background:#d6edf8;color:#075f8e}html[data-theme="light"] .pending-upload{background:#e3f2fa}html[data-theme="light"] .column-head:hover,html[data-theme="light"] .column-head.active{background:#dcecf4;color:#075d8a}
.record-file{min-width:0;display:flex;align-items:center;gap:10px}.record-file .file-badge{width:36px;height:36px;flex:0 0 auto}.record-file strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
@media(min-width:901px) and (max-width:1100px){.records-workbench{grid-template-columns:220px minmax(520px,1fr) 340px}.message-table-scroll{overflow:auto}.compact-customer-picker{min-width:290px}}
@media(max-width:900px){.message-toolbar{grid-template-columns:1fr 1fr}.message-search{grid-column:1/-1}.column-chooser{grid-column:auto}.records-footer{padding-bottom:18px}.records-page .top-right .demo-badge{display:none}}

.record-file .file-badge.red{border-color:#d94e4e;background:#4a2024;color:#ffb0a9}.record-file .file-badge.yellow{border-color:#e3b53f;background:#493b1d;color:#ffe08a}.record-file .file-badge.green{border-color:#36b879;background:#163f32;color:#91e8c3}
html[data-theme='light'] .record-file .file-badge.red{background:#ffe2df;color:#982f29}html[data-theme='light'] .record-file .file-badge.yellow{background:#fff1c6;color:#795d08}html[data-theme='light'] .record-file .file-badge.green{background:#d9f4e8;color:#176846}

.compact-wheel-frame{position:relative}.compact-wheel-frame:after{content:'';position:absolute;z-index:2;pointer-events:none;left:0;right:0;top:117px;height:42px;border:1px solid #69caff8c;border-radius:8px;box-shadow:inset 3px 0 #65cbfb,0 0 18px #168bd219}.compact-customer-option{position:relative;z-index:1}.compact-customer-option.centered{background:#123049;color:#e0f5ff}.compact-customer-option.active.centered{background:#173a52}
html[data-theme='light'] .compact-customer-option.centered{background:#e0f1fa;color:#12384d}

/* Docker 2.9 — laptop workspace, status guidance and resizable table */
.records-page{height:100vh;overflow:hidden}
.records-shell{height:calc(100vh - 72px);min-height:0;padding:10px 18px 12px;grid-template-rows:auto minmax(0,1fr) auto;gap:8px}
.records-heading{align-items:center;min-height:58px}
.records-heading h1{margin:3px 0 2px;font-size:clamp(24px,2.4vw,34px)}
.records-heading p{font-size:12px}
.records-heading .overline{font-size:9px}
.action-notice{position:fixed;z-index:120;top:78px;left:50%;width:min(900px,calc(100% - 32px));transform:translateX(-50%);box-shadow:0 12px 40px #0008}
.records-workbench{height:100%;min-height:0;grid-template-columns:280px minmax(560px,1fr) 315px}
.folder-pane .ledger-switcher{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:6px;border-bottom:1px solid var(--line)}
.folder-pane .ledger-card{min-height:46px;justify-content:center;gap:4px;padding:5px 3px;border-radius:8px;text-align:center}
.folder-pane .ledger-card .ledger-icon{width:22px;height:22px;border:0;background:transparent;font-size:14px}
.folder-pane .ledger-card>span:last-child{gap:0}
.folder-pane .ledger-card strong{font-size:11px}
.folder-pane .ledger-card em{display:none}
.folder-pane .pane-title{padding:10px 13px 8px}
.folder-path{padding:8px 12px;font-size:10px}
.folder-tree{padding:5px 6px}
.folder-item{padding:7px 8px;font-size:12px}
.folder-child{padding:6px 8px 6px 28px;font-size:11px}
.folder-help{padding:9px 12px}
.folder-help p{margin-top:4px;font-size:9px}
.inspector-pane{font-size:14px}
.inspector-pane .pane-title{padding:13px 14px 10px}
.inspector-upload{margin:11px 12px 0;width:calc(100% - 24px)}
.records-footer{min-height:28px;padding:2px 4px;font-size:10px}
.message-list-head,.message-row{width:max-content;min-width:100%}
.message-list-head{min-height:38px;padding-inline:9px}
.message-row{min-height:64px;padding-inline:9px}
.column-head{position:relative;display:flex;align-items:center;min-width:0;height:38px;padding:3px 12px 3px 4px;line-height:1.15;white-space:normal}
.column-label{display:block;overflow-wrap:anywhere}
.column-resizer{position:absolute;z-index:4;top:3px;right:-5px;width:10px;height:32px;border-right:2px solid transparent;cursor:col-resize}
.column-resizer:hover,.resizing-column .column-resizer{border-color:#62c9fb}
.resizing-column{cursor:col-resize;user-select:none}
.folder-meta{display:flex!important;flex:0 0 auto;align-items:center;gap:6px}
.folder-status,.customer-status{display:inline-block!important;width:9px!important;height:9px!important;flex:0 0 auto;border:1px solid #607486;border-radius:50%;background:transparent;box-shadow:none}
.folder-status.red,.customer-status.red{border-color:#ef6660;background:#d94e4e;box-shadow:0 0 7px #d94e4e88}
.folder-status.yellow,.customer-status.yellow{border-color:#f4cd63;background:#e3b53f;box-shadow:0 0 7px #e3b53f77}
.folder-status.green,.customer-status.green{border-color:#69d9a7;background:#36b879;box-shadow:0 0 7px #36b87966}
.folder-status.empty,.customer-status.empty{background:transparent}
.compact-customer-picker>summary span{font-size:10px}
.compact-customer-picker>summary strong{font-size:15px}
.compact-picker-menu>input{font-size:14px}
.compact-customer-wheel{perspective:650px;mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 18%,#000 82%,transparent)}
.compact-customer-option{transform-origin:center;transform:rotateX(var(--compact-tilt,0deg)) scale(var(--compact-scale,1));opacity:var(--compact-opacity,1);transition:opacity .1s,transform .1s}
.compact-customer-option strong{font-size:14px}
.compact-customer-option small{display:flex;align-items:center;gap:6px;font-size:11px}
.compact-customer-option.centered{font-weight:700}
@media(max-width:1400px){.records-workbench{grid-template-columns:250px minmax(520px,1fr) 285px}.records-heading-actions{gap:6px}.compact-customer-picker{min-width:300px}.inspector-facts{grid-template-columns:1fr}.inspector-facts .wide{grid-column:auto}}.compact-customer-option{justify-content:flex-start;gap:9px;text-align:left}
.compact-monogram{width:29px;height:29px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #ffffff18;border-radius:8px;background:#203247;color:#bfd0df;font-size:10px;font-weight:750}
.compact-customer-option.centered .compact-monogram,.compact-customer-option.active .compact-monogram{border-color:#70caff5c;background:linear-gradient(140deg,#285f89,#16334c);color:#e1f4ff}
.compact-customer-copy{display:grid;min-width:0;gap:2px}
.compact-customer-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-theme='light'] .compact-monogram{background:#dceaf3;color:#315b73}

/* Docker 3.0 — visible uploads, multi-selection and roomier document details */
.records-workbench{grid-template-columns:260px minmax(560px,1fr) 380px}
.drop-overlay{z-index:30;background:#071725f5}.drop-spinner{width:42px;height:42px;border:4px solid #d94e4e55;border-top-color:#ff655f;border-radius:50%;animation:ai-row-spin .7s linear infinite}.message-pane.uploading .drop-overlay{display:grid}.message-pane.dragging:not(.uploading) .drop-overlay .drop-spinner{display:none}.message-pane.dragging:not(.uploading) .drop-overlay strong{font-size:0}.message-pane.dragging:not(.uploading) .drop-overlay strong:after{content:'Dokumente hier ablegen';font-size:inherit;font-size:14px}
.library-count-bar{min-height:36px}.upload-activity{display:inline-flex;align-items:center;gap:7px;color:#ff9690;font-weight:700}.upload-activity i{width:15px;height:15px;border:2px solid #d94e4e55;border-top-color:#ff655f;border-radius:50%;animation:ai-row-spin .7s linear infinite}
.batch-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.batch-actions b{font-size:11px;color:#aedff5}.batch-actions button{min-height:29px;padding:5px 10px;font-size:10px}.batch-actions+.status-legend{margin-left:4px}
.row-check{display:grid;place-items:center;align-self:stretch;cursor:pointer}.row-check input{position:absolute;opacity:0;pointer-events:none}.row-check span{width:16px;height:16px;border:1px solid #527087;border-radius:4px;background:#091723}.row-check input:checked+span{border-color:#65cbfb;background:#168bd2;box-shadow:inset 0 0 0 3px #0a2030}.row-check input:focus-visible+span{outline:2px solid #8cddff;outline-offset:2px}.select-all{height:38px}
.status-stack{display:inline-flex;align-items:center;gap:2px;min-width:7px}.folder-status,.customer-status{width:6px!important;height:6px!important;border-width:1px!important;box-shadow:none!important}.folder-status.red,.customer-status.red{box-shadow:0 0 4px #d94e4e66!important}.folder-status.yellow,.customer-status.yellow{box-shadow:0 0 4px #e3b53f66!important}.folder-status.green,.customer-status.green{box-shadow:0 0 4px #36b87955!important}
.inspector-pane{min-width:0}.document-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.document-facts dd{overflow-wrap:anywhere}
.settings-link{font-size:12px}
html[data-theme='light'] .row-check span{background:#fff;border-color:#8298a8}html[data-theme='light'] .row-check input:checked+span{background:#168bd2;box-shadow:inset 0 0 0 3px #e8f6fd}
@media(max-width:1400px){.records-workbench{grid-template-columns:235px minmax(500px,1fr) 340px}}
.settings-page{min-height:100vh}.settings-shell{width:min(1080px,calc(100% - 32px));margin:0 auto;padding:44px 0 70px}.settings-heading h1{margin:8px 0;font-size:42px}.settings-heading p{color:var(--muted)}.settings-grid{display:grid;grid-template-columns:330px minmax(0,1fr);gap:18px;margin-top:28px}.settings-card{padding:25px}.settings-card h2{margin:8px 0 6px}.settings-card>p{color:var(--muted);line-height:1.55}.theme-options{display:grid;gap:10px;margin-top:24px}.theme-options button{min-height:52px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit;text-align:left;padding:0 16px;cursor:pointer}.theme-options button.active{border-color:#63caff;box-shadow:inset 3px 0 #63caff;background:#15354b}.settings-customer{display:grid;gap:7px;margin:18px 0}.settings-customer span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.settings-customer select{min-height:45px}.settings-column-list{display:grid;gap:7px;margin-top:18px}.settings-column-row{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}.settings-column-row label{display:flex;align-items:center;gap:10px}.settings-column-row input{width:18px;height:18px;accent-color:#45bdf4}.settings-column-row button{width:34px;height:31px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--text)}.settings-column-row button:disabled{opacity:.25}.settings-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.settings-actions button{min-height:43px}@media(max-width:760px){.settings-grid{grid-template-columns:1fr}.settings-heading h1{font-size:34px}}
/* Ab 4.35: Der Reiter "Kanzlei" oeffnet zuerst nur dieses Menue, jeder
   Eintrag sein eigenes Fenster. So bleibt die Seite uebersichtlich, auch
   wenn weitere Bereiche dazukommen. */
.kanzlei-menu{display:grid;gap:12px;margin-top:28px;max-width:640px}
.kanzlei-menu-item{display:block;width:100%;text-align:left;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--text);font:inherit;cursor:pointer;transition:.15s}
.kanzlei-menu-item:hover{border-color:#63caff;background:#15354b}
.kanzlei-menu-item .menu-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.kanzlei-menu-item strong{font-size:18px}
.kanzlei-menu-item small{display:block;margin-top:5px;color:var(--muted);font-size:12px;line-height:1.5}
.kanzlei-menu-item .menu-arrow{flex:0 0 auto;color:var(--muted);font-size:20px}
.kanzlei-menu-item[hidden]{display:none}
#analyseDialog,#mitarbeiterDialog{width:min(820px,calc(100% - 28px))}
html[data-theme='light'] .theme-options button.active{background:#dceff9;color:#12384d}

/* Docker 3.1 — compact selection, permanent type badge and three-state folder lights */
.message-toolbar{grid-template-columns:minmax(220px,1fr) 115px 130px}.top-column-chooser{position:relative;width:112px;flex:0 0 auto}.top-column-chooser>summary{height:43px}.top-column-chooser>div{top:49px}
.row-check span{width:13px;height:13px;border-radius:3px}.row-check input:checked+span{box-shadow:inset 0 0 0 2.5px #0a2030}
.row-file-badge{width:38px;height:34px;display:grid;place-items:center;justify-self:center;border:1px solid #3c637d;border-radius:9px;background:#173147;color:#a8ddfa;font-size:8px;font-weight:800}.row-file-badge.red{border-color:#d94e4e;background:#4a2024;color:#ffb0a9}.row-file-badge.yellow{border-color:#e3b53f;background:#493b1d;color:#ffe08a}.row-file-badge.green{border-color:#36b879;background:#163f32;color:#91e8c3}
.status-stack{min-width:6px;flex-direction:column;justify-content:center;gap:1px}.folder-status,.customer-status{width:5.5px!important;height:5.5px!important}.folder-status.empty{border-color:#526575!important;background:transparent!important;box-shadow:none!important;opacity:.55}.folder-status.present.red{border-color:#ef6660!important;background:#d94e4e!important}.folder-status.present.yellow{border-color:#f4cd63!important;background:#e3b53f!important}.folder-status.present.green{border-color:#69d9a7!important;background:#36b879!important}
.upload-activity{white-space:nowrap}.upload-activity:has(+.batch-actions:not([hidden])){margin-left:6px}.batch-actions .ghost{white-space:nowrap}
html[data-theme='light'] .row-file-badge{background:#e1eef6;color:#315b73}html[data-theme='light'] .row-file-badge.red{background:#ffe2df;color:#982f29}html[data-theme='light'] .row-file-badge.yellow{background:#fff1c6;color:#795d08}html[data-theme='light'] .row-file-badge.green{background:#d9f4e8;color:#176846}

/* Docker 3.2 — independently scrollable folders and resizable details */
/* 4.17: Beide Seitenspalten sind gleich breit. Die Ziehleiste am Detailbereich aendert deshalb beide zugleich. */
.records-workbench{grid-template-columns:var(--inspector-width,320px) minmax(480px,1fr) var(--inspector-width,320px)}.folder-pane{height:100%;min-height:0;overflow:hidden}.folder-tree{flex:1 1 0;min-height:0;max-height:none;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-color:#45657c #08121c}.folder-help{flex:0 0 auto}
.row-file-badge,.row-file-badge.red,.row-file-badge.yellow,.row-file-badge.green{border-color:#405467;background:#263442;color:#d2dbe2;box-shadow:none}.status-stack{width:7px;min-width:7px;height:19px;gap:1px}.folder-status,.customer-status{width:5px!important;height:5px!important}.folder-status.empty{border-color:#8293a1!important;opacity:.72}
.folder-status.empty.red{border-color:#d94e4e!important}.folder-status.empty.yellow{border-color:#e3b53f!important}.folder-status.empty.green{border-color:#36b879!important}
.inspector-pane{position:relative}.inspector-resizer{position:absolute;z-index:12;top:0;bottom:0;left:-5px;width:11px;border:0;border-left:2px solid transparent;background:transparent;cursor:col-resize}.inspector-resizer:hover,.resizing-inspector .inspector-resizer{border-left-color:#62c9fb;background:#62c9fb15}.resizing-inspector{cursor:col-resize;user-select:none}
.records-heading-actions{flex-wrap:nowrap}.compact-customer-picker{min-width:290px}.message-list-head,.message-row{min-width:max(100%,1110px)}
html[data-theme='light'] .row-file-badge,html[data-theme='light'] .row-file-badge.red,html[data-theme='light'] .row-file-badge.yellow,html[data-theme='light'] .row-file-badge.green{border-color:#aebdc8;background:#dbe3e9;color:#334b5a}
@media(max-width:1400px){.records-workbench{grid-template-columns:var(--inspector-width,300px) minmax(430px,1fr) var(--inspector-width,300px)}}

/* Docker 3.3 — invoice-workspace defaults and unambiguous three-light status stacks */
.status-stack{display:inline-flex!important;flex:0 0 8px!important;width:8px!important;min-width:8px!important;height:23px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;overflow:visible!important;vertical-align:middle}
.status-stack .folder-status{display:block!important;box-sizing:border-box!important;width:6px!important;height:6px!important;min-width:6px!important;min-height:6px!important;margin:0!important;border-width:1px!important;border-style:solid!important;border-radius:50%!important;opacity:1!important;background:transparent!important;box-shadow:none!important}
.status-stack .folder-status.red{border-color:#e75c57!important}.status-stack .folder-status.yellow{border-color:#e7bb45!important}.status-stack .folder-status.green{border-color:#39bd7e!important}
.status-stack .folder-status.present.red{background:#d94e4e!important;box-shadow:0 0 4px #d94e4e88!important}.status-stack .folder-status.present.yellow{background:#e3b53f!important;box-shadow:0 0 4px #e3b53f88!important}.status-stack .folder-status.present.green{background:#36b879!important;box-shadow:0 0 4px #36b87977!important}
.compact-customer-copy small .status-stack{margin-left:4px}
.status-column-head{justify-content:flex-end!important;padding-right:0!important;text-align:right}.status-column-head .column-label{margin-left:auto}.status-label{justify-self:end;padding-right:31px;white-space:nowrap}
.message-row .row-trash,.message-row .row-upload-spinner{position:absolute;z-index:4;right:10px;top:50%;transform:translateY(-50%)}
.message-list-head,.message-row{min-width:max(100%,980px)}

/* Docker 3.4.1 — status rings are independent from the folder-arrow icon */
.folder-meta>.status-stack,.compact-customer-copy .status-stack{display:grid!important;grid-template-rows:repeat(3,6px)!important;place-items:center!important;align-content:center!important;width:9px!important;min-width:9px!important;height:24px!important;gap:1px!important;overflow:visible!important}
.folder-meta>.status-stack>.folder-status,.compact-customer-copy .status-stack>.folder-status{display:block!important;position:static!important;width:6px!important;height:6px!important;min-width:6px!important;min-height:6px!important;padding:0!important;border:1px solid currentColor!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;opacity:1!important;line-height:0!important}
.status-stack>.folder-status.red{color:#e75c57!important}.status-stack>.folder-status.yellow{color:#e7bb45!important}.status-stack>.folder-status.green{color:#39bd7e!important}
.status-stack>.folder-status.present.red{background:#d94e4e!important;box-shadow:0 0 4px #d94e4e88!important}.status-stack>.folder-status.present.yellow{background:#e3b53f!important;box-shadow:0 0 4px #e3b53f88!important}.status-stack>.folder-status.present.green{background:#36b879!important;box-shadow:0 0 4px #36b87977!important}

/* Docker 3.4.2 — compact laptop layout and right-side file badges */
.folder-meta>.status-stack{color:#61778a!important}.compact-customer-copy .status-stack{color:#69849a!important}.status-stack>.folder-status.red,.status-stack>.folder-status.yellow,.status-stack>.folder-status.green{color:inherit!important;border-color:currentColor!important}
html[data-theme='light'] .folder-meta>.status-stack{color:#536f82!important}html[data-theme='light'] .compact-customer-copy .status-stack{color:#536f82!important}
.records-page{height:auto!important;min-height:100vh!important;overflow-x:auto!important;overflow-y:auto!important}
.records-shell{height:auto!important;min-height:calc(100vh - 72px)!important;padding:6px 14px 8px!important;grid-template-rows:auto minmax(640px,1fr) auto!important;gap:6px!important}
.records-heading{min-height:48px!important}.records-heading h1{margin:1px 0!important;line-height:1.05}.records-heading p{margin-top:2px!important}.records-workbench{height:auto!important;min-height:640px!important}
.message-list-head,.message-row{padding-left:5px!important}.column-head:first-of-type{padding-left:0!important}.document-utility-head{width:80px}.row-file-badge{justify-self:start!important}.message-row .row-trash{right:13px!important}
@media(max-height:850px){.records-heading p{display:none}.records-heading{min-height:42px!important}.records-shell{padding-top:3px!important;padding-bottom:4px!important}.records-footer{min-height:22px!important}}

/* Docker 3.6 — compact title, status dots and far-right document state */
.records-page .topbar{justify-content:flex-start;gap:22px}
.workspace-topbar-title{display:grid;gap:2px;min-width:0;margin-right:auto}
.workspace-topbar-title span{color:#6fc9f8;font-size:8px;font-weight:800;letter-spacing:.16em}
.workspace-topbar-title strong{color:var(--text);font-size:clamp(20px,2vw,28px);line-height:1.05;letter-spacing:-.025em;white-space:nowrap}
.records-heading-compact{min-height:43px!important;justify-content:flex-end!important;align-items:center!important}
.records-heading-compact .records-heading-actions{align-items:center}
.records-shell{grid-template-rows:auto minmax(640px,1fr) auto!important}
.message-row{position:relative}
.row-status-strip{position:absolute!important;z-index:5;top:0;right:0;bottom:0;width:6px!important;margin:0!important}
.message-row .row-trash,.message-row .row-upload-spinner{right:14px!important}
.folder-meta>.status-stack,.compact-customer-copy .status-stack{grid-template-rows:repeat(3,4px)!important;width:7px!important;min-width:7px!important;height:18px!important;gap:2px!important}
.folder-meta>.status-stack>.folder-status,.compact-customer-copy .status-stack>.folder-status{width:4px!important;height:4px!important;min-width:4px!important;min-height:4px!important;border:0!important;background:currentColor!important;opacity:.42!important}
.status-stack>.folder-status.present.red{background:#d94e4e!important;opacity:1!important;box-shadow:0 0 3px #d94e4e88!important}
.status-stack>.folder-status.present.yellow{background:#e3b53f!important;opacity:1!important;box-shadow:0 0 3px #e3b53f88!important}
.status-stack>.folder-status.present.green{background:#36b879!important;opacity:1!important;box-shadow:0 0 3px #36b87977!important}
@media(max-width:1100px){.records-page .topbar{gap:10px}.workspace-topbar-title span{display:none}.workspace-topbar-title strong{font-size:19px}.records-page .top-right{gap:7px}.records-page .signed-user{display:none}}
@media(max-width:760px){.workspace-topbar-title{display:none}.records-heading-compact{justify-content:stretch!important}.records-heading-compact .records-heading-actions{width:100%}}


.row-utility{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0}
.message-row .status-label{justify-self:start}

@keyframes row-highlight-pulse{0%,100%{box-shadow:inset 3px 0 #68ccff}50%{box-shadow:inset 3px 0 #68ccff,0 0 0 2px #68ccff88}}
.message-row.row-highlight{animation:row-highlight-pulse .9s ease-in-out 3}

.status-label.working{color:#7fd4ff}
.status-label.working:before{display:none}
.status-spinner{width:11px;height:11px;flex:0 0 11px;border:2px solid #2f5a75;border-top-color:#7fd4ff;border-radius:50%;animation:ai-row-spin .7s linear infinite}
.message-row .row-upload-spinner{justify-self:end}


/* Mandantenauswahl sitzt jetzt im Detailbereich, der Kopfstreifen entfaellt.
   Dadurch gewinnt die Belegliste eine komplette Zeile Hoehe, was auf
   Laptopbildschirmen den Unterschied macht. */
.inspector-customer-switch{margin:11px 12px 0}
.inspector-customer-switch .compact-customer-picker{min-width:0;width:100%}
.inspector-customer-switch .compact-customer-picker>summary{width:100%}
.inspector-customer-switch .compact-customer-picker>summary strong{max-width:100%}
.inspector-customer-switch .compact-picker-menu{top:calc(100% + 6px);left:0;right:0;width:auto;max-height:340px;overflow:auto}
/* Papierkorb steht jetzt in der oberen Leiste. */
.topbar .top-right #toggleLibraryTrash.active{border-color:#74cff7;color:#a8e5ff}
.topbar .top-right #emptyLibraryTrash{white-space:nowrap}
.records-shell>.action-notice{margin-top:0}

/* Summe der Betraege, die in der aktuellen Ablage sichtbar sind. */
.library-sum{display:inline-flex;align-items:center;gap:12px;margin-left:14px;padding:3px 10px;
  border:1px solid #2b4c65;border-radius:8px;background:#0c1c2a;color:#9db6c8;font-size:11px;white-space:nowrap}
.library-sum>b:first-child{color:#7fd4ff;text-transform:uppercase;letter-spacing:.05em;font-size:10px}
.library-sum span{display:inline-flex;gap:5px}
.library-sum span b{color:#dfeef8}
html[data-theme="light"] .library-sum{border-color:#c2d5e2;background:#eef6fb;color:#4a6377}
html[data-theme="light"] .library-sum span b{color:#12384d}

/* Laufende Bearbeitung: ein blauer Kreis wie in der oberen Leiste. */
.row-busy-spinner{width:15px;height:15px;flex:0 0 15px;border:2px solid #2f5a7555;border-top-color:#68ccff;
  border-radius:50%;animation:ai-row-spin .75s linear infinite}
/* Kleineres Dateityp-Kaestchen und kompakterer Papierkorb. */
.message-row .row-file-badge{width:31px;height:27px;border-radius:7px;font-size:7px}
.message-row .row-trash{width:27px;height:27px;font-size:13px}
.row-utility{gap:5px}
/* Status rechtsbuendig, mit einer Luecke so breit wie der Farbstreifen. */
.message-row .status-label{justify-self:end;padding-right:7px}
.column-head.status-column-head{text-align:right;padding-right:12px}
/* Mausrad im Detailbereich: die Weitergabe an die Seite war unterbunden. */
.inspector-pane{overscroll-behavior:auto;overflow-y:auto}

/* Kopfzeile: Das Wort Status reicht bis an den Farbstreifen heran, indem es
   sich ueber seine Spalte und den Aktionsbereich spannt. Die Belegzeilen
   darunter behalten ihre Aufteilung. */
.message-list-head .column-head.status-column-head{text-align:right;padding-right:7px!important}
.message-list-head .column-head.status-column-head .column-label{display:inline-block}

/* Steueruebersicht je Satz im Detailbereich. Bewusst als Tabelle, damit sich
   die Spalten mit dem Papierbeleg vergleichen lassen. */
.tax-overview{margin:14px 14px 0;padding:12px 13px 11px;border:1px solid #2b4c65;border-radius:11px;background:#0b1a27}
.tax-overview h3{margin:0 0 9px;color:#8fb6cd;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.tax-overview table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.tax-overview th,.tax-overview td{padding:5px 0;text-align:right;font-size:12px;white-space:nowrap}
.tax-overview thead th{color:#7f99ac;font-size:10px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;
  border-bottom:1px solid #24405613}
.tax-overview thead th:first-child,.tax-overview tbody th,.tax-overview tfoot th{text-align:left}
.tax-overview tbody th{color:#7fd4ff;font-weight:700;font-size:12px}
.tax-overview tbody td{color:#cfe0ec}
.tax-overview tbody tr+tr th,.tax-overview tbody tr+tr td{border-top:1px solid #ffffff0d}
.tax-overview tfoot th,.tax-overview tfoot td{padding-top:7px;border-top:1px solid #35566f;color:#eaf4fa;font-weight:750}
.tax-overview.tax-mismatch{border-color:#8a5a2f}
.tax-hint{margin:9px 0 0;color:#86a2b6;font-size:11px;line-height:1.45}
html[data-theme="light"] .tax-overview{border-color:#c4d6e2;background:#f2f8fc}
html[data-theme="light"] .tax-overview tbody td{color:#1d3a4d}
html[data-theme="light"] .tax-overview tfoot th,html[data-theme="light"] .tax-overview tfoot td{color:#102333}
html[data-theme="light"] .tax-overview tbody th{color:#0a6ea3}
html[data-theme="light"] .tax-hint{color:#51697c}

/* ===== Version 3.8 ======================================================= */

/* 1+2  Zahlen stehen linksbuendig unter ihrer Ueberschrift.
   Bis 3.79 waren die Spaltenkoepfe links und die Betraege rechts ausgerichtet,
   wodurch Zahl und Ueberschrift nie auf derselben senkrechten Linie standen.
   Der Kopf hat 4px linke Innenabstand, die Zelle bekommt denselben Wert. */
.message-row .money-cell,.message-row time{padding-left:4px;text-align:left;font-variant-numeric:tabular-nums}
/* Auch der Aussteller steht buendig unter seiner Ueberschrift. */
.message-row .table-text{padding-left:4px}
.message-row>b.money-cell{text-align:left}
/* Status bleibt bewusst rechtsbuendig: er sitzt direkt vor den Farbstreifen. */
.message-row .status-label{justify-self:end;padding-right:7px}

/* 4  Sicherheit der Zahl. Gelb: gerechnet oder noch nicht bestaetigt.
   Rot: fehlt oder passt rechnerisch nicht zusammen. Gruen kommt hier nicht
   vor, weil Gruen im Belegstatus schon vergeben ist. */
.money-cell.unsure,.line-item-split.unsure,dd .unsure,#selectedDate.unsure{color:#e3b53f}
.money-cell.missing,.line-item-split.missing,dd .missing,#selectedDate.missing{color:#ff9187}
.message-row .money-cell.missing,.message-row time.missing{font-size:11px;font-style:italic}
html[data-theme='light'] .money-cell.unsure,html[data-theme='light'] .line-item-split.unsure,html[data-theme='light'] #selectedDate.unsure{color:#8a6400}
html[data-theme='light'] .money-cell.missing,html[data-theme='light'] .line-item-split.missing,html[data-theme='light'] #selectedDate.missing{color:#a32f27}
.line-item-split{display:block;margin-top:3px;font-size:10px;font-style:normal;color:#7f9bb0}

/* 3  Dateityp und Papierkorb stehen uebereinander ganz rechts. */
.row-utility.stacked{flex-direction:column;align-items:center;justify-content:center;gap:3px;width:100%}
.message-row .row-utility.stacked .row-file-badge{order:1;justify-self:center!important;margin:0}
.message-row .row-utility.stacked .row-trash{order:2;position:static!important;right:auto!important;top:auto!important;transform:none!important;opacity:.55}
.message-row .row-utility.stacked .row-busy-spinner{order:0}
.message-row:hover .row-utility.stacked .row-trash{opacity:1}
.message-row .row-utility.stacked .row-upload-spinner{position:static!important;right:auto!important;top:auto!important;transform:none!important}
.document-utility-head{width:46px}

/* 5  Duenne Fuehrungslinie mit kurzen Querstrichen, wie in 3.81.
   Einziger Unterschied zu dort: Die senkrechte Linie gehoert jetzt dem ganzen
   Baum und nicht mehr der einzelnen Kategorie. Sie lief vorher am Ende jedes
   Kastens aus, weshalb sie neben Nebenkosten aufhoerte und weiter unten wieder
   anfing. Jetzt laeuft sie durch, und nur die Faerbung wechselt. */
.folder-tree{position:relative}
.folder-tree:before{content:'';position:absolute;left:11px;top:8px;bottom:8px;width:1px;background:#33506588;pointer-events:none}
.folder-group{position:relative}
/* Farbiges Stueck der Linie genau ueber der Hoehe einer Gruppe mit offenen Belegen. */
/* Die farbige Linie endet an der letzten offenen Unterkategorie, nicht am
   Ende des Gruppenkastens. Sonst lief sie ueber Tanken, Fahrtkosten und
   Nebenkosten weiter, obwohl dort nichts offen ist. Getragen wird sie deshalb
   von den einzelnen Zeilen, die renderTree mit data-rail markiert; sie liegen
   untereinander und verschmelzen zu einer Linie. */
/* ENTSCHEIDEND: Beide Zeilentypen muessen selbst positioniert sein. Fehlt
   .folder-item{position:relative}, bezieht sich sein :before auf den naechsten
   positionierten Vorfahren, und das ist .folder-group. Die Linie der
   Kategoriezeile spannt dann ueber die GESAMTE Gruppe, also bis hinter
   Nebenkosten. Genau dieser eine fehlende Eintrag war die Ursache. */
.folder-item,.folder-child{position:relative}
.folder-item[data-rail="red"]:before,.folder-child[data-rail="red"]:before,
.folder-item[data-rail="yellow"]:before,.folder-child[data-rail="yellow"]:before{content:'';position:absolute;left:3px;top:0;bottom:0;width:1px;height:auto;pointer-events:none}
.folder-item[data-rail="red"]:before,.folder-child[data-rail="red"]:before,
.folder-item[data-rail="yellow"]:before,.folder-child[data-rail="yellow"]:before{background:transparent}
/* Kurzer Querstrich zur jeweiligen Unterkategorie. */
.folder-child{position:relative}
.folder-child:after{content:'';position:absolute;left:3px;top:50%;width:20px;height:1px;background:transparent}
.folder-child[data-open="red"]:after{background:#d94e4e}
.folder-child[data-open="yellow"]:after{background:#e3b53f}
.folder-child[data-open="red"]>span:first-child,.folder-child[data-open="yellow"]>span:first-child{font-weight:600}
html[data-theme='light'] .folder-tree:before{background:#c3d3de}

/* 4  Papierkorb in genau denselben Abmessungen wie das Dateityp-Kaestchen. */
.message-row .row-utility.stacked .row-trash{width:31px;height:27px;border-radius:7px;border:1px solid #3c637d;background:#132434;color:#9fb4c4;font-size:13px}
.message-row:hover .row-utility.stacked .row-trash,.row-utility.stacked .row-trash:focus-visible{border-color:#684542;background:#2a191b;color:#ffb2a7}
html[data-theme='light'] .message-row .row-utility.stacked .row-trash{border-color:#aebdc8;background:#eef3f7;color:#4a6273}

/* 6  Bereichskachel Privat. */
.ledger-icon.private{color:#c39bf0}
html[data-theme='light'] .ledger-icon.private{color:#6f3fae}

/* 7  Aufschluesselungsfenster. */
.amount-drill{padding:0;border:0;border-bottom:1px dotted currentColor;background:transparent;color:inherit;font:inherit;cursor:pointer}
.amount-drill:hover:not(:disabled){color:var(--blue)}
.amount-drill:disabled{border-bottom-color:transparent;cursor:default;opacity:.85}
.breakdown-dialog{width:min(560px,94vw)}
.breakdown-scroll{max-height:min(46vh,340px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:10px}
.breakdown-table{width:100%;border-collapse:collapse;font-size:12px}
.breakdown-table th,.breakdown-table td{padding:7px 10px;border-bottom:1px solid #ffffff10;text-align:right;font-variant-numeric:tabular-nums}
.breakdown-table thead th{position:sticky;top:0;z-index:1;background:#0d1a27;color:#7f98ac;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
.breakdown-table tbody th,.breakdown-table tfoot th{text-align:left;font-weight:600}
.breakdown-table tbody th small{display:block;margin-top:2px;color:#7f9bb0;font-size:10px;font-weight:400}
.breakdown-table tfoot th,.breakdown-table tfoot td{border-top:1px solid var(--line);border-bottom:0;font-weight:700}
.breakdown-table .focus{background:#ffffff0c;color:#bfe9ff}
.breakdown-table td.unsure{color:#e3b53f}
.breakdown-note{margin:10px 0 0;color:#e3b53f;font-size:11px;line-height:1.5}
html[data-theme='light'] .breakdown-table thead th{background:#e8f0f5}
html[data-theme='light'] .breakdown-table th,html[data-theme='light'] .breakdown-table td{border-bottom-color:#dde7ee}
html[data-theme='light'] .breakdown-table .focus{background:#e4f0f6;color:#075d8a}
html[data-theme='light'] .breakdown-table td.unsure,html[data-theme='light'] .breakdown-note{color:#8a6400}

/* Die Ausstellerspalte darf schrumpfen, deshalb bleibt die Mindestbreite
   niedrig: 26+135+150+88+80+100+96+46+7 = 728 px. Erst darunter entsteht
   ein Querbalken. */
.message-list-head,.message-row{width:auto;min-width:max(100%,880px)}
/* width:max-content aus 3.79 wird hier bewusst aufgehoben: Es wuerde die
   flexible Ausstellerspalte sofort wieder auf ihre Maximalbreite ziehen. */

/* Token- und Kostenanzeige auf der Startseite. */
.token-button{white-space:nowrap}
.token-dialog{width:min(620px,94vw)}
.token-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:6px}
.token-card{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#0d1a27}
.token-card h3{margin:0 0 8px;color:#7f98ac;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.token-card dl{display:grid;gap:5px;margin:0}
.token-card dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.token-card dt{color:#7f9bb0;font-size:11px}
.token-card dd{margin:0;color:#c7d7e2;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.token-note{margin:12px 0 0;color:#7f9bb0;font-size:11px;line-height:1.55}
html[data-theme='light'] .token-card{background:#fff}
html[data-theme='light'] .token-card dd{color:#213d50}
html[data-theme='light'] .token-card dt,html[data-theme='light'] .token-note{color:#536f82}

/* Freigabe */
.release-button{width:100%;margin-bottom:6px}
.release-button.release-undo{background:transparent;border:1px solid #684542;color:#ffb2a7}
.status-label{border:0;background:transparent;font-family:inherit;font-size:12px;font-weight:650;line-height:1.2;cursor:pointer}
.status-label:hover{text-decoration:underline}
.status-label.working{cursor:default}
.status-label.working:hover{text-decoration:none}
.release-dialog{width:min(520px,94vw)}
.release-list{max-height:min(30vh,200px);overflow:auto;margin:10px 0;padding:0;list-style:none;border:1px solid var(--line);border-radius:10px}
.release-list li{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:7px 11px;border-bottom:1px solid #ffffff10;font-size:12px}
.release-list li:last-child{border-bottom:0}
.release-list small{color:#7f9bb0;font-size:11px;white-space:nowrap}
.release-hint{margin:0;color:#7f9bb0;font-size:11px;line-height:1.55}
.release-question{margin:10px 0 4px;color:#c7d7e2;font-size:12px}
.scope-note{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:8px 0 0;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:#0d1a27;font-size:11px}
.scope-note b{color:#9edcff}
.scope-note span{color:#7f9bb0}
.tiny-action{padding:3px 8px;font-size:10px}
html[data-theme='light'] .scope-note{background:#eef4f8}
html[data-theme='light'] .scope-note b{color:#075d8a}
html[data-theme='light'] .release-hint,html[data-theme='light'] .release-list small{color:#536f82}
html[data-theme='light'] .release-question{color:#213d50}

/* Hinweis auf einen Abzug (Gutschein, Anzahlung) direkt in der Zeile. */
.row-deduction{order:0;width:14px;height:14px;display:grid;place-items:center;border-radius:50%;background:#3b2f14;color:#e3b53f;font-size:10px;font-style:normal;line-height:1}
html[data-theme='light'] .row-deduction{background:#fff1c6;color:#795d08}
#deductionFact dd,#selectedDeduction{color:#e3b53f}
#payableFact dd{font-weight:700}
html[data-theme='light'] #deductionFact dd,html[data-theme='light'] #selectedDeduction{color:#8a6400}

/* Ersatzanzeige des Eingangsdatums: sichtbar, aber nicht mit einem erfassten
   Belegdatum verwechselbar. */
.message-row time.fallback{color:#7f9bb0}
.message-row time.fallback small{font-size:10px;opacity:.85}
html[data-theme='light'] .message-row time.fallback{color:#6b8194}

/* Betrag je Ablage im Kategoriebaum. */
.folder-meta{display:flex;align-items:center;gap:6px;min-width:0}
.folder-amount{flex:0 0 auto;color:#8fb6cd;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.folder-item>span:first-child,.folder-child>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.folder-item.active .folder-amount,.folder-child.active .folder-amount{color:#bfe9ff}
html[data-theme='light'] .folder-amount{color:#42627a}

/* Ersatzanzeige: Das Datum in der normalen Textfarbe wie der Aussteller,
   nur der Zusatz (Eingang) bleibt gedaempft. */
.message-row time.fallback{color:#c7d7e2}
.message-row time.fallback small{margin-left:5px;color:#7f9bb0;font-size:10px}
html[data-theme='light'] .message-row time.fallback{color:#213d50}
html[data-theme='light'] .message-row time.fallback small{color:#6b8194}

/* Hinweis auf eine veraltete Auswertung. */
.outdated-notice{display:grid;gap:7px;margin-bottom:12px;padding:11px 13px;border:1px solid #6b5626;border-radius:11px;background:#2a2412}
.outdated-notice strong{color:#f1ca62;font-size:12px}
.outdated-notice span{color:#c9bc94;font-size:11px;line-height:1.55}
.outdated-notice .ghost{justify-self:start;padding:5px 10px;font-size:11px}
html[data-theme='light'] .outdated-notice{border-color:#d8c48a;background:#fdf6e3}
html[data-theme='light'] .outdated-notice strong{color:#8a6400}
html[data-theme='light'] .outdated-notice span{color:#6b5a2c}

/* Status: Ueberschrift und Text beginnen an derselben senkrechten Linie.
   Vorher war beides rechtsbuendig; die rechten Kanten stimmten dann zwar
   ueberein, die linken aber nie, weil "Status" kuerzer ist als "Bitte pruefen".
   Linksbuendig in einer festen Spalte ist die einzige Variante, die fuer jede
   Beschriftung stimmt. Der Ueberschuss der Zeilenbreite liegt jetzt rechts
   davon, in der Werkzeugspalte. */
/* 4 px Zelleneinzug, 14 px fuer Statuspunkt und Abstand, dazu eine
   Zeichenbreite der Kopfschrift (9 px) nach rechts: 27 px. */
.message-list-head .column-head.status-column-head{justify-content:flex-start!important;text-align:left!important;padding-left:27px!important;padding-right:4px!important}
.message-list-head .column-head.status-column-head .column-label{margin-left:0!important}
.message-row .status-label{justify-self:start!important;padding-left:4px!important;padding-right:0!important}
.message-row .row-utility.stacked{align-items:flex-end}

/* Abzug und Zahlbetrag in der Aufschluesselung des Bruttobetrags. */
.breakdown-table .deduction-row th span{color:#e3b53f}
.breakdown-table .deduction-row td{color:#e3b53f}
.breakdown-table .payable-row th,.breakdown-table .payable-row td{border-top:1px solid var(--line);font-weight:700}
html[data-theme='light'] .breakdown-table .deduction-row th span,html[data-theme='light'] .breakdown-table .deduction-row td{color:#8a6400}

/* Zusatzordner fuer Posten ohne Unterkategorie und fuer nicht aufgeteilte
   Restbetraege. Sie sind keine Steuerkategorie, sondern ein Hinweis, und
   sehen deshalb anders aus als die echten Ablagen. */
.folder-child.folder-residual>span:first-child{font-style:italic;color:#9aa8b4}
.folder-child.folder-residual .folder-amount{color:#e3b53f}
html[data-theme='light'] .folder-child.folder-residual>span:first-child{color:#5d6f7e}
html[data-theme='light'] .folder-child.folder-residual .folder-amount{color:#8a6400}

/* Der Statuspunkt bekommt einen festen Platz, damit er in jeder Zeile auf
   derselben senkrechten Linie sitzt, auch wenn der Text unterschiedlich lang
   ist oder waehrend der Analyse ein Kreisel an seiner Stelle steht. */
.message-row .status-label{display:inline-grid!important;grid-template-columns:8px auto;align-items:center;gap:6px}
.message-row .status-label:before{grid-column:1;justify-self:center}
.message-row .status-label.working:before{display:none}
.message-row .status-label .status-spinner{grid-column:1;justify-self:center}
.library-sum.sum-selection b:first-child{color:#9edcff}
html[data-theme='light'] .library-sum.sum-selection b:first-child{color:#075d8a}

/* ===== Version 3.93 ====================================================== */

/* Dateityp und Papierkorb: EIN massgeblicher Block.
   Ueber die letzten Fassungen haben sich fuer diese beiden Kaestchen ein
   gutes Dutzend Regeln uebereinandergelegt, teils mit !important. Sie waren
   zwar beide 31x27 gross, standen aber 51 px versetzt. Statt eine weitere
   Ausnahme anzuhaengen, legt dieser Block alles fest, was die beiden
   betrifft, und setzt die Reste der aelteren Regeln ausdruecklich zurueck. */
.message-row .row-utility.stacked{
  display:flex;flex-direction:column;align-items:flex-end;justify-content:center;
  gap:4px;width:100%;padding-right:2px}
.message-row .row-utility.stacked>*{
  position:static!important;right:auto!important;left:auto!important;top:auto!important;
  bottom:auto!important;transform:none!important;margin:0!important;
  align-self:flex-end!important;justify-self:auto!important}
.message-row .row-utility.stacked .row-file-badge,
.message-row .row-utility.stacked .row-trash{
  box-sizing:border-box;width:31px;min-width:31px;height:27px;min-height:27px;
  display:grid;place-items:center;border-radius:7px;border:1px solid #3c637d;
  background:#132434;font-size:12px;line-height:1}
.message-row .row-utility.stacked .row-file-badge{font-size:8px;font-weight:800;color:#a8ddfa}
.message-row .row-utility.stacked .row-trash{color:#8da0af;opacity:.75;cursor:pointer}
.message-row:hover .row-utility.stacked .row-trash,
.message-row .row-utility.stacked .row-trash:focus-visible{
  opacity:1;border-color:#684542;background:#2a191b;color:#ffb2a7}
.message-row .row-utility.stacked .row-deduction{width:16px;min-width:16px;height:16px;border-radius:50%}
html[data-theme='light'] .message-row .row-utility.stacked .row-file-badge,
html[data-theme='light'] .message-row .row-utility.stacked .row-trash{
  border-color:#aebdc8;background:#eef3f7;color:#4a6273}

/* Der farbige Punkt steht jetzt senkrecht unter der Ueberschrift STATUS.
   Der Kopf bekommt denselben Zelleneinzug wie jede andere Spalte. */
.message-list-head .column-head.status-column-head{padding-left:4px!important}

/* Aufschluesselung: Die Ueberschrift der ersten Spalte gehoert nach links,
   ueber die Bezeichnungen, nicht rechtsbuendig darueber. */
.breakdown-table thead th:first-child,
.breakdown-table tbody th,
.breakdown-table tfoot th{text-align:left;padding-left:12px}
.breakdown-table thead th:first-child{padding-left:12px}

/* Steueruebersicht im schmalen Detailbereich: Netto und Umsatzsteuer in einer
   Zeile, der Bruttobetrag darunter. Zu viert passten die Zahlen bei 300 px
   Bereichsbreite nicht nebeneinander und liefen ineinander. */
.tax-overview tr.tax-gross td{padding-top:0;padding-bottom:7px;text-align:right;color:#9eb1c1;font-size:11px}
.tax-overview tr.tax-rate td,.tax-overview tr.tax-rate th{border-bottom:0;padding-bottom:2px}
.tax-overview tr.tax-gross b{color:#c7d7e2;font-variant-numeric:tabular-nums}
html[data-theme='light'] .tax-overview tr.tax-gross td{color:#536f82}
html[data-theme='light'] .tax-overview tr.tax-gross b{color:#213d50}

/* Der Hinweis unter einer Abzugsbezeichnung stand in derselben Zeile wie der
   Name, weil die Regel nur fuer tbody galt. Abzuege stehen aber im Fuss. */
.breakdown-table tfoot th small{display:block;margin-top:2px;color:#7f9bb0;font-size:10px;font-weight:400}

/* Steuerfrei ist eine Angabe, kein Fehler: Die Null steht neutral da, nicht
   rot und nicht kursiv wie ein fehlender Wert. */
.money-cell.exempt,dd .exempt{color:#8fa6b6}
html[data-theme='light'] .money-cell.exempt,html[data-theme='light'] dd .exempt{color:#5d7688}

/* Einzug der Statusspalte. Kopf und Zeile teilen sich denselben Wert, damit
   die Ueberschrift STATUS und der farbige Punkt darunter auf derselben Kante
   bleiben. Eine Zeichenbreite der Kopfschrift sind 9 px. */
/* 4.01: Netto bis Belegdatum stehen acht Zeichenbreiten (72 px) weiter rechts.
   Der Platz kommt aus der Leerflaeche vor dem Status (58 px) und aus der
   Belegdatumsspalte (14 px). Der Status selbst bleibt, wo er ist: Rechts von
   ihm beginnen Dateityp und Papierkorb. Das Eingangsdatum-Kennzeichen steht
   dafuer unter dem Datum, und die Ueberschrift BELEGDATUM bricht nicht um. */
:root{--status-einzug:9px}
.message-list-head .column-head[data-sort-column="date"]{white-space:nowrap}
.message-row time.fallback small{display:block;margin-left:0}
.message-list-head .column-head.status-column-head{padding-left:var(--status-einzug)!important}
.message-row .status-label{padding-left:var(--status-einzug)!important}

/* Ein Bereich mit offenen Belegen wird sichtbar, ohne dass man hineinklicken
   muss: ein farbiger Streifen an der linken Kante des Knopfes. Rot heisst
   "noch offen", Gelb "bitte pruefen". Ein Bereich ohne offene Belege bleibt
   ruhig, sonst leuchtet dauerhaft alles. */
.ledger-card{position:relative}
.ledger-card[data-open='red'],.ledger-card[data-open='yellow']{border-color:currentColor}
.ledger-card[data-open='red']:before,.ledger-card[data-open='yellow']:before{
  content:'';position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0}
.ledger-card[data-open='red']:before{background:#d94e4e}
.ledger-card[data-open='yellow']:before{background:#e3b53f}
.folder-pane .ledger-card[data-open='red']:before,.folder-pane .ledger-card[data-open='yellow']:before{
  left:0;top:5px;bottom:5px;width:2px}

/* Beschriftung naeher an das Symbol. Die Karte hat bisher 4 px Abstand und
   eine Grundbreite, die den Text zusaetzlich von seinem Zeichen wegdrueckt. */
.folder-pane .ledger-card{gap:1px;padding:5px 2px}
.folder-pane .ledger-card .ledger-icon{width:auto;height:16px;line-height:16px}
.folder-pane .ledger-card strong{line-height:1.1}

/* Wiederherstellen direkt in der Papierkorbzeile, in derselben Groesse wie
   das Papierkorbsymbol darunter. */
.message-row .row-utility.stacked .row-restore{
  box-sizing:border-box;width:31px;min-width:31px;height:27px;min-height:27px;
  display:grid;place-items:center;border-radius:7px;border:1px solid #3c637d;
  background:#132434;color:#8da0af;font-size:13px;line-height:1;cursor:pointer;opacity:.75}
.message-row:hover .row-utility.stacked .row-restore,
.message-row .row-utility.stacked .row-restore:focus-visible{
  opacity:1;border-color:#2f6f52;background:#162c22;color:#8ee0b4}
html[data-theme='light'] .message-row .row-utility.stacked .row-restore{
  border-color:#aebdc8;background:#eef3f7;color:#4a6273}

/* Die amtlichen Abschnittsnamen sind lang ("Sonstige unbeschränkt abziehbare
   Betriebsausgaben"). Der Name darf abgeschnitten werden, Betrag, Ampel und
   Zähler nicht: Sie sind die Information, die man im Baum wirklich braucht.
   Der volle Name steht im title und erscheint beim Darüberfahren. */
.folder-item,.folder-child{display:flex;align-items:center;gap:6px}
.folder-item>span:first-child,.folder-child>span:first-child{
  flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.folder-meta{flex:0 0 auto;margin-left:auto;white-space:nowrap}
.folder-meta>b{flex:0 0 auto}
/* Der Knopf war breiter als der Baumbereich: 275 px in einem 245-px-Bereich.
   Der Einzug der Unterkategorie kam zur vollen Breite hinzu, statt in ihr
   enthalten zu sein. Damit rutschten Betrag und Zaehler aus dem Bild. */
.folder-item,.folder-child{box-sizing:border-box;width:100%;max-width:100%;min-width:0;overflow:hidden}
.folder-group,.folder-children{min-width:0;max-width:100%}

/* Die Positionsliste im schmalen Detailbereich: Der Ablagepfad ist mit der
   amtlichen Gliederung laenger geworden und lief in die Betraege hinein.
   Er darf umbrechen, die Zeile waechst dann nach unten statt zu ueberlappen. */
/* Die Zeile hat VIER Kinder (Pfad, Satz, Betrag, Beleg-Knopf), das Raster kannte
   aber nur drei Spalten. Der Knopf landete in einer vierten, impliziten Spalte
   und nahm der ersten den Platz weg. Mit min-width:0 fiel sie dann auf eine
   Zeichenbreite zusammen. */
.line-item{grid-template-columns:minmax(0,1fr) 34px 58px auto;align-items:start;gap:6px}
.line-item-route{min-width:0;overflow:hidden;text-align:left}
.line-item strong,.line-item small,.line-item-split{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.line-item small{line-height:1.35}
.line-item>span,.line-item>b,.line-item-open{align-self:center}

/* Ein einziger durchgehender Strich fuer den ganzen Baum. Er beginnt oben,
   laeuft ohne Unterbrechung bis zur Unterkante der letzten offenen Ablage und
   endet dort. Hoehe und Farbe setzt updateTreeRail() nach jedem Zeichnen.
   Er liegt auf derselben Kante wie die neutrale Grundlinie darunter (11 px). */
.folder-tree:after{content:'';position:absolute;left:11px;top:8px;width:1px;
  height:var(--rail-height,0);background:var(--rail-color,transparent);pointer-events:none}

/* Freigabe je Position: ein Haken in der Positionszeile. Grau heisst offen,
   gruen heisst freigegeben. */
.line-item{grid-template-columns:minmax(0,1fr) 28px 54px 24px auto;gap:5px}
.line-item-release{width:24px;height:24px;display:grid;place-items:center;
  border:1px solid #3c637d;border-radius:6px;background:#132434;color:#5d748a;font-size:12px;line-height:1;cursor:pointer}
.line-item-release:hover{border-color:#2f6f52;color:#8ee0b4}
.line-item-release.released{border-color:#2f6f52;background:#162c22;color:#66d6a6}
html[data-theme='light'] .line-item-release{border-color:#aebdc8;background:#eef3f7;color:#6a808f}
html[data-theme='light'] .line-item-release.released{border-color:#2f8a5f;background:#e3f6ec;color:#16734e}

/* Bereichsknoepfe als Zweierraster: oben Ausgaben und Einnahmen,
   darunter Allgemein und Privat. */
.folder-pane .ledger-switcher{grid-template-columns:repeat(2,minmax(0,1fr))!important}

/* Ein verstecktes Element bleibt versteckt, auch wenn seine Klasse
   display:flex setzt. */
.batch-actions[hidden]{display:none!important}
/* Der Knopf zum Originalbeleg braucht kein Wort: Das Zeichen genuegt, und die
   gewonnenen 40 px gehoeren dem Ablagepfad, der sonst auf eine Zeichenbreite
   zusammenfaellt. Die Beschriftung steht im Hinweis. */
.line-item-open{width:24px;min-width:24px;padding:0;display:grid;place-items:center}

/* Die Suchleiste hat jetzt vier Felder: Suche, Jahr, Status, Ablage. Ohne
   eigene Spalte rutschte das neue Feld in eine zweite Zeile und nahm der
   Belegliste eine Zeilenhoehe weg. */
.message-toolbar{grid-template-columns:minmax(180px,1fr) 110px 120px 170px!important}
@media(max-width:1100px){.message-toolbar{grid-template-columns:1fr 1fr!important}
  .message-search{grid-column:1/-1}}

/* Nichts darf aus dem Dokumentenfenster herauslaufen. Ist die Tabelle breiter
   als der Bereich, wird waagerecht gescrollt; Statusstreifen, Dateityp und
   Papierkorb malten sich sonst ueber den Detailbereich daneben. Genau das war
   der gelbe Strich mitten in der Mandanteninformation. */
.message-pane{overflow:hidden}
.message-table-scroll{min-width:0;overflow:auto}

/* Die Auswahlleiste sitzt jetzt oben neben Papierkorb und Einstellungen. Dort
   schiebt sie nichts weg, wenn sie beim Anhaken erscheint. */
.topbar .batch-actions{margin-left:0;gap:6px}
.topbar .batch-actions b{font-size:11px;color:#aedff5;white-space:nowrap}
.topbar .batch-actions button{min-height:31px}

/* Freigabedialog: die Positionen des Belegs zum An- und Abwaehlen. */
.release-positions{margin:10px 0;border:1px solid #29465a;border-radius:9px;overflow:hidden}
.release-positions-head{display:flex;align-items:center;justify-content:space-between;
  gap:8px;padding:8px 11px;background:#102333;color:#b9d9ea;font-size:11px}
.release-positions-head span{display:flex;gap:6px}
.release-positions ul{margin:0;padding:0;list-style:none;max-height:220px;overflow:auto}
.release-positions li{border-top:1px solid #ffffff0d}
.release-positions li:first-child{border-top:0}
.release-positions label{display:flex;align-items:flex-start;gap:9px;padding:8px 11px;cursor:pointer}
.release-positions input{width:16px;height:16px;margin-top:1px;accent-color:#45bdf4;flex:0 0 auto}
.release-positions strong{display:block;font-size:12px}
.release-positions small{display:block;margin-top:2px;color:#7f9bb0;font-size:10px}
html[data-theme='light'] .release-positions-head{background:#e8f0f5;color:#1d4a63}
html[data-theme='light'] .release-positions small{color:#536f82}

/* Die Tabelle ist so breit, wie ihre Spalten es brauchen, nicht breiter. Die
   fest eingetragenen 1110 px stammten aus einer Zeit mit mehr Spalten und
   erzwangen auf schmaleren Bildschirmen einen Bildlauf, den es nicht braucht. */
.message-list-head,.message-row{min-width:100%!important}

/* Obere Leiste: Der Titel darf schrumpfen, die Knoepfe rechts nicht. */
.topbar .workspace-topbar-title{min-width:0;overflow:hidden}
.topbar .workspace-topbar-title strong{overflow:hidden;text-overflow:ellipsis;display:block}
.topbar .top-right{flex-wrap:nowrap;min-width:0}
.topbar .demo-badge{white-space:nowrap}

/* Der Querstrich beginnt genau auf dem senkrechten Strich. Der liegt 11 px vom
   Baumrand, die Unterkategoriezeile beginnt 6 px vom Baumrand, also startet der
   Querstrich 5 px in der Zeile. Bis 3.98 begann er bei 3 px und ragte 2 px
   links ueber den senkrechten Strich hinaus. */
.folder-child:after{left:5px;width:18px}

/* Der farbige Strich wurde gar nicht gemalt: Die Zeilen des Baums sind selbst
   positioniert und lagen darueber. Nachgewiesen mit einem absichtlich breiten
   magentafarbenen Strich, der erst mit eigener Ebene sichtbar wurde. Mit
   z-index:1 liegt er jetzt ueber den Zeilen; er ist 1 px breit, sitzt links
   neben aller Schrift und laesst Klicks durch.
   Die neutrale graue Grundlinie entfaellt. Sie lief bis zum unteren Rand des
   sichtbaren Ausschnitts, unabhaengig von jeder Ablage, und war genau der
   blasse Strich, der unter der letzten offenen Ablage stehen blieb. */
.folder-tree:after{z-index:1}
.folder-tree:before{display:none}

/* Der Strich als echtes Element statt als ::after. Er liegt ueber den Zeilen,
   ist 1 px breit, sitzt links neben aller Schrift und laesst Klicks durch.
   Hoehe und Farbe setzt updateTreeRail() direkt am Element. */
.folder-tree:after{content:none!important;display:none!important}
.tree-rail{position:absolute;left:11px;width:1px;z-index:2;pointer-events:none;display:block}
.tree-rail[hidden]{display:none}

/* Die eigentliche Ursache, per Ausschlussverfahren gefunden: Mit
   scrollbar-gutter:stable malt Chromium absolut positionierte Elemente in den
   ersten 15 px des Baums nicht. Der Strich bei 11 px war damit unsichtbar,
   derselbe Strich bei 15 px oder mit scrollbar-gutter:auto sichtbar. Der Baum
   hat ohnehin overflow-y:scroll, der Platz fuer den Rollbalken ist also immer
   reserviert; die Einstellung brachte nichts und kostete den Strich. */
.folder-tree{scrollbar-gutter:auto!important}

/* 4.02: Drei Linien nebeneinander, Rot bei 6 px, Gelb bei 10 px, Gruen bei
   14 px. Damit neben ihnen Platz bleibt, rueckt der Baumtext 4 px nach rechts.
   Der Querstrich einer Ablage beginnt an der Linie ihrer schlechtesten Farbe
   (das ist immer die am weitesten links liegende ihrer Farben) und endet
   5 px vor der Schrift. */
.folder-item:not(.root)>span:first-child{margin-left:4px}
.folder-child{padding-left:32px!important}
.folder-child:after{left:8px;width:19px}
.folder-child[data-open="red"]:after{left:0;width:27px;background:#d94e4e}
.folder-child[data-open="yellow"]:after{left:4px;width:23px;background:#e3b53f}
.folder-child[data-open="green"]:after{left:8px;width:19px;background:#36b879}

/* 4.02: Zweizeiliger Status. Der Punkt steht mittig vor beiden Zeilen. */
.message-row .status-label .status-lines{display:block;white-space:nowrap;line-height:1.2;text-align:left}

/* 4.03: Sammel-PDF aufteilen. Seiten als Vorschaubilder nebeneinander,
   zwischen ihnen die Schnittstellen. Jeder Beleg bekommt eine eigene Farbe. */
#splitDialog{width:min(1180px,96vw)}
.split-dialog .dialog-intro{margin-bottom:14px}
.split-pages{display:flex;flex-wrap:wrap;align-items:stretch;gap:0;max-height:62vh;overflow:auto;padding:6px 4px 10px;border:1px solid var(--line);border-radius:14px;background:#08121c}
.split-page{position:relative;margin:0;width:132px;padding:6px 6px 8px;border-top:4px solid var(--split-tone);border-radius:8px;background:#0f1d2b;cursor:pointer;display:flex;flex-direction:column;gap:5px}
.split-page img{width:120px;height:160px;object-fit:contain;background:#fff;border-radius:3px}
.split-page figcaption{font-size:11px;color:var(--muted)}
.split-head{min-height:30px;display:flex;flex-direction:column;font-size:12px;line-height:1.25}
.split-head b{color:var(--split-tone)}
.split-head small{font-size:10px;color:#b8c9d6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.split-page.excluded{opacity:.38;border-top-color:#566b7e}
.split-page.excluded img{filter:grayscale(1)}
.split-page.tone-0{--split-tone:#64c7ff}.split-page.tone-1{--split-tone:#e3b53f}
.split-page.tone-2{--split-tone:#36b879}.split-page.tone-3{--split-tone:#c98cf0}
.split-page.tone-x{--split-tone:#566b7e}
.split-cut{position:relative;width:22px;border:0;background:transparent;cursor:pointer;padding:0;color:#58748a}
.split-cut i{position:absolute;left:10px;top:8px;bottom:8px;width:2px;border-radius:1px;background:transparent}
.split-cut span{position:relative;display:inline-block;font-size:13px;opacity:.35;background:#08121c;line-height:1}
.split-cut:hover span,.split-cut:focus-visible span{opacity:1}
.split-cut.active i{background:#ff7b6b}
.split-cut.active span{opacity:1;color:#ff9b8e}
.split-summary{margin:12px 2px 0;font-weight:600}
.split-notice{display:flex;flex-direction:column;gap:8px;margin:0 0 16px;padding:13px 15px;border-radius:12px;font-size:12px;line-height:1.45}
.split-notice.open{border:1px solid #9b4a42;background:#2a1718;color:#ffd6cf}
.split-notice.open strong{font-size:13px}
.split-notice.origin,.split-notice.quiet{flex-direction:row;align-items:center;justify-content:space-between;border:1px solid var(--line);background:#0f1d2b;color:#b8c9d6}
.split-notice button{align-self:flex-start}
.split-notice.origin button,.split-notice.quiet button{align-self:center;white-space:nowrap}
html[data-theme='light'] .split-pages{background:#eef4f8}
html[data-theme='light'] .split-page{background:#fff}
html[data-theme='light'] .split-notice.open{background:#fdecea;color:#7d231b;border-color:#e0a59d}
html[data-theme='light'] .split-notice.origin,html[data-theme='light'] .split-notice.quiet{background:#f5f9fc;color:#35556b}

/* 4.04: Klick auf die Seite = hier beginnt ein neuer Beleg. Verwerfen hat
   einen eigenen Knopf, und die Schnittstellen sind deutlicher zu sehen. */
.split-page{cursor:pointer}
.split-page:hover{background:#15283a}
.split-drop{padding:2px 7px;border:1px solid #3c637d;border-radius:6px;background:#132434;color:#9fb4c4;font-size:11px;cursor:pointer}
.split-drop:hover{border-color:#684542;background:#2a191b;color:#ffb2a7}
.split-page.excluded .split-drop{opacity:1;border-color:#62c9fb;color:#cfeaff;background:#12324a}
.split-cut span{opacity:.6}
.split-cut i{background:#2c4458}
.split-cut:hover i{background:#ff9b8e}
html[data-theme='light'] .split-page:hover{background:#eef6fb}
html[data-theme='light'] .split-drop{background:#eef3f7;color:#35556b;border-color:#aebdc8}
.split-page.excluded{opacity:1}
.split-page.excluded img,.split-page.excluded .split-head,.split-page.excluded figcaption span{opacity:.38}
.split-page figcaption{display:flex;align-items:center;justify-content:space-between;gap:6px}
.split-notice-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}

/* 4.07: Warum ist ein Beleg gelb? */
.review-reason{display:flex;flex-direction:column;gap:4px;margin:0 0 14px;padding:11px 14px;border:1px solid #8a6d22;border-radius:12px;background:#2a2412;color:#f3e2b0;font-size:12px;line-height:1.45}
.review-reason strong{font-size:12px;letter-spacing:.02em;color:#e3b53f}

/* 4.08: Belege aus dem Postfach ohne Mandant */
.assign-notice{display:flex;flex-direction:column;gap:8px;margin:0 0 16px;padding:13px 15px;border:1px solid #9b4a42;border-radius:12px;background:#2a1718;color:#ffd6cf;font-size:12px;line-height:1.45}
.assign-notice strong{font-size:13px}
.assign-row{display:flex;gap:8px;align-items:center}
.assign-row select{flex:1;min-width:0}
.mailbox-note{margin-left:14px;color:#8fa6b8;font-size:12px}
.mailbox-note.warn{color:#e3b53f}

/* 4.09: Trennblaetter */
.separator-links{display:flex;gap:16px;margin:14px 0 0;font-size:12px}
.separator-links a{color:#7cc4ff;text-decoration:none}
.separator-links a:hover{text-decoration:underline}

/* 4.10: Anteile in anderen Bereichen */
.folder-child.folder-foreign{color:#8fa6b8;font-style:italic;border-top:1px dashed #2b3f52;margin-top:4px}
.folder-child.folder-foreign small{font-style:normal;color:#6f8799}
.folder-child.folder-foreign .folder-amount{color:#8fa6b8}
.folder-child.folder-foreign:disabled{cursor:default}

/* 4.12: Halbkreis an zugeklappten Gruppen, Steuer nicht ausgewiesen */
.tree-knob{position:absolute;width:3px;height:6px;border-radius:0 3px 3px 0;z-index:2;pointer-events:none;display:block}
/* 4.14: Knoten an jeder Abzweigung, runder Abschluss am Ende jeder Linie. */
.tree-cap{position:absolute;width:5px;height:5px;border-radius:50%;z-index:3;pointer-events:none;display:block}
.money-cell.notshown{color:#e3b53f;font-style:italic}
html[data-theme='light'] .money-cell.notshown{color:#8a6400}
/* 4.14: Hinweis auf neue Belege aus dem Postfach. Das Banner steht ueber der
   Liste und bleibt, bis man es wegklickt oder den Mandanten oeffnet. Die
   Bereichsfelder atmen leicht, solange dort etwas Neues liegt. */
.mail-banner{display:flex;align-items:center;gap:11px;padding:10px 14px;border-bottom:1px solid #2f6b86;background:linear-gradient(90deg,#123a52,#0d2637);color:#d7effb;font-size:10px}
.mail-banner[hidden]{display:none}
.mail-banner-mark{width:24px;height:24px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:#1b4f6d;color:#8fdcff;font-size:12px}
.mail-banner-text{min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.mail-banner-text strong{font-size:11px;color:#eaf7ff}
.mail-banner-link{padding:3px 9px;border:1px solid #3d7fa3;border-radius:999px;background:#0e2f44;color:#9fdcff;font:inherit;cursor:pointer}
.mail-banner-link:hover{border-color:#69caff;color:#d5f1ff}
.mail-banner-close{margin-left:auto;width:26px;height:26px;flex:0 0 auto;border:0;border-radius:7px;background:transparent;color:#8fb3c8;font-size:15px;cursor:pointer}
.mail-banner-close:hover{background:#ffffff14;color:#e6f5ff}
/* 4.15: Das Pulsieren war zu zurueckhaltend, um es zu bemerken. Jetzt
   wandert ein sichtbarer Schein ueber die Karte, dazu ein leuchtender Punkt
   in der Ecke, der auch ohne Bewegung sagt: hier liegt etwas Neues. */
@keyframes ledger-pulse{
  0%,100%{background:#12293b;box-shadow:inset 0 0 0 1px #3b7ea3}
  50%{background:#22597a;box-shadow:inset 0 0 0 1px #8fdcff,0 0 20px #2f9fd64d}
}
.ledger-card.pulsing{position:relative;animation:ledger-pulse 1.6s ease-in-out infinite;border-color:#79d3ff}
.ledger-card.pulsing:after{content:'';position:absolute;top:7px;right:7px;width:7px;height:7px;
  border-radius:50%;background:#79d3ff;box-shadow:0 0 8px #79d3ff}
@media(prefers-reduced-motion:reduce){.ledger-card.pulsing{animation:none;background:#1d4f6d;border-color:#79d3ff}}
html[data-theme='light'] .ledger-card.pulsing{animation-name:ledger-pulse-light}
@keyframes ledger-pulse-light{
  0%,100%{background:#e8f4fb;box-shadow:inset 0 0 0 1px #8fc3dd}
  50%{background:#b6dff5;box-shadow:inset 0 0 0 1px #2f9fd6,0 0 20px #2f9fd64d}
}
html[data-theme='light'] .mail-banner{background:linear-gradient(90deg,#dcf0fa,#eff7fc);border-color:#a8cee2;color:#12384d}
html[data-theme='light'] .mail-banner-mark{background:#cbe8f7;color:#15607f}
html[data-theme='light'] .mail-banner-link{background:#fff;border-color:#9dc6dc;color:#0b5d85}
.settings-toggle{display:flex;align-items:center;gap:10px;margin:14px 0 6px;color:#d4e6f2;font-size:11px;cursor:pointer}
.settings-toggle input{width:17px;height:17px;accent-color:#3aa7e0}
.settings-hint{color:#7b8fa1;font-size:9px;line-height:1.6}
html[data-theme='light'] .settings-toggle{color:#1a3b51}
html[data-theme='light'] .settings-hint{color:#54707f}
@keyframes fresh-mail-fade{0%{background:#12445e}100%{background:transparent}}
.message-row.fresh-mail{animation:fresh-mail-fade 30s ease-out forwards;box-shadow:inset 3px 0 #69caff}
html[data-theme='light'] .message-row.fresh-mail{animation-name:fresh-mail-fade-light}
@keyframes fresh-mail-fade-light{0%{background:#d8effb}100%{background:transparent}}
@media(prefers-reduced-motion:reduce){.message-row.fresh-mail{animation:none;background:#12445e}}
.mail-banner-mark.quiet{background:#33414d;color:#c3d4e0}
.mail-banner-text span{color:#a9c4d6;font-size:9px}
html[data-theme='light'] .mail-banner-mark.quiet{background:#dde7ee;color:#3f5a6b}
html[data-theme='light'] .mail-banner-text span{color:#42627a}
/* 4.15: Das Banner ist ein viertes Kind des Dokumentenfensters. Ohne diese
   Zeile rutschte die Tabelle in eine implizite Zeile und der Tabellenkopf
   stand mitten im Fenster. Die Tabelle bekommt darum fest die letzte Zeile;
   ist das Banner ausgeblendet, bleibt dessen Zeile einfach leer. */
.message-pane{grid-template-rows:auto auto auto minmax(0,1fr)}
.message-pane>.mail-banner{grid-row:1}
.message-pane>.message-toolbar{grid-row:2}
.message-pane>.library-count-bar{grid-row:3}
.message-pane>.message-table-scroll{grid-row:4}
/* 4.16: Nachweis statt Buchung. Ruhiger Kasten, kein Alarm: Der Beleg ist
   richtig abgelegt, er gehoert nur nicht in die Summen. */
.nachweis-notice{display:grid;gap:7px;margin:14px 0 0;padding:13px;border:1px solid #3c5f52;border-radius:11px;background:#10261f;color:#c7e6d8;font-size:9px;line-height:1.6}
.nachweis-notice[hidden]{display:none}
.nachweis-notice strong{color:#8fe3bd;font-size:11px}
.nachweis-notice .nachweis-open{color:#e3b53f}
.nachweis-link{padding:0;border:0;background:transparent;color:#9fdcff;font:inherit;text-decoration:underline;cursor:pointer}
.nachweis-notice .ghost{justify-self:start;min-height:32px;padding:7px 11px;font-size:9px}
html[data-theme='light'] .nachweis-notice{border-color:#a9cebd;background:#eaf7f0;color:#1d4636}
html[data-theme='light'] .nachweis-notice strong{color:#176848}
html[data-theme='light'] .nachweis-link{color:#0b5d85}
.review-reason{display:grid;gap:8px}
.review-actions{display:flex;flex-wrap:wrap;gap:7px}
.review-actions .ghost{min-height:30px;padding:6px 10px;font-size:9px}
/* 4.18: Posteingang auf der Startseite. Eine Zeile je Beleg, der Mandant
   steht dabei; fehlt er, wird er hier ausgewaehlt. */
.inbox-note{margin:0 0 12px;color:#8ba3b6;font-size:10px}
.inbox-note.warn{color:#e3b53f}
.inbox-row .document-actions{align-items:center;gap:7px}
.inbox-select{min-height:31px;max-width:210px;border:1px solid #3b5a72;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 8px;font-size:10px}
.inbox-customer{border-color:#3e6b86!important;color:#9fdcff!important}
.inbox-customer.missing{border-color:#7a4a45!important;color:#ffb2a7!important}
.inbox-reject{color:#ffb2a7}
[data-inbox-state="offen"]{border-color:#7a4a45!important;color:#ffb2a7!important}
[data-inbox-state="laeuft"]{border-color:#6a6030!important;color:#ffe08a!important}
[data-inbox-state="fehler"]{border-color:#7a4a45!important;color:#ffb2a7!important}
[data-inbox-state="fertig"]{border-color:#2f6a52!important;color:#91e8c3!important}
html[data-theme='light'] .inbox-note{color:#4d6a7d}
html[data-theme='light'] .inbox-select{background:#fff;color:#13354a}
/* 4.20: Posteingang mit Vorschlag und liegen gebliebenen Mails. */
.inbox-heading{margin:20px 0 10px;color:#7d95a8;font-size:9px;letter-spacing:.14em;text-transform:uppercase}
.inbox-suggestion{display:block;margin-top:6px;color:#8fb6cc;font-size:9px;line-height:1.5}
.inbox-row.liegen{opacity:.82}
.inbox-row.liegen .file-badge.quiet{background:#243240;color:#93a9b8}
.inbox-select:disabled{opacity:.5}
.document-actions button:disabled{opacity:.45;cursor:not-allowed}
html[data-theme='light'] .inbox-heading{color:#54707f}
html[data-theme='light'] .inbox-suggestion{color:#3f6076}
html[data-theme='light'] .inbox-row.liegen .file-badge.quiet{background:#e3ebf1;color:#4a6273}
/* 4.20: Je Position ein Knopf zum Umhaengen. Die Zeile bekommt dafuer eine
   weitere schmale Spalte; ohne sie draengt der Knopf die Bezeichnung weg. */
.line-item{grid-template-columns:minmax(0,1fr) 34px 58px auto auto}
.line-item-move{width:28px;height:28px;align-self:center;border:1px solid #35556d;border-radius:7px;
  background:#102537;color:#9edcff;font-size:12px;cursor:pointer}
.line-item-move:hover{border-color:#69caff;color:#d5f1ff}
.move-items-list{display:grid;gap:7px;max-height:220px;overflow:auto;margin:14px 0;padding:11px;
  border:1px solid #2b4358;border-radius:11px;background:#0a151f}
.move-items-list label{display:flex;align-items:flex-start;gap:9px;color:#d2e3ef;font-size:10px;line-height:1.45}
.move-items-list input{margin-top:2px;width:15px;height:15px;accent-color:#3aa7e0}
.move-items-list small{display:block;color:#7f97a9;font-size:9px}
html[data-theme='light'] .line-item-move{background:#eef5fa;border-color:#a9c6d8;color:#0b5d85}
html[data-theme='light'] .move-items-list{background:#f4f9fc;border-color:#c2d6e2}
html[data-theme='light'] .move-items-list label{color:#1b3b50}
/* 4.20: Statuspunkte auf den Bereichsfeldern, Ablagen des gewaehlten Belegs. */
.ledger-card{position:relative}
.ledger-card .status-stack{position:absolute;top:9px;right:9px}
.selected-file .file-edit{margin-left:auto;min-height:30px;padding:6px 11px;font-size:9px;flex:0 0 auto}
.spread-notice{display:grid;gap:7px;margin:13px 0 0;padding:12px;border:1px solid #2f4d63;border-radius:11px;
  background:#0c1c29;color:#b9cfdd;font-size:9px;line-height:1.55}
.spread-notice[hidden]{display:none}
.spread-notice strong{color:#cde6f5;font-size:11px}
.spread-link{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  padding:7px 9px;border:1px solid #2f4d63;border-radius:8px;background:#0a1621;color:#a8c6d8;
  font:inherit;text-align:left;cursor:pointer}
.spread-link:hover{border-color:#69caff;color:#e0f4ff}
.spread-link.hier{border-color:#4d93b8;color:#d5f1ff}
.spread-link b{flex:0 0 auto;color:#e2f1fa}
html[data-theme='light'] .spread-notice{background:#eff6fb;border-color:#b9d3e2;color:#2b4d62}
html[data-theme='light'] .spread-link{background:#fff;border-color:#c2d8e5;color:#1d4a63}
/* 4.21: Der Rand eines Bereichsfeldes traegt dieselben Farben wie die Linien
   im Baum. Der Farbverlauf liegt in der Randflaeche, die Fuellung darueber:
   so bleibt der Rahmen mehrfarbig, ohne ein zweites Element. */
.ledger-card.mit-status{border-color:transparent;
  background-image:linear-gradient(135deg,#111f2e,#0b1520),var(--status-rand);
  background-origin:border-box;background-clip:padding-box,border-box}
.ledger-card.mit-status.active{background-image:linear-gradient(135deg,#17354d,#0c1d2c),var(--status-rand)}
.ledger-card.mit-status.pulsing{background-image:none}
html[data-theme='light'] .ledger-card.mit-status{
  background-image:linear-gradient(135deg,#fff,#eef4f8),var(--status-rand)}
html[data-theme='light'] .ledger-card.mit-status.active{
  background-image:linear-gradient(135deg,#e1f3fd,#f5fbff),var(--status-rand)}
/* 4.22: Der Name oben rechts klappt das Abmelden auf. Bis dahin stand der
   Knopf dauerhaft daneben und war der auffaelligste Knopf der Kopfzeile. */
.user-menu{position:relative}
.user-menu>summary{list-style:none;cursor:pointer;padding:6px 11px;border:1px solid #2c4358;border-radius:9px;
  background:#0e1b28}
.user-menu>summary::-webkit-details-marker{display:none}
.user-menu>summary:after{content:'⌄';margin-left:7px;color:#7e98ab}
.user-menu>summary:hover{border-color:#4d93b8;color:#d5f1ff}
.user-menu[open]>summary{border-color:#4d93b8}
.user-menu-body{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:150px;padding:8px;
  border:1px solid #2c4358;border-radius:11px;background:#0d1b27;box-shadow:0 18px 40px #0007}
.user-menu-body .ghost{width:100%}
html[data-theme='light'] .user-menu>summary{background:#fff;border-color:#c2d6e2}
html[data-theme='light'] .user-menu-body{background:#fff;border-color:#c2d6e2;box-shadow:0 18px 40px #4562731c}

/* 4.23: Der Knopf zum Oeffnen des Belegs faellt weg, der Betrag selbst
   oeffnet ihn. Damit stehen in der Zeile noch fuenf Felder, und die beiden
   verbliebenen Knoepfe liegen auf einer Hoehe nebeneinander statt versetzt. */
.line-item{grid-template-columns:minmax(0,1fr) 34px 66px 28px 28px;gap:6px;align-items:center}
.line-item>span{align-self:center}
.line-item-amount{align-self:center;width:100%;padding:3px 2px;border:1px solid transparent;border-radius:7px;
  background:transparent;color:#cfe7f4;font:inherit;font-size:11px;font-weight:700;text-align:right;cursor:pointer}
.line-item-amount:hover,.line-item-amount:focus-visible{border-color:#3f6c8a;background:#102537;color:#d5f1ff}
.line-item-release,.line-item-move{align-self:center}
html[data-theme='light'] .line-item-amount{color:#173e55}
html[data-theme='light'] .line-item-amount:hover,html[data-theme='light'] .line-item-amount:focus-visible{
  border-color:#a9c6d8;background:#eef5fa;color:#0b5d85}
/* 4.23: Derselbe Fehler wie in 4.15, eine Ebene hoeher. Der Arbeitsplatz hat
   drei Rasterzeilen, aber die Meldung ganz oben ist im Normalfall
   ausgeblendet und damit kein Rasterkind. Dadurch rutschte der Kasten in die
   erste Zeile und die Fusszeile in die 640 Pixel hohe Mittelzeile: Die Seite
   wurde 640 Pixel zu hoch, musste gescrollt werden, und weil die Bereiche in
   Kaesten mit overflow:hidden stehen, endete die Scrollkette des Mausrades
   dort. Feste Zeilen halten jedes Kind an seinem Platz. */
.records-shell>.action-notice{grid-row:1}
.records-shell>.records-workbench{grid-row:2}
.records-shell>.records-footer{grid-row:3;min-height:0}
/* 4.23: Farbschema und Tokenverbrauch stehen jetzt in den Einstellungen. Der
   Umschalter und der Tokenknopf sind aus der Kopfzeile verschwunden; dort
   steht rechts nur noch der angemeldete Benutzer. */
.settings-tokens .dialog-intro{margin:14px 0 16px}
.settings-tokens .token-grid{margin-top:0}
.settings-tokens .settings-actions{margin-top:16px}
.topbar .top-right>.user-menu{margin-left:4px}
/* Ab 4.36: Der Reiter Kanzlei oeffnet kein eigenes Fenster mehr, sondern ein
   kleines Menue direkt unter dem Reiter, genau wie das Konto-Menue daneben. */
.kanzlei-dropdown .user-menu-body{min-width:236px}
/* Ab 4.37 klappt "Meine Einstellungen" genauso auf, mit derselben Klasse. */
#farbschemaDialog .theme-options{margin-top:14px}
.kanzlei-dropdown .user-menu-body .ghost{display:block;text-align:left;white-space:normal;margin-bottom:4px}
.kanzlei-dropdown .user-menu-body .ghost:last-child{margin-bottom:0}
.kanzlei-dropdown .user-menu-body .ghost[hidden]{display:none}
/* 4.23: Die Startseite nutzt die Bildschirmbreite. Der Posteingang stand
   unter den beiden Karten und war nur nach dem Scrollen zu sehen; jetzt
   steht er in der linken Spalte unter der Kundenwalze und fuellt die
   verbleibende Hoehe. Der Kopfbereich ist dafuer schmaler geworden. */
.app-shell{max-width:min(1780px,97vw);padding:20px clamp(16px,2vw,36px) 14px}
.page-top{margin-bottom:16px;align-items:center}
.page-top h1{margin:8px 0 8px;font-size:clamp(26px,2.4vw,38px)}
.page-top p{font-size:13px;line-height:1.55;margin-left:5ch}
.workspace{grid-template-columns:minmax(0,1.42fr) minmax(310px,.58fr);gap:18px;align-items:stretch;
  min-height:calc(100vh - 236px)}
.workspace-left{display:grid;grid-template-rows:auto minmax(220px,1fr);gap:18px;min-width:0;min-height:0}
.workspace-left>.history{margin-top:0;min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr)}
.workspace-left>.history>.panel-head{grid-row:1}
.workspace-left>.history>.inbox-note{grid-row:2;padding:0 28px}
.workspace-left>.history>.inbox-list{grid-row:3;min-height:0;overflow:auto;overscroll-behavior:contain}
.history .panel-head{padding-bottom:14px}
.bottom-note{padding:12px 2px}
/* 4.24: Interview-Link und Trennblatt teilen sich eine Zeile. Beide fuehren
   aus dem Mandanten heraus und gehoeren nebeneinander. */
.detail-actions .interview-action{grid-column:auto;width:100%;white-space:normal;font-size:12px}
.detail-actions .separator-action{grid-column:auto;display:grid;place-items:center;min-height:43px;
  padding:6px 10px;text-decoration:none;text-align:center;font-size:12px;line-height:1.25}
.detail-actions .separator-action[aria-disabled="true"]{opacity:.45;pointer-events:none}
.inbox-bulk{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.inbox-bulk b{color:#aedff5;font-size:11px;white-space:nowrap}
.inbox-bulk .inbox-select{max-width:250px}
.inbox-pick{display:grid;place-items:center;width:22px}
.inbox-pick input{width:16px;height:16px;accent-color:#3aa7e0;cursor:pointer}
.inbox-row.waehlbar{grid-template-columns:22px 42px 1fr auto auto}
@media(max-width:850px){.workspace{min-height:0}.workspace-left{grid-template-rows:auto auto}
  .workspace-left>.history>.inbox-list{overflow:visible}}
/* 4.23: Benutzerverwaltung in den Einstellungen, sichtbar nur fuer den
   Administrator. */
.settings-users{grid-column:1/-1}
.user-list{display:grid;gap:9px;margin:18px 0 8px;max-height:340px;overflow-y:auto}
.user-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;
  padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}
.user-copy{display:grid;gap:3px;min-width:0}
.user-copy strong{font-size:13px}
.user-copy small{color:#7f9bb0;font-size:10px}
.user-state{font-size:10px;color:#8fb6cc}
.user-state.gesperrt{color:#ff9187}
.user-state.wartet{color:#e3b53f}
.user-state.aktiv{color:#66d6a6}
.user-role{padding:5px 9px;border:1px solid #3b5a72;border-radius:8px;color:#9fdcff;font-size:10px;
  white-space:nowrap}
.user-role.admin{border-color:#4d93b8;background:#12293a;color:#d5f1ff}
.user-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.user-fixed{color:#7f9bb0;font-size:10px}
.user-form{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.user-form h3{margin:0;font-size:12px;color:#9fbccd;letter-spacing:.06em;text-transform:uppercase}
.invite-box{margin-top:16px;padding:14px;border:1px solid #3e6b86;border-radius:11px;background:#0c1c29}
.invite-box[hidden]{display:none}
.invite-box strong{display:block;color:#cde6f5;font-size:12px}
.invite-box p{margin:6px 0 11px;color:#8fb6cc;font-size:11px;line-height:1.55}
html[data-theme='light'] .user-copy small,html[data-theme='light'] .user-fixed{color:#536f82}
html[data-theme='light'] .invite-box{background:#eff6fb;border-color:#b9d3e2}
html[data-theme='light'] .invite-box strong{color:#1d4a63}
html[data-theme='light'] .invite-box p{color:#3f6076}
/* Ab 4.36: Endgueltig loeschen darf nur der SuperAdmin, und selbst dann erst
   nach dem eigenen Passwort. Die Bestaetigung klappt unter der Zeile auf,
   damit sie nicht mit einem einzigen Klick daneben ausgeloest werden kann. */
.user-delete-confirm{grid-column:1/-1;margin-top:2px;padding:11px 13px;border:1px solid #7a3350;
  border-radius:10px;background:#2a1420}
.user-delete-confirm p{margin:0 0 9px;color:#e6b9cb;font-size:11px;line-height:1.5}
.user-delete-row{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.user-delete-row input{flex:1 1 180px;min-width:0;height:34px;border:1px solid #7a3350;border-radius:9px;
  background:#07111d;color:var(--text);padding:0 11px;font:inherit;font-size:12px}
.user-delete-row .danger-button{min-height:34px;padding:0 12px;font-size:11px;border-radius:9px}
.user-delete-row .ghost{min-height:34px;padding:0 12px;font-size:11px}
html[data-theme='light'] .user-delete-row input{background:#fff;border-color:#dfa2bb}
html[data-theme='light'] .user-delete-confirm{background:#fceef2;border-color:#dfa2bb}
html[data-theme='light'] .user-delete-confirm p{color:#7c2c48}
@media(max-width:760px){.user-row{grid-template-columns:1fr}.user-actions{justify-content:flex-start}}
/* 4.23, zweiter Schliff: Ohne feste Hoehe wuchs die linke Spalte mit ihrem
   Inhalt, und der Posteingang stand wieder unterhalb des Fensterrandes. Die
   Arbeitsflaeche bekommt deshalb die Hoehe, die nach Kopf- und Fusszeile
   uebrig ist, und die Kundenwalze richtet sich nach der Fensterhoehe. */
.workspace{height:calc(100vh - 272px);min-height:690px;max-height:none}
/* Die Kundenkarte darf schrumpfen, aber nichts abschneiden: Sie ist eine
   Spalte, in der allein die Walze nachgibt. Der erste Versuch gab ihr eine
   feste Hoehe aus der Fensterhoehe; auf einem flacheren Bildschirm blieb
   weniger uebrig, als die Karte brauchte, und die Walze war nur noch zu
   erahnen. Die Hoehe kommt jetzt aus dem, was wirklich da ist. */
.workspace-left{grid-template-rows:minmax(0,auto) minmax(250px,1fr)}
.workspace-left>.customer-panel{min-height:0;display:flex;flex-direction:column}
.customer-panel{--walze-feld:84px;--walze-luft:132px}
/* Die Walze haette gern vier Zeilen, gibt aber bis auf zwei nach, wenn der
   Bildschirm flach ist. Wachsen soll sie nicht: Der Platz darueber hinaus
   gehoert dem Posteingang. */
.customer-panel .wheel-stage{flex:0 1 348px;min-height:170px;height:auto}
.customer-panel .wheel{height:100%}
.customer-panel .wheel,.customer-panel .wheel-stage{min-height:0}
.customer-panel .wheel{padding-block:var(--walze-luft)}
.customer-panel .selection-band{top:var(--walze-luft)}
.customer-panel .wheel-stage:before,.customer-panel .wheel-stage:after{
  height:max(24px,calc(var(--walze-luft) - 12px))}
.workspace>.detail{min-height:0;overflow:auto;overscroll-behavior:contain}
@media(max-width:850px){.workspace{height:auto;max-height:none}
  .workspace-left{grid-template-rows:auto auto}
  .customer-panel .wheel-stage{flex:0 0 auto;height:348px}
  .workspace>.detail{overflow:visible}}
/* 4.23: Auf einem flachen Bildschirm ruecken Kundenkarte und Walze enger
   zusammen, damit der Posteingang und der Knopf in den Arbeitsplatz ohne
   Scrollen sichtbar bleiben. */
@media(max-height:1080px){
  .page-top p{display:none}
  .page-top h1{margin:4px 0 0}
  .customer-panel .wheel-hint p{display:none}
  .customer-panel .wheel-hint{padding-bottom:14px;justify-content:flex-end}
  .customer-view-controls{gap:10px}
  .workspace>.detail{padding:20px}
  .workspace>.detail .detail-top{margin-bottom:14px}
  .workspace>.detail .detail-icon{width:48px;height:48px;font-size:17px}
  .workspace>.detail h2{margin:12px 0 5px}
  .workspace>.detail .facts{gap:12px;margin:16px 0 14px;padding:14px 0}
  .workspace>.detail .detail-note{margin-bottom:14px;font-size:11px;line-height:1.55}
  .workspace>.detail .detail-actions{gap:8px}
  .workspace>.detail .detail-actions>*{min-height:40px}
}

/* 4.23: Auf einem flachen Bildschirm kostet jeder Zierstreifen eine Belegzeile.
   Der Kopfbereich schrumpft auf eine Zeile, der Hinweis unter der Walze
   entfaellt (Mausrad, Klick und Pfeiltasten bedienen sie weiter), und die
   Eingabefelder werden flacher. Das sind rund 145 Pixel, die Walze und
   Posteingang gewinnen. */
@media(max-height:940px){
  .page-top{margin-bottom:10px}
  .page-top>div>.overline{display:none}
  .page-top h1{margin:0;font-size:22px;letter-spacing:-.03em}
  .page-top-brand{display:none}
  .app-shell{padding-top:12px}
  .customer-panel .wheel-hint{display:none}
  .customer-panel .panel-head{padding-top:16px}
  .customer-panel .search input,.customer-view-controls select{height:40px}
  .customer-view-controls{margin-bottom:4px}
  .workspace-left>.history>.panel-head{padding-top:16px;padding-bottom:10px}
  .workspace-left>.history>.panel-head h2{font-size:15px}
  .workspace{height:calc(100vh - 186px);min-height:608px}
  .workspace-left{grid-template-rows:minmax(0,auto) minmax(220px,1fr)}
  .workspace>.detail .detail-note-text{display:none}
  .workspace>.detail .detail-actions>*{min-height:38px}
  .workspace>.detail .facts{gap:10px;margin:12px 0 12px;padding:12px 0}
  .workspace>.detail .detail-note{margin-bottom:12px}
}
/* 4.26: Fuer den Administrator traegt die Kundenwalze neben dem Namen die
   drei Statuspunkte, die Zustaendigkeit und den Stand des Interviews. Ein
   Mitarbeiter sieht die Walze unveraendert. */
.customer-option-copy{min-width:0;flex:1 1 auto}
.customer-option .option-check{margin-left:0}
.detail-actions .interview-action.erledigt{background:transparent;border-color:var(--line);color:#a9c2d3;
  box-shadow:none}
.detail-actions .interview-action.erledigt:hover{border-color:#54789a;color:#d5f1ff}
html[data-theme='light'] .customer-option-admin{color:#536f82}
/* 4.26: Der Knopf zum Anlegen steht neben der Suche und hat dort Gewicht.
   Das spart oben eine Zeile und macht die wichtigste Handlung der Seite
   sichtbar; die Suche braucht die volle Breite nicht. */
.search-row{display:flex;align-items:center;gap:12px;margin:16px 27px 0}
.search-row>.search{flex:1 1 auto;min-width:0;margin:0}
.add-customer{flex:0 0 auto;min-height:48px;padding:0 20px;font-size:14px;font-weight:650;white-space:nowrap}
.customer-panel .panel-head{padding-bottom:0}
@media(max-height:940px){.search-row{margin-top:10px}.add-customer{min-height:40px;font-size:13px}}
@media(max-width:600px){.search-row{flex-wrap:wrap}.add-customer{width:100%}}
/* 4.26: In der Kundenwalze haben die Statuspunkte Platz. Die schmale Form
   aus dem Ablagebaum waere hier nicht zu erkennen, und genau darum geht es:
   auf einen Blick sehen, wo noch etwas offen ist. */
.customer-option>.status-stack{flex-direction:row!important;align-items:center!important;
  width:auto!important;min-width:0!important;height:auto!important;gap:5px!important}
.customer-option>.status-stack>.folder-status{width:9px!important;height:9px!important;
  min-width:9px!important;min-height:9px!important;border-radius:50%!important;opacity:1!important}
.customer-option>.status-stack>.folder-status.empty{background:transparent!important;
  border:1px solid #33506610!important;box-shadow:none!important;opacity:.35!important}
.customer-option>.status-stack>.folder-status.red.present{background:#d94e4e!important;
  box-shadow:0 0 7px #d94e4e99!important}
.customer-option>.status-stack>.folder-status.yellow.present{background:#e3b53f!important;
  box-shadow:0 0 7px #e3b53f99!important}
.customer-option>.status-stack>.folder-status.green.present{background:#36b879!important;
  box-shadow:0 0 7px #36b87988!important}
html[data-theme='light'] .customer-option>.status-stack>.folder-status.empty{
  border-color:#c2d6e2!important}
/* 4.26: Die Einstellungen standen in einer schmalen Spalte, waehrend daneben
   Platz frei blieb. Mit der neuen Stellschraube wurde die Auswertungskarte
   zu einer langen Wurst. Jetzt teilen sich die Karten den Platz, und die
   beiden inhaltsreichen laufen ueber die ganze Breite. */
.settings-grid{grid-template-columns:repeat(auto-fit,minmax(330px,1fr));align-items:start}
.settings-grid>.settings-columns,.settings-grid>.settings-users{grid-column:1/-1}
.settings-felder{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:8px 26px;align-items:start;margin-top:8px}
.settings-feld{min-width:0;padding:14px 0}
.settings-feld>.settings-customer:first-child,.settings-feld>.settings-toggle:first-child{margin-top:0}
.settings-feld>.settings-hint{margin-bottom:0}
@media(max-width:760px){.settings-grid{grid-template-columns:1fr}}

/* 4.27: Die Kundenwalze wird fuer den Administrator zu einer Tabelle. Die
   Angaben standen untereinander und liessen sich so nicht vergleichen; in
   Spalten mit Ueberschrift sieht man auf einen Blick, wo etwas liegt und wer
   zustaendig ist. Kopfzeile und Zeilen teilen sich dieselben Spalten. */
.als-admin .wheel-head,.als-admin .customer-option{
  display:grid;grid-template-columns:44px minmax(0,1fr) 140px 128px 92px 66px 24px;gap:15px;align-items:center}
.customer-col.geraete{text-align:center;cursor:pointer;border-radius:6px}
.customer-col.geraete:hover{background:#ffffff14;color:#bfe9ff}
/* Die Raender muessen denen der Zeilen genau entsprechen, sonst stehen die
   Ueberschriften neben ihren Werten statt darueber: Buehne 18, Walze 12 und
   Zeile 16 Pixel ergeben zusammen 46. */
.wheel-head{margin:0 18px;padding:10px 28px 8px;border-bottom:1px solid var(--line);
  color:#7d95a8;font-size:9px;letter-spacing:.13em;text-transform:uppercase}
.wheel-head[hidden]{display:none}
.wheel-head>span:first-child{grid-column:1/3}
.wheel-head-status{display:flex;align-items:center;gap:6px;white-space:nowrap}
.wheel-head-status .legende{display:inline-flex;gap:3px}
.wheel-head-status .legende>i{width:7px;height:7px;border-radius:50%}
.wheel-head-status .legende>.red{background:#d94e4e}
.wheel-head-status .legende>.yellow{background:#e3b53f}
.wheel-head-status .legende>.green{background:#36b879}
.customer-col{min-width:0;font-size:11px;color:#a9c2d3;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.customer-col.leer{color:#69818f;font-style:italic}
.customer-col.interview.fertig{color:#66d6a6}
.customer-col.interview.laeuft{color:#e3b53f}
.customer-col.interview.offen{color:#8a9fae}
.als-admin .customer-option>.status-stack{justify-self:center}
html[data-theme='light'] .customer-col{color:#37596e}
html[data-theme='light'] .customer-col.leer{color:#7b8f9c}
html[data-theme='light'] .wheel-head{color:#54707f}
/* Auf schmalen Fenstern fallen die beiden Textspalten weg; die Punkte
   bleiben, denn sie sind der eigentliche Grund fuer die Zeile. */
@media(max-width:1250px){
  .als-admin .wheel-head,.als-admin .customer-option{grid-template-columns:44px minmax(0,1fr) 66px 24px}
  .als-admin .customer-col{display:none}
  .wheel-head>span:nth-child(2),.wheel-head>span:nth-child(3),.wheel-head>span:nth-child(4){display:none}
}
/* 4.27: Der drehende Kreis aus dem Posteingang auch in der Kundenwalze. */
.customer-option .status-stack>.row-busy-spinner{width:13px;height:13px;margin-left:2px}
.customer-option .status-stack.nur-kreis{flex-direction:row!important;width:auto!important;
  min-width:0!important;height:auto!important;margin-left:auto;margin-right:10px}
/* 4.28: Der Spaltenkopf "Status" stand links an der Kante, waehrend die
   Statuspunkte in den Zeilen darunter eingerueckt beginnen. Nur die
   Beschriftung rueckt nach, die Spalte selbst bleibt, wo sie ist. */
.message-list-head .status-column-head>.column-label{padding-left:5ch}
/* 4.29: Der Banner ueber dem Posteingang meldet eingegangene Mails, sobald
   sie abgeholt sind, und nicht erst nach der Auswertung. */
.eingang-banner{display:flex;align-items:flex-start;gap:13px;margin:0 28px 12px;padding:13px 15px;
  border:1px solid #3e6b86;border-radius:12px;background:#0c1c29}
.eingang-banner[hidden]{display:none}
.eingang-banner-mark{flex:0 0 auto;width:30px;height:30px;display:grid;place-items:center;
  border-radius:9px;background:#16344b;color:#9edcff;font-size:14px}
.eingang-banner-text{display:grid;gap:3px;min-width:0;flex:1 1 auto}
.eingang-banner-text strong{color:#cde6f5;font-size:12px}
.eingang-banner-text span{color:#8fb6cc;font-size:10px;line-height:1.5;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.eingang-banner-stand{color:#66d6a6!important}
.eingang-banner>.ghost{flex:0 0 auto;min-height:32px;padding:0 12px;font-size:11px}
html[data-theme='light'] .eingang-banner{background:#eff6fb;border-color:#b9d3e2}
html[data-theme='light'] .eingang-banner-text strong{color:#1d4a63}
html[data-theme='light'] .eingang-banner-text span{color:#3f6076}
/* 4.29: In der Aufschluesselung laesst sich je Position der Steuersatz
   nachtragen. Steht auf dem Beleg keine Umsatzsteuer, weiss die Kanzlei
   trotzdem, welcher Satz gilt. */
.breakdown-fix{width:118px;text-align:right;white-space:nowrap}
.breakdown-fix select{min-height:28px;max-width:74px;border:1px solid #3b5a72;border-radius:7px;
  background:#0d1a27;color:#d9e8f2;font-size:10px;padding:0 4px}
.breakdown-fix .tiny-action{min-height:28px;margin-left:5px;padding:0 8px}
.breakdown-table th.breakdown-fix{color:#7f98ac}
html[data-theme='light'] .breakdown-fix select{background:#fff;border-color:#c2d6e2;color:#1d4a63}

/* 4.30: Rohantwort der Erkennung. Bewusst schlicht und mit fester Schrift,
   denn hier wird gelesen und verglichen, nicht gestaltet. */
.rohdaten-dialog{max-width:min(920px,92vw)}
.rohdaten-scroll{max-height:min(58vh,560px);overflow:auto;border:1px solid var(--line);
  border-radius:10px;background:var(--surface-sunken,rgba(0,0,0,.18))}
.rohdaten-scroll pre{margin:0;padding:14px 16px;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  white-space:pre-wrap;word-break:break-word;color:var(--text)}

/* 4.31: Beleg-App. Die Liste der gekoppelten Handys steht im selben Fenster
   wie der Einrichtungslink, damit Koppeln und Trennen nebeneinander liegen. */
/* Ab 4.37 breiter und dafuer niedriger: links das Einrichten, rechts
   Ergebnis und Geraete, damit alles ohne langes Scrollen Platz hat. */
#belegAppDialog{width:min(1120px,calc(100% - 28px))}
.beleg-app-dialog{max-width:none}
.beleg-app-kopf{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:22px;align-items:center;margin-bottom:14px}
.beleg-app-kopf .customer-lock,.beleg-app-kopf .dialog-intro{margin:0}
.beleg-app-spalten{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.beleg-app-ergebnis{min-width:0;padding-left:24px;border-left:1px solid var(--line)}
.beleg-app-ergebnis .beleg-app-head:first-child,#belegAppLinkState[hidden]+.beleg-app-head{margin-top:0}
.beleg-app-dialog .field input,.beleg-app-dialog .field select{height:40px}
.beleg-app-dialog .beleg-app-ziel{margin-bottom:10px;padding:9px 12px}
.beleg-app-dialog .beleg-app-modus{margin-bottom:10px;padding:8px 12px}
.beleg-app-dialog .beleg-app-modus-choice{padding:3px 0}
.beleg-app-dialog .modal-actions{margin-top:10px}
.beleg-app-erklaerung{margin:0 0 6px}
@media(max-width:860px){.beleg-app-kopf,.beleg-app-spalten{grid-template-columns:1fr}
  .beleg-app-ergebnis{padding-left:0;border-left:0}}
.beleg-app-head{font-size:14px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);
  margin:18px 0 8px}
.beleg-app-head .geraete-count{font-weight:400;text-transform:none;letter-spacing:0}
.geraete-liste{list-style:none;margin:0;padding:0;max-height:min(40vh,320px);overflow:auto}
.geraet-zeile{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding:12px 0;border-top:1px solid var(--line)}
.geraet-zeile:first-child{border-top:0}
.geraet-zeile strong{display:block;font-size:15px}
.geraet-zeile small{display:block;color:var(--muted);font-size:12.5px}
.geraet-zeile.getrennt strong,.geraet-zeile.abgelaufen strong{color:var(--muted);text-decoration:line-through}
.geraet-stand{display:inline-block;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;
  border-radius:20px;padding:2px 9px;margin:3px 0 4px;border:1px solid var(--line);color:var(--muted)}
.geraet-zeile.verbunden .geraet-stand{color:#5fd39b;border-color:rgba(95,211,155,.45)}
.geraet-zeile.wartet .geraet-stand{color:#e0b455;border-color:rgba(224,180,85,.45)}
.geraet-leer{color:var(--muted);font-size:14px;padding:10px 0}

/* 4.32: Der Eingang zeigt alles, was hereinkommt. Die Herkunft steht deshalb
   an jeder Zeile, sonst sieht eine Mail aus wie ein Handyfoto. */
.document-tags .herkunft{border-radius:20px;padding:2px 9px;font-size:11.5px;letter-spacing:.04em;
  text-transform:uppercase;border:1px solid var(--line);color:var(--muted)}
.document-tags .herkunft.mail{color:#7fb6ea;border-color:rgba(127,182,234,.42)}
.document-tags .herkunft.app{color:#5fd39b;border-color:rgba(95,211,155,.42)}
.beleg-app-ziel{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;margin-bottom:14px;
  border:1px solid var(--line);border-radius:12px;cursor:pointer}
.beleg-app-ziel input{margin-top:3px;flex:0 0 auto}
.beleg-app-ziel strong{display:block;font-size:14.5px}
.beleg-app-ziel small{display:block;color:var(--muted);font-size:12.5px;margin-top:3px}
.geraet-code{margin-top:4px}
.geraet-code b{color:var(--text);letter-spacing:.08em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
/* Ab 4.36: Weg der Einladung (Link, Mail, QR-Code) und Dauer der Kopplung. */
.beleg-app-modus{margin:0 0 14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px}
.beleg-app-modus legend{padding:0 6px;color:var(--muted);font-size:12px}
.beleg-app-modus-choice{display:flex;gap:10px;align-items:center;padding:5px 0;cursor:pointer;font-size:13.5px}
.beleg-app-modus-choice input{flex:0 0 auto;margin:0}
.beleg-app-dauer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:14px}
.beleg-app-dauer .field[hidden],#belegAppEmailFeld[hidden],#belegAppLinkFeld[hidden]{display:none}
.beleg-app-dauer{margin-bottom:8px;row-gap:8px}
.beleg-app-qr{display:flex;justify-content:center;margin:4px 0 12px;padding:14px;border-radius:12px;background:#fff}
.beleg-app-qr[hidden]{display:none}
.beleg-app-qr svg{display:block;width:220px;height:220px;max-width:100%}
@media(max-width:520px){.beleg-app-dauer{grid-template-columns:1fr}}

/* 4.33: Anlegen und Löschen eines Mandanten gehören zusammen und stehen jetzt
   nebeneinander über der Liste. Unten rechts wird dadurch ein Platz frei, den
   die Beleg-App bekommt. */
.search-row>.kunde-weg{flex:0 0 auto;white-space:nowrap;min-height:48px;padding:0 16px;font-size:13.5px}
.search-row>.kunde-weg[disabled]{opacity:.45}
@media(max-height:940px){.search-row>.kunde-weg{min-height:40px;font-size:12.5px}}
@media(max-width:600px){.search-row>.kunde-weg{width:100%}}
/* Ab 4.37: Der feste Anmeldename des SuperAdmins sieht auch fest aus. */
#anmeldename:disabled{opacity:.6;cursor:not-allowed}
/* Ab 4.38: Kunde anlegen und Kunde loeschen stehen in der Zeile mit
   Sortierung und Kundenart. Die Suche bekommt die ganze Breite, und die
   Walze samt Posteingang gewinnt eine Zeile Hoehe. */
.customer-view-controls{grid-template-columns:minmax(0,1fr) minmax(0,.75fr) auto auto;align-items:end}
.customer-view-controls>.add-customer,.customer-view-controls>.kunde-weg{width:auto;min-height:38px;height:38px;
  padding:0 14px;font-size:12.5px;white-space:nowrap}
.customer-view-controls>.kunde-weg[disabled]{opacity:.45}
@media(max-width:760px){.customer-view-controls{grid-template-columns:1fr 1fr}
  .customer-view-controls>.add-customer,.customer-view-controls>.kunde-weg{width:100%}}
/* Ab 4.38: Die Meldung ueber neue Mails steht in einer eigenen Zeile und
   nimmt der Belegliste nie den Platz; sie ist knapp und laesst sich
   wegklicken. Bis 4.37 fiel sie in eine Rasterzeile unterhalb der Liste und
   drueckte die Belege aus dem sichtbaren Bereich. */
.workspace-left>.history{grid-template-rows:auto auto auto minmax(0,1fr)}
.workspace-left>.history>.eingang-banner{grid-row:2;margin-bottom:8px;padding:9px 12px}
.workspace-left>.history>.inbox-note{grid-row:3}
.workspace-left>.history>.inbox-list{grid-row:4}
.eingang-banner-text span:not(.eingang-banner-stand):nth-of-type(n+2){display:none}
/* Ab 4.38: Die Walzen lassen sich mit gedrueckter Maustaste ziehen. */
.walze-ziehbar{cursor:grab}
.walze-zieht,.walze-zieht *{cursor:grabbing!important;user-select:none}
.walze-zieht{scroll-snap-type:none!important;scroll-behavior:auto!important}
/* Ab 4.38: Querstriche im Ordnerbaum zeichnet das Skript, je Farbe einer. */
.folder-child:after{display:none!important}
.tree-branch{position:absolute;height:1px;z-index:2;pointer-events:none;display:block}
/* Ab 4.38: Freigabe des ganzen Belegs, ueber dem Dateizeichen. */
.row-utility.stacked .row-approve{order:0;width:31px;height:22px;display:grid;place-items:center;padding:0;
  border:1px solid #2f6b52;border-radius:7px;background:#12291f;color:#7fe0b3;font-size:13px;font-weight:800;
  cursor:pointer;line-height:1}
.row-utility.stacked .row-approve:hover{background:#1a3d2d;border-color:#45a57a}
.row-utility.stacked .row-approve.done{opacity:.35;cursor:default}
html[data-theme='light'] .row-utility.stacked .row-approve{background:#e3f5ec;border-color:#8fcdb0;color:#176846}
/* Ab 4.38: "Status" bricht in der Kopfzeile nicht mehr mitten im Wort um. */
.message-list-head .column-head.status-column-head{overflow:visible}
.message-list-head .status-column-head>.column-label{white-space:nowrap;overflow-wrap:normal}
/* Ab 4.38: Mit dem Haken ist die Leiste hoeher; etwas Luft zum Zeilenrand. */
.message-row .row-utility.stacked:has(.row-approve){padding-block:6px;gap:4px}
.message-row .row-utility.stacked:has(.row-approve) .row-trash{height:24px}
/* ===== 4.39 ===== */
/* Suche, Sortierung, Kundenart und die beiden Kundenknoepfe in EINER Zeile.
   Das spart eine Zeile, und die Walze mit dem Posteingang bekommt sie. */
.customer-panel .search-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 18px 0}
.customer-panel .search-row>.search{flex:1 1 200px;min-width:160px;margin:0}
.customer-panel .search-row>.search input{height:40px}
.customer-panel .search-row>.search>span{top:5px;font-size:24px}
.customer-panel .search-row>.customer-view-controls{display:flex;flex:0 1 auto;flex-wrap:nowrap;align-items:center;
  gap:8px;margin:0;min-width:0}
.customer-panel .search-row>.customer-view-controls>label{display:block;min-width:0}
.customer-panel .search-row>.customer-view-controls select{height:40px;width:auto;min-width:0;max-width:170px;
  padding:0 30px 0 11px;font-size:12.5px}
.customer-panel .search-row>.customer-view-controls>.add-customer,
.customer-panel .search-row>.customer-view-controls>.kunde-weg{flex:0 0 auto;width:auto;height:40px;min-height:40px;
  padding:0 11px;font-size:12.5px;white-space:nowrap}
@media(max-width:760px){.customer-panel .search-row>.customer-view-controls{flex-wrap:wrap;width:100%}}
/* Das Feld in der Mitte der Walze ist flacher: 66 statt 84 Pixel. */
.customer-panel{--walze-feld:66px}
.customer-panel .customer-option{height:var(--walze-feld);padding-top:8px;padding-bottom:8px}
.customer-panel .customer-option .monogram{width:38px;height:38px;border-radius:11px}
.customer-panel .customer-option strong{font-size:16px}
.customer-panel .customer-option small{margin-top:3px}
.customer-panel .selection-band{height:var(--walze-feld)}
.customer-panel .selection-band:before{top:calc(var(--walze-feld) / 2 - 12px);height:24px}
.customer-panel .wheel-stage{flex-basis:232px;min-height:150px}
/* Die Punkte in der Walze stehen nebeneinander und lassen sich anklicken. */
.customer-panel .customer-option>.status-stack:not(.nur-kreis){flex-direction:row!important;width:auto!important;
  min-width:0!important;height:auto!important;flex:0 0 auto!important;gap:3px!important;align-items:center!important}
.customer-panel .customer-option>.status-stack>.folder-status{width:9px!important;height:9px!important;
  min-width:9px!important;min-height:9px!important}
.customer-panel .customer-option>.status-stack>.walze-punkt{position:relative;cursor:pointer}
.customer-panel .customer-option>.status-stack>.walze-punkt:after{content:"";position:absolute;inset:-6px -3px}
.customer-panel .customer-option>.status-stack>.walze-punkt:hover{transform:scale(1.35)}
/* Die Kopfzeile: alles gleich hoch, gleiche Schrift, gleiche Farbe. */
.topbar .top-right{align-items:center;gap:8px}
.topbar .top-right>.topbar-link,.topbar .top-right>details>summary,.topbar .top-right>.demo-badge{
  display:inline-flex!important;align-items:center;box-sizing:border-box;height:36px;padding:0 13px!important;
  border:1px solid var(--line)!important;border-radius:10px!important;background:#0d1b28!important;
  color:#cfe6f5!important;font-size:13px!important;font-weight:600!important;letter-spacing:0!important;
  text-transform:none!important;line-height:1;white-space:nowrap;text-decoration:none}
.topbar .top-right>details{border:0!important;background:transparent!important;padding:0!important}
.topbar .top-right>.topbar-link:hover,.topbar .top-right>details>summary:hover{border-color:#4d93b8!important;color:#e4f5ff!important}
.topbar .top-right>.demo-badge{color:#8fb3c9!important;font-weight:500!important}
html[data-theme='light'] .topbar .top-right>.topbar-link,html[data-theme='light'] .topbar .top-right>details>summary,
html[data-theme='light'] .topbar .top-right>.demo-badge{background:#fff!important;color:#185675!important;border-color:#c2d6e2!important}
html[data-theme='light'] .topbar .top-right>.demo-badge{color:#4f7186!important}
/* Leerer Posteingang: was aus der letzten Mail geworden ist. */
.mail-bilanz{margin:4px 28px 16px;padding:12px 15px;border:1px solid #2c4a61;border-radius:12px;background:#0b1926}
.mail-bilanz>header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px}
.mail-bilanz>header strong{font-size:13px;color:#dcebf4}
.mail-bilanz>header span{font-size:12px;color:#8fd3a9;font-weight:600}
.mail-bilanz .bilanz-betreff{display:block;margin-top:3px;color:#7f98ac;font-size:11px}
.mail-bilanz ul{list-style:none;margin:9px 0 0;padding:0;display:grid;gap:4px}
.mail-bilanz li{display:flex;justify-content:space-between;gap:12px;padding:6px 9px;border-radius:8px;background:#0f2231;
  font-size:12.5px}
.mail-bilanz li a{color:#bfe8ff;text-decoration:none}
.mail-bilanz li a:hover{text-decoration:underline}
.mail-bilanz li small{color:#7f98ac;margin-left:5px}
.mail-bilanz li b{color:#dcebf4;white-space:nowrap}
.mail-bilanz li.bilanz-papierkorb{color:#8a9fae;background:transparent;border:1px dashed #2c4a61}
html[data-theme='light'] .mail-bilanz{background:#f4f9fc;border-color:#c6d5e0}
html[data-theme='light'] .mail-bilanz li{background:#e8f1f7}
html[data-theme='light'] .mail-bilanz>header strong,html[data-theme='light'] .mail-bilanz li b{color:#102333}
html[data-theme='light'] .mail-bilanz li a{color:#0f5f8a}
/* ===== 4.40 ===== */
/* "Mandanten sicher begleiten." steht rechts neben dem Logo in der Kopfzeile.
   Die eigene Zeile darunter entfaellt; Walze und Posteingang ruecken hoch. */
.topbar .start-titel{margin-left:28px}
.topbar .start-titel span{display:block!important;color:#6fc9f8;font-size:9px;font-weight:800;letter-spacing:.16em}
.topbar .start-titel strong{font-size:22px}
body:has(.start-titel) .page-top{display:none}
body:has(.start-titel) .app-shell{padding-top:16px}
.workspace{height:calc(100vh - 160px)}
@media(max-height:940px){.workspace{height:calc(100vh - 160px);min-height:600px}}
@media(max-width:850px){.workspace{height:auto}}
@media(max-width:760px){.topbar .start-titel{display:none}}
/* Der Name des gewaehlten Kunden ist ein Knopf zu seinen Kundendaten. */
#selectedName.kunde-bearbeiten{cursor:pointer;border-radius:8px;outline-offset:4px}
#selectedName.kunde-bearbeiten:hover{color:#bfe8ff;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.customer-option[aria-selected="true"] .customer-option-copy strong{cursor:pointer}
.customer-option[aria-selected="true"] .customer-option-copy strong:hover{text-decoration:underline;text-underline-offset:4px}
html[data-theme='light'] #selectedName.kunde-bearbeiten:hover{color:#0f5f8a}
/* Die aufgeklappten Menues der Kopfzeile liegen jetzt direkt ueber der Walze
   und muessen darueber stehen. */
.topbar{position:relative;z-index:60}
/* ===== 4.41: Bereich Bank ===== */
/* Ab 4.55: Bank und DATEV stehen nebeneinander in einer Reihe, je eine Spalte. */
.folder-pane .ledger-switcher>.bank-card,.folder-pane .ledger-switcher>.datev-card{min-height:46px}
.folder-pane .ledger-switcher>.bank-card strong,.folder-pane .ledger-switcher>.datev-card strong{white-space:normal;line-height:1.1}
.ledger-icon.bank{color:#9fc4ff;background:#1b2f55}
.status-label.blue,.bank-legend .blue{color:#6fb1ff}
.status-legend .blue{background:#3b82f6}
.records-workbench.bank-modus #folderTree,.records-workbench.bank-modus .folder-help,
.records-workbench.bank-modus .folder-path,.records-workbench.bank-modus #folderAreaTitle,
.records-workbench.bank-modus .message-pane>.message-toolbar:not(.bank-toolbar),
.records-workbench.bank-modus .message-pane>.library-count-bar:not(.bank-count-bar),
.records-workbench.bank-modus .message-pane>.message-table-scroll,
.records-workbench.bank-modus #mailBanner,.records-workbench.bank-modus #bankHinweis,
.records-workbench.bank-modus #customerInspector,.records-workbench.bank-modus #documentInspector{display:none!important}
.records-workbench.bank-modus .folder-pane>.pane-title{display:none}
.bank-tree>.pane-title{padding:4px 10px 10px}
.bank-pane{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}
.bank-pane[hidden]{display:none}
.bank-toolbar{display:flex;gap:10px;align-items:center}
.bank-toolbar .message-search{flex:1 1 auto}
.bank-toolbar>button{white-space:nowrap;height:38px}
.bank-table-scroll{flex:1 1 auto;min-height:0;overflow:auto}
.bank-head,.bank-zeile{display:grid;grid-template-columns:92px minmax(220px,1fr) minmax(110px,170px) 118px minmax(150px,230px);
  gap:12px;align-items:center;padding:0 16px}
.bank-head{position:sticky;top:0;z-index:2;height:38px;background:#0c1a26;border-bottom:1px solid var(--line);
  color:#7f98ac;font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.bank-head .rechts,.bank-betrag{text-align:right}
.bank-zeile{min-height:58px;border-bottom:1px solid #ffffff0b;cursor:pointer;position:relative}
.bank-zeile:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}
.bank-zeile.red:before{background:#d94e4e}.bank-zeile.yellow:before{background:#e3b53f}
.bank-zeile.blue:before{background:#3b82f6}.bank-zeile.green:before{background:#36b879}
.bank-zeile:hover{background:#ffffff06}.bank-zeile.selected{background:linear-gradient(90deg,#16405d80,#16283c40)}
.bank-datum{font-size:12.5px;color:#cfe0ec}.bank-datum small{display:block;color:#7f98ac;font-size:10.5px}
.bank-text{min-width:0}.bank-text strong{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bank-text small{display:block;color:#8aa0b2;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bank-konto-spalte{font-size:11.5px;color:#9fb4c4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bank-betrag{font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.bank-betrag.minus,.bank-fakten .minus{color:#ffb7a6}.bank-betrag.plus,.bank-fakten .plus{color:#8ce1bc}
.bank-beleg{display:flex;align-items:center;gap:7px;font-size:11.5px;color:#b9cad6;min-width:0;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.bank-punkt{display:inline-block;flex:0 0 auto;width:8px;height:8px;border-radius:50%;border:1px solid #607486;background:transparent}
.bank-punkt.red{border-color:#e75c57}.bank-punkt.yellow{border-color:#e7bb45}
.bank-punkt.blue{border-color:#5b9cff}.bank-punkt.green{border-color:#39bd7e}
.bank-punkt.red.da{background:#d94e4e}.bank-punkt.yellow.da{background:#e3b53f}
.bank-punkt.blue.da{background:#3b82f6}.bank-punkt.green.da{background:#36b879}
.bank-tree{padding:10px 8px 14px;overflow:auto;min-height:0;flex:1 1 auto}
.bank-tree[hidden]{display:none}
.bank-filter{display:grid;gap:2px;margin-bottom:12px}
.bank-filter-eintrag{display:flex;align-items:center;gap:8px;width:100%;padding:7px 10px;border:0;border-radius:8px;
  background:transparent;color:#b9cad6;font-size:12.5px;text-align:left;cursor:pointer}
.bank-filter-eintrag span{flex:1 1 auto}.bank-filter-eintrag b{color:#7f98ac;font-weight:600}
.bank-filter-eintrag:hover{background:#ffffff08}.bank-filter-eintrag.active{background:#16405d80;color:#e4f5ff}
.bank-konten-kopf{display:flex;justify-content:space-between;align-items:center;padding:6px 10px 6px}
.bank-konto{display:flex;align-items:center;gap:9px;padding:7px 10px 7px calc(10px + var(--tiefe,0) * 20px);
  border-radius:8px;cursor:pointer;position:relative}
.bank-konto.tiefe-1{--tiefe:1}.bank-konto.tiefe-2{--tiefe:2}.bank-konto.tiefe-3{--tiefe:3}.bank-konto.tiefe-4{--tiefe:4}
.bank-konto:hover{background:#ffffff08}.bank-konto.active{background:#16405d80}
.bank-konto.tiefe-1:before,.bank-konto.tiefe-2:before,.bank-konto.tiefe-3:before,.bank-konto.tiefe-4:before{
  content:"";position:absolute;left:calc(var(--tiefe) * 20px - 4px);top:50%;width:10px;border-top:1px solid #3c637d}
.bank-konto-zeichen{flex:0 0 26px;height:26px;display:grid;place-items:center;border-radius:7px;background:#16354b;
  color:#9fc4ff;font-size:13px;font-weight:800}
.bank-konto.erkannt .bank-konto-zeichen{background:transparent;border:1px dashed #5b7d95}
.bank-konto-text{flex:1 1 auto;min-width:0}
.bank-konto-text strong{display:block;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bank-konto-text small{display:block;color:#7f98ac;font-size:10.5px}
.bank-konto.erkannt .bank-konto-text small{color:#e3b53f}
.bank-punkte{display:flex;gap:2px}.bank-punkte .bank-punkt{width:6px;height:6px}
.bank-leer{color:#8aa0b2;font-size:12px;line-height:1.5;padding:4px 10px}
.bank-hinweis{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 16px 0;padding:8px 12px;
  border:1px solid #6d3a3a;border-radius:10px;background:#2a1719;color:#ffcfc6;font-size:12.5px}
.bank-hinweis[hidden]{display:none}
.bank-inspector{padding:0 4px 16px;overflow:auto}
.bank-inspector[hidden]{display:none}
.bank-umsatz-kopf{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:4px 0 12px;
  padding:12px 14px;border-radius:12px;background:#0f2231;border-left:4px solid #607486}
.bank-umsatz-kopf.red{border-left-color:#d94e4e}.bank-umsatz-kopf.yellow{border-left-color:#e3b53f}
.bank-umsatz-kopf.blue{border-left-color:#3b82f6}.bank-umsatz-kopf.green{border-left-color:#36b879}
.bank-umsatz-kopf strong{font-size:15px}.bank-umsatz-kopf b{font-size:15px;white-space:nowrap}
.bank-stand{display:grid;gap:6px;margin-bottom:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#0b1926}
.bank-stand strong{font-size:13px}.bank-stand span{font-size:12.5px;color:#cfe0ec}.bank-stand small{font-size:11px;color:#8aa0b2}
.bank-stand.red{border-color:#6d3a3a}.bank-stand.yellow{border-color:#6d5a2a}.bank-stand.blue{border-color:#2f5b9c}
.bank-stand.green{border-color:#2f6b52}
.bank-knoepfe{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.bank-knoepfe>button{min-height:34px;padding:0 12px;font-size:12.5px}
.bank-suche{display:grid;gap:4px;margin-top:6px}.bank-suche span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#7f98ac}
.bank-suche input{height:36px;border:1px solid var(--line);border-radius:8px;background:#07121d;color:var(--text);padding:0 10px}
.bank-kandidaten{display:grid;gap:5px;max-height:280px;overflow:auto}
.bank-kandidat{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;padding:8px 10px;border:1px solid var(--line);
  border-radius:9px;background:#0f2231;color:var(--text);text-align:left;cursor:pointer}
.bank-kandidat strong{font-size:12.5px}.bank-kandidat small{grid-column:1;color:#8aa0b2;font-size:11px}
.bank-kandidat span{grid-column:2;grid-row:1/3;font-size:11px;color:#9fc4ff}
.bank-kandidat.passt{border-color:#2f5b9c}.bank-kandidat:hover{border-color:#5b9cff}
.bank-ohne summary{cursor:pointer;font-size:12.5px;color:#9fc4ff;margin-top:4px}
.bank-ohne select{width:100%;height:34px;margin:8px 0;border:1px solid var(--line);border-radius:8px;background:#07121d;color:var(--text)}
.bank-merken{display:flex;gap:8px;align-items:center;font-size:12px;margin-bottom:8px}
.bank-fakten dd small{display:block;color:#8aa0b2;font-size:11px}
.bank-info p{font-size:12.5px;line-height:1.6;color:#b9cad6}
.bank-h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#7f98ac;margin:16px 0 8px}
.bank-importe{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bank-importe li{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:9px}
.bank-importe b{display:block;font-size:12px;word-break:break-all}.bank-importe small{color:#8aa0b2;font-size:11px}
.bank-anfordern-dialog textarea{width:100%;font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace;border:1px solid var(--line);
  border-radius:8px;background:#07121d;color:var(--text);padding:10px}
.bank-anfordern-dialog input{width:100%;height:38px;border:1px solid var(--line);border-radius:8px;background:#07121d;color:var(--text);padding:0 10px}
html[data-theme='light'] .bank-head{background:#e8f0f5;color:#54707f}
html[data-theme='light'] .bank-zeile.selected,html[data-theme='light'] .bank-konto.active,
html[data-theme='light'] .bank-filter-eintrag.active{background:#d8effb}
html[data-theme='light'] .bank-umsatz-kopf,html[data-theme='light'] .bank-kandidat{background:#eef4f8}
html[data-theme='light'] .bank-stand{background:#f7fafc}
html[data-theme='light'] .bank-datum,html[data-theme='light'] .bank-stand span,html[data-theme='light'] .bank-beleg{color:#223b4c}
html[data-theme='light'] .bank-hinweis{background:#fdeceb;color:#8a2f25;border-color:#e3b1aa}
html[data-theme='light'] .bank-suche input,html[data-theme='light'] .bank-ohne select,
html[data-theme='light'] .bank-anfordern-dialog textarea,html[data-theme='light'] .bank-anfordern-dialog input{background:#fff;color:#102333}
/* Ab 4.41: Upload-Formate ist unter Meine Einstellungen. Der Interview-Knopf
   nimmt die ganze Zeile, Trennblatt und Beleg-App bleiben ein Paar. */
.detail-actions>#openInterview{grid-column:1/-1}
/* ===== 4.42 ===== */
/* Bereichsknoepfe flacher, damit Baum und Konten mehr Platz haben. */
.folder-pane .ledger-switcher{gap:6px}
.folder-pane .ledger-card{min-height:32px;padding:3px 2px;border-radius:7px}
.folder-pane .ledger-card .ledger-icon{height:14px;line-height:14px;font-size:12px}
.folder-pane .ledger-card strong{font-size:11px}
/* Bankkonten: Nur die Liste in der Mitte rollt. Links und rechts stehen fest;
   reicht der Bildschirm fuer sie nicht aus, rollt die Seite selbst. */
.records-page.bank-seite{height:auto;min-height:100vh;overflow-x:hidden;overflow-y:auto}
.bank-seite .records-shell{height:auto;min-height:calc(100vh - 72px)}
.bank-seite .records-workbench{height:auto}
.bank-seite .records-workbench>.message-pane{contain:size;display:flex;flex-direction:column;min-height:0}
.bank-seite .records-workbench>.message-pane>.bank-pane{flex:1 1 auto;min-height:0}
.bank-seite .inspector-pane,.bank-seite .bank-tree,.bank-seite .folder-tree{overflow:visible}
.bank-seite .bank-kandidaten{max-height:none;overflow:visible}
/* Zahlungseingaenge unter Einnahmen: der Baum der Ablage bleibt stehen. */
.records-workbench.bank-modus.bank-eingang #folderTree,.records-workbench.bank-modus.bank-eingang .folder-path,
.records-workbench.bank-modus.bank-eingang #folderAreaTitle{display:revert!important}
.records-workbench.bank-modus.bank-eingang #folderTree{display:block!important}
.records-workbench.bank-modus.bank-eingang .folder-pane>.pane-title{display:grid}
.records-workbench.bank-modus.bank-eingang .folder-path{display:flex!important}
.bank-eingang #folderTree .folder-item.active,.bank-eingang #folderTree .folder-child.active{background:transparent;color:#9db0c1}
.konto-eingaenge{padding:6px 8px 10px;border-top:1px solid #ffffff0b}
.konto-eingaenge[hidden]{display:none}
.konto-eingaenge-kopf{display:grid;gap:3px;padding:8px 10px 6px}
.konto-eingaenge-kopf strong{font-size:13px}
.konto-eingang .folder-meta{display:flex;align-items:center;gap:6px}
.konto-eingang .konto-eingang-summe{font-size:10px;color:#8ce1bc;font-variant-numeric:tabular-nums}
.konto-eingang .bank-punkte{display:flex;gap:2px}
.konto-eingang.active{background:#16344a;color:#96ddff}
/* Zeilen: Auswahlkaestchen links, Farbstreifen rechts wie in Ausgaben. */
.bank-head,.bank-zeile{grid-template-columns:26px 92px minmax(220px,1fr) minmax(110px,170px) 118px minmax(150px,230px);
  padding:0 20px 0 12px}
.bank-zeile:before{left:auto;right:0;width:6px}
.bank-zeile.markiert{background:#12304580}
.bank-auswahl-leiste{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);
  background:#0f2434;font-size:12px}
.bank-auswahl-leiste[hidden]{display:none}
.bank-auswahl-leiste>button{height:32px;padding:0 12px;font-size:12px}
.bank-ziel{display:flex;align-items:center;gap:8px}
.bank-ziel span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#7f98ac;white-space:nowrap}
.bank-ziel select,.bank-ziel input{height:32px;min-width:0;flex:1 1 auto;border:1px solid var(--line);border-radius:8px;background:#07121d;color:var(--text);padding:0 8px;font-size:12px}
.bank-auswahl-leiste .bank-ziel select{min-width:220px}
/* Zaehlzeile: die Zahl unter dem Datum, der Text unter der Gegenseite, heller. */
.bank-count-bar{padding-left:14px}
.bank-count-bar #bankCount{display:flex;align-items:baseline;color:#d3e2ec;font-size:12px}
.bank-zahl{display:inline-block;flex:0 0 140px;box-sizing:border-box;padding-left:36px;color:#eef8ff;font-weight:750}
.bank-zahl-text{color:#d3e2ec}
.bank-count-bar .library-sum{color:#e4f1f9}
.bank-count-bar .bank-legend{color:#c4d5e1}
/* Kontenbaum: auf- und zuklappen, Zahl der Umsaetze. */
.bank-konto{padding-left:calc(4px + var(--tiefe,0) * 20px);gap:7px}
.bank-klapp{flex:0 0 16px;height:22px;padding:0;border:0;border-radius:5px;background:transparent;color:#6fc9f8;font-size:15px;line-height:1;cursor:pointer}
.bank-klapp:hover{background:#ffffff10}
.bank-klapp.leer{display:inline-block;cursor:default}
.bank-anzahl{flex:0 0 auto;min-width:18px;text-align:right;font-size:10.5px;font-weight:600;color:#8fa6b8}
.bank-konten-kopf{gap:8px}
.bank-konten-knoepfe{display:flex;gap:6px}
.tiny-action.gefahr{color:#ffb2a7;border-color:#684542}
.tiny-action.gefahr:hover{background:#2a191b}
.tiny-action.an{color:#b8f0c8;border-color:#3f6b4d}
.tiny-action.an:hover{background:#1c2a21}
.bank-verwalten{display:grid;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.bank-verwalten .bank-knoepfe{margin-top:0}
.bank-verwalten .danger-button{min-height:34px;padding:0 12px;font-size:12.5px}
/* Ausgaben: blauer Punkt, wenn die Zahlung auf dem Konto gefunden ist. */
.row-bezahlt{position:absolute;right:10px;top:50%;z-index:2;width:10px;height:10px;border-radius:50%;background:#3b82f6;
  transform:translateY(-50%);box-shadow:0 0 0 2px #3b82f633,0 0 8px #3b82f680}
.bezahlt-fact dd{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.bezahlt-zeile{display:flex;align-items:flex-start;gap:8px}
.bezahlt-zeile small{display:block;color:#8aa0b2;font-size:11px}
.bezahlt-punkt{flex:0 0 auto;width:10px;height:10px;margin-top:4px;border-radius:50%;background:#3b82f6}
.bank-frage-dialog .dialog-intro{line-height:1.55}
/* Startseite: Posteingang-Kopf in einer Zeile, mehr Platz fuer die Liste. */
.history>.panel-head{padding-top:12px;padding-bottom:6px;align-items:center}
.history>.panel-head>div:first-child{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.history>.panel-head>div:first-child h2{margin:0}
.history>.inbox-note{margin-bottom:8px}
html[data-theme='light'] .bank-auswahl-leiste{background:#e8f3fa}
html[data-theme='light'] .bank-ziel select,html[data-theme='light'] .bank-ziel input{background:#fff;color:#102333}
html[data-theme='light'] .bank-count-bar #bankCount,html[data-theme='light'] .bank-zahl-text{color:#223b4c}
html[data-theme='light'] .bank-zahl{color:#0c2536}
html[data-theme='light'] .bank-count-bar .library-sum,html[data-theme='light'] .bank-count-bar .bank-legend{color:#223b4c}
html[data-theme='light'] .konto-eingang.active{background:#d8effb;color:#0f5f8a}
.bank-verwalten{grid-template-columns:minmax(0,1fr)}
.bank-ziel{min-width:0}
.bank-inspector,.bank-inspector>*{min-width:0}
.bank-konto.tiefe-1:before,.bank-konto.tiefe-2:before,.bank-konto.tiefe-3:before,.bank-konto.tiefe-4:before{left:calc(var(--tiefe) * 20px - 12px)}
/* ===== 4.43: Wartungszugang in der Benutzerverwaltung ===== */
.user-row.user-wartung{border:1px dashed #5b7d95;background:#0c1d2b}
.user-row.user-wartung .user-copy small:last-child{color:#9fb4c4}
.wartung-protokoll{grid-column:1/-1;margin-top:8px;font-size:11.5px;color:#b9cad6}
.wartung-protokoll summary{cursor:pointer;color:#9fc4ff}
.wartung-protokoll ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:3px;max-height:220px;overflow:auto}
.wartung-protokoll li{display:grid;grid-template-columns:120px 80px 1fr;gap:8px}
.wartung-protokoll code{color:#8aa0b2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wartung-protokoll.leer{color:#8aa0b2;margin:6px 0 0}
#createUserGrund{margin-top:8px}
html[data-theme='light'] .user-row.user-wartung{background:#f2f7fb;border-color:#9bb3c4}
/* ===== 4.43: Status ueberall in vier Farben ===== */
/* Punkte stehen uebereinander, auch der vierte (Blau). */
.status-stack.vier{height:25px}
.folder-status.present.blue,.folder-status.blue.present{border-color:#7fb0ff!important;background:#3b82f6!important}
.folder-status.empty.blue{border-color:#3b82f6!important}
/* Legende rechts in der Suchzeile, vier Zeilen uebereinander. Die Auswahlfelder
   ruecken dafuer nach links. */
@media(min-width:1101px){
  .records-workbench .message-toolbar:not(.bank-toolbar){grid-template-columns:minmax(180px,1fr) 110px 120px 160px auto!important}
}
.status-legend.gestapelt{display:grid;grid-auto-rows:min-content;align-content:center;gap:1px;padding-left:8px;
  border-left:1px solid #ffffff12;font-size:10px;line-height:1.25;color:#c4d5e1;white-space:nowrap}
.status-legend.gestapelt>span{display:flex;align-items:center;gap:6px}
.status-legend.gestapelt i{width:10px;height:3px;margin:0;border-radius:2px;flex:0 0 auto}
.bank-toolbar .status-legend.gestapelt{align-self:stretch}
@media(max-width:1100px){.status-legend.gestapelt{grid-column:1/-1;grid-auto-flow:column;justify-content:start;
  border-left:0;padding-left:0;gap:12px}}
/* Bezahlt: ein blauer Balken neben dem Statusbalken, statt des Punkts. */
.row-bezahlt{position:absolute;right:8px;top:0;bottom:0;width:4px;height:auto;border-radius:0;background:#3b82f6;
  transform:none;box-shadow:none;z-index:2}
/* Freigegeben: kraeftiges Gruen mit Haken; Vollstaendig bleibt einfaches Gruen. */
.status-label.freigegeben{color:#3ee08f}
.status-label.freigegeben:before{content:"✓";width:auto;height:auto;border-radius:0;background:none;font-weight:900;
  font-size:12px;line-height:1}
html[data-theme='light'] .status-label.freigegeben{color:#0f8a52}
/* Bankkonten: Kontenbaum mit denselben farbigen Linien wie die Ablage. */
.bank-konten-baum{position:relative;padding-top:2px}
.bank-konto{padding-left:calc(26px + var(--tiefe,0) * 20px)}
.bank-konto.tiefe-1:before,.bank-konto.tiefe-2:before,.bank-konto.tiefe-3:before,.bank-konto.tiefe-4:before{content:none}
.bank-konto>.status-stack{flex:0 0 auto}
.bank-umsatz-kopf{border-left:0;border-right:4px solid #607486}
.bank-umsatz-kopf.red{border-right-color:#d94e4e}.bank-umsatz-kopf.yellow{border-right-color:#e3b53f}
.bank-umsatz-kopf.blue{border-right-color:#3b82f6}.bank-umsatz-kopf.green{border-right-color:#36b879}
.konto-eingang .status-stack{flex:0 0 auto}
.bank-beleg-text.link,.bank-betrag.link{cursor:pointer}
.bank-beleg-text.link:hover,.bank-betrag.link:hover{text-decoration:underline;text-underline-offset:3px}
.bank-beleg-text.rot{color:#ff9187;font-weight:650}
/* Zuletzt eingelesen: immer unten im rechten Bereich der Bankkonten. */
.bank-seite .inspector-pane{display:flex;flex-direction:column}
.bank-seite .inspector-pane>#bankInspector{flex:1 1 auto;display:flex;flex-direction:column}
.bank-importe-block{margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
.bank-inspektor-inhalt{margin-bottom:14px}
.bank-frage-auswahl{display:grid;gap:6px;margin:4px 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.bank-frage-auswahl label{display:flex;gap:8px;align-items:center;font-size:13px}
.bank-frage-alle{font-weight:700;padding-bottom:4px;border-bottom:1px solid #ffffff12}
.wheel-head-status .legende>.blue{background:#3b82f6}
/* Vier Punkte uebereinander, in jedem Zusammenhang gleich: gefuellt, wenn
   vorhanden, sonst nur der farbige Rand. Ueberstimmt die aelteren Regeln mit
   drei Zeilen und grauen Punkten. */
.status-stack.vier,.folder-meta>.status-stack.vier,.compact-customer-copy .status-stack.vier{display:grid!important;
  grid-template-rows:repeat(4,5px)!important;grid-auto-rows:5px!important;place-items:center!important;align-content:center!important;
  width:9px!important;min-width:9px!important;height:26px!important;gap:2px!important;overflow:visible!important}
.status-stack.vier>.folder-status,.folder-meta>.status-stack.vier>.folder-status,.compact-customer-copy .status-stack.vier>.folder-status{
  display:block!important;position:static!important;box-sizing:border-box!important;width:5px!important;height:5px!important;
  min-width:5px!important;min-height:5px!important;padding:0!important;border:1px solid #607486!important;border-radius:50%!important;
  background:transparent!important;box-shadow:none!important;opacity:.8!important;transform:none}
.status-stack.vier>.folder-status.red{border-color:#e06a64!important}
.status-stack.vier>.folder-status.yellow{border-color:#e7bb45!important}
.status-stack.vier>.folder-status.green{border-color:#39bd7e!important}
.status-stack.vier>.folder-status.blue{border-color:#5b9cff!important}
.status-stack.vier>.folder-status.present{opacity:1!important}
.status-stack.vier>.folder-status.present.red{background:#d94e4e!important}
.status-stack.vier>.folder-status.present.yellow{background:#e3b53f!important}
.status-stack.vier>.folder-status.present.green{background:#36b879!important}
.status-stack.vier>.folder-status.present.blue{background:#3b82f6!important}
.status-stack.vier>.walze-punkt:hover{transform:scale(1.35)}
/* Startseite: so gross wie die Schrift daneben, nicht groesser. */
.customer-option>.status-stack.vier{grid-template-rows:repeat(4,6px)!important;grid-auto-rows:6px!important;height:30px!important}
.customer-option>.status-stack.vier>.folder-status{width:6px!important;height:6px!important;min-width:6px!important;min-height:6px!important}
.customer-option>.status-stack.vier>.row-busy-spinner{grid-row:1/-1;position:absolute;margin-left:14px}
/* Einstellungen im Dokumentenarbeitsplatz klappen auf wie Kanzlei auf der Startseite. */
.user-menu-body>.menu-link{display:block;text-decoration:none;color:inherit;text-align:left}
.settings-card.abschnitt-ziel{outline:2px solid #5bbff2;outline-offset:3px;transition:outline-color .6s}
/* Uebereinander duerfen sich die vergroesserten Klickflaechen nicht ueberdecken. */
.customer-panel .customer-option>.status-stack.vier>.walze-punkt:after,.status-stack.vier>.walze-punkt:after{inset:-1px -5px}
.status-stack.vier>.walze-punkt{position:relative!important;cursor:pointer}
/* ===== 4.44 ===== */
/* Nur der Bereich unter der Maus rollt. Der Arbeitsplatz ist so hoch wie das
   Fenster; Belegliste, Buchungsliste, Baum und Detailbereich rollen jeweils
   fuer sich. Baum und Detailbereich bewegen sich nicht mit der Liste. Erst bei
   sehr kleinen Fenstern rollt wieder die ganze Seite. */
@media (min-width:901px) and (min-height:480px){
  body.records-page,body.records-page.bank-seite{height:100vh!important;min-height:0!important;overflow:hidden!important}
  .records-page .records-shell,.bank-seite .records-shell{height:calc(100vh - 72px)!important;min-height:0!important;
    grid-template-rows:0 minmax(0,1fr) auto!important;overflow:hidden}
  .records-page .records-workbench,.bank-seite .records-workbench{height:auto!important;min-height:0!important;
    grid-template-rows:minmax(0,1fr)!important;overflow:hidden}
  .records-page .records-workbench>*{min-height:0!important;max-height:100%}
  .records-page .records-workbench>.message-pane{display:flex!important;flex-direction:column;contain:none}
  .records-page .records-workbench>.message-pane>.message-toolbar,
  .records-page .records-workbench>.message-pane>.library-count-bar,
  .records-page .records-workbench>.message-pane>.bank-hinweis,
  .records-page .records-workbench>.message-pane>.mail-banner{flex:0 0 auto}
  .records-page .records-workbench>.message-pane>.message-table-scroll{flex:1 1 0;min-height:0}
  .records-page .records-workbench>.message-pane>.bank-pane:not([hidden]){flex:1 1 0;min-height:0}
  .records-page .folder-pane{overflow:hidden}
  .records-page .folder-pane>.folder-tree,.records-page .folder-pane>.bank-tree:not([hidden]),
  .records-page .folder-pane>.konto-eingaenge:not([hidden]){flex:1 1 0;min-height:0;overflow-y:auto!important}
  .records-page .inspector-pane,.bank-seite .inspector-pane{overflow-y:auto!important;overflow-x:hidden}
}
.records-page .message-table-scroll,.records-page .bank-table-scroll,.records-page .folder-tree,.records-page .bank-tree,
.records-page .konto-eingaenge,.records-page .inspector-pane,.records-page .folder-pane{overscroll-behavior:contain}
/* Bank & Kredit Konten: runde Punkte statt laenglicher Striche, wie in den
   Filtern links und in der Spalte Beleg. */
.bank-zeile:before{left:auto!important;right:7px!important;top:50%!important;bottom:auto!important;width:9px!important;height:9px!important;
  border-radius:50%;transform:translateY(-50%)}
.bank-toolbar .status-legend.gestapelt i{width:7px;height:7px;border-radius:50%}
/* Die Eintraege links (Alle Umsaetze bis Beleg und Zahlung) stehen halb so weit auseinander. */
.bank-filter{gap:1px;margin-bottom:8px}
.bank-filter-eintrag{padding-top:3px!important;padding-bottom:3px!important}
.bank-inspector{padding:0 16px 16px 14px}
/* Sprung zu einer Buchung, etwa ueber "Bezahlt": kraeftig umrandet, damit man
   sie sofort sieht. Der Rahmen bleibt, bis etwas anderes angeklickt wird. */
.bank-zeile.sprung{outline:2px solid #6cb6ff;outline-offset:-2px;background:linear-gradient(90deg,#1d4f86cc,#173a5e99)!important;z-index:1}
.bank-zeile.sprung .bank-text strong,.bank-zeile.sprung .bank-datum{color:#fff}
@keyframes bank-sprung-puls{0%{box-shadow:0 0 0 0 #6cb6ffcc}70%{box-shadow:0 0 0 10px #6cb6ff00}100%{box-shadow:0 0 0 0 #6cb6ff00}}
.bank-zeile.sprung.sprung-puls{animation:bank-sprung-puls 1s ease-out 3}
html[data-theme='light'] .bank-zeile.sprung{outline-color:#0a6fc2;background:#cfe6fb!important}
html[data-theme='light'] .bank-zeile.sprung .bank-text strong,html[data-theme='light'] .bank-zeile.sprung .bank-datum{color:#0b2a44}
/* Ebenso in der Belegliste, wenn man aus der Bank zu einem Beleg springt. */
.message-row.row-highlight{outline:2px solid #6cb6ff;outline-offset:-2px;background:#1d4f8666!important}
/* Gegenseite mit Beleg: der Name ist ein Weg zum Beleg. */
.bank-gegen-link{cursor:pointer;text-decoration:underline dotted #6cb6ff99;text-underline-offset:3px}
.bank-gegen-link:hover{color:#8fd0ff}
html[data-theme='light'] .bank-gegen-link:hover{color:#075f8e}
/* Farben der Betraege: Standard an, unter Einstellungen > Farbschema ausschaltbar. */
html.betragsfarben-aus .message-row .money-cell.unsure,html.betragsfarben-aus .message-row .money-cell.missing,
html.betragsfarben-aus .message-row .money-cell.exempt,html.betragsfarben-aus .message-row .money-cell.notshown,
html.betragsfarben-aus .message-row .money-cell.fallback,html.betragsfarben-aus .message-row time.money-cell{color:#c7d7e2!important}
html[data-theme='light'].betragsfarben-aus .message-row .money-cell{color:#213d50!important}
.settings-farben{display:grid;gap:4px;margin:6px 0 4px;padding:0;list-style:none;font-size:12px;color:var(--muted)}
.settings-farben b{display:inline-block;min-width:44px;font-weight:700}
.settings-farben .farbe-gelb{color:#e3b53f}.settings-farben .farbe-rot{color:#ff9187}.settings-farben .farbe-grau{color:#8fa6b6}
.settings-farben .farbe-normal{color:var(--text)}
html[data-theme='light'] .settings-farben .farbe-gelb{color:#8a6400}html[data-theme='light'] .settings-farben .farbe-rot{color:#a32f27}
/* Einstellungen: jeder Bereich fuer sich, oben die Reiter. */
.settings-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.settings-tabs a{padding:8px 14px;border:1px solid var(--line);border-radius:10px;color:var(--muted);text-decoration:none;font-size:13px;font-weight:650}
.settings-tabs a:hover{color:var(--text);border-color:#4b6a82}
.settings-tabs a.active{color:#e4f5ff;background:#16405d;border-color:#3d86b5}
html[data-theme='light'] .settings-tabs a.active{color:#075f8e;background:#d6edf8;border-color:#7cbde2}
.settings-grid.settings-einzeln{display:block;max-width:820px}
.settings-grid.settings-einzeln>.settings-card[hidden]{display:none}
/* Zweites Fenster: ganz rechts neben dem Namen. */
.top-right .zweites-fenster{white-space:nowrap}
.top-right .zweites-fenster[hidden]{display:none}
@media(max-width:1500px){.top-right .zweites-fenster{font-size:0;padding-inline:12px}.top-right .zweites-fenster:first-letter{font-size:16px}}
.top-right .top-papierkorb{white-space:nowrap}
/* Walzen: die Punkte nebeneinander statt uebereinander (zum Ausprobieren). */
.customer-option>.status-stack.vier,.compact-customer-copy .status-stack.vier{grid-template-rows:6px!important;grid-auto-rows:6px!important;
  grid-auto-flow:column!important;grid-template-columns:none!important;grid-auto-columns:6px!important;width:auto!important;min-width:0!important;
  height:12px!important;gap:3px!important;justify-content:start!important}
.compact-customer-copy .status-stack.vier{grid-auto-columns:5px!important;grid-template-rows:5px!important;grid-auto-rows:5px!important;gap:3px!important}
.customer-option>.status-stack.vier>.row-busy-spinner{grid-row:auto;grid-column:auto}
.bank-head,.bank-zeile{padding-right:26px!important}
#documentList,.inbox-list{overscroll-behavior:contain}
/* ===== 4.45 ===== */
/* Die drei Kaestchen rechts in der Belegzeile (Haken, PDF, Papierkorb) sind
   nicht mehr quadratisch: so breit wie bisher, aber rund 20 % flacher. Damit
   wird die ganze Zeile niedriger und es passen mehr Belege auf den Schirm. */
.message-row .row-utility.stacked .row-file-badge,.message-row .row-utility.stacked .row-trash,
.message-row .row-utility.stacked .row-restore,.row-utility.stacked .row-approve,
.message-row .row-utility.stacked:has(.row-approve) .row-trash{width:31px!important;min-width:31px!important;
  height:21px!important;min-height:21px!important;border-radius:6px!important}
.message-row .row-utility.stacked .row-file-badge{font-size:8px}
.message-row .row-utility.stacked .row-trash,.message-row .row-utility.stacked .row-restore{font-size:11px}
.row-utility.stacked .row-approve{font-size:12px}
.message-row .row-utility.stacked:has(.row-approve){gap:3px;padding-block:5px}
/* Legende oben in der Suchzeile: runde Punkte statt Striche, ueberall. */
.status-legend.gestapelt i,.message-toolbar .status-legend i,.status-legend i{width:7px!important;height:7px!important;border-radius:50%!important}
/* Betraege und Belegdatum in der Farbe des Status (Standard an, abschaltbar
   unter Einstellungen > Farbschema). */
html.betragsfarben-status .message-row.betrag-red .money-cell{color:#ff9187!important}
html.betragsfarben-status .message-row.betrag-yellow .money-cell{color:#f1ca62!important}
html.betragsfarben-status .message-row.betrag-green .money-cell{color:#66d6a6!important}
html.betragsfarben-status .message-row.betrag-blue .money-cell{color:#6fb1ff!important}
html[data-theme='light'].betragsfarben-status .message-row.betrag-red .money-cell{color:#a32f27!important}
html[data-theme='light'].betragsfarben-status .message-row.betrag-yellow .money-cell{color:#8a6400!important}
html[data-theme='light'].betragsfarben-status .message-row.betrag-green .money-cell{color:#16734e!important}
html[data-theme='light'].betragsfarben-status .message-row.betrag-blue .money-cell{color:#0a5fc2!important}
html.betragsfarben-aus .message-row .money-cell{color:#c7d7e2!important}
.settings-farben .farbe-gruen{color:#66d6a6}.settings-farben .farbe-blau{color:#6fb1ff}
html[data-theme='light'] .settings-farben .farbe-gruen{color:#16734e}html[data-theme='light'] .settings-farben .farbe-blau{color:#0a5fc2}
/* Freigegeben ist ein kraeftigeres Gruen; die Betraege folgen ihm. */
html.betragsfarben-status .message-row.betrag-green:has(.status-label.freigegeben) .money-cell{color:#3ee08f!important}
html[data-theme='light'].betragsfarben-status .message-row.betrag-green:has(.status-label.freigegeben) .money-cell{color:#0f8a52!important}
/* ===== 4.46 ===== */
/* Umschalter "Mandanten | Arbeitsplatz" neben dem Seitentitel. */
.fenster-umschalter{display:inline-flex;align-items:center;gap:2px;padding:3px;margin-left:18px;border:1px solid var(--line);
  border-radius:11px;background:#07121d;flex:0 0 auto}
.fenster-umschalter a{padding:6px 14px;border-radius:8px;color:#8fa6b6;text-decoration:none;font-size:13px;font-weight:700;white-space:nowrap}
.fenster-umschalter a:hover{color:#e4f5ff;background:#ffffff0a}
.fenster-umschalter a.aktiv{color:#062033;background:linear-gradient(135deg,#bfe9ff,#6cc8ff)}
html[data-theme='light'] .fenster-umschalter{background:#eef5f9}
html[data-theme='light'] .fenster-umschalter a{color:#536f82}
html[data-theme='light'] .fenster-umschalter a.aktiv{color:#fff;background:#0878b2}
@media(max-width:1250px){.fenster-umschalter{margin-left:8px}.fenster-umschalter a{padding:6px 9px;font-size:12px}}
/* Belegansicht auf dem zweiten Bildschirm. */
body.ansicht-page{height:100vh;overflow:hidden;display:flex;flex-direction:column}
.ansicht-page .topbar{flex:0 0 auto;height:64px;padding-inline:24px;display:flex;align-items:center;gap:14px}
.ansicht-page .top-right{margin-left:auto}
.ansicht-shell{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;padding:14px 24px 18px;gap:12px}
.ansicht-kopf{display:grid;grid-template-columns:minmax(220px,1.1fr) minmax(0,2fr) auto;align-items:center;gap:18px;padding:12px 16px;
  border:1px solid var(--line);border-radius:14px;background:var(--panel);border-left:5px solid #607486}
.ansicht-kopf[hidden]{display:none}
.ansicht-kopf[data-farbe="red"]{border-left-color:#d94e4e}.ansicht-kopf[data-farbe="yellow"]{border-left-color:#e3b53f}
.ansicht-kopf[data-farbe="green"]{border-left-color:#36b879}.ansicht-kopf[data-farbe="blue"]{border-left-color:#3b82f6}
.ansicht-titel{min-width:0}.ansicht-titel h1{margin:2px 0 0;font-size:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ansicht-titel small{display:block;color:var(--muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ansicht-fakten{display:grid;grid-template-columns:repeat(6,minmax(0,auto));gap:4px 18px;margin:0}
.ansicht-fakten dt{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ansicht-fakten dd{margin:2px 0 0;font-size:14px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.ansicht-knoepfe{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.ansicht-knoepfe button,.ansicht-knoepfe a{height:32px;padding:0 10px;font-size:12px;display:inline-flex;align-items:center}
.ansicht-leer{flex:1 1 auto;display:grid;place-content:center;justify-items:center;gap:8px;text-align:center;color:var(--muted);
  border:1px dashed var(--line);border-radius:16px;padding:30px}
.ansicht-leer[hidden]{display:none}.ansicht-leer strong{color:var(--text);font-size:18px}.ansicht-leer span{max-width:520px}
.ansicht-seiten{--ansicht-zoom:1;flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;
  align-items:center;gap:14px;padding:4px 0 20px}
.ansicht-seiten:empty{display:none}
.ansicht-seite{display:block;width:calc(min(100%,1100px) * var(--ansicht-zoom));max-width:none;height:auto;background:#fff;
  border-radius:4px;box-shadow:0 10px 30px #0008}
.ansicht-hinweis{color:var(--muted)}
.ansicht-user{padding:8px 12px}
@media(max-width:1300px){.ansicht-kopf{grid-template-columns:1fr}.ansicht-knoepfe{justify-content:flex-start}.ansicht-fakten{grid-template-columns:repeat(3,minmax(0,auto))}}
.topbar>.fenster-umschalter{margin-right:auto}
.topbar>.fenster-umschalter+.top-right{margin-left:0}
.topbar>.workspace-topbar-title:has(+.fenster-umschalter){margin-right:0}
/* ===== 4.47 ===== */
/* Belegzeile: links Auswahlkaestchen und darunter der Dateityp (PDF), rechts
   Haken und Papierkorb wieder in der urspruenglichen Groesse. */
.message-row>.row-links{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;align-self:stretch;min-width:0}
.message-row>.row-links>.row-check{align-self:center;height:18px}
.message-row>.row-links>.row-file-badge{box-sizing:border-box;width:31px;min-width:31px;height:27px;display:grid;place-items:center;
  border:1px solid #3c637d;border-radius:7px;background:#132434;color:#a8ddfa;font-size:8px;font-weight:800;line-height:1;box-shadow:none}
html[data-theme='light'] .message-row>.row-links>.row-file-badge{border-color:#aebdc8;background:#eef3f7;color:#4a6273}
.row-utility.stacked .row-approve{width:31px!important;min-width:31px!important;height:22px!important;min-height:22px!important;border-radius:7px!important}
.message-row .row-utility.stacked .row-trash,.message-row .row-utility.stacked .row-restore,
.message-row .row-utility.stacked:has(.row-approve) .row-trash{width:31px!important;min-width:31px!important;height:27px!important;min-height:27px!important;border-radius:7px!important}
.message-row .row-utility.stacked:has(.row-approve){gap:4px;padding-block:6px}
/* Stand der Zeile als runder Punkt rechts, wie in Bank & Kredit Konten. */
.message-row .row-status-strip{top:50%!important;bottom:auto!important;right:8px!important;width:9px!important;height:9px!important;
  border-radius:50%;transform:translateY(-50%)}
.row-status-strip.blue{background:#3b82f6}
.message-row .row-bezahlt{top:calc(50% + 9px)!important;bottom:auto!important;right:9.5px!important;width:6px!important;height:6px!important;border-radius:50%!important}
/* Farben der Betraege: drei Moeglichkeiten. */
.settings-wahl{display:grid;gap:6px;margin:12px 0 0;padding:0;border:0}
.settings-wahl legend{padding:0;margin-bottom:6px;font-size:12px;font-weight:750;color:var(--text)}
.settings-radio{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.settings-radio:has(input:checked){border-color:#3d86b5;background:#16405d55}
html[data-theme='light'] .settings-radio:has(input:checked){background:#d6edf8}
.settings-radio input{margin-top:3px;accent-color:#3fa9f5}
.settings-radio span{display:grid;gap:2px;font-size:13px}.settings-radio em{font-style:normal;color:var(--muted);font-weight:400}
.settings-radio small{font-size:11.5px;line-height:1.4;color:var(--muted)}
.settings-radio i{font-style:normal;font-weight:700}
.settings-radio .farbe-gelb{color:#e3b53f}.settings-radio .farbe-rot{color:#ff9187}.settings-radio .farbe-grau{color:#8fa6b6}
.settings-radio .farbe-gruen{color:#66d6a6}.settings-radio .farbe-blau{color:#6fb1ff}
html[data-theme='light'] .settings-radio .farbe-gelb{color:#8a6400}html[data-theme='light'] .settings-radio .farbe-rot{color:#a32f27}
html[data-theme='light'] .settings-radio .farbe-gruen{color:#16734e}html[data-theme='light'] .settings-radio .farbe-blau{color:#0a5fc2}
/* Fertig unten rechts in jedem Einstellungsfenster. */
.settings-actions.dialog-fertig{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.einstellungen-schliessen{text-decoration:none;white-space:nowrap}
/* Einstellungsfenster passen ohne Rollen auf den Bildschirm. */
#farbschemaDialog .modal-body,#hinweiseDialog .modal-body,#fensterDialog .modal-body,#spaltenDialog .modal-body{padding-block:18px}
#farbschemaDialog .theme-options{gap:8px}#farbschemaDialog .theme-options button{min-height:42px}
#farbschemaDialog .dialog-intro,#hinweiseDialog .dialog-intro,#fensterDialog .dialog-intro,#spaltenDialog .dialog-intro{margin-block:6px 10px}
#spaltenDialog .settings-column-list{gap:4px}
#spaltenDialog .settings-column-row{padding-block:3px;min-height:0}
#spaltenDialog .settings-column-row button{height:26px;min-height:26px;width:28px;padding:0}
#spaltenDialog .settings-customer{margin-bottom:4px}
/* Mobile Erfassung: offene Einladungen getrennt von den Geraeten. */
.geraete-liste .geraet-einladungen-kopf{list-style:none;margin:12px 0 2px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.geraete-liste .geraet-einladung{border-style:dashed;opacity:.9}
.geraete-liste .geraet-einladung{border:1px dashed #4b6a82!important;border-radius:9px;padding:8px 10px!important;opacity:1}
.geraete-liste .geraet-einladung>div{display:grid;gap:3px;min-width:0}
.geraete-liste .geraet-einladung small{color:var(--muted)}
/* ===== 4.48 ===== */
/* Stand jeder Zeile als senkrechter Balken am rechten Rand, ueberall gleich:
   Belege in Ausgaben, Einnahmen, Allgemein, Privat und Umsaetze in Bank &
   Kredit Konten. Keine Punkte. */
.message-row .row-status-strip{top:0!important;bottom:0!important;right:0!important;width:6px!important;height:auto!important;
  border-radius:0!important;transform:none!important}
.message-row .row-bezahlt{top:0!important;bottom:0!important;right:8px!important;width:4px!important;height:auto!important;border-radius:0!important}
.bank-zeile:before{left:auto!important;right:0!important;top:0!important;bottom:0!important;width:6px!important;height:auto!important;
  border-radius:0!important;transform:none!important}
/* Legende passend dazu: kleine senkrechte Balken. */
.status-legend.gestapelt i,.message-toolbar .status-legend i,.status-legend i,.bank-toolbar .status-legend.gestapelt i{
  width:4px!important;height:11px!important;border-radius:1px!important}
.status-legend.gestapelt>span{gap:7px}

/* ===== 4.49 ===== */
/* Schmalere Bildschirme (Laptop): Die Seitenspalten werden schmaler, die
   Tabelle in der Mitte bekommt den Platz. Reicht er trotzdem nicht, rollt nur
   die Tabelle quer, mit sichtbarem Rollbalken, und die Farbbalken sitzen am
   Ende jeder Zeile statt am Rand des sichtbaren Ausschnitts. */
.records-workbench{grid-template-columns:max(220px,min(var(--inspector-width,300px),18vw)) minmax(0,1fr) max(270px,min(var(--inspector-width,300px),23vw))!important}
.records-workbench>.message-pane{min-width:0!important}
/* Kopf und Liste stecken gemeinsam in .message-tabelle: so breit wie das
   Fenster, mindestens aber so breit, wie die Spalten es brauchen. Kopf und
   Zeilen haben damit immer dieselbe Breite und dieselben Spaltenkanten. */
.message-table-scroll>.message-tabelle{width:min-content;min-width:100%}
.message-tabelle>.message-list{overflow:visible}
.message-tabelle>.message-list>.message-row,.message-tabelle>.message-list-head{min-width:0!important}
.message-tabelle>.message-list>.message-row{position:relative}
/* Links ein gemeinsames Kaestchen fuer Auswahl und Dateityp, etwa 1 zu 2. */
.message-row>.row-links{box-sizing:border-box;align-self:center;justify-self:center;width:30px;height:60px;gap:4px;
  padding:7px 0 6px;border:1px solid #3c637d;border-radius:8px;background:#132434;justify-content:space-between}
.message-row>.row-links>.row-file-badge{width:auto;min-width:0;height:auto;border:0;background:none;border-radius:0;font-size:8px}
.message-row>.row-links>.row-check{height:16px}
.message-row.selected>.row-links{border-color:#5bbff2}
html[data-theme='light'] .message-row>.row-links{border-color:#aebdc8;background:#eef3f7}
html[data-theme='light'] .message-row>.row-links>.row-file-badge{background:none}
/* Laptop: Kopfleiste und Suchzeile kompakter, damit nichts abgeschnitten wird. */
@media(max-width:1500px){
  .topbar .top-right #versionBadge{display:none!important}
  .records-page .topbar{gap:14px;padding-inline:18px}
  .workspace-topbar-title strong{font-size:22px}
  .fenster-umschalter{margin-left:6px}.fenster-umschalter a{padding:6px 10px;font-size:12px}
  .top-right{gap:8px}
  .records-page .message-toolbar:not(.bank-toolbar){grid-template-columns:minmax(140px,1fr) 100px 110px 130px auto!important;gap:8px}
  .records-page .message-toolbar .status-legend.gestapelt{font-size:10px;padding-left:4px}
}
@media(max-width:1300px){
  .workspace-topbar-title span{display:none}
  .workspace-topbar-title strong{font-size:19px}
  .records-page .topbar-logo-slot{width:120px}
}
/* ===== 4.50 ===== */
/* Legende oben in der Suchzeile: runde Punkte statt kleiner Striche. Die
   farbigen Balken an den Zeilen bleiben Balken, nur die Legende wird rund. */
.status-legend.gestapelt i,.message-toolbar .status-legend i,.status-legend i,.bank-toolbar .status-legend.gestapelt i{
  width:8px!important;height:8px!important;border-radius:50%!important}
/* Das Kaestchen links (Auswahl oben, PDF unten) um rund 27 % flacher. */
.message-row>.row-links{height:44px!important}

/* Ab 4.51: Der Hinweis ist ein Popover, damit er auch ueber offenen Fenstern
   steht. Die Vorgaben des Browsers fuer Popover (mittig, Rahmen) aufheben. */
.action-notice[popover]{inset:auto;top:78px;left:50%;right:auto;bottom:auto;margin:0;height:auto;overflow:visible;
  padding:14px 17px;border:1px solid #43866d;border-radius:12px;background:#103126;color:#b9efd7}

/* ===== 4.52 ===== */
/* Belegansicht: Klick auf den Beleg schliesst ihn. */
.ansicht-seiten .ansicht-seite{cursor:zoom-out}
.ansicht-knoepfe .ansicht-schliessen{margin-left:6px;border-color:#5a7a92}
/* Summen ueber der Belegliste mittig (Netto, MwSt., Brutto). */
.library-count-bar::after{content:"";flex:1 1 0}
.library-count-bar>#libraryCount,.library-count-bar>#bankCount{flex:1 1 0;min-width:0}
.library-count-bar>.library-sum{margin-left:0}
/* Kunde anlegen so breit wie Kunde loeschen. */
@media(min-width:761px){.customer-panel .customer-view-controls>.add-customer,.customer-panel .customer-view-controls>.kunde-weg{width:118px!important;padding-left:8px!important;padding-right:8px!important;text-align:center;justify-content:center}}
/* Volltext unter der Maus, wenn ein Text abgeschnitten ist. */
.volltext-tipp{position:fixed;inset:auto;margin:0;z-index:300;max-width:min(420px,calc(100vw - 24px));height:auto;overflow:visible;
  padding:6px 9px;border:1px solid #3d6582;border-radius:7px;background:#0b1a27;color:#e3f0f8;
  font-family:inherit;font-size:12px;line-height:1.45;font-weight:500;white-space:normal;overflow-wrap:anywhere;box-shadow:0 8px 24px #0009;pointer-events:none}
.volltext-tipp[hidden]{display:none}
html[data-theme="light"] .volltext-tipp{border-color:#b7cddd;background:#ffffff;color:#12384d;box-shadow:0 8px 24px #0e2a3d33}
/* Startpasswort beim Anlegen eines Zugangs. */
.startpasswort-wahl{display:grid;gap:8px;margin:4px 0 12px;padding:0;border:0}
.startpasswort-wahl legend{margin-bottom:6px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.startpasswort-wahl .password-field{display:flex;gap:8px}
.startpasswort-wahl .password-field input{flex:1;min-width:0}
/* Felder im Fenster Benutzerkonten im Stil der übrigen Eingabefelder (bis 4.51 grau). */
.user-form .settings-customer input,.user-form .settings-customer select,.user-form .startpasswort-wahl input[type=password],.user-form .startpasswort-wahl input[type=text],
.settings-customer.ton-wahl select{min-height:42px;border:1px solid #3b526a;border-radius:10px;background:#07111d;color:var(--text);padding:0 12px;font:inherit;font-size:14px;color-scheme:dark}
html[data-theme="light"] .user-form .settings-customer input,html[data-theme="light"] .user-form .settings-customer select,
html[data-theme="light"] .user-form .startpasswort-wahl input,html[data-theme="light"] .settings-customer.ton-wahl select{border-color:#c2d5e2;background:#fff;color:#12384d;color-scheme:light}

/* DATEV-Export (ab 4.54). Eigener Bereich nach dem Vorbild der Bank. */
.ledger-icon.datev{background:linear-gradient(135deg,#2b6a8f,#123246);color:#bfe9ff}
.records-workbench.datev-modus #folderTree,.records-workbench.datev-modus .folder-help,
.records-workbench.datev-modus .folder-path,.records-workbench.datev-modus #folderAreaTitle,
.records-workbench.datev-modus #bankTree,.records-workbench.datev-modus #kontoEingaenge,
.records-workbench.datev-modus .message-pane>.message-toolbar:not(.datev-toolbar),
.records-workbench.datev-modus .message-pane>.library-count-bar:not(.datev-count-bar),
.records-workbench.datev-modus .message-pane>.message-table-scroll,
.records-workbench.datev-modus #bankPane,
.records-workbench.datev-modus #mailBanner,.records-workbench.datev-modus #bankHinweis,
.records-workbench.datev-modus #customerInspector,.records-workbench.datev-modus #documentInspector,
.records-workbench.datev-modus #bankInspector{display:none!important}
.records-workbench.datev-modus .folder-pane>.pane-title{display:none}
.datev-pane{display:flex;flex-direction:column;min-height:0;flex:1 1 auto}
.datev-pane[hidden]{display:none}
.records-page.datev-seite{height:auto;min-height:100vh;overflow-x:hidden;overflow-y:auto}
.datev-seite .records-shell{height:auto;min-height:calc(100vh - 72px)}
.datev-seite .records-workbench{height:auto}
.datev-seite .records-workbench>.message-pane{contain:size;display:flex;flex-direction:column;min-height:0}
.datev-seite .records-workbench>.message-pane>.datev-pane{flex:1 1 auto;min-height:0}
.datev-seite .inspector-pane{display:flex;flex-direction:column;overflow:visible}
.datev-toolbar{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:10px}
.datev-toolbar .field{display:flex;flex-direction:column;gap:3px}
.datev-toolbar .field>span{font-size:9px;letter-spacing:.06em;color:#7f98ac;text-transform:uppercase}
.datev-toolbar input,.datev-toolbar select{height:36px;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 10px;font-size:12px}
.datev-toolbar input:disabled{opacity:.55}
.datev-belege-toggle{margin-left:auto}
.datev-crypto{display:inline-flex;gap:6px;align-items:center}
.datev-crypto[hidden]{display:none}
.datev-crypto input{width:160px}
.datev-count-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;border-bottom:1px solid #ffffff0d;color:#839aae;font-size:11px}
.datev-bereit{color:#9db6c8}
.datev-warn{color:#ffb199}
.datev-body{flex:1 1 auto;min-height:0;overflow:auto;display:block}
.datev-pruefliste{flex:0 0 auto;margin:10px 14px;padding:10px 12px;border:1px solid #6a5420;border-radius:10px;background:#1c1708}
.datev-pruefliste>strong{display:block;margin-bottom:6px;color:#f1ca62;font-size:11px}
.datev-pruef-zeile{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,2fr) auto;gap:10px;width:100%;padding:6px 8px;border:0;border-radius:7px;background:transparent;color:#d9e8f2;text-align:left;cursor:pointer;font-size:11px}
.datev-pruef-zeile:hover{background:#ffffff0d}
.datev-pruef-grund{color:#e3b53f}
.datev-pruef-betrag{text-align:right;color:#d8e8f2}
.datev-table-scroll{overflow:visible}
.datev-head,.datev-zeile{display:grid;grid-template-columns:6px 86px minmax(170px,1fr) 78px 86px 44px 110px 34px;gap:8px;align-items:center}
.datev-status{align-self:stretch;width:6px;margin:-9px 0 -9px -14px}
.datev-status.unsicher{background:#e3b53f}
.datev-status.bezahlt{background:#3b82f6}
.datev-status.offen{background:#36b879}
.datev-manuell{margin-left:5px;color:#8fb8d6;font-style:normal;font-size:11px}
.datev-head{position:sticky;top:0;z-index:4;padding:0 14px;height:38px;background:#0a1723;border-bottom:1px solid var(--line);color:#7f98ac;font-size:9px;letter-spacing:.06em;text-transform:uppercase}
.datev-head .rechts,.datev-zeile .rechts{text-align:right}
.datev-zeile{width:100%;padding:9px 14px;border:0;border-bottom:1px solid #ffffff0d;background:transparent;color:#c7d7e2;text-align:left;cursor:pointer;font-size:12px}
.datev-zeile:hover{background:#0e1c2a}
.datev-zeile.selected{background:linear-gradient(90deg,#17384f,#102639)}
.datev-zeile.selected .datev-status{box-shadow:inset 0 0 0 1px #68ccff}
.datev-zeile-text{min-width:0}
.datev-zeile-text strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.datev-zeile-text small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;color:#7f9bb0;font-size:10px}
.datev-sh{font-weight:700}
.datev-sh.soll{color:#ff9690}.datev-sh.haben{color:#66d6a6}
.datev-inspector{padding:4px 2px;overflow:auto}
.datev-inspector .datev-info>p,.datev-unsicher-hinweis{font-size:12px;color:#9db6c8;line-height:1.5}
.datev-unsicher-hinweis{margin:8px 0;padding:8px 10px;border-radius:8px;background:#1c1708;color:#f1ca62}
.datev-kontierung .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.datev-kontierung .field{display:flex;flex-direction:column;gap:3px}
.datev-kontierung .field>span{font-size:9px;letter-spacing:.06em;color:#7f98ac;text-transform:uppercase}
.datev-kontierung .field input{height:38px;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 10px;font-size:13px}
.datev-kontierung .field:last-child{grid-column:1/-1}
html[data-theme="light"] .datev-toolbar input,html[data-theme="light"] .datev-toolbar select,html[data-theme="light"] .datev-kontierung .field input{background:#fff;color:#173246}
html[data-theme="light"] .datev-head{background:#e8f0f5}
html[data-theme="light"] .datev-zeile{color:#213d50}
html[data-theme="light"] .datev-zeile:hover{background:#eaf4fa}
html[data-theme="light"] .datev-pruefliste{background:#fdf6e3;border-color:#e3cf8a}

/* Datensicherung (ab 4.55). */
.sicherung-dialog{width:min(560px,calc(100% - 28px))}
.sicherung-tabs{display:flex;gap:6px;margin:4px 0 12px;border-bottom:1px solid var(--line)}
.sicherung-tabs button{border:0;background:transparent;color:#8ea6ba;padding:8px 12px;font-size:12px;font-weight:650;cursor:pointer;border-bottom:2px solid transparent}
.sicherung-tabs button.active{color:#bfe9ff;border-bottom-color:#68ccff}
.sicherung-umfang{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.sicherung-walzen-knoepfe{display:flex;gap:6px;margin:4px 0}
.sicherung-mandanten{max-height:180px;overflow:auto;border:1px solid #294257;border-radius:8px;padding:6px;margin-bottom:10px;background:#0d1a27}
.sicherung-mandant{display:flex;align-items:center;gap:8px;padding:4px 6px;font-size:12px;color:#cdddea;cursor:pointer}
.sicherung-mandant:hover{background:#ffffff0d;border-radius:6px}
.sicherung-crypto{display:flex;gap:6px;align-items:center;margin:6px 0 10px}
.sicherung-crypto input{flex:1;height:36px;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 10px;font-size:13px}
.sicherung-dialog .field input[type=file]{font-size:12px;color:#c7d7e2}
html[data-theme="light"] .sicherung-mandanten,html[data-theme="light"] .sicherung-crypto input{background:#fff;color:#173246}
/* Automatische Sicherung (ab 4.55) */
.auto-sicherung-dialog{width:min(640px,calc(100% - 28px));max-height:calc(100vh - 60px);overflow:auto}
.link-button{border:0;background:transparent;color:#68ccff;cursor:pointer;padding:0;font:inherit;text-decoration:underline}
.auto-haupt{margin:6px 0 12px;font-weight:650}
.auto-block{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:0 0 12px}
.auto-block>legend{padding:0 6px;font-size:11px;font-weight:700;letter-spacing:.04em;color:#8ea6ba;text-transform:uppercase}
.auto-takt,.auto-schluessel-art{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:8px}
.auto-zahl{width:58px;height:28px;border:1px solid #294257;border-radius:6px;background:#0d1a27;color:#d9e8f2;padding:0 6px;margin:0 2px}
.auto-uhrzeit{max-width:160px;margin:6px 0}
.auto-uhrzeit input{height:34px;border:1px solid #294257;border-radius:8px;background:#0d1a27;color:#d9e8f2;padding:0 8px}
.auto-ziele{display:flex;flex-direction:column;gap:10px;margin-bottom:8px}
.auto-ziel{border:1px solid #294257;border-radius:10px;padding:10px;background:#0d1a27}
.auto-ziel-kopf,.auto-ziel-netz{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:8px}
.auto-ziel-kopf .auto-ziel-name{flex:1;min-width:120px}
.auto-ziel-netz>.field{flex:1;min-width:120px}
.auto-port{max-width:92px}
.auto-ziel-fuss{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.auto-aufbewahrung{max-width:120px}
.auto-ziel-meldung{font-size:12px;color:#8ea6ba}
.auto-ziel-meldung.gut{color:#8ee6a8}
.auto-ziel-meldung.schlecht{color:#ff9f93}
.auto-protokoll{margin-top:6px;font-size:12px}
.auto-protokoll>summary{cursor:pointer;color:#8ea6ba}
.auto-prot-zeile{padding:3px 0;color:#c7d7e2;border-top:1px solid #1d3346}
.auto-ok{color:#8ee6a8;font-weight:650}
.auto-fehler{color:#ff9f93;font-weight:650}
html[data-theme="light"] .auto-zahl,html[data-theme="light"] .auto-uhrzeit input,html[data-theme="light"] .auto-ziel{background:#fff;color:#173246}
html[data-theme="light"] .auto-prot-zeile{color:#2a4154;border-top-color:#dfe8ef}