*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--color-text); text-decoration: none; }
a:hover { opacity: 0.85; }

h1, h2, h3 { margin: 0 0 var(--space-md); font-weight: 500; letter-spacing: -0.02em; }
h1 { font-size: 2rem; }
h2 { font-size: 1.25rem; color: var(--color-text-muted); font-weight: 400; }

.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
.app-shell:has(.plan-page),
.app-shell:has(.tasks-page) {
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}
.app-main { flex: 1; max-width: 1100px; width: 100%; margin: 0 auto; padding: var(--space-xl) var(--space-lg); min-height: 0; }
.app-main:has(.tasks-page) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.app-main:has(.tasks-page) > .tasks-page {
  flex: 1;
  min-height: 0;
}
/* Arbeitsbereiche (Seiten mit Sektions-/Workspace-Navigation) einheitlich in voller Breite,
   Padding an die obere App-Navigation angeglichen – so springt die untere Navbar beim Tab-Wechsel nicht. */
.app-main:has(.tasks-page),
.app-main:has(.plan-page),
.app-main:has(.resources-page),
.app-main:has(.my-plan),
.app-main:has(.projects-page),
.app-main:has(.project-hub-page),
.app-main:has(.up-next),
.app-main:has(.timesheet-page),
.app-main:has(.swipe-page) {
  max-width: none;
  padding-top: var(--space-md);
  padding-inline: var(--space-lg);
}
.app-main:has(.plan-page),
.app-main:has(.resources-page) { padding-bottom: var(--space-sm); }
.app-main:has(.account-page) { max-width: 1200px; }

/* Portfolio-/Listen-Seiten: volle Arbeitsbreite innerhalb app-main, nicht links kleben. */
.page-frame {
  width: 100%;
  margin-inline: auto;
}

.app-nav {
  height: var(--nav-height);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  padding: 0 var(--space-lg);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg);
  position: sticky;
  top: 0;
  /* Über Seiteninhalt (sticky overlap), unter Modals/Tour (>= 1000) und User-Menü-Portal (1100). */
  z-index: 400;
  overflow: visible;
}

.app-nav__start {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: center;
  gap: var(--space-md);
  min-width: 0;
  overflow: visible;
  justify-self: start;
  position: relative;
  z-index: 2;
}
.app-nav__brand { font-weight: 600; font-size: 0.95rem; letter-spacing: -0.03em; white-space: nowrap; flex-shrink: 0; }
.app-nav__brand--logo { display: inline-flex; align-items: center; line-height: 0; }
.app-nav__brand-logo {
  max-height: calc(var(--nav-height) - 20px);
  max-width: 140px;
  object-fit: contain;
  display: block;
}
.app-nav__toggle { display: none; }
.app-nav__backdrop { display: none; }
.app-nav__menu { display: contents; }
.app-nav__links {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  display: flex;
  gap: var(--space-lg);
  align-items: center;
}
.app-nav__link { color: var(--color-text-muted); font-size: 0.875rem; transition: color 0.15s; white-space: nowrap; }
.app-nav__link:hover, .app-nav__link.active { color: var(--color-text); opacity: 1; }
/* Actions + Account teilen Spalte 3 in derselben Zeile (überlappend mit Padding),
   damit die Nav-Links in Spalte 2 zentriert bleiben. */
.app-nav__actions {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  display: flex;
  gap: var(--space-sm);
  align-items: center;
  min-width: 0;
  margin-right: calc(2rem + var(--space-sm));
}
.app-nav__account {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
}
.app-nav__start .org-switcher {
  flex-shrink: 1;
  min-width: 0;
}
.app-nav__start .org-switcher__trigger {
  max-width: 10rem;
}

.app-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
}

.app-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  padding: 0.5rem 1rem;
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  font-family: inherit;
  cursor: pointer;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  transition: border-color 0.15s, background 0.15s;
}
.app-btn:hover:not(:disabled) { border-color: var(--color-border-hover); background: var(--color-surface-2); }
.app-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.app-btn--primary { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); }
.app-btn--primary:hover:not(:disabled) { opacity: 0.9; background: var(--color-accent); }
.app-btn--danger { border-color: var(--color-danger); color: var(--color-danger); }
.app-btn--link { border: none; padding: 0; color: var(--color-text-muted); }
.app-btn--link:hover { color: var(--color-text); background: none; }

.milestone-panel-btn {
  padding: 0.35rem 0.7rem;
  font-size: 0.75rem;
  line-height: 1.2;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
}
.milestone-panel-btn:hover:not(:disabled) {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
}
.milestone-panel-btn--danger {
  border-color: color-mix(in srgb, var(--color-danger) 50%, var(--color-border));
  color: var(--color-danger);
}
.milestone-panel-btn--danger:hover:not(:disabled) {
  background: color-mix(in srgb, var(--color-danger) 8%, var(--color-surface-2));
  border-color: color-mix(in srgb, var(--color-danger) 65%, var(--color-border));
}

.app-input, .app-textarea, .app-select {
  width: 100%;
  padding: 0.625rem 0.75rem;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.875rem;
}
.app-input:focus, .app-textarea:focus, .app-select:focus {
  outline: none;
  border-color: var(--color-border-hover);
}
.app-label { display: block; font-size: 0.75rem; color: var(--color-text-muted); margin-bottom: var(--space-xs); text-transform: uppercase; letter-spacing: 0.05em; }

.app-badge {
  display: inline-flex;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  font-size: 0.7rem;
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
}
.app-badge--running { border-color: var(--color-success); color: var(--color-success); }

.project-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }

.project-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  cursor: pointer;
  font-size: 0.875rem;
  transition: border-color 0.15s, background 0.15s;
  font-family: inherit;
  color: var(--color-text);
}
.project-chip:hover { border-color: var(--color-border-hover); background: var(--color-surface-2); }
.project-chip.active { border-color: var(--color-text-muted); }

.project-timer-chip { display: block; }

.context-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
}
.context-menu-backdrop--compact-panel {
  background: transparent;
  top: 84px;
  right: 0;
  bottom: 0;
  left: 0;
}
.context-menu-backdrop--org-menu {
  background: transparent;
  top: 32px;
  right: 0;
  bottom: 0;
  left: 0;
}
html.widget-desktop .widget-compact--menu-open {
  position: relative;
  z-index: 1002;
}
.context-menu {
  position: fixed;
  z-index: 1001;
  min-width: 180px;
  max-width: 280px;
  max-height: 240px;
  overflow-y: auto;
  padding: var(--space-xs);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
.gantt-create-menu {
  max-height: none;
  overflow: visible;
  min-width: 220px;
}
.gantt-create-menu__body {
  padding: var(--space-sm);
}
.context-menu--picker {
  display: flex;
  flex-direction: column;
  min-width: 260px;
  max-width: min(300px, calc(100vw - 16px));
  max-height: min(360px, calc(100vh - 16px));
  padding: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.context-menu--picker .context-menu__header {
  padding: var(--space-sm) var(--space-md);
}
.context-menu--picker .context-menu__title {
  font-size: 0.8125rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.context-menu--sheet .context-menu__title,
.context-menu--compact-panel .context-menu__title {
  font-size: 0.8125rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.task-picker__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--space-xs) var(--space-sm) var(--space-sm);
}
.context-menu--sheet .task-picker__body,
.context-menu--compact-panel .task-picker__body {
  padding: var(--space-xs);
}
.task-picker__empty {
  margin: var(--space-sm) var(--space-xs);
}
.task-picker__search {
  flex-shrink: 0;
  padding: var(--space-xs) var(--space-sm);
  border-bottom: 1px solid var(--color-border);
}
.task-picker__search-input {
  width: 100%;
  font-size: 0.8125rem;
  padding: 0.35rem 0.5rem;
  min-height: 0;
  height: auto;
}
.context-menu--compact-panel .task-picker__search,
.context-menu--sheet .task-picker__search {
  padding: var(--space-xs);
}
.context-menu--compact-panel .task-picker__search--solo {
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-xs);
}
.task-picker__only {
  display: block;
  width: 100%;
  margin: 0 0 var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.task-picker__only:hover {
  border-color: var(--color-border-hover);
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.task-picker__only--active,
.task-picker-row--active {
  background: var(--color-hover-overlay);
  border-color: var(--color-border-hover);
  box-shadow: inset 2px 0 0 var(--color-accent, #6c8cff);
}
.task-picker__only--active {
  color: var(--color-text);
}
.task-picker-row:focus-visible,
.task-picker__only:focus-visible {
  outline: none;
  background: var(--color-hover-overlay);
  box-shadow: inset 2px 0 0 var(--color-accent, #6c8cff);
}
.task-picker__body .widget-focus-group {
  margin-bottom: var(--space-sm);
}
.task-picker__body .widget-focus-group:last-child {
  margin-bottom: 0;
}
.task-picker-row {
  width: 100%;
  font-family: inherit;
}
.task-picker-row__meta--overdue {
  color: var(--color-warning);
}
html.widget-desktop .context-menu--compact-panel {
  top: 84px;
  left: var(--space-sm);
  right: var(--space-sm);
  bottom: var(--space-sm);
  min-width: 0;
  max-width: none;
  max-height: none;
  width: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-sm);
  box-shadow: none;
  border-top: 1px solid var(--color-border);
}
html.widget-desktop .context-menu--org-menu {
  top: 32px;
  bottom: var(--space-sm);
}
.context-menu__item--active {
  background: var(--color-hover-overlay);
}
.context-menu__item-check {
  width: 0.875rem;
  flex-shrink: 0;
  font-size: 0.6875rem;
  opacity: 0;
}
.context-menu__item--active .context-menu__item-check {
  opacity: 1;
}
.context-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-xs) var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}
.context-menu__title {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.context-menu__close {
  width: 24px;
  height: 24px;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
}
.context-menu__close:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.context-menu--compact-panel .context-menu__scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--space-xs);
}
.context-menu--compact-panel .context-menu__item {
  flex-shrink: 0;
}
.context-menu__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font-size: 0.875rem;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}
.context-menu__item:hover:not(:disabled):not(.context-menu__item--disabled) {
  background: var(--color-surface-2);
}
.context-menu__item--disabled,
.context-menu__item--muted {
  color: var(--color-text-muted);
  cursor: default;
}

.timer-display {
  font-family: var(--font-mono);
  font-size: 3rem;
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1;
}

.grid-projects { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--space-md); }

/* Home – Tages-Cockpit */
.dashboard-page {
  position: relative;
  max-width: 72rem;
}
.home-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md) var(--space-xl);
  flex-wrap: wrap;
  margin-bottom: var(--space-lg);
}
.home-header__greeting {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
.home-header__date {
  margin: var(--space-xs) 0 0;
}
.home-header__stats {
  flex-shrink: 0;
}
.home-empty {
  margin-bottom: var(--space-lg);
}
.home-empty__title {
  margin: 0 0 var(--space-xs);
  font-size: 1.0625rem;
  font-weight: 600;
}
.home-empty__lead {
  margin: 0 0 var(--space-lg);
}
.home-empty__tour {
  margin-top: var(--space-lg);
}
.stamp-dock-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-bottom: var(--space-xl);
}
.stamp-dock-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  min-height: 1.5rem;
}
.stamp-dock-head__actions {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  flex-shrink: 0;
}
.stamp-dock-head__label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
}
.stamp-dock-head__pip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.375rem;
  padding: 0 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.stamp-dock-head__pip:hover {
  border-color: var(--color-border-hover);
  color: var(--color-text);
}
.stamp-dock-head__hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.stamp-dock-head__hint:hover {
  border-color: var(--color-border-hover);
  color: var(--color-text);
}
.stamp-dock-head__hint-text {
  margin: 0;
}
.stamp-chip--focus .stamp-chip__main {
  border-color: var(--color-border-hover);
}
.home-cockpit__loading {
  margin: var(--space-lg) 0;
}
.home-cockpit__steering {
  margin-bottom: var(--space-lg);
}
.home-cockpit__steering-scroll {
  display: flex;
  gap: var(--space-sm);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: var(--space-xs);
  scrollbar-width: none;
}
.home-cockpit__steering-scroll::-webkit-scrollbar {
  display: none;
}
.home-kpi {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-xs);
  flex-shrink: 0;
  min-width: 7rem;
  min-height: 3.75rem;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.home-kpi:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
}
.home-kpi--critical {
  border-left: 3px solid #e57373;
}
.home-kpi--warn {
  border-left: 3px solid #f0b429;
}
.home-kpi--milestone {
  min-width: 9rem;
  max-width: 15rem;
}
.home-kpi__value {
  font-family: var(--font-mono);
  font-size: 1.25rem;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.home-kpi__label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.home-kpi--milestone .home-kpi__label {
  text-transform: none;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: normal;
  color: var(--color-text);
}
.home-kpi__meta {
  font-size: 0.75rem;
}
.home-cockpit__grid {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: 1fr;
}
.home-cockpit__card {
  display: flex;
  flex-direction: column;
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  min-width: 0;
}
.home-cockpit__card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}
.home-cockpit__card-title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}
.home-cockpit__card-link {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.15s ease;
}
.home-cockpit__overview-hint {
  margin: calc(-1 * var(--space-sm)) 0 var(--space-md);
}
.home-cockpit__card-link:hover {
  color: var(--color-text);
}
.home-cockpit__card .widget-focus-panel {
  padding: 0;
  border: none;
  max-height: none;
}
.home-cockpit__card .widget-focus-panel__link {
  margin-top: var(--space-sm);
}
.home-cockpit__card > .text-muted {
  margin: 0;
}
.home-week__row {
  display: flex;
  align-items: baseline;
  gap: var(--space-xs);
  flex-wrap: wrap;
}
.home-week__logged {
  font-family: var(--font-mono);
  font-size: 1.75rem;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.home-week__cap {
  font-size: 0.875rem;
}
.home-week__bar {
  margin-top: var(--space-md);
  height: 8px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface-2);
  overflow: hidden;
}
.home-week__bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  min-width: 2px;
  background: var(--color-text);
  transition: width 0.35s ease;
}
.home-week__bar-fill--full {
  background: var(--color-warning);
}
.home-week__hint {
  display: inline-block;
  margin-top: var(--space-xs);
  color: var(--color-text-muted);
  text-decoration: none;
}
.home-week__hint:hover {
  color: var(--color-text);
  text-decoration: underline;
}
.home-cal-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.home-cal-list__item {
  display: grid;
  grid-template-columns: 4rem 1fr;
  column-gap: var(--space-md);
  row-gap: 1px;
  align-items: baseline;
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.home-cal-list__item:first-child {
  padding-top: 0;
}
.home-cal-list__item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.home-cal-list__when {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
  grid-row: span 2;
  align-self: center;
}
.home-cal-list__item--absence .home-cal-list__when {
  color: var(--color-warning);
}
.home-cal-list__title {
  font-size: 0.8125rem;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-cal-list__meta {
  font-size: 0.75rem;
  grid-column: 2;
}
.home-cockpit__card--activity .activity-feed__entry:last-child {
  padding-bottom: 0;
}
@media (min-width: 640px) {
  .home-header__greeting {
    font-size: 1.75rem;
  }
  .home-cockpit__grid {
    gap: var(--space-lg);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .home-cockpit__card {
    padding: var(--space-lg);
  }
  .home-cockpit__card--calendar,
  .home-cockpit__card--activity {
    grid-column: 1 / -1;
  }
}
@media (min-width: 1024px) {
  .home-cockpit__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .home-cockpit__card--calendar {
    grid-column: auto;
  }
  .home-cockpit__card--activity {
    grid-column: 1 / -1;
  }
}
.stamp-stats {
  display: flex;
  gap: var(--space-lg);
  min-width: 0;
}
.stamp-stats__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.stamp-stats__label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.stamp-stats__value {
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-variant-numeric: tabular-nums;
}
.stamp-dock {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.stamp-dock__badge {
  display: none;
}
.stamp-dock__actions {
  display: contents;
}
.stamp-dock__stop-label {
  display: none;
}
.stamp-dock__note-inline {
  display: none;
}
.stamp-dock__section {
  display: none;
  margin: 0;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.stamp-dock__timer {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-width: 0;
}
.stamp-dock__active {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex: 1;
  min-width: 0;
}
.stamp-dock__labels {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
}
.stamp-dock__project {
  font-size: 0.875rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stamp-dock__task {
  font-size: 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stamp-dock__elapsed.timer-display {
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-left: auto;
}
.stamp-dock__idle {
  flex: 1;
  margin: 0;
  padding: var(--space-xs) 0;
}
.stamp-dock__note {
  flex-shrink: 0;
  min-height: 2.75rem;
  padding: 0 var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  font-family: inherit;
  cursor: pointer;
  touch-action: manipulation;
}
.stamp-dock__note:hover,
.stamp-dock__note--active {
  border-color: var(--color-accent);
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.stamp-dock__note--active {
  box-shadow: inset 0 -2px 0 var(--color-accent);
}
.stamp-dock__stop {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--color-danger, #c0392b);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-danger, #c0392b);
  font-size: 0.75rem;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
}
.stamp-dock__stop:hover,
.stamp-dock__stop:active {
  background: var(--color-danger, #c0392b);
  color: #fff;
}
.stamp-dock__picker {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.stamp-dock__picker::-webkit-scrollbar { display: none; }
.stamp-chip {
  display: flex;
  align-items: stretch;
  flex-shrink: 0;
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  overflow: hidden;
}
.stamp-chip.active {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 1px var(--color-accent);
}
.stamp-chip__main {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  flex: 1;
  min-width: 0;
  min-height: 2.75rem;
  padding: var(--space-xs) var(--space-sm);
  border: none;
  background: transparent;
  color: var(--color-text);
  font-size: 0.8125rem;
  font-family: inherit;
  cursor: pointer;
  touch-action: manipulation;
  max-width: 8rem;
  overflow: hidden;
}
.stamp-chip__main:hover,
.stamp-chip__main:active {
  background: var(--color-surface-2);
}
.stamp-chip__name {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stamp-chip__task {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.25rem;
  min-height: 2.75rem;
  padding: 0;
  border: none;
  border-left: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
}
.stamp-chip__task:hover,
.stamp-chip__task:active {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.stamp-more {
  flex-shrink: 0;
  min-height: 2.75rem;
  padding: 0 var(--space-md);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  font-family: inherit;
  cursor: pointer;
  touch-action: manipulation;
}
.stamp-more:hover,
.stamp-more:active {
  border-color: var(--color-border-hover);
  color: var(--color-text);
}
.stamp-hint-bar {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.stamp-hint-bar__text {
  margin: 0;
  flex: 1;
  min-width: 0;
  font-size: 0.6875rem;
  line-height: 1.35;
  color: var(--color-text-muted);
}
.stamp-hint-bar__mobile { display: none; }
.stamp-hint-bar__desktop { display: inline; }
.stamp-hint-bar__close {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  line-height: 1;
  cursor: pointer;
}
.stamp-hint-bar__close:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.context-menu-backdrop--sheet {
  background: rgba(0, 0, 0, 0.45);
  z-index: 1100;
}
.context-menu--sheet {
  position: fixed;
  z-index: 1101;
  left: var(--space-sm);
  right: var(--space-sm);
  bottom: var(--space-sm);
  top: auto;
  min-width: 0;
  max-width: none;
  max-height: min(55vh, 22rem);
  padding: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.dashboard-page--panel-open .context-menu--sheet {
  bottom: calc(7rem + env(safe-area-inset-bottom, 0px));
}
.dashboard-page--panel-open:has(.stamp-dock--many) .context-menu--sheet {
  bottom: calc(11rem + env(safe-area-inset-bottom, 0px));
}
.dashboard-page--panel-open:has(.stamp-dock--expanded) .context-menu--sheet {
  bottom: calc(15rem + env(safe-area-inset-bottom, 0px));
}
.stamp-note-sheet__body {
  padding: var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.stamp-note-sheet--pinned {
  z-index: 1200;
}
.context-menu--sheet .context-menu__item {
  min-height: 2.75rem;
  padding: var(--space-sm) var(--space-md);
}
.context-menu__divider {
  height: 1px;
  margin: var(--space-xs) 0;
  background: var(--color-border);
}
.context-menu__item--accent {
  font-weight: 500;
}

@media (min-width: 769px) {
  .context-menu--sheet {
    left: 50%;
    right: auto;
    bottom: auto;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(24rem, calc(100vw - 2rem));
    max-height: min(24rem, calc(100vh - 4rem));
  }
  .context-menu-backdrop--sheet {
    background: rgba(0, 0, 0, 0.45);
  }
}

/* Dashboard – Desktop & Tablet */
@media (min-width: 769px) {
  .dashboard-page {
    max-width: 72rem;
  }
  .stamp-stats__value {
    font-size: 1.375rem;
  }
  .stamp-dock {
    padding: var(--space-lg);
    gap: var(--space-lg);
  }
  .stamp-dock__timer {
    align-items: flex-end;
    gap: var(--space-md);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid var(--color-border);
  }
  .stamp-dock__badge {
    display: inline-flex;
    align-self: flex-start;
    margin-top: 0.25rem;
  }
  .stamp-dock__active {
    align-items: flex-end;
    gap: var(--space-md);
  }
  .stamp-dock__project {
    font-size: 1.0625rem;
    max-width: none;
  }
  .stamp-dock__task {
    font-size: 0.875rem;
  }
  .stamp-dock__elapsed.timer-display {
    font-size: 2.75rem;
    margin-left: auto;
    margin-right: var(--space-md);
  }
  .stamp-dock__idle {
    font-size: 1rem;
    padding: var(--space-sm) 0;
  }
  .stamp-dock__actions {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    flex-shrink: 0;
  }
  .stamp-dock__note {
    display: none;
  }
  .stamp-dock__note-inline {
    display: block;
    margin-top: calc(-1 * var(--space-sm));
  }
  .stamp-dock__note-inline--active .app-input {
    border-color: var(--color-accent);
    box-shadow: inset 0 -2px 0 var(--color-accent);
  }
  .stamp-dock__stop {
    width: auto;
    height: auto;
    min-height: 2.5rem;
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    font-family: inherit;
  }
  .stamp-dock__stop-icon {
    display: none;
  }
  .stamp-dock__stop-label {
    display: inline;
  }
  .stamp-dock__section {
    display: block;
  }
  .stamp-dock__picker {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-sm);
    overflow: visible;
    padding-bottom: 0;
  }
  .stamp-dock--many .stamp-dock__picker,
  .stamp-dock--expanded .stamp-dock__picker {
    max-height: none;
    flex-wrap: unset;
  }
  .stamp-chip {
    width: 100%;
    min-width: 0;
  }
  .stamp-chip__main {
    max-width: none;
    flex: 1;
    min-width: 0;
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    overflow: hidden;
  }
  .stamp-chip__name {
    flex: 1;
    min-width: 0;
    max-width: none;
  }
  .stamp-more {
    min-height: 2.5rem;
    justify-self: start;
    grid-column: 1 / -1;
    width: fit-content;
  }
  .stamp-hint-bar__text {
    font-size: 0.75rem;
  }
  .stamp-note-sheet,
  .dashboard-page--note-open .context-menu-backdrop--sheet {
    display: none !important;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .dashboard-page {
    max-width: none;
  }
  .stamp-dock__picker {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  }
  .stamp-dock__elapsed.timer-display {
    font-size: 2.25rem;
  }
}

/* Organisation page */
.org-page { display: flex; flex-direction: column; gap: var(--space-lg); max-width: 52rem; }
.org-page__header {
  margin-bottom: var(--space-xs);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
}
.org-page__header h1 { margin-bottom: var(--space-xs); }
.org-page__header p { margin: 0; }
.org-page__org-picker {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  max-width: 20rem;
}
.org-section { display: flex; flex-direction: column; gap: var(--space-md); }
.org-section__title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}
.org-section__lead {
  margin: calc(var(--space-xs) * -1) 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
}
.org-logo-preview-wrap {
  display: flex;
  align-items: center;
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg-elevated);
  width: fit-content;
}
.org-logo-preview {
  max-height: 64px;
  max-width: 200px;
  object-fit: contain;
}
.org-logo-upload { margin-top: var(--space-xs); }
.org-form-grid {
  display: grid;
  gap: var(--space-md);
}
.org-form-row {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
  align-items: flex-end;
}
.org-form-row .app-input,
.org-form-row .app-select { flex: 1; min-width: 10rem; }
.org-form-row > .app-btn { flex-shrink: 0; }
.org-invite {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  align-items: stretch;
}
.org-invite__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: center;
}
.org-people-search {
  position: relative;
  width: 100%;
  min-width: 0;
}
.org-people-search__picked {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-width: 0;
  min-height: 2.5rem;
  padding: 0.35rem var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
}
.org-people-search__picked-info {
  flex: 1;
  min-width: 0;
}
.org-people-search__picked-info strong,
.org-people-search__picked-info span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.org-people-search__clear {
  flex-shrink: 0;
}
.org-people-search__list {
  position: absolute;
  z-index: 8;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  margin: 0;
  padding: var(--space-xs);
  list-style: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  max-height: 16rem;
  overflow: auto;
}
.org-people-search__option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding: var(--space-xs) var(--space-sm);
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.org-people-search__option:hover {
  background: var(--color-bg-muted);
}
.org-people-search__hint {
  margin: var(--space-xs) 0 0;
}
.org-org-list { display: flex; flex-direction: column; gap: var(--space-sm); }
.org-org-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
}
.org-org-list__name { font-size: 0.875rem; }
.org-org-list__slug { color: var(--color-text-muted); font-size: 0.8125rem; }
.org-member-list { display: flex; flex-direction: column; }
.org-member-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7.5rem, auto) minmax(7rem, auto) auto;
  gap: var(--space-sm) var(--space-md);
  align-items: center;
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.org-member-row--head {
  padding-top: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.org-member-row--head span:last-child { display: none; }
.org-member-row:last-child { border-bottom: none; }
.org-member-row__info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}
.org-member-row__name { font-size: 0.875rem; }
.org-member-row__email { font-size: 0.8125rem; }
.org-member-row__hours,
.org-member-row__role-cell {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 0;
}
.org-member-row__mobile-label { display: none; margin: 0; font-size: 0.6875rem; }
.org-member-row__role { min-width: 8rem; width: 100%; }
.org-member-row__actions {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
}
.org-member-permissions {
  padding: 0 0 var(--space-md);
  border-bottom: 1px solid var(--color-border);
}
.permission-checklist {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: var(--space-xs) var(--space-md);
  padding: var(--space-sm) 0;
}
.permission-checklist .app-label {
  grid-column: 1 / -1;
  margin-top: var(--space-sm);
}
.permission-checklist__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.8125rem;
}
  display: flex;
  justify-content: flex-end;
}
.org-connector-card.app-card { padding: 0; overflow: hidden; }
.org-connector-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  width: 100%;
  padding: var(--space-lg);
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease;
  flex-shrink: 0;
}
.org-connector-toggle[aria-expanded="true"] {
  border-bottom: 1px solid var(--color-border);
}
.org-connector-toggle:hover { background: var(--color-hover-overlay); }
.org-connector-toggle--connected {
  background: color-mix(in srgb, var(--color-success) 10%, var(--color-surface));
}
.org-connector-toggle--connected:hover {
  background: color-mix(in srgb, var(--color-success) 14%, var(--color-surface));
}
.org-connector-toggle--problem {
  background: color-mix(in srgb, var(--color-danger) 10%, var(--color-surface));
}
.org-connector-toggle--problem:hover {
  background: color-mix(in srgb, var(--color-danger) 14%, var(--color-surface));
}
.org-connector-toggle__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 0;
}
.org-connector-toggle__title {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}
.org-connector-toggle__meta { font-size: 0.8125rem; }
.org-connector-toggle__icon {
  flex-shrink: 0;
  color: var(--color-text-muted);
  font-size: 0.75rem;
}
.org-connector-panel {
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  background: var(--color-surface);
}
.org-connector-card--open.app-card {
  padding: 0;
  overflow: hidden;
}
.org-connector-panel--always {
  border-top: 1px solid var(--color-border);
}
.org-subsection__title {
  margin: 0;
}
.org-action-bar--flush {
  border-top: none;
  padding-top: 0;
}
.org-connector-tabs {
  margin-bottom: var(--space-md);
  gap: var(--space-sm);
}
.org-connector-tab {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  border: 1px solid var(--color-border) !important;
  opacity: 0.55;
  font-weight: 500;
  box-shadow: none;
}
.org-connector-tab:hover {
  opacity: 0.8;
}
.org-connector-tab.active {
  opacity: 1;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 currentColor;
}
.org-connector-tab__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
  background: var(--color-text-muted);
}
.org-connector-tab__status {
  font-size: 0.75rem;
  opacity: 0.85;
  font-weight: 500;
}
.org-connector-tab--connected {
  color: var(--color-success) !important;
  background: color-mix(in srgb, var(--color-success) 6%, var(--color-surface)) !important;
  border-color: color-mix(in srgb, var(--color-success) 28%, var(--color-border)) !important;
}
.org-connector-tab--connected .org-connector-tab__dot {
  background: var(--color-success);
}
.org-connector-tab--connected.active {
  background: color-mix(in srgb, var(--color-success) 16%, var(--color-surface)) !important;
  border-color: var(--color-success) !important;
  box-shadow: inset 0 -2px 0 var(--color-success);
}
.org-connector-tab--problem {
  color: var(--color-danger) !important;
  background: color-mix(in srgb, var(--color-danger) 6%, var(--color-surface)) !important;
  border-color: color-mix(in srgb, var(--color-danger) 28%, var(--color-border)) !important;
}
.org-connector-tab--problem .org-connector-tab__dot {
  background: var(--color-danger);
}
.org-connector-tab--problem.active {
  background: color-mix(in srgb, var(--color-danger) 16%, var(--color-surface)) !important;
  border-color: var(--color-danger) !important;
  box-shadow: inset 0 -2px 0 var(--color-danger);
}
.org-connector-tab--inactive {
  color: var(--color-text-muted) !important;
}
.org-connector-tab--inactive.active {
  color: var(--color-text) !important;
  background: color-mix(in srgb, var(--color-text) 10%, transparent) !important;
  border-color: var(--color-border-strong, var(--color-border)) !important;
  box-shadow: inset 0 -2px 0 var(--color-text);
}
.org-connector-panel .org-section__lead {
  margin: 0;
}
.org-status-banner {
  padding: var(--space-sm) var(--space-md);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  border: 1px solid var(--color-border);
  background: var(--color-bg);
}
.org-status-banner--error {
  border-color: rgba(239, 68, 68, 0.35);
  color: var(--color-danger);
  background: rgba(239, 68, 68, 0.08);
}
.org-status-banner--success {
  border-color: rgba(34, 197, 94, 0.35);
  color: var(--color-success);
  background: rgba(34, 197, 94, 0.08);
}
.org-integration-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}
.org-action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  padding-top: var(--space-xs);
  border-top: 1px solid var(--color-border);
}
.org-subsection {
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.org-subsection:first-of-type { border-top: none; padding-top: 0; }
.org-checklist {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  max-height: 16rem;
  overflow-y: auto;
  padding: var(--space-xs);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
}
.org-checklist__item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-sm);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  transition: background 0.15s;
}
.org-checklist__item:hover { background: var(--color-hover-overlay); }
.org-checklist__label {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  flex: 1;
  min-width: 0;
  cursor: pointer;
}
.org-checklist__item input { margin-top: 0.2rem; flex-shrink: 0; accent-color: var(--color-accent); }
.org-checklist__address {
  flex-shrink: 0;
  max-width: 14rem;
  font-size: 0.8125rem;
}
.org-checklist__meta { color: var(--color-text-muted); font-size: 0.8125rem; }
.org-mapping-row {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(12rem, 1.5fr);
  gap: var(--space-md);
  align-items: center;
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
  font-size: 0.875rem;
}
.org-mapping-row:last-child { border-bottom: none; }
.abacus-sync-logs {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--space-sm);
  max-height: 16rem;
  overflow-y: auto;
  background: var(--color-bg);
  font-family: var(--font-mono);
  font-size: 0.75rem;
}
.abacus-sync-logs__entry {
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
  line-height: 1.4;
}
.abacus-sync-logs__entry:last-child { border-bottom: none; }

.activity-feed {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.activity-feed__entry {
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}

.activity-feed__entry:last-child { border-bottom: none; }

.activity-feed__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: baseline;
  margin-bottom: var(--space-xs);
  font-size: 0.75rem;
}

.activity-feed__time {
  font-variant-numeric: tabular-nums;
}

.activity-feed__project::before {
  content: "·";
  margin-right: var(--space-sm);
}

.activity-feed__message {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.45;
}

.project-form-color {
  min-width: 11rem;
}
.project-form-name {
  flex: 2;
  min-width: 12rem;
}
.org-invite-role {
  max-width: 8rem;
}
.project-color-trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  width: 100%;
  min-height: 2.375rem;
  padding: 0.375rem 0.625rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  color: var(--color-text);
  font: inherit;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.project-color-trigger:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
}
.project-color-trigger__swatch {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  flex-shrink: 0;
}
.project-color-trigger__hex {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}
.project-color-trigger__chevron {
  margin-left: auto;
  color: var(--color-text-muted);
  font-size: 0.75rem;
}

/* BlazorColorPicker — dark/light theme */
.color-picker-modal {
  backdrop-filter: blur(2px);
}
.color-picker-content {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45) !important;
  overflow: hidden;
}
.color-picker-header {
  background: var(--color-surface-2) !important;
  color: var(--color-text) !important;
  border-bottom: 1px solid var(--color-border);
}
.color-picker-title {
  color: var(--color-text) !important;
  font-weight: 500;
}
.color-picker-close-button {
  color: var(--color-text-muted) !important;
}
.color-picker-close-button:hover {
  color: var(--color-danger) !important;
}
.color-picker-body {
  background: var(--color-bg) !important;
  padding: var(--space-sm) !important;
}
.color-picker-case:hover {
  border-color: var(--color-text) !important;
  box-shadow: 0 0 0 1px var(--color-bg);
}
.app-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s, color 0.15s;
}
.app-icon-btn:hover:not(:disabled) {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.app-icon-btn--danger:hover:not(:disabled) {
  color: var(--color-danger);
  background: rgba(239, 68, 68, 0.1);
}
.app-icon-btn:disabled { opacity: 0.4; cursor: not-allowed; }

.timesheet-sync-retry {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 0.375rem 0.625rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  font-family: inherit;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.timesheet-sync-retry:hover:not(:disabled) {
  border-color: var(--color-border-hover);
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.timesheet-sync-retry:disabled { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 640px) {
  .org-mapping-row { grid-template-columns: 1fr; }
  .org-member-row--head { display: none; }
  .org-member-row {
    grid-template-columns: 1fr;
    gap: var(--space-sm);
    padding: var(--space-md) 0;
  }
  .org-member-row__mobile-label { display: block; }
  .org-member-row__actions { justify-content: flex-start; }
}

.grid-kanban { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
@media (max-width: 768px) { .grid-kanban { grid-template-columns: 1fr; } }

.board-tabs {
  display: flex;
  gap: var(--space-xs);
  align-items: center;
  overflow-x: auto;
  padding-bottom: var(--space-xs);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-md);
}
.board-tabs__item {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.board-tabs__delete {
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1;
  cursor: pointer;
}
.board-tabs__delete:hover {
  background: rgba(239, 68, 68, 0.1);
  color: var(--color-danger);
}
.board-tabs__delete-confirm {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.board-tabs__tab {
  flex-shrink: 0;
  padding: var(--space-xs) var(--space-md);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.875rem;
  cursor: pointer;
}
.board-tabs__tab:hover { color: var(--color-text); border-color: var(--color-border); }
.board-tabs__tab--active {
  color: var(--color-text);
  border-color: var(--color-border);
  background: var(--color-surface);
}
.board-tabs__add { flex-shrink: 0; }
.board-tabs__rename-input { width: 120px; font-size: 0.875rem; padding: var(--space-xs) var(--space-sm); }

.tasks-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}
.tasks-page__header,
.tasks-page .board-tabs,
.tasks-page .tasks-toolbar,
.tasks-page__error {
  flex-shrink: 0;
}
.tasks-page__header h1 { margin-bottom: var(--space-sm); }
.tasks-page__body {
  flex: 1;
  display: flex;
  align-items: stretch;
  gap: var(--space-md);
  min-height: 0;
  margin-top: var(--space-sm);
  overflow: hidden;
}
.tasks-page__body--with-panel {
  min-height: 0;
}
.tasks-page__body--with-panel .tasks-page__kanban-area {
  min-width: 0;
}
.tasks-page__panel-backdrop {
  display: none;
}
.tasks-page__kanban-area {
  flex: 1;
  min-width: 0;
  min-height: 0;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
.kanban-board-track {
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
  width: 100%;
  min-width: min-content;
}
.kanban-board {
  display: flex;
  gap: var(--space-md);
  padding-bottom: var(--space-md);
  align-items: stretch;
  box-sizing: border-box;
  height: 100%;
  min-height: 0;
  width: 100%;
  min-width: min-content;
}

.kanban-col {
  flex: 1 1 260px;
  min-width: 260px;
  width: auto;
  max-width: none;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  transition: border-color 0.15s ease, background 0.15s ease;
}
.kanban-col--collapsed {
  flex: 0 0 200px;
  min-width: 200px;
  min-height: auto;
  height: auto;
  max-height: none;
  align-self: flex-start;
}
.kanban-board:has(.task-card--dragging) .kanban-col:not(.kanban-col--drag-over):not(.kanban-col--add):not(.kanban-col--new) {
  opacity: 0.55;
}
.kanban-col--drag-over {
  border-color: var(--color-text);
  background: color-mix(in srgb, var(--color-surface) 70%, var(--color-text-muted) 30%);
  box-shadow: inset 0 0 0 1px var(--color-text-muted);
  opacity: 1;
}
.kanban-col--column-drag-over {
  border-color: var(--color-text-muted);
  box-shadow: inset 0 3px 0 var(--color-text-muted);
}
.kanban-col--column-dragging {
  opacity: 0.55;
}
.kanban-col__drag-handle,
.kanban-col__collapse,
.kanban-col__settings-toggle {
  flex-shrink: 0;
  padding: 0 var(--space-xs);
  margin: 0;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font-size: 0.85rem;
  line-height: 1;
}
.kanban-col__drag-handle { cursor: grab; }
.kanban-col__drag-handle:active { cursor: grabbing; }
.kanban-col__drag-handle:hover,
.kanban-col__collapse:hover,
.kanban-col__settings-toggle:hover { color: var(--color-text); }
.kanban-col__add-header {
  flex-shrink: 0;
  padding: 0.25rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}
.kanban-col--add,
.kanban-col--new {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  max-width: none;
  height: auto;
  max-height: none;
  align-self: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding: var(--space-sm) var(--space-md);
  box-sizing: border-box;
}
.kanban-col--add {
  min-height: 0;
  white-space: nowrap;
  font-size: 0.8125rem;
  line-height: 1.2;
}
.kanban-col--new {
  min-width: 220px;
  width: 220px;
}
.kanban-col__header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-sm);
}
.kanban-col--collapsed .kanban-col__header { margin-bottom: 0; }
.kanban-col__header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  flex-shrink: 0;
}
.kanban-col__delete-confirm {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.kanban-col__title { cursor: default; flex: 1; min-width: 0; }
.kanban-col__count { font-size: 0.7rem; }
.kanban-col__cards { flex: 1; display: flex; flex-direction: column; gap: 6px; min-height: 0; overflow-y: auto; }
.kanban-col__drop-indicator {
  flex: 0 0 3px;
  height: 3px;
  margin: 0 2px;
  border-radius: 2px;
  background: var(--color-text);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-text) 35%, transparent);
  pointer-events: none;
}
.kanban-col__drop-tail {
  flex: 1 1 24px;
  min-height: 24px;
}
.kanban-col__quick-add { margin-bottom: var(--space-sm); flex-shrink: 0; }
.kanban-col__rename { font-size: 0.75rem; padding: var(--space-xs); }
.kanban-col__settings {
  margin-bottom: var(--space-sm);
  padding-bottom: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}
.kanban-col__kind {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}
.kanban-col__kind-label { flex-shrink: 0; font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.06em; }
.kanban-col__kind-select {
  flex: 1;
  min-width: 0;
  font-size: 0.75rem;
  padding: var(--space-xs) var(--space-sm);
}
.kanban-col__search {
  margin-bottom: 0;
  flex-shrink: 0;
}
.kanban-col__search-input {
  width: 100%;
  font-size: 0.75rem;
  padding: var(--space-xs) var(--space-sm);
}
.kanban-col__search-empty {
  margin: 0;
  padding: var(--space-xs) 0;
  text-align: center;
}

.task-card {
  padding: 6px 10px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  border-left-width: 3px;
  background: var(--color-bg);
  cursor: grab;
  font-size: 0.8125rem;
  transition: opacity 0.15s ease;
}
.task-card:active { cursor: grabbing; }
.task-card--dragging {
  opacity: 0.35;
  outline: 1px dashed var(--color-text-muted);
}
.task-card--selected { border-color: var(--color-text-muted); }
.task-card--outofscope { opacity: 0.72; }
.task-card__oos-badge { display: inline-block; margin-bottom: 2px; font-size: 0.7rem; }
.task-card__title {
  font-weight: 500;
  margin-bottom: 2px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
  line-height: 1.3;
}
.task-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 0.7rem;
}
.task-card__project,
.task-card__assignee,
.task-card__time {
  overflow: hidden;
  text-overflow: ellipsis;
}
.task-card__time {
  font-family: var(--font-mono);
  color: var(--color-text-muted);
}
.task-card .dual-status-badges {
  margin: 2px 0;
  transform: scale(0.9);
  transform-origin: left center;
}

.tasks-toolbar { align-items: flex-end; flex-wrap: wrap; display: flex; gap: var(--space-md); }
.tasks-toolbar--compact { margin-bottom: var(--space-sm); padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
.tasks-page__error { margin: 0 0 var(--space-sm); color: var(--color-warning); }
.tasks-page__error { margin: 0 0 var(--space-sm); color: var(--color-warning); }
.tasks-toolbar__project { flex: 1; min-width: 160px; }
.tasks-toolbar__filter { flex: 1; min-width: 160px; }
.tasks-toolbar__actions { margin-left: auto; }
.tasks-toolbar__toggle {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  margin-top: 1.35rem;
  cursor: pointer;
}

.task-detail-panel__fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-inline-size: 0;
}
.task-detail-panel__readonly input,
.task-detail-panel__readonly textarea,
.task-detail-panel__readonly select,
.task-detail-panel__readonly button {
  pointer-events: none;
  opacity: 0.72;
}
.task-detail-panel {
  flex: 0 0 360px;
  align-self: stretch;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: hidden;
}
.task-detail-panel--loading .task-detail-panel__body,
.task-detail-panel--loading .task-detail-panel__footer {
  opacity: 0.55;
  pointer-events: none;
}
.task-detail-panel__loading {
  font-size: 0.75rem;
}
.task-detail-panel__header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-md);
  border-bottom: 1px solid var(--color-border);
}
.task-detail-panel__title { font-size: 0.875rem; margin: 0; color: var(--color-text-muted); font-weight: 400; }
.milestone-detail-panel__header-title {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  margin-right: var(--space-sm);
}
.milestone-detail-panel__header-kicker {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}
.milestone-detail-panel__header-name {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.task-detail-panel__close {
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.25rem;
  cursor: pointer;
  line-height: 1;
  padding: 0;
}
.task-detail-panel__close:hover {
  color: var(--color-text);
}
.task-detail-panel__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.task-detail-panel__project { display: flex; align-items: center; gap: var(--space-xs); }
.task-detail-panel__oos {
  margin-bottom: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.task-detail-panel__oos-badge { font-weight: 500; display: block; margin-bottom: var(--space-xs); }
.task-detail-panel__field { display: flex; flex-direction: column; gap: var(--space-xs); }
.task-detail-panel__notes { resize: vertical; min-height: 100px; }
.task-detail-panel__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-sm); }
.task-detail-panel__grid > div:last-child { grid-column: 1 / -1; }
.task-detail-panel__time-total {
  font-family: var(--font-mono);
  font-size: 1.125rem;
}
.task-detail-panel__team { margin-top: var(--space-sm); }
.task-detail-panel__team-row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
  font-size: 0.875rem;
}
.task-detail-panel__team-row:last-child { border-bottom: none; }
.task-detail-panel__team-duration {
  font-family: var(--font-mono);
  color: var(--color-text-muted);
  flex-shrink: 0;
}
.task-detail-panel__footer {
  flex-shrink: 0;
  display: flex;
  gap: var(--space-sm);
  padding: var(--space-md);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface);
}

.milestone-detail-panel .task-detail-panel__header,
.milestone-detail-panel .task-detail-panel__footer {
  flex-shrink: 0;
}

.milestone-detail-panel .task-detail-panel__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.task-move-sheet__subtitle {
  margin: 0;
  padding: 0 var(--space-md) var(--space-xs);
}

@media (max-width: 768px) {
  .app-shell:has(.tasks-page) {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .app-main:has(.tasks-page) {
    display: block;
    overflow: visible;
  }
  .tasks-page {
    height: auto;
    min-height: calc(100vh - var(--nav-height) - 2 * var(--space-xl));
    overflow: visible;
  }
  .kanban-board-track,
  .kanban-board {
    height: auto;
    min-height: calc(100vh - var(--nav-height) - 16rem);
    width: max-content;
    min-width: max-content;
  }
  .kanban-col {
    flex: 0 0 260px;
    width: 260px;
    min-width: 260px;
    height: auto;
    max-height: 60vh;
  }
  .kanban-col--add,
  .kanban-col--new {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    height: auto;
    max-height: none;
    align-self: flex-start;
  }
  .kanban-col--new {
    min-width: 220px;
    width: 220px;
  }
  .task-card--touch {
    cursor: pointer;
    touch-action: manipulation;
  }
  .task-card--touch:active { cursor: pointer; }
  .tasks-page__panel-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 900;
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
  }
  .tasks-page__body--with-panel .task-detail-panel {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 901;
    flex: none;
    width: 100%;
    max-height: min(88vh, 100%);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    border-bottom: none;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
  }
  .tasks-page__body--with-panel .task-detail-panel__footer {
    padding-bottom: calc(var(--space-md) + env(safe-area-inset-bottom, 0px));
  }
}

.task-row {
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  margin-bottom: var(--space-sm);
  border-left-width: 3px;
  cursor: grab;
  font-size: 0.875rem;
}

.stats-row { display: flex; gap: var(--space-xl); margin-bottom: var(--space-xl); }
.stat { }
.stat__label { font-size: 0.75rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.stat__value { font-family: var(--font-mono); font-size: 1.25rem; margin-top: var(--space-xs); }

.org-switcher {
  position: relative;
  min-width: 0;
  flex-shrink: 1;
}
.org-switcher--open {
  z-index: 300;
}
.org-switcher__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  max-width: 13rem;
  padding: 0.3rem 0.55rem 0.3rem 0.45rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.8125rem;
  line-height: 1.25;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  min-width: 0;
}
.org-switcher__trigger:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface);
}
.org-switcher__trigger[aria-expanded="true"] {
  border-color: var(--color-border-hover);
  background: var(--color-surface);
}
.org-switcher__indicator {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.org-switcher__indicator--personal {
  background: var(--color-text-muted);
  opacity: 0.55;
}
.org-switcher__indicator--org {
  background: var(--color-text);
}
.org-switcher__indicator--overview {
  background: var(--color-text);
  opacity: 0.85;
  box-shadow: 0 0 0 2px var(--color-border);
}
.org-switcher__menu-sep {
  height: 1px;
  margin: var(--space-xs) var(--space-sm);
  background: var(--color-border);
}
.org-switcher__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.org-switcher__chevron {
  flex-shrink: 0;
  margin-left: 0.125rem;
  font-size: 0.625rem;
  color: var(--color-text-muted);
  transition: transform 0.15s ease;
}
.org-switcher__chevron--open {
  transform: rotate(180deg);
}
.org-switcher__backdrop {
  position: fixed;
  inset: 0;
  z-index: 450;
  border: none;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: default;
}
.org-switcher__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 12rem;
  max-width: 18rem;
  padding: var(--space-xs);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  z-index: 460;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.org-switcher__menu-head {
  padding: 0.3rem 0.5rem 0.4rem;
  font-size: 0.65rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}
.org-switcher__option {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  width: 100%;
  padding: 0.45rem 0.5rem;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.8125rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.12s;
}
.org-switcher__option:hover {
  background: var(--color-hover-overlay);
}
.org-switcher__option.active {
  background: var(--color-hover-overlay);
}
.org-switcher__option-check {
  width: 0.875rem;
  flex-shrink: 0;
  font-size: 0.6875rem;
  color: var(--color-text);
  opacity: 0;
}
.org-switcher__option.active .org-switcher__option-check {
  opacity: 1;
}
.org-switcher__option-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Widget compact variant */
.org-switcher--compact {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  -webkit-app-region: drag;
  app-region: drag;
}
.org-switcher--compact .org-switcher__trigger {
  max-width: none;
  padding: 0;
  border: none;
  background: transparent;
  gap: 0.25rem;
}
.org-switcher--compact .org-switcher__trigger:hover,
.org-switcher--compact .org-switcher__trigger[aria-expanded="true"] {
  border: none;
  background: transparent;
}
.org-switcher--compact .org-switcher__label {
  max-width: 10rem;
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--color-text-muted);
}
.org-switcher--compact .org-switcher__chevron {
  font-size: 0.6rem;
}
.org-switcher--compact .org-switcher__menu {
  left: var(--space-sm);
  min-width: 9rem;
  max-width: 14rem;
  margin-top: 0;
  top: calc(100% + 2px);
  -webkit-app-region: no-drag;
  app-region: no-drag;
}
.org-switcher--compact .org-switcher__trigger,
.org-switcher--compact .org-switcher__backdrop {
  -webkit-app-region: no-drag;
  app-region: no-drag;
}
.org-switcher--widget-chrome {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}
.org-switcher__chrome-group {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-width: 0;
}
.org-switcher--widget-chrome .org-switcher__label {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: grab;
}
.org-switcher--widget-chrome .org-switcher__trigger--chevron {
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.125rem;
  margin-left: 0.0625rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
}
.org-switcher--widget-chrome .org-switcher__chevron {
  margin-left: 0;
}
.org-switcher--widget-chrome .org-switcher__trigger--chevron:hover,
.org-switcher--widget-chrome .org-switcher__trigger--chevron[aria-expanded="true"] {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}

.widget-shell { padding: var(--space-sm); background: var(--color-bg); min-height: 100vh; }
html.widget-desktop,
html.widget-desktop body {
  margin: 0;
  min-height: 0;
  height: auto;
  overflow: hidden;
  background: var(--color-bg);
}
.widget-app--desktop {
  width: 360px;
  min-height: 72px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-sizing: border-box;
}
html.widget-desktop .widget-app--desktop:has(.lang-switcher--open) {
  overflow: visible;
}
.widget-chrome__lang {
  -webkit-app-region: no-drag;
  app-region: no-drag;
  position: relative;
  z-index: 40;
}
html.widget-desktop .widget-chrome__lang .lang-switcher__menu {
  z-index: 1003;
}
html.widget-desktop .widget-chrome__lang .lang-switcher__backdrop {
  z-index: 1002;
}
.widget-app--desktop .widget-shell { min-height: 0; padding: var(--space-xs) var(--space-sm) var(--space-sm); }
.widget-app--desktop .widget-project-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  max-height: 280px;
  overflow-y: auto;
}
.widget-app--desktop.widget-app--expanded .widget-project-list {
  max-height: none;
  overflow: visible;
}
.widget-app--desktop .project-chip { width: 100%; justify-content: flex-start; }
.widget-app--ultra {
  --widget-ultra-bar-height: 36px;
  min-height: 0;
}
.widget-root--ultra {
  --widget-ultra-bar-height: 36px;
}
.widget-app--desktop.widget-app--ultra {
  min-height: 0;
  border-radius: var(--radius-sm);
}
.widget-app--ultra .widget-shell {
  padding: 0;
}
.widget-app--ultra .widget-compact {
  border: none;
  border-radius: 0;
  min-height: var(--widget-ultra-bar-height);
  height: var(--widget-ultra-bar-height);
  padding: 2px 4px;
  gap: 4px;
  box-sizing: border-box;
}
.widget-app--ultra .widget-compact__status-main {
  padding: 0 4px;
  gap: 6px;
}
.widget-app--ultra .widget-compact__status .timer-display {
  font-size: 0.875rem;
  line-height: 1;
}
.widget-app--ultra .widget-compact__project-name,
.widget-app--ultra .widget-compact__task-name,
.widget-app--ultra .widget-compact__hint {
  font-size: 0.75rem;
  line-height: 1.1;
}
.widget-app--ultra .widget-compact__stop {
  width: 1.25rem;
  height: 1.25rem;
  font-size: 0.5rem;
}
.widget-app--ultra .widget-compact__chip {
  padding: 2px 4px;
}
.widget-app--ultra .widget-compact__picker--dots .widget-compact__chip {
  padding: 2px;
}
/* Menus live under .widget-root (siblings of .widget-app) — scope ultra top here. */
html.widget-desktop .widget-root--ultra .context-menu--compact-panel {
  top: var(--widget-ultra-bar-height);
}
html.widget-desktop .widget-root--ultra .context-menu-backdrop--compact-panel {
  top: var(--widget-ultra-bar-height);
}
.widget-app--ultra .widget-compact--menu-open {
  z-index: 1002;
}
.widget-status-menu {
  z-index: 1002;
}
.widget-hotkeys-panel {
  z-index: 1002;
}
.widget-hotkeys-panel__body {
  padding: var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.widget-hotkeys-panel__toggle {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.8125rem;
  color: var(--color-text);
  cursor: pointer;
}
.widget-hotkeys-panel__toggle input {
  accent-color: var(--color-text-muted);
}
.widget-hotkeys-panel__hint {
  margin: 0;
  line-height: 1.35;
}
.widget-hotkeys-panel__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.widget-hotkeys-panel__list--editable {
  max-height: 220px;
  overflow-y: auto;
  gap: 0.25rem;
}
.widget-hotkeys-panel__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}
.widget-hotkeys-panel__action {
  flex: 1;
  min-width: 0;
  color: var(--color-text-muted);
}
.widget-hotkeys-panel__chord {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: transparent;
  color: var(--color-text);
  padding: 0.2rem 0.45rem;
  font-size: 0.7rem;
  cursor: pointer;
  opacity: 0.9;
}
.widget-hotkeys-panel__change {
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.widget-hotkeys-panel__chord:hover {
  border-color: var(--color-text-muted);
  opacity: 1;
}
.widget-hotkeys-panel__chord.is-capturing {
  border-color: var(--color-text);
  opacity: 1;
}
.widget-hotkeys-panel__actions {
  display: flex;
  justify-content: flex-end;
}
.widget-hotkeys-panel__reset {
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: transparent;
  color: var(--color-text-muted);
  padding: 0.3rem 0.65rem;
  font-size: 0.75rem;
  cursor: pointer;
}
.widget-hotkeys-panel__reset:hover {
  color: var(--color-text);
  border-color: var(--color-text-muted);
}
.widget-hotkeys-panel__list kbd {
  display: inline-block;
  padding: 0.05rem 0.3rem;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.7rem;
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.widget-hotkeys-panel__conflict {
  margin: 0;
  color: var(--color-danger, #e57373);
  line-height: 1.35;
}
.widget-hotkeys-panel__version {
  margin: 0;
  font-size: 0.7rem;
  opacity: 0.85;
}
.widget-compact {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-xs);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  min-width: 0;
  overflow: hidden;
}
.widget-compact__status {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  min-width: 0;
  flex: 1;
}
.widget-compact__status-main {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-width: 0;
  flex: 1;
  padding: var(--space-xs) var(--space-sm);
  cursor: grab;
}
.widget-compact__hint {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.widget-compact__project-name {
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 0 1 auto;
  max-width: 7rem;
}
.widget-compact__status-main--with-task .widget-compact__project-name {
  flex: 0 1 3.5rem;
  max-width: 3.5rem;
}
.widget-compact__status .timer-display { font-size: 1rem; white-space: nowrap; }
.widget-compact__timer {
  flex-shrink: 0;
  margin-left: auto;
  padding: 0;
  border: none;
  background: transparent;
  color: inherit;
  cursor: pointer;
  border-radius: var(--radius-sm);
}
.widget-compact__timer:hover,
.widget-compact__timer--noted {
  background: var(--color-hover-overlay);
}
.widget-compact__timer--noted {
  box-shadow: inset 0 -2px 0 var(--color-accent);
}
.widget-note-panel__body {
  padding: var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.widget-note-panel__hint {
  margin: 0;
}
.widget-compact__stop {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  border: 1px solid var(--color-danger, #c0392b);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-danger, #c0392b);
  font-size: 0.625rem;
  line-height: 1;
  cursor: pointer;
}
.widget-compact__stop:hover {
  background: var(--color-danger, #c0392b);
  color: #fff;
}
.widget-root {
  position: relative;
}

.widget-compact__picker--tasks .widget-compact__chip--task {
  max-width: 7rem;
}
.widget-compact__chip--back {
  max-width: none;
  flex-shrink: 0;
  color: var(--color-text-muted);
}
.widget-compact__picker-hint {
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  white-space: nowrap;
  padding: 0 4px;
  align-self: center;
}
.widget-compact__task-name {
  font-size: 0.6875rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1 1 auto;
}
.widget-compact__picker {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 1;
  min-width: 0;
  overflow-x: auto;
}
.widget-compact__chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  color: var(--color-text);
  cursor: pointer;
  max-width: 5.5rem;
}
.widget-compact__chip:hover { border-color: var(--color-accent); }
.widget-compact__chip.active {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 1px var(--color-accent);
}
.widget-compact__chip-name {
  font-size: 0.6875rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.widget-chrome {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 32px;
  padding: 0 var(--space-xs) 0 var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
  user-select: none;
  cursor: grab;
}
.widget-browser-bar {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-wrap: wrap;
  padding: var(--space-xs) var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg);
}
.widget-browser-bar__pip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.5rem;
  padding: 0 0.625rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font-size: 0.75rem;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.15s ease, opacity 0.15s ease;
}
.widget-browser-bar__pip:hover {
  border-color: var(--color-border-hover);
}
.widget-browser-bar__hint {
  margin: 0;
}
.widget-app--pip .widget-shell {
  min-height: 0;
  flex: 1;
  padding: var(--space-xs) var(--space-sm) var(--space-sm);
  overflow: hidden;
}
html.widget-pip,
html.widget-pip body {
  margin: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--color-bg);
}
html.widget-pip .widget-shell {
  min-height: 0 !important;
  flex: 1;
  padding: var(--space-xs) var(--space-sm) var(--space-sm);
  overflow: hidden;
}
html.widget-pip #planchi-boot {
  display: none !important;
}
html.widget-pip .widget-root {
  min-height: 0;
}
.widget-app--pip {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 0;
  box-sizing: border-box;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
html.widget-pip .widget-compact {
  min-height: 0;
}
html.widget-pip.widget-desktop .context-menu--compact-panel {
  top: var(--pip-bar-height, 52px);
  left: var(--space-sm);
  right: var(--space-sm);
  bottom: var(--space-sm);
  min-width: 0;
  max-width: none;
  max-height: none;
  width: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-sm);
  box-shadow: none;
  border-top: 1px solid var(--color-border);
}
html.widget-pip.widget-desktop .context-menu-backdrop--compact-panel {
  top: var(--pip-bar-height, 52px);
}
html.widget-pip.widget-desktop .widget-compact--menu-open {
  position: relative;
  z-index: 1002;
}
/* Note panel: hug content (no inner scrollbar). After pip rules so bottom:auto wins. */
html.widget-desktop .context-menu--compact-panel.widget-note-panel,
html.widget-pip.widget-desktop .context-menu--compact-panel.widget-note-panel {
  bottom: auto;
  height: auto;
  max-height: none;
  overflow: visible;
}
html.widget-desktop .widget-note-panel .widget-note-panel__body,
html.widget-pip.widget-desktop .widget-note-panel .widget-note-panel__body {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
}
/* Create-task milestones: scroll inside a fixed viewport — never grow the shell. */
.widget-create-task-panel__milestones {
  display: flex;
  flex-direction: column;
  gap: 1px;
  max-height: 112px;
  overflow-y: auto;
  margin-top: var(--space-xs);
  padding-top: var(--space-xs);
  border-top: 1px solid var(--color-border);
}
.widget-create-task-panel__milestones .context-menu__item {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 0.28rem 0.5rem;
  font-size: 0.8125rem;
  text-align: left;
  width: 100%;
  flex-shrink: 0;
}
.widget-create-task-panel__ms-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.widget-create-task-panel__milestones .project-dot {
  width: 0.5rem;
  height: 0.5rem;
  flex-shrink: 0;
}
.widget-chrome:active {
  cursor: grabbing;
}
.widget-chrome__actions {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  cursor: default;
}
.widget-chrome__btn {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.widget-chrome__btn:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.widget-chrome__btn[aria-pressed="true"] {
  border: 1px solid var(--color-border);
  color: var(--color-text);
  background: var(--color-surface);
}
.widget-chrome__btn--glyph {
  font-size: 0.8125rem;
  letter-spacing: -0.02em;
}

.widget-focus-panel {
  border-top: 1px solid var(--color-border);
  padding: var(--space-xs) var(--space-sm) var(--space-sm);
  max-height: 280px;
  overflow-y: auto;
}
.widget-focus-panel__empty {
  padding: var(--space-sm) 0;
  margin: 0;
}
.widget-focus-panel__link {
  margin-top: var(--space-xs);
  font-size: 0.75rem;
  padding: 0;
}
.widget-focus-group { margin-bottom: var(--space-sm); }
.widget-focus-group:last-of-type { margin-bottom: var(--space-xs); }
.widget-focus-group__label {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-xs);
  padding: 0 var(--space-xs);
}
.widget-focus-row {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  width: 100%;
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font-size: 0.8125rem;
  text-align: left;
  cursor: pointer;
}
.widget-focus-row:hover {
  border-color: var(--color-border);
  background: var(--color-hover-overlay);
}
.widget-focus-row__title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.widget-focus-row__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.widget-focus-row__body .widget-focus-row__title {
  flex: none;
  width: 100%;
}
.widget-focus-row__context,
.up-next-row__project {
  font-size: 0.7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Swipe deck (Meine Arbeit) */
.swipe-page {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-height: calc(100vh - var(--nav-height, 3.5rem) - 6.5rem);
  overflow-x: hidden;
}
.swipe-page__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  flex-shrink: 0;
}
.swipe-page__title {
  margin: 0;
}
.swipe-page__subtitle {
  margin: var(--space-xs) 0 0;
}
.swipe-page__subtitle--desktop {
  display: none;
}
.swipe-page__remaining {
  white-space: nowrap;
  padding-top: 0.35rem;
}
.swipe-page__head-actions {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-shrink: 0;
}
.swipe-page__new {
  white-space: nowrap;
}
.swipe-create {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-sm);
  padding: var(--space-md);
  margin-bottom: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-surface);
  flex-shrink: 0;
}
.swipe-create__field {
  min-width: 0;
}
.swipe-create__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-sm);
}
@media (min-width: 769px) {
  .swipe-create {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--space-md);
  }
  .swipe-create__field {
    flex: 1 1 11rem;
    min-width: 10rem;
  }
  .swipe-create__field--title {
    flex: 2 1 16rem;
  }
  .swipe-create__actions {
    flex: 0 0 auto;
    padding-bottom: 1px;
  }
}
.swipe-page__flash {
  margin: 0;
  color: var(--color-text-muted);
  flex-shrink: 0;
}
.swipe-page__error {
  margin: 0;
  color: var(--color-danger, #e57373);
  flex-shrink: 0;
}
.swipe-page__body {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.swipe-page__main {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-width: 0;
  min-height: 0;
}
.swipe-page__panel-backdrop {
  position: fixed;
  inset: 0;
  z-index: 900;
  border: none;
  padding: 0;
  margin: 0;
  background: rgba(0, 0, 0, 0.45);
  cursor: pointer;
}
.swipe-page__panel {
  z-index: 901;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--color-surface);
}
.swipe-page__panel .task-detail-panel {
  width: 100%;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  flex: 1;
}
.swipe-deck {
  width: 100%;
  display: flex;
  flex-direction: column;
  outline: none;
  overflow-x: hidden;
}
.swipe-deck:focus-visible {
  outline: none;
}
.swipe-rail {
  display: none;
}
.swipe-deck__toolbar {
  display: none;
}
.swipe-deck__gesture-hint--desktop {
  display: none;
}
.swipe-deck__stage {
  position: relative;
  min-height: 18rem;
  margin-bottom: var(--space-md);
  touch-action: none;
  overflow: hidden;
}
.swipe-edge-zones {
  position: fixed;
  width: 4.75rem;
  display: flex;
  flex-direction: column;
  z-index: 9999;
  pointer-events: none;
  overflow: hidden;
}
.swipe-edge-zones--date {
  left: 0;
  right: auto;
  border-radius: 0 12px 12px 0;
  box-shadow: 4px 0 18px rgba(0, 0, 0, 0.28);
}
.swipe-edge-zones--status {
  left: auto;
  right: 0;
  border-radius: 12px 0 0 12px;
  box-shadow: -4px 0 18px rgba(0, 0, 0, 0.28);
}
.swipe-edge-zones__zone {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.35rem;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  transition: background 0.12s ease, color 0.12s ease;
}
.swipe-edge-zones--date .swipe-edge-zones__zone {
  color: rgba(255, 183, 77, 0.55);
  background: color-mix(in srgb, #ffb74d 16%, var(--color-bg));
  border-bottom: 1px solid color-mix(in srgb, #ffb74d 22%, transparent);
}
.swipe-edge-zones--status .swipe-edge-zones__zone {
  color: rgba(129, 199, 132, 0.55);
  background: color-mix(in srgb, #81c784 16%, var(--color-bg));
  border-bottom: 1px solid color-mix(in srgb, #81c784 22%, transparent);
}
.swipe-edge-zones__zone:last-child {
  border-bottom: none;
}
.swipe-edge-zones--date .swipe-edge-zones__zone--active {
  color: #ffb74d;
  background: color-mix(in srgb, #ffb74d 40%, var(--color-bg));
}
.swipe-edge-zones--status .swipe-edge-zones__zone--active {
  color: #81c784;
  background: color-mix(in srgb, #81c784 40%, var(--color-bg));
}
.swipe-deck__empty {
  text-align: center;
  padding: var(--space-xl) var(--space-md);
}
.swipe-deck__gesture-hint {
  text-align: center;
  margin: var(--space-sm) 0 0;
}
.swipe-card {
  --swipe-tint: 0;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-height: 16rem;
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-surface);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
  user-select: none;
  touch-action: none;
  cursor: grab;
  transition: box-shadow 0.15s ease, background 0.12s ease, border-color 0.12s ease;
}
.swipe-card--dragging {
  cursor: grabbing;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.4);
  transition: none;
}
.swipe-card--tint-done {
  background: color-mix(in srgb, #81c784 calc(var(--swipe-tint) * 58%), var(--color-surface));
  border-color: color-mix(in srgb, #81c784 calc(var(--swipe-tint) * 80%), var(--color-border));
}
.swipe-card--tint-later {
  background: color-mix(in srgb, #ffb74d calc(var(--swipe-tint) * 52%), var(--color-surface));
  border-color: color-mix(in srgb, #ffb74d calc(var(--swipe-tint) * 80%), var(--color-border));
}
.swipe-card--tint-prio {
  background: color-mix(in srgb, #64b5f6 calc(var(--swipe-tint) * 52%), var(--color-surface));
  border-color: color-mix(in srgb, #64b5f6 calc(var(--swipe-tint) * 80%), var(--color-border));
}
.swipe-card--tint-skip {
  background: color-mix(in srgb, #b0bec5 calc(var(--swipe-tint) * 48%), var(--color-surface));
  border-color: color-mix(in srgb, #b0bec5 calc(var(--swipe-tint) * 75%), var(--color-border));
}
.swipe-card--tint-strong {
  --swipe-tint: 1;
}
.swipe-card--fly-right,
.swipe-card--fly-left,
.swipe-card--fly-up,
.swipe-card--fly-down {
  transition: transform 0.24s ease-out, opacity 0.24s ease-out, background 0.12s ease;
  opacity: 0.2;
  pointer-events: none;
}
.swipe-card--fly-right.swipe-card--tint-strong {
  background: color-mix(in srgb, #81c784 72%, var(--color-surface));
}
.swipe-card--fly-left.swipe-card--tint-strong {
  background: color-mix(in srgb, #ffb74d 68%, var(--color-surface));
}
.swipe-card--fly-up.swipe-card--tint-strong {
  background: color-mix(in srgb, #64b5f6 68%, var(--color-surface));
}
.swipe-card--fly-down.swipe-card--tint-strong {
  background: color-mix(in srgb, #b0bec5 62%, var(--color-surface));
}
.swipe-card__hint {
  position: absolute;
  top: var(--space-md);
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0;
  pointer-events: none;
  border: 1px solid currentColor;
}
.swipe-card__hint--done {
  right: var(--space-md);
  color: #81c784;
}
.swipe-card__hint--later {
  left: var(--space-md);
  color: #ffb74d;
}
.swipe-card__hint--prio {
  left: 50%;
  top: var(--space-sm);
  transform: translateX(-50%);
  color: #64b5f6;
}
.swipe-card__hint--skip {
  left: 50%;
  top: auto;
  bottom: var(--space-sm);
  transform: translateX(-50%);
  color: #b0bec5;
}
.swipe-rail-wrap {
  display: none;
}
.swipe-date-popover {
  display: none;
}
.swipe-date-sheet,
.swipe-status-sheet {
  display: none;
}
.swipe-date-sheet--mobile,
.swipe-status-sheet--mobile {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: var(--space-xs);
  margin: 0 0 var(--space-sm);
}
.swipe-date-popover__btn {
  min-height: 2.5rem;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  font-size: 0.8125rem;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.swipe-date-popover__btn--later {
  border-color: rgba(255, 183, 77, 0.45);
}
.swipe-date-popover__btn--later:hover {
  background: color-mix(in srgb, #ffb74d 12%, transparent);
  border-color: rgba(255, 183, 77, 0.7);
}
.swipe-date-popover__btn--done {
  border-color: rgba(129, 199, 132, 0.45);
}
.swipe-date-popover__btn--done:hover {
  background: color-mix(in srgb, #81c784 12%, transparent);
  border-color: rgba(129, 199, 132, 0.7);
}
.swipe-card__org-logo {
  display: block;
  width: 4rem;
  height: 4rem;
  object-fit: contain;
  border-radius: 8px;
  flex-shrink: 0;
  align-self: flex-start;
  margin: 0.15rem 0 0;
  line-height: 0;
}
.swipe-card__top {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  margin-top: var(--space-xs);
}
.swipe-card:not(:has(.swipe-card__org-logo)) .swipe-card__top {
  margin-top: var(--space-lg);
}
.swipe-card__project {
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.swipe-card__title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 560;
  line-height: 1.3;
  word-break: break-word;
}
.swipe-card__desc {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--color-text-muted);
  white-space: pre-wrap;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
  flex: 1;
  min-height: 0;
}
.swipe-card__desc--empty {
  font-style: italic;
}
.swipe-card__facts {
  display: none;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-md);
  font-size: 0.8125rem;
}
.swipe-card__fact {
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  color: var(--color-text);
}
.swipe-card__fact-label {
  color: var(--color-text-muted);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.swipe-card__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  font-size: 0.8125rem;
}
.swipe-card__prio {
  color: var(--color-text-muted);
  letter-spacing: -0.05em;
}
.swipe-card__milestone {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.swipe-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}
.swipe-actions__btn {
  min-height: 2.75rem;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  font-size: 0.875rem;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, opacity 0.15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
}
.swipe-actions__btn:hover:not(:disabled) {
  border-color: var(--color-border-hover);
  background: var(--color-hover-overlay);
}
.swipe-actions__btn:disabled {
  opacity: 0.45;
  cursor: default;
}
.swipe-actions__btn--done {
  border-color: rgba(129, 199, 132, 0.45);
}
.swipe-actions__btn--later {
  border-color: rgba(255, 183, 77, 0.45);
}
.swipe-actions__btn--prio {
  border-color: rgba(100, 181, 246, 0.45);
}
.swipe-actions__btn--skip {
  border-color: rgba(176, 190, 197, 0.5);
}
.swipe-actions__btn--details {
  border-color: var(--color-border);
}
.swipe-rail__kbd {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.7rem;
  font-weight: 500;
  opacity: 0.55;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0.05rem 0.3rem;
  line-height: 1.2;
}

/* Desktop: rails beside card + toolbar under card */
@media (min-width: 769px) {
  .swipe-page__subtitle--mobile {
    display: none;
  }
  .swipe-page__subtitle--desktop {
    display: block;
  }
  .swipe-page__body {
    flex-direction: row;
    align-items: stretch;
    gap: var(--space-xl);
  }
  .swipe-page__main {
    justify-content: center;
    align-items: stretch;
    padding: var(--space-sm) 0;
    min-height: 0;
  }
  .swipe-deck {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr) 7rem;
    grid-template-rows: minmax(28rem, 1fr) auto auto;
    gap: var(--space-md) var(--space-xl);
    width: min(68rem, 100%);
    max-height: calc(100vh - var(--nav-height, 3.5rem) - 9rem);
    align-items: stretch;
    margin-inline: auto;
  }
  .swipe-rail-wrap {
    display: block;
    position: relative;
    min-height: 100%;
  }
  .swipe-rail-wrap--later {
    grid-column: 1;
    grid-row: 1;
  }
  .swipe-rail-wrap--done {
    grid-column: 3;
    grid-row: 1;
  }
  .swipe-rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    width: 100%;
    min-height: 100%;
    height: 100%;
    padding: var(--space-md) var(--space-sm);
    border-radius: 12px;
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, opacity 0.15s ease;
  }
  .swipe-rail:hover:not(:disabled) {
    background: var(--color-hover-overlay);
    border-color: var(--color-border-hover);
  }
  .swipe-rail:disabled {
    opacity: 0.45;
    cursor: default;
  }
  .swipe-rail__label {
    font-size: 0.9375rem;
    font-weight: 560;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    letter-spacing: 0.04em;
  }
  .swipe-rail--later {
    border-color: rgba(255, 183, 77, 0.5);
    color: #ffb74d;
  }
  .swipe-rail--done {
    border-color: rgba(129, 199, 132, 0.5);
    color: #81c784;
  }
  .swipe-date-popover {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 8;
    min-width: 8.5rem;
    padding: var(--space-xs);
    border-radius: 10px;
    background: var(--color-surface);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  }
  .swipe-date-popover--later {
    left: calc(100% + 0.5rem);
    border: 1px solid rgba(255, 183, 77, 0.45);
  }
  .swipe-date-popover--done {
    right: calc(100% + 0.5rem);
    left: auto;
    border: 1px solid rgba(129, 199, 132, 0.45);
  }
  .swipe-date-sheet--mobile,
  .swipe-status-sheet--mobile {
    display: none;
  }
  .swipe-deck__stage {
    grid-column: 2;
    grid-row: 1;
    margin-bottom: 0;
    min-height: 0;
    display: flex;
  }
  .swipe-card {
    flex: 1;
    width: 100%;
    min-height: 0;
    height: 100%;
    padding: var(--space-xl) calc(var(--space-xl) + 0.25rem);
    border-radius: 14px;
    overflow: auto;
  }
  .swipe-edge-zones {
    width: 5.5rem;
  }
  .swipe-edge-zones--date {
    left: var(--swipe-stage-left, 0px);
    right: auto;
    border-radius: 0 14px 14px 0;
  }
  .swipe-edge-zones--status {
    left: auto;
    right: calc(100vw - var(--swipe-stage-right, 100vw));
    border-radius: 14px 0 0 14px;
  }
  .swipe-edge-zones__zone {
    font-size: 0.85rem;
  }
  .swipe-card__title {
    font-size: 1.85rem;
  }
  .swipe-card__desc {
    font-size: 0.95rem;
    -webkit-line-clamp: 18;
    flex: 1 1 auto;
  }
  .swipe-card__facts {
    display: flex;
  }
  .swipe-actions {
    display: none;
  }
  .swipe-deck__toolbar {
    grid-column: 2;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: var(--space-md);
  }
  .swipe-deck__toolbar .swipe-actions__btn {
    min-height: 3rem;
    font-size: 0.9375rem;
    font-weight: 500;
  }
  .swipe-deck__gesture-hint--mobile {
    display: none;
  }
  .swipe-deck__gesture-hint--desktop {
    grid-column: 1 / -1;
    grid-row: 3;
    display: block;
    margin: 0;
  }
  .swipe-page__panel-backdrop {
    display: none;
  }
  .swipe-page__panel {
    position: relative;
    flex: 0 0 min(34rem, 40%);
    width: min(34rem, 40%);
    align-self: stretch;
    max-height: calc(100vh - var(--nav-height, 3.5rem) - 7rem);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: none;
  }
  .swipe-page__panel .task-detail-panel {
    border: none;
    border-radius: 0;
    height: 100%;
    max-height: 100%;
  }
  .swipe-page--with-panel .swipe-deck {
    width: 100%;
    max-height: calc(100vh - var(--nav-height, 3.5rem) - 7rem);
    grid-template-columns: 5.5rem minmax(0, 1fr) 5.5rem;
  }
}

@media (max-width: 768px) {
  .swipe-page {
    min-height: 0;
  }
  .swipe-deck__stage {
    min-height: 22rem;
  }
  .swipe-card {
    min-height: 20rem;
  }
  .swipe-page__panel {
    position: fixed;
    inset: 0;
    top: env(safe-area-inset-top, 0px);
  }
  .swipe-page__panel .task-detail-panel {
    border: none;
    border-radius: 0;
  }
  .swipe-page__panel .task-detail-panel__footer {
    padding-bottom: calc(var(--space-md) + env(safe-area-inset-bottom, 0px));
  }
}

.widget-focus-row__meta {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  flex-shrink: 0;
  font-size: 0.7rem;
}
.widget-focus-row__priority {
  color: var(--color-text-muted);
  letter-spacing: -0.05em;
}
.widget-focus-row__time {
  font-family: var(--font-mono);
  color: var(--color-text-muted);
}

.up-next {
  width: 100%;
}
.up-next__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
  margin-bottom: var(--space-md);
}
.up-next__title {
  margin: 0;
}
.up-next__subtitle {
  margin: var(--space-xs) 0 0;
}
.up-next__views {
  display: inline-flex;
  gap: 2px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 2px;
}
.up-next__view {
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
  padding: var(--space-xs) var(--space-sm);
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.up-next__view:hover {
  color: var(--color-text);
}
.up-next__view--active {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.up-next__summary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-bottom: var(--space-md);
}
.up-next__pill {
  font-size: 0.75rem;
  padding: 2px var(--space-sm);
  border-radius: 999px;
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
}
.up-next__pill--overdue {
  border-color: var(--color-danger);
  color: var(--color-danger);
}
.up-next__pill--today {
  color: var(--color-text);
}
.up-next__empty {
  padding: var(--space-lg) 0;
}
.up-next__group {
  margin-bottom: var(--space-lg);
}
.up-next__group-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
  padding: 0 var(--space-xs) var(--space-xs);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-xs);
}
.up-next__group-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text);
  font-weight: 600;
}
.up-next__group-count {
  font-size: 0.7rem;
  color: var(--color-text-muted);
}
.up-next__group-meta {
  margin-left: auto;
}
.up-next-row {
  font-size: 0.875rem;
}
.up-next-row__project {
  flex-shrink: 0;
  font-size: 0.75rem;
  max-width: 30%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.widget-chrome__tenant {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
  max-width: calc(100% - 7.5rem);
  height: 100%;
}
.widget-chrome__drag {
  flex: 1;
  height: 100%;
  display: flex;
  align-items: center;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  cursor: grab;
  -webkit-app-region: drag;
  app-region: drag;
}
.widget-chrome__close {
  width: 28px;
  height: 28px;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-app-region: no-drag;
  app-region: no-drag;
}
.widget-chrome__theme {
  -webkit-app-region: no-drag;
  app-region: no-drag;
}
.widget-chrome__close:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.widget-bar {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.widget-bar .timer-display { font-size: 1.25rem; }

.download-page {
  max-width: 720px;
  width: 100%;
  margin: 0 auto;
}
.download-hero { margin-bottom: var(--space-xl); }
.download-lead { font-size: 1.05rem; max-width: 540px; }
.download-primary__inner { display: flex; justify-content: space-between; align-items: center; gap: var(--space-lg); flex-wrap: wrap; }
.download-linux-cli { display: flex; flex-direction: column; gap: var(--space-sm); width: 100%; }
.download-linux-cli__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.download-linux-cli__hint { margin: 0; }
.download-linux-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}
.download-linux-option {
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.875rem;
}
.download-linux-option:hover {
  border-color: var(--color-text-muted);
  color: var(--color-text);
}
.download-linux-option--active {
  border-color: var(--color-text);
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.download-linux-after {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}
.download-linux-after > p:first-child { margin: 0; font-weight: 500; color: var(--color-text); }
.download-cli-snippet {
  margin: 0;
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  color: var(--color-text);
  overflow-x: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.85rem;
  white-space: pre-wrap;
  user-select: all;
}
.download-cli-snippet--compact { padding: var(--space-sm) var(--space-md); }
.download-linux-all { padding-top: var(--space-md); border-top: 1px solid var(--color-border); }
.download-linux-all > p { margin: 0 0 var(--space-sm); }
.download-overlay-alt__lead { max-width: 540px; margin-bottom: var(--space-md); }
.download-overlay-alt__steps {
  margin: 0 0 var(--space-md);
  padding-left: 1.25rem;
  color: var(--color-text-muted);
}
.download-overlay-alt__steps li { margin-bottom: var(--space-sm); }
.download-overlay-alt__note { margin-bottom: var(--space-md); }
.download-btn { font-size: 1rem; padding: 0.75rem 1.25rem; text-decoration: none; }
.download-steps { display: grid; gap: var(--space-md); }
.download-step { display: flex; gap: var(--space-md); align-items: flex-start; padding: var(--space-md); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); }
.download-step__num { width: 2rem; height: 2rem; border-radius: 50%; background: var(--color-accent); color: var(--color-bg); display: flex; align-items: center; justify-content: center; font-weight: 600; flex-shrink: 0; }
.download-platforms { display: flex; flex-direction: column; gap: var(--space-sm); margin-top: var(--space-md); }
.download-platform { display: flex; justify-content: space-between; align-items: center; padding: var(--space-sm) 0; border-bottom: 1px solid var(--color-border); }
.download-platform:last-child { border-bottom: none; }
.download-tips { margin: var(--space-md) 0 0; padding-left: 1.25rem; }
.download-tips li { margin-bottom: var(--space-sm); }

.app-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.app-banner__text {
  margin: 0;
  color: var(--color-text-muted);
}
.app-banner__text a {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.app-banner__text a:hover {
  opacity: 0.85;
}
.app-banner__close {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1;
}
.app-banner__close:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.app-banner--install {
  align-items: flex-start;
}
.app-banner--install .app-banner__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  flex: 1;
  min-width: 0;
}
.app-banner__install {
  align-self: flex-start;
  min-height: 2.25rem;
  padding: 0 var(--space-md);
}
.app-banner__hint {
  margin: 0;
  line-height: 1.45;
}

.text-muted { color: var(--color-text-muted); }
.text-sm { font-size: 0.875rem; }
.mt-md { margin-top: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }
.flex { display: flex; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }

#blazor-error-ui {
  position: fixed;
  inset: 0;
  z-index: 10000;
  box-sizing: border-box;
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: var(--space-xl);
  border: 0;
  background: var(--color-bg);
  color: var(--color-text);
}

#blazor-error-ui[style*="display: block"],
#blazor-error-ui[style*="display:block"],
#blazor-error-ui[style*="display: flex"],
#blazor-error-ui[style*="display:flex"] {
  display: flex !important;
}

#blazor-error-ui .blazor-error-ui__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  width: min(22rem, 100%);
  text-align: center;
  position: relative;
}

#blazor-error-ui .blazor-error-ui__mark {
  width: min(88px, 28vmin);
  height: min(88px, 28vmin);
}

#blazor-error-ui .blazor-error-ui__brand {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}

#blazor-error-ui .blazor-error-ui__title {
  margin: var(--space-sm) 0 0;
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

#blazor-error-ui .blazor-error-ui__hint {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
  max-width: 18rem;
}

#blazor-error-ui .reload,
#blazor-error-ui .blazor-error-ui__reload {
  margin-top: var(--space-sm);
  font: inherit;
  font-size: 0.875rem;
  padding: 8px 18px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-accent);
  background: var(--color-accent);
  color: var(--color-bg);
  text-decoration: none;
  cursor: pointer;
}

#blazor-error-ui .reload:hover,
#blazor-error-ui .blazor-error-ui__reload:hover {
  opacity: 0.9;
}

/* Widget / PiP: gleiche kompakte Leiste wie ReconnectModal */
html.widget-desktop #blazor-error-ui,
html.widget-pip #blazor-error-ui {
  padding: 4px 10px;
  align-items: stretch;
  justify-content: stretch;
}

html.widget-desktop #blazor-error-ui .blazor-error-ui__inner,
html.widget-pip #blazor-error-ui .blazor-error-ui__inner {
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 100%;
  text-align: left;
}

html.widget-desktop #blazor-error-ui .blazor-error-ui__mark,
html.widget-pip #blazor-error-ui .blazor-error-ui__mark {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}

html.widget-desktop #blazor-error-ui .blazor-error-ui__brand,
html.widget-pip #blazor-error-ui .blazor-error-ui__brand,
html.widget-desktop #blazor-error-ui .blazor-error-ui__hint,
html.widget-pip #blazor-error-ui .blazor-error-ui__hint {
  display: none;
}

html.widget-desktop #blazor-error-ui .blazor-error-ui__title,
html.widget-pip #blazor-error-ui .blazor-error-ui__title {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: min(14rem, 52vw);
  min-width: 0;
}

html.widget-desktop #blazor-error-ui .reload,
html.widget-desktop #blazor-error-ui .blazor-error-ui__reload,
html.widget-pip #blazor-error-ui .reload,
html.widget-pip #blazor-error-ui .blazor-error-ui__reload {
  margin: 0;
  padding: 3px 10px;
  font-size: 0.75rem;
  flex-shrink: 0;
}

@media (max-height: 44px) {
  html.widget-desktop #blazor-error-ui,
  html.widget-pip #blazor-error-ui {
    padding: 2px 8px;
  }

  html.widget-desktop #blazor-error-ui .blazor-error-ui__inner,
  html.widget-pip #blazor-error-ui .blazor-error-ui__inner {
    gap: 6px;
  }

  html.widget-desktop #blazor-error-ui .blazor-error-ui__mark,
  html.widget-pip #blazor-error-ui .blazor-error-ui__mark {
    width: 18px;
    height: 18px;
  }

  html.widget-desktop #blazor-error-ui .blazor-error-ui__title,
  html.widget-pip #blazor-error-ui .blazor-error-ui__title {
    font-size: 0.6875rem;
    max-width: min(11rem, 58vw);
  }

  html.widget-desktop #blazor-error-ui .reload,
  html.widget-desktop #blazor-error-ui .blazor-error-ui__reload,
  html.widget-pip #blazor-error-ui .reload,
  html.widget-pip #blazor-error-ui .blazor-error-ui__reload {
    padding: 2px 8px;
    font-size: 0.6875rem;
  }
}

.valid.modified:not([type=checkbox]) { outline: 1px solid var(--color-success); }
.invalid { outline: 1px solid var(--color-danger); }
.validation-message { color: var(--color-danger); font-size: 0.875rem; }

.blazor-error-boundary {
  background: var(--color-surface);
  border: 1px solid var(--color-danger);
  padding: var(--space-md);
  color: var(--color-text);
}

/* Account / Auth pages */
.auth-page {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-height: calc(100vh - var(--nav-height) - var(--space-xl) * 2);
  padding: var(--space-lg) 0 var(--space-xl);
}

.auth-card {
  width: 100%;
  max-width: 400px;
  padding: var(--space-xl);
}

.auth-card__header {
  margin-bottom: var(--space-lg);
  text-align: center;
}

.auth-card__brand {
  margin: 0 0 var(--space-sm);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

/* planchi-Bildmarke (Lottie). Grösse steuern die Modifier / inline-Style. */
/* Bildmarke als animiertes WebP (CSS-Hintergrund). Laeuft auf der Decoder-/
   Compositor-Pipeline des Browsers – unabhaengig vom Main-Thread, daher kein
   Ruckeln waehrend des Blazor-WASM-Boots. Theme rein ueber [data-theme]. */
.planchi-mark {
  display: inline-block;
  line-height: 0;
  background: center / contain no-repeat url('/branding/planchi-intro.webp');
  contain: layout style paint;
}

[data-theme="light"] .planchi-mark {
  background-image: url('/branding/planchi-intro-light.webp');
}

/* Erzwungene Variante (unabhaengig vom aktiven Theme) */
.planchi-mark--force-dark,
[data-theme="light"] .planchi-mark--force-dark {
  background-image: url('/branding/planchi-intro.webp');
}

.planchi-mark--force-light,
[data-theme="light"] .planchi-mark--force-light {
  background-image: url('/branding/planchi-intro-light.webp');
}

.planchi-mark--auth {
  width: 88px;
  height: 88px;
  margin: 0 auto var(--space-sm);
}

.planchi-mark--nav {
  width: 26px;
  height: 26px;
  vertical-align: middle;
}

.planchi-mark--hero {
  width: 132px;
  height: 132px;
}

/* Home-Willkommenskarte (einmalig pro Browser) */
.planchi-welcome {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-md) var(--space-lg);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-border-hover);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.planchi-welcome__inner {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  flex: 1;
  min-width: 0;
}

.planchi-mark--home {
  width: 56px;
  height: 56px;
  flex: none;
}

.planchi-welcome__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 0;
}

.planchi-welcome__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-text);
}

.planchi-welcome__lead {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.planchi-welcome__close {
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1;
}

.planchi-welcome__close:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}

.auth-card__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--color-text);
}

.planchi-boot {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-bg);
  transition: opacity 0.4s ease;
}

.planchi-boot--hide {
  opacity: 0;
  pointer-events: none;
}

.planchi-boot__mark {
  /* Responsiv: volle Groesse auf grossen Screens, im winzigen Widget-Fenster
     skaliert die Marke mit (vmin = kleinere Fensterkante) -> nichts abgeschnitten. */
  width: min(168px, 55vmin);
  height: min(168px, 55vmin);
}

/* Nav-Markenlockup (Mark + Wortmarke) */
.app-nav__brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.app-nav__brand-word {
  font-weight: 600;
}

/* Landing-Hero-Lockup mit Claim */
.landing-hero__brand-row {
  display: flex;
  justify-content: center;
  margin-bottom: var(--space-lg);
}

.landing-hero__brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
}

.landing-hero__lockup {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  line-height: 1.15;
}

.landing-hero__name {
  font-size: 1.75rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.landing-hero__claim {
  font-size: 0.95rem;
  color: var(--color-text-muted);
}

.auth-card__lead {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.auth-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.auth-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.auth-checkbox {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  cursor: pointer;
  user-select: none;
}

.auth-checkbox input {
  width: 1rem;
  height: 1rem;
  accent-color: var(--color-accent);
  cursor: pointer;
}

.auth-submit {
  width: 100%;
  padding: 0.75rem 1rem;
  margin-top: var(--space-xs);
  font-size: 0.9375rem;
}

.error-page__ref {
  margin: 0 0 var(--space-lg);
  text-align: center;
  word-break: break-all;
}

.auth-passkey {
  width: 100%;
}

.auth-divider {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  margin: var(--space-sm) 0;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  text-transform: lowercase;
}

.auth-divider::before,
.auth-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--color-border);
}

.auth-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

.auth-links a {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  transition: color 0.15s;
}

.auth-links a:hover {
  color: var(--color-text);
  opacity: 1;
}

.auth-banner {
  padding: var(--space-sm) var(--space-md);
  margin-bottom: var(--space-md);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  border: 1px solid var(--color-border);
}

.auth-banner--error {
  border-color: rgba(239, 68, 68, 0.35);
  color: var(--color-danger);
  background: rgba(239, 68, 68, 0.08);
}

.auth-banner--success {
  border-color: rgba(34, 197, 94, 0.35);
  color: var(--color-success);
  background: rgba(34, 197, 94, 0.08);
}

.auth-validation {
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  list-style: none;
  border: 1px solid rgba(239, 68, 68, 0.35);
  color: var(--color-danger);
  background: rgba(239, 68, 68, 0.08);
}

.auth-validation:empty {
  display: none;
}

.auth-external {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.auth-external__label {
  margin: 0;
  text-align: center;
}

.auth-external__buttons {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.auth-external__buttons .app-btn {
  width: 100%;
}

/* Account manage */
.account-page {
  width: 100%;
  max-width: none;
  margin: 0;
}

.account-page__header {
  margin-bottom: var(--space-xl);
  text-align: center;
}

.account-page__brand {
  margin: 0 0 var(--space-sm);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.account-page__title {
  margin: 0 0 var(--space-sm);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--color-text);
}

.account-page__lead {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.account-shell {
  display: grid;
  grid-template-columns: 13rem minmax(0, 1fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.account-shell__nav {
  padding: var(--space-md);
  border-right: 1px solid var(--color-border);
  background: var(--color-bg);
}

.account-shell__content {
  padding: var(--space-xl);
  min-width: 0;
}

.account-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.account-nav__link {
  display: block;
  padding: 0.45rem 0.6rem;
  border-radius: var(--radius-sm);
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  transition: color 0.15s, background 0.15s;
  opacity: 1;
}

.account-nav__link:hover {
  color: var(--color-text);
  background: var(--color-surface-2);
  opacity: 1;
}

.account-nav__link.active {
  color: var(--color-text);
  background: var(--color-surface-2);
  font-weight: 500;
}

.account-section__title {
  margin: 0 0 var(--space-lg);
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--color-text);
}

.account-section__subtitle {
  margin: var(--space-lg) 0 var(--space-md);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}

.account-text {
  margin: 0 0 var(--space-md);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}

.account-text strong {
  color: var(--color-text);
  font-weight: 500;
}

.account-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  max-width: 36rem;
}

.account-form--wide {
  max-width: none;
}

.account-field-row {
  display: flex;
  gap: var(--space-sm);
  align-items: stretch;
}

.account-field-row .app-input {
  flex: 1;
  min-width: 0;
}

.account-field-row__badge {
  display: flex;
  align-items: center;
  padding: 0 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-success);
  font-size: 0.875rem;
  flex-shrink: 0;
}

.account-alert {
  padding: var(--space-md);
  margin-bottom: var(--space-lg);
  border-radius: var(--radius-sm);
  font-size: 0.875rem;
  line-height: 1.55;
  border: 1px solid var(--color-border);
}

.account-alert p {
  margin: 0 0 var(--space-sm);
}

.account-alert p:last-child {
  margin-bottom: 0;
}

.account-alert--warning {
  border-color: rgba(234, 179, 8, 0.35);
  color: var(--color-text);
  background: rgba(234, 179, 8, 0.08);
}

.account-alert--danger {
  border-color: rgba(239, 68, 68, 0.35);
  color: var(--color-text);
  background: rgba(239, 68, 68, 0.08);
}

.account-alert--info {
  border-color: rgba(59, 130, 246, 0.35);
  color: var(--color-text-muted);
  background: rgba(59, 130, 246, 0.08);
}

.account-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.account-table {
  width: 100%;
  margin-bottom: var(--space-lg);
  border-collapse: collapse;
  font-size: 0.875rem;
}

.account-table td {
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--color-border);
  vertical-align: middle;
}

.account-table tr:last-child td {
  border-bottom: none;
}

.account-table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.account-table .account-actions {
  margin-top: 0;
  justify-content: flex-end;
}

.account-kbd {
  display: inline-block;
  padding: 0.2rem 0.45rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface-2);
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  color: var(--color-text);
}

.account-list {
  margin: 0 0 var(--space-lg);
  padding-left: 1.25rem;
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1.6;
}

.account-list li {
  margin-bottom: var(--space-md);
}

.account-list li:last-child {
  margin-bottom: 0;
}

.recovery-codes {
  display: grid;
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}

.recovery-code {
  display: block;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface-2);
  font-family: var(--font-mono);
  font-size: 0.875rem;
  color: var(--color-text);
}

.app-btn--danger-solid {
  background: var(--color-danger);
  color: var(--color-bg);
  border-color: var(--color-danger);
}

.app-btn--danger-solid:hover:not(:disabled) {
  opacity: 0.9;
  background: var(--color-danger);
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: 0.8125rem;
  white-space: nowrap;
}

.theme-toggle__icon {
  font-size: 0.95rem;
  line-height: 1;
}

.theme-toggle--compact {
  width: 28px;
  height: 28px;
  padding: 0;
  justify-content: center;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
}

.theme-toggle--compact:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}

.theme-toggle--compact .theme-toggle__label {
  display: none;
}

.lang-switcher {
  position: relative;
  flex-shrink: 0;
}
.lang-switcher--open {
  z-index: 300;
}
.lang-switcher__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.3rem 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.25;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.lang-switcher__trigger:hover,
.lang-switcher__trigger[aria-expanded="true"] {
  border-color: var(--color-border-hover);
  background: var(--color-surface);
}
.lang-switcher__current {
  font-weight: 500;
}
.lang-switcher__chevron {
  flex-shrink: 0;
  font-size: 0.625rem;
  color: var(--color-text-muted);
  transition: transform 0.15s ease;
}
.lang-switcher__chevron--open {
  transform: rotate(180deg);
}
.lang-switcher__backdrop {
  position: fixed;
  inset: 0;
  z-index: 450;
  border: none;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: default;
}
.lang-switcher__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 10rem;
  padding: var(--space-xs);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  z-index: 460;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lang-switcher__option {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  width: 100%;
  padding: 0.45rem 0.5rem;
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.8125rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.12s;
}
.lang-switcher__option:hover,
.lang-switcher__option.active {
  background: var(--color-hover-overlay);
}
.lang-switcher__option-check {
  width: 0.875rem;
  flex-shrink: 0;
  font-size: 0.6875rem;
  color: var(--color-text);
  opacity: 0;
}
.lang-switcher__option.active .lang-switcher__option-check {
  opacity: 1;
}
.lang-switcher__option-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lang-switcher__option-code {
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}

/* Day timeline (timesheet) */
.timesheet-timeline-header {
  gap: var(--space-md);
  flex-wrap: wrap;
  align-items: flex-start;
}
.timesheet-view-toggle {
  display: inline-flex;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.timesheet-view-toggle__btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  font-family: inherit;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.timesheet-view-toggle__btn:hover {
  background: var(--color-hover-overlay);
  color: var(--color-text);
}
.timesheet-view-toggle__btn--active {
  background: var(--color-surface-2);
  color: var(--color-text);
}
.timesheet-day-nav { align-items: center; flex-wrap: wrap; }
.timesheet-day-nav__btn {
  min-width: 2.25rem;
  padding-inline: var(--space-sm);
  font-size: 1rem;
  line-height: 1;
}
.timesheet-day-nav__date,
.timesheet-day-nav__month { width: auto; }
.timesheet-month-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.day-timeline--compact {
  margin-bottom: 0;
  padding: 0.125rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 50%, transparent);
}
.day-timeline--compact:last-child { border-bottom: none; }
.day-timeline--compact .day-timeline__header {
  margin-bottom: 0.0625rem;
  gap: 0.375rem;
  min-height: 0;
  line-height: 1.2;
}
.day-timeline--compact .day-timeline__date {
  font-size: 0.8125rem;
  font-weight: 500;
}
.day-timeline--compact .day-timeline__total {
  font-size: 0.75rem;
}
.day-timeline--compact .day-timeline__scale {
  display: none;
}
.day-timeline--compact .day-timeline__track {
  min-height: calc(var(--lane-count) * 1.25rem + 0.0625rem);
}
.day-timeline--compact .day-timeline__lane {
  top: calc(var(--lane) * 1.25rem + 0.03125rem);
  height: 1.125rem;
}
.day-timeline--compact .day-timeline__block {
  padding: 0 0.3rem;
  border-radius: 4px;
}
.day-timeline--compact .day-timeline__block-title {
  font-size: 0.6875rem;
  line-height: 1.125rem;
}
.day-timeline--compact .day-timeline__block-task,
.day-timeline--compact .day-timeline__block-time {
  display: none;
}
.day-timeline--compact .day-timeline__empty {
  min-height: 0.875rem;
  font-size: 0.625rem;
  padding: 0;
}
.day-timeline--compact .day-timeline__editor {
  margin-top: var(--space-sm);
  padding: var(--space-sm);
}
.day-timeline--collapsed {
  padding: 0.125rem 0;
}
.day-timeline--collapsed .day-timeline__header {
  margin-bottom: 0;
}
.day-timeline--collapsed .day-timeline__date {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--color-text-muted);
}
.day-timeline--collapsed .day-timeline__total {
  font-size: 0.6875rem;
}
.day-timeline--compact.day-timeline--empty-day {
  padding: 0.0625rem 0;
}
.day-timeline--compact.day-timeline--empty-day .day-timeline__header {
  margin-bottom: 0;
}
.day-timeline--empty-day .day-timeline__track {
  min-height: 0.875rem;
}
.day-timeline--empty-day .day-timeline__empty {
  min-height: 0.875rem;
  line-height: 0.875rem;
  font-size: 0.625rem;
  opacity: 0.65;
}
.day-timeline__context-backdrop {
  position: fixed;
  inset: 0;
  z-index: 200;
}
.day-timeline__context-menu {
  position: fixed;
  z-index: 201;
  min-width: 12rem;
  max-width: 16rem;
  max-height: 16rem;
  overflow-y: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  padding: var(--space-xs);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}
.day-timeline__context-menu__time {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  padding: 0.35rem 0.5rem;
  margin: 0 0 var(--space-xs);
  border-bottom: 1px solid var(--color-border);
  font-variant-numeric: tabular-nums;
}
.day-timeline__context-menu__empty {
  font-size: 0.75rem;
  padding: 0.35rem 0.5rem;
  margin: 0;
}
.day-timeline__context-menu__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.4rem 0.5rem;
  border: none;
  background: transparent;
  color: var(--color-text);
  font-family: inherit;
  font-size: 0.8125rem;
  text-align: left;
  cursor: pointer;
  border-radius: 4px;
}
.day-timeline__context-menu__item:hover {
  background: var(--color-hover-overlay);
}
.day-timeline__editor-actions {
  align-items: center;
  flex-wrap: wrap;
}
.day-timeline__editor-actions .app-btn--danger { margin-left: auto; }
.day-timeline:not(.day-timeline--compact) { margin-bottom: var(--space-lg); }
.day-timeline__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}
.day-timeline:not(.day-timeline--compact) .day-timeline__header {
  margin-bottom: var(--space-md);
}
.day-timeline__date {
  font-size: 1rem;
  font-weight: 500;
  text-transform: capitalize;
}
.day-timeline__zoom-bar {
  margin-bottom: var(--space-sm);
  gap: var(--space-md);
  flex-wrap: wrap;
}
.day-timeline__zoom-range {
  font-variant-numeric: tabular-nums;
}
.day-timeline__hint {
  white-space: nowrap;
}
.day-timeline__reset {
  font-size: 0.8125rem;
}
.day-timeline__viewport {
  overflow: hidden;
  border-radius: var(--radius-sm);
  touch-action: none;
}
.day-timeline__viewport--zoomed {
  cursor: grab;
}
.day-timeline__viewport--panning,
.day-timeline__viewport--panning .day-timeline__scale,
.day-timeline__viewport--panning .day-timeline__pan-surface {
  cursor: grabbing;
}
.day-timeline__scale {
  position: relative;
  height: 1.25rem;
  margin-bottom: var(--space-xs);
}
.day-timeline__viewport--zoomed .day-timeline__scale {
  cursor: grab;
}
.day-timeline__pan-surface {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.day-timeline__viewport--zoomed .day-timeline__pan-surface {
  cursor: grab;
}
.day-timeline__tick {
  position: absolute;
  transform: translateX(-50%);
  font-size: 0.65rem;
  color: var(--color-text-muted);
  letter-spacing: 0.02em;
}
.day-timeline__track {
  position: relative;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-bg);
  overflow: hidden;
  touch-action: none;
}
.day-timeline:not(.day-timeline--compact) .day-timeline__track {
  min-height: calc(var(--lane-count) * 2.75rem + 0.5rem);
}
.day-timeline__grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.day-timeline__grid-line {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--color-border);
  opacity: 0.35;
}
.day-timeline__lane {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
  pointer-events: none;
}
.day-timeline:not(.day-timeline--compact) .day-timeline__lane {
  top: calc(var(--lane) * 2.75rem + 0.25rem);
  height: 2.25rem;
}
.day-timeline__block {
  position: absolute;
  top: 0;
  height: 100%;
  min-width: 4px;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--block-color, var(--color-text-muted));
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  font-family: inherit;
  color: var(--color-text);
  transition: border-color 0.15s, background 0.15s;
  pointer-events: auto;
}
.day-timeline__block:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
}
.day-timeline__block--selected {
  border-color: var(--color-text-muted);
  background: var(--color-surface-2);
  z-index: 2;
}
.day-timeline__block--active {
  border-right-style: dashed;
}
.day-timeline__block-title {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.day-timeline__block-task,
.day-timeline__block-time {
  display: block;
  font-size: 0.65rem;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.day-timeline__resize {
  position: absolute;
  top: 0;
  width: 8px;
  height: 100%;
  cursor: ew-resize;
}
.day-timeline__resize--start {
  left: 0;
  background: linear-gradient(270deg, transparent, color-mix(in srgb, var(--block-color) 30%, transparent));
}
.day-timeline__resize--end {
  right: 0;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--block-color) 30%, transparent));
}
.day-timeline__empty {
  display: flex;
  align-items: center;
  justify-content: center;
}
.day-timeline:not(.day-timeline--compact) .day-timeline__empty {
  min-height: 4rem;
  font-size: 0.875rem;
}
.day-timeline__editor {
  margin-top: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.day-timeline__editor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
}
.day-timeline__editor-field {
  min-width: 0;
}
.day-timeline__editor-note {
  grid-column: 1 / -1;
}
.app-datetime-input {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.app-datetime-input .app-input {
  width: 100%;
  box-sizing: border-box;
}
.app-datetime-input__time {
  max-width: 7rem;
}
@media (pointer: coarse), (max-width: 768px) {
  .app-datetime-input__time {
    max-width: none;
    min-height: 2.75rem;
  }
  .day-timeline__resize {
    width: 22px;
  }
}
.app-datetime-input__time-label {
  display: block;
  margin: 0;
  font-size: 0.7rem;
  line-height: 1.2;
}
.day-timeline__error {
  color: var(--color-danger);
  font-size: 0.875rem;
  margin: 0 0 var(--space-sm);
}
.day-timeline__error--inline {
  margin-top: calc(-1 * var(--space-xs));
  margin-bottom: var(--space-sm);
}
@media (max-width: 640px) {
  .day-timeline__editor-grid { grid-template-columns: 1fr; }
  .day-timeline__editor-note { grid-column: auto; }
  .day-timeline__hint { display: none; }
}

@media (max-width: 640px) {
  .org-form-row .app-input,
  .org-form-row .app-select { min-width: 100%; }
}

/* ─── Mobile layout (desktop unchanged above) ─── */
@media (max-width: 768px) {
  .app-main {
    padding: var(--space-lg) var(--space-md);
  }
  .app-main:has(.tasks-page),
  .app-main:has(.plan-page),
  .app-main:has(.resources-page) {
    padding-inline: var(--space-sm);
  }

  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.125rem; }

  .app-nav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    height: var(--nav-height);
    padding: 0 var(--space-md);
    position: sticky;
  }
  .app-nav__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    margin-left: auto;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-text);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
    z-index: 402;
  }
  .app-nav__toggle:hover {
    border-color: var(--color-border-hover);
    background: var(--color-surface);
  }
  .app-nav__account {
    grid-column: auto;
    grid-row: auto;
    justify-self: auto;
    margin-left: var(--space-sm);
    flex-shrink: 0;
    z-index: 403;
  }
  .app-nav__actions {
    margin-right: 0;
  }
  .app-nav__backdrop {
    display: block;
    position: fixed;
    inset: var(--nav-height) 0 0 0;
    z-index: 99;
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
  }
  .app-nav__menu {
    display: none;
    position: fixed;
    top: var(--nav-height);
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 401;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    margin: 0;
    padding: var(--space-md);
    overflow-y: auto;
    background: var(--color-bg);
    border-top: 1px solid var(--color-border);
  }
  .app-nav--open .app-nav__menu {
    display: flex;
  }
  .app-nav__links {
    grid-column: auto;
    justify-self: stretch;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .app-nav__link {
    display: block;
    padding: var(--space-md) var(--space-sm);
    border-bottom: 1px solid var(--color-border);
    font-size: 0.9375rem;
  }
  .app-nav__actions {
    grid-column: auto;
    justify-self: stretch;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: var(--space-md);
    padding-top: var(--space-md);
    border-top: 1px solid var(--color-border);
  }
  .app-nav__actions .app-nav__link {
    border-bottom: 1px solid var(--color-border);
  }
  .app-nav__actions .theme-toggle {
    justify-content: flex-start;
    width: 100%;
    padding: var(--space-md) var(--space-sm);
    border-bottom: 1px solid var(--color-border);
    border-radius: 0;
  }
  .app-nav__start {
    min-width: 0;
    flex: 1;
  }
  .org-switcher__trigger {
    max-width: 9rem;
  }

  .flex-stack-mobile {
    flex-direction: column;
    align-items: stretch;
  }
  .flex-stack-mobile .app-btn,
  .flex-stack-mobile .app-btn--primary {
    width: 100%;
    text-align: center;
  }

  .stats-row {
    flex-direction: column;
    gap: var(--space-md);
    margin-bottom: var(--space-lg);
  }
  .timer-display {
    font-size: 2.25rem;
  }

  .grid-projects {
    grid-template-columns: 1fr;
  }

  .app-main:has(.dashboard-page) {
    padding-bottom: calc(8rem + env(safe-area-inset-bottom, 0px));
  }
  .app-main:has(.home-cockpit__grid) {
    padding-bottom: calc(11rem + env(safe-area-inset-bottom, 0px));
  }
  .app-main:has(.stamp-dock--many) {
    padding-bottom: calc(12.5rem + env(safe-area-inset-bottom, 0px));
  }
  .app-main:has(.stamp-dock--expanded) {
    padding-bottom: calc(17rem + env(safe-area-inset-bottom, 0px));
  }
  .dashboard-page {
    max-width: none;
  }
  .home-header {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
  }
  .home-header__stats {
    width: 100%;
    justify-content: flex-start;
  }
  .home-header__greeting {
    font-size: 1.375rem;
  }
  /* Dock haengt fixed unten – Kopfzeile wuerde verwaist im Inhalt stehen */
  .stamp-dock-wrap {
    margin-bottom: 0;
    gap: 0;
  }
  .stamp-dock-head,
  .stamp-dock-head__hint-text {
    display: none;
  }
  .home-cockpit__steering {
    margin-bottom: var(--space-md);
  }
  .home-cockpit__steering-scroll {
    margin-inline: calc(-1 * var(--space-md));
    padding-inline: var(--space-md);
    scroll-padding-inline: var(--space-md);
  }
  .home-kpi {
    scroll-snap-align: start;
  }
  .home-cockpit__steering-scroll {
    scroll-snap-type: x proximity;
  }
  .stamp-stats {
    gap: var(--space-lg);
  }
  .stamp-stats__label {
    font-size: 0.6875rem;
  }
  .stamp-stats__value {
    font-size: 1.375rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
  }
  .stamp-dock {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    margin: 0;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    padding-bottom: calc(var(--space-md) + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.4);
  }
  .stamp-dock--many .stamp-dock__picker,
  .stamp-dock--expanded .stamp-dock__picker {
    flex-wrap: wrap;
    overflow-x: hidden;
    overflow-y: auto;
    align-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }
  .stamp-dock--many .stamp-dock__picker {
    max-height: 7.5rem;
  }
  .stamp-dock--expanded .stamp-dock__picker {
    max-height: min(42vh, 14rem);
  }
  .stamp-dock--many .stamp-chip,
  .stamp-dock--expanded .stamp-chip {
    flex: 1 1 calc(50% - var(--space-xs));
    max-width: none;
  }
  .stamp-dock--many .stamp-chip__main,
  .stamp-dock--expanded .stamp-chip__main {
    flex: 1;
    min-width: 0;
    max-width: none;
    overflow: hidden;
  }
  .stamp-dock--expanded .stamp-chip {
    flex: 1 1 calc(33.333% - var(--space-xs));
  }
  .dashboard-page--panel-open .stamp-dock {
    z-index: 1099;
  }
  .dashboard-page--note-open .stamp-dock__picker {
    display: none;
  }
  .stamp-note-sheet.context-menu--sheet {
    top: max(env(safe-area-inset-top), var(--space-sm));
    bottom: auto;
    max-height: min(36vh, 11rem);
  }
  .stamp-note-sheet--pinned.context-menu--sheet {
    bottom: auto !important;
  }
  .stamp-note-sheet__input {
    font-size: 1rem;
    min-height: 2.75rem;
  }
  .stamp-hint-bar__mobile { display: inline; }
  .stamp-hint-bar__desktop { display: none; }
  .stamp-dock__elapsed.timer-display {
    font-size: 1rem;
  }
  .widget-focus-row {
    min-height: 2.75rem;
    padding: var(--space-sm) var(--space-md);
  }

  .project-form-name,
  .project-form-color {
    flex: 1 1 100%;
    min-width: 100%;
  }
  .org-form-row > .app-btn,
  .org-invite__actions > .app-btn {
    width: 100%;
  }
  .org-invite-role {
    max-width: none;
  }
  .org-org-list__item {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }
  .org-checklist__item {
    flex-direction: column;
    align-items: stretch;
  }
  .org-checklist__address {
    max-width: none;
    width: 100%;
  }
  .org-connector-toggle {
    padding: var(--space-md);
  }
  .org-connector-panel {
    padding: var(--space-md);
  }

  .timesheet-timeline-header {
    flex-direction: column;
    align-items: stretch;
  }
  .timesheet-timeline-header > .flex-between,
  .timesheet-timeline-header > .flex {
    width: 100%;
  }
  .timesheet-day-nav {
    width: 100%;
  }
  .timesheet-day-nav__date,
  .timesheet-day-nav__month {
    flex: 1;
    min-width: 0;
  }
  .timesheet-entry-row {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-xs);
  }
  .timesheet-entry-row__time,
  .timesheet-entry-row__duration {
    font-family: var(--font-mono);
    font-size: 0.8125rem;
    color: var(--color-text-muted);
  }

  .tasks-page {
    min-height: calc(100vh - var(--nav-height) - 2 * var(--space-lg));
  }
  .tasks-toolbar__project,
  .tasks-toolbar__filter {
    flex: 1 1 100%;
    min-width: 100%;
  }
  .tasks-toolbar__actions {
    margin-left: 0;
    width: 100%;
  }
  .task-detail-panel__grid {
    grid-template-columns: 1fr;
  }
  .task-detail-panel__grid > div:last-child {
    grid-column: auto;
  }

  .download-primary__inner {
    flex-direction: column;
    align-items: stretch;
  }
  .download-btn {
    width: 100%;
    text-align: center;
  }
  .download-platform {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }
  .download-platform .app-btn {
    width: 100%;
    text-align: center;
  }

  .auth-page {
    padding: var(--space-md);
    min-height: calc(100vh - var(--nav-height) - var(--space-lg));
  }
  .auth-card {
    padding: var(--space-lg);
  }

  .account-shell {
    grid-template-columns: 1fr;
  }
  .account-shell__nav {
    border-right: none;
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-sm);
    overflow-x: auto;
  }
  .account-nav {
    flex-direction: row;
    flex-wrap: nowrap;
    gap: var(--space-xs);
  }
  .account-nav__link {
    white-space: nowrap;
    flex-shrink: 0;
  }
  .account-shell__content {
    padding: var(--space-lg);
  }
  .account-table td {
    display: block;
    text-align: left;
    border-bottom: none;
    padding-bottom: 0;
  }
  .account-table td:last-child {
    text-align: left;
    padding-top: var(--space-xs);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid var(--color-border);
  }
  .account-table .account-actions {
    justify-content: flex-start;
  }
}

.app-main:has(.analytics-page) { max-width: 1280px; }

/* Analytics */
.analytics-page { display: flex; flex-direction: column; gap: var(--space-lg); }
.analytics-page__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-lg);
}
.analytics-page__back { display: inline-block; margin-bottom: var(--space-sm); }
.analytics-page__controls {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-sm);
}
.analytics-page__org-select { min-width: 12rem; }
.analytics-page__presets { display: flex; flex-wrap: wrap; gap: var(--space-xs); justify-content: flex-end; }
.analytics-page__preset { padding: 0.35rem 0.75rem; font-size: 0.8125rem; }
.analytics-page__preset--active {
  border-color: var(--color-text-muted);
  background: var(--color-surface-2);
}
.analytics-page__range {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-sm);
  justify-content: flex-end;
}
.analytics-page__range-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.analytics-page__range-field .app-input { min-width: 9rem; }
.analytics-page__range-apply { padding: 0.35rem 0.75rem; font-size: 0.8125rem; }
.analytics-page__range-error { margin: 0; text-align: right; width: 100%; }
.analytics-page__content--refreshing { opacity: 0.55; pointer-events: none; }
.analytics-page__kpis { flex-wrap: wrap; }
.h-bar-chart__row--clickable { cursor: pointer; }
.h-bar-chart__row--clickable:hover .h-bar-chart__label { color: var(--color-text); }
.analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
}
.analytics-card__title {
  margin: 0 0 var(--space-xs);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text);
}
.analytics-card__subtitle { margin: 0 0 var(--space-md); }
.analytics-card--wide { grid-column: 1 / -1; }

.analytics-timeline__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-md);
}
.analytics-timeline__header .analytics-card__subtitle { margin-bottom: 0; }
.analytics-timeline__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
  justify-content: flex-end;
}
.analytics-timeline__member-select { min-width: 10rem; }
.analytics-timeline__day-label {
  font-size: 0.875rem;
  color: var(--color-text-muted);
  min-width: 10rem;
  text-align: center;
}
.analytics-timeline-month {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.analytics-timeline-month .day-timeline--compact {
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-xs) var(--space-sm);
}
.analytics-timeline-month .day-timeline--compact:last-child { border-bottom: none; }
.analytics-timeline-month .day-timeline--compact .day-timeline__header {
  padding: 0;
  margin-bottom: 2px;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__date {
  font-size: 0.75rem;
  min-width: 4.5rem;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__total {
  font-size: 0.6875rem;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__scale {
  height: 14px;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__track {
  min-height: 22px;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__lane {
  height: 20px;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__block {
  font-size: 0.625rem;
  padding: 1px 4px;
  border-radius: 3px;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__block-title {
  font-size: 0.625rem;
}
.analytics-timeline-month .day-timeline--compact .day-timeline__block-task,
.analytics-timeline-month .day-timeline--compact .day-timeline__block-time {
  display: none;
}
.analytics-timeline .day-timeline--readonly .day-timeline__viewport {
  cursor: default;
}
.analytics-timeline .day-timeline--readonly .day-timeline__block--readonly {
  cursor: default;
  pointer-events: auto;
}

.h-bar-chart { display: flex; flex-direction: column; gap: var(--space-sm); }
.h-bar-chart__row {
  display: grid;
  grid-template-columns: minmax(5rem, 7rem) 1fr auto;
  gap: var(--space-sm);
  align-items: center;
}
.h-bar-chart__label {
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.h-bar-chart__track {
  height: 8px;
  background: var(--color-surface-2);
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--color-border);
}
.h-bar-chart__fill {
  height: 100%;
  background: var(--color-text-muted);
  border-radius: 999px;
  min-width: 2px;
  transition: width 0.35s ease;
}
.h-bar-chart__value {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.donut-chart {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-lg);
  align-items: center;
}
.donut-chart__visual { position: relative; width: 120px; height: 120px; flex-shrink: 0; }
.donut-chart__svg { width: 120px; height: 120px; display: block; }
.donut-chart__center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.donut-chart__center-value { font-family: var(--font-mono); font-size: 0.95rem; }
.donut-chart__center-sub { font-size: 0.7rem; color: var(--color-text-muted); }
.donut-chart__legend { display: flex; flex-direction: column; gap: var(--space-xs); min-width: 0; }
.donut-chart__legend-row {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  gap: var(--space-sm);
  align-items: center;
  font-size: 0.8125rem;
}
.donut-chart__legend-dot { width: 8px; height: 8px; border-radius: 50%; }
.donut-chart__legend-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.donut-chart__legend-value { color: var(--color-text-muted); font-family: var(--font-mono); font-size: 0.75rem; }

.column-chart__plot {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  height: 140px;
  padding-top: var(--space-sm);
}
.column-chart__col { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: var(--space-xs); }
.column-chart__bar-wrap {
  width: 100%;
  height: 110px;
  display: flex;
  align-items: flex-end;
}
.column-chart__bar {
  width: 100%;
  min-height: 2px;
  background: var(--color-text-muted);
  border-radius: 3px 3px 0 0;
  transition: height 0.35s ease;
}
.column-chart__label {
  font-size: 0.65rem;
  color: var(--color-text-muted);
  text-align: center;
}

.area-chart__svg { width: 100%; height: 140px; display: block; }
.area-chart__line {
  stroke: var(--color-text);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}
.area-chart__dot { fill: var(--color-text); }
.area-chart__labels {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-xs);
  font-size: 0.7rem;
  color: var(--color-text-muted);
}

.stacked-bar-chart { display: flex; flex-direction: column; gap: var(--space-sm); }
.stacked-bar-chart__row {
  display: grid;
  grid-template-columns: minmax(5rem, 7rem) 1fr auto;
  gap: var(--space-sm);
  align-items: center;
}
.stacked-bar-chart__label {
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stacked-bar-chart__track {
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--color-border);
  background: var(--color-surface-2);
}
.stacked-bar-chart__segment { height: 100%; min-width: 2px; }
.stacked-bar-chart__value {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}

.stamp-split { display: flex; flex-direction: column; gap: var(--space-md); }
.stamp-split__bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--color-border);
  background: var(--color-surface-2);
}
.stamp-split__segment { height: 100%; min-width: 2px; }
.stamp-split__segment--task { background: var(--color-text); }
.stamp-split__segment--project { background: var(--color-text-muted); }
.stamp-split__legend { display: flex; flex-direction: column; gap: var(--space-sm); }
.stamp-split__legend-row {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  gap: var(--space-sm);
  align-items: center;
  font-size: 0.8125rem;
}
.stamp-split__dot { width: 8px; height: 8px; border-radius: 50%; }
.stamp-split__dot--task { background: var(--color-text); }
.stamp-split__dot--project { background: var(--color-text-muted); }
.stamp-split__value { font-family: var(--font-mono); font-size: 0.75rem; color: var(--color-text-muted); }

@media (max-width: 900px) {
  .analytics-grid { grid-template-columns: 1fr; }
  .analytics-card--wide { grid-column: auto; }
  .donut-chart { grid-template-columns: 1fr; justify-items: center; }
  .analytics-page__controls { align-items: stretch; }
  .analytics-page__presets { justify-content: flex-start; }
}

@media (max-width: 640px) {
  .kanban-col {
    flex: 0 0 85vw;
    max-width: 320px;
  }
  .h-bar-chart__row,
  .stacked-bar-chart__row {
    grid-template-columns: 1fr;
    gap: var(--space-xs);
  }
  .h-bar-chart__value,
  .stacked-bar-chart__value { justify-self: start; }
}

/* System admin */
.app-main:has(.system-admin-page) { max-width: 1100px; }
.system-admin-page { display: flex; flex-direction: column; gap: var(--space-lg); }
.system-admin-page__header h1 { margin-bottom: var(--space-xs); }
.system-admin-page__stats { flex-wrap: wrap; }
.system-admin-tabs {
  display: flex;
  gap: var(--space-xs);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: var(--space-sm);
}
.system-admin-tabs__tab {
  padding: 0.4rem 0.9rem;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-family: inherit;
  font-size: 0.875rem;
  cursor: pointer;
}
.system-admin-tabs__tab:hover { color: var(--color-text); background: var(--color-surface-2); }
.system-admin-tabs__tab--active {
  color: var(--color-text);
  border-color: var(--color-border);
  background: var(--color-surface);
}
.system-admin-table-wrap { overflow-x: auto; }
.system-admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.system-admin-table th {
  text-align: left;
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0 0 var(--space-sm);
  border-bottom: 1px solid var(--color-border);
}
.system-admin-table td {
  padding: var(--space-sm) var(--space-sm) var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
}
.system-admin-table tr:last-child td { border-bottom: none; }
.system-admin-table__mono { font-family: var(--font-mono); font-size: 0.8125rem; }
.system-admin-chips { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.system-admin-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 0.2rem 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  font-size: 0.75rem;
  background: var(--color-surface-2);
}
.system-admin-chip__role {
  color: var(--color-text-muted);
  font-size: 0.65rem;
}
.system-admin-org-list { display: flex; flex-direction: column; gap: var(--space-md); }
.system-admin-org__name {
  margin: 0 0 var(--space-xs);
  font-size: 1rem;
  font-weight: 500;
}
.system-admin-org__header { margin-bottom: var(--space-md); }
.system-admin-table--compact td,
.system-admin-table--compact th { padding-top: var(--space-xs); padding-bottom: var(--space-xs); }

.directory-admin { display: flex; flex-direction: column; gap: var(--space-md); }
.directory-admin__title { margin: 0; font-size: 1.125rem; }
.directory-admin__subtitle { margin: var(--space-sm) 0 0; font-size: 1rem; }
.directory-admin__enable { margin-top: var(--space-xs); }
.directory-admin__field { display: flex; flex-direction: column; gap: var(--space-xs); }
.directory-admin__redirect { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); }
.directory-admin__uri {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  word-break: break-all;
}
.directory-admin__warn,
.directory-admin__restart,
.directory-admin__status--error { color: var(--color-danger, #f87171); }
.directory-admin__status--ok { color: var(--color-text-muted); }
.directory-admin__actions { display: flex; gap: var(--space-sm); }

.app-main:has(.plan-page) {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* Plan / Gantt */
.plan-page {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  max-width: 100%;
  overflow: hidden;
}
.plan-page__header,
.plan-page__toolbar,
.plan-page > .plan-tabs {
  flex-shrink: 0;
}
.plan-page__header {
  margin-top: 0;
}
.plan-page__header h1 { margin-bottom: var(--space-sm); }
.plan-page__header-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.plan-page__subtitle { margin: var(--space-xs) 0 0; max-width: 42rem; }
.plan-page__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-bottom: var(--space-md);
  align-items: flex-end;
}
.plan-page__pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
  margin-top: var(--space-md);
}
.plan-page__filter { min-width: 180px; }
.plan-page__filter--grow {
  flex: 1 1 16rem;
  min-width: 12rem;
  max-width: 28rem;
}
.plan-page__filter--chips {
  min-width: 0;
  display: flex;
  align-items: flex-end;
}
.plan-page__view-filters {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--color-view-filter-border);
  border-radius: var(--radius-sm);
}
.plan-page__view-filters--wrap {
  flex-wrap: wrap;
}
.plan-page__view-filter {
  border: none;
  background: transparent;
  padding: 0.35rem 0.65rem;
  font-size: 0.8125rem;
  font-family: inherit;
  color: var(--color-view-filter-text);
  cursor: pointer;
  border-radius: calc(var(--radius-sm) - 2px);
  line-height: 1.2;
  white-space: nowrap;
  transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}
.plan-page__view-filter:hover {
  color: var(--color-view-filter-text-hover);
  background: var(--color-view-filter-hover-bg);
}
.plan-page__view-filter--active {
  background: var(--color-view-filter-active-bg);
  color: var(--color-view-filter-active-text);
  box-shadow: inset 0 0 0 1px var(--color-view-filter-active-ring);
  font-weight: 500;
}
.plan-page__view-filter--active:hover {
  color: var(--color-view-filter-active-text);
  background: var(--color-view-filter-active-bg);
}
.plan-page__view-filters--scroll {
  max-height: 6.5rem;
  overflow-y: auto;
}
.plan-page__body {
  flex: 1;
  display: flex;
  align-items: stretch;
  gap: var(--space-md);
  min-height: 0;
  margin-top: var(--space-sm);
}

/* Timeline: kompakt, Gantt maximal nach oben */
.plan-page--timeline > .plan-tabs {
  margin-bottom: var(--space-sm);
  padding-bottom: var(--space-xs);
}
.plan-page--timeline .plan-page__toolbar--compact {
  margin-bottom: var(--space-xs);
  gap: var(--space-sm);
  align-items: center;
}
.plan-page--timeline .plan-page__filter--project {
  min-width: 0;
  flex: 0 1 12rem;
}
.plan-page--timeline .plan-page__filter--project .app-select {
  width: 100%;
  min-width: 8rem;
}
.plan-page--timeline .plan-page__filter--action {
  min-width: 0;
  flex-shrink: 0;
}
.plan-page--timeline .plan-page__filter--grow {
  flex: 1 1 10rem;
  min-width: 8rem;
  max-width: 18rem;
}
.plan-page--timeline .plan-page__filter--chips {
  flex: 0 1 auto;
  align-items: center;
}

/* Toolbar-Zeile kompakt: Button, Suche und Filter auf gleicher Höhe; Schrift wie plan-tabs */
.plan-page--timeline .plan-page__toolbar--compact .app-btn {
  padding: 0.3rem 0.75rem;
  font-size: 0.875rem;
  line-height: 1.25;
  min-height: 1.875rem;
  box-sizing: border-box;
}
.plan-page--timeline .plan-page__toolbar--compact .app-input {
  padding: 0.3rem 0.65rem;
  font-size: 0.875rem;
  line-height: 1.25;
  min-height: 1.875rem;
  height: 1.875rem;
  box-sizing: border-box;
}
.plan-page--timeline .plan-page__toolbar--compact .plan-page__view-filters {
  min-height: 1.875rem;
  align-items: stretch;
  box-sizing: border-box;
}
.plan-page--timeline .plan-page__toolbar--compact .plan-page__view-filter {
  padding: 0.3rem 0.6rem;
  font-size: 0.875rem;
  line-height: 1.25;
  display: inline-flex;
  align-items: center;
}
.plan-page--timeline .plan-page__body {
  margin-top: 0;
}
.plan-page--timeline .gantt__toolbar {
  padding: var(--space-xs) var(--space-sm);
}
.plan-page--timeline .gantt__hint--desktop {
  display: none;
}
.plan-page--gantt-fullscreen {
  position: fixed;
  inset: var(--nav-height) 0 0 0;
  z-index: 85;
  background: var(--color-bg);
  padding: var(--space-sm) var(--space-md);
  max-width: none;
}
.plan-page--gantt-fullscreen > .plan-tabs,
.plan-page--gantt-fullscreen > .plan-page__toolbar {
  display: none;
}
.plan-page--gantt-fullscreen .plan-page__body {
  margin-top: 0;
  height: 100%;
}
.gantt__fullscreen-btn {
  font-size: 1rem;
  line-height: 1;
  padding-inline: 0.35rem;
}
.gantt__fullscreen-btn[aria-pressed="true"],
.gantt__dense-btn[aria-pressed="true"] {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  border-radius: var(--radius-sm);
}
.gantt__dense-btn {
  font-size: 0.8125rem;
  padding-inline: 0.45rem;
}
.plan-page__gantt {
  flex: 1;
  min-width: 0;
  min-height: 0;
  width: 100%;
  overflow: hidden;
}
.plan-page__body--with-panel .plan-page__gantt {
  min-width: 0;
}
@media (min-width: 769px) {
  .plan-page__body--with-panel {
    gap: 0;
  }
  .plan-page__panel {
    display: flex;
    min-height: 0;
    min-width: 0;
  }
  .plan-page__panel .task-detail-panel {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    max-height: 100%;
  }
  .plan-page__body--with-panel:not(.plan-page__body--dual-panel) .plan-page__panel--task {
    flex: 0 0 var(--task-panel-width, 360px);
    min-width: 280px;
  }
  .plan-page__body--with-panel:not(.plan-page__body--dual-panel) .plan-page__panel--milestone {
    flex: 0 0 var(--detail-panel-width, 360px);
    min-width: 280px;
  }
  .plan-page__body--dual-panel .plan-page__panel--task {
    flex: 0 0 var(--task-panel-width, 320px);
    min-width: 280px;
  }
  .plan-page__body--dual-panel .plan-page__panel--milestone {
    flex: 0 0 var(--detail-panel-width, 360px);
    min-width: 280px;
  }
  .plan-page__panel-resizer {
    flex: 0 0 10px;
    position: relative;
    cursor: col-resize;
    touch-action: none;
    user-select: none;
    align-self: stretch;
    margin: 0 -2px;
    z-index: 2;
  }
  .plan-page__panel-resizer::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    background: var(--color-border);
    transition: width 0.12s ease, background 0.12s ease;
  }
  .plan-page__panel-resizer:hover::after,
  .plan-page__panel-resizer--active::after,
  .plan-page__panel-resizer:focus-visible::after {
    width: 3px;
    background: color-mix(in srgb, var(--color-text) 35%, var(--color-border));
  }
  .plan-page__body--resizing {
    cursor: col-resize;
    user-select: none;
  }
  .plan-page__body--resizing .plan-page__gantt,
  .plan-page__body--resizing .plan-page__panel {
    pointer-events: none;
  }
  .plan-page__body--resizing .plan-page__panel-resizer {
    pointer-events: auto;
  }
}
.plan-page__panel-backdrop {
  display: none;
}
@media (max-width: 768px) {
  .plan-page__panel-resizer {
    display: none;
  }
  .plan-page__panel-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 900;
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
  }
  .plan-page__body--with-panel:not(.plan-page__body--dual-panel) .plan-page__panel:not(.plan-page__panel--coverage) {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 901;
    flex: none;
    width: 100%;
    max-height: min(88vh, 100%);
  }
  .plan-page__body--with-panel:not(.plan-page__body--dual-panel) .plan-page__panel:not(.plan-page__panel--coverage) .task-detail-panel {
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    border-bottom: none;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
    max-height: min(88vh, 100%);
  }
  .plan-page__body--dual-panel .plan-page__panel--task {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 901;
    flex: none;
    width: 100%;
    max-height: min(88vh, 100%);
  }
  .plan-page__body--dual-panel .plan-page__panel--task .task-detail-panel {
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    border-bottom: none;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
    max-height: min(88vh, 100%);
  }
  .plan-page__body--dual-panel .plan-page__panel--milestone {
    display: none;
  }
  .plan-page__body--with-panel .plan-page__panel .task-detail-panel__footer {
    padding-bottom: calc(var(--space-md) + env(safe-area-inset-bottom, 0px));
  }
}

.gantt {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: 100%;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: hidden;
}
.gantt__toolbar {
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--color-border);
  gap: var(--space-md);
  flex-wrap: wrap;
  flex-shrink: 0;
}
.gantt__view-modes {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--color-view-filter-border);
  border-radius: var(--radius-sm);
}
.gantt__view-mode {
  border: none;
  background: transparent;
  padding: 0.2rem 0.55rem;
  font-size: 0.75rem;
  color: var(--color-view-filter-text);
  cursor: pointer;
  border-radius: calc(var(--radius-sm) - 2px);
  line-height: 1.2;
  transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}
.gantt__view-mode:hover {
  color: var(--color-view-filter-text-hover);
  background: var(--color-view-filter-hover-bg);
}
.gantt__view-mode--active {
  background: var(--color-view-filter-active-bg);
  color: var(--color-view-filter-active-text);
  box-shadow: inset 0 0 0 1px var(--color-view-filter-active-ring);
  font-weight: 500;
}
.gantt__view-mode--active:hover {
  color: var(--color-view-filter-active-text);
  background: var(--color-view-filter-active-bg);
}
.gantt__hint { display: none; }
.gantt__hint--desktop { display: none; }
.gantt__hint--touch-read,
.gantt__hint--touch-edit { display: none; }
@media (min-width: 900px) { .gantt__hint--desktop { display: inline; } }
.gantt--touch .gantt__hint--desktop { display: none; }
.gantt--touch.gantt--readonly .gantt__hint--touch-read { display: inline; }
.gantt--touch:not(.gantt--readonly) .gantt__hint--touch-edit { display: inline; }
.gantt__edit-toggle {
  display: none;
  align-items: center;
  padding: 0.25rem 0.6rem;
  border: 1px solid var(--color-view-filter-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-view-filter-text);
  font-size: 0.75rem;
  line-height: 1.2;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.gantt--touch .gantt__edit-toggle { display: inline-flex; }
.gantt__edit-toggle:hover {
  color: var(--color-view-filter-text-hover);
  background: var(--color-view-filter-hover-bg);
}
.gantt__edit-toggle--active {
  color: var(--color-view-filter-active-text);
  background: var(--color-view-filter-active-bg);
  border-color: var(--color-view-filter-active-ring);
  font-weight: 500;
}
.gantt__error {
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  color: var(--color-danger, #e55);
  font-size: 0.875rem;
}
.gantt__frame {
  display: grid;
  grid-template-columns: var(--gantt-sidebar-width, 260px) 10px 1fr;
  grid-template-rows: 1fr;
  flex: 1;
  min-height: 0;
  min-width: 0;
}
.gantt__sidebar {
  display: flex;
  flex-direction: column;
  border-right: none;
  overflow: hidden;
  background: var(--color-surface);
  min-width: 0;
  min-height: 0;
}
.gantt__sidebar-resizer {
  position: relative;
  cursor: col-resize;
  touch-action: none;
  user-select: none;
  z-index: 2;
}
.gantt__sidebar-resizer::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  background: var(--color-border);
  transition: width 0.12s ease, background 0.12s ease;
}
.gantt__sidebar-resizer:hover::after,
.gantt__sidebar-resizer--active::after,
.gantt__sidebar-resizer:focus-visible::after {
  width: 3px;
  background: color-mix(in srgb, var(--color-text) 35%, var(--color-border));
}
.gantt__frame--sidebar-resizing {
  cursor: col-resize;
  user-select: none;
}
.gantt__frame--sidebar-resizing .gantt__sidebar,
.gantt__frame--sidebar-resizing .gantt__timeline-col {
  pointer-events: none;
}
.gantt__sidebar-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.gantt__timeline-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}
.gantt__timeline-head {
  flex-shrink: 0;
  overflow: hidden;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}
.gantt__sidebar-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-sm) var(--space-md);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
}
.gantt__sidebar-toggle {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  line-height: 1;
  cursor: pointer;
}
.gantt__sidebar-toggle:hover {
  color: var(--color-text);
  border-color: var(--color-border-hover);
}
.gantt__sidebar-head-text { min-width: 0; }
.gantt__label {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  min-height: 2.25rem;
  min-width: 0;
  overflow: hidden;
  padding: 0 var(--space-md);
  padding-left: calc(var(--space-md) + var(--indent, 0) * 1rem);
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 45%, transparent);
  font-size: 0.875rem;
}
.gantt__label--project { font-weight: 500; }
.gantt__label--milestone { font-weight: 500; font-size: 0.8125rem; color: var(--color-text-muted); }
.gantt__reorder-handle {
  flex-shrink: 0;
  width: 1rem;
  color: var(--color-text-muted);
  cursor: grab;
  user-select: none;
  text-align: center;
  line-height: 1;
  opacity: 0.45;
}
.gantt__label--milestone:hover .gantt__reorder-handle { opacity: 1; }
.gantt__label--task:hover .gantt__reorder-handle { opacity: 1; }
.gantt__reorder-handle:active { cursor: grabbing; }
.gantt__label--reorder-dragging {
  opacity: 0.65;
  background: color-mix(in srgb, var(--color-surface-2) 70%, transparent);
}
.gantt__label--drop-before {
  box-shadow: inset 0 2px 0 var(--color-text-muted);
}
.gantt__label--drop-after {
  box-shadow: inset 0 -2px 0 var(--color-text-muted);
}
.gantt__label--milestone.gantt__label--drop-after {
  background: color-mix(in srgb, var(--color-surface-2) 40%, transparent);
}
.gantt__criteria-chip {
  flex-shrink: 0;
  padding: 0 0.35rem;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  color: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}
.gantt__row--milestone:not(.gantt__row--virtual) { position: relative; }
.gantt__bar--milestone {
  opacity: 0.55;
  border-style: dashed;
  pointer-events: none;
}
.gantt__milestone-target {
  position: absolute;
  width: 2px;
  margin-left: -1px;
  background: color-mix(in srgb, var(--milestone-color) 70%, transparent);
  pointer-events: none;
  z-index: 2;
}
.gantt__milestone-target--selected {
  width: 3px;
  margin-left: -1.5px;
  background: var(--milestone-color);
  z-index: 3;
}
.milestone-detail-panel__criteria-list {
  list-style: none;
  margin: 0 0 var(--space-sm);
  padding: 0;
}
.milestone-detail-panel__criteria-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-xs);
}
.milestone-detail-panel__header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}
.milestone-detail-panel__export-download,
.milestone-detail-panel__pdf-download {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}
.milestone-detail-panel__export-icon,
.milestone-detail-panel__pdf-icon {
  width: 0.95rem;
  height: 0.95rem;
}
.milestone-excel-dialog__layout {
  min-height: 12rem;
}
.milestone-excel-dialog__error {
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  color: var(--color-danger, #e57373);
}
.milestone-pdf-dialog {
  position: fixed;
  z-index: 1101;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(24rem, calc(100vw - 2rem));
  max-height: min(80vh, 32rem);
  padding: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
/* .context-menu sets max-width: 280px / max-height: 240px — override for sheet dialogs */
.context-menu.milestone-pdf-dialog {
  min-width: 0;
  max-width: none;
  max-height: none;
  overflow: hidden;
  padding: 0;
}
.context-menu.milestone-pdf-dialog--wide {
  width: min(68rem, calc(100vw - 1.5rem));
  max-width: min(68rem, calc(100vw - 1.5rem));
  min-height: min(78vh, 46rem);
  max-height: min(96vh, 52rem);
}
.milestone-pdf-dialog__body {
  padding: var(--space-md);
  overflow: auto;
  flex: 1;
  min-height: 0;
}
.milestone-pdf-dialog__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(14rem, 0.85fr);
  gap: var(--space-md);
  align-items: start;
}
.milestone-pdf-dialog__settings {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}
.milestone-pdf-dialog__panel {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
}
.milestone-pdf-dialog__panel-title {
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  border-bottom: 1px solid var(--color-border);
}
.milestone-pdf-dialog__panel-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-md);
}
.milestone-pdf-dialog__panel-body--options {
  gap: 0.35rem;
}
.milestone-pdf-dialog__field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}
.milestone-pdf-dialog__field--scope-layout {
  margin-top: var(--space-xs);
  padding-top: var(--space-sm);
  border-top: 1px dashed var(--color-border);
}
.milestone-pdf-dialog__subgroup {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-left: var(--space-md);
  padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md);
  border-left: 2px solid var(--color-border);
  border-radius: 0 8px 8px 0;
  background: color-mix(in srgb, var(--color-border) 12%, transparent);
}
.milestone-pdf-dialog__subgroup-label {
  margin: 0 0 0.15rem;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.milestone-pdf-dialog__preview {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}
.milestone-pdf-dialog__preview-title {
  margin: 0;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.milestone-pdf-dialog__preview-sheet {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: var(--space-md);
  min-height: 22rem;
  max-height: calc(96vh - 10rem);
  overflow: auto;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-bg) 70%, #fff 2%);
  box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
}
.milestone-pdf-dialog__preview-item {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  padding: 0.3rem 0.45rem;
  border-radius: 6px;
  font-size: 0.8125rem;
  line-height: 1.35;
  transition: opacity 0.12s ease, background 0.12s ease;
}
.milestone-pdf-dialog__preview-item--level-1 {
  margin-left: var(--space-md);
  font-size: 0.75rem;
}
.milestone-pdf-dialog__preview-item--on {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-border) 18%, transparent);
}
.milestone-pdf-dialog__preview-item--off {
  opacity: 0.42;
  text-decoration: line-through;
  text-decoration-color: color-mix(in srgb, var(--color-text-muted) 70%, transparent);
}
.milestone-pdf-dialog__preview-item--muted {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  background: transparent;
  opacity: 0.75;
  text-decoration: none;
}
.milestone-pdf-dialog__preview-prefix {
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  color: var(--color-text-muted);
  font-size: 0.75rem;
}
.milestone-pdf-dialog__preview-label {
  min-width: 0;
  word-break: break-word;
}
.milestone-pdf-dialog__preview-hint {
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  text-decoration: none;
}
.milestone-pdf-dialog__preview-divider {
  height: 1px;
  margin: 0.2rem 0;
  background: var(--color-border);
}
.milestone-pdf-dialog__preview-break {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0.15rem 0;
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.milestone-pdf-dialog__preview-break::before,
.milestone-pdf-dialog__preview-break::after {
  content: "";
  flex: 1;
  height: 1px;
  background: repeating-linear-gradient(
    90deg,
    var(--color-border),
    var(--color-border) 4px,
    transparent 4px,
    transparent 8px
  );
}
@media (max-width: 52rem) {
  .context-menu.milestone-pdf-dialog--wide {
    width: calc(100vw - 1rem);
    max-width: calc(100vw - 1rem);
    min-height: min(88vh, 40rem);
    max-height: 98vh;
  }
  .milestone-pdf-dialog__layout {
    grid-template-columns: 1fr;
  }
  .milestone-pdf-dialog__preview {
    position: static;
    order: -1;
  }
  .milestone-pdf-dialog__preview-sheet {
    min-height: 10rem;
    max-height: 14rem;
  }
  .milestone-pdf-dialog__field-row {
    grid-template-columns: 1fr;
  }
}
.milestone-pdf-dialog__lead { margin: 0 0 var(--space-sm); }
.milestone-pdf-dialog__options {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.milestone-pdf-dialog__option {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  cursor: pointer;
  font-size: 0.875rem;
}
.milestone-pdf-dialog__option input { accent-color: var(--color-text); }
.milestone-pdf-dialog__option--nested {
  margin-left: var(--space-lg);
  color: var(--color-text-muted);
}
.milestone-pdf-dialog__group-label {
  margin: var(--space-sm) 0 0;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.milestone-pdf-dialog__group-label:first-child { margin-top: 0; }
.milestone-pdf-dialog__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.milestone-pdf-dialog__footer {
  display: flex;
  gap: var(--space-sm);
  justify-content: flex-end;
  padding: var(--space-md);
  border-top: 1px solid var(--color-border);
}
.milestone-pdf-dialog__signature {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}
.milestone-pdf-dialog__signature-text { resize: vertical; min-height: 4.5rem; }
.milestone-detail-panel__criteria-item {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-xs);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 40%, transparent);
}
.milestone-detail-panel__criteria-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
}
.milestone-detail-panel__criteria-label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  flex: 1;
  min-width: 0;
  cursor: pointer;
}
.milestone-detail-panel__criteria-done,
.milestone-detail-panel__linked-task--done .milestone-detail-panel__linked-task-btn,
.milestone-detail-panel__task-item--done .milestone-detail-panel__task-btn,
.milestone-detail-panel__criterion-link-label--done {
  color: var(--color-text-muted);
}
.milestone-detail-panel__task-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.75rem;
  height: 0.75rem;
  flex-shrink: 0;
  border: 1px solid color-mix(in srgb, var(--color-text) 28%, var(--color-border));
  border-radius: 2px;
  font-size: 0.625rem;
  line-height: 1;
  color: var(--color-text-muted);
  pointer-events: none;
}
.milestone-detail-panel__task-status--open {
  opacity: 0.65;
}
.milestone-detail-panel__task-status--done {
  opacity: 0.9;
}
.milestone-detail-panel__linked-task {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.milestone-detail-panel__task-row {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}
.milestone-detail-panel__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.milestone-detail-panel__criteria-add { align-items: center; margin-top: var(--space-sm); }
.milestone-detail-panel__task-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.milestone-detail-panel__tasks { margin-top: var(--space-md); }
.gantt__label-text {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gantt__label-text--done { text-decoration: line-through; color: var(--color-text-muted); }
.gantt__label-text--onhold { font-style: italic; color: var(--color-text-muted); }
.gantt__label-text--outofscope { color: var(--color-text-muted); text-decoration: line-through; text-decoration-style: dashed; }
.gantt__label--muted { opacity: 0.45; }
.gantt__label--mine .gantt__label-text { font-weight: 500; }
.gantt__label--blocking .gantt__label-text { font-weight: 500; }
.gantt__blocking-dot {
  flex-shrink: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--color-warning);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-warning) 35%, var(--color-bg));
}
.gantt__label--selected { background: color-mix(in srgb, var(--color-surface-2) 80%, transparent); }
.gantt__label-btn {
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  min-width: 0;
  flex: 1;
  text-align: left;
  cursor: pointer;
  color: inherit;
  font: inherit;
}
.gantt__label-btn:hover .gantt__label-text { color: var(--color-text); }
.gantt__assignee {
  flex-shrink: 1;
  margin-left: auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 40%;
}
.gantt__collapse {
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  padding: 0;
  width: 1rem;
  font-size: 0.75rem;
}
.gantt__timeline-wrap {
  flex: 1;
  min-height: 0;
  /* Horizontal nur per Pan/Time-Nav – native H-Scrollbar würde mit der Time-Nav doppelt wirken. */
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
  outline: none;
}
.gantt__timeline-wrap--dragging,
.gantt__timeline-wrap--panning {
  user-select: none;
}
.gantt__timeline-wrap--panning {
  cursor: grabbing;
}
.gantt__header {
  position: relative;
  z-index: 2;
  height: 2rem;
  min-width: 100%;
  cursor: grab;
}
.gantt__timeline-wrap--panning .gantt__header {
  cursor: grabbing;
}
.gantt__time-nav {
  flex-shrink: 0;
  padding: 0.35rem var(--space-sm);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface);
}
.gantt__time-nav-track {
  position: relative;
  height: 0.5rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-border) 55%, transparent);
  cursor: pointer;
}
.gantt__time-nav-thumb {
  position: absolute;
  top: 0;
  height: 100%;
  min-width: 0.5rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 35%, transparent);
  pointer-events: none;
  transition: background 0.12s ease;
}
.gantt__time-nav-track:hover .gantt__time-nav-thumb {
  background: color-mix(in srgb, var(--color-text) 50%, transparent);
}
.gantt__tick {
  position: absolute;
  top: 0.35rem;
  transform: translateX(-50%);
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}
.gantt__tick--major {
  font-weight: 500;
  color: var(--color-text);
}
.gantt__rows {
  position: relative;
}
.gantt__grid-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.gantt__virtual-track {
  position: relative;
  width: 100%;
}
.gantt__deps {
  position: absolute;
  inset: 0;
  width: 100%;
  pointer-events: none;
  overflow: visible;
  z-index: 0;
}
.gantt__dep-line {
  fill: none;
  stroke: color-mix(in srgb, var(--color-text) 28%, transparent);
  stroke-width: 1.25;
  transition: stroke 0.12s ease, opacity 0.12s ease;
}
.gantt__dep-line--done {
  stroke: color-mix(in srgb, var(--color-text) 16%, transparent);
  stroke-dasharray: 4 3;
}
.gantt__dep-line--active {
  stroke: var(--color-accent);
  stroke-width: 2;
}
.gantt__dep-line--dim {
  stroke: color-mix(in srgb, var(--color-text) 12%, transparent);
}
.gantt__dep-line--blocking {
  stroke: var(--color-warning);
  stroke-width: 1.75;
}
.gantt__dep-arrow {
  fill: color-mix(in srgb, var(--color-text) 28%, transparent);
  fill: context-stroke;
}

.plan-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm) var(--space-md);
  margin-top: 0;
  margin-bottom: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: var(--space-xs);
}
.plan-tabs__group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs);
}
.plan-tabs__group-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  opacity: 0.65;
  margin-right: var(--space-xs);
  white-space: nowrap;
}
.plan-tabs__sep {
  align-self: stretch;
  width: 1px;
  min-height: 1.5rem;
  background: var(--color-border);
  margin: 0 var(--space-xs);
}
.plan-tabs__link {
  padding: var(--space-xs) var(--space-sm);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  border-radius: var(--radius-sm);
}
button.plan-tabs__link {
  background: transparent;
  border: none;
  cursor: pointer;
  font: inherit;
}
.plan-tabs__link:hover { color: var(--color-text); opacity: 1; }
.plan-tabs__link.active {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}

.plan-focus-picker__select {
  width: auto;
  min-width: 8.5rem;
  max-width: 13rem;
  padding: var(--space-xs) 1.75rem var(--space-xs) var(--space-sm);
  font-size: 0.875rem;
  line-height: 1.25;
}

.onboarding-card {
  border-left: 3px solid var(--color-border-hover);
}
.onboarding-card__title {
  margin: 0 0 var(--space-xs);
  font-size: 1rem;
  font-weight: 600;
}
.onboarding-card__lead {
  margin: 0 0 var(--space-md);
}
.onboarding-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-sm);
}
.onboarding-steps__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
}
.onboarding-steps__num {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-text-muted);
}
.onboarding-steps__body {
  flex: 1;
  min-width: 0;
}
.onboarding-steps__title {
  font-size: 0.9375rem;
  font-weight: 500;
}
.onboarding-steps__desc {
  margin: 0.125rem 0 0;
}

.project-workflow {
  margin-bottom: var(--space-lg);
}
.project-workflow__lead {
  margin: 0 0 var(--space-md);
}
.project-workflow__steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-sm);
}
.project-workflow__step {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.project-workflow__step--done {
  opacity: 0.7;
}
.project-workflow__step--current {
  border-color: var(--color-border-hover);
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.project-workflow__marker {
  flex-shrink: 0;
  width: 1.25rem;
  text-align: center;
  font-size: 0.875rem;
  color: var(--color-text-muted);
}
.project-workflow__step--done .project-workflow__marker {
  color: var(--color-text);
}
.project-workflow__label {
  flex: 1;
  font-size: 0.9375rem;
}
.project-workflow__action {
  flex-shrink: 0;
}

.project-workspace {
  margin-bottom: var(--space-md);
}
.project-workspace__bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: var(--space-xs);
}
.project-workspace__back {
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  padding: var(--space-xs);
  border-radius: var(--radius-sm);
}
.project-workspace__back:hover { color: var(--color-text); }
/* Kein flex-grow: «Mehr» sitzt direkt hinter dem letzten Tab statt weit rechts.
   Bei zu wenig Platz (mobil) brechen die Tabs auf eine eigene Zeile um und scrollen dort. */
.project-workspace__tabs {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  flex: 0 1 auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.project-workspace__tabs::-webkit-scrollbar { display: none; }
.project-workspace__tab {
  padding: var(--space-xs) var(--space-sm);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  border-radius: var(--radius-sm);
  white-space: nowrap;
  flex-shrink: 0;
}
.project-workspace__tab:hover { color: var(--color-text); opacity: 1; }
.project-workspace__tab.active {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}
.project-workspace__more {
  position: relative;
  flex-shrink: 0;
}
.project-workspace__more--open { z-index: 120; }
.project-workspace__more-trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: calc(var(--space-xs) - 1px) var(--space-sm);
  font-size: 0.875rem;
  font-family: inherit;
  color: var(--color-text-muted);
  background: transparent;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  white-space: nowrap;
  cursor: pointer;
}
.project-workspace__more-trigger:hover {
  color: var(--color-text);
  border-color: var(--color-border-hover);
}
.project-workspace__more-trigger[aria-expanded="true"] {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}
.project-workspace__more-chevron { font-size: 0.7em; }
.project-workspace__more-backdrop {
  position: fixed;
  inset: 0;
  border: none;
  background: transparent;
  cursor: default;
  z-index: 119;
}
.project-workspace__more-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  min-width: 11rem;
  z-index: 121;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  padding: var(--space-xs);
}
.project-workspace__more-item {
  display: block;
  padding: var(--space-xs) var(--space-sm);
  font-size: 0.875rem;
  color: var(--color-text);
  border-radius: var(--radius-sm);
  text-decoration: none;
  white-space: nowrap;
}
.project-workspace__more-item:hover { background: var(--color-surface); opacity: 1; }
.project-workspace__more-item.active { background: color-mix(in srgb, var(--color-text) 8%, transparent); }

.project-switcher {
  position: relative;
  min-width: 0;
}
.project-switcher--open { z-index: 120; }
.project-switcher__trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  max-width: min(100%, 20rem);
  padding: 0.35rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font: inherit;
  cursor: pointer;
}
.project-switcher__trigger:hover {
  border-color: var(--color-border-hover);
}
.project-switcher__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.9375rem;
  font-weight: 500;
}
.project-switcher__chevron {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  transition: transform 0.15s ease;
}
.project-switcher__chevron--open { transform: rotate(180deg); }
.project-switcher__backdrop {
  position: fixed;
  inset: 0;
  border: none;
  background: transparent;
  cursor: default;
  z-index: 119;
}
.project-switcher__menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 14rem;
  max-width: 20rem;
  max-height: 16rem;
  overflow-y: auto;
  z-index: 121;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  padding: var(--space-xs);
}
.project-switcher__option {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  width: 100%;
  padding: var(--space-xs) var(--space-sm);
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.project-switcher__option:hover { background: var(--color-surface); }
.project-switcher__option.active { background: color-mix(in srgb, var(--color-text) 8%, transparent); }
.project-switcher__option-check {
  width: 1rem;
  flex-shrink: 0;
  opacity: 0;
  font-size: 0.75rem;
}
.project-switcher__option.active .project-switcher__option-check { opacity: 1; }
.project-switcher__option-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plan-tabs--project-scoped {
  margin-top: 0;
}

@media (max-width: 640px) {
  .plan-tabs__sep { display: none; }
  .plan-tabs__group {
    width: 100%;
    padding-bottom: var(--space-xs);
    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
  }
  .plan-tabs__group:last-child { border-bottom: none; }
}

.app-user-menu { position: relative; }
.app-user-menu__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: 999px;
  line-height: 0;
}
.app-user-menu__trigger:hover .app-user-menu__avatar,
.app-user-menu__trigger[aria-expanded="true"] .app-user-menu__avatar {
  border-color: var(--color-border-hover);
  background: var(--color-surface);
}
.app-user-menu__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-bg);
  color: var(--color-text);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1;
  transition: border-color 0.15s, background 0.15s;
  flex-shrink: 0;
}
.app-user-menu__avatar--lg {
  width: 2.25rem;
  height: 2.25rem;
  font-size: 0.75rem;
}
.app-user-menu__avatar--guest {
  color: var(--color-text-muted);
}
/* Layer wird auf Mobile an <body> geportet, damit fixed am Viewport hängt (nicht sticky Nav). */
.app-user-menu__layer {
  position: absolute;
  inset: 0;
  width: 0;
  height: 0;
  overflow: visible;
  z-index: 460;
}
body > .app-user-menu__layer {
  position: fixed;
  inset: 0;
  width: auto;
  height: auto;
  z-index: 1100;
  pointer-events: none;
}
body > .app-user-menu__layer .app-user-menu__backdrop,
body > .app-user-menu__layer .app-user-menu__panel {
  pointer-events: auto;
}
.app-user-menu__backdrop {
  position: fixed;
  inset: 0;
  border: none;
  background: transparent;
  cursor: default;
  z-index: 450;
  padding: 0;
  margin: 0;
}
.app-user-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 16rem;
  max-width: min(20rem, calc(100vw - 1.5rem));
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  box-shadow: 0 8px 24px color-mix(in srgb, #000 25%, transparent);
  z-index: 460;
  padding: var(--space-xs);
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Desktop: Layer bleibt im Trigger – Panel relativ zum Avatar positionieren. */
.app-user-menu > .app-user-menu__layer {
  position: absolute;
  inset: auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: auto;
  height: auto;
}
.app-user-menu > .app-user-menu__layer .app-user-menu__backdrop {
  z-index: 200;
}
.app-user-menu > .app-user-menu__layer .app-user-menu__panel {
  right: 0;
  top: calc(100% + 6px);
}
.app-user-menu__header {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  margin-bottom: var(--space-xs);
}
.app-user-menu__identity {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.app-user-menu__name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text);
  letter-spacing: -0.01em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-user-menu__email {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-user-menu__section {
  display: flex;
  flex-direction: column;
}
.app-user-menu__divider {
  height: 1px;
  margin: var(--space-xs) var(--space-sm);
  background: var(--color-border);
}
.app-user-menu__item {
  padding: 0.5rem var(--space-md);
  font-size: 0.875rem;
  color: var(--color-text);
  border-radius: var(--radius-sm);
  text-decoration: none;
  opacity: 1;
}
.app-user-menu__item:hover {
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  opacity: 1;
}
.app-user-menu__item--button {
  border: none;
  background: none;
  font: inherit;
  font-size: 0.875rem;
  text-align: left;
  width: 100%;
  cursor: pointer;
  color: inherit;
}
.app-user-menu__item--accent {
  font-weight: 500;
}
.app-user-menu__item--danger {
  color: var(--color-text-muted);
}
.app-user-menu__item--danger:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
}

@media (max-width: 768px) {
  body > .app-user-menu__layer .app-user-menu__backdrop {
    background: rgba(0, 0, 0, 0.45);
    z-index: 1100;
  }
  body > .app-user-menu__layer .app-user-menu__panel {
    position: fixed;
    left: var(--space-sm);
    right: var(--space-sm);
    bottom: calc(var(--space-sm) + env(safe-area-inset-bottom, 0px));
    top: auto;
    min-width: 0;
    max-width: none;
    max-height: min(70dvh, 28rem);
    overflow-y: auto;
    padding: var(--space-sm);
    border-radius: var(--radius-md);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
    z-index: 1101;
    animation: app-user-menu-sheet-in 0.18s ease-out;
  }
  body > .app-user-menu__layer .app-user-menu__header {
    padding: var(--space-md) var(--space-md) var(--space-sm);
  }
  body > .app-user-menu__layer .app-user-menu__item {
    min-height: 2.75rem;
    display: flex;
    align-items: center;
    padding: var(--space-sm) var(--space-md);
    font-size: 0.9375rem;
  }
  body:has(> .app-user-menu__layer) {
    overflow: hidden;
  }
}

@keyframes app-user-menu-sheet-in {
  from {
    opacity: 0.6;
    transform: translateY(0.75rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.grid-projects--status {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}
.projects-page {
  width: 100%;
}
.project-status-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.project-status-card--focus {
  border-color: color-mix(in srgb, var(--color-text) 35%, var(--color-border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-text) 12%, transparent);
}
.project-status-card--critical { border-left: 3px solid #e57373; }
.project-status-card--warn { border-left: 3px solid #ffb74d; }
.project-status-card--ok { border-left: 3px solid color-mix(in srgb, var(--color-text) 25%, transparent); }
.project-status-card__main {
  display: block;
  width: 100%;
  flex: 1;
  margin: 0;
  padding: var(--space-md);
  border: none;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.project-status-card__main:hover {
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.project-status-card__focus-badge {
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  padding: 2px var(--space-xs);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.project-status-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-text) 3%, var(--color-surface));
}
.project-status-card__head {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}
.project-status-card__title { font-size: 0.9375rem; font-weight: 600; margin: 0; flex: 1; }
.project-status-card__overall { font-size: 0.75rem; color: color-mix(in srgb, var(--color-text) 25%, transparent); }
.project-status-card--critical .project-status-card__overall { color: #e57373; }
.project-status-card--warn .project-status-card__overall { color: #ffb74d; }
.project-status-card__signals { margin: 0 0 var(--space-md); display: flex; flex-direction: column; gap: var(--space-xs); }
.project-status-card__signal {
  display: grid;
  grid-template-columns: 4.5rem 1fr;
  gap: var(--space-sm);
  font-size: 0.8125rem;
}
.project-status-card__signal dt {
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.project-status-card__signal dd { margin: 0; }
.project-status-card__signal--critical dd { color: #e57373; }
.project-status-card__signal--warn dd { color: #ffb74d; }
.project-status-card__progress { display: flex; flex-direction: column; gap: var(--space-xs); margin-bottom: var(--space-sm); }
.project-status-card__progress-bar {
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 10%, transparent);
  overflow: hidden;
}
.project-status-card__progress-bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 55%, transparent);
}
.project-status-card__milestone { margin: 0; }
.project-status-card__milestone .text-muted { margin-right: var(--space-xs); }
.project-status-card__empty { margin: 0; }

.task-detail-panel__deps { margin-top: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm); }
.task-detail-panel__dep-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-xs); }
.task-detail-panel__dep-add { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.task-detail-panel__whatif { display: flex; flex-direction: column; gap: var(--space-sm); margin-top: var(--space-sm); }
.task-detail-panel__preview-warn { margin: 0; padding-left: 1rem; color: #ffb74d; font-size: 0.8125rem; }
.task-detail-panel__preview-over { color: #e57373; }
.task-detail-panel__preview-impact { display: flex; flex-direction: column; gap: 2px; }

.task-detail-panel__comments { margin-top: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm); }
.task-detail-panel__comment {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface-2) 35%, transparent);
}
.task-detail-panel__comment-meta { line-height: 1.3; }
.task-detail-panel__comment-body { white-space: pre-wrap; line-height: 1.45; }
.task-detail-panel__comment-link { color: var(--color-text-muted); text-decoration: none; }
.task-detail-panel__comment-link:hover { color: var(--color-text); text-decoration: underline; }
.task-detail-panel__comment-form { display: flex; flex-direction: column; gap: var(--space-sm); margin-top: var(--space-xs); }
.task-detail-panel__comment-error { color: #e57373; margin: 0; }

.meeting-detail-panel__participants { display: flex; flex-direction: column; gap: var(--space-xs); }
.meeting-detail-panel__participant-list { display: flex; flex-direction: column; gap: var(--space-xs); }
.meeting-detail-panel__participant { display: flex; align-items: center; gap: var(--space-sm); cursor: pointer; }
.meeting-detail-panel__external-participants { display: flex; flex-direction: column; gap: var(--space-sm); }
.meeting-detail-panel__external-hint { margin: 0; }
.meeting-detail-panel__external-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.meeting-detail-panel__external-chip {
  display: inline-flex; align-items: center; gap: var(--space-xs);
  padding: 2px var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface-2) 35%, transparent);
}
.meeting-detail-panel__external-add { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.meeting-detail-panel__pdf-download { padding: 0 var(--space-xs); }
.task-detail-panel__header-actions { display: flex; align-items: center; gap: var(--space-xs); }
.meeting-detail-panel__section { margin-top: var(--space-md); display: flex; flex-direction: column; gap: var(--space-sm); }
.meeting-detail-panel__item-list,
.meeting-detail-panel__action-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.meeting-detail-panel__item,
.meeting-detail-panel__action {
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface-2) 35%, transparent);
}
.meeting-detail-panel__action-meta { display: flex; flex-wrap: wrap; gap: var(--space-xs); align-items: center; margin-top: var(--space-xs); }
.meeting-detail-panel__action-link { padding: 0; text-align: left; white-space: normal; height: auto; }
.meeting-detail-panel__add { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }
.meeting-detail-panel__add-form { display: flex; flex-direction: column; gap: var(--space-sm); }

.specification-detail-panel__props {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 0 var(--space-md);
  background: color-mix(in srgb, var(--color-surface-2) 25%, transparent);
}
.specification-detail-panel__props[open] { padding-bottom: var(--space-md); }
.specification-detail-panel__props-summary {
  cursor: pointer;
  list-style: none;
  padding: var(--space-sm) 0;
  color: var(--color-text-muted);
  font-size: 0.875rem;
  user-select: none;
}
.specification-detail-panel__props-summary::-webkit-details-marker { display: none; }
.specification-detail-panel__props-summary::before { content: "▸ "; }
.specification-detail-panel__props[open] .specification-detail-panel__props-summary::before { content: "▾ "; }
.specification-detail-panel__props > *:not(summary) { margin-top: var(--space-md); }

/* Full-page specification editor */
.spec-editor__topbar {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-wrap: wrap;
  padding-bottom: var(--space-sm);
  flex-shrink: 0;
}
.spec-editor__back { flex-shrink: 0; padding-left: 0; }
.spec-editor__title {
  flex: 1 1 240px;
  min-width: 180px;
  font-size: 1.125rem;
  font-weight: 500;
}
.spec-editor__topbar-meta { display: flex; align-items: center; gap: var(--space-sm); flex-wrap: wrap; }
.spec-editor__version { max-width: 7rem; }
.spec-editor__status { max-width: 11rem; }

.spec-editor__subbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding-bottom: var(--space-sm);
  flex-shrink: 0;
}
.spec-editor__project { display: flex; align-items: center; gap: var(--space-xs); }
.spec-editor__danger { display: flex; align-items: center; gap: var(--space-sm); }

.spec-editor__props { margin-bottom: var(--space-md); flex-shrink: 0; }

.spec-editor__body {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: var(--space-lg);
}
.spec-editor__outline {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-sm);
  min-height: 0;
}
.spec-editor__outline-head { padding: var(--space-xs) var(--space-xs) 0; }
.wiki-page .spec-editor__outline-head {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.wiki-page__search {
  width: 100%;
  font-size: 0.8125rem;
}
.wiki-page__search-status {
  padding: var(--space-xs) var(--space-sm);
  margin: 0;
}
.spec-editor__outline-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
  overflow-y: auto;
  min-height: 0;
  flex: 1;
}
.spec-editor__outline-item {
  display: grid;
  grid-template-columns: 2.75rem 1fr auto;
  gap: var(--space-xs);
  align-items: baseline;
  width: 100%;
  text-align: left;
  padding: var(--space-xs) var(--space-sm);
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: 0.875rem;
}
.spec-editor__outline-item:hover { background: color-mix(in srgb, var(--color-surface-2) 55%, transparent); }
.spec-editor__outline-item--active { background: color-mix(in srgb, var(--color-text) 12%, transparent); }
.spec-editor__outline-item--child { padding-left: var(--space-lg); font-size: 0.8125rem; }
.spec-editor__outline-no { font-family: var(--font-mono); color: var(--color-text-muted); font-size: 0.7rem; }
.spec-editor__outline-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spec-editor__outline-count { font-size: 0.7rem; }
.spec-editor__outline-add {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--color-border);
}

.spec-editor__main {
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  padding-right: var(--space-xs);
  padding-bottom: var(--space-lg);
}
.spec-editor__hint { padding: var(--space-lg); }
.spec-editor__missing { display: flex; flex-direction: column; gap: var(--space-md); align-items: flex-start; }

/* Section editor card (main column of specification / change request editor) */
.specification-section-editor {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface) 55%, transparent);
  padding: var(--space-lg);
}
.specification-section-editor__head {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}
.specification-section-editor__head .app-input { font-size: 1rem; }
.specification-section-editor__head-actions { display: flex; gap: 2px; flex-shrink: 0; }
.specification-section-editor__parent {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  max-width: 26rem;
  margin-bottom: 0;
}
.specification-section-editor__requirements,
.specification-section-editor__criteria {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  min-width: 0;
}
.specification-section-editor__requirements .app-label,
.specification-section-editor__criteria .app-label { margin-bottom: 0; }
.specification-section-editor__footer {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

/* Requirements table */
.specification-req-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.specification-req-table th {
  text-align: left;
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0 var(--space-sm) var(--space-xs) 0;
  white-space: nowrap;
}
.specification-req-table td {
  padding: var(--space-sm) var(--space-sm) var(--space-sm) 0;
  border-top: 1px solid var(--color-border);
  vertical-align: top;
}
.specification-req-table th:last-child,
.specification-req-table td:last-child { padding-right: 0; }
.specification-req-table select { min-width: 6.5rem; }
.specification-req-table th:first-child,
.specification-req-table td:first-child { width: 6.5rem; }
.specification-req-table th:nth-child(2),
.specification-req-table td:nth-child(2) { width: 45%; }
.specification-req-table__actions { white-space: nowrap; text-align: right; }
.specification-req-table__actions .app-btn + .app-btn { margin-left: var(--space-sm); }

/* Add rows (requirement/criterion) as a single line on desktop */
.specification-section-editor .meeting-detail-panel__add .app-input {
  flex: 1 1 10rem;
  width: auto;
}
.specification-section-editor .meeting-detail-panel__add .app-select {
  flex: 0 0 auto;
  width: auto;
}

/* Larger writing areas on desktop */
@media (min-width: 900px) {
  .spec-editor .markdown-field__box { min-height: 7rem; }
  .spec-editor .markdown-field__editor { min-height: 11rem; }
  .spec-editor .specification-req-table__implementation,
  .spec-editor .specification-criterion-list__implementation { min-height: 4.25rem; }
  .spec-editor__props .task-detail-panel__grid input[type="number"] { max-width: 12rem; }
}

@media (max-width: 899px) {
  .spec-editor__body {
    grid-template-columns: 1fr;
    overflow: visible;
  }
  .spec-editor__outline { max-height: 45vh; }
  .spec-editor__main { overflow: visible; }
  .specification-section-editor { padding: var(--space-md); }
}

.wiki-page > .project-workspace {
  flex-shrink: 0;
}
.wiki-page__empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-lg) 0;
}
.wiki-page__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-md);
  flex-shrink: 0;
}
.wiki-page__header-actions {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-wrap: wrap;
}
.wiki-page__header h1 {
  margin-bottom: 0;
}
.wiki-page__body {
  flex: 1;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
}
.wiki-page__empty-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
}
.wiki-page__nav-item {
  grid-template-columns: 1fr auto !important;
}
.wiki-page__nav-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wiki-page__context-badge {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0.1rem 0.35rem;
}
.wiki-page__main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  padding-bottom: 0;
}
.wiki-page__editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
  flex-shrink: 0;
}
.wiki-page__title {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: 1.125rem;
  font-weight: 600;
}
.wiki-page__context-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  white-space: nowrap;
}
.wiki-page__meta {
  margin: 0 0 var(--space-sm);
  flex-shrink: 0;
}
.wiki-page__main > .org-status-banner {
  flex-shrink: 0;
}
.wiki-page .markdown-field {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.wiki-page .markdown-field__box {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.wiki-page .markdown-field__editor {
  flex: 1;
  min-height: 0;
  height: 100%;
  resize: none;
}
.wiki-page .markdown-field__content,
.wiki-page .markdown-field__placeholder {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
}
.wiki-page .markdown-field__help {
  flex-shrink: 0;
}

.meetings-page__body {
  flex: 1;
  display: flex;
  align-items: stretch;
  gap: var(--space-md);
  min-height: 0;
  margin-top: var(--space-sm);
}
.meetings-page__list {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.meetings-page__row {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  width: 100%; text-align: left; padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  background: transparent; color: inherit; cursor: pointer;
}
.meetings-page__row:hover { border-color: color-mix(in srgb, var(--color-text) 25%, var(--color-border)); }
.meetings-page__row--selected { border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-surface-2) 50%, transparent); }
.meetings-page__row-title { font-size: 0.9375rem; }
.meetings-page__row-meta { line-height: 1.35; }
.meetings-page__panel {
  display: none;
}
.meetings-page__backdrop {
  display: none;
}

.project-hub-page { display: flex; flex-direction: column; gap: var(--space-lg); max-width: none; }
.project-hub-page__back { text-decoration: none; }
.project-hub-page__title-row { display: flex; align-items: center; gap: var(--space-sm); margin-top: var(--space-sm); }
.project-hub-page__title-row h1 { margin: 0; }
.project-hub-page__description { margin: var(--space-sm) 0 0; max-width: 60ch; }
.project-hub-page__stats { display: flex; flex-wrap: wrap; gap: var(--space-lg); }
.project-hub-page__stat { display: flex; flex-direction: column; gap: 2px; }
.project-hub-page__stat-value { font-size: 1.25rem; }
.project-hub-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.project-hub-page__sections { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
.project-hub-page__section h2 { font-size: 0.9375rem; margin: 0 0 var(--space-sm); font-weight: 500; }
.project-hub-page__meeting-list,
.project-hub-page__milestone-list { list-style: none; margin: 0 0 var(--space-sm); padding: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.project-hub-page__dates { margin: var(--space-xs) 0 0; }
.project-hub-page__pack-badge { flex-shrink: 0; align-self: center; }
.project-hub-page__goal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: var(--space-lg);
  align-items: start;
}
@media (max-width: 760px) {
  .project-hub-page__goal-grid { grid-template-columns: 1fr; }
}
.project-hub-page__goal-left { display: flex; flex-direction: column; gap: var(--space-sm); }
.project-hub-page__goal-summary-title {
  margin: 0; font-size: 1rem; font-weight: 500;
  display: flex; align-items: center; gap: var(--space-sm);
}
.project-hub-page__goal-segments { display: flex; gap: 3px; }
.project-hub-page__goal-segment {
  flex: 1 1 0;
  height: 8px;
  border-radius: 3px;
  background: color-mix(in srgb, var(--color-text) 12%, transparent);
  transition: opacity 0.15s ease;
}
.project-hub-page__goal-segment:hover { opacity: 0.75; }
.project-hub-page__goal-segment--done { background: var(--color-success); }
.project-hub-page__goal-segment--warn { background: #ffb74d; }
.project-hub-page__goal-segment--critical { background: #e57373; }
.project-hub-page__goal-marker {
  flex-shrink: 0;
  width: 18px;
  text-align: center;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: color-mix(in srgb, var(--color-text) 35%, transparent);
}
.project-hub-page__goal-marker--done { color: var(--color-success); }
.project-hub-page__goal-marker--warn { color: #ffb74d; }
.project-hub-page__goal-marker--critical { color: #e57373; }
.project-hub-page__goal-right { display: flex; flex-direction: column; gap: var(--space-sm); min-width: 0; }
.project-hub-page__focus-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); }
.project-hub-page__focus-link {
  display: flex; align-items: center; gap: var(--space-sm);
  text-decoration: none; color: inherit; font-weight: 500;
}
.project-hub-page__focus-link:hover { color: var(--color-text); }
.project-hub-page__focus-title { font-size: 1.0625rem; }
.project-hub-page__focus-detail { margin: 0; }
.project-hub-page__chain { display: flex; flex-wrap: wrap; gap: 6px; }
.project-hub-page__chain-step {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 9px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}
.project-hub-page__chain-step--done {
  color: var(--color-success);
  border-color: color-mix(in srgb, var(--color-success) 35%, transparent);
}
.project-hub-page__pdf-missing { color: #ffb74d; }
.project-hub-page__ops { display: flex; flex-direction: column; gap: var(--space-md); }
.project-hub-page__ops-title {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.project-hub-page__section--goals { grid-column: 1 / -1; }
.project-hub-page__goal-steps {
  list-style: none; margin: 0 0 var(--space-sm); padding: 0;
  display: flex; flex-direction: column; gap: var(--space-sm);
}
.project-hub-page__goal-step {
  position: relative;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: var(--space-sm);
  align-items: start;
}
.project-hub-page__goal-step::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 26px;
  bottom: calc(-1 * var(--space-sm));
  width: 1px;
  background: color-mix(in srgb, var(--color-border) 80%, transparent);
}
.project-hub-page__goal-step:last-child::before { display: none; }
.project-hub-page__goal-step .project-hub-page__goal-marker { margin-top: 6px; }
.project-hub-page__milestone-row {
  display: flex; flex-direction: column; gap: 4px;
  padding: var(--space-sm);
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface-2) 30%, transparent);
  text-decoration: none; color: inherit;
  min-width: 0;
}
.project-hub-page__milestone-row:hover { border-color: var(--color-border); color: var(--color-text); }
.project-hub-page__milestone-row--critical { border-left: 3px solid #e57373; }
.project-hub-page__milestone-row--warn { border-left: 3px solid #ffb74d; }
.project-hub-page__milestone-row--done {
  border-left: 3px solid color-mix(in srgb, var(--color-success) 60%, transparent);
  opacity: 0.65;
}
.project-hub-page__milestone-row--done:hover { opacity: 1; }
.project-hub-page__milestone-row--open { border-left: 3px solid color-mix(in srgb, var(--color-text) 20%, transparent); }
.project-hub-page__milestone-row--focus {
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
  border-color: color-mix(in srgb, var(--color-text) 28%, var(--color-border));
}
.project-hub-page__milestone-main { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-sm); }
.project-hub-page__milestone-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.project-hub-page__milestone-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
  flex-shrink: 0;
}
.project-hub-page__milestone-badge { flex-shrink: 0; }
.project-hub-page__ms-status {
  border: 1px solid transparent;
}
.project-hub-page__ms-status--open {
  color: var(--color-text-muted);
  border-color: color-mix(in srgb, var(--color-text) 14%, transparent);
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.project-hub-page__ms-status--in-review {
  color: color-mix(in srgb, var(--color-warning) 85%, var(--color-text));
  border-color: color-mix(in srgb, var(--color-warning) 35%, transparent);
  background: color-mix(in srgb, var(--color-warning) 12%, transparent);
}
.project-hub-page__ms-status--accepted {
  color: color-mix(in srgb, var(--color-success) 80%, var(--color-text));
  border-color: color-mix(in srgb, var(--color-success) 35%, transparent);
  background: color-mix(in srgb, var(--color-success) 12%, transparent);
}
.project-hub-page__ms-status--locked {
  color: var(--color-text-muted);
  border-color: color-mix(in srgb, var(--color-text) 22%, transparent);
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
}
.project-hub-page__ms-status--frozen {
  color: color-mix(in srgb, #60a5fa 70%, var(--color-text));
  border-color: color-mix(in srgb, #60a5fa 30%, transparent);
  background: color-mix(in srgb, #60a5fa 10%, transparent);
}
.project-hub-page__milestone-meta { display: flex; flex-wrap: wrap; gap: var(--space-xs); line-height: 1.4; }
.project-hub-page__meeting-link {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  text-decoration: none; color: inherit;
  padding: var(--space-sm);
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface-2) 20%, transparent);
}
.project-hub-page__meeting-link:hover { border-color: var(--color-border); color: var(--color-text); }
.project-hub-page__meeting-title { font-size: 0.875rem; }
.project-hub-page__meeting-meta { line-height: 1.4; }
.project-hub-page__overall { font-size: 0.75rem; color: color-mix(in srgb, var(--color-text) 25%, transparent); }
.project-hub-page__overall--critical { color: #e57373; }
.project-hub-page__overall--warn { color: #ffb74d; }
.project-hub-page__signals { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.project-hub-page__signal {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-xs) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  font-size: 0.8125rem;
  text-decoration: none;
  color: var(--color-text);
}
.project-hub-page__signal--critical { border-color: color-mix(in srgb, #e57373 50%, var(--color-border)); color: #e57373; }
.project-hub-page__signal--warn { border-color: color-mix(in srgb, #ffb74d 50%, var(--color-border)); color: #ffb74d; }
.project-hub-page__signal--link:hover { background: color-mix(in srgb, var(--color-text) 5%, transparent); }
.project-hub-page__signal[title]:not([title=""]),
.project-hub-page__stat[title]:not([title=""]),
.project-status-card__signal[title]:not([title=""]),
.project-forecast__row[title]:not([title=""]) {
  cursor: help;
}
.project-hub-page__signal-label {
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.project-hub-page__evm {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.project-hub-page__evm-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
}
.project-hub-page__evm-title {
  margin-right: var(--space-sm);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.project-hub-page__evm-grid { gap: var(--space-md) var(--space-lg); }
.project-hub-page__evm-value--over { color: #e57373; }
.project-hub-page__evm-notes { margin: 0; }
.project-hub-page__stat--link { text-decoration: none; color: inherit; border-radius: var(--radius-sm); }
.project-hub-page__stat--link:hover .project-hub-page__stat-value { text-decoration: underline; }
.project-hub-page__stat--progress { min-width: 10rem; }
.project-hub-page__progress-bar {
  height: 4px;
  width: 100%;
  min-width: 8rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 10%, transparent);
  overflow: hidden;
  margin: var(--space-xs) 0;
}
.project-hub-page__progress-bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 55%, transparent);
}
.project-hub-page__progress-bar--over span { background: #e57373; }
.project-hub-page__progress-bar--warn span { background: #d9a441; }
.project-hub-page__forecast--over { color: #e57373; }
.project-hub-page__task-list,
.project-hub-page__activity-list { list-style: none; margin: 0 0 var(--space-sm); padding: 0; display: flex; flex-direction: column; gap: var(--space-sm); }
.project-hub-page__task-link {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-sm);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: var(--color-text-muted);
}
.project-hub-page__task-link:hover { border-color: var(--color-border); color: var(--color-text); }
.project-hub-page__task-title { font-size: 0.875rem; color: var(--color-text); }
.project-hub-page__activity-row { display: flex; flex-direction: column; gap: 2px; padding-bottom: var(--space-sm); border-bottom: 1px solid color-mix(in srgb, var(--color-border) 55%, transparent); }
.project-hub-page__activity-row:last-child { border-bottom: none; padding-bottom: 0; }

.project-settings__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: var(--space-md);
}
.project-settings__field { display: flex; flex-direction: column; gap: var(--space-xs); }
.project-settings__field--wide { grid-column: 1 / -1; }
.project-settings__description { resize: vertical; min-height: 4.5rem; font: inherit; }
.project-settings__actions { display: flex; gap: var(--space-sm); }
.project-settings__danger { border-color: color-mix(in srgb, #e57373 35%, var(--color-border)); }
.project-settings__danger h2 { font-size: 0.9375rem; margin: 0 0 var(--space-xs); font-weight: 500; }
.project-settings__danger-confirm { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-sm); }

@media (min-width: 900px) {
  .meetings-page__body--with-panel {
    gap: 0;
  }
  .meetings-page__body--with-panel .meetings-page__panel {
    display: flex;
    flex: 0 0 var(--detail-panel-width, 420px);
    min-width: 280px;
    min-height: 0;
    max-height: 100%;
  }
  .meetings-page__body--with-panel .meetings-page__panel .meeting-detail-panel {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    height: 100%;
    max-height: 100%;
  }
  .meetings-page__body--resizing {
    cursor: col-resize;
    user-select: none;
  }
  .meetings-page__body--resizing .meetings-page__list,
  .meetings-page__body--resizing .meetings-page__panel {
    pointer-events: none;
  }
  .meetings-page__body--resizing .plan-page__panel-resizer {
    pointer-events: auto;
  }
  .meetings-page__backdrop {
    display: none;
  }
}

@media (max-width: 899px) {
  .meetings-page__body--with-panel .plan-page__panel-resizer {
    display: none;
  }
  .meetings-page__body--with-panel .meetings-page__panel {
    display: flex;
    position: fixed;
    inset: 0;
    z-index: 40;
    width: 100%;
    max-width: none;
    min-height: 0;
  }
  .meetings-page__body--with-panel .meetings-page__panel .meeting-detail-panel {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: 100%;
    border-radius: 0;
  }
  .meetings-page__backdrop {
    display: block;
    position: fixed; inset: 0; z-index: 30; border: none; background: color-mix(in srgb, #000 55%, transparent); cursor: pointer;
  }
  .project-hub-page__sections { grid-template-columns: 1fr; }
}

.gantt__today {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: color-mix(in srgb, var(--color-text) 35%, transparent);
  pointer-events: none;
  z-index: 1;
}
.gantt__row {
  position: relative;
  height: 2.25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 45%, transparent);
  z-index: 1;
  /* Off-Screen-Zeilen überspringen Layout/Paint – reine Performance, identisches Bild. */
  content-visibility: auto;
  contain-intrinsic-size: auto 2.25rem;
}
/* Nach .gantt__row: absolute Positionierung muss relative überschreiben, sonst
   stapeln sich Zeilen im Flow und top-Offsets verdoppeln den Versatz zur Sidebar. */
.gantt__label.gantt__label--virtual,
.gantt__row.gantt__row--virtual {
  position: absolute;
  left: 0;
  right: 0;
  box-sizing: border-box;
  content-visibility: visible;
  contain-intrinsic-size: none;
  min-height: 0;
}
.gantt__row--project { background: color-mix(in srgb, var(--color-surface-2) 40%, transparent); }
.gantt__row--muted { opacity: 0.45; }
.gantt__grid-line {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: color-mix(in srgb, var(--color-border) 35%, transparent);
  pointer-events: none;
}
.gantt__grid-line--major {
  background: color-mix(in srgb, var(--color-border) 75%, transparent);
}
.gantt__pan-surface {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: grab;
  touch-action: pan-x pan-y;
}
.gantt__pan-surface--can-schedule {
  cursor: grab;
}
.gantt__timeline-wrap--panning .gantt__pan-surface {
  cursor: grabbing;
}
.gantt--readonly .gantt__pan-surface {
  touch-action: pan-x pan-y;
}
.gantt:not(.gantt--readonly) .gantt__pan-surface {
  touch-action: pan-x pan-y;
}
.gantt__row-surface {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: crosshair;
  pointer-events: none;
}
.gantt__bar-shell {
  position: absolute;
  top: 0.35rem;
  height: 1.55rem;
  z-index: 1;
  cursor: grab;
  touch-action: none;
}
.gantt__bar-shell:active {
  cursor: grabbing;
}
.gantt__bar-shell--narrow .gantt__bar--compact {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  margin: 0;
  pointer-events: none;
}
.gantt__bar-shell--selected {
  box-shadow: 0 0 0 1px var(--color-text-muted);
  border-radius: var(--radius-sm);
}
.gantt__bar-shell--blocking {
  z-index: 2;
  border-radius: var(--radius-sm);
}
.gantt__bar-shell--blocking .gantt__bar {
  box-shadow:
    0 0 0 1px var(--color-bg),
    0 0 0 3px var(--color-warning);
}
.gantt__bar-shell .gantt__resize {
  width: 10px;
  z-index: 2;
}
/* Task-Balken liegen in der Shell: ohne eigenen top-Offset, sonst schwebt
   der Selektionsrahmen der Shell oberhalb des sichtbaren Balkens. */
.gantt__bar-shell .gantt__bar {
  top: 0;
  height: 100%;
  position: relative;
}
.gantt__bar--compact {
  padding: 0 2px;
  min-width: 4px;
}
.gantt__bar--compact .gantt__bar-label {
  display: none;
}
.gantt--readonly .gantt__bar-shell {
  cursor: pointer;
  touch-action: pan-x pan-y;
}
.gantt__bar {
  position: absolute;
  top: 0.35rem;
  height: 1.55rem;
  z-index: 1;
  border: 1px solid color-mix(in srgb, var(--bar-color) 55%, var(--color-border));
  border-left: 3px solid var(--bar-color);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--bar-color) 18%, var(--color-surface-2));
  color: var(--color-text);
  cursor: grab;
  overflow: hidden;
  padding: 0 0.5rem;
  text-align: left;
  min-width: 4px;
  user-select: none;
  touch-action: none;
}
.gantt__bar:active { cursor: grabbing; }
.gantt--readonly .gantt__bar {
  cursor: pointer;
  touch-action: pan-x pan-y;
}
.gantt--readonly .gantt__bar--project { cursor: default; }
.gantt__bar--project {
  height: 1.75rem;
  top: 0.25rem;
  font-weight: 500;
}
.gantt__bar--task {
  border-left: 3px solid var(--project-accent, var(--bar-color));
}
.gantt__bar--done {
  opacity: 0.5;
  filter: grayscale(0.65);
  border-style: dashed;
  background: color-mix(in srgb, var(--bar-color) 8%, var(--color-surface-2));
}
.gantt__bar--done .gantt__bar-label {
  text-decoration: line-through;
  color: var(--color-text-muted);
}
.gantt__bar--onhold {
  opacity: 0.82;
  border-style: dotted;
  background: repeating-linear-gradient(
    -45deg,
    color-mix(in srgb, var(--bar-color) 12%, var(--color-surface-2)),
    color-mix(in srgb, var(--bar-color) 12%, var(--color-surface-2)) 6px,
    color-mix(in srgb, var(--bar-color) 4%, var(--color-surface-2)) 6px,
    color-mix(in srgb, var(--bar-color) 4%, var(--color-surface-2)) 12px
  );
}
.gantt__bar--onhold .gantt__bar-label {
  font-style: italic;
}
.gantt__bar--outofscope {
  opacity: 0.55;
  border-style: dashed;
  background: color-mix(in srgb, var(--color-surface-2) 70%, transparent);
}
.gantt__bar--outofscope .gantt__bar-label {
  text-decoration: line-through;
  text-decoration-style: dashed;
}
.gantt__bar--blocking {
  background: color-mix(in srgb, var(--bar-color) 22%, var(--color-surface-2));
}
.gantt__bar--inferred {
  border-style: dashed;
  background: color-mix(in srgb, var(--bar-color) 8%, transparent);
}
.gantt__bar--muted {
  opacity: 0.35;
  filter: grayscale(0.35);
}
.gantt__bar--mine {
  opacity: 1;
  border-left-width: 4px;
  background: color-mix(in srgb, var(--bar-color) 28%, var(--color-surface-2));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--bar-color) 35%, transparent);
}
.gantt__bar--selected {
  box-shadow: 0 0 0 1px var(--color-text-muted);
}
.gantt__bar--preview {
  pointer-events: none;
  opacity: 0.65;
}
.gantt__bar-label {
  display: block;
  font-size: 0.75rem;
  line-height: 1.55rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gantt__resize {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 10px;
  cursor: ew-resize;
}
.gantt__resize--start { left: 0; }
.gantt__resize--end { right: 0; }

/* ─── Gantt: Kompakte Zeilen (mehr Tasks sichtbar) ─── */
.gantt--dense .gantt__row {
  height: 1.5rem;
  contain-intrinsic-size: auto 1.5rem;
}
.gantt--dense .gantt__label {
  min-height: 1.5rem;
  font-size: 0.8125rem;
}
.gantt--dense .gantt__bar-shell,
.gantt--dense .gantt__bar {
  top: 0.15rem;
  height: 1.2rem;
}
.gantt--dense .gantt__bar--project {
  top: 0.1rem;
  height: 1.3rem;
}
.gantt--dense .gantt__bar-label {
  line-height: 1.2rem;
  font-size: 0.6875rem;
}
.gantt--dense .gantt__criteria-chip {
  padding: 0 0.25rem;
  font-size: 0.6875rem;
  line-height: 1.1;
}

/* ─── Gantt: Touch-Geräte (größere Tap-Ziele) ─── */
@media (pointer: coarse) {
  .gantt__row { height: 2.75rem; contain-intrinsic-size: auto 2.75rem; }
  .gantt__bar-shell {
    height: 2rem;
    top: 0.375rem;
  }
  .gantt__bar {
    height: 2rem;
    top: 0.375rem;
  }
  .gantt__bar--project {
    height: 2.15rem;
    top: 0.3rem;
  }
  .gantt__bar-label { line-height: 2rem; }
  .gantt__resize { width: 18px; }
  .gantt__bar-shell .gantt__resize { width: 20px; }
  .gantt__label { min-height: 2.75rem; }
  .gantt--dense .gantt__row {
    height: 2rem;
    contain-intrinsic-size: auto 2rem;
  }
  .gantt--dense .gantt__label { min-height: 2rem; }
  .gantt--dense .gantt__bar-shell,
  .gantt--dense .gantt__bar {
    top: 0.25rem;
    height: 1.5rem;
  }
  .gantt--dense .gantt__bar--project {
    top: 0.2rem;
    height: 1.6rem;
  }
  .gantt--dense .gantt__bar-label { line-height: 1.5rem; }
  .gantt__label-btn { padding: 0.35rem 0; }
  .gantt__collapse {
    width: 1.85rem;
    height: 1.85rem;
    font-size: 0.9rem;
  }
  .gantt__view-mode {
    padding: 0.4rem 0.7rem;
    font-size: 0.8125rem;
  }
}

/* ─── Gantt: Mobile-Layout (einklappbare Namensspalte) ─── */
@media (max-width: 768px) {
  .app-shell:has(.plan-page) {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .app-main:has(.plan-page) {
    overflow: visible;
  }
  .plan-page {
    overflow: visible;
  }
  .gantt {
    height: auto;
    min-height: 0;
  }
  .gantt__toolbar {
    padding: var(--space-sm);
    gap: var(--space-sm);
  }
  .gantt__frame {
    min-height: 0;
  }
  .gantt__frame--labels-collapsed {
    grid-template-columns: 3.25rem 0 1fr;
  }
  .gantt__frame--labels-expanded {
    grid-template-columns: minmax(9.5rem, 44%) 0 1fr;
  }
  .gantt__sidebar-resizer { display: none; }
  .gantt__sidebar-toggle { display: inline-flex; }
  .gantt__frame--labels-collapsed .gantt__sidebar-head {
    justify-content: center;
    padding-inline: var(--space-xs);
  }
  .gantt__frame--labels-collapsed .gantt__sidebar-head-text { display: none; }
  .gantt__frame--labels-expanded .gantt__sidebar-head-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /* Sidebar & Timeline scrollen gemeinsam mit der Seite – Zeilen bleiben ausgerichtet */
  .gantt__sidebar { overflow-x: hidden; overflow-y: visible; }
  .gantt__sidebar-body { overflow: visible; }
  .gantt__timeline-col { min-height: 0; }
  .gantt__frame--labels-collapsed .gantt__sidebar { overflow: hidden; }
  .gantt__label {
    padding-inline: var(--space-xs);
    font-size: 0.8125rem;
  }
  .gantt__frame--labels-collapsed .gantt__label {
    padding-left: var(--space-xs);
    gap: 2px;
    overflow: hidden;
  }
  .gantt__frame--labels-collapsed .gantt__label--task {
    padding-left: calc(var(--space-xs) + 0.35rem);
  }
  .gantt__frame--labels-collapsed .gantt__label--task .gantt__label-text {
    display: none;
  }
  .gantt__frame--labels-expanded .gantt__label {
    padding-inline: var(--space-sm);
    padding-left: calc(var(--space-sm) + var(--indent, 0) * 0.75rem);
  }
  .gantt__frame--labels-collapsed .gantt__collapse { display: none; }
  .gantt__frame--labels-collapsed .gantt__label--project .gantt__label-text {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .gantt__assignee { display: none; }
  .gantt__timeline-wrap {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }
  .gantt__timeline-head,
  .gantt__sidebar-head {
    position: sticky;
    top: var(--nav-height);
    z-index: 4;
  }
}

/* Resources */
.resources-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.resources-page > .plan-tabs {
  flex-shrink: 0;
  margin-top: 0;
}
.plan-tabs--capacity { margin-top: calc(-1 * var(--space-xs)); }
.resources-page__focus {
  margin: 0;
  padding: var(--space-xs) var(--space-sm);
  border-left: 3px solid var(--color-text-muted);
}
.resources-page__header {
  margin-top: 0;
}
.resources-page__header h1 { margin-bottom: var(--space-sm); }
.resources-page__subtitle { margin: var(--space-xs) 0 0; max-width: 42rem; }
.resources-page__notice {
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.resources-page__kpis .stat {
  border-left: 3px solid var(--color-border);
  padding-left: var(--space-md);
}
.resources-page__kpis .resources-page__stat--over { border-left-color: #e57373; }
.resources-page__alerts {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.resources-page__alerts-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--space-sm) var(--space-md);
  background: none;
  border: none;
  color: var(--color-text);
  font: inherit;
  cursor: pointer;
  border-radius: var(--radius-md);
}
.resources-page__alerts-toggle:hover { background: var(--color-hover-overlay); }
.resources-page__alerts-title {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text);
}
.resources-page__alert-group {
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--color-border);
}
.resources-page__alert-group-title {
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
  margin: 0 0 var(--space-xs);
}
.resources-page__alert-group-title--overbooked { color: #e57373; }
.resources-page__alert-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.resources-page__alert {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-sm);
  align-items: baseline;
  font-size: 0.875rem;
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
}
.resources-page__alert:last-child { border-bottom: none; }
.resources-page__alert-message { color: var(--color-text-muted); }
.resources-page__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  align-items: center;
  font-size: 0.8125rem;
}
.resources-page__legend-item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
}
.resources-page__legend-item::before {
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 2px;
  border: 1px solid var(--color-border);
}
.resources-page__legend-item--ok::before { background: color-mix(in srgb, var(--color-text) 12%, transparent); }
.resources-page__legend-item--over::before { background: color-mix(in srgb, #e57373 35%, transparent); border-color: #e57373; }

.blockers-page__kpis { margin-bottom: var(--space-lg); }
.blockers-page__notice {
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.blockers-page__stat { border-left: 3px solid var(--color-border); padding-left: var(--space-md); }
.blockers-page__stat--critical { border-left-color: #e57373; }
.blockers-page__stat--warn { border-left-color: #f0b429; }
.blockers-page__toolbar { margin-bottom: var(--space-lg); }
.blockers-page .plan-page__body { flex: 1; min-height: 0; }
.blockers-page__content { flex: 1; min-width: 0; width: 100%; }
.blockers-page__group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  margin-bottom: var(--space-md);
  overflow: hidden;
}
.blockers-page__group-title {
  font-size: 0.9375rem;
  font-weight: 600;
  padding: var(--space-md);
  border-bottom: 1px solid var(--color-border);
  margin: 0;
}
.blockers-page__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.blockers-page__row {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: var(--space-sm) var(--space-md);
  align-items: center;
  width: 100%;
  text-align: left;
  padding: var(--space-md);
  border: none;
  border-bottom: 1px solid var(--color-border);
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
}
.blockers-page__row:last-child { border-bottom: none; }
.blockers-page__row:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }
.blockers-page__row--selected { background: color-mix(in srgb, var(--color-text) 8%, transparent); }
.blockers-page__row--critical { border-left: 3px solid #e57373; }
.blockers-page__row--warn { border-left: 3px solid #f0b429; }
.blockers-page__row-title { font-weight: 500; min-width: 0; }
.blockers-page__row-meta { white-space: nowrap; }
.blockers-page__badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  justify-content: flex-end;
}
.blockers-page__badge {
  font-size: 0.75rem;
  padding: 0.125rem 0.5rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
  white-space: nowrap;
}
.blockers-page__badge--critical { border-color: #e57373; color: #e57373; }
.blockers-page__badge--warn { border-color: #f0b429; color: #f0b429; }
.blockers-page__badge--waiting { max-width: 18rem; overflow: hidden; text-overflow: ellipsis; }
.blockers-page__impact-table {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: hidden;
}
.blockers-page__impact-head,
.blockers-page__impact-row {
  display: grid;
  grid-template-columns: 1fr 7rem 4rem 4rem;
  gap: var(--space-md);
  align-items: center;
  padding: var(--space-md);
}
.blockers-page__impact-head {
  border-bottom: 1px solid var(--color-border);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.75rem;
}
.blockers-page__impact-row {
  width: 100%;
  border: none;
  border-bottom: 1px solid var(--color-border);
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.blockers-page__impact-row:last-child { border-bottom: none; }
.blockers-page__impact-row:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }
.blockers-page__impact-title {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-width: 0;
  font-weight: 500;
}
.task-detail-panel__blocker {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-md);
}
.task-detail-panel__reminder { align-self: flex-start; margin-top: var(--space-xs); }

.resource-grid__frame {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: auto;
}
.resource-grid__table {
  display: grid;
  grid-template-columns: 180px 88px repeat(var(--week-count, 12), minmax(88px, 1fr));
  min-width: max-content;
}
.resource-grid__row {
  display: contents;
}
.resource-grid__cell {
  padding: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
  border-right: 1px solid var(--color-border);
  font-size: 0.8125rem;
  min-height: 2.75rem;
  display: flex;
  align-items: center;
}
.resource-grid__row--head .resource-grid__cell {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--color-bg);
  font-size: 0.75rem;
  color: var(--color-text-muted);
  font-weight: 500;
}
.resource-grid__cell--sticky {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--color-surface);
}
.resource-grid__cell--capacity.resource-grid__cell--sticky { left: 180px; }
.resource-grid__row--head .resource-grid__cell--sticky { z-index: 3; background: var(--color-bg); }
.resource-grid__cell--name { font-weight: 500; }
.resource-grid__cell--week { flex-direction: column; align-items: flex-start; justify-content: center; }
.resource-grid__week-label { white-space: nowrap; }
.resource-grid__cell--load {
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 4px;
  position: relative;
}
.resource-grid__load-hours { font-variant-numeric: tabular-nums; }
.resource-grid__load-header {
  display: flex;
  align-items: baseline;
  gap: 0.2rem;
  flex-wrap: wrap;
}
.resource-grid__capacity-hint { font-size: 0.6875rem; }
.resource-grid__load-empty { color: var(--color-text-muted); }
.resource-grid__load-empty--reduced { font-variant-numeric: tabular-nums; font-size: 0.75rem; }
.resource-grid__load-track {
  width: 100%;
  height: 6px;
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  border-radius: 3px;
  overflow: hidden;
}
.resource-grid__load-bar {
  display: flex;
  height: 100%;
  min-width: 0;
  border-radius: 3px;
  overflow: hidden;
}
.resource-grid__load-segment {
  display: block;
  height: 100%;
  min-width: 2px;
}
.resource-grid__cell--ok .resource-grid__load-bar {
  background: color-mix(in srgb, var(--color-text) 20%, transparent);
}
.resource-grid__cell--warn {
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.resource-grid__cell--overbooked {
  background: color-mix(in srgb, #e57373 12%, transparent);
}
.resource-grid__cell--overbooked .resource-grid__load-track {
  background: color-mix(in srgb, #e57373 20%, transparent);
}

/* Member weekly hours */
.member-hours { display: flex; flex-direction: column; gap: var(--space-xs); min-width: 0; }
.member-hours--compact .member-hours__display { justify-content: center; }
.member-hours__field-label { margin: 0; font-size: 0.6875rem; }
.member-hours__display,
.member-hours__edit { display: flex; flex-direction: column; gap: var(--space-xs); min-width: 0; }
.member-hours__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs);
}
.member-hours__input {
  width: 4.25rem;
  min-width: 0;
  padding: var(--space-xs) var(--space-sm);
  font-size: 0.875rem;
  font-variant-numeric: tabular-nums;
}
.member-hours--compact .member-hours__input { width: 3.25rem; }
.member-hours__unit {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}
.member-hours__value {
  display: inline-flex;
  align-items: baseline;
  gap: 0.2rem;
  font-size: 0.875rem;
  font-variant-numeric: tabular-nums;
  color: var(--color-text);
  background: transparent;
  border: none;
  padding: 0;
}
.member-hours__value--editable {
  cursor: pointer;
  border-bottom: 1px dashed var(--color-border);
  padding-bottom: 1px;
}
.member-hours__value--editable:hover { border-color: var(--color-text-muted); }
.member-hours__number { font-weight: 500; }
.member-hours__action {
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  border-radius: var(--radius-sm);
  width: 1.75rem;
  height: 1.75rem;
  cursor: pointer;
  font-size: 0.8125rem;
  line-height: 1;
  flex-shrink: 0;
}
.member-hours__action:hover { border-color: var(--color-border-hover); }
.member-hours__action--save { border-color: var(--color-text-muted); }
.member-hours__error { color: #e57373; }
.resources-page__org-link {
  margin-left: auto;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.resources-page__org-link + .resources-page__org-link { margin-left: var(--space-md); }

.project-forecast,
.estimate-accuracy {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  padding: var(--space-md);
}
.project-forecast__title,
.estimate-accuracy__title {
  font-size: 0.9375rem;
  margin: 0 0 var(--space-xs);
}
.project-forecast__subtitle,
.estimate-accuracy__subtitle { margin: 0 0 var(--space-md); }

.cap-timeline {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  padding: var(--space-md);
}
.cap-timeline__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-sm);
}
.cap-timeline__title {
  font-size: 0.9375rem;
  margin: 0 0 var(--space-xs);
}
.cap-timeline__subtitle { margin: 0; max-width: 40rem; }
.cap-timeline__scope {
  margin: var(--space-xs) 0 0;
  color: var(--color-text-muted);
}
.cap-timeline__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
}
.cap-timeline__member-select { min-width: 10rem; }
.cap-timeline__chart-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(9rem, 11rem);
  gap: var(--space-md);
  align-items: start;
}
.cap-timeline__y-label {
  grid-column: 1;
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: calc(-1 * var(--space-sm));
}
.cap-timeline__plot-area {
  grid-column: 1;
  min-width: 0;
}
.cap-timeline__svg {
  display: block;
  width: 100%;
  height: auto;
  min-height: 12rem;
}
.cap-timeline__grid-line {
  stroke: color-mix(in srgb, var(--color-border) 80%, transparent);
  stroke-width: 1;
}
.cap-timeline__tick-label {
  font-size: 9px;
  fill: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}
.cap-timeline__x-label {
  font-size: 9px;
  fill: var(--color-text-muted);
}
.cap-timeline__bar-segment {
  stroke: color-mix(in srgb, var(--color-bg) 25%, transparent);
  stroke-width: 0.5;
}
.cap-timeline__line {
  stroke-width: 2;
  stroke-linejoin: round;
}
.cap-timeline__line--net {
  stroke: var(--color-text);
}
.cap-timeline__line--gross {
  stroke: var(--color-text-muted);
  stroke-width: 1.5;
  stroke-dasharray: 4 3;
  opacity: 0.65;
}
.cap-timeline__hatch--reserve {
  stroke: color-mix(in srgb, #66bb6a 55%, transparent);
  stroke-width: 2;
}
.cap-timeline__hatch--deficit {
  stroke: color-mix(in srgb, #e57373 55%, transparent);
  stroke-width: 2;
}
.cap-timeline__band--reserve { opacity: 0.55; }
.cap-timeline__band--deficit { opacity: 0.5; }
.cap-timeline__legend-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  font-size: 0.75rem;
  color: var(--color-text-muted);
  border-left: 1px solid var(--color-border);
  padding-left: var(--space-md);
}
.cap-timeline__legend-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.cap-timeline__legend-heading {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text);
  margin-bottom: 2px;
}
.cap-timeline__legend-row {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  line-height: 1.3;
}
.cap-timeline__swatch {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 2px;
  flex-shrink: 0;
}
.cap-timeline__swatch--net {
  height: 2px;
  border-radius: 0;
  background: var(--color-text);
  align-self: center;
}
.cap-timeline__swatch--gross {
  height: 0;
  border-top: 2px dashed var(--color-text-muted);
  background: transparent;
  opacity: 0.65;
}
.cap-timeline__swatch--reserve {
  background: repeating-linear-gradient(
    45deg,
    color-mix(in srgb, #66bb6a 35%, transparent),
    color-mix(in srgb, #66bb6a 35%, transparent) 2px,
    transparent 2px,
    transparent 4px
  );
}
.cap-timeline__swatch--deficit {
  background: repeating-linear-gradient(
    45deg,
    color-mix(in srgb, #e57373 35%, transparent),
    color-mix(in srgb, #e57373 35%, transparent) 2px,
    transparent 2px,
    transparent 4px
  );
}
@media (max-width: 900px) {
  .cap-timeline__chart-wrap {
    grid-template-columns: 1fr;
  }
  .cap-timeline__legend-panel {
    border-left: none;
    border-top: 1px solid var(--color-border);
    padding-left: 0;
    padding-top: var(--space-md);
    flex-direction: row;
    flex-wrap: wrap;
  }
  .cap-timeline__legend-group { min-width: 10rem; }
}

.project-forecast__table,
.estimate-accuracy__table {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.project-forecast__head,
.project-forecast__row,
.estimate-accuracy__head,
.estimate-accuracy__row {
  display: grid;
  gap: var(--space-sm);
  align-items: center;
  font-size: 0.8125rem;
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
}
.project-forecast__head,
.estimate-accuracy__head {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted);
}
.project-forecast__head,
.project-forecast__row {
  grid-template-columns: minmax(8rem, 1.4fr) repeat(5, minmax(3.5rem, 1fr));
}
.estimate-accuracy__head,
.estimate-accuracy__row {
  grid-template-columns: minmax(8rem, 1.4fr) repeat(5, minmax(3.5rem, 1fr));
}
.project-forecast__project,
.estimate-accuracy__project {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  min-width: 0;
}
.project-forecast__row--over { color: #e57373; }
.project-forecast__delta--over { color: #e57373; }
.project-forecast__delta--ok { color: var(--color-text-muted); }
.project-forecast__bar-row {
  grid-column: 1 / -1;
  padding: 0 0 var(--space-xs);
}
.project-forecast__bar {
  height: 4px;
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  border-radius: 2px;
  overflow: hidden;
}
.project-forecast__bar-fill {
  height: 100%;
  background: color-mix(in srgb, var(--color-text) 25%, transparent);
  border-radius: 2px;
}
.project-forecast__bar-fill--over {
  background: color-mix(in srgb, #e57373 50%, transparent);
}
.estimate-accuracy__delta--over { color: #e57373; }
.estimate-accuracy__delta--under { color: var(--color-text-muted); }
@media (max-width: 768px) {
  .project-forecast__head { display: none; }
  .project-forecast__row,
  .estimate-accuracy__row {
    grid-template-columns: 1fr 1fr;
  }
  .project-forecast__project,
  .estimate-accuracy__project { grid-column: 1 / -1; }
  .estimate-accuracy__head { display: none; }
}

@media (max-width: 640px) {
  .resources-page__legend { flex-direction: column; align-items: flex-start; }
  .resources-page__org-link { margin-left: 0; }
}

.member-absences {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: hidden;
}
.member-absences__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  width: 100%;
  padding: var(--space-md);
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.member-absences__toggle:hover { background: var(--color-hover-overlay); }
.member-absences__title {
  display: block;
  font-size: 0.9375rem;
  font-weight: 500;
}
.member-absences__meta { display: block; margin-top: 0.125rem; }
.member-absences__panel {
  padding: 0 var(--space-md) var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  border-top: 1px solid var(--color-border);
}
.member-absences__form {
  padding-top: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.member-absences__form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-sm);
}
.member-absences__note { grid-column: 1 / -1; }
.member-absences__form-actions { display: flex; gap: var(--space-sm); }
.member-absences__error { color: #e57373; margin: 0; }
.member-absences__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.member-absences__item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.member-absences__item:last-child { border-bottom: none; }
.member-absences__item-main {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}
.member-absences__person-row {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}
.member-absences__swatch {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  flex-shrink: 0;
}
.member-absences__person { font-size: 0.875rem; font-weight: 500; }
.member-absences__dates { font-size: 0.8125rem; font-variant-numeric: tabular-nums; }
.member-absences__delete {
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text-muted);
  border-radius: var(--radius-sm);
  width: 1.75rem;
  height: 1.75rem;
  cursor: pointer;
  flex-shrink: 0;
  line-height: 1;
}
.member-absences__delete:hover { color: var(--color-text); border-color: var(--color-border-hover); }
@media (max-width: 640px) {
  .member-absences__form-grid { grid-template-columns: 1fr; }
  .member-absences__note { grid-column: auto; }
}

.task-detail-panel__remaining {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--space-xs);
  padding-top: var(--space-xs);
  border-top: 1px solid var(--color-border);
}

/* My plan */
.my-plan {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  width: 100%;
  max-width: none;
  min-height: calc(100vh - var(--nav-height) - 2 * var(--space-xl));
}
.my-plan__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-md);
}
.my-plan__toolbar--head {
  justify-content: space-between;
}
.my-plan__title {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.my-plan__month-nav {
  display: inline-flex;
  align-items: center;
  gap: var(--space-sm);
  margin-inline: auto;
}
.my-plan__month-label {
  min-width: 9rem;
  text-align: center;
  font-weight: 500;
  text-transform: capitalize;
}
.my-plan__nav-btn {
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
}
.my-plan__nav-btn:hover { border-color: var(--color-border-hover); }
.my-plan__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
}
.my-plan__capacity {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  min-width: 12rem;
}
.my-plan__capacity-row {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-wrap: wrap;
}
.my-plan__capacity-input {
  width: 5rem;
}
.my-plan__hint { margin: 0; }
.my-plan__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}
.my-plan__legend-item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
}
.my-plan__legend-item::before {
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 2px;
}
.my-plan__legend-item--absence::before {
  background: color-mix(in srgb, var(--color-text) 22%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-text) 35%, transparent);
}
.my-plan__legend-item--task::before {
  background: transparent;
  border-left: 3px solid var(--color-text-muted);
}
.my-plan__selection,
.my-plan__composer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.my-plan__org-select { min-width: 10rem; }
.my-plan__note-input { flex: 1; min-width: 8rem; }
.my-plan__presets {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}
.my-plan__preset {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.2rem 0.55rem;
  font-size: 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
}
.my-plan__preset-swatch {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  background: var(--preset-accent, var(--color-text-muted));
  flex-shrink: 0;
}
.my-plan__preset:hover { border-color: var(--color-border-hover); color: var(--color-text); }
.my-plan__preset--active {
  border-color: var(--preset-accent, var(--color-text));
  color: var(--color-text);
  background: color-mix(in srgb, var(--preset-accent, var(--color-text)) 12%, transparent);
}
.my-plan__calendar {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.my-plan-cal {
  flex: 1;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  overflow: hidden;
  touch-action: none;
  user-select: none;
  min-height: 28rem;
}
.my-plan-cal__weekdays,
.my-plan-cal__days,
.my-plan-cal__lanes {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.my-plan-cal__weekdays {
  border-bottom: 1px solid var(--color-border);
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.my-plan-cal__weekdays span {
  padding: var(--space-sm) var(--space-xs);
}
.my-plan-cal__week {
  flex: 1;
  position: relative;
  min-height: 4rem;
}
@media (min-width: 900px) {
  .my-plan-cal { min-height: calc(100vh - var(--nav-height) - 11rem); }
  .my-plan-cal__week { min-height: 5.5rem; }
}
.my-plan-cal--weekview { min-height: 16rem; }
@media (min-width: 900px) {
  .my-plan-cal--weekview { min-height: 22rem; }
}
.my-plan-cal__week + .my-plan-cal__week { border-top: 1px solid var(--color-border); }
.my-plan-cal__days {
  position: absolute;
  inset: 0;
}
.my-plan-cal__day {
  position: relative;
  border-right: 1px solid var(--color-border);
  padding: var(--space-xs);
  cursor: crosshair;
}
.my-plan-cal__day:last-child { border-right: none; }
.my-plan-cal__day--outside { opacity: 0.35; }
.my-plan-cal__day--today {
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.my-plan-cal__day--today .my-plan-cal__day-num {
  font-weight: 600;
  color: var(--color-text);
}
.my-plan-cal__day--selecting {
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}
.my-plan-cal--interacting .my-plan-cal__lanes * {
  pointer-events: none !important;
}
.my-plan-cal__selection-band {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: color-mix(in srgb, var(--absence-accent, var(--color-text)) 18%, transparent);
  border: 1px dashed color-mix(in srgb, var(--absence-accent, var(--color-text)) 45%, transparent);
  border-radius: 2px;
  pointer-events: none;
}
.my-plan-cal__day-num {
  position: relative;
  z-index: 1;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  font-variant-numeric: tabular-nums;
}
.my-plan-cal__lanes {
  position: relative;
  z-index: 1;
  grid-auto-rows: minmax(1.375rem, auto);
  align-items: stretch;
  row-gap: 2px;
  padding: 1.625rem 0 var(--space-xs);
  pointer-events: none;
}
.my-plan-cal--weekview .my-plan-cal__lanes {
  grid-auto-rows: minmax(2.5rem, auto);
  row-gap: 3px;
}
.my-plan-cal__bar {
  position: relative;
  z-index: 1;
  display: block;
  min-width: 0;
  margin: 0;
  padding: 2px 6px;
  font-size: 0.6875rem;
  line-height: 1.25;
  overflow: hidden;
  border-radius: 0;
}
.my-plan-cal__bar--starts {
  margin-left: 3px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.my-plan-cal__bar--ends {
  margin-right: 3px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.my-plan-cal--weekview .my-plan-cal__bar {
  padding: 4px 8px;
  font-size: 0.75rem;
}
.my-plan-cal__bar--absence {
  background: color-mix(in srgb, var(--absence-accent, var(--color-text)) 22%, transparent);
  color: var(--color-text);
}
.my-plan-cal__bar--selected {
  outline: 1px solid var(--color-text);
  outline-offset: -1px;
}
.my-plan-cal__bar--task {
  pointer-events: auto;
  border-left: 3px solid var(--task-accent, var(--color-text-muted));
  background: color-mix(in srgb, var(--task-accent, var(--color-text)) 13%, transparent);
  color: var(--color-text-muted);
  text-decoration: none;
}
.my-plan-cal__bar--task:not(.my-plan-cal__bar--starts) { border-left: none; }
.my-plan-cal__bar--task:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--task-accent, var(--color-text)) 22%, transparent);
}
.my-plan-cal__bar-title {
  display: block;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.my-plan-cal__bar-meta {
  display: block;
  color: var(--color-text-muted);
  font-size: 0.625rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.my-plan-cal__bar-handle {
  position: relative;
  z-index: 2;
  pointer-events: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  cursor: grab;
}
.my-plan-cal__more {
  position: relative;
  z-index: 2;
  pointer-events: auto;
  justify-self: start;
  max-width: 100%;
  margin: 0 3px;
  padding: 1px 6px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}
.my-plan-cal__more:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}
.my-plan-cal__popover-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
}
.my-plan-cal__popover {
  position: absolute;
  z-index: 31;
  top: 1.625rem;
  width: min(18rem, 85vw);
  max-height: 16rem;
  overflow: auto;
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-2);
  box-shadow: 0 8px 24px rgb(0 0 0 / 0.35);
}
.my-plan-cal__popover--up {
  top: auto;
  bottom: var(--space-xs);
}
.my-plan-cal__popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-xs);
  font-size: 0.75rem;
}
.my-plan-cal__popover-close {
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
  cursor: pointer;
}
.my-plan-cal__popover-close:hover { color: var(--color-text); }
.my-plan-cal__popover-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.my-plan-cal__popover-item {
  display: block;
  width: 100%;
  min-width: 0;
  text-align: left;
  padding: 3px 6px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: var(--color-text);
  font-size: 0.75rem;
  text-decoration: none;
  cursor: pointer;
}
.my-plan-cal__popover-item:hover {
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
}
.my-plan-cal__popover-item--absence {
  border-left: 3px solid color-mix(in srgb, var(--absence-accent, var(--color-text)) 60%, transparent);
}
.my-plan-cal__popover-item--task {
  border-left: 3px solid var(--color-text-muted);
}
.my-plan-cal__popover-item-meta {
  display: block;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
}
@media (max-width: 640px) {
  .my-plan-cal__weekdays span { padding: var(--space-xs) 2px; }
  .my-plan-cal__week { min-height: 3.5rem; }
  .my-plan-cal__day { padding: 2px; }
  .my-plan-cal__lanes { padding-top: 1.25rem; }
  .my-plan__toolbar--head { flex-direction: column; align-items: stretch; }
  .my-plan__month-nav { margin-inline: 0; justify-content: center; flex-wrap: wrap; }
  .my-plan__composer { flex-direction: column; align-items: stretch; }
}

.dual-status-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-xs);
}
.dual-status-badges__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.1rem 0.45rem;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  font-size: 0.75rem;
}
.dual-status-badges__label { margin: 0; }
.dual-status-badges__value { font-weight: 500; }
.task-card .dual-status-badges { margin-top: var(--space-xs); margin-bottom: var(--space-xs); }
.blockers-page__blocked-tasks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-xs);
}
.blockers-page__blocked-chip {
  display: inline-flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--color-border);
  border-radius: 8px;
}
.milestone-detail-panel__criterion-links {
  list-style: none;
  margin: var(--space-xs) 0 0;
  padding: 0;
}
.milestone-detail-panel__criterion-link-label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  cursor: pointer;
}
.milestone-detail-panel__criterion-link-editor {
  margin-top: var(--space-xs);
  margin-left: 1.5rem;
}
.milestone-detail-panel__criterion-link-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  list-style: none;
  cursor: pointer;
  user-select: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text-muted);
  background: transparent;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.milestone-detail-panel__criterion-link-toggle:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
  color: var(--color-text);
}
.milestone-detail-panel__criterion-link-editor[open] > .milestone-detail-panel__criterion-link-toggle {
  border-color: var(--color-border-hover);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  color: var(--color-text);
}
.milestone-detail-panel__criterion-link-toggle::-webkit-details-marker { display: none; }
.milestone-detail-panel__link-icon {
  width: 0.9rem;
  height: 0.9rem;
}
.milestone-detail-panel__criterion-link-editor .milestone-detail-panel__criterion-links {
  margin-top: var(--space-sm);
}
.milestone-detail-panel__linked-tasks {
  list-style: none;
  margin: 0;
  padding: 0 0 0 1.5rem;
}
.milestone-detail-panel__linked-tasks li {
  padding: 0.1rem 0;
}

.milestone-detail-panel__status-group {
  margin-left: auto;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}
.milestone-detail-panel__status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  line-height: 1.2;
  color: var(--color-text-muted);
  user-select: none;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-text) 12%, transparent);
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.milestone-detail-panel__status-group .milestone-detail-panel__status {
  margin-left: 0;
}
.milestone-detail-panel__status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--color-text) 35%, transparent);
}
.milestone-detail-panel__status--open {
  color: var(--color-text-muted);
  border-color: color-mix(in srgb, var(--color-text) 14%, transparent);
  background: color-mix(in srgb, var(--color-text) 4%, transparent);
}
.milestone-detail-panel__status--open .milestone-detail-panel__status-dot {
  background: color-mix(in srgb, var(--color-text) 35%, transparent);
}
.milestone-detail-panel__status--in-review {
  color: color-mix(in srgb, var(--color-warning) 85%, var(--color-text));
  border-color: color-mix(in srgb, var(--color-warning) 35%, transparent);
  background: color-mix(in srgb, var(--color-warning) 12%, transparent);
}
.milestone-detail-panel__status--in-review .milestone-detail-panel__status-dot {
  background: var(--color-warning);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-warning) 18%, transparent);
}
.milestone-detail-panel__status--accepted {
  color: color-mix(in srgb, var(--color-success) 80%, var(--color-text));
  border-color: color-mix(in srgb, var(--color-success) 35%, transparent);
  background: color-mix(in srgb, var(--color-success) 12%, transparent);
}
.milestone-detail-panel__status--accepted .milestone-detail-panel__status-dot {
  background: var(--color-success);
}
.milestone-detail-panel__status--locked {
  color: var(--color-text-muted);
  border-color: color-mix(in srgb, var(--color-text) 22%, transparent);
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
}
.milestone-detail-panel__status--locked .milestone-detail-panel__status-dot {
  background: transparent;
  border: 1px solid var(--color-text-muted);
  width: 5px;
  height: 5px;
}
.milestone-detail-panel__status--frozen {
  color: color-mix(in srgb, #60a5fa 70%, var(--color-text));
  border-color: color-mix(in srgb, #60a5fa 30%, transparent);
  background: color-mix(in srgb, #60a5fa 10%, transparent);
}
.milestone-detail-panel__status--frozen .milestone-detail-panel__status-dot {
  background: #60a5fa;
}

.milestone-detail-panel__acceptance-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.milestone-detail-panel__acceptance-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs);
  width: fit-content;
  max-width: 100%;
}

.milestone-detail-panel__acceptance-doc,
.milestone-detail-panel__acceptance-doc-active {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-xs);
  width: 100%;
  max-width: 100%;
}

.milestone-detail-panel__acceptance-doc-active .app-input {
  width: 100%;
}

.milestone-detail-panel__acceptance-history {
  width: 100%;
}

.milestone-detail-panel__acceptance-history-list {
  list-style: none;
  margin: var(--space-xs) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.milestone-detail-panel__acceptance-error {
  color: var(--color-danger);
  margin: 0;
}

/* Eigenständige Meilenstein-Ansicht: Panel füllt die Seite statt der Seitenleiste */
.milestone-detail-panel--standalone {
  flex: 1 1 auto;
  width: 100%;
  height: auto;
  max-height: none;
}
.milestone-detail-panel--standalone .task-detail-panel__body {
  flex: none;
  overflow: visible;
}

.milestone-detail-panel__blocked-hint { margin: 0; }

.milestone-detail-panel__upload-btn {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.milestone-detail-panel__upload-btn input[type="file"] { display: none; }

.milestone-detail-panel__footer-danger {
  margin-left: auto;
  display: flex;
  gap: var(--space-sm);
}

/* Innere details-Elemente im gleichen Chevron-Stil wie die Fold-Header */
.milestone-detail-panel__acceptance-history > summary {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  cursor: pointer;
  list-style: none;
  color: var(--color-text-muted);
}
.milestone-detail-panel__acceptance-history > summary::-webkit-details-marker { display: none; }
.milestone-detail-panel__acceptance-history > summary::before {
  content: "";
  flex-shrink: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1.5px solid var(--color-text-muted);
  border-bottom: 1.5px solid var(--color-text-muted);
  transform: rotate(-45deg);
  transition: transform 0.12s ease;
}
.milestone-detail-panel__acceptance-history[open] > summary::before {
  transform: rotate(45deg);
}
.milestone-detail-panel__acceptance-history > summary:hover { color: var(--color-text); }

.milestone-detail-panel__lineage {
  list-style: none;
  margin: 0 0 var(--space-sm);
  padding: 0;
}

.milestone-detail-panel__req-chips {
  display: block;
  margin-left: 1.25rem;
}

.milestone-scope-editor {
  margin: 0;
  padding-top: 0;
  border-top: none;
}

.milestone-scope-editor__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-xs);
  margin-bottom: var(--space-md);
}
.milestone-scope-editor__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--space-xs);
  width: fit-content;
  max-width: 100%;
}
.milestone-scope-editor__actions .app-btn {
  padding: 0.35rem 0.7rem;
  font-size: 0.75rem;
  line-height: 1.2;
}
.milestone-scope-editor__inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-sm);
}
.milestone-split-dialog__part-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-sm);
}
.milestone-scope-editor__search,
.milestone-detail-panel__search {
  width: 100%;
  margin-bottom: var(--space-sm);
}
.milestone-scope-editor__search-empty,
.milestone-detail-panel__search-empty {
  margin: 0 0 var(--space-sm);
}

.milestone-scope-editor__list {
  list-style: none;
  margin: var(--space-sm) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.milestone-scope-editor__section-row {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-xs);
}

.milestone-scope-editor__items {
  list-style: none;
  margin: 0;
  padding: 0 0 0 var(--space-md);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.milestone-scope-editor__item-label {
  display: flex;
  align-items: flex-start;
  gap: var(--space-xs);
}
.milestone-scope-editor__active {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.milestone-scope-editor__active-item {
  display: flex;
  gap: var(--space-sm);
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.milestone-scope-editor__active-kind {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  min-width: 5rem;
}
.milestone-scope-editor__suggestions {
  list-style: none;
  margin: 0 0 var(--space-sm);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  max-height: 14rem;
  overflow-y: auto;
}

.milestone-scope-editor__compact {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-top: var(--space-sm);
}

.milestone-scope-editor__compact-section {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-md);
  background: var(--color-surface-raised, transparent);
}

.milestone-scope-editor__compact-heading {
  margin: 0 0 var(--space-sm);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.35;
}

.milestone-scope-editor__compact-subheading {
  margin: var(--space-sm) 0 var(--space-xs);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.milestone-scope-editor__compact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.milestone-scope-editor__compact-item {
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
}
.milestone-scope-editor__compact-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs) var(--space-sm);
  justify-content: space-between;
}
.milestone-scope-editor__create-task {
  flex-shrink: 0;
}

.milestone-scope-editor__compact-item:last-child {
  border-bottom: none;
}

.milestone-scope-editor__compact-text {
  display: block;
  font-size: 0.875rem;
  line-height: 1.45;
  flex: 1;
  min-width: 0;
}

.milestone-scope-editor__compact-tasks {
  list-style: none;
  margin: var(--space-xs) 0 0;
  padding: 0 0 0 var(--space-md);
}

.milestone-scope-editor__hint {
  margin: 0 0 var(--space-xs);
}

.milestone-detail-panel__block {
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

.milestone-detail-panel__fold {
  border-top: 1px solid var(--color-border);
}

.milestone-detail-panel__fold:first-of-type {
  border-top: none;
}

.milestone-detail-panel__fold-header {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  width: 100%;
  padding: var(--space-sm) 0;
  border: none;
  background: transparent;
  color: var(--color-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.milestone-detail-panel__fold-header:hover {
  color: var(--color-text);
  opacity: 0.9;
}

.milestone-detail-panel__fold-chevron {
  flex-shrink: 0;
  width: 0.625rem;
  height: 0.625rem;
  border-right: 1.5px solid var(--color-text-muted);
  border-bottom: 1.5px solid var(--color-text-muted);
  transform: rotate(-45deg);
  transition: transform 0.12s ease;
  margin-top: -2px;
}

.milestone-detail-panel__fold--open .milestone-detail-panel__fold-chevron {
  transform: rotate(45deg);
  margin-top: 2px;
}

.milestone-detail-panel__fold-title {
  flex: 1;
  min-width: 0;
  font-size: 0.875rem;
  font-weight: 600;
}

.milestone-detail-panel__fold-lamp {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.milestone-detail-panel__fold-lamp--done { background: var(--color-success); }
.milestone-detail-panel__fold-lamp--warn { background: #ffb74d; }

.milestone-detail-panel__fold-help {
  margin: 0 0 var(--space-sm);
  padding-left: calc(0.625rem + var(--space-sm));
}

.milestone-detail-panel__info-toggle {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  font-style: italic;
  font-family: Georgia, serif;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.milestone-detail-panel__info-toggle:hover {
  color: var(--color-text);
  border-color: var(--color-text-muted);
}
.milestone-detail-panel__info-toggle--active {
  color: var(--color-text);
  border-color: var(--color-text);
}

.milestone-detail-panel__fold-meta {
  flex-shrink: 0;
  margin-left: auto;
}

.milestone-detail-panel__fold-body {
  padding: 0 0 var(--space-md);
}

.milestone-detail-panel__fold-body--scope {
  padding-bottom: var(--space-md);
}

.milestone-detail-panel__fold-body--scope .milestone-scope-editor {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.milestone-detail-panel__body {
  gap: var(--space-sm);
}

.milestone-detail-panel__checklist-filter {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 2px;
  margin-bottom: var(--space-sm);
  padding: 2px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.milestone-detail-panel__filter-btn {
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 0.75rem;
  padding: 0.2rem 0.5rem;
  border-radius: calc(var(--radius-sm) - 2px);
  cursor: pointer;
}

.milestone-detail-panel__filter-btn:hover {
  color: var(--color-text);
}

.milestone-detail-panel__filter-btn--active {
  background: color-mix(in srgb, var(--color-text) 10%, transparent);
  color: var(--color-text);
}

.milestone-detail-panel__block-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-sm);
  margin-bottom: var(--space-xs);
}

.milestone-detail-panel__block-lead {
  margin: 0 0 var(--space-sm);
}

.milestone-detail-panel__block-title {
  margin: 0 0 var(--space-sm);
}

.milestone-detail-panel__title-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-md);
  align-items: end;
}

.milestone-detail-panel__title-field {
  min-width: 0;
}

.milestone-detail-panel__color-field {
  flex-shrink: 0;
}

.milestone-detail-panel__dates {
  margin-top: var(--space-md);
}

.milestone-detail-panel__section-heading {
  margin: var(--space-md) 0 var(--space-sm);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-muted);
}

.milestone-detail-panel__criteria-section:first-child .milestone-detail-panel__section-heading {
  margin-top: 0;
}

.milestone-detail-panel__task-item {
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
}

.milestone-detail-panel__task-item:last-child {
  border-bottom: none;
}

.milestone-detail-panel__task-item--selected {
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  border-radius: var(--radius-sm);
  margin-inline: calc(-1 * var(--space-xs));
  padding-inline: var(--space-xs);
}

.milestone-detail-panel__progress {
  white-space: nowrap;
}
.create-milestone-dialog {
  width: min(32rem, calc(100vw - 2rem));
}
.create-milestone-dialog__body {
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  max-height: min(70vh, 28rem);
  overflow-y: auto;
}
.create-milestone-dialog__footer {
  display: flex;
  gap: var(--space-sm);
  padding: var(--space-md);
  border-top: 1px solid var(--color-border);
}

.milestone-split-dialog {
  max-width: 32rem;
}

.milestone-split-dialog__part {
  margin-bottom: var(--space-md);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--color-border);
}

.milestone-split-dialog__footer {
  display: flex;
  gap: var(--space-sm);
  justify-content: flex-end;
  padding: var(--space-md);
  border-top: 1px solid var(--color-border);
}

/* Markdown field (milestone description, acceptance notes) */
.markdown-field__box {
  position: relative;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  min-height: 5rem;
}
.markdown-field__toolbar {
  position: absolute;
  top: var(--space-xs);
  right: var(--space-xs);
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 2px;
}
.markdown-field__icon {
  width: 0.875rem;
  height: 0.875rem;
}
.markdown-field__editor {
  width: 100%;
  border: none;
  background: transparent;
  padding: calc(var(--space-md) + 0.25rem) var(--space-sm) var(--space-sm);
  padding-right: calc(var(--space-sm) + 7.5rem);
  min-height: 5rem;
  resize: vertical;
}
.markdown-field__editor:focus {
  outline: none;
  box-shadow: none;
}
.markdown-field__placeholder {
  margin: 0;
  padding: calc(var(--space-md) + 0.25rem) var(--space-sm) var(--space-sm);
  padding-right: calc(var(--space-sm) + 3.5rem);
  line-height: 1.45;
}
.markdown-field__content {
  padding: calc(var(--space-md) + 0.25rem) var(--space-sm) var(--space-sm);
  padding-right: calc(var(--space-md) + 3.5rem);
  overflow-wrap: anywhere;
  max-height: 22rem;
  overflow-y: auto;
}
.markdown-field__file-input {
  display: none;
}
.markdown-field__help {
  margin-top: 0.35rem;
}
.entity-link-picker {
  width: min(28rem, calc(100vw - 2rem));
  max-height: min(32rem, calc(100vh - 2rem));
  display: flex;
  flex-direction: column;
}
.entity-link-picker__tabs {
  display: flex;
  gap: 0.25rem;
  padding: 0 var(--space-md);
  border-bottom: 1px solid var(--color-border);
}
.entity-link-picker__tab {
  appearance: none;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.875rem;
  padding: 0.55rem 0.65rem;
}
.entity-link-picker__tab--active {
  border-bottom-color: var(--color-accent, var(--color-primary));
  color: var(--color-text);
  font-weight: 600;
}
.entity-link-picker__search {
  padding: var(--space-sm) var(--space-md) 0;
}
.entity-link-picker__body {
  max-height: 18rem;
  min-height: 8rem;
}
.entity-link-picker__row {
  align-items: flex-start;
  flex-direction: column;
  gap: 0.15rem;
  text-align: left;
  width: 100%;
}
.entity-link-picker__row-title {
  font-size: 0.9rem;
}
.entity-link-picker__row-meta {
  line-height: 1.3;
}
.spec-editor__media-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.spec-editor__media-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}
.markdown-body {
  line-height: 1.5;
  font-size: 0.875rem;
}
.markdown-body > :first-child { margin-top: 0; }
.markdown-body > :last-child { margin-bottom: 0; }
.markdown-body p { margin: 0 0 0.5em; }
.markdown-body ul,
.markdown-body ol {
  margin: 0 0 0.5em;
  padding-left: 1.25rem;
}
.markdown-body li { margin-bottom: 0.25em; }
.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
  margin: 0.75em 0 0.35em;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.3;
}
.markdown-body h1 { font-size: 1.0625rem; }
.markdown-body code {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 0.8125rem;
  background: var(--color-hover-overlay);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}
.markdown-body pre {
  margin: 0 0 0.5em;
  padding: var(--space-sm);
  background: var(--color-hover-overlay);
  border-radius: var(--radius-sm);
  overflow-x: auto;
}
.markdown-body pre code {
  padding: 0;
  background: none;
}
.markdown-body blockquote {
  margin: 0 0 0.5em;
  padding-left: var(--space-sm);
  border-left: 2px solid var(--color-border);
  color: var(--color-text-muted);
}
.markdown-body a {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.markdown-body hr {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: 0.75em 0;
}
.markdown-body img,
.spec-plantuml-figure__image {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
  margin: 0.75em auto;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
}
.markdown-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75em 0;
  font-size: 0.875rem;
}
.markdown-body th,
.markdown-body td {
  border: 1px solid var(--color-border);
  padding: 0.4rem 0.55rem;
  text-align: left;
  vertical-align: top;
}
.markdown-body th {
  background: var(--color-surface-elevated);
  font-weight: 600;
}
.pagebreak-hint {
  margin: 0.75em 0;
  padding: 0.35rem 0.5rem;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text-muted);
  font-size: 0.75rem;
  text-align: center;
}
.spec-plantuml-figure {
  margin: 0.75em 0;
}
.spec-plantuml-figure .spec-plantuml-figure__image {
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
}
.spec-figure-wrap {
  margin: 0.75em auto;
}
.spec-plantuml-figure__source {
  margin-top: 0.5rem;
  padding: 0.65rem;
  border-radius: var(--radius-sm);
  background: var(--color-surface-elevated);
  overflow-x: auto;
  font-size: 0.75rem;
}
.specification-markdown-body > :first-child { margin-top: 0; }
.specification-markdown-body > :last-child { margin-bottom: 0; }
.markdown-body--large {
  font-size: 1rem;
  line-height: 1.6;
}
.markdown-body--large h1 { font-size: 1.375rem; }
.markdown-body--large h2 { font-size: 1.2rem; }
.markdown-body--large h3 { font-size: 1.0625rem; }
.markdown-body--large h4 { font-size: 1rem; }
.markdown-field-dialog {
  position: fixed;
  z-index: 1101;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(110rem, calc(100vw - 4rem));
  max-width: min(110rem, calc(100vw - 4rem));
  min-width: min(20rem, calc(100vw - 2rem));
  max-height: min(92vh, 60rem);
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.markdown-field-dialog .context-menu__header {
  padding: var(--space-sm) var(--space-md);
}
.markdown-field-dialog .context-menu__title {
  font-size: 0.8125rem;
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text);
}
.markdown-field-dialog__toolbar {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  padding: var(--space-xs) var(--space-md);
  border-bottom: 1px solid var(--color-border);
}
.markdown-field-dialog__body {
  flex: 1;
  min-height: 0;
  padding: var(--space-md);
  overflow: auto;
}
.markdown-field-dialog__content {
  overflow-wrap: anywhere;
}
.markdown-field-dialog__editor {
  width: 100%;
  min-height: min(70vh, 40rem);
  resize: vertical;
}
.markdown-field-dialog__footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md) var(--space-md);
  border-top: 1px solid var(--color-border);
}

.acceptance-page__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
  align-items: flex-end;
}
.acceptance-matrix {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  overflow-x: auto;
}
.acceptance-matrix__head,
.acceptance-matrix__row {
  display: grid;
  grid-template-columns: 9rem repeat(3, minmax(10rem, 1fr));
  gap: var(--space-sm);
  align-items: start;
}
.acceptance-matrix__cell {
  position: relative;
  min-height: 4rem;
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-text) 2%, transparent);
}
.acceptance-matrix__cell--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  border-style: dashed;
  background: transparent;
  color: var(--color-text-muted);
  opacity: 0.55;
}
.acceptance-matrix__cell--ready {
  border-color: color-mix(in srgb, var(--color-accent) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-accent) 5%, transparent);
}
.acceptance-matrix__cell--anomaly {
  border-color: color-mix(in srgb, var(--color-warning) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-warning) 6%, transparent);
}
.acceptance-matrix__cell-count {
  position: absolute;
  top: var(--space-xs);
  right: var(--space-sm);
}
.acceptance-matrix__task {
  padding: var(--space-xs) 0;
  border-bottom: 1px solid var(--color-border);
}
.acceptance-matrix__task:last-child { border-bottom: none; }
.acceptance-matrix__task-title {
  display: block;
  font-weight: 500;
  color: inherit;
  text-decoration: none;
  padding-right: 1.25rem;
}
a.acceptance-matrix__task-title:hover { text-decoration: underline; }
.acceptance-matrix__task-project {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}
.acceptance-matrix__waiting { color: var(--color-text-muted); }

.scope-coverage-page__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
  align-items: flex-end;
}
.scope-coverage-page__summary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  align-items: center;
  color: var(--color-text-muted);
}
.scope-coverage-page__summary-sep { opacity: 0.5; }
.scope-coverage-page__gaps { color: #e57373; }
.scope-coverage-page__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
}
@media (min-width: 769px) {
  .scope-coverage-page__body--with-panel {
    flex-direction: row;
    align-items: stretch;
    gap: 0;
  }
  .scope-coverage-page__main {
    flex: 1 1 auto;
    min-width: 0;
  }
  .scope-coverage-page__panel {
    flex: 0 0 360px;
    min-width: 280px;
    display: flex;
    min-height: 0;
    border-left: 1px solid var(--color-border);
    position: sticky;
    top: calc(var(--nav-height) + var(--space-sm));
    align-self: flex-start;
    max-height: calc(100dvh - var(--nav-height) - 2 * var(--space-sm));
  }
  .scope-coverage-page__panel .milestone-detail-panel {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    max-height: 100%;
  }
}
.scope-coverage-page__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}
.scope-coverage-page__chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-text) 2%, transparent);
  color: var(--color-text);
  font-size: 0.875rem;
  cursor: pointer;
  transition: border-color 0.12s ease, background 0.12s ease;
}
.scope-coverage-page__chip:hover {
  border-color: color-mix(in srgb, var(--color-text) 25%, var(--color-border));
}
.scope-coverage-page__chip--active {
  border-color: color-mix(in srgb, var(--color-text) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
}
.scope-coverage-tree {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.scope-coverage-tree__section {
  border: 1px solid var(--color-border);
  border-radius: 10px;
  padding: var(--space-md);
  background: color-mix(in srgb, var(--color-text) 2%, transparent);
}
.scope-coverage-tree__section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}
.scope-coverage-tree__section-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  flex: 1 1 auto;
  min-width: 0;
}
.scope-coverage-tree__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--color-text) 20%, transparent);
}
.scope-coverage-tree__section--full .scope-coverage-tree__status-dot {
  background: color-mix(in srgb, var(--color-text) 35%, transparent);
}
.scope-coverage-tree__section--partial .scope-coverage-tree__status-dot,
.scope-coverage-tree__section--open .scope-coverage-tree__status-dot {
  background: color-mix(in srgb, #e57373 55%, transparent);
}
.scope-coverage-tree__milestone-link { margin-left: auto; }
.scope-coverage-tree__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.scope-coverage-tree__item {
  border-radius: 8px;
}
.scope-coverage-item--open {
  border-left: 3px solid color-mix(in srgb, #e57373 70%, transparent);
  padding-left: var(--space-sm);
  background: color-mix(in srgb, #e57373 4%, transparent);
}
.scope-coverage-item {
  display: grid;
  grid-template-columns: 2.75rem 4.25rem minmax(0, 1fr) minmax(11rem, 18rem);
  gap: var(--space-md);
  align-items: start;
  padding: var(--space-xs) 0;
}
.scope-coverage-item__kind {
  font-variant: all-small-caps;
  letter-spacing: 0.04em;
  padding-top: 0.1em;
}
.scope-coverage-item__code {
  font-variant-numeric: tabular-nums;
  padding-top: 0.1em;
}
.scope-coverage-item__code:empty {
  visibility: hidden;
}
.scope-coverage-item__label {
  min-width: 0;
  line-height: 1.45;
}
.scope-coverage-item__status {
  justify-self: end;
  text-align: right;
  min-width: 0;
}
.scope-coverage-item__status .app-btn--link {
  white-space: normal;
  text-align: right;
  max-width: 100%;
}
.scope-coverage-item__open { color: #e57373; }

.milestone-scope-fulfillment {
  margin-top: var(--space-xs);
}
.milestone-scope-fulfillment__toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  cursor: pointer;
  user-select: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text-muted);
  background: transparent;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.milestone-scope-fulfillment__toggle:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
  color: var(--color-text);
}
.milestone-scope-fulfillment__toggle--open {
  border-color: var(--color-border-hover);
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  color: var(--color-text);
}
.milestone-scope-fulfillment__icon {
  width: 0.9rem;
  height: 0.9rem;
}
.milestone-scope-fulfillment__badge-dot {
  position: absolute;
  top: 0.12rem;
  right: 0.12rem;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background: #e57373;
  border: 1px solid var(--color-surface);
}
.milestone-scope-fulfillment__badge {
  font-size: 0.75rem;
  color: #e57373;
  border: 1px solid color-mix(in srgb, #e57373 40%, var(--color-border));
  border-radius: 999px;
  padding: 0 var(--space-xs);
}
.milestone-scope-fulfillment__editor {
  margin-top: var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.milestone-scope-editor__copied-notice {
  margin: 0 0 var(--space-sm);
}
.specification-req-table__implementation {
  min-width: 12rem;
  resize: vertical;
}
.specification-criterion-list__item {
  align-items: stretch;
}
.specification-criterion-list__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  width: 100%;
}
.specification-criterion-list__implementation {
  resize: vertical;
}
.specification-criterion-list__actions {
  display: flex;
  gap: var(--space-sm);
  justify-content: flex-end;
}
.milestone-pdf-dialog__gaps-warning {
  margin: 0 0 var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid color-mix(in srgb, #e57373 35%, var(--color-border));
  border-radius: 8px;
  color: #e57373;
  background: color-mix(in srgb, #e57373 6%, transparent);
}
@media (max-width: 768px) {
  .scope-coverage-item {
    grid-template-columns: 2.75rem 1fr;
    grid-template-areas:
      "kind code"
      "label label"
      "status status";
    gap: var(--space-xs) var(--space-sm);
  }
  .scope-coverage-item__kind { grid-area: kind; }
  .scope-coverage-item__code {
    grid-area: code;
    justify-self: end;
  }
  .scope-coverage-item__code:empty { display: none; }
  .scope-coverage-item__label { grid-area: label; }
  .scope-coverage-item__status {
    grid-area: status;
    justify-self: start;
    text-align: left;
  }
  .scope-coverage-item__status .app-btn--link { text-align: left; }
}

/* ── Landing Page (Verkaufsseite für anonyme Besucher auf /) ─────────────── */
.app-main:has(.landing-page) {
  max-width: none;
  padding: 0;
}
.landing-page {
  display: flex;
  flex-direction: column;
  overflow-x: clip;
}
.landing-section__inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 var(--space-lg);
  width: 100%;
}
.landing-section {
  padding: calc(var(--space-xl) * 2) 0;
  scroll-margin-top: var(--nav-height);
}
.landing-section--alt {
  background: var(--color-surface);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}
.landing-section__title {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  letter-spacing: -0.02em;
  margin-bottom: var(--space-sm);
}
.landing-section__lead {
  color: var(--color-text-muted);
  font-size: 1.05rem;
  line-height: 1.6;
  max-width: 44rem;
  margin-bottom: var(--space-md);
}
.landing-kicker {
  display: inline-block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-sm);
}
.landing-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}
.landing-cta-row--center { justify-content: center; }
.landing-cta { padding: 0.65rem 1.4rem; font-size: 0.95rem; }

/* Hero */
.landing-hero { padding: calc(var(--space-xl) * 2) 0 calc(var(--space-xl) * 1.5); }
.landing-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: calc(var(--space-xl) * 1.5);
  align-items: center;
}
.landing-badge {
  display: inline-block;
  font-size: 0.75rem;
  padding: 0.25rem 0.75rem;
  border: 1px solid var(--color-border-hover);
  border-radius: 999px;
  color: var(--color-text-muted);
  margin-bottom: var(--space-md);
}
.landing-hero__title {
  font-size: clamp(2.1rem, 5vw, 3.2rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
  margin-bottom: var(--space-md);
}
.landing-hero__lead {
  color: var(--color-text-muted);
  font-size: 1.1rem;
  line-height: 1.65;
  max-width: 34rem;
}
.landing-hero__hint { margin-top: var(--space-md); }

/* Browser-/App-Mockup (reines CSS, themefähig) */
.landing-mock {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 24px 60px -32px rgba(0, 0, 0, 0.5);
}
.landing-mock__titlebar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface-2);
}
.landing-mock__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--color-border-hover);
}
.landing-mock__title {
  margin-left: var(--space-sm);
  font-size: 0.7rem;
  color: var(--color-text-muted);
  font-family: var(--font-mono);
}
.landing-mock__body {
  padding: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

/* Stempel-Dock-Mockup */
.landing-dock__timer {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
}
.landing-pulse {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--color-success);
  flex-shrink: 0;
  animation: landing-pulse 2s ease-in-out infinite;
}
@keyframes landing-pulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--color-success) 40%, transparent); }
  50% { box-shadow: 0 0 0 6px transparent; }
}
.landing-dock__timer-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.landing-dock__project { font-weight: 600; font-size: 0.9rem; }
.landing-dock__task { font-size: 0.75rem; color: var(--color-text-muted); }
.landing-dock__time {
  font-family: var(--font-mono);
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
}
.landing-dock__stop {
  padding: 0.3rem 0.8rem;
  border: 1px solid var(--color-border-hover);
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  color: var(--color-text);
}
.landing-dock__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
}
.landing-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.3rem 0.7rem;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  white-space: nowrap;
}
.landing-chip--active {
  border-color: var(--color-border-hover);
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.landing-chip__key {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0 4px;
  color: var(--color-text-muted);
}
.landing-chip__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.landing-dock__stats {
  display: flex;
  gap: var(--space-lg);
  font-size: 0.8rem;
  color: var(--color-text-muted);
}
.landing-dock__stats strong {
  color: var(--color-text);
  font-family: var(--font-mono);
  font-weight: 600;
}

/* Feature-Grid */
.landing-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.landing-feature {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  background: var(--color-surface);
  transition: border-color 0.15s ease;
}
.landing-feature:hover { border-color: var(--color-border-hover); }
.landing-feature__title { font-size: 1.05rem; margin-bottom: var(--space-sm); }
.landing-feature__text {
  font-size: 0.9rem;
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* Mini-Gantt-Mockup */
.landing-gantt {
  margin-top: var(--space-md);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.landing-gantt__row {
  height: 10px;
  border-radius: 5px;
  background: var(--color-hover-overlay);
  overflow: hidden;
  display: flex;
}
.landing-gantt__bar {
  display: block;
  height: 100%;
  border-radius: 5px;
  opacity: 0.75;
}
.landing-gantt__bar--milestone {
  width: 10px;
  background: var(--color-text);
  border-radius: 2px;
  transform: rotate(45deg) scale(0.8);
}

/* Zweispaltige Sektionen (MCP, Self-Hosting, Widget) */
.landing-split {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: calc(var(--space-xl) * 1.5);
  align-items: center;
}
.landing-split--reverse { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
.landing-split--reverse .landing-split__copy { order: 2; }
.landing-points {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.landing-points li {
  position: relative;
  padding-left: 1.5rem;
  font-size: 0.9rem;
  color: var(--color-text-muted);
}
.landing-points li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--color-success);
}

/* MCP-Terminal-Mockup */
.landing-terminal {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 24px 60px -32px rgba(0, 0, 0, 0.5);
}
.landing-terminal__bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface-2);
}
.landing-terminal__body {
  padding: var(--space-md);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  line-height: 1.9;
  color: var(--color-text-muted);
}
.landing-terminal__line--user { color: var(--color-text); }
.landing-terminal__line--tool { opacity: 0.7; }
.landing-terminal__line--ok { color: var(--color-success); }

/* Self-Hosting-Karte */
.landing-host-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.landing-host-card__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
}
.landing-host-card__label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.landing-host-card__value { font-weight: 600; font-size: 0.9rem; }
.landing-host-card__value--mono { font-family: var(--font-mono); font-weight: 400; }
.landing-host-card__divider {
  text-align: center;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.landing-host-card__foot {
  text-align: center;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  font-family: var(--font-mono);
}

/* Widget-Mockup */
.landing-widget-mock { display: flex; justify-content: center; }
.landing-dock__timer--widget {
  min-width: 280px;
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: 0 24px 60px -32px rgba(0, 0, 0, 0.5);
}

/* Pricing */
.landing-pricing {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
  margin-top: var(--space-lg);
  max-width: 760px;
}
.landing-price-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.landing-price-card--highlight { border-color: var(--color-border-hover); }
.landing-price-card__name {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted);
}
.landing-price-card__price {
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.landing-price-card__period { font-size: 0.8rem; color: var(--color-text-muted); }
.landing-price-card__features {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  flex: 1;
}
.landing-price-card__features li {
  position: relative;
  padding-left: 1.5rem;
  font-size: 0.85rem;
  color: var(--color-text-muted);
}
.landing-price-card__features li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--color-success);
}

/* FAQ */
.landing-faq { max-width: 720px; }
.landing-faq__item {
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-md) 0;
}
.landing-faq__item summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 0.95rem;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}
.landing-faq__item summary::-webkit-details-marker { display: none; }
.landing-faq__item summary::after {
  content: "+";
  color: var(--color-text-muted);
  font-size: 1.1rem;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.landing-faq__item[open] summary::after { transform: rotate(45deg); }
.landing-faq__item p {
  margin-top: var(--space-sm);
  font-size: 0.9rem;
  color: var(--color-text-muted);
  line-height: 1.65;
}

/* Projektleiter-Workflow (Pflichtenheft → Meilensteine → Abnahme) */
.landing-flow {
  list-style: none;
  padding: 0;
  margin: var(--space-lg) 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.landing-flow__step {
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
}
.landing-flow__num {
  width: 26px;
  height: 26px;
  border: 1px solid var(--color-border-hover);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-family: var(--font-mono);
  color: var(--color-text);
  flex-shrink: 0;
  margin-top: 1px;
}
.landing-flow__step strong { display: block; font-size: 0.95rem; margin-bottom: 2px; }
.landing-flow__step p {
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}
.landing-flow__ai {
  margin-top: var(--space-lg);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-left: 2px solid var(--color-success);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.6;
}

/* Meilenstein-Abnahme-Mockup */
.landing-milestone-mock {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-bg);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  box-shadow: 0 24px 60px -32px rgba(0, 0, 0, 0.5);
}
.landing-milestone-mock__head {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}
.landing-milestone-mock__diamond {
  width: 12px;
  height: 12px;
  background: var(--color-text);
  transform: rotate(45deg);
  border-radius: 2px;
  flex-shrink: 0;
}
.landing-milestone-mock__headings {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.landing-milestone-mock__title { font-weight: 600; font-size: 0.95rem; }
.landing-milestone-mock__date { font-size: 0.75rem; color: var(--color-text-muted); font-family: var(--font-mono); }
.landing-milestone-mock__status {
  font-size: 0.7rem;
  padding: 0.25rem 0.65rem;
  border: 1px solid color-mix(in srgb, var(--color-success) 45%, transparent);
  color: var(--color-success);
  border-radius: 999px;
  white-space: nowrap;
}
.landing-milestone-mock__scope {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.landing-milestone-mock__scope li {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.85rem;
  color: var(--color-text-muted);
}
.landing-milestone-mock__check { color: var(--color-success); flex-shrink: 0; }
.landing-milestone-mock__code {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0 5px;
  color: var(--color-text-muted);
  flex-shrink: 0;
}
.landing-milestone-mock__progress {
  height: 6px;
  border-radius: 3px;
  background: var(--color-hover-overlay);
  overflow: hidden;
}
.landing-milestone-mock__progress span {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--color-success);
  opacity: 0.7;
}
.landing-milestone-mock__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.landing-milestone-mock__btn {
  padding: 0.4rem 0.9rem;
  border-radius: var(--radius-sm);
  background: var(--color-accent);
  color: var(--color-bg);
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}

/* Gantt-Demo (Beispiel-Timeline) */
.landing-gantt-demo {
  --gd-label: 180px;
  position: relative;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  padding: var(--space-md);
  margin-top: var(--space-lg);
  overflow: hidden;
}
.landing-gantt-demo__row {
  display: grid;
  grid-template-columns: var(--gd-label) 1fr;
  gap: var(--space-sm);
  align-items: center;
  padding-block: 7px;
}
.landing-gantt-demo__row--head { padding-block: 0 var(--space-sm); }
.landing-gantt-demo__label {
  font-size: 0.8rem;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.landing-gantt-demo__weeks {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  font-size: 0.65rem;
  font-family: var(--font-mono);
  color: var(--color-text-muted);
  text-align: center;
}
.landing-gantt-demo__track {
  position: relative;
  height: 14px;
  border-radius: 7px;
  background: var(--color-hover-overlay);
}
.landing-gantt-demo__track--milestone { background: none; }
.landing-gantt-demo__bar {
  position: absolute;
  top: 0;
  height: 100%;
  border-radius: 7px;
  opacity: 0.75;
}
.landing-gantt-demo__milestone {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  background: var(--color-text);
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 2px;
}
/* Heute-Linie: Offset = Padding + Label-Spalte + Gap + 58% der Track-Breite */
.landing-gantt-demo__today {
  position: absolute;
  left: calc(var(--space-md) + var(--gd-label) + var(--space-sm) + (100% - 2 * var(--space-md) - var(--gd-label) - var(--space-sm)) * 0.58);
  top: calc(var(--space-md) + 1.5rem);
  bottom: var(--space-md);
  width: 1px;
  background: color-mix(in srgb, var(--color-warning) 65%, transparent);
}
.landing-gantt-demo__today-label {
  position: absolute;
  left: calc(var(--space-md) + var(--gd-label) + var(--space-sm) + (100% - 2 * var(--space-md) - var(--gd-label) - var(--space-sm)) * 0.58);
  top: var(--space-md);
  transform: translateX(-50%);
  font-size: 0.65rem;
  color: var(--color-warning);
  white-space: nowrap;
}
.landing-points--row {
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-md) var(--space-xl);
  margin-top: var(--space-lg);
}

/* Abschluss-CTA */
.landing-final__inner { text-align: center; }
.landing-final .landing-section__lead { margin-inline: auto; }

@media (max-width: 900px) {
  .landing-hero__inner,
  .landing-split,
  .landing-split--reverse { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
  .landing-split--reverse .landing-split__copy { order: 0; }
  .landing-feature-grid,
  .landing-pricing { grid-template-columns: minmax(0, 1fr); }
  .landing-section { padding: var(--space-xl) 0; }
  .landing-hero { padding: var(--space-xl) 0; }
  .landing-dock__time { font-size: 1rem; }
  .landing-gantt-demo { --gd-label: 110px; }
  .landing-gantt-demo__label { font-size: 0.7rem; }
  .landing-points--row { flex-direction: column; gap: var(--space-sm); }
}

/* Feature-Tour (Spotlight): Overlay-Elemente erzeugt planResuah.tour in JS,
   Karte und Kapitel-Uebersicht rendert FeatureTourHost.razor. */
.feature-tour-blocker {
  position: fixed;
  inset: 0;
  z-index: 1300;
  background: transparent;
}
.feature-tour-blocker--dim {
  background: rgba(0, 0, 0, 0.45);
}
.feature-tour-spotlight {
  position: fixed;
  z-index: 1301;
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border-hover);
  box-shadow: 0 0 0 200vmax rgba(0, 0, 0, 0.55);
  pointer-events: none;
  transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease;
}
.feature-tour-card {
  position: fixed;
  z-index: 1302;
  width: min(24rem, calc(100vw - 24px));
  padding: var(--space-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
  visibility: hidden; /* JS blendet die Karte nach der Positionierung ein */
}
/* Im Dark Mode hebt sich die Karte sonst kaum vom abgedunkelten Hintergrund ab:
   hellere Fläche, sichtbarer Rand und dezenter Licht-Ring. */
[data-theme="dark"] .feature-tour-card {
  background: var(--color-surface-2);
  border-color: var(--color-border-hover);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 16px 48px rgba(0, 0, 0, 0.75);
}
[data-theme="dark"] .feature-tour-overview__panel {
  background: var(--color-surface-2);
  border-color: var(--color-border-hover);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 16px 48px rgba(0, 0, 0, 0.75);
}
.feature-tour-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-sm);
}
.feature-tour-card__title {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: var(--space-xs);
}
.feature-tour-card__text {
  line-height: 1.55;
  color: var(--color-text-muted);
}
.feature-tour-card__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-top: var(--space-md);
}
.feature-tour-card__nav {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}
.feature-tour-card__quit {
  font-size: 0.8125rem;
}

/* Kapitel-Uebersicht (Hilfe & Tour) */
.feature-tour-overview {
  position: fixed;
  inset: 0;
  z-index: 1310;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-md);
}
.feature-tour-overview__backdrop {
  position: absolute;
  inset: 0;
  border: none;
  background: rgba(0, 0, 0, 0.45);
  cursor: default;
}
.feature-tour-overview__panel {
  position: relative;
  width: min(32rem, 100%);
  max-height: min(85vh, 42rem);
  overflow-y: auto;
  padding: var(--space-lg);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
}
.feature-tour-overview__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}
.feature-tour-overview__title {
  font-size: 1.125rem;
  font-weight: 600;
}
.feature-tour-overview__close {
  border: none;
  background: none;
  color: var(--color-text-muted);
  font-size: 0.875rem;
  cursor: pointer;
  padding: var(--space-xs);
}
.feature-tour-overview__close:hover {
  color: var(--color-text);
}
.feature-tour-overview__lead {
  margin-top: var(--space-xs);
}
.feature-tour-overview__handbook {
  display: inline-block;
  margin-top: var(--space-sm);
  color: var(--color-text-muted);
  text-decoration: none;
}
.feature-tour-overview__handbook:hover {
  color: var(--color-text);
  text-decoration: underline;
}
.feature-tour-overview__start {
  margin-top: var(--space-md);
  width: 100%;
}
.feature-tour-chapters {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0 0;
  display: flex;
  flex-direction: column;
}
.feature-tour-chapters__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--color-border);
}
.feature-tour-chapters__check {
  width: 1.25rem;
  flex-shrink: 0;
  text-align: center;
  font-size: 0.8125rem;
  color: var(--color-success);
  opacity: 0;
}
.feature-tour-chapters__check--done {
  opacity: 1;
}
.feature-tour-chapters__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.feature-tour-chapters__title {
  font-size: 0.875rem;
  font-weight: 500;
}
.feature-tour-chapters__btn {
  flex-shrink: 0;
  padding: 0.35rem 0.7rem;
  font-size: 0.75rem;
}

/* Einstieg in der Onboarding-Karte */
.onboarding-card__tour {
  margin-top: var(--space-md);
}

/* ── Share portal (guest) ───────────────────────────── */
.share-shell {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--bg);
}

.share-shell__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-md) var(--space-lg);
  border-bottom: 1px solid var(--border);
}

.share-shell__header-end {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  flex-wrap: wrap;
  justify-content: flex-end;
}

.share-shell__actions {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.share-shell__brand {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.planchi-mark--share {
  width: 28px;
  height: 28px;
}

.share-shell__brand-text {
  font-weight: 600;
  letter-spacing: -0.02em;
}

.share-shell__main {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: var(--space-lg);
  box-sizing: border-box;
}

.share-shell--feedback {
  height: 100dvh;
}

.share-shell--feedback .share-shell__main {
  padding: 0;
  overflow: hidden;
}

.share-shell--feedback .share-shell__main:has(.feedback-identity-gate) {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-lg);
  overflow: auto;
}

.share-shell__guest {
  font-size: 0.875rem;
}

@media (max-width: 640px) {
  .share-shell__header {
    padding: var(--space-sm) var(--space-md);
    gap: var(--space-sm);
  }
  .share-shell__header-end {
    gap: var(--space-sm);
  }
}

.share-portal {
  width: 100%;
  max-width: none;
}

.share-portal--plan-active {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.share-portal--plan-active .share-portal__header {
  margin-bottom: var(--space-md);
  flex-shrink: 0;
}

.share-portal--plan-active .share-portal__description {
  display: none;
}

.share-portal--plan-active .share-portal__tabs {
  flex-shrink: 0;
  margin-bottom: var(--space-sm);
}

.share-portal--plan-active .share-portal__panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.share-portal__header {
  margin-bottom: var(--space-lg);
}

.share-portal__gate {
  max-width: 28rem;
  margin: var(--space-xl) auto 0;
}

.share-portal__gate h1 {
  margin: 0 0 var(--space-sm);
  font-size: 1.5rem;
}

.share-portal__gate-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.share-portal__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.share-portal__title-row h1 {
  margin: 0;
  font-size: 1.75rem;
}

.share-portal__description {
  margin: var(--space-sm) 0 0;
}

.share-portal__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-bottom: var(--space-md);
  border-bottom: 1px solid var(--border);
  padding-bottom: var(--space-sm);
}

.share-portal__tab {
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font: inherit;
}

.share-portal__tab--active {
  color: var(--text);
  border-color: var(--border);
  background: var(--surface);
}

.share-portal__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--space-md);
}

.share-portal__stat-value {
  font-size: 1.25rem;
  font-weight: 600;
}

.share-portal__gantt {
  flex: 1;
  min-height: min(78dvh, 960px);
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.share-portal__gantt .gantt {
  flex: 1;
  min-height: 0;
  height: 100%;
  border: none;
  border-radius: 0;
}

.share-portal__gantt .gantt__frame {
  min-height: 0;
}

.share-portal__spec-section {
  margin-top: var(--space-lg);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.share-portal__req {
  margin-top: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
}

.share-portal__req-head {
  display: flex;
  gap: var(--space-sm);
  align-items: flex-start;
  flex-wrap: wrap;
}

.share-portal__code {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.75rem;
  color: var(--text-muted);
  flex-shrink: 0;
}

.share-portal__impl {
  margin-top: var(--space-sm);
  padding-top: var(--space-sm);
  border-top: 1px dashed var(--border);
}

.share-portal__docs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
}

.share-portal__document-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.share-portal__document-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-md);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.share-portal__document-label {
  display: block;
  font-weight: 500;
}

.project-documents__upload {
  margin-bottom: var(--space-md);
}

.project-documents__section-title {
  margin: 0 0 var(--space-sm);
  font-size: 1rem;
}

.project-documents__upload-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-md);
  margin-top: var(--space-md);
}

.project-documents__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.project-documents__upload-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.project-documents__file-input {
  display: block;
  width: 100%;
  max-width: 28rem;
  font-size: 0.875rem;
  color: var(--text-muted);
}

.project-documents__file-input::file-selector-button {
  margin-right: var(--space-sm);
  padding: 0.45rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--text);
  cursor: pointer;
}

.project-documents__file-input::file-selector-button:hover {
  border-color: var(--text-muted);
}

.project-documents__file-hint {
  margin: var(--space-xs) 0 0;
}

.project-documents__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.project-documents__item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
}

.project-documents__item-title {
  margin: 0;
  font-size: 1rem;
}

.project-documents__kind {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
  white-space: nowrap;
}

.project-documents__item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.share-portal__milestone-card {
  margin-bottom: var(--space-md);
}

.share-portal__milestone-scope {
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.share-portal__milestone-scope-title {
  margin: 0 0 var(--space-sm);
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}

.share-portal__scope-section {
  margin-top: var(--space-md);
}

.share-portal__scope-section-title {
  margin: 0 0 var(--space-sm);
  font-size: 1rem;
}

.share-portal__fulfillment {
  margin-left: auto;
  flex-shrink: 0;
  font-size: 0.75rem;
  padding: 0.1rem 0.45rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
}

.share-portal__fulfillment--ok {
  color: var(--text);
  border-color: color-mix(in srgb, var(--text) 25%, var(--border));
}

.share-portal__fulfillment--open {
  color: var(--text-muted);
}

.share-portal__milestone-head {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
}

.share-portal__milestone-toggle {
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  padding: 0;
  width: 1rem;
  font-size: 0.75rem;
  margin-top: 0.35rem;
}

.share-portal__milestone-dot {
  width: 12px;
  height: 12px;
  transform: rotate(45deg);
  flex-shrink: 0;
  margin-top: 0.35rem;
  border-radius: 2px;
}

.share-portal__status {
  margin-left: auto;
  font-size: 0.75rem;
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
}

.share-portal__matrix {
  list-style: none;
  padding: 0;
  margin: 0;
}

.share-portal__matrix li {
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.context-menu--modal {
  position: fixed;
  z-index: 1101;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  min-width: 0;
  max-width: none;
  max-height: min(92vh, 48rem);
  overflow: hidden;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-md);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.project-share-dialog {
  width: min(520px, calc(100vw - 2rem));
}

.project-share-dialog__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  padding: var(--space-md);
  max-height: min(70vh, 640px);
  overflow: auto;
}

.project-share-dialog__presets {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.project-share-dialog__preset {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.9rem;
  cursor: pointer;
}

.project-share-dialog__scopes {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.project-share-dialog__scope {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-size: 0.875rem;
  cursor: pointer;
}

.project-share-dialog__created {
  display: flex;
  gap: var(--space-sm);
  align-items: center;
}

.project-share-dialog__created .app-input {
  flex: 1;
  min-width: 0;
}

.project-share-dialog__links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.project-share-dialog__link-row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-sm);
  align-items: flex-start;
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--border);
}

.project-share-dialog__footer {
  display: flex;
  gap: var(--space-sm);
  padding: var(--space-md);
  border-top: 1px solid var(--border);
}

/* Help handbook (/hilfe) */
.help-page {
  max-width: 52rem;
  margin: 0 auto;
}
.help-page__lead {
  margin-top: var(--space-xs);
  max-width: 40rem;
}
.help-page__actions {
  margin-top: var(--space-md);
  flex-wrap: wrap;
}
.help-index {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: var(--space-md);
}
.help-index__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.help-index__card:hover {
  border-color: var(--color-border-hover);
  background: var(--color-surface-2);
}
.help-index__title {
  font-weight: 600;
  font-size: 0.9375rem;
}
.help-article__header h1 {
  margin-bottom: var(--space-xs);
}
.help-article__nav a,
.help-article__footer a {
  text-decoration: none;
}
.help-article__body {
  margin-top: var(--space-md);
}
.help-article__footer {
  padding-top: var(--space-lg);
  border-top: 1px solid var(--color-border);
  flex-wrap: wrap;
  gap: var(--space-sm);
}

/* Release Notes (/whats-new) */
.release-notes-page__section-title {
  margin: 0 0 var(--space-md);
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.release-notes-page .markdown-body > h1:first-child {
  display: none; /* Datei-Titel «Release Notes» ist auf der Seite redundant */
}
.release-notes-page .markdown-body > h2:first-of-type {
  display: none; /* Monats-Titel steht bereits als Section-Überschrift */
}

/* Stakeholders */
.stakeholders-page__scroll {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: var(--space-lg);
}
.stakeholders-page__section-title { font-size: 0.9375rem; font-weight: 500; margin: 0 0 var(--space-sm); }
.stakeholders-page__matrix-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}
.stakeholders-page__quad {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  min-height: 7rem;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  background: color-mix(in srgb, var(--color-surface-2) 40%, transparent);
}
.stakeholders-page__quad h3 { margin: 0 0 var(--space-xs); font-size: 0.8125rem; font-weight: 500; color: var(--color-text-muted); }
.stakeholders-page__quad--manage-closely { border-left: 2px solid color-mix(in srgb, var(--color-text) 45%, var(--color-border)); }
.stakeholders-page__matrix-axes { display: flex; justify-content: space-between; margin-top: var(--space-sm); }
.stakeholders-page__chip {
  align-self: flex-start;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  border-radius: var(--radius-sm);
  padding: 0.2rem 0.5rem;
  font-size: 0.8125rem;
  cursor: pointer;
  text-align: left;
}
.stakeholders-page__chip:hover { border-color: color-mix(in srgb, var(--color-text) 30%, var(--color-border)); }
.stakeholders-page__chip--critical { border-color: color-mix(in srgb, #f59e0b 50%, var(--color-border)); }
.stakeholders-page__table { display: flex; flex-direction: column; gap: 1px; }
.stakeholders-page__table-head,
.stakeholders-page__table-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 0.9fr 1fr 0.9fr;
  gap: var(--space-sm);
  align-items: center;
  padding: 0.65rem 0.75rem;
}
.stakeholders-page__table-head { font-size: 0.75rem; color: var(--color-text-muted); border-bottom: 1px solid var(--color-border); }
.stakeholders-page__table-row {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.stakeholders-page__table-row:hover { border-color: color-mix(in srgb, var(--color-text) 25%, var(--color-border)); }
.stakeholders-page__table-row--selected { border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-surface-2) 50%, transparent); }
.stakeholders-page__table-row--critical { border-left: 2px solid color-mix(in srgb, #f59e0b 60%, var(--color-border)); }
.stakeholders-page__critical {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0 0.35rem;
}
.stakeholders-page__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
}
.stakeholders-page__field { display: flex; flex-direction: column; gap: 0.35rem; }
.stakeholders-page__field--full { grid-column: 1 / -1; }
.stakeholders-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
@media (max-width: 720px) {
  .stakeholders-page__matrix-grid,
  .stakeholders-page__form { grid-template-columns: 1fr; }
  .stakeholders-page__table-head { display: none; }
  .stakeholders-page__table-row { grid-template-columns: 1fr; }
}

.entity-ref-picker {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 0;
}
.entity-ref-picker__field {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  text-align: left;
  padding: 0.45rem 2.25rem 0.45rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-surface);
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.entity-ref-picker__field:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--color-text) 30%, var(--color-border));
}
.entity-ref-picker__field:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.entity-ref-picker__name {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.entity-ref-picker__placeholder { font-size: 0.875rem; }
.entity-ref-picker__clear {
  position: absolute;
  right: 0.35rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.75rem;
  height: 1.75rem;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--color-text-muted);
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
}
.entity-ref-picker__clear:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-surface-2) 70%, transparent);
}
.entity-ref-picker__row--selected {
  border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface-2) 50%, transparent);
}

/* Risks page */
.risks-page__scroll {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: var(--space-lg);
}
.risks-page__section-title { font-size: 0.9375rem; font-weight: 500; margin: 0 0 var(--space-sm); }
.risks-page__form-section {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-muted);
  margin: var(--space-md) 0 var(--space-sm);
}
.risks-page__heatmap {
  display: grid;
  grid-template-columns: 2rem repeat(5, minmax(0, 1fr));
  gap: 2px;
}
.risks-page__heatmap-corner { min-height: 1.5rem; }
.risks-page__heatmap-colhead,
.risks-page__heatmap-rowhead {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  justify-content: center;
}
.risks-page__heatmap-cell {
  min-height: 4.5rem;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: 0.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  background: var(--color-surface);
}
.risks-page__heatmap-cell--low {
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
}
.risks-page__heatmap-cell--medium {
  background: color-mix(in srgb, #f59e0b 8%, var(--color-surface));
  border-color: color-mix(in srgb, #f59e0b 25%, var(--color-border));
}
.risks-page__heatmap-cell--high {
  background: color-mix(in srgb, #ef4444 10%, var(--color-surface));
  border-color: color-mix(in srgb, #ef4444 30%, var(--color-border));
}
.risks-page__matrix-axes {
  display: flex;
  justify-content: space-between;
  margin-top: var(--space-sm);
}
.risks-page__chip {
  display: block;
  width: 100%;
  text-align: left;
  font-size: 0.75rem;
  padding: 0.2rem 0.35rem;
  border-radius: 4px;
  border: 1px solid var(--color-border);
  background: var(--color-surface-2, var(--color-surface));
  color: var(--color-text);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.risks-page__chip:hover { border-color: color-mix(in srgb, var(--color-text) 30%, var(--color-border)); }
.risks-page__chip--unmanaged {
  border-color: color-mix(in srgb, #ef4444 50%, var(--color-border));
}
.risks-page__list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-sm);
}
.risks-page__list-head .risks-page__section-title { margin: 0; }
.risks-page__filter {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--color-text-muted);
  cursor: pointer;
  user-select: none;
}
.risks-page__table { display: flex; flex-direction: column; gap: 1px; }
.risks-page__table-head,
.risks-page__table-row {
  display: grid;
  grid-template-columns: minmax(8rem, 2fr) minmax(5rem, 1fr) 2.5rem 2.5rem 3rem minmax(5rem, 1fr) minmax(5rem, 1fr);
  gap: var(--space-sm);
  align-items: center;
  padding: 0.55rem 0.65rem;
}
.risks-page__table-head { font-size: 0.75rem; color: var(--color-text-muted); border-bottom: 1px solid var(--color-border); }
.risks-page__table-row {
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
}
.risks-page__table-row:hover { border-color: color-mix(in srgb, var(--color-text) 25%, var(--color-border)); }
.risks-page__table-row--selected {
  border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface-2) 50%, transparent);
}
.risks-page__table-row--unmanaged { border-left: 2px solid color-mix(in srgb, #ef4444 60%, var(--color-border)); }
.risks-page__badge {
  display: inline-block;
  margin-left: 0.35rem;
  font-size: 0.6875rem;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  border: 1px solid color-mix(in srgb, #ef4444 40%, var(--color-border));
  color: var(--color-text-muted);
}
.risks-page__badge--review {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--color-border));
}
.risks-page__form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
}
.risks-page__field { display: flex; flex-direction: column; gap: 0.35rem; }
.risks-page__field--full { grid-column: 1 / -1; }
.risks-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
@media (max-width: 720px) {
  .risks-page__heatmap { grid-template-columns: 1.5rem repeat(5, minmax(0, 1fr)); }
  .risks-page__heatmap-cell { min-height: 3.25rem; }
  .risks-page__form { grid-template-columns: 1fr; }
  .risks-page__table-head { display: none; }
  .risks-page__table-row { grid-template-columns: 1fr; }
}

/* Budget page */
.budget-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.budget-page__scroll {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: var(--space-lg);
}
.budget-page__summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: var(--space-md);
  margin: var(--space-lg) 0;
}
.budget-page__summary-card {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}
.budget-page__summary-value { font-size: 1.375rem; font-weight: 500; }
.budget-page__value--over { color: var(--color-danger); }
.budget-page__warning {
  margin: 0 0 var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid color-mix(in srgb, #d9a441 45%, var(--color-border));
  border-radius: var(--radius-sm);
  color: var(--color-text-muted);
}
.budget-page__card { margin-bottom: var(--space-lg); }
.budget-page__card h2 { margin: 0 0 var(--space-md); font-size: 1rem; }
.budget-page__totals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: var(--space-md);
  margin-bottom: var(--space-md);
}
.budget-page__total { display: flex; flex-direction: column; gap: 0.25rem; }
.budget-page__table { display: flex; flex-direction: column; gap: 1px; }
.budget-page__table-head,
.budget-page__table-row {
  display: grid;
  gap: var(--space-sm);
  align-items: center;
  padding: 0.65rem 0.75rem;
}
.budget-page__table--categories .budget-page__table-head,
.budget-page__table--categories .budget-page__table-row { grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 0.7fr; }
.budget-page__table--lines .budget-page__table-head,
.budget-page__table--lines .budget-page__table-row { grid-template-columns: 1fr 2fr 1.2fr 1fr; }
.budget-page__table--costs .budget-page__table-head,
.budget-page__table--costs .budget-page__table-row { grid-template-columns: 0.8fr 1fr 2fr 1fr 0.9fr 1fr; }
.budget-page__table-head { font-size: 0.75rem; color: var(--color-text-muted); border-bottom: 1px solid var(--color-border); }
.budget-page__table-row {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
}
button.budget-page__table-row { cursor: pointer; }
button.budget-page__table-row:hover { border-color: color-mix(in srgb, var(--color-text) 25%, var(--color-border)); }
.budget-page__table-row--selected { border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-surface-2) 50%, transparent); }
.budget-page__used--warn { color: #d9a441; }
.budget-page__used--critical { color: var(--color-danger); }
.budget-page__badge {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0 0.35rem;
}
.budget-page__badge--ordered { border-color: color-mix(in srgb, #d9a441 45%, var(--color-border)); }
.budget-page__badge--cancelled { text-decoration: line-through; }
.budget-page__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
  margin-bottom: var(--space-md);
}
.budget-page__field { display: flex; flex-direction: column; gap: 0.35rem; }
.budget-page__field--wide { grid-column: 1 / -1; }
.budget-page__form-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
@media (max-width: 900px) {
  .budget-page__form { grid-template-columns: 1fr; }
  .budget-page__table-head { display: none; }
  .budget-page__table--categories .budget-page__table-row,
  .budget-page__table--lines .budget-page__table-row,
  .budget-page__table--costs .budget-page__table-row { grid-template-columns: 1fr; }
}


/* Self-Host license banner */
.license-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  padding: 0.65rem 1.25rem;
  border-bottom: 1px solid var(--color-border);
  font-size: 0.875rem;
}
.license-banner--warn {
  background: color-mix(in srgb, #d9a441 14%, var(--color-bg));
  color: var(--color-text);
}
.license-banner--danger {
  background: color-mix(in srgb, var(--color-danger) 12%, var(--color-bg));
  color: var(--color-text);
}
.license-banner__link {
  flex-shrink: 0;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.license-admin__title {
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0 0 var(--space-sm);
}
.license-meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.25rem 1rem;
  margin: var(--space-sm) 0 0;
}
.license-meta dt { opacity: 0.7; }
.license-meta dd { margin: 0; }

/* Public self-host install (/self-host, /self-host/ki) */
.app-main:has(.selfhost-page) {
  max-width: none;
  padding: 0;
}
.selfhost-page {
  max-width: 44rem;
  margin: 0 auto;
  padding: calc(var(--space-xl) * 1.75) var(--space-md) calc(var(--space-xl) * 2.5);
}
.selfhost-page__header { margin-bottom: var(--space-md); }
.selfhost-page__eyebrow {
  display: inline-block;
  margin-bottom: var(--space-sm);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.selfhost-page__header h1 {
  margin: 0 0 var(--space-sm);
  font-size: clamp(1.75rem, 3.5vw, 2.25rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.15;
}
.selfhost-page__lead {
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.6;
  max-width: 38rem;
  color: var(--color-text-muted);
}
.selfhost-tabs {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  margin: var(--space-md) 0 var(--space-lg);
}
.selfhost-os {
  display: inline-flex;
  gap: 0.25rem;
  margin: 0;
  padding: 0.25rem;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
}
.selfhost-os__tab {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  font: inherit;
  font-size: 0.8125rem;
  padding: 0.4rem 0.9rem;
  border-radius: 7px;
  cursor: pointer;
  transition: color 0.12s ease, background 0.12s ease;
}
.selfhost-os__tab:hover { color: var(--color-text); }
.selfhost-os__tab--active {
  color: var(--color-text);
  background: var(--color-surface-2);
}
.selfhost-section--flush {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
.selfhost-code-block--tall .selfhost-code {
  max-height: min(32rem, 70vh);
  overflow: auto;
  padding-right: 8.5rem;
}
.selfhost-section h3 {
  margin: var(--space-lg) 0 var(--space-sm);
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.selfhost-section p { margin: 0 0 var(--space-sm); line-height: 1.6; }
.selfhost-section__lead {
  margin: calc(var(--space-sm) * -0.5) 0 var(--space-md);
  font-size: 0.875rem;
  color: var(--color-text-muted);
}
.selfhost-list,
.selfhost-steps {
  margin: 0;
  padding-left: 1.25rem;
  line-height: 1.6;
}
.selfhost-list li + li,
.selfhost-steps li + li { margin-top: 0.55rem; }
.selfhost-steps li .selfhost-code,
.selfhost-steps li .selfhost-note { margin-top: var(--space-sm); }
.selfhost-code {
  margin: 0;
  padding: 0.85rem 1rem;
  border: none;
  border-radius: 0;
  background: transparent;
  overflow-x: auto;
  font-size: 0.8125rem;
  line-height: 1.55;
}
.selfhost-code code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre;
  color: var(--color-text);
}
.selfhost-code-block {
  position: relative;
  margin: var(--space-sm) 0 0;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
}
.selfhost-code-block__copy {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  z-index: 1;
  appearance: none;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-bg);
  color: var(--color-text-muted);
  font: inherit;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.25rem 0.55rem;
  cursor: pointer;
  transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease;
}
.selfhost-code-block__copy:hover {
  color: var(--color-text);
  border-color: var(--color-border-hover);
}
.selfhost-code-block__copy--done {
  color: var(--color-text);
  border-color: var(--color-border-hover);
}
.selfhost-code-block .selfhost-code {
  padding: 0.85rem 5.5rem 0.85rem 1rem;
}
.selfhost-page__footer {
  margin-top: calc(var(--space-xl) * 1.25);
  padding-top: var(--space-lg);
  border-top: 1px solid var(--color-border);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}
.selfhost-page__footer p { margin: 0 0 var(--space-sm); }
.selfhost-page__next { margin-top: var(--space-md); }
.landing-price-card__links {
  margin: var(--space-sm) 0 0;
}
.landing-price-card__links a {
  color: var(--color-text-muted);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.landing-price-card__links a:hover { color: var(--color-text); }
.landing-price-card__note { margin-top: var(--space-sm); }

.selfhost-note {
  margin-top: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
}
.selfhost-note > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.65rem 0.85rem;
  cursor: pointer;
  font-size: 0.875rem;
  user-select: none;
  transition: color 0.12s ease;
}
.selfhost-note > summary:hover { color: var(--color-text-muted); }
.selfhost-note > summary::-webkit-details-marker { display: none; }
.selfhost-note > summary::after {
  content: '';
  margin-left: auto;
  width: 0.4rem;
  height: 0.4rem;
  border-right: 1.5px solid var(--color-text-muted);
  border-bottom: 1.5px solid var(--color-text-muted);
  transform: rotate(45deg);
  transition: transform 0.15s ease;
  flex-shrink: 0;
}
.selfhost-note[open] > summary::after { transform: rotate(-135deg); }
.selfhost-note__badge {
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: 0.1rem 0.45rem;
}
.selfhost-note__body {
  padding: 0 0.85rem 0.85rem;
  border-top: 1px solid var(--color-border);
  font-size: 0.875rem;
}
.selfhost-note__body > p { margin: var(--space-sm) 0 0; line-height: 1.6; }
.selfhost-note__body .selfhost-list,
.selfhost-note__body .selfhost-steps,
.selfhost-note__body .selfhost-dl,
.selfhost-note__body .selfhost-code-block { margin-top: var(--space-sm); }
.selfhost-dl {
  margin: var(--space-sm) 0 0;
  display: flex;
  flex-direction: column;
}
.selfhost-dl > div {
  display: grid;
  gap: 0.15rem;
  padding: 0.45rem 0;
  border-top: 1px solid var(--color-border);
}
.selfhost-dl > div:first-of-type { border-top: none; padding-top: 0.15rem; }
.selfhost-dl dt {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text);
}
.selfhost-dl--prose dt {
  font-family: inherit;
  font-size: 0.875rem;
}
.selfhost-download {
  margin: 0 0 var(--space-md);
}
.selfhost-download .app-btn {
  text-decoration: none;
}
.selfhost-section__note {
  margin: var(--space-md) 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}
.selfhost-dl dd {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.selfhost-page__crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0 0 var(--space-lg);
  align-items: center;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}
.selfhost-page__crumbs a {
  color: var(--color-text-muted);
  text-decoration: none;
}
.selfhost-page__crumbs a:hover {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.selfhost-page__crumb-sep { opacity: 0.5; }
.selfhost-sizing {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}
.selfhost-sizing__card {
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-surface);
}
.selfhost-sizing__label {
  margin: 0 0 0.4rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.selfhost-sizing__value {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.selfhost-sizing__note {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}
@media (max-width: 640px) {
  .selfhost-sizing { grid-template-columns: 1fr; }
}

.feedback-page { gap: var(--space-sm); }
.feedback-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  align-items: center;
  margin: var(--space-sm) 0;
}
.feedback-toolbar .app-select { min-width: 8rem; }
.feedback-round-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  align-items: flex-end;
  margin: 0 0 var(--space-md);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.feedback-round-form .plan-page__filter { display: flex; flex-direction: column; gap: 0.25rem; }
.feedback-round-form .plan-page__filter:last-child { flex-direction: row; align-items: center; }
.feedback-round-form__invite,
.feedback-round-invite {
  flex: 1 1 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.feedback-invited-note {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 var(--space-sm);
  padding: 0.45rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  color: var(--color-text-muted);
  font-size: 0.85rem;
}
.feedback-invited-note__change {
  border: none;
  background: none;
  padding: 0;
  color: var(--color-text);
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}
.feedback-stakeholder-invite {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-surface);
}
.feedback-stakeholder-invite__head {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
}
.feedback-stakeholder-invite__count {
  color: var(--color-text-muted);
  font-size: 0.8rem;
}
.feedback-stakeholder-invite__lead { margin: 0; }
.feedback-stakeholder-invite__section {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.feedback-stakeholder-invite__invited {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
}
.feedback-stakeholder-invite__invited-row {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.35rem 0.65rem;
  color: var(--color-text-muted);
}
.feedback-stakeholder-invite__invited-row + .feedback-stakeholder-invite__invited-row {
  border-top: 1px solid var(--color-border);
}
.feedback-stakeholder-invite__invited-row .feedback-stakeholder-invite__name {
  color: var(--color-text);
  font-weight: 400;
}
.feedback-stakeholder-invite__check {
  color: var(--color-success);
  font-size: 0.8rem;
}
.feedback-stakeholder-invite__selected {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
}
.feedback-stakeholder-invite__selected-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.65rem;
}
.feedback-stakeholder-invite__selected-row + .feedback-stakeholder-invite__selected-row {
  border-top: 1px solid var(--color-border);
}
.feedback-stakeholder-invite__selected-main {
  flex: 1 1 auto;
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  min-width: 0;
}
.feedback-stakeholder-invite__name { font-weight: 500; }
.feedback-stakeholder-invite__meta {
  color: var(--color-text-muted);
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.feedback-stakeholder-invite__meta--right { margin-left: auto; }
.feedback-stakeholder-invite__badge {
  color: var(--color-text-muted);
  font-size: 0.7rem;
  border: 1px dashed var(--color-border);
  border-radius: 999px;
  padding: 0.05rem 0.5rem;
  white-space: nowrap;
}
.feedback-stakeholder-invite__remove {
  border: none;
  background: none;
  color: var(--color-text-muted);
  font-size: 1rem;
  line-height: 1;
  padding: 0.15rem 0.35rem;
  cursor: pointer;
  border-radius: 6px;
}
.feedback-stakeholder-invite__remove:hover:not(:disabled) {
  color: var(--color-text);
  background: var(--color-hover-overlay);
}
.feedback-stakeholder-invite__results {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
}
.feedback-stakeholder-invite__results li + li .feedback-stakeholder-invite__result {
  border-top: 1px solid var(--color-border);
}
.feedback-stakeholder-invite__result {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  width: 100%;
  padding: 0.45rem 0.65rem;
  border: none;
  background: none;
  color: var(--color-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.feedback-stakeholder-invite__result:hover:not(:disabled) {
  background: var(--color-hover-overlay);
}
.feedback-stakeholder-invite__result:disabled { cursor: default; opacity: 0.6; }
.feedback-stakeholder-invite__result-add {
  color: var(--color-text-muted);
  font-weight: 600;
}
.feedback-stakeholder-invite__email {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: center;
  padding: 0.25rem 0 0.15rem 0;
}
.feedback-stakeholder-invite__email .app-input { flex: 1 1 14rem; }
.feedback-stakeholder-invite__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  padding: var(--space-sm);
  border: 1px solid var(--color-border);
  border-radius: 8px;
}
.feedback-stakeholder-invite__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: center;
}
.feedback-stakeholder-invite__footer {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  align-items: center;
}
.feedback-rounds {
  list-style: none;
  margin: 0 0 var(--space-md);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.feedback-rounds__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  align-items: center;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--color-border);
}
.feedback-rounds__name { font-weight: 600; }
.feedback-copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  margin: 0 0 var(--space-md);
}
.feedback-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.9fr);
  gap: var(--space-md);
  align-items: start;
}
.feedback-split__list,
.feedback-split__detail { display: flex; flex-direction: column; gap: var(--space-xs); }
.feedback-split__detail {
  position: sticky;
  top: 0.75rem;
  padding: var(--space-sm);
  border-left: 1px solid var(--color-border);
}
.feedback-board { max-width: 52rem; margin: 0 auto; padding: var(--space-sm) var(--space-md) var(--space-lg); }
.feedback-board--portal {
  max-width: none;
  margin: 0;
  height: 100%;
  min-height: 0;
  flex: 1;
  display: flex;
  align-items: stretch;
  padding: 0;
}
.feedback-board__main {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
  padding: var(--space-md) var(--space-lg) var(--space-lg);
}
.feedback-board--portal .feedback-board__main {
  padding: 1.25rem 1.75rem 2rem;
}
.feedback-board__inner {
  width: 100%;
  max-width: 80rem;
  margin: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
@media (min-width: 1400px) {
  .feedback-board__inner {
    max-width: none;
  }
}
.feedback-board__aside {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  border-left: 1px solid var(--color-border);
  padding: var(--space-sm) var(--space-md) var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  background: color-mix(in srgb, var(--color-bg) 92%, var(--color-text) 8%);
}
@media (max-width: 860px) {
  .feedback-board--portal {
    flex-direction: column;
  }
  .feedback-board__aside {
    border-left: 0;
    border-top: 1px solid var(--color-border);
  }
}
.feedback-board__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}
.feedback-board__who { flex: 0 1 auto; display: flex; justify-content: flex-end; }
.feedback-board__title { margin: 0; font-size: 1.25rem; font-weight: 600; }
.feedback-board__sub { margin: 0.15rem 0 0; color: var(--color-text-muted); font-size: 0.875rem; }
.feedback-board__filters,
.feedback-filters {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--space-sm);
  align-items: center;
  margin: var(--space-md) 0 var(--space-sm);
  overflow-x: auto;
}
.feedback-board__filters .app-select,
.feedback-filters .app-select { min-width: 8rem; flex: 0 1 11rem; }
.feedback-board__filters-label {
  flex: 0 0 auto;
  font-size: 0.75rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.feedback-board__active-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin: 0 0 var(--space-sm);
}
.feedback-composer__who {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.feedback-composer__who .app-input { max-width: 14rem; }
.feedback-card__code {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--color-text-muted);
  font-size: 0.8rem;
}
.feedback-card__edit {
  border: 0;
  background: none;
  color: var(--color-text-muted);
  font: inherit;
  font-size: 0.75rem;
  cursor: pointer;
  padding: 0;
}
.feedback-card__edit:hover { color: var(--color-text); }
.feedback-coverage { margin: 0 0 var(--space-sm); }
.feedback-coverage__head { display: flex; flex-direction: column; gap: 0.15rem; }
.feedback-coverage__title { margin: 0; font-size: 0.95rem; font-weight: 600; }
.feedback-coverage__search {
  width: 100%;
  margin: 0 0 0.45rem;
  padding: 0.28rem 0.5rem;
  font-size: 0.8rem;
}
.feedback-coverage__search-empty {
  margin: 0.45rem 0 0;
}
.feedback-coverage__filters {
  align-self: flex-start;
}
.feedback-coverage__filters .plan-page__view-filter {
  font-size: 0.75rem;
  padding: 0.3rem 0.55rem;
}
/* Status-Farben der Chips auch im Segmented-Control-Stil (inkl. Hover/Aktiv) beibehalten */
.feedback-coverage__filters .feedback-coverage__gaps--clarify { color: var(--color-warning); }
.feedback-coverage__filters .feedback-coverage__gaps--review { color: var(--color-accent); }
.feedback-coverage__filters .feedback-coverage__gaps--done { color: var(--color-success); }
.feedback-coverage__filters .feedback-coverage__gaps--declined { color: var(--color-danger); }
.feedback-coverage__detail {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-sm);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.feedback-coverage__detail-title {
  margin: 0.4rem 0 0;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.feedback-coverage__spec { margin: 0; white-space: pre-wrap; }
.feedback-coverage__item.is-selected {
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  border-radius: 6px;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}
.feedback-coverage-stack {
  display: block;
}
.feedback-coverage__list {
  list-style: none;
  margin: 0.4rem 0 0;
  padding: 0;
  display: block;
}
.feedback-coverage__list > li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.feedback-coverage__item {
  width: 100%;
  display: grid;
  grid-template-columns: 1rem auto minmax(0, 1fr);
  grid-template-areas:
    "mark kind label"
    ". assignees assignees"
    ". codes codes";
  gap: 0.15rem 0.4rem;
  align-items: baseline;
  text-align: left;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 0.25rem 0.35rem;
  border-radius: var(--radius-sm);
}
.feedback-coverage__item:hover {
  background: color-mix(in srgb, var(--color-text) 5%, transparent);
}
.feedback-coverage__item.is-open { color: var(--color-text); }
.feedback-coverage__item.is-clarify { color: var(--color-text); }
.feedback-coverage__item.is-review { color: var(--color-text); }
.feedback-coverage__item.is-done { color: var(--color-text-muted); }
.feedback-coverage__item.is-declined { color: var(--color-text-muted); }
.feedback-coverage__mark { grid-area: mark; }
.feedback-coverage__mark.is-uncovered { color: var(--color-text-muted); }
.feedback-coverage__mark.is-open { color: var(--color-text); }
.feedback-coverage__mark.is-clarify { color: var(--color-warning); }
.feedback-coverage__mark.is-review { color: var(--color-accent); }
.feedback-coverage__mark.is-done { color: var(--color-success); }
.feedback-coverage__mark.is-declined { color: var(--color-danger); }
.feedback-coverage__code.is-open { color: var(--color-text-muted); }
.feedback-coverage__code.is-clarify { color: var(--color-warning); }
.feedback-coverage__code.is-review { color: var(--color-accent); }
.feedback-coverage__code.is-done { color: var(--color-success); }
.feedback-coverage__code.is-declined { color: var(--color-danger); }
.feedback-coverage__kind {
  grid-area: kind;
  font-size: 0.7rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.feedback-coverage__label {
  grid-area: label;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.feedback-coverage__assignees {
  grid-area: assignees;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.feedback-coverage__codes {
  grid-area: codes;
  font-variant-numeric: tabular-nums;
  font-size: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem 0.35rem;
}
.feedback-coverage__details {
  margin: 0.15rem 0 0.35rem 1.4rem;
}
.feedback-board__list { display: flex; flex-direction: column; gap: 0.65rem; }
.feedback-composer {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-bottom: var(--space-sm);
  padding: 0.9rem 1rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.feedback-composer:focus-within {
  border-color: var(--color-border-hover);
}
.feedback-composer__kicker {
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.feedback-composer > .feedback-composer__input {
  border: 1px solid var(--color-border);
  background: var(--color-bg);
  box-shadow: none;
  outline: none;
  padding: 0.7rem 0.8rem;
  border-radius: var(--radius-sm);
}
.feedback-composer > .feedback-composer__input:focus {
  border-color: var(--color-border-hover);
}
.feedback-composer__input {
  min-height: 4.75rem;
  max-height: 15rem;
  field-sizing: content;
  overflow-y: auto;
  resize: none;
}
.feedback-composer__row { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.feedback-composer__row .app-btn--primary { margin-left: auto; }
.feedback-composer__linked-label {
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.feedback-scope-picker { position: relative; flex: 1 1 14rem; min-width: 12rem; }
.feedback-scope-picker__list {
  position: absolute;
  z-index: 8;
  left: 0;
  right: 0;
  top: calc(100% + 0.2rem);
  margin: 0;
  padding: 0.25rem;
  list-style: none;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-bg);
  max-height: 16rem;
  overflow: auto;
  box-shadow: 0 8px 24px color-mix(in srgb, #000 35%, transparent);
}
.feedback-scope-picker__item {
  width: 100%;
  display: flex;
  gap: 0.45rem;
  align-items: flex-start;
  text-align: left;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 0.35rem 0.4rem;
  border-radius: 6px;
}
.feedback-scope-picker__item:hover { background: color-mix(in srgb, var(--color-text) 8%, transparent); }
.feedback-identity-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-lg);
  background: color-mix(in srgb, #000 45%, transparent);
}
.feedback-identity-form--stack {
  flex-direction: column;
  align-items: stretch;
}
.feedback-identity-form__actions {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}
.feedback-identity-gate { width: min(28rem, 100%); }
.feedback-suggest, .feedback-attachments { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.feedback-chip {
  border: 1px solid var(--color-border);
  background: transparent;
  color: inherit;
  border-radius: 999px;
  padding: 0.1rem 0.55rem;
  font-size: 0.75rem;
}
button.feedback-chip { cursor: pointer; }
button.feedback-chip:hover { border-color: var(--color-border-hover); }
.feedback-chip.is-on { border-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border)); }
.feedback-chip__x { border: 0; background: none; color: var(--color-text-muted); cursor: pointer; margin-left: 0.25rem; }
.feedback-identity, .feedback-identity-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.feedback-identity {
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
}
.feedback-palette { display: flex; gap: 0.3rem; }
.feedback-palette__swatch, .feedback-dot {
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 50%;
  background: var(--fb-color);
  border: 1px solid color-mix(in srgb, var(--color-text) 20%, transparent);
  padding: 0;
}
.feedback-palette__swatch.is-active { outline: 2px solid var(--color-text); }
.feedback-card__author { display: inline-flex; align-items: center; gap: 0.35rem; font-weight: 500; }
.feedback-thumbs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.35rem 0; }
.feedback-thumb {
  display: block;
  width: 4.5rem;
  height: 4.5rem;
  border: 0;
  padding: 0;
  background: var(--color-surface-muted, transparent);
  overflow: hidden;
  border-radius: 6px;
}
.feedback-thumb img { width: 100%; height: 100%; object-fit: cover; }
.feedback-lightbox {
  position: fixed;
  inset: 0;
  background: color-mix(in srgb, #000 70%, transparent);
  display: grid;
  place-items: center;
  z-index: 40;
}
.feedback-lightbox img { max-width: 92vw; max-height: 92vh; }
.feedback-file { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.feedback-reply-row { display: flex; gap: 0.4rem; align-items: flex-start; margin-top: 0.35rem; }
.feedback-card__reqs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0 0 0.35rem;
}
.feedback-chip--ghost {
  cursor: pointer;
  color: var(--color-text-muted);
  background: transparent;
}
.feedback-chip--ghost:hover {
  color: var(--color-text);
  border-color: var(--color-border-hover);
}
.feedback-page__filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}
.feedback-page__composer {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}
.feedback-page__composer-input { min-height: 4.5rem; resize: vertical; }
.feedback-page__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}
.feedback-card {
  text-align: left;
  width: 100%;
  padding: 0.85rem 1.1rem;
  border: 1px solid var(--color-border);
  border-left-width: 3px;
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: inherit;
  font: inherit;
}
.feedback-board--portal .feedback-page__reply,
.feedback-board--internal .feedback-page__reply {
  margin: 0.55rem 0 0 0.6rem;
  padding: 0.1rem 0 0.1rem 0.85rem;
  border-top: 0;
  border-left: 2px solid var(--color-border);
}
.feedback-page__reply p { margin: 0.15rem 0 0; }
.feedback-page__reply .feedback-card__meta { margin-bottom: 0; }
.feedback-board--portal .feedback-reply-row,
.feedback-board--internal .feedback-reply-row {
  margin: 0.65rem 0 0 0.6rem;
}
.feedback-reply-row .app-input {
  flex: 1 1 auto;
  min-height: 2.1rem;
  field-sizing: content;
  resize: none;
}
.feedback-page--round {
  min-height: 0;
}
.feedback-board--internal {
  max-width: none;
  margin: 0;
  height: auto;
  min-height: 0;
  flex: 1;
  padding: 0;
  display: flex;
  align-items: stretch;
}
.feedback-board--internal.has-aside .feedback-board__aside {
  flex: 0 0 22rem;
  width: 22rem;
  max-width: 22rem;
  position: static;
  max-height: none;
  align-self: stretch;
}
.feedback-board.plan-page__body--with-coverage {
  gap: 0;
}
.feedback-board.plan-page__body--with-panel .plan-page__panel--task {
  display: flex;
  flex: 0 0 var(--task-panel-width, 360px);
  min-width: 280px;
  min-height: 0;
}
.feedback-board.plan-page__body--with-panel .plan-page__panel--task .task-detail-panel {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
}
.feedback-board .plan-page__panel--coverage {
  display: flex;
  flex: 0 0 var(--coverage-panel-width, 320px);
  min-width: 240px;
  min-height: 0;
}
.feedback-board .plan-page__panel--coverage .task-detail-panel,
.feedback-board .feedback-coverage-rail {
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  max-height: 100%;
}
.feedback-board .feedback-coverage-rail .task-detail-panel__body {
  overflow: auto;
}
.feedback-coverage-rail__toggle {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  padding: 0;
  text-align: left;
  cursor: default;
}
.feedback-coverage-rail__chevron {
  display: none;
  flex: 0 0 auto;
  width: 0.45rem;
  height: 0.45rem;
  border-right: 1.5px solid var(--color-text-muted);
  border-bottom: 1.5px solid var(--color-text-muted);
  margin-right: 0.2rem;
}
.feedback-board--internal .feedback-board__main {
  flex: 1 1 auto;
  min-width: 0;
  overflow: auto;
  padding: 1.25rem 1.75rem 2rem;
}
.feedback-coverage-panel__people {
  gap: 0.55rem;
}
.feedback-coverage-panel__members {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.feedback-coverage-panel__invite-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.feedback-coverage-panel__invited {
  margin: 0.25rem 0 0;
  padding-left: 1.1rem;
  color: var(--color-text-muted);
  font-size: 0.8125rem;
}
.feedback-card__select {
  flex: 1 1 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  align-items: baseline;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  padding: 0;
  cursor: pointer;
  text-align: left;
}
.feedback-card__select .feedback-card__status { margin-left: auto; }
.feedback-card__triage-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  flex-shrink: 0;
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text);
  font: inherit;
  font-size: 0.75rem;
  border-radius: 999px;
  padding: 0.15rem 0.6rem;
  cursor: pointer;
  white-space: nowrap;
}
.feedback-card__triage-toggle:hover,
.feedback-card__triage-toggle.is-open {
  border-color: var(--color-border-hover);
}
.feedback-card__triage-chevron {
  width: 0.35rem;
  height: 0.35rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  margin-top: -0.15rem;
}
.feedback-card__triage-toggle.is-open .feedback-card__triage-chevron {
  transform: rotate(-135deg);
  margin-top: 0.15rem;
}
.feedback-card__body--openable { cursor: pointer; }
.feedback-coverage-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.feedback-coverage-panel__accepted {
  margin: 0;
  flex: 1 1 100%;
  font-size: 0.8rem;
  color: var(--color-success);
}
.feedback-coverage-panel__accepted-meta {
  margin: -0.15rem 0 0;
  flex: 1 1 100%;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}
.feedback-coverage-panel__review {
  margin: 0;
  flex: 1 1 100%;
  font-size: 0.8rem;
  color: var(--color-text-muted);
}
@media (max-width: 860px) {
  .feedback-board--internal {
    flex-direction: column;
  }
  .feedback-board--internal.has-aside .feedback-board__aside {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    max-height: 40vh;
    border-left: 0;
    border-top: 1px solid var(--color-border);
  }
  /* Abdeckung als einklappbare Leiste oben statt fixem Block unten */
  .feedback-board .plan-page__panel--coverage {
    order: -1;
    position: static;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    max-height: none;
    margin: 0.85rem 0.85rem 0;
  }
  .feedback-board .feedback-coverage-rail {
    height: auto;
  }
  .feedback-board .feedback-coverage-rail .task-detail-panel__header {
    padding: 0.6rem 0.85rem;
    border-bottom: 0;
  }
  .feedback-board .feedback-coverage-rail:not(.feedback-coverage-rail--collapsed) .task-detail-panel__header {
    border-bottom: 1px solid var(--color-border);
  }
  .feedback-coverage-rail__toggle {
    cursor: pointer;
  }
  .feedback-coverage-rail__chevron {
    display: inline-block;
    transform: rotate(45deg);
    margin-top: -0.2rem;
  }
  .feedback-coverage-rail:not(.feedback-coverage-rail--collapsed) .feedback-coverage-rail__chevron {
    transform: rotate(-135deg);
    margin-top: 0.2rem;
  }
  .feedback-coverage-rail--collapsed .task-detail-panel__body {
    display: none;
  }
  .feedback-board .feedback-coverage-rail .task-detail-panel__body {
    max-height: 45vh;
    overflow: auto;
  }
  .feedback-board .plan-page__panel-resizer {
    display: none;
  }
  /* Detail-Panel als Bottom-Sheet – sonst wird es im Spalten-Layout zum Querband */
  .feedback-board.plan-page__body--with-panel .plan-page__panel.plan-page__panel--task {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 901;
    flex: none;
    width: 100%;
    min-width: 0;
    max-height: min(88vh, 100%);
  }
  .feedback-board.plan-page__body--with-panel .plan-page__panel.plan-page__panel--task .task-detail-panel {
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    border-bottom: none;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
    max-height: min(88vh, 100%);
  }
  .feedback-board .plan-page__panel-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 900;
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
  }
}
@media (max-width: 768px) {
  /* Portal: normale Dokument-Scrollseite statt Viewport-Split mit 40vh-Abdeckungsleiste */
  .share-shell--feedback {
    height: auto;
  }
  .share-shell--feedback .share-shell__main {
    overflow: visible;
  }
  .feedback-board--portal {
    height: auto;
  }
  .feedback-board--portal .feedback-board__main,
  .feedback-board--internal .feedback-board__main {
    overflow: visible;
    padding: 0.85rem 0.85rem 1.5rem;
  }
}
@media (max-width: 640px) {
  .feedback-board__head {
    flex-wrap: wrap;
    margin-bottom: var(--space-sm);
  }
  .feedback-board__who {
    flex: 1 1 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 0.4rem;
  }
  .feedback-composer {
    padding: 0.7rem 0.75rem 0.8rem;
  }
  .feedback-scope-picker {
    flex: 1 1 100%;
    min-width: 0;
  }
  .feedback-composer__row .app-btn--primary {
    flex: 1 0 auto;
  }
  .feedback-board__filters,
  .feedback-filters {
    gap: var(--space-xs);
    margin: var(--space-sm) 0;
    scrollbar-width: none;
  }
  .feedback-board__filters::-webkit-scrollbar,
  .feedback-filters::-webkit-scrollbar {
    display: none;
  }
  .feedback-card {
    padding: 0.7rem 0.75rem;
  }
  .feedback-board--portal .feedback-page__reply,
  .feedback-board--internal .feedback-page__reply {
    margin-left: 0.25rem;
    padding-left: 0.6rem;
  }
  .feedback-board--portal .feedback-reply-row,
  .feedback-board--internal .feedback-reply-row {
    margin-left: 0.25rem;
  }
}
.feedback-invite { margin: 0 0 var(--space-sm); }
.feedback-invite__form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}
.feedback-invite__form .app-input { flex: 1 1 10rem; }
.feedback-card:hover {
  border-top-color: var(--color-border-hover);
  border-right-color: var(--color-border-hover);
  border-bottom-color: var(--color-border-hover);
}
.feedback-card--selected {
  border-top-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border));
  border-right-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border));
  border-bottom-color: color-mix(in srgb, var(--color-text) 40%, var(--color-border));
}
.feedback-card--done { border-left-color: color-mix(in srgb, var(--color-success) 75%, transparent); }
.feedback-card--review { border-left-color: color-mix(in srgb, var(--color-accent) 55%, transparent); }
.feedback-card--clarify { border-left-color: color-mix(in srgb, var(--color-warning) 75%, transparent); }
.feedback-card--declined { border-left-color: color-mix(in srgb, var(--color-danger) 75%, transparent); }
.feedback-card--open { border-left-color: color-mix(in srgb, var(--color-text) 35%, transparent); }
.feedback-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.65rem;
  align-items: baseline;
  margin-bottom: 0.4rem;
}
.feedback-card__meta > .feedback-card__status { margin-left: auto; }
.feedback-card__author { font-weight: 500; }
.feedback-card--new {
  background: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
}
.feedback-card__new {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-text);
  border: 1px solid color-mix(in srgb, var(--color-text) 28%, var(--color-border));
  border-radius: 999px;
  padding: 0.05rem 0.45rem;
  white-space: nowrap;
}
.feedback-page__reply--new .feedback-card__new {
  flex: 0 0 auto;
}
.feedback-card__status {
  font-size: 0.72rem;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  padding: 0.05rem 0.5rem;
  white-space: nowrap;
}
.feedback-card--done .feedback-card__status {
  color: var(--color-success);
  border-color: color-mix(in srgb, var(--color-success) 45%, transparent);
}
.feedback-card--review .feedback-card__status {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-accent) 40%, transparent);
}
.feedback-card--clarify .feedback-card__status {
  color: var(--color-warning);
  border-color: color-mix(in srgb, var(--color-warning) 45%, transparent);
}
.feedback-card--declined .feedback-card__status {
  color: var(--color-danger);
  border-color: color-mix(in srgb, var(--color-danger) 45%, transparent);
}
.feedback-card__body { margin: 0 0 0.5rem; white-space: pre-wrap; }
.feedback-card__footer { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.feedback-page__triage {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
  margin: 0.35rem 0 0.65rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--color-surface) 70%, var(--color-bg));
}
.feedback-page__field { display: flex; flex-direction: column; gap: 0.35rem; }
.feedback-page__field--wide { grid-column: 1 / -1; }
.feedback-page__req-list { display: flex; flex-direction: column; gap: 0.35rem; max-height: 12rem; overflow: auto; }
.feedback-page__req { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.875rem; }
.feedback-page__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); grid-column: 1 / -1; }
.feedback-page__thread { display: flex; flex-direction: column; gap: var(--space-sm); margin-top: var(--space-md); }
.feedback-page__reply {
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--color-border);
}
.share-portal__feedback { display: flex; flex-direction: column; gap: var(--space-md); }
@media (max-width: 720px) {
  .feedback-page__triage { grid-template-columns: 1fr; }
  .feedback-split { grid-template-columns: 1fr; }
  .feedback-split__detail { position: static; border-left: 0; border-top: 1px solid var(--color-border); }
}