.streak-stats { font-size:20px; margin:2.5rem 0; --streak-cell:12px; --streak-gap:3px; }
.streak-stats * { box-sizing:border-box; }
.streak-status,.streak-milestone,.streak-calendar-heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.streak-status { font-size:1em; color:var(--font-color-description); }
.streak-heroes { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin:2rem 0; }
.streak-label,.streak-description { display:block; font-size:1em; line-height:1.65; }
.streak-label { color:var(--font-color-description); }
.streak-description { color:var(--font-color-description); margin-top:.25rem; }
.streak-heroes strong { display:block; color:var(--font-color); font-size:clamp(2.6rem,7vw,5rem); line-height:1.2; letter-spacing:-.055em; font-variant-numeric:tabular-nums; }
.streak-stats strong small { font-size:.4em; font-weight:500; letter-spacing:0; margin-left:.35em; }
.streak-milestone { background:var(--bg-light); border-left:3px solid var(--primary-color); padding:1rem 1.2rem; font-size:1em; }
.streak-milestone > span:last-child { color:var(--font-color-description); font-size:1em; }
.streak-distance { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.3rem; padding:2rem 0; border-bottom:1px solid var(--table-border); }
.streak-distance strong,.streak-records strong { display:block; font-size:1.55rem; font-variant-numeric:tabular-nums; margin-top:.35rem; letter-spacing:-.035em; }
.streak-calendar-heading { margin-top:1.5rem; }
.streak-stats h2 { font-size:1.4rem; margin:1.5rem 0; }
.streak-calendar-heading form { display:flex; align-items:center; gap:.5rem; font-size:1em; margin-left:auto; }
.streak-calendar-heading select,.streak-calendar-heading button { box-sizing:border-box; height:2.25rem; min-height:2.25rem; width:auto; margin:0; padding:0 .6rem; line-height:normal; border:1px solid var(--table-border); border-radius:5px; background:var(--bg-card); color:var(--font-color); font:inherit; cursor:pointer; }
.streak-calendar-scroll { overflow-x:auto; padding:.5rem 2px; }
.streak-calendar { display:grid; grid-template-columns:30px 1fr; gap:8px; width:max-content; }
.streak-months { grid-column:2; display:grid; grid-template-columns:repeat(var(--streak-columns),var(--streak-cell)); gap:var(--streak-gap); font-size:.7rem; color:var(--font-color-description); padding-bottom:.5rem; }
.streak-months span { white-space:nowrap; min-width:0; line-height:1.2; }
.streak-weekdays { display:grid; grid-template-rows:repeat(7,var(--streak-cell)); gap:var(--streak-gap); font-size:.6rem; line-height:var(--streak-cell); color:var(--font-color-description); }
.streak-weekdays span:nth-child(2) { grid-row:3; }.streak-weekdays span:nth-child(3) { grid-row:5; }.streak-weekdays span:nth-child(4) { grid-row:7; }
.streak-days { display:grid; grid-auto-flow:column; grid-template-rows:repeat(7,var(--streak-cell)); grid-auto-columns:var(--streak-cell); gap:var(--streak-gap); }
.streak-stats .streak-day { display:block; width:var(--streak-cell); height:var(--streak-cell); margin:0; padding:0; min-width:0; min-height:0; border:0; border-radius:2px; box-shadow:none; }
.streak-days a { cursor:pointer; text-decoration:none; }
.streak-days a:hover,.streak-days a:focus-visible,.streak-days span:focus-visible { outline:2px solid var(--font-color); outline-offset:1px; }
.streak-stats .streak-level-0 { background:var(--bg-emphasis); }
.streak-stats .streak-level-1 { background:#e1efff; }
.streak-stats .streak-level-2 { background:#a3cfff; }
.streak-stats .streak-level-3 { background:#3399ff; }
.streak-stats .streak-level-4 { background:#1263c4; }
.streak-stats .streak-level-5 { background:#062b6f; }
.streak-stats .streak-future { background:var(--bg-light); border:1px solid var(--table-border); }
.streak-stats .streak-outside { background:transparent; }
.streak-day-detail { display:block; margin:.9rem 0; min-height:2.4em; color:var(--font-color-description); font-size:1em; line-height:1.5; }
.streak-legend { display:flex; flex-wrap:wrap; gap:.65rem; font-size:1em; color:var(--font-color-description); }
.streak-legend span { display:inline-flex; align-items:center; gap:.3rem; }
.streak-legend i { display:inline-block; width:12px; height:12px; border-radius:2px; }
.streak-records { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; padding-bottom:1.5rem; border-bottom:1px solid var(--table-border); }
.streak-stats .streak-method,.streak-data-note { font-size:1em; line-height:1.7; color:var(--font-color-description); }
@media(max-width:700px) { .streak-distance { grid-template-columns:repeat(2,minmax(0,1fr)); } .streak-records { grid-template-columns:1fr; gap:1.3rem; } .streak-heroes { gap:1rem; } .streak-heroes strong { font-size:clamp(2.2rem,10vw,4rem); } }

[data-theme="dark"] .streak-stats .streak-day:not(.streak-outside) { box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }