/* ───── LOADING SKELETON ───── */
    @keyframes shimmer {
      0% {
        background-position: -600px 0;
      }

      100% {
        background-position: 600px 0;
      }
    }

    .skeleton-row td {
      padding: 14px 14px;
    }

    .skeleton-cell {
      height: 14px;
      border-radius: 6px;
      background: linear-gradient(90deg, var(--surface2) 25%, rgba(255, 255, 255, .05) 50%, var(--surface2) 75%);
      background-size: 600px 100%;
      animation: shimmer 1.4s infinite linear;
    }

    .skeleton-cell.wide {
      width: 70%;
    }

    .skeleton-cell.med {
      width: 45%;
    }

    .skeleton-cell.short {
      width: 28%;
    }

    ::-webkit-scrollbar-track {
      background: var(--surface);
    }

    ::-webkit-scrollbar-thumb {
      background: #1e3a5f;
      border-radius: 3px;
    }

    [data-theme="light"] ::-webkit-scrollbar-thumb {
      background: #94a3b8;
    }

    input,
    select,
    textarea {
      font-family: 'Sora', sans-serif;
      font-size: 13px;
    }

    input::placeholder,
    textarea::placeholder {
      color: var(--muted);
    }

    input:focus,
    select:focus,
    textarea:focus {
      outline: none;
    }

    /* ───── UTILS ───── */
    .hidden {
      display: none !important;
    }

    .flex {
      display: flex;
    }

    .flex-col {
      display: flex;
      flex-direction: column;
    }

    .gap4 {
      gap: 4px;
    }

    .gap6 {
      gap: 6px;
    }

    .gap8 {
      gap: 8px;
    }

    .gap10 {
      gap: 10px;
    }

    .gap12 {
      gap: 12px;
    }

    .gap16 {
      gap: 16px;
    }

    .items-center {
      align-items: center;
    }

    .items-end {
      align-items: flex-end;
    }

    .flex-wrap {
      flex-wrap: wrap;
    }

    .justify-center {
      justify-content: center;
    }

    .justify-end {
      justify-content: flex-end;
    }

    .justify-between {
      justify-content: space-between;
    }

    .flex-1 {
      flex: 1;
    }

    .flex-2 {
      flex: 2;
    }

    .w-full {
      width: 100%;
    }

    .h-screen {
      height: 100vh;
    }

    .relative {
      position: relative;
    }

    .cursor-pointer {
      cursor: pointer;
    }

    .text-center {
      text-align: center;
    }

    .text-sm {
      font-size: 12px;
    }

    .text-xs {
      font-size: 11px;
    }

    .font-bold {
      font-weight: 700;
    }

    .font-semibold {
      font-weight: 600;
    }

    .fs11 {
      font-size: 11px;
    }

    .fs12 {
      font-size: 12px;
    }

    .fs14 {
      font-size: 14px;
    }

    .fs16 {
      font-size: 16px;
    }

    .mb8 {
      margin-bottom: 8px;
    }

    .mb12 {
      margin-bottom: 12px;
    }

    .mt8 {
      margin-top: 8px;
    }

    .m0 {
      margin: 0;
    }

    .my6 {
      margin-top: 6px;
      margin-bottom: 6px;
    }

    .mt15 {
      margin-top: 15px;
    }

    .mt20 {
      margin-top: 20px;
    }

    .nowrap {
      white-space: nowrap;
    }

    .truncate {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    /* ───── ANIMATIONS ───── */
    @keyframes fadeIn {
      from {
        opacity: 0;
        transform: translateY(10px) scale(0.98);
      }

      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    @keyframes slideRight {
      from {
        opacity: 0;
        transform: translateX(20px);
      }

      to {
        opacity: 1;
        transform: translateX(0);
      }
    }

    @keyframes pulse {

      0%,
      100% {
        opacity: 1;
      }

      50% {
        opacity: .5;
      }
    }

    .anim-in {
      animation: fadeIn .18s ease forwards;
    }

    .anim-slide {
      animation: slideRight .2s ease forwards;
    }

    /* ───── TOAST ───── */
    #toast {
      position: fixed;
      top: 20px;
      right: 20px;
      z-index: 999;
      padding: 13px 20px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 500;
      box-shadow: 0 12px 30px rgba(0, 0, 0, .4);
      animation: anim-slide .2s ease;
      pointer-events: none;
      max-width: 320px;
    }

    .toast-success {
      background: var(--surface2);
      color: var(--text);
      border: 1px solid rgba(16, 185, 129, .2);
      border-left: 3px solid var(--green);
    }

    .toast-error {
      background: var(--surface2);
      color: var(--text);
      border: 1px solid rgba(239, 68, 68, .2);
      border-left: 3px solid var(--red);
    }

    .toast-info {
      background: var(--surface2);
      color: var(--text);
      border: 1px solid rgba(59, 130, 246, .2);
      border-left: 3px solid var(--accent);
    }

    .toast-warning {
      background: var(--surface2);
      color: var(--text);
      border: 1px solid rgba(245, 158, 11, .2);
      border-left: 3px solid var(--orange);
    }