.builder-workspace { margin-top: 12px; }
.matchweek-club { display: flex; align-items: center; gap: 10px; }
.matchweek-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; align-items: start; }
.matchweek-fixtures, .matchweek-standings { min-width: 0; }
.matchweek-standings { padding: 0; overflow: hidden; border: 1px solid var(--line); border-top: 3px solid #8b5ad3; border-radius: 8px; }
/* The table is the panel: only the heading and note keep side padding, the
   rows run edge to edge like the home page's standings panel. */
.matchweek-standings > .builder-heading { margin: 0; padding: 18px 16px 6px; }
.matchweek-standings > label { margin: 0 16px 8px; }
.matchweek-standings > .message { padding: 0 16px 12px; }
.matchweek-standings table { margin: 0; }
.matchweek-standings :is(th, td):first-child { padding-left: 16px !important; }
.matchweek-standings :is(th, td):last-child { padding-right: 16px !important; }
.matchweek-standings table { width: 100%; white-space: normal; }
.matchweek-standings th, .matchweek-standings td { padding: 10px 4px; }
.matchweek-standings .standing-club { min-width: 0; overflow-wrap: anywhere; }
.matchweek-fixtures .table-container { max-height: none; }
.matchweek-fixtures th, .matchweek-fixtures td { padding: 12px 10px; }
/* The week's fixtures sit in a panel built like Puan Durumu beside it: accent
   rule on top, heading inside, table edge to edge with 16px outer cells. */
.matchweek-fixtures-panel { overflow: hidden; border: 1px solid var(--line); border-top: 3px solid #8b5ad3; border-radius: 8px; }
.matchweek-fixtures-panel > .builder-heading { margin: 0; padding: 18px 16px 6px; }
.matchweek-fixtures-panel > .message { padding: 0 16px 12px; }
.matchweek-fixtures-panel > .table-container { border: 0; }
.matchweek-fixtures-panel > .table-container > table > :is(thead, tbody) > tr > :is(th, td):not(.matchweek-details-cell, .no-results) { padding-right: 8px; padding-left: 8px; }
.matchweek-fixtures-panel > .table-container > table > :is(thead, tbody) > tr > :is(th, td):first-child:not(.matchweek-details-cell, .no-results) { padding-left: 16px; }
.matchweek-fixtures-panel > .table-container > table > :is(thead, tbody) > tr > :is(th, td):last-child:not(.matchweek-details-cell, .no-results) { padding-right: 16px; }
/* The date may break onto two lines ("10 Eki" / "Cumartesi") so the away club
   stays in view beside the standings column. */
.matchweek-fixtures tbody td:first-child { white-space: normal; }
.matchweek-club a { white-space: normal; }
.matchweek-odds { display: flex; flex: none; gap: 4px; }
.matchweek-select { padding: 0; border: 0; background: transparent; color: inherit; }
.matchweek-result { box-sizing: border-box; display: grid; place-content: center; justify-items: center; gap: 1px; width: 182px; height: 44px; padding: 0 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-raised, #f4eef9); }
.matchweek-result strong { font-size: 17px; line-height: 1.15; font-variant-numeric: tabular-nums; white-space: nowrap; }
.matchweek-result small { color: var(--muted); font-size: 10px; }
.matchweek-result-players { margin-top: 24px; }
.matchweek-result-players h3 { font-size: 15px; }
.matchweek-result-events { margin: 24px 0; }
.matchweek-analysis .matchweek-result-events { margin: 12px 0 0; }
.matchweek-analysis .matchweek-result-players { margin-top: 0; }
.matchweek-analysis .matchweek-analysis-grid > * { min-width: 0; margin-top: 0; }
.matchweek-result-events h3 { font-size: 15px; }
.matchweek-result-players .matchweek-comparison th:first-child, .matchweek-result-players .matchweek-comparison td:first-child { width: 72%; text-align: left; }
@media (max-width: 540px) { .matchweek-matchup .matchweek-result { min-width: 90px; padding: 9px; } }
.matchweek-selectable { cursor: pointer; }
.matchweek-selected > td { box-shadow: inset 0 2px #9060d5, inset 0 -2px #9060d5; }
.matchweek-analysis { margin: 0; padding: 14px 16px 12px; border-left: 3px solid #9060d5; background: var(--surface-raised, #f7f2fc); white-space: normal; cursor: default; }
.matchweek-analysis > h2 { margin: 0 0 10px; font-size: 13px; }
.matchweek-fixtures .matchweek-details-cell { padding: 0; }
.matchweek-analysis-grid { display: grid; grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.5fr); gap: 20px; align-items: start; }
.matchweek-analysis-extra { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 12px; }
.matchweek-analysis-extra > * { margin-top: 0; min-width: 0; }
/* Upcoming match: XI vs XI and season statistics across the full width, last
   five beside a chart slot, then fantasy totals and each club's best players.
   The cards follow the panel's own width, not the window's. */
.matchweek-analysis { container-type: inline-size; }
/* Fallbacks only: the page sets both to the clubs' colours (core/team-colors.js). */
.matchweek-preview { --matchweek-home: #9a6be3; --matchweek-away: #14a38c; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
.matchweek-card { box-sizing: border-box; min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-bg, var(--surface)); }
.matchweek-card > h3 { margin: 0 0 10px; font-size: 13px; }
.matchweek-preview-xi, .matchweek-preview-stats { grid-column: 1 / -1; }
.matchweek-preview-form, .matchweek-preview-graph { grid-column: span 3; }
.matchweek-preview-fantasy, .matchweek-preview-players { grid-column: span 2; }
@container (max-width: 560px) {
  .matchweek-preview-form, .matchweek-preview-graph, .matchweek-preview-fantasy { grid-column: 1 / -1; }
  .matchweek-preview-players { grid-column: span 3; }
}
@container (max-width: 380px) { .matchweek-preview > * { grid-column: 1 / -1; } }
.matchweek-preview .club-logo { width: 20px; height: 20px; flex: 0 0 20px; }
.matchweek-preview .club-logo img { width: 18px; height: 18px; }
.matchweek-card-club { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; font-size: 12px; }
.matchweek-card-club > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.matchweek-card-subtitle { margin: 4px 0 8px; color: var(--muted); font-size: 10px; }
/* Side-by-side rows: home value, label, away value, then a bar splitting the two. */
.matchweek-versus-head, .matchweek-versus-row { display: grid; grid-template-columns: minmax(44px, 1fr) minmax(0, 2fr) minmax(44px, 1fr); align-items: center; column-gap: 8px; }
.matchweek-versus-head { margin-bottom: 4px; color: var(--muted); font-size: 10px; font-weight: 700; }
.matchweek-versus-club { display: flex; align-items: center; gap: 4px; min-width: 0; }
.matchweek-versus-head > .matchweek-versus-club:last-child { justify-content: flex-end; }
.matchweek-versus-row { padding: 7px 0; border-top: 1px solid var(--line); }
.matchweek-versus-label { color: var(--muted); font-size: 11px; text-align: center; }
.matchweek-versus-value { display: grid; line-height: 1.15; }
.matchweek-versus-value strong { font-size: 17px; font-variant-numeric: tabular-nums; }
.matchweek-versus-value small { color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.matchweek-versus-home { justify-items: start; }
.matchweek-versus-away { justify-items: end; text-align: right; }
.matchweek-versus-bar { grid-column: 1 / -1; display: flex; gap: 2px; height: 4px; margin-top: 6px; }
.matchweek-versus-bar > span { flex: 1 1 0; min-width: 2px; border-radius: 2px; }
.matchweek-versus-bar-home { background: var(--matchweek-home); }
.matchweek-versus-bar-away { background: var(--matchweek-away); }
.matchweek-preview-fantasy .matchweek-versus-row { padding: 5px 0; }
.matchweek-preview-fantasy .matchweek-versus-value strong { font-size: 13px; }
.matchweek-preview-fantasy .matchweek-versus-label { font-size: 10px; }
/* Last five: one column per club. */
.matchweek-form-teams { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.matchweek-form-list { display: grid; gap: 4px; margin: 8px 0 0; padding: 0; list-style: none; }
.matchweek-form-list li { display: grid; grid-template-columns: 20px 20px minmax(0, 1fr) auto auto; align-items: center; gap: 5px; font-size: 11px; }
.matchweek-form-result { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 4px; font-size: 10px; font-weight: 700; background: var(--line); color: var(--ink); }
.matchweek-form-opponent { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.matchweek-form-venue { color: var(--muted); font-size: 9px; }
.matchweek-form-score { font-variant-numeric: tabular-nums; }
.matchweek-form-summary { margin: 8px 0 0; color: var(--muted); font-size: 10px; }
/* Best players: name, position, expected points; any reported absence below. */
.matchweek-best-players { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.matchweek-best-players li { display: grid; grid-template-columns: minmax(0, 1fr) 40px 32px; align-items: baseline; gap: 6px; font-size: 11px; }
.matchweek-best-players .matchweek-best-head { color: var(--muted); font-size: 9px; }
.matchweek-best-players li > :not(:first-child) { text-align: right; }
.matchweek-best-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.matchweek-best-rating { color: var(--muted); font-variant-numeric: tabular-nums; }
.matchweek-best-players strong { font-variant-numeric: tabular-nums; }
/* Fantasy points per game: a points scale beside an SVG of fixed height, weeks along the bottom. */
.matchweek-trend-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 8px; color: var(--muted); font-size: 10px; }
.matchweek-trend-key { display: flex; align-items: center; gap: 5px; }
.matchweek-trend-swatch { width: 14px; height: 3px; border-radius: 2px; }
.matchweek-trend-swatch-home { background: var(--matchweek-home); }
.matchweek-trend-swatch-away { background: var(--matchweek-away); }
.matchweek-trend-plot { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 8px; }
.matchweek-trend-scale { position: relative; min-width: 18px; color: var(--muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.matchweek-trend-scale > span { position: absolute; right: 0; transform: translateY(-50%); line-height: 1; }
.matchweek-trend-axis-y { margin: 0 0 4px; color: var(--muted); font-size: 9px; }
.matchweek-trend-canvas { padding: 0 6px; }
.matchweek-trend-canvas svg { display: block; width: 100%; overflow: visible; }
.matchweek-trend-hit { fill: transparent; }
.matchweek-trend-hit:hover { fill: var(--surface-hover); }
.matchweek-trend-grid { stroke: var(--line); stroke-width: 1; }
.matchweek-trend-tick { fill: var(--muted); font-size: 9px; }
.matchweek-trend-line { stroke-width: 2; stroke-linecap: round; pointer-events: none; }
.matchweek-trend-line-home { stroke: var(--matchweek-home); }
.matchweek-trend-line-away { stroke: var(--matchweek-away); }
.matchweek-trend-dot { stroke: var(--panel-bg, var(--surface)); stroke-width: 2; pointer-events: none; }
.matchweek-trend-dot-home { fill: var(--matchweek-home); }
.matchweek-trend-dot-away { fill: var(--matchweek-away); }
.matchweek-trend-axis { margin: 4px 0 0; color: var(--muted); font-size: 9px; text-align: right; }
.matchweek-preview .matchweek-lineups { margin: 0; }
.matchweek-analysis .matchweek-lineups { margin: 0; }
/* Every eleven is drawn on a pitch of one fixed size, whatever the formation or
   the length of the names: the lines share the height, names never force it. */
.matchweek-analysis .matchweek-lineups { grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr); align-items: start; }
.matchweek-analysis .matchweek-mini-pitch { box-sizing: border-box; width: 100%; height: 480px; min-height: 0; padding: 12px 6px; gap: 0; overflow: hidden; }
.matchweek-analysis .matchweek-mini-line { flex: 1 1 0; min-height: 0; align-items: center; }
.matchweek-analysis .matchweek-mini-player { overflow-wrap: normal; word-break: normal; }
.matchweek-analysis .matchweek-mini-player { max-width: 92px; font-size: 9px; }
.matchweek-analysis .matchweek-mini-player .pitch-shirt { max-width: 54px; }
.matchweek-analysis .matchweek-comparison caption { padding: 2px 0 8px; font-size: 12px; }
.matchweek-analysis .matchweek-comparison th, .matchweek-analysis .matchweek-comparison td { padding: 3px 6px; font-size: 11px; line-height: 1.35; }
.matchweek-analysis .matchweek-comparison thead th:nth-child(2), .matchweek-analysis .matchweek-comparison tbody th { width: 46%; }
.matchweek-notes { margin-top: 10px; color: var(--muted); font-size: 11px; }
.matchweek-notes summary { cursor: pointer; font-weight: 600; }
.matchweek-notes p { margin: 6px 0 0; }
@media (max-width: 900px) { .matchweek-analysis-grid, .matchweek-analysis-extra { grid-template-columns: minmax(0, 1fr); } }
.matchweek-analysis-teams { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; }
.matchweek-matchup { display: flex; align-items: center; justify-content: center; gap: 20px; margin: 20px 0 8px; }
.matchweek-matchup .matchweek-club { min-width: 0; }
@media (max-width: 540px) { .matchweek-matchup { gap: 8px; }.matchweek-matchup .matchweek-club { flex-direction: column; text-align: center; font-size: 11px; }.matchweek-matchup .matchweek-odd { min-width: 40px; } }
.matchweek-lineups { display: grid; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr); gap: 8px; align-items: start; margin: 20px 0; }
.matchweek-last-xi { min-width: 0; }
.matchweek-last-xi h3 { margin: 0; font-size: 13px; }
.matchweek-versus { align-self: center; text-align: center; color: var(--muted); font-weight: 700; }
.matchweek-mini-pitch { min-height: 330px; display: flex; flex-direction: column; justify-content: space-around; gap: 14px; padding: 15px 4px; }
.matchweek-mini-line { display: flex; justify-content: space-evenly; gap: 2px; }
.matchweek-mini-player { flex: 1; min-width: 0; max-width: 68px; display: grid; justify-items: center; align-content: start; gap: 4px; text-align: center; font-size: 8px; line-height: 1.3; overflow-wrap: anywhere; }
.matchweek-mini-player .pitch-shirt { width: 100%; max-width: 44px; height: auto; }
/* Names on the small pitches follow the player box's size and wrapping. */
.matchweek-mini-player .pitch-player-name { font-size: inherit; line-height: inherit; overflow-wrap: inherit; }
.matchweek-mini-player svg { width: 100%; height: auto; }
.matchweek-comparison { width: 100%; table-layout: fixed; white-space: normal; }
.matchweek-comparison caption { text-align: left; padding: 12px 0; font-weight: 700; }
.matchweek-fantasy-comparison { margin-top: 20px; }
.matchweek-fantasy-coverage { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 400; }
.matchweek-comparison th, .matchweek-comparison td { text-align: center; position: static; padding: 12px 6px; overflow-wrap: anywhere; font-size: 12px; }
@media (max-width: 540px) { .matchweek-lineups { grid-template-columns: minmax(0, 1fr); }.matchweek-versus { padding: 8px; }.matchweek-mini-player { font-size: 10px; } }
.matchweek-analysis-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.matchweek-analysis-metrics > div { padding: 12px; border: 1px solid var(--line); border-radius: 6px; }
.matchweek-analysis-metrics dt { font-size: 11px; }
.matchweek-analysis-metrics dd { margin: 6px 0 0; font-size: 20px; font-weight: 700; }
@media (max-width: 480px) { .matchweek-analysis-metrics { grid-template-columns: minmax(0, 1fr); } }
.matchweek-odd { box-sizing: border-box; display: grid; place-content: center; gap: 2px; width: 58px; height: 44px; padding: 0; border-radius: 5px; text-align: center; background: var(--surface-raised); color: var(--ink); font-size: 10px; box-shadow: inset 0 -3px var(--odd-color, var(--line)); }
.matchweek-odd strong { font-size: 12px; font-variant-numeric: tabular-nums; }
.matchweek-odd-0 { --odd-color: var(--matchweek-home, var(--muted)); }
.matchweek-odd-1 { --odd-color: var(--muted); }
.matchweek-odd-2 { --odd-color: var(--matchweek-away, var(--muted)); }
/* Beside the standings the fixtures need ~640px, which main only gives from about
   1265px wide; narrower windows put the standings below the fixtures. */
@media (max-width: 1279px) { .matchweek-layout { grid-template-columns: minmax(0, 1fr); }.matchweek-standings { max-width: none; } }
#matchweek-workspace h2 { font-size: 20px; }
.builder-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.builder-heading h2 { font-size: 27px; }.builder-heading p:not(.eyebrow) { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.builder-toolbar { display: flex; align-items: end; gap: 12px; padding: 14px 16px; background: #ecf0e6; border: 1px solid var(--line); border-radius: 8px; }
.builder-toolbar label { display: grid; gap: 5px; min-width: 180px; color: var(--muted); font-size: 10px; font-weight: 600; }
.builder-message { min-height: 40px; padding: 11px 2px; margin: 0; color: var(--muted); font-size: 11px; }.builder-message.error { color: #a0372f; }
.builder-layout { display: grid; grid-template-columns: minmax(470px, 1.15fr) minmax(380px, .85fr); align-items: stretch; gap: 28px; }
.builder-pitch-panel, .builder-pool { min-width: 0; border: 1px solid var(--line); border-top: 3px solid #c86158; border-radius: 10px; background: white; overflow: hidden; }
.builder-pool { border-top-color: #5c71bb; display: flex; flex-direction: column; }
.builder-pitch-heading, .builder-pool-heading { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 20px 22px 14px; }
.builder-pitch-heading h3, .builder-pool-heading h3 { margin: 0; font-size: 20px; }.builder-pitch-heading .eyebrow, .builder-pool-heading .eyebrow { margin-bottom: 6px; font-size: 9px; }
.builder-pitch { min-height: 680px; margin: 0 20px 18px; }
.builder-slots { min-height: 760px; padding: 30px 12px; display: flex; flex-direction: column; justify-content: space-around; gap: 13px; }
.builder-line { min-width: 0; text-align: center; }
.builder-line-slots { display: flex; justify-content: space-evenly; align-items: start; gap: 7px; }
.builder-position { position: relative; flex: 1 1 0; min-width: 0; max-width: 112px; border: 1px dashed transparent; border-radius: 8px; }
.builder-position.active { border-color: #e7fa93; background: #123d30a8; box-shadow: 0 0 0 2px #e7fa9344; }
.builder-position-select { width: 100%; min-height: 112px; padding: 4px 2px; display: grid; justify-items: center; align-content: start; gap: 4px; border: 0; border-radius: 7px; background: transparent; color: white; }
.builder-position-select:focus-visible { outline-color: #f0ffae; }
.builder-drag-preview { position: fixed; top: 0; left: 0; z-index: 10000; width: 64px; background: transparent; pointer-events: none; }
.builder-empty-plus { width: 42px; height: 42px; display: grid; place-items: center; border: 1px dashed #d7ead777; border-radius: 50%; color: #d7ead7; font-size: 23px; }
.builder-remove { position: absolute; top: -9px; right: -4px; z-index: 2; width: 40px; height: 40px; padding: 0; border: 7px solid transparent; border-radius: 50%; color: #8d3d36; background: white; background-clip: padding-box; font-size: 16px; line-height: 1; }
.builder-remove:hover { background: #fae8e5; }
.builder-help, .builder-rating-note { margin: 0; padding: 0 22px 19px; color: var(--muted); font-size: 10px; line-height: 1.7; }
.builder-filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .65fr); gap: 10px; padding: 0 16px 14px; }
.builder-filters label { min-width: 0; display: grid; gap: 5px; color: var(--muted); font-size: 9px; font-weight: 600; }.builder-filters input, .builder-filters select { width: 100%; }
.builder-pool-heading { padding: 12px 16px 8px; }
.builder-pool-heading h3 { font-size: 17px; }
.builder-filters { gap: 6px 10px; padding: 0 16px 9px; align-items: center; }
.builder-filters input, .builder-filters select { min-height: 34px; padding: 6px 8px; font-size: 11px; }
.builder-role-filters { display: flex; gap: 3px; }
.builder-role-filters button { width: 32px; height: 32px; padding: 4px; border: 1px solid transparent; border-radius: 5px; background: transparent; }
.builder-role-filters img { width: 22px; height: 22px; display: block; }
.builder-role-filters button[aria-pressed="true"] { border-color: var(--accent); background: var(--line); }
.builder-table > thead > tr > th { padding-top: 8px; padding-bottom: 8px; }
.builder-opponent { display: inline-flex; align-items: center; gap: 7px; }
.builder-table-wrap { max-height: 650px; flex: 1; overflow: auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.builder-pool.has-recommendations > .builder-table-wrap { flex: 0 0 auto; height: 285px; max-height: 38vh; }
.builder-recommendations { border-top: 3px solid #7363c5; margin-top: 4px; }
.builder-recommendations .builder-pool-heading h3 { font-size: 15px; }
/* Risk selector sits beside the refresh button, pushed to the right of the title. */
.builder-recommendations .builder-pool-heading { gap: 8px; }
.builder-recommendations .builder-pool-heading h3 { margin-right: auto; }
.builder-risk select { font-size: 11px; padding: 4px 6px; }
.builder-recommendation-best { color: #2f6f3f; font-weight: 600; }
/* The light theme's green is too dark to read on a dark panel. */

.builder-recommendations-scroll { max-height: 330px; overflow: auto; }
.builder-recommendations table { width: 100%; white-space: normal; }
.builder-recommendations td, .builder-recommendations th { padding: 8px; font-size: 11px; }
.builder-recommendations .club-logo { width: 24px; height: 24px; flex-basis: 24px; }
.builder-recommendations .club-logo img { width: 22px; height: 22px; }
.builder-recommendation-role { display: block; color: var(--muted); font-size: 9px; margin-left: 34px; }
.builder-pool.has-recommendations > .builder-rating-note { padding: 7px 16px; font-size: 9px; }
#builder-fantasy-note:empty, #builder-recommendations-note:empty { display: none; }
.builder-pool > .builder-footnote, .builder-pool.has-recommendations > .builder-footnote { flex: none; padding: 8px 16px; border-top: 1px solid var(--line); font-size: 10px; }
/* Side by side, the pitch sets the row height and the pool fills it exactly:
   size containment keeps the long player list from stretching the row, the
   list takes all the free height, and it splits half and half with the
   recommendations once they appear. Stacked layouts keep their own heights. */
@media (min-width: 921px) {
  .builder-pool { contain: size; }
  .builder-table-wrap, .builder-pool.has-recommendations > .builder-table-wrap { flex: 1 1 0; min-height: 0; height: auto; max-height: none; }
  .builder-recommendations { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
  .builder-recommendations-scroll { flex: 1 1 0; min-height: 0; max-height: none; }
}
.builder-table { table-layout: fixed; }
.builder-table > thead > tr > th:first-child { width: 64px; }
.builder-table > thead > tr > th:nth-child(3) { width: 52px; }
.builder-table > thead > tr > th:nth-child(4) { width: 60px; }
.builder-pool-role { font-size: 11px; font-weight: 650; color: var(--muted); }
.builder-table > thead > tr > th:last-child { width: 80px; white-space: normal; }
.builder-table th { position: sticky; top: 0; z-index: 2; padding: 12px 14px; font-size: 10px; }.builder-table td { padding: 10px 14px; height: 56px; }
.builder-table .builder-club-cell { width: 76px; }.builder-table .club-logo { width: 30px; height: 30px; flex-basis: 30px; }.builder-table .club-logo img { width: 27px; height: 27px; }
.builder-player-cell { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.builder-player-name-row { display: flex; align-items: center; gap: 8px; }
.builder-player-button { min-height: 44px; min-width: 0; flex: 1; padding: 7px 0; border: 0; background: transparent; color: var(--ink); text-align: left; font-weight: 600; font-size: 12px; }
.builder-player-button:hover { color: #51702e; text-decoration: underline; text-underline-offset: 3px; }
.builder-player-toggle::after { content: '⌄'; display: inline-block; margin-left: 7px; color: var(--muted); font-size: 11px; transition: transform 140ms ease; }
.builder-player-toggle[aria-expanded="true"]::after { transform: rotate(180deg); }
.builder-player-add { flex: 0 0 36px; width: 36px; min-height: 44px; padding: 0; border: 0; border-radius: 5px; background: transparent; color: var(--ink); font-size: 30px; font-weight: 500; line-height: 1; }
.builder-player-add:hover { background: #edf2e5; }
.builder-player-selected { background: #f0f5e5; }
.builder-player-expanded > td { border-bottom-color: transparent; }
.builder-player-details-row > td { height: auto; padding: 0 12px 14px; background: #f7f9f2; white-space: normal; }
.builder-player-details-row:hover { background: transparent; }
.builder-player-details { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 7px; background: var(--white); overflow-wrap: anywhere; }
.builder-player-details-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
.builder-player-details-heading > div:first-child { display: grid; gap: 3px; }
.builder-player-details-label { color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.builder-player-details-meta { color: var(--ink); font-size: 11px; font-weight: 600; }
.builder-player-details-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.builder-detail-add, .builder-detail-history { min-height: 32px; padding: 6px 9px; font-size: 9px; white-space: nowrap; }
.builder-detail-add { border: 1px solid var(--ink); border-radius: 5px; background: var(--ink); color: white; font-weight: 650; }
.builder-detail-add:hover { background: #28513c; }
.builder-fantasy-section + .builder-fantasy-section { margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--line); }
.builder-fantasy-heading { margin: 0 0 9px; color: var(--ink); font-size: 11px; font-weight: 650; }
.builder-fantasy-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; margin: 0; }
.builder-fantasy-metrics > div { min-width: 0; }
.builder-fantasy-metrics dt { color: var(--muted); font-size: 9px; }
.builder-fantasy-metrics dd { margin: 2px 0 0; font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; }
.builder-availability { display: inline-block; padding: 5px 8px; margin: 12px 0 0; border: 1px solid var(--line); border-radius: 5px; font-size: 10px; }
.builder-availability-caution { background: #fff1e3; color: #874016; border-color: #e7c7a8; }
.builder-fantasy-breakdown { table-layout: fixed; white-space: normal; font-size: 10px; }
.builder-fantasy-breakdown th, .builder-fantasy-breakdown td { position: static; z-index: auto; height: auto; padding: 7px 5px; border-bottom: 1px solid var(--line); background: transparent; font-size: 10px; }
.builder-fantasy-breakdown thead th { background: #f3f5ee; font-size: 9px; }
.builder-fantasy-breakdown th:first-child { width: 42%; }
.builder-fantasy-breakdown th:not(:first-child) { text-align: right; }
.builder-fantasy-breakdown tbody th { font-weight: 500; }
.builder-fantasy-breakdown tbody tr:last-child > * { border-bottom: 0; }
.builder-fantasy-match-date { display: block; font-size: 9px; color: var(--muted); font-weight: 400; }
.builder-player-details-note { margin: 9px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.builder-pool-rating { width: 78px; font-weight: 700; }
.builder-rating-note { padding-top: 14px; }
@media (max-width: 1050px) { .builder-layout { grid-template-columns: minmax(400px, 1fr) minmax(320px, .85fr); gap: 18px; }.builder-pitch { margin-right: 12px; margin-left: 12px; }.builder-table th, .builder-table td { padding-right: 9px; padding-left: 9px; } }
@media (max-width: 920px) { .builder-heading { align-items: start; flex-direction: column; }.builder-layout { grid-template-columns: minmax(0, 1fr); }.builder-pitch { min-height: 700px; }.builder-slots { min-height: 700px; }.builder-table-wrap { max-height: 70vh; }.builder-toolbar { justify-content: space-between; }.builder-toolbar label { min-width: 0; flex: 1; } }
@media (max-width: 480px) { .builder-pitch { margin-right: 6px; margin-left: 6px; }.builder-slots { padding-right: 4px; padding-left: 4px; }.builder-filters { grid-template-columns: 1fr; }.builder-player-details-heading { align-items: start; flex-direction: column; }.builder-table > thead > tr > th:first-child { width: 50px; }.builder-player-details { padding: 10px; }.builder-player-details-row > td { padding-right: 6px; padding-left: 6px; } }

/* ---------------------------------------------------------------- statistics */
/* Three leader cards across the top, then a tall player list beside a panel
   reserved for the next step. Both rows collapse to one column on narrow
   screens so nothing is squeezed below a readable width.

   Surfaces use var(--surface) rather than a literal white with a dark override
   beside it: the variable already carries both themes, so there is one
   declaration to keep correct instead of two that can drift apart. The accent
   colours on each card's top edge are the exception - a very dark purple is
   invisible against a dark panel - so those get an explicit lighter value under
   the dark theme. */
.statistics-leaders { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-bottom: 24px; }
.statistics-lower { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(0, 1.35fr); gap: 20px; align-items: start; }
.statistics-card, .statistics-players, .statistics-reserved { min-width: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--ink); overflow: hidden; }
.statistics-card { border-top: 3px solid var(--statistics-accent, #5c71bb); }
.statistics-card-scorers { --statistics-accent: #3d1f47; }
.statistics-card-assists { --statistics-accent: #2b3fd8; }
.statistics-card-fantasy { --statistics-accent: #7fa3cc; }
.statistics-players { border-top: 3px solid #d8ae1f; display: flex; flex-direction: column; }
.statistics-reserved { border-top: 3px solid #b0a8dd; min-height: 300px; }
.statistics-card .builder-pool-heading, .statistics-players .builder-pool-heading, .statistics-reserved .builder-pool-heading { padding: 14px 16px 8px; }
.statistics-card h3, .statistics-players h3, .statistics-reserved h3 { font-size: 16px; }
.statistics-table { width: 100%; white-space: normal; background: var(--surface); }
.statistics-table th, .statistics-table td { padding: 8px 12px; font-size: 12px; vertical-align: middle; }
/* The player list shares its row with two radars; the numeric columns do not
   need 24px of padding each, and the name column is the one that should grow. */
.statistics-players .statistics-table th, .statistics-players .statistics-table td { padding-inline: 7px; }
.statistics-rank { width: 34px; color: var(--muted); font-variant-numeric: tabular-nums; }
.statistics-value { font-weight: 700; font-variant-numeric: tabular-nums; }
.statistics-club { display: flex; align-items: center; gap: 12px; min-width: 0; }
.statistics-club .club-logo { width: 30px; height: 30px; flex-basis: 30px; }
.statistics-club .club-logo img { width: 28px; height: 28px; }
.statistics-player-button { padding: 0; border: 0; background: transparent; color: var(--ink); font: inherit; font-weight: 600; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.statistics-player-button:hover { text-decoration: underline; }
.statistics-list-scroll { max-height: 620px; overflow: auto; background: var(--surface); }
.statistics-players .builder-filters { padding: 0 16px 10px; }
.statistics-card .builder-rating-note, .statistics-players .builder-rating-note, .statistics-reserved .builder-rating-note { padding: 6px 16px 12px; margin: 0; color: var(--muted); }
/* Dark theme: the sketch's deep purple and blue vanish against a dark panel. */

@media (max-width: 1100px) {
  .statistics-leaders { grid-template-columns: minmax(0, 1fr); }
  .statistics-lower { grid-template-columns: minmax(0, 1fr); }
}

/* Player profile inside the right-hand panel: the two spider plots (styled in
   src/web/lib/radar.css) above season totals, with the fantasy points timeline
   running full width beneath them. Plot colours are variables so every SVG
   follows the theme like everything else. */
:root { --statistics-plot-line: #5c71bb; --statistics-plot-fill: #5c71bb33;
  /* The compared (secondary) player: a sky blue checked against the plot line
     for colour-blind and normal-vision separation on this surface. */
  --statistics-plot-compare: #00a9d9; --statistics-plot-compare-fill: #00a9d92e;
  /* Fainter still on the spider plots, where the two shapes overlap. */
  --statistics-plot-compare-faded: #00a9d914; }

/* Profile header: one name chip per shown player, each starting with that
   player's colour; chart titles carry the same swatches as a legend. */
.statistics-profile-players { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; min-width: 0; }
.statistics-player-chip { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 4px 8px 4px 9px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font-size: 12px; line-height: 1.2; }
.statistics-player-chip strong { font-weight: 650; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.statistics-player-chip small { color: var(--muted); font-size: 11px; white-space: nowrap; }
.statistics-chip-remove { border: 0; background: transparent; color: var(--muted); padding: 0 2px; font-size: 15px; line-height: 1; }
.statistics-chip-remove:hover { color: var(--ink); }
.statistics-swatch { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 50%; }
.statistics-legend { display: inline-flex; flex-wrap: wrap; gap: 4px 12px; margin-left: 12px; font-weight: 500; letter-spacing: 0; }
.statistics-legend-item { display: inline-flex; align-items: center; gap: 5px; }
.statistics-legend .statistics-swatch, .statistics-fact-value .statistics-swatch { width: 8px; height: 8px; }
.statistics-facts-list dd { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 2px 10px; }
.statistics-fact-value { display: inline-flex; align-items: center; gap: 4px; }
.statistics-row-selected.statistics-row-compare > td { box-shadow: inset 2px 0 var(--statistics-plot-compare); }

.statistics-profile { min-width: 0; border: 1px solid var(--line); border-top: 3px solid #b0a8dd; border-radius: 10px; background: var(--surface); color: var(--ink); overflow: hidden; container-type: inline-size; }

.statistics-profile .builder-pool-heading { padding: 14px 16px 8px; }
.statistics-profile h3 { font-size: 16px; }
.statistics-profile h4 { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--muted); letter-spacing: .3px; }
.statistics-profile > .builder-rating-note { padding: 0 16px 10px; margin: 0; color: var(--muted); }
.statistics-facts, .statistics-timeline, .statistics-ratings { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: var(--surface-raised); }
.statistics-facts { border-top: 2px solid #d8433c; }
.statistics-timeline { margin: 16px; border-top: 2px solid #d8c9a0; }
/* Ratings sit directly under the timeline, so they share its side margins. */
.statistics-ratings { margin: 0 16px 16px; border-top: 2px solid #8fb3c9; }
/* The sketch greens and reds are too deep to read against a dark panel. */

.statistics-chart { min-width: 0; overflow: hidden; }
.statistics-chart svg { display: block; max-width: 680px; margin-inline: auto; }
.statistics-facts-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; margin: 0 0 12px; }
.statistics-facts-list > div { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--line); }
.statistics-facts-list dt { color: var(--muted); font-size: 11px; }
.statistics-facts-list dd { margin: 0; font-size: 13px; font-weight: 650; font-variant-numeric: tabular-nums; }
.statistics-facts .secondary { width: 100%; }
.statistics-timeline .builder-rating-note, .statistics-ratings .builder-rating-note, .statistics-facts > .builder-rating-note { padding: 8px 0 0; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.statistics-row-selected > td { background: var(--surface-hover); box-shadow: inset 2px 0 var(--statistics-plot-line); }

.statistics-facts { margin: 16px 16px 0; }
.statistics-detailed-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.statistics-detailed-heading h4 { margin: 0; }
.statistics-detailed-heading { flex-wrap: wrap; }
.statistics-facts-list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1500px) { .statistics-facts-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .statistics-facts-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Two spider plots need real width, so the profile column takes more of the row. */
.statistics-lower { grid-template-columns: minmax(250px, .7fr) minmax(0, 2.1fr); }
@media (max-width: 1100px) { .statistics-lower { grid-template-columns: minmax(0, 1fr); } }

/* The player list runs alongside the profile through the match-rating chart. */
#statistics-workspace .statistics-lower { grid-template-columns: minmax(0, calc((100% - 40px) / 3)) minmax(0, 1fr); }
#statistics-workspace .statistics-players .statistics-list-scroll { flex: 1; min-height: 0; max-height: none; }
/* The player list, also drawn for the open team on Takım İstatistikleri. */
:is(#statistics-workspace, #team-statistics-workspace) .statistics-player-list-table { table-layout: fixed; }
#statistics-workspace .statistics-player-list-table th:first-child { width: 36%; }
#statistics-workspace .statistics-player-list-table th:nth-child(2) { width: 19%; }
#statistics-workspace .statistics-player-list-table th:nth-child(3) { width: 11%; }
#statistics-workspace .statistics-player-list-table th:nth-child(4) { width: 14%; }
#statistics-workspace .statistics-player-list-table th:nth-child(5) { width: 20%; }
.statistics-player-list-table td.statistics-role { font-size: 12px; line-height: 1.15; color: var(--muted); }
/* The list panel is narrow: the role buttons share their grid cell and shrink
   rather than run under the sort menu. */
.statistics-players .builder-role-filters { min-width: 0; }
.statistics-players .builder-role-filters button { flex: 1 1 0; min-width: 0; width: auto; max-width: 32px; padding: 3px; }
.statistics-players .builder-role-filters img { width: 100%; max-width: 22px; height: auto; margin: auto; }
:is(#statistics-workspace, #team-statistics-workspace) .statistics-player-list-table .statistics-club { gap: 12px; }
:is(#statistics-workspace, #team-statistics-workspace) .statistics-player-list-table .statistics-player-button {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#team-statistics-workspace .statistics-lower { grid-template-columns: minmax(0, calc((100% - 40px) / 3)) minmax(0, 1fr); }
/* The left column: Takım Listesi above the open team's players. */
#team-statistics-workspace .team-statistics-side { display: grid; gap: 20px; align-content: start; min-width: 0; }
/* The open team's Oyuncu Listesi: the search takes the team menu's row too,
   and its own columns - rating, fantasy points per match, goals, assists. */
#team-statistics-players .builder-search { grid-column: 1 / -1; }
#team-statistics-players .statistics-player-list-table th:first-child { width: 32%; }
#team-statistics-players .statistics-player-list-table th:nth-child(2) { width: 17%; }
#team-statistics-players .statistics-player-list-table th:nth-child(3) { width: 13%; }
#team-statistics-players .statistics-player-list-table th:nth-child(4) { width: 14%; }
#team-statistics-players .statistics-player-list-table th:nth-child(5),
#team-statistics-players .statistics-player-list-table th:nth-child(6) { width: 12%; }
#team-statistics-workspace .statistics-players .statistics-list-scroll { max-height: none; overflow: visible; }
#team-statistics-workspace .statistics-team-list-table { table-layout: fixed; }
#team-statistics-workspace .statistics-team-list-table th:first-child { width: 50%; }
#team-statistics-workspace .statistics-team-list-table th:not(:first-child) { width: 12.5%; }
/* A sort on goal difference or clean sheets adds its figure as a fifth column. */
#team-statistics-workspace .statistics-team-list-table.has-sort-column th:first-child { width: 40%; }
#team-statistics-workspace .statistics-team-list-table.has-sort-column th:not(:first-child) { width: 12%; }
#team-statistics-workspace .statistics-team-list-table .statistics-club { gap: 12px; }
#team-statistics-workspace .statistics-team-list-table .statistics-player-button {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 1100px) {
  #statistics-workspace .statistics-lower { grid-template-columns: minmax(0, 1fr); }
  #statistics-workspace .statistics-players .statistics-list-scroll { flex: none; max-height: 620px; }
  #team-statistics-workspace .statistics-lower { grid-template-columns: minmax(0, 1fr); }
}
/* Opening a team scrolls its profile to the top; on phones the fixed sidebar
   button sits there, so the heading stops below it. */
@media (max-width: 760px) { #team-statistics-profile { scroll-margin-top: 72px; } }

/* Live standings on Maç Haftası: points as if the match ended now, in the
   site's win/draw/loss colours (styles.css). */
.standing-live { font-weight: 800; }
.standing-live-win { color: var(--result-win); }
.standing-live-draw { color: var(--result-draw); }
.standing-live-loss { color: var(--result-loss); }

/* The lineup pitch's markings and look are in styles/pitch.css. */
.matchweek-mini-line { position: relative; z-index: 1; }