/* Published Pixel Operator throughout, with its original Regular/Bold faces.
   Field markers use the same family's small-size variant. */
:root {
  --font: 'Pixel Operator', sans-serif;
  --display: var(--font);
  font-synthesis: none;
}
body { font-family: var(--font); font-size: 20px; line-height: 1.5; }
button, input, select, textarea, summary, #editor-field text { font-family: var(--font); }
button, input, select, textarea { line-height: 1.5; }
input::placeholder, textarea::placeholder { font-family: inherit; }
strong, b { font-weight: 600; }
h1, h2, h3, .brand-word, .library-brand, .score, .score-clock strong, .record {
  font-family: var(--font);
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}
h1, .page-heading h1 { font-size: 40px !important; line-height: 1.25 !important; }
h2, .dialog-head h2 { font-size: 28px !important; line-height: 1.3 !important; }
h3 { font-size: 24px; line-height: 1.4; }
.library-new .library-intro h1 { font-size: 48px !important; line-height: 1.2 !important; }
.library-returning .library-intro h1 { font-size: 40px !important; }
.brand-word, .library-brand { font-size: 28px; line-height: 1.15; }
.brand-word small { letter-spacing: 1px; line-height: 1.5; }
.eyebrow, .panel-eyebrow, .beta-tag, .breadcrumb, .data-table th,
.season-pill small, .hub-record small, .setup-budget-main > span,
.setup-filters label, .sa-select-group, .development-notice-heading > span {
  letter-spacing: .5px;
  line-height: 1.5;
}
.primary, .secondary, .call-button, .sa-select-trigger { font-size: 20px; min-height: 44px; }
.text-button, .nav :is(button,a), .nav-secondary :is(button,a) { font-size: 20px; }
.nav :is(button,a) { gap: 10px; }
.score, .report-overall { font-size: 48px; line-height: 1.2; }
.score-clock strong, .hub-record strong, .season-pill .record { font-size: 40px; }
.score, .record, .data-table, .box-table, .setup-player-cost, .setup-player-rating {
  font-variant-numeric: tabular-nums;
}
.page-heading p, .library-intro p, .management-card p, .note-box,
.beta-guide p, .beta-guide li { font-size: 20px; line-height: 1.6; }
.save-file h3, .create-franchise-disclosure > summary { font-size: 28px; }
.library-intro p { max-width: 40ch; }
.library-hero-copy { max-width: 100%; }
.page-heading > div, .section-head > h2, .library-brand,
.play-option > div, .clock-details { min-width: 0; }
.section-head { gap: 12px; flex-wrap: wrap; }
.section-head h2 { overflow-wrap: anywhere; }
.topbar { min-height: 60px; height: auto; padding-top: 10px; padding-bottom: 10px; }
.sa-select-trigger { height: auto; }
.sa-select-value { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
.play-option { min-height: 80px; }
.play-option strong { line-height: 1.4; }
.play-option small, .first-read-control, .package-control p { line-height: 1.5; }
.play-option .type-label { letter-spacing: 0; }
.pre-snap-steps { font-size: 16px; }
.pre-snap-steps li { flex-wrap: wrap; gap: 2px 5px; }
.play-clock strong { font-family: var(--font); }
.field-event strong { font-size: 28px; line-height: 1.25; letter-spacing: 0; }
.field-event span { font-size: 20px; line-height: 1.4; }
.field-event--flag strong { font-size: 24px; }
.field-caption, .field-controls, .field-drive-actions, .clock-actions { row-gap: 8px; }
.development-notice-heading > span { font-size: 20px; }
.development-notice-player strong { font-size: 20px; }
.depth-row small { line-height: 1.5; }
.stamina-badge { height: auto; min-height: 20px; line-height: 1.4; }
.setup-player, .setup-selected-list .setup-player {
  grid-template-columns: 32px minmax(0, 1fr) 42px 110px 60px;
  gap: 10px;
}
.setup-selected-list .setup-player {
  grid-template-columns: 32px minmax(0,1fr) 42px 48px;
  grid-template-areas: 'position name rating action' '. cost cost action';
}
.setup-selected-list .setup-position { grid-area: position; }
.setup-selected-list .setup-player-name { grid-area: name; }
.setup-selected-list .setup-player-rating { grid-area: rating; }
.setup-selected-list .setup-player-cost { grid-area: cost; text-align: left; }
.setup-selected-list .setup-player .setup-pick { grid-area: action; }
.setup-selected-list .setup-player-cost > strong,
.setup-selected-list .setup-player-cost > small { display: inline; margin-right: 8px; }
.setup-player-name > strong, .setup-selected-list .setup-player-name > strong { font-size: 20px; }
.setup-player-rating strong { font-size: 24px; }
.setup-player-cost > strong { font-size: 20px; }
.setup-player .setup-pick:disabled { font-size: 16px; white-space: normal; }
.setup-position { height: 32px; }
.setup-budget dt, .setup-budget dd { overflow-wrap: anywhere; }
.setup-filters { grid-template-columns: minmax(0,1fr) 150px 150px; }
.setup-roster-actions > .primary, .setup-roster-actions > .secondary { white-space: normal; }
.setup-options-drawer > summary { flex-wrap: wrap; }
.setup-options-drawer > summary small { font-size: 16px; }
@media (min-width: 901px) {
  .game-layout { grid-template-columns: minmax(0,1fr) 320px; }
  .app-shell { grid-template-columns: 204px minmax(0,1fr); }
  .sidebar { width: 204px; }
}
@media (max-width: 1250px) {
  .setup-selected-list { display: block; }
  .setup-selected-list .setup-player:nth-child(even) { border-left: 0; }
}
@media (max-width: 760px) {
  h1, .page-heading h1 { font-size: 32px !important; }
  .library-new .library-intro h1, .library-returning .library-intro h1 { font-size: 40px !important; }
  .library-hero-copy { max-width: 100%; width: auto; padding: 24px; }
  .library-brand, .brand-word { font-size: 24px; }
  .brand-word small { font-size: 16px; }
  .library-header-actions { flex-wrap: wrap; }
  .library-header .pvp-coming { font-size: 16px; }
  .library-header .pvp-coming small { font-size: 16px; }
  .library-header .text-button, .theme-toggle, .mobile-menu-button { font-size: 20px; }
  .library-header .pvp-coming { flex-wrap: wrap; }
  .page-heading { gap: 16px; flex-wrap: wrap; }
  .hub-record { flex-direction: row; align-items: center; gap: 12px; }
  .hub-record strong { font-size: 28px; }
  .hub-record small { font-size: 16px; }
  .hub-team-summary { flex-wrap: wrap; gap: 16px 24px; }
  .hub-shortcuts { grid-template-columns: 1fr; }
  .save-file-actions { flex-wrap: wrap; }
  .save-file-actions .primary { width: auto; flex: 1; }
  .depth-row.has-portrait { grid-template-columns: 32px minmax(0,1fr); gap: 8px 12px; }
  .depth-row.has-portrait > .sa-select { grid-column: 1 / -1; }
  .depth-row:not(.has-portrait) { grid-template-columns: 1fr; }
  .depth-row { padding-top: 16px; padding-bottom: 16px; }
  .depth-row small { margin-top: 4px; }
  .setup-player, .setup-selected-list .setup-player {
    grid-template-columns: 32px minmax(0,1fr) 44px 64px;
    grid-template-areas: 'position name rating action' '. cost cost action';
    gap: 8px 10px; padding: 16px 12px;
  }
  .setup-position { grid-area: position; }
  .setup-player-name { grid-area: name; }
  .setup-player-rating { grid-area: rating; }
  .setup-player-cost { grid-area: cost; text-align: left; }
  .setup-player .setup-pick { grid-area: action; font-size: 16px; min-height: 44px; }
  .setup-player-cost > strong, .setup-player-cost > small { display: inline; margin-right: 8px; }
  .setup-filters { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .setup-search-field { grid-column: 1 / -1; }
  .roster-setup .page-heading > .setup-save-note { max-width: none; text-align: left; font-size: 16px; }
  .setup-budget dl { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
  .field-event strong { font-size: 24px; }
  .field-event span { font-size: 16px; }
  .field-event--flag strong { font-size: 24px; }
  #editor-field .editor-role-label { font-size: 48px; }
}
@media (max-width: 430px) {
  .scoreboard { display: grid; grid-template-columns: minmax(0,1fr) minmax(104px,1.1fr) minmax(0,1fr); gap: 8px; }
  .scoreboard .score-clock { min-width: 0; width: auto; flex: auto; }
  .scoreboard .score-clock strong { font-size: 28px; }
  .scoreboard .score-clock small { font-size: 16px; letter-spacing: 0; }
  .team-name { font-size: 20px; }
  .scoreboard .score { font-size: 40px; }
  .play-list { grid-template-columns: 1fr; }
  .topbar { padding-left: 12px; padding-right: 12px; gap: 8px; }
  .topbar-right { gap: 8px; }
  .active-save-label { max-width: 90px; }
}
@media (max-width: 360px) {
  .scoreboard .team-score { flex-direction: column; gap: 4px; }
  .scoreboard .score-clock strong { font-size: 24px; }
}
