*{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:0;margin:0;transition:.2s ease}.container{background:linear-gradient(135deg,#d9e9ff,#f6e8ff);display:flex;flex-direction:column;align-items:center;width:85%;margin:20px auto;border-radius:20px;padding:30px 20px;box-shadow:0 12px 30px #00000026}h1{text-decoration:underline;padding:15px;text-align:center;background:linear-gradient(135deg,#fffa,#e8f1ff);border-radius:15px;width:60%;margin:20px auto;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);font-size:2rem;color:#4b4b4b}.app{width:100%;display:flex;flex-direction:row;justify-content:space-evenly;gap:30px;align-items:flex-start;flex-wrap:wrap}.addContact,.searchContact{width:45%;max-width:500px;padding:25px;border-radius:20px;background:#fff;box-shadow:0 6px 20px #0000001a;display:flex;flex-direction:column;align-items:center;gap:20px}.form{width:100%;display:flex;flex-direction:column;gap:12px}.form input{text-align:center;padding:14px;border-radius:12px;border:1px solid #ddd;background:#f4f4f8;font-size:1rem}.form input:focus{border-color:#b681ff;box-shadow:0 0 10px #b681ff66;outline:none}button{width:35%;padding:12px;font-weight:600;cursor:pointer;border-radius:12px;font-size:1rem;transition:all .2s ease}.add,.search{background:linear-gradient(135deg,#b681ff,#63f5ff);border:none;color:#fff;box-shadow:0 4px 15px #0003}.add:hover,.search:hover{opacity:.9;transform:scale(1.08)}.added{width:100%;margin:30px 0;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}.contact{width:80%;max-width:500px;border-radius:15px;background:linear-gradient(135deg,#fff,#f0f0ff);box-shadow:0 4px 15px #0000001a;display:flex;justify-content:space-between;align-items:center;padding:15px 20px;flex-wrap:wrap}.contact p{margin:0;font-size:1rem;color:#333;flex:1 1 60%}.contact button{background:linear-gradient(135deg,#b681ff,#63f5ff);border:none;color:#fff;padding:8px 12px;border-radius:10px;cursor:pointer;flex:1 1 30%;margin-top:8px}.contact button:hover{opacity:.9;transform:scale(1.05)}@media(max-width:1024px){h1{width:70%;font-size:1.8rem}.app{flex-direction:column;align-items:center;gap:20px}.addContact,.searchContact{width:90%}button{width:50%}.contact{width:90%}}@media(max-width:600px){h1{width:90%;font-size:1.5rem;padding:12px}.addContact,.searchContact{width:80%;padding:20px}.form input{font-size:.9rem;padding:12px}button{width:100%;font-size:.9rem;padding:10px}.contact{flex-direction:column;align-items:flex-start;padding:12px;gap:10px}.contact p{width:100%;font-size:.9rem}.contact button{width:100%;margin-top:5px}}.contactItem{width:50%;padding:10px;border-radius:8px;display:flex;flex-direction:column;gap:15px;color:#fff}
