/* Regulation M-C usage dashboard — shared between desktop and web. */
.usage-dashboard{max-width:1280px}
.usage-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 0 24px}
.usage-summary>div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}
.usage-summary small,.usage-summary strong{display:block}.usage-summary strong{font-size:22px;margin-top:8px;line-height:1.2}
.usage-toolbar{display:grid;gap:15px;margin-bottom:16px}
.usage-tabs,.usage-format{display:flex;gap:8px;flex-wrap:wrap}
.usage-tabs button,.usage-format button{cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:8px;padding:10px 13px;font-weight:600}
.usage-tabs button.active,.usage-format button.active{background:var(--green);color:#182318;border-color:var(--green)}
.usage-search-label{display:block;max-width:350px}.usage-search-label input{width:100%;margin-top:6px}
.usage-explainer{color:var(--muted);margin:8px 0 16px}
.usage-note{padding:13px 16px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);margin:14px 0;line-height:1.5}
.usage-table-wrap{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:12px}
.usage-table{border-collapse:collapse;width:100%;min-width:600px;background:var(--panel)}
.usage-table th,.usage-table td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle}
.usage-table tr:last-child td{border-bottom:0}
.usage-table th{color:var(--muted);font-size:11px;letter-spacing:.4px}
.usage-table td:nth-child(2){min-width:220px}
.usage-rank{font-weight:700;color:var(--muted);width:72px}
.usage-percent{font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--green)}
.usage-bar-track{height:9px;border-radius:8px;background:var(--line);min-width:90px;max-width:260px;overflow:hidden}
.usage-bar-fill{height:100%;border-radius:8px;background:var(--green)}
.usage-source{font-size:12px;color:var(--muted);margin:16px 0}.usage-member-count{font-size:11px;color:var(--muted);margin-top:6px}
.usage-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.usage-info-grid section{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px}
.usage-info-grid p{font-size:13px;line-height:1.6}.usage-info-grid a{font-size:13px}
@media(max-width:800px){.usage-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.usage-summary strong{font-size:18px}}
@media(max-width:420px){.usage-summary>div{padding:12px}.usage-summary strong{font-size:15px}.usage-tabs button{font-size:12px;padding:8px}}

.usage-event-list{margin:12px 0 18px}.usage-event-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12px}.usage-event-row strong{color:var(--green);white-space:nowrap}

/* Team ranking Pokémon portraits — official Pikalytics Champions sprite CDN. */
.usage-pokemon,.usage-pokemon-link{display:inline-flex;align-items:center;gap:10px;min-width:0}
.usage-pokemon-link{color:var(--text);text-decoration:none}.usage-pokemon-link:hover strong{text-decoration:underline;color:var(--green)}
.usage-portrait{display:inline-flex;position:relative;align-items:center;justify-content:center;flex:0 0 46px;width:46px;height:46px;background:rgba(128,152,170,.10);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.usage-portrait .usage-sprite{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto}
.usage-portrait-fallback{display:none;position:absolute;inset:0;align-items:center;justify-content:center;font-size:21px;color:var(--muted)}
.usage-portrait.is-missing .usage-sprite{display:none}.usage-portrait.is-missing .usage-portrait-fallback{display:flex}
.usage-portrait-small{width:34px;height:34px;flex-basis:34px;border-radius:8px}
.usage-core-members{display:flex;align-items:center;flex-wrap:wrap;column-gap:12px;row-gap:8px}
.usage-core-members .usage-pokemon{font-size:12px}.usage-core-members .usage-pokemon strong{font-size:12px}
.usage-event-row>span{display:inline-flex;align-items:center;gap:8px}.usage-event-row .usage-pokemon{font-size:12px}
@media(max-width:500px){.usage-portrait{width:38px;height:38px;flex-basis:38px}.usage-portrait-small{width:30px;height:30px;flex-basis:30px}.usage-pokemon{gap:7px}.usage-table td:nth-child(2){min-width:165px}}