#root{max-width:480px;margin:0 auto;padding:2rem;text-align:center;background:#f7f7fa}.todo-header{background:none;color:#283046;padding:1rem 0 .75rem;text-align:center;margin-bottom:2rem}.todo-header h1{margin:0;font-size:2.2rem;font-weight:600;letter-spacing:1.5px}.subtitle{margin-top:.4rem;font-size:1.1rem;font-weight:400;color:#7a869a}.add-todo-section{display:flex;justify-content:center;align-items:center;gap:.75rem;background:#fff;padding:1rem 1.2rem;border-radius:12px;box-shadow:0 1px 4px #3c50c80d;margin:2rem auto 1.5rem;max-width:420px}.add-todo-input{flex:1;padding:.55rem 1rem;font-size:1rem;border:1px solid #dee2e6;border-radius:8px;outline:none;background:#fafbfc;transition:border-color .15s}.add-todo-input:focus{border-color:#a4b0be}.add-todo-button{padding:.55rem 1.5rem;background:#283046;color:#fff;font-weight:500;font-size:1rem;border:none;border-radius:8px;cursor:pointer;transition:background .15s,transform .1s}.add-todo-button:hover,.add-todo-button:focus{background:#455066;transform:translateY(-1px) scale(1.03)}.App{min-height:100vh;font-family:Segoe UI,Roboto,Arial,sans-serif}.todo-list{max-width:420px;margin:0 auto;background:#fff;padding:1.2rem 1.2rem 1.1rem;border-radius:12px;box-shadow:0 1px 7px #3c50c80a;min-height:140px}.todo-list ul{list-style:none;padding:0;margin:0}.todo-item{display:flex;align-items:center;justify-content:space-between;background:#fafbfc;padding:.55rem .8rem;margin-bottom:.45rem;border-radius:8px;font-size:1rem;color:#283046;transition:background .15s}.todo-item:hover{background:#f1f3f7}.delete-todo-button{background:none;color:#c23616;font-size:1.2rem;cursor:pointer;padding:.2rem .7rem;transition:color .13s,background .13s}.delete-todo-button:hover,.delete-todo-button:focus{color:#fff;background:#c23616;border-radius:none}.empty-list-text{text-align:center;color:#b2bec3;margin-top:1.5rem;font-size:1rem;letter-spacing:1px}.divider{border:none;border-top:1px solid #e5e5e7;margin:2rem auto 1.2rem;max-width:420px}
