@font-face{font-family:Inter;src:url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap')}body{background:#000;min-height:100vh;display:flex;align-items:center;justify-content:center;font-family:Inter,sans-serif;overflow-x:hidden}.card{background:rgba(0,0,0,.8);border-radius:1.5rem;border:1px solid rgba(255,255,255,.2);padding:2.5rem;animation:slideUp .6s ease-out}@keyframes slideUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.input-group input{transition:all .3s ease}.input-group input:focus{border-color:rgba(255,255,255,.5);background:rgba(0,0,0,.7);box-shadow:0 0 0 4px rgba(255,255,255,.1)}.button{position:relative;overflow:hidden;transition:all .3s ease}.button:hover{transform:translateY(-2px);background:rgba(255,255,255,.2);box-shadow:0 8px 20px rgba(255,255,255,.1)}.error{color:#ff4d4f;font-size:.875rem;margin-top:.5rem;display:flex;align-items:center;gap:.5rem;animation:fadeIn .3s ease-in}.success{color:#4ade80;font-size:.875rem;margin-top:.5rem;display:flex;align-items:center;gap:.5rem;animation:fadeIn .3s ease-in}.loading{display:none;border:4px solid rgba(255,255,255,.2);border-top:4px solid rgba(255,255,255,.8);border-radius:50%;width:24px;height:24px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.result-card{background:rgba(0,0,0,.5);border-radius:1rem;padding:1.5rem;border:1px solid rgba(255,255,255,.2);animation:slideIn .5s ease-in;transition:transform .3s ease}.result-card:hover{transform:scale(1.02)}.result-card p{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;font-size:1rem;color:rgba(255,255,255,.9)}.result-card i{color:rgba(255,255,255,.7);font-size:1.25rem}.task-card{background:rgba(0,0,0,.5);border-radius:1rem;padding:1.5rem;border:1px solid rgba(255,255,255,.2);animation:slideIn .5s ease-in;transition:transform .3s ease}.task-card:hover{transform:scale(1.02)}.task-card ul li{display:flex;align-items:center;gap:.75rem;font-size:1rem;color:rgba(255,255,255,.8);transition:color .2s ease}.task-card ul li i{font-size:1.25rem;color:rgba(255,255,255,.7)}.task-card ul li a{text-decoration:underline;color:rgba(255,255,255,.8);transition:color .2s ease}.task-card ul li:hover a{color:#fff}.truncate-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;position:relative}.truncate-text[data-tooltip]:hover:after,.truncate-text[data-tooltip]:hover:before{content:attr(data-tooltip);position:absolute;background:rgba(0,0,0,.9);color:#fff;padding:.5rem;border-radius:.25rem;font-size:.875rem;line-height:1.2;white-space:normal;width:220px;left:0;top:-2.5rem;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}.truncate-text[data-tooltip]:hover:before{content:"";border:5px solid transparent;border-top-color:rgba(0,0,0,.9);top:-.5rem;left:10px}.truncate-text[data-tooltip]:hover:after,.truncate-text[data-tooltip]:hover:before{opacity:1;visibility:visible}@media (hover:none){.truncate-text[data-tooltip]:after,.truncate-text[data-tooltip]:before{display:none}}@media (max-width:640px){.card{padding:1.5rem}.result-card,.task-card{padding:1rem}.result-card p,.task-card ul li{font-size:.875rem}.result-card i,.task-card ul li i{font-size:1rem}}@media (max-width:400px){.truncate-text{font-size:.75rem}}