@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");*{font-family:Roboto,sans-serif}.home-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:#f9f9f9;padding:20px;box-sizing:border-box}.auth-container{text-align:center;background-color:#fff;padding:30px 20px;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,.1);width:90%;max-width:400px;animation:fadeIn .3s ease-in-out}.auth-button{background-color:#007bff;color:#fff;border:none;padding:10px 20px;font-size:16px;border-radius:5px;cursor:pointer;transition:background-color .3s ease-in-out}.auth-button:hover{background-color:#0056b3}.welcome-container{text-align:center;background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,.1);width:100%;max-width:800px;animation:fadeIn .3s ease-in-out;margin-top:20px}.welcome-container h1{font-size:24px;color:#333;margin-bottom:20px}.key-table-container{max-width:100%;margin:20px auto;padding:20px;border-radius:8px;background-color:#f9f9f9;box-shadow:0 2px 10px rgba(0,0,0,.1);overflow-x:auto}.key-table-header,.table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.search-input{width:70%;padding:10px;border:1px solid #ddd;border-radius:5px;font-size:16px}.add-key-button{background-color:#007bff;color:#fff;border:none;padding:10px 15px;border-radius:5px;cursor:pointer;transition:background-color .2s}.add-key-button:hover{background-color:#0056b3}.key-table{width:100%;border-collapse:collapse;text-align:left}.key-table td,.key-table th{border:1px solid #ddd;padding:12px}.key-table th{background-color:#007bff;color:#fff}.key-table td{word-break:break-word}.action-button{background-color:#007bff;color:#fff;border:none;padding:8px 12px;border-radius:5px;cursor:pointer;margin-right:5px;transition:background-color .2s}.action-button:hover{background-color:#0056b3}.action-button.delete{background-color:#ff4d4d}.action-button.delete:hover{background-color:#c00}@media screen and (max-width:768px){.key-table td,.key-table th{padding:8px;font-size:14px}.add-key-button{font-size:14px;padding:8px 10px}.action-button{padding:6px 10px;font-size:12px}}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:1000}.popup-container{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,.2);width:90%;max-width:400px;text-align:center;animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.popup-input{width:100%;padding:10px;margin:15px 0;border:1px solid #ddd;border-radius:5px;font-size:16px;box-sizing:border-box}.popup-actions{display:flex;justify-content:space-between}.popup-button{padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:16px;transition:background-color .3s ease-in-out}.popup-button.add{background-color:#007bff;color:#fff}.popup-button.add:hover{background-color:#0056b3}.popup-button.cancel{background-color:#ff4d4d;color:#fff}.popup-button.cancel:hover{background-color:#c00}