@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800;900&family=Sora:wght@400;600;700;800&display=swap";:root{--primary-50:#eff6ff;--primary-100:#dbeafe;--primary-200:#bfdbfe;--primary-300:#93c5fd;--primary-400:#60a5fa;--primary-500:#3b82f6;--primary-600:#2563eb;--primary-700:#1d4ed8;--primary-800:#1e40af;--primary-900:#1e3a8a;--accent-blue:#2563eb;--accent-royal:#1d4ed8;--accent-emerald:#10b981;--accent-amber:#f59e0b;--accent-rose:#f43f5e;--slate-900:#0f172a;--slate-800:#1e293b;--slate-600:#475569;--slate-400:#94a3b8;--slate-300:#cbd5e1;--slate-200:#e2e8f0;--slate-100:#f1f5f9;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-executive:0 4px 6px -1px #00000008, 0 10px 15px -3px #0000000d;--shadow-premium:0 10px 20px #00000005, 0 20px 40px #0000000a, 0 0 0 1px #00000003;--shadow-depth:0 2px 4px #0000000d, 0 12px 24px #0000000d, inset 0 1px 0 #ffffff1a;--btn-specular:inset 0 1px 0 #ffffff40;--btn-shadow-outer:0 8px 16px #2563eb33;--btn-shadow-active:inset 0 2px 4px #0000001a;--glass-blur:blur(20px);--glass-bg:#ffffffe0;--glass-border:1px solid #fff9;--glass-shadow:0 20px 40px -10px #0000000d;--easing-standard:cubic-bezier(.16, 1, .3, 1);--transition-smooth:all .4s var(--easing-standard);--transition-fast:all .2s var(--easing-standard);--transition-spring:all .5s cubic-bezier(.175, .885, .32, 1.275);--sidebar-width:280px;--sidebar-collapsed-width:84px}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;margin:0;padding:0}body{color:var(--slate-800);background:radial-gradient(circle at 10% 20%,#2563eb08,#0000 30%),radial-gradient(circle at 90% 80%,#10b98105,#0000 30%),#f8fafc;min-height:100vh;font-family:Plus Jakarta Sans,sans-serif;overflow-x:hidden}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--primary-200);border-radius:20px}::-webkit-scrollbar-thumb:hover{background:var(--primary-300)}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.grid-cols-3{grid-template-columns:repeat(var(--grid-cols,3), 1fr);gap:1.5rem;display:grid}.grid-cols-2{grid-template-columns:repeat(var(--grid-cols,2), 1fr);gap:1.5rem;display:grid}@media (width<=1024px){:root{--grid-cols:2}}@media (width<=768px){:root{--grid-cols:1}}.section-container{max-width:1400px;margin:0 auto;padding:2rem}.card-premium{box-shadow:var(--shadow-premium);border:1.5px solid var(--slate-200);transition:var(--transition-smooth);background:#fff;border-radius:24px;padding:2.5rem;position:relative;overflow:hidden}.card-premium:hover{border-color:var(--primary-300);transform:translateY(-4px);box-shadow:0 30px 60px -12px #00000014}.card-holographic{border:1.5px solid var(--slate-100);box-shadow:var(--shadow-executive);transition:var(--transition-smooth);background:#fff;border-radius:24px;padding:1.5rem 2rem}.card-holographic:hover{border-color:var(--primary-200);transform:translateY(-4px);box-shadow:0 15px 30px -10px #0000000a}.staff-card-clickable:hover{z-index:2;transform:translateY(-5px)scale(1.005);box-shadow:0 25px 50px -12px #2563eb26;border-color:var(--primary-400)!important}.branch-card-quantum{border:1px solid var(--slate-200);box-shadow:var(--shadow-executive);transition:var(--transition-smooth);background:#fff;border-radius:28px;flex-direction:column;padding:2.5rem;display:flex}.branch-card-quantum:hover{border-color:var(--primary-300);transform:translateY(-5px);box-shadow:0 25px 50px -12px #00000014}.auth-page{background:radial-gradient(circle,#1e40af 0%,#0f172a 100%);justify-content:center;align-items:center;min-height:100vh;padding:2rem;display:flex;position:relative;overflow:hidden}.auth-card{z-index:10;border:1.5px solid var(--slate-200);text-align:center;background:#fffffffc;border-radius:32px;width:100%;max-width:400px;padding:2.5rem;box-shadow:0 25px 50px -12px #00000040}.logo-ds{color:#fff;background:linear-gradient(135deg,#2563eb,#1d4ed8);border-radius:24px;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 1.5rem;font-size:1.8rem;font-weight:900;display:flex;position:relative;box-shadow:0 20px 40px #2563eb4d}.logo-ds:before{content:"";border-radius:inherit;position:absolute;inset:0;box-shadow:inset 0 2px 4px #fff6}.form-label{color:var(--slate-400);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.8rem;font-size:.75rem;font-weight:800;display:block}.input-v2{border:1.5px solid var(--slate-200);width:100%;transition:var(--transition-smooth);color:var(--slate-800);background:#f8fafc;border-radius:16px;padding:.85rem 1.25rem;font-family:inherit;font-size:.95rem;font-weight:600}.input-v2:focus{border-color:var(--primary-500);background:#fff;outline:none;box-shadow:0 0 0 4px #2563eb1a}.btn-v2{cursor:pointer;background:linear-gradient(180deg, var(--primary-500) 0%, var(--primary-600) 100%);color:#fff;box-shadow:var(--btn-shadow-outer), var(--btn-specular), 0 1px 1px #0000001a;transition:var(--transition-spring);border:none;border-radius:14px;align-items:center;gap:.75rem;padding:.9rem 1.75rem;font-size:.9rem;font-weight:800;display:inline-flex;position:relative;overflow:hidden}.btn-v2:after{content:"";pointer-events:none;background:linear-gradient(#ffffff26 0%,#0000 100%);height:50%;position:absolute;top:0;left:0;right:0}.btn-v2:hover{background:linear-gradient(180deg, var(--primary-600) 0%, var(--primary-700) 100%);box-shadow:0 12px 24px #2563eb4d, var(--btn-specular);transform:translateY(-2px)}.btn-v2:active{box-shadow:var(--btn-shadow-active);background:var(--primary-700);transform:translateY(1px)}.btn-ghost{color:var(--slate-600);box-shadow:var(--shadow-sm);background:#fff;border:1.5px solid #e2e8f0}.btn-ghost:hover{color:var(--slate-800);box-shadow:var(--shadow-executive);background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.sidebar-solid{width:var(--sidebar-width);-webkit-backdrop-filter:blur(24px);z-index:1001;transition:var(--transition-smooth);background:#ffffffe0;border-right:1px solid #00000014;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-solid.collapsed{width:var(--sidebar-collapsed-width)}.sidebar-header-solid{border-bottom:1px solid var(--slate-100);justify-content:space-between;align-items:center;margin-bottom:1rem;padding:1.5rem 1.25rem;display:flex}.branding-solid{align-items:center;gap:.85rem;display:flex}.logo-solid{background:linear-gradient(135deg, var(--primary-600), var(--primary-800));color:#fff;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-size:.75rem;font-weight:900;display:flex;box-shadow:0 4px 10px #2563eb33}.branding-text-solid{flex-direction:column;line-height:1;display:flex}.brand-title{color:var(--slate-900);letter-spacing:-.03em;font-family:Sora,sans-serif;font-size:.95rem;font-weight:800}.brand-subtitle{color:var(--primary-600);letter-spacing:.1em;font-size:.6rem;font-weight:700}.toggle-btn-solid{background:var(--slate-100);width:32px;height:32px;color:var(--slate-600);cursor:pointer;transition:var(--transition-fast);border:none;border-radius:8px;justify-content:center;align-items:center;display:flex}.toggle-btn-solid:hover{background:var(--primary-50);color:var(--primary-600)}.nav-scroll-solid{flex:1;padding:.75rem;overflow-y:auto}.nav-section-solid{margin-bottom:1.5rem}.section-label-solid{color:var(--slate-400);letter-spacing:.15em;cursor:pointer;text-transform:uppercase;justify-content:space-between;align-items:center;margin:1.5rem .75rem .75rem;font-size:.65rem;font-weight:800;transition:color .2s;display:flex}.section-label-solid:hover{color:var(--primary-600)}.nav-item-solid{width:100%;color:var(--slate-600);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;border-radius:12px;align-items:center;gap:1rem;margin-bottom:.25rem;padding:.9rem 1rem;font-size:.85rem;font-weight:700;display:flex;position:relative}.icon-wrapper{justify-content:center;align-items:center;min-width:20px;display:flex}.nav-item-solid:hover{color:var(--primary-700);background:#2563eb0f;transform:translate(4px)translateY(-2px);box-shadow:0 4px 12px #00000008}.nav-item-solid.active{color:var(--primary-700);box-shadow:none;background:#2563eb14}.nav-item-solid.active .icon-wrapper{animation:2s infinite icon-pulse}@keyframes icon-pulse{0%{filter:drop-shadow(0 0 #2563eb00);transform:scale(1)}50%{filter:drop-shadow(0 0 8px #2563eb4d);transform:scale(1.1)}to{filter:drop-shadow(0 0 #2563eb00);transform:scale(1)}}.active-bar{background:var(--primary-600);border-radius:0 4px 4px 0;width:4px;position:absolute;top:15%;bottom:15%;left:0;box-shadow:2px 0 8px #2563eb4d}.nav-item-solid[data-tooltip]:not(.expanded):hover:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;pointer-events:none;z-index:2000;background:#1e293b;border-radius:8px;padding:.5rem 1rem;font-size:.75rem;font-weight:800;animation:.2s forwards fadeInRight;position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%);box-shadow:0 10px 20px #0003}@keyframes fadeInRight{0%{opacity:0;transform:translateY(-50%)translate(-10px)}to{opacity:1;transform:translateY(-50%)translate(0)}}.section-divider{background:var(--slate-200);height:1px;margin:.5rem 0 1.5rem}.footer-solid{border-top:1px solid var(--slate-100);flex-direction:column;gap:.75rem;padding:1.25rem;display:flex}.profile-card-solid{border:1px solid var(--slate-100);box-shadow:var(--shadow-sm);transition:var(--transition-fast);background:#fff;border-radius:16px;align-items:center;gap:.75rem;padding:.75rem;display:flex}.profile-card-solid:hover{border-color:var(--primary-200);box-shadow:var(--shadow-executive)}.avatar-solid{background:linear-gradient(135deg, var(--primary-500), var(--primary-700));color:#fff;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex;box-shadow:0 4px 10px #2563eb33}.profile-info-solid{flex-direction:column;min-width:0;display:flex}.profile-name-solid{color:var(--slate-900);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:800;overflow:hidden}.profile-role-solid{color:var(--primary-600);text-transform:uppercase;letter-spacing:.02em;font-size:.7rem;font-weight:700}.logout-btn-solid{color:#dc2626;cursor:pointer;width:100%;transition:var(--transition-fast);background:#fff;border:1.5px solid #fecaca;border-radius:12px;justify-content:center;align-items:center;gap:.75rem;padding:.85rem;font-size:.8rem;font-weight:800;display:flex}.logout-btn-solid:hover{background:#fef2f2;transform:translateY(-2px);box-shadow:0 4px 12px #dc26261a}.tab-container{border:1px solid var(--slate-100);width:fit-content;box-shadow:var(--shadow-sm);background:#fff;border-radius:20px;gap:.5rem;margin-bottom:3rem;padding:.6rem;display:flex}.tab-btn{cursor:pointer;color:var(--slate-400);transition:var(--transition-smooth);background:0 0;border:none;border-radius:14px;align-items:center;gap:.6rem;padding:.8rem 1.75rem;font-size:.9rem;font-weight:800;display:flex}.tab-btn:hover{color:var(--slate-600);background:var(--slate-50)}.tab-btn.active{background:var(--primary-600);color:#fff;box-shadow:0 8px 16px -4px #2563eb4d}.auth-glow{filter:blur(120px);pointer-events:none;z-index:1;border-radius:50%;width:40%;height:40%;position:absolute}.error-banner-v2{color:#991b1b;background:#fff1f2;border-left:4px solid #f43f5e;border-radius:14px;align-items:center;gap:1rem;margin-bottom:2rem;padding:1.25rem;font-size:.85rem;font-weight:800;display:flex;box-shadow:0 4px 12px #f43f5e1a}.icon-box{width:40px;height:40px;transition:var(--transition-fast);border-radius:12px;justify-content:center;align-items:center;display:flex}.animate-v2{opacity:0;animation:slideUpFade .6s var(--easing-standard) forwards}@keyframes slideUpFade{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:1s linear infinite spin}@keyframes pulse-led{0%{opacity:1;transform:scale(1);box-shadow:0 0 #10b98166}70%{opacity:.8;transform:scale(1.1);box-shadow:0 0 8px 3px #10b98100}to{opacity:1;transform:scale(1)}}.ledger-indicator{border-radius:50%;width:8px;height:8px}.ledger-active{background:#10b981;animation:2s infinite pulse-led}.ledger-inactive{background:#94a3b8}.badge-2026{letter-spacing:.05em;text-transform:uppercase;background:var(--slate-100);color:var(--slate-600);border:1px solid var(--slate-200);border-radius:10px;justify-content:center;align-items:center;padding:.4rem .8rem;font-size:.65rem;font-weight:900;display:inline-flex}button,input,select,.nav-item-solid{min-height:44px}@media (width<=1200px){:root{--sidebar-width:280px}}@media (width<=992px){.section-container,.card-premium{padding:1.5rem}.brand-title{font-size:2rem!important}}@media (width<=768px){body{font-size:14px}.auth-card{padding:2.5rem 1.5rem}.logo-ds{width:60px;height:60px;font-size:1.4rem}.sidebar-solid{transition:transform .4s var(--easing-standard);position:fixed;transform:translate(-100%);box-shadow:0 0 40px #0003;width:var(--sidebar-width)!important}.sidebar-solid.mobile-open{transform:translate(0)}main{margin-left:0!important;padding:1rem!important}header{flex-direction:column;gap:1rem;margin-top:3.5rem;align-items:flex-start!important}.tab-container{width:100%;padding:.4rem;overflow-x:auto}.tab-btn{white-space:nowrap;padding:.6rem 1rem;font-size:.8rem}}@media (width<=480px){.section-container{padding:1rem}.card-premium,.card-holographic,.branch-card-quantum{padding:1.25rem}.brand-title{font-size:1.5rem!important}.input-v2{padding:.75rem 1rem;font-size:.85rem}.btn-v2{padding:.75rem 1.25rem;font-size:.8rem}}.mobile-only{display:none}@media (width<=768px){.mobile-only{display:block}.desktop-only{display:none}}.app-top-header{-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--slate-200);z-index:2001;height:72px;transition:var(--transition-smooth);background:#ffffffd9;align-items:center;padding:0 1.5rem;display:flex;position:sticky;top:0;left:0;right:0}.unified-toggle{background:var(--primary-50);width:44px;height:44px;color:var(--primary-600);cursor:pointer;transition:var(--transition-fast);border:none;border-radius:12px;justify-content:center;align-items:center;display:flex;box-shadow:0 4px 6px -1px #0000000d}.unified-toggle:hover{background:var(--primary-100);transform:translateY(-1px)}.unified-toggle:active{transform:scale(.95)}.header-view-title{color:var(--slate-900);letter-spacing:-.03em;text-transform:capitalize;text-shadow:0 2px 4px #0f172a14;margin-left:1.5rem;font-family:Sora,sans-serif;font-size:1.25rem;font-weight:800}@media (width<=768px){.app-top-header{height:64px;padding:0 1rem}}.glass-panel-2026{-webkit-backdrop-filter:blur(24px);background:#ffffffbf;border:1px solid #fffc;transition:all .5s cubic-bezier(.2,.8,.2,1);box-shadow:0 4px 24px -6px #0000000d,inset 0 0 0 1px #fff6}.hover-float-3d{will-change:transform, box-shadow;transition:all .5s cubic-bezier(.2,.8,.2,1)}.hover-float-3d:hover{z-index:10;transform:translateY(-6px)scale(1.02);box-shadow:0 24px 40px -10px #00000014,0 12px 16px -6px #0000000a,inset 0 1px #ffffffe6}@keyframes gradient-shift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.bg-gradient-animated{animation:6s infinite gradient-shift;background-size:200% 200%!important}@keyframes pulse-glow{0%{box-shadow:0 0 #fff6}70%{box-shadow:0 0 0 15px #fff0}to{box-shadow:0 0 #fff0}}.btn-pulse-glow{animation:2s infinite pulse-glow}.btn-v2-animated{transition:all .3s cubic-bezier(.2,.8,.2,1)}.btn-v2-animated:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 10px 20px -5px #2563eb66}@keyframes stagger3DEntry{0%{opacity:0;transform:perspective(1000px)translateY(40px)scale(.92)rotateX(-10deg)}to{opacity:1;transform:perspective(1000px)translateY(0)scale(1)rotateX(0)}}.stagger-3d-enter{opacity:0;transform-origin:top;animation:.7s cubic-bezier(.34,1.56,.64,1) forwards stagger3DEntry}@keyframes slow-breathing{0%{box-shadow:var(--btn-shadow-outer), var(--btn-specular);transform:scale(1)}50%{box-shadow:0 12px 24px #00000026, var(--btn-specular);transform:scale(1.015)}to{box-shadow:var(--btn-shadow-outer), var(--btn-specular);transform:scale(1)}}.btn-breathing:not(:hover){animation:3s ease-in-out infinite slow-breathing}@keyframes wave-hand{0%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}60%{transform:rotate(0)}to{transform:rotate(0)}}.wave-emoji{transform-origin:70% 70%;animation:2.5s infinite wave-hand;display:inline-block}
