/* ============================================================
   LENARO SUITE — Shared Core CSS
   Marken-Design-System (Verlauf Sky→Blue→Indigo, slate, Montserrat+Inter)
   Geladen von ALLEN Apps. App-spezifisches Layout bleibt in der App.
   ============================================================ */
:root{
  --sky:#38bdf8;--blue:#2563eb;--indigo:#4338ca;--indigo-dark:#312e81;
  --n900:#0f172a;--n800:#1e293b;--n700:#334155;--n600:#475569;--n500:#64748b;--n400:#94a3b8;--n300:#cbd5e1;--n200:#e2e8f0;--n100:#f1f5f9;--n50:#f8fafc;
  --success:#16a34a;--error:#dc2626;--warn:#f59e0b;
  --grad:linear-gradient(120deg,#38bdf8 0%,#2563eb 50%,#4338ca 75%,#312e81 100%);
  --display:'Montserrat',sans-serif;--body:'Inter',sans-serif;--mono:'IBM Plex Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{font-family:var(--body);background:var(--n50);color:var(--n800);-webkit-font-smoothing:antialiased;line-height:1.5;overscroll-behavior-y:none}
button{font-family:inherit;cursor:pointer}

/* ── App-Shell ── */
.app{max-width:560px;margin:0 auto;min-height:100vh;background:var(--n50);display:flex;flex-direction:column}

/* ── Header (Verlauf, sticky) ── */
.hd{background:var(--grad);color:#fff;padding:calc(env(safe-area-inset-top) + 16px) 18px 16px;display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:20}
.hd .lg,.hd .clk{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex:none}
.hd .lg svg,.hd .clk svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2}
.hd h1{font-family:var(--display);font-weight:800;font-size:17px;letter-spacing:.01em;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hd .ico{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.18);border:none;color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.hd .ico svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.hd .me{margin-left:auto;width:36px;height:36px;border-radius:999px;background:rgba(255,255,255,.2);border:none;color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:14px;flex:none}

/* ── Content ── */
.main{flex:1;padding:16px 16px 40px}
.view{display:none;animation:lf .3s ease both}.view.show{display:block}
@keyframes lf{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lbl{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--n400);margin:18px 2px 9px}
.lbl:first-child{margin-top:4px}
.lbl.mt{margin-top:30px}
.card{background:#fff;border:1px solid var(--n200);border-radius:16px;padding:16px;margin-bottom:12px}
.empty{text-align:center;color:var(--n400);font-size:14px;padding:30px 16px}

/* ── Buttons ── */
.btn{border:none;border-radius:11px;padding:13px 18px;font-family:var(--display);font-weight:600;font-size:14.5px;color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%}
.btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
.btn-grad{background:var(--grad)}
.btn-prim{background:var(--blue)}
.btn-ghost{background:#fff;color:var(--blue);border:1.5px solid var(--n200)}
.actrow{display:flex;gap:9px}

/* ── Pills ── */
.pills{display:flex;flex-wrap:wrap;gap:7px}
.pill{border:1.5px solid var(--n200);background:#fff;color:var(--n600);border-radius:999px;padding:8px 13px;font-family:var(--display);font-weight:600;font-size:12.5px}
.pill.on{background:var(--blue);border-color:var(--blue);color:#fff}

/* ── Formularfelder ── */
.field{margin-bottom:11px}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--n700);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--n200);border-radius:10px;padding:12px 13px;font-family:var(--body);font-size:15px;color:var(--n900);outline:none;box-sizing:border-box}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* ── Modal / Bottom-Sheet ── */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:50;display:none;align-items:flex-end;justify-content:center}
.modal.show{display:flex}
.sheet{background:#fff;border-radius:20px 20px 0 0;width:100%;max-width:560px;max-height:90vh;overflow:auto;padding:20px 18px calc(env(safe-area-inset-bottom) + 20px)}
.sheet .mh{display:flex;align-items:center;margin-bottom:16px}
.sheet .mh h3{font-family:var(--display);font-weight:700;font-size:17px;color:var(--n900)}
.sheet .mh .cl{margin-left:auto;border:none;background:var(--n100);border-radius:8px;width:32px;height:32px;font-size:15px}

/* ── Auth-Gate (vom Core injiziert) ── */
#gate{position:fixed;inset:0;z-index:100;background:var(--grad);display:none;align-items:center;justify-content:center;padding:22px}
#gate.show{display:flex}
#gate .box{background:#fff;border-radius:20px;max-width:380px;width:100%;padding:34px 26px;text-align:center}
#gate .ic{width:62px;height:62px;border-radius:17px;background:var(--grad);margin:0 auto 16px;display:flex;align-items:center;justify-content:center}
#gate .ic svg{width:33px;height:33px;stroke:#fff;fill:none;stroke-width:2}
#gate h2{font-family:var(--display);font-weight:800;font-size:21px;color:var(--n900);margin-bottom:4px}
#gate p{font-size:13px;color:var(--n500);margin-bottom:22px}
#gate input{width:100%;border:1.5px solid var(--n200);border-radius:10px;padding:13px 14px;font-size:15px;outline:none;box-sizing:border-box;margin-bottom:12px;text-align:left}
#gate .err{color:var(--error);font-size:13px;min-height:18px;margin-top:8px}

/* ── Toast (vom Core injiziert) ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--n900);color:#fff;padding:12px 20px;border-radius:11px;font-size:13.5px;font-weight:500;opacity:0;pointer-events:none;transition:.25s;z-index:200;max-width:90%}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:#7f1d1d}
