.vaccine-fold-page { max-width: 760px; margin-inline: auto; }
.vaccine-fold-page { --vaccine-accent:#79709e; --vaccine-soft:#f2f0f6; --ink:#35434b; --ink-soft:#737d82; }
.vaccine-fold-page .preventive-page-header { margin:16px 0 24px; }
.vaccine-fold-page .preventive-page-header-icon { background:var(--vaccine-accent); color:white; border:0; border-radius:16px; box-shadow:0 5px 14px #7167c01a; }
.vaccine-fold-page .health-treatment-header-copy h1 { font-weight:500; }
.vaccine-fold-page .health-add-medication { background:#f0f1f2; color:var(--ink); font-weight:400; }
.vaccine-fold-page .vaccine-dose-icon { color:var(--vaccine-accent); background:#f5f4f7; }
.vaccine-fold-page .vaccine-fold-tabs { background:#e9edef; }
.vaccine-fold-page .vaccine-fold-tabs button[aria-selected="true"] { color:var(--ink); }
.vaccine-fold-page .vaccine-coverage-chips > span { color:#657077; background:#f2f4f5; }
.vaccine-fold-page .vaccine-dose-next, .vaccine-fold-page .vaccine-fold-actions button, .vaccine-fold-page .compact-upload { color:var(--ink-soft); }
.vaccine-fold-page .vaccine-dose-card .vaccine-fold-actions button:last-child { background:var(--vaccine-soft); color:#6d628e; }
.vaccine-fold-page .vaccine-share-cartilla { color:var(--ink-soft); }
.vaccine-share-cartilla { display:flex; align-items:center; gap:8px; border:0; background:none; color:var(--vaccine-accent); min-height:44px; padding:6px 0; font:inherit; font-size:14px; font-weight:400; }
.vaccine-share-cartilla svg { width:20px; height:20px; }
.vaccine-fold-page .vaccine-fold-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:16px 0 24px; }
.vaccine-fold-page .vaccine-fold-heading h1 { font-size:28px; font-weight:500; letter-spacing:-.7px; margin:0; }
.vaccine-fold-heading > div { display:flex; gap:6px; }
.vaccine-fold-heading button { background:transparent; border:0; width:44px; height:44px; color:var(--blue-deep); display:grid; place-items:center; }
.vaccine-fold-heading svg { width:22px; height:22px; }
.vaccine-fold-tabs { display:flex; padding:3px; gap:3px; background:var(--line); border-radius:12px; margin-bottom:24px; }
.vaccine-fold-tabs button { flex:1; min-height:42px; padding:9px; border:0; border-radius:9px; background:transparent; color:var(--ink-soft); font:inherit; font-weight:400; }
.vaccine-fold-tabs button[aria-selected="true"] { background:var(--paper-solid); color:var(--ink); box-shadow:0 1px 4px #2443570c; }
.vaccine-fold-page .vaccine-fold-tabs button { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:5px; padding:9px 5px; font-size:13px; }
.vaccine-tab-attention { display:inline-grid; place-items:center; width:16px; height:16px; border-radius:50%; background:#f1e6de; color:#936342; font-size:11px; }
.vaccine-fold-page [role="tabpanel"][hidden] { display:none !important; }
.vaccine-fold { background:var(--paper-solid); border-radius:14px; margin-bottom:12px; }
.vaccine-fold summary, .vaccine-fold-review > summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px; cursor:pointer; padding:20px; }
.vaccine-fold summary::-webkit-details-marker, .vaccine-fold-review > summary::-webkit-details-marker { display:none; }
.vaccine-fold-name { min-width:0; }
.vaccine-fold-name > span { display:block; font-size:18px; font-weight:500; line-height:1.4; overflow-wrap:anywhere; }
.vaccine-fold-name small { display:block; color:var(--blue-deep); font-size:14px; font-weight:400; line-height:1.5; margin-top:7px; }
.vaccine-fold-chevron { color:var(--ink-soft); flex:0 0 18px; display:grid; place-items:center; transition:transform 260ms ease; }
.vaccine-fold-chevron svg { width:18px; height:18px; }
.vaccine-fold[open] > summary .vaccine-fold-chevron, .vaccine-fold-review[open] > summary .vaccine-fold-chevron { transform:rotate(180deg); }
.vaccine-fold-content { padding:0 20px 12px; }
.vaccine-fold-dates { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin:0; padding:18px 0 14px; gap:16px; border-top:1px solid var(--line); }
.vaccine-fold-dates > div + div { border-left:1px solid var(--line); padding-left:16px; }
.vaccine-fold-dates dt { color:var(--ink-soft); font-size:12px; margin-bottom:7px; }
.vaccine-fold-dates dd { margin:0; font-size:15px; font-weight:400; font-variant-numeric:tabular-nums; }
.vaccine-fold-dates > div:last-child dd { color:var(--blue-deep); }
.vaccine-fold-coverage, .vaccine-fold-note { font-size:13px; color:var(--ink-soft); line-height:1.6; margin:6px 0 12px; }
.vaccine-fold-actions { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 16px; }
.vaccine-fold-actions button, .vaccine-muted-row button, .vaccine-fold-empty button { padding:10px 0; min-height:44px; border:0; background:transparent; color:var(--blue-deep); font:inherit; font-size:14px; font-weight:400; display:inline-flex; align-items:center; gap:6px; }
.vaccine-fold-actions svg { width:14px; height:14px; }
.vaccine-fold-review { border-top:1px solid var(--line); margin-top:22px; }
.vaccine-fold-review > summary { padding:18px 2px; font-size:15px; font-weight:400; }
.vaccine-review-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0; background:transparent; border:0; border-bottom:1px solid var(--line); color:var(--ink); width:100%; text-align:left; font:inherit; }
.vaccine-review-row small { display:block; color:var(--ink-soft); font-size:13px; margin-top:6px; }
.vaccine-review-row svg { width:16px; height:16px; color:var(--ink-soft); }
.vaccine-muted-row { padding:12px 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.vaccine-fold-history h2, .vaccine-fold-photos h2 { margin:24px 0 14px; font-size:16px; font-weight:500; }
.vaccine-fold-history .administered-vaccine-card { display:flex; align-items:center; gap:16px; border:0; border-radius:14px; padding:20px; background:var(--paper-solid); box-shadow:none; min-height:0; }
.vaccine-fold-history .swipe-record-shell { margin:0 0 10px; border-radius:14px; }
.vaccine-history-copy { flex:1; min-width:0; }
.vaccine-fold-history h3 { margin:0 0 8px; font-size:17px; font-weight:500; overflow-wrap:anywhere; }
.vaccine-fold-history time { color:var(--ink-soft); font-size:13px; font-weight:400; }
.vaccine-fold-history p { margin:10px 0 0; color:var(--ink-soft); font-size:13px; font-weight:400; line-height:1.6; }
.vaccine-fold-photos > div:first-child { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
.vaccine-fold-photos .compact-upload { color:var(--blue-deep); font-size:14px; font-weight:400; cursor:pointer; min-height:44px; display:flex; align-items:center; }
.vaccine-fold-photos .compact-upload input { display:none; }
.vaccine-followup-detail dl > div { padding:16px 0; border-bottom:1px solid var(--line); }
.vaccine-followup-detail dt { color:var(--ink-soft); font-size:13px; margin-bottom:8px; }
.vaccine-followup-detail dd { margin:0; font-size:18px; font-weight:400; }
.vaccine-followup-detail p { font-size:14px; line-height:1.6; color:var(--ink-soft); }
.vaccine-followup-detail > button { margin-top:14px; }
@media (prefers-reduced-motion:reduce) { .vaccine-fold-chevron { transition:none; } }

.vaccine-title-group { align-items:center; gap:14px !important; }
.vaccine-dose-icon { flex:0 0 48px; height:48px; display:grid; place-items:center; border-radius:14px; background:#8273c414; color:#7969b7; }
.vaccine-dose-icon svg { width:26px; height:26px; }
.vaccine-dose-card { background:var(--paper-solid); border-radius:20px; padding:22px; margin-bottom:16px; }
.vaccine-dose-heading { display:flex; gap:14px; align-items:center; }
.vaccine-dose-open { width:100%; min-height:48px; padding:0; border:0; background:none; color:var(--ink); font:inherit; text-align:left; }
.vaccine-dose-title-copy { flex:1; min-width:0; }
.vaccine-dose-title { display:block; font-size:19px; font-weight:500; overflow-wrap:anywhere; }
.vaccine-dose-product { display:block; margin-top:6px; font-size:14px; color:var(--ink-soft); }
.vaccine-dose-open .module-row-chevron { flex-shrink:0; }
.vaccine-dose-registration { display:flex; flex-direction:column; align-items:stretch; gap:8px; border-top:1px solid var(--line); padding-top:12px; }
.vaccine-dose-registration .vaccine-dose-next { border:0; padding:0; text-align:left; }
.vaccine-dose-registration .vaccine-fold-actions { margin-top:0; }
.vaccine-dose-registration .vaccine-fold-actions button { width:100%; justify-content:center; }
.vaccine-decision-button { display:block; min-height:44px; padding:10px 0 0; border:0; background:none; color:var(--ink-soft); font:inherit; font-size:12px; font-weight:400; text-align:left; }
.vaccine-decision-meta { display:block; margin-top:6px; font-size:12px; color:var(--ink-soft); line-height:1.6; }
#addDialog.unified-record-dialog { height:auto; min-height:0; inset:50% auto auto 50%; transform:translate(-50%,-50%); max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px); }
#addDialog.unified-record-dialog[open] { animation:vaccine-detail-in 220ms ease-out both; }
@keyframes vaccine-detail-in { from { opacity:0; transform:translate(-50%,calc(-50% + 10px)); } to { opacity:1; transform:translate(-50%,-50%); } }
@media(prefers-reduced-motion:reduce) { #addDialog.unified-record-dialog[open] { animation:none; } }
#addDialog.unified-record-dialog #addDialogContent { height:auto; min-height:0; max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px); overflow-y:auto; }
.vaccine-dose-heading h2 { margin:0; font-size:19px; font-weight:500; }
.vaccine-dose-heading p { margin:6px 0 0; font-size:14px; color:var(--ink-soft); }
.vaccine-coverage-chips { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.vaccine-coverage-chips > span { font-size:12px; line-height:1.5; font-weight:400; padding:5px 10px; border-radius:8px; color:var(--blue-deep); background:#4ba8c410; }
.vaccine-dose-next { border-top:1px solid var(--line); padding:16px 0 8px; font-size:14px; color:var(--blue-deep); }
.vaccine-dose-card .vaccine-fold-actions { margin-top:4px; }
.vaccine-dose-card .vaccine-fold-actions button:last-child { background:#4ba8c414; border-radius:10px; padding-inline:14px; }
.vaccine-fold-history .administered-vaccine-card { align-items:flex-start; }
.vaccine-fold-history .vaccine-coverage-chips { margin-bottom:0; }
.vaccine-fold-history .vaccine-product-name { margin-top:0; }
.home-day-card { background:var(--paper-solid); border-radius:20px; padding:0 18px; }
.home-day-entry { padding:16px 0; }
.home-day-entry + .home-day-entry { border-top:1px solid var(--line); }
.home-day-open { display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:5px 10px; width:100%; border:0; background:none; text-align:left; color:var(--ink); font:inherit; padding:0; }
.home-day-time { grid-column:3; grid-row:1/3; display:flex; align-items:center; gap:6px; font-size:22px; font-weight:400; font-variant-numeric:tabular-nums; color:var(--blue-deep); align-self:center; white-space:nowrap; }
.home-day-time > span { display:flex; }
.home-day-time svg { width:19px; height:19px; }
.home-day-icon { grid-column:1; grid-row:1/3; display:grid; place-items:center; align-self:center; width:28px; height:32px; color:var(--blue-deep); }
.home-day-icon svg { width:24px; height:24px; }
.home-day-name { grid-column:2; grid-row:1; font-size:16px; font-weight:500; margin:0; overflow-wrap:anywhere; }
.home-day-dose { grid-column:2; grid-row:2; font-size:13px; font-weight:400; color:var(--ink-soft); }
.home-day-register { min-height:44px; padding:8px 14px; margin-top:10px; border:0; border-radius:10px; background:#4ba8c414; color:var(--blue-deep); font:inherit; font-size:14px; font-weight:400; }
.is-recorded .home-day-register { background:rgba(65,129,107,.09); color:#41816b; }
.is-recorded .home-day-register::before { content:"✓"; display:inline-block; margin-right:8px; }
.home-day-register.dose-just-recorded::before { animation:home-dose-check 420ms cubic-bezier(.2,.8,.2,1) both; }
.home-day-register.dose-just-recorded + .home-day-correction { animation:home-dose-caption 320ms ease-out 100ms both; }
@keyframes home-dose-check { from { opacity:0; transform:scale(.4) rotate(-18deg); } to { opacity:1; transform:scale(1) rotate(0); } }
@keyframes home-dose-caption { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { .home-day-register.dose-just-recorded::before, .home-day-register.dose-just-recorded + .home-day-correction { animation:none; } }
.home-day-correction { display:block; color:var(--ink-soft); font-size:12px; margin-top:4px; }
.home-day-empty { margin:0; padding:24px 0; color:var(--ink-soft); font-size:15px; }
.home-care-suggestion { display:flex; align-items:center; gap:4px; padding:8px; margin-top:14px; border-radius:15px; background:var(--paper-solid); }
.home-care-suggestion button { border:0; background:none; color:var(--ink); min-height:44px; font:inherit; font-size:14px; font-weight:400; }
.home-care-suggestion > button:first-child { display:flex; align-items:center; gap:12px; text-align:left; flex:1; padding:8px; }
.home-care-suggestion i { margin-left:auto; color:var(--ink-soft); display:flex; }
.home-care-suggestion svg { width:18px; height:18px; }
.home-suggestion-mark { display:grid; place-items:center; width:26px; height:26px; flex:0 0 26px; border-radius:50%; background:#b7805614; color:#a16f49; }
.home-suggestion-close { width:44px; flex:0 0 44px; display:grid; place-items:center; color:var(--ink-soft) !important; }
.home-hidden-suggestions { margin-top:12px; font-size:13px; color:var(--ink-soft); }
.home-hidden-suggestions summary { cursor:pointer; padding:12px 0; }
.home-hidden-suggestions > div { display:flex; justify-content:space-between; gap:10px; }
.home-hidden-suggestions button { background:none; border:0; min-height:44px; font:inherit; font-weight:400; color:var(--blue-deep); text-align:left; }
.home-care-review h3 { margin:12px 0 4px; font-size:13px; font-weight:400; color:var(--ink-soft); }
.home-review-row { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); }
.home-review-row > button:first-child { flex:1; padding:10px 0; }
.home-review-row small { display:block; margin-top:4px; color:var(--ink-soft); font-size:12px; }
.home-review-row > button:last-child { flex-shrink:0; }
.home-now-panel .home-next-panel { margin-top:24px; }
.home-page .home-cover-card { min-height:clamp(180px,22svh,250px); }
@media(max-width:699px) {
  .home-page .home-cover-card.has-photo::after {
    content:"";
    position:absolute;
    display:block !important;
    z-index:1;
    inset:0 0 auto;
    height:calc(env(safe-area-inset-top,0px) + 60px);
    background:linear-gradient(to bottom,rgba(8,18,25,.38),rgba(8,18,25,.16) 55%,transparent) !important;
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
    -webkit-mask-image:linear-gradient(to bottom,#000,rgba(0,0,0,.75) 45%,transparent);
    mask-image:linear-gradient(to bottom,#000,rgba(0,0,0,.75) 45%,transparent);
    pointer-events:none;
  }
}
@media(max-width:699px) {
  .home-page .home-cover-card { min-height:calc(clamp(150px,19svh,175px) + env(safe-area-inset-top,0px)); }
  .home-page .home-cover-copy { bottom:16px; }
  .home-page .home-grid.section-block { margin-top:20px; gap:20px; }
  .home-now-panel .home-next-panel { margin-top:16px; }
  .home-now-heading { margin-bottom:12px; }
}
@media(max-width:420px) { .vaccine-dose-card { padding:18px; } .vaccine-fold-page .vaccine-fold-heading h1 { font-size:26px; } .vaccine-title-group { gap:10px !important; } .vaccine-fold-heading button { width:40px; } }