/* Player stats tables: avatar + name (aligned with Survivors v2–style thumbnails) */ /* * JS (styleBootstrapTable / applyTableStylingWithoutSorting) used to set table overflow:hidden — that * clips the scaled avatar inside the table box. Force visible on player-stats table ids. * Team stats page reuses id #playerstable on the scroll wrapper div (not the ); overflow must * stay scrollable there — see chalksta-teamstats.css / .chalksta-tst-table-scroll. */ body:not(.chalksta-page-teamstats) #playerstable, #playerstable-tourny, #playerstable_single, #playerstable_lifetime, #playerstablebydiv_formatted { overflow: visible !important; width: max-content; max-width: none; } /* Stat columns: compact width; horizontal scroll when many columns exceed viewport */ #playerstable thead th:nth-child(n + 3), #playerstable tbody td:nth-child(n + 3), #playerstable-tourny thead th:nth-child(n + 3), #playerstable-tourny tbody td:nth-child(n + 3), #playerstable_single thead th:nth-child(n + 3), #playerstable_single tbody td:nth-child(n + 3), #playerstable_lifetime thead th:nth-child(n + 3), #playerstable_lifetime tbody td:nth-child(n + 3), #playerstablebydiv_formatted thead th:nth-child(n + 3), #playerstablebydiv_formatted tbody td:nth-child(n + 3) { width: 1%; white-space: nowrap; } /* Wide: full names */ #playerstable.ps-table-wide thead th:nth-child(2), #playerstable.ps-table-wide tbody td:nth-child(2), #playerstable-tourny.ps-table-wide thead th:nth-child(2), #playerstable-tourny.ps-table-wide tbody td:nth-child(2), #playerstable_single.ps-table-wide thead th:nth-child(2), #playerstable_single.ps-table-wide tbody td:nth-child(2), #playerstable_lifetime.ps-table-wide thead th:nth-child(2), #playerstable_lifetime.ps-table-wide tbody td:nth-child(2), #playerstablebydiv_formatted.ps-table-wide thead th:nth-child(2), #playerstablebydiv_formatted.ps-table-wide tbody td:nth-child(2) { width: auto; max-width: none; } /* Narrow: 90% longest-name rail */ #playerstable.ps-table-narrow thead th:nth-child(2), #playerstable.ps-table-narrow tbody td:nth-child(2), #playerstable-tourny.ps-table-narrow thead th:nth-child(2), #playerstable-tourny.ps-table-narrow tbody td:nth-child(2), #playerstable_single.ps-table-narrow thead th:nth-child(2), #playerstable_single.ps-table-narrow tbody td:nth-child(2), #playerstable_lifetime.ps-table-narrow thead th:nth-child(2), #playerstable_lifetime.ps-table-narrow tbody td:nth-child(2), #playerstablebydiv_formatted.ps-table-narrow thead th:nth-child(2), #playerstablebydiv_formatted.ps-table-narrow tbody td:nth-child(2) { width: var(--ps-name-col-w); max-width: var(--ps-name-col-w); } #playerstable.ps-table-narrow .playerstats-name-text, #playerstable-tourny.ps-table-narrow .playerstats-name-text, #playerstable_single.ps-table-narrow .playerstats-name-text, #playerstable_lifetime.ps-table-narrow .playerstats-name-text, #playerstablebydiv_formatted.ps-table-narrow .playerstats-name-text { max-width: var(--ps-name-text-max); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #playerstable thead th:nth-child(2), #playerstable tbody td:nth-child(2), #playerstable-tourny thead th:nth-child(2), #playerstable-tourny tbody td:nth-child(2), #playerstable_single thead th:nth-child(2), #playerstable_single tbody td:nth-child(2), #playerstable_lifetime thead th:nth-child(2), #playerstable_lifetime tbody td:nth-child(2), #playerstablebydiv_formatted thead th:nth-child(2), #playerstablebydiv_formatted tbody td:nth-child(2) { min-width: var(--ps-name-col-w, 8.5rem); } .table-responsive:has(#playerstable), .table-responsive:has(#playerstable-tourny), .table-responsive:has(#playerstable_single), .table-responsive:has(#playerstable_lifetime), .table-responsive:has(#playerstablebydiv_formatted) { overflow-x: auto !important; overflow-y: visible !important; } /* Keep every cell vertically centered when the name column is taller (avatar row). */ #playerstable tbody td, #playerstable-tourny tbody td, #playerstablebody td, #playerstablebody-tourny td, #playerstable_single tbody td, #playerstable_lifetime tbody td, #playerstablebydiv_formatted tbody td { vertical-align: middle !important; } #playerstable thead th, #playerstable-tourny thead th, #playerstable_single thead th, #playerstable_lifetime thead th, #playerstablebydiv_formatted thead th { vertical-align: middle; } /* Override styleBootstrapTable() inline line-height on name cells (reduces stray line-box height). */ #playerstable tbody td.playerstats-name-td, #playerstable-tourny tbody td.playerstats-name-td, #playerstablebody td.playerstats-name-td, #playerstablebody-tourny td.playerstats-name-td, #playerstable_single tbody td.playerstats-name-td, #playerstable_lifetime tbody td.playerstats-name-td, #playerstablebydiv_formatted tbody td.playerstats-name-td { line-height: 1 !important; } .playerstats-name-td { text-align: left !important; vertical-align: middle; overflow: visible !important; position: relative; } .playerstats-name-cell { display: flex; align-items: center; gap: 8px; max-width: 100%; min-height: 0; text-align: left; } /* Favorite star (injected first) stays on the same row as avatar + name */ .playerstats-name-cell > a:first-child { flex-shrink: 0; align-self: center; } /* * Favorite toggle only (not the name link when no star): zoom with avatar on row hover; * origin at right so growth goes left (away from avatar). Stacking above enlarged photo for clicks. */ .playerstats-name-cell > a:first-child:not(.playerstats-name-link) { position: relative; z-index: 200; transform-origin: right center; transition: transform 0.18s ease-out; will-change: transform; } /* * Photo avatars: img is position:absolute so flex no longer uses intrinsic bitmap min-height * (the #1 cause of taller rows vs initials-only rows). */ .playerstats-avatar-frame { box-sizing: border-box; position: relative; width: 26px; height: 26px; flex: 0 0 26px; flex-shrink: 0; align-self: center; overflow: hidden; border-radius: 50%; line-height: 0; font-size: 0; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(0, 0, 0, 0.25); /* Zoom grows left (away from the name column on the right of the avatar) */ transform-origin: right center; transition: transform 0.18s ease-out; will-change: transform; z-index: 1; } .playerstats-avatar-frame .playerstats-player-avatar { box-sizing: border-box; position: absolute; left: 0; top: 0; width: 26px; height: 26px; margin: 0; padding: 0; border: 0; border-radius: 50%; object-fit: cover; object-position: center center; display: block; } .playerstats-avatar-provider-badge { box-sizing: border-box; position: absolute; right: -2px; bottom: -2px; width: 11px; height: 11px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 7px; line-height: 1; z-index: 2; pointer-events: none; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.28); } .playerstats-avatar-provider-badge--google { color: #4285f4; } .playerstats-avatar-provider-badge--google .fa-google { font-size: 7px; line-height: 1; } .playerstats-player-initials { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; min-width: 26px; min-height: 26px; max-width: 26px; max-height: 26px; border-radius: 50%; flex: 0 0 26px; flex-shrink: 0; align-self: center; font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: 0.02em; color: #fff; /* Fallback if JS has not set per-memid color yet */ background: #555; border: 1px solid rgba(255, 255, 255, 0.2); transform-origin: right center; transition: transform 0.18s ease-out; will-change: transform; position: relative; z-index: 1; } .playerstats-name-link { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; overflow: visible; text-decoration: none; } .playerstats-name-link .playerstats-name-text { min-width: 0; } /* Hover zoom (layout box stays 26px; transform draws larger) */ .playerstats-name-link:hover .playerstats-avatar-frame, .playerstats-name-link:hover .playerstats-player-initials, #playerstable tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, #playerstable tbody tr:hover .playerstats-name-link .playerstats-player-initials, #playerstable-tourny tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, #playerstable-tourny tbody tr:hover .playerstats-name-link .playerstats-player-initials { transform: scale(2.35); } #playerstable tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable-tourny tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebody-tourny tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable_single tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable_lifetime tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebydiv_formatted tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link) { transform: scale(2.35); } /* Tap-to-peek on touch: row-selected from styleBootstrapTable (no reliable :hover). */ @media (hover: none) { #playerstable tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, #playerstable tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, #playerstable-tourny tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, #playerstable-tourny tbody tr.row-selected .playerstats-name-link .playerstats-player-initials { transform: scale(2.35); } #playerstable tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable-tourny tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebody-tourny tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable_single tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstable_lifetime tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), #playerstablebydiv_formatted tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link) { transform: scale(2.35); } } /* overflow:hidden on the frame clips the scaled circle; show full zoom above neighbors */ .playerstats-name-link:hover .playerstats-avatar-frame, #playerstable tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, #playerstable-tourny tbody tr:hover .playerstats-name-link .playerstats-avatar-frame { overflow: visible; } @media (hover: none) { #playerstable tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, #playerstable-tourny tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame { overflow: visible; } } /* * Later s paint after earlier ones, so the zoom sits under the row below. * With border-collapse:collapse, z-index on is often ignored — lift every instead (see chalksta-playerstats.css). */ #playerstable tbody tr:has(.playerstats-name-link:hover) td, #playerstable tbody tr:hover td, #playerstable-tourny tbody tr:has(.playerstats-name-link:hover) td, #playerstable-tourny tbody tr:hover td, #playerstablebody tr:has(.playerstats-name-link:hover) td, #playerstablebody tr:hover td, #playerstablebody-tourny tr:has(.playerstats-name-link:hover) td, #playerstablebody-tourny tr:hover td, #playerstable_single tbody tr:has(.playerstats-name-link:hover) td, #playerstable_single tbody tr:hover td, #playerstable_lifetime tbody tr:has(.playerstats-name-link:hover) td, #playerstable_lifetime tbody tr:hover td, #playerstablebydiv_formatted tbody tr:has(.playerstats-name-link:hover) td, #playerstablebydiv_formatted tbody tr:hover td { position: relative; z-index: 150; } @media (hover: none) { #playerstable tbody tr.row-selected td, #playerstable-tourny tbody tr.row-selected td, #playerstablebody tr.row-selected td, #playerstablebody-tourny tr.row-selected td, #playerstable_single tbody tr.row-selected td, #playerstable_lifetime tbody tr.row-selected td, #playerstablebydiv_formatted tbody tr.row-selected td { position: relative; z-index: 150; } } /* * Player stats pages (not team stats): animated avatar ring replaces hover/tap zoom (scale 2.35). * Team stats keeps zoom rules above via body.chalksta-page-teamstats. */ @keyframes playerstats-avatar-ring-hover { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--espn-red, #e31837) 70%, transparent), 0 0 4px color-mix(in srgb, var(--espn-red, #e31837) 22%, transparent); } 50% { box-shadow: 0 0 0 2px var(--espn-red, #e31837), 0 0 10px color-mix(in srgb, var(--espn-red, #e31837) 42%, transparent); } } @keyframes playerstats-avatar-ring-you { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, rgb(34 170 95) 72%, transparent), 0 0 5px color-mix(in srgb, rgb(34 170 95) 28%, transparent); } 50% { box-shadow: 0 0 0 2px rgb(34 170 95), 0 0 11px color-mix(in srgb, rgb(34 170 95) 48%, transparent); } } @keyframes playerstats-avatar-ring-fave { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--espn-red, #e31837) 62%, transparent), 0 0 5px color-mix(in srgb, var(--espn-red, #e31837) 24%, transparent); } 50% { box-shadow: 0 0 0 2px var(--espn-red, #e31837), 0 0 11px color-mix(in srgb, var(--espn-red, #e31837) 40%, transparent); } } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) { --ps-avatar-ring-hover: var(--espn-red, #e31837); --ps-avatar-ring-you: rgb(72 220 160); --ps-avatar-ring-fave: rgb(255 176 0); } @keyframes playerstats-avatar-ring-hover-dark { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ps-avatar-ring-hover, #e31837) 65%, transparent), 0 0 6px color-mix(in srgb, var(--ps-avatar-ring-hover, #e31837) 30%, transparent); } 50% { box-shadow: 0 0 0 2px var(--ps-avatar-ring-hover, #e31837), 0 0 12px color-mix(in srgb, var(--ps-avatar-ring-hover, #e31837) 50%, transparent); } } @keyframes playerstats-avatar-ring-you-dark { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ps-avatar-ring-you, rgb(72 220 160)) 68%, transparent), 0 0 6px color-mix(in srgb, var(--ps-avatar-ring-you, rgb(72 220 160)) 32%, transparent); } 50% { box-shadow: 0 0 0 2px var(--ps-avatar-ring-you, rgb(72 220 160)), 0 0 12px color-mix(in srgb, var(--ps-avatar-ring-you, rgb(72 220 160)) 52%, transparent); } } @keyframes playerstats-avatar-ring-fave-dark { 0%, 100% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ps-avatar-ring-fave, rgb(255 176 0)) 62%, transparent), 0 0 6px color-mix(in srgb, var(--ps-avatar-ring-fave, rgb(255 176 0)) 28%, transparent); } 50% { box-shadow: 0 0 0 2px var(--ps-avatar-ring-fave, rgb(255 176 0)), 0 0 12px color-mix(in srgb, var(--ps-avatar-ring-fave, rgb(255 176 0)) 48%, transparent); } } /* Disable hover/tap zoom on player stats pages */ body.chalksta-app:not(.chalksta-page-teamstats) .playerstats-name-link:hover .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) .playerstats-name-link:hover .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr:hover .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebody-tourny tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover .playerstats-name-cell > a:first-child:not(.playerstats-name-link) { transform: none !important; } @media (hover: none) { body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected .playerstats-name-link .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected .playerstats-name-link .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebody-tourny tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link), body.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected .playerstats-name-cell > a:first-child:not(.playerstats-name-link) { transform: none !important; } } /* Row hover / tap: pulsing ESPN-red ring (not logged-in / favorite rows — those keep their own ring) */ body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-name-link:hover .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-name-link:hover .playerstats-player-initials { animation: playerstats-avatar-ring-hover 1.35s ease-in-out infinite; } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr:hover:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-name-link:hover .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-name-link:hover .playerstats-player-initials { animation: playerstats-avatar-ring-hover-dark 1.35s ease-in-out infinite; } @media (hover: none) { body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials { animation: playerstats-avatar-ring-hover 1.35s ease-in-out infinite; } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable-tourny tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_single tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstable_lifetime tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) #playerstablebydiv_formatted tbody tr.row-selected:not(.playerhiglightrow):not(.playerhiglightfavoriterow) .playerstats-player-initials { animation: playerstats-avatar-ring-hover-dark 1.35s ease-in-out infinite; } } /* Logged-in player (playerhiglightrow): persistent mint ring */ body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-player-initials { animation: playerstats-avatar-ring-you 2s ease-in-out infinite; } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-player-initials { animation: playerstats-avatar-ring-you-dark 2s ease-in-out infinite; } /* Favorite player (playerhiglightfavoriterow): persistent accent ring */ body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow:not(.playerhiglightrow) .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow:not(.playerhiglightrow) .playerstats-player-initials { animation: playerstats-avatar-ring-fave 2s ease-in-out infinite; } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow:not(.playerhiglightrow) .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow:not(.playerhiglightrow) .playerstats-player-initials { animation: playerstats-avatar-ring-fave-dark 2s ease-in-out infinite; } @media (prefers-reduced-motion: reduce) { body.chalksta-app:not(.chalksta-page-teamstats) tr:hover .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) tr:hover .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) tr.row-selected .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) tr.row-selected .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-player-initials, body.chalksta-app:not(.chalksta-page-teamstats) .playerstats-name-link:hover .playerstats-avatar-frame, body.chalksta-app:not(.chalksta-page-teamstats) .playerstats-name-link:hover .playerstats-player-initials { animation: none; } body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr:hover .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr:hover .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.row-selected .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.row-selected .playerstats-player-initials, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-player-initials { box-shadow: 0 0 0 2px var(--espn-red, #e31837); } body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-avatar-frame, body.chalksta-app:not(.dark-theme):not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-player-initials { box-shadow: 0 0 0 2px rgb(34 170 95); } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr:hover .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr:hover .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.row-selected .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.row-selected .playerstats-player-initials, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightfavoriterow .playerstats-player-initials { box-shadow: 0 0 0 2px var(--espn-red, #e31837); } body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-avatar-frame, body.dark-theme.chalksta-app:not(.chalksta-page-teamstats) tr.playerhiglightrow .playerstats-player-initials { box-shadow: 0 0 0 2px rgb(72 220 160); } }
in the hovered row. * Must be above sticky thead th (z-index ~100 from styleBootstrapTable) so zoom isn't under the header. * Row hover / tap (row-selected) uses the same lift so avatar peek works anywhere on the row. * chalksta-page-playerstats overrides with !important for sticky columns; that page lifts