:root{--accent:#008dff;--bg:#121212;--surface:#1d1d1d;--surface2:#242424;--border:#303030;--text:#f7f7f7;--muted:#929292;--icon:none;color-scheme:dark;font-family:Montserrat,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-height:100vh}body:before{content:"";position:fixed;inset:62px 0 0;pointer-events:none;background-image:var(--icon);background-size:215px;background-repeat:repeat;opacity:.045;filter:grayscale(1);z-index:-1}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.topbar{height:64px;border-bottom:1px solid #242424;background:#141414ef;position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.nav{max-width:1100px;height:100%;margin:auto;display:flex;align-items:center;gap:24px;padding:0 24px}.brand{display:flex;align-items:center;gap:10px;color:white;text-decoration:none;font-weight:800;font-size:18px}.brand-icon{width:27px;height:27px;display:grid;place-items:center;color:var(--accent)}.brand-icon img{width:100%;height:100%;object-fit:contain}.nav-current{background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent);padding:8px 14px;border-radius:8px;font-weight:700}.nav-spacer{flex:1}.live{display:flex;align-items:center;gap:8px;color:#bdbdbd;font-size:13px}.live-dot{height:8px;width:8px;border-radius:50%;background:#69d796;box-shadow:0 0 9px #69d796}.quiet,.pagination button,#close{background:#252525;border:1px solid #333;color:#eee;border-radius:9px;padding:9px 14px;font-weight:600}.quiet:hover,.pagination button:hover,#close:hover{border-color:var(--accent)}main{max-width:900px;margin:auto;padding:0 24px}.hero{text-align:center;padding:45px 0 38px}.hero-icon{width:110px;height:110px;display:grid;place-items:center;margin:auto auto 12px;color:var(--accent);font-size:85px;filter:drop-shadow(0 0 22px color-mix(in srgb,var(--accent) 38%,transparent))}.hero-icon img{width:100%;height:100%;object-fit:contain}.hero h1{font-size:48px;line-height:1.1;margin:12px 0;font-weight:800;letter-spacing:-.05em}.hero p{color:var(--muted);font-size:16px;margin:10px 0 0}h2{font-size:25px;letter-spacing:-.035em;margin:0 0 14px}.search-section{position:relative;margin:0 0 49px}.search{height:58px;background:var(--surface);border:1px solid var(--border);border-radius:12px;display:flex;align-items:center;gap:12px;padding:0 18px;color:var(--muted);font-size:24px}.search:focus-within{border-color:var(--accent)}.search input{background:none;border:0;outline:0;color:white;width:100%;font-size:15px}.suggestions{position:absolute;z-index:4;top:calc(100% + 5px);width:100%;background:#222;border:1px solid #393939;border-radius:12px;box-shadow:0 12px 36px #0008;overflow:hidden}.suggestions button{display:block;text-align:left;width:100%;background:none;color:white;border:0;padding:12px 18px}.suggestions button:hover{background:#303030}.section{margin:0 0 48px}.heading{display:flex;justify-content:space-between;align-items:baseline}.muted{color:var(--muted)}.heading .muted{font-size:12px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px}.panel.pad{padding:25px}.panel p{margin:0 0 20px;font-size:14px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.metric{display:flex;flex-direction:column;text-align:left;gap:3px;padding:16px 18px;background:#1a1a1a;color:#ddd;border:1px solid #333;border-radius:12px}.metric.active{background:color-mix(in srgb,var(--accent) 10%,#1a1a1a);border-color:color-mix(in srgb,var(--accent) 45%,#333)}.metric small{font-size:11px;font-weight:800;letter-spacing:.05em;color:#909090}.metric.active small,.metric.active strong{color:var(--accent)}.metric strong{font-size:19px}.chart-heading{display:flex;align-items:baseline;gap:10px;margin:26px 0 10px}.chart-heading strong{font-size:27px;color:var(--accent)}.chart-heading span{font-size:12px;text-transform:uppercase;letter-spacing:.08em}.chart{height:230px;position:relative;display:flex;align-items:center;justify-content:center}.chart svg{width:100%;height:100%;overflow:visible}.chart-tall{height:300px}.note{text-align:center;color:#777;font-size:12px;margin:8px 0 0}.richest{display:grid;gap:8px}.rank{width:100%;display:flex;align-items:center;gap:12px;background:#1a1a1a;border:1px solid #303030;border-radius:10px;padding:10px 14px;color:#fff;text-align:left}.rank:hover{border-color:var(--accent)}.rank .number{width:30px;color:#969696;font-weight:700}.rank img,.avatar img{width:34px;height:34px;image-rendering:pixelated;border-radius:5px}.rank .name{flex:1;font-weight:600}.rank .value{font-weight:700}.rank .share{font-size:12px;color:#888;margin-right:14px}.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.tabs button{background:#252525;border:1px solid #363636;border-radius:8px;color:#aaa;padding:9px 13px;font-weight:700}.tabs button.active{background:var(--accent);color:#17120e;border-color:var(--accent)}.board .rank{margin:6px 0}.pagination{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:20px;color:#aaa;font-size:13px}.pagination button:disabled{opacity:.35;cursor:default}footer{max-width:1100px;padding:40px 24px;margin:50px auto 0;border-top:1px solid #2b2b2b;display:flex;justify-content:space-between;color:#777;font-size:12px}footer strong{text-transform:uppercase;color:#aaa}.modal[hidden],.suggestions[hidden]{display:none}.modal{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:18px}.scrim{position:absolute;inset:0;background:#000b;backdrop-filter:blur(7px)}.profile{position:relative;width:min(560px,100%);background:#1b1b1b;border:1px solid #353535;border-radius:15px;overflow:hidden;box-shadow:0 25px 100px #000b}.profile-head{padding:20px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 12%,#1b1b1b),#1b1b1b);display:flex;align-items:center;gap:15px}.avatar img{width:64px;height:64px}.profile h2{margin:0;font-size:24px}.profile-head p{margin:4px 0 0;font-size:12px}.profile-head button{margin-left:auto;align-self:start}.profile-chart-title{padding:15px 20px 0;color:#888;font-size:11px;font-weight:700;letter-spacing:.06em}.profile-chart{height:120px;padding:8px 20px;color:var(--accent)}.profile-chart svg{height:100%;width:100%}.profile-stats{display:grid;grid-template-columns:repeat(4,1fr)}.profile-stat{padding:16px;border-top:1px solid #303030;border-right:1px solid #303030;min-height:82px}.profile-stat small{display:block;color:#888;font-size:10px;font-weight:800;letter-spacing:.035em}.profile-stat strong{display:block;margin-top:6px;font-size:16px}.empty{color:#888;text-align:center;padding:25px}@media(max-width:650px){.nav{gap:12px}.live{display:none}.hero{padding:35px 0}.hero h1{font-size:40px}.metric-grid{grid-template-columns:repeat(2,1fr)}.profile-stats{grid-template-columns:repeat(2,1fr)}.rank .share{display:none}footer{display:block}footer span{display:block;margin-top:8px}}@media(max-width:420px){.nav-current{display:none}.panel{padding:13px}.metric{padding:12px}.metric strong{font-size:16px}}
body:before{display:none}#backdrop{position:fixed;inset:64px 0 0;z-index:-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));grid-auto-rows:180px;justify-items:center;align-items:center;pointer-events:none;overflow:hidden;opacity:.075;filter:grayscale(1)}#backdrop span{width:66px;height:66px;background-image:var(--icon);background-size:contain;background-position:center;background-repeat:no-repeat}.profile-chart.muted{color:#888}
.chart-tall{display:block}.chart-tall svg{height:250px}.chart-tall .legend{margin-top:10px}
#backdrop{inset:0}.hero{padding:54px 0 42px}.hero h1{font-size:clamp(32px,5vw,48px);overflow-wrap:anywhere}.profile{width:min(600px,100%)}.profile-head{min-height:110px}.profile-identity{min-width:0;flex:1}.profile-name-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.profile-name-line h2{overflow-wrap:anywhere}.online-badge{display:inline-block;background:#1d3523;color:#69d796;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}.online-badge[hidden]{display:none}.profile-actions{display:flex;gap:6px;align-self:start}.profile-actions button{margin-left:0!important;align-self:auto!important;width:34px;height:34px;padding:0;display:grid;place-items:center;background:#292929;border:1px solid #333;color:#ddd;border-radius:8px;font-size:19px}.profile-actions button:hover{border-color:var(--accent);color:var(--accent)}.profile-actions svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.profile-chart-head{padding:17px 20px 0;display:flex;align-items:baseline;justify-content:space-between;gap:16px}.profile-chart-head span{color:#929292;font-size:11px;font-weight:700;letter-spacing:.05em}.profile-chart-head strong{color:var(--accent);font-size:15px}.profile-chart{height:185px;padding:5px 20px 16px;color:#888}.profile-chart svg{height:100%;width:100%;overflow:visible}.profile-stat{appearance:none;background:#191919;color:#fff;text-align:left;border-bottom:0;border-left:0;cursor:pointer}.profile-stat:hover{background:#242424}.profile-stat.active{background:color-mix(in srgb,var(--accent) 16%,#191919);outline:1px solid color-mix(in srgb,var(--accent) 65%,#333);outline-offset:-1px}.profile-stat small:before{content:'●';font-size:10px;color:var(--stat-color,var(--accent));margin-right:5px}.profile-stat.active small,.profile-stat.active strong{color:var(--accent)}.profile-stat em{display:block;font-style:normal;color:var(--stat-color,var(--accent));font-size:11px;font-weight:700;margin-top:3px}@media(max-width:650px){.hero{padding:32px 0 34px}.profile-head{padding:16px}.profile-identity h2{font-size:20px}.profile-chart{height:160px}.profile-stat{min-height:77px;padding:12px}}@media(max-width:390px){.profile-name-line{gap:4px}.profile-actions{gap:3px}.profile-head{gap:9px}.avatar img{width:48px;height:48px}}
.profile-actions button[data-copied="true"] svg{display:none}.profile-actions button[data-copied="true"]:after{content:'✓';font-weight:800;color:var(--accent)}

/* Theme tokens and category colors are supplied by /api/stats. */
body{background:var(--bg);color:var(--text)}
#backdrop{opacity:var(--backdrop-opacity,.075)}
.panel,.search{background:var(--surface);border-color:var(--border)}
.profile{background:var(--surface);border-color:var(--border);color:var(--text)}
.profile-head{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 12%,var(--surface)),var(--surface))}
.muted,.hero p,.heading .muted{color:var(--muted)}
.metric,.rank,.profile-stat{background:color-mix(in srgb,var(--surface) 75%,var(--bg));border-color:var(--border);color:var(--text)}
.metric small:before{content:'●';color:var(--stat-color,var(--accent));margin-right:6px}
.metric.active,.profile-stat.active{background:color-mix(in srgb,var(--stat-color,var(--accent)) 14%,var(--surface));border-color:color-mix(in srgb,var(--stat-color,var(--accent)) 55%,var(--border));outline-color:color-mix(in srgb,var(--stat-color,var(--accent)) 55%,var(--border))}
.metric.active small,.metric.active strong,.profile-stat.active small,.profile-stat.active strong,.rank .value{color:var(--stat-color,var(--accent))}
.rank:hover,.profile-stat:hover{border-color:var(--stat-color,var(--accent))}
.tabs button{background:var(--surface2);border-color:var(--border)}
.tabs button.active{background:var(--stat-color,var(--accent));border-color:var(--stat-color,var(--accent));color:#141414}
.profile-actions button{background:var(--surface2);border-color:var(--border)}
#close svg{display:block;width:16px;height:16px;stroke-width:2.2}
.profile-chart-head strong{color:var(--stat-color,var(--accent))}

.search-box{position:relative}
.recent-profiles[hidden],.chart-tooltip[hidden]{display:none}
.recent-profiles{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:12px;color:var(--muted);font-size:12px}
.recent-list{display:flex;flex-wrap:wrap;gap:7px}
.recent-player{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;background:var(--surface2);border:1px solid var(--border);border-radius:9px;color:var(--text);font-size:12px;font-weight:700}
.recent-player:hover{border-color:var(--accent)}
.recent-player img{width:22px;height:22px;border-radius:4px;image-rendering:pixelated}
#clear-recent{margin-left:auto;border:0;background:none;color:var(--muted);font-size:11px;padding:5px}
#clear-recent:hover{color:var(--text)}
.chart.scrubbable,.profile-chart.scrubbable{cursor:crosshair;touch-action:pan-y}
.profile-chart{position:relative}
.scrub-guide{pointer-events:none}
.chart-tooltip{position:absolute;z-index:2;top:8px;transform:translateX(-50%);min-width:105px;max-width:min(250px,90%);padding:9px 11px;border:1px solid var(--border);border-radius:9px;background:color-mix(in srgb,var(--surface) 94%,#000);box-shadow:0 8px 24px #0009;color:var(--text);pointer-events:none;white-space:nowrap;font-size:12px}
.chart-tooltip-date{color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;margin-bottom:5px}
.chart-tooltip-row{display:flex;justify-content:space-between;align-items:center;gap:12px;line-height:1.55}
.chart-tooltip-name{color:var(--series-color,var(--accent));overflow:hidden;text-overflow:ellipsis}
.chart-tooltip-name:before{content:'●';margin-right:5px}
.chart-tooltip-row strong{font-size:12px}
.range-controls{display:inline-flex;align-items:center;gap:3px;flex:0 0 auto;padding:3px;background:var(--surface2);border:1px solid var(--border);border-radius:9px}
.range-controls button{border:0;border-radius:6px;padding:5px 9px;background:transparent;color:var(--muted);font-size:11px;font-weight:800;line-height:1.3}
.range-controls button:hover{color:var(--text)}
.range-controls button.active{background:color-mix(in srgb,var(--accent) 19%,var(--surface));color:var(--accent)}
.chart-heading{flex-wrap:wrap}.chart-heading .range-controls{margin-left:auto}.chart-range{display:flex;width:max-content;margin:-5px 0 14px auto}
.movers-controls{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;flex-wrap:wrap}.movers-controls .tabs{margin-bottom:8px}.movers-note{font-size:12px;margin:1px 0 12px}.mover-row .mover-total{color:var(--muted);font-size:12px;white-space:nowrap}.mover-row .mover-change{min-width:78px;text-align:right;font-weight:800;color:var(--stat-color,var(--accent));white-space:nowrap}
.profile-range{display:flex;width:max-content;margin:9px 20px 0 auto}.profile-chart{height:170px}
@media(max-width:650px){.chart-heading .range-controls{margin-left:0}.mover-row{gap:8px}.mover-row .mover-total{display:none}.mover-row .mover-change{min-width:65px}.profile-chart{height:150px}}

/* Montserrat hierarchy: bold totals, sentence-case labels, quiet supporting copy. */
body{font-weight:400;line-height:1.5}
.hero h1{font-weight:800;letter-spacing:-.035em}
h2{font-weight:700;letter-spacing:-.025em;line-height:1.25}
.hero p,.panel p{font-weight:400;line-height:1.65}
.metric small,.profile-stat small{font-size:11px;font-weight:500;letter-spacing:0}
.metric strong,.profile-stat strong,.rank .value{font-weight:700;font-variant-numeric:tabular-nums}
.chart-heading span{font-weight:500;text-transform:none;letter-spacing:0}
.profile-chart-head span{font-size:12px;font-weight:500;letter-spacing:0}
.tabs button,.range-controls button,.recent-player,.rank .name{font-weight:600}
.chart-tooltip-date{font-weight:500;text-transform:none}
footer strong{text-transform:none;font-weight:600}

.demo-badge{position:fixed;z-index:8;right:18px;top:16px;padding:9px 13px;border-radius:999px;background:color-mix(in srgb,var(--accent) 15%,#191919);border:1px solid color-mix(in srgb,var(--accent) 45%,#343434);color:var(--accent);font-size:12px;font-weight:600;box-shadow:0 7px 30px #0006}.profile-demo-label{padding:4px 7px;border-radius:7px;border:1px solid color-mix(in srgb,var(--accent) 45%,#333);color:var(--accent);font-size:10px;font-weight:600;white-space:nowrap}@media(max-width:650px){.demo-badge{position:absolute;right:10px;top:10px;font-size:10px;padding:7px 9px}}