/* La rueda incrustable (18/09/2026): una sola pieza para el blog, para /embed/rueda.html y para
   cualquier WordPress ajeno. Colores y nombres de las areas: los de la aplicacion (js/areas.js,
   idioma-*.js). Todo lo tocable mide 44 px de alto: el control de la rueda de la aplicacion media
   9x16 px en el telefono (arnes, 18/09/2026) y aqui no se repite. */
.hp-emb{--hp-emb-azul:#004fa0;--hp-emb-azul2:#0a6fd6;--hp-emb-tinta:#0f172a;--hp-emb-apagado:#52677f;
  --hp-emb-linea:#dbe5ef;--hp-emb-fondo:#fff;--hp-emb-suave:#f3f7fc;--hp-emb-radio:14px;
  font:16px/1.45 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--hp-emb-tinta);
  background:var(--hp-emb-fondo);border:1px solid var(--hp-emb-linea);border-radius:var(--hp-emb-radio);
  padding:18px 18px 16px;box-sizing:border-box;margin:0;-webkit-text-size-adjust:100%}
.hp-emb *{box-sizing:border-box}
.hp-emb-cab{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.hp-emb-cab h2{font-size:1.15rem;line-height:1.25;margin:0;font-weight:800;letter-spacing:-.01em}
.hp-emb-cab p{margin:2px 0 0;color:var(--hp-emb-apagado);font-size:.92rem}
.hp-emb-logo{width:36px;height:36px;border-radius:10px;background:var(--hp-emb-azul);color:#fff;
  display:grid;place-items:center;font-weight:900;font-size:18px;flex:0 0 auto}
.hp-emb-cuerpo{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:620px){.hp-emb-cuerpo{grid-template-columns:minmax(220px,29%) minmax(0,1fr);align-items:center;gap:26px}}
.hp-emb-rueda{display:grid;place-items:center}
.hp-emb-rueda svg{width:100%;max-width:340px;height:auto;display:block;touch-action:none}
.hp-emb-ico-rueda{pointer-events:none}
.hp-emb-cuna{cursor:pointer;transition:opacity .12s}
.hp-emb-cuna:hover{opacity:.85}
.hp-emb-pista{margin:8px 0 0;text-align:center;color:var(--hp-emb-apagado);font-size:.82rem}
.hp-emb-areas{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.hp-emb-area{display:grid;grid-template-columns:minmax(0,1fr) 34px;grid-template-areas:"nombre valor" "control control";
  gap:4px 8px;align-items:center;padding:6px 0 4px;border-bottom:1px solid var(--hp-emb-linea)}
.hp-emb-area:last-child{border-bottom:0}
@media (min-width:620px){
  .hp-emb-areas{gap:4px}
  .hp-emb-area{grid-template-columns:minmax(150px,27%) minmax(0,1fr) 30px;grid-template-areas:"nombre control valor";gap:0 12px;padding:3px 0;border-bottom:0}
  .hp-emb-nombre{font-size:.92rem}
  .hp-emb-seg{gap:3px}
  .hp-emb-seg button{min-height:40px;font-size:.85rem}
}
.hp-emb-nombre{grid-area:nombre;display:flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;min-width:0}
.hp-emb-ico{width:26px;height:26px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;color:#fff;font-size:13px}
.hp-emb-glifo{font-family:FontAwesome;font-style:normal;line-height:1}
.hp-emb-valor{grid-area:valor;text-align:right;font-weight:800;font-variant-numeric:tabular-nums;color:var(--hp-emb-azul)}
.hp-emb-valor.vacio{color:var(--hp-emb-apagado);font-weight:500}
.hp-emb-seg{grid-area:control;display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:2px;
  touch-action:pan-y;user-select:none;-webkit-user-select:none}
.hp-emb-seg button{appearance:none;border:1px solid var(--hp-emb-linea);background:var(--hp-emb-suave);
  color:var(--hp-emb-apagado);min-height:44px;padding:0;font:inherit;font-size:.85rem;font-weight:600;
  border-radius:6px;cursor:pointer;line-height:1}
.hp-emb-seg button.on{background:var(--hp-emb-color,var(--hp-emb-azul));border-color:var(--hp-emb-color,var(--hp-emb-azul));color:#fff}
.hp-emb-seg button.actual{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--hp-emb-color,var(--hp-emb-azul))}
.hp-emb-seg button:focus-visible{outline:3px solid var(--hp-emb-azul2);outline-offset:2px}
.hp-emb-pie{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:16px}
.hp-emb-guardar{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;
  border-radius:999px;background:var(--hp-emb-azul);color:#fff;font-weight:700;text-decoration:none;font-size:1rem;
  border:0;cursor:pointer;transition:background .18s,transform .18s}
.hp-emb-guardar:hover{background:var(--hp-emb-azul2);transform:translateY(-1px)}
.hp-emb-guardar[aria-disabled="true"]{background:#9db4cf;cursor:not-allowed;transform:none}
.hp-emb-guardar:focus-visible{outline:3px solid var(--hp-emb-azul2);outline-offset:3px}
.hp-emb-nota{margin:0;color:var(--hp-emb-apagado);font-size:.9rem}
.hp-emb-nota a{color:var(--hp-emb-azul)}
.hp-emb-aviso{margin:10px 0 0;color:#b42318;font-size:.92rem;min-height:1.3em}
.hp-emb-aviso.lista{color:#1f6f3f;font-weight:600}
@media (prefers-reduced-motion:reduce){.hp-emb-guardar{transition:none}}
/* La pagina /embed/ va a pantalla completa del iframe: sin margen y sin borde propio. */
body.hp-emb-pagina{margin:0;background:transparent}
body.hp-emb-pagina .hp-emb{border-radius:0;border:0}