:root{
    /* Colores de marca personalizables */
    --brand-1:#4f46e5; /* primario */
    --brand-2:#22c55e; /* secundario */
    --brand-3:#f59e0b; /* acento */
    }
    
    
    body{
    min-height:100vh;
    background-image: radial-gradient(1200px 600px at 20% -20%, rgba(79,70,229,.06), transparent 60%),
    radial-gradient(1000px 600px at 120% 20%, rgba(34,197,94,.06), transparent 60%);
    }
    [data-bs-theme="dark"] body{ background-image:none; }
    
    
    .brand-gradient{ background:linear-gradient(90deg, var(--brand-1), var(--brand-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
    .card-kpi{ border:1px solid rgba(0,0,0,.06) }
    
    
    /* Tabla con header sticky */
    .table-responsive{ max-height:520px; overflow:auto; }
    thead th{ position:sticky; top:0; z-index:2; }
    
    
    /* Skeleton loaders */
    .skeleton{ position:relative; overflow:hidden; background:#e9ecef; border-radius:.5rem; }
    .skeleton::after{ content:""; position:absolute; inset:0; transform:translateX(-100%);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
    animation: shimmer 1.2s infinite; }
    @keyframes shimmer{ 100%{ transform:translateX(100%);} }
    
    
    .dropzone{ border:2px dashed var(--brand-1); border-radius:.75rem; padding:1rem; text-align:center; cursor:pointer; }
    .dropzone.dragover{ background: rgba(79,70,229,.06); }
    
    
    .placeholder{ display:flex; align-items:center; justify-content:center; height:320px; color: #6c757d; }