*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#6c63ff,#4facfe);font-family:Segoe UI,Arial,sans-serif;display:flex;align-items:flex-start;justify-content:center;padding:20px}.container,.auth-container{width:100%;max-width:480px;margin:30px auto;padding:30px 25px;background:#fff;border-radius:16px;box-shadow:0 10px 30px #0003;text-align:center}h1{margin:0 0 5px;color:#4b3fbf;font-size:1.8rem}.header-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:5px}.welcome-text{color:#777;font-size:.85rem;margin:0 0 20px;word-break:break-all}.auth-subtitle{color:#666;margin-bottom:20px}.auth-form{display:flex;flex-direction:column;gap:12px}.auth-form input{padding:12px 14px;font-size:15px;border:2px solid #e0e0f8;border-radius:10px;outline:none;transition:border-color .2s}.auth-form input:focus{border-color:#6c63ff}.auth-form button{padding:12px;font-size:16px;font-weight:600;color:#fff;background:linear-gradient(135deg,#6c63ff,#4facfe);border:none;border-radius:10px;cursor:pointer;transition:transform .15s,box-shadow .15s}.auth-form button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 14px #6c63ff66}.auth-form button:disabled{opacity:.7;cursor:not-allowed}.auth-toggle{margin-top:18px;color:#555;font-size:.9rem}.auth-toggle span{color:#6c63ff;font-weight:600;cursor:pointer}.auth-toggle span:hover{text-decoration:underline}.info-message{color:#2e7d32;background:#e8f5e9;padding:8px;border-radius:8px;font-size:.9rem}.input-section{display:flex;gap:10px;margin-bottom:18px}.input-section input{flex:1;padding:10px 12px;font-size:15px;border:2px solid #e0e0f8;border-radius:10px;outline:none;transition:border-color .2s}.input-section input:focus{border-color:#6c63ff}.input-section button{padding:10px 18px;font-size:15px;font-weight:600;color:#fff;background:linear-gradient(135deg,#ff6a88,#ff9a5a);border:none;border-radius:10px;cursor:pointer;transition:transform .15s,box-shadow .15s}.input-section button:hover{transform:translateY(-2px);box-shadow:0 6px 14px #ff6a8866}.logout-button{padding:6px 14px;font-size:13px;font-weight:600;color:#6c63ff;background:#eeecff;border:none;border-radius:20px;cursor:pointer;transition:background .2s}.logout-button:hover{background:#d9d5ff}.error-message{color:#c62828;background:#fdecea;padding:8px;border-radius:8px;margin-bottom:12px;font-size:.9rem}.no-tasks{color:#888;padding:20px 0}.task-list{list-style:none;padding:0;margin:0;text-align:left;display:flex;flex-direction:column;gap:8px}.task-item{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#f7f7ff;border-radius:10px;border-left:4px solid #6c63ff;transition:transform .15s,box-shadow .15s}.task-item:hover{transform:translate(2px);box-shadow:0 4px 10px #00000014}.task-item label{display:flex;align-items:center;gap:10px;word-break:break-word}.task-item input[type=checkbox]{width:18px;height:18px;accent-color:#6c63ff;cursor:pointer}.completed{text-decoration:line-through;color:#aaa}.delete-button{padding:6px 12px;font-size:13px;font-weight:600;color:#fff;background:#ff5a5f;border:none;border-radius:8px;cursor:pointer;transition:background .2s;white-space:nowrap}.delete-button:hover{background:#e04347}footer{margin-top:25px;font-size:12px;color:#aaa}@media (max-width: 480px){.container,.auth-container{margin:10px auto;padding:22px 16px;border-radius:12px}h1{font-size:1.5rem}.input-section{flex-direction:column}.input-section button{width:100%}.task-item{flex-direction:column;align-items:flex-start;gap:8px}.delete-button{align-self:flex-end}}
