@font-face {
  font-family: Barlow League;
  src: url("fonts/barlow-semi-condensed-bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}

.modern-ui {
  --dark: #143c2c;
  --green: #235c41;
  --accent: #f0d78e;
  --paper: #fff;
  --line: #d7e1d9;
  background: #f6f7f3;
}

.modern-ui h1, .modern-ui h2, .modern-ui .brand {
  font-family: Barlow League, system-ui, sans-serif;
  font-weight: 700;
}

.modern-ui .masthead { border-bottom: 1px solid #c3a95e; }
.modern-ui .masthead .brand { font-size: 1.45rem; line-height: 1.1; }
.modern-ui .masthead .brand svg { flex-shrink: 0; }
.modern-ui .masthead .wrap { width: calc(100% - 2rem); }
.modern-ui .league-nav { background: var(--dark); color: #fff; }
.modern-ui .league-nav a { color: #edf3ec; padding: .6rem .65rem; border: 0; border-radius: 5px; }
.modern-ui .league-nav a:hover { background: #315442; color: #fff; }
.modern-ui .league-nav a[aria-current] { background: var(--accent); color: var(--dark); }
.modern-ui .league-nav a:focus-visible { outline-color: var(--accent); }
.modern-ui .league-nav ul { width: auto; gap: .25rem; padding: .5rem .75rem; }
.modern-ui .main-content { width: calc(100% - 2rem); max-width: 100rem; min-width: 0; }
.modern-ui .explorer-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.modern-ui .explorer-heading h1 { margin-block: 0 .25rem; font-size: clamp(1.8rem, 3vw, 2.3rem); }
.modern-ui .explorer-heading p { margin-block: 0 .5rem; }
.modern-ui .explorer-source { margin-block: .5rem .8rem; }
.modern-ui .explorer-source summary { cursor: pointer; color: var(--green); }
.modern-ui .explorer-controls {
  display: flex; align-items: end; flex-wrap: wrap; gap: .6rem .85rem;
  border-block: 1px solid var(--line); padding-block: .65rem;
}
.modern-ui .explorer-controls label { display: grid; gap: .25rem; font-size: .875rem; min-width: 0; }
.modern-ui .explorer-controls input, .modern-ui .explorer-controls select { max-width: 100%; }
.modern-ui .explorer-controls .explorer-check { display: flex; align-items: center; min-height: 2.75rem; }
.modern-ui .explorer-check input { width: 1rem; height: 1rem; }
.modern-ui .explorer-filters { flex-basis: 100%; min-width: 0; }
.modern-ui .explorer-filters summary { color: var(--green); cursor: pointer; }
.modern-ui .active-filter-count {
  display: inline-block; padding: .1rem .4rem; border-radius: .3rem;
  background: #fff4d6; color: var(--ink); font-size: .8rem; font-weight: 650;
}
.modern-ui .catalog-review-table :is(th[scope="row"], td:last-child) { max-width: 26rem; overflow-wrap: anywhere; }
.modern-ui .explorer-filter-fields { display: flex; flex-wrap: wrap; gap: .6rem .85rem; margin-top: .55rem; }
.modern-ui .explorer-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.modern-ui .explorer-list { min-width: 0; }
.modern-ui .explorer-scroll {
  max-height: min(63vh, 43rem);
  min-height: min(8rem, 35vh);
  border-radius: .5rem;
  overflow: auto;
  scroll-padding: 2.6rem .6rem .6rem min(11rem, 44vw);
}
.modern-ui .explorer-table { min-width: 0; font-size: .875rem; line-height: 1.25rem; border-collapse: separate; border-spacing: 0; }
.modern-ui .explorer-table th, .modern-ui .explorer-table td {
  height: 36px; padding: .25rem .65rem; font-variant-numeric: tabular-nums;
}
.modern-ui .explorer-table thead th { position: sticky; top: 0; z-index: 2; background: #eef3ef; white-space: nowrap; }
.modern-ui .explorer-table th[aria-sort] { background: #e2eee5; }
.modern-ui .explorer-table .sticky-col {
  min-width: 10rem; width: 23%; max-width: 13rem; background: white;
  overflow-wrap: anywhere; white-space: normal;
}
.modern-ui .explorer-table thead .sticky-col { z-index: 3; background: #eef3ef; }
.modern-ui .explorer-table small { display: block; color: #526257; }
.modern-ui .explorer-mlb-context { white-space: nowrap; }
.modern-ui .explorer-mlb-context small { display: inline; }
.modern-ui .explorer-table th a { display: flex; align-items: center; min-height: 27px; }
.modern-ui .explorer-table tr:has([aria-expanded="true"]) > * { background: #fff4d6; }
.modern-ui .explorer-overview {
  background: white; border: 1px solid var(--line); border-radius: .5rem; padding: .85rem;
  overflow-wrap: anywhere;
}
.modern-ui .explorer-overview h2 { font-size: 1.4rem; margin-top: .8rem; }
.modern-ui .explorer-overview .record > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.modern-ui[data-density="comfortable"] .explorer-table :is(th, td) { height: 48px; }

@media (min-width: 70rem) {
  .modern-ui { padding-left: 10rem; }
  .modern-ui .league-nav { position: fixed; inset: 0 auto 0 0; width: 10rem; overflow: auto; border-right: 1px solid #315442; }
  .modern-ui .league-nav ul { display: grid; padding-top: .85rem; }
  .modern-ui .main-content { width: calc(100% - 3rem); }
  .modern-ui .explorer-layout:has(.explorer-overview:not([hidden])) { grid-template-columns: minmax(0, 1fr) minmax(15rem, 20rem); }
}

@media (max-width: 43.75rem), (pointer: coarse) {
  .modern-ui .explorer-table :is(th, td) { height: 44px; }
  .modern-ui .explorer-table th a { min-height: 35px; }
  .modern-ui[data-density="comfortable"] .explorer-table :is(th, td) { height: 52px; }
  .modern-ui .explorer-table .sticky-col { min-width: 8.25rem; max-width: 9rem; }
  .modern-ui .explorer-controls label:first-child { flex-basis: 100%; }
  .modern-ui .league-nav a { min-height: 44px; }
}

.modern-ui .modern-compact-nav { display: none; }
.modern-ui [data-density-control] select { min-width: 0; width: auto; }

@media (max-width: 43.75rem) {
  .modern-ui .league-nav { display: none; }
  .modern-ui .modern-compact-nav {
    display: flex; justify-content: space-between; flex-wrap: wrap; align-items: start;
    gap: .25rem; padding: .35rem .7rem; background: var(--dark); color: white;
  }
  .modern-ui .modern-compact-nav a, .modern-ui .modern-compact-nav summary {
    color: white; min-height: 44px; display: flex; align-items: center;
    padding: .4rem .5rem; border-radius: 4px; font-size: .875rem;
  }
  .modern-ui .modern-compact-nav a[aria-current] { color: var(--dark); background: var(--accent); }
  .modern-ui .modern-compact-nav summary { cursor: pointer; text-decoration: underline; }
  .modern-ui .modern-compact-nav details[open] { flex-basis: 100%; }
  .modern-ui .modern-compact-nav ul { list-style: none; padding: 0; margin: 0; }
  .modern-ui .modern-compact-nav :focus-visible { outline-color: var(--accent); }
  .modern-ui .main-content { padding-top: 1rem; }
  .modern-ui [data-density-control] { display: flex; align-items: center; gap: .5rem; }
  .modern-ui [data-density-control][hidden] { display: none; }
}

.modern-ui .explorer-table a:target { outline: 2px solid var(--focus); outline-offset: 2px; }

.modern-ui .masthead-season {
  margin-left: auto; color: #f0d78e; font-size: .82rem; font-weight: 650;
  text-align: right;
}

.modern-ui .archive-scroll {
  max-height: min(64vh, 42rem); border-radius: .5rem; overflow: auto;
  scroll-padding: 4.5rem .65rem .65rem 9rem;
}
.modern-ui .dense-table {
  font-size: .875rem; line-height: 1.25rem; border-collapse: separate; border-spacing: 0;
  font-variant-numeric: tabular-nums;
}
.modern-ui .dense-table :is(th, td) { height: 36px; padding: .25rem .65rem; }
.modern-ui .dense-table thead th { position: sticky; top: 0; z-index: 2; background: #eef3ef; }
.modern-ui .dense-table .category-groups th {
  height: 2rem; padding-block: .2rem; background: #e2eee5; text-align: center;
}
.modern-ui .dense-table .category-groups + tr th { top: 2rem; }
.modern-ui .dense-table thead .sticky-col { z-index: 3; }
.modern-ui .dense-table .sticky-col { min-width: 10rem; width: 23%; max-width: 13rem; }
.modern-ui .dense-table .sticky-col a { display: inline-block; min-height: 1.5rem; }
.modern-ui .dense-table .sticky-col a:target { outline: 2px solid var(--focus); outline-offset: 2px; }
.modern-ui[data-density="comfortable"] .dense-table :is(th, td) { height: 48px; }
.modern-ui[data-density="comfortable"] .dense-table .category-groups th { height: 2rem; }
.modern-ui .roster-jumps { gap: .4rem; margin-top: .6rem; }
.modern-ui .roster-jumps a {
  border: 1px solid var(--line); border-radius: 5px; background: white;
  padding: .45rem .65rem; min-height: 2.5rem; font-weight: 650;
}
.modern-ui .owner-record { margin-top: 1rem; }
.modern-ui .owner-record .record { margin-block: .5rem 1rem; }
.modern-ui .record { border: 1px solid var(--line); border-radius: .45rem; }

.modern-ui .reading-page { max-width: 72ch; }
.modern-ui .reading-page .board-list { padding-inline-start: 0; }
.modern-ui .reading-page .board-entry {
  padding: .9rem 1rem; border: 1px solid var(--line); border-radius: .45rem;
  background: white; list-style: none; margin-block: .7rem;
}
.modern-ui .reading-page .board-body { line-height: 1.65; }
.modern-ui .reading-page .board-destination {
  border-bottom: 1px solid var(--line); padding-bottom: .7rem; margin-top: 1rem;
}
.modern-ui .action-link {
  display: inline-flex; align-items: center; min-height: 2.75rem; border-radius: .35rem;
  background: var(--green); color: white; font-weight: 650; padding: .45rem .8rem;
  text-decoration: none;
}
.modern-ui .action-link:hover { background: var(--dark); }
.modern-ui .rules-document h2 { margin-top: 1.1rem; }
.modern-ui .auth {
  margin: clamp(1rem, 5vw, 3rem) auto 0; padding: clamp(1rem, 4vw, 1.7rem);
  background: white; border: 1px solid var(--line); border-radius: .6rem;
}
.modern-ui .auth .errorlist, .modern-ui .ops-form .errorlist { overflow-wrap: anywhere; }

@media (min-width: 70rem) {
  .modern-ui:not(:has(.league-nav)) { padding-left: 0; }
}
@media (max-width: 43.75rem), (pointer: coarse) {
  .modern-ui .dense-table :is(th, td) { height: 44px; }
  .modern-ui[data-density="comfortable"] .dense-table :is(th, td) { height: 52px; }
  .modern-ui .dense-table .category-groups th,
  .modern-ui[data-density="comfortable"] .dense-table .category-groups th { height: 2rem; }
  .modern-ui .dense-table .sticky-col { min-width: 8.25rem; max-width: 9rem; }
  .modern-ui .dense-table .sticky-col a { min-height: 2.2rem; }
  .modern-ui .roster-jumps a { min-height: 2.75rem; }
}
@media (max-width: 43.75rem) {
  .modern-ui .masthead-season { display: none; }
  .modern-ui .explorer-heading > * { min-width: 0; }
}

@media (max-width: 43.75rem) {
  .modern-ui .modern-compact-nav :is(a, summary) { padding-inline: .375rem; }
  .modern-ui .dense-table .sticky-col { width: 8.25rem; }
}

.modern-ui .operations-workspace { overflow-wrap: anywhere; }
.modern-ui .operations-workspace > .ops-section,
.modern-ui .operations-workspace > .ops-form {
  margin-block: 1rem;
}
.modern-ui .operations-workspace > .ops-section {
  padding-top: .9rem; border-top: 1px solid var(--line);
}
.modern-ui nav.ops-links { margin-block: .85rem; }
.modern-ui nav.ops-links a[aria-current] {
  background: #fff4d6; color: var(--dark); padding: .4rem .6rem;
  border-radius: .3rem; font-weight: 650;
}
.modern-ui .operations-workspace .ops-status { border-radius: .4rem; }
.modern-ui .operations-workspace .review-needed {
  background: #fff4d6; border-color: #dbc47f; color: #3f3518;
}
.modern-ui .operations-workspace .decision-section {
  padding: clamp(.85rem, 3vw, 1.2rem); max-width: 48rem;
  background: white; border: 1px solid var(--line); border-radius: .5rem;
}
.modern-ui .decision-actions .decision-hold { background: #fff4d6; border-color: #a68943; color: #443515; }
.modern-ui .decision-actions .decision-reject { background: white; border-color: #a35a55; color: #822a24; }
.modern-ui .decision-actions .decision-hold:hover { background: #f0d78e; }
.modern-ui .decision-actions .decision-reject:hover { background: #fff0ee; }
.modern-ui .operation-evidence {
  border: 1px solid var(--line); border-radius: .4rem; background: white;
  margin-block: .6rem; padding: .6rem .75rem;
}
.modern-ui .operation-evidence summary { color: var(--green); font-weight: 650; cursor: pointer; }
.modern-ui .member-records { list-style: none; max-width: 42rem; padding: 0; margin-block: .65rem; }
.modern-ui .member-records li { padding: .55rem .75rem; border-bottom: 1px solid var(--line); background: white; }
.modern-ui .ops-form :is(input, textarea, select) { max-width: 100%; }
.modern-ui .ops-form :is(input, textarea, select)[aria-invalid="true"] { border-color: #a35a55; }
@media (max-width: 43.75rem), (pointer: coarse) {
  .modern-ui :is(button, .action-link) { min-height: 44px; }
}