@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

/**
 * Skin Factory — Tokens oficiales (Manual Identidad v2)
 * Eléctrico #00E5FF · Magenta #E040FB · Void #000000 · Blanco titanio #E8E8EC
 */
:root {
  --sf-bg-deep: #000000;
  --sf-bg-panel: #0a0a0a;
  --sf-accent: #00e5ff;
  --sf-accent-cyan: #00e5ff;
  --sf-accent-border: rgba(0, 229, 255, 0.35);
  --sf-magenta: #e040fb;
  --sf-magenta-dim: rgba(224, 64, 251, 0.35);
  --sf-gradient-primary: linear-gradient(135deg, #00e5ff 0%, #e040fb 100%);
  --sf-gradient-border: linear-gradient(135deg, rgba(0, 229, 255, 0.7) 0%, rgba(224, 64, 251, 0.7) 100%);
  --sf-gradient-glow: 0 0 22px rgba(0, 229, 255, 0.4), 0 0 40px rgba(224, 64, 251, 0.18);
  --sf-text-primary: #e8e8ec;
  --sf-text-muted: #94a3b8;
  --sf-text-dim: #64748b;

  --ll-topbar-h: 60px;
  --sf-layout-topbar-h: 60px;
  --sf-layout-topbar-padding-x: 0.85rem;
  --sf-layout-topbar-gap: 0.65rem;
  --sf-layout-topbar-z: 13002;

  --sf-brand-sello-size: 28px;
  --sf-brand-texto-width: 110px;

  /* Responsive (ver sf-responsive.css) */
  --sf-bp-mobile: 767px;
  --sf-bp-tablet: 1024px;
  --sf-pad-x-mobile: max(0.85rem, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
  --sf-vv-height: 100dvh;
}

/* —— Scrollbar global slim (Electric Cyan) —— */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 229, 255, 0.45) transparent;
}
*::-webkit-scrollbar { width: 5px; height: 5px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: rgba(0, 229, 255, 0.45);
  border-radius: 999px;
}
*::-webkit-scrollbar-thumb:hover { background: rgba(0, 229, 255, 0.7); }