@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wdth,wght@12..96,75..100,400..800&display=swap');

:root { --ink:#2f3136; --paper:#f5efe6; --surface:#fcf8f1; --lime:#f3e87c; --line:#d8c3a5; --muted:#746e66; --placeholder:#b7a99a; --sage:#87a878; --terracotta:#c46a3a; --sage-tint:#e5eddf; --beige-tint:#eee2d3; }
.clear-picks,.revert-picks,.history-button { border-color:var(--line); color:var(--muted); font-size:12px; }.clear-picks,.revert-picks { display:block; width:100%; padding:8px 10px; }.clear-picks { margin-top:14px; }.revert-actions { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:6px; margin-top:6px; }.revert-actions .revert-picks { margin:0; }.history-button { display:grid; place-items:center; min-height:36px; padding:0; font-size:19px; line-height:1; }.clear-picks:hover:not(:disabled),.revert-picks:hover:not(:disabled),.history-button:hover:not(:disabled) { border-color:var(--ink); background:transparent; color:var(--terracotta); }.clear-picks:disabled,.revert-picks:disabled,.history-button:disabled { cursor:default; opacity:1; }
.picks-column #save { display:block; width:100%; margin-top:10px; border-color:var(--sage); background:var(--sage); color:var(--ink); font-weight:700; }.picks-column #save:hover { border-color:#6f8e63; background:#6f8e63; color:var(--paper); }
.picks-column #save.hidden { display:none; }
.final-autosave-control { display:flex; flex-wrap:wrap; align-items:center; gap:5px 10px; margin-top:12px; padding:2px 0; color:var(--muted); font-size:11px; }
.final-autosave-control.hidden { display:none; }
.final-autosave-control label { display:inline-flex; align-items:center; gap:6px; margin:0; color:var(--muted); cursor:pointer; font-size:11px; font-weight:500; }
.final-autosave-control input { flex:none; width:13px; min-width:13px; height:13px; margin:0; padding:0; accent-color:var(--sage); }
.final-autosave-control #final-save-status { flex:1; text-align:right; }
.final-autosave-control #retry-final-save { border:0; padding:0; color:var(--terracotta); font-size:12px; text-decoration:underline; }
.final-autosave-control #retry-final-save.hidden { display:none; }
.top10-message { min-height:2.8em; margin:10px 0 0; padding:7px 9px; border-top:1px solid var(--line); color:var(--terracotta); font-size:12px; line-height:1.4; opacity:1; transition:opacity .6s ease; }.top10-message.ok { color:var(--sage); }.top10-message.fading { opacity:0; }
.clear-picks:hover:not(:disabled),.remove:hover { color:var(--terracotta); }.card { background:var(--surface); }.country-picker,.range-filter { border-color:var(--line); }.country-options { border-color:var(--line); background:var(--paper); box-shadow:4px 4px 0 rgba(47,49,54,.12); }.country-option:hover,.country-option.selected,.country-chip { background:var(--beige-tint); }.country-chip { border-color:var(--line); }.country-option.selected .country-check { border-color:var(--sage); }.range-sliders::before { background:var(--line); }.range-sliders::after,.range-sliders input::-webkit-slider-thumb,.range-sliders input::-moz-range-thumb { background:var(--terracotta); }.rider.selected { border-color:var(--sage); background:linear-gradient(135deg,var(--surface) 0%,#edf2e8 56%,var(--sage-tint) 100%); }.rider.selected:hover { background:linear-gradient(135deg,#edf2e8 0%,#dce8d5 100%); }.rider.selected .rank-scale::after { background:var(--sage-tint); }.rank-scale { background:linear-gradient(90deg,var(--sage) 0%,var(--terracotta) 100%); }.rank-scale::after { background:var(--surface); }.flag { background:var(--beige-tint); }.message { color:var(--terracotta); }.message.ok { color:var(--sage); }
.filters input,input,.rider { border-color:var(--line); }.picks li.drag-over { background:var(--lime); }.mobile-dragging .picks-column,.mobile-picking .picks-column { border-color:var(--line); background:rgba(245,239,230,.91); box-shadow:0 10px 32px rgba(47,49,54,.16); }
.rider-view-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 16px; }.view-toggle { display:flex; }.view-toggle button { border-right:0; padding:7px 9px; font-size:12px; }.view-toggle button:last-child { border-right:1px solid var(--ink); }.view-toggle button.active { background:var(--ink); color:var(--paper); }.rider-sort-label { display:flex; align-items:center; gap:6px; margin:0; color:var(--muted); font-size:12px; }.rider-sort-label select { border:1px solid var(--ink); background:transparent; padding:6px; color:var(--ink); font:inherit; }.country-meta { color:var(--muted); font-weight:400; letter-spacing:0; }.plain-riders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.rider.selected { padding-right:74px; border-color:#9aaa98; background:linear-gradient(135deg,#f2f5ee 0%,#e6eee3 56%,#d8e5d6 100%); color:var(--ink); }.rider.selected:hover { background:linear-gradient(135deg,#ebf2e7 0%,#dcebd9 100%); color:var(--ink); }.rider.selected .rank { color:#52604f; }.rider.selected .rank-scale::after { background:#e3ecdf; }.pick-position { position:absolute; top:7px; right:8px; display:flex; flex-direction:column; align-items:flex-end; color:#52604f; line-height:1; white-space:nowrap; }.pick-position strong { font-size:15px; font-weight:700; }.pick-position small { margin-top:2px; font-size:8px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.view-toggle,.rider-sort-label,.rider-selection-label,.rider-view-controls-left { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:13px; }.rider-view-controls-left { gap:18px; }.view-toggle [role="button"],.rider-sort-label [role="button"],.rider-selection-label [role="button"] { cursor:pointer; }.view-toggle [role="button"].active,.rider-sort-label [role="button"].active,.rider-selection-label [role="button"].active { color:var(--ink); font-weight:700; }.view-divider { color:var(--line); }.rider-sort-label i { font-style:normal; font-size:11px; }
@media(max-width:650px) { .rider-view-controls,.rider-view-controls-left { align-items:flex-start; flex-direction:column; }.rider-view-controls-left { gap:8px; }.plain-riders { grid-template-columns:1fr; } }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.4 'Bricolage Grotesque',Arial,sans-serif; }
.admin-home { display:inline-block; margin-bottom:18px; border:1px solid var(--line); padding:6px 10px; color:var(--muted); font-size:12px; font-weight:700; text-decoration:none; }.admin-home:hover { border-color:var(--ink); color:var(--ink); }
.shell { max-width:1000px; margin:0 auto; padding:54px 24px 80px; }
h1 { font-size:clamp(54px,10vw,110px); font-weight:500; line-height:.9; letter-spacing:-.045em; margin:8px 0 8px; }
.tagline { margin:0 0 28px; color:var(--muted); font-size:18px; font-weight:400; letter-spacing:-.015em; }
.masthead { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }.session-controls { display:flex; flex-direction:column; align-items:flex-end; gap:4px; min-width:112px; padding-top:8px; color:var(--muted); }.session-label { width:100%; padding-bottom:3px; font-size:10px; letter-spacing:.06em; text-align:right; }.session-controls #session-username { width:100%; padding-bottom:3px; border-bottom:1px solid var(--line); color:var(--ink); font-size:12px; font-weight:700; text-align:right; }.session-controls button { border:0; background:transparent; padding:1px 0 0; color:var(--muted); font-size:11px; font-weight:400; }.session-controls button:hover { background:transparent; color:var(--terracotta); }.session-controls button:focus-visible { outline:1px solid var(--terracotta); outline-offset:3px; }
.event-guide { display:flex; max-width:690px; align-items:flex-start; gap:8px; margin-top:6px; color:var(--muted); font-size:14px; line-height:1.35; }.event-guide p { margin:0; }.event-help { position:relative; flex:none; }.event-help summary { display:grid; width:17px; height:17px; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--muted); cursor:pointer; font-size:11px; font-weight:700; line-height:1; list-style:none; }.event-help summary::-webkit-details-marker { display:none; }.event-help summary:hover { border-color:var(--ink); color:var(--ink); }.event-help-popover { position:absolute; z-index:10; top:25px; right:0; width:min(300px,calc(100vw - 48px)); padding:12px; border:1px solid var(--line); background:var(--surface); box-shadow:4px 4px 0 rgba(47,49,54,.12); color:var(--muted); font-size:12px; line-height:1.4; }.event-help-popover strong,.event-help-popover span { display:block; }.event-help-popover strong { margin-bottom:5px; color:var(--ink); font-size:12px; }
h2 { margin:0; font-size:28px; }.eyebrow { font-size:11px; letter-spacing:.13em; font-weight:700; margin:0; }
.event-title { margin:0; font-size:24px; line-height:1.15; }.event-title + #event-meta { margin:4px 0 0; }
.muted { color:var(--muted); }.card { border:1px solid var(--line); background:#fffdf7; padding:20px; max-width:520px; margin:40px 0; }
#identity { border:0; background:transparent; padding:0; }
label { display:block; font-weight:700; margin-bottom:8px; }.inline { display:flex; gap:8px; }
input { min-width:0; flex:1; border:1px solid var(--ink); background:transparent; padding:12px; font:inherit; }
button { border:1px solid var(--ink); background:transparent; padding:10px 12px; font:700 14px inherit; cursor:pointer; }
button:hover,button.selected { background:var(--ink); color:var(--paper); } button.accent { background:var(--lime); }.hidden { display:none; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:16px; margin-top:48px; }
.grid { display:grid; grid-template-columns:minmax(230px,.7fr) 1.3fr; gap:24px; margin-top:22px; align-items:start; }
.picks-column { position:sticky; top:20px; }
.picks { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.picks li { min-height:48px; border-bottom:1px solid var(--line); padding:11px 4px; }
.picks li.drag-over { background:var(--lime); }.pick-filled { position:relative; padding-right:34px !important; cursor:grab; }.pick-empty { color:var(--muted); font-size:14px; }
.position { display:inline-block; width:30px; color:var(--muted); }.riders { display:grid; gap:18px; }
.rider-browser { min-width:0; }.filters { display:grid; grid-template-columns:1fr; gap:8px; padding-bottom:14px; border-bottom:1px solid var(--line); }.filters input { width:100%; min-width:0; border:1px solid var(--ink); background:transparent; padding:9px; font:14px inherit; }.filters > button { justify-self:center; padding:5px 12px; font-size:12px; }.country-picker { position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; border:1px solid var(--ink); background:var(--paper); padding:6px 10px; }.country-search-field { display:flex; align-items:center; gap:10px; margin:0; min-width:0; }.country-search-field span { color:var(--ink); font-size:14px; font-weight:700; white-space:nowrap; }.country-search-field input { flex:1; border:0; padding:4px 0; outline:0; color:var(--muted); font-size:12px; font-weight:400; }.country-search-field input::placeholder { color:var(--muted); opacity:1; }.country-filter-label { color:var(--muted); font-size:13px; white-space:nowrap; }.country-options { position:absolute; z-index:5; top:calc(100% + 4px); left:-1px; right:-1px; max-height:250px; overflow:auto; padding:6px; border:1px solid var(--ink); background:var(--paper); box-shadow:4px 4px 0 rgba(24,35,30,.16); }.country-option { display:flex; width:100%; align-items:center; gap:7px; border:0; background:transparent; padding:6px 4px; color:var(--ink); cursor:pointer; font:700 14px inherit; text-align:left; }.country-option:hover,.country-option.selected { background:#e9e6dc; color:var(--ink); }.country-check { display:inline-grid; width:18px; height:18px; place-items:center; flex:none; border:1px solid var(--muted); color:var(--ink); font-size:12px; }.country-option.selected .country-check { border-color:var(--ink); background:var(--lime); }.country-option .flag { margin-right:0; }.selected-countries { display:flex; flex-wrap:wrap; gap:6px; padding:2px 0; }.country-chip { display:inline-flex; width:auto; align-items:center; gap:4px; border:1px solid var(--ink); background:#e9e6dc; padding:4px 7px; color:var(--ink); font:700 12px inherit; }.country-chip:hover { background:var(--lime); color:var(--ink); }.country-chip .flag { width:17px; height:17px; margin-right:0; font-size:10px; }.range-filter { display:grid; grid-template-columns:100px 245px minmax(130px,1fr); align-items:center; gap:12px; border:1px solid var(--ink); padding:8px 10px; }.range-label { display:flex; flex-direction:column; gap:2px; margin:0; color:var(--muted); font-size:12px; }.range-label span:first-child { color:var(--ink); font-weight:700; font-size:14px; }.range-sliders { --range-start:0%; --range-end:100%; position:relative; height:22px; margin:0 2px; }.range-sliders::before,.range-sliders::after { content:""; position:absolute; top:10px; height:3px; border-radius:4px; }.range-sliders::before { right:5px; left:5px; background:#d5d1c8; }.range-sliders::after { left:var(--range-start); width:calc(var(--range-end) - var(--range-start)); background:#c14d40; }.range-sliders input { position:absolute; z-index:1; inset:0; width:100%; height:22px; margin:0; padding:0; border:0; appearance:none; -webkit-appearance:none; background:transparent; pointer-events:none; }.range-sliders input::-webkit-slider-runnable-track { height:3px; background:transparent; }.range-sliders input::-webkit-slider-thumb { width:16px; height:16px; margin-top:-7px; border:0; border-radius:50%; background:#c14d40; cursor:ew-resize; pointer-events:auto; -webkit-appearance:none; }.range-sliders input::-moz-range-track { height:3px; background:transparent; }.range-sliders input::-moz-range-thumb { width:16px; height:16px; border:0; border-radius:50%; background:#c14d40; cursor:ew-resize; pointer-events:auto; }.filter-summary { margin:10px 0 18px; font-size:13px; }
.country-group h3 { font-size:12px; letter-spacing:.1em; margin:0 0 8px; }.country-riders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.rider { position:relative; overflow:hidden; border:1px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer; text-align:left; padding:10px; }.rider:focus-visible { outline:2px solid var(--sage); outline-offset:2px; }.rank-scale { position:absolute; right:0; bottom:0; left:0; height:4px; background:linear-gradient(90deg,#aaa69e 0%,#db3d32 100%); }.rank-scale::after { content:""; position:absolute; top:0; right:0; bottom:0; width:calc(100% - var(--rank-fill)); background:#fffdf7; }.rider.selected .rank-scale::after,.rider:hover .rank-scale::after { background:var(--ink); }.pick-filled .pick-rank-scale::after { background:var(--paper); }.flag { display:inline-grid; width:20px; height:20px; margin-right:6px; overflow:hidden; border-radius:50%; background:var(--surface); box-shadow:inset 0 0 0 1px rgba(216,195,165,.65); vertical-align:middle; }.flag img { width:100%; height:100%; object-fit:contain; transform:scale(1.12); }
.remove { position:absolute; top:11px; right:2px; padding:0 6px; border:0; color:var(--muted); font-size:20px; line-height:20px; }.remove:hover { background:transparent; color:#a52d20; }
.rank { color:var(--muted); font-size:12px; }.country-search-field input,.country-search-field input::placeholder { color:var(--placeholder); }.rider.selected .rank-scale::after { background:var(--sage-tint); }.rider.selected:hover .rank-scale::after { background:var(--sage-tint); }.rank-scale { background:linear-gradient(90deg,var(--sage) 0%,var(--terracotta) 100%); }.rank-scale::after { background:var(--surface); }.range-sliders::before { background:var(--line); }.range-sliders::after,.range-sliders input::-webkit-slider-thumb,.range-sliders input::-moz-range-thumb { background:var(--terracotta); }.message { min-height:1.4em; color:var(--terracotta); }.message.ok { color:var(--sage); }
.rider-add { position:absolute; top:7px; right:7px; display:grid; width:23px; height:23px; min-width:0; min-height:0; place-items:center; appearance:none; border:1px solid var(--line); border-radius:50%; background:var(--paper); color:var(--muted); padding:0; font:400 17px/1 inherit; }.rider:hover .rider-add { border-color:var(--muted); color:var(--ink); }.rider-add:hover { border-color:var(--sage); background:var(--sage); color:var(--ink); }.rider-add:focus-visible { outline:1px solid var(--sage); outline-offset:2px; }.rider.selected .rider-add { right:52px; }
.rider-detail-modal { position:relative; width:min(980px,calc(100vw - 32px)); max-height:calc(100vh - 32px); overflow:hidden; border:1px solid var(--line); background:var(--paper); color:var(--ink); padding:30px; box-shadow:8px 10px 0 rgba(47,49,54,.12); }.rider-detail-modal[open] { display:flex; flex-direction:column; }.rider-detail-modal::backdrop { background:rgba(47,49,54,.34); backdrop-filter:blur(2px); }.rider-detail-scroll { flex:1; min-height:0; overflow:auto; }.close-rider-detail { position:absolute; z-index:2; top:12px; right:14px; display:grid; width:34px; height:34px; min-width:0; min-height:0; place-items:center; appearance:none; border:1px solid transparent; border-radius:50%; background:transparent; color:var(--muted); padding:0; font:400 26px/1 inherit; }.close-rider-detail:hover { border-color:var(--line); background:var(--beige-tint); color:var(--terracotta); }.close-rider-detail:focus-visible { outline:1px solid var(--sage); outline-offset:2px; }.rider-detail-header { position:relative; display:flex; justify-content:space-between; gap:12px; padding:0 52px 16px 0; border-bottom:1px solid var(--line); }.rider-detail-add { position:relative; flex:none; align-self:flex-start; margin-top:2px; width:32px; height:32px; font-size:19px; }.rider-detail-add.on { border-color:var(--sage); background:var(--sage-tint); color:var(--ink); font-size:13px; font-weight:700; }.rider-detail-wins,.rider-detail-season { white-space:nowrap; }.rider-detail-season::before { content:"·"; margin:0 8px; }.rider-detail-header h2 { margin:3px 0 5px; font-size:clamp(26px,3vw,34px); letter-spacing:-.025em; }.rider-detail-header h2 .flag { margin-right:8px; }.rider-detail-header .muted { margin:0; font-size:15px; }.rider-stat-grid { display:grid; grid-template-columns:110px 1fr 1fr 1.45fr; margin:0 0 30px; border-bottom:1px solid var(--line); }.rider-stat-grid > div { min-height:94px; padding:15px 14px 14px; }.rider-stat-grid > div + div { border-left:1px solid var(--line); }.rider-stat-grid span,.rider-stat-grid small { display:block; color:var(--muted); font-size:11px; line-height:1.25; }.rider-stat-grid span { letter-spacing:.06em; text-transform:uppercase; }.rider-stat-grid strong { display:block; margin:6px 0 3px; font-size:18px; line-height:1.1; letter-spacing:-.015em; }.ranking-trend.better strong { color:#58774f; }.ranking-trend.worse strong { color:var(--terracotta); }.rider-history { padding-top:0; }.rider-history-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }.rider-history-heading h3 { margin:2px 0 0; font-size:22px; letter-spacing:-.02em; }.rider-history-heading p { max-width:310px; margin:0 0 2px; color:var(--muted); font-size:12px; line-height:1.35; text-align:right; }.rider-history-table-wrap { display:block; overflow-x:auto; margin-top:14px; }.rider-history-table { width:auto; max-width:100%; margin:0 auto; border-collapse:separate; border-spacing:0; font-size:13px; }.rider-history-table th,.rider-history-table td { height:42px; border:0; border-bottom:1px solid var(--line); padding:6px 8px; text-align:center; white-space:nowrap; }.rider-history-table thead th { border-top:1px solid var(--line); background:var(--beige-tint); color:var(--ink); font-size:12px; font-weight:700; }.rider-history-table th:first-child { position:sticky; left:0; z-index:1; width:158px; min-width:120px; background:var(--paper); box-shadow:inset -1px 0 0 var(--line); text-align:left; white-space:normal; }.rider-history-table thead th:first-child { z-index:2; background:var(--beige-tint); }.rider-history-table tbody th { font-weight:500; }.rider-history-table thead small { display:block; margin-top:1px; color:var(--muted); font-size:9px; font-weight:400; }.result-medal,.result-top-ten { display:inline-grid; width:28px; height:28px; place-items:center; border-radius:50%; font-size:12px; font-weight:700; }.medal-1 { background:#d8b55a; color:var(--ink); }.medal-2 { background:#c7c9c7; color:var(--ink); }.medal-3 { background:#c18863; color:var(--ink); }.result-top-ten { background:var(--sage-tint); color:#52604f; }.result-place { color:var(--ink); font-weight:600; }.result-status { color:var(--terracotta); font-size:10px; font-weight:700; letter-spacing:.04em; }
.simulation-controls { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:16px 0 6px; }.simulation-controls label { display:flex; align-items:center; gap:8px; margin:0; }.simulation-controls input[type="number"] { width:70px; flex:none; padding:6px; }.simulation-controls input[type="range"] { width:170px; accent-color:var(--terracotta); }.simulation-controls span { min-width:32px; font-variant-numeric:tabular-nums; color:var(--muted); }.simulation-controls button { padding:7px 11px; }
#result-slots { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px 14px; margin:20px 0; }#result-slots label { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:5px; margin:0; color:var(--ink); font-size:12px; font-weight:700; }#result-slots select { width:100%; min-width:0; border:1px solid var(--line); background:var(--surface); padding:6px 7px; color:var(--ink); font:400 12px inherit; }
.simulation-leaderboard,#leaderboard { max-width:900px; margin:28px 0; }.leaderboard-ranking { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }.leaderboard-entry { display:grid; grid-template-columns:auto auto auto; align-items:center; gap:8px; padding:8px 10px; font-size:13px; }.leaderboard-place { color:var(--muted); }.leaderboard-entry span:last-child { color:var(--muted); font-weight:400; }.leaderboard-detail { border-top:1px solid var(--line); padding-top:18px; }.detail-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }.detail-heading h3,.lineage h3 { margin:0; font-size:18px; }.detail-total { color:var(--terracotta); white-space:nowrap; }.score-breakdown { margin:14px 0 26px; border:1px solid var(--line); }.score-row { display:grid; grid-template-columns:44px minmax(150px,1.5fr) 58px 50px 58px 82px 80px; gap:8px; align-items:center; min-height:36px; padding:6px 9px; border-bottom:1px solid var(--line); font-size:13px; }.score-row:last-child { border-bottom:0; }.score-header { min-height:28px; background:var(--beige-tint); color:var(--muted); font-size:11px; font-weight:700; }.score-rider { font-weight:700; }.lineage { border-top:1px solid var(--line); padding-top:18px; }.lineage > .muted { margin:4px 0 12px; font-size:13px; }.lineage-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.lineage-column { border:1px solid var(--line); }.lineage-column h4 { margin:0; padding:7px 9px; background:var(--beige-tint); font-size:12px; }.lineage-row { display:grid; grid-template-columns:34px 52px minmax(0,1fr); align-items:center; min-height:31px; padding:5px 8px; border-top:1px solid var(--line); font-size:12px; }.lineage-position,.lineage-link { color:var(--muted); }.lineage-link { color:var(--sage); font-weight:700; text-align:left; }.lineage-link.out { color:var(--terracotta); }.lineage-rider { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:700; }.lineage-column:last-child .lineage-row { grid-template-columns:34px minmax(0,1fr); }
.lineage-stage { position:relative; overflow-x:auto; }.lineage-grid { position:relative; z-index:1; min-width:640px; }.lineage-column { position:relative; z-index:3; background:var(--surface); }.lineage-connectors { position:absolute; z-index:2; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }.lineage-connector { fill:none; stroke:var(--sage); stroke-width:2; opacity:.9; }.lineage-connector-dot { fill:var(--sage); }
.analysis-page .shell { max-width:1440px; }.lineage-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); min-width:900px; gap:150px; }.lineage-link.better { color:var(--sage); }.lineage-link.worse { color:var(--terracotta); }.lineage-link.exact { color:var(--muted); }.lineage-connector { stroke:var(--muted); stroke-width:2.5; }.lineage-connector.better { stroke:var(--sage); }.lineage-connector.worse { stroke:var(--terracotta); }.lineage-connector-dot { fill:var(--muted); }.lineage-connector-dot.better { fill:var(--sage); }.lineage-connector-dot.worse { fill:var(--terracotta); }
.analysis-page #simulation-output { max-width:none; width:100%; }
.rider-view-controls { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:9px 16px; }.rider-selection-label { grid-column:1 / -1; }.rider-sort-label { justify-self:end; }
@media(max-width:650px) { .rider-view-controls { display:flex; }.rider-sort-label { justify-self:auto; } }
@media(max-width:900px) { #result-slots { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:650px) { #result-slots { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } }
@media(max-width:650px) { .rider-detail-modal { width:calc(100vw - 20px); height:calc(100vh - 32px); padding:16px 12px; }.rider-detail-header { padding-right:44px; }.rider-detail-header h2 { margin:2px 0 3px; font-size:20px; }.rider-detail-add { width:28px; height:28px; font-size:16px; }.rider-stat-grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:14px; }.rider-stat-grid > div { min-height:0; padding:6px 4px; }.rider-stat-grid span { font-size:9px; letter-spacing:.02em; }.rider-stat-grid strong { margin:3px 0 1px; font-size:13px; }.rider-stat-grid small { font-size:9px; }.rider-history-heading { align-items:flex-start; flex-direction:column; }.rider-history-heading h3 { font-size:18px; }.rider-history-heading p { text-align:left; }.rider-history-table { font-size:11px; }.rider-history-table th,.rider-history-table td { height:34px; padding:4px 5px; }.rider-history-table th:first-child { width:96px; min-width:86px; line-height:1.2; } }
@media(max-width:650px) { .score-breakdown { overflow-x:auto; }.score-row { min-width:610px; }.lineage-grid { grid-template-columns:1fr; }.leaderboard-ranking { display:grid; grid-template-columns:1fr; }.leaderboard-entry { grid-template-columns:36px 1fr auto; text-align:left; } }
@media(max-width:650px) { .lineage-grid { grid-template-columns:1fr 1fr; min-width:640px; gap:72px; } }
@media(max-width:650px) { .shell { padding:32px 16px; }.grid { grid-template-columns:1fr; }.picks-column { position:static; }.mobile-dragging .picks-column,.mobile-picking .picks-column { position:fixed; z-index:20; right:10px; bottom:10px; left:10px; height:min(355px,48vh); overflow:auto; padding:28px 10px 8px; border:1px solid rgba(24,35,30,.65); border-radius:8px; background:rgba(245,242,233,.91); box-shadow:0 10px 32px rgba(24,35,30,.18); backdrop-filter:blur(9px); }.mobile-dragging .picks-column::before,.mobile-picking .picks-column::before { content:"Choose a Top 10 position"; position:absolute; z-index:1; top:8px; left:10px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.08em; }.mobile-dragging .picks li,.mobile-picking .picks li { min-height:30px; padding:4px 3px; overflow:hidden; font-size:13px; line-height:20px; text-overflow:ellipsis; white-space:nowrap; }.mobile-dragging .picks .rank,.mobile-picking .picks .rank { display:none; }.mobile-dragging .picks .flag,.mobile-picking .picks .flag { width:18px; height:18px; font-size:11px; }.mobile-dragging .picks .position,.mobile-picking .picks .position { width:28px; }.mobile-dragging .picks .remove,.mobile-picking .picks .remove { padding:0 4px; font-size:17px; line-height:20px; }.mobile-dragging .pick-rank-scale,.mobile-picking .pick-rank-scale { height:2px; }.mobile-picking .picks li { background:rgba(255,253,247,.66); }.range-filter { grid-template-columns:1fr; gap:7px; }.range-label { flex-direction:row; justify-content:space-between; }.country-riders { grid-template-columns:1fr; }.section-heading { align-items:start; flex-direction:column; } }
@media(max-width:650px) { .masthead { align-items:flex-start; }.session-controls { min-width:88px; }.session-controls #session-username { max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } }
.filter-actions { display:flex; justify-content:center; gap:8px; }.filter-actions button { padding:5px 12px; border-color:var(--line); color:var(--muted); font-size:12px; }.filter-actions button:hover { border-color:var(--ink); background:transparent; color:var(--ink); }.filter-actions .filter-icon-button { position:relative; display:grid; width:30px; height:30px; min-width:0; place-items:center; padding:0; border-radius:50%; }.filter-icon-button svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-width:1.6; }.filter-actions #advanced-filter-count { position:absolute; top:-5px; right:-6px; display:inline-grid; min-width:17px; height:17px; place-items:center; margin:0; border-radius:50%; background:var(--sage); color:var(--ink); font-size:10px; line-height:1; }
.advanced-filter-modal { position:relative; width:min(760px,calc(100vw - 32px)); max-height:calc(100vh - 32px); overflow:auto; border:1px solid var(--line); background:var(--paper); color:var(--ink); padding:28px 30px 22px; box-shadow:8px 10px 0 rgba(47,49,54,.12); }.advanced-filter-modal::backdrop { background:rgba(47,49,54,.34); backdrop-filter:blur(2px); }.advanced-filter-header { display:flex; justify-content:space-between; gap:20px; padding-bottom:18px; border-bottom:1px solid var(--line); }.advanced-filter-header h2 { margin:2px 0 4px; font-size:26px; letter-spacing:-.025em; }.advanced-filter-header .muted { margin:0; font-size:14px; }.close-advanced-filters { display:grid; width:26px; height:26px; min-width:0; min-height:0; place-items:center; appearance:none; border:1px solid transparent; border-radius:50%; background:transparent; color:var(--muted); padding:0; font:400 22px/1 inherit; }.close-advanced-filters:hover { border-color:var(--line); background:var(--beige-tint); color:var(--terracotta); }.advanced-filter-section { padding:20px 0; border-bottom:1px solid var(--line); }.advanced-filter-section-heading { display:flex; align-items:end; justify-content:space-between; gap:18px; }.advanced-filter-section h3 { margin:0; font-size:18px; letter-spacing:-.015em; }.advanced-filter-section p { margin:3px 0 0; font-size:12px; }.advanced-range { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:12px; }.advanced-range label { margin:0; font-size:12px; font-weight:500; }.advanced-range input { width:74px; padding:6px 7px; font-size:12px; }.race-filter-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:14px; }.race-filter { border:1px solid var(--line); background:var(--surface); }.race-filter summary { padding:7px 8px; cursor:pointer; }.race-filter summary::marker { color:var(--muted); }.race-filter summary label { display:inline; margin:0; cursor:pointer; font-size:12px; font-weight:600; }.race-filter summary span,.race-editions span { color:var(--muted); font-size:10px; font-weight:400; }.race-filter input { accent-color:var(--sage); }.race-editions { display:grid; gap:4px; padding:6px 8px 8px 25px; border-top:1px solid var(--line); }.race-editions label { margin:0; color:var(--muted); font-size:12px; font-weight:400; }.advanced-profile-filters { display:grid; grid-template-columns:1fr 1.25fr; align-items:start; gap:28px; }.advanced-profile-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.advanced-profile-grid > label { margin:0; color:var(--ink); font-size:12px; font-weight:600; }.advanced-profile-grid small { display:block; margin-top:5px; color:var(--muted); font-size:10px; font-weight:400; }.advanced-profile-grid .advanced-range { margin-top:6px; }.advanced-filter-actions { display:flex; justify-content:flex-end; gap:8px; padding-top:18px; }.advanced-filter-actions button { border-color:var(--line); color:var(--muted); font-size:12px; }.advanced-filter-actions button:hover { border-color:var(--ink); background:transparent; color:var(--ink); }.advanced-filter-actions .accent { border-color:var(--sage); background:var(--sage); color:var(--ink); }.advanced-filter-actions .accent:hover { border-color:#6f8e63; background:#6f8e63; color:var(--paper); }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.year-filter-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:14px; color:var(--muted); font-size:12px; }.year-filter-row label { margin:0; color:var(--ink); font-size:12px; font-weight:500; }.year-filter-row input { accent-color:var(--sage); }
.advanced-race-actions { display:flex; align-items:center; gap:12px; }.advanced-race-actions button { border:0; border-bottom:1px solid var(--line); background:transparent; padding:2px 0; color:var(--muted); font-size:11px; font-weight:600; white-space:nowrap; }.advanced-race-actions button:hover { border-bottom-color:var(--ink); background:transparent; color:var(--ink); }
@media(max-width:650px) { .advanced-filter-modal { width:calc(100vw - 20px); padding:22px 16px 16px; }.advanced-filter-section-heading,.advanced-profile-filters { display:grid; grid-template-columns:1fr; gap:14px; }.advanced-race-actions { justify-content:space-between; }.race-filter-list,.advanced-profile-grid { grid-template-columns:1fr; }.advanced-filter-actions { position:sticky; bottom:-16px; padding:12px 0 0; background:var(--paper); }.advanced-filter-actions button { flex:1; } }
.rider-detail-modal { position:fixed !important; top:16px; right:auto; bottom:auto; left:50%; width:min(760px,calc(100vw - 32px)); max-height:calc(100vh - 32px); margin:0; transform:translateX(-50%); }
.filter-actions .filter-icon-button { width:auto; min-width:0; height:30px; grid-template-columns:16px auto; gap:6px; padding:5px 10px; border-radius:0; }.filter-icon-button::after { content:"Advanced"; }.filter-actions .filter-icon-button #advanced-filter-count { top:-7px; right:-7px; }.filter-actions #advanced-filter-count.hidden { display:none; }
.rider-history-heading { justify-content:center; text-align:center; }.rider-history-table { width:min(620px,100%); }
.api-status { display:flex; align-items:center; gap:9px; margin:0 0 18px; border:1px solid var(--line); background:var(--surface); padding:9px 13px; color:var(--muted); font-size:13px; }
.api-status.hidden { display:none; }
.api-status-icon,.wake-toast-icon { display:grid; width:17px; height:17px; flex:none; place-items:center; }
.api-status-icon svg,.wake-toast-icon svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.5; }
.api-status .tick { display:none; }
.api-status.starting .glass,.wake-toast-icon .glass { animation:hourglass-turn 1.9s ease-in-out infinite; }
.api-status.ready { border-color:var(--sage); color:#4d6344; }
.api-status.ready .glass { display:none; }
.api-status.ready .tick { display:block; }
.api-status.error { border-color:var(--terracotta); color:var(--terracotta); }
@keyframes hourglass-turn { 0%,58% { transform:rotate(0); } 82%,100% { transform:rotate(180deg); } }
.wake-toast { position:fixed; z-index:40; right:16px; bottom:20px; left:16px; display:flex; align-items:center; gap:10px; width:min(340px,calc(100vw - 32px)); margin:0 auto; border:1px solid var(--ink); background:var(--paper); padding:11px 14px; color:var(--ink); font-size:13px; line-height:1.35; box-shadow:4px 5px 0 rgba(47,49,54,.14); }
.wake-toast.hidden { display:none; }
@media(prefers-reduced-motion:reduce) { .api-status .glass,.wake-toast-icon .glass { animation:none; } }

.rider { padding-right:38px; }
.rider.selected { padding-right:82px; }
@media(max-width:650px) { .rider-add { top:5px; right:5px; width:34px; height:34px; font:400 22px/1 inherit; }.rider { padding-right:48px; }.rider.selected { padding-right:100px; }.rider.selected .rider-add { right:56px; } }
.advanced-filter-modal { position:fixed !important; top:16px; left:50%; margin:0; transform:translateX(-50%); }
.country-option { touch-action:manipulation; }
.country-picker { cursor:text; }
@media(max-width:650px) { .country-options { max-height:min(320px,42vh); }.country-option { min-height:44px; gap:10px; padding:8px 6px; }.country-check { width:22px; height:22px; }.country-chip { min-height:34px; padding:6px 9px; } }
.back-to-top { display:none; }
@media(max-width:650px) { .back-to-top { position:fixed; z-index:30; right:16px; bottom:20px; display:grid; width:44px; height:44px; min-width:0; place-items:center; border:1px solid var(--ink); border-radius:50%; background:var(--paper); color:var(--ink); padding:0; box-shadow:2px 3px 0 rgba(47,49,54,.16); }.back-to-top svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }.back-to-top:hover { background:var(--ink); color:var(--paper); }.back-to-top.hidden { display:none; }.wake-toast:not(.hidden) ~ .back-to-top { bottom:78px; }.mobile-picking .back-to-top,.mobile-dragging .back-to-top { display:none; } }
.cancel-pick { display:none; }
@media(max-width:650px) { .mobile-picking .cancel-pick { position:fixed; z-index:21; top:calc(20px + min(355px,48vh) + 8px); right:10px; display:block; width:auto; min-width:0; border:1px solid var(--ink); border-radius:0; background:var(--ink); padding:6px 12px; color:var(--paper); font:700 11px/1.3 inherit; letter-spacing:.06em; text-transform:uppercase; box-shadow:2px 3px 0 rgba(47,49,54,.18); }.mobile-picking .cancel-pick:hover { border-color:var(--terracotta); background:var(--terracotta); color:var(--paper); } }

.team-icon { display:inline-grid; width:20px; height:20px; flex:none; margin-right:6px; place-items:center; overflow:hidden; vertical-align:middle; }
.team-icon img { width:100%; height:100%; object-fit:contain; }
.team-monogram { border:1px solid var(--line); border-radius:4px; background:var(--beige-tint); color:var(--muted); font-size:8px; font-weight:700; letter-spacing:.02em; }
.country-chip .team-icon { width:17px; height:17px; margin-right:0; }
.country-option .team-icon { margin-right:0; }
.selected-countries.hidden { display:none; }
.team-group h3 { display:flex; align-items:center; flex-wrap:wrap; gap:0 4px; }
.team-group h3 .team-icon { width:22px; height:22px; }

.trend-arrow { display:inline-grid; width:14px; height:14px; margin-left:6px; place-items:center; vertical-align:-2px; }
.trend-arrow svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2.2; }
.trend-up { color:#58774f; }
.trend-down { color:var(--terracotta); }
.trend-flat { color:var(--placeholder); }

.rider-detail-team { display:flex; flex-wrap:wrap; align-items:center; gap:2px 0; margin:0; color:var(--muted); font-size:15px; }
.rider-detail-team-name { display:inline-flex; align-items:center; }
.rider-detail-team .team-icon { width:24px; height:24px; }
.rider-detail-wins::before { content:"·"; margin:0 8px; }
.pcs-link { display:inline-block; margin-top:9px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; font-weight:700; text-decoration:none; }
.pcs-link:hover { border-bottom-color:var(--ink); color:var(--ink); }
.rider-history-legend { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px; margin:12px 0 0; color:var(--muted); font-size:11px; }
.rider-history-legend .result-medal,.rider-history-legend .result-top-ten { width:20px; height:20px; font-size:10px; }
.rider-history-legend .result-top-ten { margin-left:8px; }
.rider-history-legend .result-status { margin-left:8px; }

.result-matrix-wrap { overflow-x:auto; margin-top:14px; }
.result-matrix { border-collapse:collapse; font-size:12px; }
.result-matrix th,.result-matrix td { padding:2px 4px; text-align:center; }
.result-matrix tbody th { text-align:left; }
.result-matrix tbody tr + tr th,.result-matrix tbody tr + tr td { border-top:1px solid var(--beige-tint); }
.matrix-axis { width:100%; border:0; background:transparent; padding:5px 6px; color:var(--muted); font:600 12px inherit; text-align:inherit; white-space:nowrap; }
.matrix-axis:hover:not(:disabled) { background:transparent; color:var(--ink); }
.matrix-axis.on { color:var(--ink); font-weight:800; }
.matrix-axis:disabled { cursor:default; opacity:.5; }
.result-matrix tbody .matrix-axis { padding-left:0; }
.matrix-cell { display:inline-block; width:26px; height:26px; margin:2px; border:1px solid var(--line); background:var(--surface); padding:0; vertical-align:middle; }
button.matrix-cell:hover { border-color:var(--sage); background:var(--sage-tint); }
button.matrix-cell.on { border-color:var(--sage); background:var(--sage); box-shadow:inset 0 0 0 3px var(--surface); }
.matrix-cell.upcoming { border-style:dashed; color:var(--placeholder); line-height:24px; }
.matrix-cell.missing { border-color:transparent; background:transparent; }
.matrix-summary { min-height:1.4em; margin:10px 0 0; font-size:12px; }
.text-button { border:0; border-bottom:1px solid var(--line); background:transparent; margin-left:6px; padding:0; color:var(--muted); font:600 12px inherit; }
.text-button:hover { border-bottom-color:var(--ink); background:transparent; color:var(--ink); }

.profile-filter-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 22px; margin-top:14px; }
.profile-filter { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:8px; min-height:44px; border-bottom:1px solid var(--beige-tint); padding-bottom:8px; }
.profile-filter-label span { display:block; color:var(--ink); font-size:13px; font-weight:700; }
.profile-filter-label small { display:block; color:var(--muted); font-size:10px; line-height:1.2; }
.profile-filter .advanced-range input { width:62px; }
.unit-toggle { display:flex; }
.unit-toggle button { border-color:var(--line); padding:3px 7px; color:var(--muted); font-size:11px; font-weight:600; }
.unit-toggle button + button { border-left:0; }
.unit-toggle button:hover { background:var(--beige-tint); color:var(--ink); }
.unit-toggle button.active { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.profile-filter:not(:has(.unit-toggle)) .advanced-range { grid-column:3; }

.event-guide { position:relative; }

@media(max-width:650px) { .event-help { position:static; }
.event-help-popover { top:calc(100% + 8px); right:auto; left:0; width:min(340px,calc(100vw - 32px)); }
.profile-filter-grid { grid-template-columns:1fr; }
.result-matrix tbody th { position:sticky; left:0; z-index:1; background:var(--paper); }
.matrix-cell { width:30px; height:30px; }
.matrix-axis { white-space:normal; }
.result-matrix tbody .matrix-axis { min-width:88px; }
.rider-detail-team { flex-direction:column; align-items:flex-start; font-size:14px; }
.rider-detail-wins::before,.rider-detail-season::before { content:none; }
 }

.wildcards-block { margin-top:18px; }
.wildcards-heading { display:flex; flex-direction:column; gap:2px; padding:0 4px 8px; color:var(--muted); font-size:11px; line-height:1.35; }
.wildcards-heading .eyebrow { color:var(--ink); }
.picks.wildcards li { min-height:44px; }
.wildcard-mark { color:var(--placeholder); font-size:13px; }
.wildcard-slot.pick-filled .wildcard-mark { color:var(--sage); }
.pick-filled { padding-right:78px !important; }
.pick-multiplier { position:absolute; top:13px; right:32px; color:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; line-height:20px; }
.scoring-teaser { max-width:690px; margin:4px 0 0; color:var(--muted); font-size:14px; line-height:1.35; }
.scoring-teaser a { color:var(--ink); text-decoration-color:var(--line); text-underline-offset:2px; }
.scoring-teaser a:hover { text-decoration-color:var(--ink); }

@media(max-width:650px) { .mobile-dragging .picks .pick-multiplier,.mobile-picking .picks .pick-multiplier { top:4px; right:26px; }
.mobile-dragging .picks-column::before,.mobile-picking .picks-column::before { content:"Choose a Top 10 position or a wildcard slot"; }
.mobile-dragging .wildcards-heading span:last-child,.mobile-picking .wildcards-heading span:last-child { display:none; }
.mobile-dragging .wildcards-block,.mobile-picking .wildcards-block { margin-top:10px; }
 }

.score-summary { margin:4px 0 0; font-size:13px; }
.score-section-title { margin:18px 0 0; font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
.score-section-title + .score-breakdown { margin-top:8px; }
.placement-table .score-row { grid-template-columns:44px minmax(150px,1.5fr) 58px 44px 70px 70px 80px; }
.bonus-table .score-row { grid-template-columns:96px minmax(150px,1.5fr) minmax(110px,1fr) 80px; }
@media(max-width:650px) { .bonus-table .score-row { min-width:520px; } }

.doc-page .shell { max-width:780px; }
.doc { margin-top:10px; color:var(--ink); font-size:15px; line-height:1.55; }
.doc h1 { margin:6px 0 14px; font-size:clamp(34px,6vw,52px); font-weight:600; line-height:1; letter-spacing:-.03em; }
.doc h2 { margin:34px 0 10px; font-size:26px; letter-spacing:-.02em; }
.doc h3 { margin:26px 0 8px; font-size:18px; letter-spacing:-.01em; }
.doc p,.doc ul { margin:0 0 12px; }
.doc ul { padding-left:20px; }
.doc li { margin-bottom:5px; }
.doc a { color:var(--ink); text-decoration-color:var(--line); text-underline-offset:2px; }
.doc a:hover { text-decoration-color:var(--ink); }
.doc hr { margin:34px 0 0; border:0; border-top:1px solid var(--line); }
.doc code { background:var(--beige-tint); padding:1px 5px; font-size:13px; }
.doc pre { overflow-x:auto; margin:0 0 14px; border-left:3px solid var(--sage); background:var(--surface); padding:12px 14px; }
.doc pre code { background:transparent; padding:0; font-size:14px; }
.doc-table { overflow-x:auto; margin:6px 0 16px; }
.doc table { width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums; }
.doc th,.doc td { border-bottom:1px solid var(--line); padding:7px 8px; }
.doc th[style*="right"],.doc td[style*="right"] { white-space:nowrap; }
.doc th { background:var(--beige-tint); font-size:12px; }
.doc-figure { margin:8px 0 18px; border:1px solid var(--line); background:var(--surface); padding:10px 6px 4px; }
.doc-figure svg,.doc-figure img { display:block; width:100%; height:auto; }

/* List tabs: Final first and tinted sage, the templates after it in the
   player's order. Tabs shrink before the strip scrolls, and its scrollbar only
   shows under the pointer. The baseline is painted at the tab foot, so it stays
   put when a scrollbar takes room below the tabs. */
/* The strip scrolls inside the column; it must never widen it. */
.picks-column { min-width:0; }
.list-switcher { position:relative; margin-bottom:12px; }
.list-tabs { position:relative; display:flex; gap:2px; overflow-x:auto; overflow-y:hidden; background:linear-gradient(var(--line),var(--line)) 0 31px / 100% 1px no-repeat; scrollbar-width:thin; scrollbar-color:transparent transparent; }
.list-tabs:hover { scrollbar-color:var(--line) transparent; }
.list-tab-add { position:sticky; z-index:3; right:0; display:grid; flex:none; width:32px; height:32px; min-width:0; place-items:center; border:0; background:var(--paper); box-shadow:inset 0 -1px 0 var(--line); padding:0; color:var(--muted); font-family:inherit; font-size:20px; font-weight:400; line-height:1; }
.list-tab-add:hover { background:var(--beige-tint); color:var(--ink); }
.list-tab-add:focus-visible { outline:1px solid var(--sage); outline-offset:-4px; }
.list-tabs.more-right .list-tab-add::before { content:""; position:absolute; top:0; right:100%; bottom:1px; width:26px; background:linear-gradient(to right,rgba(245,239,230,0),var(--paper)); pointer-events:none; }
.list-tab { position:relative; display:flex; flex:0 1 auto; align-items:center; min-width:54px; max-width:170px; height:32px; border:1px solid transparent; border-bottom:0; box-shadow:inset 0 -1px 0 var(--line); color:var(--muted); font-size:13px; font-weight:600; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:manipulation; }
.list-tab:hover { background:var(--beige-tint); color:var(--ink); }
.list-tab.active { border-color:var(--line); background:var(--paper); color:var(--ink); box-shadow:inset 0 2px 0 var(--ink); }
.list-tab-label { flex:1 1 auto; min-width:0; height:100%; overflow:hidden; border:0; background:transparent; padding:0 10px; color:inherit; font:inherit; text-overflow:ellipsis; white-space:nowrap; }
.list-tab-label:hover { background:transparent; color:inherit; }
.list-tab-label:focus-visible { outline:1px solid var(--sage); outline-offset:-4px; }
.list-tab-close { display:grid; flex:none; width:18px; height:18px; min-width:0; margin:0 5px 0 -5px; place-items:center; border:0; border-radius:50%; background:transparent; padding:0; color:var(--placeholder); font:400 15px/1 inherit; }
.list-tab-close:hover { background:var(--beige-tint); color:var(--terracotta); }
.list-tab.active .list-tab-close { color:var(--muted); }
.list-tab.active:not(.final) { min-width:76px; }
.list-tab.final { position:sticky; z-index:3; left:0; flex:none; background:var(--sage-tint); color:#52604f; font-weight:700; }
.list-tab.final:hover { background:#dce8d5; color:var(--ink); }
.list-tab.final.active { border-color:var(--sage); background:var(--sage-tint); color:var(--ink); box-shadow:inset 0 2px 0 var(--sage); }
.list-tabs.crowded .list-tab { font-size:12px; }
.list-tabs.crowded .list-tab-label { padding:0 7px; }
.list-tabs.crowded .list-tab:not(.active) .list-tab-close { display:none; }
.list-tab.renaming { flex:none; min-width:0; max-width:none; border-color:transparent; background:transparent; }
.list-name-input { flex:none; width:150px; margin:0; padding:4px 8px; border:1px solid var(--ink); background:var(--surface); font-size:13px; }
.list-tab.dragging { z-index:2; border-color:var(--ink); background:var(--paper); box-shadow:inset 0 -1px 0 var(--line),2px 3px 0 rgba(47,49,54,.16); color:var(--ink); cursor:grabbing; }
.list-tabs.reordering { cursor:grabbing; }
.list-menu { position:absolute; z-index:15; display:grid; min-width:140px; padding:4px; border:1px solid var(--line); background:var(--surface); box-shadow:4px 4px 0 rgba(47,49,54,.12); }
.list-menu.hidden { display:none; }
.list-menu button { border:0; background:transparent; padding:7px 10px; color:var(--ink); font:600 13px inherit; text-align:left; }
.list-menu button:hover,.list-menu button:focus-visible { background:var(--beige-tint); color:var(--ink); outline:0; }
@media(max-width:650px) { .list-tab-close { width:26px; height:26px; margin-left:-7px; font-size:17px; }
.list-menu button { min-height:40px; }
 }
.mobile-dragging .list-switcher,.mobile-picking .list-switcher { display:none; }

/* Results: leaderboard table, analyzer and compare. Chart colours: a validated
   slate-blue / terracotta pair for two series, one graded blue for stacks. */
:root { --viz-1:#2f6f9f; --viz-2:#c46a3a; --viz-grid:#e6dccb; --viz-muted:#cbbfae; }
.simulation-leaderboard,#leaderboard { max-width:1040px; }
.lb-table-wrap { overflow-x:auto; }
.lb-table { width:100%; border-collapse:collapse; font-size:14px; }
.lb-table th { border-bottom:1px solid var(--line); background:var(--beige-tint); padding:8px 10px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.04em; text-align:left; text-transform:uppercase; }
.lb-table td { border-bottom:1px solid var(--line); padding:10px; vertical-align:middle; }
.lb-table .numeric { font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.lb-row { cursor:pointer; }
.lb-row:hover td { background:var(--surface); }
.lb-row.selected td { background:var(--sage-tint); }
.lb-row:focus-visible { outline:2px solid var(--sage); outline-offset:-2px; }
.lb-place { width:36px; color:var(--muted); font-variant-numeric:tabular-nums; }
.lb-player { font-weight:700; }
.lb-points { font-weight:700; }
.lb-behind { color:var(--muted); }
.lb-best { display:flex; flex-wrap:wrap; gap:5px; min-width:260px; }
.lb-chip { display:inline-flex; align-items:baseline; gap:6px; border:1px solid var(--line); background:var(--paper); padding:3px 8px; font-size:12px; white-space:nowrap; }
.lb-chip strong { font-variant-numeric:tabular-nums; }
.lb-chip-wildcard { border-color:#e4c6b2; }
.lb-chip-permutation { border-color:#c9d6c1; }
.lb-hint { margin:10px 0 0; font-size:12px; }

.viz-tabs { margin:30px 0 0; padding-bottom:12px; border-bottom:1px solid var(--line); font-size:15px; }
.viz-tabs [role="tab"] { cursor:pointer; }
.viz-tabs [role="tab"].active { color:var(--ink); font-weight:700; }
.viz-tabs [role="tab"]:focus-visible { outline:1px solid var(--sage); outline-offset:3px; }
.viz-panel { padding-top:18px; }
.viz-header { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-bottom:16px; }
.viz-select { display:flex; align-items:center; gap:8px; margin:0; font-size:12px; font-weight:700; }
.viz-select span { color:var(--muted); }
.viz-select select { border:1px solid var(--line); background:var(--surface); padding:6px 8px; color:var(--ink); font:600 14px inherit; }
.viz-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.viz-stat { padding:12px 14px; }
.viz-stat + .viz-stat { border-left:1px solid var(--line); }
.viz-stat-label { display:block; color:var(--muted); font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.viz-stat-value { display:block; margin:4px 0 2px; font-size:26px; font-weight:600; letter-spacing:-.02em; line-height:1.05; }
.viz-stat small { color:var(--muted); font-size:11px; }
.viz-figure { margin:22px 0 0; }
.viz-figure figcaption { font-size:16px; font-weight:700; }
.viz-figure-top { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px 16px; }
.viz-note { margin:4px 0 8px; font-size:12px; }
.viz-scroll { overflow-x:auto; }
.viz-svg { display:block; width:100%; min-width:600px; height:auto; overflow:visible; font-family:'Bricolage Grotesque',Arial,sans-serif; }
.viz-grid { stroke:var(--viz-grid); stroke-width:1; }
.viz-axis { fill:var(--muted); font-size:11px; font-variant-numeric:tabular-nums; }
.viz-axis-strong { fill:var(--ink); font-weight:700; }
.viz-value,.viz-end-label { fill:var(--ink); font-size:12px; font-weight:700; }
.viz-bar { fill:var(--viz-1); }
.viz-bar-total { fill:#1c4f78; }
.viz-zero { stroke:var(--viz-muted); stroke-width:2; stroke-linecap:round; }
.viz-connector,.viz-bracket { stroke:var(--viz-muted); stroke-width:1; }
.viz-divider { stroke:var(--viz-grid); stroke-width:1; }
.viz-line { fill:none; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.viz-dot { stroke:var(--surface); stroke-width:2; }
.viz-crosshair { stroke:var(--muted); stroke-width:1; opacity:0; }
.viz-crosshair.visible { opacity:1; }
.viz-hit,.viz-overlay { fill:transparent; cursor:default; outline:none; }
.viz-hit:hover,.viz-hit:focus-visible { fill:rgba(47,49,54,.05); }
.viz-overlay:focus-visible { stroke:var(--sage); stroke-width:1; }
.viz-segment { stroke:none; }
.viz-legend { display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; margin:0 0 6px; color:var(--ink); font-size:12px; }
.viz-legend-item { display:inline-flex; align-items:center; gap:7px; }
.viz-line-key { display:inline-block; width:16px; height:2px; border-radius:2px; }
.viz-ramp-legend { gap:8px; color:var(--muted); }
.viz-ramp { display:inline-block; width:120px; height:10px; border-radius:2px; }
.viz-tooltip { position:absolute; z-index:60; max-width:280px; border:1px solid var(--line); background:var(--surface); padding:8px 10px; box-shadow:4px 4px 0 rgba(47,49,54,.12); color:var(--muted); font-size:12px; line-height:1.35; opacity:0; pointer-events:none; transition:opacity .12s ease; }
.viz-tooltip.visible { opacity:1; }
.viz-tooltip-row { display:flex; align-items:center; gap:7px; }
.viz-tooltip-row + .viz-tooltip-row { margin-top:3px; }
.viz-tooltip strong { color:var(--ink); font-size:13px; font-variant-numeric:tabular-nums; }
.viz-key { display:inline-block; flex:none; width:12px; height:2px; border-radius:2px; }

.score-details { margin-top:22px; }
.score-details summary { cursor:pointer; font-size:16px; font-weight:700; }
.lineage { margin-top:22px; }
.lineage-wildcard { background:var(--paper); }
.lineage-cut { box-shadow:inset 0 -2px 0 var(--ink); }
.lineage-connector.wildcard { stroke:var(--viz-muted); }
.lineage-connector-dot.wildcard { fill:var(--viz-muted); }

.compare-table { overflow-x:auto; border:1px solid var(--line); }
.compare-row { display:grid; grid-template-columns:52px minmax(150px,1fr) 64px minmax(150px,1fr) 64px; align-items:center; gap:0 10px; min-width:520px; min-height:38px; padding:5px 10px; border-bottom:1px solid var(--line); font-size:13px; }
.compare-row:last-child { border-bottom:0; }
.compare-header { min-height:30px; background:var(--beige-tint); color:var(--muted); font-size:11px; font-weight:700; }
.compare-header .compare-player { color:var(--ink); font-size:13px; }
.compare-label { color:var(--muted); font-variant-numeric:tabular-nums; }
.compare-rider { display:flex; flex-direction:column; min-width:0; font-weight:600; }
.compare-rider span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.compare-rider small { color:var(--muted); font-size:11px; font-weight:400; }
.compare-points { font-variant-numeric:tabular-nums; text-align:right; }
.compare-points.leading { box-shadow:inset 0 -2px 0 var(--sage); }
.compare-section { border-top:1px solid var(--ink); }
.compare-total { background:var(--surface); font-size:15px; }
.compare-total .compare-label { color:var(--ink); font-weight:700; }

@media(max-width:650px) { .viz-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
.viz-stat:nth-child(3) { border-left:0; }
.viz-stat:nth-child(n+3) { border-top:1px solid var(--line); }
.viz-stat-value { font-size:22px; }
.lb-table td,.lb-table th { padding:8px 6px; }
.lb-best { min-width:220px; }
 }

.page-links { display:flex; gap:8px; }
#event-meta a { color:var(--ink); text-underline-offset:2px; }
@media(max-width:650px) { .viz-svg { min-width:660px; }
.viz-axis { font-size:13px; }
.viz-value,.viz-end-label { font-size:14px; }
.viz-scroll { margin:0 -4px; padding-bottom:6px; }
 }
.race-finished .event-guide,.race-finished .scoring-teaser { display:none; }
/* A wildcard pick is tinted terracotta, apart from the sage Top 10 picks. */
.rider.selected.wildcard { border-color:#d7a98c; background:linear-gradient(135deg,#fbf3ec 0%,#f6e6da 56%,#f0d6c4 100%); }
.rider.selected.wildcard:hover { background:linear-gradient(135deg,#f8ece2 0%,#f0dac9 100%); }
.rider.selected.wildcard .rank,.rider.selected.wildcard .pick-position { color:#8c4a28; }
.rider.selected.wildcard .rank-scale::after,.rider.selected.wildcard:hover .rank-scale::after { background:#f3dccd; }
.wildcard-slot.pick-filled .wildcard-mark { color:var(--terracotta); }
.league-controls { display:grid; justify-items:end; gap:3px; width:max-content; max-width:220px; padding:8px 0; text-align:right; }
.league-controls #league-summary { color:var(--ink); font-size:11px; font-weight:700; }
.league-controls #league-counts { color:var(--muted); font-size:10px; }
.league-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px 10px; }
.session-controls .league-actions button { border:0; border-bottom:1px solid var(--line); border-radius:0; padding:2px 0; color:var(--terracotta); font-size:11px; }
.session-controls .league-actions button:hover { border-bottom-color:var(--terracotta); color:var(--ink); }
.session-controls .league-actions button.hidden { display:none; }
.league-invite { margin:12px 0 0; padding:9px 11px; border-left:3px solid var(--sage); background:var(--surface); font-size:13px; }
.join-league-dialog { width:min(390px,calc(100vw - 32px)); border:1px solid var(--line); background:var(--paper); color:var(--ink); padding:24px; box-shadow:8px 10px 0 rgba(47,49,54,.12); }
.join-league-dialog::backdrop { background:rgba(47,49,54,.35); }
.join-league-dialog h2 { font-size:24px; }
.join-league-dialog p { font-size:13px; }
.join-league-dialog label { margin-top:18px; font-size:12px; }
.join-league-dialog input { width:100%; }
.league-dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:16px; }
.league-dialog-actions button { font-size:12px; }
.league-scope { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 18px; margin:16px 0 0; color:var(--muted); font-size:13px; }
.league-scope.hidden { display:none; }
.league-scope div { display:flex; gap:6px; }
.league-scope button { border-color:var(--line); padding:7px 11px; color:var(--muted); font-size:12px; }
.league-scope button.active { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.admin-section { margin:28px 0; }
.admin-section label { display:block; margin:14px 0 5px; font-size:12px; font-weight:700; }
.admin-section input { width:min(100%,650px); }
.admin-table-wrap { width:100%; overflow-x:auto; margin-top:12px; }
.admin-table { width:100%; border-collapse:collapse; font-size:13px; }
.admin-table th,.admin-table td { padding:10px 12px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
.admin-table th { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.admin-table td:last-child { text-align:right; }
.admin-table button { padding:4px 9px; font-size:11px; color:var(--terracotta); }
@media(max-width:650px) { .league-controls { max-width:125px; }.league-actions { gap:3px 8px; } }

/* The mobile picks drawer keeps all thirteen slots visible while browsing. */
.mobile-picks-backdrop,.mobile-picks-handle,.mobile-save { display:none; }
@media(max-width:650px) {
  body:has(#prediction:not(.hidden)) .mobile-picks-handle { position:fixed; z-index:22; top:58%; left:0; display:grid; width:33px; height:96px; place-items:center; border:1px solid #858987; border-left:0; border-radius:0 22px 22px 0; background:rgba(160,164,162,.78); color:var(--ink); padding:0; box-shadow:2px 3px 8px rgba(47,49,54,.22); touch-action:none; }
  body:has(#prediction:not(.hidden)):is(.mobile-picks-open,.mobile-picking,.mobile-dragging) .mobile-picks-handle { display:none; }
  .mobile-picks-handle span { font-size:23px; }
  .mobile-picks-open .mobile-picks-handle span,.mobile-picking .mobile-picks-handle span { transform:rotate(180deg); }
  .mobile-picks-open .mobile-picks-backdrop,.mobile-picking .mobile-picks-backdrop,.mobile-dragging .mobile-picks-backdrop { position:fixed; z-index:19; inset:0; display:block; background:rgba(24,35,30,.28); }
  .mobile-picks-open .picks-column,.mobile-picking .picks-column,.mobile-dragging .picks-column { position:fixed; z-index:20; top:50%; right:10px; bottom:auto; left:10px; height:auto; max-height:calc(100dvh - 24px); overflow-y:auto; transform:translateY(-50%); padding:30px 12px 12px; border:1px solid var(--line); border-radius:12px; background:#faf8f2; box-shadow:0 10px 32px rgba(24,35,30,.22); }
  .mobile-picks-open .list-switcher { display:none; }
  .mobile-picks-open .picks-column::before { content:"Your Top 10 and wildcards"; position:absolute; top:9px; left:12px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.06em; }
  .mobile-picks-open .picks li,.mobile-picking .picks li,.mobile-dragging .picks li,.mobile-picks-open .picks.wildcards li,.mobile-picking .picks.wildcards li,.mobile-dragging .picks.wildcards li { min-height:32px; padding:4px 3px; font-size:13px; line-height:22px; }
  .mobile-picks-open .wildcards-block,.mobile-picking .wildcards-block,.mobile-dragging .wildcards-block { margin-top:8px; }
  .mobile-picks-open .wildcards-heading,.mobile-picking .wildcards-heading,.mobile-dragging .wildcards-heading { padding:0 3px 4px; }
  .mobile-picks-open .wildcards-heading span:last-child,.mobile-picking .wildcards-heading span:last-child,.mobile-dragging .wildcards-heading span:last-child { display:none; }
  .mobile-picks-open .picks-column #clear-picks,.mobile-picking .picks-column #clear-picks,.mobile-dragging .picks-column #clear-picks,.mobile-picks-open .picks-column #revert-actions,.mobile-picking .picks-column #revert-actions,.mobile-dragging .picks-column #revert-actions,.mobile-picks-open .picks-column #save,.mobile-picking .picks-column #save,.mobile-dragging .picks-column #save,.mobile-picks-open .picks-column #prediction-message,.mobile-picking .picks-column #prediction-message,.mobile-dragging .picks-column #prediction-message,.mobile-picks-open .picks-column #final-autosave-control,.mobile-picking .picks-column #final-autosave-control,.mobile-dragging .picks-column #final-autosave-control { display:none; }
  .mobile-picking .cancel-pick { display:none; }
  .mobile-picks-open .picks li.pick-filled,.mobile-picking .picks li.pick-filled { touch-action:pan-y; }
  .mobile-pick-source { opacity:.45; }
  .mobile-pick-target { background:var(--lime) !important; }
  body.mobile-manual-final:has(#prediction:not(.hidden)) #mobile-save { position:fixed; z-index:18; bottom:20px; left:16px; display:grid; width:58px; height:58px; place-items:center; border:1px solid var(--ink); border-radius:50%; background:var(--sage); color:var(--ink); padding:0; box-shadow:2px 3px 0 rgba(47,49,54,.18); font-size:12px; }
  .mobile-picks-open #mobile-save,.mobile-picking #mobile-save,.mobile-dragging #mobile-save { display:none; }
}

/* Favourites: a heart on every rider cell, left of the + button. */
.rider-fav { position:absolute; top:7px; right:34px; display:grid; width:23px; height:23px; min-width:0; place-items:center; border:0; background:transparent; padding:0; color:var(--placeholder); }
.rider-fav svg,.detail-fav svg,.favourites-toggle svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; }
.rider-fav svg { width:16px; height:16px; }
.rider:hover .rider-fav { color:var(--muted); }
.rider-fav:hover,.rider:hover .rider-fav:hover { background:transparent; color:var(--terracotta); }
.rider-fav.on,.rider:hover .rider-fav.on { color:var(--terracotta); }
.rider-fav.on svg,.detail-fav.on svg { fill:currentColor; }
.rider-fav:focus-visible { outline:1px solid var(--terracotta); outline-offset:1px; }
.rider { padding-right:62px; }
.rider.selected { padding-right:106px; }
.rider.selected .rider-fav { right:79px; }
.rider-detail-links { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-top:10px; }
.rider-detail-links .pcs-link { margin-top:0; }
.detail-fav { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:transparent; padding:3px 9px; color:var(--muted); font:700 12px inherit; }
.detail-fav svg { width:14px; height:14px; color:var(--terracotta); }
.detail-fav::after { content:"Add to favourites"; }
.detail-fav.on { border-color:#e4c6b2; color:var(--ink); }
.detail-fav.on::after { content:"Favourite"; }
.detail-fav:hover { border-color:var(--terracotta); background:transparent; color:var(--ink); }

@media(max-width:650px) { .rider-fav { top:5px; right:42px; width:34px; height:34px; }
.rider-fav svg { width:20px; height:20px; }
.rider { padding-right:80px; }
.rider.selected { padding-right:131px; }
.rider.selected .rider-fav { right:93px; }
 }
.rider-selection-label { flex-wrap:wrap; row-gap:2px; }

/* Favourites are pink: the heart, the toggle, and a highlight on the cell. A
   picked favourite keeps its pick colour and gains a pink edge. */
:root { --pink:#c9467a; --pink-line:#e8b3c7; --pink-tint:#f7e1e9; }
.rider-fav:hover,.rider:hover .rider-fav:hover,.rider-fav.on,.rider:hover .rider-fav.on { color:var(--pink); }
.rider-fav:focus-visible { outline-color:var(--pink); }
.detail-fav svg { color:var(--pink); }
.detail-fav.on { border-color:var(--pink-line); }
.detail-fav:hover { border-color:var(--pink); }
.rider.favourite:not(.selected) { border-color:var(--pink-line); background:linear-gradient(135deg,#fdf4f7 0%,#faeaf0 56%,var(--pink-tint) 100%); }
.rider.favourite:not(.selected):hover { background:linear-gradient(135deg,#fbedf2 0%,#f5dbe5 100%); }
.rider.favourite:not(.selected) .rank-scale::after { background:#f9e9ef; }
.rider.favourite.selected { box-shadow:inset 3px 0 0 var(--pink); }
.favourites-toggle { display:inline-flex; align-items:center; gap:5px; margin-left:6px; border:1px solid var(--line); border-radius:0; background:transparent; padding:2px 10px; color:var(--muted); font:600 13px inherit; }
.favourites-toggle svg { width:12px; height:12px; color:var(--pink); }
.favourites-toggle i { color:var(--muted); font-style:normal; font-weight:400; }
.favourites-toggle:hover { border-color:var(--pink); background:transparent; color:var(--ink); }
.favourites-toggle.on { border-color:var(--pink); background:var(--pink-tint); color:var(--ink); }
.favourites-toggle.on svg { fill:var(--pink); }
.favourites-toggle:focus-visible { outline:1px solid var(--pink); outline-offset:2px; }
.favourites-clear { display:inline-grid; width:26px; height:26px; min-width:0; margin-left:2px; place-items:center; border:0; border-radius:50%; background:transparent; padding:0; color:var(--placeholder); vertical-align:middle; }
.favourites-clear svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.favourites-clear:hover { background:var(--pink-tint); color:var(--pink); }
.favourites-clear:focus-visible { outline:1px solid var(--pink); outline-offset:1px; }
@media(max-width:650px) { .favourites-clear { width:34px; height:34px; } .favourites-clear svg { width:18px; height:18px; } }

/* Favourites get their own row under Riders: the toggle, the pulsing add-all
   heart and the broken clear-all heart. */
.favourites-controls { display:flex; flex-wrap:wrap; align-items:center; gap:4px; grid-column:1 / -1; }
.favourites-controls .favourites-toggle { margin-left:0; }
.favourites-add { display:inline-grid; width:26px; height:26px; min-width:0; place-items:center; border:0; border-radius:50%; background:transparent; padding:0; color:var(--pink); }
.favourites-add svg { width:15px; height:15px; fill:var(--pink); stroke:var(--pink); stroke-width:1.7; stroke-linejoin:round; animation:heart-pulse 1.8s ease-in-out infinite; }
.favourites-add:hover { background:var(--pink-tint); color:var(--pink); }
.favourites-add:focus-visible { outline:1px solid var(--pink); outline-offset:1px; }
@keyframes heart-pulse { 0%,55%,100% { transform:scale(1); } 12% { transform:scale(1.2); } 24% { transform:scale(.95); } 36% { transform:scale(1.12); } }
@media(prefers-reduced-motion:reduce) { .favourites-add svg { animation:none; } }
.group-fav { display:inline-grid; width:24px; height:24px; min-width:0; margin-left:2px; place-items:center; border:0; border-radius:50%; background:transparent; padding:0; color:var(--placeholder); vertical-align:middle; }
.group-fav svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; }
.group-fav:hover { background:var(--pink-tint); color:var(--pink); }
.group-fav.on { color:var(--pink); }
.group-fav.on svg { fill:var(--pink); }
.group-fav:focus-visible { outline:1px solid var(--pink); outline-offset:1px; }
@media(max-width:650px) { .favourites-add,.group-fav { width:34px; height:34px; } .favourites-add svg { width:18px; height:18px; } .group-fav svg { width:16px; height:16px; } }

/* Countries and teams share one row of slimmer boxes; a chosen value shows as
   its flag or jersey alone, and the × clears the whole filter. */
.picker-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.picker-cell { display:grid; align-content:start; gap:5px; min-width:0; }
.picker-row .country-picker { gap:6px; padding:1px 6px 1px 8px; }
.picker-row .country-search-field { gap:6px; }
.picker-row .country-search-field span { font-size:13px; }
.picker-row .country-search-field input { padding:5px 0; font-size:12px; }
.picker-row .country-filter-label { font-size:12px; }
.country-filter-label.hidden { display:none; }
.picker-clear { display:grid; width:20px; height:20px; min-width:0; place-items:center; border:0; border-radius:50%; background:transparent; padding:0; color:var(--muted); font:400 16px/1 inherit; }
.picker-clear:hover { background:var(--beige-tint); color:var(--terracotta); }
.picker-clear.hidden { display:none; }
.picker-row .country-options { right:auto; width:max-content; min-width:calc(100% + 2px); max-width:min(340px,calc(100vw - 32px)); }
.picker-row .team-picker .country-options { right:-1px; left:auto; }
.picker-row .selected-countries { gap:4px; padding:0; }
.icon-chip { width:26px; height:26px; justify-content:center; border-color:var(--line); background:var(--surface); padding:0; }
.icon-chip:hover { border-color:var(--terracotta); background:var(--surface); }
.icon-chip .flag,.icon-chip .team-icon { width:18px; height:18px; }

/* One UCI filter, read in points (the default) or in rank. */
.uci-filter { grid-template-columns:170px minmax(130px,1fr); }
.range-label .range-edit-line { display:flex; align-items:baseline; gap:0; color:var(--muted); font-size:13px; font-weight:400; }
.range-label .range-edit-line span { color:var(--muted); font-size:13px; font-weight:400; }
.range-label .range-edit-line .range-sep { margin:0 6px; }
.range-label .range-edit-line .range-unit { margin-left:4px; }
.filters .range-edit { flex:none; width:4ch; min-width:0; border:0; border-bottom:1px dashed var(--line); border-radius:0; background:transparent; padding:0 1px; color:var(--ink); font-family:inherit; font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; text-align:left; -moz-appearance:textfield; appearance:textfield; }
.filters .range-edit::-webkit-inner-spin-button,.filters .range-edit::-webkit-outer-spin-button { margin:0; -webkit-appearance:none; }
.filters .range-edit::placeholder { color:var(--placeholder); font-weight:400; opacity:1; }
.filters .range-edit:hover { border-bottom-color:var(--muted); }
.filters .range-edit:focus { border-bottom:1px solid var(--sage); outline:0; background:var(--surface); }
.uci-filter [data-uci-panel].hidden { display:none; }
.uci-filter-title { display:flex; align-items:center; gap:6px; }
.uci-filter .unit-toggle button { padding:1px 6px; font-size:10px; line-height:1.3; }
@media(max-width:650px) { .uci-filter { grid-template-columns:1fr; }
.filters .range-edit,.range-label .range-edit-line,.range-label .range-edit-line span { font-size:16px; }
.uci-filter .unit-toggle button { padding:4px 9px; font-size:12px; }
.picker-clear { width:30px; height:30px; margin-right:-4px; }
.icon-chip { width:32px; height:32px; min-height:0; padding:0; }
 }