:root {
  --color-principal: #2364d2;
  --color-panel: #ffffff;
  --color-fondo-pagina: #eaf1fb;
  --color-precio: #0d7046;
}

body { background: var(--color-fondo-pagina); }

.consulta {
  background: var(--color-panel);
  border-color: color-mix(in srgb, var(--color-principal) 25%, #ffffff);
  border-top-color: var(--color-principal);
  height: calc(100svh - 28px);
  min-height: 0;
  overflow: hidden;
}

input { border-color: var(--color-principal); }
input:focus { box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-principal) 35%, transparent); }
article { background: color-mix(in srgb, var(--color-panel) 85%, var(--color-principal)); }
.precios strong { color: var(--color-precio); }
.anuncio { min-height: 0; }
.anuncio p { flex: 0 0 auto; }
.anuncio p:first-child { color: var(--color-principal); }
.anuncio img:not([hidden]) { flex: 1 1 auto; min-height: 0; max-height: 100%; }
.marca-proveedor { flex: 0 0 auto; }

@media (max-width: 360px) {
  .consulta { height: calc(100svh - 24px); }
}

/* Mayor legibilidad de etiquetas e importes. */
.precios span {
  font-size: clamp(1.08rem, 4vw, 1.28rem);
  font-weight: 600;
}

.precios strong {
  font-size: clamp(1.85rem, 7vw, 2.25rem);
}

.boton-camara { margin-top: .7rem; padding: .55rem 1rem; color: #fff; background: var(--color-principal); border: 0; border-radius: 10px; font: inherit; font-weight: 600; cursor: pointer; }
.boton-secundario { margin-left: .45rem; background: color-mix(in srgb, var(--color-principal) 78%, #354052); }
.camara { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 1rem; background: rgb(0 0 0 / 72%); }
.camara[hidden] { display: none; }
.camara-contenido { position: relative; width: min(640px, 100%); color: #fff; text-align: center; }
.camara h2 { margin: 0 2.5rem .8rem; font-size: clamp(1.15rem, 5vw, 1.5rem); }
.vista-camara { position: relative; }
.camara video { display: block; width: 100%; max-height: 70svh; border-radius: 14px; background: #111; object-fit: cover; }
.marco-lectura { position: absolute; inset: 30% 8%; border: 3px solid #fff; border-radius: 12px; box-shadow: 0 0 0 999px rgb(0 0 0 / 18%); pointer-events: none; }
.controles-camara { display: flex; justify-content: center; gap: .6rem; margin-top: .7rem; }
.controles-camara button { padding: .45rem .8rem; color: #fff; background: var(--color-principal); border: 1px solid #fff8; border-radius: 8px; font: inherit; cursor: pointer; }
.camara p { margin: .75rem 0 0; }
.cerrar-camara { position: absolute; top: -.45rem; right: 0; width: 2rem; height: 2rem; color: #fff; background: transparent; border: 0; font-size: 2rem; line-height: 1; cursor: pointer; }

/* Ajuste de jerarquía visual para verificador y publicidad. */
.consulta { padding: clamp(.65rem, 2vw, 1rem); }
.logo { width: min(430px, 76vw); max-height: 118px; margin: 0 auto .25rem; }
h1 { font-size: clamp(1.1rem, 3.1vw, 1.45rem); margin: 0 0 .5rem; }
label { font-size: clamp(.85rem, 2.7vw, 1rem); margin-bottom: .25rem; }
input { font-size: clamp(1.05rem, 4vw, 1.35rem); padding: .38rem .55rem; border-width: 2px; }
.boton-camara { margin-top: .45rem; padding: .42rem .85rem; font-size: .9rem; }
.estado { height: .7rem; margin: .15rem 0; }
article { margin-top: .45rem; padding: clamp(.8rem, 2.5vw, 1.15rem); }
.descripcion { margin-bottom: .75rem; }
.marca-proveedor { margin: .4rem auto 0; }
.anuncio { margin: .35rem auto 0; }
.anuncio p:last-child { font-size: clamp(1.3rem, 5.2vw, 1.75rem); line-height: 1.25; }
.anuncio p:first-child { font-size: clamp(1.15rem, 4.4vw, 1.45rem); }
.anuncio img:not([hidden]) { width: 100%; max-width: 600px; max-height: 48svh; margin: 0 auto .45rem; }

@media (max-height: 700px) {
  .logo { max-height: 92px; }
  .consulta { padding: .55rem .8rem; }
  .anuncio img:not([hidden]) { max-height: 38svh; }
}