:root{--bg-top: #fbeef0;--bg-bottom: #fff9f7;--ink: #5c4a50;--ink-soft: #a08690;--card: #d98a9e;--card-deep: #c2778c;--card-shadow: rgba(194, 119, 140, .45);--paper: #fffafa;--sage: #d9a7b4;--danger: #c96b84;--radius: 26px}body[data-mode=pomodoro]{--card: #d98a9e;--card-deep: #c2778c;--card-shadow: rgba(194, 119, 140, .45)}body[data-mode=short]{--card: #86ab97;--card-deep: #6f9a84;--card-shadow: rgba(111, 154, 132, .45)}body[data-mode=long]{--card: #9c8fc4;--card-deep: #8a7db4;--card-shadow: rgba(138, 125, 180, .45)}*{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{min-height:100svh;font-family:Quicksand,ui-rounded,system-ui,-apple-system,sans-serif;color:var(--ink);background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom));display:flex;justify-content:center;padding:40px 16px 24px;transition:background .6s ease}.bg-blob{position:fixed;border-radius:50%;filter:blur(60px);opacity:.35;pointer-events:none;z-index:0}.blob-1{width:420px;height:420px;background:#f2c7d2;top:-120px;left:-80px;animation:drift 26s ease-in-out infinite alternate}.blob-2{width:360px;height:360px;background:#ecd8e8;bottom:-100px;right:-60px;animation:drift 32s ease-in-out infinite alternate-reverse}.blob-3{width:260px;height:260px;background:#f5e3d0;top:45%;left:65%;animation:drift 40s ease-in-out infinite alternate}@keyframes drift{0%{transform:translate(0) scale(1)}to{transform:translate(40px,30px) scale(1.08)}}#app{width:100%;max-width:560px;display:flex;flex-direction:column;gap:22px;z-index:1}.timer-card{background:linear-gradient(160deg,var(--card),var(--card-deep));border-radius:var(--radius);padding:26px 26px 20px;color:#fdfcf7;box-shadow:0 20px 45px -18px var(--card-shadow),0 2px 8px #0000000f;display:flex;flex-direction:column;align-items:center;gap:16px;transition:background .5s ease,box-shadow .5s ease}.mode-tabs{display:flex;gap:6px;background:#ffffff29;padding:6px;border-radius:999px}.mode-tab{border:none;background:transparent;color:#ffffffd9;font-family:inherit;font-size:15px;font-weight:600;padding:9px 18px;border-radius:999px;cursor:pointer;transition:background .2s ease,color .2s ease}.mode-tab:hover{background:#ffffff24}.mode-tabactive,.mode-tab.active{background:#fdfcf7;color:var(--card-deep);box-shadow:0 3px 10px #0000001f}.timer-face{position:relative;width:260px;height:260px;display:flex;align-items:center;justify-content:center}.progress-ring{position:absolute;inset:0;transform:rotate(-90deg)}.ring-track,.ring-progress{fill:none;stroke-width:5;stroke-linecap:round}.ring-track{stroke:#ffffff2e}.ring-progress{stroke:#ffffffbf;transition:stroke-dashoffset .24s linear}.time{font-size:76px;font-weight:300;letter-spacing:2px;font-variant-numeric:tabular-nums;text-shadow:0 2px 14px rgba(0,0,0,.08)}.timer-face.running .time,.timer-face.running .mascot{animation:breathe 5.5s ease-in-out infinite}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.mascot{position:absolute;width:54px;height:54px;top:16px;right:18px;animation:sway 7s ease-in-out infinite;transform-origin:50% 90%}@keyframes sway{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}.timer-controls{display:flex;gap:10px;align-items:center}.btn{font-family:inherit;font-weight:700;border:none;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .2s ease,color .2s ease}.btn:active{transform:translateY(1px) scale(.98)}.btn-primary{background:#fdfcf7;color:var(--card-deep);font-size:17px;letter-spacing:1px;text-transform:uppercase;padding:13px 44px;border-radius:999px;box-shadow:0 10px 22px -8px #00000059}.btn-primary:hover{box-shadow:0 12px 26px -8px #0006;transform:translateY(-1px)}.btn-ghost{background:#ffffff29;color:#fdfcf7;font-size:15px;padding:11px 18px;border-radius:999px}.btn-ghost:hover{background:#ffffff42}.whisper{font-size:14px;font-weight:500;opacity:.85;font-style:italic}.focus-note{font-size:13px;font-weight:600;background:#ffffff24;padding:5px 14px;border-radius:999px;min-height:1em}.focus-note:empty{display:none}.tasks-card{background:var(--paper);border-radius:var(--radius);padding:22px 22px 18px;box-shadow:0 18px 40px -20px #606c5a59,0 2px 6px #0000000a}.tasks-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.tasks-head h1{font-size:22px;font-weight:700;letter-spacing:.5px}.tasks-hint{font-size:12px;color:var(--ink-soft)}.add-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.add-title{flex:1 1 200px;font-family:inherit;font-size:15px;color:var(--ink);background:#f8eef1;border:2px solid transparent;border-radius:14px;padding:11px 14px;outline:none;transition:border-color .16s ease,background .16s ease}.add-title:focus{border-color:var(--sage);background:#fff}.add-estimate{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink-soft);background:#f8eef1;border-radius:14px;padding:6px 12px}.add-estimate input{width:52px;border:none;background:transparent;font-family:inherit;font-size:14px;font-weight:700;color:var(--ink);text-align:center;outline:none}.add-form .btn-primary{padding:11px 26px;font-size:14px;color:#fff;background:linear-gradient(160deg,var(--card),var(--card-deep))}.task-list{list-style:none;display:flex;flex-direction:column}.task-row{display:flex;align-items:center;gap:12px;padding:11px 8px;border-radius:14px;cursor:pointer;transition:background .16s ease,box-shadow .16s ease;border-bottom:1px solid #f6e7ec}.task-row:last-child{border-bottom:none}.task-row:hover{background:#faf0f3}.task-row.focused{background:#fbf1f4;box-shadow:inset 0 0 0 1.5px var(--sage)}.task-check{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid #dcc6cd;background:transparent;cursor:pointer;display:grid;place-items:center;font-size:13px;color:transparent;transition:background .16s ease,color .16s ease,border-color .16s ease;padding:0}.task-check:hover{border-color:var(--sage);color:#ecd3da}.task-row.done .task-check{background:var(--sage);border-color:var(--sage);color:#fff}.task-title{flex:1;font-size:15px;font-weight:500;overflow-wrap:anywhere}.task-row.done .task-title{text-decoration:line-through;color:var(--ink-soft)}.task-meta{display:flex;align-items:center;gap:6px}.pomo-chip{font-size:12.5px;font-weight:700;color:var(--card-deep);background:#f9ecf0;border-radius:999px;padding:4px 10px;white-space:nowrap}.pomo-chip.complete{background:#f0e2e7;color:var(--ink-soft)}.source-badge{font-size:11.5px;font-weight:700;color:var(--ink-soft);background:#f6edf2;border:1px dashed #e6cfd8;border-radius:999px;padding:3px 9px;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.task-delete{flex:none;border:none;background:transparent;color:transparent;font-size:16px;cursor:pointer;padding:4px 6px;border-radius:10px;transition:color .14s ease,background .14s ease}.task-row:hover .task-delete{color:var(--danger)}.task-delete:hover{background:#f8e9ec}.done-section{margin-top:12px}.done-section h2{font-size:14px;color:var(--ink-soft);font-weight:700;letter-spacing:.4px;margin:4px 0 2px 8px}.empty-note{color:var(--ink-soft);font-size:14px;text-align:center;padding:18px 8px}.toast{font-size:13.5px;font-weight:600;color:#a3546e;background:#fbe7ec;border:1px solid #f0cdd8;border-radius:12px;padding:9px 14px;margin-bottom:10px;animation:fadein .2s ease}@keyframes fadein{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:0 8px}.version-badge{font-size:12px;font-weight:600;color:var(--ink-soft);background:#ffffffa6;border:1px solid #ecd6dd;border-radius:999px;padding:4px 12px}.footer-note{font-size:12px;color:var(--ink-soft)}.modal-root{position:fixed;inset:0;background:#3a423459;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50;animation:fadein .22s ease}.modal-card{background:var(--paper);border-radius:26px;padding:30px 30px 26px;width:min(440px,92vw);text-align:center;box-shadow:0 30px 70px -20px #323c2c80}.modal-card h2{font-size:21px;margin-bottom:6px}.modal-card p{font-size:14px;color:var(--ink-soft);margin-bottom:18px}.modal-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.modal-btn{font-family:inherit;font-weight:700;font-size:14.5px;border:none;border-radius:999px;padding:12px 20px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease;color:#fff}.modal-btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px -6px #00000059}.modal-btn.short{background:linear-gradient(160deg,#6fa39b,#5d9189)}.modal-btn.long{background:linear-gradient(160deg,#948bb9,#827aa9)}.modal-btn.skip{background:#ece8dc;color:var(--ink-soft)}@media (max-width: 480px){.time{font-size:58px}.timer-face{width:220px;height:220px}.mascot{width:42px;height:42px}}.footer-note:after{content:" · 🌸 sakura"}
