/*
 * Unified public UI
 * -----------------
 * Final presentation layer for every public-facing page that uses public-nav.
 * It keeps the light visual language of the home and news experiences:
 * pale blue page chrome, clear blue actions and highly legible white cards.
 */

body.playbook-page {
  --ui-navy-950: #041126;
  --ui-navy-900: #06162f;
  --ui-navy-800: #0b2348;
  --ui-navy-700: #0f2c64;
  --ui-blue-600: #2278d9;
  --ui-blue-500: #2278d9;
  --ui-cyan-600: #3aa8ff;
  --ui-cyan-500: #52b5ff;
  --ui-gold-500: #3aa8ff;
  --ui-gold-300: #8fd3ff;
  --ui-page: #eef7ff;
  --ui-page-blue: #dff1ff;
  --ui-surface: #ffffff;
  --ui-surface-soft: #f4faff;
  --ui-text: #08213f;
  --ui-text-soft: #3e5d7c;
  --ui-text-muted: #4b6684;
  --ui-line: #cfe2f5;
  --ui-line-strong: #b8d6ee;
  --ui-success: #087443;
  --ui-warning: #a85d00;
  --ui-danger: #c43232;
  --ui-radius-xl: 24px;
  --ui-radius-lg: 18px;
  --ui-radius-md: 14px;
  --ui-radius-sm: 10px;
  --ui-shadow-sm: 0 5px 18px rgba(34, 120, 217, 0.08);
  --ui-shadow-md: 0 14px 36px rgba(34, 120, 217, 0.12);
  --ui-shadow-lg: 0 24px 70px rgba(34, 120, 217, 0.17);

  /* Keep legacy page variables aligned with the shared palette. */
  --navy: var(--ui-navy-900);
  --navy-2: var(--ui-navy-800);
  --blue: var(--ui-blue-600);
  --gold: var(--ui-gold-500);
  --gold-2: var(--ui-gold-300);
  --bg: var(--ui-page);
  --card: var(--ui-surface);
  --text: var(--ui-text);
  --muted: var(--ui-text-muted);
  --line: var(--ui-line);
  --accent: var(--ui-cyan-600);
  --accent-hover: var(--ui-cyan-500);
  --text-primary: #08234a;
  --text-secondary: #3e5d7c;
  --text-muted: #4b6684;
  --border-card: rgba(34, 120, 217, 0.16);
  --border-strong: rgba(34, 120, 217, 0.26);
  --border-accent: rgba(58, 168, 255, 0.36);
  --bg-surface: var(--ui-surface);
  --bg-surface-2: var(--ui-surface-soft);
  --pb-bg: var(--ui-page);
  --pb-surface: var(--ui-surface);
  --pb-surface-2: var(--ui-surface-soft);
  --pb-primary: var(--ui-blue-600);
  --pb-primary-soft: #52b5ff;
  --pb-primary-glow: rgba(34, 120, 217, 0.12);
  --pb-accent: var(--ui-cyan-600);
  --pb-accent-soft: rgba(0, 146, 189, 0.11);
  --pb-text: var(--ui-text);
  --pb-text-soft: var(--ui-text-soft);
  --pb-text-muted: var(--ui-text-muted);
  --pb-border: var(--ui-line);
  --pb-radius: var(--ui-radius-lg);
  --pb-radius-sm: var(--ui-radius-sm);

  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--ui-text);
  background:
    radial-gradient(circle at 10% -8%, rgba(143, 211, 255, 0.55), transparent 28%),
    radial-gradient(circle at 92% 8%, rgba(34, 120, 217, 0.2), transparent 30%),
    linear-gradient(180deg, #fafdff 0%, #eef7ff 46%, #dceeff 100%) !important;
  font-family: "Noto Sans", "Segoe UI", Arial, system-ui, sans-serif !important;
}

body.playbook-page::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  z-index: -1;
  height: 300px;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 4%, rgba(82, 181, 255, 0.22), transparent 28%),
    radial-gradient(circle at 12% 0%, rgba(143, 211, 255, 0.34), transparent 26%),
    linear-gradient(180deg, rgba(250, 253, 255, 0.76), rgba(238, 247, 255, 0));
}

body.playbook-page *,
body.playbook-page *::before,
body.playbook-page *::after {
  box-sizing: border-box;
}

body.playbook-page a {
  text-underline-offset: 3px;
}

body.playbook-page :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid rgba(0, 146, 189, 0.5) !important;
  outline-offset: 3px;
}

body.playbook-page :where(button, input, select, textarea) {
  font: inherit;
}

body.playbook-page :where(img, video) {
  max-width: 100%;
}

/* Navigation */
body.playbook-page .site-nav {
  background: rgba(229, 244, 255, 0.94) !important;
  border-bottom: 1px solid rgba(117, 174, 226, 0.38) !important;
  box-shadow: 0 16px 42px rgba(34, 120, 217, 0.16) !important;
  backdrop-filter: blur(16px) saturate(1.25);
}

body.playbook-page .nav-inner {
  max-width: 1380px;
}

body.playbook-page .nav-brand {
  padding: 0.3rem !important;
  overflow: hidden;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18) !important;
}

body.playbook-page .nav-brand img {
  width: auto !important;
  height: 52px !important;
  max-width: 172px !important;
  object-fit: contain;
  filter: none !important;
}

body.playbook-page :is(.nav-dropdown-trigger, .nav-links a) {
  color: var(--ui-navy-900) !important;
  font-weight: 750;
}

body.playbook-page :is(.nav-dropdown-trigger:hover, .nav-dropdown.active .nav-dropdown-trigger, .nav-links a:hover, .nav-links a.active) {
  color: var(--ui-blue-600) !important;
  background: rgba(34, 120, 217, 0.12) !important;
}

body.playbook-page .nav-links a.active {
  box-shadow: inset 0 -2px 0 var(--ui-blue-600);
}

body.playbook-page .nav-dropdown-menu {
  background: #ffffff !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--ui-shadow-lg) !important;
}

body.playbook-page .nav-dropdown-menu a {
  color: var(--ui-navy-900) !important;
}

body.playbook-page .nav-toggle {
  background: rgba(255, 255, 255, 0.72) !important;
  border-color: rgba(8, 35, 74, 0.16) !important;
}

body.playbook-page :is(.hamburger-icon, .hamburger-icon::before, .hamburger-icon::after) {
  background: var(--ui-navy-900) !important;
}

/* Page shells */
body.playbook-page :is(.pub-page, .pub-page-md, .pub-page-sm, .container, .page-wrap, .athletes-shell, .playbook-container, .shell) {
  position: relative;
  width: min(100%, 1320px);
  margin-inline: auto;
}

body.playbook-page :is(.pub-page, .pub-page-md, .pub-page-sm, .container, .page-wrap, .athletes-shell, .playbook-container) {
  padding-top: clamp(24px, 4vw, 44px) !important;
  padding-inline: clamp(14px, 3vw, 28px) !important;
  padding-bottom: clamp(56px, 8vw, 88px) !important;
}

body.playbook-page .pub-page-md {
  max-width: 1080px;
}

body.playbook-page .pub-page-sm {
  max-width: 820px;
}

/* Hero and page-heading system */
body.playbook-page :is(.pub-page-hd, .page-header, .calendar-hero-card, .athletes-hero, .records-hero-card, .page-hd-shell > .hero, .page-hd-shell .hero-card) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--ui-navy-900) !important;
  background:
    radial-gradient(circle at 84% 8%, rgba(58, 168, 255, 0.32), transparent 28%),
    radial-gradient(circle at 12% 16%, rgba(143, 211, 255, 0.42), transparent 24%),
    linear-gradient(135deg, #eef8ff, #cfe9ff) !important;
  border: 1px solid rgba(117, 174, 226, 0.42) !important;
  border-radius: var(--ui-radius-xl) !important;
  box-shadow: var(--ui-shadow-lg) !important;
  padding: clamp(1.25rem, 3vw, 2rem) !important;
}

body.playbook-page :is(.pub-page-hd, .page-header, .calendar-hero-card, .athletes-hero, .records-hero-card)::after {
  content: "";
  display: block;
  width: 76px;
  height: 4px;
  margin-top: 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--ui-cyan-500), var(--ui-blue-600));
}

body.playbook-page :is(.pub-page-hd h1, .page-title, .calendar-hero-head h1, .hero-title, .records-section-title) {
  margin: 0;
  color: var(--ui-navy-900) !important;
  font-size: clamp(1.65rem, 4vw, 2.55rem) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
  text-align: left;
}

body.playbook-page :is(.pub-page-hd .description, .pub-page-hd .subtitle, .page-subtitle, .calendar-hero-head .description, .hero-subtitle) {
  max-width: 820px;
  margin-top: 0.65rem;
  color: var(--ui-text-muted) !important;
  font-size: 0.96rem !important;
  line-height: 1.65 !important;
  text-align: left;
}

body.playbook-page :is(.pub-breadcrumb, .ranking-breadcrumb) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.38rem;
  margin-bottom: 0.65rem;
  color: var(--ui-text-muted) !important;
  font-size: 0.76rem;
  font-weight: 700;
}

body.playbook-page :is(.pub-breadcrumb a, .ranking-breadcrumb a) {
  color: var(--ui-blue-600) !important;
}

body.playbook-page :is(.pub-breadcrumb a, .ranking-breadcrumb a):hover {
  color: var(--ui-cyan-600) !important;
}

/* Shared cards and surfaces */
body.playbook-page :is(
  .pub-card,
  .pub-empty,
  .playbook-card,
  .playbook-card-flat,
  .pb-card,
  .comp-card,
  .calendar-mono-card,
  .calendar-entry,
  .calendar-table-wrap,
  .info-box,
  .section-box,
  .discipline-section,
  .athlete-card,
  .coach-card,
  .judge-card,
  .team-card,
  .news-card,
  .album-card,
  .gallery-item,
  .partner-card,
  .record-card,
  .medal-year-card,
  .medal-competition-card,
  .profile-card,
  .achievements-card,
  .ranking-card,
  .records-card,
  .comp-mono-card,
  .event-card,
  .category-card,
  .page-card,
  .results-section,
  .venue-card,
  .stat-card,
  .event
) {
  color: var(--ui-text);
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

body.playbook-page :is(
  .pub-card,
  .playbook-card,
  .pb-card,
  .comp-card,
  .calendar-entry,
  .athlete-card,
  .coach-card,
  .judge-card,
  .team-card,
  .news-card,
  .album-card,
  .gallery-item,
  .partner-card,
  .record-card,
  .medal-competition-card,
  .event-card,
  .category-card,
  .venue-card,
  .event
) {
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
}

body.playbook-page :is(
  .pub-card,
  .playbook-card,
  .pb-card,
  .comp-card,
  .calendar-entry,
  .athlete-card,
  .coach-card,
  .judge-card,
  .team-card,
  .news-card,
  .album-card,
  .gallery-item,
  .partner-card,
  .record-card,
  .medal-competition-card,
  .event-card,
  .category-card,
  .venue-card,
  .event
):hover {
  transform: translateY(-3px) !important;
  border-color: rgba(21, 111, 232, 0.27) !important;
  box-shadow: var(--ui-shadow-md) !important;
}

body.playbook-page .pub-empty {
  padding: clamp(2rem, 6vw, 4rem) 1.5rem !important;
  border-style: dashed !important;
  color: var(--ui-text-muted) !important;
  text-align: center;
}

body.playbook-page :is(.pub-prose, .news-detail-content, .event-copy) {
  color: var(--ui-text-soft) !important;
  font-size: 1rem;
  line-height: 1.78;
}

body.playbook-page :is(.pub-prose h1, .pub-prose h2, .pub-prose h3, .news-detail-content h2, .news-detail-content h3) {
  color: var(--ui-navy-700) !important;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

body.playbook-page :is(.pub-prose a, .news-detail-content a) {
  color: var(--ui-blue-600) !important;
  font-weight: 700;
}

body.playbook-page :is(.pub-cover-img, .news-detail-cover) {
  width: 100%;
  max-height: 520px;
  object-fit: cover;
  border-radius: calc(var(--ui-radius-lg) - 1px) calc(var(--ui-radius-lg) - 1px) 0 0 !important;
}

/* Headings and section dividers */
body.playbook-page :is(.pub-section-hd, .section-title, .section-head, .achievements-header, .ranking-card-header, .records-card-header, .cat-results-header) {
  color: var(--ui-navy-700) !important;
  background: transparent !important;
  border-bottom: 1px solid var(--ui-line) !important;
}

body.playbook-page :is(.pub-section-hd h2, .section-title-text, .achievements-title, .ranking-card-title, .records-card-title, .cat-results-title) {
  color: var(--ui-navy-700) !important;
  font-weight: 850;
  letter-spacing: -0.02em;
}

/* Buttons, tabs, pills and filters */
body.playbook-page :is(
  .pub-btn,
  .playbook-button,
  .playbook-button-ghost,
  .pb-btn,
  .pb-btn-outline,
  .btn,
  .back-btn,
  .show-all-btn,
  .search-submit,
  .section-link,
  .comp-link,
  .year-nav-btn,
  .calendar-tool-clear,
  .calendar-row-toggle,
  .discipline-filter-btn,
  .gender-button,
  .discipline-pill,
  .cat-btn,
  .section-tab,
  .tab-link
) {
  min-height: 42px;
  border-radius: 999px !important;
  font-weight: 800 !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease !important;
}

body.playbook-page :is(
  .pub-btn-primary,
  .playbook-button,
  .pb-btn,
  .btn-primary,
  .search-submit,
  .comp-link.is-primary,
  .discipline-filter-btn.active,
  .gender-button.is-active,
  .gender-button.active,
  .discipline-pill.is-active,
  .discipline-pill.active,
  .cat-btn.active,
  .section-tab.active,
  .tab-link.active
) {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--ui-blue-600), var(--ui-cyan-600)) !important;
  border-color: transparent !important;
  box-shadow: 0 10px 24px rgba(21, 111, 232, 0.2) !important;
}

body.playbook-page :is(
  .pub-btn,
  .playbook-button,
  .playbook-button-ghost,
  .pb-btn,
  .pb-btn-outline,
  .btn,
  .back-btn,
  .show-all-btn,
  .search-submit,
  .section-link,
  .comp-link,
  .year-nav-btn,
  .calendar-tool-clear,
  .calendar-row-toggle,
  .discipline-filter-btn,
  .gender-button,
  .discipline-pill,
  .cat-btn,
  .section-tab,
  .tab-link
):hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px rgba(6, 22, 47, 0.13) !important;
}

body.playbook-page :is(
  .badge,
  .chip,
  .pub-badge,
  .pub-count-badge,
  .entry-badge,
  .entry-country,
  .month-count,
  .section-count,
  .records-count,
  .cat-result-count,
  .ranking-gender,
  .ranking-card-gender,
  .age-category-badge,
  .record-card-type,
  .medal-chip,
  .discipline-filter-count
) {
  color: var(--ui-blue-600) !important;
  background: rgba(21, 111, 232, 0.08) !important;
  border: 1px solid rgba(21, 111, 232, 0.17) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}

/* Form controls */
body.playbook-page :is(
  .pub-form-input,
  .pb-input,
  .pb-select,
  .calendar-tool-input,
  .calendar-tool-select,
  .ranking-mobile-search,
  .ranking-mobile-select,
  .search-input
) {
  min-height: 46px;
  color: var(--ui-text) !important;
  background: #ffffff !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
}

body.playbook-page :is(.search-pill, .ranking-search-shell, .ranking-select-shell) {
  color: var(--ui-text);
  background: #ffffff !important;
  border: 1px solid var(--ui-line-strong) !important;
  border-radius: 999px !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

body.playbook-page :is(
  .pub-form-input,
  .pb-input,
  .pb-select,
  .calendar-tool-input,
  .calendar-tool-select,
  .ranking-mobile-search,
  .ranking-mobile-select,
  .search-input
):focus,
body.playbook-page :is(.search-pill, .ranking-search-shell, .ranking-select-shell):focus-within {
  border-color: rgba(0, 146, 189, 0.58) !important;
  box-shadow: 0 0 0 4px rgba(0, 146, 189, 0.1) !important;
  outline: none !important;
}

body.playbook-page :is(.calendar-tools, .ranking-tools, .ranking-mobile-tools, .search-panel, .year-nav, .bio-item, .chosen-panel) {
  background: var(--ui-surface-soft) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius-lg) !important;
}

/* Tables */
body.playbook-page :is(.pub-table-wrap, .table-wrap, .table-scroll, .calendar-table-wrap) {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius-lg) !important;
  background: #ffffff;
  -webkit-overflow-scrolling: touch;
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--ui-text);
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) thead th {
  padding: 0.82rem 0.9rem !important;
  color: #53657c !important;
  background: #f2f6fb !important;
  border-bottom: 1px solid var(--ui-line-strong) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.045em !important;
  text-transform: uppercase;
  white-space: nowrap;
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) tbody tr {
  background: #ffffff;
  transition: background 0.16s ease;
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) tbody tr:nth-child(even) {
  background: #fafcff;
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) tbody tr:hover {
  background: #eef6ff !important;
}

body.playbook-page :is(.pub-table, .calendar-table, .rank-table, .ranking-table, .records-table, .ach-table, .medal-summary-table, .coach-medal-summary-table, .results-table) td {
  padding: 0.78rem 0.9rem;
  border-bottom: 1px solid rgba(223, 230, 239, 0.78) !important;
  color: var(--ui-text-soft);
  vertical-align: middle;
}

body.playbook-page :is(.ranking-score, .rating-cell, .calendar-cell-date, .entry-date, .news-date, .record-type-code, .info-label, .read-more, .athlete-cta) {
  color: var(--ui-blue-600) !important;
}

body.playbook-page :is(.ranking-rank-badge, .ranking-place, .score-badge, .chosen-score, .mobile-rank-badge) {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--ui-blue-600), var(--ui-cyan-600)) !important;
  box-shadow: 0 6px 16px rgba(21, 111, 232, 0.2) !important;
}

body.playbook-page :is(.rank-badge.gold, .medal-count-gold, .gold) {
  color: #4b3200 !important;
  background: linear-gradient(135deg, #fff0ad, #f1d17a) !important;
}

body.playbook-page :is(.rank-badge.silver, .medal-count-silver, .silver) {
  color: #334155 !important;
  background: linear-gradient(135deg, #f8fafc, #cbd5e1) !important;
}

body.playbook-page :is(.rank-badge.bronze, .medal-count-bronze, .bronze) {
  color: #4a2510 !important;
  background: linear-gradient(135deg, #f5c39b, #c47a45) !important;
}

/* People and profile cards */
body.playbook-page :is(.athletes-grid, .coaches-grid, .judges-grid, .team-grid) {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1rem !important;
}

body.playbook-page :is(.athlete-card, .coach-card, .judge-card, .team-card) {
  min-width: 0;
  overflow: hidden;
}

body.playbook-page :is(.athlete-thumb, .coach-thumb, .judge-thumb, .team-card-media, .profile-photo, .record-card-photo, .record-card-photo-mini) {
  background: var(--ui-surface-soft) !important;
  border: 2px solid rgba(0, 146, 189, 0.22) !important;
  object-fit: cover;
}

body.playbook-page :is(.athlete-name, .coach-name, .judge-name, .team-card-name, .profile-name, .record-card-name) {
  color: var(--ui-navy-700) !important;
  font-weight: 850 !important;
  letter-spacing: -0.02em;
}

body.playbook-page :is(.athlete-org, .coach-org, .profile-org, .team-card-meta, .record-card-meta) {
  color: var(--ui-text-muted) !important;
}

body.playbook-page .profile-card {
  overflow: hidden;
  padding: clamp(1rem, 3vw, 1.6rem) !important;
}

body.playbook-page .bio-grid {
  gap: 0.75rem !important;
}

body.playbook-page .bio-item {
  padding: 0.85rem 1rem !important;
}

body.playbook-page .bio-label {
  color: var(--ui-text-muted) !important;
  font-weight: 800;
}

body.playbook-page .bio-value {
  color: var(--ui-navy-700) !important;
  font-weight: 750;
}

/* News, gallery and media */
body.playbook-page :is(.news-grid, .album-grid, .gallery-grid) {
  gap: 1rem !important;
}

body.playbook-page :is(.news-card, .album-card, .gallery-item) {
  overflow: hidden;
}

body.playbook-page :is(.news-thumb, .album-thumb, .gallery-item img, .news-detail-cover, .related-img) {
  transition: transform 0.42s ease, filter 0.42s ease;
}

body.playbook-page :is(.news-card, .album-card, .gallery-item):hover :is(.news-thumb, .album-thumb, img) {
  transform: scale(1.035);
}

body.playbook-page :is(.news-ttl, .album-name, .news-detail-title, .news-detail-related-title, .related-ttl) {
  color: var(--ui-navy-700) !important;
  font-weight: 850 !important;
  letter-spacing: -0.02em;
}

body.playbook-page :is(.news-exc, .news-detail-meta, .related-date, .album-count) {
  color: var(--ui-text-muted) !important;
}

body.playbook-page .news-detail-shell {
  display: grid;
  gap: 1.25rem;
}

body.playbook-page .news-detail-card {
  overflow: hidden;
}

body.playbook-page .overlay {
  background: linear-gradient(180deg, transparent 24%, rgba(4, 17, 38, 0.88)) !important;
}

/* About, partners, documents and policies */
body.playbook-page :is(.pub-leadership-list, .pub-grid, .medal-stats, .records-stats, .metric-grid, .stat-grid, .venues-grid) {
  gap: 1rem !important;
}

body.playbook-page .pub-leadership-card {
  display: grid;
  grid-template-columns: minmax(0, 160px) 1fr;
  gap: 1.25rem;
  align-items: start;
  padding: 1.1rem !important;
}

body.playbook-page :is(.pub-leadership-name, .record-group-title, .medal-year-title, .medal-competition-title, .venue-body h3, .event-year) {
  color: var(--ui-navy-700) !important;
  font-weight: 850 !important;
}

body.playbook-page :is(.pub-leadership-role, .record-card-type-label, .medal-stat-label, .records-stat-label, .label, .eyebrow) {
  color: var(--ui-cyan-600) !important;
  font-weight: 850 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.playbook-page :is(.partner-card, .pub-grid-3 > .pub-card) {
  min-height: 150px;
}

body.playbook-page .partner-card img {
  max-height: 82px;
  width: auto;
  object-fit: contain;
}

body.playbook-page :is(.meta-date, .record-note, .medal-competition-meta, .event-date, .event-city, .sub) {
  color: var(--ui-text-muted) !important;
}

/* Competition calendar and results hierarchy */
body.playbook-page .calendar-hero-head {
  border-bottom-color: rgba(34, 120, 217, 0.16) !important;
}

body.playbook-page .year-nav {
  padding: 0.9rem !important;
  box-shadow: var(--ui-shadow-sm) !important;
}

body.playbook-page .year-display {
  color: var(--ui-navy-700) !important;
}

body.playbook-page .calendar-month {
  border-color: var(--ui-line) !important;
}

body.playbook-page .month-head {
  border-bottom-color: var(--ui-line) !important;
}

body.playbook-page :is(.month-title, .calendar-cell-name, .entry-name, .comp-mono-title, .event-header, .event-card h2, .category-name) {
  color: var(--ui-navy-700) !important;
  font-weight: 850 !important;
}

body.playbook-page :is(.comp-info-grid, .meta-grid) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
}

body.playbook-page :is(.info-item, .meta-item) {
  padding: 0.9rem 1rem;
  background: var(--ui-surface-soft);
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius-md);
}

body.playbook-page :is(.info-value, .meta-value) {
  color: var(--ui-navy-700) !important;
  font-weight: 750;
}

body.playbook-page :is(.event-list, .category-grid) {
  gap: 0.85rem !important;
}

body.playbook-page :is(.badge-live, .has-results, .results-indicator) {
  color: var(--ui-success) !important;
  background: #e9f8f1 !important;
  border-color: rgba(8, 116, 67, 0.18) !important;
}

body.playbook-page :is(.badge-pending, .no-results) {
  color: var(--ui-warning) !important;
  background: #fff7e8 !important;
  border-color: rgba(168, 93, 0, 0.18) !important;
}

/* Hosted events timeline */
body.playbook-page .timeline::before {
  background: linear-gradient(var(--ui-gold-500), var(--ui-blue-600), var(--ui-cyan-600)) !important;
}

body.playbook-page .event {
  padding: 1rem !important;
}

body.playbook-page :is(.metric, .medal-stat, .records-stat) {
  color: var(--ui-navy-700) !important;
  background: var(--ui-surface-soft) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius-md) !important;
}

body.playbook-page :is(.metric .num, .medal-stat-value, .records-stat-value, .mini-big) {
  color: var(--ui-blue-600) !important;
  font-weight: 900 !important;
}

/* Ranking refinements */
body.playbook-page .ranking-overview {
  display: grid;
  gap: 1rem;
}

body.playbook-page .summary-row {
  gap: 0.75rem !important;
}

body.playbook-page .summary-item {
  color: var(--ui-text);
  background: #ffffff !important;
  border: 1px solid var(--ui-line) !important;
  border-left: 4px solid var(--ui-cyan-600) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: none !important;
}

body.playbook-page .summary-item .value {
  color: var(--ui-navy-700) !important;
}

body.playbook-page .section-tabs {
  justify-content: flex-start;
  scrollbar-width: thin;
  scrollbar-color: rgba(21, 111, 232, 0.24) transparent;
}

body.playbook-page .section-tab:not(.active) {
  color: var(--ui-navy-700) !important;
  background: #ffffff !important;
  border: 1px solid var(--ui-line) !important;
}

body.playbook-page .month-cell {
  background: #f7faff !important;
}

body.playbook-page .chosen-panel {
  padding: 0.6rem 0.75rem;
}

/* Contact and footer */
body.playbook-page :is(.contact-icon, .pub-info-icon) {
  color: var(--ui-cyan-600) !important;
}

body.playbook-page :is(.contact-label, .pub-info-label) {
  color: var(--ui-text-muted) !important;
  font-weight: 800;
}

body.playbook-page :is(.contact-value, .pub-info-value) {
  color: var(--ui-navy-700) !important;
}

body.playbook-page .pub-footer {
  color: rgba(8, 35, 74, 0.72) !important;
  background:
    radial-gradient(circle at 12% 10%, rgba(143, 211, 255, 0.42), transparent 26%),
    radial-gradient(circle at 88% 0%, rgba(34, 120, 217, 0.2), transparent 30%),
    linear-gradient(135deg, #e8f6ff, #cce8ff) !important;
  border-top: 1px solid rgba(8, 35, 74, 0.12) !important;
}

body.playbook-page .pub-footer :is(a, h4, span, strong) {
  color: rgba(8, 35, 74, 0.76) !important;
}

body.playbook-page .pub-footer a:hover {
  color: var(--ui-blue-600) !important;
}

body.playbook-page .pub-footer-brand img {
  padding: 0.35rem;
  background: #ffffff !important;
  border-radius: 16px;
}

/* Responsive behavior */
@media (max-width: 900px) {
  body.playbook-page :is(.pub-grid-3, .metric-grid, .stat-grid, .venues-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.playbook-page .pub-leadership-card {
    grid-template-columns: 130px 1fr;
  }

  body.playbook-page .calendar-tools {
    grid-template-columns: 1fr 1fr !important;
  }

  body.playbook-page .calendar-tool-clear {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  body.playbook-page {
    --nav-h: 68px;
    background: var(--ui-page) !important;
  }

  body.playbook-page::before {
    height: 230px;
  }

  body.playbook-page .site-nav {
    position: fixed !important;
    top: 0;
    z-index: 3000;
  }

  body.playbook-page .nav-links {
    background: rgba(239, 248, 255, 0.985) !important;
    border-top: 1px solid rgba(117, 174, 226, 0.36) !important;
    box-shadow: 0 28px 70px rgba(34, 120, 217, 0.24) !important;
  }

  body.playbook-page .nav-brand {
    padding: 0.25rem !important;
  }

  body.playbook-page .nav-brand img {
    height: 47px !important;
    max-width: 150px !important;
  }

  body.playbook-page :is(.pub-page, .pub-page-md, .pub-page-sm, .container, .page-wrap, .athletes-shell, .playbook-container) {
    padding-top: 20px !important;
    padding-inline: 12px !important;
    padding-bottom: 56px !important;
  }

  body.playbook-page :is(.pub-page-hd, .page-header, .calendar-hero-card, .athletes-hero, .records-hero-card) {
    padding: 1.15rem !important;
    border-radius: 20px !important;
  }

  body.playbook-page :is(.pub-page-hd h1, .page-title, .calendar-hero-head h1, .hero-title) {
    font-size: clamp(1.45rem, 7.5vw, 2rem) !important;
  }

  body.playbook-page :is(.pub-page-hd .description, .pub-page-hd .subtitle, .page-subtitle, .calendar-hero-head .description, .hero-subtitle) {
    font-size: 0.93rem !important;
    line-height: 1.55 !important;
  }

  body.playbook-page :is(.pub-card, .calendar-mono-card, .profile-card, .achievements-card, .ranking-card, .records-card, .section-box, .results-section) {
    border-radius: 16px !important;
  }

  body.playbook-page :is(.athletes-grid, .coaches-grid, .judges-grid, .team-grid, .pub-grid-3, .metric-grid, .stat-grid, .venues-grid) {
    grid-template-columns: 1fr !important;
  }

  body.playbook-page .pub-leadership-card {
    grid-template-columns: 1fr;
  }

  body.playbook-page .section-tabs {
    position: sticky;
    top: 74px;
    z-index: 40;
    display: flex !important;
    justify-content: flex-start;
    gap: 0.5rem !important;
    margin-inline: -0.2rem;
    padding: 0.65rem 0.2rem 0.8rem !important;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    background: linear-gradient(180deg, rgba(238, 247, 255, 0.98), rgba(238, 247, 255, 0.78));
    backdrop-filter: blur(12px);
  }

  body.playbook-page .section-tab {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  body.playbook-page :is(.calendar-tools, .ranking-tools, .ranking-mobile-tools) {
    grid-template-columns: 1fr !important;
  }

  body.playbook-page .calendar-tool-clear {
    grid-column: auto;
  }

  body.playbook-page .year-nav {
    gap: 0.5rem !important;
  }

  body.playbook-page .year-nav-btn {
    min-width: 44px;
    padding-inline: 0.75rem !important;
  }

  body.playbook-page :is(.comp-info-grid, .meta-grid) {
    grid-template-columns: 1fr;
  }

  body.playbook-page :is(.pub-btn, .search-submit, .section-link, .btn) {
    min-height: 46px;
  }
}

@media (max-width: 480px) {
  body.playbook-page .nav-brand img {
    height: 44px !important;
    max-width: 132px !important;
  }

  body.playbook-page :is(.pub-page, .pub-page-md, .pub-page-sm, .container, .page-wrap, .athletes-shell, .playbook-container) {
    padding-inline: 10px !important;
  }

  body.playbook-page :is(.pub-page-hd, .page-header, .calendar-hero-card, .athletes-hero, .records-hero-card) {
    border-radius: 18px !important;
    padding: 1rem !important;
  }

  body.playbook-page :is(.athlete-card, .coach-card, .judge-card, .team-card) {
    padding: 0.85rem !important;
  }

  body.playbook-page :is(.pub-btn, .search-submit, .section-link, .btn, .back-btn) {
    width: 100%;
    justify-content: center;
  }

  body.playbook-page .year-nav-btn {
    width: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.playbook-page *,
  body.playbook-page *::before,
  body.playbook-page *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-contrast: more) {
  body.playbook-page {
    --ui-text-soft: #27364a;
    --ui-text-muted: #41536a;
    --ui-line: #b7c4d5;
    --ui-line-strong: #96a8be;
  }

  body.playbook-page :is(.pub-card, .section-box, .profile-card, .calendar-mono-card) {
    border-width: 2px !important;
  }
}
