:root{--indigo:#2E2A6B;--indigo-2:#4B45A8;--bg:#F5F5F8;--card:#fff;--line:#E3E2EC;--text:#1C1B29;--muted:#6B6B7B;
--ok:#1F7A4D;--ok-bg:#E6F4EC;--warn:#9A6400;--warn-bg:#FFF4DC;--bad:#B3261E;--bad-bg:#FCE8E6;--info-bg:#ECEBFA;--r:10px}
*{box-sizing:border-box}html{font-size:14px}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.45}
a{color:var(--indigo-2);text-decoration:none}a:hover{text-decoration:underline}
.app{display:grid;grid-template-columns:210px 1fr;min-height:100vh}
nav.side{background:var(--indigo);color:#fff;padding:18px 12px;position:sticky;top:0;height:100vh;overflow:auto}
nav.side .logo{font-weight:800;letter-spacing:.08em;font-size:20px;margin:0 8px 2px}
nav.side .sub{font-size:10px;letter-spacing:.35em;opacity:.7;margin:0 8px 18px}
nav.side a{display:block;color:#E8E7FA;padding:7px 10px;border-radius:7px;margin:1px 0}
nav.side a:hover,nav.side a.on{background:rgba(255,255,255,.12);text-decoration:none;color:#fff}
nav.side .grp{font-size:10px;text-transform:uppercase;letter-spacing:.12em;opacity:.55;margin:14px 10px 4px}
nav.side .user{font-size:12px;opacity:.8;margin:18px 10px 0;border-top:1px solid rgba(255,255,255,.15);padding-top:10px}
main{padding:22px 28px;max-width:1500px;width:100%}
h1{font-size:22px;margin:0 0 4px}h2{font-size:16px;margin:0 0 10px}h3{font-size:14px;margin:14px 0 6px}
.head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.muted{color:var(--muted)}.small{font-size:12px}.r{text-align:right}.nowrap{white-space:nowrap}.b{font-weight:600}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px}
.grid{display:grid;gap:14px}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.span2{grid-column:span 2}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.kpi .v{font-size:20px;font-weight:700;margin-top:2px}
table{width:100%;border-collapse:collapse}th,td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}
th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;background:#FAFAFC}
td.r,th.r{text-align:right}tr:hover td{background:#FBFBFE}
.tbl-wrap{overflow-x:auto}
.badge{display:inline-block;padding:2px 8px;border-radius:99px;font-size:11px;font-weight:600;background:var(--info-bg);color:var(--indigo);white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok)}.badge.warn{background:var(--warn-bg);color:var(--warn)}.badge.bad{background:var(--bad-bg);color:var(--bad)}
.badge.grey{background:#EEE;color:#555}
.st-in_pruefung{background:#EEE;color:#444}.st-angekauft,.st-in_aufbereitung{background:var(--warn-bg);color:var(--warn)}
.st-verkaufsbereit,.st-inseriert{background:var(--info-bg);color:var(--indigo)}.st-reserviert{background:#FDE7F3;color:#9B1C64}
.st-verkauft,.st-ausgeliefert{background:var(--ok-bg);color:var(--ok)}.st-abgelehnt{background:#EEE;color:#888}
.alert{padding:10px 12px;border-radius:8px;margin-bottom:10px;border:1px solid transparent}
.alert.error{background:var(--bad-bg);color:var(--bad);border-color:#F4C7C3}.alert.success{background:var(--ok-bg);color:var(--ok)}
.alert.warning{background:var(--warn-bg);color:var(--warn)}.alert.info{background:var(--info-bg);color:var(--indigo)}
.sim{background:repeating-linear-gradient(45deg,#FFF4DC,#FFF4DC 10px,#FFEBB8 10px,#FFEBB8 20px);color:#6B4500;font-weight:700;padding:6px 12px;border-radius:8px;font-size:12px}
button,.btn{font:inherit;cursor:pointer;border:1px solid var(--indigo);background:var(--indigo);color:#fff;padding:7px 13px;border-radius:7px;display:inline-block;line-height:1.2}
.btn:hover,button:hover{filter:brightness(1.1);text-decoration:none}
.btn.sec,button.sec{background:#fff;color:var(--indigo)}.btn.danger,button.danger{background:#fff;color:var(--bad);border-color:#E4A9A4}
.btn.sm,button.sm{padding:4px 9px;font-size:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
form.inline{display:inline}
input,select,textarea{font:inherit;padding:7px 9px;border:1px solid #CFCEDA;border-radius:7px;background:#fff;width:100%;color:var(--text)}
input[type=checkbox]{width:auto}input:focus,select:focus,textarea:focus{outline:2px solid #C9C6F2;border-color:var(--indigo-2)}
label{font-size:12px;color:var(--muted);display:block;margin-bottom:3px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px 14px}
.fgrid .full{grid-column:1/-1}.field .err{color:var(--bad);font-size:12px}.field .help{color:var(--muted);font-size:11px}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px}.filters>*{width:auto}
.dl{display:grid;grid-template-columns:150px 1fr;gap:4px 10px}.dl dt{color:var(--muted);font-size:12px}.dl dd{margin:0}
.kalk td,.kalk th{padding:6px 8px}.kalk .sum td{font-weight:700;border-top:2px solid var(--indigo)}
.big{font-size:22px;font-weight:700}.pos{color:var(--ok)}.negv{color:var(--bad)}
.rechner{background:var(--info-bg);border-radius:var(--r);padding:14px}
.rechner .out{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.rechner .out div{background:#fff;border-radius:8px;padding:8px 10px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto;position:sticky;top:0;background:var(--bg);z-index:5;padding-top:6px}
.tabs a{padding:8px 12px;border-bottom:2px solid transparent;color:var(--muted);white-space:nowrap}.tabs a:hover{color:var(--indigo);text-decoration:none}
.band{position:relative;height:34px;background:#F0EFF7;border-radius:6px;margin:16px 0 26px}
.band .rng{position:absolute;top:0;bottom:0;background:#CFCBF3;border-radius:6px}
.band .mk{position:absolute;top:-6px;bottom:-6px;width:3px;border-radius:2px}
.band .mk span{position:absolute;top:44px;transform:translateX(-50%);font-size:11px;white-space:nowrap}
.photos{display:flex;gap:8px;flex-wrap:wrap}.photos img{height:110px;border-radius:8px;object-fit:cover}
.login{max-width:360px;margin:12vh auto}
details>summary{cursor:pointer;color:var(--indigo-2);margin:6px 0}
.flow{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 4px}.flow span{font-size:11px;padding:3px 8px;border-radius:99px;background:#EEE;color:#777}
.flow span.done{background:var(--ok-bg);color:var(--ok)}.flow span.now{background:var(--indigo);color:#fff}
.mobile-top{display:none}
@media (max-width:900px){
 .app{grid-template-columns:1fr}nav.side{display:none;position:fixed;z-index:20;width:260px}nav.side.open{display:block}
 .mobile-top{display:flex;justify-content:space-between;align-items:center;background:var(--indigo);color:#fff;padding:10px 14px;position:sticky;top:0;z-index:10}
 .mobile-top a,.mobile-top button{color:#fff;background:none;border:none;font-size:15px}
 main{padding:14px}.g2,.g3,.g4{grid-template-columns:1fr}.span2{grid-column:auto}.dl{grid-template-columns:120px 1fr}
 .rechner .out{grid-template-columns:1fr 1fr}.hide-m{display:none}
}
@media print{nav.side,.mobile-top,.actions,form{display:none!important}main{padding:0}}
td.r,th.r{white-space:nowrap}
table td:first-child a.b{display:inline-block;min-width:170px}
.kalk td:first-child{white-space:normal}
.app>main{min-width:0}.card{overflow-x:auto}
@media (max-width:900px){table td:first-child a.b{min-width:0}.tabs{top:44px}}
.testbanner{background:repeating-linear-gradient(45deg,#FFE08A,#FFE08A 14px,#FFD45C 14px,#FFD45C 28px);color:#5A3E00;font-weight:700;font-size:12px;text-align:center;padding:5px 10px;letter-spacing:.02em;position:sticky;top:0;z-index:30}
nav.side input::placeholder{color:rgba(255,255,255,.6)}
@media print{.testbanner{display:block!important}.alert{border:1px solid #ccc}}
.dropzone{display:flex;gap:14px;align-items:center;border:2px dashed #B9B5E8;border-radius:12px;padding:22px;cursor:pointer;background:#FAFAFF;min-height:120px;transition:.15s}
.dropzone.over{background:#ECEBFA;border-color:var(--indigo-2)}.dropzone.has{border-style:solid;border-color:var(--ok);background:var(--ok-bg)}
.dz-icon{font-size:30px;color:var(--indigo-2)}.dz-file{margin-left:auto;color:var(--ok);font-weight:600}
.progress{height:6px;background:#ECEBFA;border-radius:6px;overflow:hidden;margin-top:12px}.progress div{height:100%;width:40%;background:var(--indigo-2);animation:pg 1.4s infinite ease-in-out}
@keyframes pg{0%{margin-left:-40%}100%{margin-left:100%}}
.ampel{display:flex;gap:14px;align-items:center;padding:14px;border-radius:12px}.ampel .dot{width:18px;height:18px;border-radius:50%;flex:none}
.ampel.gruen{background:var(--ok-bg)}.ampel.gruen .dot{background:var(--ok)}.ampel.gelb{background:var(--warn-bg)}.ampel.gelb .dot{background:#E0A100}
.ampel.rot{background:var(--bad-bg)}.ampel.rot .dot{background:var(--bad)}.ampel.blau,.ampel.grau{background:var(--info-bg)}.ampel.blau .dot{background:var(--indigo-2)}.ampel.grau .dot{background:#aaa}
.spin{display:inline-block;width:12px;height:12px;border:2px solid #c8cbe8;border-top-color:var(--indigo);border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px}@keyframes sp{to{transform:rotate(360deg)}}
