*{padding:0;margin:0;box-sizing:border-box;font-family:Courier New,Courier,monospace}body{display:flex;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#f8f9fa,#e0e0e0)}.container{border:1px solid #d1d5db;border-radius:1rem;box-shadow:0 4px 24px #b0b0b0;padding:1rem;min-width:500px;background:#fff;margin-top:100px}h1{margin-bottom:1rem;color:#222;text-shadow:0 1px 2px #e0e0e0;position:relative;width:max-content}h1:after{content:"";display:block;position:absolute;left:0;bottom:-4px;width:100%;height:4px;background:linear-gradient(90deg,#000,#fff);border-radius:2px}.input-group{display:flex}.input-group input{width:100%;line-height:1.5rem;border-radius:1rem 0 0 1rem;border:1px solid #bdbdbd;padding-left:.8rem;box-shadow:0 0 8px #e0e0e0;background:#f5f5f5;color:#222}.input-group input:focus{outline:none;border-color:#888;background:#fff}.input-group button{border-radius:0 1rem 1rem 0;border:none;background:#222;color:#fff;padding:5px 16px;letter-spacing:-1px;font-size:.9rem;font-weight:700;box-shadow:0 0 8px #e0e0e0;transition:background .2s,color .2s}.input-group button:hover{background:#444;cursor:pointer}hr{margin:.5rem 0;box-shadow:0 0 8px #e0e0e0;border:none;border-top:1px solid #d1d5db}hr+p{font-style:italic;text-align:center}li{list-style-type:none;background:#f8f9fa;margin-bottom:.2rem;padding:.5rem 1rem;border-radius:.5rem;color:#222;box-shadow:0 1px 4px #e0e0e0;display:flex;justify-content:space-between;align-items:center;gap:.75rem;cursor:pointer}.todo-actions{display:inline-flex;align-items:center;gap:.25rem}.edit-btn{border:none;color:#2563eb;padding:4px 6px;cursor:pointer;background:transparent;border-radius:4px}.edit-btn:hover{background:#2563eb1a}.line-through{text-decoration:line-through}li button{border:none;color:red;padding:4px 6px;cursor:pointer;background:transparent}li button:hover{border-radius:4px;background:#c0c0c08c}.header{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.header button{border-radius:.5rem;border:1px solid transparent;background:#f3f4f6;color:#111827;padding:6px 12px;font-weight:600;cursor:pointer}.header button:hover{background:#e5e7eb}.container.light{background:#fff;color:#222;border-color:#d1d5db;box-shadow:0 4px 24px #b0b0b0}.container.dark{background:#111827;color:#e5e7eb;border-color:#374151;box-shadow:0 4px 24px #00000080}.container.dark h1{color:#f3f4f6;text-shadow:none}.container.dark h1:after{background:linear-gradient(90deg,#6b7280,#fff)}.container.dark .input-group input{background:#1f2937;border-color:#4b5563;color:#e5e7eb;box-shadow:0 0 8px #00000059}.container.dark .input-group input:focus{outline:none;border-color:#9ca3af;background:#111827}.container.dark .input-group button{background:#e5e7eb;color:#111827;box-shadow:0 0 8px #00000059}.container.dark .input-group button:hover{background:#d1d5db}.container.dark hr{box-shadow:0 0 8px #00000059;border-top:1px solid #374151}.container.dark li{background:#1f2937;color:#e5e7eb;box-shadow:0 1px 4px #00000059}.container.dark .edit-btn{color:#93c5fd}.container.dark .edit-btn:hover{background:#93c5fd1f}.container.dark li button{color:#f87171}.container.dark li button:hover{background:#ffffff14}.container.dark .header button{background:#374151;color:#f3f4f6;border-color:#4b5563}.container.dark .header button:hover{background:#4b5563}