@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg: #fdf6f0;--card: #ffffff;--text: #4a4a5a;--text-light: #8a8a9a;--accent: #b8a9c9;--accent-light: #e8dff5;--pink: #f5c6d0;--peach: #fcd5ce;--mint: #b5ead7;--lavender: #c3b1e1;--sky: #a0c4ff;--border: #ede5db;--shadow: rgba(180, 160, 140, .1)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,sans-serif}.app{max-width:680px;margin:0 auto;padding:2rem 1.5rem 4rem}.header{margin-bottom:2rem}.header-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.greeting{color:var(--text-light);font-size:.9rem;margin-bottom:.25rem}.date{font-size:1.6rem;font-weight:700;color:var(--text);letter-spacing:-.02em}.stats{display:flex;align-items:center;gap:.75rem}.stat-circle{position:relative;width:56px;height:56px}.stat-circle svg{width:100%;height:100%;transform:rotate(-90deg)}.stat-bg{fill:none;stroke:var(--border);stroke-width:3}.stat-fill{fill:none;stroke:var(--lavender);stroke-width:3;stroke-linecap:round;transition:stroke-dasharray .4s ease}.stat-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;color:var(--text)}.progress-bar{height:6px;background:var(--border);border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--pink),var(--lavender),var(--sky));border-radius:999px;transition:width .4s ease}.add-task{display:flex;gap:.5rem;margin-bottom:2rem;background:var(--card);padding:.75rem;border-radius:1rem;box-shadow:0 2px 12px var(--shadow);border:1px solid var(--border)}.task-input{flex:1;border:none;outline:none;font-size:.95rem;padding:.5rem .75rem;background:transparent;color:var(--text);font-family:inherit}.task-input::placeholder{color:var(--text-light)}.time-select{border:1px solid var(--border);border-radius:.5rem;padding:.5rem .75rem;font-size:.85rem;background:var(--bg);color:var(--text);cursor:pointer;outline:none;font-family:inherit}.add-btn{background:linear-gradient(135deg,var(--lavender),var(--sky));color:#fff;border:none;border-radius:.5rem;padding:.5rem 1.25rem;font-size:.9rem;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s;font-family:inherit}.add-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #a0c4ff66}.add-btn:active{transform:translateY(0)}.timeline{display:flex;flex-direction:column;gap:.25rem}.timeline-row{display:flex;gap:1rem;padding:.5rem 0}.timeline-time{min-width:80px;display:flex;align-items:flex-start;gap:.5rem;font-size:.8rem;font-weight:500;color:var(--text-light);padding-top:.65rem}.time-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:.15rem}.timeline-tasks{flex:1;display:flex;flex-direction:column;gap:.5rem}.task-card{display:flex;align-items:center;gap:.75rem;background:var(--card);padding:.75rem 1rem;border-radius:.75rem;border:1px solid var(--border);border-left:4px solid var(--pink);box-shadow:0 1px 6px var(--shadow);transition:transform .15s,opacity .2s}.task-card:hover{transform:translate(2px)}.task-card.completed{opacity:.6}.task-card.completed .task-text{text-decoration:line-through;color:var(--text-light)}.task-check{position:relative;display:flex;align-items:center;cursor:pointer}.task-check input{position:absolute;opacity:0;width:0;height:0}.checkmark{width:20px;height:20px;border:2px solid var(--border);border-radius:50%;transition:all .2s;position:relative}.task-check input:checked+.checkmark{background:var(--mint);border-color:var(--mint)}.task-check input:checked+.checkmark:after{content:"";position:absolute;top:3px;left:6px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.task-text{flex:1;font-size:.9rem;color:var(--text)}.delete-btn{background:none;border:none;color:var(--text-light);font-size:1.2rem;cursor:pointer;padding:0 .25rem;opacity:0;transition:opacity .15s,color .15s;line-height:1}.task-card:hover .delete-btn{opacity:1}.delete-btn:hover{color:#e57373}.empty,.all-done{text-align:center;padding:3rem 1rem;color:var(--text-light);font-size:.95rem}.all-done{color:var(--mint);font-weight:500}
