/* Leaderboard and compare tools. Light theme, mobile first. */
.smgpu-lb { display: grid; gap: 14px; }
.smgpu-lb h3 { margin: 6px 0 0; font-size: 1.1rem; }
.smgpu-lb h4 { margin: 0 0 6px; font-size: .95rem; }
.smgpu-lb__pick { max-width: 420px; }
.smgpu-lb__pick select, .smgpu-cmp__form input { width: 100%; min-height: 44px; font: inherit; padding: 8px 12px; border: 1px solid var(--smgpu-border, #e1e7f3); border-radius: 10px; background: #fff; color: var(--smgpu-text, #0b1220); box-sizing: border-box; }
.smgpu-lb__out { display: grid; gap: 12px; min-width: 0; }
.smgpu-lb__loading { margin: 0; color: var(--smgpu-muted, #5b6475); }
.smgpu-lb__summary { margin: 0; color: var(--smgpu-muted, #5b6475); font-size: .95rem; }
.smgpu-lb__state { padding: 16px; border: 1px solid var(--smgpu-border, #e1e7f3); border-radius: 12px; background: #f5f8ff; }
.smgpu-lb__state p { margin: 6px 0 10px; color: var(--smgpu-muted, #5b6475); }
.smgpu-lb__state p:empty { display: none; }
.smgpu-lb__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.smgpu-lb__row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--smgpu-border, #e1e7f3); border-radius: 12px; background: #fff; box-shadow: 0 1px 3px rgba(11, 18, 32, .05); }
.smgpu-lb__row:nth-child(-n+3) .smgpu-lb__rank { background: #0b5cff; color: #fff; }
.smgpu-lb__rank { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #eef3fc; color: #0847c4; font-weight: 700; font-size: .9rem; }
.smgpu-lb__main { display: grid; gap: 4px; min-width: 0; }
.smgpu-lb__name { font-weight: 650; overflow-wrap: anywhere; }
.smgpu-lb__meta { color: var(--smgpu-muted, #5b6475); font-size: .8rem; line-height: 1.35; }
.smgpu-lb__score { display: grid; text-align: right; line-height: 1.2; }
.smgpu-lb__score strong { font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.smgpu-lb__score small { color: var(--smgpu-muted, #5b6475); font-size: .75rem; }
.smgpu-lb__bar { display: block; height: 8px; border-radius: 99px; background: #eef3fc; overflow: hidden; }
.smgpu-lb__bar--tall { height: 12px; }
.smgpu-lb__fill { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #5b92ff, #0b5cff); }
.smgpu-lb__meter { position: relative; padding: 4px 0; }
.smgpu-lb__marker { position: absolute; top: 0; width: 4px; height: 20px; margin-left: -2px; border-radius: 2px; background: #0b1220; }
.smgpu-cmp__form { display: grid; gap: 10px; grid-template-columns: 1fr; align-items: end; }
.smgpu-cmp__form .smgpu-btn { min-height: 44px; }
.smgpu-cmp__detail { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--smgpu-border, #e1e7f3); border-radius: 14px; background: #fff; box-shadow: 0 2px 8px rgba(11, 18, 32, .06); }
.smgpu-cmp__stats { display: grid; gap: 10px; grid-template-columns: 1fr; }
.smgpu-cmp__stats > div { display: grid; gap: 2px; padding: 12px; border-radius: 12px; background: #f5f8ff; }
.smgpu-cmp__stats small, .smgpu-cmp__stats span { color: var(--smgpu-muted, #5b6475); font-size: .85rem; }
.smgpu-cmp__stats strong { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.smgpu-cmp__rank { margin: 0; font-weight: 600; }
.smgpu-cmp__nbs { display: grid; gap: 14px; grid-template-columns: 1fr; }
.smgpu-cmp__nblist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.smgpu-cmp__nblist li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; background: #f5f8ff; font-size: .9rem; }
.smgpu-cmp__nbrank { color: var(--smgpu-muted, #5b6475); font-variant-numeric: tabular-nums; }
.smgpu-cmp__nbname { overflow-wrap: anywhere; }
.smgpu-cmp .smgpu-tablewrap { overflow-x: auto; }
@media (min-width: 640px) {
	.smgpu-cmp__form { grid-template-columns: minmax(0, 1fr) auto; }
	.smgpu-cmp__stats, .smgpu-cmp__nbs { grid-template-columns: 1fr 1fr; }
	.smgpu-lb__row { padding: 14px 16px; }
}
