/* pk-sos.css — 緊急應變資訊卡（map.html 扳手 › 登山工具 › 緊急應變；全頁 #sos-page）
   殼（固定定位、頂列、.bp-card、.bp-btn）沿用 map.html 的 .bp-*（與氣壓監測、Garmin 手錶同一個殼），這裡只放本頁自己的東西。
   🔴 本檔**不寫 body 前綴**——放大鏡（pk-magnifier）把介面複製進 shadow root，只改寫 map.html 內嵌樣式裡的 body 選擇器，
      外部表原樣抄 ⇒ 這裡若寫 body.map-dim，鏡內一條都不生效。吃 body 的 class 一律寫裸 .map-dim。
   🔴 顏色不寫 inline、文字一律角色 token（--pk-ink／--pk-ink-2，暗化時會翻）；表面（底、框）自己寫 .map-dim 的深色對應。
   🔴 這一頁是慌張的時候打開的：字比站內一般卡片大一號（步驟 15.5px、號碼 28px）、命中區 ≥ 44px、一屏先看到求救鈕與座標。 */

#sos-page .bp-body { padding-top: 2px; }
#sos-page .bp-card { padding: 14px 14px 12px; }
#sos-page .sos-h { margin: 0 0 8px; font-size: var(--fs-13, 13px); font-weight: 800; letter-spacing: .04em; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-h .sub { font-weight: 500; letter-spacing: 0; margin-left: 6px; }

/* ── 求救鈕：119 一顆主色、112 一顆描邊、110 一列 ─────────────────────────── */
#sos-page .sos-calls { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#sos-page .sos-call {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center;
  min-height: 72px; padding: 10px 14px; border-radius: 14px; text-align: left; cursor: pointer;
  border: 1.5px solid rgba(174,189,212,.65); background: #fff; color: var(--pk-ink, #1E2330);
  font: inherit; -webkit-tap-highlight-color: transparent;
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease);
}
#sos-page .sos-call:active { transform: scale(.98); }
#sos-page .sos-call .num { font-size: 28px; font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; }
#sos-page .sos-call .what { margin-top: 3px; font-size: var(--fs-13-5, 13.5px); font-weight: 700; line-height: 1.3; }
#sos-page .sos-call .note { margin-top: 4px; font-size: var(--fs-13, 13px); font-weight: 600; line-height: 17.5px; color: var(--pk-ink-2, #4A5168); }
/* 白字壓琥珀一律用 --pk-amber-btn（4.63:1）；--pk-amber 只有 3.09（feedback_contrast_not_opacity） */
#sos-page .sos-call.primary { background: var(--pk-amber-btn, #A16743); border-color: transparent; color: #fff; }
#sos-page .sos-call.primary .note { color: #fff; }
#sos-page .sos-call.wide { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; min-height: 52px; padding: 8px 14px; }
#sos-page .sos-call.wide .num { font-size: 22px; }
#sos-page .sos-call.wide .what { margin-top: 0; }
#sos-page .sos-call.wide .note { margin: 0 0 0 auto; text-align: right; }

/* ── 位置：座標、精度、幾分鐘前 ─────────────────────────────────────────── */
#sos-page .sos-pos { margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(174,189,212,.38); }
#sos-page .sos-pos-main { font-size: 17.5px; font-weight: 800; line-height: 1.35; color: var(--pk-ink, #1E2330); font-variant-numeric: tabular-nums; word-break: break-all; }
#sos-page .sos-pos-sub { margin-top: 3px; font-size: var(--fs-15, 15px); line-height: 19.575px; color: var(--pk-ink-2, #4A5168); font-variant-numeric: tabular-nums; }
#sos-page .sos-pos-age { margin-top: 4px; font-size: var(--fs-13, 13px); font-weight: 700; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-pos.stale .sos-pos-age { color: var(--pk-ink-ember, #A56B45); }
#sos-page .sos-pos.none .sos-pos-main { font-size: var(--fs-15-5, 15.5px); font-weight: 700; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
#sos-page .sos-actions .bp-btn {
  flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 44px; font-size: var(--fs-14, 14px); white-space: normal;
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease);
}
#sos-page .bp-btn:active, #sos-page .sos-chip:active, #sos-page .sos-sit-h:active .ic { transform: scale(.98); }
#sos-page .sos-actions .bp-btn svg { width: 16px; height: 16px; flex: none; }
#sos-page .sos-pagerow { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: var(--fs-13-5, 13.5px); line-height: 1.5; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-pagerow b { color: var(--pk-ink, #1E2330); font-weight: 800; }
#sos-page .sos-pagerow .bp-btn { flex: none; min-height: 40px; }

/* ── 情境清單：一列一題，點開才看到步驟 ───────────────────────────────── */
#sos-page .sos-sit { border-top: 1px solid rgba(174,189,212,.38); }
#sos-page .sos-sit:first-of-type { border-top: 0; }
#sos-page .sos-sit-h {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 58px; padding: 10px 2px;
  border: 0; background: transparent; color: var(--pk-ink, #1E2330); font: inherit; text-align: left; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#sos-page .sos-sit-h .ic {
  flex: none; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px;
  background: rgba(174,189,212,.2); color: var(--pk-ink, #1E2330);
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease);
}
#sos-page .sos-sit-h .ic svg { width: 21px; height: 21px; }
#sos-page .sos-sit-h .tx { flex: 1; min-width: 0; }
#sos-page .sos-sit-h .n { display: block; font-size: var(--fs-17, 17px); font-weight: 800; line-height: 1.25; }
#sos-page .sos-sit-h .lead { display: block; margin-top: 2px; font-size: var(--fs-13-5, 13.5px); font-weight: 500; line-height: 18.2px; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-sit-h .chev { flex: none; width: 18px; height: 18px; color: var(--pk-ink-2, #4A5168); transition: transform var(--pk-motion-mid, 200ms) var(--pk-ease-standard, ease); }
#sos-page .sos-sit.on .sos-sit-h .chev { transform: rotate(180deg); }
/* 用 class 開關、不用 hidden 屬性：這一頁的祖先有 author 的 display 規則，hidden 會被蓋掉（feedback_hidden_attr_display_trap） */
#sos-page .sos-sit-b { display: none; padding: 0 2px 14px; }
#sos-page .sos-sit.on .sos-sit-b { display: block; }

#sos-page .sos-q { margin: 2px 0 10px; }
#sos-page .sos-q-t { margin-bottom: 7px; font-size: var(--fs-14, 14px); font-weight: 700; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-chips { display: flex; flex-wrap: wrap; gap: 8px; }
#sos-page .sos-chip {
  min-height: 42px; padding: 8px 14px; border-radius: 999px; cursor: pointer;
  border: 1.5px solid rgba(174,189,212,.75); background: #fff; color: var(--pk-ink, #1E2330);
  font: inherit; font-size: var(--fs-14, 14px); font-weight: 700; line-height: 1.3; text-align: left;
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease);
}
#sos-page .sos-chip.on { background: var(--pk-night, #1E2330); border-color: var(--pk-night, #1E2330); color: #fff; }

/* 「立刻求救」區塊：琥珀框＝警示語彙（與圖資與權限 .ou-warn 同一套，不用紅） */
#sos-page .sos-urgent { margin: 4px 0 10px; padding: 10px 12px; border-radius: 12px; border: 1.5px solid rgba(165,107,69,.55); background: rgba(196,132,90,.09); }
#sos-page .sos-urgent .t { display: flex; align-items: center; gap: 6px; margin: 0 0 4px; font-size: var(--fs-15, 15px); font-weight: 800; color: var(--pk-ink-ember, #A56B45); }
#sos-page .sos-urgent .t svg { width: 17px; height: 17px; flex: none; }
#sos-page .sos-urgent ul { margin: 0; padding-left: 20px; }
#sos-page .sos-urgent li, #sos-page .sos-urgent p { margin: 0 0 4px; font-size: var(--fs-15, 15px); line-height: 1.6; color: var(--pk-ink, #1E2330); }
#sos-page .sos-urgent .sos-call-inline {
  display: inline-flex; align-items: center; gap: 4px; vertical-align: -3px; margin: 0 2px; padding: 3px 10px; min-height: 30px;
  border: 0; border-radius: 8px; background: var(--pk-amber-btn, #A16743); color: #fff; font: inherit; font-size: var(--fs-14, 14px); font-weight: 800; cursor: pointer;
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease);
}
#sos-page .sos-urgent .sos-call-inline:active { transform: scale(.97); }

#sos-page .sos-blk-t { margin: 8px 0 4px; font-size: var(--fs-13-5, 13.5px); font-weight: 800; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-steps { margin: 4px 0 0; padding-left: 22px; }
#sos-page .sos-steps li { margin-bottom: 6px; font-size: var(--fs-15-5, 15.5px); line-height: 1.6; color: var(--pk-ink, #1E2330); }
#sos-page .sos-steps li::marker { font-weight: 800; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-dont ul { margin: 0; padding-left: 20px; }
#sos-page .sos-dont li { margin-bottom: 3px; font-size: var(--fs-14-5, 14.5px); line-height: 1.55; color: var(--pk-ink, #1E2330); }
#sos-page .sos-src { margin-top: 10px; font-size: var(--fs-12, 12px); line-height: 1.55; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-src a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
#sos-page .sos-note { font-size: var(--fs-13-5, 13.5px); line-height: 1.6; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-note b { color: var(--pk-ink, #1E2330); }
#sos-page .sos-note p { margin: 0 0 6px; }
#sos-page .sos-note p:last-child { margin-bottom: 0; }

/* ── 「我該怎麼說」那段、諮詢專線列 ─────────────────────────────────── */
#sos-page .sos-order { margin-top: 10px; }
#sos-page .sos-order .sos-src { margin-top: 4px; }
#sos-page .sos-rows { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(174,189,212,.38); }
#sos-page .sos-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: var(--fs-14-5, 14.5px); line-height: 20.25px; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-row .tx { flex: 1; min-width: 0; }
#sos-page .sos-row b { color: var(--pk-ink, #1E2330); font-weight: 800; }
#sos-page .sos-row-btn { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-variant-numeric: tabular-nums; transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease); }
#sos-page .sos-row-btn svg { width: 15px; height: 15px; flex: none; }

/* ── 傳簡訊的選擇視窗（第九輪，創辦人 10-05：「一律跳出視窗……依照地區遠近排列……標示推薦，預先選好，用戶按下確認」）──
   底部單＋半透明遮罩；清單自己捲、遮罩不跟著捲。推薦章與確認鈕用夜色實底（暗化時反白）。
   10-05 審查 V3：卡片高度固定（height 不是 max-height）——開著時清單底下多出「重新排列」那一塊，只會讓清單從下面變短，
   列的位置不動（max-height 的話卡片沒頂到上限時會往上長，整片清單跟著移）。22 個消防局本來就超過一屏，固定高度不會留白。 */
#sos-page .sos-pick { position: fixed; inset: 0; z-index: 30; display: flex; align-items: flex-end; justify-content: center; background: rgba(14,17,25,.5); }
#sos-page .sos-pick-card { box-sizing: border-box; width: 100%; max-width: 520px; height: 88%; max-height: 88%; display: flex; flex-direction: column; padding: 16px 16px calc(14px + env(safe-area-inset-bottom, 0px)); border-radius: 18px 18px 0 0; background: #fff; box-shadow: 0 -10px 30px rgba(0,0,0,.2); }
#sos-page .sos-pick-h { margin: 0 0 4px; font-size: var(--fs-17, 17px); font-weight: 800; color: var(--pk-ink, #1E2330); outline: none; }
#sos-page .sos-pick-sub { margin: 0 0 10px; font-size: var(--fs-13, 13px); line-height: 1.5; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-pick-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; margin: 0 -4px; padding: 2px 4px; }
#sos-page .sos-pick-opt { box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 52px; margin: 0 0 6px; padding: 8px 12px; border: 1px solid rgba(174,189,212,.6); border-radius: 12px; background: #fff; color: var(--pk-ink, #1E2330); text-align: left; font-family: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
#sos-page .sos-pick-opt .rd { flex: none; box-sizing: border-box; width: 20px; height: 20px; border-radius: 50%; border: 2px solid rgba(74,81,104,.55); }
#sos-page .sos-pick-opt .tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
#sos-page .sos-pick-opt b { font-size: var(--fs-15, 15px); font-weight: 800; }
#sos-page .sos-pick-opt .meta { font-size: var(--fs-13, 13px); color: var(--pk-ink-2, #4A5168); font-variant-numeric: tabular-nums; }
#sos-page .sos-pick-opt.on { border-color: var(--pk-night, #1E2330); box-shadow: inset 0 0 0 1px var(--pk-night, #1E2330); }
#sos-page .sos-pick-opt.on .rd { border: 6px solid var(--pk-night, #1E2330); }
#sos-page .sos-pick-opt:focus-visible { outline: 2px solid var(--pk-night, #1E2330); outline-offset: 2px; }
#sos-page .sos-pick-rec { flex: none; padding: 3px 9px; border-radius: 999px; background: var(--pk-night, #1E2330); color: #fff; font-size: var(--fs-12, 12px); font-weight: 800; }
/* 開著時資料或定位變了：講事實＋「重新排列」，按了才換（清單不自己動） */
#sos-page .sos-pick-upd { flex: none; display: flex; align-items: center; gap: 10px; margin-top: 8px; padding: 6px 6px 6px 12px; border-radius: 12px;
  background: rgba(74,139,141,.10); font-size: var(--fs-13-5, 13.5px); font-weight: 700; line-height: 1.45; color: var(--pk-ink, #1E2330); }
#sos-page .sos-pick-upd > span { flex: 1; min-width: 0; }
#sos-page .sos-pick-resort { flex: none; min-height: 44px; font-size: var(--fs-14, 14px); }
/* 點確認／取消／外面關掉之後的透明擋板（PICK_HOLD_MS）：連點兩下的第二下落在這裡，不會按到底下的撥號鈕 */
#sos-page .sos-pick-shield { position: fixed; inset: 0; z-index: 30; }
#sos-page .sos-pick-foot { margin-top: 8px; }
#sos-page .sos-pick-foot .sos-note { margin: 0 0 4px; }
#sos-page .sos-pick-acts { display: flex; gap: 10px; margin-top: 10px; }
#sos-page .sos-pick-acts .bp-btn { flex: 1; min-height: 48px; font-size: var(--fs-15, 15px); }
#sos-page .sos-pick-ok { background: var(--pk-night, #1E2330); border-color: var(--pk-night, #1E2330); color: #fff; }
#sos-page .sos-pick-ok:disabled { opacity: .4; cursor: default; }

/* ── 第三輪：網路狀態列、打不通的時候、附近通訊點、你在哪裡 ──────────────────────── */
#sos-page .sos-net { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 10px; border-radius: 10px;
  background: rgba(74,139,141,.10); font-size: var(--fs-15, 15px); font-weight: 700; line-height: 19.575px; color: var(--pk-ink, #1E2330); }
#sos-page .sos-net .dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--pk-summit, #4A8B8D); }
#sos-page .sos-net.off { background: rgba(196,132,90,.12); }
#sos-page .sos-net.off .dot { background: var(--pk-amber-btn, #A16743); }
/* 離線時「打不通」卡排在第一張之後：琥珀框＝警示語彙（不用紅） */
#sos-page .sos-nocall.first { border-color: rgba(165,107,69,.55); box-shadow: 0 0 0 1px rgba(165,107,69,.25) inset; }
#sos-page .sos-near { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(174,189,212,.38); }
/* 第四輪：「打不通」那份機關說法拿掉之後，通訊點是卡片最後一塊 ⇒ 不留分隔線與多出來的間距 */
#sos-page .sos-near:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
#sos-page .sos-near-h { display: flex; align-items: center; gap: 6px; font-size: var(--fs-15, 15px); font-weight: 800; color: var(--pk-ink, #1E2330); }
#sos-page .sos-near-h svg { width: 17px; height: 17px; flex: none; }
#sos-page .sos-near-msg { margin: 6px 0 0; font-size: var(--fs-15, 15px); line-height: 21.7px; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-near-msg.warn { font-weight: 700; color: var(--pk-ink-ember, #A56B45); }
#sos-page .sos-near-list { margin: 6px 0 0; padding-left: 22px; }
#sos-page .sos-near-list li { margin-bottom: 6px; }
#sos-page .sos-near-list li .a { font-size: var(--fs-15, 15px); line-height: 1.5; color: var(--pk-ink, #1E2330); }
#sos-page .sos-near-list li .a b { font-weight: 800; font-variant-numeric: tabular-nums; }
#sos-page .sos-near-list li .b { font-size: var(--fs-13, 13px); line-height: 1.45; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-near-list li .c { font-size: var(--fs-12-5, 12.5px); font-weight: 700; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-near-list li.extra { list-style: none; margin-left: -22px; padding-top: 6px; border-top: 1px dashed rgba(174,189,212,.55); }
#sos-page .sos-near-map { display: inline-flex; align-items: center; gap: 6px; min-height: 42px; margin-top: 8px; font-size: var(--fs-13-5, 13.5px);
  transition: transform var(--pk-motion-fast, 150ms) var(--pk-ease-standard, ease); }
#sos-page .sos-near-map svg { width: 16px; height: 16px; flex: none; }
#sos-page .sos-place { margin: 2px 0 6px; padding-bottom: 10px; border-bottom: 1px solid rgba(174,189,212,.38); }
#sos-page .sos-place-list { margin: 4px 0 0; padding-left: 20px; }
#sos-page .sos-place-list li { margin-bottom: 6px; font-size: var(--fs-15-5, 15.5px); line-height: 1.6; color: var(--pk-ink, #1E2330); }
#sos-page .sos-urgent .sos-off { margin-top: 6px; padding-top: 6px; border-top: 1px dashed rgba(165,107,69,.45); font-size: var(--fs-14, 14px); font-weight: 700; color: var(--pk-ink, #1E2330); }

/* ── 第五輪：「我該怎麼說」標題、簡訊內容框 ─────────────────────────────── */
#sos-page .sos-order p.sos-say-h { margin: 0 0 4px; font-size: var(--fs-14, 14px); font-weight: 800; color: var(--pk-ink, #1E2330); }
#sos-page .sos-sms { margin-top: 10px; }
/* 標題列：「簡訊內容　說明文字」，右邊浮著「恢復成原本的內容」（DOM 裡排第一個，見 pk-sos.js buildSmsBox）。
   flow-root：把浮動的那顆包進來。行高寫死 1.45，恢復鈕的命中區才算得準。最少兩行高（2.9em）：寬螢幕上文字只有一行時，
   恢復鈕往下延伸的命中區也落在標題列裡、不壓到框。 */
#sos-page .sos-sms-h { display: flow-root; min-height: 2.9em; margin-bottom: 8px; font-size: var(--fs-13, 13px); font-weight: 800; line-height: 1.45; color: var(--pk-ink-2, #4A5168); }
#sos-page .sos-sms-h .sub { margin-left: 6px; font-weight: 500; }
/* 16px：iOS 對字級小於 16px 的輸入框，聚焦時會把整頁放大 */
#sos-page .sos-sms-text {
  display: block; width: 100%; box-sizing: border-box; min-height: 176px; margin: 0; resize: vertical;
  padding: 10px 12px; border-radius: 12px; border: 1.5px solid rgba(174,189,212,.75); background: #fff; color: var(--pk-ink, #1E2330);
  font-family: inherit; font-size: var(--fs-16, 16px); font-weight: 500; line-height: 1.5;
}
#sos-page .sos-sms-text:focus { outline: 2px solid var(--pk-summit, #4A8B8D); outline-offset: 1px; }
/* 恢復成原本的內容／復原剛才的修改：標題列第一行右端的底線文字鈕（創辦人 10-05「放到右邊接著文字，按鈕改成文字形式加底線」）。
   10-05 審查 V11／V13：
   - 浮在第一行右端，說明文字繞著它排——它不會換到第二行開頭、壓在「簡訊內容」底下（舊版點標籤會把改過的字蓋掉）。
   - 命中區 44 px：往下延伸（padding-bottom 26px），蓋到第二行的右半與框上方的空白，不往上、不碰框（標題列最少兩行高＋
     margin-bottom 8px）。margin-bottom −26px 抵掉延伸的那一截：它只佔第一行，第二行的說明文字可以用滿整個寬度。
   - 寬度固定 8.6em（兩種字一樣寬）：換字時說明文字的折行不變。position＋z-index：第二行右半若剛好有說明文字，點下去算恢復鈕
     （說明文字本身不能按）。
   - 改過才看得到（visibility，位置一直佔著：打第一個字不會讓標題列多一行、把框往下推）。 */
#sos-page .sos-sms-reset {
  float: right; position: relative; z-index: 1; box-sizing: content-box; width: 8.6em;
  margin: 0 0 -26px 8px; padding: 0 4px 26px; text-align: right;
  border: 0; border-radius: 0; background: none; cursor: pointer;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
  font-family: inherit; font-size: var(--fs-13, 13px); font-weight: 700; line-height: 1.45; color: var(--pk-ink, #1E2330);
  text-decoration: underline; text-underline-offset: 3px;
}
#sos-page .sos-sms-reset:active { opacity: .55; }

/* ── 暗化（body.map-dim；寫裸 .map-dim，見檔頭）─────────────────────────── */
.map-dim #sos-page .sos-rows { border-color: rgba(255,255,255,.12); }
.map-dim #sos-page .sos-pick-card { background: #1E2433; box-shadow: 0 -10px 30px rgba(0,0,0,.5); }
.map-dim #sos-page .sos-pick-opt { background: #232937; border-color: rgba(255,255,255,.2); }
.map-dim #sos-page .sos-pick-opt .rd { border-color: rgba(233,237,245,.55); }
.map-dim #sos-page .sos-pick-opt.on { border-color: #E9EDF5; box-shadow: inset 0 0 0 1px #E9EDF5; }
.map-dim #sos-page .sos-pick-opt.on .rd { border-color: #E9EDF5; }
.map-dim #sos-page .sos-pick-opt:focus-visible { outline-color: #E9EDF5; }
.map-dim #sos-page .sos-pick-rec, .map-dim #sos-page .sos-pick-ok { background: #E9EDF5; border-color: #E9EDF5; color: #1E2330; }
.map-dim #sos-page .sos-pick-upd { background: rgba(127,182,184,.14); }
.map-dim #sos-page .sos-near, .map-dim #sos-page .sos-place { border-color: rgba(255,255,255,.12); }
.map-dim #sos-page .sos-net { background: rgba(127,182,184,.14); }
.map-dim #sos-page .sos-net.off { background: rgba(217,169,140,.16); }
.map-dim #sos-page .sos-nocall.first { border-color: rgba(217,169,140,.5); }
.map-dim #sos-page .sos-near-msg.warn { color: #E0A878; }
.map-dim #sos-page .sos-call { background: #232937; border-color: rgba(255,255,255,.16); }
.map-dim #sos-page .sos-call.primary { background: var(--pk-amber-btn, #A16743); border-color: transparent; }
.map-dim #sos-page .sos-pos, .map-dim #sos-page .sos-sit { border-color: rgba(255,255,255,.12); }
.map-dim #sos-page .sos-sit-h .ic { background: rgba(255,255,255,.09); }
.map-dim #sos-page .sos-chip { background: #232937; border-color: rgba(255,255,255,.2); }
.map-dim #sos-page .sos-chip.on { background: #E9EDF5; border-color: #E9EDF5; color: #1E2330; }
.map-dim #sos-page .sos-urgent { background: rgba(196,132,90,.14); border-color: rgba(217,169,140,.5); }
.map-dim #sos-page .sos-urgent .t { color: #D9A98C; }
.map-dim #sos-page .sos-pos.stale .sos-pos-age { color: #E0A878; }
.map-dim #sos-page .sos-sms-text { background: #232937; border-color: rgba(255,255,255,.2); }

@media (prefers-reduced-motion: reduce) {
  #sos-page .sos-call, #sos-page .sos-chip, #sos-page .bp-btn, #sos-page .sos-sit-h .ic, #sos-page .sos-sit-h .chev { transition: none; }
}

/* Emergency scenario flows. Scoped to the emergency page. */
#sos-page .scenario-heading { display:flex;align-items:center;justify-content:space-between;gap:8px }
#sos-page .scenario-heading .sos-h { margin:0!important }
#sos-page .new-mark { font-size:var(--fs-11,11px);color:#875235;background:#f4e8de;padding:4px 7px;border-radius:6px;font-weight:700 }
#sos-page .scenario-intro { font-size:var(--fs-13-5,13.5px);line-height:1.6;color:var(--pk-ink-2,#4A5168);margin:6px 0 14px }
#sos-page .scene-context { border:1px solid rgba(174,189,212,.55);border-radius:11px;padding:0 10px;margin:0 0 12px;background:rgba(174,189,212,.08) }
#sos-page .scene-context>summary,
#sos-page .scene-resources>summary,
#sos-page .scene-sources>summary { cursor:pointer;min-height:48px;padding:12px 0;font-size:var(--fs-14,14px);font-weight:700;line-height:1.6;color:var(--pk-ink,#1E2330) }
#sos-page .scene-context>summary>small { display:block;font-size:var(--fs-12-5,12.5px);font-weight:500;margin:2px 0 0 17px;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-field { border:0;padding:0;margin:4px 0 16px;min-width:0 }
#sos-page .scene-field legend { font-size:var(--fs-14,14px);font-weight:700;line-height:1.55;margin-bottom:8px;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-field .sos-chip { min-height:44px;padding:9px 12px;font-weight:600;max-width:100%;border-radius:12px }
#sos-page .scene-field[data-key=state] .sos-chips { display:grid;grid-template-columns:1fr }
#sos-page .scene-field[data-key=state] .sos-chip { display:flex;gap:8px;align-items:center }
#sos-page .scene-field[data-key=state] .sos-chip:before { content:"";width:15px;height:15px;flex:none;border-radius:50%;border:1.5px solid currentColor }
#sos-page .scene-field[data-key=state] .sos-chip.on:before { border-width:4px }
#sos-page .scene-observations .scene-field { padding-bottom:12px;border-bottom:1px solid rgba(174,189,212,.3) }
#sos-page .scene-observations .scene-field[data-key=state] .sos-chips { grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr)) }
#sos-page .scene-person-note { margin:0 0 14px;font-size:var(--fs-13-5,13.5px);line-height:1.6;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-person-note p { margin:0 }
#sos-page .scene-person-reset { min-height:44px;padding:8px 0;border:0;background:none;color:inherit;font:inherit;text-align:left;text-decoration:underline;text-underline-offset:4px;cursor:pointer }
#sos-page .scene-assessment,
#sos-page .scene-local-status { padding:12px;margin:8px 0 16px;border:1px solid var(--pk-sky,#AEBDD4);border-radius:10px;background:rgba(174,189,212,.12);font-size:var(--fs-14,14px);line-height:1.65;color:var(--pk-ink,#1E2330) }
#sos-page .scene-assessment p,
#sos-page .scene-local-status p { margin:4px 0 0;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-local-status { border-color:var(--pk-amber-btn,#A16743);background:rgba(196,132,90,.09) }
#sos-page .scene-local-status .bp-btn { margin-top:10px;min-height:44px;white-space:normal }
#sos-page .scene-related { min-height:44px;white-space:normal;margin-top:8px }
.map-dim #sos-page .scene-local-status { border-color:#D9A98C;background:rgba(196,132,90,.14) }
#sos-page .scene-warning { font-size:var(--fs-14-5,14.5px);line-height:1.65;color:var(--pk-ink,#1E2330);background:rgba(196,132,90,.09);border-left:3px solid #A16743;border-radius:0 9px 9px 0;padding:10px 12px;margin:2px 0 16px }
#sos-page .scene-resources { border-top:1px solid rgba(174,189,212,.4);border-bottom:1px solid rgba(174,189,212,.4);margin:4px 0 16px }
#sos-page .scene-resources .resource-meta { font-size:var(--fs-12-5,12.5px);display:block;font-weight:500;color:var(--pk-ink-2,#4A5168);padding-left:17px }
#sos-page .scene-result { scroll-margin-top:68px }
#sos-page .scene-result h3 { font-size:var(--fs-17,17px);line-height:1.5;margin:0 0 8px;color:var(--pk-ink,#1E2330) }
#sos-page .result-caption { font-size:var(--fs-12-5,12.5px);color:var(--pk-ink-2,#4A5168);margin:0 0 6px }
#sos-page .scene-result.urgent h3 { color:var(--pk-ink-ember,#935B38) }
#sos-page .scene-help { display:flex;gap:8px;margin:10px 0 }
#sos-page .scene-help button { border:0;border-radius:10px;min-height:46px;padding:10px 14px;font-size:var(--fs-14,14px);font-weight:700;background:#A16743;color:#fff;flex:1 }
#sos-page .scene-help button+button { background:rgba(174,189,212,.16);color:var(--pk-ink,#1E2330);border:1px solid rgba(174,189,212,.6) }
#sos-page .scene-steps { list-style:none;counter-reset:steps;padding:0;margin:14px 0 }
#sos-page .scene-steps li { counter-increment:steps;position:relative;padding:0 0 15px 31px }
#sos-page .scene-steps li:before { content:counter(steps);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:7px;background:rgba(174,189,212,.2);font-size:var(--fs-12,12px);font-weight:800;display:grid;place-items:center }
#sos-page .scene-steps b { display:block;font-size:var(--fs-15-5,15.5px);line-height:1.55 }
#sos-page .scene-steps p { font-size:var(--fs-14-5,14.5px);color:var(--pk-ink-2,#4A5168);line-height:1.7;margin:3px 0 0 }
#sos-page .scene-context-note { padding:12px;border-radius:11px;background:rgba(174,189,212,.13);margin:8px 0 16px;font-size:var(--fs-14,14px);line-height:1.7;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-context-note b { display:block;color:var(--pk-ink,#1E2330);margin-bottom:4px }
#sos-page .scene-context-note p { margin:4px 0 }
#sos-page .scene-sources { border-top:1px solid rgba(174,189,212,.4);margin-top:16px }
#sos-page .scene-sources p,
#sos-page .scene-sources a { font-size:var(--fs-12-5,12.5px);line-height:1.7;color:var(--pk-ink-2,#4A5168) }
#sos-page .scene-sources a { display:block;margin:9px 0;text-underline-offset:3px }
#sos-page .scene-review-note { border-top:1px dashed rgba(174,189,212,.55);padding-top:10px }
#sos-page .scene-report { min-height:46px;width:100%;margin:12px 0 0!important;white-space:normal!important;font-size:var(--fs-14,14px)!important }
#sos-page .scene-collapse { border:0;background:transparent;color:var(--pk-ink-2,#4A5168);text-decoration:underline;text-underline-offset:4px;min-height:44px;font-size:var(--fs-13-5,13.5px);width:100%;margin-top:5px }
#sos-page .sos-sit-h .ic .pk-i { font-size:var(--fs-21,21px) }
#sos-page .scene-count { display:block;font-size:var(--fs-12-5,12.5px);color:var(--pk-ink-2,#4A5168);line-height:1.7;margin:12px 0 0 }
.map-dim #sos-page .new-mark { background:#42372f;color:#E2B597 }
.map-dim #sos-page .scene-warning { background:rgba(196,132,90,.14);border-color:#D9A98C }
.map-dim #sos-page .scene-steps li:before { background:#394358 }
#sos-page .scene-material-order,
#sos-page .scene-material-note,
#sos-page .scene-image-pending { font-size:var(--fs-14,14px);line-height:1.7;color:var(--pk-ink-2,#4A5168);margin:4px 0 16px }
#sos-page .scene-image-pending { padding:12px;border:1px dashed var(--pk-sky,#AEBDD4);border-radius:10px;background:rgba(174,189,212,.09) }
#sos-page .scene-material-note { border-left:3px solid var(--pk-sky,#AEBDD4);padding-left:10px }
#sos-page #scene-shoe .scene-resources>.scene-field { padding-top:10px;border-top:1px solid rgba(174,189,212,.35) }
#sos-page .scene-guide-jump { min-height:46px;width:100%;margin:0 0 14px;white-space:normal;font-size:var(--fs-14,14px) }
#sos-page .scene-methods { margin:12px 0 18px }
#sos-page .scene-methods .sos-chip { min-height:44px }
#sos-page .scenario-card.has-selection>.sos-sit:not(.on)>.sos-sit-h { opacity:.6;background:transparent;color:var(--pk-ink-2,#4A5168) }
#sos-page .scenario-card.has-selection>.sos-sit:not(.on)>.sos-sit-h:hover,
#sos-page .scenario-card.has-selection>.sos-sit:not(.on)>.sos-sit-h:focus-visible { opacity:1 }
#sos-page .scene-field.has-answer .sos-chip:not(.on),
#sos-page .scene-methods .sos-chip:not(.on) { opacity:.65;background:transparent;color:var(--pk-ink-2,#4A5168);border-color:var(--pk-sky,#AEBDD4) }
#sos-page .scene-field.has-answer .sos-chip:not(.on):hover,
#sos-page .scene-field.has-answer .sos-chip:not(.on):focus-visible,
#sos-page .scene-methods .sos-chip:not(.on):hover,
#sos-page .scene-methods .sos-chip:not(.on):focus-visible { opacity:1 }
#sos-page .scene-usage-open { display:block;min-height:44px;margin:-9px 0 6px;padding:8px 0;background:none;border:0;color:var(--pk-ink-2,#4A5168);font-size:var(--fs-13-5,13.5px);text-decoration:underline;text-underline-offset:4px;text-align:left }
#sos-page .scenario-usage[hidden] { display:none!important }
#sos-page .scenario-usage { position:fixed;left:50%;right:auto;top:auto;bottom:33.333333%;transform:translate(-50%,50%);width:max-content;max-width:calc(100% - 32px);z-index:3;margin:0;background:var(--usage-notice-bg,#1B1B1D);color:var(--usage-notice-ink,#FFFFFF);border:1px solid transparent;border-radius:12px;padding:12px 16px;box-shadow:0 4px 18px rgba(0,0,0,.2);opacity:0;transition:opacity .8s ease-out }
#sos-page .scenario-usage.is-visible { opacity:1 }
#sos-page .scenario-usage.is-hiding { transition:opacity .3s ease-in;pointer-events:none }
#sos-page .usage-message { margin:0;white-space:pre-line;text-align:center;font-size:var(--fs-13-5,13.5px);line-height:1.6;font-weight:500 }
#sos-page .usage-message::first-line { font-weight:700 }
#sos-page .sos-row .tx>b { display:block;margin-bottom:5px;line-height:1.55 }
#sos-page #scenario-usage-close { position:absolute;right:0;top:0;width:44px;height:40px;border:0;background:none;color:inherit;font-size:var(--fs-20,20px);padding:0 }
#sos-page .scene-diagrams { margin:12px 0 18px;border:1px solid var(--pk-sky,#AEBDD4);border-radius:11px;padding:0 11px }
#sos-page .scene-diagrams>summary { min-height:48px;padding:12px 0;cursor:pointer;font-size:var(--fs-14,14px);line-height:1.6;font-weight:700;color:var(--pk-ink,#1E2330) }
#sos-page .scene-diagrams figure { margin:5px 0 18px }
#sos-page .diagram-thumb { display:block;width:100%;border:1px solid var(--pk-sky,#AEBDD4);padding:0;background:#F4F1EC;border-radius:8px;overflow:hidden }
#sos-page .diagram-thumb img { display:block;width:100%;height:auto }
#sos-page .scene-diagrams figcaption { font-size:var(--fs-12-5,12.5px);line-height:1.7;color:var(--pk-ink-2,#4A5168);margin-top:7px }
#sos-page #sos-diagram-dialog { border:1px solid var(--pk-sky,#AEBDD4);border-radius:15px;padding:0;width:calc(100% - 20px);max-width:1040px;height:calc(100dvh - 40px);max-height:calc(100dvh - 40px);background:var(--sos-dialog-bg,#F4F1EC);color:var(--pk-ink,#1E2330);overflow:hidden }
#sos-page #sos-diagram-dialog[open] { display:flex;flex-direction:column }
#sos-page #sos-diagram-dialog::backdrop { background:rgba(30,35,48,.72) }
#sos-page .diagram-toolbar { flex:none;display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--pk-sky,#AEBDD4) }
#sos-page .diagram-toolbar h2 { flex:1;min-width:0;font-size:var(--fs-14,14px);line-height:1.5;margin:0 }
#sos-page .diagram-toolbar button { flex:none;min-height:44px;min-width:44px;padding:8px;border:1px solid var(--pk-sky,#AEBDD4);border-radius:9px;color:inherit;background:transparent;font-size:var(--fs-13,13px) }
#sos-page #sos-diagram-close { border:0;font-size:var(--fs-24,24px) }
#sos-page .diagram-scroll { flex:1;overflow:auto;min-height:0;overscroll-behavior:contain;background:#F4F1EC }
#sos-page .diagram-scroll img { display:block;width:100%;height:auto }
#sos-page #sos-diagram-dialog.is-zoomed #sos-diagram-frame { width:1200px;max-width:none }
#sos-page #sos-diagram-dialog.is-zoomed .diagram-scroll img { width:100%;max-width:none }
#sos-page .scenario-card.has-selection>.sos-sit:not(.on) .lead { display:none }
#sos-page .scenario-card.has-selection>.sos-sit:not(.on) { background:transparent;box-shadow:none }
#sos-page .sos-sit .viewing { display:none;font-size:var(--fs-12-5,12.5px);font-weight:700;line-height:1.6;margin-top:4px;color:var(--pk-ink-ember,#935B38) }
#sos-page .sos-sit.on .viewing { display:block }
#sos-page .scene-field.is-multiple[data-key=state] .sos-chip:before { border-radius:4px }
#sos-page .scene-field.is-multiple[data-key=state] .sos-chip.on:before { content:"✓";border-width:1.5px;font-size:var(--fs-12,12px);line-height:15px;text-align:center }
#sos-page .scene-priority .sos-urgent p { font-size:var(--fs-14-5,14.5px);line-height:1.7;margin:5px 0 }
#sos-page .urgent-first { display:block;font-size:var(--fs-15-5,15.5px);line-height:1.6 }
#sos-page .tube-preparation { padding:14px;border-radius:12px;background:var(--pk-glow,#FCF3DB);margin:14px 0;color:var(--pk-night,#1E2330) }
#sos-page .tube-preparation h4,
#sos-page .scene-diagrams figcaption h4 { font-size:var(--fs-15-5,15.5px);line-height:1.6;margin:0 0 6px }
#sos-page .tube-preparation p,
#sos-page .scene-diagrams figcaption p,
#sos-page .tube-experience p,
#sos-page .scene-firstaid p { font-size:var(--fs-14-5,14.5px);line-height:1.8;margin:4px 0 12px }
#sos-page .scene-diagrams figure { margin:8px 0 26px }
#sos-page .scene-diagrams figcaption { margin-top:12px;color:var(--pk-ink,#1E2330) }
#sos-page .scene-diagrams .step-note { padding:9px 10px;background:rgba(174,189,212,.14);font-size:var(--fs-13-5,13.5px);color:var(--pk-ink-2,#4A5168) }
#sos-page .tube-legend,
#sos-page .diagram-hint { font-size:var(--fs-13-5,13.5px);line-height:1.7;color:var(--pk-ink-2,#4A5168) }
#sos-page .original-frame { position:relative;overflow:hidden;width:100%;aspect-ratio:1024/648 }
#sos-page .original-frame img { position:absolute;top:0;left:0;width:100%;height:auto;transform:translateY(-9.505208333333333%) }
#sos-page .tube-experience,
#sos-page .scene-firstaid { border-top:1px solid var(--pk-sky,#AEBDD4);padding:5px 0;margin:12px 0 }
#sos-page .tube-experience summary,
#sos-page .scene-firstaid summary { min-height:48px;padding:12px 0;cursor:pointer;font-weight:700;font-size:var(--fs-14,14px) }
#sos-page .scene-firstaid a { font-size:var(--fs-13-5,13.5px) }
#sos-page #sos-diagram-detail { padding:14px 18px;margin:0;color:var(--pk-night,#1E2330);font-size:var(--fs-15,15px);line-height:1.8 }
#sos-page .scene-context-note[hidden] { display:none }
#sos-page .scenario-usage { z-index:25; padding:14px 38px 14px 16px; box-sizing:border-box; }
#sos-page .scenario-usage[hidden], #sos-page .sos-scene-dialog [hidden] { display:none!important; }
.map-dim { --usage-notice-bg:#E5E7EB; --usage-notice-ink:#111111; --sos-dialog-bg:#272e3d; }
#sos-page .sos-scene-dialog { box-sizing:border-box; border:1px solid var(--pk-sky,#AEBDD4); border-radius:15px; width:calc(100% - 24px); max-width:580px; max-height:85dvh; padding:16px; background:var(--sos-dialog-bg,#fff); color:var(--pk-ink,#1E2330); }
#sos-page .sos-scene-dialog::backdrop { background:rgba(30,35,48,.65); }
#sos-page .sos-scene-dialog .sos-sms-text { min-height:260px; margin:10px 0; }
#sos-page .scene-dialog-description, #sos-page .scene-dialog-text, #sos-page .scene-dialog-status { font-size:var(--fs-14,14px);line-height:1.7;white-space:pre-line; }
#sos-page .sos-scene-dialog .diagram-toolbar { padding:0 0 10px; }
#sos-page button { font-family:inherit; }
#sos-page button:focus-visible,#sos-page summary:focus-visible,#sos-page a:focus-visible { outline:2px solid var(--pk-summit,#4A8B8D);outline-offset:3px; }
#sos-page .sos-sit-h .lead { line-height:1.55; }
#sos-page .sos-row { flex-wrap:wrap;line-height:1.55; }
#sos-page .sos-row .tx { flex-basis:190px; }
@media(prefers-contrast:more){ #sos-page .scenario-card.has-selection>.sos-sit:not(.on)>.sos-sit-h, #sos-page .scene-field.has-answer .sos-chip:not(.on), #sos-page .scene-methods .sos-chip:not(.on){opacity:1} }
@media(prefers-reduced-motion:reduce){ #sos-page .scenario-usage,#sos-page .scenario-usage.is-hiding{transition:none} }
