:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#f6f5f1;background:#0c0c0f;--primary:#241773;--accent:#9e7c0c;--highlight:#e4bd62;--ink:#100e12}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% -10%,color-mix(in srgb,var(--primary) 55%,transparent),transparent 50%);min-height:100vh}main{max-width:1120px;margin:auto;padding:54px 32px 30px}header{position:relative;padding-bottom:35px}.kicker{font-size:.7rem;letter-spacing:.18em;font-weight:800;color:var(--highlight);text-transform:uppercase}h1{font-size:clamp(3rem,7vw,5.8rem);font-weight:800;letter-spacing:-.065em;line-height:1.02;margin:22px 0}p{color:#b8b8c3;line-height:1.65}.lede{font-size:1.05rem}.edition{position:absolute;right:0;top:8px;font-size:.65rem;letter-spacing:.12em;color:#b8b8c3}.edition span{display:inline-block;border:1px solid #45434c;padding:6px 10px;margin-left:12px;border-radius:99px}button,select,textarea{font:inherit}button,select{border-radius:9px;padding:12px 16px}button{cursor:pointer;border:1px solid transparent;background:var(--highlight);color:var(--ink);font-weight:750;transition:transform .15s,background .15s}button:hover{filter:brightness(1.1)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}.secondary{background:#25252c;border-color:#41414c;color:#eeeef2}#team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:2px 0 28px}.team-tile{position:relative;text-align:left;background:#151519;border:1px solid #36363e;color:#f6f5f1;padding:20px;overflow:hidden}.team-tile:before{content:'';position:absolute;inset:0 auto 0 0;width:4px;background:var(--tile-color)}.team-tile[aria-pressed=true]{border-color:var(--tile-color);background:color-mix(in srgb,var(--tile-color) 10%,#141418)}.team-tile strong{display:block;font-size:1.2rem;margin:12px 0 5px}.team-tile small{font-size:.75rem;color:#b8b8c3;font-weight:400}.team-code{font-weight:900;font-size:.7rem;letter-spacing:.1em;color:var(--tile-color)}.workspace{border-top:1px solid #34343c}.controls{display:flex;align-items:center;gap:16px;padding:24px 0;flex-wrap:wrap}.controls label{display:flex;flex-direction:column;gap:6px;font-size:.7rem;color:#b8b8c3;text-transform:uppercase;letter-spacing:.1em}select{background:#19191e;color:#fff;border:1px solid #41414c;font-size:.85rem;text-transform:none;letter-spacing:0;min-height:44px}.filter-info{flex:1;display:grid;gap:5px;font-size:.8rem;min-width:145px}.filter-info small{font-size:.68rem;color:#9d9da9}.panel{border:1px solid #34343c;background:linear-gradient(135deg,#19191f,#111115);border-radius:18px;padding:clamp(20px,4vw,40px)}h2{font-size:clamp(1.65rem,3vw,2.3rem);letter-spacing:-.04em;margin:12px 0}.panel p{margin:8px 0 20px}#intro{padding:45px 40px}.how{display:flex;gap:35px;margin:35px 0;font-size:.85rem}.how b{color:var(--highlight);font-size:.7rem;margin-right:8px}.muted{color:#aaaab7;font-size:.85rem}.match-heading{text-align:center}.match{display:grid;grid-template-columns:1fr 1fr;gap:30px;position:relative}.versus{position:absolute;z-index:2;left:50%;top:42%;transform:translate(-50%,-50%);background:#121217;border:1px solid #55545d;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;color:#b7b7c3;font-size:.65rem;font-weight:800;pointer-events:none}.player{display:flex;flex-direction:column;text-align:left;padding:0;overflow:hidden;background:#16161d;border:1px solid #45434e;color:white;border-radius:14px}.player:hover{transform:translateY(-3px);border-color:var(--highlight)}.portrait{height:270px;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--primary) 65%,#34343c),#101014 95%)}.portrait:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(120deg,transparent 0 45px,#ffffff03 45px 46px);pointer-events:none}.portrait img,.rank-thumb img{width:100%;height:100%;object-fit:contain}.fallback{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;clip-path:polygon(24% 0,38% 0,42% 5%,58% 5%,62% 0,76% 0,100% 22%,85% 42%,74% 33%,74% 100%,26% 100%,26% 33%,15% 42%,0 22%);width:240px;height:235px;background:var(--primary);border-bottom:8px solid var(--accent);color:#fff;filter:drop-shadow(0 12px 18px #0008)}.jersey-number{font-size:6.5rem;line-height:1;font-weight:900;letter-spacing:-.07em;text-shadow:3px 3px var(--accent);font-variant-numeric:tabular-nums}.jersey-team{font-size:.6rem;letter-spacing:.3em;margin-top:12px;color:#fff}.player-body{padding:22px;display:flex;flex:1;flex-direction:column;gap:9px}.player-meta{font-size:.75rem;color:var(--highlight);letter-spacing:.08em}.player-name{font-size:clamp(1.25rem,2.7vw,1.9rem);letter-spacing:-.035em;line-height:1.15}.player-team{font-size:.8rem;color:#aaaab7;font-weight:400}.pick-label{display:block;text-align:center;margin-top:15px;padding:13px;background:var(--highlight);border-radius:7px;color:var(--ink);font-size:.85rem}.progress-track{height:5px;border-radius:10px;background:#36343f;margin:12px 0 28px;overflow:hidden}#progressbar{height:100%;background:var(--highlight);transition:width .2s}#progress{font-size:.75rem;color:#aaaab7}.below-match{display:flex;align-items:center;justify-content:space-between;margin-top:24px;gap:12px}.footnote{text-align:center;margin-bottom:0!important;font-size:.75rem}.source-line{display:flex;justify-content:space-between;gap:15px;padding:22px 0;color:#aaaab7;font-size:.72rem;flex-wrap:wrap}a{color:var(--highlight);text-underline-offset:4px}footer{border-top:1px solid #34343c;padding-top:28px;margin-top:20px;font-size:.72rem;color:#aaaab7}footer strong{color:#d6d6df}footer p{max-width:850px}#rankings{list-style:none;padding:0}.rank{display:flex;align-items:center;gap:18px;border-bottom:1px solid #33323b;padding:13px 0}.rank-num{color:var(--highlight);font-weight:800;width:30px;font-size:.85rem}.rank-thumb{height:52px;width:48px;background:#25252e;border-radius:5px;display:grid;place-items:center;overflow:hidden}.fallback.small{clip-path:none;border:0;background:none;width:auto;height:auto;filter:none}.small .jersey-number{font-size:1.5rem;letter-spacing:0}.rank-text{display:grid;gap:4px}.rank-text small{color:#aaaab7;font-size:.72rem}.result-actions{display:flex;gap:10px;flex-wrap:wrap}textarea{width:100%;height:200px;background:#15151b;color:white;padding:14px;border:1px solid #555}#storage-note{border:1px solid var(--highlight);padding:12px;color:#eee}.keyboard{font-size:.75rem}[hidden]{display:none!important}@media(max-width:760px){main{padding:30px 18px}.edition{position:static;display:block;margin-top:20px}.controls{gap:12px}.filter-info{flex-basis:100%;order:3}.controls label:first-child{flex:1}select{width:100%}#team-grid{gap:8px}.team-tile{padding:14px 10px}.team-tile strong{font-size:.95rem}.team-tile small{font-size:.65rem}.portrait{height:220px}.fallback{width:190px;height:190px}.jersey-number{font-size:5rem}.player-body{padding:15px}.how{gap:15px;flex-wrap:wrap}}@media(max-width:480px){main{padding:25px 12px}#team-grid{grid-template-columns:repeat(2,1fr)}.team-tile strong{margin-top:7px}.controls button{flex:1;font-size:.8rem}.panel{padding:20px 12px}#intro{padding:28px 20px}.match{gap:12px}.portrait{height:175px}.fallback{width:150px;height:155px}.jersey-number{font-size:4rem}.jersey-team{font-size:.5rem}.player-body{padding:12px 10px}.player-name{font-size:1.12rem}.player-meta{font-size:.65rem}.player-team{font-size:.65rem}.pick-label{padding:11px 4px;font-size:.7rem}.versus{width:28px;height:28px;font-size:.5rem;top:38%}.kicker{font-size:.6rem}.keyboard{display:none}.how{display:grid;gap:15px}.source-line{line-height:1.6}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Keep choices aligned when names wrap, and give long team names room on phones. */
.player .pick-label{margin-top:auto}.player-team{margin-bottom:15px}
@media(max-width:480px){.controls label:first-child{flex:1 1 100%}.controls label:nth-child(2){flex:1}.controls #reset{align-self:flex-end;flex:1}}

.division-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:6px 0 18px}
#division-picker{display:flex;gap:6px;padding:5px;background:#16161c;border:1px solid #36363e;border-radius:12px}
.division-button{background:transparent;color:#b8b8c3;padding:11px 18px;font-size:.85rem;border:1px solid transparent}
.division-button[aria-pressed=true]{background:#30303a;color:#fff;border-color:#555560}
#division-summary{font-size:.75rem;color:#aaaab7}
@media(max-width:480px){.division-row{gap:10px}#division-picker{width:100%}.division-button{flex:1}#division-summary{font-size:.7rem}}

@media(max-width:480px){.division-button{min-width:0;padding:11px 8px;font-size:.74rem;white-space:nowrap}}

@media(max-width:600px){#division-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.division-button{min-width:0;padding:11px 14px;font-size:.8rem;white-space:nowrap}}

.export-panel{margin-top:32px;padding-top:28px;border-top:1px solid #41414c}
.export-heading{display:flex;align-items:start;justify-content:space-between;gap:20px}
.export-heading h3{font-size:1.6rem;letter-spacing:-.035em;margin:8px 0 16px}
.export-heading p{font-size:.8rem;max-width:300px}
.export-controls{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin:12px 0 16px}
.export-controls label{display:flex;flex-direction:column;gap:7px;color:#b8b8c3;font-size:.75rem}
.export-controls select{width:100%;min-width:0}
.export-actions,.export-pages{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.export-pages{justify-content:center;margin:16px 0}.export-pages span{font-size:.8rem;color:#c4c7d2}
.export-preview-wrap{display:flex;justify-content:center;background:#090a0e;border-radius:12px;overflow:hidden}
.export-preview-wrap:empty{display:none}
#export-preview-image{max-width:100%;width:auto;max-height:720px;height:auto;object-fit:contain;display:block}
.export-note{font-size:.7rem;color:#a5a8b5;line-height:1.6;margin-bottom:0!important}
#export-status{font-size:.78rem;min-height:1.5em}
@media(max-width:700px){.export-heading{display:block}.export-heading p{max-width:none}.export-controls{grid-template-columns:1fr 1fr}.export-controls label:first-child{grid-column:1/-1}.export-actions button{flex:1;min-width:120px;font-size:.8rem}.export-pages button{font-size:.75rem;padding:10px 12px}.export-heading h3{font-size:1.4rem}}

.mobile-export .export-controls{grid-template-columns:1fr 1fr}
.mobile-export .export-controls label:first-child{grid-column:auto}
.mobile-export #export-type-field,.mobile-export #export-all{display:none!important}
.mobile-export #export-preview-image{-webkit-touch-callout:default;user-select:auto;-webkit-user-select:auto;touch-action:auto}
.mobile-export .export-actions button{flex:1;min-height:46px}
.mobile-export .export-note{font-size:.78rem}
@media(max-width:380px){.mobile-export .export-controls{grid-template-columns:1fr}.mobile-export .export-actions button{min-width:100px}}

#conference-picker{display:flex;gap:8px;margin:2px 0 18px}
.conference-button{background:#17171d;color:#b8b8c3;border:1px solid #3d3d46;min-width:100px;padding:12px 24px;font-size:.9rem;letter-spacing:.08em}
.conference-button[aria-pressed=true]{background:#f2f1ed;color:#141419;border-color:#f2f1ed}
@media(max-width:600px){#conference-picker{width:100%;gap:8px}.conference-button{flex:1;min-width:0}}

/* Fresh: permanent visual design. */
 :root{font-family:'DM Sans',system-ui,sans-serif;background:#171c24}
html body{
 background:radial-gradient(ellipse 115% 850px at 100% 0%,color-mix(in srgb,var(--primary) 16%,#232a34) 0%,#1b222c 48%,#151b23 100%);
 color:#f5f2e9;
}
html h1,html h2,html h3,html .player-name,html .team-tile strong{
 font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-weight:700;letter-spacing:-.015em;
}
html h1{font-size:clamp(4.2rem,10vw,8rem);line-height:.86;text-transform:uppercase;max-width:780px;margin:25px 0 28px}
html h1 em{font-style:normal;color:var(--highlight)}
html .kicker{letter-spacing:.16em}
html .lede{font-size:1rem;line-height:1.7;color:#c2c9d3}
html .edition{font-family:'DM Sans',sans-serif;color:#bdc5d0}
html h2{font-size:clamp(2rem,4vw,3rem)}
html .panel{background:#202833;border-color:#ffffff16;border-radius:22px;box-shadow:0 14px 45px #080e151c}
html .workspace{border-color:#ffffff22}
html button{
 transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,border-color .18s,background .18s;
}
html button:enabled:active{transform:translateY(2px) scale(.975);box-shadow:none}
html button:focus-visible{outline:3px solid var(--highlight);outline-offset:4px}
html .secondary{background:#303b49;border-color:#ffffff20}
html select{background:#202a36;border-color:#ffffff2b;color:#f5f2e9;border-radius:12px}
html #conference-picker{gap:10px}
html .conference-button{border-radius:99px;background:transparent;border-color:#ffffff32;min-width:112px;font-size:.8rem}
html .conference-button[aria-pressed=true]{background:var(--highlight);border-color:var(--highlight);color:#131923;box-shadow:0 4px 16px #0002}
html #division-picker{background:#18202a;border-color:#ffffff18;border-radius:15px}
html .division-button{border-radius:10px;color:#c3cbd8}
html .division-button[aria-pressed=true]{background:#344252;border-color:#ffffff27;color:#fff;box-shadow:inset 0 -3px var(--highlight)}
html .team-tile{background:#242e3a;border-color:#ffffff20;border-radius:17px;padding:22px 20px;box-shadow:0 8px 24px #0b11191c}
html .team-tile:before{inset:14px auto 14px 0;width:3px;border-radius:0 4px 4px 0}
html .team-tile:after{content:'↗';position:absolute;top:18px;right:17px;color:var(--tile-color);font-size:1.25rem;opacity:.55;transition:transform .18s,opacity .18s}
html .team-tile strong{font-size:1.8rem;margin:12px 0 5px}
html .team-tile[aria-pressed=true]{background:color-mix(in srgb,var(--tile-color) 9%,#273340);border-color:var(--tile-color)}
html .team-tile[aria-pressed=true]:after{content:'✓';opacity:1}
html .portrait{background:radial-gradient(ellipse at 50% 65%,color-mix(in srgb,var(--primary) 23%,#344252),#27313e 85%)}
html .portrait:after{background:repeating-linear-gradient(125deg,transparent 0 62px,#ffffff04 62px 63px)}
html .player{background:#25313f;border-color:#ffffff24;border-radius:19px;box-shadow:0 9px 24px #0b111921}
html .player-name{font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.02}
html .player-team{color:#c1cbd8}
html .pick-label{border-radius:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;transition:box-shadow .18s,transform .18s}
html .versus{background:#26313e;border-color:#697787;color:#f3f0e8}
html .progress-track{height:6px;background:#ffffff16}
html .rank{border-color:#ffffff16}
html .rank-thumb{background:#344252}
html .muted,html .source-line{color:#b7c2d0}
@media(hover:hover){
 html button:enabled:hover{filter:none;transform:translateY(-2px);box-shadow:0 7px 20px #070e192b}
 html .team-tile:hover{border-color:var(--tile-color);background:#2c3948}
 html .team-tile:hover:after{transform:translate(2px,-2px);opacity:1}
 html .player:hover{transform:translateY(-5px);border-color:var(--highlight);background:#2a3848;box-shadow:0 18px 32px #070e1933}
 html .player:hover .pick-label{box-shadow:0 0 0 3px color-mix(in srgb,var(--highlight) 22%,transparent)}
}
@media(max-width:600px){
 html h1{font-size:clamp(2.65rem,12.8vw,5rem)}
 html .team-tile{padding:16px 14px}
 html .team-tile strong{font-size:1.6rem}
 html .player-name{font-size:1.5rem}
 html .player-body{padding:14px 10px}
}
@media(prefers-reduced-motion:reduce){
 html *,html *:before,html *:after{transition:none!important;animation:none!important}
 html button:enabled:hover,html button:enabled:active{transform:none!important}
}

/* Align labels above a shared control baseline; keep actions together at every width. */
html .controls{display:grid;grid-template-columns:minmax(200px,1.3fr) minmax(150px,.8fr) minmax(150px,1fr) auto;align-items:end;gap:16px;padding:24px 0}
html .controls label{min-width:0;gap:8px}
html .controls select{width:100%;min-width:0;height:48px}
html .controls .filter-info{min-width:0;min-height:48px;align-content:center}
html .control-actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:16px;align-items:stretch;min-width:0;width:340px}
html .controls .control-actions button{height:48px;margin:0;padding:12px;min-width:0;align-self:stretch;white-space:nowrap}
@media(hover:hover){html .controls button:enabled:hover{transform:none}}
@media(max-width:1000px){
 html .controls{grid-template-columns:repeat(2,minmax(0,1fr))}
 html .controls .filter-info{grid-column:1/-1;order:0;min-height:0}
 html .control-actions{grid-column:1/-1;width:100%}
}

/* Focus the comparison while keeping team navigation and aligned controls available. */
.compact-brand{display:none}
body[data-view=sorting] header,body[data-view=results] header{padding-bottom:22px}
body[data-view=sorting] header h1,body[data-view=results] header h1,
body[data-view=sorting] header .lede,body[data-view=results] header .lede,
body[data-view=sorting] header .edition,body[data-view=results] header .edition{display:none}
body[data-view=sorting] .compact-brand,body[data-view=results] .compact-brand{display:block;font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:1.65rem;font-weight:700;color:#f5f2e9;margin:0 0 8px;line-height:1.1}
.progress-summary{display:flex;justify-content:space-between;align-items:center;gap:16px}
#progress{line-height:1.6}
#progress-estimate{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:2rem;color:var(--highlight);flex-shrink:0}
html #sort .progress-milestone{font-size:.75rem;color:#c2c9d3;margin:2px 0 8px}
.results-spotlight{margin:28px 0 32px}
.results-share{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
#share-ranking{min-height:48px}
#top-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:0}
.podium-card{min-width:0;display:flex;flex-direction:column;gap:8px;padding:16px;background:#273442;border:1px solid #ffffff20;border-radius:16px}
.podium-card:first-child{border-color:var(--highlight);background:linear-gradient(155deg,color-mix(in srgb,var(--primary) 18%,#303d4c),#273442)}
.podium-photo{height:180px;display:grid;place-items:center;overflow:hidden}
.podium-photo img{width:100%;height:100%;object-fit:contain}
.podium-photo .fallback{width:150px;max-width:100%;height:160px}
.podium-photo .jersey-number{font-size:4rem}
.podium-place{color:var(--highlight);font-weight:800;font-size:.75rem;letter-spacing:.1em}
.podium-name{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:1.8rem;line-height:1.08;overflow-wrap:anywhere}
.podium-meta{font-size:.75rem;color:#bdc8d6}
.full-ranking-heading{font-size:1.65rem;margin:0 0 16px}
#export-panel{scroll-margin-top:24px}
@media(max-width:600px){
 #top-three{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .podium-card{padding:12px}
 .podium-card:first-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(80px,110px) minmax(0,1fr);align-content:center;column-gap:16px}
 .podium-card:first-child .podium-photo{grid-row:1/4;height:130px}
 .podium-card:first-child .podium-place{align-self:end}
 .podium-card:first-child .podium-meta{align-self:start}
 .podium-photo{height:120px}
 .podium-photo .fallback{height:110px;width:110px}
 .podium-photo .jersey-number{font-size:3rem}
 .podium-name{font-size:1.5rem}
 .results-share{align-items:stretch}
 #share-ranking{width:100%}
}

/* Team identity uses brand colors; pale highlights remain reserved for readable text. */
html .team-tile:before{
 width:6px;inset:0 auto 0 0;border-radius:0;
 background:linear-gradient(to bottom,var(--tile-primary) 0 70%,var(--tile-accent) 70% 100%);
}
html .team-tile[aria-pressed=true]{
 background:linear-gradient(125deg,color-mix(in srgb,var(--tile-primary) 72%,#25313f),#25313f);
 border-color:var(--tile-color);
 box-shadow:inset 0 -3px var(--tile-accent),0 8px 24px #0b11191c;
}
@media(hover:hover){
 html .team-tile:hover{background:color-mix(in srgb,var(--tile-primary) 28%,#273340)}
 html .team-tile[aria-pressed=true]:hover{background:linear-gradient(125deg,color-mix(in srgb,var(--tile-primary) 80%,#25313f),#2c3948)}
}

/* Favorite actions use the team's exact primary color with contrasting text. */
html .pick-label{background:var(--primary);color:var(--pick-ink,#fff);border:1px solid #ffffff26}

/* A quiet creator credit stays visible in the full and compact headers. */
html .builder-credit{font-size:.72rem;line-height:1.5;font-weight:400;letter-spacing:.02em;color:#aab4c0;margin:16px 0 0}
html .builder-credit a{color:#c4cdd8;font-weight:600;text-decoration:none}
html .builder-credit a:hover,html .builder-credit a:focus-visible{text-decoration:underline;text-underline-offset:3px}

html .results-spotlight .builder-credit{margin:0 0 18px}

/* Sport tabs share the established conference-control language. */
#sport-picker{display:flex;gap:10px;max-width:400px;margin:4px 0 22px}
.sport-button{flex:1;min-height:48px;border-radius:13px;border:1px solid #ffffff32;background:#202b38;color:#bdc8d6;font-size:1rem;letter-spacing:.1em}
.sport-button[aria-pressed=true]{background:var(--highlight);color:#131923;border-color:var(--highlight);box-shadow:inset 0 -3px #0002}
body[data-sport=NBA] #team-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:1000px){body[data-sport=NBA] #team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){#sport-picker{max-width:none}body[data-sport=NBA] #team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-sport=NBA] #team-grid .team-tile:last-child{grid-column:1/-1}}

@media(max-width:600px){body[data-sport=NBA] #division-picker .division-button:last-child:nth-child(odd){grid-column:1/-1}}

/* Ranking links stay alongside existing image sharing in every appearance. */
.roster-date{font-size:.76rem;line-height:1.5;margin:-10px 0 22px;opacity:.75}
.ranking-share-actions{display:flex;gap:10px;flex-wrap:wrap}
.ranking-share-actions button{white-space:nowrap}
.shared-notice{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid currentColor;border-radius:14px;padding:14px 18px;margin:18px 0}
.shared-notice p{margin:0;font-size:.85rem}
.shared-status{padding:12px 16px;border:1px solid currentColor;border-radius:12px;font-size:.85rem}
.ranking-link{box-sizing:border-box;display:block;width:100%;min-width:0;padding:12px;border-radius:10px;font:inherit;background:transparent;color:inherit;border:1px solid currentColor;margin:12px 0}
#link-status{font-size:.82rem}
#link-status:empty{display:none}
[hidden]{display:none!important}
@media(max-width:700px){.results-share{align-items:flex-start}.ranking-share-actions{width:100%}.ranking-share-actions button{flex:1;font-size:.82rem;padding:12px 10px}.shared-notice{align-items:flex-start;flex-direction:column;gap:12px}.roster-date{margin-top:-6px}}

.roster-history{margin:0 0 20px;font-size:.8rem}
.roster-history summary{cursor:pointer;opacity:.8}
.roster-history>div{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-top:12px}
.roster-history label{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.roster-history select{min-width:0;max-width:100%;width:100%}
#saved-roster-note{font-size:.82rem;margin-top:0}
@media(max-width:480px){.roster-history>div{align-items:stretch;flex-direction:column}}

#ranking-mode{display:flex;gap:4px;width:max-content;max-width:100%;padding:4px;margin:-8px 0 24px;border:1px solid color-mix(in srgb,currentColor 18%,transparent);border-radius:14px}
.mode-button{min-height:42px;padding:9px 20px;border-radius:10px;background:transparent;color:inherit;font-size:.83rem}
.mode-button[aria-pressed=true]{background:var(--highlight);color:#101014;box-shadow:0 3px 12px #0002}
#league-position-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:2px 0 28px}
html .position-tile strong{font-size:1.5rem}
body[data-ranking-mode=positions] .controls{grid-template-columns:minmax(180px,1fr) minmax(160px,1fr) auto}
.rank-text{min-width:0}
@media(max-width:760px){body[data-ranking-mode=positions] .controls{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-ranking-mode=positions] #position-field{grid-column:1/-1}}
@media(max-width:480px){#league-position-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}html .position-tile strong{font-size:1.2rem}.mode-button{padding:10px 16px}}