:root{--bg:#e4e4e4;--content:#fff;--panel:#f2f2f2;--border:#999;--border-light:#ccc;--text:#222;--text-muted:#666;--link:#04c;--pink:#d81b7a;--pink-dark:#a8125d;--pink-pale:#fdeef6;--stripe:#f7f7f7;--row-hover:#fff0f7;--input-border:#7f9db9;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{font-size:13px}body{background:var(--bg);color:var(--text);margin:0;font-family:Verdana,Tahoma,Arial,sans-serif;line-height:1.5}#root{min-height:100vh}a{color:var(--link);text-decoration:underline}a:hover{color:#c00}h1,h2,h3{margin:0 0 .4rem;font-family:Trebuchet MS,Verdana,sans-serif;font-weight:700;line-height:1.25}.container{width:min(1000px,100% - 2rem);margin-inline:auto}.app-shell{flex-direction:column;min-height:100vh;display:flex}.app-shell>main{background:var(--content);border:1px solid var(--border);border-top:none;border-bottom:none;flex:1;padding:1.4rem 1.5rem 3rem}.site-header{background:var(--pink);border-bottom:2px solid var(--pink-dark)}.header-inner{justify-content:space-between;align-items:center;gap:1rem;padding:.55rem 0;display:flex}.brand{color:#fff;align-items:center;gap:.5rem;font-family:Trebuchet MS,Verdana,sans-serif;font-size:1.35rem;font-weight:700;text-decoration:none;display:flex}.brand:hover{color:#fff;text-decoration:none}.brand-mark{width:28px;height:28px;color:var(--pink);border:1px solid var(--pink-dark);background:#fff;place-items:center;font-size:1.1rem;display:grid}.brand-dot{color:#ffcce4}.main-nav{gap:.25rem;display:flex}.main-nav a{color:#fff;padding:.25rem .6rem;font-size:.95rem;font-weight:700;text-decoration:none}.main-nav a:before{content:"[ ";color:#f4a9ce}.main-nav a:after{content:" ]";color:#f4a9ce}.main-nav a:hover{color:#ffe3f1}.main-nav a.active{color:var(--pink);background:#fff}.main-nav a.active:before,.main-nav a.active:after{color:var(--pink)}.page-hero{border-bottom:3px double var(--border-light);margin-bottom:1.2rem;padding-bottom:.6rem}.page-hero h1{font-size:1.9rem}.accent{color:var(--pink)}.hero-sub{color:var(--text-muted);min-height:1.5em;margin:0;font-size:.92rem}.toolbar{background:var(--panel);border:1px solid var(--border-light);flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1.2rem;padding:.7rem;display:flex}.search-input{border:1px solid var(--input-border);color:var(--text);background:#fff;border-radius:0;outline:none;flex:240px;padding:.35rem .55rem;font-family:inherit;font-size:.95rem}.search-input:focus{border-color:var(--pink)}.select,.order-btn{border:1px solid var(--input-border);color:var(--text);cursor:pointer;background:#fff;border-radius:0;padding:.32rem .5rem;font-family:inherit;font-size:.92rem}.order-btn{width:34px;font-size:1rem;line-height:1.2}.select:hover,.order-btn:hover{background:var(--pink-pale)}.toggle{color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.4rem;font-size:.92rem;display:flex}.toggle input{accent-color:var(--pink);width:1rem;height:1rem}.chart-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.9rem;display:grid}.is-refreshing{opacity:.55}.chart-card{border:1px solid var(--border);color:var(--text);background:#fff;flex-direction:column;text-decoration:none;display:flex}.chart-card:hover{border-color:var(--pink);background:var(--pink-pale);color:var(--text);text-decoration:none}.chart-cover{aspect-ratio:1;background:var(--panel);border-bottom:1px solid var(--border-light);position:relative}.chart-cover img{object-fit:cover;width:100%;height:100%;display:block}.ranked-badge{background:var(--pink);border:1px solid var(--pink-dark);color:#fff;letter-spacing:.06em;padding:.1rem .45rem;font-size:.72rem;font-weight:700;position:absolute;top:6px;left:6px}.ranked-badge.inline{position:static}.unranked-badge{background:var(--panel);border:1px solid var(--border);color:var(--text-muted);letter-spacing:.06em;padding:.1rem .45rem;font-size:.72rem;font-weight:700}.length-badge{color:#fff;font-variant-numeric:tabular-nums;background:#000;padding:.05rem .4rem;font-size:.78rem;position:absolute;bottom:6px;right:6px}.chart-card-body{flex-direction:column;flex:1;gap:.1rem;padding:.6rem .7rem .7rem;display:flex}.chart-title{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1rem;overflow:hidden}.chart-artist{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.85rem;overflow:hidden}.chart-charter{color:var(--text-muted);margin:.1rem 0 0;font-size:.8rem}.chart-charter span{color:var(--pink);font-weight:700}.chart-card-footer{justify-content:space-between;align-items:center;gap:.5rem;margin-top:auto;padding-top:.5rem;display:flex}.diff-row{flex-wrap:wrap;gap:.25rem;display:flex}.diff-pill{color:#fff;font-variant-numeric:tabular-nums;place-items:center;min-width:1.6rem;padding:.05rem .35rem;font-size:.8rem;font-weight:700;display:inline-grid}.diff-1{background:#2e9e5b}.diff-2{background:#2f6fc0}.diff-3{background:#c93055}.diff-4{background:#7d3fc4}.diff-5{background:#b8891f}.chart-stats{color:var(--text-muted);white-space:nowrap;gap:.55rem;font-size:.8rem;display:flex}.chart-hero{grid-template-columns:280px 1fr;align-items:start;gap:1.5rem;margin-bottom:2rem;display:grid}@media (width<=760px){.chart-hero{grid-template-columns:1fr}}.chart-hero-cover img{aspect-ratio:1;object-fit:cover;border:1px solid var(--border);width:100%;display:block}.chart-hero-info h1{font-size:1.9rem}.chart-hero-badges{margin-bottom:.4rem}.romanized{color:var(--text-muted);margin:-.2rem 0 .3rem;font-style:italic}.chart-hero-artist{color:var(--pink);margin:0 0 .2rem;font-size:1.1rem;font-weight:700}.chart-hero-meta{color:var(--text-muted);margin:0 0 .9rem;font-size:.92rem}.meta-grid{background:var(--panel);border:1px solid var(--border-light);grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:.6rem;margin:0 0 .9rem;padding:.7rem .8rem;display:grid}.meta-grid dt{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.72rem}.meta-grid dd{font-variant-numeric:tabular-nums;margin:0;font-weight:700}.tag-row{flex-wrap:wrap;gap:.35rem;margin-bottom:.9rem;display:flex}.tag{border:1px dotted var(--border);color:var(--text-muted);background:#fff;padding:.05rem .5rem;font-size:.8rem}.chart-description{color:var(--text-muted);white-space:pre-wrap;margin:0 0 .9rem;font-size:.92rem}.action-row{flex-wrap:wrap;gap:.5rem;display:flex}.btn{border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;border-radius:0;align-items:center;gap:.35rem;padding:.4rem .9rem;font-family:inherit;font-size:.95rem;font-weight:700;text-decoration:none;display:inline-flex}.btn:hover{color:var(--text);background:#e6e6e6;text-decoration:none}.btn-primary{background:var(--pink);border-color:var(--pink-dark);color:#fff}.btn-primary:hover{background:var(--pink-dark);color:#fff}.leaderboard-section h2{background:var(--pink);color:#fff;margin-bottom:.7rem;padding:.3rem .6rem;font-size:1.15rem}.sheet-tabs{flex-wrap:wrap;gap:.4rem;margin-bottom:.5rem;display:flex}.sheet-tab{border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;border-radius:0;align-items:center;gap:.4rem;padding:.3rem .7rem;font-family:inherit;font-size:.92rem;font-weight:700;display:flex}.sheet-tab:hover{background:var(--pink-pale)}.sheet-tab.active{border-color:var(--pink);color:var(--pink);background:#fff;border-bottom:2px solid #fff}.sheet-charter{color:var(--text-muted);margin:0 0 .8rem;font-size:.85rem}.table-wrap{border:1px solid var(--border);background:#fff;overflow-x:auto}.score-table{border-collapse:collapse;width:100%;min-width:640px;font-size:.92rem}.score-table th,.score-table td{text-align:left;border-bottom:1px solid var(--border-light);white-space:nowrap;padding:.45rem .7rem}.score-table tbody tr:last-child td{border-bottom:none}.score-table thead th{text-transform:uppercase;letter-spacing:.06em;color:#fff;background:var(--pink);border-bottom:1px solid var(--pink-dark);font-size:.78rem}.score-table tbody tr:nth-child(2n){background:var(--stripe)}.score-table tbody tr:hover{background:var(--row-hover)}.score-table .num{text-align:right;font-variant-numeric:tabular-nums}.rank-cell{font-weight:700}.rank-1{color:#b8860b}.rank-2{color:#708090}.rank-3{color:#a05a2c}.rank-other{color:var(--text-muted)}.player-cell{color:var(--link);align-items:center;gap:.5rem;font-weight:700;text-decoration:none;display:inline-flex}.player-cell:hover{color:#c00;text-decoration:underline}.muted{color:var(--text-muted)}td.accent,.score-table .accent{color:var(--pink);font-weight:700}.user-table td{vertical-align:middle}.badge-row{flex-wrap:wrap;gap:.3rem;display:flex}.badge-chip{color:#148;background:#e8f2fc;border:1px solid #69c;padding:.05rem .45rem;font-size:.75rem;font-weight:700}.banned-chip{color:#a22;background:#fdeaea;border:1px solid #c44;padding:.02rem .4rem;font-size:.72rem;font-weight:700}.avatar{border:1px solid var(--border);object-fit:cover;background:var(--panel);flex-shrink:0}.avatar-fallback{background:var(--pink);color:#fff;place-items:center;font-weight:700;display:inline-grid}.score-chart-cell{color:var(--link);align-items:center;gap:.5rem;text-decoration:none;display:inline-flex}.score-chart-cell:hover{color:#c00;text-decoration:underline}.score-chart-title{flex-direction:column;line-height:1.25;display:flex}.score-chart-title small{color:var(--text-muted);font-size:.78rem}.profile-hero{border:1px solid var(--border);background:#fff 50%/cover;margin-bottom:1rem}.profile-hero-scrim{background:#fff;align-items:center;gap:1rem;padding:1.1rem 1.2rem;display:flex}.profile-hero.has-banner .profile-hero-scrim{border-top:1px solid var(--border);margin-top:140px}.profile-id h1{align-items:center;gap:.6rem;margin-bottom:.1rem;font-size:1.7rem;display:flex}.profile-id p{margin:0 0 .4rem;font-size:.85rem}.profile-bio{color:var(--text-muted);white-space:pre-wrap;background:var(--panel);border:1px dotted var(--border);margin:0 0 1.2rem;padding:.6rem .8rem;font-size:.92rem}.stat-cards{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.6rem;margin-bottom:1.3rem;display:grid}.stat-card{background:var(--panel);border:1px solid var(--border-light);flex-direction:column;gap:.05rem;padding:.7rem .8rem;display:flex}.stat-value{font-variant-numeric:tabular-nums;font-family:Trebuchet MS,Verdana,sans-serif;font-size:1.3rem;font-weight:700}.stat-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);font-size:.72rem}.tab-row{border-bottom:1px solid var(--border);gap:.4rem;margin-bottom:1rem;padding-bottom:0;display:flex}.tab-btn{border:1px solid var(--border);background:var(--panel);color:var(--text-muted);cursor:pointer;border-bottom:none;border-radius:0;margin-bottom:-1px;padding:.35rem .9rem;font-family:inherit;font-size:.95rem;font-weight:700}.tab-btn:hover{background:var(--pink-pale)}.tab-btn.active{color:var(--pink);border-color:var(--border);background:#fff;border-bottom:1px solid #fff}.filter-chips{flex-wrap:wrap;gap:.4rem;margin-bottom:1.1rem;display:flex}.chip{border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;border-radius:0;padding:.25rem .7rem;font-family:inherit;font-size:.88rem;font-weight:700}.chip:hover{background:var(--pink-pale)}.chip.active{background:var(--pink);border-color:var(--pink-dark);color:#fff}.timeline{flex-direction:column;gap:.6rem;max-width:680px;display:flex}.timeline-card{border:1px solid var(--border-light);background:#fff;gap:.8rem;padding:.8rem .9rem;display:flex}.timeline-icon{font-size:1.3rem;line-height:1.3}.timeline-body{flex:1;min-width:0}.timeline-head{justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.2rem;display:flex}.timeline-time{flex-shrink:0;font-size:.8rem}.timeline-text{color:var(--text-muted);margin:0;font-size:.92rem}.timeline-text p{margin:0}.timeline-text strong{color:var(--text)}.timeline-message{background:var(--panel);border:1px dotted var(--border);white-space:pre-wrap;overflow-wrap:break-word;margin:0;padding:.5rem .7rem;font-size:.92rem}.timeline-chart{background:var(--panel);border:1px solid var(--border-light);color:var(--text);align-items:center;gap:.6rem;max-width:100%;margin-top:.5rem;padding:.4rem .7rem .4rem .4rem;text-decoration:none;display:inline-flex}.timeline-chart:hover{border-color:var(--pink);background:var(--pink-pale);color:var(--text);text-decoration:none}.timeline-chart img{border:1px solid var(--border-light);object-fit:cover;width:40px;height:40px}.timeline-chart span{flex-direction:column;min-width:0;line-height:1.25;display:flex}.timeline-chart strong,.timeline-chart small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.timeline-chart small{color:var(--text-muted)}.timeline-likes{color:var(--pink);margin-top:.4rem;font-size:.85rem;font-weight:700;display:inline-block}.pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:.3rem;margin-top:1.5rem;display:flex}.page-btn{border:1px solid var(--border);min-width:2.2rem;color:var(--link);cursor:pointer;font-variant-numeric:tabular-nums;background:#fff;border-radius:0;padding:.3rem .55rem;font-family:inherit;font-weight:700}.page-btn:hover:not(:disabled){background:var(--pink-pale);color:#c00}.page-btn:disabled{opacity:.45;cursor:default}.page-btn.page-current{background:var(--pink);border-color:var(--pink-dark);color:#fff;opacity:1}.page-gap{color:var(--text-muted);padding:0 .25rem}.status-block{color:var(--text-muted);justify-content:center;align-items:center;gap:.6rem;padding:2.5rem 1rem;font-size:1rem;font-style:italic;display:flex}.status-error{color:#a22;font-style:normal}.spinner{display:none}.site-footer{color:var(--text-muted);text-align:center;padding:1rem 0 1.6rem;font-size:.85rem}.site-footer p{margin:0}