/* ==========================================================================
   LEITSTAND (ab 0.19.0a) · eigener Modus, immer rot. Nur Hell, Dunkel und Midnight, keine Designs.
   ========================================================================== */
html.ls-modus {
  --ls-red: #d7262f; --ls-red2: #ff3d47; --ls-redd: #a3141c;
  --ls-bg: #f7f3f3; --ls-card: #ffffff; --ls-fill: #f1e9e9; --ls-line: rgba(110,20,25,.12); --ls-text: #1d1112; --ls-t2: #6f5c5e;
  --ls-glow: rgba(215,38,47,.18); --ls-green: #1f8a52; --ls-yellow: #c98a00;
  --accent: var(--ls-red); --accent-soft: rgba(215,38,47,.1); --card: var(--ls-card); --bg: var(--ls-bg); --fill: var(--ls-fill); --line: var(--ls-line); --text: var(--ls-text); --text-2: var(--ls-t2);
}
html.ls-modus[data-theme="dark"] {
  --ls-bg: #211a1b; --ls-card: #2c2324; --ls-fill: #3a2e2f; --ls-line: rgba(255,170,170,.12); --ls-text: #f6eded; --ls-t2: #c4aeb0;
  --ls-glow: rgba(255,61,71,.22); --ls-green: #4cc785; --ls-yellow: #f2c46d; --accent: var(--ls-red2); --accent-soft: rgba(255,61,71,.16);
}
html.ls-modus[data-theme="dark"][data-nacht="midnight"] {
  --ls-bg: #000000; --ls-card: #0e0909; --ls-fill: #1c1213; --ls-line: rgba(255,90,100,.16); --ls-text: #ffffff; --ls-t2: #b89c9e; --ls-glow: rgba(255,40,52,.3);
}
html.ls-modus body { background: var(--ls-bg); }
html.ls-modus body::before, html.ls-modus .sidebar, html.ls-modus .topbar, html.ls-modus .tabbar, html.ls-modus .fab, html.ls-modus .scrim,
html.ls-modus .deko-top, html.ls-modus .deko-szene, html.ls-modus .deko-canvas, html.ls-modus #netPill ~ .deko { display: none !important; }
html.ls-modus #main { max-width: 1280px; padding: 0 clamp(14px, 3vw, 32px) 80px; }

.ls { color: var(--ls-text); --ease: cubic-bezier(.2,.8,.2,1); }
.ls h1, .ls h2, .ls h3 { color: var(--ls-text); }
.ls a { color: inherit; }
.ls [style*="--i"] { animation: lsIn .55s var(--ease) both; animation-delay: calc(var(--i) * 55ms); }
@keyframes lsIn { from { opacity: 0; transform: translateY(14px); } }

/* ---------- Kopfzeile ---------- */
.ls-top { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; gap: 14px; margin: 0 calc(-1 * clamp(14px, 3vw, 32px)) 18px; padding: 10px clamp(14px, 3vw, 32px);
  background: color-mix(in srgb, var(--ls-bg) 82%, transparent); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); border-bottom: 1px solid var(--ls-line); }
.ls-top::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg, transparent, var(--ls-red), transparent); background-size: 40% 100%; background-repeat: no-repeat; animation: lsSweep 4.5s linear infinite; opacity: .8; }
@keyframes lsSweep { from { background-position: -60% 0; } to { background-position: 160% 0; } }
.ls-brand { display: flex; align-items: center; gap: 9px; flex: none; }
.ls-brand b { font: 800 italic 17px var(--font); letter-spacing: .12em; }
.ls-logo { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--ls-red2), var(--ls-redd)); box-shadow: 0 6px 18px var(--ls-glow); animation: lsFlame 3s ease-in-out infinite; }
@keyframes lsFlame { 50% { box-shadow: 0 6px 26px var(--ls-glow), 0 0 0 4px var(--ls-glow); } }
.ls-live { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 99px; background: var(--ls-red); color: #fff; font: 800 10.5px var(--font); letter-spacing: .1em; text-transform: uppercase; }
.ls-live i { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: lsPulse 1.4s ease-in-out infinite; }
@keyframes lsPulse { 50% { opacity: .25; transform: scale(.7); } }
.ls-tabs { flex: 1; min-width: 0; display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.ls-tabs::-webkit-scrollbar { display: none; }
.ls-tabs a { position: relative; display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border-radius: 11px; text-decoration: none; color: var(--ls-t2); font: 650 14px var(--font); white-space: nowrap; transition: color .2s, background .2s; }
.ls-tabs a:hover { color: var(--ls-text); background: var(--ls-fill); }
.ls-tabs a.on { color: var(--ls-red); background: color-mix(in srgb, var(--ls-red) 11%, transparent); }
.ls-tabs a.on::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: -11px; height: 3px; border-radius: 3px 3px 0 0; background: var(--ls-red); animation: lsTab .35s var(--ease); }
@keyframes lsTab { from { transform: scaleX(0); } }
.ls-n { min-width: 19px; height: 19px; padding: 0 6px; border-radius: 99px; background: var(--ls-red); color: #fff; font: 800 11px/19px var(--font); font-style: normal; text-align: center; animation: lsPop .4s cubic-bezier(.3,1.6,.5,1); }
@keyframes lsPop { from { transform: scale(0); } }
.ls-tools { display: flex; align-items: center; gap: 10px; flex: none; }
.ls-th { display: inline-flex; padding: 3px; border-radius: 11px; background: var(--ls-fill); }
.ls-th button { width: 30px; height: 28px; display: grid; place-items: center; border: 0; border-radius: 8px; background: none; color: var(--ls-t2); cursor: pointer; }
.ls-th button.on { background: var(--ls-card); color: var(--ls-red); box-shadow: 0 1px 4px rgba(0,0,0,.15); }
.ls-th button.mid.on { background: #000; color: #ff3d47; }
.ls-exit { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 11px; text-decoration: none; font: 650 13.5px var(--font); color: var(--ls-t2); border: 1px solid var(--ls-line); transition: color .2s, border-color .2s; }
.ls-exit:hover { color: var(--ls-red); border-color: var(--ls-red); }
.ls-test { display: flex; gap: 8px; align-items: center; margin: 0 0 16px; padding: 9px 14px; border-radius: 12px; background: color-mix(in srgb, var(--ls-yellow) 16%, transparent); color: var(--ls-text); font-size: 13.5px; }

/* ---------- Bausteine ---------- */
.ls-card { background: var(--ls-card); border: 1px solid var(--ls-line); border-radius: 20px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: box-shadow .25s, transform .25s; }
.ls-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.ls-card h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16.5px; font-weight: 750; }
.ls-card h2 svg { color: var(--ls-red); }
.ls-mini { display: inline-flex; align-items: center; gap: 5px; padding: 6px 11px; border-radius: 9px; border: 1px solid var(--ls-line); background: var(--ls-card); color: var(--ls-text); font: 650 12.5px var(--font); text-decoration: none; cursor: pointer; transition: all .18s; }
.ls-mini:hover { border-color: var(--ls-red); color: var(--ls-red); }
.ls-x { border: 0; background: none; color: var(--ls-t2); padding: 6px; border-radius: 8px; cursor: pointer; }
.ls-x:hover { color: var(--ls-red); background: color-mix(in srgb, var(--ls-red) 10%, transparent); }
.ls-hint { font-size: 12.5px; color: var(--ls-t2); }
.ls-leer { display: flex; align-items: center; gap: 8px; margin: 6px 0; color: var(--ls-t2); font-size: 14px; }
.ls-leer a { color: var(--ls-red); }
.ls-row { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.ls .btn.cta { background: var(--ls-red); border-color: var(--ls-red); color: #fff; }
.ls .btn.cta:hover { background: var(--ls-redd); }
.ls input, .ls textarea, .ls select { font: inherit; color: var(--ls-text); background: var(--ls-fill); border: 1px solid transparent; border-radius: 11px; padding: 9px 12px; width: 100%; box-sizing: border-box; transition: border-color .2s, box-shadow .2s; }
.ls input:focus, .ls textarea:focus, .ls select:focus { outline: none; border-color: var(--ls-red); box-shadow: 0 0 0 3px var(--ls-glow); }
.ls input[type="checkbox"] { width: auto; accent-color: var(--ls-red); }
.ls .fld { display: grid; gap: 5px; margin: 0 0 10px; }
.ls .fld > span { font-size: 12.5px; font-weight: 650; color: var(--ls-t2); }
.ls .fld[hidden] { display: none; }
.ls-mt { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ls-mt b { font-size: 14px; font-weight: 650; line-height: 1.3; }
.ls-mt small { font-size: 12.5px; color: var(--ls-t2); line-height: 1.4; }
.ls-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.ls-grid.two { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.ls-col { display: grid; gap: 16px; }
.ls-head { margin: 4px 0 16px; }
.ls-head h1 { margin: 0 0 4px; font-size: clamp(26px, 3.5vw, 34px); font-weight: 800; letter-spacing: -.01em; }
.ls-head p { margin: 0; color: var(--ls-t2); max-width: 70ch; }
.ls-lock { max-width: 460px; margin: 12vh auto; text-align: center; display: grid; justify-items: center; gap: 10px; color: var(--ls-text, inherit); }
.ls-lock svg { color: #d7262f; }
.ls-lock h1 { margin: 0; }
.ls-lock p { margin: 0 0 8px; color: var(--text-2); }
.ls-spin { width: 38px; height: 38px; border-radius: 50%; border: 3px solid rgba(215,38,47,.2); border-top-color: #d7262f; animation: lsSpin .8s linear infinite; }
@keyframes lsSpin { to { transform: rotate(360deg); } }

/* ---------- Übersicht ---------- */
.ls-hero { position: relative; overflow: hidden; margin-bottom: 16px; padding: 22px 24px; border-radius: 24px; color: #fff;
  background: radial-gradient(120% 140% at 100% 0%, rgba(255,255,255,.18), transparent 50%), linear-gradient(130deg, var(--ls-red2) 0%, var(--ls-red) 45%, var(--ls-redd) 100%); box-shadow: 0 18px 40px var(--ls-glow); }
.ls-hero::after { content: ""; position: absolute; inset: -40% -10% auto auto; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.22), transparent 65%); animation: lsDrift 9s ease-in-out infinite alternate; }
@keyframes lsDrift { to { transform: translate(-80px, 60px); } }
.ls-hero h1 { margin: 2px 0 6px; color: #fff; font-size: clamp(26px, 4vw, 38px); font-weight: 800; letter-spacing: -.01em; }
.ls-kick { margin: 0; font: 700 12px var(--font); letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
.ls-lead { margin: 0; font-size: 15.5px; opacity: .95; }
.ls-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.ls-kpi { position: relative; display: grid; gap: 2px; padding: 14px 16px; border-radius: 18px; background: var(--ls-card); border: 1px solid var(--ls-line); text-decoration: none; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s, border-color .25s; }
.ls-kpi:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--ls-red) 40%, var(--ls-line)); box-shadow: 0 12px 28px var(--ls-glow); }
.ls-kpi-i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; margin-bottom: 6px; background: color-mix(in srgb, var(--ls-red) 12%, transparent); color: var(--ls-red); }
.ls-kpi b { font: 800 30px/1.05 var(--font); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ls-kpi span { font-size: 13px; font-weight: 650; }
.ls-kpi small { font-size: 11.5px; color: var(--ls-t2); }
.ls-kpi.rot b { color: var(--ls-red); }
.ls-kpi.rot .ls-kpi-i { background: var(--ls-red); color: #fff; animation: lsFlame 2.4s ease-in-out infinite; }
.ls-kpi.gruen b { color: var(--ls-green); }
.ls-kpi.gelb b { color: var(--ls-yellow); }
.ls-msgs, .ls-next, .ls-rank, .ls-nl, .ls-uwl, .ls-tl, .ls-disz { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ls-msg a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 13px; text-decoration: none; transition: background .18s, transform .18s; }
.ls-msg { animation: lsIn .45s var(--ease) both; animation-delay: calc(300ms + var(--j) * 35ms); }
.ls-msg a:hover { background: var(--ls-fill); transform: translateX(3px); }
.ls-mi { flex: none; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: var(--ls-fill); color: var(--ls-t2); }
.ls-msg.warn .ls-mi { background: color-mix(in srgb, var(--ls-red) 14%, transparent); color: var(--ls-red); }
.ls-msg.schlecht .ls-mi { background: color-mix(in srgb, var(--ls-red) 14%, transparent); color: var(--ls-red); }
.ls-msg.gut .ls-mi { background: color-mix(in srgb, var(--ls-green) 15%, transparent); color: var(--ls-green); }
.ls-msg.termin .ls-mi, .ls-msg.notiz .ls-mi { background: color-mix(in srgb, var(--ls-yellow) 18%, transparent); color: var(--ls-yellow); }
.ls-msg.gelesen { opacity: .55; }
.ls-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--ls-red); box-shadow: 0 0 0 0 var(--ls-glow); animation: lsRing 2s infinite; }
@keyframes lsRing { 70% { box-shadow: 0 0 0 7px transparent; } }
.ls-next a, .ls-nl a { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; text-decoration: none; transition: background .18s; }
.ls-next a:hover, .ls-nl a:hover { background: var(--ls-fill); }
.ls-day { flex: none; width: 46px; padding: 5px 0; border-radius: 12px; display: grid; justify-items: center; background: color-mix(in srgb, var(--ls-red) 10%, transparent); color: var(--ls-red); line-height: 1.1; }
.ls-day b { font: 800 19px var(--font); }
.ls-day small { font: 700 10.5px var(--font); text-transform: uppercase; letter-spacing: .05em; }
.ls-day.big { width: 58px; padding: 8px 0; }
.ls-day.big b { font-size: 24px; }
.ls-st { flex: none; padding: 3px 9px; border-radius: 99px; font: 700 11px var(--font); font-style: normal; background: var(--ls-fill); color: var(--ls-t2); }
.ls-st.neu { background: var(--ls-red); color: #fff; }
.ls-st.angebot { background: color-mix(in srgb, var(--ls-yellow) 22%, transparent); color: var(--ls-yellow); }
.ls-st.bestaetigt { background: color-mix(in srgb, var(--ls-green) 18%, transparent); color: var(--ls-green); }
.ls-rank a { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 12px; text-decoration: none; transition: background .18s; }
.ls-rank a:hover { background: var(--ls-fill); }
.ls-rank b { flex: 1; font-size: 14px; }
.ls-rank em { font: 800 15px var(--font); font-style: normal; color: var(--ls-green); font-variant-numeric: tabular-nums; }
.ls-rank.low em { color: var(--ls-red); }
.ls-rank.low svg { color: var(--ls-red); }
.ls-pl { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font: 800 12px var(--font); background: var(--ls-fill); }
.ls-pl.p1 { background: linear-gradient(135deg, #ffd66b, #d9a400); color: #3b2a00; }
.ls-pl.p2 { background: linear-gradient(135deg, #e6e6e6, #a9a9a9); color: #222; }
.ls-pl.p3 { background: linear-gradient(135deg, #e7a46b, #b5651d); color: #fff; }
.ls-sub { margin: 12px 0 4px; font: 700 11.5px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ls-t2); }
.ls-pin { display: inline-flex; color: var(--ls-red); margin-right: 4px; vertical-align: -1px; }

/* ---------- Balken (Note) ---------- */
.ls-bar { position: relative; display: block; height: 6px; border-radius: 6px; background: var(--ls-fill); overflow: hidden; }
.ls-bar > i { position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: 6px; background: linear-gradient(90deg, var(--ls-red2), var(--ls-red)); transform-origin: left; animation: lsGrow .9s var(--ease) both; animation-delay: .25s; }
.ls-bar.gut > i { background: linear-gradient(90deg, #3cc47a, var(--ls-green)); }
.ls-bar.schlecht > i { background: linear-gradient(90deg, #ff7a6b, var(--ls-redd)); }
.ls-bar.leer > i { display: none; }
@keyframes lsGrow { from { transform: scaleX(0); } }

/* ---------- Team ---------- */
.ls-filter { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.ls-q { flex: 1 1 220px; max-width: 340px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: 12px; background: var(--ls-card); border: 1px solid var(--ls-line); color: var(--ls-t2); }
.ls-q input { background: none !important; border: 0 !important; box-shadow: none !important; padding: 10px 0; }
.ls-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ls-chips button, .ls-arten button { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: 99px; border: 1px solid var(--ls-line); background: var(--ls-card); color: var(--ls-t2); font: 650 13px var(--font); cursor: pointer; transition: all .18s; }
.ls-chips button:hover, .ls-arten button:hover { color: var(--ls-text); border-color: var(--ls-t2); }
.ls-chips button.on, .ls-arten button.on { background: var(--ls-red); border-color: var(--ls-red); color: #fff; }
.ls-team { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 10px; }
.ls-p { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: var(--ls-card); border: 1px solid var(--ls-line); text-decoration: none; animation: lsIn .45s var(--ease) both; animation-delay: calc(80ms + var(--j) * 22ms); transition: transform .2s var(--ease), box-shadow .2s, border-color .2s; }
.ls-p[hidden] { display: none; }
.ls-p:hover { transform: translateY(-2px); box-shadow: 0 10px 24px var(--ls-glow); border-color: color-mix(in srgb, var(--ls-red) 35%, var(--ls-line)); }
.ls-p.ueber { box-shadow: inset 3px 0 0 var(--ls-green); }
.ls-p.unter { box-shadow: inset 3px 0 0 var(--ls-red); }
.ls-pt { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ls-pt b { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ls-pt small { font-size: 12px; color: var(--ls-t2); }
.ls-tbe { color: var(--ls-yellow); font-weight: 650; }
.ls-neu { font-style: normal; font-weight: 700; color: var(--ls-green); }
.ls-pe { display: flex; gap: 4px; }
.ls-pe i, .ls-facts i { font: 800 11.5px var(--font); font-style: normal; padding: 2px 6px; border-radius: 7px; }
.pl { background: color-mix(in srgb, var(--ls-green) 16%, transparent); color: var(--ls-green); }
.mi { background: color-mix(in srgb, var(--ls-red) 14%, transparent); color: var(--ls-red); }
.ls-ps { width: 62px; display: grid; gap: 4px; justify-items: end; position: relative; }
.ls-ps b { font: 800 18px var(--font); font-variant-numeric: tabular-nums; }
.ls-ps .ls-bar { width: 100%; }
.ls-ps i.up, .ls-ps i.down { position: absolute; left: 0; top: 4px; }
i.up { color: var(--ls-green); display: inline-flex; }
i.down { color: var(--ls-red); display: inline-flex; transform: scaleY(-1); }

/* ---------- Person ---------- */
.ls-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px; color: var(--ls-t2) !important; text-decoration: none; font: 650 13.5px var(--font); }
.ls-back:hover { color: var(--ls-red) !important; }
.ls-ph { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 16px; padding: 20px; border-radius: 24px; background: var(--ls-card); border: 1px solid var(--ls-line); position: relative; overflow: hidden; }
.ls-ph::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--ls-red2), var(--ls-redd)); }
.ls-ph .ava { box-shadow: 0 0 0 4px var(--ls-card), 0 0 0 6px var(--ls-red); }
.ls-pht { flex: 1; min-width: 240px; }
.ls-pht h1 { margin: 0; font-size: 28px; font-weight: 800; }
.ls-pht > p { margin: 4px 0 12px; color: var(--ls-t2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ls-pht .kb.sonder, .ls-pht .kb.neu { background: var(--accent-soft); color: var(--accent); }
.ls-facts { display: flex; gap: 22px; flex-wrap: wrap; }
.ls-facts span { display: grid; gap: 2px; }
.ls-facts small { font: 700 11px var(--font); letter-spacing: .07em; text-transform: uppercase; color: var(--ls-t2); }
.ls-facts b { font-size: 15px; }
.ls-facts b.big { font: 800 26px/1 var(--font); color: var(--ls-red); }
.ls-facts em { font-style: normal; font-size: 12px; color: var(--ls-t2); }
.ls-facts em.gut { color: var(--ls-green); }
.ls-facts em.schlecht { color: var(--ls-red); }
.ls-eintritt { display: flex; align-items: flex-end; gap: 8px; margin-top: 14px; }
.ls-eintritt label { display: grid; gap: 4px; font-size: 12px; font-weight: 650; color: var(--ls-t2); }
.ls-eintritt input { width: auto; padding: 7px 10px; }
.ls-disz li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: center; padding: 10px 4px; border-bottom: 1px solid var(--ls-line); }
.ls-disz li:last-child { border-bottom: 0; }
.ls-dn { display: grid; grid-template-columns: auto 1fr auto; gap: 0 8px; align-items: center; }
.ls-dn svg { color: var(--ls-red); }
.ls-dn b { font-size: 14px; }
.ls-dn small { grid-column: 2 / 4; font-size: 11.5px; color: var(--ls-t2); }
.ls-notes { display: inline-flex; gap: 4px; }
.ls-notes button { width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--ls-line); background: var(--ls-card); color: var(--ls-t2); font: 750 13px var(--font); cursor: pointer; transition: transform .15s, background .15s, color .15s; }
.ls-notes button:hover { transform: translateY(-2px); color: var(--ls-text); border-color: var(--ls-t2); }
.ls-notes button.on { color: #fff; border-color: transparent; transform: scale(1.08); animation: lsPop .3s cubic-bezier(.3,1.6,.5,1); }
.ls-notes .n1.on { background: #1f8a52; } .ls-notes .n2.on { background: #4aa564; } .ls-notes .n3.on { background: #b9a215; }
.ls-notes .n4.on { background: #d98319; } .ls-notes .n5.on { background: #d7262f; } .ls-notes .n6.on { background: #8e0f16; }
.ls-cmp { grid-column: 1 / -1; position: relative; display: block; }
.ls-disz > li > .ls-bar { grid-column: 1 / -1; }
.ls-tm { position: absolute; top: -3px; left: var(--x); width: 2px; height: 12px; border-radius: 2px; background: var(--ls-text); opacity: .55; }
.ls-new { margin-bottom: 12px; }
.ls-pm { display: flex; gap: 6px; margin-bottom: 8px; }
.ls-pm button { flex: 1; padding: 8px; border-radius: 10px; border: 1px solid var(--ls-line); background: var(--ls-card); color: var(--ls-t2); font: 700 13.5px var(--font); cursor: pointer; transition: all .18s; }
.ls-pm .plus.on { background: var(--ls-green); border-color: var(--ls-green); color: #fff; }
.ls-pm .minus.on { background: var(--ls-red); border-color: var(--ls-red); color: #fff; }
.ls-new .ls-row input { width: auto; }
.ls-tl li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-top: 1px solid var(--ls-line); }
.ls-tl li div { flex: 1; }
.ls-tl p { margin: 0 0 2px; font-size: 14px; line-height: 1.45; }
.ls-tl small { font-size: 12px; color: var(--ls-t2); }
.ls-tli { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font: 800 14px var(--font); font-style: normal; color: #fff; background: var(--ls-green); }
.ls-tl li.minus .ls-tli { background: var(--ls-red); }
.ls-uwl li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 12px; border-left: 3px solid var(--ls-green); background: var(--ls-fill); }
.ls-uwl li.bald { border-left-color: var(--ls-yellow); }
.ls-uwl li.faellig, .ls-uwl li.nie { border-left-color: var(--ls-red); }

/* ---------- Unterweisungen ---------- */
.ls-legend { margin: 0; display: flex; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--ls-t2); align-items: center; }
.ls-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; }
.ls-legend .ok, .ls-uwp.ok::before { background: var(--ls-green); }
.ls-legend .bald, .ls-uwp.bald::before { background: var(--ls-yellow); }
.ls-legend .faellig, .ls-uwp.faellig::before { background: var(--ls-red); }
.ls-legend .nie, .ls-uwp.nie::before { background: var(--ls-t2); }
.ls-uw { margin-bottom: 12px; }
.ls-uw h2 em.ls-ok { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--ls-green); color: #fff; }
.ls-recht { margin: -6px 0 10px; font-size: 12.5px; color: var(--ls-t2); }
.ls-uwg { display: flex; flex-wrap: wrap; gap: 6px; }
.ls-uwp { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 3px; border-radius: 99px; border: 1px solid var(--ls-line); background: var(--ls-card); color: var(--ls-text); font: 600 12.5px var(--font); cursor: pointer; transition: transform .15s, border-color .15s; }
.ls-uwp::before { content: ""; position: absolute; left: 22px; top: 2px; width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 0 2px var(--ls-card); }
.ls-uwp:hover { transform: translateY(-2px); border-color: var(--ls-red); }
.ls-uwp.faellig, .ls-uwp.nie { border-color: color-mix(in srgb, var(--ls-red) 45%, var(--ls-line)); }

/* ---------- Notizen ---------- */
.ls-compose { margin-bottom: 16px; display: grid; gap: 8px; }
.ls-chk { display: inline-flex; align-items: center; gap: 7px; margin-right: auto; font-size: 13.5px; color: var(--ls-t2); }
.ls-notes-l { columns: 2 320px; column-gap: 14px; }
.ls-note { break-inside: avoid; margin: 0 0 14px; padding: 14px 16px; border-radius: 18px; background: var(--ls-card); border: 1px solid var(--ls-line); animation: lsIn .45s var(--ease) both; animation-delay: calc(120ms + var(--j) * 40ms); }
.ls-note.wichtig { border-color: color-mix(in srgb, var(--ls-red) 50%, var(--ls-line)); box-shadow: 0 8px 22px var(--ls-glow); }
.ls-note.erledigt { opacity: .5; }
.ls-note.erledigt .ls-ntext { text-decoration: line-through; }
.ls-note header { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ls-note header span { flex: 1; display: grid; }
.ls-note header b { font-size: 15px; }
.ls-note header small { font-size: 12px; color: var(--ls-t2); }
.ls-ntext { margin: 0 0 10px; font-size: 14.5px; line-height: 1.55; }
.ls-note footer { display: flex; justify-content: space-between; align-items: center; }

/* ---------- Termine ---------- */
.ls-tfc { margin-bottom: 16px; animation: lsIn .4s var(--ease); }
.ls-arten { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.ls-r3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ls-mon { margin: 20px 0 8px; font: 800 13px var(--font) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--ls-red) !important; }
.ls-t { display: flex; gap: 14px; padding: 14px 16px; margin-bottom: 10px; border-radius: 18px; background: var(--ls-card); border: 1px solid var(--ls-line); animation: lsIn .45s var(--ease) both; animation-delay: calc(100ms + var(--j) * 35ms); }
.ls-t.vorbei { opacity: .6; }
.ls-t.abgesagt h3 { text-decoration: line-through; }
.ls-tb { flex: 1; min-width: 0; }
.ls-tb h3 { margin: 2px 0 4px; font-size: 17px; }
.ls-tk { display: flex; align-items: center; gap: 6px; margin: 0; font: 700 12px var(--font); color: var(--ls-red); text-transform: uppercase; letter-spacing: .05em; }
.ls-tk .ls-st { text-transform: none; letter-spacing: 0; margin-left: 4px; }
.ls-tm2 { display: flex; align-items: center; gap: 6px; margin: 0 0 3px; font-size: 13.5px; color: var(--ls-t2); }
.ls-tx { margin: 8px 0; font-size: 14px; line-height: 1.5; padding: 8px 12px; border-radius: 11px; background: var(--ls-fill); }
.ls-by { margin: 6px 0 0; font-size: 11.5px; color: var(--ls-t2); }
.ls-cal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 10px; }
.ls-calb { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 10px; border: 0; font: 650 12.5px var(--font); cursor: pointer; text-decoration: none; transition: transform .15s, filter .15s; }
.ls-calb:hover { transform: translateY(-1px); filter: brightness(1.08); }
.ls-calb.apple { background: var(--ls-text); color: var(--ls-bg) !important; }
.ls-calb.android { background: #3ddc84; color: #073b1e; }
.ls-abo { margin-top: 18px; }
.ls-abo p { margin: 0; font-size: 14px; color: var(--ls-t2); }
.ls-tl2 { min-height: 40px; }

/* ---------- Handy ---------- */
@media (max-width: 1020px) {
  .ls-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ls-grid, .ls-grid.two { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ls-top { flex-wrap: wrap; gap: 8px; padding-top: calc(8px + env(safe-area-inset-top)); }
  .ls-tabs { order: 3; flex-basis: 100%; }
  .ls-tabs a span { display: none; }
  .ls-tabs a.on span { display: inline; }
  .ls-tabs a.on::after { bottom: -9px; }
  .ls-tools { margin-left: auto; }
  .ls-exit span { display: none; }
  .ls-tools > .ava { display: none; }
  .ls-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ls-kpi:last-child { grid-column: 1 / -1; }
  .ls-hero { padding: 18px; }
  .ls-r3 { grid-template-columns: 1fr 1fr; }
  .ls-team { grid-template-columns: 1fr; }
  .ls-notes button { width: 27px; height: 28px; }
  .ls-disz li { grid-template-columns: 1fr; }
  .ls-ph { padding: 16px; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .ls *, .ls *::before, .ls *::after { animation: none !important; transition: none !important; }
}
.ls-msgs.kurz .ls-msg:nth-child(n+9) { display: none; }
.ls-more { width: 100%; margin-top: 8px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px; border: 1px dashed var(--ls-line); border-radius: 12px; background: none; color: var(--ls-red); font: 650 13.5px var(--font); cursor: pointer; }
.ls-more:hover { background: color-mix(in srgb, var(--ls-red) 8%, transparent); }