body{background-color:#f4f7f6;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;display:flex;justify-content:center;align-items:flex-start;min-height:100vh;margin:0;padding-top:50px}html,body{margin:0;padding:0;height:100%;overflow:hidden}#root{height:100%}.App{background:#fff;width:100%;max-width:400px;padding:2rem;border-radius:12px;box-shadow:0 10px 25px #0000001a}h1{color:#333;text-align:center;margin-bottom:1.5rem;font-size:1.8rem}.content-area div{display:flex;flex-direction:column;align-items:center;gap:15px}input[type=text]{width:80%;padding:12px;border-radius:8px;border:1px solid #ddd;outline:none}input[type=text]:focus{border-color:#4a90e2}.add-btn .add-btn{background-color:#4a90e2;color:#fff;border:none;padding:12px 20px;border-radius:6px;cursor:pointer;font-weight:700;transition:background .3s;white-space:nowrap}.add-btn:hover{background-color:#357abd}.todo-list{list-style:none;padding:0}.todo-item{background:#fff;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center;padding:12px 10px;transition:background .2s}.todo-item:hover{background-color:#f9f9f9}.todo-text{flex:1;font-size:1rem;color:#444}.delete-btn{background-color:#ff5e5e;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.85rem;opacity:.8;transition:opacity .3s}.delete-btn:hover{opacity:1;background-color:#e04848}