:root {
      --vs: #dc2626;
      --vsd: #b91c1c
    }

    .bg-vs {
      background: var(--vs)
    }

    .bg-vsd {
      background: var(--vsd)
    }

    .text-vs {
      color: var(--vs)
    }

    body {
      background: #0b1220;
      color: #e5e7eb
    }

    label,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    th,
    .tab {
      color: #fff
    }

    .soft {
      background: #0f172a;
      border: 1px solid #334155;
      color: #fff
    }

    .soft:focus {
      outline: none;
      border-color: #60a5fa;
      box-shadow: 0 0 0 2px #1d4ed833
    }

    .card {
      background: #0b1220;
      border: 1px solid #1f2937
    }

    .chip {
      padding: .25rem .5rem;
      border-radius: 999px;
      font-size: .72rem;
      background: #1f2937;
      color: #e5e7eb;
      border: 1px solid #334155
    }

    .chip.ok {
      background: #16a34a;
      color: #fff;
      border-color: #15803d
    }

    .chip.warn {
      background: #d97706;
      color: #fff;
      border-color: #b45309
    }

    .chip.info {
      background: #2563eb;
      color: #fff;
      border-color: #1d4ed8
    }

    .muted {
      color: #cbd5e1
    }

    input::placeholder,
    textarea::placeholder {
      color: #94a3b8
    }

    dialog::backdrop {
      background: rgba(0, 0, 0, .6)
    }

    .btn {
      border-radius: .5rem;
      padding: .5rem .75rem
    }

    .tbl th {
      background: #0f172a;
      position: sticky;
      top: 0
    }

    .link {
      color: #60a5fa
    }

    .tab {
      transition: all .15s ease
    }

    .tab[aria-selected="true"] {
      background: #1f2937;
      border-color: #475569
    }

    .tabpanel {
      display: none
    }

    .tabpanel.active {
      display: block
    }

    .kbd {
      background: #0f172a;
      border: 1px solid #334155;
      border-bottom-width: 2px;
      border-radius: .375rem;
      padding: .05rem .35rem;
      font-size: .72rem
    }
  

/* Mejoras menores */
.btn{transition:background-color .15s ease, border-color .15s ease, transform .05s ease;}
.btn:active{transform:translateY(1px);}
dialog{border:none;}
/* ===== Fix visual dialog docs ===== */
#dlgDocs {
  background: #0b1220;
  color: #e5e7eb;
  border: 1px solid #334155;
}

#dlgDocs table,
#dlgDocs th,
#dlgDocs td {
  color: #e5e7eb;
}

#dlgDocs .muted { color: #cbd5e1; }
#dlgDocs .link { color: #60a5fa; }