:root{--bg:#16130f;--surface:#201c16;--surface-2:#2a251e;--surface-3:#352e25;--line:#42392d;--ink:#f4eee3;--muted:#a89c88;--faint:#756a59;--accent:#e8663c;--accent-strong:#f07a4e;--accent-ink:#fff6ef;--accent-soft:#e8663c24;--short:#5ba6c4;--short-soft:#5ba6c424;--long:#7cb98b;--long-soft:#7cb98b24;--danger:#e8663c;--danger-soft:#e8663c24;--radius:16px;--radius-lg:20px;--radius-pill:999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--text-xs:12px;--text-sm:13px;--text-base:14px;--text-md:16px;--text-lg:20px;--text-display:clamp(3rem, 12vw, 5.25rem);--font-sans:"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, -apple-system, "Segoe UI", sans-serif;--ease-out:cubic-bezier(.22, 1, .36, 1)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{overflow-x:hidden}body{background:var(--bg);min-height:100svh;color:var(--ink);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}kbd{background:var(--surface-3);min-width:22px;font-family:inherit;font-size:var(--text-xs);text-align:center;color:var(--ink);border-radius:7px;padding:2px 8px;font-weight:600;display:inline-block}#app{max-width:1040px;padding:var(--space-6) 24px var(--space-7);margin:0 auto}.app-header{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6);display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{width:36px;height:36px;color:var(--muted);flex-shrink:0}.brand-mark .brand-dot{fill:var(--accent)}.brand h1{letter-spacing:-.02em;margin:0;font-size:24px;font-weight:800;line-height:1}.subtitle{color:var(--muted);font-size:var(--text-sm);margin:0}.layout{gap:var(--space-5);grid-template-columns:1.15fr .85fr;align-items:start;display:grid}.timer-card,.task-card,.settings-card,.stats-card{background:var(--surface);border-radius:var(--radius-lg);padding:var(--space-5)}.mode-tabs{justify-content:center;gap:var(--space-2);margin-bottom:var(--space-5);display:flex}.mode-tab{font:inherit;font-size:var(--text-base);border-radius:var(--radius-pill);color:var(--muted);background:var(--surface-2);cursor:pointer;appearance:none;transition:background .15s ease, color .15s ease, transform .1s var(--ease-out);border:none;padding:8px 20px;font-weight:600}.mode-tab:hover{color:var(--ink);background:var(--surface-3)}.mode-tab:active{transform:scale(.96)}.mode-tab.active[data-mode=focus]{background:var(--accent);color:var(--accent-ink)}.mode-tab.active[data-mode=short]{background:var(--short);color:#10232b}.mode-tab.active[data-mode=long]{background:var(--long);color:#0f2315}.mode-tab.active{cursor:default}.mode-tab.active:hover{background-color:inherit}.ring-wrap{width:280px;height:280px;margin:0 auto;position:relative}.ring{width:100%;height:100%;transform:rotate(-90deg)}.ring-track,.ring-progress{fill:none;stroke-width:12px;stroke-linecap:round}.ring-track{stroke:var(--surface-3)}.ring-progress{stroke:var(--accent);transition:stroke-dashoffset .5s linear,stroke .3s}.ring-progress.short{stroke:var(--short)}.ring-progress.long{stroke:var(--long)}.time-text{font-size:var(--text-display);font-variant-numeric:tabular-nums;letter-spacing:-.03em;justify-content:center;align-items:center;font-weight:700;line-height:1;display:flex;position:absolute;inset:0}.cycle-hint{justify-content:center;align-items:center;gap:var(--space-2);text-align:center;color:var(--muted);font-size:var(--text-sm);margin:var(--space-4) 0 var(--space-1);min-height:18px;display:flex}.timer-card.running .cycle-hint:before{content:"";background:var(--accent);width:8px;height:8px;animation:pulse 1.8s var(--ease-out) infinite;border-radius:50%;flex-shrink:0}.timer-card.paused .cycle-hint:before{content:"";background:var(--short);border-radius:50%;flex-shrink:0;width:8px;height:8px}.current-task-line{width:fit-content;margin:var(--space-2) auto var(--space-4);border-radius:var(--radius-pill);background:var(--surface-2);color:var(--muted);font-size:var(--text-sm);justify-content:center;align-items:center;gap:6px;padding:6px 16px;display:flex}.current-task-line span{color:var(--ink);font-weight:600}.controls{justify-content:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.controls .btn{min-width:96px}.btn{font:inherit;font-size:var(--text-base);border-radius:var(--radius-pill);background:var(--surface-2);color:var(--ink);cursor:pointer;transition:background .15s ease, color .15s ease, transform .1s var(--ease-out);border:none;padding:10px 24px;font-weight:600}.btn:hover{background:var(--surface-3)}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:var(--accent-ink)}.btn-primary:hover{background:var(--accent-strong)}.btn-sm{font-size:var(--text-sm);padding:7px 16px}.btn-danger{background:var(--danger-soft);color:var(--danger)}.btn-danger:hover{background:#e8663c3d}.input{font:inherit;font-size:var(--text-base);background:var(--surface-2);border:1px solid var(--line);color:var(--ink);border-radius:12px;outline:none;padding:9px 14px;transition:border-color .15s}.input:focus{border-color:var(--accent);outline:2px solid var(--accent-soft);outline-offset:0}.input::placeholder{color:var(--faint)}.input-title{flex:1;min-width:0}.input-estimate{text-align:center;width:64px}.task-card h2,.settings-card h2,.stats-card h2{margin:0 0 var(--space-4);font-size:var(--text-lg);letter-spacing:-.01em;align-items:center;gap:10px;font-weight:700;display:flex}.task-card h2:before,.settings-card h2:before,.stats-card h2:before{content:"";background:var(--accent);border-radius:50%;flex-shrink:0;width:9px;height:9px}.task-form{gap:var(--space-2);margin-bottom:var(--space-4);display:flex}.task-list{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.task-item{background:var(--surface-2);cursor:pointer;border-radius:14px;align-items:center;gap:10px;padding:10px 12px 10px 16px;transition:background .15s;display:flex;position:relative}.task-item:hover{background:var(--surface-3)}.task-item.current{background:var(--accent-soft)}.task-item.current:before{content:"";border-radius:var(--radius-pill);background:var(--accent);width:4px;height:22px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.task-item.completed .task-title{color:var(--muted);text-decoration:line-through}.task-check{appearance:none;border:1.5px solid var(--faint);cursor:pointer;width:20px;height:20px;transition:background .15s ease, border-color .15s ease, transform .1s var(--ease-out);background:0 0;border-radius:50%;flex-shrink:0}.task-check:hover{border-color:var(--accent)}.task-check:checked{background:var(--accent);border-color:var(--accent);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5 6.5 11 12 5' fill='none' stroke='%23fff6ef' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:12px}.task-check:active{transform:scale(.85)}.task-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--text-base);flex:1;overflow:hidden}.task-item.current .task-title{color:var(--accent);font-weight:600}.task-count{font-size:var(--text-xs);color:var(--muted);white-space:nowrap;border-radius:var(--radius-pill);background:var(--surface);font-variant-numeric:tabular-nums;padding:3px 10px}.task-count.done-reached{color:var(--long);background:var(--long-soft);font-weight:700}.task-estimate-input{font:inherit;font-size:var(--text-xs);background:var(--surface);border:1px solid var(--line);width:48px;color:var(--ink);text-align:center;border-radius:9px;outline:none;padding:3px 4px;transition:border-color .15s}.task-estimate-input:focus{border-color:var(--accent);outline:2px solid var(--accent-soft);outline-offset:0}.task-estimate-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.task-estimate-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-min::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-min::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.task-estimate-input[type=number],.input-min[type=number]{appearance:textfield}.task-del{color:var(--faint);cursor:pointer;background:0 0;border:none;border-radius:50%;flex-shrink:0;padding:6px;font-size:18px;line-height:1;transition:color .15s,background .15s}.task-del:hover{color:var(--danger);background:var(--danger-soft)}.empty-state{text-align:center;padding:var(--space-6) var(--space-4);border-radius:var(--radius);background:var(--surface-2)}.empty-mark{width:44px;height:44px;color:var(--muted);margin:0 auto var(--space-3);display:block}.empty-mark .empty-ring{stroke:currentColor}.empty-mark .empty-core{fill:var(--accent)}.empty-title{margin:0 0 var(--space-2);font-size:var(--text-md);font-weight:700}.empty-hint{margin:0 0 var(--space-4);font-size:var(--text-sm);color:var(--muted);max-width:320px;margin-left:auto;margin-right:auto;line-height:1.6}.form-error{margin:var(--space-2) 0 0;background:var(--danger-soft);color:#ffb9a2;font-size:var(--text-sm);border-radius:10px;padding:8px 12px}.settings-form{gap:var(--space-3);flex-direction:column;display:flex}.setting-row{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.setting-row label{font-size:var(--text-base);color:var(--ink)}.input-min{text-align:center;width:80px}.switch{flex-shrink:0;width:46px;height:26px;position:relative}.switch input{opacity:0;cursor:pointer;z-index:1;margin:0;position:absolute;inset:0}.switch-track{background:var(--surface-3);border-radius:var(--radius-pill);transition:background .18s;position:absolute;inset:0}.switch-track:after{content:"";background:var(--muted);width:20px;height:20px;transition:transform .18s var(--ease-out), background .18s ease;border-radius:50%;position:absolute;top:3px;left:3px}.switch input:checked+.switch-track{background:var(--accent)}.switch input:checked+.switch-track:after{background:var(--accent-ink);transform:translate(20px)}.switch input:disabled+.switch-track{opacity:.45;cursor:not-allowed}.switch input:focus-visible+.switch-track{outline:2px solid var(--accent);outline-offset:2px}.setting-note{font-size:var(--text-sm);color:var(--muted);min-height:16px;margin:0}.setting-actions{gap:var(--space-3);margin-top:var(--space-1);flex-wrap:wrap;display:flex}.setting-actions .btn{flex:1;min-width:120px}.stats-summary{gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.stat-block{background:var(--surface-2);border-radius:var(--radius);min-width:100px;padding:var(--space-4) var(--space-3);flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.stat-value{letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink);font-size:30px;font-weight:800;line-height:1}.stat-value-sm{padding-top:6px;font-size:18px}.stat-label{font-size:var(--text-xs);color:var(--muted)}.stat-sub{font-size:var(--text-xs);color:var(--faint);text-align:center}.stat-block:first-child .stat-value{color:var(--accent)}.goal{margin:0 0 var(--space-4);padding:var(--space-4);border-radius:var(--radius);background:var(--surface-2)}.goal-head{justify-content:space-between;align-items:baseline;gap:var(--space-3);font-size:var(--text-sm);color:var(--muted);margin-bottom:var(--space-2);flex-wrap:wrap;display:flex}.goal-bar{border-radius:var(--radius-pill);background:var(--surface-3);height:8px;overflow:hidden}.goal-fill{border-radius:var(--radius-pill);background:var(--accent);width:0;height:100%;transition:width .4s var(--ease-out)}.goal.reached .goal-fill{background:var(--long)}.goal.reached .goal-head{color:var(--long)}.goal.reached #goal-text{color:var(--long);font-weight:600}.stats-subtitle{margin:0 0 var(--space-3);font-size:var(--text-base);color:var(--muted);font-weight:600}.week-wrap{position:relative}.week-chart{align-items:flex-end;gap:var(--space-2);height:150px;display:flex}.week-col{flex-direction:column;flex:1;align-items:center;gap:6px;height:100%;display:flex}.week-count{font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums;min-height:14px}.week-bar-wrap{background:var(--surface-2);border-radius:var(--radius-pill);flex:1;justify-content:center;align-items:flex-end;width:100%;display:flex;overflow:hidden}.week-bar{background:var(--accent);border-radius:var(--radius-pill);transform-origin:bottom;width:min(70%,18px);min-height:0;animation:bar-grow .4s var(--ease-out) both;transition:height .3s}.week-bar.empty{background:0 0;animation:none}.week-label{font-size:var(--text-xs);color:var(--muted)}.week-label.today,.week-col.today .week-count{color:var(--accent);font-weight:700}.data-actions{gap:var(--space-2);margin-top:var(--space-5);flex-wrap:wrap;display:flex}.banner{margin-bottom:var(--space-4);font-size:var(--text-sm);background:var(--danger-soft);color:#ffc2ae;border-radius:12px;padding:12px 16px;line-height:1.5}.boot{padding:var(--space-7) 20px;text-align:center;color:var(--muted)}.boot-ring{width:44px;height:44px;margin:0 auto var(--space-4);border:3px solid var(--surface-3);border-top-color:var(--accent);border-radius:50%;animation:.8s linear infinite ring-spin}.boot-title{margin:0 0 var(--space-2);font-size:var(--text-md);color:var(--ink);font-weight:600}.boot-hint{font-size:var(--text-sm);margin:0}.fatal{margin:var(--space-7) auto;padding:var(--space-5);background:var(--surface-2);border-radius:var(--radius-lg);max-width:560px}.fatal h2{margin:0 0 var(--space-3);font-size:var(--text-lg);color:var(--accent)}.fatal p{margin:0 0 var(--space-2);font-size:var(--text-base);color:var(--muted);word-break:break-word;line-height:1.6}.fatal .btn{margin-top:var(--space-3)}.toast-host{gap:var(--space-2);z-index:100;pointer-events:none;flex-direction:column;align-items:center;width:min(92vw,420px);display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{border-radius:var(--radius-pill);width:100%;font-size:var(--text-sm);text-align:center;background:var(--surface-2);color:var(--ink);animation:toast-in .22s var(--ease-out);justify-content:center;align-items:center;gap:10px;padding:10px 20px;line-height:1.5;display:flex;box-shadow:0 10px 30px #00000073}.toast:before{content:"";background:var(--muted);border-radius:50%;flex-shrink:0;width:8px;height:8px}.toast-success:before{background:var(--long)}.toast-error:before{background:var(--accent)}.toast-out{opacity:0;transition:opacity .25s}.app-footer{margin-top:var(--space-6);text-align:center;font-size:var(--text-xs);color:var(--faint)}@keyframes ring-spin{to{transform:rotate(360deg)}}@keyframes pulse{0%{opacity:1;transform:scale(1)}70%{opacity:.35;transform:scale(1.7)}to{opacity:1;transform:scale(1)}}@keyframes bar-grow{0%{transform:scaleY(0)}}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.app-body{animation:fade-up .4s var(--ease-out) both}@media (width<=760px){#app{padding:var(--space-5) 16px var(--space-7)}.app-header{margin-bottom:var(--space-5);flex-direction:column;align-items:flex-start;gap:4px}.layout{grid-template-columns:1fr}.timer-card,.task-card,.settings-card,.stats-card{padding:var(--space-4)}}@media (width<=480px){.brand h1{font-size:22px}.ring-wrap{width:224px;height:224px}.time-text{font-size:clamp(2.75rem,16vw,3.5rem)}.task-form{flex-wrap:wrap}.task-form .input-title{flex:100%}.task-form .btn{flex:1}.controls .btn{flex:1;min-width:0}.stat-block{min-width:calc(50% - 6px)}.stats-summary{gap:var(--space-2)}.week-chart{gap:6px;height:120px}.setting-row{flex-wrap:wrap}.setting-toggle{flex-wrap:nowrap}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}