@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#171820;--muted:#756F78;--bg:#F8F7F9;--white:#fff;--lime:#B16A78;--line:#E8E1E6;--dark:#1E1F29;--blue:#8398BE;--peach:#D9C4B1;--purple:#ddd7ff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.55 'DM Sans',Arial,sans-serif}h1,h2,h3,.brand,.number{font-family:'Space Grotesk',sans-serif;letter-spacing:-.035em}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(31px,3.1vw,48px);line-height:1.1;margin-bottom:12px}h2{font-size:23px;margin-bottom:8px}h3{font-size:17px;margin-bottom:10px}a{text-decoration:none;color:inherit}button{cursor:pointer;font:inherit}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #783847;outline-offset:3px}.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--dark);color:white;padding:27px 17px 22px;display:flex;flex-direction:column;gap:20px;position:sticky;top:0;height:100vh;overflow:auto}.brand{font-size:26px;font-weight:700;letter-spacing:-.075em;padding:2px 12px 13px;display:block;line-height:1}.brand i{font-style:normal;color:var(--lime)}.sidebar-caption{font-size:10px;letter-spacing:.17em;color:#AA9FA9;text-transform:uppercase;font-weight:700;padding:14px 13px 7px}.nav-group{margin:0}.nav-item{display:flex;align-items:center;gap:11px;padding:10px 13px;margin:2px 0;border-radius:12px;color:#c3cec6;font-size:13px;transition:background .16s}.nav-item:hover{color:#fff;background:#2c3930}.nav-item.active{background:var(--lime);color:#1c271a;font-weight:700}.ni{width:19px;text-align:center;font-size:16px;flex:none}.sidebar-bottom{margin-top:auto;border-top:1px solid #3a483d;padding-top:15px}.sidebar-bottom .nav-item{font-size:12px}.aside-note{font-size:11px;color:#A99CA7;padding:8px 13px}.main{min-width:0}.topbar{height:75px;background:#fff;border-bottom:1px solid var(--line);padding:0 36px;display:flex;align-items:center;justify-content:space-between;gap:16px}.breadcrumbs{color:#7b887e;font-size:12px}.breadcrumbs strong{color:#243128}.top-actions{display:flex;align-items:center;gap:11px}.round{border:1px solid var(--line);background:#f5f7f2;border-radius:50%;height:37px;width:37px;display:grid;place-items:center}.user{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600}.avatar{display:grid;place-items:center;background:#F1E5EB;height:37px;width:37px;border-radius:50%;font-weight:700}.content{max-width:1480px;margin:auto;padding:38px 38px 90px}.intro{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:27px}.intro p{color:var(--muted);max-width:650px;margin:0}.eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;color:#8A6877;display:block;margin-bottom:10px}.btn{border-radius:100px;padding:11px 18px;display:inline-flex;gap:9px;align-items:center;justify-content:center;border:1px solid #cbd4c7;background:#fff;font-size:12px;font-weight:700;white-space:nowrap}.btn.primary{background:var(--lime);border-color:var(--lime)}.btn.dark{background:var(--dark);border-color:var(--dark);color:white}.btn:hover{filter:brightness(.96)}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}.span12{grid-column:span 12}.span8{grid-column:span 8}.span7{grid-column:span 7}.span6{grid-column:span 6}.span5{grid-column:span 5}.span4{grid-column:span 4}.span3{grid-column:span 3}.panel{background:white;border:1px solid var(--line);border-radius:20px;padding:25px;min-width:0}.panel.dark{background:#24242D;color:#fff;border-color:#24242D}.panel.lime{background:var(--lime);border-color:var(--lime)}.panel.blue{background:#F1EEF5;border-color:#F1EEF5}.panel.peach{background:#F4EDE9;border-color:#F4EDE9}.panel-title{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:19px}.panel-title h2{margin:0}.panel-title a{font-size:12px;font-weight:700;color:#85485D}.kpi{min-height:158px}.number{font-size:42px;line-height:1.1;font-weight:700;margin:12px 0 4px}.label{color:#576a5b;font-size:12px;font-weight:600}.mini{font-size:12px;color:#837884}.dark .mini{color:#bdc9c0}.status{display:inline-flex;padding:5px 10px;border-radius:30px;background:#E2EFE8;color:#496453;font-size:11px;font-weight:700}.status.warn{background:#fff1d8;color:#946b16}.status.blue{background:#E8EDF5;color:#536B87}.status.neutral{background:#eff1ee;color:#687268}.status.red{background:#ffe8e6;color:#983b35}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;min-width:580px}th{text-align:left;font-size:10px;letter-spacing:.1em;color:#7d897e;text-transform:uppercase;font-weight:700;padding:13px 10px;border-bottom:1px solid var(--line)}td{padding:17px 10px;border-bottom:1px solid #eef1ed;font-size:13px}tr:last-child td{border-bottom:0}td a{font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#bccab6}.itemrow{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:17px 0;border-bottom:1px solid #edf0eb}.itemrow:last-child{border:0}.itemrow strong{display:block;font-size:14px}.itemrow small{display:block;color:var(--muted);margin-top:3px}.token{height:44px;width:44px;border-radius:13px;background:#F1E7EC;display:grid;place-items:center;font-size:19px;flex:none}.itemlead{display:flex;align-items:center;gap:13px;min-width:0}.chart-bars{display:flex;gap:11px;align-items:end;height:155px;padding:15px 5px;border-bottom:1px solid var(--line)}.chart-bars span{flex:1;background:#E3C8D1;border-radius:7px 7px 0 0;min-height:10px}.chart-bars span:nth-child(3n){background:#C793A2}.chart-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:10px}.info{background:#F5F0F3;border:1px solid #E8D9E2;padding:16px 18px;border-radius:14px;color:#45574a;font-size:12px}.info.warn{background:#fff6e8;border-color:#f0e1c9}.search{border:1px solid var(--line);border-radius:100px;background:white;padding:12px 18px;font:inherit;max-width:300px;width:100%}.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:21px}.chip{background:#fff;border:1px solid var(--line);border-radius:100px;padding:8px 14px;font-size:12px}.chip.active{background:var(--dark);color:white}.progress{height:7px;background:#EFE6EC;border-radius:20px;overflow:hidden;margin-top:12px}.progress b{display:block;height:100%;background:#B8778A;border-radius:20px}.detail-hero{background:#24242D;color:white;border-radius:23px;padding:32px;display:flex;justify-content:space-between;gap:25px;align-items:center;margin-bottom:18px}.detail-hero h2{font-size:31px}.detail-hero p{color:#c6d2c7}.detail-hero .status{background:#354d37;color:#cef39b}.data-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.datum{padding:12px 0;border-bottom:1px solid #edf1eb}.datum small{color:#768278;display:block;font-size:11px;margin-bottom:4px}.datum strong{font-size:13px}.timeline{border-left:1px solid #E6D9E2;padding-left:21px;margin:8px 0 0 6px}.timeline-item{position:relative;margin-bottom:26px}.timeline-item:before{content:'';position:absolute;width:10px;height:10px;background:var(--lime);border:3px solid #fff;border-radius:50%;left:-30px;top:5px;box-shadow:0 0 0 1px #cbddc0}.timeline-item strong{display:block}.timeline-item p{margin:4px 0;color:var(--muted);font-size:12px}.message{border:1px solid var(--line);padding:17px;border-radius:15px;margin-top:12px;background:#fff}.message.agent{background:#F7F0F4}.message small{color:#837884}.field{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700}.field input,.field textarea,.field select{border:1px solid #d8e1d5;border-radius:12px;background:white;padding:13px;font:inherit;color:#253227}.field textarea{min-height:105px;resize:vertical}.formgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.note{background:#e8eee4;border-radius:12px;padding:10px 16px;margin:15px 0 0;font-size:11px;color:#625563}.mobile-menu{display:none}.mobile-nav-shade{display:none}.footer{padding:30px 0;color:#819083;font-size:11px}ul.clean{padding-left:20px;margin-bottom:0;color:#556459}ul.clean li{margin:9px 0}.document{display:flex;justify-content:space-between;gap:20px;align-items:start;padding:19px 0;border-bottom:1px solid var(--line)}.document:last-child{border:0}.document small{display:block;color:var(--muted)}
@media(max-width:1100px){.app{grid-template-columns:215px minmax(0,1fr)}.topbar{padding:0 23px}.content{padding:30px 22px 70px}.span3{grid-column:span 6}.span8,.span7,.span5,.span4{grid-column:span 6}}
@media(max-width:760px){.app{display:block}.sidebar{position:fixed;z-index:12;top:0;bottom:0;left:0;width:268px;transform:translateX(-110%);transition:transform .2s}.sidebar.show{transform:none}.mobile-menu{display:grid;place-items:center;width:37px;height:37px;border:1px solid var(--line);border-radius:10px;background:white}.mobile-nav-shade.show{display:block;position:fixed;inset:0;background:#101c14aa;z-index:11}.topbar{height:68px;padding:0 16px}.top-actions .user>span{display:none}.content{padding:24px 15px 60px}.intro{align-items:start;flex-direction:column}.intro h1{font-size:34px}.grid{gap:11px}.span3,.span4,.span5,.span6,.span7,.span8,.span12{grid-column:span 12}.panel{padding:19px}.data-grid,.formgrid{grid-template-columns:1fr}.detail-hero{padding:23px;flex-direction:column;align-items:start}.filters{gap:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* V17 präziser visueller Abgleich mit der Website */
:root{--focus:#B8778A;--shadow:0 16px 50px rgba(22,37,25,.045)}
.sidebar{box-shadow:inset -1px 0 #ffffff12}.nav-item{min-height:40px}.nav-item.active{box-shadow:0 4px 15px #B16A7819}
.topbar{position:sticky;top:0;z-index:4;backdrop-filter:blur(12px);background:#ffffffeb}
.panel{box-shadow:var(--shadow);transition:border-color .2s ease,box-shadow .2s ease}.panel:hover{border-color:#d2ddcc}
.intro{padding-bottom:6px}.intro h1{letter-spacing:-.055em}.panel-title h2{letter-spacing:-.045em}
.itemrow:hover{background:#f8fbf6}.btn{transition:background .2s ease, transform .2s ease}.btn:hover{transform:translateY(-1px)}
.field input:focus,.field textarea:focus,.field select:focus,.search:focus{outline:2px solid #B8778A;outline-offset:1px;border-color:#A95B70}
.status{line-height:1.1}.detail-hero{background:radial-gradient(circle at 93% 12%,#638c4f55,transparent 45%),#24242D}
.table-wrap{scrollbar-color:#becfb6 transparent}.table-wrap table{width:100%}
@media(max-width:760px){.topbar{top:0}.panel{box-shadow:none}.intro{gap:15px}.itemrow{min-width:0}.itemlead{min-width:0}.itemlead strong,.itemlead small{overflow-wrap:anywhere}.status{flex-shrink:0}}

/* V18: layout integrity and finance view */
.span9{grid-column:span 9}
.span10{grid-column:span 10}
.span2{grid-column:span 2}
.grid > *{min-width:0}
.invoice-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}
.invoice-metric{background:#fff;border:1px solid var(--line);border-radius:20px;padding:21px 24px;min-width:0;box-shadow:var(--shadow)}
.invoice-metric.important{background:#24242D;border-color:#24242D;color:#fff}
.invoice-metric .metric-eyebrow{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#647468;font-weight:700}
.invoice-metric.important .metric-eyebrow{color:#c0d2bb}
.invoice-metric .metric-value{font-family:'Space Grotesk',sans-serif;letter-spacing:-.045em;font-size:clamp(25px,2.45vw,35px);font-weight:700;line-height:1.13;margin:11px 0 5px;overflow-wrap:anywhere}
.invoice-metric .metric-foot{font-size:12px;color:#738275}
.invoice-metric.important .metric-foot{color:#bccdbc}
.invoice-layout{display:grid;grid-template-columns:minmax(0,1fr) 282px;gap:16px;align-items:start}
.invoice-table-panel{min-width:0}
.invoice-table-panel .table-wrap{width:100%;overflow-x:auto}
.invoice-table-panel table{min-width:650px;table-layout:auto}
.invoice-table-panel th,.invoice-table-panel td{white-space:nowrap}
.invoice-table-panel th:nth-child(4),.invoice-table-panel td:nth-child(4){text-align:right}
.invoice-table-panel th:last-child,.invoice-table-panel td:last-child{text-align:right}
.invoice-table-panel th:first-child,.invoice-table-panel td:first-child{padding-left:0}
.invoice-table-panel th:last-child,.invoice-table-panel td:last-child{padding-right:0}
.invoice-filterline{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.invoice-filterline .chip{font-size:11px}
.invoice-filterline .chip[aria-current="true"]{background:var(--dark);color:white}
.invoice-side .panel-title{margin-bottom:14px}
.invoice-side .panel-title h2{font-size:19px}
.invoice-side p{font-size:13px;color:var(--muted)}
.invoice-link{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-top:1px solid var(--line);font-size:12px;font-weight:700}
.invoice-number{font-variant-numeric:tabular-nums;font-weight:700}
.invoice-small{font-size:12px;color:var(--muted)}
.invoice-title-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:1240px){.invoice-layout{grid-template-columns:minmax(0,1fr)}.invoice-side{display:grid;grid-template-columns:1fr 1fr;gap:12px}.invoice-side .panel{height:100%}}
@media(max-width:1100px){.span9{grid-column:span 12}.invoice-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.span9,.span10,.span2{grid-column:span 12}.invoice-metrics{grid-template-columns:1fr;gap:10px}.invoice-metric{padding:18px}.invoice-side{grid-template-columns:1fr}.invoice-table-panel table{min-width:630px}.invoice-layout{gap:12px}.invoice-filterline{gap:6px}.invoice-metric .metric-value{font-size:29px}}