:root{--bg: #0a0e14;--bg-panel: #0f1420;--bg-inset: #0a0e14;--text: #c8d3e0;--text-dim: #7a8aa0;--accent: #00e5ff;--accent-dim: #0a4a56;--ok: #2bd97c;--ok-dim: rgba(43, 217, 124, .35);--danger: #ff4d4d;--font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-mono);font-size:14px;line-height:1.5}button,input{font-family:inherit;font-size:inherit;color:inherit}input{background:var(--bg-inset);border:1px solid var(--accent-dim);color:var(--text);padding:.55em .7em;border-radius:2px;caret-color:var(--accent);outline:none;accent-color:var(--accent);min-width:0;transition:border-color .15s ease,box-shadow .15s ease}input:focus{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}input::placeholder{color:var(--text-dim)}.btn{font-family:inherit;background:transparent;color:var(--accent);border:1px solid var(--accent-dim);padding:.5em .9em;border-radius:2px;text-transform:uppercase;letter-spacing:.06em;font-size:.8em;cursor:pointer;transition:background-color .12s ease,color .12s ease,border-color .12s ease}.btn:hover:not(:disabled){border-color:var(--accent);background:#00e5ff14}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#04141a;border-color:var(--accent)}.btn-primary:hover:not(:disabled){background:#33ecff}.btn-danger{color:var(--danger);border-color:#5a2323}.btn-danger:hover:not(:disabled){border-color:var(--danger);background:#ff4d4d14}.btn-filter.is-active{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.btn-link{background:none;border:none;color:var(--text-dim);text-decoration:underline;cursor:pointer;font-size:.85em;padding:0;align-self:flex-start}.btn-link:hover{color:var(--accent)}.panel{background:var(--bg-panel);border:1px solid var(--accent-dim);border-radius:2px;padding:1.5em}.panel-title{margin:0 0 1em;font-size:.95em;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-weight:600}.auth-screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:2rem}.auth-panel{width:100%;max-width:360px;display:flex;flex-direction:column;gap:1.1em}.field{display:flex;flex-direction:column;gap:.4em}.field span{color:var(--text-dim);font-size:.75em;text-transform:uppercase;letter-spacing:.08em}.error-text{color:var(--danger);font-size:.85em;margin:0}.dim-text{color:var(--text-dim);margin:0}.app-shell{min-height:100%;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;flex-wrap:wrap;gap:.5em 1.2em;padding:.9em 1.5em;border-bottom:1px solid var(--accent-dim)}.app-header-title{color:var(--accent);font-weight:600;letter-spacing:.08em}.app-header-title:after{content:"▌";margin-left:.15em;animation:blink 1.1s steps(1) infinite}.app-header-user{color:var(--text-dim);font-size:.85em}.app-header-user strong{color:var(--text)}.app-header .btn{margin-left:auto}.app-main{flex:1;padding:1.5em;max-width:720px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:1.2em}.todo-dashboard{display:flex;flex-direction:column;gap:1.2em}.add-todo{display:flex;flex-direction:column;gap:.8em}.add-todo-row{display:flex;gap:.6em}.add-todo-title{flex:1}.add-todo input[type=date]{color-scheme:dark}.todo-panel-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.8em;margin-bottom:1em}.todo-panel-header .panel-title{margin:0}.filter-group{display:flex;flex-wrap:wrap;gap:.4em}.todo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6em}.todo-item{display:flex;align-items:flex-start;flex-wrap:wrap;gap:.8em;padding:.8em;border:1px solid var(--accent-dim);border-radius:2px;background:var(--bg-inset);animation:item-in .25s ease;transition:border-color .3s ease,background-color .3s ease}.todo-item:hover{border-color:var(--accent)}.todo-item input[type=checkbox]{margin-top:.2em;width:16px;height:16px;flex-shrink:0;cursor:pointer}.todo-body{flex:1;display:flex;flex-direction:column;gap:.2em;min-width:0}.todo-title{word-break:break-word;transition:color .3s ease}.todo-item.is-complete{border-color:var(--ok-dim);background:#2bd97c0d}.todo-item.is-complete:hover{border-color:var(--ok)}.todo-item.is-complete input[type=checkbox]{accent-color:var(--ok)}.todo-item.is-complete .todo-title{color:var(--ok);opacity:.75;text-decoration:line-through}.todo-item.is-complete .todo-due{color:var(--ok);opacity:.75}.todo-desc{color:var(--text-dim);font-size:.85em;word-break:break-word}.todo-due{color:var(--accent);font-size:.75em}.todo-actions{display:flex;gap:.4em;flex-shrink:0;margin-left:auto}.todo-edit-form{flex:1;display:flex;flex-wrap:wrap;gap:.5em}.todo-edit-form input{flex:1;min-width:120px}@keyframes blink{50%{opacity:0}}@keyframes item-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.confetti-piece{position:fixed;width:6px;height:6px;z-index:10000;pointer-events:none;animation:confetti-pop .8s ease-out forwards}@keyframes confetti-pop{0%{transform:translate(0) rotate(0);opacity:1}60%{transform:translate(var(--dx),var(--dy)) rotate(var(--rot));opacity:1}to{transform:translate(calc(var(--dx) * 1.2),calc(var(--dy) + 70px)) rotate(calc(var(--rot) * 1.6));opacity:0}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 600px){.app-header{padding:.75em 1em}.app-main{padding:1em}.auth-screen{padding:1rem}.panel{padding:1em}input{font-size:16px}.add-todo-row{flex-direction:column}.btn{padding:.65em 1em}.todo-actions{width:100%;justify-content:flex-end}}
