:root{--primary: #6366f1;--primary-hover: #4f46e5;--bg: #0f172a;--card-bg: rgba(30, 41, 59, .7);--text: #f8fafc;--text-dim: #94a3b8;--danger: #ef4444;--success: #10b981;--glass-border: rgba(255, 255, 255, .1);--selection: rgba(99, 102, 241, .4)}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,-apple-system,sans-serif}body{background:var(--bg);background:radial-gradient(circle at top left,#1e293b,#0f172a);color:var(--text);min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding-top:5vh}#root{width:100%;max-width:500px;padding:1rem}.container{background:var(--card-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:24px;padding:2rem;box-shadow:0 25px 50px -12px #00000080}h1{font-size:1.75rem;font-weight:800;margin-bottom:1.5rem;text-align:center;background:linear-gradient(to right,#818cf8,#c084fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.calendar-section{margin-bottom:2rem;background:#0f172a66;padding:1rem;border-radius:16px;border:1px solid var(--glass-border)}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.calendar-header h2{font-size:1.1rem;font-weight:600}.calendar-header button{background:none;border:1px solid var(--glass-border);color:#fff;padding:.25rem .5rem;border-radius:6px;cursor:pointer;transition:all .2s}.calendar-header button:hover{background:#ffffff1a}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:.8rem;color:var(--text-dim);margin-bottom:.5rem}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.calendar-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.9rem;border-radius:8px;cursor:pointer;position:relative;transition:all .2s}.calendar-day:hover:not(.empty){background:#ffffff0d}.calendar-day.selected{background:var(--primary);color:#fff}.day-number{z-index:1}.todo-indicator{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.todo-circle{position:absolute;width:24px;height:24px;border:1.5px solid var(--primary);border-radius:50%}.selected .todo-circle{border-color:#fff}.todo-count{position:absolute;bottom:2px;right:2px;font-size:.65rem;background:var(--danger);color:#fff;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 3px;font-weight:700}.selected-date-title{font-size:.9rem;color:var(--text-dim);margin-bottom:1rem;padding-left:.5rem;border-left:3px solid var(--primary)}.todo-form{display:flex;gap:.5rem;margin-bottom:1.5rem}input{flex:1;background:#0f172a99;border:1px solid var(--glass-border);border-radius:10px;padding:.75rem 1rem;color:#fff;font-size:.9rem;transition:all .2s;outline:none}input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #6366f133}button.add-btn{background:var(--primary);color:#fff;border:none;border-radius:10px;padding:0 1.25rem;font-weight:600;cursor:pointer;transition:all .2s;font-size:.9rem}button.add-btn:hover{background:var(--primary-hover);transform:translateY(-1px)}.todo-list{list-style:none;display:flex;flex-direction:column;gap:.6rem}.todo-item{display:flex;align-items:center;gap:.6rem;padding:.75rem;background:#ffffff08;border-radius:12px;border:1px solid transparent;transition:all .2s}.todo-item:hover{background:#ffffff0d;border-color:var(--glass-border)}.todo-text{flex:1;font-size:.95rem;color:var(--text)}.todo-text.completed{text-decoration:line-through;color:var(--text-dim);opacity:.6}.action-btn{border:none;background:#ffffff0d;padding:.4rem;border-radius:6px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;font-size:.8rem}.complete-btn:hover{background:var(--success);color:#fff}.delete-btn:hover{background:var(--danger);color:#fff}