/* entorno.css — marca visible del entorno de DESARROLLO (MURMURA_ENTORNO=desarrollo).
   En producción no se muestra nada. Solo tokens de tokens.css. */
body[data-entorno="desarrollo"]::before {
  content: "DESARROLLO";
  position: fixed;
  z-index: 1000;
  top: var(--prim-space-1);
  right: var(--prim-space-1);
  padding: 2px var(--prim-space-3);
  border-radius: var(--sem-radius-chip);
  background: var(--sem-estado-atencion-bg);
  color: var(--sem-estado-atencion-fg);
  font-family: var(--prim-font-family-base);
  font-size: var(--prim-font-size-1);
  font-weight: 700;
  pointer-events: none;
  box-shadow: var(--sem-elevation-panel);
}

/* en pantallas angostas (celulares) la marca es una línea fina de color arriba: no tapa nada */
@media (max-width: 500px) {
  body[data-entorno="desarrollo"]::before {
    content: ""; top: 0; left: 0; right: 0; bottom: auto; height: 3px; padding: 0;
    border-radius: 0; box-shadow: none; background: var(--sem-estado-atencion-fg);
  }
}