.steps{--at-cal:4/11;--tint:light-dark(oklch(51.32% 0.1319 269.95),oklch(70.61% 0.1017 272.81));--on-top:light-dark(oklch(100% 0 none),oklch(17.76% 0 none));padding-block-start:45px}@media (max-width:1023px){.steps{--at-cal:1/8}}@media (max-width:719px){.steps{--at-cal:1/-1}}.steps .intro{margin-block-start:10px;max-width:34em;text-wrap:pretty}.steps .num{font-variant-numeric:tabular-nums}.steps .pager{grid-column:var(--at-cal);display:flex;justify-content:space-between;gap:12px;margin-block-start:40px;color:var(--ink-soft);font-size:13px}.steps .pager a{text-decoration:none}.steps .sec{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-content:start}.steps .cal{grid-column:var(--at-cal);grid-row:1;display:grid;grid-template-columns:subgrid;row-gap:6px;margin-block:18px 0;margin-inline:0;padding:0;list-style:none}.steps .wd{padding-block-end:2px;color:var(--ink-soft);font-size:11.5px;text-align:center}.steps .day{position:relative;display:flex;flex-direction:column;justify-content:space-between;height:64px;padding-block:5px 4px;padding-inline:7px;border-radius:3px;background:color-mix(in oklch,var(--tint) calc(var(--a, 0) * 100%),transparent);color:var(--ink-strong);line-height:1.4}.steps .day .d{color:var(--ink-soft);font-size:11px}.steps .day .n{align-self:flex-end;font-size:13px}.steps :is(.day .d,.day .n,.line dd){font-variant-numeric:tabular-nums}.steps .b0{--a:0.05}.steps .b1{--a:0.14}.steps .b2{--a:0.28}.steps .b3{--a:0.46}.steps .b4{--a:0.82}.steps .day.b4{color:var(--on-top)}.steps .b4 .d{color:inherit;opacity:.75}.steps .day.goal:after{content:"";position:absolute;inset-block-start:7px;inset-inline-end:7px;width:6px;height:6px;border-radius:50%;background:var(--stamp)}.steps .day.today{outline:1px dashed var(--ink-soft);outline-offset:-1px}.steps .day.today .n:not(:empty):after{content:attr(data-sofar);display:block;color:var(--ink-soft);font-size:9.5px;text-align:end}.steps .day.after,.steps .day.before{background:none;box-shadow:inset 0 0 0 1px var(--rule)}.steps .legend{grid-column:var(--at-cal);grid-row:2;display:flex;flex-wrap:wrap;gap:4px 14px;margin-block:14px 0;margin-inline:0;padding:0;color:var(--ink-soft);font-size:11.5px;list-style:none}.steps .legend li{display:flex;align-items:center;gap:6px}.steps .legend i{width:12px;height:12px;border-radius:2px;background:color-mix(in oklch,var(--tint) calc(var(--a) * 100%),transparent)}.steps .legend .dot{width:6px;height:6px;border-radius:50%;background:var(--stamp)}.steps h2{margin:0;color:var(--ink-strong);font-size:15px;font-weight:600}.steps dl,.steps ol.top{margin-block:6px 0;margin-inline:0;padding:0;list-style:none}.steps .line{display:flex;align-items:baseline;gap:8px;line-height:2}.steps .line .when,.steps .line dt{color:var(--ink);white-space:nowrap}.steps .line dd{margin:0;color:var(--ink-strong);font-weight:600;white-space:nowrap}.steps .line small{color:var(--ink-soft);font-size:12px;font-weight:400}.steps .leader{flex:1;min-width:1.5em;border-block-end:1px dotted var(--ink-soft);translate:0 -.35em}.steps .sub{margin-block:22px 0;margin-inline:0;color:var(--ink-soft);font-size:12.5px}.steps ol.top .line{font-size:13.5px}.steps ol.top .no{width:1.6em;color:var(--ink-soft);font-size:11px}.steps ol.top .goal .n{color:var(--stamp)}.steps .month-sum{grid-column:var(--at-side);grid-row:1/span 2;padding-block-start:18px}.steps .later{margin-block-start:80px;padding-block-start:36px;border-block-start:1px solid var(--rule)}.steps .year-head{grid-column:var(--at-cal);grid-row:1;font-size:22px}.steps .year-head small{margin-inline-start:10px;color:var(--ink-soft);font-size:13px;font-weight:400}.steps table{grid-column:var(--at-cal);grid-row:2;margin-block-start:18px;border-collapse:collapse;font-size:14px}.steps th{padding-block:0 6px;border-block-end:2px solid var(--ink-strong);color:var(--ink-strong);font-size:12px;font-weight:600}.steps td,.steps th{padding-inline:0;text-align:end}.steps td{padding-block:5px;border-block-end:1px solid var(--rule)}.steps :is(th,td):first-child{text-align:start}.steps td a{text-decoration:none}.steps td .chip{display:inline-block;min-width:5.5em;padding-block:0;padding-inline:8px;border-radius:3px;background:color-mix(in oklch,var(--tint) calc(var(--a) * 100%),transparent);color:var(--ink-strong)}.steps td .chip.b4{color:var(--on-top)}.steps tr[aria-current] td{color:var(--ink-strong);font-weight:600}.steps tr.best td:first-child a:after{content:"";display:inline-block;width:6px;height:6px;margin-inline-start:8px;border-radius:50%;background:var(--stamp);vertical-align:middle}.steps tr.off td{color:var(--ink-soft);opacity:.6}.steps tfoot td{border-block-start:2px solid var(--ink-strong);border-block-end:0;color:var(--ink-strong);font-weight:600}.steps .year-sum{grid-column:var(--at-side);grid-row:1/span 3}.steps .year-sum .month-name{font-size:13px}.steps .all-head,.steps .later .top-label{grid-column:var(--at-cal)}.steps .all-head{font-size:22px}.steps .since{margin-block:2px 0;color:var(--ink-soft);font-size:13px}.steps .huge,.steps .since{grid-column:var(--at-cal);margin-inline:0}.steps .huge{margin-block:14px 0;color:var(--ink-strong);font-size:clamp(34px,9vw,96px);font-weight:700;letter-spacing:-.03em;line-height:1.1}.steps .huge .unit{margin-inline-start:4px;color:var(--ink-soft);font-size:14px;font-weight:600;letter-spacing:0}.steps .records{grid-column:var(--at-cal);margin-block:36px 0;margin-inline:0}.steps .records .line{line-height:2.3}.steps .records .mid dd{font-weight:400}.steps .records .mid dd b{font-weight:600}.steps .records .mid .unit{margin-inline-start:6px;color:var(--ink-soft);font-size:12px}.steps .records .mid .note{color:var(--ink-soft);font-size:12px;white-space:nowrap}@media (max-width:1023px){.steps :is(.month-sum,.year-sum){grid-column:var(--at-cal);grid-row:auto;padding-block-start:36px}}@media (max-width:719px){.steps .cal{grid-template-columns:repeat(7,minmax(0,1fr));column-gap:4px;row-gap:4px}.steps .day{height:52px;padding-block:3px;padding-inline:4px}.steps .day .n{font-size:10.5px}.steps .day.goal:after{inset-block-start:5px;inset-inline-end:4px;width:5px;height:5px}.steps .line dd{text-align:end}.steps .line dt{white-space:normal}.steps .line dd small{display:block;margin-block-start:-6px;line-height:1.6}.steps .records .mid{flex-wrap:wrap}.steps .records .line dt{padding-block:5px;line-height:1.7}.steps .records .line:not(.mid) dd{max-width:55%;white-space:normal}.steps .records .line dd .num{white-space:nowrap}.steps .records .mid .note{width:100%;margin-block-start:-8px;line-height:1.6;text-align:end}}