:root{color-scheme:dark;--bg: #0a0d14;--surface: #131824;--surface-2: #1a2231;--surface-3: #242e42;--surface-hover: #273248;--ink: #e9edf3;--ink-soft: #b8c2d4;--muted: #9aa6bc;--accent: #5a9bfc;--accent-strong: #7ab0ff;--accent-ink: #0a0d14;--accent-soft: rgba(90, 155, 252, .14);--green: #3ecf8e;--green-ink: #06281a;--green-soft: rgba(62, 207, 142, .13);--amber: #f5b94e;--amber-ink: #221703;--amber-soft: rgba(245, 185, 78, .13);--red: #f87171;--red-soft: rgba(248, 113, 113, .13);--border: rgba(255, 255, 255, .08);--radius-card: 18px;--radius-panel: 14px;--radius-row: 12px;--radius-input: 10px;--radius-pill: 999px;--font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;--fs-h2: 18px;--fs-h3: 15px;--fs-body: 16px;--fs-small: 14px;--fs-micro: 13px;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.76, 0, .24, 1);--ease-soft: cubic-bezier(.33, 1, .68, 1);--t-press: .14s;--t-hover: .18s;--t-ui: .24s;--t-reveal: .8s}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font-sans);background:var(--bg);color:var(--ink);line-height:1.6;font-size:var(--fs-body);font-kerning:normal;text-rendering:optimizeLegibility}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-input)}#app{max-width:1000px;margin:0 auto;padding:32px 24px 40px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:4px 2px 22px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{flex:none;width:52px;height:52px;display:grid;place-items:center;color:var(--accent);background:var(--surface);border-radius:50%}.brand-mark svg{display:block}.brand-mark svg circle:first-child{stroke-dashoffset:63}.brand-text h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-.02em;line-height:1.25}.subtitle{margin:2px 0 0;color:var(--muted);font-size:16px}.header-meta{display:flex;align-items:center;gap:10px}.date-chip{font-size:var(--fs-small);font-variant-numeric:tabular-nums;color:var(--ink-soft);background:var(--surface-2);border-radius:var(--radius-pill);padding:8px 16px;white-space:nowrap}.card{background:var(--surface);border-radius:var(--radius-card);padding:24px;margin-top:20px}.card h2{margin:0;font-size:var(--fs-h2);font-weight:700;letter-spacing:-.01em}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.section-head h2{margin:0}.muted{color:var(--muted);font-size:var(--fs-small)}.hidden{display:none!important}.app-footer{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:40px;padding-top:20px;color:var(--muted);font-size:var(--fs-small)}.app-footer .footer-mark{display:grid;place-items:center;color:var(--accent);opacity:.8}.app-footer .footer-name{color:var(--ink-soft);font-weight:600}button{font-family:inherit;line-height:1.3}button.primary{background:var(--accent);color:var(--accent-ink);border:none;border-radius:var(--radius-pill);padding:10px 22px;font-size:14px;font-weight:650;cursor:pointer;transition:background var(--t-hover) ease,transform var(--t-press) var(--ease-out)}button.primary:hover{background:var(--accent-strong)}button.primary:active{transform:translateY(1px) scale(.99)}button.ghost{background:var(--surface-2);border:none;border-radius:var(--radius-pill);padding:7px 15px;font-size:13px;cursor:pointer;color:var(--muted);transition:background var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out)}button.ghost:hover{background:var(--surface-3);color:var(--ink)}button.ghost:active{transform:translateY(1px)}button.ghost.danger:hover{background:var(--red-soft);color:var(--red)}button.danger-ghost{background:var(--red-soft);border:none;border-radius:var(--radius-pill);padding:9px 20px;font-size:14px;cursor:pointer;color:var(--red);transition:background var(--t-hover) ease,transform var(--t-press) var(--ease-out)}button.danger-ghost:hover{background:#f8717138}button.danger-ghost:active{transform:translateY(1px)}.icon-btn{width:36px;height:36px;display:grid;place-items:center;background:var(--surface-2);border:none;border-radius:50%;color:var(--ink-soft);font-size:18px;line-height:1;cursor:pointer;transition:background var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out)}.icon-btn:hover{background:var(--surface-3);color:var(--ink)}.icon-btn:active{transform:translateY(1px)}.seg{display:inline-flex;flex-wrap:wrap;gap:3px;padding:4px;background:var(--surface-2);border-radius:var(--radius-pill);margin-bottom:0}.seg:empty{display:none}.seg-btn{border:none;background:transparent;color:var(--muted);border-radius:var(--radius-pill);padding:6px 14px;font-size:13px;cursor:pointer;white-space:nowrap;transition:background var(--t-hover) ease,color var(--t-hover) ease}.seg-btn:hover{color:var(--ink)}.seg-btn.active{background:var(--accent);color:var(--accent-ink);font-weight:600}.today-progress{margin:8px 0 16px}.progress-wrap .progress-line{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}.progress-wrap .progress-label{font-size:var(--fs-small);color:var(--muted);font-weight:500}.progress-wrap .progress-nums{display:flex;align-items:baseline;gap:6px;flex:1}.progress-wrap .progress-nums b{color:var(--ink);font-size:42px;font-weight:700;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}.progress-wrap .progress-total{font-size:17px;color:var(--muted);font-variant-numeric:tabular-nums}.progress-wrap .progress-rate{font-size:19px;font-weight:650;color:var(--ink-soft);font-variant-numeric:tabular-nums}.progress-wrap.all-done .progress-rate{color:var(--green)}.progress-bar{height:12px;background:var(--surface-2);border-radius:var(--radius-pill);overflow:hidden}.progress-fill{width:var(--target, 0%);height:100%;background:var(--accent);border-radius:var(--radius-pill);animation:fillGrow .7s var(--ease-out) both}.progress-wrap.all-done .progress-fill{background:var(--green)}.today-list{display:flex;flex-direction:column;gap:8px;margin-top:4px}.today-item{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 14px;background:var(--surface-2);border-radius:var(--radius-panel);transition:background var(--t-hover) ease;animation:itemIn .22s var(--ease-out) both}.today-item:hover{background:var(--surface-hover)}.today-item.done{background:var(--green-soft)}.today-item.done:hover{background:#3ecf8e33}.today-item .icon,.habit-list .icon{flex:none;width:44px;height:44px;display:grid;place-items:center;font-size:22px;background:var(--surface-3);border-radius:var(--radius-row)}.today-item.done .icon{background:#3ecf8e2e}.today-item .name{flex:1;min-width:120px;font-weight:600;font-size:15px}.today-item .badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.today-item .streak{color:var(--muted);font-size:var(--fs-micro);font-variant-numeric:tabular-nums}.goal-chip{font-size:var(--fs-micro);color:var(--muted);background:var(--surface-3);border-radius:var(--radius-pill);padding:3px 10px;white-space:nowrap;font-variant-numeric:tabular-nums}.goal-chip.met{color:#86e8bd;background:var(--green-soft)}.today-item .item-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}button.checkin-btn{background:var(--accent-soft);border:none;color:var(--accent);border-radius:var(--radius-pill);padding:8px 18px;font-size:13px;font-weight:650;cursor:pointer;white-space:nowrap;transition:background var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out)}button.checkin-btn:hover{background:#5a9bfc3d}button.checkin-btn:active{transform:translateY(1px)}button.checkin-btn.done{background:var(--green);border-color:var(--green);color:var(--green-ink)}button.checkin-btn.done:hover{background:#5adfa0}.today-item .backfill-open,.today-item .archive-btn{padding:7px 12px;font-size:var(--fs-micro)}.backfill{flex-basis:100%;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;background:var(--surface-3);border-radius:var(--radius-row)}.backfill label{display:flex;align-items:center;gap:6px;font-size:var(--fs-small);color:var(--muted)}.backfill input[type=date]{font-size:13px;padding:6px 10px;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--surface-2);color:var(--ink)}.backfill input[type=date]:focus{outline:3px solid var(--accent-soft);outline-offset:0;border-color:var(--accent)}.backfill .bf-ok{padding:7px 16px;font-size:13px}.backfill .bf-cancel{padding:6px 12px;font-size:13px}.backfill .bf-msg{font-size:var(--fs-small);color:var(--red)}.app-banner{display:flex;align-items:flex-start;gap:12px;margin-top:20px;padding:12px 16px;background:var(--amber-soft);color:#f5d9a4;border-radius:var(--radius-panel);font-size:var(--fs-small);animation:itemIn .25s var(--ease-out) both}.app-banner.warn{background:var(--red-soft);color:#fca5a5}.app-banner .banner-msg{flex:1;line-height:1.6;word-break:break-word}.app-banner .banner-close{flex:none;background:#0003;border:none;color:inherit;border-radius:var(--radius-pill);padding:4px 12px;font-size:var(--fs-micro);cursor:pointer}.notice{margin-top:12px;padding:11px 14px;font-size:var(--fs-small);line-height:1.6;color:#86e8bd;background:var(--green-soft);border-radius:var(--radius-panel);animation:itemIn .22s var(--ease-out) both}.insight{margin:0 0 12px;padding:11px 14px;font-size:var(--fs-small);line-height:1.6;color:#f5d9a4;background:var(--amber-soft);border-radius:var(--radius-panel)}.empty-state{text-align:center;padding:36px 18px;border-radius:var(--radius-panel);background:var(--surface-2)}.empty-state.compact{padding:20px}.empty-state .empty-icon{width:64px;height:64px;margin:0 auto;display:grid;place-items:center;color:var(--accent);background:var(--surface-3);border-radius:50%}.empty-state .empty-title{margin:14px 0 6px;font-weight:700;font-size:17px}.empty-state .empty-desc{margin:0 auto 18px;max-width:44ch;color:var(--muted);font-size:var(--fs-small);line-height:1.65}.empty-state .empty-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.empty-state.compact .empty-desc{margin-bottom:12px}.empty-tip{color:var(--muted);font-size:14px;padding:8px 0}.kbd-hint{margin:14px 0 0;max-width:60ch;color:var(--muted);font-size:var(--fs-micro)}.kbd-hint b{color:var(--ink);background:var(--surface-2);border-radius:6px;padding:1px 7px;font-size:var(--fs-micro);font-weight:650}.calendar-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.calendar-header h2{margin:0}.month-nav{display:flex;align-items:center;gap:8px}#month-label{font-weight:700;min-width:96px;text-align:center;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.01em}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.weekday-row{color:var(--muted);font-size:var(--fs-micro);text-align:center;margin-bottom:6px}.day-cell{aspect-ratio:1;border-radius:var(--radius-row);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px;font-variant-numeric:tabular-nums;position:relative;background:var(--surface-2);transition:background var(--t-hover) ease}.day-cell:not(.empty){animation:cellIn .3s var(--ease-out) both;animation-delay:calc(var(--i, 0) * 10ms + .14s)}.day-cell:hover{background:var(--surface-3)}.day-cell.empty{background:transparent}.day-cell.today{outline:2px solid var(--accent);outline-offset:-2px;color:var(--ink)}.day-cell.future{background:transparent;color:var(--muted);opacity:.55}.day-cell .marks{font-size:12px;line-height:1.2;min-height:14px;overflow:hidden;max-width:100%;text-align:center}.day-cell .ratio{font-size:11px;color:var(--muted)}.day-cell.full{background:var(--green-soft)}.day-cell.full:hover{background:#3ecf8e33}.day-cell .bf-tag{position:absolute;top:4px;right:4px;font-size:9px;line-height:1;font-weight:700;color:var(--amber-ink);background:var(--amber);border-radius:5px;padding:2px 5px}.calendar-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:var(--fs-micro);color:var(--muted)}.calendar-legend .lg-dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:4px;vertical-align:middle}.calendar-legend .lg-full{background:var(--green-soft);outline:1px solid rgba(62,207,142,.45)}.calendar-legend .lg-today{border:2px solid var(--accent);background:transparent}.calendar-legend .lg-bf{font-style:normal;font-size:10px;color:var(--amber-ink);background:var(--amber);border-radius:5px;padding:2px 5px;font-weight:700}#calendar-note:not(:empty){margin-top:8px}.habit-form{background:var(--surface-2);border-radius:var(--radius-panel);padding:18px;margin-bottom:16px;display:flex;flex-direction:column;gap:12px}.form-row{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}.form-row label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-micro);color:var(--muted);font-weight:600}.form-row input,.form-row select{font-size:14px;padding:9px 12px;border:1px solid var(--border);border-radius:var(--radius-input);background:var(--surface);color:var(--ink);font-family:inherit}.form-row input::placeholder{color:var(--muted);opacity:.8}.form-row input:focus,.form-row select:focus{outline:3px solid var(--accent-soft);outline-offset:0;border-color:var(--accent)}.form-row input[type=text]#habit-name{min-width:210px}#times-label{flex-direction:row;align-items:center;gap:6px}#habit-times{width:64px}.icon-presets{gap:6px;align-items:center}.icon-preset{background:var(--surface);border:none;border-radius:var(--radius-input);font-size:18px;padding:5px 9px;cursor:pointer;line-height:1.3;transition:background var(--t-hover) ease,transform var(--t-press) var(--ease-out)}.icon-preset:hover{background:var(--accent-soft)}.icon-preset:active{transform:translateY(1px)}.form-msg{margin:0;font-size:var(--fs-small);color:var(--red);background:var(--red-soft);border-radius:var(--radius-input);padding:8px 12px}.form-actions{display:flex;gap:10px}.habit-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.habit-list li{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--surface-2);border-radius:var(--radius-panel);transition:background var(--t-hover) ease}.habit-list li:hover{background:var(--surface-hover)}.habit-list li.archived{opacity:.62}.habit-list .info{flex:1;min-width:120px}.habit-list .info .name{font-weight:600;font-size:15px}.habit-list .info .meta{font-size:var(--fs-micro);color:var(--muted)}.habit-list .actions{display:flex;gap:6px;flex-wrap:wrap}.tag-archived{margin-left:6px;font-size:11px;font-weight:500;color:var(--muted);background:var(--surface-3);border-radius:var(--radius-pill);padding:2px 8px;vertical-align:middle}.archived-wrap{margin-top:18px;padding-top:6px}.archived-wrap .stats-sub{margin-top:0}.stats-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:4px}.stats-summary>span{background:var(--surface-2);border-radius:var(--radius-row);padding:12px 14px;font-size:var(--fs-micro);color:var(--muted)}.stats-summary b{display:block;font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;margin-top:3px;line-height:1.2}.stats-summary>span.muted{background:transparent;padding:8px 2px 0;grid-column:1 / -1;font-size:var(--fs-micro)}.week-chart-wrap h3,.stats-sub{margin:20px 0 10px;font-size:var(--fs-h3);font-weight:650;color:var(--ink-soft)}.bar-track{display:flex;align-items:flex-end;gap:8px;height:150px;padding:8px 2px 0}.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%}.bar-col .bar-val{font-size:var(--fs-micro);color:var(--muted);font-variant-numeric:tabular-nums}.bar-col .bar{width:100%;max-width:44px;background:var(--accent);border-radius:6px 6px 0 0;min-height:0;height:var(--h, 0%);animation:barGrow .6s var(--ease-out) both;transition:background var(--t-hover) ease}.bar-col.today .bar{background:var(--green)}.bar-col.future .bar{background:var(--surface-3)}.bar-col .bar-label{font-size:var(--fs-micro);color:var(--muted)}.bar-col.today .bar-label{color:var(--ink);font-weight:700}.stat-row{background:var(--surface-2);border-radius:var(--radius-panel);padding:16px;margin-top:10px;transition:background var(--t-hover) ease;animation:itemIn .22s var(--ease-out) both}.stat-row:hover{background:var(--surface-hover)}.stat-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.stat-head .icon{flex:none;width:36px;height:36px;display:grid;place-items:center;font-size:18px;background:var(--surface-3);border-radius:var(--radius-input)}.stat-head .name{flex:1;min-width:100px;font-weight:600;font-size:15px}.stat-head .rate-text{font-size:var(--fs-small);color:var(--muted);font-variant-numeric:tabular-nums}.stat-head .goal-chip{margin-right:auto}.rate-bar{height:8px;background:var(--surface-3);border-radius:var(--radius-pill);overflow:hidden;margin:10px 0}.rate-fill{width:var(--target, 0%);height:100%;background:var(--accent);border-radius:var(--radius-pill);animation:fillGrow .7s var(--ease-out) both}.stat-metrics{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--fs-small);color:var(--muted)}.stat-metrics b{color:var(--ink);font-variant-numeric:tabular-nums}.activity{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.act-dot{width:14px;height:14px;border-radius:50%;background:var(--surface-3);transition:background var(--t-hover) ease,transform var(--t-hover) var(--ease-out)}.act-dot:hover{transform:scale(1.25)}.act-dot.checked{background:var(--green)}.act-dot.today{outline:2px solid var(--accent);outline-offset:1px}.data-actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}.data-actions button:not(.primary){background:var(--surface-2);border:none;border-radius:var(--radius-pill);padding:9px 20px;font-size:14px;cursor:pointer;color:var(--ink-soft);transition:background var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out)}.data-actions button:not(.primary):hover{background:var(--surface-3);color:var(--ink)}.data-actions button:not(.primary):active{transform:translateY(1px)}.data-desc{max-width:60ch}.data-status{margin-top:12px;padding:11px 14px;font-size:var(--fs-small);line-height:1.6;color:#86e8bd;background:var(--green-soft);border-radius:var(--radius-panel);animation:itemIn .22s var(--ease-out) both}.data-status.error{color:#fca5a5;background:var(--red-soft)}#storage-note{margin:12px 0 0;word-break:break-word;max-width:72ch}@media(prefers-reduced-motion:no-preference){.js [data-rise]{opacity:0;transform:translateY(14px);animation:rise var(--t-reveal) var(--ease-out) forwards;animation-delay:calc(var(--i, 0) * 90ms + 80ms)}.js .card{opacity:0;transform:translateY(12px);animation:cardIn .55s var(--ease-out) forwards;animation-delay:calc(var(--i, 0) * 80ms + .14s)}.js .brand-mark svg circle:first-child{animation:ringDraw .9s var(--ease-out) both;animation-delay:.12s}.js .progress-fill,.js .rate-fill{animation:fillGrow .7s var(--ease-out) both;animation-delay:calc(var(--i, 0) * 80ms + .42s)}}@keyframes rise{to{opacity:1;transform:none}}@keyframes cardIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes itemIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes cellIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@keyframes fillGrow{0%{width:0}to{width:var(--target)}}@keyframes barGrow{0%{height:0}to{height:var(--h)}}@keyframes ringDraw{0%{stroke-dashoffset:63}to{stroke-dashoffset:0}}@media(max-width:640px){#app{padding:20px 14px 32px}.app-header{padding:2px 0 14px}.card{padding:18px 16px;border-radius:var(--radius-panel)}.calendar-header{flex-direction:column;align-items:flex-start;gap:8px}.month-nav{width:100%;justify-content:space-between}#month-label{min-width:76px}.form-row{gap:10px}.form-row label,.form-row input,.form-row select{width:100%}.form-row input[type=text]#habit-name{min-width:0}.today-item{align-items:flex-start}.today-item .name{flex-basis:calc(100% - 68px)}.today-item .badges,.today-item .item-actions{flex-basis:100%;padding-left:56px}.today-item .icon{width:42px;height:42px}.progress-wrap .progress-nums b{font-size:36px}.progress-wrap .progress-rate{font-size:17px}.day-cell{font-size:var(--fs-micro);border-radius:var(--radius-input)}.day-cell .marks{font-size:10px;max-height:12px}.bar-track{gap:4px;height:120px}.data-actions button{flex:1 1 40%}.stat-head{flex-wrap:wrap}.stat-head .rate-text{flex-basis:100%}.stats-summary{grid-template-columns:repeat(2,1fr)}.app-footer{margin-top:28px;font-size:var(--fs-micro)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js [data-rise],.js .card{opacity:1;transform:none}}
