/* =====================================================================
   La Gran Sonrisa · Sistema (vista previa)
   Cascarón: tokens, base y marco de navegación. Las vistas traen su CSS
   con GS.css() y prefijo v-<id>-. Tema claro solamente.
   ===================================================================== */

:root {
  /* Marca (tomados del logo: azul #0064B0 y turquesa #1CBCBC) */
  --gs-brand: #0064B0;
  --gs-brand-strong: #004A86;
  --gs-brand-soft: #E8F1FA;
  --gs-accent: #1CBCBC;          /* turquesa de la sonrisa: rellenos y adornos */
  --gs-accent-strong: #0A7C7D;   /* turquesa para TEXTO sobre blanco (5:1) */
  --gs-accent-soft: #E0F5F5;
  --gs-on-brand: #FFFFFF;                     /* texto sobre el azul de marca */
  --gs-on-brand-muted: rgba(255, 255, 255, .78);
  --gs-on-brand-line: rgba(255, 255, 255, .18);
  --gs-accent-on-brand: #6FE2E1;             /* turquesa legible sobre el azul */

  /* Superficies y tinta */
  --gs-bg: #F3F6FA;
  --gs-surface: #FFFFFF;
  --gs-surface-2: #F7F9FC;
  --gs-ink: #0E2440;
  --gs-muted: #5B6B80;
  --gs-line: #E2E8F0;
  --gs-line-soft: #F0F3F8;                   /* líneas muy suaves (medias horas) */
  --gs-line-strong: #C9D5E3;                 /* bordes punteados y hover */
  --gs-brand-line: #B8CBE0;                  /* trazos claros del azul */
  --gs-accent-line: #9BC9C9;                 /* trazos del turquesa */
  --gs-accent-line-soft: #BFE7E7;
  --gs-accent-glow: rgba(28, 188, 188, .45);
  --gs-shadow-color: rgba(14, 36, 64, .45);
  --gs-shadow-brand: 0 18px 40px -22px rgba(0, 74, 134, .75);

  /* Estados */
  --gs-ok: #0F7B55;
  --gs-ok-soft: #E2F4EC;
  --gs-warn: #A86200;
  --gs-warn-soft: #FDF2DC;
  --gs-danger: #C2333D;
  --gs-danger-soft: #FCEBEC;

  /* Forma */
  --gs-radius: 14px;
  --gs-radius-sm: 10px;
  --gs-shadow: 0 1px 2px rgba(14, 36, 64, .05), 0 10px 30px -18px rgba(14, 36, 64, .30);
  --gs-shadow-lg: 0 2px 6px rgba(14, 36, 64, .06), 0 24px 60px -24px rgba(14, 36, 64, .40);

  /* Tipografía: una sola familia (Rubik). Para columnas de cifras usar
     font-variant-numeric: tabular-nums */
  --gs-font: "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --gs-font-num: "Rubik", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Medidas del marco */
  --gs-lateral: 256px;
  --gs-franja: 33px;
  --gs-tabbar: 64px;
  --gs-ease: cubic-bezier(.2, .7, .2, 1);

  color-scheme: light;
}

/* ---------- Base mínima ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--gs-font);
  font-size: 15px;
  line-height: 1.45;
  color: var(--gs-ink);
  background: var(--gs-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
img { max-width: 100%; }
:focus-visible { outline: 2px solid var(--gs-brand); outline-offset: 2px; }
::selection { background: var(--gs-accent-soft); }

.gs-oculto {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Franja de vista previa ---------- */
.gs-franja {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--gs-franja);
  margin: 0;
  padding: 0 16px;
  white-space: nowrap;
  overflow: hidden;
  font-size: 12.5px;
  line-height: 1.35;
  text-align: center;
  color: var(--gs-brand-strong);
  background: var(--gs-brand-soft);
  border-bottom: 1px solid #D5E4F3;
}
.gs-franja b { font-weight: 600; }
.gs-franja-sep { margin: 0 .45em; opacity: .5; }

/* ---------- Marco ---------- */
.gs-app {
  display: grid;
  grid-template-columns: var(--gs-lateral) minmax(0, 1fr);
  min-height: calc(100vh - var(--gs-franja));
}

/* Lateral (escritorio) */
.gs-lateral {
  position: sticky;
  top: var(--gs-franja);
  height: calc(100vh - var(--gs-franja));
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 22px 14px 16px;
  background: var(--gs-surface);
  border-right: 1px solid var(--gs-line);
  overflow-y: auto;
  z-index: 25;
}
.gs-marca { display: block; padding: 2px 10px 0; text-decoration: none; border-radius: var(--gs-radius-sm); }
.gs-marca img { display: block; width: 150px; height: auto; }
.gs-marca-sub {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--gs-accent-strong);
}
.gs-contexto {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 4px;
  padding: 10px 12px;
  border-radius: var(--gs-radius-sm);
  background: var(--gs-surface-2);
  border: 1px solid var(--gs-line);
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--gs-muted);
}
.gs-contexto b { display: block; color: var(--gs-ink); font-weight: 600; font-size: 13px; }
.gs-contexto-sedes { display: flex; gap: 3px; flex-shrink: 0; }
.gs-contexto-sedes i { width: 7px; height: 22px; border-radius: 4px; background: var(--gs-brand); }
.gs-contexto-sedes i:nth-child(2) { background: #3B8BD0; }
.gs-contexto-sedes i:nth-child(3) { background: var(--gs-accent); }
.gs-contexto-sedes i:nth-child(4) { background: #7DD8D8; }

.gs-nav { display: flex; flex-direction: column; gap: 2px; }
.gs-nav-titulo {
  margin: 4px 12px 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #8A98AB;
}
.gs-nav-item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 42px;
  padding: 0 12px;
  border-radius: var(--gs-radius-sm);
  color: var(--gs-muted);
  font-weight: 500;
  font-size: 14.5px;
  text-decoration: none;
  transition: background-color .18s var(--gs-ease), color .18s var(--gs-ease);
}
.gs-nav-item svg { width: 21px; height: 21px; flex-shrink: 0; }
.gs-nav-item:hover { background: var(--gs-surface-2); color: var(--gs-ink); }
.gs-nav-item[aria-current="page"] { background: var(--gs-brand-soft); color: var(--gs-brand); font-weight: 600; }
.gs-nav-item[aria-current="page"]::before {
  content: "";
  position: absolute;
  left: -14px;
  top: 10px;
  bottom: 10px;
  width: 4px;
  border-radius: 0 4px 4px 0;
  background: var(--gs-brand);
}
.gs-nav-insignia {
  margin-left: auto;
  min-width: 22px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  display: inline-grid;
  place-items: center;
  font-size: 11.5px;
  font-weight: 600;
  color: #fff;
  background: var(--gs-accent-strong);
}

.gs-lateral-pie { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.gs-central {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--gs-radius-sm);
  background: var(--gs-accent-soft);
  color: var(--gs-ink);
  font-size: 12.5px;
  line-height: 1.3;
  border: 0;
  text-align: left;
  width: 100%;
}
.gs-central svg { width: 20px; height: 20px; color: var(--gs-accent-strong); flex-shrink: 0; }
.gs-central b { display: block; font-weight: 600; font-size: 13px; }
.gs-central span { color: var(--gs-muted); font-variant-numeric: tabular-nums; }
.gs-punto-vivo {
  position: relative;
  display: inline-block;
  width: 8px; height: 8px;
  margin-right: 5px;
  border-radius: 50%;
  background: #12A36B;
  vertical-align: 1px;
}
.gs-punto-vivo::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid #12A36B;
  opacity: 0;
  animation: gs-latido 2.4s ease-out infinite;
}
@keyframes gs-latido { 0% { transform: scale(.5); opacity: .7; } 80%, 100% { transform: scale(1.3); opacity: 0; } }

.gs-usuario {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--gs-radius-sm);
  background: transparent;
  text-align: left;
  transition: background-color .18s var(--gs-ease);
}
.gs-usuario:hover { background: var(--gs-surface-2); }
.gs-avatar {
  display: grid;
  place-items: center;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--gs-brand);
  color: #fff;
  font-size: 12.5px;
  font-weight: 600;
  flex-shrink: 0;
}
.gs-usuario b { display: block; font-size: 13px; font-weight: 600; }
.gs-usuario small { display: block; font-size: 12px; color: var(--gs-muted); }

/* ---------- Columna principal ---------- */
.gs-principal { min-width: 0; display: flex; flex-direction: column; }

.gs-barra {
  position: sticky;
  top: var(--gs-franja);
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 76px;
  padding: 12px 32px;
  background: rgba(243, 246, 250, .88);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .2s var(--gs-ease);
}
.gs-barra.gs-barra--sombra { border-bottom-color: var(--gs-line); }
.gs-barra-logo { display: none; }
.gs-barra-titulo { min-width: 0; flex: 1; }
.gs-barra-titulo h1 {
  margin: 0;
  font-size: 23px;
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: -.01em;
}
.gs-barra-titulo h1:focus { outline: none; }
.gs-barra-titulo p { margin: 3px 0 0; font-size: 13.5px; color: var(--gs-muted); text-wrap: pretty; }
.gs-barra-acciones { display: flex; align-items: center; gap: 10px; }

.gs-buscar { position: relative; }
.gs-buscar-campo {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 300px;
  height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  background: var(--gs-surface);
  border: 1px solid var(--gs-line);
  color: var(--gs-muted);
  transition: border-color .18s var(--gs-ease), box-shadow .18s var(--gs-ease);
}
.gs-buscar-campo:focus-within { border-color: #9CC2E8; box-shadow: 0 0 0 4px var(--gs-brand-soft); }
.gs-buscar-campo svg { width: 18px; height: 18px; flex-shrink: 0; }
.gs-buscar-campo input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 14.5px;
  color: var(--gs-ink);
}
.gs-buscar-campo input::placeholder { color: #8A98AB; }
.gs-buscar-campo kbd {
  font-family: var(--gs-font);
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 6px;
  border: 1px solid var(--gs-line);
  background: var(--gs-surface-2);
  color: #8A98AB;
}

.gs-boton-icono {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 42px; height: 42px;
  border-radius: 12px;
  border: 1px solid var(--gs-line);
  background: var(--gs-surface);
  color: var(--gs-ink);
  transition: background-color .18s var(--gs-ease), border-color .18s var(--gs-ease), transform .18s var(--gs-ease);
}
.gs-boton-icono svg { width: 20px; height: 20px; }
.gs-boton-icono:hover { background: var(--gs-surface-2); border-color: #CFD9E5; }
.gs-boton-icono:active { transform: scale(.96); }
.gs-boton-icono .gs-insignia-punto {
  position: absolute;
  top: 8px; right: 9px;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--gs-danger);
  box-shadow: 0 0 0 2px var(--gs-surface);
}
.gs-boton-icono--movil { display: none; }

.gs-boton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 42px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid transparent;
  font-weight: 600;
  font-size: 14.5px;
  white-space: nowrap;
  transition: background-color .18s var(--gs-ease), box-shadow .18s var(--gs-ease), transform .18s var(--gs-ease);
}
.gs-boton svg { width: 18px; height: 18px; }
.gs-boton:active { transform: scale(.98); }
.gs-boton--primario { background: var(--gs-brand); color: #fff; box-shadow: 0 6px 16px -8px rgba(0, 100, 176, .7); }
.gs-boton--primario:hover { background: var(--gs-brand-strong); }
.gs-boton--suave { background: var(--gs-surface); color: var(--gs-ink); border-color: var(--gs-line); }
.gs-boton--suave:hover { background: var(--gs-surface-2); }

#gs-escenario { flex: 1; min-width: 0; padding: 8px 32px 28px; }
.gs-vista { animation: gs-entrar .34s var(--gs-ease) both; }
@keyframes gs-entrar { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.gs-vacio {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 300px;
  padding: 32px 16px;
  text-align: center;
  color: var(--gs-muted);
  background: var(--gs-surface);
  border: 1px dashed #CBD6E3;
  border-radius: var(--gs-radius);
}
.gs-vacio b { color: var(--gs-ink); font-size: 16px; }

.gs-pie {
  padding: 4px 32px 26px;
  font-size: 12px;
  color: #8A98AB;
  text-align: center;
}
.gs-pie b { font-weight: 600; color: var(--gs-muted); }

/* ---------- Resultados de búsqueda y notificaciones ---------- */
.gs-flotante {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 50;
  width: 360px;
  max-width: calc(100vw - 32px);
  padding: 6px;
  border-radius: var(--gs-radius);
  background: var(--gs-surface);
  border: 1px solid var(--gs-line);
  box-shadow: var(--gs-shadow-lg);
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition: opacity .16s var(--gs-ease), transform .16s var(--gs-ease);
}
.gs-flotante.gs-abierto { opacity: 1; transform: none; pointer-events: auto; }
.gs-buscar .gs-flotante { left: 0; right: auto; width: 100%; min-width: 300px; }
.gs-flotante-titulo {
  margin: 6px 10px 6px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #8A98AB;
}
.gs-fila {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: var(--gs-radius-sm);
  background: transparent;
  text-align: left;
  font-size: 13.5px;
  line-height: 1.35;
  color: var(--gs-ink);
  transition: background-color .15s var(--gs-ease);
}
.gs-fila:hover, .gs-fila:focus-visible { background: var(--gs-surface-2); }
.gs-fila small { display: block; color: var(--gs-muted); font-size: 12.5px; margin-top: 1px; }
.gs-fila-icono {
  display: grid;
  place-items: center;
  width: 32px; height: 32px;
  border-radius: 10px;
  flex-shrink: 0;
  background: var(--gs-brand-soft);
  color: var(--gs-brand);
  font-size: 12px;
  font-weight: 600;
}
.gs-fila-icono svg { width: 17px; height: 17px; }
.gs-fila-icono--ok { background: var(--gs-ok-soft); color: var(--gs-ok); }
.gs-fila-icono--warn { background: var(--gs-warn-soft); color: var(--gs-warn); }
.gs-fila-icono--danger { background: var(--gs-danger-soft); color: var(--gs-danger); }
.gs-sin-resultados { margin: 10px; font-size: 13.5px; color: var(--gs-muted); }

/* ---------- Avisos (toast) ---------- */
.gs-avisos {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 70;
  width: min(460px, calc(100vw - 32px));
  transform: translateX(-50%);
  pointer-events: none;
}
.gs-aviso {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--gs-ink);
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  box-shadow: 0 18px 40px -16px rgba(14, 36, 64, .6);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .22s var(--gs-ease), transform .22s var(--gs-ease);
  pointer-events: auto;
  cursor: pointer;
}
.gs-aviso.gs-aviso--visible { opacity: 1; transform: none; }
.gs-aviso svg { width: 19px; height: 19px; flex-shrink: 0; color: #6FE2E1; margin-top: 1px; }
.gs-aviso p { margin: 0; }

/* ---------- Diálogo «Nueva cita» ---------- */
.gs-dialogo {
  width: min(540px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  padding: 0;
  border: 0;
  border-radius: 20px;
  background: var(--gs-surface);
  color: var(--gs-ink);
  box-shadow: var(--gs-shadow-lg);
}
.gs-dialogo::backdrop { background: rgba(14, 36, 64, .42); }
.gs-dialogo[open] { animation: gs-dialogo-entra .26s var(--gs-ease) both; }
@keyframes gs-dialogo-entra { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.gs-dialogo form { display: flex; flex-direction: column; max-height: inherit; }
.gs-dialogo-cabeza { display: flex; align-items: flex-start; gap: 12px; padding: 22px 22px 6px; }
.gs-dialogo-cabeza h2 { margin: 0; font-size: 20px; font-weight: 600; }
.gs-dialogo-cabeza p { margin: 4px 0 0; color: var(--gs-muted); font-size: 13.5px; }
.gs-dialogo-cabeza .gs-boton-icono { margin-left: auto; flex-shrink: 0; width: 38px; height: 38px; }
.gs-dialogo-cuerpo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 14px 22px 4px;
  overflow-y: auto;
}
.gs-campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gs-campo--ancho { grid-column: 1 / -1; }
.gs-campo label, .gs-campo .gs-campo-etiqueta { font-size: 12.5px; font-weight: 600; color: var(--gs-muted); }
.gs-campo select, .gs-campo input {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid var(--gs-line);
  background: var(--gs-surface-2);
  font-size: 14.5px;
  color: var(--gs-ink);
}
.gs-campo select:focus, .gs-campo input:focus { outline: none; border-color: #9CC2E8; box-shadow: 0 0 0 4px var(--gs-brand-soft); background: var(--gs-surface); }
.gs-interruptor {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--gs-accent-soft);
  font-size: 13.5px;
  line-height: 1.35;
}
.gs-interruptor b { display: block; font-weight: 600; }
.gs-interruptor small { color: var(--gs-muted); font-size: 12.5px; }
.gs-interruptor input {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex-shrink: 0;
  width: 42px; height: 24px;
  margin: 0 0 0 auto;
  border-radius: 12px;
  background: #B9C6D6;
  transition: background-color .2s var(--gs-ease);
}
.gs-interruptor input::after {
  content: "";
  position: absolute;
  top: 3px; left: 3px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(14, 36, 64, .3);
  transition: transform .2s var(--gs-ease);
}
.gs-interruptor input:checked { background: var(--gs-accent-strong); }
.gs-interruptor input:checked::after { transform: translateX(18px); }
.gs-dialogo-pie { display: flex; justify-content: flex-end; gap: 10px; padding: 18px 22px 22px; }

/* ---------- Barra inferior (celular) ---------- */
.gs-tabbar { display: none; }

/* =====================================================================
   Tableta: lateral angosto con íconos
   ===================================================================== */
@media (max-width: 1099px) {
  :root { --gs-lateral: 92px; }
  .gs-lateral { padding: 18px 10px 14px; align-items: stretch; }
  .gs-marca { padding: 0; display: grid; place-items: center; }
  .gs-marca img { width: 64px; }
  .gs-marca-sub, .gs-contexto, .gs-nav-titulo, .gs-usuario div, .gs-central div { display: none; }
  .gs-nav-item {
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-height: 60px;
    padding: 6px 4px;
    font-size: 11.5px;
    text-align: center;
  }
  .gs-nav-item[aria-current="page"]::before { left: -10px; }
  .gs-nav-insignia { position: absolute; top: 4px; right: 12px; margin: 0; min-width: 18px; height: 17px; font-size: 10.5px; }
  .gs-central, .gs-usuario { justify-content: center; padding: 10px 0; }
  .gs-buscar-campo { width: 220px; }
  .gs-barra { padding: 12px 24px; }
  #gs-escenario { padding: 8px 24px 24px; }
}

/* =====================================================================
   Celular: sin lateral, barra inferior fija
   ===================================================================== */
@media (max-width: 767px) {
  body { font-size: 15px; }
  .gs-franja { position: relative; display: block; height: auto; padding: 6px 16px; font-size: 11.5px; white-space: normal; }
  .gs-app { display: block; min-height: 0; }
  .gs-lateral { display: none; }
  .gs-principal { padding-bottom: calc(var(--gs-tabbar) + 18px + env(safe-area-inset-bottom)); }

  .gs-barra {
    position: relative;
    top: 0;
    flex-wrap: wrap;
    gap: 10px 8px;
    min-height: 0;
    padding: 12px 16px 6px;
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .gs-barra-logo { display: block; margin-right: auto; text-decoration: none; }
  .gs-barra-logo img { display: block; width: 104px; height: auto; }
  .gs-barra-acciones { gap: 8px; }
  .gs-barra-titulo { order: 3; flex-basis: 100%; padding-top: 10px; }
  .gs-barra-titulo h1 { font-size: 25px; }
  .gs-barra-titulo p { font-size: 13.5px; }
  .gs-buscar { position: static; }
  .gs-buscar-campo { display: none; }
  .gs-buscar.gs-buscar--abierto .gs-buscar-campo {
    display: flex;
    position: absolute;
    left: 16px; right: 16px; top: 8px;
    width: auto;
    z-index: 51;
    box-shadow: var(--gs-shadow-lg);
  }
  .gs-buscar.gs-buscar--abierto .gs-flotante { left: 16px; right: 16px; top: 58px; width: auto; min-width: 0; }
  .gs-boton-icono--movil { display: inline-grid; }
  .gs-boton--nueva span { display: none; }
  .gs-boton--nueva { width: 42px; padding: 0; }
  .gs-barra .gs-flotante { position: fixed; top: 64px; left: 16px; right: 16px; width: auto; max-width: none; }

  #gs-escenario { padding: 6px 16px 16px; }
  .gs-pie { padding: 0 16px 8px; }

  .gs-tabbar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 30;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96);
    -webkit-backdrop-filter: saturate(1.4) blur(12px);
    backdrop-filter: saturate(1.4) blur(12px);
    border-top: 1px solid var(--gs-line);
  }
  .gs-tab {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
    padding: 2px 0;
    color: var(--gs-muted);
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.2;
    -webkit-tap-highlight-color: transparent;
  }
  .gs-tab-icono {
    display: grid;
    place-items: center;
    width: 52px; height: 30px;
    border-radius: 15px;
    transition: background-color .2s var(--gs-ease), color .2s var(--gs-ease);
  }
  .gs-tab-icono svg { width: 22px; height: 22px; }
  .gs-tab span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .gs-tab[aria-current="page"] { color: var(--gs-brand); font-weight: 600; }
  .gs-tab[aria-current="page"] .gs-tab-icono { background: var(--gs-brand-soft); }
  .gs-tab .gs-nav-insignia {
    position: absolute;
    top: 0; left: calc(50% + 6px); right: auto;
    min-width: 17px; height: 16px;
    padding: 0 4px;
    font-size: 10px;
    margin: 0;
    box-shadow: 0 0 0 2px #fff;
  }

  .gs-avisos { bottom: calc(var(--gs-tabbar) + 14px + env(safe-area-inset-bottom)); }

  .gs-dialogo {
    width: 100vw;
    max-width: 100vw;
    max-height: 92vh;
    margin: auto 0 0;
    border-radius: 22px 22px 0 0;
  }
  .gs-dialogo-cuerpo { grid-template-columns: 1fr; }
  .gs-dialogo-pie { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  .gs-dialogo-pie .gs-boton { flex: 1; }
}

@media (max-width: 374px) {
  .gs-tab { font-size: 10px; }
  .gs-tab-icono { width: 44px; }
  .gs-barra-logo img { width: 94px; }
}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .gs-punto-vivo::after { display: none; }
}