*{box-sizing:border-box}
.card{background:#fff;border-radius:.75rem;border:1px solid #e5e7eb;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.inp{padding:.5rem .75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;transition:all .15s}
.inp:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.15)}
.btn-primary{background:#4f46e5;color:#fff;font-size:.875rem;font-weight:500;padding:.5rem 1.25rem;border-radius:.5rem;transition:all .15s;display:inline-flex;align-items:center;gap:.5rem;justify-content:center}
.btn-primary:hover{background:#4338ca;box-shadow:0 4px 12px rgba(79,70,229,.3)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.btn-outline{border:1px solid #d1d5db;color:#4b5563;font-size:.875rem;padding:.5rem 1.25rem;border-radius:.5rem;transition:all .15s;display:inline-flex;align-items:center;gap:.5rem}
.btn-outline:hover{border-color:#9ca3af;background:#f9fafb}
.btn-outline:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.table-header{text-align:left;padding:.75rem 1rem;font-size:.75rem;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.05em}
.table-cell{padding:.75rem 1rem;font-size:.875rem}
.badge{font-size:.75rem;padding:.125rem .625rem;border-radius:9999px;font-weight:500;display:inline-block}

/* Spinner */
.spinner{display:inline-block;width:1rem;height:1rem;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .6s linear infinite}
.spinner-lg{width:2rem;height:2rem;border-width:3px}
@keyframes spin{to{transform:rotate(360deg)}}

/* Page loader */
.page-loading{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:4rem 0;color:#9ca3af;font-size:.875rem}
.page-loading .spinner{color:#6366f1}

/* Skeleton */
.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:.5rem}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}