/* Players page: profile hero, stat cards, longest word in tiles, favorites, leaderboard. */
.bank-play{background:var(--yellow);color:var(--plum);border:2px solid var(--plum);border-radius:14px;padding:8px 14px;font-weight:1000;font-size:15px;text-decoration:none;box-shadow:0 3px 0 var(--plum)}
.player-tabs{display:flex;gap:6px;padding:5px;margin-block:4px 18px;border-radius:20px;background:var(--plum);box-shadow:0 4px 0 color-mix(in oklch,var(--plum),black 25%)}
.player-tabs button{flex:1;min-block-size:46px;border-radius:15px;background:transparent;color:var(--white);font-size:16px;font-weight:1000}
.player-tabs button[aria-selected="true"]{background:var(--yellow);color:var(--plum)}
.make-player h1{font-size:26px}
.profile-picker{margin-block:10px 18px}
.me-hero{display:grid;justify-items:center;gap:10px;color:var(--white);text-align:center}
.me-avatar{position:relative;display:grid;place-items:center;inline-size:112px;block-size:112px;border-radius:32px;background:var(--white);border:4px solid var(--plum);box-shadow:0 6px 0 var(--plum);font-size:64px;line-height:1}
.me-avatar .avatar-img{inline-size:84px;block-size:84px}
.me-avatar span{position:absolute;inset-block-end:-12px;padding:3px 10px;border-radius:10px;background:var(--yellow);color:var(--plum);border:2px solid var(--plum);font-size:11px;font-weight:1000}
.me-avatar.small{inline-size:72px;block-size:72px;font-size:40px;border-radius:22px}.me-avatar.small .avatar-img{inline-size:54px;block-size:54px}
.me-name{display:flex;gap:8px;inline-size:min(100%,22rem);margin-block-start:10px}
.me-name input{flex:1;min-inline-size:0;min-block-size:48px;border:3px solid var(--plum);border-radius:14px;padding-inline:14px;font-size:max(18px,1rem);font-weight:1000;color:var(--plum);text-align:center}
.me-name .secondary{inline-size:auto;padding-inline:16px}
.me-since{font-size:12px;font-weight:900;opacity:.85}
.stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-block:20px 14px}
.stat-card{display:grid;gap:2px;padding:14px;border-radius:20px;background:color-mix(in oklch,var(--white) 94%,var(--mint));color:var(--plum);border:3px solid var(--plum);box-shadow:0 4px 0 var(--plum)}
.stat-card span{font-size:11px;font-weight:1000;letter-spacing:1px;text-transform:uppercase;opacity:.75}
.stat-card strong{font-size:clamp(24px,7vw,34px);font-weight:1000;line-height:1.1;overflow-wrap:anywhere}
.stat-card small{font-size:12px;font-weight:900;opacity:.75}
.longest-card,.favorites{display:grid;justify-items:center;gap:8px;padding:16px;margin-block:12px;border-radius:22px;background:var(--plum);color:var(--white)}
.longest-card>span,.favorites>span{font-size:12px;font-weight:1000;letter-spacing:1.5px;color:var(--yellow)}
.longest-card .sheet-tiles{margin:0}
.longest-card small{font-size:12px;font-weight:900;opacity:.85}
.fav-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.fav-chip{padding:6px 10px;border-radius:14px;background:var(--white);color:var(--plum);font-size:14px;font-weight:1000}
.fav-chip b{margin-inline-start:6px;color:var(--violet);font-size:12px}
.fav-chip:first-child{background:var(--yellow)}
.device-link{margin-block:18px;color:var(--white);text-align:center;font-weight:900}
.device-link summary{cursor:pointer;min-block-size:44px;line-height:44px}
.device-link p{font-size:13px;line-height:1.5;margin-block:6px 12px}
.segmented{display:flex;gap:4px;padding:4px;border-radius:15px;background:var(--plum)}
.segmented button{flex:1;min-block-size:38px;border-radius:11px;background:transparent;color:var(--white);font-size:13px;font-weight:1000;white-space:nowrap}
.segmented button[aria-pressed="true"]{background:var(--yellow);color:var(--plum)}
.board-cats{margin-block-end:14px;overflow-x:auto;scrollbar-width:none}
.board-cats button{flex:none;padding-inline:14px}
.leaders{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.leader{display:flex;gap:8px;align-items:stretch}
.leader .leader-row{flex:1;min-inline-size:0;display:grid;grid-template-columns:36px 44px minmax(0,1fr) auto;align-items:center;gap:10px;inline-size:100%;min-block-size:62px;padding:8px 14px;border-radius:18px;background:color-mix(in oklch,var(--white) 94%,var(--mint));color:var(--plum);border:3px solid var(--plum);box-shadow:0 4px 0 var(--plum);text-align:start}
.leader.is-me button{background:var(--yellow)}
.leader-rank{font-size:20px;font-weight:1000;text-align:center}
.leader:first-child .leader-rank{color:var(--violet);font-size:24px}
.leader-avatar{font-size:32px;line-height:1;text-align:center}.leader-avatar .avatar-img{inline-size:38px;block-size:38px}
.leader-name{font-size:17px;font-weight:1000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leader-value{font-size:20px;font-weight:1000;white-space:nowrap}.leader-value small{font-size:11px;opacity:.7}
.leader-word{font-size:15px;letter-spacing:.5px}
.board-empty{text-align:center;color:var(--white);font-weight:900;display:grid;gap:10px;justify-items:center;padding:30px 10px;border:3px dashed color-mix(in oklch,var(--white) 60%,transparent);border-radius:22px;list-style:none}
.player-sheet .board-empty{color:var(--plum);border-color:color-mix(in oklch,var(--plum) 30%,transparent)}
.sheet-player{display:grid;justify-items:center;gap:8px;margin-block:4px 4px}
.sheet-player h2{font-size:26px;font-weight:1000}
.player-sheet .stat-card{background:color-mix(in oklch,var(--mint) 25%,var(--white))}
.word-sheet{inline-size:min(100%,34rem);max-inline-size:100%;max-block-size:92dvh;margin:auto auto 0;padding:28px 20px calc(24px + env(safe-area-inset-bottom));border:0;border-radius:28px 28px 0 0;background:var(--white);color:var(--plum);box-shadow:0 -6px 0 var(--plum);overflow-y:auto}
.word-sheet::backdrop{background:color-mix(in oklch,var(--plum) 65%,transparent)}
.sheet-close{position:absolute;inset-block-start:12px;inset-inline-end:12px;inline-size:40px;block-size:40px;border-radius:20px;background:color-mix(in oklch,var(--plum) 10%,transparent);color:var(--plum);font-size:16px;font-weight:1000}
.sheet-tiles{display:flex;flex-wrap:wrap;justify-content:center;gap:5px}
.sheet-tile{display:grid;place-items:center;inline-size:34px;aspect-ratio:1;border-radius:9px;background:var(--white);color:var(--plum);border:2px solid var(--plum);box-shadow:0 3px 0 color-mix(in oklch,var(--plum),black 15%);font-size:19px;font-weight:1000}
.sheet-tile:nth-child(3n+2){background:var(--yellow)}
@media(prefers-reduced-motion:no-preference){
  .stat-card{animation:card-rise 360ms cubic-bezier(.23,1,.32,1) both}.stat-card:nth-child(2){animation-delay:40ms}.stat-card:nth-child(3){animation-delay:80ms}.stat-card:nth-child(4){animation-delay:120ms}.stat-card:nth-child(5){animation-delay:160ms}.stat-card:nth-child(6){animation-delay:200ms}
  .longest-card .sheet-tile{animation:tile-flip 380ms cubic-bezier(.23,1,.32,1) both;animation-delay:calc(240ms + var(--i)*50ms)}
  .fav-chip{animation:card-rise 300ms cubic-bezier(.23,1,.32,1) both;animation-delay:calc(var(--i)*35ms)}
  .leader{animation:card-rise 320ms cubic-bezier(.23,1,.32,1) both;animation-delay:calc(var(--i)*40ms)}
  .word-sheet[open]{animation:sheet-up 300ms cubic-bezier(.23,1,.32,1)}
}
@keyframes card-rise{from{transform:translateY(14px) scale(.97);opacity:0}}
@keyframes tile-flip{from{transform:rotateX(-80deg) translateY(8px);opacity:0}to{transform:none;opacity:1}}
@keyframes sheet-up{from{transform:translateY(40%);opacity:.4}}
@media(min-width:700px){.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.word-sheet{margin-block-end:auto;border-radius:28px;box-shadow:0 6px 0 var(--plum)}}

/* Challenge a player straight from the leaderboard */
.leader .leader-duel{flex:none;inline-size:56px;border-radius:18px;background:var(--yellow);color:var(--plum);border:3px solid var(--plum);box-shadow:0 4px 0 var(--plum);font-size:24px;line-height:1}
.leader .leader-duel:disabled{opacity:.6}
.sheet-duel{inline-size:auto;margin-block-start:6px;padding-inline:22px}
.practice-note{margin-block-start:14px;font-size:13px;font-weight:800;color:var(--white);opacity:.85;text-align:center}