/* Shared styles for the HillScoreboard leaderboard component (public/scoreboard.js).
   These mirror the "Arcade scoreboard" block in group.css so the leaderboard looks
   identical wherever it is mounted. group.css still carries its own copy for the
   group page; this file lets the hill page render the same component (e.g. the
   leaderboard popup). Keep the two in sync if either changes. */

/* Arcade scoreboard: ink outlines, crown gold and mechanical score tiles. */
.scoreboard { margin:8px 0 28px; }
.scoreboard-head { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.scoreboard-head>img { width:46px; height:46px; transform:rotate(-9deg); }
.scoreboard-kicker { font:700 10px var(--ui); letter-spacing:1.8px; color:#726b80; }
.scoreboard-head h3 { font:32px/1.1 var(--display); margin:3px 0 0; }
.scoreboard-live { margin-left:auto; color:#087b56; font:700 10px var(--ui); letter-spacing:1px; }
.scoreboard .gp-stat-scope { display:flex; gap:6px; padding:5px; border:2px solid #26241f; background:#eae5f5; border-radius:14px; }
.scoreboard .gp-stat-scope .chip { flex:1; box-shadow:none; border:0; border-radius:9px; font:20px var(--display); padding:8px; background:transparent; }
.scoreboard .gp-stat-scope .chip[aria-pressed=true] { background:#ffd329; box-shadow:0 2px 0 #26241f; }
.scoreboard-update { font:13px/1.4 var(--ui); color:#706978; margin:14px 2px; }
.scoreboard-list { list-style:none; padding:0; margin:0; display:grid; gap:15px; }
.scoreboard-player { border:2px solid #302b39; border-radius:18px; background:#fffdf5; box-shadow:3px 4px 0 #302b39; padding:15px; overflow:hidden; }
.scoreboard-player.scoreboard-first { background:linear-gradient(135deg,#fff4b6,#ffe17c); }
.scoreboard-player-top { display:flex; align-items:center; gap:9px; }
.scoreboard-rank { min-width:32px; font:24px var(--display); color:#5c4c79; position:relative; }
.scoreboard-rank img { display:block; width:25px; height:23px; margin-bottom:-4px; }
.scoreboard-name { min-width:0; flex:1; }
.scoreboard-name>b { display:block; font:25px/1.1 var(--display); overflow-wrap:anywhere; }
.scoreboard-name small { display:block; min-height:14px; margin-top:4px; font:700 9px var(--ui); letter-spacing:1px; color:#635471; }
.scoreboard-score-row { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:16px 0 13px; }
.scoreboard-flaps { display:flex; gap:3px; perspective:300px; }
.scoreboard-digit { display:grid; place-items:center; position:relative; width:29px; height:40px; border-radius:5px; background:linear-gradient(#383046 49%,#241e30 50%); color:#fff8d8; font:700 29px/1 monospace; box-shadow:0 2px 0 #181320; font-variant-numeric:tabular-nums; }
.scoreboard-digit::after { content:''; position:absolute; top:50%; left:0; right:0; border-top:1px solid #0007; }
.scoreboard-points { display:block; margin-top:7px; font:700 9px var(--ui); letter-spacing:1.6px; color:#635471; }
.scoreboard-changes { display:grid; gap:7px; text-align:right; flex-shrink:0; }
.scoreboard-gain { color:#07683e; background:#d0f4c6; border:1.5px solid #207444; border-radius:7px; padding:4px 7px; font:20px var(--display); transform:rotate(-4deg); }
.scoreboard-gain.loss { color:#8c3539; background:#ffe0dc; border-color:#8c3539; }
.scoreboard-climb { font:700 11px var(--ui); color:#65438f; }
.scoreboard-breakdown { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.scoreboard-breakdown>span { border:1px solid #d1c7db; border-radius:9px; padding:8px 5px; background:#fff9; text-align:center; }
.scoreboard-breakdown small { display:block; font:11px var(--ui); color:#655a72; white-space:nowrap; }
.scoreboard-breakdown b { display:inline-block; margin-top:4px; font:700 16px var(--ui); font-variant-numeric:tabular-nums; }
.scoreboard-breakdown em { font:700 10px var(--ui); color:#097348; margin-left:4px; }
.scoreboard-details { margin-top:12px; font:12px/1.5 var(--ui); color:#6a6171; }
.scoreboard-details summary,.scoreboard-rules summary { cursor:pointer; min-height:24px; }
.scoreboard-details p { margin:6px 0 0; }
.scoreboard-rules { padding:17px 2px 0; font:13px/1.5 var(--ui); color:#63566d; }
.scoreboard-rules summary { font-weight:700; }
.scoreboard-rules p { margin:8px 0; }
@media(min-width:600px) { .scoreboard-player { padding:20px; } .scoreboard-digit { width:35px; height:46px; font-size:34px; } }
@media(max-width:360px) { .scoreboard-head h3 { font-size:27px; } .scoreboard-player { padding:12px; } .scoreboard-digit { width:24px; height:35px; font-size:25px; } .scoreboard-breakdown small { font-size:10px; } }

/* Keep the standings visible together; expand only the player you want to inspect. */
.scoreboard-head { gap:8px; margin-bottom:10px; }
.scoreboard-head>img { width:32px; height:32px; }
.scoreboard-head h3 { font-size:25px; }
.scoreboard-kicker { font-size:9px; letter-spacing:1.2px; }
.scoreboard .gp-stat-scope { padding:3px; margin-bottom:12px; }
.scoreboard .gp-stat-scope .chip { padding:5px 8px; font-size:18px; }
.scoreboard-update { margin:8px 2px; font-size:12px; }
.scoreboard-list { gap:9px; }
.scoreboard-player { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:8px; padding:10px 12px 4px; border-radius:13px; box-shadow:2px 3px 0 #302b39; }
.scoreboard-player-top { gap:6px; min-width:0; }
.scoreboard-rank { min-width:22px; font-size:19px; }
.scoreboard-rank img { display:none; }
.scoreboard-name>b { font-size:22px; }
.scoreboard-name small { font-size:8px; letter-spacing:.4px; margin-top:3px; min-height:0; }
.scoreboard-score-row { margin:0; display:block; text-align:right; }
.scoreboard-flaps { justify-content:flex-end; gap:2px; }
.scoreboard-digit { width:22px; height:29px; font-size:23px; border-radius:3px; }
.scoreboard-points { margin-top:4px; font-size:7px; letter-spacing:1px; }
.scoreboard-changes { display:flex; justify-content:flex-end; align-items:center; gap:5px; margin-top:3px; }
.scoreboard-changes:empty { display:none; }
.scoreboard-gain { font:700 10px var(--ui); padding:2px 4px; transform:none; border-radius:4px; }
.scoreboard-climb { font-size:9px; }
.scoreboard-details { grid-column:1/-1; margin:0; font-size:11px; }
.scoreboard-details summary { width:max-content; padding:5px 0; min-height:24px; box-sizing:border-box; }
.scoreboard-details .scoreboard-breakdown { margin:4px 0 8px; }
.scoreboard-details p { margin:6px 0 10px; }
.scoreboard-rules { padding-top:12px; }
.scoreboard-breakdown { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:360px) { .scoreboard-player { padding:8px 9px 3px; column-gap:5px; } .scoreboard-name>b { font-size:20px; } .scoreboard-player-top { gap:5px; } .scoreboard-player-top .uface { display:none; } .scoreboard-head h3 { font-size:24px; } }

/* Empty/loading/error state (the component emits .hub-empty; styled in group.css
   on the group page, redeclared here for pages that don't load group.css). */
.scoreboard .hub-empty { color:var(--ink-soft); text-align:center; padding:24px 0; }

/* Leaderboard popup (hill page): the scoreboard inside a modal card. */
.leaderboard-modal .scoreboard { margin:0; }
.leaderboard-modal .scoreboard-list { max-height:min(56vh,520px); overflow-y:auto; padding:2px; margin:0 -2px; }
