.network-action { min-height: 44px; font-family: var(--mono); font-size: 10px; font-weight: 900; letter-spacing: .08em; cursor: pointer; }
.network-action--leaderboard { padding: 10px 4px 8px; border: 0; border-bottom: 2px solid var(--cyan); color: var(--cyan); background: transparent; }
.network-action--leaderboard:hover { color: var(--acid); border-color: var(--acid); }
.network-action--account { grid-area: account; justify-self: end; max-width: 190px; padding: 10px 16px; overflow: hidden; border: 1px solid var(--acid); color: var(--bg); background: var(--acid); box-shadow: 0 0 22px rgba(223, 255, 0, .22); text-overflow: ellipsis; white-space: nowrap; }
.network-action--account:hover { box-shadow: 0 0 30px rgba(223, 255, 0, .38); }
.platform-drawer { width: min(100%, 460px); max-width: min(420px, 100vw); height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto; padding: 0; border: 0; border-left: 1px solid var(--cyan); color: var(--text); background: rgba(5, 6, 10, .98); box-shadow: -20px 0 70px rgba(0, 246, 255, .12); }
.platform-drawer::backdrop { background: rgba(0, 0, 0, .68); backdrop-filter: blur(4px); }
.platform-drawer__header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px; border-bottom: 1px solid var(--line); }
.platform-drawer__header small, .platform-panel label, .platform-note { color: var(--text-dim); font-family: var(--mono); font-size: 9px; letter-spacing: .08em; }
.platform-drawer__header h2 { margin: 5px 0 0; font-family: var(--display); font-size: 38px; line-height: 1; }
.platform-drawer__close { width: 42px; height: 42px; border: 1px solid var(--line); background: transparent; font-size: 30px; cursor: pointer; }
.platform-panel { padding: 24px; }
.platform-panel[hidden] { display: none; }
.platform-panel h3 { margin: 0 0 18px; color: var(--cyan); font-family: var(--mono); font-size: 13px; }
.platform-panel p { color: var(--text-dim); }
.platform-inline { display: flex; gap: 8px; margin: 8px 0 16px; }
.platform-inline input { min-width: 0; flex: 1; padding: 11px; border: 1px solid var(--line); color: var(--text); background: var(--bg-elev); }
.platform-inline button, .platform-google, .platform-panel__title button { padding: 10px 12px; border: 1px solid var(--cyan); color: var(--cyan); background: transparent; font-family: var(--mono); font-size: 10px; font-weight: 900; cursor: pointer; }
.platform-google { width: 100%; margin-top: 6px; color: var(--bg); background: var(--acid); border-color: var(--acid); }
.platform-google-slot { min-height: 8px; margin-top: 12px; }
.platform-text-action { padding: 8px 0; border: 0; color: var(--magenta); background: transparent; font-family: var(--mono); font-size: 10px; cursor: pointer; }
.platform-panel__title { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.platform-ranking { list-style: none; margin: 18px 0; padding: 0; border-top: 1px solid var(--line-dim); }
.platform-ranking li { display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; padding: 12px 4px; border-bottom: 1px solid var(--line-dim); font-family: var(--mono); font-size: 11px; }
.platform-ranking strong { color: var(--magenta); }
.platform-ranking b { color: var(--acid); }
.platform-self-rank { padding: 14px; border: 1px solid var(--acid); color: var(--acid); font-family: var(--mono); font-size: 12px; font-weight: 900; }

@media (max-width: 480px) {
  .network-action { font-size: 8px; }
  .network-action--leaderboard { padding: 8px 4px 6px; }
  .network-action--account { max-width: 145px; padding: 8px 11px; }
  .platform-drawer { width: 100vw; }
  .platform-drawer__header, .platform-panel { padding: 18px; }
}