/* SCOPED */
/* ============================================================
   HOJA DE PACIENTE — copiada de la estructura de referencia.
   Papel casi blanco, tarjetas BLANCAS con borde fino de color,
   tipografia de maquina de escribir en todo menos el titular,
   decoracion dispersa que sangra por los bordes.
   Mismo archivo para la app y para el PDF.
   ============================================================ */
.shpage{
  --ink:#1B1B1B; --txt:#4A4A46; --soft:#8A857C; --pale:#C2BCB2;
  --rule:#D9D3C8; --paper:#FBFAF7;
  position:relative;overflow:hidden;
  background:var(--paper);color:var(--txt);
  font-family:"Courier Prime","Courier New",monospace;
  font-size:11px;line-height:1.5;
  width:816px;height:1056px;
  padding:26px 26px 16px;
  display:flex;flex-direction:column;
}
.shpage *{box-sizing:border-box}

/* ---------- decoracion dispersa ---------- */
.shpage .dc{position:absolute;display:block;pointer-events:none;z-index:0}
.shpage .dc svg{display:block;width:100%;height:auto}

/* ---------- cabecera ---------- */
.shpage .shd{text-align:center;position:relative;z-index:1;padding:0 96px 6px}
.shpage .shd h1{margin:0;font-family:"Playfair Display",Georgia,serif;font-weight:700;
  font-size:47px;line-height:1.04;color:var(--ink);letter-spacing:-.012em}
.shpage .hr{display:flex;align-items:center;justify-content:center;gap:7px;margin:9px auto 0;max-width:330px}
.shpage .hr i{flex:1;height:1.4px;background:#BFB6CE;display:block}
.shpage .hh{width:15px;display:block;flex:none}
.shpage .hh svg{display:block;width:100%}
.shpage .lede{margin:9px auto 0;font-size:11.5px;line-height:1.7;color:#55524C;max-width:74ch;
  letter-spacing:.005em}

/* ---------- rejilla de pagina ---------- */
.shpage .row1{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:11px;align-items:stretch;
  margin-top:12px;position:relative;z-index:1}
.shpage .art{display:flex;align-items:center;justify-content:center;padding:2px;min-height:0}
.shpage .art img{max-width:100%;max-height:100%;display:block;object-fit:contain}

/* ---------- tarjeta ---------- */
.shpage .cd{position:relative;background:#FFF;border:1.6px solid var(--k);border-radius:15px;
  padding:11px 13px 14px;display:flex;flex-direction:column;z-index:1}
.shpage .cd.w{margin-top:11px}
.shpage .ch{display:flex;align-items:flex-start;gap:8px}
.shpage .bd{width:22px;height:22px;border-radius:50%;background:var(--k);color:#fff;flex:none;
  display:grid;place-items:center;font-size:11px;font-weight:700;line-height:1}
.shpage .cl{font-size:12px;font-weight:700;letter-spacing:.055em;text-transform:uppercase;
  color:var(--ink);line-height:1.28;padding-top:3px}
.shpage .sp{width:11px;flex:none;margin-top:4px;display:block}
.shpage .sp svg, .shpage .cnr svg{display:block;width:100%}
.shpage .cp{margin:6px 0 0;font-size:10px;line-height:1.5;color:var(--soft)}
.shpage .cnr{position:absolute;right:11px;bottom:9px;width:12px;display:block;opacity:.75}

/* campos escribibles */
.shpage .wr{border-bottom:1.3px dotted #BDB6A9;min-height:15px;outline:none;flex:1;min-width:0;
  font-size:11px;color:var(--ink);line-height:1.45;white-space:pre-wrap;word-break:break-word;
  padding:0 2px 1px}
.shpage .wr:focus{border-bottom-color:var(--k);background:#FFFDF6}

.shpage .lns{margin-top:8px;display:flex;flex-direction:column;gap:7px;flex:1;justify-content:space-between}
.shpage .ln{display:flex;align-items:flex-end;gap:7px}
.shpage .bg{width:11px;flex:none;margin-bottom:2px;display:block}
.shpage .bg svg{display:block;width:100%}
.shpage .bx{width:10px;height:10px;border:1.4px solid;border-radius:2px;flex:none;margin-bottom:3px;display:block}

.shpage .lng{margin-top:9px;display:flex;flex-direction:column;gap:11px;flex:1;justify-content:center}
.shpage .cks{margin-top:9px;display:grid;gap:8px 16px;flex:1;align-content:center}
.shpage .ck{display:flex;align-items:flex-end;gap:7px}

/* mini-cajas anidadas */
.shpage .mns{margin-top:9px;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;flex:1}
.shpage .mn{position:relative;border:1.2px solid #E0DAD0;border-radius:11px;padding:7px 9px 10px;
  display:flex;flex-direction:column;gap:5px}
.shpage .mh{display:flex;align-items:center;gap:6px;margin-bottom:1px}
.shpage .mh span{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)}
.shpage .mi{width:15px;height:15px;flex:none}
.shpage .mn .cnr{right:7px;bottom:5px;width:9px;opacity:.6}

/* rejilla semanal */
.shpage .wkg{margin-top:9px;display:grid;grid-template-columns:52px repeat(7,1fr);gap:3px;flex:1}
.shpage .wh{font-size:9px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--pale);
  text-align:center;align-self:end;padding-bottom:2px}
.shpage .wl{font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);
  display:flex;align-items:center}
.shpage .wc{border:1.2px solid #E4DED4;border-radius:5px;outline:none;font-size:9px;padding:2px 3px;
  color:var(--ink);overflow:hidden;line-height:1.25;min-height:26px}
.shpage .wc:focus{border-color:var(--k)}

/* linea de vida */
.shpage .lifel{margin-top:9px;flex:1;display:flex;flex-direction:column}
.shpage .lifel .lb{flex:1;border:1.3px dashed #CFC8BA;border-radius:9px;outline:none;padding:5px 7px;
  font-size:10.5px;color:var(--ink);white-space:pre-wrap;min-height:38px}
.shpage .lax{position:relative;display:flex;justify-content:space-between;margin:9px 2px;padding-top:3px}
.shpage .lax i{position:absolute;left:0;right:0;top:7px;height:2px;background:var(--ink);border-radius:2px}
.shpage .lax span{position:relative;z-index:1;background:#FFF;padding:0 5px;font-size:8.5px;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--soft)}
.shpage .lax span::before{content:"";position:absolute;left:50%;top:-5px;width:8px;height:8px;
  margin-left:-4px;border-radius:50%;background:var(--k)}

/* ---------- pie ---------- */
.shpage .ftr{display:flex;align-items:center;justify-content:center;gap:13px;margin-top:12px;
  position:relative;z-index:1}
.shpage .fd{width:50px;display:block;flex:none;opacity:.8}
.shpage .fd svg{display:block;width:100%}
.shpage .pill{background:#FBE9EE;border:1.3px solid #F0CBD6;border-radius:999px;padding:7px 22px;
  font-size:11.5px;color:var(--ink);letter-spacing:.01em;text-align:center}
.shpage .sig{display:flex;justify-content:space-between;margin-top:9px;font-size:8px;font-weight:700;
  letter-spacing:.17em;text-transform:uppercase;color:#CFC8BC;position:relative;z-index:1}

/* ---------- app: ancho fluido ---------- */
.fluid .shpage{width:100%;height:auto;min-height:1056px}
@media (max-width:820px){
  .fluid .shpage{padding:16px 12px;min-height:0}
  .fluid .shd{padding:0 8px}
  .fluid .shd h1{font-size:30px}
  .fluid .row1{grid-template-columns:1fr}
  .fluid .art{max-height:230px;margin:2px auto}
  .fluid .mns{grid-template-columns:repeat(2,1fr)}
  .fluid .wkg{grid-template-columns:42px repeat(7,1fr)}
  .fluid .dc{display:none}
}