:root{--bg:#fbfbfa;--fg:#17171a;--muted:#8c8c86;--faint:#dededa;--line:#ebebe7;--accent:#0f7b6c;--dot-size:30px;--dot-gap:4px;--row-gap:16px;--remove-size:28px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0f0f0f;--fg:#ededea;--muted:#77776f;--faint:#2a2a28;--line:#232321;--accent:#35c79a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#0f0f0f;--fg:#ededea;--muted:#77776f;--faint:#2a2a28;--line:#232321;--accent:#35c79a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:0}button:disabled{cursor:default}input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}.page{max-width:560px;margin:0 auto;padding:72px 24px 64px}.header{justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:40px;display:flex}.title{letter-spacing:-.02em;margin:0;font-size:24px;font-weight:600}.date{color:var(--muted);font-variant-numeric:tabular-nums;margin:0}.weekdays{grid-template-columns:repeat(7, var(--dot-size));gap:var(--dot-gap);margin:0 calc(var(--remove-size) + var(--row-gap)) 12px auto;display:grid}.weekday{color:var(--muted);letter-spacing:.06em;text-align:center;text-transform:uppercase;font-size:11px}.weekday[data-today=true]{color:var(--fg)}.habits{margin:0;padding:0;list-style:none}.habit{align-items:center;gap:var(--row-gap);border-bottom:1px solid var(--line);padding:14px 0;display:flex}.habit-text{flex:1;min-width:0}.habit-name{text-align:left;text-overflow:ellipsis;white-space:nowrap;max-width:100%;display:block;overflow:hidden}.habit-input{border:none;border-bottom:1px solid var(--accent);background:0 0;width:100%;padding:0}.habit-input:focus{outline:none}.habit-streak{color:var(--muted);margin:2px 0 0;font-size:12.5px}.habit-remove{width:var(--remove-size);height:var(--remove-size);color:var(--faint);opacity:0;flex:none;font-size:20px;line-height:1;transition:opacity .12s,color .12s}.habit:hover .habit-remove,.habit-remove:focus-visible{opacity:1}.habit-remove:hover{color:var(--fg)}.dots{grid-template-columns:repeat(7, var(--dot-size));gap:var(--dot-gap);display:grid}.dot{place-items:center;height:34px;display:grid}.dot-mark{border:1.5px solid var(--faint);border-radius:50%;width:15px;height:15px;transition:background-color .12s,border-color .12s,transform .12s}.dot:hover:not(:disabled) .dot-mark{border-color:var(--muted)}.dot[data-done=true] .dot-mark{background:var(--accent);border-color:var(--accent)}.dot[data-today=true] .dot-mark{width:17px;height:17px}.dot[data-today=true]:not([data-done=true]) .dot-mark{border-color:var(--muted)}.dot:active:not(:disabled) .dot-mark{transform:scale(.86)}.dot:disabled .dot-mark{opacity:.45;border-style:dotted}.add-trigger{color:var(--muted);margin-top:20px;transition:color .12s}.add-trigger:hover{color:var(--fg)}.add-form{align-items:center;gap:12px;margin-top:20px;display:flex}.add-input{border:none;border-bottom:1px solid var(--line);background:0 0;flex:1;min-width:0;padding:6px 0}.add-input::placeholder{color:var(--faint)}.add-input:focus{border-bottom-color:var(--accent);outline:none}.add-submit{color:var(--accent);flex:none}.add-submit:disabled{color:var(--faint)}.empty{padding:8px 0 4px}.empty-title{margin:0}.empty-hint{color:var(--muted);max-width:34ch;margin:4px 0 0}.footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;margin-top:64px;padding-top:20px;display:flex}.footer-right{gap:20px;display:flex}.ghost-button{color:var(--muted);font-size:13px;transition:color .12s}.ghost-button:hover:not(:disabled){color:var(--fg)}.ghost-button:disabled{opacity:.4}@media (width<=460px){.page{padding:48px 20px}.weekdays{margin-left:0;margin-right:0}.habit{flex-wrap:wrap;row-gap:10px}.habit-text{flex-basis:calc(100% - var(--remove-size) - var(--row-gap))}.habit-remove{opacity:1;order:1}.dots{flex-basis:100%;order:2}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}