*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100vh;margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root{--apros-navy:#070926;--apros-navy-2:#0e1028;--apros-navy-3:#1a1c37;--apros-blue:#0054fc;--apros-cyan:#00ceff;--apros-mint:#15f2c6;--bg:var(--apros-navy);--surface:#0f1230;--surface-2:#151938;--border:#ffffff14;--text:#eaf2ff;--text-muted:#eaf2ffa8;--primary:var(--apros-blue);--primary-hover:#2f73ff;--danger:#ff5d73;--gradient-brand:linear-gradient(120deg, var(--apros-cyan) 0%, var(--apros-mint) 100%);--radius:16px;--radius-sm:10px;--shadow:0 18px 48px #00000073;--ease:cubic-bezier(.22, 1, .36, 1)}body{color:var(--text);background:radial-gradient(1100px 460px at 50% -10%, #00ceff24, transparent 60%), radial-gradient(900px 380px at 50% 120%, #15f2c61a, transparent 60%), linear-gradient(160deg, var(--apros-navy) 0%, var(--apros-navy-2) 100%);background-attachment:fixed}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{flex-direction:column;gap:1.25rem;width:100%;max-width:640px;min-height:100vh;margin-inline:auto;padding:1.25rem 1rem 3rem;display:flex}.app-header{justify-content:space-between;align-items:center;gap:1rem;padding-block:.25rem;display:flex}.brand{align-items:center;gap:.6rem;text-decoration:none;display:inline-flex}.brand__logo{width:38px;height:38px}.brand__name{letter-spacing:.02em;color:var(--text);font-size:1.2rem;font-weight:700}.brand__name span{background:var(--gradient-brand);color:#0000;-webkit-background-clip:text;background-clip:text}.app-header__tag{color:var(--text-muted);font-size:.85rem}.app-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(1.25rem,3vw,2rem)}.app-title{letter-spacing:-.01em;margin:0;font-size:clamp(1.6rem,4vw,2.2rem);font-weight:800}.app-subtitle{color:var(--text-muted);margin:.35rem 0 1.5rem;font-size:.95rem}.todo-form{gap:.6rem;margin-bottom:1.25rem;display:flex}.todo-form__input{min-width:0;font:inherit;color:var(--text);background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--radius-sm);flex:1;padding:.75rem 1rem;transition:all .2s}.todo-form__input::placeholder{color:var(--text-muted)}.todo-form__input:focus{border-color:var(--apros-cyan);outline:none;box-shadow:0 0 0 3px #00ceff38}.btn{font:inherit;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:.75rem 1.4rem;font-weight:600;transition:all .2s}.btn--primary{background:linear-gradient(120deg, var(--apros-blue), var(--primary-hover));color:#fff;box-shadow:0 8px 22px #0054fc59}.btn--primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 28px #0054fc73}.btn--primary:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn:focus-visible{outline:3px solid var(--apros-cyan);outline-offset:2px}.todo-stats{margin-bottom:1.25rem}.todo-stats__numbers{align-items:baseline;gap:.5rem;margin-bottom:.5rem;display:flex}.todo-stats__count strong{color:var(--apros-cyan);font-size:1.4rem}.todo-stats__label{color:var(--text-muted);font-size:.9rem}.todo-stats__pct{color:var(--apros-mint);margin-left:auto;font-weight:700}.progress-track{background:var(--surface-2);border-radius:999px;height:10px;overflow:hidden}.progress-fill{background:var(--gradient-brand);height:100%;transition:width .35s var(--ease);border-radius:999px}.todo-list{flex-direction:column;gap:.6rem;margin:0;padding:0;list-style:none;display:flex}.todo-empty{text-align:center;color:var(--text-muted);padding:1.5rem 0}@keyframes todo-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.todo-item{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:.75rem;padding:.8rem .9rem;transition:all .2s;animation:.2s todo-in;display:flex}.todo-item:hover{border-color:#00ceff59;transform:translateY(-1px)}.todo-item__checkbox{appearance:none;cursor:pointer;border:2px solid #ffffff4d;border-radius:6px;flex:none;width:22px;height:22px;transition:all .2s;position:relative}.todo-item__checkbox:hover{border-color:var(--apros-cyan)}.todo-item__checkbox:checked{background:var(--gradient-brand);border-color:#0000}.todo-item__checkbox:checked:after{content:"";border:solid var(--apros-navy);border-width:0 2.5px 2.5px 0;width:6px;height:11px;position:absolute;top:2px;left:6px;transform:rotate(45deg)}.todo-item__checkbox:focus-visible{outline:3px solid var(--apros-cyan);outline-offset:2px}.todo-item__text{cursor:pointer;word-break:break-word;flex:1;transition:all .2s}.todo-item--done .todo-item__text{color:var(--text-muted);text-decoration:line-through}.todo-item--done{opacity:.75}.todo-item__delete{width:34px;height:34px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:none;place-items:center;transition:all .2s;display:inline-grid}.todo-item__delete:hover{color:var(--danger);background:#ff5d7324}.todo-item__delete:focus-visible{outline:3px solid var(--apros-cyan);outline-offset:2px}.app-footer{text-align:center;color:var(--text-muted);font-size:.8rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}