:root{--gradient-bg:linear-gradient(135deg, #667eea 0%, #764ba2 100%);--accent-color:#6c5ce7;--accent-hover:#a29bfe;--success-color:#00b894;--danger-color:#ff7675;--glass-bg:#fffffff2;--text-dark:#2d3436;--text-muted:#636e72}body{background:var(--gradient-bg);-webkit-font-smoothing:antialiased;background-attachment:fixed;justify-content:center;align-items:flex-start;min-height:100vh;margin:0;padding:60px 20px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}#app{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff4d;border-radius:24px;width:100%;max-width:480px;padding:40px;box-shadow:0 20px 40px #0003}h1,h2,h3{letter-spacing:-.5px;color:var(--text-dark);margin:0 0 20px;font-weight:800}input{box-sizing:border-box;background-color:#f8f9fa;border:2px solid #9f9f9f;border-radius:12px;width:100%;margin-bottom:15px;padding:14px 20px;font-size:1rem;transition:all .3s}input:focus{border-color:var(--accent-color);background-color:#fff;outline:none;box-shadow:0 0 0 4px #6c5ce71a}button{cursor:pointer;border:none;justify-content:center;align-items:center;font-family:inherit;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:inline-flex}#app>button{background:var(--accent-color);color:#fff;border-radius:12px;width:auto;padding:12px 24px;font-weight:700;box-shadow:0 4px 12px #6c5ce74d}#app>button:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 6px 15px #6c5ce766}ul{margin-top:40px;padding:0;list-style:none}li{background:#fff;border:1px solid #f1f2f6;border-radius:20px;flex-wrap:wrap;align-items:center;margin-bottom:20px;padding:24px;transition:all .2s;display:flex}li:hover{transform:translateY(-3px);box-shadow:0 12px 24px #0000000f}li h3{flex-basis:100%;margin-bottom:8px;font-size:1.25rem}li p{color:var(--text-muted);flex-basis:100%;margin:0 0 12px;font-size:1rem;line-height:1.5}li small{text-transform:uppercase;letter-spacing:1px;color:#484848;flex-basis:100%;margin-bottom:16px;font-size:.75rem;font-weight:700}li button{box-sizing:border-box;border-radius:10px;height:42px;padding:0 20px;font-size:.9rem;font-weight:700}li button:first-of-type{background-color:var(--accent-color);color:#fff;margin-left:auto}li button:last-of-type{color:var(--danger-color);border:1.5px solid var(--danger-color);background-color:#0000;margin-left:12px}li button:last-of-type:hover{background-color:var(--danger-color);color:#fff}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#0000001a;border-radius:10px}.header-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin-bottom:30px;display:flex}.header-row h1{flex-basis:100%;order:3;margin-top:20px}.app-logo{order:1;width:200px;height:auto}.user-info{text-align:right;order:2;gap:10px;display:flex}.user-info small{color:var(--text-muted);font-size:20px;font-weight:500}.btn-danger{background-color:var(--danger-color)!important;color:#fff!important;border-radius:8px!important;padding:6px 12px!important;font-size:.75rem!important}.btn-danger-outline{color:var(--danger-color)!important;border:1px solid var(--danger-color)!important;background:0 0!important}.btn-danger-outline:hover{background:var(--danger-color)!important;color:#fff!important}.task-content{flex:1}.task-actions{gap:10px;margin-top:15px;display:flex}.btn-save{margin-top:10px;margin-bottom:20px}