/* Clubhouse materials selected by Jim, October 21, 2026.
   Real game components own all state, timing, data and interactions. */
:root {
  --club-canvas: #0b1729;
  --club-steel: #1d3552;
  --club-edge: #57718d;
  --club-paper: #faf7ee;
  --club-muted: #c4d5e7;
  --club-gold: #e2c180;
  --club-well: #091322;
  --paper: #faf7ee;
  --paper-dark: #f3ecda;
  --sheet: #faf7ee;
  --ink: #142b43;
  --muted: #496078;
  --line: #cbd7e4;
  --rule: #657f9d;
}

html { scrollbar-color: #758aa6 var(--club-canvas); }
body {
  min-height: 100vh;
  background: linear-gradient(#09101aa8, #0b1729ef 750px), url('/assets/ballpark-stadium-sunburst.webp') center 70px / cover fixed;
  color: #f5f4e9;
}
::selection { background: #ffb18c; color: #11253d; }
input, textarea { caret-color: #b4481b; }
a { text-underline-offset: 4px; }
.site-header {
  background: #10243d;
  border-bottom: 1px solid #415b7d;
  box-shadow: 0 6px 18px #04070b40;
}
.wordmark { color: #fff9e8; }
.wordmark-sub { color: #ff824e; }
.main-nav a, .main-nav button { color: #dfe3e9; }
.main-nav a:hover, .main-nav a.active, .main-nav button:hover { color: #ffae83; }
.main-nav a.active::after { background: #ff824e; }
.header-account .subtle, .header-account .text-button { color: #dfe3e9; }
.site-footer {
  margin-top: 46px;
  background: #0c141f;
  border-top: 1px solid #3a5272;
  color: #cbd2dc;
}
.site-footer > p { color: #b7c1cf; }
.footer-brand { color: #fff9e8; }
.page-shell { width: calc(100% - 56px); margin-top: 28px; margin-bottom: 46px; }
.page-heading h1, .draft-head h1 { color: #fff1cf; }
.page-heading p, .draft-mode, .back-link { color: #cadbed; }
.back-link { min-height: 44px; display: inline-flex; align-items: center; }
.page-loading { color: #cadbed; }
.page-shell > .subtle, .account-closure .subtle { color: #cadbed; }
.panel, .player-panel, .lobby-entry, .champion-banner {
  color: var(--ink);
}
.panel {
  background: var(--club-paper);
  border-color: #aab7c7;
}
.panel-pad { background: var(--club-paper); }
.page-heading, .draft-head { gap: 22px; }
.page-heading .button-outline, .draft-head .button-outline {
  background: #193451;
  border-color: #718aa6;
  color: #e4edf7;
}
.page-heading .button-outline:hover, .draft-head .button-outline:hover { background: #2b3c53; }
.page-heading .button-dark { background: #ff6a30; color: #11253d; border-color: #ff6a30; }
.page-heading .button-dark:hover { background: #ff8655; }
.form-field input, .form-field select, .player-search, .player-filter {
  background: #fffdf6;
  color: #142b43;
  border-color: #657f9d;
}
.form-field input::placeholder, .player-search::placeholder { color: #3e5778; }
.form-field input:focus, .form-field select:focus, .player-search:focus, .player-filter:focus {
  border-color: #176aab;
  outline-color: #176aab;
}
.modal {
  background: var(--club-paper);
  color: #182a42;
  border: 0;
  box-shadow: 0 20px 70px #05090eb0;
}
.modal::backdrop { background: #060b11b0; }
.modal-close { background: #dae0e7; color: #17273d; border-color: #8699b1; }
.modal .roster-panel { position: relative; top: auto; box-shadow: none; }
.toast { background: #f3e7c6; border-color: #b6a574; color: #1a2d45; box-shadow: 0 8px 24px #070c1280; }
.toast.error { background: #8b291e; color: #fff8e9; }
.site-header :focus-visible, .site-footer :focus-visible, .page-heading :focus-visible,
.draft-head :focus-visible, .daily-pick-clock :focus-visible, .result-scoreboard :focus-visible {
  outline-color: #b6dcff;
}

/* The invitation opens into the same stadium and steel as the working room. */
.ballpark-home { background: transparent; }
.ballpark-hero { background: #111d2d; border-bottom: 1px solid #456287; }
.ballpark-hero::before {
  background: linear-gradient(90deg, #0c1622f5 0%, #101b2ae8 42%, #101b2a58 76%, #101b2a18);
}
.ballpark-hero-inner { padding-block: 42px; }
.ballpark-hero h1 { color: #fff1cf; text-shadow: 0 3px 5px #060b1170; }
.ballpark-hero-copy > p { color: #d7dde4; }
.ballpark-hero-copy .ballpark-hero-lead { color: #fff0cf; }
.ballpark-hero-copy .ballpark-hero-note { color: #c9d1db; }
.ballpark-hero-actions .button-dark { background: #ff6a30; border-color: #ff6a30; color: #11253d; }
.ballpark-hero-actions .button-dark:hover { background: #ff8655; }
.ballpark-hero-actions .button-outline { background: #f8f3e2; border-color: #657f9d; color: #17273d; }
.ballpark-resume { color: #ffbf94; border-color: #92a3b9; }
.ballpark-machine {
  background: linear-gradient(155deg, #214364, #102b47);
  border-color: #30435d;
  outline-color: #8396af;
  box-shadow: 12px 18px 32px #04080d70, inset 0 1px #8fa1b850;
  color: #fff7df;
}
.ballpark-machine-year > span {
  background: linear-gradient(#334762, #1a2d45);
  border-color: #627999;
  color: #fff3d2;
}
.ballpark-machine-player { background: #101b2a; border-color: #4c6b93; }
.ballpark-machine-caption { color: #bfc9d5; font-size: 12px; }
.ballpark-stats { background: #101b2ae8; border-top-color: #f77937; color: #f6edce; }
.ballpark-stats span { color: #ced5df; }
.ballpark-how {
  margin-block: 26px;
  padding: 28px;
  background: var(--club-paper);
  color: #1c3652;
  border: 0;
}
.ballpark-how h2, .ballpark-step h3 { color: #1c3652; }
.ballpark-step + .ballpark-step { border-left-color: #a9b5c5; }
.ballpark-step-mark span { color: #2c3e56; }
.ballpark-step p, .ballpark-how-note { color: #2e4058; }
.ballpark-position small { font-size: 9px; }
.ballpark-formats { padding-top: 8px; }
.ballpark-formats h2, .ballpark-competition h2, .ballpark-closing h2 { color: #fff1cf; }
.ballpark-format { border: 0; border-radius: 5px; box-shadow: inset 0 1px #ffffff55, 0 8px 16px #070d1445; }
.ballpark-format.is-time {
  background: linear-gradient(135deg, #264b70, #153553);
  color: #fff4d8;
}
.ballpark-format.is-time:hover { background: #2f435c; }
.ballpark-format.is-year { background: #dce1e7; color: #1c3652; }
.ballpark-format.is-year:hover { background: #f5f3e5; }
.ballpark-format.is-daily { background: #f1d8b1; color: #182940; }
.ballpark-format.is-daily:hover { background: #ffe5bd; }
.ballpark-format-copy > span { color: inherit; }
.ballpark-format-years > span { background: #111e2e; border-color: #5e7593; }
.ballpark-franchise { color: #c9d1db; }
.ballpark-franchise button, .ballpark-coverage button { color: #ffbb8b; }
.ballpark-franchise button { min-height: 44px; }
.ballpark-competition { background: #0f1b2ad9; border-block: 1px solid #374e6c; }
.ballpark-tournament { background: #f6f1e2; }
.ballpark-closing { padding-block: 32px; }
.ballpark-coverage { color: #bfc9d5; border-color: #445f83; }

/* Compact candidates stay on paper. Atmosphere remains outside the decision. */
.draft-page.is-daily .draft-head { margin-bottom: 15px; }
.draft-head h1 { font-size: 36px; letter-spacing: .015em; }
.draft-page .draft-progress-text, .draft-page .draft-progress-text > span:last-child { color: #cadbed; }
.draft-layout { grid-template-columns: minmax(0, 1fr) 286px; gap: 26px; }
.draft-main {
  padding: 7px;
  background: #1c3654;
  box-shadow: 0 15px 35px #04070a59, inset 0 1px #48658b;
  border-radius: 8px;
}
.team-reveal {
  min-height: 142px;
  padding: 22px;
  background: linear-gradient(155deg, #214364, #102b47);
  border-top: 3px solid #f77937;
  border-bottom-color: #5c728f;
  border-radius: 0;
  box-shadow: inset 0 1px #8fa1b835, inset 0 -1px #080f17;
}
.team-reveal h2 { color: #fff7df; }
.team-reveal p, .team-reveal .team-pick-count { color: #cedfef; }
.team-reveal .team-season-context, .daily-current-team .team-season-context {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 6px;
  margin: 6px 0 0;
  font-variant-numeric: tabular-nums;
}
.team-season-context > span:not(.season-context-divider) { max-width: 100%; }
.team-seal { background: #182a41; border-color: #6e85a2; color: #f5deaa; }
.draft-decision-strip { background: #f1e9d6; color: #26364b; padding: 10px 14px; }
.draft-decision-strip .reroll-button { min-height: 44px; background: #faf7ec; color: #243347; border-color: #657f9d; }
.daily-current-team {
  padding: 16px 14px 12px;
  background: linear-gradient(155deg, #214364, #102b47);
  border-top: 3px solid #f77937;
}
.daily-pick-clock {
  top: 0;
  padding: 12px 14px;
  gap: 8px 18px;
  background: linear-gradient(155deg, #214364, #102b47);
  border-top: 1px solid #446084;
  box-shadow: inset 0 1px #8fa1b835, inset 0 -1px #080f17;
  border-radius: 0;
}
.daily-current-team h2 { color: #fff7e1; }
.daily-current-team p, .daily-pick-clock-label, .daily-clock-foot p { color: #cedfef; }
.daily-pick-clock-readout { min-width: 117px; padding-left: 14px; border-left: 1px solid #446084; }
.daily-pick-clock-time { color: #fff8df; text-shadow: 0 2px 3px #080e15; }
.daily-position-tools .player-filter { background: #f4f4e9; border-color: #657f9d; color: #101c2c; }
.daily-position-tools .reroll-button, .daily-roster-button {
  background: #101c2b;
  border-color: #8ba9c9;
  box-shadow: inset 0 1px #8fa0b730;
}
.daily-position-tools .reroll-button:hover, .daily-roster-button:hover { background: #2b3c53; }
.daily-position-tools .reroll-button .count-chip { background: #e8e4cf; color: #182940; }
.daily-pick-clock.is-urgent .daily-pick-clock-time { color: #ffb48b; }
.daily-pick-clock.is-expired .daily-pick-clock-time { color: #cedfef; }
.daily-clock-foot .daily-pick-clock-status { color: #fff6df; }
.daily-pick-clock.has-connection-error .daily-pick-clock-status { color: #ffd6c0; }
@property --stick-event-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes stick-event-border-orbit {
  to { --stick-event-angle: 360deg; }
}
.ballpark-home .stick-event-feature {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  width: calc(100% - 64px);
  max-width: 1280px;
  margin: 24px auto 12px;
  padding: 24px 28px;
  border: 2px solid #ffc46e;
  border-radius: 8px;
  background: #10243d;
  color: #fff1cf;
  box-shadow: 0 0 12px #ffcb76b3, 0 0 32px #ff983d80, inset 0 0 14px #ff983d1f;
}
.stick-event-feature::before {
  content: none;
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  padding: 4px;
  background: conic-gradient(from var(--stick-event-angle, 0deg), #e5a63f 0deg 220deg, #ffdc8a 265deg, #fffef5 290deg 310deg, #ffc15b 340deg, #e5a63f 360deg);
  filter: drop-shadow(0 0 4px #ffd080);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
  animation: stick-event-border-orbit 5s linear infinite;
}
@supports (mask-composite: exclude) or (-webkit-mask-composite: xor) {
  .stick-event-feature::before { content: ''; }
}
.stick-event-feature .stick-event-emblem { width: 80px; height: 80px; }
.stick-event-feature > div { min-width: 0; }
.ballpark-home .stick-event-feature h2 { font: 400 clamp(26px, 2.5vw, 34px)/1.2 var(--display); text-transform: uppercase; margin: 0 0 8px; }
.stick-event-feature p { font-size: 16px; line-height: 1.5; color: #d3e0ed; margin: 0; max-width: 65ch; }
.stick-event-feature .stick-event-window { color: #ffd17b; font-weight: 700; margin-bottom: 6px; }
.stick-event-feature .button { min-height: 48px; white-space: nowrap; }
.stick-event-feature .button:focus-visible { outline: 3px solid #b6dcff; outline-offset: 4px; }
@media (max-width: 900px) {
  .ballpark-home .stick-event-feature { grid-template-columns: 64px minmax(0, 1fr); gap: 16px 20px; padding: 22px; }
  .stick-event-feature .stick-event-emblem { width: 64px; height: 64px; }
  .stick-event-feature .button { grid-column: 2; justify-self: start; }
}
@media (max-width: 600px) {
  .ballpark-home .stick-event-feature { width: calc(100% - 32px); margin-top: 20px; padding: 20px 18px; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; box-shadow: 0 0 10px #ffcb76a6, 0 0 22px #ff983d80, inset 0 0 10px #ff983d1f; }
  .stick-event-feature .stick-event-emblem { width: 48px; height: 48px; align-self: start; }
  .stick-event-feature .button { grid-column: 1 / -1; justify-self: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  .stick-event-feature::before { animation: none; --stick-event-angle: 315deg; }
}
.player-panel { border: 0; background: var(--club-paper); }
.player-panel .player-toolbar { background: #e1e5eb; border-bottom: 1px solid #c4cdd8; }
.player-panel .player-search { background: #fffdf6; border-color: #657f9d; box-shadow: inset 0 2px 3px #2a3b520a; }
.player-panel .player-position-heading { color: #2b3c53; border-bottom-color: #657f9d; }
.player-panel .player-position-count { color: #374e6b; }
.player-panel .player-row { border-bottom-color: #ccd3dd; }
.player-panel .player-row:hover { background: #e4e8ed; }
.player-panel .player-name { color: #142b43; }
.player-panel .player-meta { color: #39506e; }
.player-panel .player-stats > span { color: #192b42; }
.player-panel .player-stats small { color: #3a5272; }
.player-panel .player-pick {
  background: #f9f7ec;
  color: #233144;
  border: 1px solid #657f9d;
  border-radius: 3px;
  box-shadow: inset 0 1px #fffef9;
}
.player-panel .player-pick:hover { background: #d8dee5; border-color: #3a5170; }
.player-panel .player-row.selected { background: #ffdfb5; }
.player-panel .player-row.selected .player-pick { background: #f87937; border-color: #bb4c1d; color: #111e2e; }
.player-panel .player-inline-choices .slot-choice {
  background: #26364a;
  border-color: #26364a;
  border-radius: 3px;
  box-shadow: inset 0 1px #7389a540;
}
.player-panel .player-inline-choices .slot-choice:hover { background: #384f6d; border-color: #384f6d; }
.draft-bottom { padding: 10px 9px 5px; }
.draft-bottom p { color: #cdd4de; font-size: 12px; }
.draft-context { color: #1b2f4a; background: #f1e9d6; border-color: #afbbca; }
.roster-panel {
  top: 18px;
  background: var(--club-paper);
  border: 0;
  border-radius: 2px;
  box-shadow: 0 13px 23px #03070d60;
  overflow: visible;
}
.roster-panel::before {
  content: '';
  display: block;
  position: absolute;
  top: -6px;
  left: calc(50% - 37px);
  width: 74px;
  height: 16px;
  background: linear-gradient(#9dacc0, #466287);
  border-radius: 3px 3px 5px 5px;
  box-shadow: 0 3px 5px #0e192760;
  z-index: 2;
}
.roster-header { padding: 22px 18px 13px; background: #f1e9d6; border-bottom: 1px solid #a0afc2; }
.roster-header h2 { color: #233245; font-size: 26px; }
.roster-header .count-chip { color: #27374c; background: #c1cad6; }
.roster-progress { padding: 13px 18px 7px; }
.roster-progress span { height: 4px; background: #ced5df; }
.roster-progress span.filled { background: #be4b1d; }
.roster-group-label { padding: 15px 18px 8px; font-size: 11px; color: #384f6c; }
.roster-slot { min-height: 39px; padding: 7px 18px; border-top-color: #d6dce4; color: #243347; }
.slot-id { color: #2c3e55; font-size: 11px; font-weight: 700; min-width: 25px; }
.slot-empty { color: #446084; font-size: 13px; }
.slot-player { color: #1c3652; font-size: 13px; }
.slot-year { color: #3e5777; font: 400 11px/1.3 var(--body); }

/* Completion gives the saved record and earned objects their own weight. */
.result-scoreboard {
  background: linear-gradient(155deg, #244766, #102b47);
  border-top-color: #e8bc6d;
  border-radius: 7px;
  padding: 26px 30px;
  box-shadow: 0 13px 30px #04080d57, inset 0 1px #768ca880;
}
.result-scoreboard-heading h1 { color: #fff2cf; }
.result-record dd { font-size: 88px; color: #fff4d7; text-shadow: 0 3px 4px #080f17; }
.result-format { padding: 5px 9px; border-radius: 3px; background: #334863; color: #dee4ec; }
.result-player-fact {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(0, 3fr);
  gap: 28px;
  margin-top: 24px;
  padding: 24px 30px;
  border-radius: 5px;
  background: #faf7ee;
  color: #142b43;
  box-shadow: 0 8px 20px #04080d30;
}
.result-player-fact-heading h2 { margin: 0 0 8px; color: #142b43; font-size: 27px; line-height: 1.1; }
.result-player-fact-heading p { margin: 0; color: #284869; font-size: 16px; font-weight: 700; }
.result-player-fact-copy > p { max-width: 75ch; margin: 0 0 8px; font-size: 18px; line-height: 1.55; }
.result-player-fact-source { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 20px; font-size: 13px; }
.result-player-fact-source > span { color: #496078; }
.result-player-fact-source a { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; color: #174c7d; font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.result-player-fact-source a:is(:hover, :focus-visible) { color: #142b43; text-decoration-thickness: 2px; }
.result-player-fact-source a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
html[data-sport] .result-player-fact a:focus-visible { outline-color: currentColor; }
@media (max-width: 600px) {
  .result-player-fact { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 22px 20px; }
  .result-player-fact-heading h2 { font-size: 25px; }
  .result-player-fact-copy > p { font-size: 17px; }
  .result-player-fact-source { align-items: start; flex-direction: column; gap: 0; }
}
.result-awards { padding: 29px 30px; background: #1c3858; border-radius: 7px; box-shadow: 0 14px 32px #05080d57; }
.result-awards-heading { align-items: start; }
.result-awards-heading h2 { color: #f9ecc6; }
.result-awards-heading p { color: #c5ced9; }
.result-awards-heading > a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; color: #f2d494; }
.result-award-list { gap: 12px; }
.result-award {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 20px 16px;
  background: linear-gradient(#324660, #27374c);
  box-shadow: inset 0 1px #7188a550, 0 8px 14px #0a111a3d;
  border-radius: 5px;
}
.result-award .achievement-medal { width: 91px; height: 108px; filter: drop-shadow(0 5px 4px #080d1480); }
.result-award h3 { font-size: 17px; color: #fff0c8; }
.result-award p, .result-award-kind { color: #d3dae2; }
.result-award-new { padding: 4px 7px; border-radius: 2px; background: #dec58a; color: #17283e; }
.result-scouting { background: #f7f4e8; border: 0; color: #192c44; }
.result-scouting h2 { color: #253447; }
.result-model-note, .rating-row small { color: #3e5777; }
.result-model-note { max-width: 65ch; }
.result-analysis .roster-panel { position: relative; top: auto; }

/* Collection shelves inherit real awards and server progress. */
.achievements-heading h1 { color: #fff1cf; }
.achievements-heading p { color: #cadbed; }
.achievement-identity {
  background: linear-gradient(#28384ee3, #101c2cf5), url('/assets/ballpark-stadium-sunburst.webp') center / cover;
  border-radius: 6px;
  box-shadow: 0 16px 34px #04080d60;
}
.achievement-collection-head { margin-bottom: 0; padding: 22px; background: #f1e9d6; border-radius: 4px 4px 0 0; }
.achievement-collection-head h2 { color: #233143; }
.achievement-collection-head p { color: #496078; }
.achievement-shelves { gap: 0; }
.achievement-shelf { padding: 18px 22px 0; background: var(--club-paper); }
.achievement-shelf:last-child { padding-bottom: 22px; border-radius: 0 0 4px 4px; }
.achievement-shelf-heading h2, .achievement-shelf-heading h3 { color: #2e4159; }
.achievement-shelf-heading span, .achievement-shelf-heading small { color: #3d5575; }
.achievement-row { background: #f8f5e9; }
.achievement-row.is-earned { background: linear-gradient(100deg, #f2e6c9, #faf7ee 82%); }
.achievement-copy h3, .achievement-copy h4 { color: #192c44; }
.achievement-copy p, .achievement-meta, .achievement-row-progress { color: #364c69; }
.achievement-empty { color: #182940; }

/* The same paper and steel keep accounts and competitions readable. */
.league-card:hover { border-color: #456287; }
.league-card, .tournament-card { border-radius: 5px; }
.league-rules { color: #30445e; }
.league-rules > summary { min-height: 44px; padding: 12px 20px; }
.league-rules .panel-pad { padding-top: 8px; }
.invite-box, .countdown-box {
  color: #f7f0d7;
  background: linear-gradient(155deg, #244766, #102b47);
  border-top-color: #f77937;
  box-shadow: inset 0 1px #768ca850;
}
.bracket { color: #16263c; }
.bracket-round h3 { color: #cbd2dc; }
.panel .bracket-round h3 { color: #496078; }
.lobby-entry.empty { color: #cadbed; border-color: #6b82a0; }
.panel .lobby-entry.empty { color: #496078; }
.account-closure { padding-top: 22px; border-top: 1px solid #445f83; color: #d9dee5; }
.account-closure .button-outline { background: #193451; color: #e4edf7; border-color: #718aa6; }
.account-closure .account-close-button:is(:hover, :focus-visible):not(:disabled) {
  background: #2b3c53;
  color: #e4edf7;
  border-color: #bfcfe3;
  outline-color: #bfcfe3;
}

@media (max-width: 1340px) {
  .draft-layout { grid-template-columns: minmax(0, 1fr) 270px; gap: 22px; }
}
@media (max-width: 1100px) {
  .draft-layout { grid-template-columns: minmax(0, 1fr) 245px; gap: 18px; }
  .roster-header { padding-inline: 15px; }
  .roster-slot { padding-inline: 14px; }
  .draft-layout .slot-year { display: none; }
  .ballpark-how { padding: 24px; }
}
@media (max-width: 900px) {
  .draft-layout { display: flex; gap: 24px; }
  .draft-main { width: 100%; }
  .draft-layout > .roster-panel { display: none; }
  .result-scoreboard-heading h1 { font-size: 34px; }
}
@media (max-width: 700px) {
  .site-header { box-shadow: none; }
  .main-nav { border-top-color: #466287; }
  .main-nav.open { flex-wrap: wrap; gap: 2px 18px; }
  .main-nav.open a, .main-nav.open button { font-size: 13px; }
  .ballpark-hero::before { background: linear-gradient(#0f1927ec 0%, #0f1927d9 44%, #0f192740 78%, #0f192720); }
  .ballpark-how { padding: 23px 19px; margin-inline: 14px; }
  .ballpark-position small { font-size: 8px; }
  .ballpark-machine { outline-offset: 0; }
  .ballpark-coverage button { min-height: 44px; }
  .achievements-heading .button-outline { background: #193451; border-color: #718aa6; color: #e4edf7; }
}
@media (max-width: 640px) {
  body { background-position: center 30px; background-attachment: scroll; }
  .page-shell { width: calc(100% - 24px); margin: 20px auto 28px; }
  .draft-head h1 { font-size: 32px; }
  .draft-page.is-daily .draft-head h1 { font-size: 28px; }
  .draft-page.is-daily .draft-head { gap: 10px; margin: 0 3px 12px; }
  .draft-main { padding: 4px; border-radius: 5px; }
  .team-reveal { min-height: 130px; padding: 16px 12px; }
  .team-reveal h2 { font-size: 27px; }
  .team-reveal p { font-size: 13px; }
  .daily-pick-clock { padding: 10px; gap: 8px 9px; }
  .daily-current-team { padding: 14px 10px 12px; }
  .daily-current-team h2 { font-size: 26px; line-height: 1.15; }
  .daily-current-team p { font-size: 11px; gap: 2px 4px; }
  .daily-pick-clock-readout { padding-left: 8px; min-width: 82px; }
  .daily-pick-clock-label, .daily-clock-foot p { font-size: 11px; }
  .daily-pick-clock-label { gap: 3px; }
  .daily-pick-clock-label svg { width: 12px; height: 12px; }
  .daily-position-tools .reroll-button, .daily-roster-button { padding: 8px 7px; }
  .player-panel .player-toolbar { padding: 9px 10px; }
  .player-panel .player-position-groups { padding-inline: 10px; }
  .player-panel .player-row { min-height: 62px; }
  .player-panel .player-name { font-size: 16px; }
  .result-scoreboard { padding: 22px 18px; }
  .result-scoreboard-heading { gap: 12px; flex-direction: column; }
  .result-scoreboard-heading h1 { font-size: 31px; }
  .result-record dd { font-size: 76px; }
  .result-awards { padding: 24px 18px; }
  .result-awards-heading h2 { font-size: 26px; }
  .result-award { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 14px; text-align: left; padding: 16px 13px; }
  .result-award .achievement-medal { width: 74px; height: 88px; }
  .result-award h3 { font-size: 17px; }
  .achievement-collection-head { padding: 18px; }
  .achievement-shelf { padding: 12px 18px 0; }
  .achievement-shelf:last-child { padding-bottom: 18px; }
  .site-footer { margin-top: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .team-reveal, .daily-pick-clock, .result-award, .has-new-awards .result-award.is-new { animation: none; transition: none; }
}
@media (min-width: 901px) and (max-height: 960px) {
  .achievement-identity { position: static; }
}