/* ==========================================================================
   Emergency (Batch 5)
   High-contrast action hub · map-first facility finder.
   Deliberately calm: no decorative motion on these screens.
   ========================================================================== */

/* ---------------------------------------------------------------- Hub */
.em { min-height: 100svh; background: var(--cream); }
.em-bar {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: max(env(safe-area-inset-top), 0.75rem) var(--gutter) 0.75rem;
  background: var(--cream);
}
.em-bar__x { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--black); color: var(--cream); }
.em-bar__x svg { width: 20px; height: 20px; }
.em-bar__where { display: inline-flex; align-items: center; gap: 0.4rem; height: 40px; padding: 0 0.9rem; border-radius: var(--r-pill); background: var(--white); box-shadow: inset 0 0 0 1px var(--line); font-weight: 600; font-size: var(--fs-sm); }
.em-bar__where svg { width: 15px; height: 15px; }
.em-main { display: grid; gap: 1.1rem; padding: 0.5rem var(--gutter) 2.5rem; max-width: 760px; margin-inline: auto; }
.em-title { font-size: clamp(2.9rem, 13vw, 4.6rem); font-weight: 800; letter-spacing: -0.06em; line-height: 0.88; color: var(--black); }
.em-scenario { display: grid; gap: 0.25rem; padding: 0.9rem 1rem; border-radius: 18px; background: var(--white); box-shadow: inset 0 0 0 1.5px var(--line-strong); font-size: 0.95rem; line-height: 1.4; }
.em-scenario span { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }

.eacts { display: grid; gap: 0.6rem; }
.eact {
  width: 100%; text-align: start;
  display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: 0.85rem;
  min-height: 88px; padding: 0.9rem 1rem; border-radius: 24px;
  color: var(--black);
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
  transition: transform 120ms linear;
}
.eact:active { transform: scale(0.985); }
.eact:focus-visible { outline: 3px solid var(--black); outline-offset: 3px; }
.eact__n { font-size: 1.05rem; font-weight: 800; width: 1.4rem; text-align: center; opacity: 0.55; }
.eact__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--black); color: var(--cream); }
.eact__ic svg { width: 26px; height: 26px; }
.eact__txt { display: grid; gap: 0.15rem; line-height: 1.2; min-width: 0; }
.eact__txt b { font-size: 1.22rem; font-weight: 800; letter-spacing: -0.03em; }
.eact__txt small { font-size: 0.85rem; color: rgba(0, 0, 0, 0.7); }
.eact__go svg { width: 22px; height: 22px; }
.eact--mint { background: var(--mint); }
.eact--cream { background: var(--white); }
.eact--peach { background: var(--peach); }
.eact--alert { background: var(--alert); color: var(--white); box-shadow: 0 14px 30px -14px rgba(168, 67, 42, 0.9); }
.eact--alert .eact__ic { background: var(--white); color: var(--alert); }
.eact--alert .eact__txt small { color: rgba(255, 255, 255, 0.85); }
.eact--alert .eact__n { opacity: 0.8; }

.em-crit { display: grid; gap: 0.6rem; padding: 1rem; border-radius: 22px; background: var(--black); color: var(--cream); }
.em-crit h2 { display: flex; align-items: center; gap: 0.45rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--peach); }
.em-crit h2 svg { width: 16px; height: 16px; }
.em-crit dl { display: grid; gap: 0.5rem; margin: 0; }
.em-crit dl div { display: grid; gap: 0.1rem; }
.em-crit dt { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.65; }
.em-crit dd { margin: 0; font-size: 1.2rem; font-weight: 700; letter-spacing: -0.02em; }
.em-crit .is-alert dd { color: #FFB59C; }
.em-crit .seg__flag { color: #FFB59C; }
.em-crit__v { font-size: 0.78rem; opacity: 0.7; }

/* Sheets */
.callsheet, .inssheet { display: grid; gap: 0.7rem; }
.callsheet__num { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.2rem; border-radius: 24px; background: var(--alert); color: var(--white); }
.callsheet__num span { font-size: 0.8rem; font-weight: 600; max-width: 18ch; line-height: 1.3; }
.callsheet__num b { font-size: 5rem; line-height: 0.82; letter-spacing: -0.07em; }
.callsheet__demo { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.9rem 1rem; border-radius: 18px; background: var(--white); box-shadow: inset 0 0 0 2px var(--black); line-height: 1.4; }
.callsheet__demo svg { width: 20px; height: 20px; flex: none; margin-top: 1px; }
.callsheet__tips { display: grid; gap: 0.35rem; padding: 0.9rem 1rem; border-radius: 18px; background: var(--white); font-size: 0.92rem; }
.ebig { display: flex; align-items: center; gap: 0.85rem; width: 100%; min-height: 72px; padding: 0.8rem 1rem; border-radius: 20px; text-align: start; }
.ebig > svg:first-child { width: 24px; height: 24px; flex: none; }
.ebig > svg:last-child { width: 18px; height: 18px; flex: none; opacity: 0.6; }
.ebig span { flex: 1; display: grid; line-height: 1.25; }
.ebig b { font-size: 1.05rem; letter-spacing: -0.02em; }
.ebig small { font-size: 0.82rem; opacity: 0.75; }
.ebig--black { background: var(--black); color: var(--cream); }
.ebig--peach { background: var(--peach); }
.ebig--cream { background: var(--white); }
.inssheet__card { display: flex; align-items: center; gap: 0.8rem; padding: 1rem; border-radius: 20px; background: var(--white); }
.inssheet__card div { flex: 1; display: grid; line-height: 1.3; }
.inssheet__card small { color: var(--muted); }
.inssheet__logo { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--mint); }
.inssheet__logo svg { width: 22px; height: 22px; }
.inssheet__ok { padding: 0.3rem 0.65rem; border-radius: var(--r-pill); background: var(--mint-soft); font-weight: 700; font-size: var(--fs-xs); }
.inssheet__net { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.9rem 1rem; border-radius: 18px; background: var(--gray-soft); font-size: 0.88rem; line-height: 1.45; }
.inssheet__net svg { width: 18px; height: 18px; flex: none; margin-top: 2px; }

/* Persistent help button */
.fab-sos span { letter-spacing: 0; }

/* ---------------------------------------------------------------- Map screen */
.mp { position: fixed; inset: 0; overflow: hidden; background: var(--cream-2); }
.mp-map { position: absolute; inset: 0; z-index: 0; background: #EFE9E2; }
.mp-map .leaflet-tile-pane { filter: grayscale(0.85) sepia(0.28) contrast(0.92) brightness(1.06); }
.mp-map .leaflet-control-attribution { font-size: 10px; background: rgba(251, 243, 235, 0.85); }
.mp-map .leaflet-bar a { width: 40px; height: 40px; line-height: 40px; background: var(--white); color: var(--black); }
.mp-maperr { position: absolute; inset: 40% 1rem auto; display: flex; gap: 0.5rem; justify-content: center; font-weight: 600; }
.mp-maperr svg { width: 18px; height: 18px; }

.mp-top {
  position: absolute; z-index: 500; top: max(env(safe-area-inset-top), 0.75rem); left: 0.75rem; right: 0.75rem;
  display: flex; gap: 0.5rem; align-items: center;
}
.mp-iconbtn { display: grid; place-items: center; width: 50px; height: 50px; flex: none; border-radius: 16px; background: var(--white); box-shadow: var(--shadow-md); }
.mp-iconbtn svg { width: 20px; height: 20px; }
.mp-search { flex: 1; min-width: 0; display: flex; align-items: center; gap: 0.6rem; height: 50px; padding: 0 1rem; border-radius: 16px; background: var(--white); box-shadow: var(--shadow-md); }
.mp-search:focus-within { box-shadow: var(--shadow-md), inset 0 0 0 2px var(--black); }
.mp-search svg { width: 18px; height: 18px; opacity: 0.6; flex: none; }
.mp-search input { flex: 1; min-width: 0; border: 0; background: none; font-size: 1rem; outline: none; height: 100%; }
.mp-chips {
  position: absolute; z-index: 500; top: calc(max(env(safe-area-inset-top), 0.75rem) + 58px); left: 0; right: 0;
  display: flex; gap: 0.4rem; overflow-x: auto; padding: 0 0.75rem 0.5rem; scrollbar-width: none;
}
.mp-chips::-webkit-scrollbar { display: none; }
.mp-chips .chipf { background: var(--white); box-shadow: var(--shadow-sm); }
.mp-chips .chipf[aria-pressed="true"] { background: var(--black); color: var(--cream); }
.mp-area { position: absolute; z-index: 500; top: calc(max(env(safe-area-inset-top), 0.75rem) + 112px); left: 50%; translate: -50% 0; display: inline-flex; align-items: center; gap: 0.4rem; height: 42px; padding: 0 1rem; border-radius: var(--r-pill); background: var(--black); color: var(--cream); font-weight: 600; font-size: var(--fs-sm); box-shadow: var(--shadow-md); }
.mp-area[hidden] { display: none; }
.mp-area svg { width: 15px; height: 15px; }
.mp-fabs { position: absolute; z-index: 400; right: 0.75rem; bottom: calc(50svh + 0.75rem); display: grid; gap: 0.5rem; transition: bottom 300ms var(--ease-out); }
.mp:has(.mp-panel[data-snap="peek"]) .mp-fabs { bottom: 160px; }
.mp:has(.mp-panel[data-snap="full"]) .mp-fabs { opacity: 0; pointer-events: none; }

/* Bottom sheet (mobile) */
.mp-panel {
  position: absolute; z-index: 600; left: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column;
  height: calc(100svh - 70px);
  border-radius: 28px 28px 0 0;
  background: var(--cream);
  box-shadow: 0 -16px 40px -12px rgba(60, 35, 20, 0.35);
  transition: transform 320ms var(--ease-out);
}
.mp-panel[data-snap="peek"] { transform: translateY(calc(100% - 150px)); }
.mp-panel[data-snap="half"] { transform: translateY(calc(100% - 50svh)); }
.mp-panel[data-snap="full"] { transform: translateY(0); }
.mp-grab { display: grid; place-items: center; height: 26px; flex: none; cursor: grab; touch-action: none; }
.mp-grab span { width: 46px; height: 5px; border-radius: 4px; background: var(--line-strong); }
.mp-panel__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.75rem; padding: 0 1rem 0.75rem; flex: none; }
.mp-h { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.04em; line-height: 1.1; }
.mp-src { display: flex; align-items: center; gap: 0.3rem; font-size: 0.78rem; color: var(--muted); margin-top: 0.2rem; }
.mp-src svg { width: 13px; height: 13px; flex: none; }
.mp-call { display: inline-flex; align-items: center; gap: 0.4rem; height: 48px; padding: 0 1rem; border-radius: 16px; background: var(--alert); color: var(--white); font-weight: 800; font-size: 1.1rem; flex: none; }
.mp-call svg { width: 18px; height: 18px; }
.mp-panel__body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 0 0.75rem calc(1rem + env(safe-area-inset-bottom)); }

.flist { display: grid; gap: 0.45rem; }
.fcard {
  width: 100%; text-align: start;
  display: grid; grid-template-columns: 44px 1fr auto; gap: 0.75rem; align-items: center;
  padding: 0.75rem; border-radius: 18px; background: var(--white);
  box-shadow: var(--shadow-sm);
}
.fcard:hover { box-shadow: var(--shadow-md); }
.fcard:focus-visible { outline: 2px solid var(--black); outline-offset: 2px; }
.fcard__mk { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; color: var(--black); }
.fcard__mk svg { width: 20px; height: 20px; }
.fcard__mk--er { background: var(--alert); color: var(--white); }
.fcard__mk--hospital { background: var(--black); color: var(--cream); }
.fcard__mk--clinic { background: var(--mint); }
.fcard__mk--doctor { background: var(--peach); }
.fcard__body { display: grid; gap: 0.15rem; min-width: 0; }
.fcard__name { font-size: 1rem; letter-spacing: -0.02em; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.fcard__meta { font-size: 0.78rem; color: var(--muted); }
.fcard__row { display: flex; gap: 0.3rem; flex-wrap: wrap; margin-top: 0.15rem; }
.fcard__dist { display: grid; justify-items: end; line-height: 1.2; text-align: end; }
.fcard__dist b { font-size: 1rem; letter-spacing: -0.02em; }
.fcard__dist small { font-size: 0.72rem; color: var(--muted); white-space: nowrap; }
.fstat { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 8px; font-size: 0.7rem; font-weight: 700; background: var(--gray-soft); color: var(--ink-2); }
.fstat svg { width: 12px; height: 12px; }
.fstat--open { background: var(--mint); color: #1F3D1B; }
.fstat--closed { background: #F6E1D7; color: var(--alert); }
.fstat--er { background: var(--alert); color: var(--white); }
.fstat--net { background: var(--white); box-shadow: inset 0 0 0 1px var(--line-strong); }

.fdet { display: grid; gap: 0.85rem; padding-top: 0.25rem; }
.fdet__back { justify-self: start; display: inline-flex; align-items: center; gap: 0.35rem; height: 36px; padding: 0 0.8rem; border-radius: var(--r-pill); background: var(--white); font-weight: 600; font-size: var(--fs-sm); }
.fdet__back svg { width: 15px; height: 15px; }
.fdet__head { display: flex; gap: 0.75rem; align-items: center; }
.fdet__mk { width: 54px; height: 54px; border-radius: 16px; flex: none; }
.fdet__mk svg { width: 24px; height: 24px; }
.fdet__name { font-size: 1.45rem; font-weight: 800; letter-spacing: -0.04em; line-height: 1.1; }
.fdet__type { font-size: 0.85rem; color: var(--muted); margin-top: 0.15rem; }
.fdet__badges { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.fdet__times { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; }
.fdet__times div { display: grid; padding: 0.65rem 0.75rem; border-radius: 16px; background: var(--white); }
.fdet__times small { font-size: 0.66rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.fdet__times b { font-size: 1.2rem; letter-spacing: -0.03em; }
.fdet__nav .label { color: var(--muted); display: block; margin-bottom: 0.4rem; }
.fdet__navbtns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; }
.navbtn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.3rem; min-height: 64px; padding: 0.5rem; border-radius: 16px; font-weight: 700; font-size: 0.85rem; text-align: center; line-height: 1.15; }
.navbtn svg { width: 20px; height: 20px; }
.navbtn--g { background: var(--black); color: var(--cream); }
.navbtn--a { background: var(--white); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.navbtn--w { background: var(--mint); }
.fdet__info { display: grid; gap: 0; margin: 0; padding: 0.25rem 0.9rem; border-radius: 18px; background: var(--white); }
.fdet__info div { display: grid; grid-template-columns: 120px 1fr; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid var(--line); }
.fdet__info div:last-child { border-bottom: 0; }
.fdet__info dt { display: flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; font-weight: 600; color: var(--muted); }
.fdet__info dt svg { width: 15px; height: 15px; }
.fdet__info dd { margin: 0; font-weight: 600; font-size: 0.92rem; overflow-wrap: anywhere; display: grid; gap: 0.2rem; }
.fdet__info dd a { text-decoration: underline; text-underline-offset: 3px; }
.fdet__info dd small { font-weight: 500; color: var(--muted); font-size: 0.78rem; }
.fdet__call { justify-self: start; display: inline-flex; align-items: center; gap: 0.3rem; height: 32px; padding: 0 0.7rem; border-radius: var(--r-pill); background: var(--black); color: var(--cream); font-size: 0.78rem; }
.fdet__call svg { width: 13px; height: 13px; }
.fdet__note { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.78rem; color: var(--muted); line-height: 1.4; }
.fdet__note svg { width: 14px; height: 14px; flex: none; margin-top: 2px; }
.muted { color: var(--muted); font-weight: 500; }
.mp-attr { margin-top: 0.75rem; text-align: center; font-size: 0.72rem; color: var(--muted); }
.mp-attr a { text-decoration: underline; }
.mp-empty { display: grid; justify-items: start; gap: 0.4rem; padding: 1.2rem; border-radius: 20px; background: var(--white); }
.mp-empty svg { width: 24px; height: 24px; }
.mp-empty p { color: var(--ink-2); font-size: 0.9rem; }
.mp-empty--err svg { color: var(--alert); }
.mp-empty__btns { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.3rem; }
.mp-loading { display: flex; justify-content: center; gap: 6px; padding: 2rem; }
.mp-loading span { width: 9px; height: 9px; border-radius: 50%; background: var(--line-strong); }

/* Markers */
.mk { background: none; border: 0; }
.mk__pin {
  display: grid; place-items: center; width: 38px; height: 38px;
  border-radius: 50% 50% 50% 6px; rotate: -45deg;
  border: 3px solid var(--white);
  box-shadow: 0 6px 14px -4px rgba(60, 35, 20, 0.5);
  transition: scale 160ms linear;
}
.mk__pin svg { width: 17px; height: 17px; rotate: 45deg; }
.mk__pin--er { background: var(--alert); color: var(--white); }
.mk__pin--hospital { background: var(--black); color: var(--cream); }
.mk__pin--clinic { background: var(--mint); color: var(--black); }
.mk__pin--doctor { background: var(--peach); color: var(--black); }
.mk__pin.is-sel { scale: 1.25; border-color: var(--black); }
.mk__pin--hospital.is-sel { border-color: var(--mint); }
.mk__me { display: block; width: 22px; height: 22px; border-radius: 50%; background: #2A6FDB00; position: relative; }
.mk__me i { position: absolute; inset: 3px; border-radius: 50%; background: var(--black); box-shadow: 0 0 0 4px var(--white), 0 0 0 10px rgba(0, 0, 0, 0.12); }
.mk__melabel { position: absolute; left: 50%; top: 28px; translate: -50% 0; white-space: nowrap; padding: 0.15rem 0.5rem; border-radius: 8px; background: var(--black); color: var(--cream); font: 600 11px/1.3 var(--font-sans); }

/* ---------------------------------------------------------------- Desktop */
@media (min-width: 960px) {
  .em-main { padding-top: 1.5rem; }
  .eacts { grid-template-columns: 1fr 1fr; }
  .eacts li:last-child { grid-column: 1 / -1; }
  .eact { min-height: 104px; }
  .em-crit dl { grid-template-columns: 2fr 2fr 1fr; }

  .mp-top { left: 470px; right: auto; width: min(560px, calc(100vw - 500px)); top: 1rem; }
  .mp-chips { left: 470px; right: 1rem; top: calc(1rem + 58px); padding: 0; }
  .mp-area { left: calc(470px + (100vw - 470px) / 2); top: calc(1rem + 112px); }
  .mp-fabs { bottom: 120px !important; opacity: 1 !important; pointer-events: auto !important; }
  .mp-panel {
    left: 1rem; right: auto; top: 1rem; bottom: 1rem; width: 440px; height: auto;
    border-radius: 28px; transform: none !important;
    box-shadow: var(--shadow-lg);
  }
  .mp-grab { display: none; }
  .mp-panel__head { padding: 1.2rem 1.1rem 0.9rem; }
  .mp-h { font-size: 1.6rem; }
  .mp-panel__body { padding: 0 1rem 1rem; }
}