.available-player-summary { color: var(--muted); }
.available-player-summary-value { color: var(--accent); }
.draft-player-button { border-color: var(--green-dark); background: var(--green-dark); }
.draft-player-button:hover { border-color: var(--green); background: var(--green); }
.mobile-sheet-handle { display: none; }
@media (max-width: 800px) {
	.mobile-tabs button.is-selected { background: var(--accent); color: #fff; }
	body.is-drafting .draft-layout[data-mobile-view="roster"] .roster-slot-player { gap: .15rem; }
	body.is-drafting .draft-layout[data-mobile-view="roster"] .roster-player-image { margin-right: 0; }
}
.completed-board tbody tr.position-rb > * { background: #f1e4ff; }.completed-board tbody tr.position-wr > * { background: #fff1b8; }.completed-board tbody tr.position-qb > * { background: #d7f3f0; }.completed-board tbody tr.position-te > * { background: #ffe0c2; }.completed-board tbody tr.position-k > * { background: #e4e7ff; }.completed-board tbody tr.position-dst > * { background: #e8e8e8; }.completed-board tbody tr.empty > * { color: var(--muted); }
.member-autopick-button { border: 1px solid var(--line); background: var(--surface); color: var(--muted); padding: .35rem .5rem; font: .62rem 'DM Mono', monospace; cursor: pointer; }
:root { --accent: var(--green); --accent-dark: var(--green-dark); --accent-soft: var(--soft-green); }
.member-autopick-button:hover, .member-autopick-button:focus-visible { border-color: var(--accent); color: var(--accent); }
.member-slot-select { border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .3rem .4rem; font: .68rem 'DM Mono', monospace; }
.member-autopick-controls { margin-top: 1rem; border: 1px solid var(--line); background: var(--surface); padding: 1rem; }
.member-autopick-controls > p { margin: 0; }.member-autopick-controls > p + p { color: var(--muted); margin-top: .35rem; font-size: .85rem; }
.draft-member-autopick-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-top: 1px solid var(--line); padding-top: .65rem; margin-top: .65rem; }
.draft-member-autopick-row > span { overflow-wrap: anywhere; font: .72rem 'DM Mono', monospace; }
.completed-report { margin-top: 2rem; }
.previous-drafts { margin-top: 2rem; border-top: 1px solid var(--line); padding-top: 1.5rem; }
.previous-drafts-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }.previous-drafts-heading h3 { margin: .3rem 0 0; }.previous-drafts-heading > span { color: var(--muted); font: .65rem 'DM Mono', monospace; }
.previous-draft-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }.previous-draft { display: grid; gap: .5rem; min-width: 0; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: 1rem; text-align: left; }.previous-draft:hover, .previous-draft:focus-within { border-color: var(--accent, #c56a2d); }.previous-draft-open { display: grid; gap: .35rem; border: 0; background: transparent; color: inherit; padding: 0; text-align: left; cursor: pointer; }.previous-draft-open strong { color: var(--accent, #c56a2d); font: 1rem 'DM Mono', monospace; letter-spacing: .08em; }.previous-draft-open span, .previous-draft-open small { color: var(--muted); font: .65rem 'DM Mono', monospace; }.previous-draft-open small { font-size: .6rem; }.previous-draft-delete { justify-self: start; border: 1px solid var(--line); background: transparent; color: var(--muted); padding: .3rem .45rem; font: .6rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }.previous-draft-delete:hover, .previous-draft-delete:focus-visible { border-color: var(--accent, #c56a2d); color: var(--accent, #c56a2d); }
.completed-report-heading, .completed-board-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.completed-report-heading h2, .completed-board-heading h3 { margin: .3rem 0 0; }.completed-report-heading > p { color: var(--muted); font-size: .85rem; }
.grade-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.grade-card { min-width: 0; border: 1px solid var(--line); background: var(--surface); }
.grade-source-controls { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.grade-source-toggle { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 18rem; border: 1px solid var(--line); background: var(--surface); }
.grade-source-toggle button { min-height: 2.5rem; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); padding: .45rem .75rem; font: .65rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }.grade-source-toggle button:last-child { border-right: 0; }.grade-source-toggle button[aria-pressed="true"] { background: var(--ink); color: var(--surface); }
.grade-hero { display: flex; align-items: center; gap: 1rem; border: 1px solid var(--line); background: var(--surface); padding: 1rem; }.grade-letter { display: grid; place-items: center; width: 84px; height: 84px; flex: 0 0 84px; background: #b7eac6; color: #0c5b38; font: 700 2.5rem 'Space Grotesk', sans-serif; }.grade-hero h3 { margin: .25rem 0; }.grade-hero p:last-child { margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.45; }
.grade-card .grade-hero { border: 0; border-bottom: 1px solid var(--line); }.grade-card .grade-categories { border: 0; }
.grade-categories { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }.grade-category { display: grid; align-content: center; gap: .35rem; min-height: 110px; padding: 1rem; background: var(--surface); }.grade-category strong { font: 1.5rem 'Space Grotesk', sans-serif; }.grade-category span { color: var(--muted); font: .65rem 'DM Mono', monospace; text-transform: uppercase; }
.completed-team-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0 2rem; }.final-team-roster { border: 1px solid var(--line); background: var(--surface); }.final-team-roster.is-user { border-color: var(--accent, #c56a2d); }
.final-team-roster header { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; padding: .85rem 1rem; border-bottom: 1px solid var(--line); }.final-team-roster h3 { margin: 0; }.final-team-roster header span, .completed-team-meta { color: var(--muted); font: .65rem 'DM Mono', monospace; }.completed-team-meta { margin: .75rem 1rem; }
.final-roster-list .final-roster-row { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr) auto; gap: .5rem; padding: .55rem 1rem; border-top: 1px solid var(--line); font-size: .8rem; }.final-roster-row small { color: var(--muted); font: .62rem 'DM Mono', monospace; text-transform: uppercase; }.final-roster-row span { overflow-wrap: anywhere; }.final-roster-row strong { font: .7rem 'DM Mono', monospace; }.final-roster-row.is-bench { background: color-mix(in srgb, var(--muted) 7%, transparent); }
.completed-board-scroll { overflow-x: auto; margin-top: 1rem; }.completed-board { width: 100%; min-width: 640px; border-collapse: collapse; background: var(--surface); }.completed-board th, .completed-board td { padding: .65rem .75rem; border-bottom: 1px solid var(--line); text-align: left; }.completed-board thead th { background: var(--ink); color: var(--surface); font: .65rem 'DM Mono', monospace; text-transform: uppercase; }
@media (max-width: 800px) { .grade-layout, .completed-team-grid, .previous-draft-list { grid-template-columns: 1fr; }.grade-source-controls { align-items: stretch; flex-direction: column; gap: .6rem; }.grade-source-toggle { width: 100%; min-width: 0; }.completed-report-heading { align-items: start; flex-direction: column; gap: .75rem; }.grade-hero { align-items: flex-start; }.final-roster-row { grid-template-columns: 3.5rem minmax(0, 1fr); }.final-roster-row > strong { display: none; } }
.friends-page { overflow: hidden; }
.section-number { color: var(--accent, #c56a2d); font-family: 'DM Mono', monospace; }
.friends-section { border-top: 1px solid var(--line); padding-top: 4rem; padding-bottom: 6rem; display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 2rem; }
.section-content { min-width: 0; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.section-note { max-width: 25rem; color: var(--muted); line-height: 1.5; }
.friends-status { min-height: 1.4rem; margin: 1rem 0 0; color: var(--muted); }
.auth-gate, .choice-panel, .lobby { border: 1px solid var(--line); background: var(--surface); padding: 1.5rem; }
.auth-gate { margin-top: 2rem; border-left: 3px solid var(--accent, #c56a2d); }
.auth-gate button { margin-top: 1rem; }
.auth-gate h3, .auth-gate p { margin: 0; }.auth-gate p { color: var(--muted); margin-top: .5rem; }
.room-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 2rem; }
.room-choice.invite-mode { grid-template-columns: 1fr; }
.choice-panel h3 { margin: .35rem 0 1.5rem; }.choice-panel form { display: grid; gap: 1rem; }.choice-panel label { display: grid; gap: .4rem; color: var(--muted); font: .72rem 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .04em; }.choice-panel input, .choice-panel select { width: 100%; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .8rem; font: inherit; }.choice-panel button { justify-self: start; margin-top: .25rem; }
.friends-config-panel { display: grid; gap: .75rem; margin: 0 0 1.25rem; border: 1px solid var(--line); padding: .85rem 1rem; }.friends-config-panel > div:first-child { display: grid; gap: .3rem; }.friends-config-panel > div:first-child span { color: var(--muted); font-size: .8rem; }.friends-config-controls { display: flex; flex-wrap: wrap; gap: .5rem; }.friends-config-controls .saved-configs { display: flex; flex: 1 1 100%; flex-wrap: wrap; gap: .5rem; }.friends-config-controls .saved-config-button { border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .7rem .85rem; cursor: pointer; }.friends-config-controls .saved-config-button.is-selected, .friends-config-controls .saved-config-button:hover, .friends-config-controls .saved-config-button:focus-visible { border-color: var(--green); background: var(--soft-green); color: var(--green-dark); }.friends-config-controls .saved-config-empty { align-self: center; color: var(--muted); font: .65rem 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .03em; }.friends-config-controls button { margin: 0; }
.roster-field { border: 0; border-top: 1px solid var(--line); padding: 1rem 0 0; margin: 0; }.roster-field legend { color: var(--muted); font: .72rem 'DM Mono', monospace; text-transform: uppercase; }.roster-controls { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; margin-top: .75rem; }.roster-controls label { font-size: .62rem; }.roster-controls input { padding: .6rem; }
.lobby { margin-top: 2rem; }.lobby-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; border-bottom: 1px solid var(--line); padding-bottom: 1rem; }.room-code { display: block; margin-top: .4rem; color: var(--accent, #c56a2d); font: 2rem 'DM Mono', monospace; letter-spacing: .12em; }.lobby-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(220px, .7fr); gap: 2rem; padding: 1.5rem 0; }.member-list { display: grid; gap: .5rem; margin-top: .75rem; }.member-row { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); padding: .7rem 0; }.member-row span { color: var(--muted); font: .72rem 'DM Mono', monospace; }.member-row strong { overflow-wrap: anywhere; }.room-summary { border-left: 1px solid var(--line); padding-left: 1.5rem; }.room-summary dl { display: grid; grid-template-columns: auto 1fr; gap: .65rem 1rem; margin: .8rem 0 1.5rem; }.room-summary dt { color: var(--muted); font: .68rem 'DM Mono', monospace; text-transform: uppercase; }.room-summary dd { margin: 0; text-align: right; }.lobby-help { color: var(--muted); font-size: .85rem; line-height: 1.5; }.lobby > button { margin-top: .5rem; }
.draft-view { margin-top: 2rem; }.draft-view-heading, .draft-player-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }.draft-view-heading h3, .draft-player-heading h3 { margin: .35rem 0 0; }.draft-progress, #available-count { color: var(--muted); font: .7rem 'DM Mono', monospace; }.draft-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 1px; margin-top: 1.25rem; background: var(--line); border: 1px solid var(--line); }.draft-team { min-height: 150px; background: var(--surface); }.draft-team > strong { display: block; padding: .75rem; border-bottom: 2px solid var(--ink); font: .68rem 'DM Mono', monospace; text-transform: uppercase; overflow-wrap: anywhere; }.draft-team.is-current { outline: 2px solid var(--accent, #c56a2d); outline-offset: -2px; }.draft-pick { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr) auto; gap: .4rem; padding: .55rem .65rem; border-bottom: 1px solid var(--line); font-size: .78rem; }.draft-pick small, .draft-pick em { color: var(--muted); font: .62rem 'DM Mono', monospace; }.draft-pick span { overflow-wrap: anywhere; }.draft-players { margin-top: 1.5rem; border: 1px solid var(--line); background: var(--surface); padding: 1rem; }.draft-filters { display: grid; grid-template-columns: 1fr 100px; gap: .5rem; margin: .8rem 0; }.draft-filters input, .draft-filters select { width: 100%; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .75rem; font: inherit; }.draft-player-list { max-height: 480px; overflow: auto; }.draft-player { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid var(--line); }.draft-player strong, .draft-player span { display: block; }.draft-player span { color: var(--muted); font-size: .75rem; }.draft-player em { color: var(--accent, #c56a2d); font: normal .68rem 'DM Mono', monospace; }.draft-pick-button { border: 1px solid var(--accent, #c56a2d); background: var(--accent, #c56a2d); color: #fff; padding: .55rem .7rem; font: .68rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }.draft-pick-button:disabled { border-color: var(--line); background: var(--surface); color: var(--muted); cursor: not-allowed; }
.is-hidden { display: none !important; }
@media (max-width: 800px) { .friends-section { grid-template-columns: 1fr; gap: 1rem; padding-top: 2.5rem; }.section-number { order: -1; }.room-choice, .lobby-grid { grid-template-columns: 1fr; }.room-summary { border-left: 0; border-top: 1px solid var(--line); padding: 1.5rem 0 0; }.lobby-heading { align-items: start; flex-direction: column; } }
@media (max-width: 800px) { .roster-controls { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 480px) { .section-heading { align-items: start; flex-direction: column; }.choice-panel button, .lobby-heading button { width: 100%; }.member-row { align-items: start; flex-direction: column; gap: .25rem; } }

/* Match the solo draft workspace. */
.draft-layout { display: grid; grid-template-columns: 235px minmax(0, 1fr); gap: 1.5rem; margin-top: 2rem; }
.draft-sidebar { display: grid; align-content: start; }
.draft-card { background: var(--surface); border: 1px solid var(--line); padding: 1rem; }
.roster-list { display: grid; gap: .45rem; margin-top: 1rem; }
.roster-slot { display: flex; justify-content: space-between; gap: .5rem; border-bottom: 1px solid var(--line); padding: .5rem 0; font-size: .85rem; }
.roster-slot small { color: var(--muted); }
.roster-player-image { width: 30px; height: 30px; margin-right: .35rem; vertical-align: middle; object-fit: contain; border-radius: 50%; }
.available-card { align-self: start; }
.card-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.player-filters { display: grid; grid-template-columns: 1fr 100px; gap: .5rem; margin: .75rem 0; }
.player-filters input, .player-filters select { width: 100%; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .8rem; font: inherit; }
.player-search-toggle { border: 1px solid var(--line); background: var(--surface); color: var(--muted); width: 2.75rem; min-width: 2.75rem; padding: .55rem; font-size: 1rem; cursor: pointer; }
.player-search-toggle:hover, .player-search-toggle:focus-visible { border-color: var(--accent, #c56a2d); color: var(--accent, #c56a2d); }
.card-heading .player-search-toggle { flex: 0 0 2.75rem; align-self: center; }
.player-filters.search-collapsed { display: flex; }
.position-filter-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.player-filters { display: flex; align-items: center; gap: .5rem; }
.position-filter-buttons { flex: 1 1 auto; min-width: 0; }
.player-filters input { flex: 1 1 12rem; min-width: 8rem; }
.player-filters select { flex: 0 0 100px; }
.position-filter-button { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; padding: .2rem; border: 2px solid transparent; border-radius: 50%; color: #111; cursor: pointer; }
.position-filter-button strong { font: .65rem 'DM Mono', monospace; }
.position-filter-button span { font: .58rem 'DM Mono', monospace; }
.position-filter-button.position-all { background: var(--surface); border-color: var(--line); color: var(--muted); }
.position-filter-button.position-qb { background: #d7f3f0; }.position-filter-button.position-rb { background: #f1e4ff; }.position-filter-button.position-wr { background: #fff1b8; }.position-filter-button.position-te { background: #ffe0c2; }.position-filter-button.position-k { background: #e4e7ff; }.position-filter-button.position-dst { background: #e8e8e8; }.position-filter-button.position-flex, .position-filter-button.position-superflex { background: #d9ead3; }
.position-filter-button[aria-pressed="true"] { border-color: var(--ink); box-shadow: 0 0 0 2px var(--surface); }
.available-list { max-height: 460px; overflow: auto; }
.available-player { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto auto; gap: .65rem; align-items: center; padding: .65rem 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.available-player:hover, .available-player:focus-within { color: var(--accent, #c56a2d); }
.available-player img { width: 38px; height: 38px; object-fit: contain; border-radius: 50%; }
.available-player strong, .available-player span { display: block; }
.available-player span { color: var(--muted); font-size: .75rem; }
.available-player em { color: var(--accent, #c56a2d); font: normal .68rem 'DM Mono', monospace; }
.available-player-summary { display: block; margin-top: .2rem; color: var(--accent, #c56a2d); font: .62rem 'DM Mono', monospace; white-space: normal; }
.player-info-trigger { min-width: 0; border: 0; background: transparent; color: inherit; padding: 0; text-align: left; cursor: pointer; }
.player-dialog { width: min(680px, calc(100% - 2rem)); max-height: min(760px, calc(100dvh - 2rem)); align-self: start; margin: 1rem auto; overflow-y: auto; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: 1rem; }
.player-dialog.is-mobile-open { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1000; display: block; width: 100%; height: min(82dvh, 720px); max-height: min(82dvh, 720px); margin: 0; border-radius: 1rem 1rem 0 0; box-shadow: 0 -10px 30px rgb(15 20 18 / .2); }
body.has-mobile-player-dialog::after { position: fixed; inset: 0; z-index: 999; background: rgb(15 20 18 / .45); content: ""; }
.player-dialog::backdrop { background: rgb(15 20 18 / .55); }
.dialog-close { position: absolute; top: .75rem; right: .75rem; border: 0; background: transparent; color: var(--muted); font-size: 1.5rem; cursor: pointer; }
.mock-report-card { border: 1px solid var(--line); background: var(--surface); }
.mock-report-card .card-player { padding: 1.25rem; border-bottom: 1px solid var(--line); }
.mock-report-card .card-identity { display: flex; align-items: center; gap: 14px; min-width: 0; }
.mock-report-card .card-identity h3 { margin: 0 0 5px; font-size: 20px; }
.mock-report-card .card-identity p { margin: 0; color: var(--muted); font: 10px 'DM Mono', monospace; }
.mock-report-card .card-identity img { display: grid; place-items: center; width: 72px; height: 72px; flex: 0 0 72px; object-fit: contain; background: var(--soft-green); }
.headshot-placeholder { display: grid; place-items: center; width: 72px; height: 72px; flex: 0 0 72px; background: var(--soft-green); color: var(--green); font: 20px 'Space Grotesk', sans-serif; }
.mock-report-card .grade-list { list-style: none; margin: 0; padding: 0; }
.mock-report-card .grade-list li { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 62px; padding: .65rem 1.25rem; border-bottom: 1px solid var(--line); cursor: pointer; }
.mock-report-card .grade-list li:last-child { border-bottom: 0; }
.mock-report-card .grade-list li span { display: block; font: 13px 'Space Grotesk', sans-serif; }
.mock-report-card .grade-list small { display: block; margin-top: 4px; color: var(--muted); font: 9px 'DM Mono', monospace; }
.mock-report-card .grade-list strong { display: grid; place-items: center; width: 42px; height: 32px; flex: 0 0 42px; font: 700 16px 'Space Grotesk', sans-serif; }
.mock-report-card .grade-Aplus, .mock-report-card .grade-A { background: #b7eac6; color: #0c5b38; }.mock-report-card .grade-Aminus { background: #d7f4df; color: #0c5b38; }
.mock-report-card .grade-Bplus, .mock-report-card .grade-B, .mock-report-card .grade-Bminus { background: #e7f0d2; color: #47612b; }.mock-report-card .grade-Cplus, .mock-report-card .grade-C, .mock-report-card .grade-Cminus { background: #f6edc8; color: #78631b; }
.mock-report-card .grade-Dplus, .mock-report-card .grade-D, .mock-report-card .grade-Dminus { background: #f5d9bd; color: #8b4d25; }.mock-report-card .grade-F, .mock-report-card .grade-NslashA { background: var(--paper); color: var(--muted); }
.mock-report-card .grade-list .grade-calculation { display: none; line-height: 1.4; }
.mock-report-card .grade-row.is-expanded .grade-calculation { display: block; }
.detail-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border-bottom: 1px solid var(--line); background: var(--line); }
.detail-tabs button { border: 0; background: var(--surface); color: var(--muted); padding: .8rem .55rem; font: .68rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }
.detail-tabs button.is-selected { background: var(--ink); color: var(--surface); }
.detail-panel { display: none; }
.detail-panel.is-selected { display: block; }
.detail-panel h4 { margin: 1.25rem; font: 600 1rem 'Space Grotesk', sans-serif; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.detail-metric { display: grid; gap: .25rem; min-height: 70px; padding: .8rem 1.25rem; background: var(--surface); }
.detail-metric span { color: var(--muted); font: .68rem 'DM Mono', monospace; text-transform: uppercase; }
.detail-metric strong { font: 1.15rem 'Space Grotesk', sans-serif; }
.detail-metric small, .detail-note { color: var(--muted); font-size: .8rem; line-height: 1.5; }
.detail-note { margin: 1.25rem; }
.draft-player-button { border: 1px solid var(--accent, #c56a2d); background: var(--accent, #c56a2d); color: #fff; padding: .5rem .7rem; font: .7rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }
.draft-player-button:disabled { cursor: default; opacity: .5; }
.draft-board-wrap { grid-column: 1 / -1; min-width: 0; overflow: auto; }
.draft-board { grid-template-columns: repeat(var(--team-count), minmax(7rem, 1fr)); grid-template-rows: auto repeat(var(--draft-rounds), minmax(58px, auto)); min-width: max(100%, calc(var(--team-count) * 7rem)); overflow: hidden; border-color: color-mix(in srgb, var(--ink) 18%, var(--line)); box-shadow: 0 12px 30px rgb(15 20 18 / .06); }
.team-heading { padding: .65rem .4rem; background: var(--ink); color: var(--surface); border-right: 1px solid rgb(255 255 255 / .18); border-bottom: 0; text-align: center; font: .62rem 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .06em; overflow-wrap: anywhere; position: sticky; top: 0; z-index: 3; }
.team-heading.is-user { background: var(--accent, #c56a2d); color: #fff; }
.pick-cell { position: relative; display: grid; grid-template-columns: 1fr; grid-template-rows: auto auto auto auto; align-content: center; gap: .18rem; min-height: 72px; padding: .65rem .55rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background-color .2s ease, transform .2s ease; }
.pick-cell small { color: var(--muted); font: .6rem 'DM Mono', monospace; letter-spacing: .04em; }
.pick-cell strong { font-size: .72rem; line-height: 1.15; overflow-wrap: anywhere; }
.pick-player { display: block; padding-right: 2.75rem; overflow: hidden; text-overflow: ellipsis; white-space: normal; font-size: .8rem; font-weight: 600; line-height: 1.15; }
.pick-first-name, .pick-last-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pick-player-image { position: absolute; right: .25rem; bottom: .2rem; width: 2.75rem; height: 2.75rem; object-fit: contain; border-radius: 50%; }
.pick-cell em { color: var(--muted); font: normal .58rem 'DM Mono', monospace; text-transform: uppercase; }
.pick-cell.empty { background: color-mix(in srgb, var(--surface) 88%, var(--line)); color: var(--muted); }
.pick-cell.is-current { z-index: 1; box-shadow: inset 0 0 0 2px var(--accent, #c56a2d); transform: translateY(-1px); }
.pick-cell.position-rb { background: #f1e4ff; }.pick-cell.position-wr { background: #fff1b8; }.pick-cell.position-qb { background: #d7f3f0; }.pick-cell.position-te { background: #ffe0c2; }.pick-cell.position-k { background: #e4e7ff; }.pick-cell.position-dst { background: #e8e8e8; }
.mobile-tabs { display: none; }
.mobile-draft-board { display: none; }
@media (max-width: 800px) {
	body:has(.draft-view:not(.is-hidden)) .friends-section { padding-top: 0; padding-inline: 1rem; }
	body:has(.draft-view:not(.is-hidden)) .friends-section > .section-number { display: none; }
	.draft-view:has(#completed-report) { margin-top: 0; }
	.draft-view:has(#completed-report) > .draft-view-heading { display: none; }
	body:has(.draft-view:not(.is-hidden)) .friends-section > .section-content { min-width: 0; }
	.draft-layout { display: block; }
	.draft-sidebar { display: contents; }
	.draft-board-wrap { margin-top: 1rem; }
	.mobile-tabs { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: .75rem; }
	.mobile-tabs button { border: 1px solid var(--line); background: var(--surface); color: var(--muted); padding: .7rem; font: .7rem 'DM Mono', monospace; text-transform: uppercase; }
	.mobile-tabs button.is-selected { background: var(--ink); color: var(--surface); }
	.draft-card { margin-bottom: 1rem; }
	.available-card { display: none; }
	.available-player { grid-template-columns: 64px minmax(0, 1fr) auto auto; min-height: 92px; box-sizing: border-box; }
	.available-player img { width: 64px; height: 64px; }
	.available-player em { display: none; }
	.draft-player-button { padding: .55rem .65rem; }
	.draft-board { min-width: 620px; }
	.draft-layout[data-mobile-view="board"] .available-card, .draft-layout[data-mobile-view="board"] .draft-sidebar > .draft-card, .draft-layout[data-mobile-view="players"] .draft-sidebar > .draft-card, .draft-layout[data-mobile-view="roster"] .available-card { display: none; }
	.draft-layout[data-mobile-view="board"] .draft-board { display: grid; }
	.draft-layout[data-mobile-view="players"] .draft-board, .draft-layout[data-mobile-view="roster"] .draft-board, .draft-layout[data-mobile-view="roster"] .mobile-draft-board { display: none; }
	.draft-layout[data-mobile-view="players"] .available-card, .draft-layout[data-mobile-view="roster"] .draft-sidebar > .draft-card { display: block; }
	.draft-layout[data-mobile-view="roster"] .roster-slot { min-height: 92px; box-sizing: border-box; }
	.draft-layout[data-mobile-view="roster"] .roster-player-image { width: 64px; height: 64px; }
	.draft-layout[data-mobile-view="roster"] .roster-slot { position: relative; display: block; padding: 0; overflow: hidden; background: #050505; }
	.draft-layout[data-mobile-view="roster"] .roster-slot-player { display: flex; align-items: center; min-height: 76px; margin: 8px 8px 8px 16px; padding: .35rem .7rem .35rem .4rem; border-radius: 6px; color: #111; box-sizing: border-box; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-qb .roster-slot-player { background: #a8c9a1; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-rb .roster-slot-player { background: #d98c8c; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-wr .roster-slot-player { background: #9bbfe3; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-te .roster-slot-player { background: #e3c66b; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-k .roster-slot-player { background: #c1a7d9; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-dst .roster-slot-player { background: #b7b9b5; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-flex .roster-slot-player,
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-superflex .roster-slot-player { background: #b7d5a8; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.position-bench .roster-slot-player { background: #d6d2c8; }
	.draft-layout[data-mobile-view="roster"] .roster-slot.empty .roster-slot-player { background: #d6d2c8 !important; color: #111; }
	.draft-layout[data-mobile-view="roster"] .roster-slot > span:last-child { position: absolute; top: 14px; right: 18px; display: grid; justify-items: end; color: #111; font: .68rem 'DM Mono', monospace; text-align: right; }
	.draft-layout[data-mobile-view="roster"] .roster-slot > span:last-child small { font: .58rem 'DM Mono', monospace; }
	.draft-layout[data-mobile-view="roster"] .roster-slot-player > small,
	.draft-layout[data-mobile-view="roster"] .roster-player-name,
	.draft-layout[data-mobile-view="roster"] .roster-player-name small { color: #111; }
	.draft-layout[data-mobile-view="roster"] .roster-slot-position { position: relative; z-index: 1; flex: 0 0 3.5rem; color: #111 !important; font-weight: 700; }
	.draft-layout[data-mobile-view="players"] .draft-board-wrap, .draft-layout[data-mobile-view="roster"] .draft-board-wrap { margin-top: 0; }
	.mobile-draft-board { display: block; border: 1px solid var(--line); background: var(--surface); }
	.mobile-pick-row { display: grid; grid-template-columns: 58px 92px minmax(0, 1fr); gap: .55rem; align-items: center; min-height: 48px; padding: .55rem .65rem; border-bottom: 1px solid var(--line); }
	.mobile-pick-row:last-child { border-bottom: 0; }
	.mobile-pick-row.is-current { background: color-mix(in srgb, var(--accent, #c56a2d) 12%, transparent); }
	.mobile-pick-row small, .mobile-pick-row strong { font: .62rem 'DM Mono', monospace; text-transform: uppercase; }
	.mobile-pick-row small { color: var(--muted); }
	.mobile-pick-row strong { overflow-wrap: anywhere; }
	.mobile-pick-row span { min-width: 0; font-size: .8rem; overflow-wrap: anywhere; }
	.mobile-pick-row em { color: var(--muted); font: normal .58rem 'DM Mono', monospace; text-transform: uppercase; }
	.mobile-pick-row.position-rb { background: #f1e4ff; }
	.mobile-pick-row.position-wr { background: #fff1b8; }
	.mobile-pick-row.position-qb { background: #d7f3f0; }
	.mobile-pick-row.position-te { background: #ffe0c2; }
	.mobile-pick-row.position-k { background: #e4e7ff; }
	.mobile-pick-row.position-dst { background: #e8e8e8; }
}

	/* Shared solo draft workspace behavior. */
	.draft-action-menu { display: contents; }
	.draft-action-menu summary { display: none; }
	.roster-list { gap: 1rem; }
	.roster-group { display: grid; gap: .35rem; }
	.roster-group + .roster-group { padding-top: .65rem; border-top: 1px solid var(--line); }
	.roster-group h4 { margin: 0; color: var(--muted); font: .65rem 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .04em; }
	.roster-slot-player { display: flex; align-items: center; flex: 1 1 auto; min-width: 0; gap: .4rem; overflow: hidden; }
	.roster-slot-player > small { flex: 0 0 3.6rem; font: .68rem 'DM Mono', monospace; text-transform: uppercase; }
	.roster-player-name { display: flex; align-items: center; min-width: 0; overflow: hidden; }
	.roster-player-details { display: grid; min-width: 0; gap: .1rem; }
	.roster-player-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.roster-team-picker { display: grid; gap: .35rem; margin-bottom: .75rem; color: var(--muted); font: .65rem 'DM Mono', monospace; text-transform: uppercase; }
	.roster-team-picker select { width: 100%; min-width: 0; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: .65rem; font: inherit; text-transform: none; }
	.roster-value, .final-roster-value { display: grid; justify-items: end; gap: .1rem; flex: 0 0 auto; color: var(--muted); text-align: right; }
	.roster-value small, .final-roster-value small { font: .62rem 'DM Mono', monospace; white-space: nowrap; }
	.result-tabs { display: none; }
	.final-ranking { width: 100%; border-collapse: collapse; background: var(--surface); }
	.final-ranking th, .final-ranking td { padding: .65rem .75rem; border-bottom: 1px solid var(--line); text-align: left; }
	.final-ranking thead th { color: var(--muted); font: .65rem 'DM Mono', monospace; text-transform: uppercase; }
	.final-ranking tbody tr.is-user > * { background: color-mix(in srgb, var(--accent, #c56a2d) 24%, var(--surface)); font-weight: 700; }
	.method-note { color: var(--muted); font-size: .78rem; line-height: 1.5; }
	.friends-result-content { display: grid; gap: 1rem; margin-top: 1rem; }
	.completed-board-heading { margin-top: 1rem; }
	.completed-board-scroll { overflow-x: auto; }
	.result-mobile-board { display: none; }
	.mobile-round-picks { background: var(--surface); }
	.player-dialog { height: min(760px, calc(100dvh - 2rem)); box-sizing: border-box; }

	@media (max-width: 800px) {
		body:has(.draft-view:not(.is-hidden)) .site-header,
		body:has(.draft-view:not(.is-hidden)) .site-footer { display: none; }
		body:has(.draft-view:not(.is-hidden)) { overflow: hidden; }
		body:has(.draft-view:not(.is-hidden)) .friends-page { height: 100dvh; overflow: hidden; }
		body:has(.draft-view:not(.is-hidden)) .friends-section { height: 100%; box-sizing: border-box; overflow: hidden; }
		body:has(.draft-view:not(.is-hidden)) .section-heading,
		body:has(.draft-view:not(.is-hidden)) .friends-status { display: none; }
		body:has(.draft-view:not(.is-hidden)) .draft-view { min-height: 100dvh; margin-top: 0; padding-top: var(--draft-mobile-header-height); }
		body:has(.draft-view:not(.is-hidden)) .draft-view-heading { position: fixed; inset: 0 0 auto; z-index: 20; box-sizing: border-box; height: var(--draft-mobile-header-height); min-height: 0; margin: 0; padding: .65rem 1rem; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(12px); }
		body:has(.draft-view:not(.is-hidden)) .draft-view-heading h3 { font-size: 1.35rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-board-wrap { overflow: visible; }
		body:has(.draft-view:not(.is-hidden)) .draft-heading-actions { width: auto; margin-left: auto; justify-content: flex-end; gap: .4rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-progress { display: flex; align-items: center; gap: .35rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-progress-count { display: none; }
		body:has(.draft-view:not(.is-hidden)) .draft-layout { padding-top: 0; }
		body:has(.draft-view:not(.is-hidden)) .mobile-tabs { position: sticky; top: 6rem; z-index: 4; grid-template-columns: repeat(3, 1fr); margin: 0 0 .75rem; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 8px 24px rgb(15 20 18 / .08); }
		body:has(.draft-view:not(.is-hidden)) .mobile-tabs button { min-height: 2.75rem; border: 0; border-radius: 6px; }
		body:has(.draft-view:not(.is-hidden)) .draft-card,
		body:has(.draft-view:not(.is-hidden)) .mobile-draft-board,
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu summary,
		body:has(.draft-view:not(.is-hidden)) .player-filters input,
		body:has(.draft-view:not(.is-hidden)) .player-filters select,
		body:has(.draft-view:not(.is-hidden)) .draft-player-button { border-radius: 8px; }
		body:has(.draft-view:not(.is-hidden)) .mobile-draft-board { overflow: hidden; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu { position: relative; display: block; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu summary { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; font-size: 1.35rem; line-height: 1; list-style: none; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu summary::-webkit-details-marker { display: none; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu summary { font-size: 0; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu summary::before { content: "\22ee"; font-size: 1.45rem; line-height: 1; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] summary { border-color: var(--accent, #c56a2d); color: var(--accent, #c56a2d); }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open]::before { content: ""; position: fixed; top: 4.7rem; right: 1rem; z-index: 5; width: min(14rem, calc(100vw - 2rem)); height: 5.6rem; border: 1px solid var(--line); background: var(--surface); box-shadow: 0 8px 20px rgb(15 20 18 / .14); }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] > button { position: fixed; right: 1rem; z-index: 6; width: min(14rem, calc(100vw - 2rem)); min-width: 0; height: 2.8rem; margin: 0; padding: .55rem .75rem; border: 0; border-bottom: 1px solid var(--line); background: var(--surface); color: var(--ink); text-align: left; font: .7rem 'DM Mono', monospace; text-transform: uppercase; appearance: none; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] > button:first-of-type { top: 4.7rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open]:has(.member-autopick-controls:not(.is-hidden))::before { height: 12rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .member-autopick-controls { position: fixed; top: 7.5rem; right: 1rem; z-index: 6; width: min(14rem, calc(100vw - 2rem)); box-sizing: border-box; margin: 0; padding: .7rem .75rem; border: 0; background: var(--surface); }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .member-autopick-controls > p { margin: 0; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .member-autopick-controls > p + p { margin-top: .3rem; font-size: .68rem; line-height: 1.3; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .draft-member-autopick-row { margin-top: .55rem; padding-top: .45rem; gap: .5rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .draft-member-autopick-row > span { font-size: .62rem; }
		body:has(.draft-view:not(.is-hidden)) .draft-action-menu[open] .member-autopick-button { padding: .35rem .45rem; font-size: .58rem; }
		.result-tabs { position: fixed; right: 0; bottom: 0; left: 0; z-index: 10; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: 0 -8px 24px rgb(15 20 18 / .08); backdrop-filter: blur(12px); }
		.result-tabs button { min-height: 2.5rem; border: 0; background: transparent; color: var(--muted); padding: .35rem .2rem; font: .58rem 'DM Mono', monospace; text-transform: uppercase; }
		.result-tabs button.is-selected { background: var(--ink); color: var(--surface); }
		#completed-report[data-result-view="my-roster"] .grade-layout,
		#completed-report[data-result-view="league"] .grade-layout,
		#completed-report[data-result-view="board"] .grade-layout,
		#completed-report[data-result-view="my-roster"] .method-note,
		#completed-report[data-result-view="league"] .method-note,
		#completed-report[data-result-view="board"] .method-note { display: none; }
		#completed-report[data-result-view="my-roster"] .final-ranking,
		#completed-report[data-result-view="league"] .final-ranking,
		#completed-report[data-result-view="board"] .final-ranking { display: none; }
		#completed-report[data-result-view="overview"] .final-team-roster:not(.is-user),
		#completed-report[data-result-view="my-roster"] .final-team-roster:not(.is-user),
		#completed-report[data-result-view="league"] .final-team-roster.is-user,
		#completed-report[data-result-view="overview"] .completed-board-heading,
		#completed-report[data-result-view="overview"] .completed-board-scroll,
		#completed-report[data-result-view="my-roster"] .completed-board-heading,
		#completed-report[data-result-view="my-roster"] .completed-board-scroll,
		#completed-report[data-result-view="league"] .completed-board-heading,
		#completed-report[data-result-view="league"] .completed-board-scroll { display: none; }
		#completed-report[data-result-view="board"] .completed-team-grid { display: none; }
		#completed-report[data-result-view="board"] .result-mobile-board { display: block; }
		#completed-report[data-result-view="board"] .completed-board-scroll { display: none; }
		#completed-report[data-result-view="league"] details.final-team-roster > summary { cursor: pointer; list-style: none; }
		#completed-report[data-result-view="league"] details.final-team-roster > summary::-webkit-details-marker { display: none; }
		#completed-report[data-result-view="league"] details.final-team-roster > summary::after { content: "+"; float: right; color: var(--accent, #c56a2d); font: 1.1rem 'DM Mono', monospace; }
		#completed-report[data-result-view="league"] details.final-team-roster[open] > summary::after { content: "-"; }
		.completed-team-grid { grid-template-columns: 1fr; }
		.final-roster-list .roster-slot { padding: .55rem .75rem; }
		.final-roster-list .roster-group { gap: .35rem; }
		.final-roster-list .roster-slot-player > small { flex-basis: 3.5rem; }
		.completed-board { min-width: 520px; }
		.mobile-board-nav { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) 2.5rem; align-items: center; gap: .5rem; padding: .75rem; border-bottom: 1px solid var(--line); background: var(--ink); color: var(--surface); }
		.mobile-board-nav { position: relative; }
		.mobile-board-nav button { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 1px solid rgb(255 255 255 / .3); background: transparent; color: inherit; font-size: 1.1rem; cursor: pointer; }
		.mobile-board-nav button:disabled { opacity: .35; cursor: default; }
		.mobile-board-nav div { display: grid; gap: .12rem; text-align: center; }
		.mobile-board-nav span, .mobile-board-nav small { color: rgb(255 255 255 / .65); font: .58rem 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .05em; }
		.mobile-board-nav strong { font: 600 1rem 'Space Grotesk', sans-serif; }
		.mobile-pick-row { display: grid; grid-template-columns: 48px 34px minmax(0, 1fr) 28px; gap: .5rem; align-items: center; min-height: 48px; padding: .55rem .65rem; border-bottom: 1px solid var(--line); }
		.mobile-pick-row:last-child { border-bottom: 0; }
		.mobile-pick-row small, .mobile-pick-row strong { font: .62rem 'DM Mono', monospace; text-transform: uppercase; }
		.mobile-pick-row small { color: var(--muted); }
		.mobile-pick-row strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
		.mobile-pick-row span { min-width: 0; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
		.mobile-pick-row em { color: var(--muted); font: normal .58rem 'DM Mono', monospace; text-transform: uppercase; }
		.mobile-pick-row > span { grid-column: 3; }
		.mobile-pick-row > em { grid-column: 4; }
		.player-dialog { width: 100%; max-width: none; height: min(82dvh, 720px); max-height: min(82dvh, 720px); margin: auto 0 0; padding: .5rem; border-right: 0; border-bottom: 0; border-left: 0; border-radius: 1rem 1rem 0 0; }
		.draft-layout[data-mobile-view="players"] .available-card { padding-top: .75rem; }
		.draft-layout[data-mobile-view="players"] .player-filters { position: sticky; top: 10rem; z-index: 4; margin: .25rem -.75rem .75rem; padding: .65rem .75rem; background: var(--surface); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
		.draft-layout[data-mobile-view="players"] .available-list { max-height: none; overflow: visible; }
		.draft-layout[data-mobile-view="players"] .available-player { grid-template-columns: 64px minmax(0, 1fr) auto; min-height: 92px; box-sizing: border-box; gap: .75rem; padding: .75rem 0; }
		.draft-layout[data-mobile-view="players"] .available-player img { width: 64px; height: 64px; }
		.draft-layout[data-mobile-view="players"] .available-player strong { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
		.draft-layout[data-mobile-view="players"] .available-player span { margin-top: .2rem; font-size: .72rem; }
		.draft-layout[data-mobile-view="players"] .draft-player-button { align-self: stretch; min-width: 4.5rem; padding-inline: .7rem; }
	}
.draft-heading-actions { display: flex; align-items: center; gap: 1rem; }
@media (max-width: 480px) { .draft-heading-actions { width: 100%; justify-content: space-between; flex-wrap: wrap; } }
@media (min-width: 801px) {
	.draft-action-menu { position: relative; display: block; }
	.draft-action-menu .member-autopick-controls { position: absolute; top: calc(100% + 1rem); right: 0; z-index: 6; width: 280px; box-sizing: border-box; }
}

.pick-cell.position-qb, .completed-board tbody tr.position-qb > *, .mobile-pick-row.position-qb { background: #a8c9a1 !important; }
.pick-cell.position-rb, .completed-board tbody tr.position-rb > *, .mobile-pick-row.position-rb { background: #d98c8c !important; }
.pick-cell.position-wr, .completed-board tbody tr.position-wr > *, .mobile-pick-row.position-wr { background: #9bbfe3 !important; }
.pick-cell.position-te, .completed-board tbody tr.position-te > *, .mobile-pick-row.position-te { background: #e3c66b !important; }
.pick-cell.position-k, .completed-board tbody tr.position-k > *, .mobile-pick-row.position-k { background: #c1a7d9 !important; }
.pick-cell.position-dst, .completed-board tbody tr.position-dst > *, .mobile-pick-row.position-dst { background: #b7b9b5 !important; }
.roster-slot.is-recent-pick, .mobile-pick-row.is-recent-pick, .pick-cell.is-recent-pick { animation: recent-pick-flash 1.2s ease-out; }
@keyframes recent-pick-flash { 0%, 35% { background-color: color-mix(in srgb, var(--accent, #c56a2d) 32%, var(--surface)); } 100% { background-color: transparent; } }

@media (min-width: 801px) {
	.draft-layout { grid-template-rows: auto auto; }
	.draft-layout > .draft-board-wrap { grid-column: 1 / -1; grid-row: 1; overflow: hidden; }
	.draft-sidebar { grid-column: 1; grid-row: 2; }
	.available-card { grid-column: 2; grid-row: 2; }
	.draft-board-wrap { overflow: hidden; }
	.draft-board { width: 100%; min-width: 0; grid-template-columns: repeat(var(--team-count), minmax(0, 1fr)); grid-template-rows: auto; grid-auto-rows: 72px; }
	.pick-cell { display: block; overflow: hidden; padding: .4rem; }
	.pick-cell .pick-player-image { width: 2rem; height: 2rem; }
	.pick-cell .pick-player { position: absolute; top: .4rem; right: .4rem; left: .4rem; padding-right: 1.9rem; font-size: .64rem; line-height: 1.05; white-space: normal; }
	.pick-cell .pick-cell-meta { position: absolute; right: .4rem; bottom: .4rem; left: .4rem; display: flex; align-items: center; gap: .3rem; padding-right: 1.8rem; font-size: .55rem; }
	.pick-cell .pick-cell-meta small { display: inline; }
	.pick-cell .pick-cell-meta em { display: inline-flex; align-items: center; gap: .2rem; }
	.pick-cell .pick-position-dot { width: .32rem; height: .32rem; border-radius: 50%; background: currentColor; }
	.pick-cell.empty small { position: absolute; bottom: .4rem; left: .4rem; }
}

@media (max-width: 800px) {
	body:has(.draft-view:not(.is-hidden)) { --draft-mobile-header-height: 6rem; }
	body:has(.draft-view:not(.is-hidden)) .draft-layout { position: relative; min-height: calc(100dvh - var(--draft-mobile-header-height)); margin-top: 0; }
	body:has(.draft-view:not(.is-hidden)) .draft-board-wrap { position: fixed; inset: var(--draft-mobile-header-height) 0 0; z-index: 1; overflow: auto; padding-bottom: 0; background: var(--surface); }
	body:has(.draft-view:not(.is-hidden)) .draft-layout .draft-board { display: grid; width: max(100%, calc(var(--team-count) * 7rem)); min-width: 0; }
	body:has(.draft-view:not(.is-hidden)) .mobile-draft-board { display: none !important; }
	body:has(.draft-view:not(.is-hidden)) .draft-board-wrap::after { content: none; display: none; }
	body:has(.draft-view:not(.is-hidden)) .draft-board { width: var(--draft-board-width); min-width: var(--draft-board-width); grid-template-columns: repeat(var(--team-count), 7rem); gap: .35rem; padding: .35rem; border: 0; background: transparent; box-sizing: border-box; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .team-heading,
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-cell { border: 1px solid var(--line); border-radius: 8px; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-cell { position: relative; display: block; overflow: hidden; padding: .2rem .45rem .45rem; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-player { position: absolute; top: .2rem; right: .45rem; left: .45rem; display: block; padding-right: 2.75rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-first-name,
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-last-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-cell-meta { position: absolute; right: .45rem; bottom: .4rem; left: .45rem; display: flex; align-items: center; gap: .3rem; padding-right: 2.2rem; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-cell-meta small { display: inline; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-cell-meta em { display: inline-flex; align-items: center; gap: .2rem; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-position-dot { width: .32rem; height: .32rem; border-radius: 50%; background: currentColor; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .pick-player-image { position: absolute; right: .25rem; bottom: .2rem; width: 2.75rem; height: 2.75rem; object-fit: contain; border-radius: 50%; }
	body:has(.draft-view:not(.is-hidden)) .draft-board .team-heading { border-bottom: 1px solid var(--line); }
	body:has(.draft-view:not(.is-hidden)) .mobile-tabs { position: sticky; top: -.75rem; z-index: 11; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; height: auto; margin: -.5rem -1rem .35rem; padding: .5rem .75rem; border-bottom: 1px solid var(--line); background: var(--surface); box-shadow: 0 8px 20px rgb(15 20 18 / .08); backdrop-filter: blur(12px); }
	body:has(.draft-view:not(.is-hidden)) .mobile-tabs button { min-height: 2.25rem; border: 0; border-radius: 6px; background: transparent; color: var(--muted); padding: .25rem .2rem; font: .62rem 'DM Mono', monospace; text-transform: uppercase; }
	body:has(.draft-view:not(.is-hidden)) .mobile-tabs button.is-selected { background: var(--ink); color: var(--surface); }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .card-heading .chart-overline,
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .card-heading h3 { display: none; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .card-heading { display: none; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .sort-status { display: none; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-filters { gap: .3rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-filters { position: sticky; top: 2.6rem; z-index: 12; margin: 0 -.75rem .35rem; padding: .25rem .75rem; background: var(--surface); backdrop-filter: blur(12px); }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .position-filter-buttons { flex-wrap: nowrap; gap: .2rem; overflow-x: auto; scrollbar-width: none; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .position-filter-buttons::-webkit-scrollbar { display: none; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .position-filter-button { flex: 0 0 2.35rem; width: 2.35rem; height: 2.35rem; padding: .1rem; border-width: 1px; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .position-filter-button strong { font-size: .52rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .position-filter-button span { font-size: .48rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-search-toggle { width: 2.35rem; min-width: 2.35rem; height: 2.35rem; padding: .25rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card { position: fixed; top: calc(40dvh + 3.6rem); right: 0; bottom: 0; left: 0; z-index: 10; display: block !important; height: calc(60dvh - 3.6rem); max-height: none; margin: 0; overflow: auto; padding: 0 1rem calc(4.5rem + env(safe-area-inset-bottom)); border: 1px solid var(--line); border-bottom: 0; border-radius: 14px 14px 0 0; box-shadow: 0 -10px 30px rgb(15 20 18 / .14); transform: none; transition: top .22s ease, height .22s ease; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card[data-mobile-active="false"] { display: none !important; }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="half"] .draft-board-wrap { bottom: calc(60dvh - 3.6rem); }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="collapsed"] .draft-board-wrap { bottom: 4.35rem; }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="expanded"] .draft-board-wrap { bottom: calc(100dvh - var(--draft-mobile-header-height)); }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="collapsed"] .mobile-sheet-card { top: calc(100dvh - 4.35rem); }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="expanded"] .mobile-sheet-card { top: var(--draft-mobile-header-height); height: calc(100dvh - var(--draft-mobile-header-height)); }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-sheet-state="collapsed"] .mobile-sheet-card { height: 4.35rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card.is-dragging { transition: none; will-change: top, height; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-handle { position: sticky; top: 0; z-index: 6; display: block; width: 100%; height: 2.1rem; min-height: 2.1rem; margin: 0 auto .15rem; padding: 0; border: 0; border-radius: 0; background: transparent; opacity: 1; cursor: grab; touch-action: none; }
		body:has(.draft-view:not(.is-hidden)) .mobile-sheet-handle::after { content: ""; display: block; width: 3rem; height: .3rem; margin: auto; border-radius: 999px; background: var(--muted); opacity: .55; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-handle:active { cursor: grabbing; }
	body:has(.draft-view:not(.is-hidden)) .mobile-board-live { border: 0; background: transparent; color: var(--accent, #c56a2d); padding: 0; font: .58rem 'DM Mono', monospace; text-transform: uppercase; cursor: pointer; }
	body:has(.draft-view:not(.is-hidden)) .draft-layout[data-mobile-view="players"] .available-list { max-height: none; overflow: visible; }
		body:has(.draft-view:not(.is-hidden)) .draft-board .pick-player { padding-right: 0; }
	}

	@media (max-width: 800px) {
		body:has(#completed-report) { overflow-x: hidden; overflow-y: auto; }
		body:has(#completed-report) .friends-page,
		body:has(#completed-report) .friends-section { height: auto; overflow: visible; }
		body:has(#completed-report) .draft-view { min-height: 0; padding-top: 0; }
	}
.pick-cell.position-rb,
.pick-cell.position-wr,
.pick-cell.position-qb,
.pick-cell.position-te,
.pick-cell.position-k,
.pick-cell.position-dst,
.completed-board tbody tr.position-rb > *,
.completed-board tbody tr.position-wr > *,
.completed-board tbody tr.position-qb > *,
.completed-board tbody tr.position-te > *,
.completed-board tbody tr.position-k > *,
.completed-board tbody tr.position-dst > *,
.mobile-pick-row.position-rb,
.mobile-pick-row.position-wr,
.mobile-pick-row.position-qb,
.mobile-pick-row.position-te,
.mobile-pick-row.position-k,
.mobile-pick-row.position-dst {
	color: #111 !important;
}
@media (max-width: 800px) {
	.mobile-pick-row,
	.mobile-pick-row.position-qb,
	.mobile-pick-row.position-rb,
	.mobile-pick-row.position-wr,
	.mobile-pick-row.position-te,
	.mobile-pick-row.position-k,
	.mobile-pick-row.position-dst { position: relative; display: block; min-height: 76px; padding: 0; overflow: hidden; background: #050505 !important; }
	.mobile-pick-pill { display: grid; grid-template-columns: 64px minmax(0, 1fr); column-gap: .4rem; align-items: center; min-height: 76px; margin: 8px 8px 8px 16px; padding: .35rem .7rem .35rem .4rem; border-radius: 6px; color: #111; box-sizing: border-box; }
	.mobile-pick-image { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: center top; }
	.mobile-pick-meta { display: grid; grid-column: 2; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-rows: auto auto; column-gap: .25rem; align-items: center; min-width: 0; }
	.mobile-pick-meta small, .mobile-pick-meta strong, .mobile-pick-meta em { min-width: 0; overflow: hidden; font: .62rem 'DM Mono', monospace; text-transform: uppercase; white-space: nowrap; text-overflow: ellipsis; }
	.mobile-pick-meta small { grid-column: 2; grid-row: 1; }
	.mobile-pick-meta strong { grid-column: 2 / -1; grid-row: 2; text-align: right; }
	.mobile-pick-meta em { grid-column: 3; grid-row: 1; font-style: normal; }
	.mobile-pick-meta em::before { content: '•'; margin-right: .25rem; }
	.mobile-pick-meta span { grid-column: 1; grid-row: 1 / -1; min-width: 0; overflow: hidden; text-align: left; font: 600 .92rem 'Space Grotesk', sans-serif; white-space: nowrap; text-overflow: ellipsis; }
	.mobile-pick-row.position-qb .mobile-pick-pill { background: #a8c9a1; }
	.mobile-pick-row.position-rb .mobile-pick-pill { background: #d98c8c; }
	.mobile-pick-row.position-wr .mobile-pick-pill { background: #9bbfe3; }
	.mobile-pick-row.position-te .mobile-pick-pill { background: #e3c66b; }
	.mobile-pick-row.position-k .mobile-pick-pill { background: #c1a7d9; }
	.mobile-pick-row.position-dst .mobile-pick-pill { background: #b7b9b5; }
	.mobile-pick-row.empty .mobile-pick-pill { background: #d6d2c8; color: #4f4b43; }
}

/* Final mobile draft controls */
.available-player-summary { color: var(--muted) !important; }
.available-player-summary-value { display: inline !important; color: var(--accent) !important; }
.player-context-ranks { display: grid; gap: .1rem; }
.player-context-history, .player-context-current { display: block; white-space: nowrap; }
.player-context-availability { display: block; margin-top: .15rem; color: var(--muted); }
.player-context-availability.availability-probably-available { color: #176238; }
.player-context-availability.availability-maybe { color: #8a6500; }
.player-context-availability.availability-probably-taken { color: #b42318; }
.draft-player-button { border-color: #06452a !important; background: #06452a !important; }
.draft-player-button:hover { border-color: #0c5b38 !important; background: #0c5b38 !important; }
.draft-player-button:disabled { border-color: #06452a !important; background: #06452a !important; color: #fff !important; opacity: 1 !important; }
@media (max-width: 800px) {
	.mobile-tabs button.is-selected { background: var(--accent) !important; color: #fff !important; }
	.draft-layout[data-mobile-view="roster"] .roster-slot-player { gap: 0 !important; }
	.draft-layout[data-mobile-view="roster"] .roster-slot-position { flex: 0 0 2.5rem !important; width: 2.5rem; margin-right: 0; white-space: nowrap; }
	.draft-layout[data-mobile-view="roster"] .roster-player-image { margin-right: 0 !important; }
}
.pick-cell.position-dst strong,
.pick-cell.position-rb .pick-player,
.pick-cell.position-wr .pick-player,
.pick-cell.position-qb .pick-player,
.pick-cell.position-te .pick-player,
.pick-cell.position-k .pick-player,
.pick-cell.position-dst .pick-player,
.mobile-pick-row.position-rb strong,
.mobile-pick-row.position-wr strong,
.mobile-pick-row.position-qb strong,
.mobile-pick-row.position-te strong,
.mobile-pick-row.position-k strong,
.mobile-pick-row.position-dst strong,
.mobile-pick-row.position-rb span,
.mobile-pick-row.position-wr span,
.mobile-pick-row.position-qb span,
.mobile-pick-row.position-te span,
.mobile-pick-row.position-k span,
.mobile-pick-row.position-dst span,
.completed-board tbody tr.position-rb > *,
.completed-board tbody tr.position-wr > *,
.completed-board tbody tr.position-qb > *,
.completed-board tbody tr.position-te > *,
.completed-board tbody tr.position-k > *,
.completed-board tbody tr.position-dst > * {
	color: #111 !important;
}
.pick-cell.position-rb small,
.pick-cell.position-wr small,
.pick-cell.position-qb small,
.pick-cell.position-te small,
.pick-cell.position-k small,
.pick-cell.position-dst small,
.pick-cell.position-rb em,
.pick-cell.position-wr em,
.pick-cell.position-qb em,
.pick-cell.position-te em,
.pick-cell.position-k em,
.pick-cell.position-dst em,
.mobile-pick-row.position-rb small,
.mobile-pick-row.position-wr small,
.mobile-pick-row.position-qb small,
.mobile-pick-row.position-te small,
.mobile-pick-row.position-k small,
.mobile-pick-row.position-dst small,
.mobile-pick-row.position-rb em,
.mobile-pick-row.position-wr em,
.mobile-pick-row.position-qb em,
.mobile-pick-row.position-te em,
.mobile-pick-row.position-k em,
.mobile-pick-row.position-dst em {
	color: #111 !important;
}
.roster-player-name .roster-bye { display: block; white-space: nowrap; }
.available-player-bye.bye-warning-red { color: #b42318 !important; font-weight: 700; }
.available-player-bye.bye-warning-yellow { color: #8a6500 !important; font-weight: 700; }

.recommendations-list { display: grid; gap: .35rem; }
.recommendation-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: .65rem; align-items: center; min-height: 4.35rem; padding: .55rem 0; border-bottom: 1px solid var(--line); }
.recommendation-row > img { width: 48px; height: 48px; object-fit: contain; border-radius: 50%; }
.recommendation-copy { display: grid; grid-template-columns: minmax(0, 1fr); gap: .12rem; min-width: 0; overflow: hidden; }
.recommendation-type { color: var(--accent); font: .56rem 'DM Mono', monospace; letter-spacing: .04em; text-transform: uppercase; }
.recommendation-player-trigger { display: grid; gap: .1rem; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.recommendation-player-trigger strong { overflow: hidden; font: 600 .9rem 'Space Grotesk', sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-player-trigger span { overflow: hidden; color: var(--muted); font: .64rem 'DM Mono', monospace; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-player-trigger:hover strong { color: var(--accent); }
.recommendation-detail { color: var(--muted); font: .58rem 'DM Mono', monospace; white-space: nowrap; }
.recommendation-context { display: block; color: var(--muted); font: .58rem 'DM Mono', monospace; line-height: 1.35; white-space: normal; }
.recommendation-row.is-empty { grid-template-columns: minmax(0, 1fr); }
.recommendation-row.is-empty strong { font: 600 .84rem 'Space Grotesk', sans-serif; }
@media (min-width: 801px) {
	.draft-layout { grid-template-rows: auto auto auto; }
	.draft-layout > .draft-board-wrap { grid-column: 1 / -1; grid-row: 1; overflow: hidden; }
	.draft-sidebar { grid-column: 1; grid-row: 2 / 4; }
	.recommendations-card { grid-column: 2; grid-row: 2; }
	.available-card { grid-column: 2; grid-row: 3; }
	.recommendations-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem; }
	.recommendation-row { min-width: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: .25rem .65rem; }
	.recommendation-row:nth-child(even) { border-right: 0; }
	.recommendation-row:nth-child(n + 3) { border-bottom: 0; }
}
@media (max-width: 800px) {
	body:has(.draft-view:not(.is-hidden)) .recommendation-row { grid-template-columns: 64px minmax(0, 1fr) auto; gap: .75rem; min-height: 94px; box-sizing: border-box; padding: .75rem 0; }
	body:has(.draft-view:not(.is-hidden)) .recommendation-row > img { width: 64px; height: 64px; }
	body:has(.draft-view:not(.is-hidden)) .recommendation-player-trigger strong { font-size: .95rem; }
	body:has(.draft-view:not(.is-hidden)) .recommendation-player-trigger span { margin-top: .2rem; font-size: .72rem; }
	body:has(.draft-view:not(.is-hidden)) .recommendation-detail { display: none; }
	body:has(.draft-view:not(.is-hidden)) .recommendation-row .draft-player-button { align-self: stretch; min-width: 4.5rem; padding-inline: .7rem; }
}

/* Keep search separate from the position filters at every viewport width. */
.player-filters { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; }
.player-filters .player-search-toggle { grid-column: 1; grid-row: 1; display: inline-grid; place-items: center; width: auto; min-width: 4.5rem; height: 2.75rem; padding: .55rem .75rem; font: 500 .68rem 'DM Mono', monospace; letter-spacing: .03em; text-transform: uppercase; }
.player-filters .position-filter-buttons { grid-column: 2; grid-row: 1; min-width: 0; }
.player-filters input { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.player-filters.search-open { grid-template-columns: minmax(0, 1fr); }
.player-filters.search-open .player-search-toggle { display: none; }
.player-filters.search-open .position-filter-buttons { grid-column: 1; grid-row: 2; }
.player-filters.search-open input { grid-column: 1; grid-row: 1; }
@media (max-width: 800px) {
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-search-toggle { width: auto; min-width: 4.25rem; height: 2.35rem; padding: .25rem .5rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-filters { grid-template-columns: auto minmax(0, 1fr); gap: .35rem; }
	body:has(.draft-view:not(.is-hidden)) .mobile-sheet-card .player-filters.search-open { grid-template-columns: minmax(0, 1fr); }
}