/* ── Reset & base ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #f9f9f8;
  --surface:   #ffffff;
  --border:    #e5e5e5;
  --text:      #1a1a1a;
  --muted:     #888888;
  --accent:    #2d6a4f;
  --accent-lt: #e8f5ee;
  --danger:    #c0392b;
  --radius:    16px;
  --radius-sm: 10px;
  --shadow:    0 2px 8px rgba(0,0,0,.07);
  --font:      -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  line-height: 1.5;
}

a { color: inherit; text-decoration: none; }

/* ── Layout ───────────────────────────────────────────────────────────────── */
.layout {
  display: flex;
  min-height: 100vh;
}

/* ── Sidebar ──────────────────────────────────────────────────────────────── */
.sidebar {
  width: 220px;
  min-width: 220px;
  background: #1a1a1a;
  display: flex;
  flex-direction: column;
  padding: 24px 0;
  position: fixed;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 200;
  overflow-y: auto;
}

.sidebar-logo {
  color: white;
  font-size: 1.3rem;
  font-weight: 700;
  padding: 0 20px 32px;
  letter-spacing: -0.02em;
}

.sidebar-nav {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 8px;
}

.sidebar-nav .nav-item {
  display: block;
  color: #aaa;
  text-decoration: none;
  padding: 8px 12px;
  font-size: 0.875rem;
  border-radius: 6px;
  margin: 1px 0;
  transition: background 0.1s, color 0.1s;
  white-space: nowrap;
}

.sidebar-nav .nav-item:hover {
  background: rgba(255,255,255,0.1);
  color: white;
}
.sidebar-nav .nav-item.active {
  background: rgba(82,183,136,0.15);
  color: #52b788;
}

.sidebar-footer {
  margin-top: auto;
  padding: 16px 20px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.sidebar-footer .nav-item {
  display: block;
  color: #888;
  text-decoration: none;
  padding: 8px 12px;
  font-size: 0.875rem;
  border-radius: 6px;
  margin: 1px 0;
  transition: background 0.1s, color 0.1s;
}

.sidebar-footer .nav-item:hover,
.sidebar-footer .nav-item.active {
  background: rgba(255,255,255,0.1);
  color: white;
}

.sidebar-footer > a:last-child {
  color: #666;
  font-size: 0.8rem;
  padding: 8px 12px;
  display: block;
  transition: color .1s;
}
.sidebar-footer > a:last-child:hover { color: #aaa; }

/* ── Main content ─────────────────────────────────────────────────────────── */
.main-content {
  margin-left: 220px;
  flex: 1;
  padding: 40px 48px 80px;
  max-width: 860px;
  min-height: 100vh;
}

/* ── Mobile header (hidden on desktop) ───────────────────────────────────── */
.mobile-header {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 52px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  z-index: 100;
}

.mobile-logo {
  font-size: 1rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: -.2px;
}

.mobile-header-actions { display: flex; gap: 8px; align-items: center; }
.mobile-header-actions a {
  font-size: .82rem;
  color: var(--muted);
  padding: 6px 10px;
  border-radius: var(--radius-sm);
}

/* ── Bottom nav (hidden on desktop) ──────────────────────────────────────── */
.bottom-nav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--surface);
  border-top: 1px solid var(--border);
  padding-bottom: env(safe-area-inset-bottom, 0);
  z-index: 100;
}

.bottom-nav-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 9px 4px;
  color: var(--muted);
  font-size: .65rem;
  font-weight: 500;
  transition: color .15s;
  -webkit-tap-highlight-color: transparent;
}
.bottom-nav-item .nav-icon { font-size: 1.3rem; line-height: 1; }
.bottom-nav-item:hover,
.bottom-nav-item.active { color: var(--accent); }

/* ── Mobile breakpoint ────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .sidebar       { display: none; }
  .main-content  { margin-left: 0; padding: 72px 20px 90px; max-width: 100%; }
  .mobile-header { display: flex; }
  .bottom-nav    { display: flex; }
}

/* ── Cards ────────────────────────────────────────────────────────────────── */
.card {
  background: var(--surface);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 20px 24px;
  box-shadow: var(--shadow);
}
.card + .card { margin-top: 12px; }

/* ── Dashboard grid ───────────────────────────────────────────────────────── */
.dash-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.dash-card {
  background: var(--surface);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-shadow: var(--shadow);
  transition: box-shadow .15s;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}
.dash-card:hover  { box-shadow: 0 2px 8px rgba(0,0,0,.1); }
.dash-card:active { opacity: .9; }

.dash-card .card-icon  { font-size: 1.6rem; line-height: 1; }
.dash-card .card-label {
  font-size: .7rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.dash-card .card-value {
  font-size: 1.7rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1;
}
.dash-card .card-sub { font-size: .75rem; color: var(--muted); }

/* ── Welcome ──────────────────────────────────────────────────────────────── */
.welcome { margin-bottom: 24px; }
.welcome h1 {
  font-size: 1.4rem;
  font-weight: 600;
  letter-spacing: -.3px;
}
.welcome p { font-size: .9rem; color: var(--muted); margin-top: 4px; }

/* ── Section heading ──────────────────────────────────────────────────────── */
.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.section-head h2 { font-size: 1rem; font-weight: 600; }

/* ── Login page ───────────────────────────────────────────────────────────── */
.login-wrap {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: var(--bg);
}
.login-box {
  width: 100%;
  max-width: 360px;
  background: var(--surface);
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 40px 32px;
  box-shadow: var(--shadow);
  text-align: center;
}
.login-box .brand {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: -.3px;
  margin-bottom: 6px;
}
.login-box .tagline {
  font-size: .85rem;
  color: var(--muted);
  margin-bottom: 32px;
}

/* ── Forms ────────────────────────────────────────────────────────────────── */
.form-group { text-align: left; margin-bottom: 16px; }

.form-group label {
  display: block;
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.form-group input,
.form-group textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.form-group input:focus,
.form-group textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(45,106,79,.1);
}

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.btn {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border: none;
  border-radius: var(--radius-sm);
  font-size: .9rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  transition: opacity .15s, box-shadow .15s;
  text-align: center;
}
.btn:active { opacity: .88; }

.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { opacity: .92; }

.btn-ghost {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--muted);
  margin-top: 12px;
}
.btn-ghost:hover { background: var(--bg); }

.btn-danger-text { color: var(--danger); border-color: #f5c6c2; }
.btn-danger-text:hover { background: #fdecea; }

.btn-outline-accent {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  background: var(--accent-lt);
  color: var(--accent);
  font-size: .9rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  margin-bottom: 12px;
  transition: background .15s;
  -webkit-tap-highlight-color: transparent;
  text-align: center;
}
.btn-outline-accent:hover { background: #d1ead9; }

.btn-sm {
  width: auto;
  padding: 7px 14px;
  font-size: .85rem;
  white-space: nowrap;
}

/* ── Error / flash ────────────────────────────────────────────────────────── */
.error-msg {
  background: #fdecea;
  color: var(--danger);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: .85rem;
  margin-bottom: 16px;
  text-align: left;
}

.flash {
  border-radius: var(--radius-sm);
  padding: 11px 14px;
  font-size: .875rem;
  margin-bottom: 16px;
}
.flash--error   { background: #fdecea; color: var(--danger); }
.flash--success { background: var(--accent-lt); color: var(--accent); }

/* ── Badges ───────────────────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: var(--border);
  color: var(--muted);
  font-size: .7rem;
  font-weight: 700;
}
.badge-warn { background: #fff3cd; color: #856404; }

/* ── Subhead ──────────────────────────────────────────────────────────────── */
.subhead {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 20px 0 10px;
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* ── Upload card ──────────────────────────────────────────────────────────── */
.upload-card { margin-bottom: 4px; }

.upload-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 24px 16px;
  border: 1.5px dashed var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  transition: border-color .2s, background .2s;
  -webkit-tap-highlight-color: transparent;
}
.upload-label:hover { border-color: var(--accent); background: var(--accent-lt); }

.upload-label--compact {
  flex-direction: row;
  padding: 10px 14px;
  gap: 8px;
  font-size: .88rem;
  justify-content: flex-start;
}
.upload-icon { font-size: 1.6rem; }
.upload-text { font-weight: 600; font-size: .92rem; }
.upload-sub  { font-size: .78rem; color: var(--muted); }

.file-ready {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0;
}
.file-ready-name {
  font-size: .85rem;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

.upload-loading {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  color: var(--muted);
  font-size: .88rem;
}
.spinner {
  width: 18px; height: 18px;
  border: 2px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin .7s linear infinite;
  flex-shrink: 0;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Empty state ──────────────────────────────────────────────────────────── */
.empty-state {
  text-align: center;
  padding: 48px 16px;
  color: var(--muted);
}
.empty-state .empty-icon { font-size: 2rem; margin-bottom: 12px; }
.empty-state p { font-size: .88rem; }

/* ── Document cards ───────────────────────────────────────────────────────── */
.doc-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 13px 16px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
  transition: box-shadow .12s;
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
  color: var(--text);
}
.doc-card:hover   { box-shadow: 0 2px 8px rgba(0,0,0,.09); }
.doc-card:active  { opacity: .9; }
.doc-card--pending { border-left: 3px solid #f0a500; }

.doc-icon  { font-size: 1.4rem; flex-shrink: 0; }
.doc-info  { flex: 1; min-width: 0; }
.doc-name  { font-size: .9rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-meta  { font-size: .74rem; color: var(--muted); margin-top: 2px; }
.doc-arrow { font-size: 1rem; color: var(--muted); flex-shrink: 0; }

.cat-tag {
  display: inline-block;
  background: var(--accent-lt);
  color: var(--accent);
  border-radius: 4px;
  padding: 1px 6px;
  font-size: .7rem;
  font-weight: 600;
}

/* ── Filter chips ─────────────────────────────────────────────────────────── */
.filter-chips {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 10px 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.filter-chips::-webkit-scrollbar { display: none; }

.chip {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: .8rem;
  font-weight: 500;
  color: var(--muted);
  white-space: nowrap;
  transition: background .15s, color .15s, border-color .15s;
  -webkit-tap-highlight-color: transparent;
}
.chip:hover   { border-color: var(--accent); color: var(--accent); }
.chip--active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ── Document confirm page ────────────────────────────────────────────────── */
.back-link { font-size: .85rem; color: var(--muted); font-weight: 500; }
.back-link:hover { color: var(--accent); }

.preview-card { overflow: hidden; padding: 0; }
.doc-preview-img {
  width: 100%;
  max-height: 320px;
  object-fit: contain;
  background: var(--bg);
  display: block;
  border-radius: var(--radius);
}
.pdf-open-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px;
  font-weight: 500;
  color: var(--accent);
}

.ai-card   { margin-top: 12px; }
.ai-header { margin-bottom: 16px; }
.ai-badge {
  display: inline-block;
  background: var(--accent-lt);
  color: var(--accent);
  border-radius: 4px;
  padding: 2px 8px;
  font-size: .75rem;
  font-weight: 600;
  margin-bottom: 6px;
}
.ai-reason { font-size: .83rem; color: var(--muted); line-height: 1.5; }

.form-select {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  transition: border-color .15s;
}
.form-select:focus { border-color: var(--accent); }

/* ── Document task cards ──────────────────────────────────────────────────── */
.tasks-section { margin-top: 12px; }
.tasks-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.tasks-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px; height: 20px;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--border);
  color: var(--muted);
  font-size: .7rem;
  font-weight: 700;
}

.task-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid #ccc;
  border-radius: var(--radius);
  padding: 14px 16px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
}
.task-text { font-size: .9rem; font-weight: 600; margin-bottom: 6px; line-height: 1.4; }
.task-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.task-due  { font-size: .75rem; color: var(--muted); }
.task-prio {
  font-size: .7rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  white-space: nowrap;
}
.task-prio--hoch    { background: #fde8e8; color: #9b1c1c; }
.task-prio--mittel  { background: #fef3c7; color: #92400e; }
.task-prio--niedrig { background: var(--accent-lt); color: var(--accent); }
.task-card--hoch    { border-left-color: #e74c3c; }
.task-card--mittel  { border-left-color: #f0a500; }
.task-card--niedrig { border-left-color: var(--accent); }
.task-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.task-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border-radius: var(--radius-sm);
  border: 1px solid;
  font-size: .82rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  transition: background .15s;
  -webkit-tap-highlight-color: transparent;
}
.task-btn--reminder { border-color: #d97706; color: #92400e; background: #fffbeb; }
.task-btn--reminder:hover { background: #fef3c7; }

/* ── Quick Update card ────────────────────────────────────────────────────── */
.quick-update-card { margin-bottom: 12px; }
.qu-label { font-size: .7rem; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 10px; }
.qu-textarea { min-height: 80px; margin-bottom: 12px; }
.qu-actions  { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qu-error    { font-size: .8rem; color: var(--danger); }

/* ── Project upload ───────────────────────────────────────────────────────── */
.proj-upload-card { margin-top: 12px; }
.proj-upload-head {
  font-size: .75rem; font-weight: 600; color: var(--muted);
  margin-bottom: 12px; text-transform: uppercase; letter-spacing: .05em;
}

/* ── Pending banner ───────────────────────────────────────────────────────── */
.pending-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fffbeb;
  border: 1px solid #d97706;
  border-radius: var(--radius);
  padding: 13px 16px;
  margin-top: 12px;
  color: #92400e;
  font-size: .88rem;
  -webkit-tap-highlight-color: transparent;
}
.pending-banner:hover { background: #fef3c7; }
.pending-banner-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #d97706;
  flex-shrink: 0;
}
.pending-banner-arrow { margin-left: auto; font-size: 1rem; }

/* ── Review cards ─────────────────────────────────────────────────────────── */
.review-intro { margin-bottom: 16px; }
.review-intro p { font-size: .85rem; color: var(--muted); margin-top: 6px; }

.review-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 20px;
  margin-bottom: 10px;
  box-shadow: var(--shadow);
}
.review-card--hoch    { border-left-color: #e74c3c; }
.review-card--mittel  { border-left-color: #f0a500; }
.review-card--niedrig { border-left-color: var(--accent); }

.review-prio-badge { display: inline-block; font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.prio-hoch    { color: #e74c3c; }
.prio-mittel  { color: #92400e; }
.prio-niedrig { color: var(--accent); }

.review-text { font-size: .95rem; font-weight: 600; line-height: 1.4; margin-bottom: 6px; }
.review-due  { font-size: .78rem; color: var(--muted); margin-bottom: 12px; }

.review-actions      { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.review-confirm-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

.prio-select {
  padding: 7px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  font-size: .83rem;
  font-weight: 600;
  font-family: var(--font);
  background: var(--surface);
  outline: none;
  cursor: pointer;
  transition: border-color .15s;
  appearance: none;
  -webkit-appearance: none;
}
.prio-select--hoch    { border-color: #e74c3c; color: #e74c3c; }
.prio-select--mittel  { border-color: #f0a500; color: #92400e; }
.prio-select--niedrig { border-color: var(--accent); color: var(--accent); }

.review-btn {
  padding: 7px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid;
  font-size: .83rem;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  transition: background .15s;
  -webkit-tap-highlight-color: transparent;
}
.review-btn--confirm { border-color: var(--accent); color: var(--accent); background: var(--accent-lt); }
.review-btn--confirm:hover { background: #d1ead9; }
.review-btn--dismiss { border-color: var(--border); color: var(--muted); background: var(--surface); }
.review-btn--dismiss:hover { background: #fdecea; border-color: #f5c6c2; color: var(--danger); }

/* ── Reminder cards ───────────────────────────────────────────────────────── */
.reminder-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: var(--radius);
  padding: 13px 14px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
}

.urgency-red    { border-left-color: #e74c3c; background: #fff8f8; }
.urgency-orange { border-left-color: #f0a500; background: #fffbeb; }
.urgency-green  { border-left-color: var(--accent); }
.urgency-gray   { border-left-color: var(--border); }

.done-btn {
  flex-shrink: 0;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1.5px solid var(--accent);
  background: transparent;
  color: var(--accent);
  font-size: .9rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
  -webkit-tap-highlight-color: transparent;
}
.done-btn:hover  { background: var(--accent); color: #fff; }
.done-btn:active { transform: scale(.92); }
.done-form       { flex-shrink: 0; }

.reminder-info  { flex: 1; min-width: 0; }
.reminder-title { font-size: .9rem; font-weight: 600; }
.reminder-meta  { font-size: .74rem; color: var(--muted); margin-top: 2px; }

.rec-badge {
  display: inline-block;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0 5px;
  font-size: .66rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .03px;
}

.del-form { flex-shrink: 0; }
.del-btn {
  width: 28px; height: 28px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--muted);
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
  -webkit-tap-highlight-color: transparent;
}
.del-btn:hover { background: #fdecea; color: var(--danger); }

/* Priority dot */
.rem-prio-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  margin-left: 5px;
  vertical-align: middle;
  flex-shrink: 0;
}
.prio-dot--hoch    { background: #e74c3c; }
.prio-dot--mittel  { background: #f0a500; }
.prio-dot--niedrig { background: var(--accent); }

/* ── Reminder detail / view card ──────────────────────────────────────────── */
.detail-textarea {
  width: 100%;
  min-height: 100px;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
  resize: vertical;
  transition: border-color .15s, box-shadow .15s;
  line-height: 1.5;
}
.detail-textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(45,106,79,.1);
}

.detail-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.detail-actions .btn { margin-bottom: 0; flex: 1; text-align: center; }

.rem-view-card  { padding: 20px 24px; }
.rem-view-title {
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
  margin-bottom: 10px;
}
.rem-view-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.rem-prio-badge {
  font-size: .7rem;
  font-weight: 600;
  padding: 2px 9px;
  border-radius: 20px;
  white-space: nowrap;
}
.rem-prio-badge--hoch    { background: #fde8e8; color: #9b1c1c; }
.rem-prio-badge--mittel  { background: #fef3c7; color: #92400e; }
.rem-prio-badge--niedrig { background: var(--accent-lt); color: var(--accent); }
.rem-meta-item  { font-size: .8rem; color: var(--muted); }
.rem-meta-done  { color: var(--accent); font-weight: 600; }
.rem-view-body {
  font-size: .88rem;
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.55;
  border-top: 1px solid var(--border);
  padding-top: 10px;
  margin-top: 6px;
}

/* ── Section head icon button ─────────────────────────────────────────────── */
.btn-icon {
  margin-left: auto;
  width: 30px; height: 30px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--accent);
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s;
  -webkit-tap-highlight-color: transparent;
}
.btn-icon:hover { background: var(--accent-lt); }

/* ── Form row ─────────────────────────────────────────────────────────────── */
.form-row { display: flex; gap: 12px; }
.form-group--half { flex: 1; }
.new-form-card { margin-bottom: 16px; }

/* ── Pill toggles ─────────────────────────────────────────────────────────── */
.pill-group { display: flex; gap: 6px; flex-wrap: wrap; }
.pill-opt   { cursor: pointer; }
.pill-opt input { display: none; }
.pill-opt span {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid var(--border);
  border-radius: 20px;
  font-size: .84rem;
  font-weight: 500;
  color: var(--muted);
  background: var(--surface);
  transition: border-color .15s, background .15s, color .15s;
  -webkit-tap-highlight-color: transparent;
}
.pill-opt:hover span,
.pill-opt--active span {
  border-color: var(--accent);
  background: var(--accent-lt);
  color: var(--accent);
}

/* ── Wellbeing ────────────────────────────────────────────────────────────── */
.mood-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px; height: 26px;
  border-radius: 50%;
  font-size: .78rem;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
}
.mood-1 { background: #e74c3c; }
.mood-2 { background: #e67e22; }
.mood-3 { background: #f0a500; }
.mood-4 { background: #27ae60; }
.mood-5 { background: #2d6a4f; }

.checkin-title { font-size: 1rem; font-weight: 600; margin-bottom: 20px; }

.wb-group { margin-bottom: 18px; }
.wb-group--half { flex: 1; }
.wb-label {
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 8px;
}
.wb-row { display: flex; gap: 16px; }
.wb-note-input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
  transition: border-color .15s;
}
.wb-note-input:focus { border-color: var(--accent); }

.mood-pick { display: flex; gap: 8px; }
.mood-pick-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 10px 4px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  font-size: 1.3rem;
  cursor: pointer;
  transition: border-color .15s, background .15s, transform .1s;
  -webkit-tap-highlight-color: transparent;
}
.mood-pick-btn span { font-size: .68rem; font-weight: 600; color: var(--muted); }
.mood-pick-btn:active { transform: scale(.94); }
.mood-pick-btn.selected { border-color: var(--accent); background: var(--accent-lt); }
.mood-pick-btn.selected span { color: var(--accent); }

.checkin-done-row  { display: flex; align-items: center; justify-content: space-between; }
.checkin-done-label{ font-size: .88rem; font-weight: 600; }
.checkin-done-meta { font-size: .8rem; color: var(--muted); margin-top: 6px; }

.wb-history-head {
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin: 20px 0 8px;
}
.wb-history { padding: 4px 16px; }
.wb-row-hist {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.wb-row-hist:last-child { border-bottom: none; }
.wb-hist-date  { font-size: .8rem; font-weight: 600; color: var(--muted); min-width: 36px; }
.wb-hist-icons { font-size: .95rem; min-width: 20px; text-align: center; }
.wb-hist-note  { font-size: .78rem; color: var(--muted); flex: 1; }

.low-mood-card  { border-left: 3px solid #f0a500; background: #fffbeb; margin-bottom: 12px; }
.low-mood-label { font-size: .75rem; font-weight: 600; color: #92400e; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; }
.low-mood-text  { font-size: .9rem; color: var(--text); margin-bottom: 12px; line-height: 1.5; }
.reflect-input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #f0a500;
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
}
.reflect-input:focus { border-color: var(--accent); }

.suggestion-card  { border-left: 3px solid var(--accent); background: var(--accent-lt); margin-bottom: 12px; }
.suggestion-label { font-size: .75rem; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; }
.suggestion-text  { font-size: .9rem; color: var(--text); line-height: 1.6; }

/* ── Project cards ────────────────────────────────────────────────────────── */
.proj-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 14px 16px 18px;
  margin-bottom: 8px;
  box-shadow: var(--shadow);
  transition: box-shadow .12s;
  -webkit-tap-highlight-color: transparent;
  color: var(--text);
  text-decoration: none;
}
.proj-card:hover  { box-shadow: 0 2px 8px rgba(0,0,0,.09); }
.proj-card:active { opacity: .9; }
.proj-card--stuck  { border-left: 3px solid #e74c3c; }
.proj-card--wartet { border-left: 3px solid #f0a500; }
.proj-card--läuft  { border-left: 3px solid var(--accent); }

.proj-body     { flex: 1; min-width: 0; }
.proj-name-row { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: wrap; }
.proj-name     { font-size: 1rem; font-weight: 600; line-height: 1.25; }
.proj-arrow    { font-size: 1.1rem; color: var(--muted); flex-shrink: 0; }

.proj-badge {
  font-size: .66rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}
.proj-badge--läuft  { background: var(--accent-lt); color: var(--accent); }
.proj-badge--wartet { background: #fef3c7; color: #92400e; }
.proj-badge--stuck  { background: #fde8e8; color: #9b1c1c; }

.proj-next {
  font-size: .82rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 2px;
}
.proj-stale-hint { color: #92400e; font-size: .75rem; margin-top: 3px; }

.stale-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #f0a500;
  margin-left: 6px;
  vertical-align: middle;
}

.proj-brake-card    { border-left: 3px solid #f0a500; background: #fffbeb; margin-bottom: 8px; }
.proj-brake-icon    { font-size: 1.3rem; margin-bottom: 8px; }
.proj-brake-text    { font-size: .88rem; line-height: 1.5; margin-bottom: 12px; }
.proj-brake-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.label-hint {
  font-size: .72rem;
  color: var(--accent);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 6px;
}

/* ── Milestone card ───────────────────────────────────────────────────────── */
.ms-card     { margin-top: 12px; padding: 18px 20px; }
.ms-header   { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.ms-title    { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.ms-progress { font-size: .82rem; font-weight: 600; color: var(--accent); }

.ms-bar-wrap {
  height: 4px;
  background: var(--border);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 14px;
}
.ms-bar {
  height: 100%;
  background: var(--accent);
  border-radius: 2px;
  transition: width .3s ease;
}

.ms-list  { display: flex; flex-direction: column; gap: 2px; }
.ms-item  {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border: none;
  background: none;
  cursor: pointer;
  text-align: left;
  width: 100%;
  border-bottom: 1px solid var(--border);
  font-family: var(--font);
}
.ms-item:last-child { border-bottom: none; }

.ms-check {
  width: 20px; height: 20px;
  border-radius: 4px;
  border: 1.5px solid var(--border);
  background: transparent;
  display: flex; align-items: center; justify-content: center;
  font-size: .78rem;
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
  flex-shrink: 0;
  transition: background .15s, border-color .15s;
  -webkit-tap-highlight-color: transparent;
}
.ms-check--done { background: var(--accent); border-color: var(--accent); color: #fff; }
.ms-text        { font-size: .88rem; line-height: 1.4; flex: 1; color: var(--text); }
.ms-text--done  { text-decoration: line-through; color: var(--muted); }

/* Milestone review */
.ms-review-card  { padding: 16px 20px; }
.ms-review-num   { font-size: .75rem; font-weight: 600; color: var(--muted); margin-bottom: 8px; }
.ms-review-form  { width: 100%; }
.ms-rename-input {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .92rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
}
.ms-rename-input:focus { border-color: var(--accent); }

/* Weekly checkin */
.weekly-card     { border-left: 3px solid var(--accent); margin-bottom: 20px; }
.weekly-label    { font-size: .75rem; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.weekly-question { font-size: .95rem; font-weight: 600; margin-bottom: 12px; line-height: 1.4; }
.weekly-textarea { min-height: 80px; }

/* ── Date input ───────────────────────────────────────────────────────────── */
input[type=date] {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .95rem;
  font-family: var(--font);
  background: var(--surface);
  color: var(--text);
  outline: none;
  transition: border-color .15s;
  -webkit-appearance: none;
}
input[type=date]:focus { border-color: var(--accent); }

/* ── Project detail page ─────────────────────────────────────────────────── */
.pd-header {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
  padding: 2px 0 0;
}
.pd-title {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--text);
  margin: 0;
  flex: 1;
  line-height: 1.25;
}
.pd-status-badge {
  font-size: .68rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 4px;
  letter-spacing: .02em;
}
.pd-status-badge--läuft  { background: var(--accent-lt); color: var(--accent); }
.pd-status-badge--wartet { background: #fef3c7; color: #92400e; }
.pd-status-badge--stuck  { background: #fde8e8; color: #9b1c1c; }

.pd-fields-card { padding: 0; overflow: hidden; }
.pd-field {
  padding: 16px 20px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .1s;
}
.pd-field:hover  { background: #fafafa; }
.pd-field:active { background: #f5f5f5; }
.pd-field-label {
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--muted);
  margin-bottom: 5px;
}
.pd-field-text {
  font-size: .92rem;
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.55;
  min-height: 20px;
}
.pd-field-empty { color: #bbb; font-style: italic; font-size: .85rem; }
.pd-field-edit  { padding-top: 4px; }
.pd-field-textarea { cursor: text; }
.pd-field-actions { display: flex; gap: 8px; margin-top: 10px; }
.pd-divider { height: 1px; background: var(--border); margin: 0 20px; }

.pd-docs-card { padding: 0; overflow: hidden; }
.pd-docs-head {
  font-size: .75rem; font-weight: 600; color: var(--muted);
  text-transform: uppercase; letter-spacing: .05em; padding: 14px 20px 8px;
}
.pd-doc-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-top: 1px solid var(--border);
  text-decoration: none;
  color: var(--text);
  -webkit-tap-highlight-color: transparent;
}
.pd-doc-item:hover  { background: #fafafa; }
.pd-doc-icon  { font-size: .95rem; flex-shrink: 0; }
.pd-doc-name  { flex: 1; font-size: .88rem; }
.pd-doc-arrow { color: var(--muted); font-size: 1rem; }

.pd-actions { display: flex; gap: 10px; margin-top: 8px; padding-bottom: 16px; }
.pd-actions .btn { flex: 1; text-align: center; }

/* ── Morgen-Briefing (index) ──────────────────────────────────────────────── */
.briefing-greeting {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 32px;
  letter-spacing: -0.02em;
  color: var(--text);
}

.briefing-block {
  margin-bottom: 36px;
}
.briefing-block--mood { margin-bottom: 16px; }

.briefing-label {
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
  margin-bottom: 12px;
  margin-top: 4px;
}
.briefing-sublabel {
  font-size: .68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--muted);
  margin: 14px 0 6px;
  opacity: .7;
}

.briefing-ok   { font-size: .9rem; color: #38a169; margin: 0; font-weight: 500; }
.briefing-muted { font-size: .88rem; color: var(--muted); margin: 0; }
.briefing-link  { color: var(--accent); text-decoration: none; }
.briefing-link:hover { text-decoration: underline; }

/* reminder list */
.rem-list       { list-style: none; margin: 0; padding: 0; }

.rem-row { margin-bottom: 6px; }
.rem-row-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border);
  transition: background .12s, box-shadow .12s;
  box-shadow: var(--shadow);
}
.rem-row-link:hover { background: #f5f5f3; box-shadow: 0 3px 10px rgba(0,0,0,.09); }

.rem-row--overdue .rem-row-link { border-left: 4px solid #e53e3e; background: #fff8f8; }
.rem-row--soon    .rem-row-link { border-left: 4px solid #f0a500; background: #fffdf0; }
.rem-row--week    .rem-row-link { border-left: 4px solid #38a169; background: #f2fbf5; }

/* undated: rendered inside <details>, dimmed */
.rem-list--undated .rem-row-link {
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 5px 4px;
  opacity: .55;
  font-size: .82rem;
}
.rem-list--undated .rem-row-link:hover { opacity: .8; background: transparent; box-shadow: none; }

.rem-row-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
  background: var(--border);
}
.rem-dot--overdue { background: #e53e3e; }
.rem-dot--soon    { background: #f0a500; }
.rem-dot--week    { background: #38a169; }
.rem-dot--none    { background: var(--border); }

.rem-row-title { flex: 1; font-size: .88rem; }
.rem-row-date  { font-size: .76rem; color: var(--muted); white-space: nowrap; flex-shrink: 0; }

/* undated details/summary */
.undated-details { margin-top: 8px; }
.undated-details summary {
  font-size: .75rem; color: var(--muted); cursor: pointer; list-style: none;
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 0; user-select: none;
}
.undated-details summary::-webkit-details-marker { display: none; }
.undated-details summary::before { content: '▶'; font-size: .6rem; transition: transform .15s; }
.undated-details[open] summary::before { transform: rotate(90deg); }

/* project cards */
.bp-card {
  display: block;
  padding: 18px 20px;
  margin-bottom: 8px;
  border-radius: var(--radius);
  background: var(--surface);
  border: 1px solid var(--border);
  text-decoration: none;
  color: var(--text);
  box-shadow: var(--shadow);
  transition: box-shadow .15s, transform .15s;
}
.bp-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  transform: translateY(-1px);
}
.bp-card-top   { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px; }
.bp-title      { font-size: .95rem; font-weight: 600; flex: 1; }
.bp-next       {
  font-size: .82rem; color: var(--muted); margin-top: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.bp-inactive   { font-size: .75rem; color: #c05621; margin-top: 4px; }

/* mood dots */
.mood-dots {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  flex-wrap: wrap;
}
.mood-dot-col  { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.mood-dot      { width: 20px; height: 20px; border-radius: 50%; background: var(--border); }
.mood-dot--1   { background: #fc8181; }
.mood-dot--2   { background: #f6ad55; }
.mood-dot--3   { background: #fbd38d; }
.mood-dot--4   { background: #68d391; }
.mood-dot--5   { background: #38a169; }
.mood-dot-day  { font-size: .62rem; color: var(--muted); }

/* ── Wochen-Score ──────────────────────────────────────────────────────────── */
.score-block     { margin-bottom: 28px; }
.score-row       { display: flex; align-items: baseline; gap: 14px; margin-bottom: 10px; }
.score-number    { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.score-level     { font-size: .88rem; color: var(--muted); }
.score-bar-wrap  { height: 8px; background: var(--border); border-radius: 4px; margin-bottom: 10px; }
.score-bar       { height: 8px; background: linear-gradient(90deg, #2d6a4f, #52b788);
                   border-radius: 4px; transition: width .5s ease; }
.score-breakdown { display: flex; flex-wrap: wrap; gap: 6px; }
.score-chip      { font-size: .75rem; font-weight: 600; padding: 3px 10px;
                   background: var(--accent-lt); color: var(--accent); border-radius: 20px; }

/* ── Fitness ───────────────────────────────────────────────────────────────── */

/* overview – next workout card */
.fit-next-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 10px;
}
.fit-next-top   { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.fit-next-label { font-size: 1rem; font-weight: 600; flex: 1; }
.fit-next-focus { font-size: .82rem; color: var(--muted); margin-bottom: 12px; }

.fit-tag           { font-size: .7rem; font-weight: 600; padding: 2px 8px;
                     border-radius: 20px; text-transform: uppercase; letter-spacing: .04em; }
.fit-tag--pflicht  { background: #ebf8f0; color: #276749; }
.fit-tag--bonus    { background: #ebf4ff; color: #2b6cb0; }

.fit-ex-preview     { list-style: none; padding: 0; margin: 0 0 14px; }
.fit-ex-preview li  { display: flex; justify-content: space-between; align-items: center;
                       padding: 5px 0; border-bottom: 1px solid var(--border); font-size: .85rem; }
.fit-ex-preview li:last-child { border-bottom: none; }
.fit-ex-name  { flex: 1; }
.fit-ex-meta  { font-size: .78rem; color: var(--muted); white-space: nowrap; }

.fit-done-note    { font-size: .85rem; color: #38a169; font-weight: 500; margin: 0; }
.fit-resume-hint  { font-size: .85rem; color: var(--muted); align-self: center; }

.fit-start-form  { margin-top: 8px; }
.fit-start-row   { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.fit-loc-label   { font-size: .88rem; display: flex; align-items: center; gap: 5px;
                   cursor: pointer; user-select: none; }

.fit-hint       { font-size: .8rem; color: #38a169; margin: 6px 0 0;
                  background: #f0fff4; padding: 6px 10px; border-radius: 6px; }

.fit-other-days { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

/* history */
.fit-history-list { list-style: none; padding: 0; margin: 0; }
.fit-history-row  {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--border); font-size: .85rem;
}
.fit-history-row:last-child { border-bottom: none; }
.fit-history-date { color: var(--muted); font-size: .78rem; min-width: 90px; }
.fit-history-type { flex: 1; font-weight: 500; }
.fit-history-meta { color: var(--muted); font-size: .78rem; white-space: nowrap; }

/* body weight */
.fit-bw-current { font-size: .9rem; margin-bottom: 8px; }
.fit-bw-diff         { font-size: .78rem; font-weight: 600; margin-left: 6px; }
.fit-bw-diff--over   { color: #c05621; }
.fit-bw-diff--under  { color: #2b6cb0; }
.fit-bw-diff--hit    { color: #38a169; }
.fit-bw-list    { list-style: none; padding: 0; margin: 0 0 12px;
                  font-size: .82rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px 18px; }
.fit-bw-form    { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.fit-bw-date    { font-size: .85rem; padding: 7px 10px; border: 1px solid var(--border);
                  border-radius: var(--radius-sm); background: var(--surface); color: var(--text); }
.fit-bw-input   { width: 90px; padding: 7px 10px; font-size: .9rem;
                  border: 1px solid var(--border); border-radius: var(--radius-sm);
                  background: var(--surface); color: var(--text); }

/* session page */
.fit-sess-header  { margin-bottom: 16px; }
.fit-sess-title   { font-size: 1.2rem; font-weight: 700; }
.fit-sess-focus   { font-size: .83rem; color: var(--muted); }

.fit-loc-toggle   { display: flex; gap: 8px; margin-bottom: 20px; }
.fit-loc-btn      { padding: 7px 16px; border-radius: 20px; font-size: .85rem;
                    border: 1px solid var(--border); background: var(--surface);
                    color: var(--muted); text-decoration: none; transition: all .12s; }
.fit-loc-btn--active { background: var(--accent); color: #fff; border-color: var(--accent); }

.fit-ex-block {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 14px 10px;
  margin-bottom: 12px;
}
.fit-ex-block-header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 2px; }
.fit-ex-block-name   { font-size: .95rem; font-weight: 600; flex: 1; }
.fit-ex-block-target { font-size: .8rem; color: var(--muted); white-space: nowrap; }
.fit-ex-block-note   { font-size: .76rem; color: var(--muted); margin-bottom: 8px; }
.fit-suggestion      { font-size: .78rem; color: #276749; background: #ebf8f0;
                       border-radius: 6px; padding: 4px 8px; margin-bottom: 8px; }

.fit-sets-head {
  display: flex; align-items: center; gap: 8px;
  font-size: .7rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: var(--muted);
  padding: 4px 0 4px; border-bottom: 1px solid var(--border); margin-bottom: 4px;
}
.fit-set-row {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 0; border-bottom: 1px solid #f0f0f0; transition: opacity .2s;
}
.fit-set-row:last-child     { border-bottom: none; }
.fit-set-row--done          { opacity: .45; }

.fit-sets-col--nr    { width: 20px; text-align: center; font-size: .8rem; color: var(--muted); flex-shrink: 0; }
.fit-sets-col--weight { flex: 1; }
.fit-sets-col--reps   { flex: 1; }
.fit-sets-col--done   { width: 32px; display: flex; justify-content: center; flex-shrink: 0; }

.fit-input {
  width: 100%; padding: 6px 8px; font-size: .88rem;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--bg); color: var(--text);
}
.fit-input:focus { outline: none; border-color: var(--accent); background: var(--surface); }

.fit-done-check { width: 18px; height: 18px; cursor: pointer; accent-color: var(--accent); }

.fit-sess-footer { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); }

/* ── Bewerbungen ───────────────────────────────────────────────────────────── */
.jobs-group { margin-bottom: 24px; }

.job-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 4px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.job-card--offen     { border-left-color: #cbd5e0; }
.job-card--gesendet  { border-left-color: #4299e1; }
.job-card--interview { border-left-color: #ed8936; }
.job-card--absage    { border-left-color: #e53e3e; }
.job-card--angebot   { border-left-color: #38a169; }

.job-card-top  { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 4px; }
.job-info      { flex: 1; }
.job-company   { font-size: .95rem; font-weight: 600; display: block; }
.job-role      { font-size: .8rem; color: var(--muted); }
.job-meta      { font-size: .78rem; color: var(--muted); margin-top: 3px; }
.job-notes     { font-size: .82rem; color: var(--text); margin-top: 5px;
                 background: var(--bg); padding: 6px 8px; border-radius: 5px; }

.job-badge             { font-size: .68rem; font-weight: 600; padding: 2px 8px;
                         border-radius: 20px; text-transform: uppercase;
                         letter-spacing: .04em; white-space: nowrap; flex-shrink: 0; }
.job-badge--offen      { background: #edf2f7; color: #4a5568; }
.job-badge--gesendet   { background: #ebf8ff; color: #2b6cb0; }
.job-badge--interview  { background: #fffaf0; color: #c05621; }
.job-badge--absage     { background: #fff5f5; color: #c53030; }
.job-badge--angebot    { background: #f0fff4; color: #276749; }

.job-actions {
  display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap;
}
.job-status-select { font-size: .82rem; padding: 5px 8px; max-width: 160px; }

/* ── Arbeitszeit ───────────────────────────────────────────────────────────── */

/* home hint */
.shift-hint {
  font-size: .82rem; margin-bottom: 10px; margin-top: -4px;
  padding: 6px 10px; background: #fffbeb; border-left: 3px solid #f0a500;
  border-radius: var(--radius-sm);
}
.shift-hint a { color: #c07800; text-decoration: none; }
.shift-hint a:hover { text-decoration: underline; }

/* today card */
.az-today-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 14px 16px; box-shadow: var(--shadow);
}
.az-today-sched { font-size: .88rem; color: var(--muted); margin-bottom: 10px; }
.az-today-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.az-today-done {
  font-size: .9rem; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 0;
}
.az-ok   { color: #38a169; font-weight: 700; font-size: 1rem; }
.az-note { color: var(--muted); font-size: .82rem; }

.az-del-btn {
  background: none; border: none; cursor: pointer; color: var(--muted);
  font-size: .75rem; padding: 1px 5px; border-radius: 4px; transition: color .1s, background .1s;
}
.az-del-btn:hover { color: var(--danger); background: #fff0f0; }

/* missing list */
.az-missing-list { list-style: none; padding: 0; margin: 0; }
.az-missing-row  {
  display: flex; align-items: center; gap: 10px; justify-content: space-between;
  padding: 7px 0; border-bottom: 1px solid var(--border); font-size: .85rem;
}
.az-missing-row:last-child { border-bottom: none; }
.az-missing-date { flex: 1; color: var(--text); }

/* week table */
.az-table {
  width: 100%; border-collapse: collapse; font-size: .88rem;
}
.az-table th {
  font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
  color: var(--muted); padding: 0 8px 8px 0; text-align: left;
}
.az-table th.az-num { text-align: right; }
.az-table td { padding: 8px 8px 8px 0; border-bottom: 1px solid var(--border); vertical-align: middle; }
.az-table tbody tr:last-child td { border-bottom: none; }
.az-table tfoot td { padding-top: 10px; border-top: 2px solid var(--border); }

.az-row--today td  { background: #f8fffe; font-weight: 500; }
.az-row--future td { opacity: .45; }

.az-num    { text-align: right; white-space: nowrap; }
.az-muted  { color: var(--muted); }
.az-pos    { color: #2d6a4f; font-weight: 600; }
.az-neg    { color: #c0392b; font-weight: 600; }

.az-wd      { font-weight: 500; margin-right: 4px; }
.az-date-sm { font-size: .75rem; color: var(--muted); }
.az-type-badge {
  font-size: .68rem; font-weight: 600; text-transform: uppercase;
  padding: 1px 6px; border-radius: 20px; background: var(--accent-lt);
  color: var(--accent); margin-left: 4px;
}
.az-total-row td { background: var(--bg); }

/* month summary */
.az-month-summary { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.az-month-diff    { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.az-month-sub     { font-size: .83rem; color: var(--muted); }

/* month list */
.az-month-list { list-style: none; padding: 0; margin: 0; }
.az-month-row  {
  display: flex; align-items: center; gap: 8px; padding: 7px 0;
  border-bottom: 1px solid var(--border); font-size: .85rem;
}
.az-month-row:last-child { border-bottom: none; }
.az-month-date { color: var(--muted); min-width: 88px; font-size: .78rem; }
.az-month-type { flex: 1; }
.az-month-ist  { font-weight: 600; white-space: nowrap; }

.az-feiertag-badge {
  font-size: .72rem;
  color: #7b5e00;
  background: #fff3cd;
  border-radius: 6px;
  padding: 1px 6px;
  margin-left: 4px;
  font-weight: 500;
}
.az-tausch-pair {
  font-size: .72rem;
  color: #b07d00;
  background: #fff8e1;
  border-radius: 6px;
  padding: 1px 6px;
  margin-left: 4px;
  font-weight: 500;
}
.az-tausch-box {
  background: #f8f4ff;
  border: 1px solid #d4c5f5;
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-top: 8px;
}

/* ── Profile page ─────────────────────────────────────────────────────────── */
.profile-intro { font-size: .85rem; color: var(--muted); margin-bottom: 16px; line-height: 1.5; }