/* PersonalCRM — mobile-first, jedna kolumna, bez CDN-ów i zewnętrznych fontów */
:root {
  --bg: #f6f6f4; --card: #fff; --ink: #17181a; --muted: #6b6f76; --line: #e2e3e6;
  --accent: #1a7f5a; --ok-bg: #e7f6ec; --ok-ink: #14532d; --err-bg: #fdeaea; --err-ink: #7f1d1d;
  --danger: #b42318;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #131416; --card: #1c1e21; --ink: #e9eaec; --muted: #9aa0a8; --line: #2c2f34;
    --accent: #3fbf8f; --ok-bg: #16301f; --ok-ink: #a7e0bb; --err-bg: #3a1c1c; --err-ink: #f4b1b1;
    --danger: #ff7b6b;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0 auto; padding: 16px 14px 48px; max-width: 720px; background: var(--bg); color: var(--ink);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-text-size-adjust: 100%;
}
body.center { display: flex; min-height: 100vh; align-items: center; justify-content: center; padding: 24px 14px; }
header { margin-bottom: 18px; }
h1 { font-size: 1.5rem; margin: 0; letter-spacing: -.02em; }
h2 { font-size: 1.05rem; margin: 0 0 12px; }
.sub { color: var(--muted); margin: 4px 0 0; font-size: .9rem; }
section, .card {
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  padding: 16px 14px; margin-bottom: 14px;
}
.card { max-width: 420px; width: 100%; text-align: center; margin: 0; }
.btn, button {
  display: block; width: 100%; padding: 13px 16px; margin-top: 12px; font: inherit; font-weight: 600;
  text-align: center; text-decoration: none; cursor: pointer; border: 0; border-radius: 9px;
  background: var(--accent); color: #fff;
}
.btn.ghost { background: transparent; border: 1px solid var(--line); color: var(--ink); }
button.danger { background: transparent; border: 1px solid var(--danger); color: var(--danger); }
.flash { padding: 12px 14px; border-radius: 10px; margin: 12px 0; font-size: .92rem; }
.flash.err, .status.err { background: var(--err-bg); color: var(--err-ink); }
.status { padding: 12px 14px; border-radius: 10px; font-size: .92rem; margin: 0 0 12px; }
.status.ok { background: var(--ok-bg); color: var(--ok-ink); }
.hint, .empty { color: var(--muted); font-size: .85rem; margin: 12px 0 0; }
ul.items { list-style: none; margin: 0; padding: 0; }
ul.items li { padding: 12px 0; border-top: 1px solid var(--line); }
ul.items li:first-child { border-top: 0; }
.name { font-weight: 600; word-break: break-word; }
.meta { color: var(--muted); font-size: .8rem; margin-top: 3px; word-break: break-word; }
.badge { padding: 2px 8px; border-radius: 999px; background: var(--line); font-size: .7rem; font-weight: 500; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8em; }
a { color: var(--accent); }