@font-face{font-family:"Big Shoulders Stencil Display";font-weight:800;font-display:swap;src:url(fonts/big-shoulders-stencil-display-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Big Shoulders Stencil Display";font-weight:900;font-display:swap;src:url(fonts/big-shoulders-stencil-display-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(fonts/barlow-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:500;font-display:swap;src:url(fonts/barlow-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(fonts/barlow-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:700;font-display:swap;src:url(fonts/barlow-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:800;font-display:swap;src:url(fonts/barlow-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Semi Condensed";font-weight:600;font-display:swap;src:url(fonts/barlow-semi-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Semi Condensed";font-weight:700;font-display:swap;src:url(fonts/barlow-semi-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Semi Condensed";font-weight:800;font-display:swap;src:url(fonts/barlow-semi-condensed-latin-800-normal.woff2) format("woff2")}
/* HALLE 9 · LEITSTAND — Hallenboden, Bodenmarkierung, Förderband */
:root{
  --beton:#1b1e22; --beton-2:#23272c; --beton-3:#2d3238; --naht:#3a4047;
  --kreide:#e9e6dc; --kreide-2:#a9a89f; --kreide-3:#74756f;
  --signal:#f2c230; --signal-tief:#b88f12;
  --gruen:#4cc38a; --rot:#ef5b4c; --blau:#5aa7e6; --orange:#f08a3c; --violett:#a98be8;
  --karton:#c59a62; --karton-dunkel:#8b6a40;
  --r-s:4px; --r-m:10px; --r-l:18px;
  --stencil:"Big Shoulders Stencil Display","Impact",sans-serif;
  --text:"Barlow","Segoe UI",sans-serif;
  --eng:"Barlow Semi Condensed","Barlow",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  background:var(--beton); color:var(--kreide); font:16px/1.5 var(--text);
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
  overflow-x:hidden;
}
/* Hallenboden: Betonkörnung, Bodenraster, aufgemalte Hallennummer */
.boden{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1200px 700px at 78% -10%, rgba(242,194,48,.08), transparent 60%),
    radial-gradient(900px 600px at 0% 110%, rgba(90,167,230,.06), transparent 60%),
    repeating-linear-gradient(90deg, transparent 0 239px, rgba(242,194,48,.07) 239px 241px),
    repeating-linear-gradient(0deg, transparent 0 239px, rgba(242,194,48,.05) 239px 241px),
    var(--beton);
}
.boden::before{content:"";position:absolute;inset:0;opacity:.35;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.boden::after{content:"9";position:absolute;right:-4vw;bottom:-14vw;
  font:900 72vw/0.8 var(--stencil);color:transparent;
  -webkit-text-stroke:2px rgba(242,194,48,.07);letter-spacing:-.02em}
.streifen{background:repeating-linear-gradient(-45deg,var(--signal) 0 12px,#15171a 12px 24px)}

/* Gerüst */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.rail{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(20,22,25,.92),rgba(20,22,25,.78));
  border-right:1px solid var(--naht);backdrop-filter:blur(6px)}
.marke{padding:22px 22px 18px;border-bottom:1px solid var(--naht)}
.wort{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;font-family:var(--stencil);font-weight:900;line-height:.78}
.wort .jb{font-size:58px;color:#15171a;background:var(--signal);padding:6px 7px 2px;border-radius:3px}
.wort .q{font-size:30px;color:var(--kreide);letter-spacing:.06em;padding-bottom:2px}
.marke .sub{font:600 15px/1.2 var(--eng);color:var(--kreide-2);margin-top:6px}
.rail nav{padding:12px 10px;display:flex;flex-direction:column;gap:2px;flex:1;overflow:auto}
.rail nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--r-s);
  color:var(--kreide-2);text-decoration:none;font:600 16px/1 var(--eng);position:relative}
.rail nav a svg{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8}
.rail nav a:hover{color:var(--kreide);background:rgba(255,255,255,.04)}
.rail nav a.aktiv{color:#15171a;background:var(--signal)}
.rail nav a .zahl{margin-left:auto;font:700 13px/1 var(--text);padding:3px 7px;border-radius:20px;
  background:var(--beton-3);color:var(--kreide)}
.rail nav a.aktiv .zahl{background:#15171a;color:var(--signal)}
.rail .fuss{padding:14px 18px;border-top:1px solid var(--naht);font-size:13px;color:var(--kreide-3)}
.rail .fuss button{width:100%}
.puls{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gruen);margin-right:6px;
  box-shadow:0 0 0 0 rgba(76,195,138,.6);animation:puls 2.4s infinite}
.puls.aus{background:var(--rot);animation:none}
@keyframes puls{70%{box-shadow:0 0 0 8px rgba(76,195,138,0)}100%{box-shadow:0 0 0 0 rgba(76,195,138,0)}}

main{padding:28px clamp(16px,3vw,40px) 80px;min-width:0}
.kopf{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.kopf h1{margin:0;font:900 clamp(40px,5vw,64px)/.9 var(--stencil);letter-spacing:.005em}
.kopf p{margin:6px 0 0;color:var(--kreide-2);max-width:60ch}
.werkzeug{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Bedienelemente */
button,.knopf{font:600 15px/1 var(--eng);border:1px solid var(--naht);background:var(--beton-2);color:var(--kreide);
  padding:10px 14px;border-radius:var(--r-s);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
button:hover,.knopf:hover{border-color:var(--kreide-3)}
button.haupt{background:var(--signal);color:#15171a;border-color:var(--signal)}
button.haupt:hover{background:#ffd34a}
button.klein{padding:6px 9px;font-size:13px}
button.leise{background:transparent}
input,select,textarea{font:500 15px/1.3 var(--text);background:rgba(0,0,0,.25);color:var(--kreide);
  border:1px solid var(--naht);border-radius:var(--r-s);padding:10px 12px;min-width:0}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--signal)}
:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.suche{width:min(340px,100%)}

/* Paneele */
.paneel{background:linear-gradient(180deg,rgba(45,50,56,.72),rgba(35,39,44,.72));border:1px solid var(--naht);
  border-radius:var(--r-m);backdrop-filter:blur(4px)}
.paneel>h2{margin:0;padding:14px 18px 0;font:700 19px/1.2 var(--eng)}
.paneel>.inhalt{padding:14px 18px 18px}

/* Hero: Förderband */
.band-wrap{position:relative;max-width:100%;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--naht);
  background:linear-gradient(180deg,#262a2f,#1c1f23);margin-bottom:18px}
.band-wrap .oben{display:flex;align-items:flex-end;justify-content:space-between;padding:22px 24px 6px;gap:16px;flex-wrap:wrap}
.band-wrap .gross{font:900 clamp(64px,9vw,120px)/.8 var(--stencil);color:var(--signal)}
.band-wrap .gross small{display:block;font:600 18px/1.2 var(--eng);color:var(--kreide);margin-top:10px}
.band-wrap .neben{display:flex;gap:28px;flex-wrap:wrap}
.band-wrap .neben div{font:600 14px/1.2 var(--eng);color:var(--kreide-2)}
.band-wrap .neben b{display:block;font:800 30px/1 var(--text);color:var(--kreide);margin-bottom:4px}
.band{position:relative;height:150px;margin-top:14px;overflow:hidden}
.band .gurt{position:absolute;left:0;right:0;bottom:22px;height:16px;
  background:repeating-linear-gradient(90deg,#3b4047 0 18px,#30343a 18px 36px);border-top:2px solid #50565e;
  animation:gurt 1.6s linear infinite}
.band .rollen{position:absolute;left:0;right:0;bottom:6px;height:14px;
  background:radial-gradient(circle at 12px 7px,#5b6169 5px,#2a2e33 6px,transparent 7px) 0 0/40px 14px repeat-x}
.band .spur{position:absolute;left:0;bottom:40px;display:flex;gap:26px;padding-left:24px;white-space:nowrap;
  animation:lauf var(--dauer,60s) linear infinite}
.band:hover .spur,.band:hover .gurt{animation-play-state:paused}
@keyframes gurt{to{background-position:36px 0}}
@keyframes lauf{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.paket{position:relative;width:132px;height:92px;flex:none;cursor:pointer;border:none;padding:10px 10px 8px;
  background:linear-gradient(160deg,var(--karton),#b38650);color:#2b1e0e;border-radius:3px;text-align:left;
  box-shadow:inset 0 -6px 0 rgba(0,0,0,.08),0 8px 14px rgba(0,0,0,.35);display:block;text-decoration:none}
.paket::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:16px;transform:translateX(-50%);
  background:rgba(255,236,200,.35)}
.paket .s{position:relative;font:800 14px/1.1 var(--eng);display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.paket .n{position:relative;font:600 11px/1.2 var(--text);opacity:.75;display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis}
.paket .t{position:absolute;right:8px;bottom:6px;font:800 11px/1 var(--eng);background:#fff6e4;padding:3px 5px;border-radius:2px}
.paket.alt{background:linear-gradient(160deg,#d8b27a,#bb8a52)}
.paket.ab .t{background:var(--signal)}
.band .leer{position:absolute;left:24px;bottom:58px;color:var(--kreide-3);font:600 16px var(--eng)}

/* Kennzahlen */
.raster{display:grid;gap:14px}
.k4{grid-template-columns:repeat(4,1fr)}
.k2{grid-template-columns:1.4fr 1fr}
.kachel{padding:16px 18px;position:relative;overflow:hidden;cursor:pointer;text-align:left;display:block;width:100%;
  font:inherit;color:inherit}
.kachel .wert{font:800 32px/1 var(--text);margin:8px 0 6px}
.kachel .was{font:600 15px/1.2 var(--eng);color:var(--kreide-2)}
.kachel .klein{font-size:13px;color:var(--kreide-3)}
.kachel .marker{position:absolute;left:0;top:0;bottom:0;width:4px}

/* Tabellen */
.tabelle{width:100%;border-collapse:collapse;font-size:15px}
.tabelle th{text-align:left;font:600 13px/1.2 var(--eng);color:var(--kreide-3);padding:10px 12px;border-bottom:1px solid var(--naht);position:sticky;top:0;background:#262a2f}
.tabelle td{padding:11px 12px;border-bottom:1px solid rgba(58,64,71,.6);vertical-align:top}
.tabelle tr:hover td{background:rgba(255,255,255,.025)}
.tabelle .r{text-align:right;white-space:nowrap}
.scroll{overflow:auto;max-height:calc(100vh - 220px)}
.dim{color:var(--kreide-3);font-size:13px}
.shop{font-weight:700}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:20px;font:600 13px/1 var(--eng);
  background:var(--beton-3);color:var(--kreide);white-space:nowrap;border:1px solid transparent}
.chip::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.st-bestellt{color:var(--blau)} .st-versendet,.st-unterwegs{color:var(--signal)} .st-abholbereit{color:var(--orange)}
.st-zugestellt,.st-erhalten,.st-bezahlt,.st-gebucht{color:var(--gruen)} .st-storniert{color:var(--rot)}
.st-erstattet,.st-angekündigt,.st-offen{color:var(--violett)} .st-offen{color:var(--orange)}
select.statuswahl{padding:5px 8px;font-size:13px;border-radius:20px}
.nummer{font:600 14px/1.2 var(--text);letter-spacing:.02em}
a.link{color:var(--signal);text-decoration:none;border-bottom:1px solid rgba(242,194,48,.35)}
a.link:hover{border-color:var(--signal)}

/* Filterleiste */
.filter{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.filter button{border-radius:20px;padding:7px 12px;font-size:14px}
.filter button.an{background:var(--kreide);color:#15171a;border-color:var(--kreide)}

/* Posteingang */
.post{display:grid;grid-template-columns:minmax(320px,440px) 1fr;gap:14px;min-height:calc(100vh - 200px)}
.liste{overflow:auto;max-height:calc(100vh - 210px)}
.zeile{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid rgba(58,64,71,.6);
  padding:12px 16px;color:inherit;font:inherit;cursor:pointer;border-radius:0}
.zeile:hover{background:rgba(255,255,255,.03)}
.zeile.aktiv{background:rgba(242,194,48,.08);box-shadow:inset 3px 0 0 var(--signal)}
.zeile .o{display:flex;gap:8px;align-items:center;justify-content:space-between}
.zeile .von{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zeile.neu .von::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--signal);margin-right:7px;vertical-align:2px}
.zeile .bt{font-size:15px;margin:3px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zeile .zf{font-size:13px;color:var(--kreide-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.konto-tag{font:600 12px/1 var(--eng);padding:3px 6px;border-radius:3px;background:rgba(0,0,0,.3);color:var(--kreide-2);white-space:nowrap}
.lesen{padding:22px 24px;overflow:auto;max-height:calc(100vh - 210px)}
.lesen h3{margin:0 0 8px;font:700 24px/1.2 var(--eng)}
.lesen pre{white-space:pre-wrap;word-break:break-word;font:15px/1.6 var(--text);color:var(--kreide);margin:18px 0 0;
  max-width:80ch}
.ki{margin-top:14px;padding:12px 14px;border-left:3px solid var(--signal);background:rgba(242,194,48,.07);border-radius:0 var(--r-s) var(--r-s) 0}

/* Formular-Zeile */
.neuform{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));align-items:end;margin-bottom:14px}
.neuform label{display:flex;flex-direction:column;gap:5px;font:600 13px/1 var(--eng);color:var(--kreide-2)}

/* Balken */
.balken{display:flex;align-items:flex-end;gap:4px;height:130px;padding-top:10px}
.balken div{flex:1;background:linear-gradient(180deg,var(--signal),var(--signal-tief));border-radius:2px 2px 0 0;min-height:2px;position:relative}
.balken div:hover::after{content:attr(data-t);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);
  background:#000;color:#fff;font-size:12px;padding:4px 6px;border-radius:3px;white-space:nowrap;margin-bottom:4px}
.shopliste{display:flex;flex-direction:column;gap:9px}
.shopliste .z{display:grid;grid-template-columns:110px 1fr 90px;gap:10px;align-items:center;font-size:14px}
.shopliste .z .l{height:8px;border-radius:4px;background:var(--beton-3);overflow:hidden}
.shopliste .z .l i{display:block;height:100%;background:var(--kreide-2)}
.feed{display:flex;flex-direction:column}
.feed button{display:grid;grid-template-columns:62px 1fr;gap:12px;text-align:left;background:none;border:none;border-bottom:1px solid rgba(58,64,71,.5);
  padding:10px 0;color:inherit;font:inherit;border-radius:0}
.feed .zeit{font:600 13px/1.4 var(--eng);color:var(--kreide-3)}
.warn{border-color:rgba(239,91,76,.5)}
.warn h2{color:var(--rot)}

.leerstand{padding:40px 20px;text-align:center;color:var(--kreide-2)}
.leerstand b{display:block;font:900 34px/1 var(--stencil);color:var(--kreide);margin-bottom:8px}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120%);background:var(--kreide);color:#15171a;
  font:600 15px var(--eng);padding:12px 18px;border-radius:var(--r-s);transition:transform .25s,visibility .25s;z-index:50;visibility:hidden}
.toast.zeigen{transform:translateX(-50%) translateY(0);visibility:visible}

/* Login */
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.tor{width:min(420px,100%);position:relative}
.tor .lamellen{height:18px;border-radius:var(--r-m) var(--r-m) 0 0}
.tor form{padding:30px 28px 28px;border-radius:0 0 var(--r-m) var(--r-m);border-top:none}
.tor .wort{gap:12px}
.tor .wort .jb{font-size:110px;padding:10px 12px 4px;border-radius:5px}
.tor .wort .q{font-size:52px;padding-bottom:4px}
@media (max-width:420px){.tor .wort .jb{font-size:84px}.tor .wort .q{font-size:38px}}
.tor .sub{font:600 20px/1.2 var(--eng);margin:8px 0 22px}
.tor input{width:100%;font-size:18px;padding:14px}
.tor button{width:100%;justify-content:center;margin-top:12px;padding:14px;font-size:17px}
.tor .fehler{color:var(--rot);margin-top:12px;font-weight:600}

/* Handy */
.mobilnav{display:none}
@media (max-width:1100px){.k4{grid-template-columns:repeat(2,1fr)}.k2{grid-template-columns:1fr}}
@media (max-width:820px){
  .app{grid-template-columns:minmax(0,1fr)}
  .rail{display:none}
  main{padding:18px 16px 96px}
  .mobilnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(20,22,25,.96);
    border-top:1px solid var(--naht);overflow-x:auto;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .mobilnav a{flex:1 0 64px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;
    color:var(--kreide-3);text-decoration:none;font:600 11px/1 var(--eng);border-radius:var(--r-s)}
  .mobilnav a svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8}
  .mobilnav a.aktiv{color:var(--signal)}
  .post{grid-template-columns:1fr}
  .post.offen .liste{display:none}
  .post:not(.offen) .lesen{display:none}
  .tabelle .weg{display:none}
  .band{height:130px}
  .paket{width:112px;height:80px}
  .kachel .wert{font-size:26px}
  .shopliste .z{grid-template-columns:90px 1fr 76px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
a.kachel{text-decoration:none}
.mobilzurueck{display:none}
@media (max-width:820px){.mobilzurueck{display:inline-flex}}

/* ===== v1.2 Homescreen-Aufbau ===== */
main{max-width:1320px;margin:0 auto;padding:22px clamp(16px,3vw,36px) 60px}
.leiste{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:18px;padding:10px clamp(16px,3vw,36px);
  background:rgba(22,24,27,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--naht)}
.wort.mini{text-decoration:none;flex-wrap:nowrap;gap:6px}
.wort.mini .jb{font-size:30px;padding:4px 5px 1px}
.wort.mini .q{font-size:18px;letter-spacing:.08em}
.reiter{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.reiter::-webkit-scrollbar{display:none}
.reiter a{display:flex;align-items:center;gap:7px;padding:8px 11px;border-radius:20px;color:var(--kreide-2);
  text-decoration:none;font:600 14px/1 var(--eng);white-space:nowrap}
.reiter a svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8}
.reiter a:hover{color:var(--kreide);background:rgba(255,255,255,.05)}
.reiter a.aktiv{background:var(--kreide);color:#15171a}
.reiter a .zahl{font:700 11px/1 var(--text);background:var(--signal);color:#15171a;padding:2px 6px;border-radius:10px}
body.home .reiter{visibility:hidden}
.leiste .rechts{display:flex;align-items:center;gap:8px;margin-left:auto}
.leiste .status{border-radius:20px;font-size:13px;padding:8px 12px;background:transparent;white-space:nowrap}

/* Begrüßung */
.gruss{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:10px 0 22px}
.gruss h1{margin:0;font:900 clamp(46px,6vw,84px)/.86 var(--stencil)}
.gruss p{margin:8px 0 0;color:var(--kreide-2);font-size:17px}

/* Homescreen-Raster */
.home-raster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(168px,auto);gap:16px}
.w2{grid-column:span 2}.h2{grid-row:span 2}
.widget{position:relative;display:flex;flex-direction:column;padding:18px 20px;border-radius:22px;text-decoration:none;color:var(--kreide);
  background:linear-gradient(165deg,rgba(52,57,64,.85),rgba(33,37,42,.9));border:1px solid rgba(255,255,255,.06);
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 18px 40px -24px rgba(0,0,0,.8);overflow:hidden;min-width:0}
.widget:hover{border-color:rgba(255,255,255,.16)}
.widget:active{transform:scale(.985)}
.widget .top{display:flex;align-items:center;gap:11px}
.app-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;color:#15171a}
.app-icon svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:2}
.widget .name{font:700 17px/1.1 var(--eng)}
.widget .neben{margin-left:auto;font:600 13px/1 var(--eng);color:var(--kreide-3)}
.widget .zahl-gross{font:800 46px/1 var(--text);margin-top:auto;padding-top:14px;letter-spacing:-.01em}
.widget .zahl-gross small{font:600 16px/1 var(--eng);color:var(--kreide-2);margin-left:6px;letter-spacing:0}
.widget .unter{font-size:14px;color:var(--kreide-2);margin-top:6px}
.widget ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.widget li{display:flex;gap:10px;align-items:baseline;font-size:14px;min-width:0}
.widget li .l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.widget li .r{color:var(--kreide-3);font-size:13px;white-space:nowrap}
.widget li b{font-weight:700}
.widget .leise-text{color:var(--kreide-3);font-size:14px;margin-top:12px}

/* Hauptwidget Unterwegs mit Förderband */
.widget.held{background:linear-gradient(165deg,#3a3420,#24221b 55%,#1f2124);border-color:rgba(242,194,48,.22)}
.widget.held .zahl-gross{font:900 112px/.8 var(--stencil);color:var(--signal);padding-top:18px}
.widget.held .zahl-gross small{font:600 19px/1.2 var(--eng);color:var(--kreide);display:block;margin:10px 0 0}
.widget.held .band{margin:16px -20px -18px;height:132px}
.widget.held .paket{width:118px;height:82px}
.widget.held .kenn{display:flex;gap:26px;margin-top:16px;flex-wrap:wrap}
.widget.held .kenn div{font:600 13px/1.2 var(--eng);color:var(--kreide-2)}
.widget.held .kenn b{display:block;font:800 22px/1 var(--text);color:var(--kreide);margin-bottom:3px}

/* Geld-Widget */
.geld-split{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:auto;padding-top:14px}
.geld-split div{font:600 13px/1.2 var(--eng);color:var(--kreide-2)}
.geld-split b{display:block;font:800 30px/1 var(--text);margin-bottom:4px}

/* Mini-Balken im Widget */
.widget .balken{height:64px;margin-top:auto;padding-top:12px;gap:3px}

/* Bereichsseiten: Zurück zum Homescreen */
.kopf h1{font-size:clamp(38px,4.5vw,58px)}

@media (max-width:1100px){.home-raster{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){
  main{padding:16px 14px 40px}
  .leiste{gap:10px;padding:8px 12px;flex-wrap:wrap}
  .reiter{order:3;flex-basis:100%}
  body.home .reiter{display:none}
  .leiste .rechts .knopf{display:none}
  .home-raster{gap:12px;grid-auto-rows:minmax(150px,auto)}
  .widget{padding:15px 16px;border-radius:20px}
  .widget .zahl-gross{font-size:36px}
  .widget.held .zahl-gross{font-size:88px}
  .widget.held .band{margin:14px -16px -15px}
  .app-icon{width:36px;height:36px;border-radius:10px}
  .app-icon svg{width:20px;height:20px}
}
@media (max-width:430px){
  .home-raster .w2.h2,.home-raster .w2{grid-column:span 2}
  .geld-split b{font-size:24px}
  .widget .neben{display:none}
}

/* ===== v1.3 ===== */
.leer-quelle{padding:14px 16px;margin-bottom:12px;border-radius:var(--r-m);border:1px dashed rgba(242,194,48,.45);
  background:rgba(242,194,48,.06);font-size:15px;color:var(--kreide-2)}
.leer-quelle b{color:var(--kreide)}
.geld-held{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;padding:22px 24px;border-radius:var(--r-l)}
.geld-held .riesig{font:800 clamp(44px,6vw,72px)/1 var(--text);margin:10px 0}
.geld-held .was{font:600 16px/1.2 var(--eng);color:var(--kreide-2)}
.geld-held .klein{font-size:13px;color:var(--kreide-3);max-width:52ch}
.geld-teile{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;align-content:center}
.geld-teile div{font:600 13px/1.25 var(--eng);color:var(--kreide-2)}
.geld-teile b{display:block;font:800 22px/1 var(--text);color:var(--kreide);margin-bottom:4px}
.monate{display:flex;gap:10px;align-items:flex-end;height:200px}
.monat{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end;min-width:0}
.monat .saeule{width:100%;max-width:56px;flex:1;display:flex;flex-direction:column-reverse;border-radius:4px;overflow:hidden;background:rgba(255,255,255,.03)}
.monat .saeule i{display:block;width:100%}
.monat b{font:700 13px/1 var(--text);white-space:nowrap}
.monat span{font:600 12px/1 var(--eng);color:var(--kreide-3)}
.legende{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--kreide-2)}
.legende i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.kenn-klein{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:14px;color:var(--kreide-2)}
.kenn-klein b{color:var(--kreide)}
.nachrichten{display:flex;flex-direction:column;gap:14px}
.nachricht{padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.nachricht.gesendet,.nachricht.verworfen{opacity:.55}
.nachricht .nk{display:flex;justify-content:space-between;gap:12px}
.nachricht .bt{margin-top:3px}
.nachricht textarea{width:100%;font:15px/1.5 var(--text);resize:vertical}
.nachricht details pre{white-space:pre-wrap;font:14px/1.5 var(--text);color:var(--kreide-2);max-height:260px;overflow:auto}
.shopliste .l2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:820px){.geld-held{grid-template-columns:1fr;padding:18px}.monate{height:160px;gap:6px}.monat b{font-size:11px}}