@charset "UTF-8";
.rg-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 28px;
}
@media (max-width: 720px) {
  .rg-shell {
    padding: 0 16px;
  }
}

label.required::after {
  content: "*";
  color: red;
}

.chart-container {
  width: 100%;
  height: 180px !important;
  position: relative;
  background: var(--rg-paper);
}

/*@media (prefers-color-scheme: dark) {
    .navbar-brand img {
        filter: invert(1);
    }
}*/
[data-bs-theme=dark] .navbar-brand img {
  filter: invert(1);
}

[data-bs-theme=light] .navbar-brand img {
  filter: invert(0);
}

[data-bs-theme=dark] .login-card .logo {
  filter: invert(1);
}

.bi {
  width: 1em;
  height: 1em;
  fill: currentcolor;
  vertical-align: -0.125em;
}

.color-modes .bi {
  width: 1.25rem;
  height: 1.25rem;
}

/* ── Degu detail: hero card ── */
.degu-hero-avatar {
  width: 160px;
  height: 160px;
  object-fit: cover;
  flex-shrink: 0;
  border-radius: 12px;
}
@media (max-width: 575px) {
  .degu-hero-avatar {
    width: 80px;
    height: 80px;
  }
}

.min-width-0 {
  min-width: 0;
}

.degu-hero-info {
  overflow: hidden;
}

/* ── Tabs: horizontal scroll on mobile ── */
.degu-tabs {
  overflow-x: auto;
  scrollbar-width: none;
  flex-wrap: nowrap;
}
.degu-tabs::-webkit-scrollbar {
  display: none;
}

[data-bs-theme=dark] .navbar-brand img {
  filter: invert(1) brightness(2);
}

/* ── Bootstrap form controls → rg-* tokens ── */
.form-control {
  background-color: var(--rg-cream) !important;
  border-color: var(--rg-line) !important;
  border-radius: 11px !important;
  color: var(--rg-ink) !important;
  box-shadow: none !important;
}
.form-control::placeholder {
  color: var(--rg-mute);
}
.form-control:focus {
  background-color: var(--rg-paper) !important;
  border-color: var(--rg-ink) !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;
  color: var(--rg-ink) !important;
}

/* .form-select: only colors, never touch background-image (Bootstrap arrow must stay) */
.form-select {
  background-color: var(--rg-cream) !important;
  border-color: var(--rg-line) !important;
  border-radius: 11px !important;
  color: var(--rg-ink) !important;
  box-shadow: none !important;
}
.form-select option {
  background: var(--rg-paper);
  color: var(--rg-ink);
}
.form-select:focus {
  background-color: var(--rg-cream) !important; /* keep same bg on focus so arrow stays visible */
  border-color: var(--rg-ink) !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;
  color: var(--rg-ink) !important;
}

[data-bs-theme=dark] .form-select,
[data-bs-theme=dark] .form-control {
  color: var(--rg-ink) !important;
}

/* ── Tom Select: design system colors ── */
.ts-wrapper .ts-control,
.field .ts-wrapper .ts-control {
  background: var(--rg-cream) !important;
  border-color: var(--rg-line) !important;
  border-radius: 11px !important;
  padding: 9px 13px !important;
  color: var(--rg-ink) !important;
  font-size: 0.93rem;
  box-shadow: none !important;
  transition: border-color 0.12s, background 0.12s;
}
.ts-wrapper .ts-control input,
.field .ts-wrapper .ts-control input {
  color: var(--rg-ink) !important;
  background: transparent !important;
}
.ts-wrapper .ts-control input::placeholder,
.field .ts-wrapper .ts-control input::placeholder {
  color: var(--rg-mute);
}
.ts-wrapper.focus .ts-control, .ts-wrapper.focus.full .ts-control,
.field .ts-wrapper.focus .ts-control,
.field .ts-wrapper.focus.full .ts-control {
  background: var(--rg-paper) !important;
  border-color: var(--rg-ink) !important;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;
}
.ts-wrapper.full .ts-control,
.field .ts-wrapper.full .ts-control {
  background: var(--rg-cream) !important;
}
.ts-wrapper.multi .ts-control > div,
.field .ts-wrapper.multi .ts-control > div {
  background: var(--rg-olive) !important;
  color: var(--rg-ink) !important;
  border: none !important;
  border-radius: 7px !important;
  padding: 2px 7px;
  font-size: 0.82rem;
}
.ts-wrapper.multi .ts-control > div.active,
.field .ts-wrapper.multi .ts-control > div.active {
  background: var(--rg-ink) !important;
  color: var(--rg-paper) !important;
}
.ts-wrapper.single .ts-control,
.field .ts-wrapper.single .ts-control {
  background-image: none !important;
  flex-wrap: nowrap;
  overflow: hidden;
}
.ts-wrapper.single .ts-control > input,
.field .ts-wrapper.single .ts-control > input {
  min-width: 0 !important;
  flex-shrink: 0;
  width: 0;
}
.ts-wrapper.single .ts-control .item,
.field .ts-wrapper.single .ts-control .item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1 1 auto;
}
.ts-wrapper.single.full .ts-control > input,
.field .ts-wrapper.single.full .ts-control > input {
  display: none !important;
}
.ts-wrapper.disabled .ts-control,
.field .ts-wrapper.disabled .ts-control {
  opacity: 0.55;
}

.ts-dropdown {
  background: var(--rg-paper) !important;
  border: 1px solid var(--rg-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--rg-shadow-dd) !important;
  color: var(--rg-ink);
  font-size: 0.9rem;
  margin-top: 4px;
}
.ts-dropdown .option, .ts-dropdown [data-selectable] {
  padding: 8px 14px;
  border-radius: 8px;
  color: var(--rg-ink);
}
.ts-dropdown .option:hover, .ts-dropdown .option.active, .ts-dropdown [data-selectable]:hover, .ts-dropdown [data-selectable].active {
  background: var(--rg-cream) !important;
  color: var(--rg-ink) !important;
}
.ts-dropdown .option.selected, .ts-dropdown [data-selectable].selected {
  background: var(--rg-olive);
}
.ts-dropdown .optgroup-header {
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  padding: 8px 14px 4px;
}
.ts-dropdown .no-results {
  color: var(--rg-mute);
  padding: 10px 14px;
}

/* Tom Select dark mode handled by CSS tokens — no overrides needed */
[data-bs-theme=dark] .ts-wrapper .ts-control,
[data-bs-theme=dark] .ts-wrapper .ts-control input {
  color: var(--rg-ink);
  background-color: var(--rg-cream);
}
[data-bs-theme=dark] .ts-wrapper.single .ts-control {
  background-image: none;
}
[data-bs-theme=dark] .ts-wrapper.disabled .ts-control {
  background-color: var(--rg-olive);
  opacity: 0.65;
}
[data-bs-theme=dark] .ts-dropdown {
  color: var(--rg-ink);
  background-color: var(--rg-paper);
}
[data-bs-theme=dark] .ts-dropdown .active {
  background-color: var(--rg-cream);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .ts-dropdown .option:hover {
  background-color: var(--rg-cream);
}
[data-bs-theme=dark] .ts-wrapper.multi .ts-control > div {
  background-color: var(--rg-olive);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .ts-wrapper.multi .ts-control > div.active {
  background-color: var(--rg-ink);
  color: #fff;
}
[data-bs-theme=dark] .ts-dropdown .create:hover,
[data-bs-theme=dark] .ts-dropdown .no-results,
[data-bs-theme=dark] .ts-dropdown .optgroup-header {
  background-color: var(--bs-tertiary-bg);
  color: var(--bs-secondary-color);
}

/* ── Gallery grid ── */
.degu-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
@media (max-width: 575px) {
  .degu-gallery-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

.degu-gallery-thumb {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 8px;
  cursor: pointer;
  background: var(--bs-secondary-bg);
}
.degu-gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.2s;
}
.degu-gallery-thumb:hover img {
  transform: scale(1.05);
}

.degu-gallery-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 4px;
  padding: 6px;
  opacity: 0;
  transition: opacity 0.2s;
}
.degu-gallery-thumb:hover .degu-gallery-overlay, .degu-gallery-thumb.is-active .degu-gallery-overlay {
  opacity: 1;
}

.degu-gallery-btn {
  background: rgba(0, 0, 0, 0.6);
  border: none;
  line-height: 1;
  padding: 3px 6px;
  border-radius: 4px;
  font-size: 14px;
}

.degu-gallery-avatar-badge {
  position: absolute;
  top: 4px;
  left: 4px;
  font-size: 13px;
  line-height: 1;
}

/* ── Breeder card ── */
.breeder-card-new {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
}
.breeder-card-new:hover {
  transform: translateY(-3px);
  box-shadow: var(--rg-shadow-md);
}
.breeder-card-new {
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.breeder-card-new a.breeder-link {
  text-decoration: none;
  color: var(--rg-ink);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.breeder-card-body {
  padding: 16px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.breeder-card-content {
  flex: 1;
  min-width: 0;
}

.breeder-name-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.breeder-logo {
  width: 76px;
  height: 76px;
  border-radius: 14px;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--rg-line);
}

.breeder-logo-ph {
  width: 76px;
  height: 76px;
  border-radius: 14px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  font-size: 1.6rem;
  letter-spacing: -0.02em;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.12);
  background: linear-gradient(135deg, #a07750, #5a3820);
}

.breeder-name {
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--rg-ink);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.breeder-shortname {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.7rem;
  color: var(--rg-mute);
  background: var(--rg-cream);
  padding: 2px 7px;
  border-radius: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

.breeder-person {
  color: var(--rg-mute);
  font-size: 0.82rem;
  margin-top: 3px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.breeder-stats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.breeder-stat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px 3px 7px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
  white-space: nowrap;
  background: var(--rg-cream);
  color: var(--rg-ink);
  border: 1px solid var(--rg-line);
}
.breeder-stat .stat-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.breeder-stat .stat-ico {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-left: -3px;
}
.breeder-stat.in-breeding .stat-ico {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.breeder-stat.offspring .stat-ico {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.breeder-stat.location {
  padding-left: 9px;
}

.breeder-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 1000px) {
  .breeder-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 600px) {
  .breeder-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Filter bar ── */
.filter-bar {
  background: var(--bs-card-bg);
  border: 1px solid var(--bs-border-color-translucent);
  border-radius: 14px;
  padding: 10px 14px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.filter-bar .form-select {
  border-radius: 10px;
  flex: 1 1 160px;
  max-width: 240px;
}
.filter-bar .label-mini {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--bs-secondary-color);
  font-weight: 600;
  white-space: nowrap;
}
.filter-bar .count-pill {
  margin-left: auto;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--bs-secondary-color);
  background: var(--bs-tertiary-bg);
  padding: 4px 10px;
  border-radius: 999px;
  white-space: nowrap;
}

/* ── Sex pill ── */
.sex-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}
.sex-pill.sex-male {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.sex-pill.sex-female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}

/* ── Stav (status) pill ── */
.stav-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.stav-pill.stav-chov {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}
.stav-pill.stav-mazlik {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.stav-pill.stav-na_prodej {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.stav-pill.stav-rezervovan {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.stav-pill.stav-mimo {
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.stav-pill.stav-odpocinek {
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.stav-pill.stav-dead {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* ── Color badge (phenotype pill) ── */
.color-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* ── Degu Card V1: compact horizontal ── */
.degu-card-v1 {
  background: var(--bs-card-bg);
  border: 1px solid var(--bs-border-color-translucent);
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px -16px rgba(0, 0, 0, 0.15);
  transition: transform 0.2s, box-shadow 0.2s;
}
.degu-card-v1:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 8px 24px -16px rgba(0, 0, 0, 0.2);
}
.degu-card-v1 .degu-card-photo {
  width: 84px;
  height: 84px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
}
.degu-card-v1 .degu-card-rc {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.78rem;
  color: var(--bs-secondary-color);
  letter-spacing: 0.03em;
}

/* ── Degu Card V2: trading card (vertical) ── */
.degu-card-v2 {
  background: var(--bs-card-bg);
  border: 1px solid var(--bs-border-color-translucent);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 16px 40px -20px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s, box-shadow 0.2s;
}
.degu-card-v2:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12), 0 16px 40px -20px rgba(0, 0, 0, 0.3);
}
.degu-card-v2 .degu-card-v2-photo {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
}
.degu-card-v2 .degu-card-v2-strip {
  height: 6px;
}
.degu-card-v2 .degu-card-v2-body {
  padding: 14px;
}
.degu-card-v2 .degu-card-v2-name {
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.15;
  margin-bottom: 2px;
}
.degu-card-v2 .degu-card-rc {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
  color: var(--bs-secondary-color);
}

/* ── Degu Card: listing style (legacy) ── */
.degu-card {
  transition: transform 0.2s, box-shadow 0.2s;
}
.degu-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

/* .search-container — styles moved into .rg-nav-search .dropdown-menu */
/* ── Litter nav ── */
.litter-nav-new {
  position: sticky;
  top: 0;
  z-index: 5;
  background: rgba(var(--bs-body-bg-rgb), 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 10px 4px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--bs-border-color-translucent);
}
.litter-nav-new .label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--bs-secondary-color);
  font-weight: 600;
  margin-right: 4px;
  white-space: nowrap;
}

.litter-nav-chip {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--bs-card-bg);
  border: 1px solid var(--bs-border-color);
  color: var(--bs-body-color);
  font-weight: 700;
  font-size: 0.95rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.15s;
}
.litter-nav-chip:hover {
  background: var(--bs-body-color);
  color: var(--bs-body-bg);
  transform: translateY(-1px);
}

/* ── Litter card ── */
.litter-card {
  background: var(--bs-card-bg);
  border: 1px solid var(--bs-border-color-translucent);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 16px 40px -20px rgba(0, 0, 0, 0.18);
  margin-bottom: 18px;
  transition: box-shadow 0.2s;
}
.litter-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08), 0 16px 40px -20px rgba(0, 0, 0, 0.25);
}

.litter-card-strip {
  height: 5px;
  display: flex;
}

.litter-card-head {
  padding: 14px 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 14px;
  transition: background 0.15s;
  user-select: none;
}
.litter-card-head:hover {
  background: var(--bs-tertiary-bg);
}
.litter-card-head[aria-expanded=true] {
  background: var(--bs-tertiary-bg);
}

.litter-letter {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: var(--rg-ink);
  color: var(--rg-paper);
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: -0.02em;
}

.litter-meta {
  flex-grow: 1;
  min-width: 0;
}

.litter-title-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.litter-title {
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.litter-date {
  color: var(--bs-secondary-color);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.litter-pup-count {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--bs-tertiary-bg);
  color: var(--bs-secondary-color);
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

.litter-pups-names {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-end;
  flex-shrink: 1;
  max-width: 340px;
}
.litter-pups-names .pup-name {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--bs-tertiary-bg);
  border: 1px solid var(--bs-border-color-translucent);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--bs-body-color);
  white-space: nowrap;
  text-decoration: none;
}
.litter-pups-names .pup-name:hover {
  background: var(--bs-secondary-bg);
}
.litter-pups-names .pup-name .pup-sex-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.litter-pups-names .pup-name.sex-male .pup-sex-dot {
  background: var(--rg-male);
}
.litter-pups-names .pup-name.sex-female .pup-sex-dot {
  background: var(--rg-female);
}

.litter-chevron {
  flex-shrink: 0;
  color: var(--bs-secondary-color);
  transition: transform 0.25s;
}

.litter-card-head[aria-expanded=true] .litter-chevron {
  transform: rotate(180deg);
}

.litter-card-body {
  padding: 4px 18px 18px;
  border-top: 1px dashed var(--bs-border-color-translucent);
}

.litter-notes {
  background: var(--bs-tertiary-bg);
  border-left: 3px solid var(--bs-border-color);
  padding: 8px 12px;
  border-radius: 0 8px 8px 0;
  font-size: 0.85rem;
  color: var(--bs-secondary-color);
  margin: 14px 0;
  font-style: italic;
}

.scroll-margin-top {
  scroll-margin-top: 100px;
}

.collapse-chevron {
  transition: transform 0.3s ease;
}

[aria-expanded=true] .collapse-chevron {
  transform: rotate(180deg);
}

/* ════════════════════════════════════════════════════════
   REDESIGN — fáze 1: design tokens & shared atoms
   ════════════════════════════════════════════════════════ */
:root {
  color-scheme: light dark;
  --rg-nav-h: 65px;
  --bs-body-bg: #f4f1ea;
  --bs-body-bg-rgb: 244, 241, 234;
  --bs-body-color: #1f1d18;
  --bs-body-color-rgb: 31, 29, 24;
  --bs-secondary-color: #6c6354;
  --rg-bg: #f4f1ea;
  --rg-paper: #ffffff;
  --rg-cream: #faf7ef;
  --rg-ink: #1f1d18;
  --rg-ink-soft: #4a4636;
  --rg-mute: #6c6354;
  --rg-line: rgba(0,0,0,0.07);
  --rg-line-strong: rgba(0,0,0,0.12);
  --rg-olive: #f1ede2;
  --rg-accent: #7a5200;
  --rg-accent-2: #d97706;
  --rg-male: #0a4ea8;
  --rg-male-bg: #e7f0ff;
  --rg-female: #a8205f;
  --rg-female-bg: #fde4ef;
  --rg-success: #15663a;
  --rg-success-bg:#e2f2e6;
  --rg-warn: #8a5a00;
  --rg-warn-bg: #fff0c2;
  --rg-danger: #9a1f2a;
  --rg-danger-bg: #fde2e4;
  --rg-shadow-sm: 0 2px 4px rgba(0,0,0,.05), 0 16px 40px -20px rgba(0,0,0,.18);
  --rg-shadow-md: 0 6px 14px rgba(0,0,0,.09), 0 16px 40px -20px rgba(0,0,0,.28);
  --rg-shadow-lg: 0 20px 60px -30px rgba(0,0,0,.35), 0 4px 8px rgba(0,0,0,.05);
  --rg-shadow-dd: 0 12px 36px -8px rgba(0,0,0,.18), 0 4px 12px rgba(0,0,0,.06);
  --rg-btn-bg: #1f1d18;
  --rg-btn-bg-hover: #000;
  --rg-btn-fg: #ffffff;
}

.rg-serif {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
}

.rg-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.rg-eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  display: block;
}

.rg-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 16px 40px -20px rgba(0, 0, 0, 0.18);
}

.rg-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
  white-space: nowrap;
  background: var(--rg-olive);
  color: var(--rg-ink);
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.rg-pill .stat-num {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.rg-pill.male {
  background: var(--rg-male-bg);
  color: var(--rg-male);
  border-color: rgba(10, 78, 168, 0.15);
}
.rg-pill.female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
  border-color: rgba(168, 32, 95, 0.15);
}
.rg-pill.dark {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: transparent;
}
.rg-pill.success {
  background: var(--rg-success-bg);
  color: var(--rg-success);
  border-color: transparent;
}
.rg-pill.warn {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
  border-color: transparent;
}
.rg-pill.danger {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
  border-color: transparent;
}
.rg-pill.muted {
  background: var(--rg-olive);
  color: var(--rg-mute);
  border-color: transparent;
}

.rg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 0.95rem;
  border: 1px solid transparent;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.12s, box-shadow 0.12s, background 0.12s;
  line-height: 1.2;
}
.rg-btn-primary {
  background: var(--rg-btn-bg);
  color: var(--rg-btn-fg);
}
.rg-btn-primary:hover {
  background: var(--rg-btn-bg-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18);
  color: var(--rg-btn-fg);
}
.rg-btn-ghost {
  background: transparent;
  color: var(--rg-ink);
  border-color: var(--rg-line);
}
.rg-btn-ghost:hover {
  background: var(--rg-paper);
  color: var(--rg-ink);
}
.rg-btn-accent {
  background: var(--rg-accent);
  color: #fff;
  border-color: var(--rg-accent);
}
.rg-btn-accent:hover {
  filter: brightness(0.9);
  color: #fff;
}
.rg-btn-ghost-info {
  color: var(--rg-male);
  border-color: var(--rg-male);
}
.rg-btn-ghost-warn {
  color: var(--rg-warn);
  border-color: var(--rg-warn);
}
.rg-btn-ghost-danger {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
  border-color: var(--rg-danger);
}
.rg-btn-warn {
  background: var(--rg-warn);
  color: #fff;
  border-color: var(--rg-warn);
}
.rg-btn-warn:hover {
  filter: brightness(0.9);
  color: #fff;
}

.rg-input {
  width: 100%;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 0.95rem;
  color: var(--rg-ink);
  transition: border-color 0.12s, background 0.12s, box-shadow 0.12s;
  outline: none;
}
.rg-input:focus {
  background: #fff;
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.06);
}
.rg-input::placeholder {
  color: var(--rg-mute);
}

.rg-label {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  display: block;
  margin-bottom: 6px;
}

.flash-wrapper {
  max-width: 1320px;
  margin: 0 auto;
  padding: 12px 32px 0;
}

.section-divider {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px dashed var(--rg-line-strong);
}

.mt-sm {
  margin-top: 12px;
}

.mt-md {
  margin-top: 14px;
}

.mt-lg {
  margin-top: 16px;
}

.mb-lg {
  margin-bottom: 18px;
}

.mt-xl {
  margin-top: 22px;
}

.flex-col-gap-sm {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lightbox-img {
  max-height: 80vh;
  object-fit: contain;
}

.dot-sep {
  color: var(--rg-line-strong);
}

.rg-notice-text {
  font-size: 0.86rem;
}

.mb-notice-sm {
  margin-bottom: 10px;
}

.progress-sm {
  height: 6px;
}

.import-log {
  max-height: 80px;
  overflow-y: auto;
  font-family: monospace;
  font-size: 0.75rem;
}

.rg-notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--rg-line);
  font-size: 0.9rem;
  line-height: 1.5;
  position: relative;
  margin-bottom: 1rem;
}
.rg-notice .rg-notice-icon {
  flex-shrink: 0;
  margin-top: 1px;
  line-height: 0;
}
.rg-notice .rg-notice-body {
  flex: 1;
  min-width: 0;
}
.rg-notice .rg-notice-title {
  font-weight: 600;
  font-size: 0.88rem;
  margin-bottom: 4px;
}
.rg-notice .rg-notice-close {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  opacity: 0.5;
  padding: 2px;
  border-radius: 6px;
  line-height: 0;
  color: inherit;
  margin-top: 1px;
  align-self: flex-start;
}
.rg-notice .rg-notice-close:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.07);
}
.rg-notice.success {
  background: var(--rg-success-bg);
  color: var(--rg-success);
  border-color: color-mix(in oklab, var(--rg-success) 20%, transparent);
}
.rg-notice.warn {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
  border-color: color-mix(in oklab, var(--rg-warn) 25%, transparent);
}
.rg-notice.danger {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
  border-color: color-mix(in oklab, var(--rg-danger) 20%, transparent);
}
.rg-notice.info {
  background: var(--rg-male-bg);
  color: var(--rg-male);
  border-color: color-mix(in oklab, var(--rg-male) 20%, transparent);
}
.rg-notice.neutral {
  background: var(--rg-cream);
  color: var(--rg-ink);
  border-color: var(--rg-line);
}

.mb-sm {
  margin-bottom: 12px;
}

.logo-preview {
  max-height: 80px;
  border-radius: 8px;
  border: 1px solid var(--rg-line);
}

/* ── Logo ── */
.rg-logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--rg-ink);
  text-decoration: none;
  flex-shrink: 0;
}

.rg-logo-mark {
  width: 44px;
  height: 44px;
}
.rg-logo-mark--lg {
  width: 56px;
  height: 56px;
}
.rg-logo-mark {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rg-logo-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.rg-logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.rg-logo-text .l1 {
  font-family: "Iowan Old Style", Georgia, serif;
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: -0.01em;
  color: var(--rg-ink);
}
.rg-logo-text .l2 {
  font-size: 0.6rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--rg-mute);
  margin-top: 3px;
  font-weight: 600;
}

/* Logo na tmavém pozadí — pečeť se invertuje na bílou */
.rg-logo.on-dark .rg-logo-mark img {
  filter: invert(1);
}
.rg-logo.on-dark .rg-logo-text .l1 {
  color: #fff;
}
.rg-logo.on-dark .rg-logo-text .l2 {
  color: rgba(255, 255, 255, 0.7);
}

/* ════ TOP NAV ════ */
.rg-nav {
  background: var(--rg-paper);
  border-bottom: 1px solid var(--rg-line);
  padding: 10px 28px;
  display: flex;
  align-items: center;
  gap: 6px;
  position: sticky;
  top: 0;
  z-index: 100;
}
@media (width < 992px) {
  .rg-nav {
    padding: 10px 16px;
    flex-wrap: wrap;
  }
}

.rg-nav-links {
  display: flex;
  gap: 2px;
  align-items: center;
  flex-shrink: 0;
}
@media (width < 992px) {
  .rg-nav-links {
    display: none;
  }
}

.rg-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--rg-ink-soft);
  font-size: 0.92rem;
  font-weight: 600;
  text-decoration: none;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
  white-space: nowrap;
}
.rg-nav-link:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
.rg-nav-link.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.rg-nav-link.active:hover {
  background: var(--rg-btn-bg-hover);
  color: var(--rg-paper);
}
.rg-nav-link {
  /* bootstrap dropdown-toggle: hide the caret */
}
.rg-nav-link::after {
  display: none !important;
}

.rg-nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 700;
  background: var(--rg-danger);
  color: var(--rg-paper);
}

.rg-nav-search {
  flex-grow: 1;
  max-width: 380px;
  position: relative;
  margin-left: 6px;
  overflow: visible;
}
@media (width < 992px) {
  .rg-nav-search {
    max-width: 100%;
    order: 10;
    flex-basis: 100%;
    margin: 4px 0 0;
  }
}
.rg-nav-search .dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 100%;
  z-index: 9999;
  display: none;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  box-shadow: var(--rg-shadow-dd);
  padding: 6px;
  max-height: 400px;
  overflow-y: auto;
}
.rg-nav-search .dropdown-menu.show {
  display: block;
}
.rg-nav-search .dropdown-menu .dropdown-item {
  border-radius: 8px;
  color: var(--rg-ink);
  padding: 8px 12px;
  font-size: 0.9rem;
  cursor: pointer;
}
.rg-nav-search .dropdown-menu .dropdown-item:hover, .rg-nav-search .dropdown-menu .dropdown-item.active, .rg-nav-search .dropdown-menu .dropdown-item:focus {
  background: var(--rg-cream);
  color: var(--rg-ink);
}
.rg-nav-search .dropdown-menu .dropdown-item .text-muted {
  color: var(--rg-mute) !important;
}
.rg-nav-search .rg-input {
  padding: 9px 72px 9px 38px;
  border-radius: 10px;
  font-size: 0.88rem;
}
.rg-nav-search .search-ico {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rg-mute);
  pointer-events: none;
  display: flex;
}
.rg-nav-search .kbd {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  padding: 1px 6px;
  border-radius: 6px;
  font-family: ui-monospace, monospace;
  font-size: 0.7rem;
  color: var(--rg-mute);
  pointer-events: none;
}

.rg-nav-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  flex-shrink: 0;
}

.rg-nav-iconbtn {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--rg-ink-soft);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
  padding: 0;
}
.rg-nav-iconbtn:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
.rg-nav-iconbtn::after {
  display: none !important;
}

.rg-nav-user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px 5px 5px;
  border-radius: 999px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s;
  white-space: nowrap;
}
.rg-nav-user:hover {
  background: var(--rg-olive);
}
.rg-nav-user::after {
  display: none !important;
}

.rg-nav-user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--rg-accent-2), #a8470a);
  color: var(--rg-btn-fg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  flex-shrink: 0;
}

/* Search autocomplete results */
[data-search-autocomplete-target=results] {
  max-height: 400px;
  overflow-y: auto;
}

.rg-nav-login-btn {
  padding: 8px 14px;
  font-size: 0.88rem;
}

/* Dropdown panel */
.rg-dropdown {
  border-radius: 16px !important;
  border: 1px solid color-mix(in oklab, var(--rg-line-strong) 72%, transparent) !important;
  box-shadow: var(--rg-shadow-dd) !important;
  padding: 8px !important;
  background: var(--rg-paper) !important;
  min-width: 260px;
  overflow: hidden;
}
.rg-dropdown-sm {
  min-width: 8rem !important;
}
.rg-dropdown-md {
  min-width: 200px !important;
}

.rg-dropdown-section {
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  padding: 10px 12px 4px;
}

.rg-dropdown-item {
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  border: 1px solid transparent;
  color: var(--rg-ink) !important;
  text-decoration: none;
  transition: background 0.12s, border-color 0.12s, transform 0.12s;
}
.rg-dropdown-item:hover {
  background: color-mix(in oklab, var(--rg-olive) 78%, var(--rg-paper)) !important;
  border-color: color-mix(in oklab, var(--rg-line-strong) 70%, transparent);
  color: var(--rg-ink) !important;
  transform: translateY(-1px);
}
.rg-dropdown-item:active {
  background: var(--rg-olive) !important;
}
.rg-dropdown-item.active {
  background: var(--rg-olive) !important;
  border-color: color-mix(in oklab, var(--rg-line-strong) 70%, transparent);
  color: var(--rg-ink) !important;
}
.rg-dropdown-item.active .rg-di-sub {
  color: var(--rg-mute);
}
.rg-dropdown-item.active .icon-tile {
  background: var(--rg-cream);
  color: var(--rg-ink-soft);
}
.rg-dropdown-item .icon-tile {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--rg-cream);
  color: var(--rg-ink-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.rg-dropdown-item .rg-di-title {
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1.15;
}
.rg-dropdown-item .rg-di-sub {
  color: var(--rg-mute);
  font-size: 0.75rem;
  line-height: 1.2;
  margin-top: 2px;
}

/* Mobile nav toggle */
.rg-nav-mobile-toggle {
  display: none;
}
@media (width < 992px) {
  .rg-nav-mobile-toggle {
    display: inline-flex;
  }
}

.rg-mobile-drawer {
  display: none;
  background: var(--rg-paper);
  border-bottom: 1px solid var(--rg-line);
  padding: 12px 16px 16px;
}
.rg-mobile-drawer.show {
  display: block;
}
.rg-mobile-drawer .m-group {
  margin-bottom: 14px;
}
.rg-mobile-drawer .m-group-title {
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  padding: 4px 6px 6px;
}
.rg-mobile-drawer .m-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  transition: background 0.12s;
}
.rg-mobile-drawer .m-link:hover {
  background: var(--rg-olive);
}
.rg-mobile-drawer .m-link.active {
  background: var(--rg-ink);
  color: #fff;
}
.rg-mobile-drawer .m-link.active .m-link-ico {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
}
.rg-mobile-drawer .m-link-ico {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

@media (display-mode: window-controls-overlay) {
  .rg-nav {
    position: fixed;
    top: env(titlebar-area-y, 0);
    left: env(titlebar-area-x, 0);
    width: env(titlebar-area-width, 100%);
    z-index: 9999;
    app-region: drag;
    -webkit-app-region: drag;
  }
  .rg-nav a,
  .rg-nav button,
  .rg-nav input,
  .rg-nav label,
  .rg-nav .dropdown,
  .rg-nav [data-controller],
  .rg-nav [data-bs-toggle] {
    app-region: no-drag;
    -webkit-app-region: no-drag;
  }
}
.rg-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  user-select: none;
}
.rg-toggle-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.rg-toggle-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rg-mute);
  transition: color 0.15s;
  white-space: nowrap;
}
.rg-toggle-track {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 22px;
  border-radius: 999px;
  background: var(--rg-line-strong);
  transition: background 0.2s;
  flex-shrink: 0;
  cursor: pointer;
}
.rg-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: left 0.2s, box-shadow 0.15s;
}
.rg-toggle-input:checked ~ .rg-toggle-track {
  background: var(--rg-accent);
}
.rg-toggle-input:checked ~ .rg-toggle-track .rg-toggle-thumb {
  left: calc(100% - 19px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.rg-toggle.rg-toggle-sm .rg-toggle-track {
  width: 32px;
  height: 18px;
}
.rg-toggle.rg-toggle-sm .rg-toggle-thumb {
  width: 12px;
  height: 12px;
  top: 3px;
  left: 3px;
}
.rg-toggle.rg-toggle-sm .rg-toggle-input:checked ~ .rg-toggle-track .rg-toggle-thumb {
  left: calc(100% - 15px);
}

.rg-dropdown-item--toggle {
  cursor: default;
}
.rg-dropdown-item--toggle:hover {
  transform: none;
}

.m-link--toggle {
  cursor: default;
}
.m-link--toggle:hover {
  background: transparent;
}

/* ════ LOGIN — split card ════ */
.login-stage {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  background: var(--rg-bg);
}

.login-split {
  width: 100%;
  max-width: 960px;
  background: var(--rg-paper);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 20px 60px -30px rgba(0, 0, 0, 0.35), 0 4px 8px rgba(0, 0, 0, 0.05);
  display: grid;
  grid-template-columns: 1.05fr 1fr;
}
@media (max-width: 767px) {
  .login-split {
    grid-template-columns: 1fr;
  }
}

.login-art {
  position: relative;
  background-image: url("../images/login-cWBQwg4.webp");
  background-size: cover;
  background-position: center;
  color: rgba(255, 255, 255, 0.95);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 36px 32px;
  min-height: 520px;
}
@media (max-width: 767px) {
  .login-art {
    display: none;
  }
}
.login-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(31, 29, 24, 0.45) 0%, rgba(31, 29, 24, 0.25) 35%, rgba(31, 29, 24, 0.75) 100%);
  pointer-events: none;
}
.login-art > * {
  position: relative;
  z-index: 1;
}

.login-quote {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.45rem;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -0.015em;
  max-width: 360px;
}
.login-quote::before {
  content: "„";
  font-size: 3rem;
  line-height: 0.1;
  vertical-align: -0.2em;
  opacity: 0.7;
}

.login-art-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.78rem;
  opacity: 0.85;
  flex-wrap: wrap;
  margin-top: 20px;
}
.login-art-meta .chip {
  background: rgba(255, 255, 255, 0.18);
  padding: 3px 10px;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}

.login-body {
  padding: 44px 44px 36px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
@media (max-width: 575px) {
  .login-body {
    padding: 28px 24px;
  }
}

.login-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--rg-ink);
  margin: 6px 0 0;
}

.login-sub {
  color: var(--rg-mute);
  font-size: 0.95rem;
  margin: 4px 0 0;
}

.login-error {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
  border-radius: 12px;
  padding: 11px 14px;
  font-size: 0.88rem;
  font-weight: 600;
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.login-field {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.login-field--remember {
  margin-top: 4px;
  margin-bottom: 8px;
}

.login-checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
  font-size: 0.88rem;
  color: var(--rg-ink);
}

.login-btn {
  width: 100%;
  margin-top: 4px;
  justify-content: center;
}

.login-field-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 6px;
}

.login-forgot {
  font-size: 0.78rem;
  color: var(--rg-mute);
  text-decoration: underline;
  font-weight: 600;
}
.login-forgot:hover {
  color: var(--rg-ink);
}

.login-input-wrap {
  position: relative;
}
.login-input-wrap .login-input-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rg-mute);
  display: flex;
  pointer-events: none;
}
.login-input-wrap .rg-input {
  padding-left: 42px;
}

/* ════ LANDING ════ */
.land-stage {
  background: var(--rg-bg);
  min-height: calc(100vh - 62px);
}

.land-hero {
  padding: 56px 48px 48px;
  background: radial-gradient(circle at 80% 20%, rgba(217, 119, 6, 0.1), transparent 50%), radial-gradient(circle at 10% 90%, rgba(122, 82, 0, 0.1), transparent 50%);
}
@media (max-width: 991.98px) {
  .land-hero {
    padding: 36px 24px 32px;
  }
}

.land-hero-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 56px;
  align-items: center;
  max-width: 1440px;
  margin: 0 auto;
}
@media (max-width: 991.98px) {
  .land-hero-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

.land-hero-h1 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 3.2rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.04;
  color: var(--rg-ink);
  margin: 14px 0 18px;
}
.land-hero-h1 em {
  font-style: italic;
  color: var(--rg-accent);
}
@media (max-width: 767px) {
  .land-hero-h1 {
    font-size: 2.2rem;
  }
}

.land-lead {
  font-size: 1.05rem;
  color: var(--rg-ink-soft);
  line-height: 1.55;
  max-width: 480px;
  margin: 0 0 26px;
}

.land-cta-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.land-stats {
  display: flex;
  gap: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--rg-line);
  flex-wrap: wrap;
}

.land-stat .num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.85rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--rg-ink);
}
.land-stat .lbl {
  font-size: 0.78rem;
  color: var(--rg-mute);
  margin-top: 4px;
  letter-spacing: 0.04em;
}

/* Hero collage */
.land-collage {
  position: relative;
  aspect-ratio: 1/1;
}
@media (max-width: 991.98px) {
  .land-collage {
    display: none;
  }
}

.land-photo {
  position: absolute;
  border-radius: 22px;
  box-shadow: 0 12px 30px -10px rgba(0, 0, 0, 0.3), 0 4px 8px rgba(0, 0, 0, 0.08);
  border: 4px solid #fff;
  overflow: hidden;
  padding: 0;
  background: repeating-linear-gradient(135deg, #a07750 0px, #a07750 8px, #8a623e 8px, #8a623e 16px, #b58860 16px, #b58860 24px);
}
.land-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.land-photo.p1 {
  top: 0;
  right: 8%;
  width: 56%;
  height: 62%;
  transform: rotate(2deg);
}
.land-photo.p2 {
  bottom: 0;
  left: 0;
  width: 50%;
  height: 56%;
  transform: rotate(-3deg);
  background: repeating-linear-gradient(135deg, #c69973 0px, #c69973 8px, #a07750 8px, #a07750 16px, #d4b18d 16px, #d4b18d 24px);
}
.land-photo.p3 {
  top: 28%;
  left: 28%;
  width: 38%;
  height: 38%;
  transform: rotate(8deg);
  background: repeating-linear-gradient(135deg, #1f1d18 0px, #1f1d18 8px, #3a3530 8px, #3a3530 16px, #2a2722 16px, #2a2722 24px);
}

.land-subtitle {
  color: var(--rg-mute);
  font-size: 0.95rem;
  margin: 0;
}

.land-tiles-wrap--no-pt {
  padding-top: 0;
}

.land-section--no-pt {
  padding-top: 8px;
}

.color-pill.no-shrink {
  flex-shrink: 0;
}

.land-sticker {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 103px;
  height: 103px;
  border-radius: 50%;
  background: var(--rg-ink);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: "Iowan Old Style", Georgia, serif;
  line-height: 1.05;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
  text-align: center;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
  transform: rotate(-12deg);
  z-index: 2;
}
.land-sticker strong {
  font-size: 1.05rem;
  display: block;
  margin-bottom: 2px;
}

/* Landing sections */
.land-section {
  padding: 40px 48px;
  max-width: 1440px;
  margin: 0 auto;
}
@media (max-width: 991.98px) {
  .land-section {
    padding: 28px 24px;
  }
}

.land-section-head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.land-section-h2 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--rg-ink);
}

.land-section-more {
  margin-left: auto;
  color: var(--rg-mute);
  font-weight: 600;
  font-size: 0.88rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.land-section-more:hover {
  color: var(--rg-ink);
}

/* Degu mini card */
.degu-mini {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 16px 40px -20px rgba(0, 0, 0, 0.18);
  transition: transform 0.2s, box-shadow 0.2s;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--rg-ink);
}
.degu-mini:hover {
  transform: translateY(-3px);
  color: var(--rg-ink);
}

.degu-mini-photo {
  width: 100%;
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
}
.degu-mini-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.degu-mini-photo.no-photo {
  background: repeating-linear-gradient(135deg, var(--ph-a, #a07750) 0px, var(--ph-a, #a07750) 8px, var(--ph-b, #8a623e) 8px, var(--ph-b, #8a623e) 16px, var(--ph-c, #b58860) 16px, var(--ph-c, #b58860) 24px);
}

.degu-mini-photo-tag,
.degu-mini-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--rg-paper);
  color: var(--rg-ink);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.degu-mini-photo-tag.dead,
.degu-mini-tag.dead {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.degu-mini-strip {
  height: 6px;
}

.degu-mini-body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.degu-mini-name {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

.degu-mini-rc {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  color: var(--rg-mute);
}

.degu-mini-breeder {
  font-size: 0.78rem;
  color: var(--rg-mute);
}
.degu-mini-breeder strong {
  color: var(--rg-ink-soft);
  font-weight: 600;
}
.degu-mini-breeder svg {
  vertical-align: -1px;
}

.degu-mini-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6px;
}
.degu-mini-header .rg-pill {
  flex-shrink: 0;
}

.degu-mini-header-info {
  min-width: 0;
}

.degu-mini-tags {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.color-pill {
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
}

.degu-mini-photo.no-photo img {
  opacity: 0.35;
}

/* Quick action tiles */
.land-tiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 767px) {
  .land-tiles {
    grid-template-columns: repeat(2, 1fr);
  }
}

.land-tile {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px;
  text-decoration: none;
  color: var(--rg-ink);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.15s, box-shadow 0.15s;
}
.land-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -8px rgba(0, 0, 0, 0.18);
  color: var(--rg-ink);
}
.land-tile .tile-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
}
.land-tile .tile-title {
  font-weight: 700;
  font-size: 0.98rem;
  color: var(--rg-ink);
}
.land-tile .tile-sub {
  color: var(--rg-mute);
  font-size: 0.78rem;
  line-height: 1.35;
}

/* Dashboard greeting */
.land-dashboard-hero {
  padding: 32px 48px 18px;
  max-width: 1440px;
  margin: 0 auto;
}
@media (max-width: 991.98px) {
  .land-dashboard-hero {
    padding: 24px 24px 12px;
  }
}

.land-dashboard-h1 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  margin: 4px 0 4px;
  color: var(--rg-ink);
  line-height: 1.1;
}
.land-dashboard-h1 em {
  font-style: normal;
  color: var(--rg-accent);
}
@media (max-width: 767px) {
  .land-dashboard-h1 {
    font-size: 1.7rem;
  }
}

.land-tiles-wrap {
  padding: 8px 48px 12px;
  max-width: 1440px;
  margin: 0 auto;
}
@media (max-width: 991.98px) {
  .land-tiles-wrap {
    padding: 4px 24px 8px;
  }
}

/* Feature info cards on landing */
.land-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 767px) {
  .land-feature-grid {
    grid-template-columns: 1fr;
  }
}

.land-feature-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05), 0 16px 40px -20px rgba(0, 0, 0, 0.18);
}
.land-feature-card .feat-ico {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.land-feature-card .feat-title {
  font-weight: 700;
  font-size: 1.1rem;
  letter-spacing: -0.01em;
  margin-bottom: 6px;
  color: var(--rg-ink);
}
.land-feature-card .feat-body {
  color: var(--rg-mute);
  font-size: 0.92rem;
  line-height: 1.45;
}

/* Degu grid for landing for-sale */
.degu-mini-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
@media (max-width: 991.98px) {
  .degu-mini-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 575px) {
  .degu-mini-grid {
    grid-template-columns: 1fr;
  }
}

/* Flash messages on full-width pages */
.rg-flash-wrapper {
  max-width: 1440px;
  margin: 0 auto;
  padding: 8px 48px 0;
}
@media (max-width: 991.98px) {
  .rg-flash-wrapper {
    padding: 8px 24px 0;
  }
}

.old-degus-home-toggle {
  width: 100%;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
  text-align: left;
  color: var(--rg-ink);
  text-decoration: none;
}

.old-degus-home-ico {
  background: rgba(217, 119, 6, 0.12);
  color: var(--rg-warn);
  flex-shrink: 0;
}

.old-degus-home-main {
  flex: 1;
}

.old-degus-home-chevron {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: rgba(217, 119, 6, 0.14);
  color: var(--rg-warn);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.old-degus-home-chevron svg {
  width: 14px;
  height: 14px;
}

.old-degus-home-toggle[aria-expanded=true] {
  border-radius: 16px 16px 0 0;
}

.old-degus-home-toggle[aria-expanded=true] .old-degus-home-chevron {
  transform: rotate(180deg);
  background: var(--rg-warn);
  color: var(--rg-paper);
}

.old-degus-home-body {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-top: none;
  border-radius: 0 0 16px 16px;
  overflow: hidden;
}

.old-degus-home-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 18px;
  border-bottom: 1px dashed var(--rg-line);
}

.old-degus-home-name {
  font-weight: 600;
  color: var(--rg-ink);
  text-decoration: none;
  flex: 1;
}
.old-degus-home-name:hover {
  text-decoration: underline;
}

.old-degus-home-rc {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.old-degus-home-age {
  font-size: 0.82rem;
  color: var(--rg-warn);
  font-weight: 600;
  white-space: nowrap;
}

.push-home-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 16px 20px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  transition: box-shadow 0.15s, transform 0.15s;
}
.push-home-banner:has(.rg-toggle-input:not(:checked)):hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px -8px rgba(0, 0, 0, 0.15);
}
.push-home-banner-ico {
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.15s, color 0.15s;
}
.push-home-banner-body {
  flex: 1;
  min-width: 0;
}
.push-home-banner-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rg-ink);
  line-height: 1.2;
}
.push-home-banner-sub {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-top: 3px;
  line-height: 1.4;
}
.push-home-banner-action {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.push-home-banner-dismiss {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: none;
  background: transparent;
  color: var(--rg-mute);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  transition: background 0.12s, color 0.12s;
}
.push-home-banner-dismiss:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
.push-home-banner:has(.rg-toggle-input:checked) {
  border-color: color-mix(in oklab, var(--rg-accent) 30%, transparent);
  background: color-mix(in oklab, var(--rg-accent) 5%, var(--rg-paper));
}
.push-home-banner:has(.rg-toggle-input:checked) .push-home-banner-ico {
  background: color-mix(in oklab, var(--rg-accent) 14%, var(--rg-paper));
  color: var(--rg-accent);
}
@media (max-width: 575px) {
  .push-home-banner {
    gap: 12px;
    padding: 14px 16px;
  }
  .push-home-banner-ico {
    width: 38px;
    height: 38px;
    border-radius: 11px;
  }
  .push-home-banner-title {
    font-size: 0.88rem;
  }
  .push-home-banner-sub {
    font-size: 0.76rem;
  }
}

/* ════════════════════════════════════════════════════════
   PAGE SHELL
   ════════════════════════════════════════════════════════ */
.rg-page {
  background: var(--rg-bg);
  min-height: 100vh;
}

.rg-page-body {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .rg-page-body {
    padding: 16px 16px 30px;
  }
}
.rg-page-body--sm {
  max-width: 800px;
}
.rg-page-body--md {
  max-width: 900px;
}
.rg-page-body--lg {
  max-width: 1120px;
}

.rg-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  color: var(--rg-mute);
  margin-bottom: 16px;
}
.rg-breadcrumb a {
  color: var(--rg-ink-soft);
  text-decoration: none;
  font-weight: 500;
}
.rg-breadcrumb a:hover {
  color: var(--rg-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.rg-breadcrumb .sep {
  color: var(--rg-line-strong);
  font-size: 0.9rem;
  line-height: 1;
}
.rg-breadcrumb span:not(.sep) {
  color: var(--rg-ink);
  font-weight: 600;
}

/* ════════════════════════════════════════════════════════
   HERO — degu detail i chovatel profil
   ════════════════════════════════════════════════════════ */
.rg-hero {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 22px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 20px;
}

.rg-hero-grid {
  display: grid;
  grid-template-columns: 240px 1fr auto;
  gap: 24px;
  padding: 22px 24px 0;
}
@media (max-width: 900px) {
  .rg-hero-grid {
    grid-template-columns: 160px 1fr;
  }
}
@media (max-width: 575px) {
  .rg-hero-grid {
    grid-template-columns: 1fr;
    padding: 16px 16px 0;
  }
}

.rg-hero-photo {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  border: 1px solid var(--rg-line);
}

.rg-hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.rg-hero-photo .photo-corner {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 6px;
}

.rg-hero-photo-edit {
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.2s;
}
.rg-hero-photo-edit:hover {
  background: rgba(0, 0, 0, 0.8);
}

.rg-hero-main {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 4px;
  min-width: 0;
}

.rg-hero-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  color: var(--rg-ink);
  margin: 0;
}
@media (max-width: 767px) {
  .rg-hero-title {
    font-size: 1.6rem;
  }
}

.rg-hero-rc {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  color: var(--rg-mute);
  padding: 3px 9px;
  border-radius: 7px;
  background: var(--rg-olive);
  border: 1px solid var(--rg-line);
  letter-spacing: 0.04em;
}

.rg-hero-meta {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  font-size: 0.9rem;
  color: var(--rg-ink-soft);
}
.rg-hero-meta .item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.rg-hero-meta .lbl {
  color: var(--rg-mute);
  font-weight: 600;
}
.rg-hero-meta a {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 600;
}
.rg-hero-meta a:hover {
  text-decoration: underline;
}

.rg-hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.rg-hero-actions {
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-self: start;
  padding-top: 4px;
  min-width: 170px;
}
.rg-hero-actions > form {
  display: contents;
}
.rg-hero-actions .rg-btn {
  justify-content: flex-start;
}
@media (max-width: 900px) {
  .rg-hero-actions {
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
    grid-column: 1/-1;
  }
}

.rg-hero-parents {
  margin-top: 16px;
  padding: 13px 24px 16px;
  border-top: 1px dashed var(--rg-line-strong);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 575px) {
  .rg-hero-parents {
    grid-template-columns: 1fr;
    padding: 12px 16px 14px;
  }
}

.rg-hero-parent {
  display: flex;
  align-items: center;
  gap: 10px;
}
.rg-hero-parent .ico-tile {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-olive);
}
.rg-hero-parent.dam .ico-tile {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.rg-hero-parent.sire .ico-tile {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.rg-hero-parent .lbl {
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.rg-hero-parent .nm {
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: -0.01em;
}
.rg-hero-parent .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  color: var(--rg-mute);
  margin-left: 6px;
  margin-right: 6px;
}
.rg-hero-parent a {
  color: var(--rg-ink);
  text-decoration: none;
}
.rg-hero-parent a:hover {
  text-decoration: underline;
}

/* ════════════════════════════════════════════════════════
   TABS
   ════════════════════════════════════════════════════════ */
.rg-tabs {
  display: flex;
  gap: 2px;
  align-items: center;
  padding: 0 24px;
  border-top: 1px solid var(--rg-line);
  overflow-x: auto;
  scrollbar-width: none;
}
.rg-tabs::-webkit-scrollbar {
  display: none;
}

.rg-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 13px 13px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--rg-mute);
  text-decoration: none;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.12s, border-color 0.12s;
  position: relative;
}
.rg-tab:hover {
  color: var(--rg-ink);
  background: none;
}
.rg-tab.active {
  color: var(--rg-ink);
  border-bottom-color: var(--rg-ink);
}
.rg-tab:focus {
  outline: none;
  box-shadow: none;
}
.rg-tab:focus-visible {
  outline: 2px solid var(--rg-ink);
  outline-offset: -2px;
  border-radius: 4px;
}
.rg-tab .count {
  font-size: 0.68rem;
  padding: 1px 6px;
  border-radius: 999px;
  background: var(--rg-olive);
  color: var(--rg-mute);
  font-weight: 700;
}
.rg-tab.active .count {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.rg-tab.tab-female {
  color: var(--rg-female);
}
.rg-tab.tab-female .count {
  background: var(--rg-female);
  color: #fff;
}

/* ════════════════════════════════════════════════════════
   CONTENT LAYOUT — info tabs
   ════════════════════════════════════════════════════════ */
.rg-content {
  padding: 20px 0 0;
}

.rg-cards-grid {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 16px;
}
@media (max-width: 900px) {
  .rg-cards-grid {
    grid-template-columns: 1fr;
  }
}

.rg-card-padded {
  padding: 20px 22px;
}

.rg-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 12px;
}
.rg-section-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0;
  color: var(--rg-ink);
}
.rg-section-head a {
  font-size: 0.82rem;
  color: var(--rg-mute);
  text-decoration: none;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.rg-section-head a:hover {
  color: var(--rg-ink);
}

.rg-dl {
  display: grid;
  grid-template-columns: 130px 1fr;
  row-gap: 11px;
  column-gap: 16px;
  margin: 0;
}
.rg-dl dt {
  color: var(--rg-mute);
  font-size: 0.82rem;
  font-weight: 600;
  margin: 0;
  align-self: flex-start;
  padding-top: 4px;
}
.rg-dl dd {
  margin: 0;
  color: var(--rg-ink);
  font-size: 0.93rem;
}

.rg-notes {
  background: var(--rg-cream);
  border-left: 3px solid var(--rg-accent);
  border-radius: 4px 12px 12px 4px;
  padding: 13px 15px;
  font-size: 0.9rem;
  color: var(--rg-ink-soft);
  line-height: 1.5;
  white-space: pre-line;
}

/* color chip & tag */
.color-chip {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  vertical-align: -1px;
  margin-right: 7px;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.color-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 600;
}

/* COI meter */
.coi-meter {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.coi-meter .bar {
  position: relative;
  height: 8px;
  background: var(--rg-olive);
  border-radius: 999px;
  overflow: hidden;
}
.coi-meter .bar > span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--rg-success), var(--rg-warn) 50%, var(--rg-danger));
}
.coi-meter .legend {
  display: flex;
  justify-content: space-between;
  font-size: 0.7rem;
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
}
.coi-meter .legend .val {
  font-family: ui-monospace, monospace;
  color: var(--rg-ink);
  font-weight: 700;
}

/* litter chip */
.litter-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  background: var(--rg-olive);
  color: var(--rg-ink);
  text-decoration: none;
  border: 1px solid var(--rg-line);
}
.litter-chip .yr {
  font-weight: 500;
  color: var(--rg-mute);
}
.litter-chip:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.litter-chip:hover .yr {
  color: rgba(255, 255, 255, 0.6);
}

/* mini degu link card (inside rg-dl) */
.rg-mini-degu {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px;
  border: 1px solid var(--rg-line);
  border-radius: 13px;
  background: var(--rg-cream);
  text-decoration: none;
  color: var(--rg-ink);
}
.rg-mini-degu:hover {
  background: var(--rg-paper);
  color: var(--rg-ink);
}
.rg-mini-degu .photo {
  width: 50px;
  height: 50px;
  border-radius: 9px;
  flex-shrink: 0;
  overflow: hidden;
}
.rg-mini-degu .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rg-mini-degu .nm {
  font-weight: 700;
  line-height: 1.15;
}
.rg-mini-degu .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.7rem;
  color: var(--rg-mute);
}
.rg-mini-degu .row2 {
  display: flex;
  gap: 5px;
  margin-top: 3px;
  flex-wrap: wrap;
}

/* ════════════════════════════════════════════════════════
   GALLERY TAB
   ════════════════════════════════════════════════════════ */
.rg-gallery {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 9px;
}
@media (max-width: 767px) {
  .rg-gallery {
    grid-template-columns: repeat(3, 1fr);
  }
}

.rg-gallery .thumb {
  aspect-ratio: 1/1;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  border: 1px solid var(--rg-line);
}
.rg-gallery .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rg-gallery .thumb.avatar::after {
  content: "★ avatar";
  position: absolute;
  top: 7px;
  right: 7px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 0.62rem;
  padding: 2px 6px;
  border-radius: 5px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.rg-dropzone {
  border: 2px dashed var(--rg-line-strong);
  border-radius: 13px;
  padding: 24px;
  text-align: center;
  color: var(--rg-mute);
  font-size: 0.9rem;
  background: var(--rg-cream);
  margin-bottom: 14px;
  cursor: pointer;
  display: block;
}
.rg-dropzone strong {
  color: var(--rg-ink);
  font-weight: 700;
}
.rg-dropzone .limits {
  font-size: 0.82rem;
}

/* ════════════════════════════════════════════════════════
   HEALTH TAB — stat strip + weight chart + journal
   ════════════════════════════════════════════════════════ */
.rg-stat-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 11px;
  margin-bottom: 16px;
}
@media (max-width: 575px) {
  .rg-stat-strip {
    grid-template-columns: repeat(2, 1fr);
  }
}

.rg-stat-tile {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 13px;
  padding: 13px 15px;
}
.rg-stat-tile .lbl {
  font-size: 0.67rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 4px;
}
.rg-stat-tile .val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--rg-ink);
  line-height: 1;
}
.rg-stat-tile .sub {
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 3px;
}

.weight-chart {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px 20px 12px;
}
.weight-chart svg {
  width: 100%;
  height: 220px;
  display: block;
}

.journal-entry {
  display: grid;
  grid-template-columns: 96px 34px 1fr;
  gap: 13px;
  align-items: flex-start;
  padding: 14px 0;
  border-top: 1px solid var(--rg-line);
}
.journal-entry:first-child {
  border-top: none;
}
.journal-entry .date {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  color: var(--rg-mute);
  padding-top: 5px;
}
.journal-entry .tile {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
}
.journal-entry.warn .tile {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.journal-entry.danger .tile {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}
.journal-entry.good .tile {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}
.journal-entry .title {
  font-weight: 700;
  font-size: 0.96rem;
  margin-bottom: 2px;
}
.journal-entry .body {
  color: var(--rg-ink-soft);
  font-size: 0.87rem;
  line-height: 1.44;
}
.journal-entry .meta {
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 5px;
}

/* ════════════════════════════════════════════════════════
   RODOKMEN TAB
   ════════════════════════════════════════════════════════ */
.tree-wrap {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 22px;
}

.tree-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  align-items: stretch;
}

.tree-col-head {
  font-size: 0.64rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  text-align: center;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--rg-line-strong);
  margin-bottom: 9px;
}

.tree-col {
  display: flex;
  flex-direction: column;
  gap: 9px;
  justify-content: space-around;
}

.tree-node {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 52px;
  justify-content: center;
}
.tree-node.male {
  background: var(--rg-male-bg);
  border-color: rgba(10, 78, 168, 0.18);
}
.tree-node.female {
  background: var(--rg-female-bg);
  border-color: rgba(168, 32, 95, 0.18);
}
.tree-node.unknown {
  background: repeating-linear-gradient(45deg, var(--rg-olive) 0 6px, transparent 6px 12px);
  color: var(--rg-mute);
  font-style: italic;
}
.tree-node .nm {
  font-weight: 700;
  font-size: 0.86rem;
  line-height: 1.15;
}
.tree-node .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.68rem;
  color: var(--rg-mute);
}

/* ════════════════════════════════════════════════════════
   CHOVATEL — logo, meta, vrhy
   ════════════════════════════════════════════════════════ */
.chov-logo {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 3.6rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  background: radial-gradient(circle at 30% 30%, #d97706, #7a2808);
  position: relative;
  overflow: hidden;
}
.chov-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.chov-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 8px;
  column-gap: 18px;
  font-size: 0.9rem;
}
.chov-meta-grid .item {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--rg-ink-soft);
}
.chov-meta-grid .lbl {
  color: var(--rg-mute);
  font-weight: 600;
}
.chov-meta-grid a {
  color: var(--rg-ink);
  text-decoration: none;
}
.chov-meta-grid a:hover {
  text-decoration: underline;
}

/* litter card (vrh) */
.litter-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 13px;
}

.litter-strip {
  display: flex;
  height: 7px;
}
.litter-strip > div {
  flex: 1;
}

.litter-head {
  display: grid;
  grid-template-columns: 54px 1fr auto auto;
  gap: 16px;
  align-items: center;
  padding: 14px 18px;
  cursor: pointer;
}
@media (max-width: 767px) {
  .litter-head {
    grid-template-columns: 42px 1fr auto;
  }
}

.litter-letter {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  background: var(--rg-ink);
  color: var(--rg-paper);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.85rem;
  font-weight: 700;
}

.litter-title {
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: -0.01em;
}

.litter-date {
  color: var(--rg-mute);
  font-size: 0.83rem;
  margin-left: 5px;
}

.litter-pups-count {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--rg-olive);
  font-size: 0.77rem;
  font-weight: 700;
  white-space: nowrap;
}

.litter-parents-row {
  display: flex;
  gap: 13px;
  margin-top: 5px;
  font-size: 0.83rem;
  flex-wrap: wrap;
}

.litter-parent {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 2px 2px 6px;
  border-radius: 999px;
  background: var(--rg-olive);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink-soft);
  font-size: 0.82rem;
}
.litter-parent.dam .ico-tile {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.litter-parent.sire .ico-tile {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.litter-parent .ico-tile {
  width: 20px;
  height: 20px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.litter-parent a {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 600;
}
.litter-parent a:hover {
  text-decoration: underline;
}

.litter-pup-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  max-width: 380px;
  justify-content: flex-end;
}

.pup-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px 3px 6px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 600;
  text-decoration: none;
}
.pup-chip.male {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.pup-chip.female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.pup-chip:hover {
  filter: brightness(0.96);
}
.pup-chip .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.litter-chevron {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--rg-cream);
  color: var(--rg-mute);
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.litter-chevron svg {
  width: 14px;
  height: 14px;
}

.litter-head[aria-expanded=true] .litter-chevron {
  transform: rotate(180deg);
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.litter-body {
  padding: 16px 18px 18px;
  border-top: 1px dashed var(--rg-line-strong);
}

/* litter quick-nav */
.litter-nav {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.litter-nav .label {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

.litter-nav-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: none;
  transition: transform 0.12s, background 0.12s;
}
.litter-nav-chip:hover {
  transform: translateY(-1px);
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* contact cards */
.contact-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 13px;
}
@media (max-width: 575px) {
  .contact-grid {
    grid-template-columns: 1fr;
  }
}

.contact-card {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 16px 18px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  text-decoration: none;
  color: var(--rg-ink);
}
.contact-card:hover {
  background: var(--rg-cream);
  color: var(--rg-ink);
}
.contact-card.no-hover {
  cursor: default;
}
.contact-card.no-hover:hover {
  background: var(--rg-paper);
}
.contact-card .ic-tile {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-olive);
  color: var(--rg-accent);
  flex-shrink: 0;
}
.contact-card .lbl {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.contact-card .val {
  font-weight: 600;
  font-size: 0.92rem;
}

.rg-hero-toprow {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.origin-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 18px;
}

.unknown-parent {
  color: var(--rg-mute);
  font-style: italic;
  font-size: 0.88rem;
}

.dl-link {
  color: var(--rg-ink);
  font-weight: 600;
  text-decoration: none;
}
.dl-link:hover {
  text-decoration: underline;
}

.litter-chips-row {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.section-divider-sm {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--rg-line-strong);
}

.rg-hero-mb {
  margin-bottom: 1.5rem;
}

.rg-hero-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 24px;
  flex-wrap: wrap;
}

.rg-hero-photo-sm {
  width: 72px;
  height: 72px;
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid var(--rg-line);
}
.rg-hero-photo-sm img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.rg-hero-title-sm {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-weight: 700;
  margin: 2px 0 6px;
  line-height: 1.1;
  color: var(--rg-ink);
}

.rg-hero-pills-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.rg-hero-actions-row {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.rg-card-padded-lg {
  padding: 24px;
  border-radius: 18px;
}

.rg-hero-photo-md {
  width: 80px;
  height: 80px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--rg-line);
  flex-shrink: 0;
}
.rg-hero-photo-md img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.litter-added-notice {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--rg-success-bg);
  border: 1px solid var(--rg-success);
  border-radius: 12px;
  font-size: 0.9rem;
  color: var(--rg-success);
  flex-wrap: wrap;
}

.degu-warning-notice {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: rgba(217, 119, 6, 0.1);
  border: 1px solid var(--rg-warn);
  border-radius: 12px;
  font-size: 0.9rem;
  color: var(--rg-warn);
  flex-wrap: wrap;
}

.notice-flex-text {
  flex: 1;
}

.history-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.history-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 6px 0;
  border-top: 1px solid var(--rg-line);
}

.history-date {
  font-size: 0.76rem;
  color: var(--rg-mute);
  white-space: nowrap;
  flex-shrink: 0;
  font-family: ui-monospace, monospace;
}

.history-name {
  font-size: 0.88rem;
  color: var(--rg-ink);
}

.history-link {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 500;
}
.history-link:hover {
  text-decoration: underline;
}

.history-text {
  color: var(--rg-ink-soft);
}

.rg-avatar-crop-picker-label {
  font-size: 0.85rem;
  color: var(--rg-mute);
  margin-bottom: 8px;
}

.rg-avatar-crop-picker {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin-bottom: 16px;
  padding-bottom: 4px;
}

.rg-avatar-crop-thumb {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 8px;
  overflow: hidden;
  border: 2px solid transparent;
  padding: 0;
  cursor: pointer;
  background: var(--bs-secondary-bg);
}
.rg-avatar-crop-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.rg-avatar-crop-thumb.active {
  border-color: var(--rg-accent);
}

.rg-avatar-crop-add {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px dashed var(--rg-line-strong);
  color: var(--rg-mute);
  background: transparent;
  cursor: pointer;
}
.rg-avatar-crop-add:hover {
  border-color: var(--rg-accent);
  color: var(--rg-accent);
}

/* ════════════════════════════════════════════════════════
   SEZNAM (LIST) — page shell, header, filter, grid/table
   ════════════════════════════════════════════════════════ */
.list-page {
  background: var(--rg-bg);
  min-height: 100%;
}

.list-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .list-shell {
    padding: 16px 16px 30px;
  }
}

.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.page-head .titles {
  min-width: 0;
}
.page-head .eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 4px;
}
.page-head h1 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin: 0 0 4px;
  color: var(--rg-ink);
}
.page-head h1 em {
  font-style: italic;
  color: var(--rg-accent);
  font-weight: 500;
}
.page-head .sub {
  color: var(--rg-mute);
  font-size: 0.92rem;
  max-width: 56ch;
}
.page-head .head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.seznam-layout {
  display: grid;
  grid-template-columns: 256px 1fr;
  gap: 16px;
  align-items: flex-start;
}
@media (width < 900px) {
  .seznam-layout {
    grid-template-columns: 1fr;
  }
}

.filter-rail {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  padding: 6px 6px 16px;
  position: sticky;
  top: calc(var(--rg-nav-h) + 12px);
}
.filter-rail.is-mobile {
  position: static;
}
.filter-rail.is-mobile .filter-rail-head {
  cursor: pointer;
  user-select: none;
}
.filter-rail.is-mobile .filter-rail-head .ttl {
  flex-grow: 1;
}
.filter-rail.is-mobile .filter-rail-head::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--rg-mute);
  transition: transform 0.2s;
}
.filter-rail.is-mobile.is-collapsed {
  padding-bottom: 6px;
}
.filter-rail.is-mobile.is-collapsed .filter-group, .filter-rail.is-mobile.is-collapsed .filter-group + * {
  display: none;
}
.filter-rail.is-mobile.is-collapsed .filter-rail-head::after {
  transform: rotate(-90deg);
}

.filter-rail-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px 7px;
}
.filter-rail-head .ic {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: var(--rg-ink);
  color: var(--rg-paper);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.filter-rail-head .ttl {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
}
.filter-rail-head .clear {
  margin-left: auto;
  font-size: 0.76rem;
  color: var(--rg-mute);
  text-decoration: none;
  font-weight: 600;
}
.filter-rail-head .clear:hover {
  color: var(--rg-ink);
  text-decoration: underline;
}

.filter-group {
  border-top: 1px dashed var(--rg-line);
  padding: 11px 13px 5px;
}
.filter-group:first-of-type {
  border-top: 0;
}
.filter-group .group-title {
  font-size: 0.64rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 9px;
}

.facet-row {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 5px 7px;
  margin: 0 -7px;
  border-radius: 7px;
  cursor: pointer;
}
.facet-row:hover {
  background: var(--rg-cream);
}
.facet-row input[type=checkbox],
.facet-row input[type=radio] {
  accent-color: var(--rg-accent-2);
  width: 14px;
  height: 14px;
}
.facet-row input[type=radio].radio-female {
  accent-color: var(--rg-female);
}
.facet-row input[type=radio].radio-male {
  accent-color: var(--rg-male);
}
.facet-row .swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}
.facet-row .lbl {
  font-size: 0.87rem;
  flex-grow: 1;
}
.facet-row .num {
  font-size: 0.76rem;
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
}

/* ─── Dual range slider ─── */
.dual-range {
  padding: 6px 2px 4px;
}
.dual-range .dual-range-track {
  position: relative;
  height: 6px;
  background: var(--rg-olive);
  border-radius: 999px;
  margin: 10px 0 8px;
}
.dual-range .dual-range-track .fill {
  position: absolute;
  top: 0;
  bottom: 0;
  background: var(--rg-ink);
  border-radius: 999px;
  pointer-events: none;
}
.dual-range .dual-range-inputs {
  position: relative;
  height: 6px;
  margin: -16px 0 4px;
}
.dual-range .dual-range-inputs input[type=range] {
  position: absolute;
  width: 100%;
  height: 6px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  outline: none;
  pointer-events: none;
}
.dual-range .dual-range-inputs input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--rg-paper);
  border: 2px solid var(--rg-ink);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  pointer-events: all;
  transition: transform 0.1s;
}
.dual-range .dual-range-inputs input[type=range]::-webkit-slider-thumb:hover {
  transform: scale(1.15);
}
.dual-range .dual-range-inputs input[type=range]::-webkit-slider-thumb:active {
  transform: scale(1.2);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
}
.dual-range .dual-range-inputs input[type=range]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--rg-paper);
  border: 2px solid var(--rg-ink);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  pointer-events: all;
}
.dual-range .dual-range-values {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
  color: var(--rg-ink-soft);
  font-weight: 600;
  margin-top: 6px;
}

.filter-group-more {
  margin-top: 4px;
}

.filter-more {
  display: block;
  padding: 5px 0;
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}
.filter-more:hover {
  color: var(--rg-ink);
}

.list-toolbar .dropdown {
  position: relative;
}

.list-toolbar {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 13px;
  padding: 9px 13px;
  margin-bottom: 13px;
}
.list-toolbar .results-count {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
}
.list-toolbar .results-count em {
  font-style: italic;
  color: var(--rg-mute);
  font-weight: 500;
}
.list-toolbar .search-box {
  position: relative;
  flex-grow: 1;
  max-width: 340px;
}
.list-toolbar .search-box .ico {
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--rg-mute);
  pointer-events: none;
}
.list-toolbar .search-box input {
  width: 100%;
  padding: 8px 12px 8px 36px;
  border-radius: 10px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  font-size: 0.87rem;
  color: var(--rg-ink);
  outline: none;
}
.list-toolbar .search-box input:focus {
  border-color: var(--rg-ink);
}
.list-toolbar .search-box input::placeholder {
  color: var(--rg-mute);
}
.list-toolbar .right {
  margin-left: auto;
  display: flex;
  gap: 7px;
  align-items: center;
}

.list-toolbar-label {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  white-space: nowrap;
}

.list-toolbar.filter-grid {
  display: grid;
  grid-template-columns: auto 1fr 1fr auto;
  align-items: center;
}
.list-toolbar.filter-grid .list-toolbar-label {
  white-space: nowrap;
}
.list-toolbar.filter-grid .form-select {
  width: 100%;
}
@media (width < 600px) {
  .list-toolbar.filter-grid {
    grid-template-columns: 1fr;
  }
  .list-toolbar.filter-grid .rg-btn {
    width: 100%;
    justify-content: center;
  }
}

.sort-menu {
  min-width: 220px;
}

.sort-option-btn {
  border: none;
  background: none;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.sort-option-icon {
  color: var(--rg-accent);
  margin-right: 4px;
  display: inline-flex;
}

.sort-spacer {
  display: inline-block;
  width: 17px;
}

.sort-dropdown {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 11px;
  border-radius: 10px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink);
  font-size: 0.87rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}

/* Active filter chips */
.active-filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 13px;
}
.active-filters .lbl {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

.filter-clear-all {
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 600;
  text-decoration: underline;
  margin-left: 4px;
}
.filter-clear-all:hover {
  color: var(--rg-ink);
}

.afilter-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 6px 4px 10px;
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
}
.afilter-chip .x {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Pagination */
.rg-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: 22px;
}
.rg-pagination a, .rg-pagination span, .rg-pagination button {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink);
  font-weight: 600;
  font-size: 0.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
}
.rg-pagination a:hover, .rg-pagination span:hover, .rg-pagination button:hover {
  background: var(--rg-cream);
}
.rg-pagination a.active, .rg-pagination span.active, .rg-pagination button.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: var(--rg-ink);
  pointer-events: none;
}
.rg-pagination a.ellipsis, .rg-pagination span.ellipsis, .rg-pagination button.ellipsis {
  background: none;
  border: none;
  color: var(--rg-mute);
  pointer-events: none;
}
.rg-pagination button {
  border: none;
}

/* Empty state */
.list-empty {
  text-align: center;
  background: var(--rg-paper);
  border: 1px dashed var(--rg-line-strong);
  border-radius: 16px;
  padding: 56px 28px;
  color: var(--rg-mute);
}
.list-empty .ic {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--rg-olive);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}
.list-empty h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--rg-ink);
  margin: 0 0 6px;
}
.list-empty p {
  margin: 0 auto 16px;
  max-width: 36em;
  font-size: 0.93rem;
}
.list-empty .actions {
  display: inline-flex;
  gap: 8px;
}

.view-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
}
.view-toggle button {
  border: none;
  background: transparent;
  width: 30px;
  height: 30px;
  border-radius: 7px;
  color: var(--rg-mute);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.view-toggle button.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.seznam-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 13px;
}
@media (width < 1100px) {
  .seznam-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (width < 767px) {
  .seznam-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (width < 430px) {
  .seznam-grid {
    grid-template-columns: 1fr;
  }
}

.seznam-table {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
}
.seznam-table table {
  width: 100%;
  border-collapse: collapse;
}
.seznam-table thead th {
  text-align: left;
  background: var(--rg-cream);
  border-bottom: 1px solid var(--rg-line);
  padding: 11px 13px;
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  white-space: nowrap;
}
.seznam-table tbody td {
  padding: 10px 13px;
  border-bottom: 1px solid var(--rg-line);
  font-size: 0.88rem;
  vertical-align: middle;
}
.seznam-table tbody tr:hover {
  background: var(--rg-cream);
}
.seznam-table tbody tr:last-child td {
  border-bottom: 0;
}
.seznam-table td.tphoto {
  width: 52px;
}
.seznam-table td.tphoto .ph {
  width: 38px;
  height: 38px;
  border-radius: 9px;
  overflow: hidden;
}
.seznam-table td.tphoto .ph img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.seznam-table td.tphoto .ph .ph-blank {
  width: 100%;
  height: 100%;
  background: var(--rg-olive);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
}
.seznam-table .tnm {
  font-weight: 700;
  color: var(--rg-ink);
}
.seznam-table .trc {
  font-family: ui-monospace, monospace;
  font-size: 0.74rem;
  color: var(--rg-mute);
}
.seznam-table .row-link {
  color: var(--rg-ink);
  text-decoration: none;
}
.seznam-table .row-link:hover {
  text-decoration: underline;
}
.seznam-table .chov-cell a {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 600;
}
.seznam-table .chov-cell a:hover {
  text-decoration: underline;
}
.seznam-table td.actions-cell {
  width: 80px;
  text-align: right;
}
.seznam-table td.actions-cell a {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.seznam-table td.actions-cell a:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.seznam-table td.actions-cell a + a {
  margin-left: 4px;
}
.seznam-table .chov-cell .empty {
  color: var(--rg-mute);
}

/* ════════════════════════════════════════════════════════
   FORMS — fcard sections
   ════════════════════════════════════════════════════════ */
.form-page {
  background: var(--rg-bg);
  min-height: 100vh;
  padding-bottom: 90px;
}

.form-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .form-shell {
    padding: 16px 16px 30px;
  }
}
.form-shell {
  padding-bottom: 0;
}

.form-pageheader {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 22px;
}
.form-pageheader .head-actions {
  margin-left: auto;
}
.form-pageheader .back-btn {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  text-decoration: none;
}
.form-pageheader .back-btn:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.form-pageheader .eyebrow {
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 4px;
}
.form-pageheader h1 {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin: 0 0 4px;
  color: var(--rg-ink);
}
.form-pageheader h1 em {
  font-style: italic;
  color: var(--rg-accent);
  font-weight: 500;
}
.form-pageheader .sub {
  color: var(--rg-mute);
  font-size: 0.93rem;
}

.fcard {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  margin-bottom: 16px;
  position: relative;
}

.fcard-head {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 16px 20px;
  border-bottom: 1px dashed var(--rg-line-strong);
  border-radius: 16px 16px 0 0;
}
.fcard-head .num {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: var(--rg-ink);
  color: var(--rg-paper);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-weight: 700;
  font-size: 0.92rem;
  flex-shrink: 0;
}
.fcard-head .icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.fcard-head .icon--warn {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.fcard-head .title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--rg-ink);
  margin: 0;
}
.fcard-head .sub {
  font-size: 0.83rem;
  color: var(--rg-mute);
  margin: 2px 0 0;
}

.fcard-head--compact {
  padding-top: 13px;
  padding-bottom: 13px;
}

.fcard-body {
  padding: 18px 20px 20px;
}

.fcard-body--compact {
  padding-top: 12px;
  padding-bottom: 14px;
}

.fgrid {
  display: grid;
  gap: 13px;
}

.fgrid.cols-2 {
  grid-template-columns: 1fr 1fr;
}

.fgrid.cols-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.fgrid.mt-sm {
  margin-top: 12px;
}

.fgrid.mt-md {
  margin-top: 14px;
}

.fgrid.mt-lg {
  margin-top: 16px;
}

.fgrid.row-gap-sm {
  row-gap: 4px;
}

.fgrid.gap-lg {
  gap: 16px;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.field label.lbl {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.field label.lbl .req {
  color: var(--rg-danger);
  margin-left: 2px;
}
.field .hint {
  font-size: 0.77rem;
  color: var(--rg-mute);
}
.field .err {
  font-size: 0.77rem;
  color: var(--rg-danger);
}
.field input[type=text], .field input[type=email], .field input[type=date], .field input[type=url], .field input[type=password], .field select, .field textarea {
  width: 100%;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  padding: 9px 13px;
  font-size: 0.93rem;
  color: var(--rg-ink);
  font-family: inherit;
  outline: none;
  transition: border-color 0.12s, background 0.12s;
}
.field input[type=text]:focus, .field input[type=email]:focus, .field input[type=date]:focus, .field input[type=url]:focus, .field input[type=password]:focus, .field select:focus, .field textarea:focus {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
}
.field input[type=text]::placeholder, .field input[type=email]::placeholder, .field input[type=date]::placeholder, .field input[type=url]::placeholder, .field input[type=password]::placeholder, .field select::placeholder, .field textarea::placeholder {
  color: var(--rg-mute);
}
.field textarea {
  resize: vertical;
  min-height: 84px;
  line-height: 1.5;
}

.sex-toggle {
  display: inline-flex;
  gap: 3px;
  padding: 4px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
}
.sex-toggle button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 8px;
  border: none;
  background: transparent;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--rg-ink-soft);
  cursor: pointer;
  flex-grow: 1;
  justify-content: center;
}
.sex-toggle button.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.sex-toggle button.active.male {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.sex-toggle button.active.female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}

.color-picker {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
}

.color-pick-opt {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 11px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  cursor: pointer;
  font-size: 0.87rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
}
.color-pick-opt .swatch {
  width: 20px;
  height: 20px;
  border-radius: 5px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  flex-shrink: 0;
}
.color-pick-opt:hover {
  background: var(--rg-paper);
}
.color-pick-opt.active {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
  color: var(--rg-ink);
  box-shadow: 0 0 0 2px var(--rg-ink) inset;
}

.gene-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.gene-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--rg-cream);
  border: 1px dashed var(--rg-line-strong);
  border-radius: 999px;
  padding: 4px 11px;
  font-size: 0.83rem;
  font-weight: 600;
  color: var(--rg-ink-soft);
  cursor: pointer;
  font-family: ui-monospace, monospace;
}
.gene-chip:hover {
  background: var(--rg-paper);
}
.gene-chip.active {
  background: var(--rg-success-bg);
  color: var(--rg-success);
  border-color: transparent;
  border-style: solid;
}

.status-picker {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 7px;
}

.status-opt {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 11px 13px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  cursor: pointer;
}
.status-opt .row1 {
  display: flex;
  align-items: center;
  gap: 7px;
}
.status-opt .ic {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: var(--rg-paper);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.status-opt.chov .ic {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}
.status-opt.mazlik .ic {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.status-opt.na_prodej .ic {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.status-opt.zesnuly .ic {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.status-opt .lbl {
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--rg-ink);
}
.status-opt .sub {
  font-size: 0.76rem;
  color: var(--rg-mute);
  line-height: 1.3;
}
.status-opt.active {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 2px var(--rg-ink) inset;
}

.fgrid.cols-4 {
  grid-template-columns: repeat(4, 1fr);
}

.fgrid .span-2 {
  grid-column: span 2;
}

/* ─── Input with prefix (RČ) ─── */
.input-with-prefix {
  display: flex;
  align-items: stretch;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  overflow: hidden;
}
.input-with-prefix .prefix {
  padding: 9px 13px;
  background: var(--rg-paper);
  border-right: 1px solid var(--rg-line);
  font-size: 0.88rem;
  color: var(--rg-mute);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.input-with-prefix input {
  border: none;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  flex-grow: 1;
  padding: 9px 13px;
  outline: none;
  font-size: 0.93rem;
  color: var(--rg-ink);
  font-family: inherit;
}
.input-with-prefix:focus-within {
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
}

/* ─── Read-only display field ─── */
.field .ftxt {
  width: 100%;
  background: var(--rg-olive);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  padding: 9px 13px;
  font-size: 0.93rem;
  color: var(--rg-mute);
  font-family: ui-monospace, monospace;
}

/* ─── Picked degu pill ─── */
.picked-degu {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  padding: 7px 8px;
}
.picked-degu .photo {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--rg-olive);
}
.picked-degu .nm {
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1.1;
}
.picked-degu .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.68rem;
  color: var(--rg-mute);
}
.picked-degu .pills {
  display: flex;
  gap: 4px;
  margin-top: 3px;
}
.picked-degu .actions {
  margin-left: auto;
  display: flex;
  gap: 4px;
}
.picked-degu .actions button {
  width: 27px;
  height: 27px;
  border-radius: 7px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-mute);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.picked-degu .actions button:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* ─── Photo upload widget ─── */
.photo-upload {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 16px;
  align-items: stretch;
}
.photo-upload .preview {
  width: 200px;
  height: 200px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--rg-line);
  position: relative;
  background: var(--rg-cream);
}
.photo-upload .preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.photo-upload .preview .placeholder-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
}
.photo-upload .controls {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  background: var(--rg-cream);
  border: 1px dashed var(--rg-line-strong);
  border-radius: 13px;
  padding: 16px;
}
.photo-upload .controls h4 {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.02rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0;
}
.photo-upload .controls .hint {
  font-size: 0.83rem;
  color: var(--rg-mute);
  line-height: 1.45;
  margin-top: 6px;
}
.photo-upload .controls .buttons {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

/* ─── Select arrow (overrides shorthand background from nested rule) ─── */
/* .field select — arrow handled by Bootstrap .form-select bg-image, only color overrides here */
.field select {
  cursor: pointer;
}

/* RC field — input + generate button as one connected unit */
.rc-field-wrap .mb-3 {
  margin-bottom: 0 !important;
}
.rc-field-wrap .input-group {
  display: flex;
  align-items: stretch;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  overflow: hidden;
  transition: border-color 0.12s;
}
.rc-field-wrap .input-group:focus-within {
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
}
.rc-field-wrap .input-group .form-control {
  flex: 1;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 9px 13px;
}
.rc-field-wrap .input-group .rc-gen-button {
  background: var(--rg-olive);
  color: var(--rg-ink);
  border: none;
  border-left: 1px solid var(--rg-line);
  border-radius: 0;
  padding: 9px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  flex-shrink: 0;
  white-space: nowrap;
}
.rc-field-wrap .input-group .rc-gen-button:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.save-bar {
  position: sticky;
  bottom: 0;
  background: var(--rg-paper);
  border-top: 1px solid var(--rg-line);
  box-shadow: 0 -6px 18px -6px rgba(0, 0, 0, 0.12);
  padding: 12px 26px;
  display: flex;
  align-items: center;
  gap: 11px;
  z-index: 50;
}
.save-bar .status-text {
  color: var(--rg-mute);
  font-size: 0.83rem;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.save-bar .status-text.unsaved {
  color: var(--rg-warn);
  font-weight: 600;
}
.save-bar .right {
  margin-left: auto;
  display: flex;
  gap: 7px;
}

/* ─── rg-eyebrow as collapsible summary ─── */
.rg-eyebrow-summary {
  cursor: pointer;
  list-style: none;
  padding: 8px 0;
  border-top: 1px dashed var(--rg-line-strong);
}

.rg-eyebrow-summary::-webkit-details-marker {
  display: none;
}

/* ─── Hint min-height (for JS status messages) ─── */
.hint-min {
  min-height: 1.2em;
}

/* ─── rg-btn-sm / rg-btn-icon ─── */
.rg-btn-sm {
  padding: 5px 12px;
  font-size: 0.8rem;
  border-radius: 9px;
  gap: 5px;
}

.rg-btn-icon {
  padding: 0.3rem 0.45rem;
}

/* form-pageheader — italic accent in h1 */
.form-pageheader h1 em {
  font-style: italic;
  color: var(--rg-accent);
  font-weight: 500;
}

/* ─── Form mobile ─── */
@media (max-width: 600px) {
  .form-pageheader {
    flex-wrap: wrap;
  }
  .form-pageheader .titles {
    flex: 1 1 0;
    min-width: 0;
  }
  .form-pageheader > .d-flex {
    order: 3;
    width: 100%;
    margin-left: 46px;
  }
  .form-shell {
    padding-left: 16px;
    padding-right: 16px;
  }
  .rg-shell .form-shell {
    padding-left: 0;
    padding-right: 0;
  }
  .fcard-body {
    padding: 14px 14px 16px;
  }
  .fgrid.cols-2,
  .fgrid.cols-3,
  .fgrid.cols-4 {
    grid-template-columns: 1fr;
  }
  .fgrid .span-2 {
    grid-column: span 1;
  }
  .status-picker {
    grid-template-columns: 1fr 1fr;
  }
  .color-picker {
    grid-template-columns: 1fr 1fr;
  }
  .photo-upload {
    grid-template-columns: 1fr;
  }
  .photo-upload .preview {
    width: 100%;
    height: 220px;
  }
  .sex-toggle {
    display: flex;
    width: 100%;
  }
  .sex-toggle button {
    flex: 1;
    justify-content: center;
  }
  .save-bar {
    padding: 10px 14px;
  }
}
.death-section {
  margin-top: 16px;
  padding: 14px 16px;
  background: var(--rg-danger-bg);
  border: 1px solid var(--rg-danger);
  border-radius: 12px;
}

.death-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.death-section-head .lbl {
  margin: 0;
  color: var(--rg-danger);
}

.litter-mode-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: var(--rg-success-bg);
  border: 1px solid var(--rg-success);
  border-radius: 12px;
  margin-bottom: 16px;
  font-size: 0.88rem;
  color: var(--rg-success);
}

.parents-hint {
  margin-top: 10px;
  font-size: 0.82rem;
  color: var(--rg-mute);
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ════════════════════════════════════════════════════════
   Kalkulačka barev — layout & komponenty
   ════════════════════════════════════════════════════════ */
.calc-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .calc-shell {
    padding: 16px 16px 30px;
  }
}

.calc-parents {
  display: grid;
  grid-template-columns: 1fr 84px 1fr;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 20px;
}

.parent-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.parent-card.female-card {
  border-top: 4px solid var(--rg-female);
}

.parent-card.male-card {
  border-top: 4px solid var(--rg-male);
}

.parent-card .pc-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom: 1px solid var(--rg-line);
}

.parent-card .pc-head .sex-tile {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.parent-card.female-card .pc-head .sex-tile {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}

.parent-card.male-card .pc-head .sex-tile {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}

.parent-card .pc-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1;
}

.parent-card .pc-sub {
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 2px;
}

.parent-card .pc-body {
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex-grow: 1;
}

/* Mode tabs */
.mode-tabs {
  display: inline-flex;
  gap: 0;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  margin-left: auto;
  flex-shrink: 0;
}
.mode-tabs button {
  padding: 5px 11px;
  border-radius: 7px;
  border: none;
  background: transparent;
  font-size: 0.79rem;
  font-weight: 600;
  color: var(--rg-mute);
  cursor: pointer;
}
.mode-tabs button.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* Locus rows */
.locus-rows {
  display: flex;
  flex-direction: column;
}

.locus-row {
  display: grid;
  grid-template-columns: 90px 1fr;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px dashed var(--rg-line-strong);
}
.locus-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.locus-row .lbl-block {
  display: flex;
  flex-direction: column;
}
.locus-row .lbl-name {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  font-size: 0.97rem;
  color: var(--rg-ink);
}
.locus-row .lbl-desc {
  font-size: 0.68rem;
  color: var(--rg-mute);
  line-height: 1.3;
}

.allele-picker {
  display: flex;
  gap: 4px;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
  width: fit-content;
}
.allele-picker button {
  font-family: ui-monospace, monospace;
  font-size: 0.87rem;
  font-weight: 700;
  padding: 5px 12px;
  border-radius: 7px;
  border: none;
  background: transparent;
  color: var(--rg-mute);
  cursor: pointer;
}
.allele-picker button:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
.allele-picker button.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.genotype-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  padding: 10px 14px;
}
.genotype-summary .geno {
  font-family: ui-monospace, monospace;
  font-size: 0.97rem;
  font-weight: 700;
  color: var(--rg-ink);
  letter-spacing: 0.04em;
  flex-grow: 1;
}
.genotype-summary .pheno {
  flex-shrink: 0;
}

/* Calc separator */
.calc-x {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.calc-x .x {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 2.8rem;
  font-weight: 500;
  line-height: 1;
  color: var(--rg-mute);
  letter-spacing: -0.03em;
}
.calc-x button.go {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: var(--rg-ink);
  color: var(--rg-paper);
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18);
}
.calc-x button.go:hover {
  background: var(--rg-btn-bg-hover);
  transform: translateY(-2px);
}
.calc-x .go-lbl {
  font-size: 0.63rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

/* Autocomplete search v kalkulačce */
.calc-autocomplete {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  padding: 7px 8px 7px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
}
.calc-autocomplete .ico-tile {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: var(--rg-paper);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.calc-autocomplete input {
  flex-grow: 1;
  background: transparent;
  border: none;
  outline: none;
  font-size: 0.93rem;
  color: var(--rg-ink);
  padding: 3px 0;
}
.calc-autocomplete input::placeholder {
  color: var(--rg-mute);
}
.calc-autocomplete:focus-within {
  border-color: var(--rg-ink);
  background: var(--rg-paper);
}

.calc-dropdown {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  box-shadow: var(--rg-shadow-dd);
  padding: 6px;
  margin-top: 4px;
  position: relative;
  z-index: 100;
}
.calc-dropdown button {
  display: flex;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: none;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  gap: 10px;
  align-items: center;
}
.calc-dropdown button:hover {
  background: var(--rg-cream);
}
.calc-dropdown button .d-name {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--rg-ink);
}
.calc-dropdown button .d-rc {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  color: var(--rg-mute);
}
.calc-dropdown button .d-color {
  font-size: 0.76rem;
  color: var(--rg-mute);
  margin-left: auto;
}

/* Preset select */
.preset-select-wrap label {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  display: block;
  margin-bottom: 5px;
}
.preset-select-wrap select {
  width: 100%;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 11px;
  padding: 9px 34px 9px 12px;
  font-size: 0.9rem;
  color: var(--rg-ink);
  font-family: inherit;
  outline: none;
  cursor: pointer;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--rg-mute) 50%), linear-gradient(135deg, var(--rg-mute) 50%, transparent 50%);
  background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.preset-select-wrap select:focus {
  background-color: var(--rg-paper);
  border-color: var(--rg-ink);
}

/* Results card */
.results-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 16px;
}

.results-cap {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 22px;
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom: 1px solid var(--rg-line);
}
.results-cap h2 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
}
.results-cap .coi-tag {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 13px;
  border-radius: 999px;
  background: var(--rg-success-bg);
  color: var(--rg-success);
  font-weight: 700;
  font-size: 0.82rem;
}
.results-cap .coi-tag.orange {
  background: #fff0e6;
  color: #c05200;
}
.results-cap .coi-tag.warn {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.results-cap .coi-tag.danger {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}
.results-cap .coi-tag .num {
  font-family: ui-monospace, monospace;
}

.results-body {
  padding: 22px;
}

.results-label {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 10px;
}

/* Phenotype tiles */
.pheno-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.pheno-tile {
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 98px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.pheno-tile .pct {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1;
}
.pheno-tile .nm {
  font-weight: 700;
  font-size: 0.9rem;
  margin-top: 4px;
  line-height: 1.2;
}
.pheno-tile .barva {
  font-family: ui-monospace, monospace;
  font-size: 0.67rem;
  opacity: 0.7;
  margin-top: 2px;
}

/* Stacked probability bar */
.calc-stack-row {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.calc-stack {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--rg-olive);
}

.calc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.calc-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.77rem;
  font-weight: 600;
  border: 1px solid var(--rg-line);
  background: var(--rg-cream);
  color: var(--rg-ink-soft);
}
.calc-chip .dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Genotype detail table */
.geno-table {
  width: 100%;
  border-collapse: collapse;
}

.geno-table th, .geno-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--rg-line);
  font-size: 0.86rem;
  text-align: left;
}

.geno-table th {
  background: var(--rg-cream);
  color: var(--rg-mute);
  font-size: 0.63rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
}

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

.geno-table td.right {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.geno-table .geno-code {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 6px;
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 600;
}

.geno-table .pct-bar {
  height: 5px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--rg-accent), var(--rg-accent-2));
  margin-top: 4px;
  max-width: 100%;
}

@media (max-width: 600px) {
  .geno-table .loci-col {
    display: none;
  }
}
/* Responsive */
@media (max-width: 800px) {
  .calc-parents {
    grid-template-columns: 1fr;
  }
  .calc-x {
    flex-direction: row;
    padding: 8px 0;
  }
  .calc-x .x {
    font-size: 2rem;
  }
  .pheno-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.calc-chip strong {
  color: var(--rg-ink);
}

.geno-td {
  font-family: ui-monospace, monospace;
  color: var(--rg-ink-soft);
  font-weight: 600;
  font-size: 0.87rem;
}

.table-scroll {
  overflow-x: auto;
}

/* ════════════════════════════════════════════════════════
   Porovnání osmáků
   ════════════════════════════════════════════════════════ */
.compare-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .compare-shell {
    padding: 16px 16px 30px;
  }
}

.compare-pickers {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 18px 22px;
  margin-bottom: 16px;
  display: grid;
  grid-template-columns: 1fr 50px 1fr auto;
  gap: 14px;
  align-items: end;
}
.compare-pickers .x-mid {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.8rem;
  color: var(--rg-mute);
  text-align: center;
  line-height: 1;
  padding-bottom: 10px;
}
.compare-pickers .go {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border: none;
  padding: 10px 20px;
  border-radius: 11px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  text-decoration: none;
  white-space: nowrap;
}
.compare-pickers .go:hover {
  background: var(--rg-btn-bg-hover);
  color: var(--rg-paper);
}

.compare-result-head {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 22px;
  margin-bottom: 16px;
}

.compare-result-grid {
  display: grid;
  grid-template-columns: 1fr 220px 1fr;
  gap: 18px;
  align-items: center;
}

.cr-parent {
  display: flex;
  gap: 14px;
  align-items: center;
}
.cr-parent .photo {
  width: 96px;
  height: 96px;
  border-radius: 14px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--rg-olive);
}
.cr-parent .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cr-parent .nm {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.cr-parent .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.76rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.cr-parent .info-pills {
  display: flex;
  gap: 5px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.cr-parent.right {
  flex-direction: row-reverse;
  text-align: right;
}
.cr-parent.right .info-pills {
  justify-content: flex-end;
}

.cr-result {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.cr-result .label {
  font-size: 0.63rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.cr-result .coi-big {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1;
}
.cr-result .coi-big.good {
  color: var(--rg-success);
}
.cr-result .coi-big.orange {
  color: #f97316;
}
.cr-result .coi-big.warn {
  color: var(--rg-warn);
}
.cr-result .coi-big.danger {
  color: var(--rg-danger);
}
.cr-result .coi-small {
  font-size: 0.76rem;
  color: var(--rg-mute);
}

.compare-pedigree {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 16px;
}
.compare-pedigree .ped-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 22px;
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom: 1px solid var(--rg-line);
}
.compare-pedigree .ped-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0;
}
.compare-pedigree .ped-body {
  padding: 22px;
}

.merged-tree {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  overflow-x: auto;
}
.merged-tree .col-title {
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  text-align: center;
  padding-bottom: 7px;
  border-bottom: 1px dashed var(--rg-line-strong);
  margin-bottom: 8px;
}
.merged-tree .col {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.merged-tree .node {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 0.82rem;
  min-height: 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.merged-tree .node .nm {
  font-weight: 700;
  line-height: 1.15;
}
.merged-tree .node .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.63rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.merged-tree .node.male {
  background: var(--rg-male-bg);
  border-color: rgba(10, 78, 168, 0.2);
}
.merged-tree .node.female {
  background: var(--rg-female-bg);
  border-color: rgba(168, 32, 95, 0.2);
}
.merged-tree .node.unknown {
  background: repeating-linear-gradient(45deg, var(--rg-olive) 0 5px, transparent 5px 10px);
  color: var(--rg-mute);
  font-style: italic;
  text-align: center;
  justify-content: center;
  font-size: 0.78rem;
}
.merged-tree .node.shared {
  outline: 2px solid var(--rg-accent);
  outline-offset: -2px;
  position: relative;
}
.merged-tree .node.shared::after {
  content: "↺ společný předek";
  position: absolute;
  top: -9px;
  right: -4px;
  background: var(--rg-accent);
  color: #fff;
  font-size: 0.57rem;
  padding: 2px 6px;
  border-radius: 999px;
  font-weight: 700;
  white-space: nowrap;
  letter-spacing: 0.04em;
}

.compare-ancestry-warning {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
  font-size: 0.85rem;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.compare-ancestry-warning svg {
  flex-shrink: 0;
  margin-top: 1px;
}

.compare-empty {
  background: var(--rg-paper);
  border: 1px dashed var(--rg-line-strong);
  border-radius: 18px;
  padding: 60px 28px;
  text-align: center;
  color: var(--rg-mute);
}
.compare-empty .ic {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--rg-olive);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
}
.compare-empty h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--rg-ink);
  margin: 0 0 8px;
}
.compare-empty p {
  font-size: 0.93rem;
  max-width: 38em;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .compare-pickers {
    grid-template-columns: 1fr;
  }
  .compare-result-grid {
    grid-template-columns: 1fr;
  }
  .cr-parent.right {
    flex-direction: row;
    text-align: left;
  }
  .cr-parent.right .info-pills {
    justify-content: flex-start;
  }
  .merged-tree {
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }
}
.cr-photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
}

.cr-parent .nm a {
  color: inherit;
  text-decoration: none;
}

.compare-scenario-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 10px 12px;
  background: var(--rg-cream);
  border-radius: 8px;
  border: 1px solid var(--rg-line);
  margin-bottom: 16px;
}
.compare-scenario-switcher .compare-scenario-btn {
  padding: 4px 12px;
  border-radius: 20px;
  border: 1px solid var(--rg-line);
  font-size: 0.78rem;
  cursor: pointer;
  transition: background 0.12s;
}
.compare-scenario-switcher .compare-scenario-btn.is-active {
  font-weight: 700;
  background: var(--rg-olive);
  color: var(--rg-ink);
  border-color: transparent;
}
.compare-scenario-switcher .compare-scenario-btn:not(.is-active) {
  font-weight: 400;
  background: transparent;
  color: var(--rg-ink-soft);
}

.compare-label-hint {
  font-size: 0.77rem;
  color: var(--rg-mute);
  white-space: nowrap;
}

/* ════ DARK MODE overrides pro rg-* systém ════ */
[data-bs-theme=dark] {
  --bs-body-bg: #15130f;
  --bs-body-bg-rgb: 21, 19, 15;
  --bs-body-color: #f4f1ea;
  --bs-body-color-rgb: 244, 241, 234;
  --bs-border-color: #495057;
  --bs-secondary-color: #c8c0ad;
  --rg-bg: #15130f;
  --rg-paper: #1f1c17;
  --rg-cream: #25221c;
  --rg-ink: #f4f1ea;
  --rg-ink-soft: #c8c0ad;
  --rg-mute: #908872;
  --rg-line: rgba(255,255,255,0.08);
  --rg-line-strong: rgba(255,255,255,0.16);
  --rg-olive: #2a2620;
  --rg-accent: #d4a45c;
  --rg-accent-2: #f0a85b;
  --rg-male: #7fb0ff;
  --rg-male-bg: #1a2a48;
  --rg-female: #ffa3c8;
  --rg-female-bg: #3a1530;
  --rg-success: #79d39c;
  --rg-success-bg:#1c3a25;
  --rg-warn: #ffce6a;
  --rg-warn-bg: #3a2d10;
  --rg-danger: #ff9aa3;
  --rg-danger-bg: #3a1418;
  --rg-shadow-sm: 0 2px 4px rgba(0,0,0,.4), 0 16px 40px -20px rgba(0,0,0,.6);
  --rg-shadow-md: 0 6px 14px rgba(0,0,0,.5), 0 16px 40px -20px rgba(0,0,0,.7);
  --rg-shadow-lg: 0 20px 60px -30px rgba(0,0,0,.85), 0 4px 8px rgba(0,0,0,.4);
  --rg-shadow-dd: 0 12px 36px -8px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);
  --rg-btn-bg: #f4f1ea;
  --rg-btn-bg-hover: #fff;
  --rg-btn-fg: #1f1d18;
}
[data-bs-theme=dark] .rg-nav {
  background: var(--rg-paper);
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-logo {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-logo:not(.on-dark) .rg-logo-mark img {
  filter: invert(1);
}
[data-bs-theme=dark] .rg-logo-text .l1 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-nav-link {
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .rg-nav-link:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-nav-link.active {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] .rg-nav-search .rg-input {
  background: var(--rg-cream);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-nav-search .kbd {
  background: var(--rg-paper);
  color: var(--rg-mute);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-nav-iconbtn {
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .rg-nav-iconbtn:hover {
  background: var(--rg-olive);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-nav-user {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-nav-user:hover {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .rg-dropdown {
  background: var(--rg-paper) !important;
  border-color: var(--rg-line) !important;
}
[data-bs-theme=dark] .rg-dropdown-item {
  color: var(--rg-ink) !important;
}
[data-bs-theme=dark] .rg-dropdown-item:hover {
  background: var(--rg-olive) !important;
}
[data-bs-theme=dark] .rg-dropdown-item .icon-tile {
  background: var(--rg-olive);
  color: var(--rg-accent);
}
[data-bs-theme=dark] .rg-dropdown-section {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-mobile-drawer {
  background: var(--rg-paper);
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-mobile-drawer .m-link {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-mobile-drawer .m-link:hover {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .rg-mobile-drawer .m-link.active {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] .rg-mobile-drawer .m-link-ico {
  background: var(--rg-olive);
  color: var(--rg-accent);
}
[data-bs-theme=dark] .rg-mobile-drawer .m-group-title {
  color: var(--rg-mute);
}
[data-bs-theme=dark] {
  /* Login */
}
[data-bs-theme=dark] .login-stage {
  background: var(--rg-bg);
}
[data-bs-theme=dark] .login-split {
  background: var(--rg-paper);
  box-shadow: 0 20px 60px -30px rgba(0, 0, 0, 0.6), 0 4px 8px rgba(0, 0, 0, 0.2);
}
[data-bs-theme=dark] .login-body {
  background: var(--rg-paper);
}
[data-bs-theme=dark] .login-title {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .login-sub {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-label {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-input {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-input:focus {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-input::placeholder {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-btn-primary {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] .rg-btn-primary:hover {
  background: #fff;
  color: #000;
}
[data-bs-theme=dark] .rg-btn-ghost {
  color: var(--rg-ink);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-btn-ghost:hover {
  background: var(--rg-olive);
}
[data-bs-theme=dark] {
  /* Landing */
}
[data-bs-theme=dark] .land-stage {
  background: var(--rg-bg);
}
[data-bs-theme=dark] .land-hero-h1 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-hero-h1 em {
  color: var(--rg-accent);
}
[data-bs-theme=dark] .land-lead {
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .land-stats {
  border-top-color: var(--rg-line);
}
[data-bs-theme=dark] .land-stat .num {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-stat .lbl {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .land-section-h2 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-section-more {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .land-section-more:hover {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-eyebrow {
  color: #7a7060;
}
[data-bs-theme=dark] .degu-mini {
  background: var(--rg-paper);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .degu-mini:hover {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .degu-mini-name {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .degu-mini-rc {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .degu-mini-breeder {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .degu-mini-breeder strong {
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .degu-mini-photo-tag {
  background: var(--rg-paper);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .breeder-card-new {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .breeder-card-new a.breeder-link {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .breeder-stat {
  background: var(--rg-cream);
  color: var(--rg-ink);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .breeder-logo {
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .land-tile {
  background: var(--rg-paper);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-tile:hover {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-tile .tile-ico {
  background: var(--rg-olive);
  color: var(--rg-accent);
}
[data-bs-theme=dark] .land-tile .tile-title {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-tile .tile-sub {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .land-feature-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .land-feature-card .feat-ico {
  background: var(--rg-olive);
  color: var(--rg-accent);
}
[data-bs-theme=dark] .land-feature-card .feat-title {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-feature-card .feat-body {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .land-dashboard-h1 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .land-dashboard-h1 em {
  color: var(--rg-accent);
}
[data-bs-theme=dark] .land-photo {
  border-color: var(--rg-paper);
}
[data-bs-theme=dark] .land-sticker {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] {
  /* Breadcrumb */
}
[data-bs-theme=dark] .rg-breadcrumb a {
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .rg-breadcrumb .sep {
  color: var(--rg-line-strong);
}
[data-bs-theme=dark] .rg-breadcrumb span:not(.sep) {
  color: var(--rg-ink);
}
[data-bs-theme=dark] {
  /* Hero & detail */
}
[data-bs-theme=dark] .rg-hero {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-hero-rc {
  background: var(--rg-olive);
  border-color: var(--rg-line);
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-hero-title {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-hero-parent a {
  color: var(--rg-ink);
}
[data-bs-theme=dark] {
  /* Tabs */
}
[data-bs-theme=dark] .rg-tab {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-tab:hover {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-tab.active {
  color: var(--rg-ink);
  border-bottom-color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-tab .count {
  background: var(--rg-olive);
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-tab.active .count {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
[data-bs-theme=dark] {
  /* Content */
}
[data-bs-theme=dark] .rg-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-section-head h3 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-dl dt {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .rg-dl dd {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-notes {
  background: var(--rg-cream);
  border-left-color: var(--rg-accent);
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .coi-meter .bar {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .litter-chip {
  background: var(--rg-olive);
  color: var(--rg-ink);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-mini-degu {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-mini-degu:hover {
  background: var(--rg-paper);
}
[data-bs-theme=dark] {
  /* Litter cards */
}
[data-bs-theme=dark] .litter-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .litter-letter {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
[data-bs-theme=dark] .litter-nav-chip {
  background: var(--rg-paper);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] {
  /* Contact */
}
[data-bs-theme=dark] .contact-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .contact-card:hover {
  background: var(--rg-cream);
}
[data-bs-theme=dark] .contact-card .ic-tile {
  background: var(--rg-olive);
  color: var(--rg-accent);
}
[data-bs-theme=dark] {
  /* Tree nodes */
}
[data-bs-theme=dark] .tree-node {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .tree-wrap {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] {
  /* Filter rail */
}
[data-bs-theme=dark] .list-page {
  background: var(--rg-bg);
}
[data-bs-theme=dark] .filter-rail {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .filter-rail-head .ttl {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .filter-group {
  border-top-color: var(--rg-line);
}
[data-bs-theme=dark] .facet-row:hover {
  background: var(--rg-cream);
}
[data-bs-theme=dark] .facet-row .lbl {
  color: var(--rg-ink);
}
[data-bs-theme=dark] .dual-range .dual-range-track {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .dual-range .fill {
  background: var(--rg-ink);
}
[data-bs-theme=dark] .dual-range input[type=range]::-webkit-slider-thumb {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
}
[data-bs-theme=dark] .dual-range input[type=range]::-moz-range-thumb {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
}
[data-bs-theme=dark] .list-toolbar {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .list-toolbar .search-box input {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .sort-dropdown {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .view-toggle {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .rg-pagination a, [data-bs-theme=dark] .rg-pagination span {
  background: var(--rg-paper);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .rg-pagination a.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
[data-bs-theme=dark] .seznam-table {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .seznam-table thead th {
  background: var(--rg-cream);
  border-bottom-color: var(--rg-line);
  color: var(--rg-mute);
}
[data-bs-theme=dark] .seznam-table tbody td {
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .seznam-table tbody tr:hover {
  background: var(--rg-cream);
}
[data-bs-theme=dark] .seznam-table td.actions-cell a {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .list-empty {
  background: var(--rg-paper);
  border-color: var(--rg-line-strong);
}
[data-bs-theme=dark] .page-head h1 {
  color: var(--rg-ink);
}
[data-bs-theme=dark] {
  /* Forms */
}
[data-bs-theme=dark] .fcard {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .fcard-head {
  border-bottom-color: var(--rg-line-strong);
}
[data-bs-theme=dark] .field input, [data-bs-theme=dark] .field select, [data-bs-theme=dark] .field textarea {
  background: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .field input:focus, [data-bs-theme=dark] .field select:focus, [data-bs-theme=dark] .field textarea:focus {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
}
[data-bs-theme=dark] .color-pick-opt, [data-bs-theme=dark] .status-opt {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .gene-chip {
  background: var(--rg-cream);
  border-color: var(--rg-line-strong);
  color: var(--rg-ink-soft);
}
[data-bs-theme=dark] .sex-toggle {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .save-bar {
  background: var(--rg-paper);
  border-top-color: var(--rg-line);
}
[data-bs-theme=dark] {
  /* Kalkulačka */
}
[data-bs-theme=dark] .parent-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .parent-card .pc-head {
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .mode-tabs {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .mode-tabs button.active {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] .locus-row {
  border-top-color: var(--rg-line-strong);
}
[data-bs-theme=dark] .allele-picker {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .allele-picker button.active {
  background: var(--rg-ink);
  color: var(--rg-bg);
}
[data-bs-theme=dark] .allele-picker button:hover {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .genotype-summary {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .results-card {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .results-cap {
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .pheno-tile {
  border-color: rgba(255, 255, 255, 0.1);
}
[data-bs-theme=dark] .calc-chip {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .calc-stack {
  background: var(--rg-olive);
}
[data-bs-theme=dark] .geno-table th {
  background: var(--rg-cream);
}
[data-bs-theme=dark] .geno-table th, [data-bs-theme=dark] .geno-table td {
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .calc-autocomplete {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .calc-autocomplete:focus-within {
  background: var(--rg-paper);
  border-color: var(--rg-ink);
}
[data-bs-theme=dark] .calc-dropdown {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .calc-dropdown button:hover {
  background: var(--rg-cream);
}
[data-bs-theme=dark] .preset-select-wrap select {
  background-color: var(--rg-cream);
  border-color: var(--rg-line);
  color: var(--rg-ink);
}
[data-bs-theme=dark] .preset-select-wrap select:focus {
  background-color: var(--rg-paper);
}
[data-bs-theme=dark] {
  /* Porovnání */
}
[data-bs-theme=dark] .compare-pickers {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .compare-result-head {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .compare-pedigree {
  background: var(--rg-paper);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .compare-pedigree .ped-head {
  background: linear-gradient(180deg, var(--rg-cream), transparent);
  border-bottom-color: var(--rg-line);
}
[data-bs-theme=dark] .merged-tree .node {
  background: var(--rg-cream);
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .merged-tree .node.male {
  background: var(--rg-male-bg);
}
[data-bs-theme=dark] .merged-tree .node.female {
  background: var(--rg-female-bg);
}
[data-bs-theme=dark] .compare-ancestry-warning {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
[data-bs-theme=dark] .compare-empty {
  background: var(--rg-paper);
  border-color: var(--rg-line-strong);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    --bs-body-bg: #15130f;
    --bs-body-bg-rgb: 21, 19, 15;
    --bs-body-color: #f4f1ea;
    --bs-body-color-rgb: 244, 241, 234;
    --bs-border-color: #495057;
    --bs-secondary-color: #c8c0ad;
    --rg-bg: #15130f;
    --rg-paper: #1f1c17;
    --rg-cream: #25221c;
    --rg-ink: #f4f1ea;
    --rg-ink-soft: #c8c0ad;
    --rg-mute: #908872;
    --rg-line: rgba(255,255,255,0.08);
    --rg-line-strong: rgba(255,255,255,0.16);
    --rg-olive: #2a2620;
    --rg-accent: #d4a45c;
    --rg-accent-2: #f0a85b;
    --rg-male: #7fb0ff;
    --rg-male-bg: #1a2a48;
    --rg-female: #ffa3c8;
    --rg-female-bg: #3a1530;
    --rg-success: #79d39c;
    --rg-success-bg:#1c3a25;
    --rg-warn: #ffce6a;
    --rg-warn-bg: #3a2d10;
    --rg-danger: #ff9aa3;
    --rg-danger-bg: #3a1418;
    --rg-shadow-sm: 0 2px 4px rgba(0,0,0,.4), 0 16px 40px -20px rgba(0,0,0,.6);
    --rg-shadow-md: 0 6px 14px rgba(0,0,0,.5), 0 16px 40px -20px rgba(0,0,0,.7);
    --rg-shadow-lg: 0 20px 60px -30px rgba(0,0,0,.85), 0 4px 8px rgba(0,0,0,.4);
    --rg-shadow-dd: 0 12px 36px -8px rgba(0,0,0,.6), 0 4px 12px rgba(0,0,0,.4);
    --rg-btn-bg: #f4f1ea;
    --rg-btn-bg-hover: #fff;
    --rg-btn-fg: #1f1d18;
  }
  :root:not([data-bs-theme]) .rg-nav,
  [data-bs-theme=auto] .rg-nav {
    background: var(--rg-paper);
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-logo,
  [data-bs-theme=auto] .rg-logo {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-logo:not(.on-dark) .rg-logo-mark img,
  [data-bs-theme=auto] .rg-logo:not(.on-dark) .rg-logo-mark img {
    filter: invert(1);
  }
  :root:not([data-bs-theme]) .rg-logo-text .l1,
  [data-bs-theme=auto] .rg-logo-text .l1 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-nav-link,
  [data-bs-theme=auto] .rg-nav-link {
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .rg-nav-link:hover,
  [data-bs-theme=auto] .rg-nav-link:hover {
    background: var(--rg-olive);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-nav-link.active,
  [data-bs-theme=auto] .rg-nav-link.active {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .rg-nav-search .rg-input,
  [data-bs-theme=auto] .rg-nav-search .rg-input {
    background: var(--rg-cream);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-nav-search .kbd,
  [data-bs-theme=auto] .rg-nav-search .kbd {
    background: var(--rg-paper);
    color: var(--rg-mute);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-nav-iconbtn,
  [data-bs-theme=auto] .rg-nav-iconbtn {
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .rg-nav-iconbtn:hover,
  [data-bs-theme=auto] .rg-nav-iconbtn:hover {
    background: var(--rg-olive);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-nav-user,
  [data-bs-theme=auto] .rg-nav-user {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-nav-user:hover,
  [data-bs-theme=auto] .rg-nav-user:hover {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .rg-dropdown,
  [data-bs-theme=auto] .rg-dropdown {
    background: var(--rg-paper) !important;
    border-color: var(--rg-line) !important;
  }
  :root:not([data-bs-theme]) .rg-dropdown-item,
  [data-bs-theme=auto] .rg-dropdown-item {
    color: var(--rg-ink) !important;
  }
  :root:not([data-bs-theme]) .rg-dropdown-item:hover,
  [data-bs-theme=auto] .rg-dropdown-item:hover {
    background: var(--rg-olive) !important;
  }
  :root:not([data-bs-theme]) .rg-dropdown-item .icon-tile,
  [data-bs-theme=auto] .rg-dropdown-item .icon-tile {
    background: var(--rg-olive);
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .rg-dropdown-section,
  [data-bs-theme=auto] .rg-dropdown-section {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer,
  [data-bs-theme=auto] .rg-mobile-drawer {
    background: var(--rg-paper);
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer .m-link,
  [data-bs-theme=auto] .rg-mobile-drawer .m-link {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer .m-link:hover,
  [data-bs-theme=auto] .rg-mobile-drawer .m-link:hover {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer .m-link.active,
  [data-bs-theme=auto] .rg-mobile-drawer .m-link.active {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer .m-link-ico,
  [data-bs-theme=auto] .rg-mobile-drawer .m-link-ico {
    background: var(--rg-olive);
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .rg-mobile-drawer .m-group-title,
  [data-bs-theme=auto] .rg-mobile-drawer .m-group-title {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Login */
  }
  :root:not([data-bs-theme]) .login-stage,
  [data-bs-theme=auto] .login-stage {
    background: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .login-split,
  [data-bs-theme=auto] .login-split {
    background: var(--rg-paper);
    box-shadow: 0 20px 60px -30px rgba(0, 0, 0, 0.6), 0 4px 8px rgba(0, 0, 0, 0.2);
  }
  :root:not([data-bs-theme]) .login-body,
  [data-bs-theme=auto] .login-body {
    background: var(--rg-paper);
  }
  :root:not([data-bs-theme]) .login-title,
  [data-bs-theme=auto] .login-title {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .login-sub,
  [data-bs-theme=auto] .login-sub {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-label,
  [data-bs-theme=auto] .rg-label {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-input,
  [data-bs-theme=auto] .rg-input {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-input:focus,
  [data-bs-theme=auto] .rg-input:focus {
    background: var(--rg-paper);
    border-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-input::placeholder,
  [data-bs-theme=auto] .rg-input::placeholder {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-btn-primary,
  [data-bs-theme=auto] .rg-btn-primary {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .rg-btn-primary:hover,
  [data-bs-theme=auto] .rg-btn-primary:hover {
    background: #fff;
    color: #000;
  }
  :root:not([data-bs-theme]) .rg-btn-ghost,
  [data-bs-theme=auto] .rg-btn-ghost {
    color: var(--rg-ink);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-btn-ghost:hover,
  [data-bs-theme=auto] .rg-btn-ghost:hover {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Landing */
  }
  :root:not([data-bs-theme]) .land-stage,
  [data-bs-theme=auto] .land-stage {
    background: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .land-hero-h1,
  [data-bs-theme=auto] .land-hero-h1 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-hero-h1 em,
  [data-bs-theme=auto] .land-hero-h1 em {
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .land-lead,
  [data-bs-theme=auto] .land-lead {
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .land-stats,
  [data-bs-theme=auto] .land-stats {
    border-top-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .land-stat .num,
  [data-bs-theme=auto] .land-stat .num {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-stat .lbl,
  [data-bs-theme=auto] .land-stat .lbl {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .land-section-h2,
  [data-bs-theme=auto] .land-section-h2 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-section-more,
  [data-bs-theme=auto] .land-section-more {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .land-section-more:hover,
  [data-bs-theme=auto] .land-section-more:hover {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-eyebrow,
  [data-bs-theme=auto] .rg-eyebrow {
    color: #7a7060;
  }
  :root:not([data-bs-theme]) .degu-mini,
  [data-bs-theme=auto] .degu-mini {
    background: var(--rg-paper);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .degu-mini:hover,
  [data-bs-theme=auto] .degu-mini:hover {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .degu-mini-name,
  [data-bs-theme=auto] .degu-mini-name {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .degu-mini-rc,
  [data-bs-theme=auto] .degu-mini-rc {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .degu-mini-breeder,
  [data-bs-theme=auto] .degu-mini-breeder {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .degu-mini-breeder strong,
  [data-bs-theme=auto] .degu-mini-breeder strong {
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .degu-mini-photo-tag,
  [data-bs-theme=auto] .degu-mini-photo-tag {
    background: var(--rg-paper);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .breeder-card-new,
  [data-bs-theme=auto] .breeder-card-new {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .breeder-card-new a.breeder-link,
  [data-bs-theme=auto] .breeder-card-new a.breeder-link {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .breeder-stat,
  [data-bs-theme=auto] .breeder-stat {
    background: var(--rg-cream);
    color: var(--rg-ink);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .breeder-logo,
  [data-bs-theme=auto] .breeder-logo {
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .land-tile,
  [data-bs-theme=auto] .land-tile {
    background: var(--rg-paper);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-tile:hover,
  [data-bs-theme=auto] .land-tile:hover {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-tile .tile-ico,
  [data-bs-theme=auto] .land-tile .tile-ico {
    background: var(--rg-olive);
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .land-tile .tile-title,
  [data-bs-theme=auto] .land-tile .tile-title {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-tile .tile-sub,
  [data-bs-theme=auto] .land-tile .tile-sub {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .land-feature-card,
  [data-bs-theme=auto] .land-feature-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .land-feature-card .feat-ico,
  [data-bs-theme=auto] .land-feature-card .feat-ico {
    background: var(--rg-olive);
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .land-feature-card .feat-title,
  [data-bs-theme=auto] .land-feature-card .feat-title {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-feature-card .feat-body,
  [data-bs-theme=auto] .land-feature-card .feat-body {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .land-dashboard-h1,
  [data-bs-theme=auto] .land-dashboard-h1 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .land-dashboard-h1 em,
  [data-bs-theme=auto] .land-dashboard-h1 em {
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]) .land-photo,
  [data-bs-theme=auto] .land-photo {
    border-color: var(--rg-paper);
  }
  :root:not([data-bs-theme]) .land-sticker,
  [data-bs-theme=auto] .land-sticker {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Breadcrumb */
  }
  :root:not([data-bs-theme]) .rg-breadcrumb a,
  [data-bs-theme=auto] .rg-breadcrumb a {
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .rg-breadcrumb .sep,
  [data-bs-theme=auto] .rg-breadcrumb .sep {
    color: var(--rg-line-strong);
  }
  :root:not([data-bs-theme]) .rg-breadcrumb span:not(.sep),
  [data-bs-theme=auto] .rg-breadcrumb span:not(.sep) {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Hero & detail */
  }
  :root:not([data-bs-theme]) .rg-hero,
  [data-bs-theme=auto] .rg-hero {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-hero-rc,
  [data-bs-theme=auto] .rg-hero-rc {
    background: var(--rg-olive);
    border-color: var(--rg-line);
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-hero-title,
  [data-bs-theme=auto] .rg-hero-title {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-hero-parent a,
  [data-bs-theme=auto] .rg-hero-parent a {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Tabs */
  }
  :root:not([data-bs-theme]) .rg-tab,
  [data-bs-theme=auto] .rg-tab {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-tab:hover,
  [data-bs-theme=auto] .rg-tab:hover {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-tab.active,
  [data-bs-theme=auto] .rg-tab.active {
    color: var(--rg-ink);
    border-bottom-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-tab .count,
  [data-bs-theme=auto] .rg-tab .count {
    background: var(--rg-olive);
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-tab.active .count,
  [data-bs-theme=auto] .rg-tab.active .count {
    background: var(--rg-ink);
    color: var(--rg-paper);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Content */
  }
  :root:not([data-bs-theme]) .rg-card,
  [data-bs-theme=auto] .rg-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-section-head h3,
  [data-bs-theme=auto] .rg-section-head h3 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-dl dt,
  [data-bs-theme=auto] .rg-dl dt {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .rg-dl dd,
  [data-bs-theme=auto] .rg-dl dd {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-notes,
  [data-bs-theme=auto] .rg-notes {
    background: var(--rg-cream);
    border-left-color: var(--rg-accent);
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .coi-meter .bar,
  [data-bs-theme=auto] .coi-meter .bar {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .litter-chip,
  [data-bs-theme=auto] .litter-chip {
    background: var(--rg-olive);
    color: var(--rg-ink);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-mini-degu,
  [data-bs-theme=auto] .rg-mini-degu {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-mini-degu:hover,
  [data-bs-theme=auto] .rg-mini-degu:hover {
    background: var(--rg-paper);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Litter cards */
  }
  :root:not([data-bs-theme]) .litter-card,
  [data-bs-theme=auto] .litter-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .litter-letter,
  [data-bs-theme=auto] .litter-letter {
    background: var(--rg-ink);
    color: var(--rg-paper);
  }
  :root:not([data-bs-theme]) .litter-nav-chip,
  [data-bs-theme=auto] .litter-nav-chip {
    background: var(--rg-paper);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Contact */
  }
  :root:not([data-bs-theme]) .contact-card,
  [data-bs-theme=auto] .contact-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .contact-card:hover,
  [data-bs-theme=auto] .contact-card:hover {
    background: var(--rg-cream);
  }
  :root:not([data-bs-theme]) .contact-card .ic-tile,
  [data-bs-theme=auto] .contact-card .ic-tile {
    background: var(--rg-olive);
    color: var(--rg-accent);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Tree nodes */
  }
  :root:not([data-bs-theme]) .tree-node,
  [data-bs-theme=auto] .tree-node {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .tree-wrap,
  [data-bs-theme=auto] .tree-wrap {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Filter rail */
  }
  :root:not([data-bs-theme]) .list-page,
  [data-bs-theme=auto] .list-page {
    background: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .filter-rail,
  [data-bs-theme=auto] .filter-rail {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .filter-rail-head .ttl,
  [data-bs-theme=auto] .filter-rail-head .ttl {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .filter-group,
  [data-bs-theme=auto] .filter-group {
    border-top-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .facet-row:hover,
  [data-bs-theme=auto] .facet-row:hover {
    background: var(--rg-cream);
  }
  :root:not([data-bs-theme]) .facet-row .lbl,
  [data-bs-theme=auto] .facet-row .lbl {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .dual-range .dual-range-track,
  [data-bs-theme=auto] .dual-range .dual-range-track {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .dual-range .fill,
  [data-bs-theme=auto] .dual-range .fill {
    background: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .dual-range input[type=range]::-webkit-slider-thumb,
  [data-bs-theme=auto] .dual-range input[type=range]::-webkit-slider-thumb {
    background: var(--rg-paper);
    border-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .dual-range input[type=range]::-moz-range-thumb,
  [data-bs-theme=auto] .dual-range input[type=range]::-moz-range-thumb {
    background: var(--rg-paper);
    border-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .list-toolbar,
  [data-bs-theme=auto] .list-toolbar {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .list-toolbar .search-box input,
  [data-bs-theme=auto] .list-toolbar .search-box input {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .sort-dropdown,
  [data-bs-theme=auto] .sort-dropdown {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .view-toggle,
  [data-bs-theme=auto] .view-toggle {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .rg-pagination a, :root:not([data-bs-theme]) .rg-pagination span,
  [data-bs-theme=auto] .rg-pagination a,
  [data-bs-theme=auto] .rg-pagination span {
    background: var(--rg-paper);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .rg-pagination a.active,
  [data-bs-theme=auto] .rg-pagination a.active {
    background: var(--rg-ink);
    color: var(--rg-paper);
  }
  :root:not([data-bs-theme]) .seznam-table,
  [data-bs-theme=auto] .seznam-table {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .seznam-table thead th,
  [data-bs-theme=auto] .seznam-table thead th {
    background: var(--rg-cream);
    border-bottom-color: var(--rg-line);
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .seznam-table tbody td,
  [data-bs-theme=auto] .seznam-table tbody td {
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .seznam-table tbody tr:hover,
  [data-bs-theme=auto] .seznam-table tbody tr:hover {
    background: var(--rg-cream);
  }
  :root:not([data-bs-theme]) .seznam-table td.actions-cell a,
  [data-bs-theme=auto] .seznam-table td.actions-cell a {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .list-empty,
  [data-bs-theme=auto] .list-empty {
    background: var(--rg-paper);
    border-color: var(--rg-line-strong);
  }
  :root:not([data-bs-theme]) .page-head h1,
  [data-bs-theme=auto] .page-head h1 {
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Forms */
  }
  :root:not([data-bs-theme]) .fcard,
  [data-bs-theme=auto] .fcard {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .fcard-head,
  [data-bs-theme=auto] .fcard-head {
    border-bottom-color: var(--rg-line-strong);
  }
  :root:not([data-bs-theme]) .field input, :root:not([data-bs-theme]) .field select, :root:not([data-bs-theme]) .field textarea,
  [data-bs-theme=auto] .field input,
  [data-bs-theme=auto] .field select,
  [data-bs-theme=auto] .field textarea {
    background: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .field input:focus, :root:not([data-bs-theme]) .field select:focus, :root:not([data-bs-theme]) .field textarea:focus,
  [data-bs-theme=auto] .field input:focus,
  [data-bs-theme=auto] .field select:focus,
  [data-bs-theme=auto] .field textarea:focus {
    background: var(--rg-paper);
    border-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .color-pick-opt, :root:not([data-bs-theme]) .status-opt,
  [data-bs-theme=auto] .color-pick-opt,
  [data-bs-theme=auto] .status-opt {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .gene-chip,
  [data-bs-theme=auto] .gene-chip {
    background: var(--rg-cream);
    border-color: var(--rg-line-strong);
    color: var(--rg-ink-soft);
  }
  :root:not([data-bs-theme]) .sex-toggle,
  [data-bs-theme=auto] .sex-toggle {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .save-bar,
  [data-bs-theme=auto] .save-bar {
    background: var(--rg-paper);
    border-top-color: var(--rg-line);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Kalkulačka */
  }
  :root:not([data-bs-theme]) .parent-card,
  [data-bs-theme=auto] .parent-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .parent-card .pc-head,
  [data-bs-theme=auto] .parent-card .pc-head {
    background: linear-gradient(180deg, var(--rg-cream), transparent);
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .mode-tabs,
  [data-bs-theme=auto] .mode-tabs {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .mode-tabs button.active,
  [data-bs-theme=auto] .mode-tabs button.active {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .locus-row,
  [data-bs-theme=auto] .locus-row {
    border-top-color: var(--rg-line-strong);
  }
  :root:not([data-bs-theme]) .allele-picker,
  [data-bs-theme=auto] .allele-picker {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .allele-picker button.active,
  [data-bs-theme=auto] .allele-picker button.active {
    background: var(--rg-ink);
    color: var(--rg-bg);
  }
  :root:not([data-bs-theme]) .allele-picker button:hover,
  [data-bs-theme=auto] .allele-picker button:hover {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .genotype-summary,
  [data-bs-theme=auto] .genotype-summary {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .results-card,
  [data-bs-theme=auto] .results-card {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .results-cap,
  [data-bs-theme=auto] .results-cap {
    background: linear-gradient(180deg, var(--rg-cream), transparent);
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .pheno-tile,
  [data-bs-theme=auto] .pheno-tile {
    border-color: rgba(255, 255, 255, 0.1);
  }
  :root:not([data-bs-theme]) .calc-chip,
  [data-bs-theme=auto] .calc-chip {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .calc-stack,
  [data-bs-theme=auto] .calc-stack {
    background: var(--rg-olive);
  }
  :root:not([data-bs-theme]) .geno-table th,
  [data-bs-theme=auto] .geno-table th {
    background: var(--rg-cream);
  }
  :root:not([data-bs-theme]) .geno-table th, :root:not([data-bs-theme]) .geno-table td,
  [data-bs-theme=auto] .geno-table th,
  [data-bs-theme=auto] .geno-table td {
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .calc-autocomplete,
  [data-bs-theme=auto] .calc-autocomplete {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .calc-autocomplete:focus-within,
  [data-bs-theme=auto] .calc-autocomplete:focus-within {
    background: var(--rg-paper);
    border-color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .calc-dropdown,
  [data-bs-theme=auto] .calc-dropdown {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .calc-dropdown button:hover,
  [data-bs-theme=auto] .calc-dropdown button:hover {
    background: var(--rg-cream);
  }
  :root:not([data-bs-theme]) .preset-select-wrap select,
  [data-bs-theme=auto] .preset-select-wrap select {
    background-color: var(--rg-cream);
    border-color: var(--rg-line);
    color: var(--rg-ink);
  }
  :root:not([data-bs-theme]) .preset-select-wrap select:focus,
  [data-bs-theme=auto] .preset-select-wrap select:focus {
    background-color: var(--rg-paper);
  }
  :root:not([data-bs-theme]),
  [data-bs-theme=auto] {
    /* Porovnání */
  }
  :root:not([data-bs-theme]) .compare-pickers,
  [data-bs-theme=auto] .compare-pickers {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .compare-result-head,
  [data-bs-theme=auto] .compare-result-head {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .compare-pedigree,
  [data-bs-theme=auto] .compare-pedigree {
    background: var(--rg-paper);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .compare-pedigree .ped-head,
  [data-bs-theme=auto] .compare-pedigree .ped-head {
    background: linear-gradient(180deg, var(--rg-cream), transparent);
    border-bottom-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .merged-tree .node,
  [data-bs-theme=auto] .merged-tree .node {
    background: var(--rg-cream);
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .merged-tree .node.male,
  [data-bs-theme=auto] .merged-tree .node.male {
    background: var(--rg-male-bg);
  }
  :root:not([data-bs-theme]) .merged-tree .node.female,
  [data-bs-theme=auto] .merged-tree .node.female {
    background: var(--rg-female-bg);
  }
  :root:not([data-bs-theme]) .compare-ancestry-warning,
  [data-bs-theme=auto] .compare-ancestry-warning {
    background: var(--rg-warn-bg);
    color: var(--rg-warn);
  }
  :root:not([data-bs-theme]) .compare-empty,
  [data-bs-theme=auto] .compare-empty {
    background: var(--rg-paper);
    border-color: var(--rg-line-strong);
  }
}
[data-bs-theme=dark] .ck.ck-editor__main .ck-editor__editable,
[data-bs-theme=dark] .ck.ck-editor__editable:not(.ck-editor__nested-editable) {
  background: #1e1c18;
  color: #e8e4d8;
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .ck.ck-toolbar {
  background: #2a2720;
  border-color: var(--rg-line);
  color: #e8e4d8;
}
[data-bs-theme=dark] .ck.ck-toolbar .ck-toolbar__items .ck-button {
  color: #c8c4b4;
}
[data-bs-theme=dark] .ck.ck-toolbar .ck-toolbar__items .ck-button:hover,
[data-bs-theme=dark] .ck.ck-toolbar .ck-toolbar__items .ck-button.ck-on {
  background: #3a3730;
  color: #e8e4d8;
}
[data-bs-theme=dark] .ck.ck-dropdown__panel,
[data-bs-theme=dark] .ck.ck-list {
  background: #2a2720;
  border-color: var(--rg-line);
}
[data-bs-theme=dark] .ck.ck-list__item .ck-button {
  color: #c8c4b4;
}
[data-bs-theme=dark] .ck.ck-list__item .ck-button:hover {
  background: #3a3730;
  color: #e8e4d8;
}
[data-bs-theme=dark] .ck.ck-editor__editable .ck-placeholder::before {
  color: var(--rg-mute);
}
[data-bs-theme=dark] .ck-focused .ck.ck-editor__editable,
[data-bs-theme=dark] .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
  border-color: var(--rg-accent) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--rg-accent) 25%, transparent) !important;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-bs-theme]) .ck.ck-editor__main .ck-editor__editable,
  :root:not([data-bs-theme]) .ck.ck-editor__editable:not(.ck-editor__nested-editable),
  [data-bs-theme=auto] .ck.ck-editor__main .ck-editor__editable,
  [data-bs-theme=auto] .ck.ck-editor__editable:not(.ck-editor__nested-editable) {
    background: #1e1c18;
    color: #e8e4d8;
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .ck.ck-toolbar,
  [data-bs-theme=auto] .ck.ck-toolbar {
    background: #2a2720;
    border-color: var(--rg-line);
    color: #e8e4d8;
  }
  :root:not([data-bs-theme]) .ck.ck-toolbar .ck-toolbar__items .ck-button,
  [data-bs-theme=auto] .ck.ck-toolbar .ck-toolbar__items .ck-button {
    color: #c8c4b4;
  }
  :root:not([data-bs-theme]) .ck.ck-toolbar .ck-toolbar__items .ck-button:hover,
  :root:not([data-bs-theme]) .ck.ck-toolbar .ck-toolbar__items .ck-button.ck-on,
  [data-bs-theme=auto] .ck.ck-toolbar .ck-toolbar__items .ck-button:hover,
  [data-bs-theme=auto] .ck.ck-toolbar .ck-toolbar__items .ck-button.ck-on {
    background: #3a3730;
    color: #e8e4d8;
  }
  :root:not([data-bs-theme]) .ck.ck-dropdown__panel,
  :root:not([data-bs-theme]) .ck.ck-list,
  [data-bs-theme=auto] .ck.ck-dropdown__panel,
  [data-bs-theme=auto] .ck.ck-list {
    background: #2a2720;
    border-color: var(--rg-line);
  }
  :root:not([data-bs-theme]) .ck.ck-list__item .ck-button,
  [data-bs-theme=auto] .ck.ck-list__item .ck-button {
    color: #c8c4b4;
  }
  :root:not([data-bs-theme]) .ck.ck-list__item .ck-button:hover,
  [data-bs-theme=auto] .ck.ck-list__item .ck-button:hover {
    background: #3a3730;
    color: #e8e4d8;
  }
  :root:not([data-bs-theme]) .ck.ck-editor__editable .ck-placeholder::before,
  [data-bs-theme=auto] .ck.ck-editor__editable .ck-placeholder::before {
    color: var(--rg-mute);
  }
  :root:not([data-bs-theme]) .ck-focused .ck.ck-editor__editable,
  :root:not([data-bs-theme]) .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable),
  [data-bs-theme=auto] .ck-focused .ck.ck-editor__editable,
  [data-bs-theme=auto] .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable) {
    border-color: var(--rg-accent) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--rg-accent) 25%, transparent) !important;
  }
}
/* ════════════════════════════════════════════════════════
   HEALTH RECORDS REDESIGN — weight section + Variant B
   ════════════════════════════════════════════════════════ */
.health-page {
  background: var(--rg-bg);
  min-height: 100%;
  padding-bottom: 60px;
}

.health-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .health-shell {
    padding: 16px 16px 30px;
  }
}

/* ── Weight section ── */
.weight-section {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 22px 24px;
  margin-bottom: 18px;
}

.weight-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.ws-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 4px 0 12px;
}

.ws-stats {
  display: flex;
  gap: 28px;
}

.ws-stat .lbl {
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 4px;
}

.ws-stat .val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.ws-stat .val small {
  font-size: 0.7rem;
  font-weight: 500;
  color: var(--rg-mute);
  margin-left: 3px;
}

.ws-stat .delta {
  font-size: 0.78rem;
  font-weight: 600;
  margin-top: 5px;
  color: var(--rg-mute);
}

.ws-stat .delta.up {
  color: var(--rg-success);
}

.ws-stat .delta.down {
  color: var(--rg-danger);
}

.ws-stat .delta.flat {
  color: var(--rg-mute);
}

.ws-stat .delta.ink {
  color: var(--rg-ink);
}

.ws-stat.highlight-pregnancy {
  border-left: 3px solid var(--rg-danger);
  padding-left: 12px;
}
.ws-stat.highlight-pregnancy .lbl {
  color: var(--rg-danger);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
}

.growth-section {
  margin-top: 24px;
  border-top: 1px dashed var(--rg-line);
  padding-top: 20px;
}
.growth-section h4 {
  font-size: 0.88rem;
  color: var(--rg-ink);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.growth-chart-container {
  height: 220px;
}

.growth-chart-sub {
  font-size: 0.78rem;
  color: var(--rg-mute);
  margin-top: 8px;
}

.weight-chart-wrap {
  background: var(--rg-cream);
  border-radius: 14px;
  padding: 12px 8px 4px;
}

.weight-chart-wrap .chart-container {
  height: 200px !important;
  background: transparent;
}

.weight-chart-filter {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 4px 6px 8px;
  margin-bottom: 4px;
}

.wcf-presets {
  display: flex;
  gap: 4px;
}

.wcf-nav {
  display: flex;
  gap: 4px;
}

.wcf-preset {
  font-size: 0.72rem;
  padding: 3px 9px;
  border-radius: 20px;
  background: transparent;
  border: 1px solid var(--rg-line-strong);
  color: var(--rg-mute);
  cursor: pointer;
  transition: all 0.15s;
}
.wcf-preset:hover {
  border-color: var(--rg-accent);
  color: var(--rg-accent);
}

.wcf-preset-active {
  background: var(--rg-accent);
  border-color: var(--rg-accent);
  color: #fff !important;
}

.wcf-custom {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
}

.wcf-sep {
  color: var(--rg-mute);
  font-size: 0.85rem;
}

.wcf-date {
  font-size: 0.75rem;
  padding: 3px 7px;
  border-radius: 8px;
  border: 1px solid var(--rg-line-strong);
  background: var(--rg-paper);
  color: var(--rg-text);
  width: 120px;
}
.wcf-date:focus {
  outline: none;
  border-color: var(--rg-accent);
}

/* ── Health card shell ── */
.health-card-b {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 22px 24px 26px;
}

.health-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.health-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 4px 0 0;
}

/* ── Filter bar ── */
.health-filter-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--rg-line-strong);
}

.hf-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}

.hf-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px 5px 9px;
  border-radius: 999px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  color: var(--rg-ink-soft);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.hf-chip svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.hf-chip:hover {
  background: var(--rg-paper);
  color: var(--rg-ink);
}

.hf-chip .cnt {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  background: rgba(0, 0, 0, 0.06);
  color: inherit;
  padding: 1px 6px;
  border-radius: 999px;
  font-weight: 700;
  opacity: 0.7;
}

.hf-chip.active .cnt {
  background: rgba(255, 255, 255, 0.25);
  opacity: 0.9;
}

.hf-chip-all.active {
  background: var(--rg-ink) !important;
  color: var(--rg-paper) !important;
  border-color: var(--rg-ink) !important;
}

.hf-chip-all.active .cnt {
  background: rgba(255, 255, 255, 0.22);
}

.hf-period-wrap {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
}

.hf-year-nav {
  display: none;
  align-items: center;
  gap: 4px;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
}

.hf-year-current {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--rg-ink);
  padding: 0 4px;
  min-width: 36px;
  text-align: center;
  display: inline-block;
}

.hf-period {
  display: inline-flex;
  gap: 0;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
}

.hf-period-btn {
  border: none;
  background: transparent;
  padding: 5px 11px;
  border-radius: 7px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--rg-mute);
  cursor: pointer;
}

.hf-period-btn.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* ── Group headers for timeline ── */
.hz-group-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  margin: 16px 0 8px 0;
  font-weight: 700;
  color: var(--rg-ink);
  border-radius: 8px;
  user-select: none;
}

.year-group-header {
  background: var(--rg-olive);
  border: 1px solid var(--rg-line);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.year-group-header:hover {
  background: var(--rg-line-strong);
}

.month-group-header {
  background: transparent;
  border-bottom: 2px solid var(--rg-olive);
  padding-left: 0;
  margin-top: 24px;
}

.hz-group-title {
  font-size: 0.95rem;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.hz-group-badge {
  background: var(--rg-paper);
  color: var(--rg-mute);
  font-size: 0.72rem;
  padding: 2px 6px;
  border-radius: 12px;
  font-weight: 600;
  border: 1px solid var(--rg-line);
}

.hz-group-arrow {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: var(--rg-paper);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.15s, background 0.15s, color 0.15s;
  margin-left: auto;
}
.hz-group-arrow svg {
  width: 14px;
  height: 14px;
}

.year-group-header.is-open .hz-group-arrow {
  transform: rotate(180deg);
  background: var(--rg-ink);
  color: var(--rg-paper);
}

/* ── Variant B cards ── */
.herb-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.herb-card {
  border: 1px solid var(--rg-line);
  border-left: 4px solid var(--herb-c, var(--rg-accent));
  border-radius: 14px;
  background: var(--rg-paper);
  overflow: hidden;
  transition: box-shadow 0.12s;
}

.herb-card:hover {
  box-shadow: var(--rg-shadow-sm);
}

.herb-card.is-open {
  box-shadow: 0 6px 18px -10px rgba(0, 0, 0, 0.18), 0 0 0 1px var(--rg-line);
}

.herb-card.herb-card-pregnancy {
  border-color: var(--rg-line);
  border-left-color: var(--rg-female, #a8205f);
  background: var(--rg-female-bg);
}

.herb-card.herb-card-superseded {
  opacity: 0.5;
  border-left-style: dashed;
}

.herb-card.herb-card-superseded:hover {
  opacity: 0.75;
}

.herb-superseded-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.64rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 6px;
  padding: 2px 7px;
  margin-left: 6px;
  vertical-align: middle;
}

.herb-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  width: 100%;
  border: none;
  background: transparent;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}

.herb-head-static {
  cursor: default;
  pointer-events: none;
}

.herb-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--herb-bg, var(--rg-olive));
  color: var(--herb-c, var(--rg-accent));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.herb-icon svg {
  width: 18px;
  height: 18px;
}

.herb-info {
  flex: 1;
  min-width: 0;
}

.herb-row1 {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}

.herb-type {
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--herb-c, var(--rg-accent));
}

.herb-date {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.herb-duration {
  font-family: ui-monospace, monospace;
  font-size: 0.74rem;
  color: var(--rg-mute);
}

.herb-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--rg-ink);
  line-height: 1.2;
}

.herb-value {
  font-family: ui-monospace, monospace;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--herb-c, var(--rg-accent));
}

.herb-delta {
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  margin-left: 6px;
  font-variant-numeric: tabular-nums;
}

.herb-delta.up {
  color: var(--rg-success);
}

.herb-delta.down {
  color: var(--rg-danger);
}

.herb-delta.flat {
  color: var(--rg-mute);
}

.herb-sub {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 6px;
  font-size: 0.82rem;
  color: var(--rg-mute);
}
.herb-sub span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.herb-sub svg {
  width: 12px;
  height: 12px;
}

.herb-chev {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: var(--rg-cream);
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.herb-chev svg {
  width: 14px;
  height: 14px;
}

.herb-card.is-open .herb-chev {
  transform: rotate(180deg);
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.herb-detail {
  padding: 4px 16px 16px;
  border-top: 1px dashed var(--rg-line);
}

.herb-field {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 4px 14px;
  align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px dashed var(--rg-line);
}

.herb-field:last-of-type {
  border-bottom: none;
}

.herb-lbl {
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

.herb-val {
  font-size: 0.92rem;
  color: var(--rg-ink-soft);
  line-height: 1.5;
}

.herb-val a {
  color: var(--rg-ink);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed var(--rg-mute);
}

.herb-val a:hover {
  border-bottom-color: var(--rg-ink);
}

.herb-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 12px;
  margin-top: 4px;
  border-top: 1px solid var(--rg-line);
}

.herb-by {
  color: var(--rg-mute);
  font-size: 0.82rem;
}

.herb-by strong {
  color: var(--rg-ink);
}

.herb-foot-actions {
  margin-left: auto;
  display: flex;
  gap: 6px;
}

/* ── Add modal (hadd) ── */
.hadd-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 12, 8, 0.55);
  backdrop-filter: blur(3px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 60px 24px 24px;
  z-index: 1055;
  animation: hadd-bd-in 0.18s ease-out;
}

@keyframes hadd-bd-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.hadd-modal-backdrop.d-none {
  display: none !important;
}

.hadd {
  width: 100%;
  max-width: 760px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 18px;
  padding: 24px 26px 18px;
  box-shadow: 0 24px 60px -12px rgba(0, 0, 0, 0.4), 0 8px 20px rgba(0, 0, 0, 0.15);
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  animation: hadd-in 0.22s cubic-bezier(0.2, 0.7, 0.3, 1);
}

@keyframes hadd-in {
  from {
    opacity: 0;
    transform: translateY(-12px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.hadd-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.hadd-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 4px 0 0;
}

.hadd-close {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-mute);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hadd-close svg {
  width: 16px;
  height: 16px;
}

.hadd-close:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.hadd-type-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 6px;
  margin-bottom: 18px;
}

.hadd-type-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 6px;
  background: var(--rg-paper);
  border: 1.5px solid var(--rg-line);
  border-radius: 12px;
  cursor: pointer;
  font: inherit;
  color: var(--rg-ink-soft);
  transition: transform 0.12s, border-color 0.12s;
}

.hadd-type-tile:hover {
  transform: translateY(-1px);
}

.hadd-type-tile.active {
  font-weight: 700;
}

.hadd-tile-ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hadd-tile-ico svg {
  width: 18px;
  height: 18px;
}

.hadd-tile-lbl {
  font-size: 0.78rem;
  text-align: center;
  line-height: 1.1;
}

.hadd-fields {
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--rg-cream);
  border-radius: 14px;
  padding: 18px 20px;
}

.hadd-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.hadd-field textarea.rg-input,
.hadd-field textarea.form-control {
  resize: vertical;
  min-height: 64px;
}

.hadd-row {
  display: grid;
  gap: 14px;
  grid-template-columns: 200px 1fr;
}

.hadd-row.cols-2 {
  grid-template-columns: 1fr 1fr;
}

.hadd-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

.hadd-submit {
  transition: background 0.15s, border-color 0.15s;
}

/* ── Standalone léky sekce ── */
.standalone-leky-card {
  overflow: hidden;
}

.standalone-leky-list {
  padding: 0 22px 12px;
}

.standalone-leky-row {
  display: grid;
  grid-template-columns: 100px 1fr 100px auto;
  gap: 12px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--rg-line);
  font-size: 0.85rem;
}
.standalone-leky-row:last-child {
  border-bottom: 0;
}

.sl-date {
  color: var(--rg-mute);
  white-space: nowrap;
}

.sl-note {
  color: var(--rg-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sl-amount {
  font-weight: 700;
  color: #9a1f2a;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.sl-link {
  color: var(--rg-mute);
  text-decoration: none;
  font-size: 0.78rem;
  white-space: nowrap;
}
.sl-link:hover {
  color: var(--rg-ink);
}

/* ── Mobile overrides ── */
@media (max-width: 720px) {
  .weight-section {
    padding: 16px 14px;
    border-radius: 14px;
  }
  .weight-section-head {
    flex-direction: column;
    align-items: stretch;
  }
  .ws-stats {
    gap: 14px;
    flex-wrap: wrap;
  }
  .ws-stat .val {
    font-size: 1.2rem;
  }
  .health-card-b {
    padding: 16px 14px 18px;
    border-radius: 14px;
  }
  .health-filter-bar {
    gap: 8px;
  }
  .hf-period {
    margin-left: 0;
    width: 100%;
    justify-content: space-between;
  }
  .hf-period-btn {
    flex: 1;
  }
  .herb-head {
    padding: 12px 14px;
    gap: 10px;
  }
  .herb-icon {
    width: 36px;
    height: 36px;
  }
  .herb-title {
    font-size: 0.98rem;
  }
  .herb-field {
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .herb-foot {
    flex-wrap: wrap;
  }
  .herb-foot-actions {
    width: 100%;
  }
  .hadd-modal-backdrop {
    padding: 0;
    align-items: stretch;
  }
  .hadd {
    max-width: none;
    border-radius: 18px 18px 0 0;
    margin-top: 40px;
    padding: 16px;
    max-height: calc(100% - 40px);
  }
  .hadd::before {
    content: "";
    display: block;
    width: 40px;
    height: 4px;
    border-radius: 999px;
    background: var(--rg-line-strong);
    margin: -4px auto 14px;
  }
  .hadd-type-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .hadd-row, .hadd-row.cols-2 {
    grid-template-columns: 1fr;
  }
  .hadd-footer {
    flex-wrap: wrap;
  }
  .hadd-footer .rg-btn {
    flex: 1;
    justify-content: center;
  }
}
.hover-underline:hover {
  text-decoration: underline !important;
}

/* ── Dark mode ── */
[data-bs-theme=dark] .hf-chip .cnt {
  background: rgba(255, 255, 255, 0.08);
}
[data-bs-theme=dark] .hadd-type-tile {
  background: var(--rg-cream);
}

/* ════════════════════════════════════════════════════════
   VARIANT A — Refined Modal
   ════════════════════════════════════════════════════════ */
/* Type color tokens */
.hz-color-vet_visit {
  --hz-c: #15663a;
  --hz-bg: var(--rg-success-bg);
}

.hz-color-nemoc {
  --hz-c: #9a1f2a;
  --hz-bg: var(--rg-danger-bg);
}

.hz-color-chirurgie {
  --hz-c: #8a5a00;
  --hz-bg: var(--rg-warn-bg);
}

.hz-color-pareni {
  --hz-c: #a8205f;
  --hz-bg: var(--rg-female-bg);
}

.hz-color-premisteni {
  --hz-c: #6c6354;
  --hz-bg: var(--rg-olive);
}

.hz-color-udalost {
  --hz-c: #0a4ea8;
  --hz-bg: var(--rg-male-bg);
}

.hz-color-vaha {
  --hz-c: #7a5200;
  --hz-bg: var(--rg-cream);
}

.hz-color-vydaj {
  --hz-c: #9a1f2a;
  --hz-bg: var(--rg-danger-bg);
}

.hz-color-prijem {
  --hz-c: #15663a;
  --hz-bg: var(--rg-success-bg);
}

/* Shared field atoms */
.hz-input {
  font-family: inherit;
  font-size: 0.95rem;
  background: var(--rg-paper);
  border: 1.5px solid var(--rg-line-strong);
  border-radius: 10px;
  padding: 10px 12px;
  color: var(--rg-ink);
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.hz-input:focus, .hz-input:focus-visible {
  outline: none;
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.06);
}
.hz-input::placeholder {
  color: var(--rg-mute);
  opacity: 0.7;
}

.hz-input.is-big {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  padding: 14px 16px;
}

.hz-label {
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 6px;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.hz-label .opt {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  font-size: 0.78rem;
  opacity: 0.7;
}

.hz-field {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.hz-row {
  display: grid;
  gap: 12px;
}

.med-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 8px;
}

.med-row {
  display: grid;
  grid-template-columns: 1fr 100px auto;
  gap: 6px;
  align-items: center;
}

.med-remove {
  padding: 4px 8px;
  font-size: 1rem;
  line-height: 1;
  color: var(--rg-mute);
}
.med-remove:hover {
  color: var(--rg-danger);
}

.med-add {
  font-size: 0.85rem;
  padding: 4px 10px;
}

.hz-row.cols-2 {
  grid-template-columns: 1fr 1fr;
}

/* Backdrop updated for 2-col modal */
.hadd-modal-backdrop.va {
  align-items: center;
  padding: 24px;
  overflow-y: auto;
}

/* Modal shell */
.va-modal {
  max-width: 880px;
  width: 100%;
  height: calc(100vh - 48px);
  max-height: 900px;
  background: var(--rg-paper);
  border-radius: 22px;
  border: 1px solid var(--rg-line-strong);
  box-shadow: 0 32px 80px -16px rgba(0, 0, 0, 0.45);
  overflow: hidden;
  display: grid;
  grid-template-columns: 260px 1fr;
  grid-template-rows: minmax(0, 1fr);
  animation: hadd-in 0.22s cubic-bezier(0.2, 0.7, 0.3, 1);
}

/* Left aside — type list */
.va-modal-aside {
  background: var(--rg-cream);
  padding: 22px 18px 18px;
  border-right: 1px solid var(--rg-line);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.va-modal-aside .eyebrow {
  font-size: 0.66rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 6px;
  display: block;
}
.va-modal-aside h2 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0 0 18px;
  line-height: 1.15;
}

.va-type-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 14px;
}

.va-type-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  background: transparent;
  border: 1.5px solid transparent;
  cursor: pointer;
  font: inherit;
  color: var(--rg-ink-soft);
  text-align: left;
  transition: background 0.1s;
}
.va-type-row:hover {
  background: rgba(255, 255, 255, 0.5);
  color: var(--rg-ink);
}
.va-type-row.active {
  background: var(--rg-paper);
  border-color: var(--hz-c);
  color: var(--hz-c);
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}
.va-type-row.active .ico-wrap {
  background: var(--hz-c);
  color: #fff;
}
.va-type-row.active .desc {
  color: inherit;
  opacity: 0.75;
}
.va-type-row .ico-wrap {
  width: 30px;
  height: 30px;
  background: var(--hz-bg);
  color: var(--hz-c);
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.va-type-row .ico-wrap svg {
  width: 14px;
  height: 14px;
}
.va-type-row .lbl-wrap {
  flex: 1;
  min-width: 0;
}
.va-type-row .lbl {
  font-size: 0.9rem;
  line-height: 1.15;
  display: block;
}
.va-type-row .desc {
  font-size: 0.7rem;
  color: var(--rg-mute);
  letter-spacing: 0;
  text-transform: none;
  font-weight: 500;
  margin-top: 1px;
  display: block;
}

.va-aside-foot {
  margin-top: auto;
  font-size: 0.7rem;
  color: var(--rg-mute);
  line-height: 1.4;
  padding-top: 14px;
  border-top: 1px dashed var(--rg-line);
}
.va-aside-foot kbd {
  font-family: ui-monospace, monospace;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 0.7rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
}

/* Right main — form */
.va-main {
  padding: 22px 26px 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.va-main > form {
  display: contents;
}

.va-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px dashed var(--rg-line);
  margin-bottom: 16px;
  flex-shrink: 0;
}
.va-main-head .selected-type {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px 4px 6px;
  border-radius: 999px;
  background: var(--hz-bg);
  color: var(--hz-c);
  font-size: 0.78rem;
  font-weight: 700;
}
.va-main-head .selected-type .dot {
  width: 22px;
  height: 22px;
  background: var(--hz-c);
  color: #fff;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.va-main-head .selected-type .dot svg {
  width: 11px;
  height: 11px;
}

.va-close {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  color: var(--rg-mute);
  cursor: pointer;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.va-close svg {
  width: 15px;
  height: 15px;
}
.va-close:hover {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.va-fields {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 2px 4px 18px 0;
}

.va-quickdate {
  display: flex;
  gap: 6px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.va-quickdate button {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--rg-mute);
  cursor: pointer;
}
.va-quickdate button.is-active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: var(--rg-ink);
}

.va-attach-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.va-attach-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--rg-cream);
  border: 1.5px dashed var(--rg-line-strong);
  border-radius: 12px;
  padding: 12px 14px;
  cursor: pointer;
  color: var(--rg-mute);
  text-align: left;
}
.va-attach-btn:hover {
  border-color: var(--hz-c, var(--rg-accent));
  color: var(--hz-c, var(--rg-accent));
}
.va-attach-btn strong {
  color: var(--rg-ink);
  display: block;
  font-size: 0.9rem;
}
.va-attach-btn .s {
  font-size: 0.75rem;
}

.va-attach-input {
  display: none;
}

.va-attach-existing {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--hz-c, var(--rg-accent));
  padding: 4px 10px;
  background: var(--hz-bg, var(--rg-cream));
  border-radius: 8px;
  text-decoration: none;
}
.va-attach-existing:hover {
  opacity: 0.8;
}

.herb-attachment {
  padding: 8px 12px;
}

.herb-attach-img {
  display: block;
  max-width: 180px;
}
.herb-attach-img img {
  width: 100%;
  border-radius: 8px;
  border: 1px solid var(--rg-line);
  display: block;
}

.herb-attach-file {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rg-accent);
  padding: 4px 10px;
  background: var(--rg-cream);
  border-radius: 8px;
  border: 1px solid var(--rg-line);
  text-decoration: none;
}
.herb-attach-file:hover {
  border-color: var(--rg-accent);
}

.va-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0 18px;
  border-top: 1px solid var(--rg-line);
  flex-shrink: 0;
}
.va-foot .help {
  color: var(--rg-mute);
  font-size: 0.78rem;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.va-foot .help kbd {
  font-family: ui-monospace, monospace;
  font-size: 0.7rem;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  padding: 1px 5px;
  border-radius: 4px;
  color: var(--rg-ink-soft);
  font-weight: 600;
}
.va-foot .va-foot-spacer {
  flex: 1;
}
.va-foot .rg-btn-primary {
  background: var(--hz-c);
  border-color: var(--hz-c);
}

/* Mobile + tablet — VA modal → bottom sheet */
@media (max-width: 900px) {
  .hadd-modal-backdrop.va {
    align-items: flex-end;
    padding: 0;
    overflow-y: hidden;
  }
  .va-modal {
    max-width: none;
    height: auto;
    max-height: 92svh;
    border-radius: 22px 22px 0 0;
    display: flex;
    flex-direction: column;
  }
  .va-modal-aside {
    border-right: none;
    border-bottom: 1px solid var(--rg-line);
    padding: 14px 16px 10px;
    flex-shrink: 0;
  }
  .va-modal-aside h2 {
    display: none;
  }
  .va-modal-aside .va-aside-foot {
    display: none;
  }
  .va-type-list {
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
    margin-bottom: 0;
  }
  .va-type-row {
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 10px;
    flex-shrink: 0;
  }
  .va-type-row .lbl-wrap {
    text-align: center;
  }
  .va-type-row .desc {
    display: none;
  }
  .va-main {
    padding: 16px 16px 0;
    flex: 1;
    min-height: 0;
    overflow: hidden;
  }
  .hz-row.cols-2 {
    grid-template-columns: 1fr;
  }
}
/* Dark mode adjustments */
[data-bs-theme=dark] .va-type-row:hover {
  background: rgba(255, 255, 255, 0.07);
}
[data-bs-theme=dark] .va-type-row.active {
  background: rgba(255, 255, 255, 0.06);
}
[data-bs-theme=dark] .va-aside-foot kbd, [data-bs-theme=dark] .va-foot .help kbd {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(255, 255, 255, 0.2);
}

/* ════════════════════════════════════════════════════════
   QUICK WEIGHT CARD (vw-card)
   ════════════════════════════════════════════════════════ */
.vw-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 20px 22px;
  display: grid;
  grid-template-columns: 1fr 220px;
  gap: 22px;
  align-items: center;
}

.vw-eyebrow {
  font-size: 0.66rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-accent);
  margin-bottom: 3px;
}

.vw-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 14px;
}

.vw-num-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
}

.vw-num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 3.4rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--rg-ink);
  font-variant-numeric: tabular-nums;
  border: none;
  background: transparent;
  width: 170px;
  outline: none;
  padding: 0;
  margin: 0;
  box-shadow: none !important;
  -moz-appearance: textfield;
}
.vw-num::-webkit-outer-spin-button, .vw-num::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.vw-num:focus {
  color: var(--rg-accent);
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
  background: transparent !important;
}

.vw-unit {
  font-size: 1.1rem;
  color: var(--rg-mute);
  font-weight: 500;
  font-family: ui-monospace, monospace;
}

.vw-delta {
  font-family: ui-monospace, monospace;
  font-size: 0.85rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 6px;
}
.vw-delta.is-up {
  color: var(--rg-success);
  background: var(--rg-success-bg);
}
.vw-delta.is-down {
  color: var(--rg-danger);
  background: var(--rg-danger-bg);
}
.vw-delta.is-neutral {
  color: var(--rg-mute);
  background: var(--rg-cream);
}

.vw-actions {
  grid-column: 1/-1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--rg-line);
  margin-top: 4px;
}

.vw-extra-field {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.vw-extra-field label {
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 600;
}

.vw-right {
  background: var(--rg-cream);
  border-radius: 12px;
  padding: 12px 14px;
}
.vw-right .lbl {
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  margin-bottom: 4px;
}
.vw-right .val {
  font-family: ui-monospace, monospace;
  font-size: 0.85rem;
  color: var(--rg-ink);
  margin-bottom: 8px;
}

.vw-spark {
  height: 36px;
  width: 100%;
}

/* ── Health event tooltip on chart ── */
.chart-event-tip {
  position: absolute;
  pointer-events: none;
  z-index: 10;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 8px;
  padding: 8px 11px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  min-width: 120px;
}
.chart-event-tip .cet-type {
  font-weight: 700;
  font-size: 0.82rem;
  margin-bottom: 2px;
}
.chart-event-tip .cet-date {
  color: var(--rg-mute);
  font-size: 0.76rem;
}
.chart-event-tip .cet-label {
  margin-top: 4px;
  font-size: 0.82rem;
  color: var(--rg-ink);
}
.chart-event-tip .cet-extra {
  font-size: 0.76rem;
  color: var(--rg-mute);
  margin-top: 2px;
}

@media (max-width: 720px) {
  .vw-card {
    grid-template-columns: 1fr;
  }
  .vw-right {
    order: -1;
    padding: 10px 12px;
  }
  .vw-num {
    font-size: 2.6rem;
    width: 200px;
  }
  .vw-actions {
    flex-wrap: wrap;
  }
  .vw-actions .rg-btn {
    flex: 1;
    justify-content: center;
  }
}
.herb-card.herb-danger {
  --herb-c: #9a1f2a;
  --herb-bg: var(--rg-danger-bg);
}

.herb-duration {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 6px;
  border: 1px solid transparent;
}
.herb-duration.cost-danger {
  background: var(--rg-danger-bg, #fef2f2);
  color: #9a1f2a;
  border-color: rgba(154, 31, 42, 0.2);
}
.herb-duration.cost-success {
  background: var(--rg-success-bg);
  color: #15663a;
  border-color: rgba(21, 102, 58, 0.2);
}

.herb-field.pregnancy {
  background: var(--rg-female-bg);
  border-radius: 8px;
  padding: 10px 12px;
}

/* ════════════════════════════════════════════════════════
   PARTNER HLEDÁNÍ
   ════════════════════════════════════════════════════════ */
.partner-filter-panel {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 18px 20px;
  margin-bottom: 16px;
}

.partner-filter-section + .partner-filter-section {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--rg-line);
}

.partner-color-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.partner-color-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  border: 1.5px solid rgba(0, 0, 0, 0.08);
  cursor: pointer;
  transition: outline 0.1s, transform 0.1s, box-shadow 0.1s;
  line-height: 1;
  outline: 2px solid transparent;
  outline-offset: 1px;
}
.partner-color-chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12);
}
.partner-color-chip.active {
  outline: 2.5px solid var(--rg-ink);
  outline-offset: 2px;
}
.partner-color-chip.active .chip-check {
  opacity: 1;
}
.partner-color-chip .chip-check {
  opacity: 0;
  transition: opacity 0.12s;
  display: flex;
  align-items: center;
}

.partner-filter-row {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.partner-filter-item {
  display: flex;
  align-items: center;
  gap: 8px;
}
.partner-filter-item label {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  white-space: nowrap;
}
.partner-filter-item select {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  padding: 6px 10px;
  font-size: 0.875rem;
  color: var(--rg-ink);
  outline: none;
  cursor: pointer;
  transition: border-color 0.12s;
}
.partner-filter-item select:focus {
  border-color: var(--rg-ink);
  background: var(--rg-paper);
}

.partner-results-count {
  margin-left: auto;
  font-size: 0.82rem;
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
}
.partner-results-count strong {
  color: var(--rg-ink);
  font-weight: 700;
}

/* ── Candidate card ── */
.partner-candidate {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  box-shadow: var(--rg-shadow-sm);
  padding: 14px 16px;
  margin-bottom: 10px;
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: 14px;
  align-items: center;
  transition: box-shadow 0.15s, transform 0.12s;
}
.partner-candidate:hover {
  box-shadow: var(--rg-shadow-md);
  transform: translateY(-1px);
}

.partner-candidate-photo {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid var(--rg-line);
}
.partner-candidate-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.partner-candidate-body {
  min-width: 0;
}

.partner-candidate-head {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.partner-candidate-head .nm {
  font-weight: 700;
  font-size: 0.97rem;
  letter-spacing: -0.01em;
  color: var(--rg-ink);
}
.partner-candidate-head .rc {
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  color: var(--rg-mute);
  background: var(--rg-olive);
  padding: 1px 6px;
  border-radius: 5px;
}

.partner-candidate-meta {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-bottom: 6px;
}
.partner-candidate-meta a {
  color: var(--rg-ink-soft);
  text-decoration: none;
  font-weight: 600;
}
.partner-candidate-meta a:hover {
  text-decoration: underline;
  color: var(--rg-ink);
}

.partner-color-probs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.partner-prob-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 600;
  background: var(--rg-olive);
  color: var(--rg-mute);
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.partner-prob-chip.wanted {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.partner-candidate-actions {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-end;
}

/* Loading state */
[data-loading] .partner-candidate-list {
  opacity: 0.5;
  transition: opacity 0.15s;
}

.partner-filter-select {
  border-radius: 10px;
  border-color: var(--rg-line);
  background: var(--rg-cream);
}

.partner-filter-label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.partner-empty {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 32px 24px;
  text-align: center;
  color: var(--rg-mute);
}

.rg-pill.for-sale {
  background: #d4edda;
  color: #155724;
}

.rg-btn.rg-btn-compact {
  font-size: 0.82rem;
  padding: 7px 13px;
}

/* ═══════════════════════════════════════════════════════
   /litter-violations — komisařská kontrola limitů vrhů
   ═══════════════════════════════════════════════════════ */
/* ───────────── Page head ───────────── */
.lv-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: end;
  margin-bottom: 22px;
  padding-bottom: 6px;
}

.lv-head-titles {
  min-width: 0;
}

.lv-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--rg-danger);
  background: var(--rg-danger-bg);
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 12px;
  letter-spacing: 0.14em;
}

.lv-head h1 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin: 0 0 10px;
  color: var(--rg-ink);
}

.lv-head h1 em {
  font-style: italic;
  color: var(--rg-danger);
  font-weight: 500;
}

.lv-sub {
  font-size: 1rem;
  color: var(--rg-ink-soft);
  line-height: 1.55;
  max-width: 56ch;
  margin: 0;
}

.lv-sub strong {
  color: var(--rg-ink);
  font-weight: 700;
}

.lv-head-side {
  display: flex;
}

.lv-rule-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-left: 4px solid var(--rg-danger);
  border-radius: 4px 14px 14px 4px;
  padding: 14px 18px;
  width: 280px;
}

.lv-rule-head {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-danger);
  margin-bottom: 6px;
}

.lv-rule-text {
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
  line-height: 1.5;
  margin-bottom: 8px;
}

.lv-rule-text strong {
  color: var(--rg-ink);
  font-weight: 700;
}

.lv-rule-link {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--rg-line-strong);
}

.lv-rule-link:hover {
  color: var(--rg-accent);
  border-bottom-color: var(--rg-accent);
}

/* ───────────── KPI strip ───────────── */
.lv-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 22px;
}

.lv-kpi {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 14px 16px;
  position: relative;
}

.lv-kpi-ic {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
}

.lv-kpi.danger .lv-kpi-ic {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

.lv-kpi.warn .lv-kpi-ic {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}

.lv-kpi.success .lv-kpi-ic {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}

.lv-kpi.neutral .lv-kpi-ic {
  background: var(--rg-olive);
  color: var(--rg-ink-soft);
}

.lv-kpi-num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--rg-ink);
}

.lv-kpi-lbl {
  font-size: 0.74rem;
  letter-spacing: 0.06em;
  color: var(--rg-mute);
  font-weight: 600;
  margin-top: 6px;
}

/* ───────────── Filter bar ───────────── */
.lv-filterbar {
  display: flex;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid var(--rg-line);
}
.lv-filterbar .rg-tabs {
  padding: 0;
  margin: 0;
  border-bottom: none;
}
.lv-filterbar {
  padding-bottom: 12px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.lv-filterbar-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.lv-year-chips {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lv-chips-label {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-right: 2px;
}

.lv-chip {
  background: transparent;
  border: 1px solid var(--rg-line);
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--rg-ink-soft);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}

.lv-chip:hover {
  background: var(--rg-cream);
  color: var(--rg-ink);
}

.lv-chip.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: var(--rg-ink);
}

.lv-sort {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--rg-mute);
  font-size: 0.82rem;
}

.lv-sort-select {
  appearance: none;
  -webkit-appearance: none;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
  padding: 5px 28px 5px 10px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--rg-ink);
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--rg-mute) 50%), linear-gradient(135deg, var(--rg-mute) 50%, transparent 50%);
  background-position: calc(100% - 14px) 50%, calc(100% - 9px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

.lv-view-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
}

.lv-view-toggle button {
  border: 0;
  background: transparent;
  width: 28px;
  height: 26px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
  cursor: pointer;
}

.lv-view-toggle button.active {
  background: var(--rg-paper);
  color: var(--rg-ink);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

/* ───────────── Card stack ───────────── */
.lv-stack {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* ───────────── Violation Card ───────────── */
.lv-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  position: relative;
  transition: box-shadow 0.2s, transform 0.15s;
}

.lv-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--rg-warn);
}

.lv-card-mild::before {
  background: var(--rg-warn);
  opacity: 0.55;
}

.lv-card-moderate::before {
  background: var(--rg-warn);
}

.lv-card-severe::before {
  background: var(--rg-danger);
}

.lv-card.is-resolved::before {
  background: var(--rg-success);
}

.lv-card.is-resolved {
  background: color-mix(in oklab, var(--rg-paper) 92%, var(--rg-success-bg));
}

.lv-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px 12px 22px;
  border-bottom: 1px solid var(--rg-line);
  background: var(--rg-cream);
}

.lv-card-head-spacer {
  flex: 1;
}

.lv-idx {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 700;
}

/* severity badge */
.lv-sev {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px 5px 8px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.82rem;
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}

.lv-sev-severe {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

.lv-sev-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lv-sev-cnt {
  font-variant-numeric: tabular-nums;
}

.lv-sev-lbl {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  opacity: 0.8;
  border-left: 1px solid currentColor;
  padding-left: 8px;
  margin-left: -2px;
}

.lv-year-pill {
  font-family: ui-monospace, monospace;
  background: var(--rg-ink);
  color: var(--rg-paper);
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}

.lv-resolved-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--rg-success-bg);
  color: var(--rg-success);
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
}

.lv-card-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 0;
}

.lv-card-left {
  padding: 18px 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border-right: 1px solid var(--rg-line);
}

/* Identity */
.lv-identity {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.lv-identity-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.lv-matka-name {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.018em;
  line-height: 1.1;
  color: var(--rg-ink);
  text-decoration: none;
}

.lv-matka-name:hover {
  color: var(--rg-accent);
}

.lv-meta-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: var(--rg-mute);
}

.lv-meta-row .dot {
  opacity: 0.4;
}

.lv-meta-row code {
  font-family: ui-monospace, monospace;
  font-size: 0.76rem;
  background: var(--rg-olive);
  padding: 1px 7px;
  border-radius: 5px;
  color: var(--rg-ink-soft);
}

.lv-breeder-line {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.84rem;
  color: var(--rg-ink-soft);
  text-decoration: none;
  margin-top: 4px;
}

.lv-breeder-line:hover {
  color: var(--rg-accent);
}

.lv-breeder-line strong {
  color: var(--rg-ink);
  font-weight: 700;
}

/* Timeline */
.lv-timeline-block {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  padding: 14px 16px 12px;
}

.lv-tl-label {
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 18px;
}

.lv-tl {
  position: relative;
}

.lv-tl-axis {
  position: relative;
  height: 22px;
  background: var(--rg-paper);
  border-radius: 999px;
  border: 1px solid var(--rg-line);
  margin-bottom: 4px;
}

.lv-tl-seg {
  position: absolute;
  top: 50%;
  height: 6px;
  transform: translateY(-50%);
  background: var(--rg-success);
  border-radius: 999px;
}

.lv-tl-seg-ok {
  background: color-mix(in oklab, var(--rg-success) 60%, transparent);
}

.lv-tl-seg-warn {
  background: color-mix(in oklab, var(--rg-warn) 75%, transparent);
}

.lv-tl-seg-critical {
  background: color-mix(in oklab, var(--rg-danger) 80%, transparent);
  background-image: repeating-linear-gradient(45deg, transparent 0 4px, rgba(255, 255, 255, 0.35) 4px 8px);
}

.lv-tl-seg-lbl {
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  font-family: ui-monospace, monospace;
  font-size: 0.66rem;
  background: var(--rg-paper);
  color: var(--rg-ink);
  padding: 1px 5px;
  border-radius: 5px;
  border: 1px solid var(--rg-line);
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.15s;
}

.lv-tl-seg:hover .lv-tl-seg-lbl {
  opacity: 1;
}

.lv-tl-dot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--rg-ink);
  border: 2px solid var(--rg-paper);
  box-shadow: 0 0 0 1px var(--rg-ink);
  z-index: 2;
}

.lv-tl-dot .ring {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: color-mix(in oklab, var(--rg-ink) 14%, transparent);
}

.lv-tl-dot .lbl {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 14px;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--rg-ink);
  white-space: nowrap;
}

.lv-tl-dot .sub {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 28px;
  font-size: 0.64rem;
  color: var(--rg-mute);
  white-space: nowrap;
}

.lv-tl-months {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  margin-top: 64px;
  font-size: 0.66rem;
  color: var(--rg-mute);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-align: center;
  padding: 8px 0 0;
  border-top: 1px dashed var(--rg-line);
}

.lv-tl-stats {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 12px;
  font-size: 0.82rem;
  color: var(--rg-ink-soft);
  padding-top: 10px;
  border-top: 1px solid var(--rg-line);
}

.lv-tl-stats .sep {
  opacity: 0.4;
}

.lv-tl-stats strong {
  color: var(--rg-ink);
  font-weight: 700;
}

.lv-tl-stats .crit {
  color: var(--rg-danger);
}

.lv-tl-stats .warn-chip {
  margin-left: 6px;
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
  font-size: 0.68rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Foot actions */
.lv-foot-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  padding-top: 4px;
}

.lv-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--rg-ink-soft);
  text-decoration: none;
}

.lv-link:hover {
  color: var(--rg-accent);
}

/* Note panel */
.lv-note-panel {
  padding: 18px 22px;
  background: var(--rg-paper);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lv-note-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

.lv-note-saved {
  margin-left: auto;
  color: var(--rg-mute);
  font-size: 0.66rem;
  letter-spacing: 0.05em;
  text-transform: none;
}

.lv-note-input {
  width: 100%;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 0.88rem;
  color: var(--rg-ink);
  font-family: inherit;
  resize: vertical;
  min-height: 110px;
  transition: border-color 0.12s, background 0.12s;
}

.lv-note-input:focus {
  outline: none;
  background: var(--rg-paper);
  border-color: var(--rg-ink);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
}

.lv-note-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.lv-resolved-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 0.86rem;
  color: var(--rg-ink-soft);
  user-select: none;
}

.lv-resolved-check input {
  display: none;
}

.lv-resolved-check .box {
  width: 18px;
  height: 18px;
  border-radius: 5px;
  border: 1.5px solid var(--rg-line-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-paper);
  transition: background 0.12s, border-color 0.12s;
}

.lv-resolved-check input:checked ~ .box {
  background: var(--rg-success);
  border-color: var(--rg-success);
}

.lv-resolver {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  color: var(--rg-success);
  background: var(--rg-success-bg);
  padding: 6px 12px;
  border-radius: 8px;
  margin-top: 2px;
}

.lv-resolver strong {
  color: var(--rg-success);
  font-weight: 700;
}

.lv-save-status {
  font-size: 0.78rem;
  min-height: 16px;
  margin-top: 2px;
}

/* ───────────── Pager ───────────── */
.lv-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 12px 0;
  border-top: 1px solid var(--rg-line);
  font-size: 0.82rem;
  color: var(--rg-mute);
  font-weight: 600;
}

/* ───────────── Compact table ───────────── */
.lv-table-wrap {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
}

.lv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.lv-table thead th {
  background: var(--rg-cream);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--rg-line);
}

.lv-table tbody td {
  padding: 12px;
  border-bottom: 1px solid var(--rg-line);
  vertical-align: middle;
}

.lv-table tbody tr:last-child td {
  border-bottom: 0;
}

.lv-table tbody tr:hover {
  background: var(--rg-cream);
}

.lv-tr-severe td:first-child {
  box-shadow: inset 4px 0 0 var(--rg-danger);
}

.lv-tr-moderate td:first-child {
  box-shadow: inset 4px 0 0 var(--rg-warn);
}

.lv-tr-mild td:first-child {
  box-shadow: inset 4px 0 0 color-mix(in oklab, var(--rg-warn) 55%, transparent);
}

.lv-tr.is-resolved td:first-child {
  box-shadow: inset 4px 0 0 var(--rg-success);
}

.lv-tr.is-resolved {
  color: var(--rg-mute);
}

.lv-tr.is-resolved .lv-tbl-link strong {
  color: var(--rg-ink-soft);
}

.lv-tbl-link {
  display: flex;
  flex-direction: column;
  gap: 1px;
  text-decoration: none;
  color: var(--rg-ink);
}

.lv-tbl-link strong {
  font-weight: 700;
}

.lv-tbl-link:hover strong {
  color: var(--rg-accent);
}

.lv-tbl-sub {
  font-size: 0.74rem;
  color: var(--rg-mute);
  font-weight: 500;
}

.lv-sev-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
}

.lv-sev-pill.lv-sev-severe {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

.lv-sev-pill.lv-sev-mild {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
  opacity: 0.75;
}

/* mini timeline */
.lv-mini-tl {
  display: flex;
  flex-direction: column;
  gap: 3px;
  width: 200px;
}

.lv-mini-axis {
  position: relative;
  height: 18px;
  background: var(--rg-olive);
  border-radius: 4px;
}

.lv-mini-dot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--rg-ink);
  border: 1.5px solid var(--rg-paper);
}

.lv-mini-dot-warn {
  background: var(--rg-warn);
}

.lv-mini-dot-critical {
  background: var(--rg-danger);
}

.lv-mini-months {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  font-size: 0.58rem;
  color: var(--rg-mute);
  font-weight: 700;
  text-align: center;
  letter-spacing: 0.02em;
}

/* ───────────── Empty state ───────────── */
.lv-empty {
  background: var(--rg-paper);
  border: 1px dashed var(--rg-line-strong);
  border-radius: 18px;
  padding: 56px 32px;
  text-align: center;
  color: var(--rg-mute);
}

.lv-empty-ico {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--rg-success-bg);
  color: var(--rg-success);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.lv-empty h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--rg-ink);
  margin: 0 0 8px;
}

.lv-empty p {
  margin: 0 auto 18px;
  max-width: 44ch;
  font-size: 0.95rem;
  line-height: 1.55;
}

/* ───────────── rg-mono ───────────── */
.rg-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ───────────── Responsive ───────────── */
@media (max-width: 880px) {
  .lv-head {
    grid-template-columns: 1fr;
  }
  .lv-rule-card {
    width: 100%;
  }
  .lv-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .lv-filterbar {
    flex-direction: column;
    align-items: stretch;
  }
  .lv-filterbar-right {
    margin-left: 0;
  }
  .lv-card-grid {
    grid-template-columns: 1fr;
  }
  .lv-card-left {
    border-right: 0;
    border-bottom: 1px solid var(--rg-line);
  }
  .lv-table-wrap {
    overflow-x: auto;
  }
}
@media (max-width: 480px) {
  .lv-head h1 {
    font-size: 1.9rem;
  }
  .lv-kpis {
    grid-template-columns: 1fr 1fr;
  }
  .lv-tl-dot .sub {
    display: none;
  }
  .lv-foot-actions {
    flex-direction: column;
    gap: 8px;
  }
  .lv-note-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .lv-note-actions .rg-btn {
    width: 100%;
  }
}
.lv-table th:nth-child(1) {
  width: 120px;
}
.lv-table th:nth-child(2) {
  width: 60px;
}
.lv-table th:nth-child(5) {
  width: 220px;
}
.lv-table th:nth-child(6) {
  width: 88px;
}
.lv-table th:nth-child(7) {
  width: 90px;
}
.lv-table th:nth-child(8) {
  width: 90px;
}

.lv-sep {
  color: var(--rg-mute);
  font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   /chovatel/zajemci — adresář zájemců (master-detail)
   ═══════════════════════════════════════════════════════ */
.zj-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.zj-head .titles {
  min-width: 0;
}
.zj-head .sub {
  color: var(--rg-mute);
  font-size: 0.92rem;
  margin-top: 4px;
}

.zj-head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

/* ── KPI strip ── */
.zj-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 22px;
}

.zj-kpi {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 14px 16px;
}
.zj-kpi .k-ico {
  color: var(--rg-mute);
  margin-bottom: 6px;
}
.zj-kpi .k-num {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--rg-ink);
  font-family: ui-monospace, monospace;
}
.zj-kpi .k-num .cur {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--rg-mute);
  margin-left: 4px;
}
.zj-kpi .k-lbl {
  font-size: 0.78rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.zj-kpi.warn .k-ico {
  color: var(--rg-warn);
}
.zj-kpi.accent .k-ico {
  color: var(--rg-accent);
}
.zj-kpi.danger .k-ico {
  color: var(--rg-danger);
}

/* ── Empty state ── */
.zj-empty {
  text-align: center;
  padding: 60px 20px;
  border: 1px dashed var(--rg-line-strong);
  border-radius: 16px;
  color: var(--rg-mute);
}
.zj-empty .zj-empty-ico {
  color: var(--rg-line-strong);
  margin-bottom: 12px;
}
.zj-empty h3 {
  color: var(--rg-ink);
  margin-bottom: 4px;
}

/* ── Master-detail grid ── */
.zj-md {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 20px;
  align-items: start;
}

.zj-md-list {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  overflow: hidden;
}

.zj-md-list-head {
  display: flex;
  justify-content: space-between;
  padding: 14px 16px;
  font-weight: 700;
  border-bottom: 1px solid var(--rg-line);
  font-size: 0.85rem;
  color: var(--rg-mute);
}

.zj-li {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid var(--rg-line);
  transition: background 0.12s;
}
.zj-li:hover {
  background: var(--rg-cream);
}
.zj-li.active {
  background: var(--rg-olive);
}
.zj-li:last-child {
  border-bottom: none;
}

.zj-li-id {
  min-width: 0;
  flex: 1;
}

.zj-li-name {
  font-weight: 600;
  color: var(--rg-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.zj-li-sub {
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.zj-li-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.zj-li-screen {
  display: flex;
  gap: 4px;
}

.zj-li-screen .d {
  width: 16px;
  height: 16px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-line);
  color: #fff;
}
.zj-li-screen .d.ok {
  background: var(--rg-success);
}

.zj-waiting-badge {
  font-size: 0.66rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 7px;
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}

/* ── Avatar ── */
.zj-av {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--rg-accent);
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  flex-shrink: 0;
}
.zj-av.lg {
  width: 56px;
  height: 56px;
  font-size: 1.25rem;
}

/* ── Detail panel ── */
.zj-detail {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  overflow: hidden;
}

.zj-detail-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--rg-line);
  flex-wrap: wrap;
}

.h-id {
  min-width: 0;
  flex: 1;
}

.h-name {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--rg-ink);
}

.h-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 4px;
}
.h-meta a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--rg-mute);
  font-size: 0.85rem;
  text-decoration: none;
}
.h-meta a:hover {
  color: var(--rg-ink);
}

.h-actions {
  display: flex;
  gap: 8px;
}

.zj-repeat-badge {
  margin-left: 8px;
  vertical-align: middle;
}

.zj-repeat-hint {
  font-size: 0.78rem;
  color: var(--rg-mute);
  margin: -2px 0 10px;
}

.zj-detail-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  padding: 22px 24px;
}

.zj-detail-full {
  grid-column: 1/-1;
}

.zj-block-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--rg-ink);
  margin-bottom: 10px;
}

.zj-total {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  color: var(--rg-ink);
  margin-left: auto;
}

/* ── Validace ── */
.zj-screen-big {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.zj-screen-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  cursor: pointer;
}
.zj-screen-row .zj-screen-check {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.zj-screen-row .sx {
  display: inline-flex;
  color: var(--rg-mute);
}
.zj-screen-row .st {
  flex: 1;
  min-width: 0;
}
.zj-screen-row .st .l {
  font-weight: 600;
  font-size: 0.88rem;
  color: var(--rg-ink);
}
.zj-screen-row .st .s {
  font-size: 0.74rem;
  color: var(--rg-mute);
}
.zj-screen-row .badge-state {
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 3px 8px;
  border-radius: 7px;
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.zj-screen-row.ok {
  border-color: color-mix(in oklab, var(--rg-success) 30%, transparent);
  background: var(--rg-success-bg);
}
.zj-screen-row.ok .sx {
  color: var(--rg-success);
}
.zj-screen-row.ok .badge-state {
  background: var(--rg-success);
  color: #fff;
}
.zj-screen-row.no .badge-state {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}

/* ── Rezervace v detailu ── */
.zj-dres {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.zj-dres-item {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 14px;
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  font-size: 0.85rem;
}
.zj-dres-item .zj-stage-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--rg-line-strong);
  flex-shrink: 0;
}
.zj-dres-item .zj-stage-dot.zavazna {
  background: var(--rg-warn);
}
.zj-dres-item .zj-stage-dot.zaloha_uhrazena {
  background: var(--rg-accent-2);
}
.zj-dres-item .zj-stage-dot.dokonceno {
  background: var(--rg-success);
}
.zj-dres-item .nm {
  font-weight: 600;
  color: var(--rg-ink);
}
.zj-dres-item .price {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  margin-left: auto;
}
.zj-dres-item .zj-res-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  width: 100%;
}

.zj-stage-pill {
  font-size: 0.66rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 7px;
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.zj-stage-pill.zavazna {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.zj-stage-pill.zaloha_uhrazena {
  background: color-mix(in oklab, var(--rg-accent-2) 18%, white);
  color: var(--rg-accent-2);
}
.zj-stage-pill.dokonceno {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}

.zj-hidden-form {
  display: none;
}

/* ── Historie nákupů (collapsible) ── */
.zj-history {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--rg-line);
}

.zj-history-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--rg-ink);
}
.zj-history-summary::-webkit-details-marker {
  display: none;
}
.zj-history-summary::before {
  content: "▸";
  display: inline-block;
  color: var(--rg-mute);
  transition: transform 0.15s ease;
}

.zj-history[open] > .zj-history-summary::before {
  transform: rotate(90deg);
}

.zj-history-title {
  display: flex;
  align-items: center;
  gap: 6px;
}

.zj-history-count {
  font-weight: 400;
  color: var(--rg-mute);
  font-size: 0.82rem;
}

.zj-history > .zj-dres {
  margin-top: 10px;
}

/* ── Formulář nové rezervace ── */
.zj-res-form-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 12px;
}

/* ── Poznámka, log ── */
.zj-note {
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
  white-space: pre-wrap;
}

.zj-empty-block {
  color: var(--rg-mute);
  font-size: 0.85rem;
  padding: 14px 0;
}

.zj-log {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 360px;
  overflow-y: auto;
  margin-bottom: 14px;
}

.zj-log-item {
  display: flex;
  gap: 10px;
}

.zj-log-tile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  flex-shrink: 0;
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.zj-log-tile.telefon {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.zj-log-tile.email {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.zj-log-tile.osobne {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}

.zj-log-body {
  flex: 1;
  min-width: 0;
}

.zj-log-body .top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 0.74rem;
  color: var(--rg-mute);
}

.zj-log-body .typ {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.zj-log-body .msg {
  font-size: 0.86rem;
  color: var(--rg-ink-soft);
  margin-top: 2px;
}

.zj-log-compose {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.zj-log-compose .zj-log-type, .zj-log-compose input[type=text] {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 0.85rem;
}
.zj-log-compose input[type=text] {
  flex: 1;
  min-width: 200px;
}

@media (max-width: 980px) {
  .zj-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .zj-md {
    grid-template-columns: 1fr;
  }
  .zj-detail-body {
    grid-template-columns: 1fr;
  }
  .zj-res-form-grid {
    grid-template-columns: 1fr;
  }
}
/* ═══════════════════════════════════════════════════════
   /chovatel/prodeje — nástěnka prodejů (kanban)
   ═══════════════════════════════════════════════════════ */
.pl-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.pl-head .titles {
  min-width: 0;
}
.pl-head .sub {
  color: var(--rg-mute);
  font-size: 0.92rem;
  margin-top: 4px;
}

.pl-head-actions {
  display: flex;
  gap: 8px;
}

/* ── KPI strip ── */
.pl-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 22px;
}

.pl-kpi {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 14px 16px;
}
.pl-kpi .k-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.pl-kpi .k-lbl {
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 600;
}
.pl-kpi .k-ico {
  color: var(--rg-mute);
}
.pl-kpi .k-val {
  font-size: 1.4rem;
  font-weight: 700;
  font-family: ui-monospace, monospace;
  color: var(--rg-ink);
}
.pl-kpi .k-val .cur {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rg-mute);
  margin-left: 4px;
}
.pl-kpi .k-sub {
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.pl-kpi.accent .k-ico {
  color: var(--rg-accent);
}
.pl-kpi.deposit .k-ico {
  color: var(--rg-warn);
}
.pl-kpi.done .k-ico {
  color: var(--rg-success);
}
.pl-kpi.wait .k-ico {
  color: var(--rg-mute);
}

/* ── Kanban board ── */
.pl-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(260px, 1fr));
  gap: 14px;
  align-items: start;
  overflow-x: auto;
  padding-bottom: 10px;
}

.pl-col {
  position: relative;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 76vh;
}

.pl-col-accent {
  height: 4px;
  background: var(--rg-line-strong);
}

.pl-col-predbezna .pl-col-accent {
  background: var(--rg-mute);
}

.pl-col-zavazna .pl-col-accent {
  background: var(--rg-warn);
}

.pl-col-zaloha_uhrazena .pl-col-accent {
  background: var(--rg-accent-2);
}

.pl-col-dokonceno .pl-col-accent {
  background: var(--rg-success);
}

.pl-col-head {
  padding: 14px 16px;
  border-bottom: 1px solid var(--rg-line);
}

.pl-col-titlerow {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pl-col-title {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--rg-ink);
  flex: 1;
}

.pl-col-count {
  font-size: 0.72rem;
  font-weight: 700;
  background: var(--rg-olive);
  color: var(--rg-mute);
  border-radius: 999px;
  padding: 2px 8px;
}

.pl-col-sum {
  display: flex;
  justify-content: space-between;
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 6px;
}
.pl-col-sum .v {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  color: var(--rg-ink);
}

.pl-col-body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: auto;
  flex: 1;
}

.pl-col-empty {
  text-align: center;
  color: var(--rg-mute);
  font-size: 0.82rem;
  padding: 30px 10px;
  border: 1px dashed var(--rg-line);
  border-radius: 12px;
}

/* ── Card ── */
.pl-card {
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pl-card-top {
  display: flex;
  gap: 10px;
  align-items: center;
}

.pl-thumb {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--rg-olive);
}
.pl-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pl-thumb .ph {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--rg-line-strong);
}

.pl-card-id {
  min-width: 0;
  flex: 1;
}

.pl-card-name {
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--rg-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pl-card-rc {
  font-size: 0.72rem;
  color: var(--rg-mute);
  font-family: ui-monospace, monospace;
}

.pl-price {
  text-align: right;
}
.pl-price .amt {
  font-weight: 700;
  font-family: ui-monospace, monospace;
}
.pl-price .cur {
  font-size: 0.7rem;
  color: var(--rg-mute);
}

.pl-deposit {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pl-deposit-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.74rem;
  color: var(--rg-mute);
}
.pl-deposit-row .val {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  color: var(--rg-ink);
}

.pl-bar {
  height: 6px;
  border-radius: 999px;
  background: var(--rg-line);
  overflow: hidden;
}
.pl-bar span {
  display: block;
  height: 100%;
  background: var(--rg-accent-2);
  border-radius: inherit;
}
.pl-bar.full span {
  background: var(--rg-success);
}

.pl-buyer {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pl-buyer-av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-accent);
  color: #fff;
  font-weight: 700;
  font-size: 0.78rem;
  flex-shrink: 0;
}

.pl-buyer-meta {
  min-width: 0;
  flex: 1;
}
.pl-buyer-meta .nm a {
  font-weight: 600;
  font-size: 0.82rem;
  color: var(--rg-ink);
  text-decoration: none;
}
.pl-buyer-meta .nm a:hover {
  text-decoration: underline;
}

.pl-age {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  color: var(--rg-mute);
}
.pl-age.warn {
  color: var(--rg-warn);
  font-weight: 700;
}

.pl-done-stamp {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  font-weight: 700;
  font-size: 0.8rem;
  color: var(--rg-success);
  background: var(--rg-success-bg);
  border-radius: 10px;
  padding: 8px;
}

.pl-act {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  font-weight: 600;
  font-size: 0.82rem;
  cursor: pointer;
  background: var(--rg-olive);
  color: var(--rg-ink);
}
.pl-act-zavazna {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.pl-act-zaloha_uhrazena {
  background: color-mix(in oklab, var(--rg-accent-2) 18%, white);
  color: var(--rg-accent-2);
}

@media (max-width: 1100px) {
  .pl-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .pl-board {
    grid-template-columns: 1fr;
  }
}
/* ── Compact styles for completed deals ── */
.pl-card--done {
  padding: 8px;
  gap: 0;
}

.pl-card-top--compact {
  gap: 6px;
}

.pl-done-badge {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-success);
  color: #fff;
  font-weight: 700;
  font-size: 0.7rem;
  flex-shrink: 0;
}

.pl-card-name--tiny {
  font-size: 0.8rem;
}

.pl-card-rc--tiny {
  font-size: 0.65rem;
}

.pl-deposit--compact {
  display: none;
}

.pl-buyer--hidden {
  display: none;
}

.pl-buyer--compact .pl-age {
  display: none;
}

.pl-card-id a {
  text-decoration: none;
  color: inherit;
}
.pl-card-id a:hover .pl-card-name {
  text-decoration: underline;
}

/* ── Grouped completed deals ── */
.pl-card--grouped {
  padding: 10px;
}

.pl-card-top--grouped {
  gap: 8px;
  margin-bottom: 8px;
}

.pl-grouped-items {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 8px;
}

.pl-grouped-item {
  padding: 4px 6px;
  border-radius: 6px;
  background: var(--rg-olive);
  color: var(--rg-ink);
  text-decoration: none;
  font-size: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 1px;
  transition: background-color 0.2s;
}
.pl-grouped-item:hover {
  background-color: color-mix(in oklab, var(--rg-olive) 150%, white);
  text-decoration: underline;
}

.gi-name {
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gi-rc {
  font-size: 0.7rem;
  color: var(--rg-mute);
  font-family: ui-monospace, monospace;
}

.pl-grouped-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 6px;
  border-top: 1px solid var(--rg-line);
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.gt-label {
  font-weight: 600;
}

.gt-price {
  font-weight: 700;
  font-family: ui-monospace, monospace;
  color: var(--rg-ink);
}

/* ════════════════════════════════════════════════════════
   Alerty & flash zprávy — stylesheet
   ════════════════════════════════════════════════════════ */
/* Stage helpers (jen pro design canvas — uvnitř artboardu) */
.rg-stage {
  background: var(--rg-bg);
  padding: 24px 28px 28px;
  min-height: 100%;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--rg-ink);
}

.rg-stage-eyebrow {
  font-size: 0.66rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 18px;
}

.rg-stage-row-label {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin: 22px 0 8px;
}

.rg-stage-row-label:first-child {
  margin-top: 0;
}

.rg-stage-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

@keyframes rg-spin {
  to {
    transform: rotate(360deg);
  }
}
/* ════════════════════════════════════════════════════════
   ALERT — basic structure
   ════════════════════════════════════════════════════════ */
.rg-alert {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 14px;
  font-size: 0.92rem;
  line-height: 1.45;
  position: relative;
}

.rg-alert-icon {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: -1px;
}

.rg-alert-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-top: 4px;
}

.rg-alert-title {
  font-weight: 700;
  font-size: 0.96rem;
  letter-spacing: -0.005em;
  color: var(--rg-ink);
  line-height: 1.25;
}

.rg-alert-text {
  font-size: 0.86rem;
  color: var(--rg-ink-soft);
  line-height: 1.5;
}

.rg-alert-text code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.8rem;
  background: rgba(0, 0, 0, 0.06);
  padding: 1px 6px;
  border-radius: 5px;
  color: var(--rg-ink);
}

[data-bs-theme=dark] .rg-alert-text code {
  background: rgba(255, 255, 255, 0.08);
}

.rg-alert-text a {
  color: var(--rg-ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.rg-alert-text a:hover {
  color: var(--rg-accent);
}

.rg-alert-action {
  align-self: center;
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.rg-alert-close {
  background: transparent;
  border: 0;
  cursor: pointer;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
  flex-shrink: 0;
  align-self: flex-start;
  margin-top: 2px;
  transition: background 0.12s, color 0.12s;
}

.rg-alert-close:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--rg-ink);
}

[data-bs-theme=dark] .rg-alert-close:hover {
  background: rgba(255, 255, 255, 0.08);
}

/* ─── kompakt ─── */
.rg-alert-compact {
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  padding: 9px 14px;
  font-size: 0.86rem;
}

.rg-alert-compact .rg-alert-icon {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  margin-top: 0;
}

.rg-alert-compact .rg-alert-body {
  padding-top: 1px;
}

.rg-alert-compact .rg-alert-title {
  display: none;
}

.rg-alert-compact .rg-alert-text {
  font-size: 0.86rem;
  color: var(--rg-ink);
}

/* ════════════════════════════════════════════════════════
   ALERT — soft variant (default)
   ════════════════════════════════════════════════════════ */
.rg-alert-soft.rg-alert-info {
  background: var(--rg-male-bg);
  border: 1px solid rgba(10, 78, 168, 0.18);
}

.rg-alert-soft.rg-alert-success {
  background: var(--rg-success-bg);
  border: 1px solid rgba(21, 102, 58, 0.2);
}

.rg-alert-soft.rg-alert-warn {
  background: var(--rg-warn-bg);
  border: 1px solid rgba(138, 90, 0, 0.25);
}

.rg-alert-soft.rg-alert-danger {
  background: var(--rg-danger-bg);
  border: 1px solid rgba(154, 31, 42, 0.22);
}

/* icon tile = solid-on-bg, leverages the tone-fg */
.rg-alert-soft.rg-alert-info .rg-alert-icon {
  background: rgba(10, 78, 168, 0.12);
  color: var(--rg-male);
}

.rg-alert-soft.rg-alert-success .rg-alert-icon {
  background: rgba(21, 102, 58, 0.13);
  color: var(--rg-success);
}

.rg-alert-soft.rg-alert-warn .rg-alert-icon {
  background: rgba(138, 90, 0, 0.14);
  color: var(--rg-warn);
}

.rg-alert-soft.rg-alert-danger .rg-alert-icon {
  background: rgba(154, 31, 42, 0.13);
  color: var(--rg-danger);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-info {
  border-color: rgba(127, 176, 255, 0.2);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-success {
  border-color: rgba(121, 211, 156, 0.22);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-warn {
  border-color: rgba(255, 206, 106, 0.28);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-danger {
  border-color: rgba(224, 122, 133, 0.26);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-info .rg-alert-icon {
  background: rgba(127, 176, 255, 0.14);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-success .rg-alert-icon {
  background: rgba(121, 211, 156, 0.14);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-warn .rg-alert-icon {
  background: rgba(255, 206, 106, 0.16);
}

[data-bs-theme=dark] .rg-alert-soft.rg-alert-danger .rg-alert-icon {
  background: rgba(224, 122, 133, 0.16);
}

/* ════════════════════════════════════════════════════════
   ALERT — filled (sytá barva, bílý text)
   ════════════════════════════════════════════════════════ */
.rg-alert-filled {
  color: #fff;
  border: 0;
  padding: 14px 18px;
}

.rg-alert-filled .rg-alert-title {
  color: #fff;
}

.rg-alert-filled .rg-alert-text {
  color: rgba(255, 255, 255, 0.86);
}

.rg-alert-filled .rg-alert-icon {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.rg-alert-filled .rg-alert-close {
  color: rgba(255, 255, 255, 0.7);
}

.rg-alert-filled .rg-alert-close:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.rg-alert-filled.rg-alert-info {
  background: #0a4ea8;
}

.rg-alert-filled.rg-alert-success {
  background: #15663a;
}

.rg-alert-filled.rg-alert-warn {
  background: #8a5a00;
}

.rg-alert-filled.rg-alert-danger {
  background: #9a1f2a;
}

[data-bs-theme=dark] .rg-alert-filled.rg-alert-info {
  background: #1c5fc2;
}

[data-bs-theme=dark] .rg-alert-filled.rg-alert-success {
  background: #1e7d48;
}

[data-bs-theme=dark] .rg-alert-filled.rg-alert-warn {
  background: #b07a18;
}

[data-bs-theme=dark] .rg-alert-filled.rg-alert-danger {
  background: #b73340;
}

/* ════════════════════════════════════════════════════════
   ALERT — left stripe
   ════════════════════════════════════════════════════════ */
.rg-alert-stripe {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-left-width: 4px;
  border-radius: 4px 14px 14px 4px;
}

.rg-alert-stripe.rg-alert-info {
  border-left-color: var(--rg-male);
}

.rg-alert-stripe.rg-alert-success {
  border-left-color: var(--rg-success);
}

.rg-alert-stripe.rg-alert-warn {
  border-left-color: var(--rg-warn);
}

.rg-alert-stripe.rg-alert-danger {
  border-left-color: var(--rg-danger);
}

.rg-alert-stripe.rg-alert-info .rg-alert-icon {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}

.rg-alert-stripe.rg-alert-success .rg-alert-icon {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}

.rg-alert-stripe.rg-alert-warn .rg-alert-icon {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}

.rg-alert-stripe.rg-alert-danger .rg-alert-icon {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

/* ════════════════════════════════════════════════════════
   ALERT — list (validation errors)
   ════════════════════════════════════════════════════════ */
.rg-alert-list .rg-alert-body {
  gap: 8px;
}

.rg-alert-list ul {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rg-alert-list li {
  position: relative;
  padding-left: 18px;
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
  line-height: 1.45;
}

.rg-alert-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.5;
}

.rg-alert-list.rg-alert-danger li::before {
  background: var(--rg-danger);
  opacity: 0.8;
}

.rg-alert-list a {
  color: var(--rg-ink);
}

/* ════════════════════════════════════════════════════════
   ALERT — composite stats
   ════════════════════════════════════════════════════════ */
.rg-alert-stats .rg-alert-body {
  gap: 8px;
}

.rg-alert-stats-row {
  display: flex;
  gap: 18px;
  margin-top: 6px;
  padding: 10px 0 6px;
  border-top: 1px dashed currentColor;
  border-bottom: 1px dashed currentColor;
  opacity: 0.98;
}

.rg-alert-stat .num {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--rg-ink);
  line-height: 1;
}

.rg-alert-stat .lbl {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-top: 4px;
}

.rg-alert-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: none;
  margin-top: 8px;
}

.rg-alert-link:hover {
  color: var(--rg-accent);
}

.rg-alert-actions-inline {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  flex-wrap: wrap;
}

/* ════════════════════════════════════════════════════════
   ALERT — progress (např. nahrávání)
   ════════════════════════════════════════════════════════ */
.rg-alert-progress .rg-alert-body {
  gap: 6px;
}

.rg-progress {
  height: 4px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.08);
  overflow: hidden;
  margin-top: 6px;
}

.rg-progress span {
  display: block;
  height: 100%;
  background: var(--rg-male);
  border-radius: 999px;
  transition: width 0.25s;
}

.rg-alert-info .rg-progress span {
  background: var(--rg-male);
}

.rg-alert-success .rg-progress span {
  background: var(--rg-success);
}

.rg-alert-warn .rg-progress span {
  background: var(--rg-warn);
}

.rg-alert-danger .rg-progress span {
  background: var(--rg-danger);
}

[data-bs-theme=dark] .rg-progress {
  background: rgba(255, 255, 255, 0.1);
}

/* ════════════════════════════════════════════════════════
   SYSTEM BANNER (full-width, sits above nav)
   ════════════════════════════════════════════════════════ */
.rg-sysbanner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  font-size: 0.86rem;
  color: var(--rg-ink);
  border-bottom: 1px solid;
}

.rg-sysbanner-info {
  background: var(--rg-male-bg);
  border-color: rgba(10, 78, 168, 0.18);
  color: var(--rg-male);
}

.rg-sysbanner-success {
  background: var(--rg-success-bg);
  border-color: rgba(21, 102, 58, 0.2);
  color: var(--rg-success);
}

.rg-sysbanner-warn {
  background: var(--rg-warn-bg);
  border-color: rgba(138, 90, 0, 0.25);
  color: var(--rg-warn);
}

.rg-sysbanner-danger {
  background: var(--rg-danger-bg);
  border-color: rgba(154, 31, 42, 0.22);
  color: var(--rg-danger);
}

.rg-sysbanner strong {
  color: inherit;
}

.rg-sysbanner-text {
  color: var(--rg-ink);
}

.rg-sysbanner-text strong {
  color: var(--rg-ink);
}

.rg-sysbanner-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
  box-shadow: 0 0 0 4px color-mix(in oklab, currentColor 22%, transparent);
  animation: rg-pulse 2s ease-in-out infinite;
}

@keyframes rg-pulse {
  0%, 100% {
    box-shadow: 0 0 0 4px color-mix(in oklab, currentColor 18%, transparent);
  }
  50% {
    box-shadow: 0 0 0 7px color-mix(in oklab, currentColor 6%, transparent);
  }
}
.rg-sysbanner-action {
  margin-left: auto;
}

.rg-sysbanner-link {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}

.rg-sysbanner-link:hover {
  color: var(--rg-accent);
}

.rg-sysbanner-close {
  background: transparent;
  border: 0;
  cursor: pointer;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
  margin-left: 4px;
}

.rg-sysbanner-close:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--rg-ink);
}

[data-bs-theme=dark] .rg-sysbanner-close:hover {
  background: rgba(255, 255, 255, 0.08);
}

/* ════════════════════════════════════════════════════════
   TOAST — floating
   ════════════════════════════════════════════════════════ */
.rg-toast-stack {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 360px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 60;
}

.rg-toast {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: flex-start;
  padding: 13px 14px 14px;
  border-radius: 14px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  box-shadow: 0 10px 28px -10px rgba(0, 0, 0, 0.25), 0 2px 6px rgba(0, 0, 0, 0.06);
  position: relative;
  overflow: hidden;
  animation: rg-toast-in 0.26s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

@keyframes rg-toast-in {
  from {
    transform: translateX(20px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
.rg-toast::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: currentColor;
}

.rg-toast-info {
  color: var(--rg-male);
}

.rg-toast-success {
  color: var(--rg-success);
}

.rg-toast-warn {
  color: var(--rg-warn);
}

.rg-toast-danger {
  color: var(--rg-danger);
}

.rg-toast-icon {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklab, currentColor 14%, transparent);
  flex-shrink: 0;
  margin-top: 1px;
}

.rg-toast-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 2px;
}

.rg-toast-title {
  font-weight: 700;
  font-size: 0.92rem;
  color: var(--rg-ink);
  letter-spacing: -0.005em;
  line-height: 1.25;
}

.rg-toast-text {
  font-size: 0.82rem;
  color: var(--rg-ink-soft);
  line-height: 1.4;
}

.rg-toast-text code {
  font-family: ui-monospace, monospace;
  font-size: 0.76rem;
  background: rgba(0, 0, 0, 0.06);
  padding: 1px 5px;
  border-radius: 4px;
  color: var(--rg-ink);
}

[data-bs-theme=dark] .rg-toast-text code {
  background: rgba(255, 255, 255, 0.08);
}

.rg-toast-undo {
  margin-top: 6px;
  background: transparent;
  border: 0;
  cursor: pointer;
  align-self: flex-start;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 0;
}

.rg-toast-undo:hover {
  color: var(--rg-accent);
}

.rg-toast-action {
  align-self: center;
}

.rg-toast-close {
  background: transparent;
  border: 0;
  cursor: pointer;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
  position: absolute;
  top: 8px;
  right: 8px;
}

.rg-toast-close:hover {
  background: rgba(0, 0, 0, 0.06);
  color: var(--rg-ink);
}

[data-bs-theme=dark] .rg-toast-close:hover {
  background: rgba(255, 255, 255, 0.08);
}

.rg-toast-progress {
  position: absolute;
  left: 3px;
  right: 0;
  bottom: 0;
  height: 2px;
  background: rgba(0, 0, 0, 0.06);
}

[data-bs-theme=dark] .rg-toast-progress {
  background: rgba(255, 255, 255, 0.08);
}

.rg-toast-progress span {
  display: block;
  height: 100%;
  background: currentColor;
  border-bottom-right-radius: 14px;
}

/* ════════════════════════════════════════════════════════
   sm button helper (chybí v rg)
   ════════════════════════════════════════════════════════ */
.rg-btn-sm {
  padding: 5px 12px;
  font-size: 0.82rem;
  border-radius: 9px;
}

/* ════════════════════════════════════════════════════════
   landing-tile (reuse z fase-1, replikujeme)
   ════════════════════════════════════════════════════════ */
.land-tile {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px;
  text-decoration: none;
  color: var(--rg-ink);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.15s, box-shadow 0.15s;
}

.land-tile:hover {
  transform: translateY(-2px);
  color: var(--rg-ink);
}

.land-tile .tile-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: flex;
  align-items: center;
  justify-content: center;
}

.land-tile .tile-title {
  font-weight: 700;
  font-size: 0.98rem;
}

.land-tile .tile-sub {
  color: var(--rg-mute);
  font-size: 0.78rem;
  line-height: 1.35;
}

.fin-page,
.finance-page {
  background: var(--rg-bg);
  min-height: 100%;
  padding-bottom: 60px;
}

.fin-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .fin-shell {
    padding: 16px 16px 30px;
  }
}

.finance-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .finance-shell {
    padding: 16px 16px 30px;
  }
}

.fin-pagehead {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.fin-pagehead .eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 4px;
}
.fin-pagehead h1 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.1rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  margin: 0 0 4px;
  color: var(--rg-ink);
}
.fin-pagehead h1 em {
  font-style: italic;
  color: var(--rg-accent);
  font-weight: 500;
}
.fin-pagehead .sub {
  color: var(--rg-mute);
  font-size: 0.95rem;
  max-width: 60ch;
}
.fin-pagehead .head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.fin-range {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 12px;
}
.fin-range a {
  border: none;
  background: transparent;
  padding: 7px 12px;
  border-radius: 9px;
  color: var(--rg-mute);
  cursor: pointer;
  font-weight: 600;
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
  text-decoration: none;
  display: inline-block;
}
.fin-range a.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}

.v1-hero {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 22px;
  box-shadow: var(--rg-shadow-sm);
  padding: 28px 32px;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 32px;
  margin-bottom: 18px;
  position: relative;
  overflow: hidden;
}
.v1-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 92% -10%, var(--rg-olive) 0, transparent 60%);
  pointer-events: none;
}
.v1-hero > * {
  position: relative;
  z-index: 1;
}

.v1-balance .lbl {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.v1-balance .val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 5.2rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 0.98;
  margin: 6px 0 2px;
  color: var(--rg-ink);
  font-variant-numeric: tabular-nums;
}
.v1-balance .val.pos {
  color: var(--rg-success);
}
.v1-balance .val.neg {
  color: var(--rg-danger);
}
.v1-balance .val .cur {
  font-size: 0.45em;
  color: var(--rg-mute);
  font-weight: 500;
  margin-left: 8px;
  letter-spacing: 0;
}
.v1-balance .delta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  font-size: 0.88rem;
  color: var(--rg-mute);
}
.v1-balance .delta .chip {
  background: var(--rg-success-bg);
  color: var(--rg-success);
  padding: 2px 8px;
  border-radius: 6px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.v1-balance .delta .chip.neg {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

.v1-ratio {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-self: center;
}

.v1-ratio-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.v1-ratio-row .side {
  display: flex;
  flex-direction: column;
}
.v1-ratio-row .side.right {
  align-items: flex-end;
  text-align: right;
}
.v1-ratio-row .lbl {
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.v1-ratio-row .num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  margin-top: 4px;
}
.v1-ratio-row .num.income {
  color: var(--rg-success);
}
.v1-ratio-row .num.expense {
  color: var(--rg-danger);
}

.v1-ratio-bar {
  position: relative;
  height: 22px;
  background: var(--rg-danger-bg);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--rg-line);
}
.v1-ratio-bar .income-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: var(--rg-success-bg);
  border-right: 1px solid var(--rg-success);
}
.v1-ratio-bar .income-fill::after {
  content: "";
  position: absolute;
  right: -3px;
  top: -2px;
  bottom: -2px;
  width: 6px;
  background: var(--rg-success);
  border-radius: 2px;
}

.v1-ratio .micro {
  font-size: 0.75rem;
  color: var(--rg-mute);
  display: flex;
  justify-content: space-between;
  font-variant-numeric: tabular-nums;
}

.v1-charts {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}

.v1-trend-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 20px 22px;
}

.v1-trend-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 14px;
}
.v1-trend-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}
.v1-trend-head .legend {
  font-size: 0.78rem;
  color: var(--rg-mute);
  display: inline-flex;
  gap: 16px;
}
.v1-trend-head .legend .sw {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.v1-trend-head .legend .dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  display: inline-block;
}
.v1-trend-head .legend .dot.dot-income {
  background: var(--rg-success);
}
.v1-trend-head .legend .dot.dot-expense {
  background: var(--rg-danger);
}

.v1-trend-chart {
  position: relative;
  height: 200px;
}

.fin-chart-empty {
  font-size: 0.88rem;
}

.v2-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 20px 22px;
}
.v2-card .head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4px;
}
.v2-card .head .sub {
  font-size: 0.78rem;
  color: var(--rg-mute);
}
.v2-card h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}

.v1-donut-card {
  display: flex;
  flex-direction: column;
}

.donut-body {
  display: flex;
  gap: 18px;
  align-items: center;
  flex: 1;
  margin-top: 12px;
}

.donut-chart-wrap {
  position: relative;
  width: 170px;
  height: 170px;
  flex-shrink: 0;
}

.v1-donut-chart {
  position: relative;
  width: 100%;
  height: 100%;
}

.donut-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  text-align: center;
}
.donut-center .dc-lbl {
  font-size: 0.58rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.donut-center .dc-val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--rg-ink);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  margin: 2px 0;
}
.donut-center .dc-sub {
  font-size: 0.65rem;
  color: var(--rg-mute);
}

.donut-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  justify-content: center;
}

.dl-item {
  display: grid;
  grid-template-columns: 13px 1fr auto auto;
  gap: 7px;
  align-items: center;
  font-size: 0.8rem;
}

.dl-swatch {
  width: 13px;
  height: 13px;
  border-radius: 3px;
  flex-shrink: 0;
  background: var(--cat-color);
}

.dl-label {
  color: var(--rg-ink);
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dl-amount {
  font-family: ui-monospace, monospace;
  font-variant-numeric: tabular-nums;
  color: var(--rg-ink);
  text-align: right;
  white-space: nowrap;
  font-size: 0.78rem;
}

.dl-pct {
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-size: 0.78rem;
  min-width: 36px;
  text-align: right;
}

.v1-donut-foot {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--rg-line);
  font-size: 0.8rem;
  color: var(--rg-mute);
  display: flex;
  justify-content: space-between;
}

.cat-lane-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  padding: 20px 22px;
  margin-bottom: 18px;
}

.cat-lane-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 16px;
}
.cat-lane-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}
.cat-lane-head .sub {
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.cat-lane {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px;
}

.cat-cell {
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  padding: 12px 12px 14px;
  background: var(--rg-paper);
  position: relative;
  transition: border-color 0.12s, transform 0.12s;
  cursor: pointer;
  text-decoration: none;
  display: block;
}
.cat-cell:hover {
  border-color: var(--rg-line-strong);
  transform: translateY(-1px);
}
.cat-cell.active {
  border-color: var(--rg-accent);
  box-shadow: 0 0 0 2px var(--rg-accent);
}
.cat-cell .emoji-tile {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  margin-bottom: 8px;
  background: var(--cat-bg);
  color: var(--cat-color);
}
.cat-cell .lbl {
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-weight: 600;
  margin-bottom: 2px;
}
.cat-cell .val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  color: var(--rg-ink);
}
.cat-cell .micro {
  font-size: 0.7rem;
  color: var(--rg-mute);
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
}
.cat-cell .pct-bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--rg-olive);
  border-radius: 0 0 11px 11px;
  overflow: hidden;
}
.cat-cell .pct-bar > span {
  display: block;
  height: 100%;
  background: var(--cat-color);
}

.ledger-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 32px;
}

.ledger-head {
  padding: 16px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--rg-line);
}
.ledger-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}
.ledger-head .count-badge {
  font-size: 0.78rem;
  color: var(--rg-mute);
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 999px;
  padding: 2px 10px;
}

.ledger-filterbar {
  padding: 12px 22px;
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--rg-cream);
  border-bottom: 1px solid var(--rg-line);
  flex-wrap: wrap;
}
.ledger-filterbar .fin-filter-label {
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-right: 4px;
}
.ledger-filterbar .fin-sep {
  width: 1px;
  height: 18px;
  background: var(--rg-line-strong);
  margin: 0 4px;
  display: inline-block;
}
.ledger-filterbar .chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--rg-ink);
  cursor: pointer;
  text-decoration: none;
}
.ledger-filterbar .chip.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: transparent;
}
.ledger-filterbar .chip .emoji {
  font-size: 0.9rem;
}
.ledger-filterbar .chip .fin-arrow--income {
  color: var(--rg-success);
}
.ledger-filterbar .chip .fin-arrow--expense {
  color: var(--rg-danger);
}

.ledger-rows {
  display: flex;
  flex-direction: column;
}

.ledger-empty {
  text-align: center;
  padding: 48px 22px;
  color: var(--rg-mute);
}
.ledger-empty p {
  margin-top: 12px;
  font-size: 0.9rem;
}

.ledger-daygroup {
  display: flex;
  flex-direction: column;
}

.ledger-dayhead {
  padding: 10px 22px 6px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  background: linear-gradient(to bottom, var(--rg-cream) 0%, transparent 100%);
  border-bottom: 1px dashed var(--rg-line);
}
.ledger-dayhead .day {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.ledger-dayhead .day em {
  font-style: italic;
  color: var(--rg-mute);
  font-weight: 500;
  margin-left: 6px;
}
.ledger-dayhead .net {
  font-size: 0.78rem;
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
}
.ledger-dayhead .net strong {
  color: var(--rg-ink);
}
.ledger-dayhead .net .pos {
  color: var(--rg-success);
}
.ledger-dayhead .net .neg {
  color: var(--rg-danger);
}

.ledger-row {
  display: grid;
  grid-template-columns: 44px 1.6fr 1fr 1fr 120px auto;
  gap: 14px;
  align-items: center;
  padding: 12px 22px;
  border-bottom: 1px solid var(--rg-line);
  transition: background 0.12s;
}
.ledger-row:hover {
  background: var(--rg-cream);
}
.ledger-row:last-child {
  border-bottom: 0;
}
.ledger-row:hover .row-actions {
  opacity: 1;
}
.ledger-row .cat-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  background: var(--cat-bg);
  color: var(--cat-color);
}
.ledger-row .desc {
  min-width: 0;
}
.ledger-row .desc .ttl {
  font-size: 0.95rem;
  color: var(--rg-ink);
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ledger-row .desc .meta {
  font-size: 0.76rem;
  color: var(--rg-mute);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}
.ledger-row .desc .meta .sync {
  color: var(--rg-success);
}
.ledger-row .desc .meta .meta-sep {
  opacity: 0.4;
}
.ledger-row .cat-name {
  font-size: 0.85rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
}
.ledger-row .degu-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  padding: 3px 9px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 999px;
  color: var(--rg-ink);
  text-decoration: none;
  width: fit-content;
}
.ledger-row .degu-tag:hover {
  border-color: var(--rg-line-strong);
}
.ledger-row .degu-tag .swatch {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
  background: #888;
}
.ledger-row .degu-tag.empty {
  background: transparent;
  border-color: transparent;
  color: var(--rg-mute);
  font-style: italic;
}
.ledger-row .amt {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  font-size: 0.98rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ledger-row .amt.income {
  color: var(--rg-success);
}
.ledger-row .amt.expense {
  color: var(--rg-danger);
}
.ledger-row .row-actions {
  display: inline-flex;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.12s;
}
.ledger-row .iconbtn {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  color: var(--rg-mute);
  cursor: pointer;
  text-decoration: none;
}
.ledger-row .iconbtn:hover {
  color: var(--rg-ink);
  border-color: var(--rg-line-strong);
}
.ledger-row .iconbtn.danger:hover {
  color: var(--rg-danger);
  border-color: var(--rg-danger);
}
.ledger-row .iconbtn.fin-invisible {
  visibility: hidden;
}
.ledger-row .fin-delete-form {
  display: inline-flex;
}

@media (width < 768px) {
  .v1-hero {
    grid-template-columns: 1fr;
  }
  .v1-balance .val {
    font-size: 3.4rem;
  }
  .v1-charts {
    grid-template-columns: 1fr;
  }
  .cat-lane {
    grid-template-columns: repeat(4, 1fr);
  }
  .fin-shell {
    padding: 14px 14px 28px;
  }
}
@media (width < 480px) {
  .cat-lane {
    grid-template-columns: repeat(2, 1fr);
  }
  .ledger-row {
    grid-template-columns: 44px 1fr auto auto;
  }
  .ledger-row .cat-name {
    display: none;
  }
  .ledger-row .degu-tag {
    display: none;
  }
}
.fin-range-sep {
  display: inline-block;
  width: 1px;
  height: 18px;
  background: var(--rg-line-strong);
  align-self: center;
  margin: 0 4px;
}

.yearly-summary-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-bottom: 18px;
}

.ys-head {
  padding: 16px 22px;
  border-bottom: 1px solid var(--rg-line);
}
.ys-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}

.ys-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.ys-table th {
  text-align: left;
  color: var(--rg-mute);
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 10px 22px 8px;
  border-bottom: 1px solid var(--rg-line);
}
.ys-table th:not(:first-child) {
  text-align: right;
}
.ys-table td {
  padding: 11px 22px;
  border-bottom: 1px solid var(--rg-line);
  font-variant-numeric: tabular-nums;
}
.ys-table td:not(:first-child) {
  text-align: right;
}
.ys-table tbody tr:last-child td {
  border-bottom: none;
}
.ys-table tbody tr.active td {
  background: var(--rg-cream);
}
.ys-table td.income {
  color: var(--rg-success);
}
.ys-table td.expense {
  color: var(--rg-danger);
}
.ys-table td.pos {
  color: var(--rg-success);
  font-weight: 600;
}
.ys-table td.neg {
  color: var(--rg-danger);
  font-weight: 600;
}
.ys-table td:first-child a {
  color: var(--rg-ink);
  font-weight: 600;
  text-decoration: none;
}
.ys-table td:first-child a:hover {
  color: var(--rg-accent);
}
@media (width < 600px) {
  .ys-table th,
  .ys-table td {
    padding: 9px 12px;
  }
}

.help-page {
  min-height: 100vh;
}

.help-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .help-shell {
    padding: 16px 16px 30px;
  }
}

.help-toc {
  margin-bottom: 3rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--rg-line-strong);
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.25rem;
  counter-reset: toc-counter;
}
.help-toc a {
  font-size: 0.8rem;
  padding: 0.25rem 0.7rem;
  border-radius: 99px;
  border: 1px solid var(--bs-border-color);
  color: var(--bs-body-color);
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s;
  counter-increment: toc-counter;
}
.help-toc a::before {
  content: counter(toc-counter) ". ";
  font-weight: 700;
  color: var(--rg-accent);
  margin-right: 0.1em;
}
.help-toc a:hover {
  background: var(--rg-cream);
  border-color: var(--rg-accent);
  color: var(--rg-accent);
}

.help-section {
  padding: 3rem 0;
  border-bottom: 1px solid var(--bs-border-color);
  scroll-margin-top: 80px;
}

.help-section-alt {
  background: var(--rg-cream);
  border-radius: 12px;
  padding: 3rem 2rem;
  margin: 0 -2rem;
  border: none;
  border-bottom: none;
  position: relative;
}
.help-section-alt + .help-section {
  padding-top: 3rem;
}

.help-section-header {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 2rem;
}

.help-section-num {
  font-size: 1.9rem;
  font-weight: 800;
  line-height: 1;
  color: var(--rg-accent);
  background: color-mix(in srgb, var(--rg-accent) 12%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--rg-accent) 30%, transparent);
  border-radius: 10px;
  padding: 0.45rem 0.9rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
  letter-spacing: -0.01em;
}

.help-section-header h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 0.2rem;
}

.help-section-sub {
  color: var(--bs-secondary-color);
  font-size: 0.9rem;
  margin: 0;
}

.help-section-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: start;
}

.help-section-body-rev {
  direction: rtl;
}
.help-section-body-rev > * {
  direction: ltr;
}

@media (max-width: 768px) {
  .help-section-body,
  .help-section-body-rev {
    grid-template-columns: 1fr;
    direction: ltr;
  }
  .help-section-alt {
    margin: 0;
    padding: 2rem 1rem;
  }
}
.help-screenshot {
  position: relative;
  cursor: zoom-in;
}
.help-screenshot img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
  transition: opacity 0.15s;
}
.help-screenshot:hover img {
  opacity: 0.88;
}
.help-screenshot::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 10px;
  pointer-events: none;
  transition: box-shadow 0.15s;
}
.help-screenshot:hover::after {
  box-shadow: inset 0 0 0 2px var(--rg-accent);
}
.help-screenshot:hover .help-zoom-badge {
  opacity: 1;
}

.help-screenshot-caption {
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
  margin-top: 0.5rem;
  text-align: center;
}

.help-zoom-badge {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  border-radius: 6px;
  padding: 0.2rem 0.45rem;
  font-size: 0.72rem;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  opacity: 0;
  transition: opacity 0.15s;
  pointer-events: none;
}

.help-text p {
  color: var(--bs-body-color);
  line-height: 1.7;
  margin-bottom: 1rem;
}

.help-feature-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin: 1.25rem 0;
}

.help-feature-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.9rem;
}

.help-feature-icon {
  color: var(--rg-accent);
  flex-shrink: 0;
}

.help-steps {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 1.25rem 0;
}

.help-step {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  font-size: 0.9rem;
  line-height: 1.5;
}

.help-step-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--rg-accent);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.05rem;
}

.help-step-icon {
  color: var(--rg-accent);
  flex-shrink: 0;
  margin-top: 0.15rem;
}

.help-tip {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  background: color-mix(in srgb, var(--rg-accent) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--rg-accent) 25%, transparent);
  border-radius: 8px;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  margin: 1.25rem 0;
  color: var(--bs-body-color);
}
.help-tip svg {
  color: var(--rg-accent);
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.help-pedigree-screenshots {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
}
.help-pedigree-screenshots .help-screenshot {
  margin: 0;
}

.help-charts-grid {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.help-chart-block {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.help-chart-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.help-chart-badge {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--rg-accent);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--rg-accent-2);
  color: var(--rg-bg);
}

.help-chart-label strong {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--rg-ink);
}

.help-chart-desc {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--rg-ink-soft);
  margin: 0;
}

.help-subsection {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid var(--rg-line);
}

.help-subsection-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 1.25rem;
  color: var(--rg-ink);
}
.help-subsection-title svg {
  color: var(--rg-accent);
  flex-shrink: 0;
}

.help-types-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
@media (max-width: 640px) {
  .help-types-grid {
    grid-template-columns: 1fr;
  }
}
.help-types-grid {
  margin-top: 0.75rem;
}

.help-type-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
  display: flex;
  gap: 0.65rem;
  align-items: flex-start;
}
.help-type-card strong {
  font-size: 0.85rem;
  font-weight: 600;
  display: block;
  margin-bottom: 0.2rem;
  color: var(--rg-ink);
}
.help-type-card p {
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--rg-ink-soft);
  margin: 0;
}

.help-type-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 0.35rem;
}

.help-form-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 640px) {
  .help-form-detail {
    grid-template-columns: 1fr;
  }
}
.help-form-detail {
  margin-top: 2.5rem;
}

.help-form-step {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  display: flex;
  gap: 0.85rem;
}

.help-form-step-badge {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--rg-accent);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.help-form-step-body h3 {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0 0 0.25rem;
  color: var(--rg-ink);
}
.help-form-step-body p {
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--rg-ink-soft);
  margin: 0;
}

.help-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
@media (max-width: 640px) {
  .help-info-grid {
    grid-template-columns: 1fr;
  }
}
.help-info-grid {
  margin: 1.25rem 0;
}

.help-info-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line-strong);
  border-radius: 8px;
  padding: 0.75rem 1rem;
}

.help-info-card-title {
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--bs-secondary-color);
  margin-bottom: 0.25rem;
}

.help-info-card-body {
  font-size: 0.875rem;
  line-height: 1.5;
}

.help-cta {
  margin-top: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  text-decoration: none;
}

.help-legend {
  margin: 1.25rem 0;
  border: 1px solid var(--bs-border-color);
  border-radius: 8px;
  overflow: hidden;
}

.help-legend-title {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--bs-secondary-color);
  padding: 0.5rem 0.85rem;
  background: var(--rg-cream);
  border-bottom: 1px solid var(--rg-line-strong);
}

.help-legend-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.45rem 0.85rem;
  font-size: 0.875rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.help-legend-item:last-child {
  border-bottom: none;
}

.help-legend-swatch {
  width: 20px;
  height: 16px;
  flex-shrink: 0;
  display: inline-block;
  border: 1px solid transparent;
}

.help-footer-cta {
  margin-top: 4rem;
  background: var(--rg-cream);
  border: 1px solid var(--bs-border-color);
  border-radius: 14px;
  padding: 3rem 2rem;
  text-align: center;
}

.help-footer-cta-inner {
  max-width: 520px;
  margin: 0 auto;
}

.help-footer-cta .eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.help-footer-cta h3 {
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.help-footer-cta p {
  color: var(--bs-secondary-color);
  margin-bottom: 1.5rem;
}

.help-lb-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.88);
  z-index: 9999;
  overflow: hidden;
  animation: lbFadeIn 0.18s ease;
}

@keyframes lbFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.help-lb-stage {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-in;
  user-select: none;
  touch-action: none;
}
.help-lb-stage.zoomed {
  cursor: grab;
}
.help-lb-stage.dragging {
  cursor: grabbing;
}

.help-lb-img {
  max-width: 92vw;
  max-height: 90vh;
  border-radius: 8px;
  box-shadow: 0 8px 60px rgba(0, 0, 0, 0.6);
  pointer-events: none;
  transform-origin: center center;
  will-change: transform;
  animation: lbZoomIn 0.18s ease;
  display: block;
}

@keyframes lbZoomIn {
  from {
    transform: scale(0.93);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.help-lb-close {
  position: fixed;
  top: 1.2rem;
  right: 1.4rem;
  background: rgba(255, 255, 255, 0.12);
  border: none;
  color: #fff;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 1.2rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  z-index: 10001;
}
.help-lb-close:hover {
  background: rgba(255, 255, 255, 0.25);
}

.help-lb-controls {
  position: fixed;
  top: 1.2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 0.35rem;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 999px;
  padding: 0.25rem 0.4rem;
  z-index: 10001;
}

.help-lb-btn {
  background: rgba(255, 255, 255, 0.12);
  border: none;
  color: #fff;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  font-size: 1.1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: background 0.12s;
}
.help-lb-btn:hover {
  background: rgba(255, 255, 255, 0.28);
}

.help-lb-scale {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
  min-width: 3ch;
  text-align: center;
}

.help-lb-hint {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.6);
  color: rgba(255, 255, 255, 0.7);
  border-radius: 6px;
  padding: 0.35rem 0.9rem;
  font-size: 0.75rem;
  pointer-events: none;
  white-space: nowrap;
  z-index: 10001;
  transition: opacity 0.3s;
}

.help-lb-caption {
  position: fixed;
  bottom: 3.5rem;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  border-radius: 6px;
  padding: 0.4rem 1rem;
  font-size: 0.8rem;
  max-width: 80vw;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  z-index: 10001;
}

@media print {
  nav,
  header,
  footer,
  .help-toc,
  .help-zoom-badge,
  .help-lb-overlay,
  .help-footer-cta .rg-btn,
  .help-screenshot::after {
    display: none !important;
  }
  .help-page {
    min-height: unset;
  }
  .help-shell {
    max-width: 100%;
    padding: 0;
  }
  .form-pageheader {
    padding: 1.5rem 0 1rem;
    border-bottom: 2pt solid #000;
    margin-bottom: 2rem;
  }
  .help-section {
    padding: 1.25rem 0;
    border-bottom: 0.5pt solid #bbb;
    break-before: auto;
    break-inside: avoid;
  }
  .help-section-alt {
    background: #f5f5f5 !important;
    margin: 0;
    border: 1pt solid #ccc !important;
    border-radius: 4px;
    padding: 1.25rem 1rem;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .help-section-num {
    font-size: 1.3rem;
    padding: 0.3rem 0.65rem;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .help-section-body,
  .help-section-body-rev {
    grid-template-columns: 1fr !important;
    direction: ltr !important;
    gap: 1rem;
  }
  .help-screenshot {
    cursor: default;
  }
  .help-screenshot img {
    max-width: 100%;
    box-shadow: none;
    border: 0.5pt solid #bbb;
    border-radius: 4px;
  }
  .help-type-card,
  .help-form-step,
  .help-info-card {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    break-inside: avoid;
  }
  .help-types-grid,
  .help-form-detail,
  .help-info-grid {
    grid-template-columns: 1fr 1fr;
  }
  .help-step-num,
  .help-form-step-badge,
  .help-chart-badge {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .help-tip {
    border-left: 3pt solid var(--rg-accent);
    background: none !important;
    border-radius: 0;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .help-subsection {
    break-inside: avoid;
  }
  .help-footer-cta {
    background: none;
    border: 0.5pt solid #ccc;
    padding: 1rem;
  }
  body,
  .help-text p,
  .help-step,
  .help-feature-item {
    color: #000;
  }
}
.help-type-dot.blue {
  background: #60a5fa;
}

.help-type-dot.green {
  background: #34d399;
}

.help-type-dot.red {
  background: #f87171;
}

.help-type-dot.pink {
  background: #e879f9;
}

.help-type-dot.orange {
  background: #fb923c;
}

.help-type-dot.purple {
  background: #a78bfa;
}

.help-legend-swatch.chr-male {
  border: 2px solid #2583ff;
  border-radius: 2px;
}

.help-legend-swatch.chr-female {
  border: 2px solid #ff25c1;
  border-radius: 8px;
}

.help-legend-swatch.chr-recessive {
  background: #198754;
  border-radius: 3px;
}

.help-legend-swatch.chr-het {
  background: #f97316;
  border-radius: 3px;
}

.help-legend-swatch.chr-het2 {
  background: #e65c00;
  border-radius: 2px;
}

.help-legend-swatch.chr-dominant {
  background: #7a5200;
  border-radius: 3px;
}

.help-info-card.success {
  border-left: 3px solid #22c55e;
}

.help-info-card.warn {
  border-left: 3px solid #f97316;
}

.help-info-card.danger {
  border-left: 3px solid #ef4444;
}

.help-screenshot.flush {
  margin: 0;
}

.help-screenshot.mt-sm {
  margin-top: 0.75rem;
}

.help-form-detail.mt-sm {
  margin-top: 1rem;
}

.help-tip.mt-sm {
  margin-top: 1rem;
}

.help-info-grid.mt-sm {
  margin-top: 1rem;
}

.help-types-grid.mt-sm {
  margin-top: 0.75rem;
}

.help-screenshot img {
  border-radius: 8px;
}

.help-screenshot-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex: 1 1 400px;
  min-width: 0;
}

.help-section-h3 {
  font-size: 1rem;
  font-weight: 600;
  margin: 1.25rem 0 0.5rem;
}

.help-form-detail.mb-sm {
  margin-bottom: 1rem;
}

.help-info-card.primary {
  border-left: 3px solid var(--rg-color-primary, var(--rg-accent));
}

.help-info-card.secondary {
  border-left: 3px solid var(--rg-color-secondary, var(--rg-mute));
}

.help-type-dot.accent {
  background: var(--rg-accent);
}

[data-controller=pwa-install] {
  display: contents;
}

[data-pwa-banner] {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  right: 1rem;
  z-index: 9999;
  background: var(--rg-paper);
  border: 1px solid #e5e0d5;
  border-radius: 0.75rem;
  box-shadow: 0 4px 24px rgba(31, 29, 24, 0.15);
  display: flex;
  gap: 0.75rem;
  max-width: 400px;
  margin: 0 auto;
}

[data-pwa-install-target=iosBanner] {
  padding: 1rem 1rem 0.875rem;
  align-items: flex-start;
}

[data-pwa-install-target=androidBanner] {
  padding: 1rem;
  align-items: center;
}

.pwa-banner-icon {
  border-radius: 0.5rem;
  flex-shrink: 0;
}

.pwa-banner-body {
  flex: 1;
  min-width: 0;
}

.pwa-banner-title {
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--rg-ink);
  margin-bottom: 0.2rem;
}

.pwa-banner-text {
  font-size: 0.8125rem;
  color: var(--rg-ink-soft);
  line-height: 1.4;
}

.pwa-banner-dismiss {
  background: none;
  border: none;
  padding: 0.25rem;
  cursor: pointer;
  color: var(--rg-mute);
  line-height: 1;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.pwa-banner-install {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border: none;
  border-radius: 0.5rem;
  padding: 0.5rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.rg-modal-content {
  border-radius: 18px;
  border: 1px solid var(--rg-line-strong);
  box-shadow: 0 24px 60px -12px rgba(0, 0, 0, 0.4), 0 8px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  background: var(--rg-paper);
}

.rg-modal-header {
  border-bottom: 1px solid var(--rg-line);
  padding: 20px 24px 16px;
  background: color-mix(in oklab, var(--rg-paper) 96%, black);
}

.rg-modal-footer {
  display: flex;
  align-items: center;
  border-top: 1px solid var(--rg-line);
  padding: 14px 24px;
  gap: 10px;
  background: color-mix(in oklab, var(--rg-paper) 96%, black);
}

.rg-modal-spacer {
  flex: 1;
}

.rg-modal-body-preview {
  max-height: 70vh;
  overflow: hidden;
  background: var(--rg-cream);
}

.rg-modal-close-icon {
  width: 16px;
  height: 16px;
}

.rg-modal-max-440 {
  max-width: 440px;
}

.rg-modal-body-form {
  margin: 0;
  border-radius: 0;
  background: var(--rg-cream);
  padding: 20px 24px;
}

.crop-preview-container {
  border-radius: 12px;
  overflow: hidden;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  margin-bottom: 20px;
}
.crop-preview-container img {
  max-width: 100%;
  display: block;
}

.flex-row-end {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.stats-shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 22px 28px 40px;
}
@media (max-width: 720px) {
  .stats-shell {
    padding: 16px 16px 30px;
  }
}

.kpi-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.kpi-tile {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  padding: 20px 22px;
  box-shadow: var(--rg-shadow-sm);
  position: relative;
  overflow: hidden;
}
.kpi-tile .kpi-icon {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.8;
}
.kpi-tile.degus .kpi-icon {
  background: rgba(217, 119, 6, 0.1);
  color: var(--rg-accent);
}
.kpi-tile.breeders .kpi-icon {
  background: rgba(10, 78, 168, 0.1);
  color: var(--rg-male);
}
.kpi-tile.litters .kpi-icon {
  background: rgba(168, 32, 95, 0.1);
  color: var(--rg-female);
}
.kpi-tile.sale .kpi-icon {
  background: var(--rg-warn-bg);
  color: var(--rg-warn);
}
.kpi-tile .kpi-lbl {
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 8px;
}
.kpi-tile .kpi-val {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--rg-ink);
  font-variant-numeric: tabular-nums;
}
.kpi-tile .kpi-delta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 10px;
  font-size: 0.82rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.kpi-tile .kpi-delta.up {
  color: var(--rg-success);
}
.kpi-tile .kpi-delta.down {
  color: var(--rg-danger);
}
.kpi-tile .kpi-delta .since {
  color: var(--rg-mute);
  font-weight: 500;
}
.kpi-tile .spark, .kpi-tile .spark-svg {
  margin-top: 12px;
  height: 36px;
  width: 100%;
  display: block;
}

.kpi-stat-bar {
  margin-top: 12px;
  height: 36px;
  background: var(--rg-olive);
  border-radius: 8px;
  display: flex;
  align-items: center;
  padding: 0 10px;
}
.kpi-stat-bar .lbl {
  font-size: 0.75rem;
  color: var(--rg-mute);
}

.stat-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.stat-card-head {
  padding: 16px 22px 8px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.stat-card-head .ic {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.stat-card-head .ic.female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}
.stat-card-head .ic.male {
  background: var(--rg-male-bg);
  color: var(--rg-male);
}
.stat-card-head .ic.success {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}
.stat-card-head h3 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.12rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  margin: 0;
}
.stat-card-head .sub {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.stat-card-head .right-meta {
  margin-left: auto;
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.stat-card-body {
  padding: 8px 22px 20px;
  flex-grow: 1;
}
.stat-card-body.no-pad {
  padding: 0;
}

.stat-grid-2 {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 16px;
  margin-bottom: 18px;
}

.stat-grid-2-eq {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 18px;
}

.stat-grid-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
  margin-bottom: 18px;
}

.stat-extra-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.stat-extra-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px dashed var(--rg-line);
}
.stat-extra-row.last {
  border-bottom: none;
}

.stat-extra-lbl {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}

.stat-extra-sub {
  font-size: 0.88rem;
  color: var(--rg-mute);
  margin-top: 2px;
}

.stat-extra-val-wrap {
  text-align: right;
}

.stat-big-num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--rg-ink);
}

.stat-pct {
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.legend-row {
  display: flex;
  gap: 14px;
  padding-top: 10px;
  font-size: 0.8rem;
  color: var(--rg-mute);
}
.legend-row.mt-lg {
  margin-top: 24px;
}
.legend-row .swatch {
  width: 12px;
  height: 4px;
  border-radius: 2px;
  display: inline-block;
  margin-right: 6px;
  vertical-align: 2px;
}

.donut-wrap {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}

.donut-wrap.wide {
  flex-direction: row;
  align-items: flex-start;
  gap: 32px;
}

.donut {
  width: 160px;
  height: 160px;
  flex-shrink: 0;
  position: relative;
}
.donut svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.donut .center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.donut .center .num {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.donut .center .lbl {
  font-size: 0.7rem;
  color: var(--rg-mute);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  margin-top: 4px;
}

.donut-legend {
  flex-grow: 1;
}
.donut-legend.grid3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  min-width: 260px;
}
.donut-legend {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.donut-legend .dl-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px dashed var(--rg-line);
}
.donut-legend .dl-item:last-child, .donut-legend .dl-item.full {
  border-bottom: none;
}
.donut-legend .dl-item .swatch {
  width: 12px;
  height: 12px;
  border-radius: 3px;
}
.donut-legend .dl-item .lbl {
  flex-grow: 1;
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
}
.donut-legend .dl-item .val {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.donut-legend .dl-item .pct {
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.hbar-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hbar-row {
  display: grid;
  grid-template-columns: 120px 1fr 60px;
  gap: 10px;
  align-items: center;
}
.hbar-row.compact {
  grid-template-columns: 90px 1fr 40px;
}
.hbar-row .lbl {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--rg-ink-soft);
  display: flex;
  align-items: center;
  gap: 8px;
}
.hbar-row .lbl .swatch {
  width: 14px;
  height: 14px;
  border-radius: 3px;
}
.hbar-row .bar {
  height: 14px;
  border-radius: 7px;
  background: var(--rg-olive);
  position: relative;
  overflow: hidden;
}
.hbar-row .bar > span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: 7px;
}
.hbar-row .val {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  color: var(--rg-ink);
  font-size: 0.85rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.vbars-wrap {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 6px;
  align-items: end;
  height: 180px;
  padding: 0 4px;
}

.vbar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
}
.vbar-col .v {
  width: 100%;
  max-width: 32px;
  background: var(--rg-accent);
  border-radius: 6px 6px 0 0;
  position: relative;
}
.vbar-col .v.muted {
  background: var(--rg-olive);
}
.vbar-col .v.peak {
  background: var(--rg-ink);
}
.vbar-col .lbl {
  font-size: 0.7rem;
  color: var(--rg-mute);
  font-weight: 600;
}

.pyramid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pyramid-head {
  display: grid;
  grid-template-columns: 1fr 70px 1fr;
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 6px;
}
.pyramid-head .left {
  text-align: right;
  color: var(--rg-female);
}
.pyramid-head .right {
  text-align: left;
  color: var(--rg-male);
}
.pyramid-head .mid {
  text-align: center;
}

.pyramid-row {
  display: grid;
  grid-template-columns: 1fr 70px 1fr;
  align-items: center;
  gap: 12px;
}
.pyramid-row .lbl {
  text-align: center;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--rg-ink);
  font-variant-numeric: tabular-nums;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  padding: 4px 0;
  border-radius: 8px;
}
.pyramid-row .female-bar, .pyramid-row .male-bar {
  height: 18px;
  border-radius: 4px;
  position: relative;
}
.pyramid-row .female-bar {
  background: var(--rg-female);
  justify-self: end;
}
.pyramid-row .male-bar {
  background: var(--rg-male);
  justify-self: start;
}

.kraj-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.kraj-list .row {
  display: grid;
  grid-template-columns: 22px 1fr 60px 40px;
  gap: 8px;
  align-items: center;
  padding: 6px 8px;
  border-radius: 8px;
}
.kraj-list .row:hover {
  background: var(--rg-cream);
}
.kraj-list .row .rank {
  color: var(--rg-mute);
  font-weight: 700;
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
}
.kraj-list .row .lbl-kraj {
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
}
.kraj-list .row .bar {
  height: 8px;
  border-radius: 999px;
  background: var(--rg-olive);
  position: relative;
}
.kraj-list .row .bar > span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var(--rg-accent);
  border-radius: 999px;
}
.kraj-list .row .val {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  text-align: right;
  font-size: 0.85rem;
}

.leaderboard {
  display: flex;
  flex-direction: column;
}

.lb-row {
  display: grid;
  grid-template-columns: 28px 38px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 10px 14px;
  border-top: 1px solid var(--rg-line);
}
.lb-row:first-child {
  border-top: none;
}
.lb-row:hover {
  background: var(--rg-cream);
}
.lb-row .rank {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--rg-mute);
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.lb-row .avatar {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: linear-gradient(135deg, #d97706, #a8470a);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 0.85rem;
  font-weight: 700;
  flex-shrink: 0;
}
.lb-row .info .nm {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rg-ink);
}
.lb-row .info .sub {
  font-size: 0.78rem;
  color: var(--rg-mute);
}
.lb-row .metric {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.lb-row .metric-lbl {
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.lb-row .secondary {
  font-size: 0.78rem;
  color: var(--rg-mute);
  text-align: right;
}

.heatmap-wrap { /* wrapper for heatmap + legend */ }

.heatmap {
  display: grid;
  grid-template-columns: 36px repeat(24, 1fr);
  gap: 3px;
}
.heatmap .hh, .heatmap .dd {
  font-size: 0.68rem;
  color: var(--rg-mute);
  font-family: ui-monospace, monospace;
  display: flex;
  align-items: center;
  justify-content: center;
}
.heatmap .cell {
  aspect-ratio: 1/1;
  min-height: 14px;
  border-radius: 3px;
  background: var(--rg-olive);
}
.heatmap .cell.v1 {
  background: color-mix(in oklab, var(--rg-accent) 18%, var(--rg-olive));
}
.heatmap .cell.v2 {
  background: color-mix(in oklab, var(--rg-accent) 35%, var(--rg-olive));
}
.heatmap .cell.v3 {
  background: color-mix(in oklab, var(--rg-accent) 55%, var(--rg-olive));
}
.heatmap .cell.v4 {
  background: color-mix(in oklab, var(--rg-accent) 78%, var(--rg-olive));
}
.heatmap .cell.v5 {
  background: var(--rg-accent);
}

.heatmap-legend {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.74rem;
  color: var(--rg-mute);
  margin-top: 8px;
  justify-content: flex-end;
}
.heatmap-legend .scale span:nth-child(1) {
  background: var(--rg-olive);
}
.heatmap-legend .scale span:nth-child(2) {
  background: color-mix(in oklab, var(--rg-accent) 18%, var(--rg-olive));
}
.heatmap-legend .scale span:nth-child(3) {
  background: color-mix(in oklab, var(--rg-accent) 35%, var(--rg-olive));
}
.heatmap-legend .scale span:nth-child(4) {
  background: color-mix(in oklab, var(--rg-accent) 55%, var(--rg-olive));
}
.heatmap-legend .scale span:nth-child(5) {
  background: color-mix(in oklab, var(--rg-accent) 78%, var(--rg-olive));
}
.heatmap-legend .scale span:nth-child(6) {
  background: var(--rg-accent);
}

.fact-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.fact-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px 20px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.fact-card .ic-tile {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.fact-card .lbl {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
}
.fact-card h4 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.1;
  margin: 2px 0 4px;
  color: var(--rg-ink);
}
.fact-card .desc {
  font-size: 0.85rem;
  color: var(--rg-ink-soft);
  line-height: 1.4;
}
.fact-card .desc a {
  color: var(--rg-ink);
  font-weight: 600;
  text-decoration: none;
}
.fact-card .desc a:hover {
  text-decoration: underline;
}

.stat-empty {
  color: var(--rg-mute);
  font-size: 0.88rem;
  padding: 12px 0;
}

.dl-item .lbl-sm {
  color: var(--rg-mute);
  font-size: 0.78rem;
}

.dl-item .val-mono {
  font-family: ui-monospace, monospace;
}

.top-parents-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.top-parents-head {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 8px;
}
.top-parents-head.female {
  color: var(--rg-female);
}
.top-parents-head.male {
  color: var(--rg-male);
}

.top-parents-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 0;
  border-bottom: 1px dashed var(--rg-line);
}

.top-parents-link {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--rg-ink);
  text-decoration: none;
}
.top-parents-link:hover {
  text-decoration: underline;
}

.top-parents-count-f {
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--rg-female);
}

.top-parents-count-m {
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--rg-male);
}

.chart-min {
  min-height: 240px;
}

@media (width < 1100px) {
  .stat-grid-2, .stat-grid-2-eq, .stat-grid-3 {
    grid-template-columns: 1fr;
  }
  .kpi-strip {
    grid-template-columns: repeat(2, 1fr);
  }
  .fact-row {
    grid-template-columns: 1fr 1fr;
  }
}
@media (width < 640px) {
  .kpi-strip {
    grid-template-columns: 1fr 1fr;
  }
  .donut-wrap.wide {
    flex-direction: column;
  }
}
.fact-card a {
  color: inherit;
  text-decoration: none;
}
.fact-card a:hover {
  text-decoration: underline;
}
.fact-card .ic-tile.success {
  background: var(--rg-success-bg);
  color: var(--rg-success);
}
.fact-card .ic-tile.female {
  background: var(--rg-female-bg);
  color: var(--rg-female);
}

.data-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 18px;
  box-shadow: var(--rg-shadow-sm);
  overflow: hidden;
  margin-top: 18px;
  margin-bottom: 18px;
}
.data-card .dc-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--rg-line);
}
.data-card .dc-head-main {
  flex: 1;
}
.data-card .dc-title {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--rg-ink);
  display: flex;
  align-items: center;
  gap: 6px;
}
.data-card .dc-title.female {
  color: var(--rg-female);
}
.data-card .dc-sub {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-top: 2px;
}
.data-card table {
  width: 100%;
  border-collapse: collapse;
}
.data-card thead th {
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--rg-mute);
  padding: 10px 14px;
  background: var(--rg-cream);
  text-align: left;
  border-bottom: 1px solid var(--rg-line);
}
.data-card tbody td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--rg-line);
  font-size: 0.88rem;
  vertical-align: middle;
}
.data-card tbody tr:last-child td {
  border-bottom: 0;
}

.dc-count-badge {
  font-family: ui-monospace, monospace;
  font-size: 0.82rem;
  background: var(--rg-female-bg);
  color: var(--rg-female);
  border-radius: 999px;
  padding: 1px 9px;
  margin-left: 6px;
}

.rg-dashboard-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}
@media (min-width: 992px) {
  .rg-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: dense;
    gap: 24px;
  }
  .rg-dashboard-grid.is-masonry {
    grid-auto-rows: 1px;
    row-gap: 0;
    column-gap: 24px;
    align-items: start;
  }
}
.rg-dashboard-grid > * {
  width: 100%;
  min-width: 0;
}
@media (min-width: 992px) {
  .rg-dashboard-grid > * {
    display: flex;
    align-self: start;
  }
  .rg-dashboard-grid > * .dashboard-widget-shell {
    flex: 1;
  }
}
@media (min-width: 992px) {
  .rg-dashboard-grid > :only-child, .rg-dashboard-grid > .widget-wrapper--large {
    grid-column: 1/-1;
  }
}
@media (min-width: 992px) {
  .rg-dashboard-grid > .widget-wrapper--compact {
    align-self: start;
  }
}
.rg-dashboard-grid > .widget-wrapper--compact .dashboard-widget-shell {
  padding: 14px 16px;
  gap: 12px;
}
.rg-dashboard-grid > .widget-wrapper--compact .widget-shell__header {
  padding-bottom: 8px;
}
.rg-dashboard-grid > .widget-wrapper--compact .widget-shell__footer {
  padding-top: 8px;
}
.rg-dashboard-grid > .widget-wrapper--large .dashboard-widget-shell {
  padding: 24px;
  gap: 20px;
}

.dashboard-widget-shell {
  background: radial-gradient(circle at top right, rgba(217, 119, 6, 0.12), transparent 36%), linear-gradient(180deg, color-mix(in oklab, var(--rg-paper) 84%, transparent), color-mix(in oklab, var(--rg-paper) 72%, transparent)), var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-shadow: var(--rg-shadow-sm);
  position: relative;
  overflow: hidden;
}

.widget-shell__header,
.widget-shell__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.widget-shell__header {
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--rg-line);
}

.widget-shell__footer {
  padding-top: 12px;
  border-top: 1px dashed var(--rg-line);
}

.widget-shell__title-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.widget-shell__icon-tile {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklab, var(--rg-accent) 18%, var(--rg-paper));
  color: var(--rg-accent);
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--rg-paper) 70%, transparent);
}

.widget-shell__title-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.widget-shell__title {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.22rem;
  font-weight: 700;
  color: var(--rg-ink);
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.widget-shell__header--empty .widget-shell__icon-tile {
  opacity: 0.6;
}
.widget-shell__header--empty .widget-shell__title {
  color: var(--rg-mute);
}

.widget-shell__subtitle,
.widget-shell__footer-note {
  font-size: 0.79rem;
  color: var(--rg-mute);
  text-wrap: pretty;
}
.widget-shell__subtitle strong,
.widget-shell__footer-note strong {
  color: var(--rg-ink);
  font-weight: 700;
}

.widget-shell__badge-count {
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-accent-2, var(--rg-accent));
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
}

.widget-shell__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.tasks-widget-container {
  min-width: 0;
}

.tasks-widget-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--rg-line);
  background: color-mix(in oklab, var(--rg-paper) 82%, transparent);
}
.tasks-widget-item.overdue {
  border-color: #9a1f2a;
  background: color-mix(in srgb, #9a1f2a 7%, var(--rg-paper));
}
@media (max-width: 720px) {
  .tasks-widget-item {
    flex-direction: column;
    align-items: flex-start;
  }
}

.tasks-widget-main {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.tasks-widget-item-icon {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklab, var(--rg-accent) 12%, var(--rg-paper));
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--rg-paper) 65%, transparent);
  font-size: 1rem;
  flex-shrink: 0;
}

.tasks-widget-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.tasks-widget-item-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-wrap: balance;
}

.tasks-widget-item-meta,
.tasks-widget-context {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 0.79rem;
  color: var(--rg-mute);
}

.tasks-widget-context a,
.tasks-widget-context-value {
  color: var(--rg-ink);
  font-weight: 700;
  text-decoration: none;
}

.tasks-widget-context a:hover {
  color: var(--rg-accent);
}

.tasks-widget-context-sep {
  opacity: 0.55;
}

.tasks-widget-due {
  font-weight: 600;
}

.tasks-widget-due.is-overdue {
  color: #9a1f2a;
}

.tasks-widget-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}
@media (max-width: 720px) {
  .tasks-widget-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

.tasks-widget-actions .rg-btn {
  white-space: nowrap;
}

.pregnancy-tracker-container {
  min-width: 0;
}
.pregnancy-tracker-container .widget-shell__body {
  gap: 14px;
}

.pt-switcher {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.pt-switcher-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--rg-mute);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  flex-shrink: 0;
}

.pt-switcher-buttons {
  display: inline-flex;
  gap: 4px;
  background: color-mix(in oklab, var(--rg-paper) 72%, transparent);
  border: 1px solid var(--rg-line);
  border-radius: 999px;
  padding: 4px;
  flex-wrap: wrap;
}

.pt-switcher-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 14px;
  border: none;
  background: transparent;
  color: var(--rg-mute);
  font-size: 0.76rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  white-space: nowrap;
}
.pt-switcher-chip:hover {
  color: var(--rg-ink);
}
.pt-switcher-chip.is-active {
  background: var(--rg-paper);
  color: var(--rg-ink);
  box-shadow: 0 8px 16px -14px rgba(0, 0, 0, 0.4);
}

button.pt-switcher-chip {
  appearance: none;
}

.pt-progress-container {
  --pt-progress: 0%;
  position: relative;
  padding: 20px 14px 88px;
  border-radius: 14px;
  border: 1px solid var(--rg-line);
  background: color-mix(in oklab, var(--rg-paper) 82%, transparent);
}

.pt-progress-line-bg {
  height: 6px;
  background: color-mix(in oklab, var(--rg-olive) 34%, var(--rg-paper));
  border-radius: 999px;
  position: relative;
  overflow: visible;
}

.pt-progress-line-fill {
  width: var(--pt-progress);
  max-width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--rg-female), var(--rg-warn));
  border-radius: inherit;
  transition: width 0.6s ease;
}

.pt-current-indicator {
  position: absolute;
  top: 22px;
  left: var(--pt-progress);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
  z-index: 3;
}

.pt-indicator-dot {
  width: 16px;
  height: 16px;
  background: var(--rg-paper);
  border: 4px solid var(--rg-female);
  border-radius: 50%;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--rg-female) 20%, transparent), 0 0 12px color-mix(in srgb, var(--rg-female) 35%, transparent);
}

.pt-indicator-tooltip {
  background: var(--rg-ink);
  color: var(--rg-paper);
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.72rem;
  font-weight: 700;
  margin-top: 5px;
  white-space: nowrap;
}
.pt-indicator-tooltip::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-bottom-color: var(--rg-ink);
  border-top: none;
}

.pt-milestones {
  position: absolute;
  top: 17px;
  left: 0;
  width: 100%;
  height: calc(100% - 17px);
  pointer-events: none;
}

.pt-milestone {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateX(-50%);
}

.pt-milestone-start {
  left: 10px;
  align-items: flex-start;
  transform: translateX(0);
}

.pt-milestone-warning {
  left: 85.5%;
}

.pt-milestone-end {
  left: calc(100% - 10px);
  align-items: flex-end;
  transform: translateX(-100%);
}

.pt-milestone-dot {
  width: 22px;
  height: 22px;
  background: var(--rg-paper);
  border: 2px solid var(--rg-line-strong);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  line-height: 1;
  z-index: 2;
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}

.pt-milestone.active .pt-milestone-dot {
  border-color: var(--rg-warn);
  background: var(--rg-warn-bg);
  transform: scale(1.15);
}

.pt-milestone-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 6px;
  max-width: 88px;
  text-align: center;
  line-height: 1.25;
  font-size: 0.71rem;
  font-weight: 600;
  color: var(--rg-mute);
}

.pt-milestone-start .pt-milestone-label,
.pt-milestone-end .pt-milestone-label {
  text-align: left;
}

.pt-milestone-end .pt-milestone-label {
  text-align: right;
}

.pt-milestone-day {
  font-size: 0.67rem;
  color: var(--rg-mute);
  font-weight: 500;
}

.pt-milestone.active .pt-milestone-label {
  color: var(--rg-ink);
}

.pt-milestone-date {
  font-size: 0.67rem;
  color: var(--rg-mute);
  margin-top: 2px;
  font-weight: 500;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.pt-milestone.active .pt-milestone-date {
  color: var(--rg-ink-soft);
}

.pt-footer {
  align-items: flex-start;
}

.pt-status-text {
  font-size: 0.88rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
  text-wrap: pretty;
}
.pt-status-text strong {
  color: var(--rg-ink);
}

.pt-status-text--alert {
  color: #9a1f2a;
}

.pt-footer-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.pt-compact-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pt-compact-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--rg-line);
  background: color-mix(in oklab, var(--rg-paper) 82%, transparent);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.pt-compact-chip:hover {
  border-color: var(--rg-female);
}

.pt-compact-days {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--rg-mute);
}

.pt-compact-chip.is-due .pt-compact-days {
  color: #9a1f2a;
}

.pt-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 18px;
}

.pt-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  background: color-mix(in oklab, var(--rg-paper) 78%, transparent);
}

.pt-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pt-card-name {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rg-ink);
  text-decoration: none;
}
.pt-card-name:hover {
  text-decoration: underline;
}

.pt-card-body {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 1.5rem;
}
@media (max-width: 768px) {
  .pt-card-body {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 576px) {
  .pt-progress-container {
    padding-bottom: 100px;
  }
  .pt-milestone-label {
    font-size: 0.64rem;
    max-width: 68px;
  }
  .pt-milestone-date {
    font-size: 0.61rem;
  }
  .pt-status-text {
    font-size: 0.82rem;
  }
  .pt-switcher {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
.sales-widget-container {
  min-width: 0;
}

.sw-header,
.sw-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.sw-header {
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--rg-line);
}

.sw-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sw-icon-tile {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklab, var(--rg-accent) 18%, var(--rg-paper));
  color: var(--rg-accent);
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--rg-paper) 70%, transparent);
}

.sw-title-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sw-title {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.22rem;
  font-weight: 700;
  color: var(--rg-ink);
  letter-spacing: -0.02em;
}

.sw-subtitle,
.sw-footer-note {
  font-size: 0.79rem;
  color: var(--rg-mute);
}

.sw-subtitle strong {
  color: var(--rg-ink);
  font-weight: 700;
}

.sw-tabs {
  display: inline-flex;
  gap: 4px;
  background: color-mix(in oklab, var(--rg-paper) 72%, transparent);
  border: 1px solid var(--rg-line);
  border-radius: 999px;
  padding: 4px;
}

.sw-tab-btn {
  background: transparent;
  border: none;
  padding: 6px 12px;
  border-radius: 999px;
  color: var(--rg-mute);
  font-size: 0.76rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.sw-tab-btn:hover {
  color: var(--rg-ink);
}
.sw-tab-btn.active {
  background: var(--rg-paper);
  color: var(--rg-ink);
  box-shadow: 0 8px 16px -14px rgba(0, 0, 0, 0.4);
}

.sw-badge-count {
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--rg-accent-2, var(--rg-accent));
  color: #fff;
  font-size: 0.65rem;
  line-height: 1;
}

.sw-compact-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-decoration: none;
  color: inherit;
  border-radius: 10px;
  transition: background-color 0.15s ease;
}
.sw-compact-row:hover .sw-compact-arrow {
  color: var(--rg-accent);
}

.sw-icon-tile--sm {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  flex-shrink: 0;
}

.sw-title--sm {
  font-size: 0.92rem;
  flex-shrink: 0;
  white-space: nowrap;
}

.sw-compact-stats {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.sw-compact-stat {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.sw-compact-stat--ongoing {
  background: rgba(10, 78, 168, 0.1);
  color: #0a4ea8;
}

.sw-compact-stat--inquiries {
  background: rgba(217, 119, 6, 0.12);
  color: #b25f06;
}

.sw-compact-stat--offers {
  background: rgba(25, 135, 84, 0.1);
  color: #157347;
}

.sw-compact-arrow {
  flex-shrink: 0;
  display: inline-flex;
  color: var(--rg-mute);
  transition: color 0.15s ease;
}

.sw-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 640px) {
  .sw-summary-grid {
    grid-template-columns: 1fr;
  }
}

.sw-summary-card {
  background: color-mix(in oklab, var(--rg-paper) 82%, transparent);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 14px 14px 13px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 132px;
  position: relative;
}

.sw-summary-card--ongoing .sw-summary-icon,
.sw-list-item--ongoing .sw-item-bucket {
  background: rgba(10, 78, 168, 0.12);
  color: #0a4ea8;
}

.sw-summary-card--inquiries .sw-summary-icon,
.sw-list-item--inquiries .sw-item-bucket {
  background: rgba(217, 119, 6, 0.14);
  color: #b25f06;
}

.sw-summary-card--offers .sw-summary-icon,
.sw-list-item--offers .sw-item-bucket {
  background: rgba(25, 135, 84, 0.12);
  color: #157347;
}

.sw-summary-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sw-summary-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.sw-summary-label {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--rg-ink);
}

.sw-summary-value {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 2.15rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--rg-ink);
}

.sw-summary-note {
  margin-top: auto;
  font-size: 0.77rem;
  color: var(--rg-mute);
  line-height: 1.45;
}

.sw-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sw-list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--rg-line);
  background: color-mix(in oklab, var(--rg-paper) 82%, transparent);
}
@media (max-width: 720px) {
  .sw-list-item {
    flex-direction: column;
    align-items: flex-start;
  }
}

.sw-item-main {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.sw-item-bucket {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sw-item-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.sw-item-title {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.sw-degu-name,
.sw-item-context a,
.sw-link-more {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 700;
}

.sw-degu-name:hover,
.sw-item-context a:hover,
.sw-link-more:hover {
  color: var(--rg-accent);
}

.sw-degu-rc {
  font-size: 0.74rem;
  color: var(--rg-mute);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.sw-item-context {
  font-size: 0.79rem;
  color: var(--rg-mute);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.sw-item-sep {
  opacity: 0.55;
}

.sw-item-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media (max-width: 720px) {
  .sw-item-meta {
    width: 100%;
    justify-content: space-between;
  }
}

.sw-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  font-size: 0.68rem;
  color: var(--rg-ink-soft);
  font-weight: 700;
}

.sw-price {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--rg-ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.sw-empty {
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px dashed var(--rg-line);
  border-radius: 14px;
  color: var(--rg-mute);
  background: color-mix(in oklab, var(--rg-paper) 64%, transparent);
}

.sw-footer {
  padding-top: 12px;
  border-top: 1px dashed var(--rg-line);
}

.rg-btn-xs {
  padding: 5px 10px;
  font-size: 0.75rem;
  border-radius: 8px;
  gap: 4px;
}

.customizer-active-pill {
  background: color-mix(in oklab, var(--rg-accent) 12%, var(--rg-paper));
  color: var(--rg-accent);
  border-color: color-mix(in oklab, var(--rg-accent) 30%, transparent);
}

.customizer-active-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rg-accent);
  display: inline-block;
  animation: pulse 1.5s infinite;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes pulse {
  0% {
    transform: scale(0.9);
    opacity: 0.6;
  }
  50% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(0.9);
    opacity: 0.6;
  }
}
.customizer-item {
  transition: transform 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
  user-select: none;
}

.customizer-item.is-dragging {
  opacity: 0.35;
  border-style: dashed !important;
  border-color: var(--rg-primary, #3b82f6) !important;
  background: var(--rg-surface-bg-alt, rgba(0, 0, 0, 0.03)) !important;
}

.customizer-item.drag-over-top {
  border-top: 2.5px solid var(--rg-primary, #3b82f6) !important;
}

.customizer-item.drag-over-bottom {
  border-bottom: 2.5px solid var(--rg-primary, #3b82f6) !important;
}

.drag-handle {
  cursor: grab;
  color: var(--rg-mute, #888);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.12s, background-color 0.12s;
}
.drag-handle:hover {
  color: var(--rg-ink, #111);
  background-color: var(--rg-surface-bg-alt, rgba(0, 0, 0, 0.05));
}

.drag-handle:active {
  cursor: grabbing;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.dashboard-alerts-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
  width: 100%;
  align-items: start;
}

.dashboard-alert-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-radius: var(--rg-radius-lg, 16px);
  padding: 1rem 1.25rem;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  box-shadow: var(--rg-shadow-sm);
  border-left: 4px solid var(--rg-line);
  animation: slideDown 0.3s ease-out;
}
.dashboard-alert-banner--warning {
  border-left-color: var(--rg-warning, #f59e0b);
}
.dashboard-alert-banner--warning .alert-icon {
  color: var(--rg-warning, #f59e0b);
  background: var(--rg-warn-bg);
}
.dashboard-alert-banner--warning .alert-badge {
  background: var(--rg-warn-bg);
  color: var(--rg-warning, #f59e0b);
}
.dashboard-alert-banner--danger {
  border-left-color: var(--rg-danger);
}
.dashboard-alert-banner--danger .alert-icon {
  color: var(--rg-danger);
  background: var(--rg-danger-bg);
}
.dashboard-alert-banner--danger .alert-badge {
  background: var(--rg-danger-bg);
  color: var(--rg-danger);
}

.dashboard-alert-details {
  position: relative;
}
.dashboard-alert-details summary::-webkit-details-marker {
  display: none;
}
.dashboard-alert-details summary {
  list-style: none;
}
.dashboard-alert-details[open] .dashboard-alert-banner {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: transparent;
}
.dashboard-alert-details[open] .dashboard-alert-banner .chevron-icon {
  transform: rotate(180deg);
}

.alert-details-content {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 200;
  padding: 1rem 1.25rem;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-top: none;
  border-left: 4px solid var(--rg-line);
  border-radius: 0 0 var(--rg-radius-lg, 16px) var(--rg-radius-lg, 16px);
  margin-top: -8px;
  box-shadow: var(--rg-shadow-md, 0 8px 24px rgba(0, 0, 0, 0.18));
}
.dashboard-alert-details:has(.dashboard-alert-banner--danger) .alert-details-content {
  border-left-color: var(--rg-danger);
}
.dashboard-alert-details:has(.dashboard-alert-banner--warning) .alert-details-content {
  border-left-color: var(--rg-warning, #f59e0b);
}

.alert-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.alert-content {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.alert-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rg-ink);
}

.alert-description {
  font-size: 0.82rem;
  color: var(--rg-mute);
}

.alert-badge {
  font-size: 0.8rem;
  font-weight: bold;
  padding: 0.2rem 0.6rem;
  border-radius: 9999px;
}

.alert-action {
  flex-shrink: 0;
}

.alert-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
  flex: 1;
}

.alert-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .dashboard-alert-banner {
    flex-wrap: wrap;
  }
  .alert-right {
    width: 100%;
    justify-content: flex-end;
  }
}
.dashboard-customizer-dock {
  position: fixed;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  background: color-mix(in oklab, var(--rg-paper) 88%, transparent);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--rg-line-strong);
  border-radius: 20px;
  padding: 20px 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  animation: slideInRightDock 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  width: 150px;
}
.dashboard-customizer-dock .dock-status {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  text-align: center;
}
.dashboard-customizer-dock .dock-status .dock-pulse-dot {
  width: 10px;
  height: 10px;
  background: var(--rg-accent);
  border-radius: 50%;
  display: inline-block;
  animation: pulse 1.5s infinite;
}
.dashboard-customizer-dock .dock-status .dock-status-text {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--rg-ink);
  line-height: 1.2;
}
.dashboard-customizer-dock .dock-divider {
  height: 1px;
  width: 80%;
  background: var(--rg-line);
  flex-shrink: 0;
}
.dashboard-customizer-dock .dock-disabled-widgets-section {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.5rem;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-section-title {
  font-size: 0.65rem;
  font-weight: bold;
  color: var(--rg-mute);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-align: center;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widgets-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widgets-list .dock-no-widgets {
  font-size: 0.65rem;
  color: var(--rg-mute);
  font-style: italic;
  text-align: center;
  padding: 4px;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 8px;
  cursor: grab;
  font-size: 0.7rem;
  width: 100%;
  transition: all 0.2s;
  user-select: none;
  font-family: inherit;
  color: inherit;
  text-align: left;
  outline: none;
  box-shadow: none;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token:hover {
  background: var(--rg-olive);
  border-color: var(--rg-line-strong);
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token:active {
  cursor: grabbing;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token.is-dragging {
  opacity: 0.4;
  border-style: dashed;
  border-color: var(--rg-accent) !important;
}
.dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token .token-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 95px;
  font-weight: 600;
  color: var(--rg-ink-soft);
}
.dashboard-customizer-dock .dock-actions {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.5rem;
}
.dashboard-customizer-dock .dock-actions .rg-btn {
  width: 100%;
  justify-content: center;
  border-radius: 10px;
  font-size: 0.75rem;
  padding: 8px 12px;
}

@media (max-width: 768px) {
  .dashboard-customizer-dock {
    left: 50%;
    right: auto;
    top: auto;
    bottom: 24px;
    transform: translateX(-50%);
    flex-direction: row;
    width: max-content;
    max-width: 95%;
    border-radius: 999px;
    padding: 8px 16px;
    gap: 1rem;
    animation: slideUpDockMobile 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }
  .dashboard-customizer-dock .dock-status {
    flex-direction: row;
    text-align: left;
  }
  .dashboard-customizer-dock .dock-status .dock-pulse-dot {
    width: 8px;
    height: 8px;
  }
  .dashboard-customizer-dock .dock-status .dock-status-text {
    font-size: 0.85rem;
  }
  .dashboard-customizer-dock .dock-divider {
    height: 20px;
    width: 1px;
    background: var(--rg-line);
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section {
    flex-direction: row;
    align-items: center;
    width: auto;
    gap: 0.75rem;
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section .dock-section-title {
    text-align: left;
    white-space: nowrap;
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widgets-list {
    flex-direction: row;
    width: auto;
    max-width: 200px;
    overflow-x: auto;
    padding-bottom: 0;
    gap: 6px;
    scrollbar-width: none;
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widgets-list::-webkit-scrollbar {
    display: none;
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token {
    width: auto;
    padding: 4px 10px;
    flex-shrink: 0;
  }
  .dashboard-customizer-dock .dock-disabled-widgets-section .dock-disabled-widget-token .token-title {
    max-width: 80px;
  }
  .dashboard-customizer-dock .dock-actions {
    flex-direction: row;
    width: auto;
    gap: 0.5rem;
  }
  .dashboard-customizer-dock .dock-actions .rg-btn {
    width: auto;
    padding: 6px 16px;
    border-radius: 999px;
  }
}
.widget-disabled-placeholder-card {
  border: 2px dashed var(--rg-line-strong);
  background: var(--rg-cream);
  border-radius: 16px;
  padding: 2.5rem 1.5rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 1rem;
  height: 100%;
  min-height: 180px;
  transition: all 0.25s ease;
  position: relative;
}
.widget-disabled-placeholder-card .placeholder-icon-circle {
  width: 42px;
  height: 42px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--rg-mute);
}
.widget-disabled-placeholder-card .placeholder-text-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.widget-disabled-placeholder-card .placeholder-text-group .placeholder-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--rg-ink-soft);
}
.widget-disabled-placeholder-card .placeholder-text-group .placeholder-sub {
  margin: 0;
  font-size: 0.75rem;
  color: var(--rg-mute);
}

.widget-wrapper--disabled {
  opacity: 0.6;
  filter: grayscale(20%);
}
.widget-wrapper--disabled:hover {
  opacity: 0.8;
}

.widget-customizing-overlay {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background: var(--rg-paper);
  padding: 4px 8px;
  border-radius: 8px;
  border: 1px solid var(--rg-line);
  box-shadow: var(--rg-shadow-sm);
}
.widget-customizing-overlay .rg-btn-group {
  display: inline-flex;
  border: 1px solid var(--rg-line);
  border-radius: 6px;
  overflow: hidden;
  background: var(--rg-paper);
}
.widget-customizing-overlay .rg-btn-group .rg-btn {
  padding: 1px 6px;
  font-size: 0.65rem;
}
.widget-customizing-overlay .rg-btn-group .rg-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.widget-customizing-overlay__name {
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--rg-mute);
  white-space: nowrap;
}
.widget-customizing-overlay .widget-status-badge {
  font-size: 0.7rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: 4px;
}
.widget-customizing-overlay .widget-status-badge.badge-disabled {
  background: var(--rg-olive);
  color: var(--rg-mute);
}
.widget-customizing-overlay .widget-status-badge .badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
}
.widget-customizing-overlay .widget-status-badge .badge-dot.dot-disabled {
  background: var(--rg-mute);
}

@keyframes slideInRightDock {
  from {
    opacity: 0;
    transform: translate(30px, -50%);
  }
  to {
    opacity: 1;
    transform: translate(0, -50%);
  }
}
@keyframes slideUpDockMobile {
  from {
    opacity: 0;
    transform: translate(-50%, 30px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}
.pregnant-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pregnant-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-left: 4px solid var(--rg-female);
  border-radius: 12px;
}

.pregnant-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--rg-female-bg);
  color: var(--rg-female);
  display: flex;
  align-items: center;
  justify-content: center;
}

.pregnant-main {
  flex: 1;
  min-width: 0;
}

.pregnant-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.pregnant-name {
  font-weight: 700;
  color: var(--rg-ink);
  text-decoration: none;
  font-size: 0.95rem;
}
.pregnant-name:hover {
  text-decoration: underline;
}

.pregnant-sub {
  font-size: 0.82rem;
  color: var(--rg-mute);
  margin-top: 3px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.pregnant-sub a {
  color: var(--rg-mute);
  text-decoration: none;
}

.pregnant-dates {
  flex-shrink: 0;
  text-align: right;
}

.pregnant-range {
  font-size: 0.82rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
}

.pregnant-countdown {
  margin-top: 4px;
}

.pregnant-actions {
  flex-shrink: 0;
}

.rg-pill-sm {
  font-size: 0.75rem;
}

.rg-pill.birth-today {
  background: var(--rg-female);
  color: #fff;
  font-weight: 700;
}

.rg-pill.overdue {
  background: var(--rg-danger);
  color: #fff;
  font-weight: 700;
}

.user-alert-table {
  width: 100%;
  font-size: 0.84rem;
  border-collapse: collapse;
}
.user-alert-table thead tr {
  color: var(--rg-mute);
  border-bottom: 1px dashed var(--rg-line-strong);
}
.user-alert-table th {
  text-align: left;
  padding: 4px 8px 6px 0;
  font-weight: 600;
}
.user-alert-table th:last-child {
  padding-right: 0;
}
.user-alert-table tbody tr {
  border-bottom: 1px dashed var(--rg-line);
}
.user-alert-table td {
  padding: 6px 8px 6px 0;
  color: var(--rg-ink);
}
.user-alert-table td:last-child {
  padding-right: 0;
}
.user-alert-table .td-name a {
  color: var(--rg-ink);
  font-weight: 600;
  text-decoration: none;
}
.user-alert-table .td-rc {
  font-size: 0.75rem;
  color: var(--rg-mute);
  margin-left: 4px;
}
.user-alert-table .td-warn {
  color: var(--rg-danger);
  font-weight: 600;
}

.degu-mini-grid-mb {
  margin-bottom: 20px;
}

.degu-section-label {
  margin-bottom: 12px;
}

.degu-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
}
.degu-toolbar .view-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  flex-shrink: 0;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 9px;
}
.degu-toolbar .view-toggle a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 7px;
  color: var(--rg-mute);
  text-decoration: none;
  cursor: pointer;
}
.degu-toolbar .view-toggle a.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
}
.degu-toolbar .view-toggle a:hover:not(.active) {
  background: var(--rg-line);
}

.degu-toolbar-left {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
  flex-wrap: wrap;
}

.degu-filter-popup {
  position: relative;
  display: inline-block;
}
.degu-filter-popup summary {
  list-style: none;
}
.degu-filter-popup summary::-webkit-details-marker {
  display: none;
}

.degu-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.6;
  border: 1px solid var(--rg-line);
  background: var(--rg-paper);
  color: var(--rg-ink-soft);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.degu-filter-btn:hover {
  background: var(--rg-cream);
  border-color: var(--rg-line-strong);
  color: var(--rg-ink);
}
.degu-filter-btn.has-active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: var(--rg-ink);
}

.degu-filter-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 3px;
  border-radius: 8px;
  background: var(--rg-accent);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
}

.degu-filter-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 200;
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 14px;
  padding: 10px 14px 12px;
  min-width: 290px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.degu-filter-panel .degu-filter-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 7px 0;
  border-bottom: 1px dashed var(--rg-line);
}
.degu-filter-panel .degu-filter-row:last-of-type {
  border-bottom: none;
}
.degu-filter-panel .degu-filter-row-label {
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  min-width: 56px;
  flex-shrink: 0;
}
.degu-filter-panel .degu-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.degu-filter-reset {
  padding-top: 8px;
  text-align: right;
}
.degu-filter-reset a {
  font-size: 0.74rem;
  color: var(--rg-accent);
  font-weight: 600;
  text-decoration: none;
}
.degu-filter-reset a:hover {
  text-decoration: underline;
}

.degu-active-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px 3px 9px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
  border: 1px solid var(--rg-line-strong);
  background: var(--rg-cream);
  color: var(--rg-ink);
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.12s;
}
.degu-active-chip::before {
  content: "";
  display: none;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--chip-dot, transparent);
  flex-shrink: 0;
}
.degu-active-chip[style*="--chip-dot"]::before {
  display: inline-block;
}
.degu-active-chip:hover {
  background: var(--rg-line);
}

.degu-chip-x {
  font-size: 0.68rem;
  color: var(--rg-mute);
  margin-left: 2px;
}

.degu-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.6;
  border: 1px solid var(--rg-line);
  background: var(--rg-paper);
  color: var(--rg-ink-soft);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.degu-filter-chip::before {
  content: "";
  display: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--chip-dot, transparent);
  flex-shrink: 0;
}
.degu-filter-chip[style*="--chip-dot"]::before {
  display: inline-block;
}
.degu-filter-chip:hover:not(.active) {
  background: var(--rg-cream);
  border-color: var(--rg-line-strong);
  color: var(--rg-ink);
}
.degu-filter-chip.active {
  background: var(--rg-ink);
  color: var(--rg-paper);
  border-color: var(--rg-ink);
}
.degu-filter-chip.active.male {
  background: var(--rg-male, #0a4ea8);
  border-color: var(--rg-male, #0a4ea8);
}
.degu-filter-chip.active.female {
  background: var(--rg-female, #a8205f);
  border-color: var(--rg-female, #a8205f);
}

.degu-filter-no-results {
  padding: 24px 0;
  text-align: center;
  color: var(--rg-mute);
  font-size: 0.9rem;
}
.degu-filter-no-results a {
  color: var(--rg-accent);
  font-weight: 600;
}

.degu-compact-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
@media (max-width: 600px) {
  .degu-compact-grid {
    grid-template-columns: 1fr;
  }
}

.rg-card-padded .seznam-table {
  margin: 0 -16px;
  border-radius: 0;
  border: none;
  box-shadow: none;
}

.deceased-section {
  padding-top: 14px;
  border-top: 1px dashed var(--rg-line-strong);
}

.empty-padded {
  color: var(--rg-mute);
  padding: 24px 0;
  text-align: center;
}

.litter-card {
  scroll-margin-top: 80px;
}

.litter-nav-mb {
  margin-bottom: 16px;
}

.old-degus-section {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px 20px;
}

.old-degus-wrap {
  background: rgba(217, 119, 6, 0.08);
  border: 1px solid var(--rg-warn);
  border-radius: 16px;
  overflow: hidden;
}

.old-degus-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
}

.old-degus-main {
  flex: 1;
}

.old-degus-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rg-warn);
}

.old-degus-sub {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-top: 2px;
}

.old-degus-chevron {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: rgba(217, 119, 6, 0.14);
  color: var(--rg-warn);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.old-degus-chevron svg {
  width: 14px;
  height: 14px;
}

.old-degus-toggle[aria-expanded=true] .old-degus-chevron {
  transform: rotate(180deg);
  background: var(--rg-warn);
  color: var(--rg-paper);
}

.old-degus-body {
  border-top: 1px solid rgba(217, 119, 6, 0.2);
  padding: 10px 0;
}

.old-degus-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 18px;
  border-bottom: 1px dashed rgba(217, 119, 6, 0.15);
}

.old-degus-name {
  font-weight: 600;
  color: var(--rg-ink);
  text-decoration: none;
  flex: 1;
}
.old-degus-name:hover {
  text-decoration: underline;
}

.old-degus-rc {
  font-family: ui-monospace, monospace;
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.old-degus-age {
  font-size: 0.82rem;
  color: var(--rg-warn);
  font-weight: 600;
  white-space: nowrap;
}

.litter-info-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.bs-kpi-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}
@media (max-width: 860px) {
  .bs-kpi-strip {
    grid-template-columns: 1fr 1fr;
  }
}

.bs-kpi {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  padding: 18px 20px;
  position: relative;
  overflow: hidden;
}
.bs-kpi .lbl {
  font-size: 0.66rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--rg-mute);
  font-weight: 700;
  margin-bottom: 6px;
}
.bs-kpi .val {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--rg-ink);
  font-variant-numeric: tabular-nums;
}
.bs-kpi .sub {
  font-size: 0.8rem;
  color: var(--rg-mute);
  margin-top: 6px;
}

.bs-grid-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-bottom: 14px;
}

.bs-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 860px) {
  .bs-grid-2 {
    grid-template-columns: 1fr;
  }
}

.bs-grid-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 860px) {
  .bs-grid-3 {
    grid-template-columns: 1fr;
  }
}

.bs-card {
  background: var(--rg-paper);
  border: 1px solid var(--rg-line);
  border-radius: 16px;
  overflow: hidden;
}

.bs-card-head {
  padding: 14px 18px 8px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.bs-card-head .ic {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--rg-olive);
  color: var(--rg-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.bs-card-head h4 {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
  color: var(--rg-ink);
}
.bs-card-head .sub {
  font-size: 0.76rem;
  color: var(--rg-mute);
  margin-top: 2px;
}

.bs-card-body {
  padding: 8px 18px 18px;
}

.bs-donut-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.bs-donut {
  width: 130px;
  height: 130px;
  flex-shrink: 0;
  position: relative;
}
.bs-donut svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.bs-donut .center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.bs-donut .center .num {
  font-family: "Iowan Old Style", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.bs-donut .center .lbl {
  font-size: 0.65rem;
  color: var(--rg-mute);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  margin-top: 3px;
}

.bs-legend {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.bs-legend .dl {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 4px;
  border-radius: 5px;
  font-size: 0.8rem;
}
.bs-legend .dl:hover {
  background: var(--rg-cream);
}
.bs-legend .sw {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  flex-shrink: 0;
}
.bs-legend .nm {
  flex: 1;
  color: var(--rg-ink-soft);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-legend .v {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--rg-ink);
}
.bs-legend .p {
  font-size: 0.72rem;
  color: var(--rg-mute);
  min-width: 42px;
  text-align: right;
}

.bs-hbar-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bs-hbar-row {
  display: grid;
  gap: 8px;
  align-items: center;
  grid-template-columns: 130px 1fr 46px;
}
@media (max-width: 860px) {
  .bs-hbar-row {
    grid-template-columns: 110px 1fr 40px;
  }
}
.bs-hbar-row .lbl {
  font-size: 0.83rem;
  font-weight: 600;
  color: var(--rg-ink-soft);
  display: flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bs-hbar-row .sw {
  width: 13px;
  height: 13px;
  border-radius: 3px;
  flex-shrink: 0;
}
.bs-hbar-row .bar {
  height: 12px;
  border-radius: 6px;
  background: var(--rg-olive);
  position: relative;
  overflow: hidden;
}
.bs-hbar-row .bar > span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: 6px;
}
.bs-hbar-row .val {
  font-weight: 700;
  color: var(--rg-ink);
  font-size: 0.83rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, monospace;
}

.bs-vbars {
  display: grid;
  gap: 4px;
  align-items: end;
  height: 120px;
  padding: 20px 2px 0;
}

.bs-vbar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  height: 100%;
  justify-content: flex-end;
}
.bs-vbar-col .v {
  width: 100%;
  background: var(--rg-accent);
  border-radius: 4px 4px 0 0;
  position: relative;
  min-height: 2px;
}
.bs-vbar-col .v::before {
  content: attr(data-val);
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.bs-vbar-col .v.peak {
  background: var(--rg-ink);
}
.bs-vbar-col .v.zero {
  background: var(--rg-olive);
}
.bs-vbar-col .lbl {
  font-size: 0.65rem;
  color: var(--rg-mute);
  font-weight: 600;
}

.kraj-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.kraj-list .row {
  display: grid;
  grid-template-columns: 1fr 50px 30px;
  gap: 8px;
  align-items: center;
  padding: 4px 6px;
  border-radius: 6px;
}
.kraj-list .row:hover {
  background: var(--rg-cream);
}
.kraj-list .lbl-kraj {
  font-size: 0.78rem;
  color: var(--rg-ink-soft);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kraj-list .bar {
  height: 6px;
  border-radius: 999px;
  background: var(--rg-olive);
  position: relative;
}
.kraj-list .bar > span {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var(--rg-accent);
  border-radius: 999px;
}
.kraj-list .val {
  font-family: ui-monospace, monospace;
  font-weight: 700;
  text-align: right;
  font-size: 0.78rem;
  color: var(--rg-ink);
}

.pary-stats-wrap {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.pary-donut-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

canvas.pary-donut {
  max-width: 160px;
}

.pary-stats-table-wrap {
  flex: 1;
  min-width: 180px;
}

.pary-stats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.pary-stats-table thead tr {
  border-bottom: 1px solid var(--rg-line);
}
.pary-stats-table th {
  padding: 8px 0;
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rg-mute);
}
.pary-stats-table th:first-child {
  text-align: left;
}
.pary-stats-table th:not(:first-child) {
  text-align: right;
}
.pary-stats-table tbody tr {
  border-bottom: 1px solid var(--rg-line);
}
.pary-stats-table td {
  padding: 10px 0;
}
.pary-stats-table td:not(:first-child) {
  text-align: right;
}
.pary-stats-table td.val {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.pary-stats-table td.pct {
  color: var(--rg-mute);
  font-variant-numeric: tabular-nums;
}

.fcard-body-pt-xs {
  padding-top: 4px;
}

.fcard-body-pt-sm {
  padding-top: 8px;
}

.pary-litter-num {
  font-size: 0.8rem;
  min-width: 30px;
}

.pary-litter-main {
  flex: 1;
  min-width: 0;
}

.pary-litter-title {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.pary-parent {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.pary-parent svg {
  color: inherit;
}
.pary-parent.male {
  color: var(--rg-male);
}
.pary-parent.female {
  color: var(--rg-female);
}
.pary-parent a {
  color: var(--rg-ink);
  text-decoration: none;
}
.pary-parent a:hover {
  text-decoration: underline;
}

.pary-parent-rc {
  color: var(--rg-mute);
  font-size: 0.8rem;
}

.pary-sep {
  color: var(--rg-mute);
  font-size: 0.85rem;
}

.pary-degu-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pary-degu-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--rg-line);
}

.rg-pill.no-shrink {
  flex-shrink: 0;
}

.pary-degu-link {
  color: var(--rg-ink);
  text-decoration: none;
  font-weight: 600;
}
.pary-degu-link:hover {
  text-decoration: underline;
}

.pary-degu-rc {
  color: var(--rg-mute);
  font-size: 0.82rem;
}

.predicted-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.predicted-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--rg-cream);
  border: 1px solid var(--rg-line);
  border-radius: 12px;
  min-width: 0;
}

.predicted-pct {
  font-weight: 700;
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  color: var(--rg-accent);
  flex-shrink: 0;
}

.predicted-name {
  font-size: 0.88rem;
  color: var(--rg-ink);
}

.predicted-note {
  margin-top: 10px;
  margin-bottom: 0;
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.pary-summary-wrap {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.rg-notice.mb-notice {
  margin-bottom: 14px;
}

.pending-empty {
  text-align: center;
  padding: 56px 32px;
}

.pending-empty-icon {
  color: var(--rg-success);
  margin-bottom: 14px;
}

.pending-empty-title {
  font-size: 1.18rem;
  font-weight: 700;
  color: var(--rg-ink);
  margin-bottom: 6px;
}

.pending-empty-sub {
  color: var(--rg-mute);
  font-size: 0.88rem;
}

.pending-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pending-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
}

.pending-user-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}

.pending-user-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--rg-ink);
}

.rg-pill.pill-mono {
  font-family: ui-monospace, monospace;
  font-size: 0.75rem;
}

.rg-pill.pill-xs {
  font-size: 0.72rem;
}

.pending-meta {
  font-size: 0.84rem;
  color: var(--rg-mute);
  display: flex;
  flex-wrap: wrap;
  gap: 0 14px;
  margin-bottom: 5px;
}

.pending-date {
  font-size: 0.78rem;
  color: var(--rg-mute);
}

.pending-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
}

.rg-btn.btn-full {
  width: 100%;
  padding: 8px 18px;
  font-size: 0.85rem;
}

.static-page-content {
  line-height: 1.75;
  color: var(--rg-ink);
  font-size: 1rem;
}
.static-page-content h2 {
  font-family: "Lora", "Iowan Old Style", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--rg-ink);
  margin: 2rem 0 0.75rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--rg-line);
  letter-spacing: -0.01em;
}
.static-page-content h2:first-child {
  margin-top: 0;
}
.static-page-content h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--rg-ink);
  margin: 1.25rem 0 0.5rem;
}
.static-page-content ol, .static-page-content ul {
  padding-left: 1.5rem;
  margin: 0.5rem 0 1rem;
}
.static-page-content li {
  margin-bottom: 0.45rem;
}
.static-page-content p {
  margin: 0 0 1rem;
}
.static-page-content p:last-child {
  margin-bottom: 0;
}
.static-page-content strong {
  font-weight: 700;
  color: var(--rg-ink);
}
.static-page-content em {
  font-style: italic;
}
.static-page-content a {
  color: var(--rg-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.static-page-content a:hover {
  opacity: 0.8;
}
.static-page-content img {
  max-width: 100%;
  border-radius: 10px;
  cursor: zoom-in;
  margin: 0.5rem 0;
}

.static-page-updated {
  padding: 12px 20px;
  border-top: 1px dashed var(--rg-line-strong);
  font-size: 0.8rem;
  color: var(--rg-mute);
  border-radius: 0 0 16px 16px;
}

@layer reset, base, layout, pages, features, themes, utilities;

/*# sourceMappingURL=app.css-ucxPUs_.map */