:root{--primary-color:#5c7cfa;--primary-hover:#4c6ef5;--bg-color:#f0f3f9;--card-bg:#fff;--text-main:#343a40;--text-muted:#868e96;--border-color:#e9ecef;color:var(--text-main);background:var(--bg-color);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font:16px/145% Segoe UI,sans-serif}#root{min-height:100svh}body,p{margin:0}.login-page{min-height:100svh;color:var(--text-main);background-color:var(--bg-color);background-image:radial-gradient(var(--border-color) 15%, transparent 15%), radial-gradient(var(--border-color) 15%, transparent 15%);background-position:0 0,10px 10px;background-size:20px 20px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.bg-deco{z-index:0;-webkit-user-select:none;user-select:none;opacity:.15;font-size:3rem;animation:6s ease-in-out infinite float;position:absolute}.deco-1{top:10%;left:10%}.deco-2{font-size:4rem;animation-delay:2s;bottom:15%;left:15%}.deco-3{animation-delay:4s;top:15%;right:12%}.deco-4{font-size:3.5rem;animation-delay:1s;bottom:10%;right:10%}@keyframes float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-15px)rotate(5deg)}}.login-wrapper{z-index:10;width:min(100%,400px);padding:10px;position:relative}.folder-tab{z-index:1;border:2px solid var(--border-color);width:120px;height:35px;color:var(--primary-color);background:var(--card-bg);border-bottom:0;border-radius:12px 12px 0 0;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex;position:absolute;top:-24px;left:30px;box-shadow:0 -4px 10px #00000008}.folder-tab:after{content:"";border-right:25px solid #0000;border-bottom:33px solid var(--card-bg);width:0;height:0;position:absolute;bottom:0;right:-25px}.login-card{z-index:2;border:2px solid var(--border-color);background:var(--card-bg);border-radius:18px;transition:transform .3s;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000000f}.login-card:hover{transform:translateY(-2px)}.card-header{border-bottom:2px solid var(--border-color);text-align:center;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);padding:30px 24px 20px;position:relative}.window-controls{gap:6px;display:flex;position:absolute;top:12px;left:15px}.control-dot{border-radius:50%;width:10px;height:10px}.dot-red{background:#ff6b6b}.dot-yellow{background:#fcc419}.dot-green{background:#51cf66}.logo-container{border:2px solid var(--border-color);background:#fff;border-radius:50%;justify-content:center;align-items:center;width:70px;height:70px;margin:0 auto 12px;font-size:2.2rem;display:flex;box-shadow:0 4px 10px #0000000d}.brand-name{color:var(--text-main);letter-spacing:-.5px;font-size:1.4rem;font-weight:800}.brand-subtitle{color:var(--text-muted);margin-top:4px;font-size:.8rem}.card-body{padding:28px}.form-group{margin-bottom:20px;position:relative}.form-label{color:var(--text-main);margin-bottom:8px;font-size:.85rem;font-weight:700;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{pointer-events:none;font-size:1.1rem;position:absolute;left:14px}.form-input{border:2px solid var(--border-color);width:100%;color:var(--text-main);font:inherit;background:#f8f9fa;border-radius:10px;outline:none;padding:12px 14px 12px 42px;font-size:.95rem;transition:all .2s}.form-input:focus{border-color:var(--primary-color);background:#fff;box-shadow:0 0 0 4px #5c7cfa26}.form-options{justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;font-size:.85rem;display:flex}.remember-me{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;display:flex}.remember-me input{cursor:pointer;width:16px;height:16px;accent-color:var(--primary-color)}.forgot-link,.footer-link{color:var(--primary-color);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-weight:600}.forgot-link:hover,.footer-link:hover{text-decoration:underline}.btn-submit{color:#fff;background:var(--primary-color);width:100%;font:inherit;cursor:pointer;border:0;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:14px;font-size:1rem;font-weight:700;transition:all .2s;display:flex;box-shadow:0 4px 12px #5c7cfa33}.btn-submit:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 6px 16px #5c7cfa4d}.btn-submit:active{transform:translateY(1px)}.btn-submit:disabled{cursor:wait;opacity:.7}.status-message{color:#f06595;text-align:center;background:#fff0f6;border:1px solid #ffd8a8;border-radius:8px;margin-top:15px;padding:10px 14px;font-size:.85rem;display:none}.status-message.visible{animation:.3s fade-in;display:block}@keyframes fade-in{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.card-footer{border-top:2px solid var(--border-color);color:var(--text-muted);background:#f8f9fa;justify-content:space-between;align-items:center;padding:15px 24px;font-size:.8rem;display:flex}.card-footer .footer-link{color:var(--text-muted);font-weight:600}.success-overlay{z-index:100;color:var(--text-main);text-align:center;background:#fff;flex-direction:column;justify-content:center;align-items:center;padding:20px;transition:transform .5s cubic-bezier(.175,.885,.32,1.275);display:flex;position:absolute;inset:0;transform:translateY(100%)}.success-overlay.active{transform:translateY(0)}.success-icon{margin-bottom:15px;font-size:4rem;animation:1s infinite alternate bounce}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-10px)}}.success-title{margin-bottom:8px;font-size:1.5rem;font-weight:800}.success-desc{color:var(--text-muted);margin-bottom:24px;font-size:.9rem}.btn-logout{color:var(--text-main);background:var(--border-color);font:inherit;cursor:pointer;border:0;border-radius:8px;padding:10px 20px;font-weight:600;transition:background .2s}.btn-logout:hover{background:#dee2e6}@media (width<=520px){.login-page{min-height:100svh;padding:44px 12px 24px;overflow:auto}.login-wrapper{width:100%}.deco-1{left:3%}.deco-2{left:4%}.deco-3,.deco-4{right:3%}.card-header{padding:28px 18px 18px}.card-body{padding:24px 20px}.card-footer{padding:14px 20px}}
