:root{--font-family-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-title: "Outfit", "Inter", var(--font-family-sans);--color-bg-base: #070a13;--color-bg-surface: rgba(15, 23, 42, .65);--color-bg-card: rgba(30, 41, 59, .45);--color-border: rgba(255, 255, 255, .08);--color-border-glow: rgba(99, 102, 241, .3);--color-primary: #5c67f2;--color-primary-hover: #4e59e5;--color-primary-glow: rgba(92, 103, 242, .4);--color-secondary: #00ca80;--color-secondary-hover: #00b370;--color-accent: #f59e0b;--color-success: #10b981;--color-info: #3b82f6;--color-warning: #f59e0b;--color-danger: #ef4444;--badge-insert-bg: rgba(16, 185, 129, .15);--badge-insert-text: #34d399;--badge-insert-border: rgba(16, 185, 129, .3);--badge-update-bg: rgba(59, 130, 246, .15);--badge-update-text: #60a5fa;--badge-update-border: rgba(59, 130, 246, .3);--badge-delete-bg: rgba(239, 68, 68, .15);--badge-delete-text: #f87171;--badge-delete-border: rgba(239, 68, 68, .3);--color-text-primary: #f8fafc;--color-text-secondary: #94a3b8;--color-text-muted: #64748b;--color-text-on-primary: #ffffff;--color-text-on-active-nav: #ffffff;--blur-amount: 12px;--glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .37);--card-shadow: 0 4px 20px 0 rgba(0, 0, 0, .2);--border-radius-sm: 8px;--border-radius-md: 14px;--border-radius-lg: 20px;--border-radius-xl: 30px;--sidebar-width: 260px;--header-height: 70px;--transition-fast: .2s cubic-bezier(.4, 0, .2, 1);--transition-normal: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1)}[data-theme=light]{--color-bg-base: #f1f5f9;--color-bg-surface: rgba(255, 255, 255, .75);--color-bg-card: rgba(255, 255, 255, .45);--color-border: rgba(15, 23, 42, .08);--color-border-glow: rgba(92, 103, 242, .2);--color-primary: #4f46e5;--color-primary-hover: #4338ca;--color-primary-glow: rgba(79, 70, 229, .15);--color-secondary: #059669;--color-secondary-hover: #047857;--badge-insert-bg: rgba(5, 150, 105, .08);--badge-insert-text: #047857;--badge-insert-border: rgba(5, 150, 105, .18);--badge-update-bg: rgba(37, 99, 235, .08);--badge-update-text: #1d4ed8;--badge-update-border: rgba(37, 99, 235, .18);--badge-delete-bg: rgba(220, 38, 38, .08);--badge-delete-text: #b91c1c;--badge-delete-border: rgba(220, 38, 38, .18);--color-text-primary: #0f172a;--color-text-secondary: #475569;--color-text-muted: #64748b;--color-text-on-primary: #ffffff;--color-text-on-active-nav: var(--color-primary);--glass-shadow: 0 8px 32px 0 rgba(31, 41, 55, .06);--card-shadow: 0 4px 20px 0 rgba(31, 41, 55, .04)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family-sans);background-color:var(--color-bg-base);color:var(--color-text-primary);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-family:var(--font-family-title);font-weight:600;letter-spacing:-.02em}a{color:inherit;text-decoration:none}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-bg-base)}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}@keyframes rotate-glow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fade-in{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 15px #5c67f233}50%{box-shadow:0 0 30px #5c67f299}}.glass-panel{background:var(--color-bg-surface);backdrop-filter:blur(var(--blur-amount));-webkit-backdrop-filter:blur(var(--blur-amount));border:1px solid var(--color-border);box-shadow:var(--glass-shadow)}.glass-card{background:var(--color-bg-card);backdrop-filter:blur(var(--blur-amount));-webkit-backdrop-filter:blur(var(--blur-amount));border:1px solid var(--color-border);border-radius:var(--border-radius-md);box-shadow:var(--card-shadow);transition:var(--transition-normal);padding:1.5rem}.glass-card:hover{transform:translateY(-4px);border-color:var(--color-border-glow);box-shadow:0 12px 30px #5c67f226}.login-page{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;background-color:var(--color-bg-base);overflow:hidden;padding:1rem}.login-bg-glow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(92,103,242,.35) 0%,rgba(0,202,128,.15) 50%,transparent 100%);border-radius:50%;filter:blur(80px);animation:rotate-glow 25s infinite linear;z-index:1}.login-card{position:relative;z-index:2;width:100%;max-width:440px;padding:2.5rem;border-radius:var(--border-radius-lg);animation:fade-in .8s cubic-bezier(.16,1,.3,1)}.app-container{display:flex;min-height:100vh;position:relative}.sidebar{width:var(--sidebar-width);height:100vh;height:100dvh;position:fixed;top:0;left:0;display:flex;flex-direction:column;border-right:1px solid var(--color-border);z-index:10;transition:var(--transition-normal)}.sidebar-brand{height:var(--header-height);display:flex;align-items:center;padding:0 1.5rem;font-family:var(--font-family-title);font-size:1.4rem;font-weight:800;gap:.75rem;color:var(--color-text-primary);border-bottom:1px solid var(--color-border)}.sidebar-menu{list-style:none;padding:1.5rem 1rem;display:flex;flex-direction:column;gap:.5rem;flex:1;overflow-y:auto}.sidebar-menu-item a{display:flex;align-items:center;gap:1rem;padding:.85rem 1.25rem;border-radius:var(--border-radius-sm);color:var(--color-text-secondary);font-weight:500;transition:var(--transition-fast)}.sidebar-menu-item a:hover,.sidebar-menu-item a.active{color:var(--color-text-primary);background:#ffffff0d}.sidebar-menu-item a.active{background:var(--color-primary-glow);border:1px solid var(--color-border-glow);color:var(--color-text-on-active-nav)}.sidebar-footer{padding:1.25rem;padding-bottom:calc(1.25rem + env(safe-area-inset-bottom));border-top:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.header{position:fixed;top:0;right:0;left:var(--sidebar-width);height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 2rem;border-bottom:1px solid var(--color-border);z-index:9;transition:var(--transition-normal)}.header-title{font-size:1.25rem;font-weight:600}.header-actions{display:flex;align-items:center;gap:1.5rem}.main-content{margin-left:var(--sidebar-width);margin-top:var(--header-height);flex:1;padding:2rem;min-height:calc(100vh - var(--header-height));animation:fade-in .5s ease-out}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;border-radius:var(--border-radius-sm);border:none;cursor:pointer;transition:var(--transition-fast)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:var(--color-text-on-primary)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover);box-shadow:0 0 15px var(--color-primary-glow)}.btn-secondary{background:#ffffff0d;color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover:not(:disabled){background:#ffffff1a}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:#d32f2f}.form-group{margin-bottom:1.25rem}.form-group label{display:block;font-size:.85rem;font-weight:500;color:var(--color-text-secondary);margin-bottom:.5rem}.form-control{width:100%;padding:.75rem 1rem;background:#ffffff08;border:1px solid var(--color-border);border-radius:var(--border-radius-sm);color:var(--color-text-primary);font-family:inherit;font-size:.95rem;transition:var(--transition-fast)}.form-control:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 10px #5c67f233;background:#ffffff0f}.grid-3,.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:2rem}.badge{display:inline-flex;align-items:center;justify-content:center;padding:.25rem .65rem;font-size:.75rem;font-weight:600;border-radius:50px;border:1px solid transparent}.badge-insert{background:var(--badge-insert-bg);color:var(--badge-insert-text);border-color:var(--badge-insert-border)}.badge-update{background:var(--badge-update-bg);color:var(--badge-update-text);border-color:var(--badge-update-border)}.badge-delete{background:var(--badge-delete-bg);color:var(--badge-delete-text);border-color:var(--badge-delete-border)}.table-container{overflow-x:auto;border-radius:var(--border-radius-md);border:1px solid var(--color-border);background:#0f172a59;margin-top:1.5rem}.premium-table,.table{width:100%;border-collapse:collapse;text-align:left;font-size:.95rem}.premium-table th,.table th{padding:1rem 1.5rem;font-weight:600;font-size:.85rem;text-transform:uppercase;color:var(--color-text-secondary);border-bottom:1px solid var(--color-border);background:#ffffff05;letter-spacing:.05em}.premium-table td,.table td{padding:1.15rem 1.5rem;border-bottom:1px solid var(--color-border);color:var(--color-text-primary);transition:var(--transition-fast)}.premium-table tr:hover td,.table tr:hover td{background:#ffffff05}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000a6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem}.modal-content{width:calc(100% - 2rem);max-width:650px;margin:1rem;background:var(--color-bg-base);border:1px solid var(--color-border);border-radius:var(--border-radius-md);box-shadow:0 20px 40px #00000080;overflow:hidden;animation:fade-in .3s ease-out}.modal-header{padding:1.25rem 1.5rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border)}.modal-body{padding:1.5rem;max-height:70vh;overflow-y:auto}.modal-footer{padding:1rem 1.5rem;border-top:1px solid var(--color-border);display:flex;justify-content:flex-end;gap:.75rem}.flex{display:flex}.align-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:.5rem}.gap-2{gap:1rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.text-center{text-align:center}.demo-banner{background:linear-gradient(90deg,#1d1b4b,#312e81);border-bottom:1px solid rgba(99,102,241,.4);color:#c7d2fe;font-size:.85rem;font-weight:500;text-align:center;padding:.5rem 1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.demo-badge-nav{background:#f59e0b26;color:#fbbf24;border:1px solid rgba(245,158,11,.3)}.wizard-steps{display:flex;justify-content:space-between;margin-bottom:2rem;position:relative}.wizard-steps:before{content:"";position:absolute;height:2px;background:var(--color-border);width:100%;top:50%;transform:translateY(-50%);z-index:1}.wizard-step{width:40px;height:40px;border-radius:50%;background:var(--color-bg-base);border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--color-text-secondary);position:relative;z-index:2;transition:var(--transition-fast)}.wizard-step.active{border-color:var(--color-primary);color:var(--color-primary);box-shadow:0 0 10px #5c67f24d}.wizard-step.completed{border-color:var(--color-secondary);background:var(--color-secondary);color:#fff}@media (max-width: 992px){:root{--sidebar-width: 80px}.sidebar-brand span,.sidebar-menu-item span{display:none}.sidebar-menu-item a{justify-content:center;padding:1rem}.sidebar-footer{flex-direction:column;gap:.5rem}.sidebar-footer button span{display:none}}.desktop-only-view{display:block}.mobile-only-view{display:none!important}@media (max-width: 576px){:root{--sidebar-width: 0px}.sidebar{width:260px;transform:translate(-100%)}.sidebar.mobile-open{transform:translate(0)}.sidebar.mobile-open .sidebar-brand span,.sidebar.mobile-open .sidebar-menu-item span{display:inline}.sidebar.mobile-open .sidebar-menu-item a{justify-content:flex-start!important;padding:.85rem 1.25rem!important}.header{left:0;padding:0 1rem}.header-title{padding-left:3rem;font-size:1.1rem}.main-content{margin-left:0;padding:1rem}.desktop-only-view{display:none!important}.mobile-only-view{display:flex!important}.flex.justify-between.align-center{flex-direction:column;align-items:stretch!important;gap:1rem}.flex.justify-between.align-center .btn,.flex.justify-between.align-center a.btn,.flex.justify-between.align-center button{width:100%;text-align:center}.btn{padding:.8rem 1.25rem;font-size:.95rem;width:100%;justify-content:center}.form-control,input,select,textarea{padding:.8rem 1rem;font-size:16px!important}.wizard-steps{margin-bottom:1.5rem}.wizard-step{width:32px;height:32px;font-size:.85rem}}