/* IBM Plex Mono — self-hosted */
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IBMPlexMono-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IBMPlexMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/IBMPlexMono-500-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/IBMPlexMono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* IBM Plex Sans — self-hosted */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/IBMPlexSans-300-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/IBMPlexSans-300-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IBMPlexSans-400-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/IBMPlexSans-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/IBMPlexSans-500-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/IBMPlexSans-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/IBMPlexSans-600-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/IBMPlexSans-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/IBMPlexSans-700-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/IBMPlexSans-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Nunito — self-hosted */
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Nunito-700-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/Nunito-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/Nunito-800-latinext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/Nunito-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ═══════════════════════════════════════════════════════
   RESET + VARIABLES
═══════════════════════════════════════════════════════ */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{
  --bg:#111111;--sf:#1e1e1e;--s2:#242424;--bd:#2a2a2a;--bd2:#363636;
  --tx:#c8c8c8;--tx2:#9a9a9a;--mu:#4b4b4b;
  --ac:#e0e0e0;--ac2:#c8c8c8;--bl:#e0e0e0;--gr:#10b981;--gr-bg:rgba(16,185,129,.12);
  --rd:#f87171;--rd-bg:rgba(248,113,113,.12);--am:#f59e0b;--am-bg:rgba(245,158,11,.12);
  --hdr:3.375rem;--bot:3.75rem;--r:0.625rem;--r2:0.875rem;
  --sh:0 1px 3px rgba(0,0,0,.5),0 1px 2px rgba(0,0,0,.35);
  --sh-md:0 4px 16px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.4);
  --sh-lg:0 10px 40px rgba(0,0,0,.7),0 4px 12px rgba(0,0,0,.5);
}
html,body{height:100%;font-family:'IBM Plex Sans',sans-serif;background:var(--bg);color:var(--tx);font-size:0.875rem;line-height:1.5;overscroll-behavior:none}
html{touch-action:manipulation}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bd2);border-radius:99px}

/* ═══════════════════════════════════════════════════════
   UTILITIES
═══════════════════════════════════════════════════════ */
.hidden{display:none!important}
.mono{font-family:'IBM Plex Mono',monospace}
.chip{display:inline-flex;align-items:center;gap:0.1875rem;font-size:0.625rem;padding:0.125rem 0.5rem;border-radius:99px;font-weight:600;white-space:nowrap;font-family:'IBM Plex Mono',monospace}
.c-ha{background:rgba(200,200,200,.14);color:#e0e0e0}.c-eb{background:rgba(251,146,60,.14);color:#fb923c}
.c-sp{background:rgba(16,185,129,.14);color:#34d399}.c-ne4{background:rgba(200,200,200,.14);color:#e0e0e0}
.c-ne3{background:rgba(251,146,60,.14);color:#fb923c}.c-pop{background:rgba(167,139,250,.14);color:#a78bfa}
.c-nsp{background:rgba(244,114,182,.14);color:#f472b6}.c-hup{background:rgba(56,189,248,.14);color:#38bdf8}
.c-dos{background:rgba(45,212,191,.14);color:#2dd4bf}.c-ent{background:rgba(248,113,113,.14);color:#f87171}
.c-oth{background:rgba(156,163,175,.1);color:#9ca3af}
.c-urg{background:rgba(248,113,113,.2);color:#f87171;font-weight:700}
.c-nrm{background:rgba(200,200,200,.14);color:#e0e0e0}.c-lo{background:rgba(245,158,11,.14);color:#f59e0b}
.c-date{background:rgba(200,200,200,.1);color:var(--ac);font-size:0.5625rem}
.c-done{background:var(--gr-bg);color:var(--gr)}
.c-status{background:var(--s2);color:var(--tx2);font-size:0.5625rem}
.badge-team{font-size:0.625rem;font-weight:700;padding:0.125rem 0.5rem;border-radius:99px;color:#fff;font-family:'IBM Plex Mono',monospace;white-space:nowrap}

/* ═══════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.4375rem;border:none;border-radius:8px;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;font-weight:600;transition:all .15s;padding:0.625rem 1.25rem;font-size:0.8125rem}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--ac);color:#111;box-shadow:var(--sh-md)}
.btn-primary:hover{background:var(--ac2)}
.btn-accent{background:var(--ac);color:#111;box-shadow:var(--sh-md)}
.btn-accent:hover{background:var(--ac2)}
.btn-ghost{background:none;border:1.5px solid var(--bd);color:var(--tx2)}
.btn-ghost:hover{border-color:var(--bd2);color:var(--tx)}
.btn-danger{background:none;border:1.5px solid var(--rd);color:var(--rd)}
.btn-danger:hover{background:var(--rd-bg)}
.btn-sm{padding:0.375rem 0.875rem;font-size:0.75rem;border-radius:7px}
.btn-xs{padding:0.25rem 0.625rem;font-size:0.6875rem;border-radius:6px}
.btn-icon{background:none;border:none;color:var(--mu);cursor:pointer;padding:0.3125rem;border-radius:6px;transition:all .12s;display:flex;align-items:center;justify-content:center;width:1.875rem;height:30px}
.btn-icon:hover{color:var(--tx);background:var(--bd)}
.btn-full{width:100%}

/* ═══════════════════════════════════════════════════════
   FORMS
═══════════════════════════════════════════════════════ */
.fi{background:var(--bg);border:1.5px solid var(--bd);border-radius:8px;color:var(--tx);font-family:'IBM Plex Sans',sans-serif;font-size:0.8125rem;padding:0.5625rem 0.75rem;width:100%;outline:none;transition:all .15s;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.fi:focus{border-color:var(--ac);background:var(--sf);box-shadow:0 0 0 3px rgba(200,200,200,.1)}
.fi::placeholder{color:var(--mu)}
select.fi{cursor:pointer}
textarea.fi{resize:vertical;min-height:4.375rem}
.field{display:flex;flex-direction:column;gap:0.25rem}
.field label{font-size:0.6875rem;font-weight:600;color:var(--tx2);letter-spacing:.2px}
.fg{display:grid;gap:0.625rem;margin-bottom:0.625rem}
.fg-1{grid-template-columns:1fr}
.fg-2{grid-template-columns:1fr 1fr}
.fg-3{grid-template-columns:1fr 1fr 1fr}
.fg-4{grid-template-columns:1fr 1fr 1fr 1fr}

/* ═══════════════════════════════════════════════════════
   LOGIN SCREEN
═══════════════════════════════════════════════════════ */
#login-screen{
  min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#111111 0%,#181818 60%,#131318 100%);
  padding:1.25rem;
}
.login-box{background:var(--sf);border-radius:20px;padding:2.5rem;width:100%;max-width:25rem;box-shadow:var(--sh-lg)}
.login-logo{text-align:center;margin-bottom:1.5rem}

.login-logo-icon svg{width:1.75rem;height:1.75rem}


.login-form{display:flex;flex-direction:column;gap:0.875rem}
.login-err{background:var(--rd-bg);border:1px solid #fca5a5;border-radius:8px;padding:0.625rem 0.875rem;font-size:0.75rem;color:var(--rd);display:none}
.login-err.show{display:block}
.login-footer{margin-top:1.25rem;text-align:center}
.login-link{background:none;border:none;color:var(--bl);font-size:0.75rem;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;text-decoration:underline}

/* ═══════════════════════════════════════════════════════
   RESET PASSWORD SCREEN
═══════════════════════════════════════════════════════ */
#reset-screen{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#111111,#181818);padding:1.25rem}
.reset-box{background:var(--sf);border-radius:20px;padding:2.25rem;width:100%;max-width:23.75rem;box-shadow:var(--sh-lg)}
.reset-box h2{font-size:1.125rem;font-weight:700;margin-bottom:0.375rem}
.reset-box p{font-size:0.8125rem;color:var(--tx2);margin-bottom:1.25rem;line-height:1.5}

/* ═══════════════════════════════════════════════════════
   MAIN APP SHELL
═══════════════════════════════════════════════════════ */
#app{display:none;flex-direction:column;height:100vh;height:100dvh;height:var(--real-vh,100dvh);overflow:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}
#app.show{display:flex}

/* HEADER */
.hdr{height:calc(var(--hdr) + env(safe-area-inset-top));background:rgba(17,17,17,0.97);color:#fff;border-bottom:1px solid rgba(200,200,200,.12);display:flex;align-items:center;padding:env(safe-area-inset-top) 0.875rem 0;gap:0.625rem;flex-shrink:0;z-index:200;position:relative}
.hdr-brand{display:flex;flex-direction:column;line-height:1.15;flex-shrink:0;margin-right:0.375rem;cursor:pointer}
.hb-n{font-size:0.8125rem;font-weight:800;color:#fff;letter-spacing:-.1px;font-family:'Nunito',sans-serif}
.hb-s{font-size:0.5625rem;color:rgba(255,255,255,.4);letter-spacing:1.4px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace}

/* Team dropdown */
.dd{position:relative}
.ddb{display:flex;align-items:center;gap:0.375rem;padding:0.3125rem 0.625rem 0.3125rem 0.4375rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:7px;color:#fff;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;font-size:0.75rem;font-weight:500;transition:background .14s;white-space:nowrap;user-select:none;min-width:7.5rem}
.ddb:hover{background:rgba(255,255,255,.16)}
.dd-tdot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dd-lbl{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis}
.dd-arr{font-size:0.5625rem;opacity:.5;transition:transform .14s;flex-shrink:0}
.dd.open .dd-arr{transform:rotate(180deg)}
.ddm{position:absolute;top:calc(100%+6px);left:0;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh-md);min-width:11.25rem;z-index:400;overflow:hidden;display:none}
.dd.open .ddm{display:block;animation:ddIn .12s ease}
@keyframes ddIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.ddi{display:flex;align-items:center;gap:0.5625rem;padding:0.5625rem 0.8125rem;cursor:pointer;font-size:0.8125rem;color:var(--tx);font-weight:500;transition:background .1s;border:none;background:none;width:100%;text-align:left}
.ddi:hover{background:var(--bg)}
.ddi.on{background:rgba(200,200,200,.08);color:var(--ac)}
.ddi-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}

/* Nav tabs */
.nav-tabs{display:flex;background:rgba(255,255,255,.08);border-radius:8px;padding:0.1875rem;gap:0.125rem}
.nt{display:flex;align-items:center;gap:0.3125rem;padding:0.3125rem 0.75rem;border-radius:6px;border:none;background:transparent;color:rgba(255,255,255,.5);font-family:'IBM Plex Sans',sans-serif;font-size:0.75rem;font-weight:500;cursor:pointer;transition:all .14s;white-space:nowrap}
.nt:hover{color:rgba(255,255,255,.85)}
.nt.on{background:#fff;color:#111;font-weight:600}
.nt svg{width:13px;height:0.8125rem;flex-shrink:0}
.nt-l{display:inline}
.hdr-r{margin-left:auto;display:flex;align-items:center;gap:0.5rem}
.user-dd{position:relative}
.user-btn{display:flex;align-items:center;gap:0.4375rem;padding:0.25rem 0.75rem 0.25rem 0.25rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:99px;cursor:pointer;transition:background .14s}
.user-btn:hover{background:rgba(255,255,255,.14)}
.uav{width:1.625rem;height:1.625rem;border-radius:50%;background:var(--ac);display:flex;align-items:center;justify-content:center;font-size:0.5625rem;font-weight:700;color:#111;font-family:'IBM Plex Mono',monospace;flex-shrink:0}
.uname{font-size:0.75rem;color:rgba(255,255,255,.85);font-weight:500;max-width:6.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-badge{font-size:0.5625rem;font-weight:700;padding:0.125rem 0.4375rem;border-radius:99px;background:var(--ac);color:#111;font-family:'IBM Plex Mono',monospace;flex-shrink:0}
.user-menu{position:absolute;top:calc(100%+8px);right:0;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh-md);min-width:11.25rem;z-index:400;display:none;overflow:hidden}
.user-dd.open .user-menu{display:block;animation:ddIn .12s ease}
.um-item{display:flex;align-items:center;gap:0.5625rem;padding:0.625rem 0.875rem;cursor:pointer;font-size:0.8125rem;color:var(--tx);font-weight:500;transition:background .1s;border:none;background:none;width:100%;text-align:left}
.um-item:hover{background:var(--bg)}
.um-item svg{width:0.9375rem;height:0.9375rem;color:var(--mu);flex-shrink:0}
.um-item.danger{color:var(--rd)}
.um-item.danger svg{color:var(--rd)}
.um-divider{height:1px;background:var(--bd);margin:0.25rem 0}
.mob-ham{display:none;background:none;border:none;color:#fff;cursor:pointer;padding:0.25rem;border-radius:6px;flex-shrink:0}

/* ═══════════════════════════════════════════════════════
   APP BODY
═══════════════════════════════════════════════════════ */
.app-body{display:flex;flex:1;overflow:hidden}

/* SIDEBAR */
.sidebar{width:13.125rem;background:var(--sf);border-right:1px solid var(--bd);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden;transition:transform .25s;z-index:100}
.sb-scroll{flex:1;overflow-y:auto;padding:0.5rem 0}
.sb-sec{font-size:0.5625rem;font-weight:700;color:var(--mu);letter-spacing:1.3px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace;padding:0.75rem 0.875rem 0.3125rem}
.sb-btn{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem 0.5rem 0.625rem;border:none;background:none;width:100%;text-align:left;font-family:'IBM Plex Sans',sans-serif;font-size:0.8125rem;font-weight:500;color:var(--tx2);cursor:pointer;transition:all .12s;border-left:3px solid transparent}
.sb-btn:hover{background:var(--bg);color:var(--tx)}
.sb-btn.on{background:rgba(200,200,200,.08);color:var(--ac);border-left-color:var(--ac)}
.sb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.sb-cnt{margin-left:auto;font-size:0.625rem;font-family:'IBM Plex Mono',monospace;background:var(--bg);padding:1px 0.4375rem;border-radius:99px;min-width:1.375rem;text-align:center}
.sb-btn.on .sb-cnt{background:rgba(200,200,200,.1);color:var(--ac)}
.sb-div{height:1px;background:var(--bd);margin:0.375rem 0.625rem}
.sb-stats{padding:0.75rem 0.875rem;border-top:1px solid var(--bd);flex-shrink:0;display:flex;flex-direction:column;gap:0.3125rem}
.ssr{display:flex;justify-content:space-between;align-items:center;padding:0.125rem 0}
.ssl{font-size:0.6875rem;color:var(--mu)}
.ssv{font-size:0.75rem;font-weight:600;font-family:'IBM Plex Mono',monospace}
.sb-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:99}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.view{display:none;flex-direction:column;height:100%;overflow:hidden}
.view.on{display:flex}

/* TOPBAR */
.vbar{display:flex;align-items:center;gap:0.5rem;padding:0.625rem 1rem;background:var(--sf);border-bottom:1px solid var(--bd);flex-shrink:0;flex-wrap:wrap;min-height:3.25rem}
.vbar-title{font-size:0.9375rem;font-weight:600;letter-spacing:-.3px}
.view-mode{display:flex;background:var(--bg);border-radius:7px;padding:0.125rem;gap:1px;flex-shrink:0}
.vm-b{padding:0.25rem 0.6875rem;border-radius:5px;border:none;background:transparent;color:var(--mu);font-family:'IBM Plex Sans',sans-serif;font-size:0.6875rem;font-weight:500;cursor:pointer;transition:all .12s}
.vm-b.on{background:var(--sf);color:var(--tx);box-shadow:var(--sh)}
.filter-chips{display:flex;gap:0.3125rem;flex-wrap:wrap}
.fc{border:1px solid var(--bd);background:var(--sf);border-radius:99px;padding:0.25rem 0.75rem;font-size:0.6875rem;color:var(--tx2);cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .12s;display:inline-flex;align-items:center;gap:0.25rem;font-weight:500;white-space:nowrap}
.fc:hover{border-color:var(--bd2);color:var(--tx)}
.fc.on{background:var(--ac);color:#111;border-color:var(--ac)}
.sort-sel{border:1px solid var(--bd);background:var(--sf);color:var(--tx);border-radius:7px;padding:0.3125rem 0.625rem;font-size:0.6875rem;font-family:'IBM Plex Sans',sans-serif;cursor:pointer;outline:none;margin-left:auto}

/* SCROLL BODY */
.scroll-body{flex:1;overflow-y:auto;padding:0.875rem 1rem;-webkit-overflow-scrolling:touch}

/* ═══════════════════════════════════════════════════════
   CALENDAR
═══════════════════════════════════════════════════════ */
.cal-top{display:flex;align-items:center;gap:0.5rem;padding:0.625rem 1rem;background:var(--sf);border-bottom:1px solid var(--bd);flex-shrink:0;flex-wrap:wrap}
.cal-lbl{font-size:1rem;font-weight:600;letter-spacing:-.3px;flex:1}
.cnb{border:1px solid var(--bd);background:transparent;color:var(--tx);border-radius:7px;padding:0.375rem 0.8125rem;cursor:pointer;font-size:0.8125rem;font-family:'IBM Plex Sans',sans-serif;transition:background .12s;font-weight:500}
.cnb:hover{background:var(--bg)}
.today-btn{background:var(--ac);color:#111;border:none;border-radius:7px;padding:0.375rem 0.875rem;cursor:pointer;font-size:0.75rem;font-family:'IBM Plex Sans',sans-serif;font-weight:600}
.cal-wrap{display:flex;flex:1;overflow:hidden}
.cal-col{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}

/* Month grid */
.dow-row{display:grid;grid-template-columns:repeat(7,1fr);background:var(--sf);border-bottom:1px solid var(--bd);flex-shrink:0}
.dow-c{padding:0.375rem 0;text-align:center;font-size:0.5625rem;font-weight:700;color:var(--mu);letter-spacing:.8px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace}
.cgm{display:grid;grid-template-columns:repeat(7,1fr);flex:1;overflow-y:auto;align-content:stretch}
.dc{background:var(--sf);border-right:1px solid var(--bd);border-bottom:1px solid var(--bd);padding:0.375rem 0.4375rem;cursor:pointer;min-height:8.125rem;display:flex;flex-direction:column;gap:0.1875rem;transition:background .1s;position:relative}
.dc:hover{background:rgba(255,255,255,.04)}
.dc:hover .dc-add{opacity:1}
.dc.oth{background:var(--bg);opacity:.4}
.dc.tod{background:rgba(200,200,200,.04)}
.dc.tod .dn{background:rgba(200,200,200,.18);color:var(--ac);border-radius:50%;border:1px solid rgba(200,200,200,.35)}
.dc.sel{outline:1.5px solid rgba(200,200,200,.4);outline-offset:-1px;background:rgba(200,200,200,.05)}
.dn{font-size:0.6875rem;font-weight:600;width:1.3125rem;height:1.3125rem;display:inline-flex;align-items:center;justify-content:center;font-family:'IBM Plex Mono',monospace}
.dc-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:1px}
.dc-add{opacity:0;background:none;border:none;color:var(--ac);font-size:0.9375rem;line-height:1;cursor:pointer;padding:0 1px;border-radius:4px;transition:opacity .15s,background .12s;flex-shrink:0}
.dc-add:hover{background:rgba(200,200,200,.15)}

/* Pills on calendar */
.cp{font-size:0.625rem;padding:0.125rem 0.375rem;border-radius:4px;display:flex;align-items:center;gap:0.1875rem;border:none;text-align:left;width:100%;font-family:'IBM Plex Sans',sans-serif;cursor:pointer;transition:opacity .12s;font-weight:500;overflow:hidden;white-space:nowrap}
.cp:hover{opacity:.72}
.cp-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}
.cp-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.cp-ha{background:rgba(200,200,200,.2);color:#e0e0e0}.cp-eb{background:rgba(251,146,60,.2);color:#fb923c}
.cp-sp{background:rgba(16,185,129,.2);color:#34d399}.cp-ne4{background:rgba(200,200,200,.2);color:#e0e0e0}
.cp-ne3{background:rgba(251,146,60,.2);color:#fb923c}.cp-pop{background:rgba(167,139,250,.2);color:#a78bfa}
.cp-ent{background:rgba(248,113,113,.2);color:#f87171}.cp-done{background:var(--gr-bg);color:var(--gr)}
.cp-urg{background:var(--rd-bg);color:var(--rd)}.cp-oth{background:var(--s2);color:var(--mu)}
.more-p{font-size:0.5625rem;color:var(--mu);padding:1px 0.25rem;font-family:'IBM Plex Mono',monospace}

/* Day/week/3day grid */
.time-grid-wrap{display:flex;flex:1;overflow:hidden}
.time-gutter{width:3rem;flex-shrink:0;border-right:1px solid var(--bd);background:var(--sf);overflow:hidden}
.time-gutter-inner{padding-top:2.625rem}
.time-slot-lbl{height:3.75rem;display:flex;align-items:flex-start;justify-content:center;font-size:0.5625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace;padding-top:0.125rem}
.day-cols-wrap{flex:1;overflow:auto;position:relative}
.day-cols{display:flex;min-height:100%}
.day-col-hdr-row{position:sticky;top:0;z-index:10;display:flex;background:var(--sf);border-bottom:1px solid var(--bd)}
.day-col-hdr-spc{width:3rem;flex-shrink:0;border-right:1px solid var(--bd)}
.dcol-h{flex:1;padding:0.4375rem 0.5rem 0.3125rem;border-right:1px solid var(--bd);text-align:center;min-width:0}
.dcol-dn{font-size:0.5625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.5px}
.dcol-dt{font-size:0.875rem;font-weight:600}
.dcol-h.tod-col .dcol-dt{color:var(--ac)}
.dcol-h.tod-col{background:rgba(200,200,200,.04)}
.day-grid-body{display:flex;position:relative}
.time-col{width:3rem;flex-shrink:0;border-right:1px solid var(--bd)}
.time-lbl{height:3.75rem;display:flex;align-items:flex-start;justify-content:center;font-size:0.5625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace;padding-top:0.125rem;border-bottom:1px dashed var(--bd)}
.dcol{flex:1;border-right:1px solid var(--bd);position:relative;cursor:pointer}
.hour-line{height:3.75rem;border-bottom:1px dashed var(--bd);position:relative}
.hour-line:hover{background:rgba(224,92,26,.03)}
.t-event{position:absolute;left:3px;right:3px;border-radius:5px;padding:0.1875rem 0.375rem;font-size:0.625rem;font-weight:500;cursor:pointer;overflow:hidden;border-left:2px solid;color:var(--tx);transition:opacity .12s,background .12s;z-index:2}
.t-event:hover{opacity:.85}
.t-event-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.t-event-meta{font-size:0.5625rem;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-slot{height:3.75rem;border-bottom:1px dashed var(--bd);cursor:pointer;position:relative;transition:background .1s}
.tg-slot:hover{background:rgba(200,200,200,.06)}
.tg-slot:hover::after{content:'+ Auftrag';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:0.5625rem;color:var(--ac);opacity:.7;pointer-events:none;font-family:'IBM Plex Mono',monospace;white-space:nowrap}
.now-line{position:absolute;left:0;right:0;height:2px;background:var(--rd);z-index:5;pointer-events:none}
.now-line::before{content:'';position:absolute;left:-4px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--rd)}

/* All-day banner row (time grid) */
.tg-allday-row{display:flex;border-bottom:2px solid var(--bd);background:var(--sf)}
.tg-allday-label{width:52px;flex-shrink:0;border-right:1px solid var(--bd);display:flex;align-items:center;justify-content:flex-end;padding:0.25rem 0.375rem;font-size:0.5rem;font-weight:700;color:var(--mu);font-family:'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.5px}
.tg-allday-col{flex:1;min-width:0;border-right:1px solid var(--bd);padding:0.25rem 0.25rem;display:flex;flex-direction:column;gap:2px;cursor:pointer}
.tg-allday-pill{border-radius:4px;padding:0.25rem 0.5rem;font-size:0.6875rem;font-weight:600;border:none;border-left:3px solid currentColor;cursor:pointer;display:flex;align-items:center;transition:opacity .12s;overflow:hidden;white-space:nowrap;font-family:'IBM Plex Sans',sans-serif;min-height:1.375rem}
.tg-allday-pill:hover{opacity:.8}
.tg-allday-dot{padding:0 3px;font-size:0;min-height:8px;height:8px;border-radius:3px}
/* Task count badge in time-grid column header */
.dcol-cnt{display:inline-flex;align-items:center;justify-content:center;min-width:1rem;height:1rem;padding:0 0.25rem;border-radius:99px;background:var(--ac);color:#111;font-size:0.5rem;font-weight:700;margin-top:2px;font-family:'IBM Plex Mono',monospace}

/* ═══════════════════════════════════════════════════════
   INFO / DOKUMENTATION
═══════════════════════════════════════════════════════ */
.info-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r2);margin-bottom:0.75rem;overflow:hidden}
.info-card-hdr{width:100%;display:flex;align-items:center;gap:0.625rem;padding:0.875rem 1rem;background:none;border:none;cursor:pointer;text-align:left;transition:background .12s;font-family:'IBM Plex Sans',sans-serif}
.info-card-hdr:hover{background:rgba(255,255,255,.04)}
.info-co-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.info-co-name{font-size:0.9375rem;font-weight:700;color:var(--tx);flex:1}
.info-co-badge{font-size:0.625rem;font-weight:700;font-family:'IBM Plex Mono',monospace;color:var(--mu);background:var(--s2);border:1px solid var(--bd);border-radius:4px;padding:1px 6px;letter-spacing:.5px;flex-shrink:0}
.info-chevron{font-size:0.75rem;color:var(--mu);flex-shrink:0;margin-left:0.25rem}
.info-card-body{padding:0 1rem 0.5rem;border-top:1px solid var(--bd)}
.info-sec{border-bottom:1px solid var(--bd)}
.info-sec:last-child{border-bottom:none}
.info-sec-hdr{width:100%;display:flex;align-items:center;gap:0.5rem;padding:0.75rem 0;background:none;border:none;cursor:pointer;text-align:left;font-family:'IBM Plex Sans',sans-serif;transition:opacity .12s}
.info-sec-hdr:hover{opacity:0.75}
.info-sec-chevron{font-size:0.625rem;color:var(--mu);flex-shrink:0;width:0.875rem}
.info-sec-title{font-size:0.75rem;font-weight:700;color:var(--tx);text-transform:uppercase;letter-spacing:.6px;font-family:'IBM Plex Mono',monospace}
.info-sec-body{padding:0 0 0.875rem 1.375rem;font-size:0.875rem;color:var(--tx2);line-height:1.6}
.info-sec-edit{margin-left:auto;flex-shrink:0;font-size:0.75rem;opacity:0;color:var(--mu);cursor:pointer;padding:0.125rem 0.25rem;border-radius:4px;transition:opacity .15s,color .15s}
.info-sec-hdr:hover .info-sec-edit{opacity:1}
.info-sec-edit:hover{color:var(--tx)}
/* Doc content renderer */
.doc-h1{font-size:1rem;font-weight:700;color:var(--tx);margin:0.75rem 0 0.25rem;letter-spacing:-.2px}
.doc-h2{font-size:0.8125rem;font-weight:700;color:var(--tx2);margin:0.625rem 0 0.2rem;text-transform:uppercase;letter-spacing:.4px}
.doc-list{margin:0;padding:0;list-style:none}
.doc-list li{display:flex;gap:0.4rem;line-height:1.55;padding:0.1rem 0}
.doc-list li::before{content:'–';color:var(--mu);flex-shrink:0}
.doc-num{margin:0.1rem 0;padding:0;line-height:1.55;color:var(--tx2)}
.doc-p{margin:0.3rem 0;line-height:1.6}
.doc-spacer{height:0.5rem}
.doc-empty{color:var(--mu);font-style:italic;font-size:0.8125rem}

/* Side panel */
.sp{width:0;background:var(--sf);border-left:1px solid var(--bd);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;transition:width .22s}
.sp.open{width:20rem}
.sp-hdr{padding:0.8125rem 0.9375rem;border-bottom:1px solid var(--bd);flex-shrink:0;display:flex;align-items:flex-start;justify-content:space-between;gap:0.5rem}
.sp-d{font-size:0.875rem;font-weight:600;letter-spacing:-.2px}
.sp-meta{font-size:0.6875rem;color:var(--mu);margin-top:0.125rem}
.sp-x{background:none;border:none;color:var(--mu);cursor:pointer;font-size:1.25rem;line-height:1;padding:0 0.125rem;flex-shrink:0;transition:color .12s}
.sp-x:hover{color:var(--tx)}
.sp-body{flex:1;overflow-y:auto;padding:0.875rem 0.9375rem}
.sp-lbl{font-size:0.5625rem;font-weight:700;color:var(--mu);letter-spacing:1.3px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace;margin:0.875rem 0 0.5rem}
.sp-lbl:first-child{margin-top:0}

/* ═══════════════════════════════════════════════════════
   TASK CARDS
═══════════════════════════════════════════════════════ */
.tgrid{display:flex;flex-direction:column;gap:0.5rem}
.tc{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);transition:border-color .15s,box-shadow .15s}
.tc:hover{border-color:var(--bd2);box-shadow:var(--sh-md)}
.tc.tc-done{opacity:.55}
.tc.tc-urg{border-left:3px solid var(--rd)}
.tc-top{display:flex;align-items:flex-start;gap:0.625rem;padding:0.75rem 0.8125rem 0.5rem}
.tc-cb{width:1.3125rem;height:1.3125rem;border-radius:6px;border:2px solid var(--bd2);background:transparent;cursor:pointer;flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;transition:all .14s;-webkit-appearance:none;appearance:none}
.tc-cb:hover{border-color:var(--gr)}
.tc-cb.on{background:var(--gr);border-color:var(--gr)}
.tc-cb.on::after{content:'';display:block;width:11px;height:7px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.tc-info{flex:1;min-width:0}
.tc-name{font-size:0.8125rem;font-weight:600;margin-bottom:0.3125rem;line-height:1.3;word-break:break-word}
.tc-name.done{text-decoration:line-through;color:var(--mu);font-weight:400}
.tc-chips{display:flex;gap:0.1875rem;flex-wrap:wrap}
.tc-notes{font-size:0.6875rem;color:var(--tx2);margin-top:0.3125rem;line-height:1.45;word-break:break-word}
.prg-w{display:flex;align-items:center;gap:0.375rem;margin-top:0.3125rem}
.prg-b{flex:1;max-width:5rem;height:3px;background:var(--bd);border-radius:2px;overflow:hidden}
.prg-f{height:100%;background:var(--gr);border-radius:2px;transition:width .3s}
.prg-t{font-size:0.625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace}
.tc-acts{display:flex;gap:0.125rem;flex-shrink:0;align-items:flex-start}
.tc-foot{display:flex;gap:0.5rem;padding:0 0.8125rem 0.625rem 2.75rem;align-items:center;flex-wrap:wrap}
.exp-btn{font-size:0.6875rem;color:var(--mu);background:none;border:none;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:color .12s;padding:1px 0;font-weight:500;display:inline-flex;align-items:center;gap:0.1875rem}
.exp-btn:hover{color:var(--ac)}
.tc-byline{margin-left:auto;font-size:0.625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace}

/* Subtasks */
.sub-sec{padding:0.5rem 0.8125rem 0.6875rem 2.75rem;border-top:1px solid var(--bd);background:var(--s2)}
.sub-row{display:flex;align-items:center;gap:0.5rem;padding:0.1875rem 0}
.scb{width:0.9375rem;height:0.9375rem;border-radius:4px;border:1.5px solid var(--bd2);background:transparent;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .12s}
.scb:hover{border-color:var(--gr)}
.scb.on{background:var(--gr);border-color:var(--gr)}
.scb.on::after{content:'';display:block;width:7px;height:4px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg) translate(0,-1px)}
.s-lbl{font-size:0.75rem;flex:1;word-break:break-word}
.s-lbl.done{text-decoration:line-through;color:var(--mu)}
.s-del{background:none;border:none;color:var(--mu);cursor:pointer;font-size:0.6875rem;opacity:0;transition:opacity .12s;padding:0 0.1875rem}
.sub-row:hover .s-del{opacity:1}
.irow{display:flex;gap:0.375rem;margin-top:0.375rem}
.il{flex:1;background:transparent;border:none;border-bottom:1.5px solid var(--bd);color:var(--tx);font-family:'IBM Plex Sans',sans-serif;font-size:0.75rem;padding:0.25rem 0;outline:none;transition:border-color .14s}
.il:focus{border-bottom-color:var(--ac)}
.il::placeholder{color:var(--mu)}
.ilb{background:none;border:none;color:var(--ac);font-size:0.75rem;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;font-weight:600;padding:0 0.25rem;white-space:nowrap}

/* Comments */
.cmt-sec{padding:0.5rem 0.8125rem 0.6875rem 2.75rem;border-top:1px solid var(--bd);background:var(--s2)}
.cmt-row{display:flex;gap:0.5rem;margin-bottom:0.5rem}
.cav{width:1.5rem;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.5625rem;font-weight:700;color:#fff;flex-shrink:0;font-family:'IBM Plex Mono',monospace}
.cmt-body{flex:1;min-width:0}
.c-auth{font-size:0.6875rem;font-weight:600;color:var(--ac)}
.c-txt{font-size:0.75rem;line-height:1.4;word-break:break-word}
.c-time{font-size:0.625rem;color:var(--mu)}

/* ═══════════════════════════════════════════════════════
   KANBAN
═══════════════════════════════════════════════════════ */
.kb-wrap{flex:1;overflow-x:auto;overflow-y:hidden;display:flex;padding:0.875rem 1rem;gap:0.75rem;-webkit-overflow-scrolling:touch}
.kb-col{flex:0 0 260px;display:flex;flex-direction:column;background:var(--s2);border-radius:var(--r);border:1px solid var(--bd);overflow:hidden}
.kb-hdr{padding:0.625rem 0.8125rem;border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:0.5rem;background:var(--sf);flex-shrink:0}
.kb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.kb-title{font-size:0.75rem;font-weight:600;flex:1}
.kb-cnt{font-size:0.625rem;font-family:'IBM Plex Mono',monospace;background:var(--bg);padding:1px 0.4375rem;border-radius:99px;color:var(--mu)}
.kb-body{flex:1;overflow-y:auto;padding:0.5rem;display:flex;flex-direction:column;gap:0.375rem}
.kcard{background:var(--sf);border:1px solid var(--bd);border-radius:8px;padding:0.625rem 0.6875rem;box-shadow:var(--sh);transition:border-color .14s,box-shadow .14s;cursor:grab}
.kcard:active{cursor:grabbing}
.kcard:hover{border-color:var(--bd2);box-shadow:var(--sh-md)}
.kcard.done{opacity:.55}
.kcard.kb-dragging{opacity:.3;transform:scale(.96);box-shadow:none;border-style:dashed}
.kb-body.kb-over{background:rgba(200,200,200,.08);outline:2px dashed rgba(200,200,200,.45);outline-offset:-2px}
.kb-move-btn{display:none;margin-top:7px;width:100%;padding:0.25rem 0.5rem;font-size:0.625rem;border-radius:5px;border:1px solid var(--bd);background:var(--bg);color:var(--tx2);cursor:pointer;text-align:left}
.kb-move-btn:hover{background:var(--s2);color:var(--tx)}
@media(hover:none){.kb-move-btn{display:block}}
.kcard-top{display:flex;align-items:flex-start;gap:0.4375rem}
.kcard-info{flex:1;min-width:0}
.kcard-title{font-size:0.75rem;font-weight:600;margin-bottom:0.25rem;line-height:1.3}
.kcard-title.done{text-decoration:line-through;color:var(--mu)}
.kcard-meta{display:flex;align-items:center;gap:0.3125rem;margin-top:0.375rem;flex-wrap:wrap}
.kcard-date{font-size:0.5625rem;color:var(--mu);font-family:'IBM Plex Mono',monospace;margin-left:auto}
.kprog{height:0.125rem;background:var(--bd);border-radius:1px;overflow:hidden;margin-top:6px}
.kprog-f{height:100%;background:var(--gr);border-radius:1px}
.kcard-cb{width:16px;height:16px;border-radius:5px;border:1.5px solid var(--bd2);display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;transition:all .12s}
.kcard-cb:hover{border-color:var(--gr)}
.kcard-cb.on{background:var(--gr);border-color:var(--gr)}
.kcard-cb.on::after{content:'';display:block;width:8px;height:5px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg) translate(0,-1px)}

/* ═══════════════════════════════════════════════════════
   STATUS / OVERVIEW
═══════════════════════════════════════════════════════ */
.status-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:0.75rem;margin-bottom:22px}
.sc{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:0.875rem 1rem;box-shadow:var(--sh)}
.sc-hdr{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.6875rem}
.sc-dot{width:0.625rem;height:0.625rem;border-radius:50%;flex-shrink:0}
.sc-name{font-size:0.8125rem;font-weight:600}
.sc-stats{display:flex;flex-direction:column;gap:0.3125rem}
.sc-r{display:flex;justify-content:space-between;align-items:center;font-size:0.75rem}
.sc-l{color:var(--mu)}.sc-v{font-weight:600;font-family:'IBM Plex Mono',monospace}
.sc-prog{margin-top:0.6875rem}
.sc-pt{display:flex;justify-content:space-between;font-size:0.625rem;color:var(--mu);margin-bottom:0.25rem}
.sc-pb{height:0.3125rem;background:var(--bd);border-radius:3px;overflow:hidden}
.sc-pf{height:100%;border-radius:3px;transition:width .4s}

/* ═══════════════════════════════════════════════════════
   BACKLOG / ACTIVITY
═══════════════════════════════════════════════════════ */
.activity-list{display:flex;flex-direction:column;gap:0.375rem}
.act-item{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:0.6875rem 0.875rem;display:flex;align-items:flex-start;gap:0.75rem;box-shadow:var(--sh)}
.act-av{width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.6875rem;font-weight:700;color:#fff;flex-shrink:0;font-family:'IBM Plex Mono',monospace}
.act-body{flex:1;min-width:0}
.act-title{font-size:0.8125rem;font-weight:500;line-height:1.3;word-break:break-word}
.act-title strong{font-weight:600}
.act-meta{display:flex;gap:0.5rem;align-items:center;margin-top:0.1875rem;flex-wrap:wrap}
.act-time{font-size:0.6875rem;color:var(--mu);font-family:'IBM Plex Mono',monospace}
.act-tag{font-size:0.625rem;padding:1px 0.4375rem;border-radius:99px;font-weight:600;font-family:'IBM Plex Mono',monospace}
.act-create{background:#dcfce7;color:#166534}
.act-edit{background:#dbeafe;color:#1e40af}
.act-delete{background:#fee2e2;color:#991b1b}
.act-complete{background:#f3e8ff;color:#7e22ce}
.act-comment{background:#fef3c7;color:#92400e}

/* ═══════════════════════════════════════════════════════
   SETTINGS / ADMIN
═══════════════════════════════════════════════════════ */
.settings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem}
.settings-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r2);padding:1.25rem 1.375rem;box-shadow:var(--sh)}
.settings-card h3{font-size:0.875rem;font-weight:600;margin-bottom:0.875rem;display:flex;align-items:center;gap:0.5rem}
.settings-card h3 svg{width:1rem;height:1rem;color:var(--mu)}
.user-row{display:flex;align-items:center;gap:0.625rem;padding:0.5625rem 0;border-bottom:1px solid var(--bd)}
.user-row:last-child{border:none}
.user-row-av{width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.6875rem;font-weight:700;color:#fff;font-family:'IBM Plex Mono',monospace;flex-shrink:0}
.user-row-info{flex:1;min-width:0}
.user-row-name{font-size:0.8125rem;font-weight:600}
.user-row-role{font-size:0.6875rem;color:var(--mu)}
.user-row-acts{display:flex;gap:0.25rem;align-items:center}
.invite-code{background:var(--bg);border:1.5px dashed var(--bd2);border-radius:8px;padding:0.75rem 0.875rem;font-family:'IBM Plex Mono',monospace;font-size:0.8125rem;color:var(--tx);word-break:break-all;margin-bottom:0.625rem;cursor:pointer;transition:border-color .14s}
.invite-code:hover{border-color:var(--ac)}
.inv-copy-btn{font-size:0.6875rem;color:var(--bl);background:none;border:none;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;font-weight:600}
.reset-request-row{display:flex;align-items:center;gap:0.625rem;padding:0.5625rem 0;border-bottom:1px solid var(--bd)}
.reset-request-row:last-child{border:none}
.rr-info{flex:1}
.rr-user{font-size:0.8125rem;font-weight:600}
.rr-time{font-size:0.6875rem;color:var(--mu)}

/* ═══════════════════════════════════════════════════════
   MODALS
═══════════════════════════════════════════════════════ */
.modal-bg{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.55);z-index:1000;align-items:center;justify-content:center;padding:1rem}
.modal-bg.show{display:flex}
.modal{background:var(--sf);border-radius:16px;padding:1.5rem;width:100%;max-width:30rem;box-shadow:0 8px 40px rgba(0,0,0,.6);max-height:90vh;overflow-y:auto;position:relative}
@keyframes modIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.modal-bg.show .modal{animation:modIn .2s ease forwards}
.mod-task-modal{padding:0;display:flex;flex-direction:column;max-height:90vh;max-width:52rem}
.mod-task-hdr{display:flex;justify-content:flex-end;align-items:center;padding:0.625rem 0.875rem 0;position:sticky;top:0;background:var(--sf);z-index:10;border-radius:16px 16px 0 0;flex-shrink:0}
.mod-task-body{padding:0 1.25rem 1.25rem;overflow-y:auto;flex:1}
.mod-task-x{background:none;border:none;color:var(--mu);cursor:pointer;font-size:1.75rem;line-height:1;padding:0 0.125rem;transition:color .12s;-webkit-tap-highlight-color:transparent}
.mod-task-x:hover{color:var(--tx)}
.modal-sm{max-width:22.5rem}
.modal h3{font-size:1rem;font-weight:700;margin-bottom:0.3125rem;letter-spacing:-.2px}
.modal p{font-size:0.8125rem;color:var(--tx2);margin-bottom:1.125rem;line-height:1.5}
.modal-btns{display:flex;gap:0.5rem;justify-content:flex-end;margin-top:1rem}

/* ═══════════════════════════════════════════════════════
   OFFLINE BAR
═══════════════════════════════════════════════════════ */
#offline-bar{display:none;align-items:center;justify-content:center;gap:6px;padding:5px 12px;font-size:11px;font-weight:600;letter-spacing:0.4px;font-family:'IBM Plex Mono',monospace;flex-shrink:0;z-index:201;transition:background .3s}
#offline-bar.show{display:flex}
#offline-bar.is-offline{background:#b91c1c;color:#fff}
#offline-bar.is-syncing{background:#b45309;color:#fff}
#offline-bar.is-done{background:#15803d;color:#fff}
.ofl-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;animation:ofl-pulse 1.2s ease-in-out infinite}
@keyframes ofl-pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ═══════════════════════════════════════════════════════
   TOAST
═══════════════════════════════════════════════════════ */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#181818;color:#fff;padding:0.625rem 1.25rem;border-radius:99px;font-size:0.8125rem;font-weight:500;opacity:0;transition:all .3s;z-index:999;pointer-events:none;white-space:nowrap;box-shadow:var(--sh-md)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:43.75rem){#toast{bottom:calc(var(--bot) + env(safe-area-inset-bottom) + 12px)}}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
═══════════════════════════════════════════════════════ */
.empty-state{text-align:center;padding:3.25rem 1.25rem;color:var(--mu)}
.empty-icon{font-size:2.25rem;margin-bottom:0.625rem;opacity:.2}
.empty-txt{font-size:0.8125rem}

/* ═══════════════════════════════════════════════════════
   MOBILE BOTTOM NAV
═══════════════════════════════════════════════════════ */
.bot-nav{display:none;height:var(--bot);padding-bottom:env(safe-area-inset-bottom);background:#111111;flex-shrink:0;align-items:stretch;justify-content:stretch;gap:0}
.bnt{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.0625rem;border:none;background:transparent;color:rgba(255,255,255,.4);cursor:pointer;font-family:'IBM Plex Sans',sans-serif;font-size:0.4375rem;font-weight:600;letter-spacing:.3px;text-transform:uppercase;transition:color .14s;padding:0.25rem 0.125rem;-webkit-tap-highlight-color:transparent;white-space:nowrap;overflow:hidden}
.bnt.on{color:#fff}
.bnt svg{width:1.25rem;height:1.25rem;flex-shrink:0}
.bnt-dot{width:4px;height:4px;border-radius:50%;background:var(--ac);opacity:0;margin-top:1px}
.bnt.on .bnt-dot{opacity:1}
.bnt-add{background:var(--ac);border-radius:8px;padding:0.25rem 0.5rem;color:#fff!important}

.srch-wrap{position:relative;flex:1;max-width:16.25rem}
.srch-inp{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:8px;color:#fff;font-family:'IBM Plex Sans',sans-serif;font-size:0.75rem;padding:0.375rem 0.75rem 0.375rem 2rem;width:100%;outline:none;transition:all .15s}
.srch-inp::placeholder{color:rgba(255,255,255,.35)}
.srch-inp:focus{background:rgba(255,255,255,.16);border-color:rgba(200,200,200,.4)}
.srch-icon{position:absolute;left:0.5625rem;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.35);pointer-events:none}
.srch-drop{position:absolute;top:calc(100%+6px);left:0;right:0;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh-lg);z-index:500;max-height:20rem;overflow-y:auto;display:none}
.srch-drop.show{display:block}
.srch-item{display:flex;align-items:flex-start;gap:0.625rem;padding:0.625rem 0.8125rem;cursor:pointer;border-bottom:1px solid var(--bd);transition:background .1s}
.srch-item:last-child{border:none}
.srch-item:hover{background:var(--bg)}
.srch-title{font-size:0.8125rem;font-weight:600;color:var(--tx)}
.srch-meta{font-size:0.6875rem;color:var(--mu);margin-top:0.125rem}
.srch-empty{padding:1rem;text-align:center;font-size:0.75rem;color:var(--mu)}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════ */
@media(max-width:64rem){.nt-l{display:none}.nt{padding:0.3125rem 0.625rem}}
@media(max-width:43.75rem){
  .nav-tabs{display:none}.mob-ham{display:flex;align-items:center;justify-content:center}
  .sidebar{position:fixed;top:calc(var(--hdr) + env(safe-area-inset-top));left:0;height:calc(var(--real-vh,100dvh) - var(--hdr) - env(safe-area-inset-top));z-index:500;transform:translate3d(-100%,0,0);box-shadow:var(--sh-md)}
  .sidebar.open{transform:translate3d(0,0,0)}
  .sb-ov{display:block}
  /* Flex layout — app-body not position:fixed keeps sidebar z-index in #app context */
  .app-body{flex:1;min-height:0;display:flex;overflow:hidden}
  /* bot-nav lives outside #app → position:fixed anchors to real viewport bottom, not transform context */
  #app{padding-bottom:calc(var(--bot) + env(safe-area-inset-bottom))}
  .bot-nav{position:fixed;bottom:0;left:0;right:0;height:calc(var(--bot) + env(safe-area-inset-bottom));z-index:100}
  #app.show~.bot-nav{display:flex}
  .sp.open{position:fixed;top:0;right:0;width:100%!important;height:100vh;height:100dvh;z-index:500;padding-top:env(safe-area-inset-top)}
  .fg-2,.fg-3,.fg-4{grid-template-columns:1fr 1fr}
  .status-grid{grid-template-columns:1fr 1fr}
  .settings-grid{grid-template-columns:1fr}

  /* Kanban: near-full-width columns so one fits on screen at a time */
  .kb-wrap{padding:0.625rem 0.75rem;gap:0.625rem;scroll-snap-type:x mandatory}
  .kb-col{flex:0 0 86vw;scroll-snap-align:start}

  /* Calendar: show ALL view buttons in a scrollable row */
  .cal-top{flex-wrap:wrap;gap:0.375rem;padding:0.5rem 0.75rem}
  .view-mode{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;flex-shrink:0}
  .view-mode::-webkit-scrollbar{display:none}
  .vm-b{white-space:nowrap;padding:0.3125rem 0.625rem;font-size:0.6875rem;min-height:2rem}
  .cal-lbl{font-size:0.875rem}

  /* Filter/toolbar bar: scroll horizontally instead of wrapping */
  .vbar{flex-wrap:wrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0.5rem 0.75rem;gap:0.375rem}
  .vbar::-webkit-scrollbar{display:none}
  .filter-chips{flex-wrap:nowrap;overflow-x:auto}
  #tv-search{width:100%!important;order:-1}

  /* Modals: centered on mobile too, just smaller padding */
  .modal-bg{align-items:center;padding:0.75rem}
  .modal{border-radius:16px;max-width:100%;max-height:92vh;padding:1.25rem 1.125rem;overflow-y:auto}
  @keyframes modInMobile{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  .modal-bg.show .modal{animation:modInMobile .18s ease forwards}
  .modal-sm{max-width:100%}
  .modal-btns{position:sticky;bottom:0;background:var(--sf);padding:0.625rem 0 0;margin-top:0.5rem}
  .mod-task-modal{max-height:92vh;border-radius:18px 18px 0 0}
  .mod-task-hdr{border-radius:18px 18px 0 0;padding:0.5rem 0.75rem 0}
  .mod-task-body{padding:0 1rem 1.25rem}

  /* Month grid: compact dot-bar pills on mobile */
  .dc{min-height:5rem;padding:0.25rem 0.1875rem;gap:0.125rem}
  .cp{padding:2px 3px;border-radius:3px;min-height:6px;gap:0}
  .cp-dot,.cp-title,.cp-appt{display:none}
  .more-p{font-size:0.4375rem;padding:0 1px}
  /* All-day pills: compact on mobile */
  .tg-allday-pill{font-size:0.625rem;padding:0.1875rem 0.375rem;min-height:1.125rem}

  /* Login box: full width on small screens */
  .login-box{padding:1.75rem 1.25rem}
  .reset-box{padding:1.5rem 1.125rem}

  /* Task cards: tighter on phone */
  .scroll-body{padding:0.625rem 0.75rem}
  .tc-top{padding:0.625rem 0.6875rem 0.5rem}
  .tc-chips{margin-bottom:0.25rem}
  .tc-foot{padding:0.375rem 0.6875rem 0.5rem 2.375rem}
  .appt-sel{font-size:0.5rem;padding:0.1875rem 0.5rem}

  /* Close-task status buttons: stack on mobile */
  .close-status-grid{grid-template-columns:1fr!important}
  .close-opt{min-height:3rem;font-size:0.8125rem}

  /* Inventory: bigger touch targets for +/- buttons */
  .inv-adj{width:2.25rem!important;height:2.25rem!important;font-size:1.125rem!important}
  .inv-inp{height:2.25rem;font-size:0.9375rem}
  .inv-table td{padding:0.625rem 0.5rem}
  .inv-table th{padding:0.5rem}
  .inv-mat-name{font-size:0.75rem}

  /* Team chips: bigger on mobile */
  .team-chip{padding:0.5rem 0.875rem;font-size:0.8125rem;min-height:2.5rem}

  /* Order items: better spacing */
  .ord-item{padding:0.875rem}
  .ord-actions{flex-wrap:wrap;gap:0.5rem}
  .ord-actions .btn{flex:1;min-height:2.625rem;font-size:0.8125rem;justify-content:center}

  /* Buttons: minimum touch target */
  .btn{min-height:2.5rem}
  .btn-sm{min-height:2.375rem}
  .btn-full{min-height:2.875rem;font-size:0.875rem}

  /* Form fields: more breathing room */
  .field{margin-bottom:0.875rem}
  .fi{padding:0.625rem 0.75rem}
}
@media(max-width:27.5rem){
  .fg-2,.fg-3,.fg-4{grid-template-columns:1fr}
  .status-grid{grid-template-columns:1fr}
  .hdr{padding:env(safe-area-inset-top) 0.625rem 0;gap:0.375rem}
  .hb-n{font-size:0.75rem}
  .ddb{min-width:6.25rem;font-size:0.6875rem}
  .uname{display:none}
  .cal-top{gap:0.25rem}
  .vm-b{padding:0.25rem 0.5rem;font-size:0.625rem}
}
/* Prevent iOS Safari from auto-zooming on input focus (requires font-size ≥ 16px) */
@media(max-width:47.9375rem){
  .fi{font-size:1rem}
}
/* ── EXTRA MOBILE POLISH ─────────────────────────────── */
@media(max-width:43.75rem){
  /* Close-modal material row: stack fields vertically on narrow screens */
  .ord-add-row .field{flex:1 1 100%;min-width:0}
  .ord-add-row .field+.field{margin-top:0}
  .ord-add-row>.btn{width:100%;justify-content:center;margin-top:0.25rem}
  /* Abschluss filter bar: stack on mobile */
  #view-abschluss .vbar>div:last-child{width:100%;display:flex;flex-wrap:wrap;gap:0.375rem}
  #view-abschluss .vbar input{flex:1;min-width:7.5rem}
  /* Inventory matrix: clear compact on mobile, admin only */
  .inv-matrix td,.inv-matrix th{padding:0.375rem 0.3125rem;font-size:0.6875rem}
  /* Stats cards: 2-column grid on phone */
  .lager-stats{grid-template-columns:1fr 1fr}
  /* Prevent dropdown from clipping in modal */
  .mat-ac-drop{max-height:10rem}
  /* Bigger "Alle speichern" button touch target */
  .inv-edit-hdr .btn{min-height:2.5rem}
}

/* ── FORM TABS ─────────────────────────────────────── */
.form-tabs{display:flex;gap:0.125rem;background:var(--bg);border-radius:9px;padding:0.1875rem;margin-bottom:18px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.form-tabs::-webkit-scrollbar{display:none}
.form-tab{flex:1;min-width:0;padding:0.5rem 0.75rem;border:none;background:transparent;color:var(--mu);font-family:'IBM Plex Sans',sans-serif;font-size:0.75rem;font-weight:600;cursor:pointer;border-radius:7px;transition:all .14s;text-align:center;white-space:nowrap}
.form-tab:hover{color:var(--tx);background:rgba(0,0,0,.04)}
.form-tab.on{background:var(--sf);color:var(--tx);box-shadow:var(--sh)}
.form-tab.on.tab-warn{background:rgba(200,200,200,.08);color:var(--ac)}
.form-panel{display:none}
.form-panel.on{display:block}
.label-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:0.5rem;margin-bottom:0.625rem}
.label-chip{display:flex;align-items:center;gap:0.5rem;padding:0.5625rem 0.75rem;background:var(--bg);border:1.5px solid var(--bd);border-radius:8px;cursor:pointer;transition:all .14s;user-select:none}
.label-chip:hover{border-color:var(--bd2)}
.label-chip.on{border-color:currentColor;background:rgba(0,0,0,.04)}
.label-chip input[type=checkbox]{width:0.9375rem;height:0.9375rem;border-radius:4px;cursor:pointer;flex-shrink:0;accent-color:var(--ac)}
.label-chip-name{font-size:0.75rem;font-weight:600;flex:1}
.label-dot{width:0.5625rem;height:0.5625rem;border-radius:50%;flex-shrink:0}
.lc-ha{color:#1e40af}.lc-eb{color:#9a3412}.lc-sp{color:#166534}
.lc-ne4{color:#1e40af}.lc-ne3{color:#9a3412}.lc-pop{color:#7e22ce}
.lc-nsp{color:#9d174d}.lc-hup{color:#075985}.lc-dos{color:#065f46}
.lc-ent{color:#991b1b}.lc-oth{color:#4b5563}
.ld-ha{background:#1e40af}.ld-eb{background:#9a3412}.ld-sp{background:#166534}
.ld-ne4{background:#1e40af}.ld-ne3{background:#9a3412}.ld-pop{background:#7e22ce}
.ld-nsp{background:#9d174d}.ld-hup{background:#075985}.ld-dos{background:#065f46}
.ld-ent{background:#991b1b}.ld-oth{background:#4b5563}
.tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.125rem;height:1.125rem;padding:0 0.3125rem;border-radius:99px;background:var(--ac);color:#fff;font-size:0.625rem;font-weight:700;margin-left:5px;font-family:'IBM Plex Mono',monospace}

/* ═══════════════════════════════════════════════════════
   LAGER
═══════════════════════════════════════════════════════ */
.lager-section{margin-bottom:1.25rem}
.lager-section-title{font-size:0.625rem;font-weight:700;color:var(--mu);letter-spacing:1.2px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace;margin-bottom:0.625rem}
.team-chips{display:flex;gap:0.375rem;flex-wrap:wrap;margin-bottom:1rem}
.team-chip{padding:0.3125rem 0.8125rem;border-radius:99px;border:1.5px solid var(--bd);font-size:0.75rem;font-weight:600;color:var(--tx2);cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .12s;background:none;white-space:nowrap}
.team-chip:hover{border-color:var(--bd2);color:var(--tx)}
.team-chip.on{color:#fff;border-color:transparent}
.inv-table{width:100%;border-collapse:collapse;font-size:0.8125rem}
.inv-table th{padding:0.5rem 0.75rem;text-align:left;font-size:0.625rem;font-weight:700;color:var(--mu);letter-spacing:.5px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace;border-bottom:2px solid var(--bd)}
.inv-table td{padding:0.5625rem 0.75rem;border-bottom:1px solid var(--bd);vertical-align:middle}
.inv-table tr:last-child td{border-bottom:none}
.inv-table tr:hover td{background:rgba(255,255,255,.015)}
.inv-mat-name{font-weight:500;font-size:0.8125rem}
.inv-val{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:0.875rem;color:var(--tx)}
.inv-val.zero{color:var(--mu)}
.inv-unit{font-size:0.625rem;color:var(--mu);margin-left:0.1875rem}
.inv-cell{display:flex;align-items:center;gap:0.375rem}
.inv-adj{background:none;border:1px solid var(--bd);color:var(--tx2);border-radius:6px;width:1.625rem;height:26px;cursor:pointer;font-size:1rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:all .1s;flex-shrink:0}
.inv-adj:hover{background:var(--s2);color:var(--tx);border-color:var(--bd2)}
.inv-inp{width:4rem;background:var(--bg);border:1.5px solid var(--bd);border-radius:6px;color:var(--tx);font-family:'IBM Plex Mono',monospace;font-size:0.8125rem;padding:0.25rem 0.4375rem;text-align:center;transition:border-color .12s}
.inv-inp:focus{border-color:var(--ac);outline:none;background:var(--sf)}
.inv-save-btn{padding:0.25rem 0.625rem;font-size:0.6875rem;border-radius:6px;border:none;background:var(--ac);color:#111;font-weight:700;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .12s}
.inv-save-btn:hover{background:var(--ac2)}
/* ── WAREHOUSE REDESIGN ─────────────────────────────── */
.lager-stats{display:flex;gap:0.625rem;margin-bottom:1.125rem;flex-wrap:wrap}
.lager-stat{flex:1;min-width:6.875rem;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:0.8125rem 0.9375rem}
.lager-stat-val{font-size:1.25rem;font-weight:700;font-family:'IBM Plex Mono',monospace;line-height:1.2}
.lager-stat-lbl{font-size:0.625rem;color:var(--mu);text-transform:uppercase;letter-spacing:.6px;margin-top:0.25rem;font-weight:600;font-family:'IBM Plex Mono',monospace}
.inv-matrix{width:100%;border-collapse:collapse;font-size:0.75rem;white-space:nowrap}
.inv-matrix th{padding:0.5rem 0.625rem;text-align:left;font-size:0.625rem;font-weight:700;color:var(--mu);letter-spacing:.5px;text-transform:uppercase;font-family:'IBM Plex Mono',monospace;border-bottom:2px solid var(--bd);white-space:nowrap}
.inv-matrix td{padding:0.5rem 0.625rem;border-bottom:1px solid var(--bd);vertical-align:middle}
.inv-matrix tr:last-child td{border-bottom:none}
.inv-matrix tr:hover td{background:rgba(255,255,255,.018)}
.inv-mat-col{width:11.25rem;min-width:8.75rem}
.inv-team-col{min-width:6.25rem;text-align:center}
.inv-total-col{min-width:6.25rem;border-left:2px solid var(--bd)}
.inv-used-col{min-width:6.25rem}
.inv-team-cell{text-align:center;vertical-align:middle}
.inv-total-cell{border-left:2px solid var(--bd);font-family:'IBM Plex Mono',monospace;font-size:0.75rem;font-weight:600}
.inv-used-cell{font-family:'IBM Plex Mono',monospace;font-size:0.75rem}
.inv-chip{display:inline-block;padding:1px 0.4375rem;border-radius:99px;font-size:0.6875rem;font-weight:700;font-family:'IBM Plex Mono',monospace;margin:1px;white-space:nowrap}
.inv-cell-val{display:flex;flex-direction:column;align-items:center;gap:0.125rem}
.inv-zero{color:var(--mu);font-size:0.75rem}
.inv-team-dot{width:8px;height:0.5rem;border-radius:50%;display:inline-block;margin-right:0.25rem;flex-shrink:0}
.inv-edit-hdr{padding:0.6875rem 0.875rem;border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between;gap:0.5rem;flex-wrap:wrap;background:var(--s2)}
.inv-tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.inv-status-dot{width:8px;height:8px;border-radius:50%;background:var(--gr);display:inline-block;margin-right:0.25rem;animation:pulse-gr 2s infinite}
@keyframes pulse-gr{0%,100%{opacity:1}50%{opacity:.4}}
/* Time range (Von–Bis) */
.time-range{display:flex;align-items:center;gap:0.375rem}
.time-range .fi{flex:1;min-width:0}
.time-range-sep{font-size:0.75rem;color:var(--mu);flex-shrink:0;font-weight:600}
/* Material autocomplete */
.mat-ac-wrap{position:relative}
.mat-ac-inp{width:100%}
.mat-ac-drop{position:absolute;top:calc(100%+3px);left:0;right:0;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh-lg);z-index:600;max-height:12.5rem;overflow-y:auto;display:none}
.mat-ac-drop.show{display:block}
.mat-ac-item{padding:0.5625rem 0.8125rem;font-size:0.8125rem;cursor:pointer;transition:background .1s;border-bottom:1px solid var(--bd)}
.mat-ac-item:last-child{border:none}
.mat-ac-item:hover,.mat-ac-item.hi{background:var(--s2);color:var(--tx)}
.mat-ac-item mark{background:transparent;color:var(--ac);font-weight:700}
/* Orders */
.ord-notif{font-size:0.5625rem;font-weight:700;background:var(--rd);color:#fff;border-radius:99px;padding:1px 0.3125rem;margin-left:3px;font-family:'IBM Plex Mono',monospace;vertical-align:middle}
.ord-cart{background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:0.75rem 0.875rem;margin-bottom:12px}
.ord-cart-row{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0;border-bottom:1px solid var(--bd);flex-wrap:wrap}
.ord-cart-row:last-child{border:none}
.ord-cart-mat{flex:1;font-size:0.8125rem;font-weight:500;min-width:7.5rem}
.ord-cart-nums{display:flex;gap:0.625rem;align-items:center;font-family:'IBM Plex Mono',monospace;font-size:0.75rem;color:var(--tx2)}
.ord-rm{background:none;border:none;color:var(--mu);cursor:pointer;font-size:1rem;line-height:1;padding:0 0.25rem;transition:color .1s}
.ord-rm:hover{color:var(--rd)}
.ord-add-row{display:flex;gap:0.5rem;align-items:flex-end;flex-wrap:wrap;padding:0.625rem 0 0}
.ord-history{margin-top:1.25rem}
.ord-item{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:0.75rem 0.875rem;margin-bottom:8px}
.ord-item-hdr{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.375rem;flex-wrap:wrap}
.ord-team-badge{font-size:0.625rem;font-weight:700;padding:0.125rem 0.5rem;border-radius:99px;color:#fff;font-family:'IBM Plex Mono',monospace}
.ord-status{font-size:0.625rem;font-weight:700;padding:0.125rem 0.5rem;border-radius:99px;font-family:'IBM Plex Mono',monospace}
.ord-pending{background:var(--am-bg);color:var(--am)}
.ord-fulfilled{background:var(--gr-bg);color:var(--gr)}
.ord-rejected{background:var(--rd-bg);color:var(--rd)}
.ord-lines{font-size:0.75rem;color:var(--tx2);margin-top:0.25rem;line-height:1.7}
.ord-actions{display:flex;gap:0.375rem;margin-top:0.5rem}
/* Material admin */
.mat-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0;border-bottom:1px solid var(--bd)}
.mat-row:last-child{border:none}
.mat-row-name{flex:1;font-size:0.8125rem;font-weight:500}
/* ═══ CLOSE ADDRESS MODAL ═══ */
.close-opt{display:flex;flex-direction:column;align-items:center;gap:0.375rem;padding:1rem 0.625rem;border:2px solid var(--bd);border-radius:var(--r);background:var(--bg);color:var(--tx);font-family:'IBM Plex Sans',sans-serif;font-size:0.8125rem;font-weight:600;cursor:pointer;transition:all .15s;text-align:center;line-height:1.4;width:100%}
.close-opt:hover{border-color:var(--bd2);background:var(--s2)}
.close-opt.on-completed{border-color:var(--gr);background:var(--gr-bg);color:var(--gr)}
.close-opt.on-partial{border-color:var(--am);background:var(--am-bg);color:var(--am)}
.close-opt.on-none{border-color:var(--rd);background:var(--rd-bg);color:var(--rd)}
.close-opt-icon{font-size:1.375rem}
.mat-used-row{display:flex;align-items:center;gap:0.5rem;padding:0.375rem 0;border-bottom:1px solid var(--bd);flex-wrap:wrap}
.mat-used-row:last-child{border:none}
.chip-completed{background:var(--gr-bg);color:var(--gr)}
.chip-partial{background:var(--am-bg);color:var(--am)}
.chip-notdone{background:var(--rd-bg);color:var(--rd)}
.chip-appt1{background:rgba(200,200,200,.18);color:#e0e0e0;border:1px solid rgba(200,200,200,.35)}
.chip-appt2{background:rgba(245,158,11,.18);color:#f59e0b;border:1px solid rgba(245,158,11,.35)}
.chip-appt3{background:rgba(248,113,113,.18);color:#f87171;border:1px solid rgba(248,113,113,.35)}
.appt-sel{font-size:0.5625rem;font-weight:700;padding:0.125rem 0.375rem;border-radius:99px;cursor:pointer;outline:none;font-family:'IBM Plex Mono',monospace}
.appt-sel-1{background:rgba(200,200,200,.18);color:#e0e0e0;border:1px solid rgba(200,200,200,.35)}
.appt-sel-2{background:rgba(245,158,11,.18);color:#f59e0b;border:1px solid rgba(245,158,11,.35)}
.appt-sel-3{background:rgba(248,113,113,.18);color:#f87171;border:1px solid rgba(248,113,113,.35)}
.cp-appt{font-size:0.5rem;font-weight:700;padding:1px 0.25rem;border-radius:3px;margin-left:2px;font-family:'IBM Plex Mono',monospace;vertical-align:middle}
.cp-appt1{background:rgba(200,200,200,.35);color:#e0e0e0}
.cp-appt2{background:rgba(245,158,11,.35);color:#f59e0b}
.cp-appt3{background:rgba(248,113,113,.35);color:#f87171}
/* ═══ ABSCHLUSS VIEW ═══ */
.abl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0.875rem}
.abl-col{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r2);overflow:hidden;display:flex;flex-direction:column}
.abl-hdr{padding:0.6875rem 0.875rem;border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:0.5rem;flex-shrink:0}
.abl-cnt{font-size:0.625rem;font-family:'IBM Plex Mono',monospace;padding:1px 0.4375rem;background:var(--bg);border-radius:99px;color:var(--mu);margin-left:auto}
.abl-body{padding:0.625rem;display:flex;flex-direction:column;gap:0.5rem;overflow-y:auto;flex:1}
.abl-card{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r);padding:0.625rem 0.75rem;transition:border-color .12s}
.abl-card:hover{border-color:var(--bd2)}
.abl-title{font-size:0.8125rem;font-weight:600;margin-bottom:0.1875rem;line-height:1.3}
.abl-meta{font-size:0.6875rem;color:var(--mu)}
.abl-comment{font-size:0.75rem;color:var(--tx2);margin-top:0.375rem;padding-top:0.375rem;border-top:1px solid var(--bd);font-style:italic}
.btn-close-addr{display:inline-flex;align-items:center;gap:0.3125rem;padding:0.25rem 0.625rem;font-size:0.6875rem;font-weight:600;border-radius:6px;border:1.5px solid var(--ac);color:var(--ac);background:none;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .12s;white-space:nowrap}
.btn-close-addr:hover{background:rgba(200,200,200,.1)}
.btn-close-addr.closed-completed{border-color:var(--gr);color:var(--gr)}
.btn-close-addr.closed-partial{border-color:var(--am);color:var(--am)}
.btn-close-addr.closed-none{border-color:var(--rd);color:var(--rd)}
.btn-termin{display:inline-flex;align-items:center;gap:0.25rem;padding:0.25rem 0.625rem;font-size:0.6875rem;font-weight:600;border-radius:6px;border:1.5px solid var(--bd);color:var(--tx2);background:none;cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .12s;white-space:nowrap}
.btn-termin:hover{border-color:var(--bd2);color:var(--tx)}
@media(max-width:50rem){.abl-grid{grid-template-columns:1fr}}

/* ════════════════════════════════════════════════════
   MAP VIEW
════════════════════════════════════════════════════ */
.map-toolbar{padding:0.5rem 0.75rem;background:var(--sf);border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:0.75rem;flex-shrink:0;font-family:'IBM Plex Mono',monospace}
/* Dark-mode Leaflet overrides */
.leaflet-container{background:#1a1a1a!important;font-family:'IBM Plex Sans',sans-serif!important}
.leaflet-popup-content-wrapper{background:#1e1e1e!important;color:#c8c8c8!important;border-radius:10px!important;box-shadow:0 6px 24px rgba(0,0,0,.6)!important;border:1px solid rgba(255,255,255,.1)}
.leaflet-popup-tip{background:#1e1e1e!important}
.leaflet-popup-content{margin:12px 14px!important;font-size:12px!important;line-height:1.5!important}
.leaflet-container a.leaflet-popup-close-button{color:#888!important;font-size:16px!important;padding:6px!important}
.leaflet-container a.leaflet-popup-close-button:hover{color:#fff!important}
.leaflet-control-attribution{background:rgba(20,20,20,.8)!important;color:#666!important;font-size:9px!important}
.leaflet-control-attribution a{color:#888!important}
.leaflet-control-zoom a{background:#1e1e1e!important;color:#c8c8c8!important;border-color:rgba(255,255,255,.12)!important}
.leaflet-control-zoom a:hover{background:#2a2a2a!important;color:#fff!important}

/* ════════════════════════════════════════════════════
   DASHBOARD
════════════════════════════════════════════════════ */
#dash-section{margin-bottom:0.75rem}
.dash-period-row{display:flex;align-items:center;gap:0.375rem;margin-bottom:0.875rem}
.dash-period-btn{background:var(--s2);border:1px solid var(--bd);border-radius:99px;padding:0.25rem 0.875rem;font-size:0.75rem;font-weight:600;color:var(--mu);cursor:pointer;font-family:'IBM Plex Sans',sans-serif;transition:all .14s;white-space:nowrap}
.dash-period-btn:hover{color:var(--tx);border-color:var(--bd2)}
.dash-period-btn.on{background:var(--ac);border-color:var(--ac);color:#fff}
.dash-period-label{margin-left:auto;font-size:0.6875rem;color:var(--mu);font-family:'IBM Plex Mono',monospace}
.dash-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0.625rem;margin-bottom:1rem}
.dash-kpi{background:var(--s2);border-radius:var(--r);padding:0.875rem 1rem;text-align:center;border:1px solid var(--bd);transition:border-color .12s}
.dash-kpi-warn{border-color:rgba(239,68,68,.4)!important;background:rgba(239,68,68,.07)!important}
.dash-kpi-v{font-size:1.625rem;font-weight:700;font-family:'IBM Plex Mono',monospace;line-height:1;margin-bottom:0.25rem;letter-spacing:-0.02em}
.dash-kpi-l{font-size:0.5625rem;color:var(--mu);text-transform:uppercase;letter-spacing:0.6px;font-family:'IBM Plex Mono',monospace}
.dash-warn{background:rgba(239,68,68,.09);border:1px solid rgba(239,68,68,.28);border-radius:var(--r);padding:0.5rem 0.75rem;font-size:0.75rem;color:#f87171;margin-bottom:0.5rem}
.dash-warn-urg{background:rgba(239,68,68,.07);border-color:rgba(239,68,68,.25)}
.dash-warn-stock{background:rgba(251,146,60,.07);border-color:rgba(251,146,60,.28);color:#fb923c}
.dash-today-bar{display:flex;align-items:center;gap:0.75rem;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:0.5rem 0.75rem;margin-bottom:0.75rem;font-size:0.75rem;color:var(--tx2)}
.dash-today-prog{flex:1;height:5px;background:var(--bd);border-radius:99px;overflow:hidden}
.dash-today-fill{height:100%;background:var(--gr);border-radius:99px;transition:width .3s ease}
.dash-charts-row{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-bottom:1.25rem}
.dash-chart-box{background:var(--s2);border-radius:var(--r);padding:0.75rem;border:1px solid var(--bd)}
.dash-chart-title{font-size:0.625rem;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:0.7px;font-family:'IBM Plex Mono',monospace;margin-bottom:0.625rem}
@media(max-width:37.5rem){
  .dash-kpi-row{grid-template-columns:repeat(2,1fr)}
  .dash-charts-row{grid-template-columns:1fr}
  .dash-kpi-v{font-size:1.25rem}
}