.player-analytics-card.hero-activity-card {
  padding:22px 24px 15px; border-radius:26px; gap:0;
  background:radial-gradient(ellipse at 96% 0%,#65b0ff55,transparent 50%),radial-gradient(ellipse at 0% 100%,#80c7ff22,transparent 50%),linear-gradient(125deg,#2479db,#338bed 65%,#3d91eb);
  box-shadow:0 12px 28px #2676d323,inset 0 1px 0 #ffffff26;
}
.hero-activity-card .player-growth-title { gap:11px; font-size:15px; letter-spacing:-.3px; }
.hero-title-icon { width:34px; height:34px; display:grid; place-items:center; flex-shrink:0; border:1px solid #ffffff24; background:#ffffff12; border-radius:11px; }
.hero-title-copy { display:flex; flex-direction:column; gap:4px; }
.hero-title-copy small { font-size:8px; letter-spacing:1.4px; font-weight:600; color:#c2ddff; }
.hero-online-count { display:flex; align-items:center; gap:7px; padding:7px 11px; border:1px solid #ffffff2b; border-radius:30px; background:#ffffff12; font-size:10px; color:#e3f0ff; white-space:nowrap; }
.hero-online-count strong { font-size:13px; color:#fff; }
.hero-live-dot { width:5px; height:5px; border-radius:50%; background:#9af0d4; box-shadow:0 0 0 3px #9af0d416; }
.hero-activity-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:22px 0 0; }
.hero-primary-metric { min-width:150px; }
.hero-metric-line { display:flex; align-items:baseline; gap:9px; margin-bottom:5px; }
#insightMetricValue { font-size:42px; font-weight:800; line-height:1; letter-spacing:-1.8px; color:#fff; font-variant-numeric:tabular-nums; }
#insightMetricLabel { color:#d7eaff; font-size:12px; font-weight:500; }
#insightModeSummary { font-size:10px; color:#cee4ff; font-weight:500; }
.hero-activity-card .insights-tabs { gap:3px; padding:4px; border:1px solid #ffffff1d; border-radius:11px; background:#154fa029; align-self:center; }
.hero-activity-card .insights-tabs button { color:#d9eaff; background:transparent; border:0; border-radius:8px; font-size:9px; padding:8px 10px; white-space:nowrap; transition:background .18s,color .18s; }
.hero-activity-card .insights-tabs button:hover { color:#fff; background:#ffffff18; }
.hero-activity-card .insights-tabs button[aria-pressed=true] { color:#236abe; background:#fff; box-shadow:0 2px 7px #104d9230; }
.hero-activity-card .insights-tabs button:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.hero-activity-chart { --hero-chart-height:240px; position:relative; min-height:var(--hero-chart-height); margin-top:18px; }
.hero-activity-chart svg { width:100%; height:var(--hero-chart-height); display:block; overflow:visible; }
.hero-activity-chart svg text { fill:#c8e3ff; font:10px system-ui; }
.hero-activity-chart svg line { stroke:#ffffff1c; stroke-dasharray:2 7; }
.hero-activity-chart .hero-hover-line { stroke:#ffffff7a; stroke-width:1; stroke-dasharray:3 4; }
.hero-data-point { outline:none; }
.hero-data-point:focus-visible circle { stroke:#c9f5eb; stroke-width:3; }
.hero-activity-chart .insights-empty { color:#d9eaff; min-height:150px; display:grid; place-items:center; font-size:11px; }
.hero-chart-tooltip { position:absolute; z-index:4; top:8px; width:max-content; max-width:190px; padding:10px 12px; border:1px solid #ffffff24; background:#123d76f5; border-radius:12px; box-shadow:0 8px 22px #14457730; pointer-events:none; color:#fff; font-size:11px; line-height:1.7; }
.hero-chart-tooltip[hidden] { display:none; }
.hero-chart-tooltip span { display:block; color:#abcff8; font-size:9px; margin-bottom:2px; }
.hero-chart-tooltip strong { display:block; font-size:12px; font-variant-numeric:tabular-nums; }
.hero-chart-tooltip small { color:#ffd99e; font-size:10px; }
.hero-activity-card .insights-rates { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; color:#c8e1ff; background:#ffffff09; border:1px solid #ffffff20; padding:12px 0; margin:12px 0 0; font-size:9px; border-radius:13px; }
.hero-activity-card .insights-rates > span { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 16px; line-height:1.6; }
.hero-activity-card .insights-rates > span + span { border-left:1px solid #ffffff1c; }
.hero-activity-card .insights-rates b { margin-left:0; color:#fff; font-size:14px; font-weight:700; font-variant-numeric:tabular-nums; }
.hero-chart-bottom { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-top:10px; }
.hero-chart-updated { color:#b8d8ff; font-size:8px; white-space:nowrap; }
.hero-activity-card .insights-note { color:#d5e7ff; font-size:9px; }
.hero-chart-details { font-size:8px; color:#bad9ff; }
.hero-chart-details summary { cursor:pointer; width:fit-content; }
.hero-activity-legend { display:flex; gap:14px; align-items:center; color:#e0edff; font-size:9px; margin:5px 0; }
.hero-activity-legend span::before { content:""; display:inline-block; width:12px; height:2px; margin-right:5px; vertical-align:middle; background:#fff; }
.hero-activity-legend span:last-child::before { background:#ffd18b; }
@media(max-width:650px) {
  .player-analytics-card.hero-activity-card { padding:18px 16px 13px; border-radius:21px; }
  .hero-activity-controls { align-items:flex-start; flex-direction:column; gap:14px; margin-top:20px; }
  .hero-activity-card .insights-tabs { align-self:stretch; }
  .hero-activity-card .insights-tabs button { flex:1; white-space:normal; font-size:8px; padding:7px 5px; }
  .hero-activity-card .insights-rates > span { padding:0 9px; gap:4px; flex-direction:column; align-items:flex-start; }
  #insightMetricValue { font-size:35px; }
  .hero-activity-chart { --hero-chart-height:210px; }
}
@media(prefers-reduced-motion:reduce) { .hero-activity-card .insights-tabs button { transition:none; } }