:root{--bg:#f7f3ec;--card:#fff;--text:#24201c;--muted:#6f665d;--line:#e6ded4;--accent:#f3c6a8;--accent-dark:#e7ad86;--green:#cbe7d5;--shadow:0 10px 30px rgba(71,50,29,.10)}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}.app-shell{max-width:760px;margin:0 auto;padding:18px 18px 48px}.app-header{padding:22px 0 16px}.eyebrow{margin:0 0 6px;color:var(--accent-dark);text-transform:uppercase;font-size:.76rem;font-weight:800;letter-spacing:.08em}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,9vw,3.3rem);line-height:.95;margin-bottom:10px}h2{font-size:1.6rem;margin-bottom:6px}h3{font-size:1.12rem;margin-bottom:12px}.subtitle,.screen-top p,.muted-text{color:var(--muted);line-height:1.45}.screen{display:none}.screen.active{display:block}.card,.notice{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:18px;margin:14px 0;box-shadow:var(--shadow)}.selected-card{background:linear-gradient(135deg,#fff,#fff2e9)}.label,.optional{color:var(--muted);font-size:.85rem;font-weight:650}.grid-menu{display:grid;grid-template-columns:1fr;gap:12px;margin:18px 0}button{border:0;border-radius:14px;padding:14px 16px;font-size:1rem;font-weight:750;color:white;background:var(--accent);cursor:pointer;min-height:48px}button:hover{background:var(--accent-dark)}button.secondary,button.back{background:#efe6dc;color:var(--text)}button.danger{background:#a33a2a}.menu-button{text-align:left;font-size:1.08rem;min-height:58px}.menu-button.highlight{background:var(--green)}.notice{color:var(--muted);box-shadow:none}.screen-top{margin:8px 0 18px}.back{margin-bottom:14px;min-height:auto;padding:10px 13px}label{display:block;font-weight:750;margin:14px 0}input,select,textarea{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:12px;padding:13px;font:inherit;background:#fff;color:var(--text)}textarea{min-height:92px;resize:vertical}.field-grid{display:grid;grid-template-columns:1fr;gap:2px 14px}.list{display:grid;gap:10px}.list-item{border:1px solid var(--line);background:#fff;border-radius:16px;padding:13px}.list-item strong{display:block;margin-bottom:4px}.list-item p{color:var(--muted);margin-bottom:8px;line-height:1.35}.item-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.item-actions button{min-height:auto;padding:9px 11px;font-size:.9rem}.patient-banner{background:var(--green);color:white;border-radius:18px;padding:16px 18px;margin:14px 0 16px;box-shadow:var(--shadow)}.patient-banner p{margin:0 0 4px;font-size:.85rem;opacity:.9;font-weight:750;text-transform:uppercase;letter-spacing:.04em}.patient-banner strong{display:block;font-size:clamp(1.65rem,7vw,2.35rem);line-height:1.05}.patient-banner.small{position:static!important;border-radius:16px!important}.patient-banner.small strong{font-size:clamp(1.25rem,5vw,1.75rem)}.danger-zone{border:1px solid rgba(163,58,42,.35);background:#fff6f4}.compact .list-item{box-shadow:none}@media(min-width:620px){.grid-menu{grid-template-columns:1fr 1fr}.field-grid{grid-template-columns:1fr 1fr}}@media(max-width:420px){.patient-banner{position:sticky;top:0;z-index:20;border-radius:0 0 18px 18px;margin-left:-18px;margin-right:-18px}}

.history-controls {
  display: grid;
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
}

.history-controls button {
  width: 100%;
}

.history-list {
  max-height: 420px;
  overflow-y: auto;
  padding-right: 4px;
}

.history-list .list-item {
  border-left: 5px solid var(--accent);
}

@media (min-width: 620px) {
  .history-controls {
    grid-template-columns: 1fr auto;
  }

  .history-controls button {
    width: auto;
    margin-bottom: 14px;
  }
}


.more-details {
  display: none;
  margin-top: 10px;
  padding: 12px;
  border-radius: 12px;
  background: #fcfaf7;
  border: 1px solid var(--line);
}

.more-details.open {
  display: block;
}

.more-details p {
  margin-bottom: 10px;
}

.more-toggle {
  background: #efe6dc;
  color: var(--text);
  min-height: auto;
  padding: 9px 12px;
  font-size: 0.92rem;
}


.manual-block {
  display: none;
  border-left: 5px solid var(--accent);
  padding-left: 12px;
  margin: 10px 0;
}

.manual-block.open {
  display: block;
}

.more-details {
  display: none;
  margin-top: 10px;
  padding: 12px;
  border-radius: 12px;
  background: #fcfaf7;
  border: 1px solid var(--line);
}

.more-details.open {
  display: block;
}

.more-toggle {
  background: #efe6dc;
  color: var(--text);
  min-height: auto;
  padding: 9px 12px;
  font-size: 0.92rem;
}


.document-image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.document-image-box {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px;
  background: #fff;
}

.document-image-box img {
  width: 100%;
  max-height: 180px;
  object-fit: contain;
  border-radius: 8px;
  background: #fafafa;
}

.document-image-box span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  margin-bottom: 6px;
}


.file-status {
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.86rem;
}

.editing-note {
  background: #fff7ed;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 12px;
  color: var(--accent-dark);
  font-weight: 750;
}


.emergency-menu {
  background: #b3261e;
}

.emergency-menu:hover {
  background: #8f1d17;
}

.emergency-card-page {
  background: white;
  border: 2px solid #222;
  border-radius: 14px;
  padding: 22px;
  margin: 16px 0;
  color: #111;
}

.emergency-card-page h2 {
  text-align: center;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.emergency-subtitle {
  text-align: center;
  color: #555;
  margin-bottom: 18px;
  font-weight: 700;
}

.emergency-card-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 16px;
  margin-bottom: 16px;
}

.emergency-field {
  border-bottom: 1px solid #ddd;
  padding-bottom: 7px;
}

.emergency-field.full {
  grid-column: 1 / -1;
}

.emergency-field span {
  display: block;
  font-size: 0.76rem;
  color: #555;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.emergency-field strong,
.emergency-field div {
  display: block;
  font-size: 1.02rem;
  line-height: 1.35;
  white-space: pre-wrap;
}

.emergency-section-title {
  margin: 18px 0 8px;
  font-size: 1rem;
  border-bottom: 2px solid #111;
  padding-bottom: 5px;
  text-transform: uppercase;
}

.emergency-meds {
  margin: 0;
  padding-left: 20px;
}

.emergency-footer {
  margin-top: 18px;
  font-size: 0.78rem;
  color: #555;
  border-top: 1px solid #ddd;
  padding-top: 10px;
}



.summary-card-page {
  display: none;
  background: white;
  border: 2px solid var(--green);
  border-radius: 18px;
  padding: 20px;
  margin: 18px 0;
  box-shadow: var(--shadow);
}

.summary-card-page.open {
  display: block;
}

.summary-card-page h3 {
  color: var(--green);
  margin-bottom: 4px;
  font-size: 1.45rem;
}

.summary-card-meta {
  color: var(--muted);
  font-weight: 750;
  margin-bottom: 16px;
}

.summary-block {
  border-top: 1px solid var(--line);
  padding-top: 12px;
  margin-top: 12px;
}

.summary-block h4 {
  margin: 0 0 8px;
  color: var(--accent-dark);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.summary-block ul {
  margin: 0;
  padding-left: 20px;
}

.summary-block li {
  margin-bottom: 6px;
  line-height: 1.35;
}

.summary-footer-note {
  color: var(--muted);
  font-size: 0.82rem;
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 10px;
}

.summary-footer-credit {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  margin-top: 4px;
}


.med-dashboard{display:grid;gap:10px}.med-status-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;border-left:6px solid var(--line)}.med-status-card.late{border-left-color:#b3261e;background:#fff7f6}.med-status-card.due{border-left-color:#d96f32;background:#fff8ef}.med-status-card.upcoming{border-left-color:#2d6a4f;background:#f5fbf7}.med-status-card.done{border-left-color:#777;background:#f6f6f6}.med-status-card strong{display:block;margin-bottom:4px}.med-status-chip{display:inline-block;margin-top:6px;padding:4px 8px;border-radius:999px;font-size:.82rem;font-weight:800;background:#efe6dc}.med-status-card.late .med-status-chip{color:#8f1d17;background:#ffe0dc}.med-status-card.due .med-status-chip{color:#ad5424;background:#ffe9d6}.med-status-card.upcoming .med-status-chip{color:#1f513b;background:#dff4e7}.med-status-card.done .med-status-chip{color:#555;background:#e9e9e9}


.vitals-reading-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.vitals-reading {
  background: #fcfaf7;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 9px;
}

.vitals-reading span {
  display: block;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.vitals-reading strong {
  display: block;
  margin-top: 3px;
  font-size: 1.05rem;
}

.vitals-note {
  margin-top: 10px;
}


.profile-image-preview,
.incident-image-preview {
  border: 1px dashed var(--line);
  border-radius: 14px;
  padding: 10px;
  color: var(--muted);
  background: #fcfaf7;
  margin: 8px 0 12px;
  font-weight: 700;
}

.profile-image-preview img,
.incident-image-preview img {
  display: block;
  width: 100%;
  max-height: 240px;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
}

.profile-image-preview.empty,
.incident-image-preview.empty {
  min-height: 48px;
  display: flex;
  align-items: center;
}

.patient-mini-profile {
  display: flex;
  align-items: center;
  gap: 12px;
}

.patient-avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  background: #efe6dc;
  border: 2px solid var(--line);
  flex: 0 0 auto;
}

.patient-avatar.placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  font-weight: 900;
  font-size: 1.2rem;
}

.incident-thumb {
  margin-top: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 8px;
  background: #fff;
}

.incident-thumb img {
  width: 100%;
  max-height: 220px;
  object-fit: contain;
  border-radius: 8px;
}


.inventory-status-chip {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 850;
  background: #e9e9e9;
  color: #555;
}

.inventory-status-chip.low {
  background: #ffe9d6;
  color: #ad5424;
}

.inventory-status-chip.empty {
  background: #ffe0dc;
  color: #8f1d17;
}

.inventory-status-chip.ok {
  background: #dff4e7;
  color: #1f513b;
}

.inventory-card-low {
  border-left: 6px solid #d96f32;
  background: #fff8ef;
}

.inventory-card-empty {
  border-left: 6px solid #b3261e;
  background: #fff7f6;
}

.inventory-card-ok {
  border-left: 6px solid #2d6a4f;
}


.incident-preview-grid,
.incident-thumb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  width: 100%;
}

.incident-preview-grid img,
.incident-thumb-grid img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
}


.install-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-left: 6px solid var(--green);
}

.install-card h3 {
  margin-bottom: 6px;
}

.install-card p {
  margin-bottom: 0;
  line-height: 1.4;
}

.install-card button {
  flex: 0 0 auto;
}

body.standalone-mode .install-card {
  display: none;
}

.install-card-highlight {
  animation: install-card-pulse 1.1s ease-in-out 3;
}

@keyframes install-card-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(45, 125, 111, 0); }
  50% { box-shadow: 0 0 0 6px rgba(45, 125, 111, 0.25); }
}

@media (max-width: 520px) {
  .install-card {
    align-items: stretch;
    flex-direction: column;
  }

  .install-card button {
    width: 100%;
  }
}


.app-update-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: #fff7ed;
  border: 2px solid #d96f32;
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 14px;
  box-shadow: var(--shadow);
}

.app-update-banner[hidden] {
  display: none !important;
}

.app-update-banner p {
  margin: 4px 0 0;
  color: var(--muted);
}

.app-update-banner button {
  flex: 0 0 auto;
}

.app-version-label {
  text-align: center;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  margin: 10px 0 4px;
}
.site-credit {
  text-align: center;
  color: var(--muted);
  font-size: 0.78rem;
  margin: 0 0 4px;
}

@media (max-width: 520px) {
  .app-update-banner {
    align-items: stretch;
    flex-direction: column;
  }

  .app-update-banner button {
    width: 100%;
  }
}


/* Version 1.2 Kraken */
.full-width{width:100%}
button:disabled{opacity:.58;cursor:wait}
input[readonly]{background:#f3efe9;color:#554d45;font-weight:750}
.backup-menu{background:#5b5560}
.backup-menu:hover{background:#403b45}

.active-profile-banner{margin-top:0}
.active-profile-banner .daily-status-chip{margin-top:12px}
.profile-status-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fcfaf7;margin-bottom:12px}
.profile-status-row .label{margin-bottom:7px}
.new-profile-card #new-patient-panel{padding-top:12px}
.new-profile-card #new-patient-panel[hidden]{display:none!important}
.patient-list-item{display:grid;gap:12px}
.patient-list-item.active-patient-item{border:2px solid var(--green);background:#f5fbf7}
.patient-list-copy{min-width:0;flex:1}
.patient-list-copy p{margin-bottom:7px}
.patient-list-item>button{width:100%}

.daily-status-chip{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;padding:6px 10px;border-radius:999px;font-size:.82rem;font-weight:850;line-height:1.2;background:#ece8e3;color:#665f58}
.daily-status-chip::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;flex:0 0 auto}
.daily-status-chip.status-complete{background:#dff4e7;color:#1f6a45}
.daily-status-chip.status-pending{background:#ffe9d6;color:#ad5424}
.daily-status-chip.status-none{background:#ecebea;color:#706b67}
.selected-card .daily-status-chip{margin:4px 0 15px}
.patient-banner .daily-status-chip{background:rgba(255,255,255,.18);color:white;border:1px solid rgba(255,255,255,.25)}

.med-all-complete{border:1px solid #b9dfc8;background:#f0fbf4;border-left:6px solid var(--green);border-radius:14px;padding:14px}
.med-all-complete strong{display:block;color:#1f513b;margin-bottom:5px}
.med-all-complete p{margin:0;color:var(--muted);line-height:1.4}

.chart-heading-row{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.chart-heading-row h3{margin-bottom:5px}
.chart-heading-row p{margin-bottom:0}
.chart-heading-row label{margin:0;min-width:110px}
.simple-chart{margin-top:18px;border:1px solid var(--line);border-radius:16px;padding:12px;background:#fff;overflow:hidden}
.chart-title-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.chart-title-row>strong{font-size:1rem}
.chart-legend{display:flex;gap:10px;flex-wrap:wrap;font-size:.76rem;color:var(--muted);font-weight:750}
.chart-legend-item{display:inline-flex;align-items:center;gap:5px}
.chart-legend-item i{display:inline-block;width:16px;height:3px;border-radius:999px}
.vitals-chart-svg{display:block;width:100%;height:auto;min-height:190px}
.chart-grid-line{stroke:#e8e1d8;stroke-width:1}
.chart-axis-label{fill:#756d65;font-size:10px;font-weight:650}
.chart-line{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.chart-point{stroke:white;stroke-width:2}
.chart-line.line-systolic{stroke:#b3261e}.chart-point.line-systolic,.chart-legend-item i.line-systolic{fill:#b3261e;background:#b3261e}
.chart-line.line-diastolic{stroke:#d96f32}.chart-point.line-diastolic,.chart-legend-item i.line-diastolic{fill:#d96f32;background:#d96f32}
.chart-line.line-pulse{stroke:#2d6a4f}.chart-point.line-pulse,.chart-legend-item i.line-pulse{fill:#2d6a4f;background:#2d6a4f}
.chart-empty{padding:18px 4px 8px;margin:0}

.summary-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px}

@media(min-width:620px){
  .patient-list-item{grid-template-columns:1fr auto;align-items:center}
  .patient-list-item>button{width:auto}
  .summary-actions{grid-template-columns:1fr 1fr}
}

/* Kraken VI — centered Lucide tile test with transparent icon area */
.icon-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.icon-tile {
  position: relative;
  min-height: 146px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 20px;
  color: #4b256f;
  text-align: center;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.tile-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #d92d20;
  color: #fff;
  font-size: .74rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 1px 3px rgba(0,0,0,.25);
}

.tile-badge[hidden] {
  display: none;
}

.tile-badge-dot {
  min-width: 12px;
  width: 12px;
  height: 12px;
  padding: 0;
}

.tile-action {
  width: 116px;
  min-height: 122px;
  padding: 8px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 18px;
  color: inherit;
  background: transparent;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.tile-action:hover,
.tile-action:focus-visible {
  color: inherit;
  background: rgba(255,255,255,.42);
}

.tile-action:active {
  transform: scale(.97);
  background: rgba(255,255,255,.58);
}

.tile-icon {
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  border-radius: 25px;
  background: transparent;
  box-shadow: none;
}

.tile-svg {
  display: block;
  width: 78px;
  height: 78px;
}

.tile-label {
  max-width: 112px;
  color: #263238;
  font-size: .96rem;
  font-weight: 800;
  line-height: 1.08;
}

.tile-red{background:#ffd7d7}.tile-blue{background:#d9e8ff}.tile-mint{background:#d8f3e6}.tile-yellow{background:#fff0bd}.tile-purple{background:#eadcff}.tile-orange{background:#ffe1c7}.tile-aqua{background:#d5f2f3}.tile-pink{background:#f8ddec}.tile-green{background:#d8f0d2}.tile-gray{background:#e6e8ec}.chart-note{margin-top:12px;padding:10px 12px;border-radius:12px;background:#eef6ff;color:#2c4a63;font-size:.9rem}.list-item{border-left:6px solid #8b6bb1}.list-item:nth-child(3n+2){border-left-color:#e08b58}.list-item:nth-child(3n+3){border-left-color:#4f9f8a}.compatibility-message{padding:12px;border-radius:12px;background:#eef6ff;font-weight:700}.pin-lock{position:fixed;inset:0;z-index:9999;background:linear-gradient(180deg,#2f1747,#4b256f);display:grid;place-items:center;padding:24px}.pin-lock[hidden]{display:none}.pin-card{width:min(100%,360px);background:#fff;border-radius:24px;padding:28px;box-shadow:0 24px 70px rgba(0,0,0,.35);text-align:center}.pin-card input{font-size:2rem;letter-spacing:.55rem;text-align:center;margin:16px 0}.form-collapsed{display:none!important}.form-toggle{width:100%;margin-bottom:12px}.med-status-complete{background:#e1f3e6;color:#21613a}.med-status-pending{background:#fff1cf;color:#835d00}
@media(min-width:700px){.icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}



#summary-print-root {
  display: none;
}

#document-print-root {
  display: none;
}

/* Kraken VI — deterministic iPhone/iPad printing.
   Nothing is printable unless an explicit print mode is active. */
@media print {
  @page {
    margin: 0.6in;
    size: letter;
  }

  /* Headers must never appear alone at the bottom of a page with their
     content starting on the next one — if it won't fit, the whole
     header+first-item group moves to the next page together. Individual
     list items also never split mid-line across a page break. This also
     builds in a slightly larger page margin than before (0.6in, up from
     0.45in) as a safety buffer: a physical printer's own hardware margin
     doesn't always match the CSS @page margin exactly, unlike a "Save as
     PDF" export, which always honors it precisely — a printed report was
     confirmed losing its last few lines while the same report saved as a
     PDF first came out complete. This can't be fully guaranteed fixed
     from here without testing against the actual printer again, but it's
     a real, reasonable safety margin either way. */
  .summary-block h4,
  .summary-card-page h4 {
    break-after: avoid;
    break-inside: avoid;
  }
  .summary-block li,
  .summary-card-page li {
    break-inside: avoid;
  }

  /* Professional print type scale for the Resumen report specifically —
     separate from the app's own mobile screen sizing, which stays exactly
     as generous as before (correct for a phone, read one-handed, possibly
     by someone who benefits from larger text). A printed report is a
     different reading context: usually read at a desk, often by a
     doctor, and the same phone-sized text just inherited unscaled looked
     oversized and unprofessional on paper. This also meaningfully
     shrinks the total height of a 7-day report, directly reducing the
     odds of an unwanted second page.
     Deliberately does NOT touch .emergency-card-page — that one stays
     large on purpose, meant to be read at a glance under real pressure. */
  .summary-card-page h3 {
    font-size: 16px !important;
    margin-bottom: 2px !important;
    color: #1c5c46 !important;
  }
  .summary-card-page .summary-card-meta {
    font-size: 10px !important;
    margin-bottom: 10px !important;
  }
  .summary-card-page .summary-block {
    padding-top: 8px !important;
    margin-top: 8px !important;
  }
  .summary-card-page .summary-block h4 {
    font-size: 10.5px !important;
    margin-bottom: 5px !important;
  }
  .summary-card-page .summary-block ul {
    padding-left: 15px !important;
  }
  .summary-card-page .summary-block li {
    font-size: 11.5px !important;
    line-height: 1.28 !important;
    margin-bottom: 3px !important;
  }
  .summary-card-page .summary-footer-note {
    font-size: 9px !important;
    margin-top: 10px !important;
  }
  .summary-card-page .summary-footer-credit {
    font-size: 9px !important;
    margin-top: 3px !important;
  }
  body {
    background: #fff !important;
  }

  /* Safe default: browser Print must never fall back to Emergency Card. */
  body:not(.print-emergency):not(.print-summary-standalone):not(.print-document) .app-shell,
  body:not(.print-emergency):not(.print-summary-standalone):not(.print-document) #pin-lock,
  body:not(.print-emergency):not(.print-summary-standalone):not(.print-document) #summary-print-root,
  body:not(.print-emergency):not(.print-summary-standalone):not(.print-document) #document-print-root {
    display: none !important;
  }

  /* An individual document/card print is available only through its own
     "Imprimir" button. */
  body.print-document .app-shell,
  body.print-document #pin-lock,
  body.print-document #summary-print-root {
    display: none !important;
  }
  body.print-document #document-print-root {
    display: block !important;
  }
  .document-print-page {
    padding: 14px;
  }
  .document-print-page h3 {
    font-size: 16px;
    color: #1c5c46;
    margin: 0 0 2px;
  }
  .document-print-meta {
    font-size: 10px;
    color: #6b6155;
    margin: 0 0 12px;
  }
  .document-print-details {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    font-size: 11.5px;
    line-height: 1.5;
  }
  .document-print-images {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
  }
  .document-print-image {
    max-width: 45%;
  }
  .document-print-image span {
    display: block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6b6155;
    margin-bottom: 4px;
  }
  .document-print-image img {
    max-width: 100%;
    border: 1px solid #e6dcc8;
    border-radius: 6px;
  }

  /* The full-screen emergency mode has no print button of its own and was
     never meant to be printed — always excluded, unconditionally. */
  #emergency-fullscreen {
    display: none !important;
  }

  /* Emergency Card is available only through its own button. */
  body.print-emergency #summary-print-root,
  body.print-emergency #pin-lock,
  body.print-emergency .app-header,
  body.print-emergency .screen {
    display: none !important;
  }

  body.print-emergency .app-shell {
    display: block !important;
    max-width: none !important;
    padding: 0 !important;
  }

  body.print-emergency #screen-emergency {
    display: block !important;
  }

  body.print-emergency #screen-emergency .no-print {
    display: none !important;
  }

  body.print-emergency .emergency-card-page {
    display: block !important;
    border: 2px solid #111 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 18px !important;
  }

  /* Summary is a separate top-level print page; the app stays invisible. */
  body.print-summary-standalone .app-shell,
  body.print-summary-standalone #pin-lock {
    display: none !important;
  }

  body.print-summary-standalone #summary-print-root {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.print-summary-standalone #summary-print-root .summary-card-page {
    display: block !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 14px !important;
  }
}


/* v56 Pastel Forms — visual-only interior palette refresh */
:root{
  --accent:#f3c6a8;
  --accent-dark:#e7ad86;
  --green:#cbe7d5;
}
button{color:#3f3129;background:var(--accent)}
button:hover{color:#33271f;background:var(--accent-dark)}
button.secondary,button.back{background:#eee7f2;color:#3d3342}
.menu-button.highlight{background:var(--green);color:#244b37}
.patient-banner{background:var(--green);color:#244b37}
.patient-banner p{color:#315d47;opacity:1}
.selected-card{background:linear-gradient(135deg,#fff,#fff7f1)}
.med-status-card.due{border-left-color:#e7ad86;background:#fff8f2}
.med-status-card.upcoming{border-left-color:#9fcdb0;background:#f4fbf6}
.med-status-card.due .med-status-chip,.daily-status-chip.status-pending{color:#754626;background:#f9dfcd}
.med-status-card.upcoming .med-status-chip,.daily-status-chip.status-complete{color:#285c40;background:#dcefe3}
.patient-list-item.active-patient-item{border-color:#9fcdb0;background:#f4fbf6}
.med-all-complete{border-color:#b8dcc5;background:#f4fbf6;border-left-color:#9fcdb0}
.med-all-complete strong{color:#285c40}
.backup-menu{background:#ded3e6;color:#3d3342}
.backup-menu:hover{background:#cfc0da;color:#34283a}
.list-item:nth-child(3n+2){border-left-color:#efb48f}
.list-item:nth-child(3n+3){border-left-color:#8fc9b8}

/* Readable status pill on the light pastel patient banner */
.patient-banner .daily-status-chip{background:rgba(255,255,255,.72);color:#244b37;border:1px solid rgba(36,75,55,.18)}
/* ...but pending/complete still need to read as distinct colors here too —
   these need one more class of specificity to win over the rule above. */
.patient-banner .daily-status-chip.status-pending{background:#f9dfcd;color:#754626;border-color:rgba(117,70,38,.28)}
.patient-banner .daily-status-chip.status-complete{background:#dcefe3;color:#285c40;border-color:rgba(40,92,64,.28)}

button.danger{color:#fff!important;background:#b73a2b!important}button.danger:hover{background:#962f24!important}.danger-zone button.danger{color:#fff!important}

/* v60 Security & accessibility upgrade */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.cancel-edit-hidden{display:none}

.pin-entry-label{font-weight:750;font-size:.9rem;margin:10px 0 2px}

.pin-privacy-note{font-size:.78rem;margin-top:10px}

fieldset.field-group{border:1px solid var(--line);border-radius:14px;padding:4px 14px 10px;margin:16px 0}
fieldset.field-group legend{padding:0 6px;font-weight:750;color:var(--accent-dark);font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}
fieldset.field-group label{margin:10px 0}

.recovery-banner{background:#fff6f4;border:1px solid rgba(163,58,42,.35)}
.recovery-banner strong{color:#8a2a1c}
.first-run-notice{border-radius:14px;padding:14px;margin-bottom:16px}
.first-run-notice p{margin:6px 0 0;color:var(--muted);font-size:.9rem;line-height:1.4}

.modal-overlay{position:fixed;inset:0;background:rgba(36,32,28,.55);display:flex;align-items:center;justify-content:center;padding:18px;z-index:10000}
.modal-overlay[hidden]{display:none}
.modal-card{background:var(--card);border-radius:20px;padding:22px;max-width:420px;width:100%;box-shadow:var(--shadow);max-height:88vh;overflow-y:auto}
.modal-card h3{margin-bottom:6px}
.modal-card label{margin:12px 0 4px}
.modal-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.modal-actions button{flex:1;min-width:120px}

.security-strength-hint{font-size:.78rem;color:var(--muted);margin-top:4px}

#storage-usage-status,#security-status{margin-top:8px}

/* v63: status chip stacking, delete-profile danger zone spacing, per-patient color */
.status-chip-row{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.patient-status-row{display:flex;flex-direction:column;gap:4px;margin-top:2px}
.patient-status-row .daily-status-chip{font-size:.76rem;padding:5px 9px}

.patient-avatar{border-color:var(--patient-color, var(--line))}
#patient-list .patient-list-item{border-left:4px solid var(--patient-color, transparent)}
.patient-banner .patient-avatar{border-color:rgba(255,255,255,.6)}

#delete-profile-status{margin-top:6px}

/* v67: quiet pattern flags + pre-appointment nudge — informational tone,
   not alarming (deliberately blue/neutral, not red/orange) */
.info-card{background:#edf7fb;border:1px solid #cfe6f0}
.pattern-flags-list{margin:8px 0 6px;padding-left:20px}
.pattern-flags-list li{margin-bottom:6px;line-height:1.4}
#upcoming-appt-card p{margin-bottom:10px;font-weight:700}

/* v69: "who's using it" indicator + caregiver management list */
.link-button{background:none;border:none;padding:6px 0;margin:2px 0 10px;color:var(--accent-dark);font-weight:750;text-decoration:underline;font-size:.88rem;cursor:pointer;text-align:left}
.link-button[hidden]{display:none}
.caregiver-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.caregiver-row span{font-weight:700}

/* v73: first-run walkthrough — welcoming, not a "locked out" feel like pin-lock */
.first-run-overlay{position:fixed;inset:0;z-index:9500;background:linear-gradient(180deg,#fff7ee,#f3ead8);display:grid;place-items:center;padding:24px;overflow-y:auto}
.first-run-overlay[hidden]{display:none}
.first-run-card{width:min(100%,420px);background:#fff;border-radius:24px;padding:30px 26px;box-shadow:0 24px 70px rgba(71,50,29,.18);text-align:left;max-height:90vh;overflow-y:auto}
.first-run-progress{color:var(--accent-dark);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;margin-bottom:10px}
.first-run-step h2{margin-bottom:10px}
.first-run-step p{margin-bottom:14px;line-height:1.5}
.first-run-next,.first-run-step button[type="submit"]{width:100%}
.first-run-back,.first-run-skip{width:100%;text-align:center}
#first-run-finish-button{width:100%}
.first-run-install-instructions{background:#fdf6ee;border-radius:14px;padding:14px 16px;margin-bottom:16px}
.first-run-install-instructions .label{margin:10px 0 4px}
.first-run-install-instructions .label:first-child{margin-top:0}
.first-run-install-instructions ol{margin:0 0 4px;padding-left:20px}
.first-run-install-instructions li{margin-bottom:4px;line-height:1.4}
#first-run-warning-continue{width:100%}

.manual-link{display:block;text-align:center;text-decoration:none;border:0;border-radius:14px;padding:14px 16px;font-size:1rem;font-weight:750;color:#3d3342;background:#eee7f2;min-height:48px;line-height:20px;margin-top:10px}
.manual-link:hover{background:#e4dae9}
.manual-note{margin-top:6px;font-size:.82rem}

.dismiss-link{display:block;margin-top:10px;margin-bottom:0;font-weight:700}

/* Emergency full-screen mode — built for a stranger or paramedic glancing
   at the phone under stress, not for calm daily reading. Large text, one
   strong signal color (the app's existing danger-red) to say "this is the
   urgent info" at a glance, everything else stripped away. */
.emergency-mode-trigger{display:block;width:100%;margin-top:10px;background:#a33a2a;color:#fff}
.emergency-mode-trigger:hover{background:#8a2f21}

.article-viewer{padding:0;overflow:hidden}
.article-viewer #article-status{margin:18px}
.article-viewer #article-retry{margin:0 18px 18px}
#article-frame{display:block;width:100%;height:75vh;border:0}
#article-frame[hidden]{display:none}

.emergency-fullscreen{position:fixed;inset:0;z-index:9000;background:#fff;overflow-y:auto;padding:70px 20px 40px}
.emergency-fullscreen[hidden]{display:none}
.emergency-exit{position:fixed;top:14px;right:14px;z-index:9001;background:#24201c;color:#fff;border-radius:12px;padding:12px 18px;font-size:1rem;font-weight:800;min-height:44px}

.ef-name{font-size:clamp(2rem,10vw,3rem);font-weight:800;color:#24201c;margin-bottom:4px;line-height:1.05}
.ef-age{font-size:clamp(1.1rem,4vw,1.4rem);font-weight:800;color:#a33a2a;margin-bottom:20px}

.ef-critical{background:#a33a2a;color:#fff;border-radius:16px;padding:18px 20px;margin-bottom:16px}
.ef-critical .ef-label{font-size:1rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;opacity:.95}
.ef-critical .ef-value{font-size:clamp(1.5rem,7vw,2.1rem);font-weight:800;line-height:1.15}

.ef-section{border:2px solid #24201c;border-radius:16px;padding:16px 20px;margin-bottom:14px}
.ef-section .ef-label{font-size:.95rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#6f665d;margin-bottom:6px}
.ef-section .ef-value{font-size:clamp(1.2rem,5vw,1.6rem);font-weight:750;color:#24201c;line-height:1.3}

.ef-meds-list{list-style:none;margin:0;padding:0}
.ef-meds-list li{font-size:clamp(1.1rem,4.5vw,1.4rem);font-weight:700;padding:8px 0;border-bottom:1px solid #e6ded4}
.ef-meds-list li:last-child{border-bottom:none}

.ef-contact-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.ef-contact-row .ef-phone{font-size:clamp(1.3rem,5.5vw,1.7rem);font-weight:800;color:#a33a2a}

/* Global status toast (replaces plain alert() app-wide, 2026-07-22).
   Fixed at the top so it's never hidden behind an on-screen keyboard,
   color+icon coded so success/warning/error are recognizable at a glance
   even if the text itself isn't fully read — the whole point being that a
   caregiver shouldn't have to guess whether something actually saved. */
.status-toast{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:9500;display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:14px 18px;border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.22);color:#fff;font-weight:750;font-size:.95rem;line-height:1.35;cursor:pointer}
.status-toast[hidden]{display:none}
.status-toast-icon{flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:800}
.status-toast-message{flex:1 1 auto}
.status-toast-success{background:#2d7d6f}
.status-toast-warning{background:#d9833b}
.status-toast-error{background:#a33a2a}
@media (max-width:480px){.status-toast{top:10px;font-size:.9rem;padding:12px 14px}}

/* The patient banner becomes sticky at this width (see .patient-banner
   rule above); without this, scrolling a form to the top of the screen
   lands it partially underneath that banner instead of just below it. */
@media(max-width:420px){.scroll-target-form{scroll-margin-top:104px}}

/* Icon + label buttons (Añadir nuevo registro / Ver todos) — same line
   weight as the Inicio dashboard icons (stroke-width 1), so these feel
   like the same visual family, not a different icon set bolted on. */
.icon-button{display:flex;align-items:center;gap:10px;text-align:left}
.icon-button svg{flex:0 0 auto}

.dropbox-status-warning{color:#a3591a;font-weight:700}

/* Appointments calendar — confirmed via mockup with Iván before building.
   Peach highlight marks a day with an upcoming Cita; soft green outline
   marks today. Tapping a highlighted day reuses the existing "Filtrar por
   fecha" filter rather than a separate mechanism. */
.appt-calendar-card{padding:16px}
.appt-calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.appt-calendar-header span{font-weight:750;font-size:.95rem;color:var(--text)}
.icon-nav-button{background:none;border:none;color:var(--text);font-size:1.15rem;padding:4px 10px;line-height:1;cursor:pointer}
.appt-calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.appt-calendar-weekdays span{text-align:center;font-size:.7rem;font-weight:700;color:var(--muted)}
.appt-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.appt-calendar-day{text-align:center;padding:7px 0;font-size:.82rem;color:var(--text);border-radius:8px;border:1.5px solid transparent}
.appt-calendar-day.has-appt{background:var(--accent);font-weight:750;color:#663c1c;cursor:pointer}
.appt-calendar-day.is-today{border-color:var(--green)}
.appt-calendar-legend{display:flex;align-items:center;gap:6px;margin:12px 0 0;padding-top:10px;border-top:1px solid var(--line);font-size:.72rem;color:var(--muted)}
.appt-calendar-dot-sample{width:10px;height:10px;border-radius:3px;background:var(--accent);display:inline-block;flex:0 0 auto}