/**
 * Dashboard Pages Styles
 * Minimal and Clean.
 */

:root {
  --ds-primary: var(--accent, #2563eb);
  --ds-secondary: #059669;
  --ds-danger: #dc2626;
  --ds-warning: #d97706;
  --ds-bg: var(--bg-body, #f8fafc);
  --ds-card-bg: var(--bg-surface, #ffffff);
  --ds-text-main: var(--text-primary, #111827);
  --ds-text-muted: var(--text-secondary, #4b5563);
  --ds-border: var(--border, #d1d5db);
}

/* Health analytics template (no inline styles) */
.dashboard-page .health-analytics-intro,
.dashboard-page .health-analytics-signals {
  background: transparent;
  border-top: 0;
}

.dashboard-page .health-analytics-lead,
.dashboard-page .health-analytics-copy,
.dashboard-page .health-analytics-empty-note {
  margin: 0;
  color: var(--ds-text-muted);
  line-height: 1.75;
}

.dashboard-page .health-analytics-copy {
  color: var(--ds-text-main);
}

.dashboard-page .health-analytics-link-wrap {
  margin: 0.6rem 0 0;
}

.dashboard-page .health-analytics-link {
  font-weight: 700;
}

.dashboard-page .health-flow-grid--compact {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
}

.dashboard-page .health-flow-grid--signals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.75rem;
}

.dashboard-page .health-analytics-metric-item {
  padding: 0.65rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--ds-border) 88%, #ffffff);
}

.dashboard-page .health-analytics-metric-item__label {
  font-size: 0.8rem;
  color: var(--ds-text-muted);
}

.dashboard-page .health-analytics-metric-item__value {
  margin-top: 0.2rem;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--ds-text-main);
}

.dashboard-page .health-analytics-metric-item__value--sm {
  font-size: 1rem;
}

.dashboard-page .health-analytics-metric-item__meta {
  margin-top: 0.15rem;
  font-size: 0.78rem;
  color: var(--ds-text-muted);
}

.dashboard-page .health-analytics-action-list {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: 0.6rem;
  line-height: 1.8;
}

.dashboard-page {
  --dashboard-content-inline: var(--content-inline-inset, clamp(0.75rem, 2.4vw, 1.25rem));
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  font-family: "LINE Seed JP", sans-serif;
  color: var(--ds-text-main);
  background: transparent;
}

.dashboard-page .page-wrapper {
  width: 100%;
  max-width: 1160px;
  margin: 0 auto;
}

.dashboard-page .page-main {
  --dashboard-main-gap: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  max-width: none;
  padding-inline: var(--dashboard-content-inline);
  padding-bottom: clamp(2rem, 4vw, 3rem);
}

.dashboard-page .page-main > * + * {
  margin-top: var(--dashboard-main-gap);
}

.dashboard-page .page-hero {
  padding: clamp(2rem, 5vw, 3.25rem) 0 clamp(1rem, 3vw, 1.75rem);
  border-bottom: 1px solid var(--ds-border);
  background:
    radial-gradient(
      900px 460px at 50% -20%,
      color-mix(in srgb, var(--ds-primary) 16%, transparent) 0%,
      transparent 70%
    ),
    var(--ds-bg);
}

.dashboard-page .hero-content {
  max-width: min(100%, 1080px);
  margin-inline: auto;
  padding-inline: var(--dashboard-content-inline);
}

.dashboard-page .page-hero__kicker {
  margin: 0 0 0.5rem 0;
  display: inline-flex;
  align-items: center;
  padding: 0.32rem 0.62rem;
  border-radius: 0.38rem;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #1e293b;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 800;
}

.dashboard-page .page-hero__title {
  margin: 0;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ds-text-main);
}

.dashboard-page .page-hero__subtitle {
  margin: 0.8rem 0 0 0;
  max-width: 62ch;
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  line-height: 1.75;
  color: var(--ds-text-muted);
}

.dashboard-page .page-hero__meta {
  margin: 0.75rem 0 0 0;
  max-width: 68ch;
  font-size: 0.86rem;
  line-height: 1.65;
  color: var(--text-tertiary, #6b7280);
}

.fixed-page-last-updated {
  width: min(100%, 920px);
  max-width: 920px;
  margin: 1rem auto 0;
  text-align: right;
  padding: 0 clamp(0.75rem, 2vw, 1.25rem);
  font-size: 0.8125rem;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: color-mix(in srgb, var(--text-secondary, #4b5563) 86%, #0f172a);
  opacity: 0.78;
  display: block;
  border: 0;
  background: transparent;
  margin-bottom: 0;
}

.dashboard-page .page-hero--unified .page-hero__media {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}

.dashboard-page .page-hero--unified .dory-image-placeholder {
  width: min(100%, 680px);
  min-height: clamp(170px, 24vw, 240px);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0.35rem 0;
}

.dashboard-page .page-hero--unified .dory-image-placeholder::after {
  display: none;
}

.dashboard-page .page-hero--unified .dory-image-placeholder__note {
  color: color-mix(in srgb, var(--ds-text-muted) 90%, #0f172a);
}

.dashboard-page .page-hero--unified .dory-image-placeholder__label {
  color: color-mix(in srgb, var(--ds-text-main) 88%, #0f172a);
}

.dashboard-page .page-hero__quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1rem;
}

.dashboard-page .page-hero__quick-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #1e293b;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 0.38rem;
  padding: 0.35rem 0.7rem;
  font-size: 0.78rem;
  font-weight: 700;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}

.dashboard-page .page-hero__quick-link:hover {
  color: #0f172a;
  background: #e2e8f0;
  border-color: #94a3b8;
}

.dashboard-header {
  margin-bottom: 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.dashboard-header h1 {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--ds-primary);
}

.dashboard-controls {
  display: flex;
  justify-content: flex-end;
  margin: 0;
}

.dashboard-controls form {
  display: inline-flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 0.4rem;
}

.dashboard-controls select {
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--ds-text-main);
  background-color: var(--ds-card-bg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  border: 1px solid var(--ds-border);
  border-radius: 0.65rem;
  appearance: none;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.dashboard-controls select:hover {
  border-color: var(--ds-primary);
}

.dashboard-controls select:focus {
  outline: none;
  border-color: var(--ds-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ds-primary) 18%, transparent);
}

.dashboard-page .dashboard-controls__hint {
  margin: 0;
  padding: 0.35rem 0.5rem;
  max-width: min(100%, 44ch);
  border-radius: 0.55rem;
  background: color-mix(in srgb, var(--ds-primary) 6%, #ffffff);
  color: color-mix(in srgb, var(--ds-text-main) 78%, #334155);
  font-size: 0.82rem;
  line-height: 1.52;
  text-align: right;
}

.dashboard-page .dashboard-controls__hint-label {
  font-weight: 800;
  color: color-mix(in srgb, var(--ds-text-main) 88%, #0f172a);
}

.dashboard-page .dashboard-controls__hint-value {
  font-weight: 600;
}

.dashboard-grid {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  width: 100%;
}

.dashboard-page .dashboard-quick-nav {
  position: sticky;
  top: 0.5rem;
  z-index: 5;
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.25rem 0.05rem 0.35rem;
  background: color-mix(in srgb, #ffffff 88%, #f8fafc);
}

/* Training dashboard keeps a single reading column on desktop. */
.dashboard-page .dashboard-grid--training {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  max-width: 1080px;
  margin-inline: auto;
}

.dashboard-page .dashboard-grid--training .dashboard-quick-nav {
  grid-column: 1 / -1;
  align-self: start;
  align-items: flex-start;
  flex-wrap: wrap;
}

.dashboard-page .dashboard-quick-nav__link {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  text-decoration: none;
  font-size: 0.82rem;
  line-height: 1.2;
  color: #1e293b;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 0.38rem;
  padding: 0.38rem 0.62rem;
}

.dashboard-page .dashboard-quick-nav__link:hover {
  color: #0f172a;
  background: #e2e8f0;
}

/* Flatten legacy inline-styled cards on health pages */
.dashboard-page .dashboard-grid--health .dashboard-card[style] {
  border-radius: 0.55rem !important;
  box-shadow: none !important;
}

.dashboard-page .dashboard-grid--health [style*="border-radius"] {
  border-radius: 0.45rem !important;
}

.dashboard-page .dashboard-grid--health [style*="border: 1px solid"] {
  border-color: color-mix(in srgb, var(--ds-border) 94%, #ffffff) !important;
}

.dashboard-page .dashboard-grid--health p,
.dashboard-page .dashboard-grid--health li {
  max-width: none;
  line-height: 1.65;
}

.dashboard-page [id^="health-"],
.dashboard-page [id^="training-"],
.dashboard-page [id^="equipment-"],
.dashboard-page [id^="pm-"] {
  scroll-margin-top: 88px;
}

.dashboard-card {
  background: var(--ds-card-bg);
  border-radius: 0.6rem;
  padding: 1rem;
  border: 1px solid var(--ds-border);
  box-shadow: none;
}

.dashboard-card__title {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0 0 1.25rem 0;
  color: var(--ds-text-main);
}

.ai-insight-card {
  background: linear-gradient(140deg, #f7fbff 0%, #ffffff 72%);
  border: 1px solid color-mix(in srgb, var(--ds-primary) 22%, var(--ds-border));
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
  padding: 1.75rem;
}

.ai-insight-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.status-badge {
  padding: 0.35rem 0.8rem;
  border-radius: 0.38rem;
  font-size: 0.8rem;
  font-weight: 700;
  background: #dcfce7;
  color: #166534;
}

.status-badge--low {
  background: #dcfce7;
  color: #166534;
}

.status-badge--medium {
  background: #fef3c7;
  color: #92400e;
}

.status-badge--high {
  background: #fee2e2;
  color: #991b1b;
}

.ai-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.dashboard-card--full {
  grid-column: 1 / -1;
}

.ai-summary {
  margin: 0;
  padding: 1.1rem 1.25rem;
  border-radius: 0.85rem;
  background: #ffffff;
  border: 1px solid rgba(59, 130, 246, 0.12);
  box-shadow: inset 4px 0 0 #3b82f6, 0 8px 26px rgba(59, 130, 246, 0.08);
  color: #1e3a8a;
}

.ai-summary p {
  margin: 0;
  line-height: 1.7;
  font-size: 0.95rem;
}

.ai-perspectives-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 0.9rem;
  margin-top: 0.25rem;
}

.ai-perspective {
  padding: 1rem 1.1rem;
  border-radius: 0.85rem;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: inset 4px 0 0 var(--ai-accent, #1d4ed8), 0 6px 18px rgba(15, 23, 42, 0.06);
}

.ai-perspective p {
  margin: 0;
  line-height: 1.7;
  font-size: 0.95rem;
  color: #0f172a;
}

.ai-perspective__label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.ai-perspective[data-tone="planner"] {
  --ai-accent: #2563eb;
}

.ai-perspective[data-tone="planner"] .ai-perspective__label {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
}

.ai-perspective[data-tone="vet"] {
  --ai-accent: #dc2626;
}

.ai-perspective[data-tone="vet"] .ai-perspective__label {
  background: rgba(220, 38, 38, 0.12);
  color: #b91c1c;
}

.ai-perspective[data-tone="breeder"] {
  --ai-accent: #7c3aed;
}

.ai-perspective[data-tone="breeder"] .ai-perspective__label {
  background: rgba(124, 58, 237, 0.12);
  color: #6d28d9;
}

.chart-container {
  position: relative;
  width: 100%;
  height: 300px;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
}

.chart-container canvas {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
}

.chart-container svg {
  display: block;
  max-width: 100%;
  min-width: 0;
  height: auto;
}

.empty-state {
  text-align: center;
  padding: 4rem 2rem;
  color: var(--ds-text-muted);
}

/* Mobile optimization for better readability */
@media (max-width: 768px) {
  .dashboard-page {
    padding: 0;
    max-width: 100%;
  }

  .dashboard-page .page-hero {
    padding: 1.4rem 0 1rem;
  }

  .dashboard-page .page-hero__subtitle,
  .dashboard-page .page-hero__meta,
  .dashboard-page .dashboard-card p,
  .dashboard-page .dashboard-card li {
    max-width: none;
  }

  .dashboard-page .page-main {
    --dashboard-main-gap: 0.9rem;
    gap: 0;
    padding-inline: var(--dashboard-content-inline);
  }

  .dashboard-header {
    margin-bottom: 1.25rem;
  }

  .dashboard-header h1 {
    font-size: 1.375rem;
  }

  .dashboard-card {
    padding: 0.95rem;
    border-radius: 0.45rem;
    border: 0;
    box-shadow: none;
  }

  .dashboard-card__title {
    font-size: 1rem;
    margin-bottom: 0.875rem;
  }

  .chart-container {
    height: 220px;
  }

  /* Convert tables to card layout on mobile */
  .responsive-table-wrapper {
    margin: 0.75rem 0;
  }

  .responsive-table-wrapper table {
    display: none;
  }

  .table-card-mobile {
    display: block;
    background: #f9fafb;
    border: 1px solid var(--ds-border);
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
  }

  .table-card-mobile__row {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
  }

  .table-card-mobile__label {
    color: var(--ds-text-muted);
    font-weight: 500;
    flex: 0 0 45%;
  }

  .table-card-mobile__value {
    color: var(--ds-text-main);
    font-weight: 600;
    text-align: right;
    flex: 0 0 50%;
  }

  /* Adjust font sizes for mobile */
  .ai-perspective__label {
    font-size: 0.8125rem;
  }

  .dashboard-page p,
  .dashboard-page li {
    font-size: 0.875rem;
    line-height: 1.55;
  }

  .dashboard-page h2 {
    font-size: 1.2rem;
  }

  .dashboard-page h3 {
    font-size: 1rem;
  }

  .dashboard-page h4 {
    font-size: 0.875rem;
  }

  /* Optimize spacing */
  .dashboard-grid {
    gap: 0.875rem;
    padding: 0;
    background: transparent;
    border-radius: 0;
  }

  .ai-perspectives-grid {
    gap: 0.75rem !important;
  }

  .ai-perspective {
    padding: 0.75rem !important;
  }

  /* Optimize stage cards */
  .life-stage-item,
  .dashboard-page [style*="padding: 1.5rem"] {
    padding: 0.875rem !important;
  }

  /* Reduce stat spacing */
  .chart-stats {
    gap: 0.5rem !important;
  }

  .stat-item {
    font-size: 0.875rem;
  }

  /* Optimize list spacing */
  .dashboard-page ul {
    padding-left: 1rem;
    margin: 0.5rem 0;
  }

  .dashboard-page li {
    margin: 0.125rem 0;
  }

}

@media (min-width: 769px) {
  .dashboard-grid {
    display: flex;
    flex-direction: column;
  }
  .chart-container {
    height: 400px;
  }
}

/* Table responsive styles for all screen sizes */
.dashboard-page table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
}

.dashboard-page table th,
.dashboard-page table td {
  padding: 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--ds-border);
}

.dashboard-page table th {
  font-weight: 700;
  background: #f9fafb;
  font-size: 0.95rem;
}

.dashboard-page table td {
  font-size: 0.9rem;
}

/* Ensure content doesn't overflow */
.dashboard-inner {
  max-width: 100%;
  overflow-x: hidden;
}

/* Fix for h4 and label font sizes */
.dashboard-page h4,
.dashboard-page label {
  font-size: 0.95rem;
}

/* Related Pages Navigation */
.related-pages-nav {
  margin-top: 2.5rem;
  padding: 1.5rem;
  background: linear-gradient(
    140deg,
    color-mix(in srgb, var(--ds-primary) 84%, #0f172a) 0%,
    color-mix(in srgb, var(--ds-primary) 56%, #0f172a) 100%
  );
  border-radius: 0.75rem;
  color: white;
}

.related-pages-nav__title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0 0 1rem 0;
  text-align: center;
  color: white;
}

.related-pages-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
}

.related-page-card {
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 0.5rem;
  padding: 1rem;
  text-decoration: none;
  color: white;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  cursor: pointer;
}

.related-page-card:hover {
  background: rgba(255, 255, 255, 0.25);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.related-page-card__icon {
  font-size: 2rem;
  margin-bottom: 0.5rem;
  display: block;
}

.related-page-card__title {
  font-size: 0.8125rem;
  font-weight: 600;
  margin: 0 0 0.25rem 0;
  color: white;
}

.related-page-card__desc {
  font-size: 0.75rem;
  opacity: 0.9;
  margin: 0;
  color: white;
  line-height: 1.4;
}

@media (max-width: 768px) {
  .related-pages-nav {
    margin-top: 1.5rem;
    padding: 1rem;
  }

  .related-pages-nav__title {
    font-size: 0.9375rem;
    margin-bottom: 0.75rem;
  }

  .related-pages-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .related-page-card {
    padding: 0.75rem 0.5rem;
    min-height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.4);
  }

  .related-page-card__icon {
    font-size: 1.5rem;
    margin-bottom: 0.375rem;
  }

  .related-page-card__title {
    font-size: 0.75rem;
  }

  .related-page-card__desc {
    font-size: 0.75rem;
    line-height: 1.45;
  }
}

@media (max-width: 600px) {
  .related-pages-grid {
    display: flex;
    overflow-x: auto;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
    scroll-snap-type: x mandatory;
    padding-right: 2.5rem;
  }

  .related-page-card {
    min-width: 160px;
    scroll-snap-align: start;
  }
}

/* Desktop: show tables normally */
@media (min-width: 769px) {
  .table-card-mobile {
    display: none;
  }
}

/* Responsive table styling for compact dashboard tables */
@media (max-width: 768px) {
  /* Make simple two-column tables more readable on mobile */
  .dashboard-page table tr {
    display: flex;
    flex-direction: column;
    padding: 0.5rem;
    border-bottom: 1px solid var(--ds-border);
    background: white;
    margin-bottom: 0.25rem;
    border-radius: 0.25rem;
  }

  .dashboard-page table thead {
    display: none;
  }

  .dashboard-page table td {
    display: flex;
    justify-content: space-between;
    padding: 0.25rem 0 !important;
    border: none !important;
    font-size: 0.75rem !important;
  }

  .dashboard-page table td:first-child {
    font-weight: 500;
    color: var(--ds-text-muted);
    flex: 0 0 60%;
  }

  .dashboard-page table td:last-child {
    font-weight: 700;
    text-align: right;
    flex: 0 0 38%;
  }

  /* Special handling for cost summary rows */
  .dashboard-page table tr[style*="border-top"] {
    background: #f0f9ff;
    font-weight: 700;
    margin-top: 0.5rem;
    padding: 0.75rem !important;
  }

  /* Nested tables within divs */
  .dashboard-page [style*="padding: 1.5rem"] table,
  .dashboard-page [style*="padding: 1.25rem"] table {
    margin: 0.5rem 0;
  }
}

/**
 * Equipment Dashboard & Product Card Styles
 */
.equipment-dashboard {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.equipment-dashboard [id^="equipment-"] {
  scroll-margin-top: 88px;
}

.equipment-quick-nav {
  position: sticky;
  top: 0.5rem;
  z-index: 4;
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.25rem 0.05rem 0.35rem;
  background: color-mix(in srgb, #ffffff 86%, #f8fafc);
}

.equipment-quick-nav__link {
  flex: 0 0 auto;
  text-decoration: none;
  font-size: 0.82rem;
  line-height: 1.2;
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 0.38rem 0.62rem;
}

.equipment-quick-nav__link:hover {
  color: #0f172a;
  background: #e2e8f0;
}

.equipment-quick-nav__link:focus-visible,
.amazon-button:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

.dashboard-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1rem;
}

.summary-card {
  background: #fff;
  border: 0;
  padding: 0.65rem 0.7rem;
  border-radius: 0.45rem;
  display: flex;
  flex-direction: column;
  color: #334155;
}

.summary-card.active {
  box-shadow: none;
}

.summary-label {
  font-size: 0.75rem;
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
  letter-spacing: 0.05em;
  color: #64748b;
  font-weight: 600;
}

.summary-value {
  font-size: 1.55rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}

.dashboard-section .section-header {
  margin-bottom: 1rem;
  border-left: 0;
  padding-left: 0;
}

.dashboard-section .section-title {
  font-size: 1.25rem;
  font-weight: 800;
  margin: 0;
  color: #1e293b;
}

.dashboard-section .section-desc {
  font-size: 0.85rem;
  color: var(--ds-text-muted);
  margin: 0.25rem 0 0 0;
}

.product-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

.product-grid--active {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

/* Dory Product Card */
.dory-product-card {
  background: #ffffff;
  border: 1px solid var(--ds-border);
  border-radius: 0.55rem;
  overflow: hidden;
  transition: border-color 0.2s ease;
  position: relative;
  box-shadow: none;
}

.dory-product-card:hover {
  transform: none;
  box-shadow: none;
}

.dory-product-card.status-active {
  border-color: color-mix(in srgb, var(--ds-border) 92%, #ffffff);
}

.dory-product-card.status-legacy {
  border-color: color-mix(in srgb, #64748b 24%, #e2e8f0);
}

.dory-product-card.status-incompatible {
  border-color: color-mix(in srgb, #dc2626 24%, #fee2e2);
}

.product-card-header {
  background: transparent;
  padding: 0;
  border-bottom: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.system-tag {
  font-family: ui-monospace, monospace;
  font-size: 0.75rem;
  color: #64748b;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.product-status-badge {
  font-family: ui-monospace, monospace;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.24rem 0.55rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  line-height: 1.2;
}

.status-active .product-status-badge {
  background: #ecfdf5;
  color: #166534;
  border: 1px solid rgba(22, 101, 52, 0.16);
}

.status-legacy .product-status-badge {
  background: #f1f5f9;
  color: #475569;
}

.status-incompatible .product-status-badge {
  background: #fee2e2;
  color: #991b1b;
}

.product-card-body {
  padding: 1.25rem;
  display: flex;
  gap: 1.25rem;
}

.product-card-image {
  flex: 0 0 100px;
  height: 100px;
  aspect-ratio: 1 / 1;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid #f1f5f9;
}

.product-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.product-card-image--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
}

.product-card-image__fallback {
  font-size: 0.75rem;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.03em;
}

.product-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.product-title {
  margin: 0 0 0.5rem 0;
  font-size: 1.1rem;
  font-weight: 800;
  color: #1e293b;
  display: flex;
  flex-direction: column;
}

.product-name-en {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--ds-text-muted);
}

.product-log {
  font-size: 0.85rem;
  margin: 0.5rem 0;
  line-height: 1.5;
  color: #475569;
  padding: 0.5rem;
  background: #f8fafc;
  border-radius: 0.25rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-log__label {
  font-weight: 800;
}

.product-log strong {
  font-family: ui-monospace, monospace;
  font-size: 0.75rem;
  color: var(--ds-primary);
  margin-right: 0.5rem;
}

.product-specs {
  display: flex;
  gap: 1.5rem;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px dashed #e2e8f0;
  margin-top: auto;
}

.spec-item {
  display: flex;
  flex-direction: column;
}

.spec-item .label {
  font-size: 0.75rem;
  font-family: ui-monospace, monospace;
  color: #94a3b8;
  margin-bottom: 0.125rem;
}

.spec-item .value {
  font-size: 0.85rem;
  font-weight: 700;
  color: #334155;
}

.product-biometrics {
  margin-top: 1rem;
  padding: 0.75rem;
  background: #fff7ed;
  border-radius: 0.5rem;
  border-left: 3px solid #f97316;
}

.status-incompatible .product-biometrics {
  background: #fef2f2;
  border-left-color: #ef4444;
}

.product-biometrics .label {
  font-family: ui-monospace, monospace;
  font-size: 0.75rem;
  font-weight: 700;
  color: #9a3412;
  display: block;
  margin-bottom: 0.25rem;
}

.product-biometrics .value {
  font-size: 0.8rem;
  margin: 0;
  line-height: 1.5;
  color: #7c2d12;
}

.product-card-footer {
  margin-top: 0.5rem;
  padding: 0;
  background: transparent;
  border-top: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.amazon-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 44px;
  background: #232f3e;
  color: white;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 700;
  padding: 0.6rem 0.9rem;
  border-radius: 0.5rem;
  transition: background 0.2s;
}

.amazon-button:hover {
  background: #374151;
  color: white;
}

.amazon-button--secondary {
  background: #64748b;
  border-color: #475569;
}

.amazon-button--secondary:hover {
  background: #475569;
  border-color: #334155;
}

.amazon-button svg {
  opacity: 0.7;
}

@media (max-width: 768px) {
  .equipment-dashboard {
    gap: 2rem;
  }

  .dashboard-summary-grid {
    gap: 0.75rem;
  }

  .summary-card {
    padding: 0.65rem 0.7rem;
    border-radius: 0.45rem;
  }

  .summary-label {
    font-size: 0.75rem;
    letter-spacing: 0.03em;
  }

  .summary-value {
    margin-top: 0.2rem;
    font-size: 1.6rem;
  }

  .dashboard-section .section-header {
    margin-bottom: 1rem;
    padding-left: 0;
  }

  .dashboard-section .section-title {
    font-size: 1.45rem;
    line-height: 1.35;
  }

  .dashboard-section .section-desc {
    font-size: 1rem;
    line-height: 1.7;
  }

  .product-grid {
    gap: 1rem;
  }

  .product-grid--active {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .product-card-header {
    padding: 0;
  }

  .system-tag {
    font-size: 0.75rem;
    line-height: 1.4;
  }

  .product-status-badge {
    font-size: 0.78rem;
    padding: 0.28rem 0.58rem;
  }

  .product-card-body {
    flex-direction: column;
    gap: 0.9rem;
    padding: 1rem;
  }

  .product-title {
    font-size: 1.05rem;
    line-height: 1.45;
  }

  .product-log {
    margin-top: 0.6rem;
    font-size: 0.9rem;
    line-height: 1.65;
  }

  .spec-item .label {
    font-size: 0.75rem;
  }

  .spec-item .value {
    font-size: 1rem;
    line-height: 1.35;
  }

  .product-card-footer {
    padding: 0.8rem 1rem;
  }

  .amazon-button {
    min-height: 44px;
    font-size: 0.95rem;
    padding: 0.6rem 0.9rem;
  }

  .product-card-image {
    width: min(52%, 180px);
    height: auto;
    flex: none;
    min-height: 0;
    aspect-ratio: 1 / 1;
    align-self: flex-start;
  }
  .product-specs {
    flex-wrap: wrap;
    gap: 1rem;
  }
}

@media (max-width: 480px) {
  .dashboard-summary-grid {
    grid-template-columns: 1fr;
  }

  .summary-card {
    padding: 0.85rem 0.8rem;
  }

  .summary-label {
    font-size: 0.75rem;
  }

  .summary-value {
    font-size: 1.85rem;
  }

  .dashboard-section .section-title {
    font-size: 1.35rem;
  }

  .dashboard-section .section-desc {
    font-size: 0.95rem;
  }

  .product-card-image {
    height: auto;
    min-height: 0;
  }
}

@media (min-width: 900px) {
  .product-grid--active {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Final dashboard readability overrides (mobile-first) */
.dashboard-page .dashboard-card,
.dashboard-page .dashboard-section {
  border-radius: 0.5rem !important;
  box-shadow: none !important;
}

.dashboard-page .dashboard-card p,
.dashboard-page .dashboard-card li,
.dashboard-page .dashboard-section p,
.dashboard-page .dashboard-section li {
  max-width: none !important;
}

.equipment-dashboard .equipment-quick-nav__link,
.equipment-dashboard .product-status-badge {
  border-radius: 0.4rem;
}

.equipment-dashboard .amazon-button {
  border-radius: 0.45rem;
}

.equipment-dashboard .durability-insight-card {
  border-radius: 0.32rem !important;
  padding: 0.9rem 0.85rem !important;
  box-shadow: none !important;
}

.equipment-dashboard .durability-insight-card__list {
  padding-left: 0.95rem;
}

.equipment-dashboard .durability-insight-card__list li {
  padding-left: 0;
}

.equipment-dashboard .product-log {
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.equipment-dashboard .dory-product-card.status-active {
  border-color: color-mix(in srgb, var(--ds-border) 92%, #ffffff);
}

.equipment-dashboard .status-active .product-status-badge {
  background: #ecfdf5;
  color: #166534;
  border: 1px solid rgba(22, 101, 52, 0.16);
}

.equipment-dashboard .product-card-image img {
  object-position: center center;
}

.equipment-dashboard .product-biometrics {
  margin-top: 0.6rem;
  padding: 0.55rem 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid #e5e7eb;
  border-radius: 0;
}

.equipment-dashboard .status-incompatible .product-biometrics {
  background: transparent;
  border-left: 0;
}

@media (max-width: 767px) {
  .equipment-dashboard .product-card-body {
    display: block;
    padding: 0.9rem;
  }

  .equipment-dashboard .product-card-image {
    width: min(34vw, 120px);
    max-width: 120px;
    margin: 0 0 0.45rem;
    border-radius: 0.3rem;
  }

  .equipment-dashboard .durability-insight-card {
    padding: 0.78rem 0.72rem !important;
    border-radius: 0.28rem !important;
  }

  .equipment-dashboard .durability-insight-card__title {
    font-size: 1rem;
  }
}

/* Health class-based cleanup */
.dashboard-page .health-card__lead {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--ds-text-muted);
  line-height: 1.7;
}

.dashboard-page .health-card__stack {
  margin-top: 1rem;
}

.dashboard-page .health-card__list {
  margin: 0;
  padding-left: 1.1rem;
  line-height: 1.7;
  color: var(--ds-text-main);
}

.dashboard-page .health-card__meta {
  margin-top: 0.7rem;
  font-size: 0.875rem;
  color: var(--ds-text-muted);
}

.dashboard-page .health-beta-box,
.dashboard-page .health-baseline-box {
  margin-top: 0.75rem;
  padding: 0.75rem;
  border: 1px solid var(--ds-border);
  border-radius: 0.45rem;
  background: #fff;
}

.dashboard-page .health-beta-box__title,
.dashboard-page .health-baseline-box__title {
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--ds-primary);
  margin-bottom: 0.25rem;
}

.dashboard-page .health-beta-box__desc,
.dashboard-page .health-baseline-box__desc {
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--ds-text-muted);
}

.dashboard-page .health-summary-grid {
  margin-top: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
}

.dashboard-page .health-summary-item {
  padding: 0.75rem;
  background: #fff;
  border-radius: 0.45rem;
  border: 1px solid var(--ds-border);
}

.dashboard-page .health-summary-item__label {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  margin-bottom: 0.2rem;
}

.dashboard-page .health-summary-item__value {
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ds-primary);
}

.dashboard-page .health-summary-item__value.is-ok {
  color: #166534;
}

.dashboard-page .health-summary-item__value.is-warn {
  color: #b45309;
}

.dashboard-page .health-summary-item__note {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: var(--ds-text-muted);
}

.dashboard-page .health-card--usage-guide {
  background: #f8fafc;
}

.dashboard-page .health-usage-guide__lead {
  margin: 0;
  color: var(--ds-text-main);
  line-height: 1.8;
}

.dashboard-page .health-usage-guide__link-wrap {
  margin: 0.7rem 0 0;
}

.dashboard-page .health-usage-guide__link {
  font-weight: 700;
}

.dashboard-page .health-insight-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.dashboard-page .health-insight-header__title {
  margin: 0;
}

.dashboard-page .health-status-badge {
  padding: 0.25rem 0.75rem;
  border-radius: 0.38rem;
  font-size: 0.75rem;
  font-weight: 600;
}

.dashboard-page .health-status-badge.is-ok {
  background: #dcfce7;
  color: #166534;
}

.dashboard-page .health-status-badge.is-warn {
  background: #fee2e2;
  color: #991b1b;
}

.dashboard-page .health-ai-summary {
  margin-bottom: 1rem;
  padding: 0.85rem;
  background: #fff;
  border-radius: 0.45rem;
  border-left: 2px solid var(--ds-primary);
}

.dashboard-page .health-ai-grid {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}

.dashboard-page .health-ai-perspective {
  padding: 0.85rem;
  background: #fff;
  border-radius: 0.45rem;
}

.dashboard-page .health-ai-perspective__label {
  display: block;
  font-size: 0.75rem;
  font-weight: 800;
  margin-bottom: 0.45rem;
}

.dashboard-page .health-ai-perspective__label--veterinarian {
  color: var(--ds-primary);
}

.dashboard-page .health-ai-perspective__label--nutrition {
  color: #10b981;
}

.dashboard-page .health-ai-perspective__label--trainer {
  color: #f59e0b;
}

.dashboard-page .health-ai-perspective__text {
  margin: 0;
  line-height: 1.6;
  color: var(--ds-text-main);
}

.dashboard-page #health-action,
.dashboard-page #health-usage-guide {
  background: #f8fafc;
}

.dashboard-page #health-longevity {
  background: #fffdf7;
}

.dashboard-page #health-weight .dashboard-card__header p,
.dashboard-page #health-alerts .dashboard-card__header p,
.dashboard-page #health-breed-risk .dashboard-card__header p,
.dashboard-page #health-precursor .dashboard-card__header p,
.dashboard-page #personal-baseline .dashboard-card__header p {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--ds-text-muted);
  line-height: 1.65;
}

.dashboard-page #health-weight .chart-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0.85rem !important;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--ds-border);
}

.dashboard-page #health-weight .chart-stats .stat-item {
  padding: 0.65rem;
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.4rem;
}

.dashboard-page #health-weight .chart-stats .stat-item > div:first-child {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  margin-bottom: 0.2rem;
}

.dashboard-page #health-weight .chart-stats .stat-item > div:last-child {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--ds-primary);
}

.dashboard-page #health-alerts .alert {
  padding: 0.9rem;
  margin-bottom: 0.7rem;
  border-radius: 0.45rem;
  border-left: 4px solid var(--alert-accent, #f59e0b);
  background: var(--alert-bg, #fffbeb);
}

.dashboard-page #health-alerts .alert-critical {
  --alert-accent: #dc2626;
  --alert-bg: #fef2f2;
}

.dashboard-page #health-alerts .alert-high {
  --alert-accent: #ea580c;
  --alert-bg: #fff7ed;
}

.dashboard-page #health-alerts .alert-moderate {
  --alert-accent: #f59e0b;
  --alert-bg: #fffbeb;
}

.dashboard-page #health-alerts .alert-low {
  --alert-accent: #16a34a;
  --alert-bg: #f0fdf4;
}

.dashboard-page #health-alerts .alert > div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.45rem;
}

.dashboard-page #health-alerts .alert > div:first-child strong {
  color: var(--alert-accent, #f59e0b);
}

.dashboard-page #health-alerts .alert > div:first-child span {
  font-size: 0.75rem;
  padding: 0.125rem 0.5rem;
  background: var(--alert-accent, #f59e0b);
  color: #fff;
  border-radius: 0.38rem;
}

.dashboard-page #health-alerts .alert p {
  margin: 0;
  color: #374151;
}

.dashboard-page #health-alerts .alert code {
  display: block;
  margin-top: 0.5rem;
  padding: 0.5rem;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 0.25rem;
  font-size: 0.75rem;
  color: #6b7280;
}

.dashboard-page #health-alerts .anomaly-list > div:not(.alert) {
  text-align: center;
  padding: 1.6rem;
  color: var(--ds-text-muted);
}

.dashboard-page #health-breed-risk > div {
  margin-top: 1rem;
}

.dashboard-page #health-breed-risk details {
  margin-top: 1rem;
}

.dashboard-page #health-breed-risk summary {
  cursor: pointer;
  font-weight: 800;
  color: var(--ds-text-main);
}

/* Health/training flattening for inline-heavy blocks */
.dashboard-page .dashboard-grid--health [style*="border-top: 3px solid"],
.dashboard-page .dashboard-grid--training [style*="border-top: 3px solid"] {
  border-top-width: 0 !important;
}

.dashboard-page .dashboard-grid--health [style*="padding: 0.9rem; border: 1px solid var(--ds-border); background:#fff"],
.dashboard-page .dashboard-grid--health [style*="padding: 0.75rem; border-radius: 0.5rem; border: 1px solid var(--ds-border); background: #ffffff"],
.dashboard-page .dashboard-grid--training [style*="padding: 1rem; background: white; border-radius: 0.5rem"] {
  border-radius: 0.4rem !important;
}

/* ==========================================================================
   Dashboard Flat Layout Policy (No Card UI)
   Keep content wide, reduce boxed visuals, and unify readability across pages.
   ========================================================================== */
.dashboard-page .page-hero {
  background: #ffffff;
}

.dashboard-page .page-hero--centered {
  text-align: left;
}

.dashboard-page .hero-content,
.dashboard-page .page-hero__subtitle,
.dashboard-page .page-hero__meta,
.dashboard-page .dashboard-card p,
.dashboard-page .dashboard-card li,
.dashboard-page .dashboard-section p,
.dashboard-page .dashboard-section li {
  max-width: none !important;
}

.dashboard-page .dashboard-grid {
  gap: 0;
}

.dashboard-page .dashboard-card,
.dashboard-page .dashboard-section {
  background: transparent !important;
  border: 0 !important;
  border-inline-start: 4px solid color-mix(in srgb, var(--ds-primary) 18%, transparent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 1rem var(--dashboard-content-inline) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ds-border) 88%, #ffffff) !important;
}

.dashboard-page .dashboard-card:last-child,
.dashboard-page .dashboard-section:last-child {
  border-bottom: 0 !important;
}

.dashboard-page .dashboard-grid > :is(.dashboard-card, .dashboard-section):nth-child(odd) {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ds-primary) 4%, transparent) 0%, transparent 100%) !important;
}

.dashboard-page .dashboard-grid > :is(.dashboard-card, .dashboard-section):nth-child(even) {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ds-secondary) 4%, transparent) 0%, transparent 100%) !important;
}

.dashboard-page .dashboard-grid > :is(.dashboard-card, .dashboard-section) + :is(.dashboard-card, .dashboard-section)::before {
  content: "";
  display: block;
  height: 1px;
  width: min(100%, 980px);
  margin: 0 auto 1rem;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--ds-border) 78%, #ffffff) 16%,
    color-mix(in srgb, var(--ds-border) 78%, #ffffff) 84%,
    transparent 100%
  );
}

.dashboard-page .dashboard-card__header {
  margin-bottom: 0.6rem;
}

.dashboard-page .dashboard-card__title {
  margin-bottom: 0.45rem;
  line-height: 1.35;
}

.dashboard-page .ai-insight-card,
.dashboard-page .ai-summary,
.dashboard-page .ai-perspective,
.dashboard-page .health-summary-item,
.dashboard-page .health-ai-summary,
.dashboard-page .health-ai-perspective {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.dashboard-page .page-hero__quick-link,
.dashboard-page .dashboard-quick-nav__link {
  min-height: 44px;
  align-items: center;
  line-height: 1.35;
}

/* Neutralize inline card boxes inside dashboard template parts */
.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="border: 1px solid"],
.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="border:1px solid"] {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ds-border) 88%, #ffffff) !important;
  background: transparent !important;
}

.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="background: #fff"],
.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="background:#fff"],
.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="background: white"],
.dashboard-page .dashboard-grid :is(div, article, section, details, a, p)[style*="background:white"] {
  background: transparent !important;
}

@media (max-width: 768px) {
  .dashboard-page .page-main {
    gap: 0.2rem;
  }

  .dashboard-page .dashboard-card,
  .dashboard-page .dashboard-section {
    padding: 0.85rem var(--dashboard-content-inline) !important;
    border-inline-start-width: 3px !important;
  }

  .dashboard-page .dashboard-card__title {
    font-size: 1.02rem;
    margin-bottom: 0.35rem;
  }

  .dashboard-page .page-hero__subtitle,
  .dashboard-page .page-hero__meta,
  .dashboard-page .dashboard-card p,
  .dashboard-page .dashboard-card li,
  .dashboard-page .dashboard-section p,
  .dashboard-page .dashboard-section li {
    font-size: 0.95rem;
    line-height: 1.68;
    color: color-mix(in srgb, var(--ds-text-main) 74%, #334155);
  }

  .dashboard-page .page-hero--unified .dory-image-placeholder {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
  }

  .dashboard-page table tr {
    display: flex;
    flex-direction: column;
    padding: 0.45rem 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    margin-bottom: 0 !important;
  }

  .dashboard-page table td {
    border: 0 !important;
    padding: 0.2rem 0 !important;
    font-size: 0.82rem !important;
    background: transparent !important;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.5;
  }

  .dashboard-page table td:first-child,
  .dashboard-page table td:last-child {
    flex: 1 1 auto;
    width: 100%;
    text-align: left;
  }

}

/* ==========================================================================
   Merged from style.css — Master Dashboard Pages
   ========================================================================== */

/* ==========================================================================
   Master Dashboard Pages (health/training/forecast/equipment)
   ========================================================================== */

.dashboard-page .page-wrapper {
  flex: 1;
  min-width: 0;
  order: 1;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}

.dashboard-page.dashboard-legacy .page-hero {
  margin-bottom: 1.25rem;
  border-radius: 0;
  overflow: visible;
}

.dashboard-page.dashboard-legacy .page-hero .hero-content {
  position: relative;
  z-index: 1;
  max-width: 1080px;
  margin: 0 auto;
  padding-left: var(--content-inline-inset);
  padding-right: var(--content-inline-inset);
}

.dashboard-page.dashboard-legacy .page-hero__kicker {
  margin: 0 0 0.6rem 0;
  display: inline-flex;
  align-items: center;
  padding: 0.32rem 0.62rem;
  border-radius: 0.38rem;
  border: 1px solid #cbd5e1;
  background: #f1f5f9;
  color: #1e293b;
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  font-weight: 800;
  text-transform: uppercase;
}

.dashboard-page.dashboard-legacy .page-hero__title {
  margin: 0;
}

.dashboard-page.dashboard-legacy .page-hero__subtitle {
  max-width: 76ch;
}

.dashboard-page.dashboard-legacy .page-hero__meta {
  margin: 0 0 0.8rem 0;
  font-size: var(--text-sm);
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.84);
}

.fixed-page-last-updated {
  width: min(100%, 920px);
  max-width: 920px;
  margin: 1rem auto 0;
  text-align: right;
  padding: 0 clamp(0.75rem, 2vw, 1.25rem);
  font-size: 0.8125rem;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: color-mix(in srgb, var(--text-secondary, #4b5563) 86%, #0f172a);
  opacity: 0.78;
  display: block;
  border: 0;
  background: transparent;
  margin-bottom: 0;
}

.dashboard-page.dashboard-legacy .page-hero__quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1.1rem;
  justify-content: center;
}

.dashboard-page.dashboard-legacy .page-hero__quick-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #1e293b;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 0.38rem;
  padding: 0.35rem 0.7rem;
  font-size: var(--text-xs);
  font-weight: 700;
  transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);
}

.dashboard-page.dashboard-legacy .page-hero__quick-link:hover {
  color: #0f172a;
  background: #e2e8f0;
  border-color: #94a3b8;
}

.dashboard-page.dashboard-legacy .page-main {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.page-main-primary {
  flex: 1;
  min-width: 0;
  order: 1;
}

.fixed-page-shell main {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}

.fixed-page-shell main a,
.fixed-page-shell main code {
  overflow-wrap: anywhere;
  word-break: normal;
}

.fixed-page-shell main pre {
  max-width: 100%;
  overflow-x: auto;
  white-space: pre-wrap;
}

.fixed-page-shell main .wp-block-table,
.fixed-page-shell main table {
  max-width: 100%;
}

.fixed-page-shell main .wp-block-table {
  overflow-x: auto;
}

@media (max-width: 1024px) {
  .fixed-page-shell main table {
    display: block;
    width: 100%;
    overflow-x: auto;
  }
}

.layout-container--archive-redirect {
  padding: 2rem 1rem;
}

.achievement-subtitle {
  margin: 0;
  font-size: 0.875rem;
  color: #4b5563;
}

.dashboard-page .dashboard-controls {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.5rem;
}

.dashboard-page .dashboard-controls select {
  min-width: 170px;
  padding: 0.52rem 2rem 0.52rem 0.75rem;
  border: 1px solid color-mix(in srgb, var(--border) 88%, #fff);
  border-radius: 0.65rem;
  background: #fff;
  color: var(--text-primary);
  font-size: var(--text-sm);
  font-weight: 600;
}

.dashboard-page .dashboard-controls__hint {
  margin: 0.35rem 0 0;
  color: var(--text-secondary);
  font-size: 0.78rem;
  line-height: 1.45;
  text-align: right;
}

.dashboard-page .dashboard-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.dashboard-page .dashboard-quick-nav {
  position: sticky;
  top: 0.5rem;
  z-index: 5;
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.25rem 0.05rem 0.35rem;
  background: color-mix(in srgb, #ffffff 88%, #f8fafc);
}

/* Training dashboard keeps a single reading column on desktop. */
.dashboard-page .dashboard-grid--training {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  max-width: 1080px;
  margin-inline: auto;
}

.dashboard-page .dashboard-grid--training .dashboard-quick-nav {
  grid-column: 1 / -1;
  align-self: start;
  align-items: flex-start;
  flex-wrap: wrap;
}

.dashboard-page .dashboard-quick-nav__link {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  text-decoration: none;
  font-size: 0.82rem;
  line-height: 1.2;
  color: #1e293b;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 0.38rem;
  padding: 0.38rem 0.62rem;
}

.dashboard-page .dashboard-quick-nav__link:hover {
  color: #0f172a;
  background: #e2e8f0;
}

/* Flatten legacy inline-styled cards on health pages */
.dashboard-page .dashboard-grid--health .dashboard-card[style] {
  border-radius: 0.55rem !important;
  box-shadow: none !important;
}

.dashboard-page .dashboard-grid--health [style*="border-radius"] {
  border-radius: 0.45rem !important;
}

.dashboard-page .dashboard-grid--health [style*="border: 1px solid"] {
  border-color: color-mix(in srgb, var(--border) 94%, #ffffff) !important;
}

.dashboard-page .dashboard-grid--health p,
.dashboard-page .dashboard-grid--health li {
  max-width: none;
  line-height: 1.65;
}

.dashboard-page [id^="health-"],
.dashboard-page [id^="training-"],
.dashboard-page [id^="equipment-"] {
  scroll-margin-top: 88px;
}

.dashboard-page .dashboard-grid--health {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  max-width: 1080px;
  margin-inline: auto;
}

@media (min-width: 1025px) {
  .dashboard-page .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.1rem;
  }

  .dashboard-page .dashboard-grid--health {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.35rem;
  }
}

.dashboard-page .dashboard-card {
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--border) 96%, #fff);
  border-radius: 0.6rem;
  padding: 1rem;
  box-shadow: none;
}

.dashboard-page .dashboard-card__header {
  margin-bottom: 0.85rem;
}

.dashboard-page .dashboard-card__title {
  margin: 0;
  color: var(--text-primary);
  line-height: 1.4;
  font-size: clamp(1.02rem, 1.2vw, 1.2rem);
}

.dashboard-page .status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.18rem 0.6rem;
  border-radius: 0.38rem;
  font-size: var(--text-xs);
  font-weight: 700;
}

.dashboard-page .ai-insight-card {
  background: linear-gradient(180deg, #f8fbff 0%, #f7f8ff 100%);
}

.dashboard-page .dashboard-grid--health .dashboard-card {
  border-radius: 0.75rem;
  padding: 1.05rem;
  box-shadow: none;
}

.dashboard-page .dashboard-grid--health .dashboard-card__header {
  margin-bottom: 1rem;
}

.dashboard-page .health-card {
  position: relative;
  overflow: hidden;
}

.dashboard-page .health-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 100%;
  background: linear-gradient(180deg, rgba(255,255,255,0.35), rgba(255,255,255,0));
  pointer-events: none;
}

.dashboard-page .health-card > * {
  position: relative;
}

.dashboard-page .training-metric-explainer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.8rem;
}

.dashboard-page .training-metric-explainer__item {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 0.85rem;
  background: #fff;
  padding: 0.85rem;
}

.dashboard-page .training-metric-explainer__label {
  margin: 0;
  font-size: 0.77rem;
  color: var(--text-secondary);
  font-weight: 700;
}

.dashboard-page .training-metric-explainer__value {
  margin: 0.35rem 0 0;
  font-size: 1.45rem;
  font-weight: 900;
  color: var(--text-primary);
  line-height: 1.2;
}

.dashboard-page .training-metric-explainer__note {
  margin: 0.25rem 0 0;
  font-size: 0.76rem;
  color: var(--text-secondary);
  line-height: 1.5;
}

.dashboard-page .training-card-desc {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--text-secondary);
}

.dashboard-page .training-ai-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
  gap: 0.75rem;
}

.dashboard-page .training-ai-title {
  margin: 0;
}

.dashboard-page .training-ai-badge {
  padding: 0.25rem 0.75rem;
  background: #e0e7ff;
  color: #4338ca;
  border-radius: 0.38rem;
  font-size: 0.75rem;
  font-weight: 600;
}

.dashboard-page .training-ai-summary {
  margin-bottom: 1.5rem;
  padding: 1rem;
  background: #fff;
  border-radius: 0.5rem;
  border-left: 3px solid var(--accent);
}

.dashboard-page .training-ai-grid {
  display: grid;
  gap: 1rem;
  margin-top: 1.5rem;
}

.dashboard-page .training-ai-perspective {
  padding: 1rem;
  background: #fff;
  border-radius: 0.5rem;
}

.dashboard-page .training-ai-perspective__label {
  display: block;
  font-size: 0.75rem;
  font-weight: 800;
  margin-bottom: 0.5rem;
}

.dashboard-page .training-ai-perspective__label--behavior {
  color: #8b5cf6;
}

.dashboard-page .training-ai-perspective__label--trainer {
  color: #f59e0b;
}

.dashboard-page .training-ai-perspective__label--vet {
  color: #dc2626;
}

.dashboard-page .training-ai-perspective__text {
  margin: 0;
  line-height: 1.6;
  color: var(--text-primary);
}

.dashboard-page .training-mastery-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-top: 1rem;
}

@media (min-width: 641px) {
  .dashboard-page .training-mastery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1025px) {
  .dashboard-page .training-mastery-grid {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  }
}

.dashboard-page .training-mastery-item {
  text-align: left;
  padding: 1.125rem;
  border-radius: 0.875rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
}

.dashboard-page .training-mastery-item.is-mastered {
  background: #f0fdf4;
  border-color: #86efac;
  color: inherit;
}

.dashboard-page .training-mastery-item.is-progress {
  background: #fffbeb;
  border-color: #fcd34d;
  color: inherit;
}

.dashboard-page .training-mastery-item.is-needs {
  background: #fff7ed;
  border-color: #fdba74;
  color: inherit;
}

.dashboard-page .training-mastery-item__name {
  display: block;
  margin-bottom: 0;
  color: #0f172a;
  font-size: 1.05rem;
}

.dashboard-page .training-mastery-item__rate {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0;
}

.dashboard-page .training-mastery-item__label {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.5rem;
  border-radius: 9999px;
  background: #f1f5f9;
  color: #475569;
}

.dashboard-page .training-mastery-item.is-mastered .training-mastery-item__label {
  background: #dcfce7;
  color: #166534;
}

.dashboard-page .training-mastery-item.is-progress .training-mastery-item__label {
  background: #fef3c7;
  color: #92400e;
}

.dashboard-page .training-mastery-item.is-needs .training-mastery-item__label {
  background: #ffedd5;
  color: #9a3412;
}

.dashboard-page .training-mastery-item__stats {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}

.dashboard-page .training-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
}

.dashboard-page .training-stat__value {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  line-height: 1.2;
}

.dashboard-page .training-stat__value--date {
  font-size: 0.8rem;
  font-weight: 600;
}

.dashboard-page .training-stat__label {
  font-size: 0.65rem;
  color: #64748b;
  text-transform: none;
}

.dashboard-page .training-mastery-item__no-hint {
  margin: 0.45rem 0 0;
  font-size: 0.72rem;
  line-height: 1.5;
  color: #94a3b8;
  font-style: italic;
}

.dashboard-page .training-mastery-item__context {
  margin-top: 0.45rem;
  font-size: 0.75rem;
  color: #475569;
  font-weight: 500;
}

.dashboard-page .training-location-summary {
  margin-bottom: 1rem;
  padding: 0.9rem 1rem;
  border-radius: 0.875rem;
  background: #f8fafc;
  border: 1px solid #dbe4ee;
}

.dashboard-page .training-location-summary__text {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #334155;
}

.dashboard-page .training-mastery-item__evaluation {
  margin: 0.45rem 0 0;
  font-size: 0.75rem;
  line-height: 1.55;
  color: #64748b;
}

.dashboard-page .training-mastery-item__cases {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.45rem;
}

.dashboard-page .training-case {
  display: inline-block;
  font-size: 0.7rem;
  line-height: 1.4;
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
}

.dashboard-page .training-case--success {
  background: #ecfdf5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

.dashboard-page .training-case--failure {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

.dashboard-page .training-memo-body {
  margin-top: 1rem;
}

.dashboard-page .training-memo-list {
  margin: 0;
  padding-left: 1.25rem;
  line-height: 1.8;
  color: var(--text-primary);
}

.dashboard-page .training-memo-note {
  margin: 0.75rem 0 0;
  font-size: 0.875rem;
  color: var(--text-secondary);
}

.dashboard-page .training-inline-link {
  color: var(--accent);
  font-weight: 700;
  text-decoration: underline;
}

.dashboard-page .training-memo-subnote {
  margin: 0.5rem 0 0;
  font-size: 0.85rem;
  color: var(--text-secondary);
}

.dashboard-page .training-guide-details {
  margin-top: 1rem;
}

.dashboard-page .training-guide-details__summary {
  cursor: pointer;
  font-weight: 800;
  color: var(--text-primary);
}

.dashboard-page .training-guide-box {
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
}

.dashboard-page .training-guide-box--muted {
  margin-top: 1.25rem;
  background: #f8fafc;
}

.dashboard-page .training-guide-box__text {
  margin: 0;
  font-size: 0.875rem;
  color: var(--text-secondary);
  line-height: 1.6;
}

.dashboard-page .training-guide-block {
  margin-top: 1.25rem;
}

.dashboard-page .training-guide-block__title {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  font-weight: 800;
  color: var(--text-primary);
}

.dashboard-page .training-guide-list {
  margin: 0;
  padding-left: 1.25rem;
  line-height: 1.8;
  color: var(--text-primary);
}

.dashboard-page .training-notes-panel {
  grid-column: 1 / -1;
}

.dashboard-page .training-notes-panel__body {
  margin-top: 1rem;
}

.dashboard-page .training-notes-panel__list {
  margin: 0;
  padding-left: 1.25rem;
  line-height: 1.8;
  color: var(--text-primary);
}

.dashboard-page .training-notes-panel__link-wrap {
  margin: 0.75rem 0 0;
}

.dashboard-page .training-notes-panel__link {
  font-weight: 800;
}

.dashboard-page .health-flow-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0.85rem !important;
}

.dashboard-page .dashboard-grid--health .ai-summary,
.dashboard-page .dashboard-grid--health .ai-perspective,
.dashboard-page .dashboard-grid--health .alert,
.dashboard-page .dashboard-grid--health .breed-health-risks details > div > div {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.dashboard-page .dashboard-grid--health .chart-container {
  padding: 0.75rem;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
}

.dashboard-page .dashboard-grid--health .chart-stats {
  gap: 0.85rem !important;
}

.dashboard-page .dashboard-grid--health .anomaly-list {
  display: grid;
  gap: 0.85rem;
}

.dashboard-page .dashboard-grid--health .alert {
  margin-bottom: 0 !important;
  border-radius: 0.9rem !important;
}

.dashboard-page .empty-state {
  text-align: center;
  padding: 1.6rem;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 1rem;
}

.dashboard-page .empty-state__icon {
  display: inline-block;
  font-size: 2rem;
  margin-bottom: 0.5rem;
}

.dashboard-page .empty-state__title {
  margin: 0 0 0.5rem 0;
  font-size: var(--text-lg);
}

.dashboard-page .empty-state__text {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.7;
}

.dashboard-page .chart-container {
  border-radius: 0.85rem;
  border: 1px solid color-mix(in srgb, var(--border-light) 85%, #fff);
  box-shadow: none;
}

.dashboard-page .dashboard-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0.7rem;
  margin-bottom: 1rem;
}

.dashboard-page .summary-card {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  background: #fff;
  border: 0;
  border-radius: 0.45rem;
  padding: 0.65rem 0.7rem;
}

.dashboard-page .summary-card.active {
  border-color: rgba(30, 64, 175, 0.4);
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
}

.dashboard-page .summary-label {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.dashboard-page .summary-value {
  font-size: clamp(1.2rem, 1.8vw, 1.6rem);
  font-weight: 800;
  color: var(--text-primary);
}

.dashboard-page .dashboard-section {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 0.6rem;
  padding: 1rem;
}

.dashboard-page .dashboard-section .section-header {
  border-left: 0;
  padding-left: 0;
}

.dashboard-page .section-header {
  margin-bottom: 0.8rem;
}

.dashboard-page .section-title {
  margin: 0;
  font-size: var(--text-lg);
}

.dashboard-page .section-desc {
  margin: 0.45rem 0 0 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
}

.dashboard-page .product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
}

@media (min-width: 768px) {
  .dashboard-page .product-grid {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }
}

/* Equipment cards: square image baseline + mobile 50% constraint */
.equipment-dashboard .product-card-wrapper {
  height: 100%;
}

.equipment-dashboard {
  --eq-body-size: 0.95rem;
  --eq-body-lh: 1.65;
}

.equipment-dashboard [id^="equipment-"] {
  scroll-margin-top: 88px;
}

.equipment-dashboard .equipment-quick-nav {
  position: sticky;
  top: 0.5rem;
  z-index: 4;
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.25rem 0.05rem 0.35rem;
  background: color-mix(in srgb, #ffffff 86%, #f8fafc);
}

.equipment-dashboard .equipment-quick-nav__link {
  flex: 0 0 auto;
  text-decoration: none;
  font-size: 0.82rem;
  line-height: 1.2;
  color: #334155;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 0.38rem 0.62rem;
}

.equipment-dashboard .equipment-quick-nav__link:hover {
  color: #0f172a;
  background: #e2e8f0;
}

.equipment-dashboard .equipment-quick-nav__link:focus-visible,
.equipment-dashboard .amazon-button:focus-visible,
.equipment-dashboard .durability-table__link:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

.equipment-dashboard .dory-product-card {
  height: 100%;
  border: 1px solid color-mix(in srgb, var(--border) 96%, #fff);
  border-radius: 0.55rem;
  background: #fff;
  padding: 0.8rem 0.75rem;
  box-shadow: none;
}

.equipment-dashboard .dory-product-card.status-active {
  border-color: color-mix(in srgb, #16a34a 28%, #d1fae5);
}

.equipment-dashboard .dory-product-card.status-legacy {
  border-color: color-mix(in srgb, #64748b 24%, #e2e8f0);
}

.equipment-dashboard .dory-product-card.status-incompatible {
  border-color: color-mix(in srgb, #dc2626 24%, #fee2e2);
}

.equipment-dashboard .product-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.5rem;
  padding: 0;
  background: transparent;
  border-bottom: 0;
}

.equipment-dashboard .system-tag {
  font-size: 0.75rem;
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: var(--text-tertiary);
  font-weight: 700;
}

.equipment-dashboard .product-status-badge {
  font-size: 0.75rem;
  padding: 0.24rem 0.55rem;
  border-radius: 999px;
  font-weight: 700;
  color: #0f172a;
  background: #e2e8f0;
  line-height: 1.2;
}

.equipment-dashboard .status-active .product-status-badge {
  background: #ecfdf5;
  color: #166534;
}

.equipment-dashboard .status-legacy .product-status-badge {
  background: #f1f5f9;
  color: #475569;
}

.equipment-dashboard .status-incompatible .product-status-badge {
  background: #fee2e2;
  color: #991b1b;
}

.equipment-dashboard .product-card-body {
  display: flow-root;
}

.equipment-dashboard .product-card-image {
  border: 0;
  border-radius: 0.45rem;
  overflow: hidden;
  background: #f8fafc;
}

.equipment-dashboard .product-card-image img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.equipment-dashboard .product-card-content .product-title {
  margin: 0 0 0.45rem;
  font-size: 1rem;
  line-height: 1.45;
  color: #0f172a;
}

.equipment-dashboard .product-card-content .product-name-en {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  color: var(--text-tertiary);
  font-weight: 500;
}

.equipment-dashboard .product-log {
  margin: 0 0 0.65rem;
  font-size: var(--eq-body-size);
  color: #334155;
  line-height: var(--eq-body-lh);
  padding: 0;
  background: transparent;
  border-radius: 0;
  max-width: none;
}

.equipment-dashboard .product-log__label {
  font-weight: 800;
}

.equipment-dashboard .product-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.35rem 0.55rem;
  border-top: 0;
  padding-top: 0;
}

.equipment-dashboard .product-specs .spec-item {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.equipment-dashboard .product-specs .label {
  display: block;
  font-size: 0.75rem;
  color: var(--text-tertiary);
  font-weight: 700;
  margin-bottom: 0.15rem;
}

.equipment-dashboard .product-specs .value {
  font-size: 0.82rem;
  color: #0f172a;
  font-weight: 700;
}

.equipment-dashboard .product-biometrics {
  margin-top: 0.65rem;
  padding: 0.45rem 0.55rem;
  border-radius: 0.35rem;
  background: #f5faff;
  border: 0;
}

.equipment-dashboard .product-biometrics .label {
  font-size: 0.75rem;
  color: #1d4ed8;
  font-weight: 700;
}

.equipment-dashboard .product-biometrics .value {
  margin: 0.2rem 0 0;
  font-size: 0.8rem;
  color: #1e3a8a;
  line-height: 1.6;
}

.equipment-dashboard .amazon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0.6rem 0.9rem;
  border-radius: 0.5rem;
  background: #1d4ed8;
  color: #fff;
  border: 1px solid #1d4ed8;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 700;
}

.equipment-dashboard .amazon-button:hover {
  background: #1e40af;
  border-color: #1e40af;
  color: #fff;
}

.equipment-dashboard .amazon-button--secondary {
  background: #64748b;
  border-color: #475569;
}

.equipment-dashboard .amazon-button--secondary:hover {
  background: #475569;
  border-color: #334155;
}

.equipment-dashboard .product-card-footer {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 0;
  background: transparent;
  border: 0;
}

.equipment-dashboard .equipment-card-desc {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--text-secondary);
}

.equipment-dashboard .impact-badge--success {
  margin-top: 0.5rem;
  padding: 0.45rem 0.5rem;
  background: #ecfdf5;
  border: 0;
  border-radius: 0.3rem;
  font-size: 0.82rem;
  color: #047857;
}

.equipment-dashboard .impact-badge__list {
  margin: 0;
  padding-left: 1rem;
}

.equipment-dashboard .proven-solutions__grid {
  margin-top: 1rem;
}

.equipment-dashboard .proven-product-card {
  border: 0;
  border-radius: 0.4rem;
  padding: 0.45rem;
  background: #ecfdf5;
}

.equipment-dashboard .proven-product-card__meta {
  margin-top: 0.5rem;
  padding: 0.45rem 0.5rem;
  background: transparent;
  border-radius: 0;
}

.equipment-dashboard .proven-product-card__label {
  color: #047857;
  font-size: 0.8rem;
}

.equipment-dashboard .proven-product-card__list {
  margin: 0.25rem 0 0;
  padding-left: 1rem;
  font-size: 0.88rem;
  color: #065f46;
  max-width: none;
}

.equipment-dashboard .proven-product-card__day-note {
  font-size: 0.7rem;
  color: #6b7280;
}

.equipment-dashboard .durability-panel {
  margin-top: 1.5rem;
}

.equipment-dashboard .durability-intro {
  margin: 0 0 1rem;
  font-size: var(--eq-body-size);
  color: #475569;
  line-height: var(--eq-body-lh);
}

.equipment-dashboard .durability-table-wrap {
  overflow-x: auto;
  margin-bottom: 1.1rem;
}

.equipment-dashboard .durability-table {
  width: 100%;
  font-size: 0.92rem;
  border-collapse: collapse;
  background: transparent;
}

.equipment-dashboard .durability-table__head-row {
  background: transparent;
  border-bottom: 1px solid #dbe2ea;
}

.equipment-dashboard .durability-table__head-cell,
.equipment-dashboard .durability-table__cell {
  padding: 0.6rem 0.45rem;
}

.equipment-dashboard .durability-table__head-cell {
  font-weight: 600;
  color: #1f2937;
  white-space: nowrap;
}

.equipment-dashboard .durability-table__head-cell--left {
  text-align: left;
}

.equipment-dashboard .durability-table__head-cell--center {
  text-align: center;
}

.equipment-dashboard .durability-table__head-cell--right {
  text-align: right;
}

.equipment-dashboard .durability-table__row {
  border-bottom: 1px solid #edf1f5;
}

.equipment-dashboard .durability-table__row.is-alt {
  background: transparent;
}

.equipment-dashboard .durability-table__cell--center {
  text-align: center;
}

.equipment-dashboard .durability-table__cell--right {
  text-align: right;
}

.equipment-dashboard .durability-table__cost {
  font-weight: 700;
  color: #0f172a;
}

.equipment-dashboard .durability-table__cost--high {
  color: #b91c1c;
}

.equipment-dashboard .durability-table__cost--low {
  color: #166534;
}

.equipment-dashboard .durability-table__link {
  color: #0f172a;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.equipment-dashboard .durability-insight-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.9rem;
}

.equipment-dashboard .durability-insight-card {
  width: 100%;
  max-width: none;
  padding: 1rem 0.95rem;
  border-radius: 0.45rem;
  border: 0;
  box-shadow: none;
}

.equipment-dashboard .durability-insight-card--best {
  background: #e8f8ee;
  color: #14532d;
}

.equipment-dashboard .durability-insight-card--caution {
  background: #fdeaea;
  color: #7f1d1d;
}

.equipment-dashboard .durability-insight-card--recommend {
  background: #e8f2fd;
  color: #0c4a6e;
}

.equipment-dashboard .durability-insight-card__title {
  margin: 0 0 0.55rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.45;
}

.equipment-dashboard .durability-insight-card__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: var(--eq-body-size);
  line-height: var(--eq-body-lh);
  max-width: none;
}

.equipment-dashboard .durability-insight-card__list li {
  margin-bottom: 0.3rem;
  overflow-wrap: anywhere;
}

.equipment-dashboard .durability-insight-card__item-label {
  display: inline-block;
  margin-right: 0.25rem;
  line-height: 1.45;
}

.equipment-dashboard .durability-insight-card__item-note {
  display: block;
  margin-top: 0.12rem;
  line-height: var(--eq-body-lh);
}

.equipment-dashboard .durability-insight-card__list li:last-child {
  margin-bottom: 0;
}

.equipment-dashboard .durability-insight-card__text {
  margin: 0;
  font-size: var(--eq-body-size);
  line-height: var(--eq-body-lh);
  max-width: none;
  overflow-wrap: anywhere;
}

.dashboard-page .dashboard-card p,
.dashboard-page .dashboard-card li,
.dashboard-page .dashboard-section p,
.dashboard-page .dashboard-section li {
  max-width: none;
}

@media (min-width: 900px) {
  .equipment-dashboard .durability-insight-grid {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.1rem;
  }
}

.equipment-dashboard .safety-content-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 0.9rem;
  margin-top: 1rem;
}

.equipment-dashboard .safety-item {
  padding: 0.55rem 0.6rem;
  border-radius: 0.35rem;
  background: color-mix(in srgb, #f8fafc 80%, #ffffff);
}

.equipment-dashboard .safety-item h3 {
  margin: 0 0 0.4rem;
}

.equipment-dashboard .safety-item p {
  margin: 0;
  font-size: var(--eq-body-size);
  line-height: var(--eq-body-lh);
  max-width: none;
}

.equipment-dashboard .safety-item__text br + br {
  display: none;
}

.equipment-dashboard .safety-item--danger h3 {
  color: #dc2626;
}

.equipment-dashboard .safety-item--warn h3 {
  color: #f59e0b;
}

.equipment-dashboard .safety-item--info h3 {
  color: #3b82f6;
}

@media (max-width: 767px) {
  .equipment-dashboard .product-card-image {
    float: none;
    width: 100%;
    max-width: 220px;
    margin: 0 0 0.55rem;
  }
}

@media (min-width: 768px) {
  .equipment-dashboard .product-card-body {
    display: grid;
    grid-template-columns: minmax(150px, 180px) minmax(0, 1fr);
    gap: 0.95rem;
    align-items: start;
  }

  .equipment-dashboard .product-card-image {
    width: 100%;
    margin: 0;
  }
}

@media (max-width: 767px) {
  .equipment-dashboard {
    --eq-body-size: 1rem;
    --eq-body-lh: 1.62;
  }

  .dashboard-page .page-hero {
    border-radius: 0;
  }

  .dashboard-page .dashboard-card,
  .dashboard-page .dashboard-section {
    padding: 0.95rem 0.85rem;
    border-radius: 0.45rem;
    box-shadow: none;
    border-width: 0;
  }

  .dashboard-page .dashboard-grid--health .dashboard-card {
    padding: 0.95rem 0.85rem;
    border-radius: 0.45rem;
  }

  .equipment-dashboard .durability-insight-card {
    padding: 0.9rem 0.8rem;
    border-radius: 0.35rem;
  }

  .equipment-dashboard .durability-insight-card__title {
    margin-bottom: 0.5rem;
    font-size: 1.02rem;
  }

  .equipment-dashboard .durability-insight-card__list {
    padding-left: 1rem;
    font-size: 1rem;
    line-height: 1.62;
  }

  .equipment-dashboard .durability-insight-card__text {
    font-size: 1rem;
    line-height: 1.62;
  }

  .equipment-dashboard .durability-insight-card__item-label {
    display: block;
    margin-right: 0;
  }

  .equipment-dashboard .durability-insight-card__item-note {
    margin-top: 0.08rem;
  }

  .equipment-dashboard .dory-product-card {
    padding: 0.7rem 0.65rem;
    border-radius: 0.4rem;
    border-width: 0;
  }

  .equipment-dashboard .product-card-header {
    margin-bottom: 0.45rem;
  }

  .equipment-dashboard .product-card-image {
    border-radius: 0.35rem;
    max-width: 100%;
  }

  .equipment-dashboard .product-log {
    margin-bottom: 0.5rem;
    font-size: var(--eq-body-size);
    line-height: var(--eq-body-lh);
  }

  .equipment-dashboard .product-specs {
    grid-template-columns: 1fr 1fr;
    gap: 0.3rem 0.5rem;
  }

  .equipment-dashboard .product-specs .label {
    font-size: 0.75rem;
  }

  .equipment-dashboard .product-specs .value {
    font-size: 0.88rem;
  }

  .equipment-dashboard .impact-badge--success {
    padding: 0.4rem 0.45rem;
    border-radius: 0.25rem;
  }

  .equipment-dashboard .durability-table {
    font-size: 0.86rem;
  }

  .equipment-dashboard .product-status-badge {
    font-size: 0.78rem;
    padding: 0.28rem 0.58rem;
  }

  .equipment-dashboard .amazon-button {
    width: 100%;
    min-height: 46px;
    font-size: 0.92rem;
  }

  .equipment-dashboard .durability-table thead {
    display: none;
  }

  .equipment-dashboard .durability-table,
  .equipment-dashboard .durability-table tbody,
  .equipment-dashboard .durability-table__row,
  .equipment-dashboard .durability-table__cell {
    display: block;
    width: 100%;
  }

  .equipment-dashboard .durability-table__row {
    border-bottom: 0;
    padding: 0.55rem 0;
  }

  .equipment-dashboard .durability-table__row + .durability-table__row {
    border-top: 1px solid #edf1f5;
  }

  .equipment-dashboard .durability-table__head-cell,
  .equipment-dashboard .durability-table__cell {
    padding: 0.3rem 0;
  }

  .equipment-dashboard .durability-table__cell::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 0.1rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #64748b;
    letter-spacing: 0.01em;
  }

  .equipment-dashboard .durability-table__cell--center,
  .equipment-dashboard .durability-table__cell--right {
    text-align: left;
  }

  .equipment-dashboard .safety-content-grid {
    gap: 0.75rem;
    margin-top: 0.85rem;
  }

  .equipment-dashboard .safety-item p {
    font-size: var(--eq-body-size);
    line-height: var(--eq-body-lh);
  }

  .dashboard-page .dashboard-controls {
    justify-content: flex-start;
  }

  .dashboard-page .dashboard-controls select {
    width: 100%;
    min-width: 0;
  }

}

@media (prefers-reduced-motion: reduce) {
  .equipment-dashboard .equipment-quick-nav__link,
  .equipment-dashboard .amazon-button {
    transition: none !important;
  }
}

/* Forecast hero */
.page-hero--forecast-simple .hero-content {
  max-width: 760px;
  margin: 0 auto;
}

.page-hero--forecast-simple .page-hero__subtitle {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

.dashboard-page .page-hero.page-hero--forecast-simple {
  padding-top: clamp(1.35rem, 3.2vw, 1.9rem);
}

.dashboard-page .page-hero.page-hero--forecast-simple + .page-main {
  padding-top: clamp(0.35rem, 1.2vw, 0.6rem);
}

.forecast-simple-hero-action {
  margin-top: 1rem;
}

.forecast-simple-hero-action .button {
  min-height: 44px;
}

@media (max-width: 680px) {
  .dashboard-page .page-hero.page-hero--forecast-simple {
    padding-top: 1.15rem;
  }
}

/* Forecast experiment */
.forecast-dashboard {
  display: grid;
  gap: 1rem;
}

.forecast-placeholder,
.forecast-notice,
.forecast-block {
  border: 1px solid #d9e3ee;
  border-radius: 1.2rem;
  background:
    radial-gradient(circle at top right, rgba(56, 189, 248, 0.09), rgba(56, 189, 248, 0) 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.96));
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.06);
}

.forecast-placeholder {
  padding: 1.35rem;
  text-align: center;
}

.forecast-placeholder__icon {
  font-size: 1.8rem;
  line-height: 1;
}

.forecast-placeholder__text,
.forecast-placeholder__queued {
  margin: 0.6rem 0 0;
  color: #475569;
}

.forecast-notice {
  padding: 0.95rem 1.1rem;
  border-color: #f5d28b;
  background:
    linear-gradient(135deg, rgba(255, 251, 235, 0.98), rgba(255, 247, 237, 0.98));
}

.forecast-notice p {
  margin: 0;
  color: #92400e;
}

.forecast-block {
  padding: 1.2rem;
}

.forecast-block__header {
  margin-bottom: 1rem;
}

.forecast-block__header h2 {
  margin: 0;
  font-size: clamp(1.15rem, 2vw, 1.5rem);
  line-height: 1.35;
  color: #0f172a;
}

.forecast-block__header p {
  margin: 0.45rem 0 0;
  max-width: 72ch;
  color: #475569;
  line-height: 1.75;
}

.forecast-eyebrow {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #0f766e;
}

.forecast-overview-grid,
.forecast-highlight-grid,
.forecast-proof-grid,
.forecast-current-grid,
.forecast-action-grid {
  display: grid;
  gap: 0.9rem;
}

.forecast-overview-grid {
  grid-template-columns: 1.75fr 1fr;
  align-items: start;
}

.forecast-overview-headline {
  margin: 0;
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  line-height: 1.35;
  color: #0f172a;
}

.forecast-overview-deck {
  margin: 0.6rem 0 0;
  color: #334155;
  line-height: 1.8;
}

.forecast-reason-list {
  margin: 0.9rem 0 0;
  padding-left: 1.1rem;
  color: #334155;
}

.forecast-reason-list li {
  margin: 0.35rem 0;
  line-height: 1.75;
}

.forecast-mini-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
}

.forecast-mini-stat {
  padding: 0.8rem 0.85rem;
  border-radius: 0.95rem;
  background: rgba(248, 250, 252, 0.95);
  border: 1px solid #e2e8f0;
}

.forecast-mini-stat dt {
  margin: 0;
  font-size: 0.78rem;
  color: #64748b;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.forecast-mini-stat dd {
  margin: 0.3rem 0 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: #0f172a;
}

.forecast-highlight-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.forecast-highlight-card,
.forecast-proof-card,
.forecast-current-card,
.forecast-action-card,
.forecast-day-card {
  border: 1px solid #dbe5ef;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.05);
}

.forecast-highlight-card {
  padding: 1rem;
}

.forecast-highlight-card--outdoor {
  background:
    radial-gradient(circle at top right, rgba(251, 191, 36, 0.18), rgba(251, 191, 36, 0) 45%),
    #fff;
}

.forecast-highlight-card--watch {
  background:
    radial-gradient(circle at top right, rgba(251, 113, 133, 0.14), rgba(251, 113, 133, 0) 45%),
    #fff;
}

.forecast-highlight-card--steady {
  background:
    radial-gradient(circle at top right, rgba(45, 212, 191, 0.14), rgba(45, 212, 191, 0) 45%),
    #fff;
}

.forecast-highlight-card__date {
  margin: 0;
  font-size: 0.84rem;
  color: #64748b;
}

.forecast-highlight-card h3 {
  margin: 0.45rem 0 0;
  font-size: 1.05rem;
  color: #0f172a;
}

.forecast-highlight-card__mode {
  margin: 0.4rem 0 0;
  font-size: 0.8rem;
  font-weight: 700;
  color: #0f766e;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.forecast-highlight-card__note {
  margin: 0.55rem 0 0;
  color: #475569;
  line-height: 1.75;
}

.forecast-days-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0.9rem;
}

.forecast-day-card {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  padding: 1rem;
}

.forecast-day-card--watch {
  border-color: #fecdd3;
  box-shadow: 0 14px 38px rgba(190, 24, 93, 0.08);
}

.forecast-day-card--rest {
  border-color: #c7d2fe;
  box-shadow: 0 14px 38px rgba(37, 99, 235, 0.08);
}

.forecast-day-card--outdoor {
  border-color: #fde68a;
  box-shadow: 0 14px 38px rgba(217, 119, 6, 0.08);
}

.forecast-day-card__top,
.forecast-day-card__foot,
.forecast-day-card__badges {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}

.forecast-day-card__badges {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.forecast-day-card__date {
  margin: 0;
  font-size: 0.82rem;
  color: #64748b;
}

.forecast-day-card__weather {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.35rem 0 0;
  font-size: 1.08rem;
  color: #0f172a;
}

.forecast-day-card__weather-icon {
  font-size: 1.1rem;
}

.forecast-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: 1px solid transparent;
}

.forecast-pill--watch,
.forecast-pill--high {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #be123c;
}

.forecast-pill--rest,
.forecast-pill--medium {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4338ca;
}

.forecast-pill--outdoor,
.forecast-pill--low {
  background: #fef3c7;
  border-color: #fde68a;
  color: #b45309;
}

.forecast-pill--balanced {
  background: #ecfeff;
  border-color: #99f6e4;
  color: #0f766e;
}

.forecast-day-card__temp,
.forecast-day-card__narrative {
  margin: 0;
}

.forecast-day-card__temp {
  font-size: 0.9rem;
  color: #475569;
}

.forecast-day-card__narrative {
  color: #334155;
  line-height: 1.75;
}

.forecast-metric-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.45rem;
  margin: 0;
}

.forecast-metric-strip div {
  padding: 0.55rem 0.45rem;
  border-radius: 0.8rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  text-align: center;
}

.forecast-metric-strip dt {
  margin: 0;
  font-size: 0.72rem;
  color: #64748b;
}

.forecast-metric-strip dd {
  margin: 0.22rem 0 0;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.forecast-chip-list,
.forecast-signal-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.forecast-chip-list li,
.forecast-signal-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.22rem 0.65rem;
  border-radius: 999px;
  background: #f8fafc;
  border: 1px solid #dbe5ef;
  color: #334155;
  font-size: 0.78rem;
}

.forecast-day-card__foot {
  margin-top: auto;
  padding-top: 0.15rem;
  font-size: 0.78rem;
  color: #64748b;
}

.forecast-proof-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.forecast-proof-card,
.forecast-current-card,
.forecast-action-card {
  padding: 1rem;
}

.forecast-proof-card h3,
.forecast-current-card h3,
.forecast-action-card h3,
.forecast-action-card h4 {
  margin: 0;
  color: #0f172a;
}

.forecast-proof-card p,
.forecast-current-card p,
.forecast-action-card p {
  line-height: 1.75;
  color: #475569;
}

.forecast-proof-card ul {
  margin: 0.8rem 0 0;
  padding-left: 1.1rem;
  color: #334155;
}

.forecast-proof-card li {
  margin: 0.3rem 0;
}

.forecast-current-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.forecast-current-card--clear {
  background:
    radial-gradient(circle at top right, rgba(45, 212, 191, 0.14), rgba(45, 212, 191, 0) 45%),
    #fff;
}

.forecast-current-card--watch {
  background:
    radial-gradient(circle at top right, rgba(251, 113, 133, 0.14), rgba(251, 113, 133, 0) 45%),
    #fff;
}

.forecast-current-card--learning {
  background:
    radial-gradient(circle at top right, rgba(96, 165, 250, 0.14), rgba(96, 165, 250, 0) 45%),
    #fff;
}

.forecast-current-card__kicker,
.forecast-action-card__kicker {
  margin: 0 0 0.45rem;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #0f766e;
}

.forecast-current-card__meta,
.forecast-action-card__reason {
  margin-top: 0.75rem;
  font-size: 0.88rem;
  color: #64748b;
}

.forecast-current-card__delta {
  margin-top: 0.55rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
}

.forecast-chip-list--focus {
  margin-top: 0.75rem;
}

.forecast-action-stack {
  margin-top: 0.95rem;
  display: grid;
  gap: 0.85rem;
}

.forecast-action-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.forecast-action-card--main {
  background:
    linear-gradient(135deg, rgba(255, 251, 235, 0.95), rgba(255, 255, 255, 0.98));
}

.forecast-block--admin {
  padding-top: 0.9rem;
  padding-bottom: 0.9rem;
}

.forecast-admin summary {
  cursor: pointer;
  font-weight: 700;
  color: #0f172a;
}

.forecast-admin__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  margin: 0.9rem 0 0;
}

.forecast-admin__list div {
  padding: 0.75rem;
  border-radius: 0.8rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.forecast-admin__list dt {
  margin: 0;
  font-size: 0.8rem;
  color: #64748b;
}

.forecast-admin__list dd {
  margin: 0.35rem 0 0;
  color: #0f172a;
}

.forecast-footer {
  padding: 0.2rem 0 0.1rem;
}

.forecast-footer__disclaimer {
  margin: 0;
  font-size: 0.92rem;
  color: #64748b;
  line-height: 1.8;
}

@media (max-width: 980px) {
  .forecast-overview-grid,
  .forecast-proof-grid,
  .forecast-current-grid,
  .forecast-highlight-grid {
    grid-template-columns: 1fr;
  }

  .forecast-action-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .forecast-block {
    padding: 1rem;
  }

  .forecast-mini-stats,
  .forecast-admin__list {
    grid-template-columns: 1fr;
  }

  .forecast-day-card__top {
    flex-direction: column;
  }

  .forecast-day-card__badges {
    justify-content: flex-start;
  }

  .forecast-metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Status badges */
.status-badge {
  padding: 0.25rem 0.6rem;
  border-radius: 9999px;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.7rem;
  background: #f1f5f9;
  color: #475569;
}

.status-open {
  background: #fee2e2;
  color: #b91c1c;
}

.status-resolved,
.status-adopted {
  background: #dcfce7;
  color: #15803d;
}

.status-monitoring,
.status-in_review {
  background: #fef3c7;
  color: #b45309;
}

.tw-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.tw-stat-value {
  font-size: 2rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1;
}

.tw-stat-label {
  font-size: 0.875rem;
  color: #64748b;
  margin-top: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Postmortem: Info note */
.tw-info-note {
  margin-top: 1rem;
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
}

.tw-info-note a {
  color: #3b82f6;
  font-weight: 600;
  text-decoration: underline;
}

/* Postmortem: Two-column dashboard grid */
.tw-dashboard-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}

@media (max-width: 1024px) {
  .tw-dashboard-grid {
    grid-template-columns: 1fr;
    gap: 3rem;
  }
}

.tw-dashboard-col {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-height: 200px;
}

.tw-col-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid #e2e8f0;
  padding-bottom: 1rem;
  margin-bottom: 0.5rem;
}

.tw-col-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.tw-view-all {
  font-size: 0.9rem;
  color: #3b82f6;
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
}

.tw-view-all:hover {
  text-decoration: underline;
}

/* Postmortem: Card list */
.tw-card-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.tw-dashboard-card {
  display: block;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 1.25rem;
  text-decoration: none;
  transition: all 0.2s ease;
}

.tw-dashboard-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  border-color: #cbd5e1;
}

.tw-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.75rem;
  font-size: 0.8rem;
}

.tw-card-date {
  color: #94a3b8;
}

.tw-card-title {
  font-size: 1rem;
  font-weight: 600;
  color: #0f172a;
  margin: 0 0 0.5rem;
  line-height: 1.4;
}

.tw-card-excerpt {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Training Guide Template (migrated from page-training-guide-ja.php) */
/* Training Guide Specific Styles */

.training-guide-page .page-main {
    gap: 0;
}

.training-guide-page .page-hero {
    margin-bottom: clamp(0.75rem, 1.6vw, 1rem);
}

.training-guide-page .page-section {
    padding: 1.3rem var(--content-inline-inset);
    border-radius: 0;
    border: 0;
    background:
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.05) 0, rgba(59, 130, 246, 0) 46%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.72) 0%, rgba(248, 250, 252, 0) 100%);
    box-shadow: none;
}

.training-guide-page .page-main > .page-section:nth-of-type(odd) {
    background:
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.06) 0, rgba(59, 130, 246, 0) 46%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.72) 0%, rgba(248, 250, 252, 0) 100%);
}

.training-guide-page .page-main > .page-section:nth-of-type(even) {
    background:
        radial-gradient(circle at top right, rgba(16, 185, 129, 0.06) 0, rgba(16, 185, 129, 0) 46%),
        linear-gradient(180deg, rgba(248, 250, 252, 0.72) 0%, rgba(248, 250, 252, 0) 100%);
}

.training-guide-page .page-main > .page-section + .page-section::before {
    content: "";
    display: block;
    width: min(100%, 960px);
    height: 1px;
    margin: 0 auto 0.7rem;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(148, 163, 184, 0.5) 16%,
        rgba(148, 163, 184, 0.5) 84%,
        transparent 100%
    );
}

.training-guide-page .page-main > .page-section {
    margin-top: 0.55rem;
}

.training-guide-page .page-main > .page-section:first-of-type {
    margin-top: 0;
}

.training-guide-page .section-header {
    margin-bottom: 0.9rem;
}

.training-guide-page .section-header h2 {
    margin: 0;
    font-size: clamp(1.2rem, 2vw, 1.45rem);
    line-height: 1.4;
    color: #0f172a;
}

.training-guide-page .section-header p {
    margin: 0.45rem 0 0;
    max-width: 72ch;
    color: #475569;
    line-height: 1.75;
}

.training-guide-page .page-section p,
.training-guide-page .page-section li {
    line-height: 1.8;
}

.training-guide-page .card-grid {
    margin-top: 0.85rem;
    gap: 0.9rem;
}

.training-guide-page .card {
    border: 1px solid #dbe2ea;
    border-radius: 0.95rem;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.training-guide-page .card__title {
    line-height: 1.45;
}

@media (min-width: 768px) {
    .training-guide-page .page-section {
        padding: 1.45rem var(--content-inline-inset);
    }
}

@media (max-width: 767px) {
    .training-guide-page .page-section {
        padding: 1.05rem var(--content-inline-inset);
        border-radius: 0;
    }

    .training-guide-page .section-header h2 {
        font-size: 1.1rem;
    }
}

.training-loop-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

/* Data source summary */
.data-source-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 1025px) {
    .data-source-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

.data-source-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.875rem;
    padding: 1rem;
}

.data-source-card--primary {
    background: #eff6ff;
    border-color: #bfdbfe;
}

.data-source-card h3 {
    margin: 0 0 0.5rem 0;
    font-size: 0.95rem;
}

.data-source-card p {
    margin: 0;
    color: #334155;
}

.source-card-note {
    margin-top: 0.5rem !important;
    font-size: 0.8125rem;
    color: #64748b !important;
}

.source-note {
    margin-top: 1rem;
    font-size: 0.875rem;
    color: #475569;
}

/* Key Commands List - Mastery Progress Display */
.key-commands-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 641px) {
    .key-commands-list {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }
}

@media (min-width: 1025px) {
    .key-commands-list {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 1.5rem;
    }
}

.key-command-item {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.25rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.key-command-item--missing {
    background: #f8fafc;
}

@media (min-width: 1025px) {
    .key-command-item {
        padding: 1.5rem;
    }
}

.key-command-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    gap: 0.75rem;
}

.key-command-name {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (min-width: 1025px) {
    .key-command-name {
        font-size: 1.25rem;
    }
}

.key-command-status {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    align-self: flex-start;
}

.key-command-status--mastered {
    background: #dcfce7;
    color: #166534;
}

.key-command-status--progress {
    background: #f1f5f9;
    color: #475569;
}

.key-command-status--missing {
    background: #e2e8f0;
    color: #475569;
}

.key-command-progress-bar {
    height: 0.5rem;
    background: #f1f5f9;
    border-radius: 9999px;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

.key-command-progress-bar .progress {
    height: 100%;
    background: #3b82f6;
    border-radius: 9999px;
    transition: width 1s ease-in-out;
}

.key-command-item--mastered .key-command-progress-bar .progress {
    background: #22c55e;
}

.key-command-item--missing .key-command-progress-bar .progress {
    background: #94a3b8;
}

.key-command-details {
    font-size: 0.8125rem;
    color: #64748b;
    text-align: right;
    overflow-wrap: anywhere;
    word-break: normal;
}

.key-command-rate {
    margin-top: 0.125rem;
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
    text-align: right;
    overflow-wrap: anywhere;
    word-break: normal;
}

.key-command-sense-note {
    margin-top: 0.35rem;
    font-size: 0.75rem;
    color: #64748b;
    text-align: right;
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 640px) {
    .key-command-details,
    .key-command-rate,
    .key-command-sense-note {
        text-align: left;
    }
}

.key-command-breakdown {
    margin-top: 0.5rem;
    font-size: 0.75rem;
    color: #64748b;
}

.command-theme-tags {
    margin-top: 0.625rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.theme-chip {
    display: inline-block;
    font-size: 0.75rem;
    line-height: 1;
    padding: 0.3rem 0.45rem;
    border-radius: 9999px;
    background: #e0f2fe;
    color: #075985;
}

/* Command memo section */
.command-memo-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 1025px) {
    .command-memo-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.command-memo-card {
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1rem;
    background: #ffffff;
}

.command-memo-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.command-memo-header h3 {
    margin: 0;
    font-size: 1.05rem;
    color: #0f172a;
}

.memo-status {
    font-size: 0.75rem;
    line-height: 1;
    font-weight: 700;
    padding: 0.35rem 0.45rem;
    border-radius: 9999px;
}

.memo-status--pending {
    background: #fef3c7;
    color: #92400e;
}

.memo-status--approved {
    background: #dbeafe;
    color: #1e40af;
}

.memo-status--published {
    background: #dcfce7;
    color: #166534;
}

.memo-status--none {
    background: #e2e8f0;
    color: #475569;
}

.memo-theme-line {
    margin: 0.625rem 0 0.5rem;
    color: #475569;
    font-size: 0.8125rem;
}

.memo-title {
    margin: 0.4rem 0 0.5rem;
    color: #0f172a;
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.45;
}

.memo-text {
    margin: 0.35rem 0;
    color: #334155;
    font-size: 0.875rem;
    line-height: 1.5;
}

.memo-more {
    margin: 0.65rem 0 0;
    color: #1d4ed8;
    font-size: 0.8125rem;
}

.memo-empty {
    margin: 0.5rem 0 0;
    color: #64748b;
    font-size: 0.875rem;
}

.command-memo-actions {
    margin-top: 1rem;
}

.command-memo-actions a {
    color: #1d4ed8;
    text-decoration: underline;
}

/* Candidate commands */
.candidate-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.candidate-card {
    border-radius: 0.875rem;
}

.command-period {
    display: block;
}

.candidate-context {
    margin: 0.75rem 0 0;
    font-size: 0.8125rem;
    color: #475569;
    line-height: 1.5;
}

/* Training Dashboard — Redesigned (content-training.php) */

.training-intro-text {
    color: #475569;
    line-height: 1.8;
    max-width: 60ch;
}

/* Overview Metrics Row */
.training-overview-metrics {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    margin: 1.25rem 0;
}

@media (min-width: 641px) {
    .training-overview-metrics {
        grid-template-columns: repeat(4, 1fr);
    }
}

.training-overview-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 0.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.875rem;
    text-align: center;
}

.training-overview-metric__value {
    font-size: 1.5rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
}

.training-overview-metric__label {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
}

/* Mastery Grid — Redesigned */
.training-mastery-item__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.training-mastery-item__category {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 9999px;
    background: #f1f5f9;
    color: #475569;
    white-space: nowrap;
}

.training-mastery-item.is-mastered .training-mastery-item__category {
    background: #dcfce7;
    color: #166534;
}

.training-mastery-item__desc {
    margin: 0 0 0.5rem;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.5;
}

.training-mastery-item__bar-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.training-mastery-item__bar {
    flex: 1;
    height: 0.5rem;
    background: #f1f5f9;
    border-radius: 9999px;
    overflow: hidden;
}

.training-mastery-item__bar-fill {
    height: 100%;
    border-radius: 9999px;
    background: #3b82f6;
    transition: width 0.6s ease;
}

.training-mastery-item.is-mastered .training-mastery-item__bar-fill {
    background: #22c55e;
}

.training-mastery-item.is-needs .training-mastery-item__bar-fill {
    background: #f59e0b;
}

.training-mastery-item__rate {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    min-width: 3rem;
    text-align: right;
}

.training-mastery-item__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.training-mastery-item__sessions {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Empty hint */
.training-empty-hint {
    padding: 1.5rem;
    background: #f8fafc;
    border-radius: 0.875rem;
    border: 1px dashed #cbd5e1;
    text-align: center;
    color: #64748b;
}

.training-empty-hint p {
    margin: 0;
}

/* Method Cards */
.training-method-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .training-method-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}

.dashboard-page .training-memo .training-method-cards {
    grid-template-columns: 1fr;
}

.training-method-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.875rem;
    padding: 1rem;
}

.training-method-card h3 {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    color: #0f172a;
    font-weight: 700;
}

.training-method-card .training-memo-list {
    margin: 0;
    padding-left: 1.25rem;
}

.training-method-card .training-memo-list li {
    margin-bottom: 0.3rem;
    font-size: 0.875rem;
}

/* Tips Grid */
.training-tips-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 641px) {
    .training-tips-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.training-tip-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.875rem;
    padding: 1.25rem;
}

.training-tip-card h3 {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
}

.training-tip-card p {
    margin: 0;
    font-size: 0.875rem;
    color: #475569;
    line-height: 1.7;
}

.training-tip-card .training-inline-link {
    color: #2563eb;
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* Insight Report Template (migrated from page-insight-report.php) */
/* ═══════════════════════════════════════════════════════════
   Insight Report — Scoped CSS
   （theme.css の上に追加するまでのインライン暫定スタイル）
═══════════════════════════════════════════════════════════ */
.insight-report-container { background: var(--color-bg, #0f172a); }

/* Hero */
.ir-hero { padding: 3rem 0 2rem; background: linear-gradient(160deg, #0f172a 60%, #1e293b); border-bottom: 1px solid rgba(255,255,255,.06); }
.ir-hero__eyebrow { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: #60a5fa; margin-bottom: .75rem; }
.ir-hero__title { font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: 700; color: #f1f5f9; margin: 0 0 1rem; line-height: 1.3; }
.ir-hero__subtitle { font-size: .95rem; color: #94a3b8; max-width: 640px; line-height: 1.8; margin-bottom: 1.5rem; }
.ir-hero__meta { display: flex; gap: 1.5rem; flex-wrap: wrap; font-size: .8rem; color: #64748b; }

/* Narrative Card */
.ir-narrative-card { background: rgba(96,165,250,.08); border: 1px solid rgba(96,165,250,.25); border-radius: 10px; padding: 1.25rem; margin-bottom: 1.5rem; max-width: 640px; }
.ir-narrative-card__label { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: #60a5fa; margin-bottom: .75rem; }
.ir-narrative-item { display: flex; gap: .75rem; align-items: baseline; font-size: .875rem; margin-bottom: .4rem; }
.ir-narrative-item__metric { color: #94a3b8; min-width: 120px; }
.ir-narrative-item__value { color: #f1f5f9; font-weight: 600; }
.ir-narrative-item__baseline { font-size: .75rem; color: #64748b; font-weight: 400; }
.ir-narrative-item__sigma { color: #f97316; font-size: .75rem; font-weight: 700; }
.ir-narrative-card__comment { font-size: .8rem; color: #94a3b8; margin: .75rem 0 0; line-height: 1.6; }

/* Section common */
.ir-section-title { font-size: 1.25rem; font-weight: 700; color: #f1f5f9; margin: 0 0 .5rem; }
.ir-subsection-title { font-size: 1rem; font-weight: 600; color: #cbd5e1; margin: 2rem 0 .75rem; }
.ir-section-desc { font-size: .875rem; color: #64748b; margin-bottom: 1.5rem; line-height: 1.7; }
.ir-empty { color: #64748b; font-size: .875rem; }
.ir-muted { color: #64748b; font-size: .8rem; }
.ir-disclaimer { font-size: .75rem; color: #475569; margin-top: 1.25rem; line-height: 1.6; border-left: 3px solid #334155; padding-left: .75rem; }

/* Sections padding */
.ir-summary, .ir-category-ranking, .ir-opportunity, .ir-predictions, .ir-verification, .ir-business { padding: 2.5rem 0; border-bottom: 1px solid rgba(255,255,255,.05); }
.ir-no-data { padding: 3rem 0; text-align: center; color: #64748b; }

/* KPI Grid */
.ir-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1rem; }
.ir-kpi-card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 1.25rem; }
.ir-kpi-card__value { font-size: 1.75rem; font-weight: 700; color: #f1f5f9; line-height: 1; }
.ir-kpi-card__label { font-size: .8rem; color: #94a3b8; margin: .4rem 0 .2rem; }
.ir-kpi-card__sub { font-size: .7rem; color: #475569; }

/* Rank Table */
.ir-rank-table-wrapper { overflow-x: auto; margin-bottom: 1.5rem; }
.ir-rank-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.ir-rank-table th { text-align: left; padding: .625rem .875rem; background: rgba(255,255,255,.04); color: #64748b; font-weight: 500; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; }
.ir-rank-table__row td { padding: .75rem .875rem; border-bottom: 1px solid rgba(255,255,255,.05); color: #cbd5e1; vertical-align: middle; }
.ir-rank-table__row--hot td { background: rgba(251,146,60,.05); }
.ir-rank-table__pv, .ir-rank-table__egr, .ir-rank-table__score { text-align: right; }

/* Badges */
.ir-badge { display: inline-block; font-size: .7rem; font-weight: 600; padding: .2em .55em; border-radius: 4px; letter-spacing: .03em; white-space: nowrap; }
.ir-badge--hot { background: rgba(239,68,68,.15); color: #fca5a5; }
.ir-badge--up  { background: rgba(16,185,129,.15); color: #6ee7b7; }
.ir-badge--flat{ background: rgba(148,163,184,.12); color: #94a3b8; }
.ir-badge--down{ background: rgba(239,68,68,.1);  color: #f87171; }
.ir-badge--na  { background: rgba(100,116,139,.12); color: #64748b; }
.ir-badge--warn{ background: rgba(251,146,60,.15); color: #fdba74; }
.ir-badge--ocean { background: rgba(14,165,233,.15); color: #38bdf8; }
.ir-badge--final  { background: rgba(139,92,246,.15); color: #c4b5fd; }
.ir-badge--interim{ background: rgba(148,163,184,.12); color: #94a3b8; }
.ir-badge--tag { background: rgba(100,116,139,.12); color: #64748b; margin-right: .25rem; }

/* Stars */
.ir-stars { font-size: 1em; }
.ir-stars__filled { color: #fbbf24; }
.ir-stars__empty  { color: #334155; }
.ir-score-pct { font-size: .75rem; color: #64748b; margin-left: .3rem; }
.ir-score-pct--large { font-size: 1rem; color: #94a3b8; }

/* Country List */
.ir-country-list { display: flex; flex-direction: column; gap: .5rem; max-width: 400px; }
.ir-country-item { display: flex; align-items: center; gap: .75rem; font-size: .875rem; }
.ir-country-item__name { min-width: 100px; color: #cbd5e1; }
.ir-country-item__bar-wrap { flex: 1; height: 6px; background: rgba(255,255,255,.08); border-radius: 3px; overflow: hidden; }
.ir-country-item__bar { height: 100%; background: linear-gradient(90deg, #3b82f6, #60a5fa); border-radius: 3px; transition: width .5s ease; }
.ir-country-item__count { font-size: .8rem; color: #64748b; min-width: 48px; text-align: right; }

/* Opportunity */
.ir-opp-list { display: flex; flex-direction: column; gap: 1rem; }
.ir-opp-card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; padding: 1.25rem; }
.ir-opp-card--blue-ocean { border-color: rgba(14,165,233,.3); background: rgba(14,165,233,.05); }
.ir-opp-card__header { display: flex; align-items: center; gap: .75rem; margin-bottom: .875rem; flex-wrap: wrap; }
.ir-opp-card__query { font-size: 1rem; font-weight: 600; color: #f1f5f9; }
.ir-opp-card__metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); gap: .75rem; }
.ir-opp-metric { display: flex; flex-direction: column; gap: .2rem; }
.ir-opp-metric__label { font-size: .7rem; color: #64748b; text-transform: uppercase; letter-spacing: .05em; }
.ir-opp-metric__value { font-size: 1.1rem; font-weight: 600; color: #f1f5f9; }
.ir-opp-metric--score .ir-opp-metric__value { color: #fb923c; }

/* Predictions */
.ir-pred-list { display: flex; flex-direction: column; gap: 1.25rem; }
.ir-pred-card { display: flex; gap: 1.25rem; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; padding: 1.5rem; }
.ir-pred-card__rank { font-size: 2rem; font-weight: 800; color: rgba(96,165,250,.3); line-height: 1; min-width: 2rem; text-align: center; }
.ir-pred-card__body { flex: 1; }
.ir-pred-card__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: .5rem; flex-wrap: wrap; }
.ir-pred-card__topic { font-size: 1.05rem; font-weight: 700; color: #f1f5f9; margin: 0; }
.ir-pred-card__score { display: flex; align-items: center; gap: .4rem; flex-shrink: 0; }
.ir-pred-card__cat   { font-size: .8rem; color: #64748b; margin-bottom: .3rem; }
.ir-pred-card__basis { font-size: .8rem; color: #94a3b8; margin-bottom: .75rem; line-height: 1.5; }

/* Formula details */
.ir-pred-card__formula { font-size: .8rem; color: #64748b; margin-top: .75rem; }
.ir-pred-card__formula summary { cursor: pointer; color: #475569; padding: .25rem 0; }
.ir-pred-card__formula summary:hover { color: #64748b; }
.ir-formula-grid { display: grid; grid-template-columns: 1fr auto; gap: .3rem .75rem; margin: .5rem 0; }
.ir-formula-item { display: contents; }
.ir-formula-item > span { padding: .2rem .4rem; }
.ir-formula-item > span:first-child { color: #475569; }
.ir-formula-item > span:last-child  { color: #94a3b8; text-align: right; font-weight: 600; }
.ir-formula-item--penalty > span { color: #f97316; }
.ir-formula-note { font-size: .7rem; color: #475569; font-family: monospace; background: rgba(0,0,0,.2); padding: .4rem .6rem; border-radius: 4px; margin: .25rem 0 0; line-height: 1.5; }

/* Verification */
.ir-verify-block { margin-bottom: 1.5rem; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 1.25rem; }
.ir-verify-block--final  { border-color: rgba(139,92,246,.25); }
.ir-verify-block--interim { opacity: .85; }
.ir-verify-block__header { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; flex-wrap: wrap; }
.ir-verify-block__period { font-size: .9rem; font-weight: 600; color: #cbd5e1; }
.ir-verify-block__acc   { font-size: .9rem; color: #a78bfa; font-weight: 700; margin-left: auto; }
.ir-verify-results { display: flex; flex-direction: column; gap: .75rem; }
.ir-verify-result { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); border-radius: 8px; padding: 1rem; }
.ir-verify-result--failed { border-color: rgba(239,68,68,.2); background: rgba(239,68,68,.04); }
.ir-verify-result--interim { opacity: .8; }
.ir-verify-result__header { display: flex; align-items: center; gap: .75rem; margin-bottom: .4rem; flex-wrap: wrap; }
.ir-verify-result__topic { font-size: .95rem; font-weight: 600; color: #e2e8f0; }
.ir-verify-result__egr { font-size: .8rem; color: #64748b; margin-bottom: .5rem; }
.ir-failure-report { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid rgba(255,255,255,.06); }
.ir-failure-report__tags { margin-bottom: .4rem; }
.ir-failure-report__text { font-size: .85rem; color: #94a3b8; margin: .3rem 0; line-height: 1.6; }
.ir-failure-report__action { font-size: .85rem; color: #fbbf24; margin: .3rem 0; line-height: 1.6; }

/* Business / Accuracy */
.ir-accuracy-block { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 1.5rem; margin-bottom: 2rem; }
.ir-accuracy-block__header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.ir-accuracy-block__label { font-size: .9rem; font-weight: 600; color: #cbd5e1; }
.ir-accuracy-block__score { font-size: 1.5rem; color: #a78bfa; }
.ir-accuracy-timeline { display: flex; gap: .75rem; align-items: flex-end; height: 80px; margin-bottom: .75rem; }
.ir-acc-dot { display: flex; flex-direction: column; align-items: center; gap: .2rem; flex: 1; max-width: 48px; }
.ir-acc-dot__bar-wrap { flex: 1; width: 100%; display: flex; align-items: flex-end; background: rgba(255,255,255,.05); border-radius: 4px 4px 0 0; min-height: 40px; }
.ir-acc-dot__bar { width: 100%; background: linear-gradient(0deg, #7c3aed, #a78bfa); border-radius: 4px 4px 0 0; transition: height .5s ease; }
.ir-acc-dot__label { font-size: .65rem; color: #475569; }
.ir-acc-dot__score { font-size: .7rem; color: #94a3b8; }
.ir-accuracy-desc { font-size: .8rem; color: #64748b; line-height: 1.7; margin: 0; }

/* CTA Block */
.ir-cta-block { background: linear-gradient(135deg, rgba(124,58,237,.1), rgba(59,130,246,.08)); border: 1px solid rgba(124,58,237,.25); border-radius: 16px; padding: 2rem; text-align: center; }
.ir-cta-block__title { font-size: 1.2rem; font-weight: 700; color: #f1f5f9; margin: 0 0 .75rem; }
.ir-cta-block__desc { font-size: .9rem; color: #94a3b8; margin-bottom: 1.5rem; line-height: 1.7; }
.ir-cta-block__tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.ir-tier { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 8px; padding: 1rem; }
.ir-tier--featured { border-color: rgba(124,58,237,.4); background: rgba(124,58,237,.1); }
.ir-tier__name { font-size: .8rem; font-weight: 700; color: #f1f5f9; margin-bottom: .3rem; }
.ir-tier__desc { font-size: .75rem; color: #94a3b8; line-height: 1.5; }
.ir-cta-button { display: inline-block; background: linear-gradient(90deg, #7c3aed, #3b82f6); color: #fff; font-weight: 700; font-size: .95rem; padding: .75rem 2rem; border-radius: 8px; text-decoration: none; transition: opacity .2s; }
.ir-cta-button:hover { opacity: .85; color: #fff; }

.insight-report-page {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}

.insight-report-page a,
.insight-report-page code {
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width: 767px) {
  .ir-summary,
  .ir-category-ranking,
  .ir-opportunity,
  .ir-predictions,
  .ir-verification,
  .ir-business {
    padding: 1.85rem 0;
  }

  .ir-narrative-card {
    max-width: 100%;
    padding: 1rem;
  }

  .ir-narrative-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3rem;
  }

  .ir-narrative-item__metric {
    min-width: 0;
  }

  .ir-country-list {
    max-width: 100%;
  }

  .ir-country-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem 0.6rem;
    align-items: center;
  }

  .ir-country-item__name,
  .ir-country-item__count {
    min-width: 0;
  }

  .ir-country-item__bar-wrap {
    grid-column: 1 / -1;
  }

  .ir-pred-card {
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.05rem;
  }

  .ir-pred-card__rank {
    min-width: 0;
    text-align: left;
    font-size: 1.4rem;
  }

  .ir-formula-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.3rem;
  }

  .ir-formula-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .ir-formula-item > span:last-child {
    text-align: left;
  }

  .ir-accuracy-block {
    padding: 1rem;
  }

  .ir-accuracy-timeline {
    gap: 0.45rem;
  }

  .ir-acc-dot {
    max-width: none;
  }

  .ir-cta-block {
    padding: 1.2rem;
  }

  .ir-cta-button {
    display: block;
    width: 100%;
    text-align: center;
  }

  .ir-badge {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Compare Tool Template (migrated from page-compare-tool.php) */
.compare-page-wrapper {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

@media (min-width: 1025px) {
	.compare-page-wrapper {
		flex-direction: row;
		align-items: flex-start;
		flex-wrap: nowrap;
	}

	.compare-page-wrapper > .compare-article {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
	}

	.compare-page-wrapper > .fixed-page-sidebar {
		flex: 0 0 260px;
		min-width: 260px;
	}
}

.compare-article {
	width: 100%;
	min-width: 0;
	background: #fff;
	border-radius: 1.75rem;
	box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
	overflow: hidden;
}

.concern-hero {
	padding: 3.5rem 2rem 2.5rem;
	background:
		radial-gradient(circle at top right, rgba(255, 255, 255, 0.82) 0, rgba(255, 255, 255, 0) 38%),
		linear-gradient(135deg, #f9fbff 0%, #eef6ff 52%, #f4f8f1 100%);
	border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.concern-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.45rem 0.8rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.72);
	color: #8a4b08;
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.concern-hero .page-hero__title {
	margin: 1rem 0 0.85rem;
	font-size: clamp(2rem, 4.8vw, 3rem);
	line-height: 1.12;
	color: #172554;
}

.concern-hero.page-hero--unified .page-hero__media {
	margin-top: 1.25rem;
}

.concern-hero.page-hero--unified .dory-image-placeholder {
	border-color: color-mix(in srgb, #2563eb 25%, rgba(148, 163, 184, 0.34));
}

.compare-main {
	padding: 2rem;
}

.compare-main,
.compare-main p,
.compare-main li,
.compare-summary-card__title,
.issue-chip__text,
.issue-panel__title h2,
.related-link strong,
.related-link span {
	overflow-wrap: anywhere;
	word-break: normal;
}

.compare-summary-card__title,
.issue-chip__text,
.issue-panel__title {
	min-width: 0;
}

.orientation-card {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	padding: 1.5rem;
	border: 1px solid #e2e8f0;
	border-radius: 1.5rem;
	background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.orientation-card__copy h2 {
	margin: 0 0 0.75rem;
	font-size: 1.2rem;
	color: #0f172a;
}

.orientation-card__copy > p:not(.orientation-card__note) {
	margin: 0;
	line-height: 1.8;
	color: #475569;
}

.orientation-card__principles {
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.75rem;
}

.orientation-card__principles li {
	padding: 0.85rem 1rem;
	border-radius: 1rem;
	background: rgba(255, 255, 255, 0.82);
	border: 1px solid #e2e8f0;
	color: #334155;
	line-height: 1.7;
}

.orientation-card__principles strong {
	display: inline-block;
	margin-right: 0.5rem;
	color: #0f172a;
}

.orientation-card__copy .orientation-card__note {
	margin: 1rem 0 0;
	padding: 0.95rem 1rem;
	border-left: 4px solid #f59e0b;
	background: rgba(255, 251, 235, 0.95);
	border-radius: 0.95rem;
}

.orientation-card__steps {
	display: grid;
	gap: 0.9rem;
	align-content: start;
	padding-top: 0.25rem;
}

.orientation-step {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.9rem 1rem;
	border-radius: 1rem;
	background: #fff;
	border: 1px solid #e2e8f0;
}

.orientation-step strong {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 999px;
	background: #dbeafe;
	color: #1d4ed8;
	font-size: 0.95rem;
}

.issue-selector {
	margin-top: 1.5rem;
}

.issue-selector__lead {
	margin: 0 0 0.75rem;
	font-size: 0.86rem;
	color: #64748b;
	font-weight: 700;
}

.compare-strip {
	margin-top: 1.5rem;
	padding: 1.2rem;
	border-radius: 1.35rem;
	border: 1px solid #dbeafe;
	background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.compare-strip__header h2 {
	margin: 0;
	font-size: 1.08rem;
	color: #0f172a;
}

.compare-strip__header p {
	margin: 0.35rem 0 0;
	font-size: 0.9rem;
	color: #64748b;
	line-height: 1.6;
}

.compare-strip__grid {
	margin-top: 0.95rem;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.8rem;
}

.compare-summary-card {
	text-align: left;
	width: 100%;
	padding: 0.9rem;
	border: 1px solid #cbd5e1;
	border-radius: 1rem;
	background: #fff;
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.compare-summary-card:hover,
.compare-summary-card:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
	border-color: #93c5fd;
	outline: none;
}

.compare-summary-card.is-active {
	border-color: #2563eb;
	background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
	box-shadow: 0 12px 28px rgba(37, 99, 235, 0.11);
}

.compare-summary-card__title {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1rem;
	color: #0f172a;
	margin-top: 0.15rem;
}

.compare-summary-card__priority {
	display: inline-flex;
	align-items: center;
	padding: 0.12rem 0.5rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.compare-summary-card__priority.is-now {
	background: #fee2e2;
	color: #991b1b;
}

.compare-summary-card__priority.is-week {
	background: #fef3c7;
	color: #92400e;
}

.compare-summary-card__priority.is-watch {
	background: #e0f2fe;
	color: #075985;
}

.compare-summary-card__kicker {
	margin: 0.45rem 0 0;
	font-size: 0.76rem;
	color: #475569;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.compare-summary-card__points {
	margin: 0.55rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.45rem;
	font-size: 0.75rem;
	color: #334155;
	line-height: 1.5;
}

.compare-summary-card__points span {
	display: inline-block;
	margin-right: 0.25rem;
	font-weight: 800;
	color: #1e3a8a;
}

.issue-selector__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.issue-chip {
	display: flex;
	align-items: flex-start;
	gap: 0.9rem;
	width: 100%;
	padding: 1rem;
	border: 1px solid #cbd5e1;
	border-radius: 1.2rem;
	background: #fff;
	text-align: left;
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.issue-chip:hover,
.issue-chip:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
	border-color: #93c5fd;
	outline: none;
}

.issue-chip.is-active {
	border-color: #2563eb;
	background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
	box-shadow: 0 12px 30px rgba(37, 99, 235, 0.12);
}

.issue-chip__icon {
	font-size: 1.45rem;
	line-height: 1;
}

.issue-chip__text {
	display: grid;
	gap: 0.25rem;
}

.issue-chip__text strong {
	font-size: 1rem;
	color: #0f172a;
}

.issue-chip__text small {
	color: #64748b;
	line-height: 1.55;
}

.issue-panel {
	margin-top: 1.5rem;
	padding: 1.5rem;
	border-radius: 1.5rem;
	background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
	border: 1px solid #e2e8f0;
}

.issue-panel__header {
	display: grid;
	gap: 1rem;
}

.issue-panel__title {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.issue-panel__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 1rem;
	background: #eff6ff;
	font-size: 1.7rem;
}

.issue-panel__kicker {
	margin: 0 0 0.25rem;
	font-size: 0.82rem;
	font-weight: 800;
	letter-spacing: 0.03em;
	color: #b45309;
	text-transform: uppercase;
}

.issue-panel__title h2 {
	margin: 0;
	font-size: 1.55rem;
	color: #0f172a;
}

.issue-panel__summary {
	margin: 0;
	max-width: 820px;
	line-height: 1.85;
	color: #475569;
}

.quick-diagnosis {
	margin-top: 1.5rem;
	padding: 1.25rem;
	border-radius: 1.35rem;
	border: 1px solid #bfdbfe;
	background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.quick-diagnosis__header {
	display: grid;
	gap: 0.75rem;
}

.quick-diagnosis__eyebrow {
	margin: 0 0 0.45rem;
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #1d4ed8;
	text-transform: uppercase;
}

.quick-diagnosis__header h3 {
	margin: 0;
	font-size: 1.15rem;
	color: #0f172a;
}

.quick-diagnosis__header p {
	margin: 0;
	color: #475569;
	line-height: 1.75;
}

.quick-diagnosis__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	margin-top: 1rem;
}

.quick-question {
	padding: 1rem;
	border-radius: 1.1rem;
	background: rgba(255, 255, 255, 0.94);
	border: 1px solid #dbeafe;
}

.quick-question--wide {
	grid-column: 1 / -1;
}

.quick-question__label {
	margin: 0 0 0.75rem;
	font-size: 0.9rem;
	font-weight: 800;
	color: #0f172a;
}

.quick-question__hint {
	margin: 0.75rem 0 0;
	font-size: 0.84rem;
	line-height: 1.65;
	color: #64748b;
}

.diagnosis-choice-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.diagnosis-choice {
	padding: 0.75rem 1rem;
	border-radius: 999px;
	border: 1px solid #cbd5e1;
	background: #fff;
	color: #1e293b;
	font-size: 0.88rem;
	font-weight: 700;
	cursor: pointer;
	transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.diagnosis-choice:hover,
.diagnosis-choice:focus-visible {
	transform: translateY(-1px);
	border-color: #60a5fa;
	outline: none;
}

.diagnosis-choice.is-active {
	border-color: #1d4ed8;
	background: #1d4ed8;
	color: #fff;
}

.diagnosis-choice--danger.is-active {
	border-color: #dc2626;
	background: #dc2626;
}

.diagnosis-result {
	margin-top: 1rem;
	padding: 1rem 1.1rem;
	border-radius: 1.1rem;
	border: 1px solid #dbeafe;
	background: #fff;
}

.diagnosis-result__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

.diagnosis-result__badge {
	display: inline-flex;
	align-items: center;
	padding: 0.18rem 0.6rem;
	border-radius: 999px;
	font-size: 0.76rem;
	font-weight: 800;
	letter-spacing: 0.02em;
}

.diagnosis-result__badge.is-now {
	background: #fee2e2;
	color: #991b1b;
}

.diagnosis-result__badge.is-week {
	background: #fef3c7;
	color: #92400e;
}

.diagnosis-result__badge.is-watch {
	background: #e0f2fe;
	color: #075985;
}

.diagnosis-result__header h3 {
	margin: 0;
	font-size: 1rem;
	color: #0f172a;
}

.diagnosis-result__summary {
	margin: 0.55rem 0 0;
	color: #475569;
	line-height: 1.75;
}

.diagnosis-result__list {
	margin-top: 0.85rem;
}

.situation-switcher {
	margin-top: 1.5rem;
	padding: 1.2rem;
	border-radius: 1.25rem;
	background: #fff;
	border: 1px solid #dbeafe;
}

.situation-switcher__label {
	margin: 0 0 0.9rem;
	font-size: 0.9rem;
	font-weight: 800;
	color: #1e3a8a;
}

.situation-switcher__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.situation-chip {
	padding: 0.7rem 1rem;
	border-radius: 999px;
	border: 1px solid #bfdbfe;
	background: #eff6ff;
	color: #1d4ed8;
	font-size: 0.88rem;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.situation-chip.is-active,
.situation-chip:hover,
.situation-chip:focus-visible {
	background: #1d4ed8;
	border-color: #1d4ed8;
	color: #fff;
	outline: none;
}

.situation-note {
	margin-top: 1rem;
	padding: 1rem 1.1rem;
	border-radius: 1rem;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
}

.situation-note h3 {
	margin: 0 0 0.45rem;
	font-size: 1rem;
	color: #0f172a;
}

.situation-note p {
	margin: 0;
	line-height: 1.75;
	color: #475569;
}

.issue-layout {
	display: grid;
	gap: 1.25rem;
	margin-top: 1.5rem;
}

.detail-card {
	padding: 1.25rem;
	border-radius: 1.25rem;
	background: #fff;
	border: 1px solid #e2e8f0;
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.detail-card__header h3,
.detail-card h3 {
	margin: 0;
	font-size: 1.05rem;
	color: #0f172a;
}

.detail-card__header p {
	margin: 0.45rem 0 0;
	color: #64748b;
	line-height: 1.7;
	font-size: 0.92rem;
}

.detail-card__eyebrow {
	margin: 0 0 0.6rem;
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: #b45309;
	text-transform: uppercase;
}

.detail-card__body {
	margin: 0;
	line-height: 1.8;
	color: #334155;
}

.detail-card--story {
	background: linear-gradient(180deg, #fff7ed 0%, #ffffff 100%);
	border-color: #fed7aa;
}

.story-highlight {
	margin-top: 1rem;
	padding: 1rem 1.05rem;
	border-radius: 1rem;
	background: rgba(255, 255, 255, 0.92);
	border: 1px solid #fde68a;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.story-highlight .detail-card__body {
	font-size: 0.98rem;
	line-height: 1.9;
}

.story-takeaways {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(251, 191, 36, 0.28);
}

.story-takeaways__label {
	margin: 0;
	font-size: 0.82rem;
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #92400e;
}

.detail-list--story {
	margin-top: 0.8rem;
	padding-left: 1.1rem;
}

.detail-list--story li::marker {
	color: #ea580c;
}

.detail-card--memo {
	background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.detail-card--actions {
	background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
}

.detail-card--planner {
	background: linear-gradient(180deg, #eef6ff 0%, #ffffff 100%);
	border-color: #bfdbfe;
}

.detail-card--focus {
	background: linear-gradient(180deg, #f7fee7 0%, #ffffff 100%);
}

.detail-card--note {
	background: linear-gradient(180deg, #fef2f2 0%, #ffffff 100%);
}

.detail-list {
	margin: 1rem 0 0;
	padding-left: 1.2rem;
	display: grid;
	gap: 0.8rem;
	color: #334155;
	line-height: 1.8;
}

.detail-list--ordered {
	padding-left: 1.4rem;
}

.detail-list--compact {
	gap: 0.55rem;
}

.detail-list--warning li::marker {
	color: #dc2626;
}

.detail-card__subheading {
	margin: 1rem 0 0;
	font-size: 0.95rem;
	color: #166534;
}

.template-copy-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-top: 1rem;
}

.template-copy-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
}

.template-copy-pill {
	display: inline-flex;
	align-items: center;
	padding: 0.45rem 0.8rem;
	border-radius: 999px;
	background: #dbeafe;
	color: #1d4ed8;
	font-size: 0.82rem;
	font-weight: 800;
}

.template-copy-pill--muted {
	background: #eff6ff;
	color: #334155;
}

.template-copy-points {
	margin-top: 1rem;
}

.template-copy-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1rem;
}

.template-copy-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.7rem 1rem;
	border-radius: 999px;
	border: 1px solid #bfdbfe;
	background: #fff;
	color: #1d4ed8;
	font-size: 0.88rem;
	font-weight: 800;
	cursor: pointer;
	transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.template-copy-button:hover,
.template-copy-button:focus-visible {
	transform: translateY(-1px);
	border-color: #60a5fa;
	outline: none;
}

.template-copy-button--primary {
	background: #1d4ed8;
	border-color: #1d4ed8;
	color: #fff;
}

.template-copy-status {
	margin: 0.95rem 0 0;
	font-size: 0.84rem;
	line-height: 1.6;
	color: #64748b;
}

.template-copy-status.is-success {
	color: #166534;
}

.template-copy-status.is-error {
	color: #b91c1c;
}

.template-copy-status.is-muted {
	color: #64748b;
}

.template-copy-preview {
	margin-top: 1rem;
	padding: 1rem 1.05rem;
	border-radius: 1rem;
	border: 1px solid #dbeafe;
	background: rgba(255, 255, 255, 0.94);
}

.template-copy-preview__label {
	margin: 0;
	font-size: 0.82rem;
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: #1e3a8a;
}

.template-copy-preview__body {
	margin: 0.55rem 0 0;
	white-space: pre-line;
	line-height: 1.75;
	color: #334155;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.issue-footer {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	margin-top: 1.5rem;
}

.related-links {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.9rem;
	margin-top: 1rem;
}

.related-link {
	display: grid;
	gap: 0.35rem;
	padding: 1rem;
	border-radius: 1rem;
	border: 1px solid #dbeafe;
	background: #f8fbff;
	text-decoration: none;
}

.related-link strong {
	color: #1d4ed8;
	font-size: 0.95rem;
}

.related-link span {
	color: #475569;
	font-size: 0.86rem;
	line-height: 1.6;
}

.related-link:hover,
.related-link:focus-visible {
	border-color: #60a5fa;
	background: #eff6ff;
	outline: none;
}

@media (max-width: 1024px) {
	.quick-diagnosis__grid,
	.compare-strip__grid,
	.orientation-card,
	.issue-layout,
	.issue-footer,
	.issue-selector__grid,
	.related-links {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 1025px) {
	.compare-main {
		max-width: 860px;
		margin: 0 auto;
	}
}

@media (max-width: 767px) {
	.compare-page-wrapper {
		gap: 0;
	}

	.compare-article {
		border-radius: 0;
		box-shadow: none;
		overflow: visible;
	}

	.concern-hero {
		padding: 2.25rem 1.25rem 1.75rem;
	}

	.compare-main,
	.issue-panel {
		padding: 1.1rem;
	}

	.compare-strip {
		padding: 1rem;
		border-radius: 1rem;
	}

	.issue-panel {
		margin-top: 1.1rem;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	.orientation-card,
	.detail-card,
	.situation-switcher,
	.quick-diagnosis {
		padding: 1rem;
	}

	.orientation-card,
	.situation-switcher,
	.quick-diagnosis,
	.situation-note {
		border-radius: 0.9rem;
	}

	.orientation-card {
		background: #fff;
		border-color: #e2e8f0;
	}

	.issue-layout {
		gap: 0;
		margin-top: 1rem;
		background: #fff;
		border-top: 1px solid #e2e8f0;
	}

	.detail-card {
		padding: 1rem 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		border-bottom: 1px solid #e2e8f0;
	}

	.detail-card:first-child {
		padding-top: 0;
	}

	.detail-card:last-child {
		border-bottom: 0;
	}

	.detail-card--story,
	.detail-card--memo,
	.detail-card--actions,
	.detail-card--focus,
	.detail-card--note {
		background: transparent;
		border-color: transparent;
	}

	.story-highlight {
		margin-top: 0.8rem;
		padding: 0 0 0 0.9rem;
		border: 0;
		border-left: 3px solid #f59e0b;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
	}

	.story-highlight .detail-card__body {
		font-size: 1rem;
		line-height: 1.95;
	}

	.story-takeaways {
		margin-top: 0.8rem;
		padding-top: 0.85rem;
	}

	.issue-footer {
		gap: 0;
		margin-top: 1rem;
		border-top: 1px solid #e2e8f0;
	}

	.issue-footer .detail-card {
		padding: 1rem 0;
	}

	.issue-panel__title {
		align-items: flex-start;
	}

	.issue-chip {
		padding: 0.9rem;
	}

	.template-copy-actions {
		flex-direction: column;
	}

	.template-copy-button {
		width: 100%;
		justify-content: center;
	}
}

/* Final dashboard readability overrides (mobile-first) */
.dashboard-page .dashboard-card,
.dashboard-page .dashboard-section {
	border-radius: 0.5rem !important;
	box-shadow: none !important;
}

.dashboard-page .dashboard-card p,
.dashboard-page .dashboard-card li,
.dashboard-page .dashboard-section p,
.dashboard-page .dashboard-section li {
	max-width: none !important;
}

.equipment-dashboard .equipment-quick-nav__link,
.equipment-dashboard .product-status-badge {
	border-radius: 0.4rem;
}

.equipment-dashboard .amazon-button {
	border-radius: 0.45rem;
}

.equipment-dashboard .durability-insight-card {
	border-radius: 0.32rem !important;
	padding: 0.9rem 0.85rem !important;
	box-shadow: none !important;
}

.equipment-dashboard .durability-insight-card__list {
	padding-left: 0.95rem;
}

.equipment-dashboard .durability-insight-card__list li {
	padding-left: 0;
}

.equipment-dashboard .product-log {
	padding: 0;
	background: transparent;
	border-radius: 0;
}

.equipment-dashboard .product-biometrics {
	margin-top: 0.6rem;
	padding: 0.55rem 0 0;
	background: transparent;
	border: 0;
	border-top: 1px solid #e5e7eb;
	border-radius: 0;
}

.equipment-dashboard .status-incompatible .product-biometrics {
	background: transparent;
	border-left: 0;
}

@media (max-width: 767px) {
	.equipment-dashboard .product-card-body {
		display: block;
		padding: 0.9rem;
	}

	.equipment-dashboard .product-card-image {
		width: min(34vw, 120px);
		max-width: 120px;
		margin: 0 0 0.45rem;
		border-radius: 0.3rem;
	}

	.equipment-dashboard .durability-insight-card {
		padding: 0.78rem 0.72rem !important;
		border-radius: 0.28rem !important;
	}

	.equipment-dashboard .durability-insight-card__title {
		font-size: 1rem;
	}
}

/* Health class-based cleanup */
.dashboard-page .health-card__lead {
	margin: 0.5rem 0 0;
	font-size: 0.875rem;
	color: var(--text-secondary);
	line-height: 1.7;
}

.dashboard-page .health-card__stack {
	margin-top: 1rem;
}

.dashboard-page .health-card__list {
	margin: 0;
	padding-left: 1.1rem;
	line-height: 1.7;
	color: var(--text-primary);
}

.dashboard-page .health-card__meta {
	margin-top: 0.7rem;
	font-size: 0.875rem;
	color: var(--text-secondary);
}

.dashboard-page .health-beta-box,
.dashboard-page .health-baseline-box {
	margin-top: 0.75rem;
	padding: 0.75rem;
	border: 1px solid var(--border);
	border-radius: 0.45rem;
	background: #fff;
}

.dashboard-page .health-beta-box__title,
.dashboard-page .health-baseline-box__title {
	font-size: 0.8rem;
	font-weight: 800;
	color: var(--accent);
	margin-bottom: 0.25rem;
}

.dashboard-page .health-beta-box__desc,
.dashboard-page .health-baseline-box__desc {
	font-size: 0.85rem;
	line-height: 1.6;
	color: var(--text-secondary);
}

.dashboard-page .health-summary-grid {
	margin-top: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
}

.dashboard-page .health-summary-item {
	padding: 0.75rem;
	background: #fff;
	border-radius: 0.45rem;
	border: 1px solid var(--border);
}

.dashboard-page .health-summary-item__label {
	font-size: 0.75rem;
	color: var(--text-secondary);
	margin-bottom: 0.2rem;
}

.dashboard-page .health-summary-item__value {
	font-size: 1.125rem;
	font-weight: 800;
	color: var(--accent);
}

.dashboard-page .health-summary-item__value.is-ok {
	color: #166534;
}

.dashboard-page .health-summary-item__value.is-warn {
	color: #b45309;
}

.dashboard-page .health-summary-item__note {
	margin-top: 0.25rem;
	font-size: 0.75rem;
	color: var(--text-secondary);
}

.dashboard-page .health-card--usage-guide {
	background: #f8fafc;
}

.dashboard-page .health-usage-guide__lead {
	margin: 0;
	color: var(--text-primary);
	line-height: 1.8;
}

.dashboard-page .health-usage-guide__link-wrap {
	margin: 0.7rem 0 0;
}

.dashboard-page .health-usage-guide__link {
	font-weight: 700;
}

.dashboard-page .health-insight-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1.25rem;
}

.dashboard-page .health-insight-header__title {
	margin: 0;
}

.dashboard-page .health-status-badge {
	padding: 0.25rem 0.75rem;
	border-radius: 0.38rem;
	font-size: 0.75rem;
	font-weight: 600;
}

.dashboard-page .health-status-badge.is-ok {
	background: #dcfce7;
	color: #166534;
}

.dashboard-page .health-status-badge.is-warn {
	background: #fee2e2;
	color: #991b1b;
}

.dashboard-page .health-ai-summary {
	margin-bottom: 1rem;
	padding: 0.85rem;
	background: #fff;
	border-radius: 0.45rem;
	border-left: 2px solid var(--accent);
}

.dashboard-page .health-ai-grid {
	display: grid;
	gap: 0.75rem;
	margin-top: 1rem;
}

.dashboard-page .health-ai-perspective {
	padding: 0.85rem;
	background: #fff;
	border-radius: 0.45rem;
}

.dashboard-page .health-ai-perspective__label {
	display: block;
	font-size: 0.75rem;
	font-weight: 800;
	margin-bottom: 0.45rem;
}

.dashboard-page .health-ai-perspective__label--veterinarian {
	color: var(--accent);
}

.dashboard-page .health-ai-perspective__label--nutrition {
	color: #10b981;
}

.dashboard-page .health-ai-perspective__label--trainer {
	color: #f59e0b;
}

.dashboard-page .health-ai-perspective__text {
	margin: 0;
	line-height: 1.6;
	color: var(--text-primary);
}

.dashboard-page #health-action,
.dashboard-page #health-usage-guide {
	background: #f8fafc;
}

.dashboard-page #health-longevity {
	background: #fffdf7;
}

.dashboard-page #health-weight .dashboard-card__header p,
.dashboard-page #health-alerts .dashboard-card__header p,
.dashboard-page #health-breed-risk .dashboard-card__header p,
.dashboard-page #health-precursor .dashboard-card__header p,
.dashboard-page #personal-baseline .dashboard-card__header p {
	margin: 0.5rem 0 0;
	font-size: 0.875rem;
	color: var(--text-secondary);
	line-height: 1.65;
}

.dashboard-page #health-weight .chart-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: 0.85rem !important;
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--border);
}

.dashboard-page #health-weight .chart-stats .stat-item {
	padding: 0.65rem;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 0.4rem;
}

.dashboard-page #health-weight .chart-stats .stat-item > div:first-child {
	font-size: 0.75rem;
	color: var(--text-secondary);
	margin-bottom: 0.2rem;
}

.dashboard-page #health-weight .chart-stats .stat-item > div:last-child {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--accent);
}

.dashboard-page #health-alerts .alert {
	padding: 0.9rem;
	margin-bottom: 0.7rem;
	border-radius: 0.45rem;
	border-left: 4px solid var(--alert-accent, #f59e0b);
	background: var(--alert-bg, #fffbeb);
}

.dashboard-page #health-alerts .alert-critical {
	--alert-accent: #dc2626;
	--alert-bg: #fef2f2;
}

.dashboard-page #health-alerts .alert-high {
	--alert-accent: #ea580c;
	--alert-bg: #fff7ed;
}

.dashboard-page #health-alerts .alert-moderate {
	--alert-accent: #f59e0b;
	--alert-bg: #fffbeb;
}

.dashboard-page #health-alerts .alert-low {
	--alert-accent: #16a34a;
	--alert-bg: #f0fdf4;
}

.dashboard-page #health-alerts .alert > div:first-child {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 0.45rem;
}

.dashboard-page #health-alerts .alert > div:first-child strong {
	color: var(--alert-accent, #f59e0b);
}

.dashboard-page #health-alerts .alert > div:first-child span {
	font-size: 0.75rem;
	padding: 0.125rem 0.5rem;
	background: var(--alert-accent, #f59e0b);
	color: #fff;
	border-radius: 0.38rem;
}

.dashboard-page #health-alerts .alert p {
	margin: 0;
	color: #374151;
}

.dashboard-page #health-alerts .alert code {
	display: block;
	margin-top: 0.5rem;
	padding: 0.5rem;
	background: rgba(0, 0, 0, 0.05);
	border-radius: 0.25rem;
	font-size: 0.75rem;
	color: #6b7280;
}

.dashboard-page #health-alerts .anomaly-list > div:not(.alert) {
	text-align: center;
	padding: 1.6rem;
	color: var(--text-secondary);
}

.dashboard-page #health-breed-risk > div {
	margin-top: 1rem;
}

.dashboard-page #health-breed-risk details {
	margin-top: 1rem;
}

.dashboard-page #health-breed-risk summary {
	cursor: pointer;
	font-weight: 800;
	color: var(--text-primary);
}

/* Health/training flattening for inline-heavy blocks */
.dashboard-page .dashboard-grid--health [style*="border-top: 3px solid"],
.dashboard-page .dashboard-grid--training [style*="border-top: 3px solid"] {
	border-top-width: 0 !important;
}

.dashboard-page .dashboard-grid--health [style*="padding: 0.9rem; border: 1px solid var(--ds-border); background:#fff"],
.dashboard-page .dashboard-grid--health [style*="padding: 0.75rem; border-radius: 0.5rem; border: 1px solid var(--ds-border); background: #ffffff"],
.dashboard-page .dashboard-grid--training [style*="padding: 1rem; background: white; border-radius: 0.5rem"] {
	border-radius: 0.4rem !important;
}

/* =========================================================
   Health Dashboard – Styled Card Components (2026-03-27)
   ========================================================= */

/* --- Shared modifier badges --- */
.dashboard-page .is-stable { background: #dcfce7; color: #166534; }
.dashboard-page .is-watch  { background: #ffedd5; color: #b45309; }
.dashboard-page .is-high   { background: #fee2e2; color: #b91c1c; }
.dashboard-page .is-muted  { background: #f1f5f9; color: #64748b; }
.dashboard-page .is-low    { background: #dcfce7; color: #166534; }
.dashboard-page .is-moderate { background: #ffedd5; color: #b45309; }
.dashboard-page .is-medium { background: #ffedd5; color: #b45309; }

/* --- Flow grid: allow multi-column on wider screens --- */
.dashboard-page .hb-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
}

/* --- A. Personal Baseline --- */
.dashboard-page .hb-metric-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .hb-metric-card__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.35rem;
}

.dashboard-page .hb-metric-card__name {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.dashboard-page .hb-metric-card__badge {
  display: inline-block;
  padding: 0.12rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  font-weight: 700;
}

.dashboard-page .hb-metric-card__value {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--ds-primary);
  margin-bottom: 0.2rem;
}

.dashboard-page .hb-metric-card__detail {
  font-size: 0.78rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

.dashboard-page .hb-recent-note {
  margin-top: 0.75rem;
  padding: 0.6rem 0.85rem;
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.4rem;
  font-size: 0.8rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

/* --- B. Precursor Risk --- */
.dashboard-page .hp-score-card,
.dashboard-page .hp-event-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .hp-score-card__label,
.dashboard-page .hp-event-card__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.3rem;
}

.dashboard-page .hp-score-card__value,
.dashboard-page .hp-event-card__value {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--ds-primary);
  margin-bottom: 0.4rem;
}

.dashboard-page .hp-score-card__details {
  margin-top: 0.5rem;
}

.dashboard-page .hp-score-card__guide {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  margin-bottom: 0.35rem;
  line-height: 1.5;
}

.dashboard-page .hp-score-card__badge {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
  margin-bottom: 0.4rem;
}

.dashboard-page .hp-score-card__explain {
  font-size: 0.8rem;
  color: var(--ds-text-main);
  line-height: 1.6;
  margin-bottom: 0.5rem;
}

.dashboard-page .hp-reasons {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.4rem;
}

.dashboard-page .hp-reason {
  padding: 0.6rem;
  background: #f8fafc;
  border: 1px solid var(--ds-border);
  border-radius: 0.4rem;
}

.dashboard-page .hp-reason__label {
  font-weight: 700;
  font-size: 0.82rem;
  color: var(--ds-primary);
  margin-bottom: 0.25rem;
}

.dashboard-page .hp-reason__stat {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

.dashboard-page .hp-reason__desc {
  margin-top: 0.25rem;
  font-size: 0.78rem;
  color: var(--ds-text-main);
  line-height: 1.5;
}

.dashboard-page .hp-event-card__detail {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
}

/* Signal cards */
.dashboard-page .hp-signal-card,
.dashboard-page .hp-history-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .hp-signal-card__title,
.dashboard-page .hp-history-card__title {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.5rem;
}

.dashboard-page .hp-signal-list {
  display: grid;
  gap: 0.6rem;
}

.dashboard-page .hp-signal {
  padding: 0.55rem;
  background: #f8fafc;
  border: 1px solid var(--ds-border);
  border-radius: 0.35rem;
}

.dashboard-page .hp-signal__name {
  font-weight: 700;
  font-size: 0.82rem;
  color: var(--ds-primary);
  margin-bottom: 0.25rem;
}

.dashboard-page .hp-signal__stats {
  display: grid;
  gap: 0.15rem;
}

.dashboard-page .hp-signal__row {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  line-height: 1.4;
}

.dashboard-page .hp-history-card__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.7;
  color: var(--ds-text-main);
}

/* --- C. Environment Risk --- */
.dashboard-page .he-metric-card,
.dashboard-page .he-detail-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .he-metric-card__label,
.dashboard-page .he-detail-card__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.3rem;
}

.dashboard-page .he-metric-card__value,
.dashboard-page .he-detail-card__value {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--ds-primary);
  margin-bottom: 0.25rem;
}

.dashboard-page .he-metric-card__badge-wrap {
  margin-top: 0.2rem;
}

.dashboard-page .he-metric-card__badge {
  display: inline-block;
  padding: 0.12rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  font-weight: 700;
}

.dashboard-page .he-metric-card__detail {
  font-size: 0.78rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

.dashboard-page .he-note {
  margin-top: 0.5rem;
  padding: 0.55rem 0.75rem;
  background: #fffdf7;
  border: 1px solid #fde68a;
  border-radius: 0.35rem;
  font-size: 0.78rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

/* --- D. Action Guidance --- */
.dashboard-page .ha-action-list {
  display: grid;
  gap: 0.65rem;
}

.dashboard-page .ha-action {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
  border-left: 4px solid #16a34a;
}

.dashboard-page .ha-action.is-high {
  border-left-color: #dc2626;
}

.dashboard-page .ha-action.is-medium {
  border-left-color: #f59e0b;
}

.dashboard-page .ha-action.is-low {
  border-left-color: #16a34a;
}

.dashboard-page .ha-action__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}

.dashboard-page .ha-action__title {
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--ds-text-main);
}

.dashboard-page .ha-action__desc {
  font-size: 0.8rem;
  color: var(--ds-text-main);
  line-height: 1.6;
  margin-top: 0.15rem;
}

.dashboard-page .ha-action__badge {
  display: inline-block;
  padding: 0.12rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  font-weight: 700;
  flex-shrink: 0;
}

.dashboard-page .ha-action__reason {
  margin-top: 0.4rem;
  padding-top: 0.35rem;
  border-top: 1px solid var(--ds-border);
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

/* --- E. Longevity --- */
.dashboard-page .hl-metric-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .hl-metric-card__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.3rem;
}

.dashboard-page .hl-metric-card__value {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--ds-primary);
  margin-bottom: 0.15rem;
}

.dashboard-page .hl-metric-card__badge {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 0.25rem;
  font-size: 0.72rem;
  font-weight: 700;
}

.dashboard-page .hl-metric-card__detail {
  font-size: 0.78rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
  margin-top: 0.25rem;
}

.dashboard-page .hl-metric-card__note {
  margin-top: 0.35rem;
  padding: 0.45rem 0.65rem;
  background: #f8fafc;
  border-radius: 0.3rem;
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
}

.dashboard-page .hl-annual-message {
  margin-top: 0.5rem;
  padding: 0.75rem;
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
}

.dashboard-page .hl-annual-message__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.3rem;
}

.dashboard-page .hl-annual-message__text {
  font-size: 0.85rem;
  color: var(--ds-text-main);
  line-height: 1.7;
}

.dashboard-page .hl-plan-card {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .hl-plan-card__label {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--ds-text-muted);
  margin-bottom: 0.35rem;
}

.dashboard-page .hl-plan-card__list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.7;
  color: var(--ds-text-main);
}

.dashboard-page .hl-plan-card__reason {
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  line-height: 1.5;
  margin-top: 0.15rem;
}

.dashboard-page .hl-review-note {
  margin-top: 0.5rem;
  padding: 0.55rem 0.75rem;
  background: #f8fafc;
  border: 1px solid var(--ds-border);
  border-radius: 0.35rem;
  font-size: 0.78rem;
  color: var(--ds-text-muted);
}

/* --- F. Breed Risks --- */
.dashboard-page .breed-risk-content {
  display: grid;
  gap: 0.75rem;
}

.dashboard-page .breed-risk-urgent {
  padding: 0.85rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 0.5rem;
}

.dashboard-page .breed-risk-urgent__title {
  font-weight: 800;
  font-size: 0.88rem;
  color: #b91c1c;
  margin-bottom: 0.4rem;
}

.dashboard-page .breed-risk-urgent ul {
  margin: 0;
  padding-left: 1.1rem;
  line-height: 1.7;
  color: var(--ds-text-main);
}

.dashboard-page .breed-risk-details {
  display: grid;
  gap: 1rem;
}

.dashboard-page .breed-risk-category {
  display: grid;
  gap: 0.65rem;
}

.dashboard-page .breed-risk-category > h3 {
  font-size: 1rem;
  margin: 0.5rem 0 0;
}

.dashboard-page .breed-risk-item {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.5rem;
  padding: 0.85rem;
}

.dashboard-page .breed-risk-item h4 {
  font-size: 0.9rem;
  margin: 0 0 0.4rem;
  color: var(--ds-primary);
}

.dashboard-page .breed-risk-item__rate {
  margin-bottom: 0.4rem;
  font-size: 0.82rem;
}

.dashboard-page .breed-risk-item__rate span {
  font-weight: 700;
  color: var(--ds-primary);
}

.dashboard-page .breed-risk-item__section {
  margin-bottom: 0.45rem;
}

.dashboard-page .breed-risk-item__section strong {
  display: block;
  font-size: 0.75rem;
  color: var(--ds-text-muted);
  margin-bottom: 0.15rem;
}

.dashboard-page .breed-risk-item__section ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.6;
}

.dashboard-page .breed-risk-item__section p {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.6;
}

.dashboard-page .breed-risk-schedule {
  display: grid;
  gap: 0.5rem;
}

.dashboard-page .breed-risk-schedule > h3 {
  font-size: 1rem;
  margin: 0.5rem 0 0;
}

.dashboard-page .breed-risk-schedule__period {
  background: #fff;
  border: 1px solid var(--ds-border);
  border-radius: 0.45rem;
  padding: 0.7rem;
}

.dashboard-page .breed-risk-schedule__period h4 {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ds-primary);
  margin: 0 0 0.25rem;
}

.dashboard-page .breed-risk-schedule__period ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.6;
}

/* Shared readable layout layer for long-form fixed/data pages */
.tw-readable-page {
  --tw-readable-inline: clamp(0.95rem, 4.2vw, 1.25rem);
  --tw-readable-max-width: 72rem;
  --tw-readable-section-space: clamp(2.25rem, 8vw, 3rem);
  --tw-readable-card-radius: 1rem;
  --tw-readable-card-border: color-mix(in srgb, var(--accent, #2563eb) 10%, #d7dee8);
  --tw-readable-card-shadow: 0 14px 36px rgba(15, 23, 42, 0.05);
  --tw-readable-card-shadow-hover: 0 18px 44px rgba(15, 23, 42, 0.08);
  --tw-readable-text: color-mix(in srgb, var(--text-primary, #0f172a) 84%, #334155);
  --tw-readable-muted: color-mix(in srgb, var(--text-secondary, #475569) 90%, #334155);
  --tw-readable-soft-border: color-mix(in srgb, var(--accent, #2563eb) 12%, #d6deea);
}

.tw-readable-page > .tw-readable-section {
  padding-block: var(--tw-readable-section-space);
}

.tw-readable-page > .tw-readable-section:first-child {
  padding-top: clamp(1rem, 5vw, 1.75rem);
}

.tw-readable-page > .tw-readable-section--plain {
  background: #ffffff;
}

.tw-readable-page > .tw-readable-section--tint {
  background: linear-gradient(180deg, #fbfdff 0%, #f4f8ff 100%);
  border-block: 1px solid var(--tw-readable-soft-border);
}

.tw-readable-page > .tw-readable-section--alt {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border-block: 1px solid color-mix(in srgb, var(--accent, #2563eb) 8%, #dde6f0);
}

.tw-readable-page > .tw-readable-section--cta {
  padding-top: clamp(2.5rem, 9vw, 3.5rem);
}

.tw-readable-page .tw-readable-container {
  width: min(100%, var(--tw-readable-max-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: var(--tw-readable-inline);
}

.tw-readable-page .tw-readable-hero.page-hero {
  margin-bottom: 0;
}

.tw-readable-page .tw-readable-hero .page-hero__title {
  max-width: 12ch;
  margin-inline: auto;
  text-wrap: balance;
  font-size: clamp(2.1rem, 9vw, 3.2rem);
}

.tw-readable-page .tw-readable-hero .page-hero__subtitle {
  max-width: 34rem;
  margin-inline: auto;
  font-size: 1rem;
  line-height: 1.75;
}

.tw-readable-page .tw-readable-hero .page-hero__media {
  margin-top: 1.25rem;
}

.tw-readable-page .tw-readable-hero .dory-image-placeholder {
  width: min(100%, 32rem);
  min-height: clamp(13rem, 54vw, 18rem);
  margin-inline: auto;
  padding: 1rem 1rem 1.25rem;
  border-radius: 1.25rem;
  border: 1px solid var(--tw-readable-card-border);
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  box-shadow: var(--tw-readable-card-shadow);
}

.tw-readable-page .tw-readable-heading {
  margin: 0 0 0.9rem;
  font-size: clamp(1.35rem, 6vw, 1.9rem);
  line-height: 1.28;
  letter-spacing: -0.02em;
  color: var(--text-primary, #0f172a);
  text-wrap: balance;
}

.tw-readable-page .tw-readable-lead {
  max-width: 70ch;
  margin: 0 0 1.25rem;
  font-size: 0.98rem;
  line-height: 1.74;
  color: var(--tw-readable-text);
}

.tw-readable-page .tw-readable-note {
  max-width: 72ch;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--accent, #2563eb) 14%, #dbe6f4);
  border-left-width: 4px;
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.82);
  font-size: 0.88rem;
  line-height: 1.68;
  color: var(--tw-readable-text);
}

.tw-readable-page .tw-readable-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.9rem;
}

.tw-readable-page .tw-readable-card {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--tw-readable-card-border);
  border-radius: var(--tw-readable-card-radius);
  padding: 1rem;
  box-shadow: var(--tw-readable-card-shadow);
}

.tw-readable-page .tw-readable-card:hover {
  box-shadow: var(--tw-readable-card-shadow-hover);
}

.tw-readable-page .tw-readable-card--split {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}

.tw-readable-page .tw-readable-chart-frame {
  position: relative;
  width: 100%;
  min-width: 0;
  aspect-ratio: 4 / 3;
  min-height: 240px;
  max-height: none;
  margin: 0;
  padding: 0.8rem 0.75rem 0.6rem;
  overflow: hidden;
  border: 1px solid var(--tw-readable-card-border);
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: var(--tw-readable-card-shadow);
}

.tw-readable-page .tw-readable-chip-list {
  margin-top: 0.9rem;
  gap: 0.5rem;
}

.tw-readable-page .tw-readable-chip-list .chart-event-chip {
  min-height: 2.15rem;
  padding: 0.42rem 0.8rem;
  font-size: 0.82rem;
}

.tw-readable-page .tw-readable-panel {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid var(--tw-readable-card-border);
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--tw-readable-card-shadow);
}

.tw-readable-page .tw-readable-cta {
  max-width: 46rem;
  margin-inline: auto;
  padding: clamp(1.35rem, 5vw, 2rem);
  border: 1px solid color-mix(in srgb, var(--accent, #2563eb) 16%, #cddcf3);
  border-radius: 1.5rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(243, 248, 255, 0.98) 100%),
    linear-gradient(135deg, rgba(37, 99, 235, 0.07) 0%, rgba(14, 165, 233, 0.08) 100%);
  box-shadow: 0 22px 48px rgba(37, 99, 235, 0.08);
  text-align: left;
}

.tw-readable-page .tw-readable-cta .tw-readable-heading,
.tw-readable-page .tw-readable-cta .tw-readable-lead {
  max-width: 34rem;
}

.tw-readable-page .tw-readable-cta .tw-readable-lead {
  margin-bottom: 1.1rem;
}

.tw-readable-page .tw-readable-button {
  width: 100%;
  min-height: 3rem;
  justify-content: center;
  border-radius: 999px;
  font-weight: 700;
}

@media (min-width: 768px) {
  .tw-readable-page {
    --tw-readable-inline: clamp(1.4rem, 2.8vw, 2rem);
    --tw-readable-section-space: clamp(3rem, 5vw, 4rem);
  }

  .tw-readable-page .tw-readable-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tw-readable-page .tw-readable-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tw-readable-page .tw-readable-card {
    padding: 1.25rem;
  }

  .tw-readable-page .tw-readable-card--split {
    flex-direction: row;
  }

  .tw-readable-page .tw-readable-chart-frame {
    aspect-ratio: 16 / 7;
    min-height: 280px;
    padding: 1rem 1rem 0.75rem;
  }

  .tw-readable-page .tw-readable-cta {
    text-align: center;
  }

  .tw-readable-page .tw-readable-cta .tw-readable-heading,
  .tw-readable-page .tw-readable-cta .tw-readable-lead {
    margin-inline: auto;
  }

  .tw-readable-page .tw-readable-button {
    width: auto;
    min-width: 14rem;
  }
}

@media (min-width: 1024px) {
  .tw-readable-page .tw-readable-chart-frame {
    aspect-ratio: 16 / 6;
    min-height: 320px;
  }
}