/* Dynastr foundations. Aliases preserve light/dark and league brand preferences. */
:root {
  --ds-bg: var(--bg);
  --ds-surface: var(--surface);
  --ds-surface-raised: var(--surface-strong);
  --ds-text: var(--text);
  --ds-text-muted: var(--muted);
  --ds-border: var(--border);
  --ds-primary: var(--primary);
  --ds-primary-text: var(--primary-text);
  --ds-success: #16805d;
  --ds-warning: #ad6500;
  --ds-danger: #d44141;
  --ds-radius-sm: 8px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 18px;
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 24px;
  --ds-space-6: 32px;
  --ds-mobile-nav-height: 68px;
}
html[data-bs-theme="dark"] {
  --ds-success: #69d6a5;
  --ds-warning: #f0bf66;
  --ds-danger: #ff8585;
}
.ds-card {
  background: var(--ds-surface);
  color: var(--ds-text);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
  overflow: hidden;
}
.ds-section-header {
  color: var(--ds-text-muted);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin: 0 0 var(--ds-space-3);
}
.ds-chip {
  display: inline-flex;
  align-items: center;
  background: var(--ds-surface-raised);
  border: 1px solid var(--ds-border);
  border-radius: 999px;
  color: var(--ds-text);
  font-size: .72rem;
  font-weight: 600;
  padding: var(--ds-space-1) var(--ds-space-3);
  white-space: nowrap;
}
.ds-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-space-2);
  min-height: 44px;
  border: 0;
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-3) var(--ds-space-4);
  background: var(--ds-primary);
  color: var(--ds-primary-text);
  text-decoration: none;
  font-size: .85rem;
  font-weight: 700;
}
.ds-button:hover { color: var(--ds-primary-text); filter: brightness(1.08); }
.ds-action:focus-visible, .ds-button:focus-visible,
.ds-mobile-nav > :focus-visible, .ds-league-links a:focus-visible {
  outline: 3px solid var(--ds-primary);
  outline-offset: 3px;
}
.ds-home .page-header { gap: var(--ds-space-4); flex-wrap: wrap; }
.ds-home .page-header h1 { font-size: 1.1rem; }
.ds-home .ff-league-name-logo { width: 40px; height: 40px; }
.ds-home .ff-league-hub { background: transparent; border: 0; }
.ds-home .ff-league-hub__identity { padding: var(--ds-space-2) 0; }
.ds-home .ff-league-hub__team-name { font-size: clamp(1.35rem, 4vw, 2rem); overflow-wrap: anywhere; }
.ds-home .card { border-radius: var(--ds-radius-lg); box-shadow: none !important; }
.ds-home .card-header { background: transparent; border-bottom-color: var(--ds-border); padding: var(--ds-space-4) !important; }
.ds-home .card-footer { background: transparent; border-top-color: var(--ds-border); }
.ds-home .ds-matchup-hero { border-top: 3px solid var(--ds-primary); }
.ds-matchup-teams {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: var(--ds-space-4);
  padding: var(--ds-space-4) 0;
}
.ds-matchup-team { min-width: 0; text-align: center; }
.ds-matchup-name { display: block; color: var(--ds-text); font-size: clamp(1rem, 2.5vw, 1.45rem); font-weight: 700; line-height: 1.35; text-decoration: none; overflow-wrap: anywhere; }
.ds-matchup-forecast { display: flex; justify-content: center; flex-wrap: wrap; gap: .15rem .5rem; margin-top: .45rem; color: var(--ds-text-muted); font-size: .76rem; font-variant-numeric: tabular-nums; }
.ds-matchup-forecast strong { color: var(--ds-text); }
.ds-matchup-chance { max-width: 440px; margin: .8rem auto 0; }
.ds-matchup-chance__labels { display: flex; justify-content: space-between; gap: .75rem; color: var(--ds-text-muted); font-size: .7rem; font-weight: 700; }
.ds-matchup-chance__bar { display: flex; height: 6px; overflow: hidden; margin-top: .35rem; border-radius: 999px; background: var(--ds-border); }
.ds-matchup-chance__home { background: var(--ds-primary); }
.ds-matchup-chance__away { background: var(--ds-success); }
.ds-home .ds-matchup-hero .card-footer { padding: var(--ds-space-4); }
.ds-quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ds-space-3); }
.ds-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--ds-space-2);
  min-height: 112px;
  padding: var(--ds-space-4);
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-md);
  background: var(--ds-surface);
  color: var(--ds-text);
  text-decoration: none;
}
.ds-action i { color: var(--ds-primary); font-size: 1.25rem; }
.ds-action span { font-size: .9rem; font-weight: 700; }
.ds-action small { font-size: .72rem; color: var(--ds-text-muted); }
.ds-action:hover { color: var(--ds-text); background: var(--ds-surface-raised); }
.ds-league-links { display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-5); }
.ds-league-links a { display: inline-flex; align-items: center; gap: var(--ds-space-2); min-height: 44px; color: var(--ds-text-muted); font-size: .8rem; text-decoration: none; }
.ds-league-links a:hover { color: var(--ds-text); }
.ds-skeleton { display: block; width: 160px; height: 48px; background: var(--ds-surface-raised); border-radius: var(--ds-radius-sm); animation: ds-pulse 1.5s ease-in-out infinite alternate; }
@keyframes ds-pulse { to { opacity: .45; } }
.ds-mobile-nav { display: none; }
@media (max-width: 991.98px) {
  .ds-has-mobile-nav .ff-main { padding-bottom: calc(var(--ds-mobile-nav-height) + env(safe-area-inset-bottom, 0px) + var(--ds-space-5)); }
  .ds-mobile-nav {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    position: fixed;
    inset: auto 0 0;
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1030;
    min-height: var(--ds-mobile-nav-height);
    padding: var(--ds-space-2) env(safe-area-inset-right, 0px) calc(var(--ds-space-2) + env(safe-area-inset-bottom, 0px)) env(safe-area-inset-left, 0px);
    background: var(--ds-surface);
    border-top: 1px solid var(--ds-border);
  }
  .ds-mobile-nav > a, .ds-mobile-nav > button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--ds-space-1);
    min-width: 0;
    min-height: 48px;
    padding: var(--ds-space-1);
    background: transparent;
    border: 0;
    border-radius: var(--ds-radius-sm);
    color: var(--ds-text-muted);
    font: inherit;
    font-size: .65rem;
    font-weight: 600;
    text-decoration: none;
  }
  .ds-mobile-nav i { font-size: 1.25rem; line-height: 1; }
  .ds-mobile-nav [aria-current="page"], .ds-mobile-nav [aria-expanded="true"] { color: var(--ds-primary); background: var(--ds-surface-raised); }
  body.ds-navigation-open { overflow: hidden; }
  .ds-has-mobile-nav .ff-sidebar-backdrop.show { display: block !important; z-index: 1040; }
  .ds-home .ds-matchup-hero .ds-button { width: 100%; }
}
@supports (-webkit-touch-callout: none) {
  @media (display-mode: standalone) {
    html:has(body.ds-has-mobile-nav) { overscroll-behavior-y: none; }
  }
}
@media (max-width: 575.98px) {
  .ds-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-home .page-header .action-bar { flex-wrap: wrap; }
  .ds-home .ff-home-standings th:last-child, .ds-home .ff-home-standings td:last-child { display: none; }
  .ds-home .ff-home-standings { font-size: .75rem; }
  .ds-home .ff-home-standings td:nth-child(2) { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .ds-skeleton { animation: none; }
}
