/* Shared statistics chart and Plus dashboard design tokens.
   The game chart palette is inherited from --tg-chart-blue (#97B9E9).
   Both light and dark themes use the same structure, with theme surfaces.
 */
.page-stats .stats-period-switch{margin:0 0 22px;width:max-content}
.page-stats .stats-page-header{padding-bottom:14px}
.page-stats .player-ranking-stat>h2{margin:0}
.page-stats .stats-advanced-dashboard[hidden],
.page-stats .stats-plus-preview-features[hidden]{display:none!important}
.page-stats .stats-advanced-dashboard{display:flex;flex-direction:column;gap:21px;margin-top:17px}
.page-stats .stats-advanced-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.page-stats .stats-advanced-metrics article{
 display:flex;flex-direction:column;align-items:flex-start;gap:5px;
 min-width:0;padding:16px 17px;border-radius:13px;
 background:var(--surface-soft);border:1px solid var(--line)
}
.page-stats .stats-advanced-metrics span{font-size:11px;color:var(--muted);font-weight:650}
.page-stats .stats-advanced-metrics strong{font-size:clamp(20px,2.6vw,29px);font-weight:760;letter-spacing:-.06em;line-height:1.17}
.page-stats .stats-advanced-metrics small{font-size:10px;color:var(--muted)}
.page-stats .stats-advanced-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.page-stats .stats-chart-card{min-width:0;padding:18px 17px 15px;background:var(--surface-soft);border:1px solid var(--line);border-radius:15px}
.page-stats .stats-chart-heading{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.page-stats .stats-chart-heading h3{font-size:16px;font-weight:720;letter-spacing:-.035em;margin:0 0 5px}
.page-stats .stats-chart-heading p{margin:0;color:var(--muted);font-size:11px;line-height:1.4}
.page-stats .stats-chart-meta{font-size:11px;color:var(--muted);font-weight:690;text-align:right;white-space:nowrap}
.page-stats .stats-chart-plot{width:100%;height:220px;display:grid;place-items:center;margin-top:14px;min-width:0}
.page-stats .tg-stats-chart-svg{display:block;width:100%;height:100%;overflow:visible;stroke:none;fill:none}
.page-stats .tg-stats-chart-svg .tg-chart-grid{stroke:var(--line);stroke-width:1;opacity:.8}
.page-stats .tg-stats-chart-svg .tg-chart-bar{fill:var(--tg-chart-blue,#97B9E9)}
.page-stats .tg-stats-chart-svg .tg-chart-zero{fill:var(--line);opacity:.35}
.page-stats .tg-stats-chart-svg .tg-chart-area{fill:var(--tg-chart-blue,#97B9E9);fill-opacity:.13}
.page-stats .tg-stats-chart-svg .tg-chart-line{stroke:var(--tg-chart-blue,#97B9E9);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.page-stats .tg-stats-chart-svg .tg-chart-dot{fill:var(--tg-chart-blue,#97B9E9);stroke:var(--surface);stroke-width:1.8}
.page-stats .tg-stats-chart-svg .tg-chart-label{fill:var(--muted);font-size:11px;font-family:inherit}
.page-stats .tg-stats-chart-svg .tg-chart-y-label{
 fill:var(--muted);font-size:10px;font-weight:630;font-family:inherit;
 font-variant-numeric:tabular-nums;
}
.page-stats .tg-stats-chart-svg .tg-chart-hit{
 pointer-events:all;cursor:default;outline:none;
}
.page-stats .tg-stats-chart-svg .tg-chart-hit:focus-visible{
 stroke:var(--tg-chart-blue,#97B9E9);stroke-width:1;stroke-dasharray:3 3;
}
/* Single unclipped, viewport-positioned readout shared by Activity and Progress. */
.tg-chart-value-tip{
 position:fixed;z-index:120;width:max-content;max-width:calc(100vw - 16px);
 box-sizing:border-box;padding:7px 10px;border-radius:8px;
 background:var(--text);color:var(--canvas);box-shadow:0 6px 20px rgba(0,0,0,.17);
 font:720 12px/1.3 Inter,ui-sans-serif,system-ui,sans-serif;
 text-align:center;white-space:nowrap;pointer-events:none;
 transform:translate(-50%,-100%);font-variant-numeric:tabular-nums
}
.tg-chart-value-tip::after{
 content:"";position:absolute;left:calc(50% + var(--tg-tip-pip-offset,0px));
 bottom:-4px;width:9px;height:9px;background:var(--text);
 transform:translateX(-50%) rotate(45deg);pointer-events:none
}
.tg-chart-value-tip[data-side="below"]{transform:translateX(-50%)}
.tg-chart-value-tip[data-side="below"]::after{bottom:auto;top:-4px}
.tg-chart-value-tip[hidden]{display:none!important}
.page-stats .tg-chart-empty{color:var(--muted);font-size:12px;text-align:center;line-height:1.6;padding:18px}
.page-stats .stats-progress-switch.tg-segment{
 display:flex;align-items:center;gap:3px;width:100%;max-width:100%;margin-top:15px;
 padding:3px;background:var(--surface);border:1px solid var(--line);border-radius:10px;
 overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;
}
.page-stats .stats-progress-switch.tg-segment>button{
 cursor:pointer;font:inherit;border:0;border-radius:7px;background:none;
 flex:1 0 auto;font-size:12px;font-weight:710;color:var(--muted);min-height:34px;
 padding:7px 13px;white-space:nowrap
}
.page-stats .stats-progress-switch.tg-segment>button[aria-selected="true"]{color:var(--text);font-weight:800}
.page-stats .stats-chart-note{color:var(--muted);font-size:11px;line-height:1.5;margin:3px 0 0}
.page-stats .stats-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:11px}
.page-stats .stats-section-heading h3{font-size:17px;margin:0;letter-spacing:-.03em}
.page-stats .stats-section-heading span{font-size:11px;color:var(--muted)}
.page-stats .stats-insights-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.page-stats .stats-insight-card{padding:16px 15px;border:1px solid var(--line);border-radius:13px;background:var(--surface-soft);min-width:0}
.page-stats .stats-insight-name{display:flex;gap:9px;align-items:center;min-width:0;margin-bottom:14px}
.page-stats .stats-insight-name .tg-game-icon{--tg-icon-size:31px;--tg-icon-art-size:23px}
.page-stats .stats-insight-name strong{font-size:13px;font-weight:720}
.page-stats .stats-insight-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 10px}
.page-stats .stats-insight-values>div{min-width:0}
.page-stats .stats-insight-values small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.page-stats .stats-insight-values strong{font-size:16px;font-weight:770;letter-spacing:-.02em;line-height:1.2}
.page-stats .stats-insight-foot{font-size:11px;line-height:1.5;color:var(--muted);margin:15px 0 0}
.page-stats .stats-record-date{font-size:11px;color:var(--muted);margin:5px 0 0}
.page-stats .stats-advanced-footnote{color:var(--muted);font-size:10px;line-height:1.6;margin:0}
.page-stats .stats-advanced-dashboard .stats-top-games{
  margin:0;padding:16px 17px;
  background:var(--surface-soft);border:1px solid var(--line);
  border-radius:13px;box-shadow:none
}
.page-stats .stats-advanced-dashboard .stats-top-games-list{height:auto!important;min-height:0!important;max-height:none!important}
.page-stats .stats-advanced-dashboard .stats-performance-row{padding:10px;align-items:center}
@media(max-width:900px){
 .page-stats .stats-advanced-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .page-stats .stats-advanced-panels{grid-template-columns:1fr}
 .page-stats .stats-insights-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
 .page-stats .stats-chart-card{padding:15px 12px}
 .page-stats .stats-chart-plot{height:150px}
 .page-stats .stats-advanced-metrics article{padding:13px}
 .page-stats .stats-insight-card{padding:14px}
}

/* Advanced Stats v2 - independently sized cards, genuine 13x7 heatmap,
   seven dated daily bars and one full-width Progress chart. All sizes come
   from this Stats layer; the game experience does not own chart layout. */
.page-stats .stats-advanced-panels .stats-progress-card{grid-column:1/-1}
.page-stats .stats-chart-card{
 display:flex;flex-direction:column;align-items:stretch;gap:0;
 height:auto;min-height:0;
}
.page-stats .stats-calendar-card{min-height:0}
.page-stats .stats-activity-calendar{
 display:grid;grid-auto-flow:column;
 grid-template-columns:repeat(13,minmax(0,1fr));
 grid-template-rows:repeat(7,minmax(0,1fr));
 gap:clamp(3px,.5vw,5px);
 width:100%;height:auto;min-width:0;
 margin:20px 0 0;
}
.page-stats .stats-activity-day{
 display:block;width:100%;aspect-ratio:1;min-width:0;
 box-sizing:border-box;border-radius:4px;
 border:1px solid var(--line);
 background:color-mix(in srgb,var(--muted) 6%,var(--surface-soft));
}
.page-stats .stats-activity-day[data-level="1"]{background:#b7ddce;border-color:transparent}
.page-stats .stats-activity-day[data-level="2"]{background:#79bea2;border-color:transparent}
.page-stats .stats-activity-day[data-level="3"]{background:#399e78;border-color:transparent}
.page-stats .stats-calendar-range{
 display:flex;align-items:center;justify-content:space-between;
 font-size:10px;color:var(--muted);margin:7px 0 20px;
}
.page-stats .stats-weekly-compare{font-size:12px;line-height:1.45;margin:0;color:var(--muted)}
.page-stats .stats-weekly-bars{
 display:grid;grid-template-columns:repeat(7,minmax(0,1fr));
 align-items:end;gap:clamp(5px,1vw,12px);
 width:100%;height:112px;min-height:112px;
 padding:0 6px 0;margin:10px 0 0;
}
.page-stats .stats-weekly-column{
 height:100%;min-width:0;display:flex;flex-direction:column;
 align-items:center;justify-content:flex-end;gap:2px;
}
.page-stats .stats-weekly-bar-track{
 width:100%;height:69px;min-height:69px;
 display:flex;align-items:flex-end;justify-content:center;
}
.page-stats .stats-weekly-bar{
 display:block;max-width:100%;width:min(100%,30px);
 min-height:2px;border-radius:5px 5px 2px 2px;background:#79bea2;
}
.page-stats .stats-weekly-value{font-size:11px;font-weight:730;line-height:1.3;color:var(--text);font-variant-numeric:tabular-nums}
.page-stats .stats-weekly-day{font-size:10px;line-height:1.2;color:var(--muted);white-space:nowrap}
.page-stats .stats-activity-card .stats-chart-plot{height:215px;min-height:215px}
.page-stats .stats-progress-card .stats-chart-plot{height:255px;min-height:255px}
.page-stats .stats-progress-switch.tg-segment::-webkit-scrollbar{display:none}
.page-stats .stats-progress-switch.tg-segment>button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.page-stats .stats-chart-note{margin-top:10px}
@media(max-width:900px){
 .page-stats .stats-advanced-panels .stats-progress-card{grid-column:auto}
}
@media(max-width:560px){
 .page-stats .stats-activity-calendar{gap:3px;margin-top:16px}
 .page-stats .stats-weekly-bars{padding:0;height:106px;min-height:106px}
 .page-stats .stats-activity-card .stats-chart-plot{height:180px;min-height:180px}
 .page-stats .stats-progress-card .stats-chart-plot{height:205px;min-height:205px}
 .page-stats .stats-progress-switch.tg-segment>button{font-size:11px;min-height:33px;padding:7px 11px}
}

/* Intrinsic chart layout: full-width graph, correct type scale, safe footnotes */
.page-stats .stats-progress-card{box-sizing:border-box;min-width:0;overflow:hidden}
.page-stats .stats-progress-card .stats-chart-plot{position:relative;box-sizing:border-box;overflow:hidden;margin-top:8px;height:220px;min-height:220px;width:100%;flex:none}
.page-stats .stats-progress-card .tg-stats-chart-svg{overflow:hidden;max-width:100%}
.page-stats .stats-progress-card .tg-chart-y-label,.page-stats .stats-progress-card .tg-chart-label{font-size:11px;font-weight:550;letter-spacing:0}
.page-stats .stats-progress-switch.tg-segment{flex-wrap:wrap;overflow:visible;gap:2px;align-content:center}
.page-stats .stats-progress-switch.tg-segment>button{flex:1 1 128px;min-width:0;font-size:11px;padding:7px 9px}
.page-stats .stats-progress-card .stats-chart-note{position:relative;flex:none;margin:7px 0 0;font-size:11px}
.page-stats .stats-advanced-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-stats .stats-daily-goal{display:flex;align-items:center;flex-wrap:wrap;gap:9px 12px}
.page-stats .stats-goal-state{display:flex;align-items:center;gap:9px;min-width:0}
.page-stats .stats-goal-state strong{font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}
.page-stats .stats-goal-state span{font-size:12px;color:var(--muted)}
.page-stats .stats-goal-track{width:105px;height:5px;overflow:hidden;border-radius:8px;background:var(--line);flex:0 0 105px}
.page-stats .stats-goal-track span{display:block;width:0;height:100%;background:var(--accent);border-radius:inherit;transition:width .2s ease}
.page-stats #stats-goal-next{font-size:12px;font-weight:650;white-space:nowrap}
@media(max-width:900px){.page-stats .stats-advanced-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.page-stats .stats-progress-card .stats-chart-plot{height:185px;min-height:185px}.page-stats .stats-progress-switch.tg-segment>button{flex:1 1 100px}.page-stats .stats-goal-track{order:6;flex:1 0 100%;width:100%}}

/* Advanced Stats: two accessible views, not draggable widgets.
   Personal data and chart sizes remain unchanged; only presentation switches. */
.page-stats .stats-view-switch{width:max-content;max-width:100%;margin:0 0 2px;align-self:flex-start}
.page-stats .stats-view-switch button{min-width:104px}
.page-stats #player-advanced-dashboard[data-active-view="activity"] [data-stats-view="performance"],
.page-stats #player-advanced-dashboard[data-active-view="performance"] [data-stats-view="activity"]{display:none!important}
.page-stats #player-advanced-dashboard[data-active-view="performance"] .stats-advanced-panels{
 grid-template-columns:minmax(0,1fr)
}
.page-stats .stats-advanced-panels .stats-progress-card{grid-column:1/-1}
.page-stats .stats-activity-day.is-played{
 border-color:transparent;
 background:color-mix(in srgb,#2d976d var(--tg-heat,50%),var(--surface-soft));
}
.page-stats .stats-activity-day{transition:filter .16s,transform .16s}
.page-stats .stats-activity-day.is-played:hover{filter:brightness(1.07);transform:scale(1.15);z-index:1}
.page-stats .stats-activity-legend{display:flex;align-items:center;gap:9px;
 margin:10px 0 5px;font-size:11px;color:var(--muted)}
.page-stats .stats-activity-legend strong{margin-left:auto;font-weight:700;color:var(--text);white-space:nowrap}
.page-stats .stats-activity-swatch{
 flex:1;max-width:112px;height:10px;border-radius:10px;
 background:linear-gradient(to right,
  color-mix(in srgb,#2d976d 20%,var(--surface-soft)),
  color-mix(in srgb,#2d976d 50%,var(--surface-soft)),#2d976d)
}
.page-stats .stats-calendar-range{margin:5px 0 15px}
.page-stats .stats-activity-extra{
 margin-top:auto;padding-top:18px;display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));gap:8px
}
.page-stats .stats-activity-extra>div{
 display:flex;flex-direction:column;gap:7px;min-width:0;border-top:1px solid var(--line);
 padding-top:13px
}
.page-stats .stats-activity-extra small{color:var(--muted);font-size:10px;line-height:1.4}
.page-stats .stats-activity-extra strong{font-size:clamp(19px,2.3vw,29px);font-weight:760;
 color:var(--text);line-height:1.16;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
@media(max-width:580px){
 .page-stats .stats-view-switch{width:100%}
 .page-stats .stats-view-switch button{flex:1;min-width:0}
 .page-stats .stats-activity-extra{gap:6px}
 .page-stats .stats-activity-extra strong{font-size:20px}
}
@media(prefers-reduced-motion:reduce){.page-stats .stats-activity-day{transition:none}}

/* Plus: a visual cross-game strength comparison from verified normalized scores. */
.page-stats .stats-strengths{display:flex;flex-direction:column;gap:13px;min-width:0}
.page-stats .stats-strengths-list{display:grid;gap:7px}
.page-stats .stats-strength-row{
 display:grid;grid-template-columns:minmax(0,200px) minmax(40px,1fr) 50px;
 gap:13px;align-items:center;padding:11px 13px;background:var(--surface-soft);
 border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--text);
 min-width:0;transition:border-color .16s,background .16s
}
.page-stats .stats-strength-row:hover,.page-stats .stats-strength-row:focus-visible{
 border-color:var(--muted);background:var(--surface)}
.page-stats .stats-strength-row:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.page-stats .stats-strength-name{display:flex;align-items:center;gap:10px;min-width:0}
.page-stats .stats-strength-name .tg-game-icon{--tg-icon-size:27px;--tg-icon-art-size:21px}
.page-stats .stats-strength-name strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.page-stats .stats-strength-track{height:9px;background:var(--line);border-radius:30px;overflow:hidden;display:block}
.page-stats .stats-strength-track>span{display:block;height:100%;border-radius:inherit;
 background:linear-gradient(90deg,#77bdad,#78a8dc)}
.page-stats .stats-strength-row b{font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
@media(max-width:580px){.page-stats .stats-strength-row{grid-template-columns:minmax(0,110px) minmax(30px,1fr) 39px;gap:7px;padding:10px 8px}
 .page-stats .stats-strength-name{gap:5px}
 .page-stats .stats-strength-name strong{font-size:11px}}
@media(prefers-reduced-motion:reduce){.page-stats .stats-strength-row{transition:none}}

/* Match the existing site-wide rankings segmented toggle, including its runner. */
.page-stats .stats-view-switch.rankings-switch{
 display:inline-flex;align-items:center;justify-content:center;gap:3px;
 margin:0 0 4px;padding:3px;border:1px solid var(--line);
 border-radius:10px;background:var(--surface-soft);width:max-content;max-width:100%;
}
.page-stats .stats-view-switch.rankings-switch>button{
 flex:0 0 auto;min-width:106px;min-height:34px;padding:7px 12px;
 border:0!important;border-radius:8px;background:transparent!important;
 color:var(--muted);font:inherit;font-size:12px;font-weight:700;cursor:pointer;
}
.page-stats .stats-view-switch.rankings-switch>button[aria-pressed="true"]{
 color:var(--text)!important;background:var(--surface)!important;
 box-shadow:0 1px 4px #0000000d
}
.page-stats .stats-view-switch.rankings-switch.tg-segment-ready>button[aria-pressed="true"]{
 background:transparent!important;box-shadow:none!important;
}
.page-stats .stats-view-switch.rankings-switch>button:focus-visible{
 outline:2px solid var(--accent);outline-offset:-2px
}
:root[data-theme="dark"] .page-stats .stats-activity-day.is-played{
 /* Fewer played games = light mint, more games = deep green. */
 background:color-mix(in srgb,#d6f1e4 var(--tg-dark-heat,65%),#1b7051);
}
/* The same pale-to-deep meaning in every colour scheme. */
:root[data-theme="dark"] .page-stats .stats-activity-swatch{
 background:linear-gradient(to right,#d6f1e4,#80b5a2 45%,#1b7051)
}
.page-stats .stats-plus [data-plus-preview-note]{display:none!important}
@media(max-width:580px){.page-stats .stats-view-switch.rankings-switch{width:100%}
.page-stats .stats-view-switch.rankings-switch>button{min-width:0;flex:1;padding:7px 6px;font-size:11px}}

/* Advanced personal statistics: competition mode filters the entire dashboard,
   independently of the Today / All-time period selector above the main cards. */
.page-stats .stats-competition-switch.tg-segment{
 width:max-content;max-width:100%;margin:0;align-self:flex-start;
 display:flex;flex-wrap:wrap;gap:2px
}
.page-stats .stats-competition-switch.tg-segment>button{
 min-width:76px;min-height:36px;padding:8px 15px;font-size:12px
}
.page-stats .stats-competition-scope{
 margin:-14px 0 0;font-size:11px;line-height:1.5;color:var(--muted)
}
@media(max-width:700px){
 .page-stats .stats-competition-switch.tg-segment{
  width:min(100%,330px)
 }
 .page-stats .stats-competition-switch.tg-segment>button{
  flex:1 1 0;min-width:0
 }
}
