:root {
  --rpwa2-blue: #073763;
  --rpwa2-blue-light: #d9efff;
  --rpwa2-ink: #102a43;
  --rpwa2-white: #fff;
  --rpwa2-border: #d7e2ea;
  --rpwa2-focus: #1e88c7;
  --respira-pwa-navigation-offset: 0px;
  --rpwa2-app-navigation-offset: 0px;
}

.rpwa2-app-navigation[hidden],
.rpwa2-contact-layer[hidden],
.rpwa2-install-cta[hidden],
.rpwa2-app-navigation [hidden],
.rpwa2-contact-layer [hidden],
.rpwa2-announcement-banner--global[hidden],
.rpwa2-install-cta [hidden],
.rpwa2-toast[hidden] {
  display: none !important;
}

.rpwa2-app-navigation,
.rpwa2-contact-layer,
.rpwa2-install-cta,
.rpwa2-share-card,
.rpwa2-status,
.rpwa2-offline-page {
  box-sizing: border-box;
  color: var(--rpwa2-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.rpwa2-app-navigation *,
.rpwa2-contact-layer *,
.rpwa2-install-cta *,
.rpwa2-share-card *,
.rpwa2-status *,
.rpwa2-offline-page * {
  box-sizing: border-box;
}

body.rpwa2-has-app-navigation {
  --respira-pwa-navigation-offset: calc(72px + env(safe-area-inset-bottom, 0px));
  padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  scroll-padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px));
}

body.rpwa2-has-app-navigation.rpwa2-shell-compact {
  --respira-pwa-navigation-offset: 0px;
  padding-bottom: 0 !important;
  scroll-padding-bottom: 0;
}

body.rpwa2-has-app-navigation.rpwa2-shell-compact [data-respira-app-nav] {
  bottom: 0 !important;
}

body.rpwa2-has-app-navigation.rpwa2-shell-full [data-respira-app-nav] {
  bottom: var(--respira-pwa-navigation-offset) !important;
}

body.rpwa2-navigation-suppressed {
  --respira-pwa-navigation-offset: 0px;
  padding-bottom: 0 !important;
  scroll-padding-bottom: 0;
}

body.rpwa2-navigation-open,
body.rpwa2-contact-open {
  overflow: hidden;
}

.rpwa2-app-navigation {
  --rpwa2-nav-surface: #fff;
  --rpwa2-nav-text: #102a43;
  position: fixed;
  inset: 0;
  z-index: 99988;
  width: 0;
  height: 0;
}

.rpwa2-app-navigation.is-open {
  z-index: 100000;
}

.rpwa2-bottom-bar {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: grid;
  min-height: calc(64px + env(safe-area-inset-bottom, 0px));
  padding: 5px max(8px, env(safe-area-inset-right, 0px)) calc(5px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
  grid-template-columns: repeat(var(--rpwa2-bar-items, 5), minmax(0, 1fr));
  align-items: stretch;
  border-top: 1px solid var(--rpwa2-border);
  background: color-mix(in srgb, var(--rpwa2-nav-surface) 96%, transparent);
  box-shadow: 0 -4px 18px rgba(4, 32, 55, .1);
  color: var(--rpwa2-nav-text);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.rpwa2-navigation--compact .rpwa2-bottom-bar {
  display: none;
}

[data-respira-pwa-menu] {
  position: relative;
}

[data-respira-pwa-menu][hidden] {
  display: none !important;
}

[data-respira-pwa-menu] svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #3fa6d8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.15;
}

[data-respira-pwa-menu] svg path:first-child { stroke: #8bd2f2; }
[data-respira-pwa-menu] svg path:last-child { stroke: #0d679d; }

.rpwa2-bar-button {
  display: flex;
  min-width: 0;
  min-height: 54px;
  padding: 5px 3px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
  position: relative;
}

.rpwa2-menu-badge {
  position: absolute;
  top: 2px;
  left: calc(50% + 8px);
  display: grid;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  place-items: center;
  border: 2px solid var(--rpwa2-nav-surface, #fff);
  border-radius: 10px;
  background: #b42318;
  color: #fff;
  font-size: 9px;
  font-style: normal;
  font-weight: 800;
}

.rpwa2-bar-button:hover,
.rpwa2-bar-button:focus-visible {
  background: var(--rpwa2-blue-light);
  color: var(--rpwa2-blue);
}

.rpwa2-bar-button svg {
  width: 23px;
  height: 23px;
}

.rpwa2-bar-button span {
  max-width: 100%;
  overflow: hidden;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rpwa2-bar-button svg,
.rpwa2-sheet-button svg {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.rpwa2-app-navigation__backdrop {
  position: fixed;
  inset: 0;
  z-index: 3;
  background: rgba(3, 26, 45, .45);
}

.rpwa2-app-sheet {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 4;
  display: flex;
  width: min(100%, 720px);
  top: 0;
  max-height: none;
  margin: 0 auto;
  flex-direction: column;
  border: 1px solid var(--rpwa2-border);
  border-bottom: 0;
  border-radius: 0;
  background: var(--rpwa2-nav-surface);
  color: var(--rpwa2-nav-text);
  box-shadow: 0 -10px 38px rgba(4, 32, 55, .22);
  transform: translateY(104%);
}

.rpwa2-app-navigation.is-open .rpwa2-app-sheet {
  animation: rpwa2-sheet-in 170ms ease-out forwards;
}

@keyframes rpwa2-sheet-in {
  to { transform: translateY(0); }
}

.rpwa2-app-sheet__header {
  display: flex;
  min-height: 64px;
  padding: 15px 16px 13px 20px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--rpwa2-border);
}

.rpwa2-app-sheet__header div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.rpwa2-app-sheet__header span {
  color: #4a7392;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}

.rpwa2-app-sheet__header strong {
  overflow: hidden;
  color: var(--rpwa2-blue);
  font-size: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rpwa2-app-sheet__status {
  display: grid;
  padding: 10px 14px;
  grid-template-columns: minmax(0, 1.25fr) minmax(90px, .7fr) auto;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--rpwa2-border);
  background: color-mix(in srgb, var(--rpwa2-blue-light) 48%, var(--rpwa2-nav-surface));
}

.rpwa2-app-sheet__status > div { display: flex; min-width: 0; flex-direction: column; gap: 1px; }
.rpwa2-app-sheet__status span { color: #5b7485; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.rpwa2-app-sheet__status strong { overflow: hidden; color: var(--rpwa2-blue); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.rpwa2-app-sheet__status strong.is-offline,
.rpwa2-app-sheet__status small.is-offline { color: #a33b31; }
.rpwa2-app-sheet__status small { margin-top: 2px; color: #9a5700; font-size: 10px; font-weight: 700; }
.rpwa2-app-sheet__status small[hidden] { display: none; }
.rpwa2-cache-label { display: flex; align-items: center; gap: 7px; }
.rpwa2-cache-label small[data-rpwa2-menu-online] { display: inline-flex; align-items: center; gap: 4px; color: #2b7a3d; font-size: 10px; font-weight: 700; text-transform: none; }
.rpwa2-cache-label small[data-rpwa2-menu-online]::before { width: 7px; height: 7px; border-radius: 50%; background: #35a853; content: ''; }
.rpwa2-cache-label small[data-rpwa2-menu-online].is-offline { color: #a33b31; }
.rpwa2-cache-label small[data-rpwa2-menu-online].is-offline::before { background: #d64545; }

.rpwa2-menu-update {
  min-height: 38px;
  padding: 7px 11px;
  border: 1px solid #78a9c5;
  border-radius: 9px;
  background: #fff;
  color: var(--rpwa2-blue);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}

.rpwa2-menu-update.has-update { border-color: var(--rpwa2-blue); background: var(--rpwa2-blue); color: #fff; }
.rpwa2-menu-update:disabled { cursor: not-allowed; opacity: .55; }

.rpwa2-announcements {
  display: grid;
  max-height: 260px;
  padding: 10px 14px;
  gap: 9px;
  overflow-y: auto;
  border-bottom: 1px solid var(--rpwa2-border);
  background: #f8fbfd;
}

.rpwa2-announcement-card {
  display: grid;
  padding: 10px;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  border: 1px solid #bcd3df;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(4, 32, 55, .06);
}

.rpwa2-announcement-card.has-image { grid-template-columns: auto minmax(0, 1fr); }

.rpwa2-announcement-card.is-important { border-left: 5px solid #c56500; background: #fffaf2; }
.rpwa2-announcement-card > img { width: 72px; height: 72px; object-fit: cover; border-radius: 9px; }
.rpwa2-announcement-card > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.rpwa2-announcement-card strong { color: var(--rpwa2-blue); font-size: 14px; }
.rpwa2-announcement-card p { margin: 0; color: #385366; font-size: 12px; line-height: 1.4; white-space: pre-line; }
.rpwa2-announcement-card > div > div { display: flex; margin-top: 4px; align-items: center; gap: 8px; }
.rpwa2-announcement-card a,
.rpwa2-announcement-card button { padding: 5px 9px; border: 1px solid #8fb6ca; border-radius: 7px; background: #fff; color: var(--rpwa2-blue); font: inherit; font-size: 11px; font-weight: 700; text-decoration: none; cursor: pointer; }
.rpwa2-announcement-card a { background: var(--rpwa2-blue); color: #fff; }

.rpwa2-announcement-banner {
  position: fixed;
  right: max(12px, env(safe-area-inset-right, 0px));
  bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  left: max(12px, env(safe-area-inset-left, 0px));
  z-index: 5;
  width: min(560px, calc(100% - 24px));
  margin: 0 auto;
}

.rpwa2-announcement-banner .rpwa2-announcement-card { box-shadow: 0 8px 30px rgba(4, 32, 55, .23); }
.rpwa2-announcement-card.is-compact > img { width: 62px; height: 62px; }

.rpwa2-announcement-banner--global {
  z-index: 99987;
  bottom: max(18px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body.rpwa2-has-app-navigation .rpwa2-announcement-banner--global {
  bottom: calc(76px + env(safe-area-inset-bottom, 0px));
}

body.rpwa2-has-app-navigation.rpwa2-shell-full [data-respira-app-back] {
  display: none !important;
}

body.rpwa2-has-app-navigation.rpwa2-shell-compact .rpwa2-announcement-banner--global,
body.rpwa2-has-app-navigation.rpwa2-shell-compact .rpwa2-toast,
body.rpwa2-has-app-navigation.rpwa2-shell-compact .rpwa2-install-cta {
  bottom: calc(var(--rpwa2-app-navigation-offset, 0px) + 12px + env(safe-area-inset-bottom, 0px));
}

.rpwa2-icon-button {
  display: inline-grid;
  width: 44px;
  height: 44px;
  padding: 0;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--rpwa2-border);
  border-radius: 12px;
  background: transparent;
  color: inherit;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.rpwa2-app-sheet__nav {
  display: grid;
  min-height: 0;
  max-height: min(100%, calc(var(--rpwa2-menu-rows, 6) * 81px + 28px));
  padding: 14px;
  grid-template-columns: repeat(var(--rpwa2-menu-columns, 3), minmax(0, 1fr));
  grid-auto-rows: minmax(72px, auto);
  align-content: start;
  gap: 9px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.rpwa2-sheet-section-label {
  grid-column: 1 / -1;
  margin: 3px 2px -1px;
  color: #4a7392;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.rpwa2-sheet-button {
  display: grid;
  width: 100%;
  min-height: 72px;
  padding: 9px 12px;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border: 1px solid var(--rpwa2-border);
  border-radius: 12px;
  background: rgba(255, 255, 255, .7);
  color: var(--rpwa2-nav-text);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
}

.rpwa2-sheet-button:hover,
.rpwa2-sheet-button:focus-visible {
  border-color: #8dbbd4;
  background: var(--rpwa2-blue-light);
  color: var(--rpwa2-blue);
}

.rpwa2-sheet-button svg {
  width: 23px;
  height: 23px;
}

.rpwa2-sheet-button__arrow {
  color: #7292a7;
  font-size: 23px;
  text-align: right;
}

.rpwa2-sheet-button__arrow { display: none; }

.rpwa2-sheet-utility-row {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  border-top: 1px solid var(--rpwa2-border);
  padding-top: 10px;
}

.rpwa2-sheet-utility-row .rpwa2-sheet-button { min-height: 58px; }

.rpwa2-app-sheet__footer {
  padding: 11px 18px calc(11px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--rpwa2-border);
  color: #607d92;
  font-size: 12px;
}

.rpwa2-panel-status {
  grid-column: 1 / -1;
}

.rpwa2-panel-status dl,
.rpwa2-status dl,
.rpwa2-offline-card dl {
  margin: 0;
}

.rpwa2-panel-status dl > div,
.rpwa2-status dl > div,
.rpwa2-offline-card dl > div {
  display: flex;
  padding: 9px 0;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--rpwa2-border);
}

.rpwa2-panel-status dt,
.rpwa2-status dt,
.rpwa2-offline-card dt {
  color: #5c7689;
}

.rpwa2-panel-status dd,
.rpwa2-status dd,
.rpwa2-offline-card dd {
  margin: 0;
  font-weight: 700;
  text-align: right;
}

.rpwa2-contact-layer {
  position: fixed;
  inset: 0;
  z-index: 99996;
  color: var(--rpwa2-ink);
}

.rpwa2-contact-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 26, 45, .58);
}

.rpwa2-contact-dialog {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  width: min(100%, 720px);
  max-height: min(94vh, 900px);
  max-height: min(94dvh, 900px);
  margin: 0 auto;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--rpwa2-border);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: #fff;
  box-shadow: 0 -12px 44px rgba(4, 32, 55, .28);
  transform: translateY(104%);
}

.rpwa2-contact-layer.is-open .rpwa2-contact-dialog {
  animation: rpwa2-contact-in 180ms ease-out forwards;
}

@keyframes rpwa2-contact-in {
  to { transform: translateY(0); }
}

.rpwa2-contact-dialog__header {
  display: flex;
  min-height: 74px;
  padding: 14px 16px 12px 20px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--rpwa2-border);
  background: #fff;
}

.rpwa2-contact-dialog__header > div { display: flex; flex-direction: column; gap: 1px; }
.rpwa2-contact-dialog__header span { color: #4a7392; font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.rpwa2-contact-dialog__header h2 { margin: 0; color: var(--rpwa2-blue); font-size: 22px; }

.rpwa2-contact-form {
  display: flex;
  min-height: 0;
  padding: 17px 18px calc(18px + env(safe-area-inset-bottom, 0px));
  flex-direction: column;
  gap: 14px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.rpwa2-contact-intro,
.rpwa2-contact-warning { margin: 0; font-size: 14px; line-height: 1.45; }
.rpwa2-contact-intro { color: #385366; }
.rpwa2-contact-warning { padding: 10px 12px; border-left: 4px solid #b42318; border-radius: 7px; background: #fff2f0; color: #7a271a; }

.rpwa2-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.rpwa2-contact-grid label,
.rpwa2-contact-message {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 5px;
  color: #29485d;
  font-size: 13px;
  font-weight: 700;
}

.rpwa2-contact-grid label > span small { color: #607d92; font-weight: 500; }
.rpwa2-contact-grid label > small,
.rpwa2-contact-message > small { color: #607d92; font-size: 11px; font-weight: 500; }
.rpwa2-contact-message > small { align-self: flex-end; }

.rpwa2-contact-grid input,
.rpwa2-contact-message textarea {
  width: 100%;
  min-height: 44px;
  padding: 9px 11px;
  border: 1px solid #aebfca;
  border-radius: 9px;
  background: #fff;
  color: #102a43;
  font: inherit;
  font-weight: 400;
}

.rpwa2-contact-message textarea { min-height: 132px; resize: vertical; line-height: 1.45; }
.rpwa2-contact-grid input:focus,
.rpwa2-contact-message textarea:focus { border-color: var(--rpwa2-focus); outline: 2px solid color-mix(in srgb, var(--rpwa2-focus) 28%, transparent); }

.rpwa2-contact-privacy {
  padding: 12px;
  border: 1px solid #b9d1de;
  border-radius: 11px;
  background: #f4faff;
}

.rpwa2-contact-privacy h3 { margin: 0 0 8px; color: var(--rpwa2-blue); font-size: 14px; }
.rpwa2-contact-privacy dl { margin: 0; }
.rpwa2-contact-privacy dl > div { display: grid; padding: 5px 0; grid-template-columns: minmax(90px, .35fr) minmax(0, 1fr); gap: 10px; }
.rpwa2-contact-privacy dt { color: #46677d; font-size: 12px; font-weight: 700; }
.rpwa2-contact-privacy dd { margin: 0; color: #29485d; font-size: 12px; line-height: 1.4; }
.rpwa2-contact-privacy details { margin-top: 7px; padding-top: 7px; border-top: 1px solid #cbdde7; }
.rpwa2-contact-privacy summary { color: var(--rpwa2-blue); font-size: 12px; font-weight: 750; cursor: pointer; }
.rpwa2-contact-privacy details dl { margin-top: 7px; }

.rpwa2-contact-check {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  color: #29485d;
  font-size: 12px;
  line-height: 1.45;
  cursor: pointer;
}

.rpwa2-contact-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--rpwa2-blue); }
.rpwa2-contact-check a { color: var(--rpwa2-blue); font-weight: 750; }
.rpwa2-contact-check strong { color: #7a271a; }

.rpwa2-contact-honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.rpwa2-contact-status { min-height: 20px; font-size: 13px; font-weight: 700; }
.rpwa2-contact-status.is-pending { color: #765300; }
.rpwa2-contact-status.is-success { padding: 9px 11px; border-radius: 8px; background: #eaf7ed; color: #216e36; }
.rpwa2-contact-status.is-error { padding: 9px 11px; border-radius: 8px; background: #fff2f0; color: #9b261c; }

.rpwa2-contact-actions {
  display: flex;
  padding-top: 2px;
  justify-content: flex-end;
  gap: 9px;
}

.rpwa2-contact-actions button:disabled { cursor: wait; opacity: .65; }

.rpwa2-toast {
  position: fixed;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: max(20px, env(safe-area-inset-bottom, 0px));
  z-index: 99999;
  max-width: min(360px, calc(100vw - 32px));
  padding: 11px 15px;
  border-radius: 9px;
  background: #102a43;
  color: #fff;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .18);
  font-size: 14px;
}

body.rpwa2-has-app-navigation .rpwa2-toast {
  bottom: calc(78px + env(safe-area-inset-bottom, 0px));
}

.rpwa2-install-cta {
  position: fixed;
  left: 50%;
  bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 10px));
  z-index: 99980;
  display: grid;
  width: min(620px, calc(100vw - 32px));
  padding: 13px;
  grid-template-columns: 1fr auto 44px;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%);
  border: 1px solid #b7d6e7;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(4, 32, 55, .18);
}

body.rpwa2-has-app-navigation .rpwa2-install-cta {
  bottom: calc(78px + env(safe-area-inset-bottom, 0px));
}

.rpwa2-install-cta__copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rpwa2-install-cta__copy strong { color: var(--rpwa2-blue); }
.rpwa2-install-cta__copy span { color: #526f83; font-size: 13px; }

.rpwa2-primary-button,
.rpwa2-secondary-button {
  min-height: 44px;
  padding: 9px 16px;
  border-radius: 9px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.rpwa2-primary-button { border: 1px solid var(--rpwa2-blue); background: var(--rpwa2-blue); color: #fff; }
.rpwa2-secondary-button { border: 1px solid #8dbbd4; background: var(--rpwa2-blue-light); color: var(--rpwa2-blue); }
.rpwa2-install-inline-guide { grid-column: 1 / -1; padding: 12px; border-top: 1px solid var(--rpwa2-border); }
.rpwa2-install-guide h3 { margin: 0 0 9px; font-size: 17px; }
.rpwa2-install-guide ol { margin: 0; padding-left: 22px; }
.rpwa2-install-guide li + li { margin-top: 5px; }
.rpwa2-install-note { margin: 12px 0 0; color: #5c7689; font-size: 12px; }

.rpwa2-share-card,
.rpwa2-status {
  width: 100%;
  max-width: 760px;
  margin: 20px auto;
  padding: clamp(20px, 4vw, 34px);
  border: 1px solid var(--rpwa2-border);
  border-radius: 15px;
  background: #fff;
}

.rpwa2-share-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 28px; }
.rpwa2-share-card h2,
.rpwa2-status h2 { margin-top: 0; color: var(--rpwa2-blue); }
.rpwa2-share-card img { width: min(220px, 32vw); height: auto; }
.rpwa2-share-card a { display: block; margin-top: 14px; overflow-wrap: anywhere; }
.rpwa2-eyebrow { margin: 0 0 5px; color: #4a7392; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.rpwa2-qr { display: inline-block; max-width: 320px; }
.rpwa2-qr img { display: block; width: 100%; height: auto; }
.rpwa2-notice { padding: 12px 15px; border-left: 4px solid #c58a00; background: #fff9e8; }

.rpwa2-offline-page {
  display: grid;
  min-height: 100dvh;
  margin: 0;
  padding: max(24px, env(safe-area-inset-top, 0px)) 18px max(24px, env(safe-area-inset-bottom, 0px));
  place-items: center;
  background: #edf6fb;
}

.rpwa2-offline-card {
  width: min(520px, 100%);
  padding: clamp(24px, 7vw, 44px);
  border: 1px solid #bed8e7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 36px rgba(4, 32, 55, .12);
  text-align: center;
}

.rpwa2-offline-card h1 { margin: 10px 0 14px; color: var(--rpwa2-blue); font-size: clamp(26px, 6vw, 38px); }
.rpwa2-offline-card dl { margin: 22px 0; text-align: left; }
.rpwa2-offline-card > a { display: inline-block; margin: 16px 0 0 14px; }
.rpwa2-offline-state { min-height: 20px; color: #8a4b08; }

.rpwa2-external-launcher-hidden,
.rpwa2-external-launcher-hidden--cookie,
.rpwa2-external-launcher-hidden--ai {
  display: none !important;
}

@media (display-mode: standalone) {
  body.rpwa2-hide-shell-enabled #masthead,
  body.rpwa2-hide-shell-enabled #colophon,
  body.rpwa2-hide-shell-enabled header.site-header,
  body.rpwa2-hide-shell-enabled footer.site-footer { display: none !important; }
}

@media (min-width: 760px) {
  .rpwa2-bottom-bar {
    right: max(18px, env(safe-area-inset-right, 0px));
    bottom: 14px;
    left: max(18px, env(safe-area-inset-left, 0px));
    width: min(680px, calc(100vw - 36px));
    min-height: 64px;
    margin: 0 auto;
    padding: 5px;
    border: 1px solid var(--rpwa2-border);
    border-radius: 18px;
  }
  body.rpwa2-has-app-navigation { --respira-pwa-navigation-offset: 88px; padding-bottom: 88px !important; }
  body.rpwa2-has-app-navigation.rpwa2-shell-compact {
    --respira-pwa-navigation-offset: 0px;
    padding-bottom: 0 !important;
  }
}

@media (max-width: 600px) {
  .rpwa2-app-sheet__status { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 6px; padding: 8px 10px; }
  .rpwa2-app-sheet__status span { font-size: 9px; }
  .rpwa2-app-sheet__status strong { font-size: 11px; }
  .rpwa2-menu-update { padding: 7px 8px; font-size: 11px; }
  .rpwa2-app-sheet__nav { grid-template-columns: repeat(var(--rpwa2-menu-columns, 3), minmax(0, 1fr)); gap: 6px; padding: 10px; }
  .rpwa2-sheet-button { min-height: 64px; padding: 7px 4px; grid-template-columns: 22px minmax(0, 1fr); gap: 5px; font-size: 12px; }
  .rpwa2-install-cta { grid-template-columns: 1fr auto; }
  .rpwa2-install-cta > .rpwa2-icon-button { position: absolute; top: 6px; right: 6px; width: 36px; height: 36px; }
  .rpwa2-install-cta__copy { padding-right: 28px; }
  .rpwa2-share-card { grid-template-columns: 1fr; }
  .rpwa2-share-card img { width: min(220px, 70vw); }
  .rpwa2-contact-grid { grid-template-columns: 1fr; }
  .rpwa2-contact-privacy dl > div { grid-template-columns: 1fr; gap: 2px; }
  .rpwa2-contact-actions { display: grid; grid-template-columns: 1fr 1.35fr; }
}

@supports not (background: color-mix(in srgb, white 90%, transparent)) {
  .rpwa2-bottom-bar { background: var(--rpwa2-nav-surface); }
}

@media (prefers-reduced-motion: reduce) {
  .rpwa2-app-navigation.is-open .rpwa2-app-sheet { animation: none; transform: translateY(0); }
  .rpwa2-contact-layer.is-open .rpwa2-contact-dialog { animation: none; transform: translateY(0); }
}

.rpwa2-app-navigation button:focus-visible,
.rpwa2-contact-layer button:focus-visible,
.rpwa2-contact-layer input:focus-visible,
.rpwa2-contact-layer textarea:focus-visible,
.rpwa2-contact-layer a:focus-visible,
.rpwa2-contact-layer summary:focus-visible,
.rpwa2-install-cta button:focus-visible,
.rpwa2-share-card button:focus-visible,
.rpwa2-status button:focus-visible,
.rpwa2-offline-page button:focus-visible,
.rpwa2-offline-page a:focus-visible {
  outline: 3px solid var(--rpwa2-focus);
  outline-offset: 2px;
}