/* ============================================================
       c02 · 케어 기록
       v4.0 · 2026-04-19 · 라운딩 허브 + 그리드
       L1 허브(액션 우선) → L2 환자 상세(2×4 그리드) → L3 스텝퍼(선택적)
       + 빠른 기록 바텀시트, 음성 FAB, 이전 값 프리필
       tokens.css 기반, data-role=caregiver
       ============================================================ */
    :root {
      --text-body: 18px;
      --size-touch-target: 48px;

      --accent:        var(--color-accent);
      --accent-soft:   var(--color-accent-soft);
      --accent-strong: var(--color-accent-strong);
      --warn:          var(--color-warning);
      --warn-soft:     var(--color-warning-soft);
      --t1:            var(--color-text-primary);
      --t2:            var(--color-text-secondary);
      --t3:            var(--color-text-tertiary);

      --safe-t: env(safe-area-inset-top, 0px); /* v3.2.5: 단순 env() — 데스크톱 빈공간 제거 */
      --safe-b: max(env(safe-area-inset-bottom, 0px), 20px);
      --tab-h:  64px;
      --tab-bot: 12px;
      --page-pad: 20px; /* v3.2.5: 본문 좌우 padding 통일 */
    }

    /* v4.1 (2026-04-19) · 보호자앱(g-guardian-live)과 공통 톤 정렬
       - 글래스 카드: rgba(255,255,255,.80) + .5px 보더 + inset 하이라이트
       - 배경: 저채도 그린 그라디언트 + 상단 녹색 라디얼 힌트 (역할 앵커만)
       - .lq 공통 클래스 도입 (보호자앱과 동일 선언)
       - 탭바: 저채도 녹색 틴트 알약 (보호자 파란-틴트의 카운터파트) */
    html { height: 100%; background: var(--clinical-canvas); font-size: 17px; }
    body { min-height: 100%; color: var(--t1); overflow-x: hidden; font-size: var(--text-body); }

    .bg {
      position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
      background: var(--clinical-bg-image);
    }
    /* ============ 공통 Liquid Glass (보호자앱과 동일 선언) ============ */
    .lq {
      background: rgba(255,255,255,0.45);
      backdrop-filter: blur(24px) saturate(140%) brightness(1.04);
      -webkit-backdrop-filter: blur(24px) saturate(140%) brightness(1.04);
      border: 0.5px solid rgba(255,255,255,0.58);
      box-shadow: 0 1px 1px rgba(255,255,255,0.6) inset, 0 4px 16px rgba(0,0,0,0.06);
      position: relative; overflow: hidden;
    }
    .lq > * { position: relative; z-index: 1; }

    .app {
      max-width: 430px; margin: 0 auto; min-height: 100%;
      position: relative;
      /* v3.2.6: 빠른 기록 영역이 탭바에 가려지지 않도록 여유 +72px */
      padding-bottom: calc(var(--safe-b) + var(--tab-h) + var(--tab-bot) + 72px);
    }
    .view { display: none; }
    .view.active { display: block; }

    /* ============ 공통 헤더 · 보호자앱 header-mobile 통일 v4.0 ============ */
    .app .header-mobile {
      position: static !important;
      background: transparent !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }
    .app .header-mobile__left,
    .app .header-mobile__right {
      color: var(--accent-strong);
    }
    .app .header-mobile__right iconify-icon,
    .app .header-mobile__left iconify-icon { font-size: var(--size-icon-md); }
    /* 상태 스트립 — 위치·피크·동기화 (헤더 바로 아래) */
    .status-strip {
      margin: 0 var(--page-pad) 10px;
      display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap;
      font-size: 11px; font-weight: 600; color: var(--t2);
    }
    .sync-pill {
      display: inline-flex; align-items: center; gap: 4px;
      padding: 2px 8px; border-radius: 999px;
      background: rgba(var(--color-warning-rgb), .14);
      color: var(--palette-amber-700);
      font-size: 10px; font-weight: 700; letter-spacing: .2px;
      cursor: pointer;
    }
    .sync-pill b { font-weight: 700; }
    .peak-pill {
      display: inline-flex; align-items: center; gap: 3px;
      padding: 2px 8px; border-radius: 999px;
      background: rgba(0,0,0,.05);
      color: var(--t2);
      font-size: 10px; font-weight: 700; letter-spacing: .2px;
    }
    .peak-pill iconify-icon { font-size: 11px; color: var(--t2); }
    .sync-dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: var(--palette-amber-600);
      animation: syncPulse 1.6s ease-in-out infinite;
    }
    @keyframes syncPulse {
      0%, 100% { opacity: 1; transform: scale(1); }
      50%      { opacity: .6; transform: scale(.85); }
    }
    .header-act { display: flex; gap: 6px; }

    /* .icon-btn 표준은 caregiver.css가 SoT — 인라인 정의 제거.
       backdrop-filter: blur(12px) saturate(140%) 포함, shadow 통일 */

    .back-btn {
      width: 36px; height: 36px; border-radius: 50%;
      background: rgba(255,255,255,.7);
      border: .5px solid rgba(255,255,255,.9);
      display: inline-flex; align-items: center; justify-content: center;
      cursor: pointer; flex-shrink: 0;
      box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 2px 8px rgba(0,0,0,.04);
      transition: transform .1s;
    }
    .back-btn:active { transform: scale(.93); }
    .back-btn iconify-icon { font-size: 18px; color: var(--t1); }

    /* 섹션 레이블 (최소) */
    .sec-l2 {
      margin: 20px var(--page-pad) 8px;
      display: flex; align-items: baseline; justify-content: space-between;
      font-size: 12px; font-weight: 700; color: var(--t2);
      letter-spacing: .5px; text-transform: uppercase;
      position: relative; z-index: 1;
    }
    .sec-l2 .sub { font-size: 11px; font-weight: 700; color: var(--t3); text-transform: none; letter-spacing: 0; }

    /* 아바타 */
    .av {
      display: inline-flex; align-items: center; justify-content: center;
      border-radius: 50%; flex-shrink: 0;
      background: rgba(0,0,0,.05); color: var(--t2);
      font-weight: 700; letter-spacing: -.2px;
    }
    .av.md { width: 36px; height: 36px; font-size: 14px; }
    .av.lg { width: 44px; height: 44px; font-size: 17px; }
    .av.sm { width: 24px; height: 24px; font-size: 11px; }
    .av.warn { background: var(--warn-soft); color: var(--palette-amber-700); }
    .av.ok   { background: rgba(var(--brand-green-500-rgb), .14); color: var(--accent-strong); }

    /* ============================================================
       L1 · 라운딩 허브
       ============================================================ */
    /* 지금 해야 할 일 (히어로) · 보호자앱 care-item 톤 */
    .now-card {
      margin: 12px var(--page-pad) 0;
      padding: 14px 14px 12px;
      /* v3.2.8: 카드 베이스라인 토큰 (5개 화면 동일) */
      background: var(--cg-card-bg);
      border: 0;
      border-radius: var(--cg-card-radius);
      box-shadow: var(--cg-card-shadow);
      position: relative; z-index: 1;
      display: flex; flex-direction: column;
    }
    .now-head {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 10px;
    }
    .now-k {
      display: inline-flex; align-items: center; gap: 4px;
      font-size: 11px; font-weight: 700; color: var(--palette-amber-700);
      letter-spacing: .4px; text-transform: uppercase;
    }
    .now-k iconify-icon { font-size: 13px; }
    .now-time { font-size: 11px; font-weight: 700; color: var(--t3); }

    /* 3행 리스트 (박/최/이) · 균등 row 구조 */
    .now-rows {
      display: flex; flex-direction: column;
      padding-top: 4px;
    }
    .now-row {
      display: flex; align-items: center; gap: 10px;
      padding: 8px 4px; border: 0; background: transparent;
      font-family: inherit; text-align: left; width: 100%;
      cursor: pointer; transition: background .12s;
      border-radius: 10px;
    }
    .now-row:active { background: rgba(0,0,0,.03); }
    .now-row-body { flex: 1; min-width: 0; line-height: 1.3; }
    .now-row-t {
      font-size: 13px; font-weight: 700; color: var(--t1);
      letter-spacing: -.2px;
    }
    .now-row-t b { font-weight: 700; }
    .now-row-s {
      font-size: 11px; font-weight: 600; color: var(--t3);
      margin-top: 2px;
    }
    .now-row-s .warn-text {
      color: var(--palette-amber-700); font-weight: 700;
    }
    .now-row > iconify-icon { font-size: 15px; color: var(--t3); flex-shrink: 0; }

    /* Hero row (박영자 · 1순위) · 미세 강조만 */
    .now-row.hero { padding: 10px 4px; }
    .now-row.hero .now-row-t { font-size: 14px; }
    .now-row.hero .now-row-s { font-size: 11.5px; }

    /* 카드 하단 풀너비 primary CTA (c01 패턴 승계) */
    .now-card-cta {
      display: flex; align-items: center; justify-content: center; gap: 8px;
      width: 100%; margin-top: 10px; padding: 0 14px; height: 48px;
      border: 0; border-radius: 14px;
      background: var(--accent);
      color: var(--palette-white); font-family: inherit;
      font-size: 14px; font-weight: 700; letter-spacing: -.2px;
      box-shadow: 0 4px 14px rgba(var(--brand-green-500-rgb), .26);
      cursor: pointer; transition: transform .1s;
      position: relative;
    }
    .now-card-cta:active { transform: scale(.98); }
    .now-card-cta iconify-icon { font-size: 17px; }
    .now-card-cta iconify-icon.ar { position: absolute; right: 14px; font-size: 16px; }
    .now-card-cta b { font-weight: 900; }

    /* 담당 환자 토글 + 힌트 (섹션 레이블 대체) */
    .pt-toggle-row {
      margin: 18px var(--page-pad) 8px;
      display: flex; align-items: center; justify-content: space-between;
      gap: 8px; position: relative; z-index: 1;
    }
    .pt-toggle-hint {
      font-size: 11px; font-weight: 700; color: var(--t3);
      letter-spacing: -.1px;
    }
    .pt-toggle {
      display: inline-flex; padding: 3px;
      background: rgba(255,255,255,.55);
      border: .5px solid rgba(255,255,255,.6);
      box-shadow: 0 1px 0 rgba(255,255,255,.7) inset;
      border-radius: 999px;
      gap: 0;
    }
    .pt-toggle button {
      padding: 5px 12px; border: 0; background: transparent;
      font-family: inherit; font-size: 12px; font-weight: 700;
      color: var(--t2); border-radius: 999px;
      cursor: pointer; transition: all .15s;
    }
    .pt-toggle button.on {
      background: rgba(255,255,255,.92); color: var(--t1);
      box-shadow: 0 1px 2px rgba(0,0,0,.06);
    }

    /* 담당 환자 리스트 (압축) */
    .pt-list {
      margin: 0 var(--page-pad);
      display: flex; flex-direction: column; gap: 8px;
      position: relative; z-index: 1;
    }
    .pt-row-c {
      display: flex; align-items: center; gap: 12px;
      padding: 12px 14px;
      background: var(--cg-card-bg);
      border: 0;
      border-radius: var(--cg-card-radius);
      cursor: pointer; transition: transform .1s;
      font-family: inherit; text-align: left; width: 100%;
      box-shadow: var(--cg-card-shadow);
    }
    .pt-row-c:active { transform: scale(.99); }

    .pt-row-info { flex: 1; min-width: 0; }
    .pt-row-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
    .pt-row-n {
      font-size: 14px; font-weight: 700; color: var(--t1);
      letter-spacing: -.2px; line-height: 1.25;
    }
    .pt-row-n .room { font-weight: 600; color: var(--t3); font-size: 12px; }
    .pt-row-pct {
      font-size: 12px; font-weight: 700; color: var(--t2);
      letter-spacing: -.2px; flex-shrink: 0;
      display: inline-flex; align-items: center; gap: 4px;
    }
    .pt-row-pct iconify-icon { font-size: 13px; color: var(--accent-strong); }
    .pt-row-pct .ok {
      color: var(--accent-strong);
      display: inline-flex; align-items: center; gap: 3px;
    }
    .pt-row-pct .warn { color: var(--palette-amber-700); }

    .pt-row-bar-wrap { margin-top: 6px; }
    .pt-row-bar {
      height: 4px; background: rgba(0,0,0,.05);
      border-radius: 999px; overflow: hidden;
    }
    .pt-row-bar > span {
      display: block; height: 100%;
      width: var(--bar-w, 0%);
      background: var(--t2);
      border-radius: 999px;
    }
    /* done: 바·아바타는 중성 톤 유지, 완료 텍스트+체크만 그린 (단일 원천) */
    .pt-row-c.done .pt-row-bar > span { background: rgba(0,0,0,.22); }
    .pt-row-c.done .av.lg.ok { background: rgba(0,0,0,.05); color: var(--t2); }
    .pt-row-c.warn .pt-row-bar > span { background: var(--color-warning); }

    /* 다음 할 것 한 줄 */
    .pt-row-next {
      margin-top: 4px;
      font-size: 11px; font-weight: 600; color: var(--t3);
      letter-spacing: -.1px; line-height: 1.35;
      display: flex; align-items: center; gap: 4px;
    }
    .pt-row-next iconify-icon { font-size: 12px; color: var(--t3); }
    .pt-row-next b { color: var(--t2); font-weight: 700; }
    .pt-row-c.done .pt-row-next { color: var(--t3); }
    .pt-row-c.warn .pt-row-next iconify-icon { color: var(--palette-amber-700); }
    .pt-row-c.warn .pt-row-next b { color: var(--palette-amber-700); }

    /* ============================================================
       L2 · 환자 상세 (그리드)
       ============================================================ */
    .head-back {
      display: flex; align-items: center; gap: 8px;
    }
    .head-nm { flex: 1; min-width: 0; }
    .head-nm .n {
      font-size: 17px; font-weight: 700; color: var(--t1);
      letter-spacing: -.3px; line-height: 1.2;
      display: inline-flex; align-items: baseline; gap: 6px; flex-wrap: wrap;
    }
    .head-nm .m { font-size: 11px; font-weight: 600; color: var(--t2); margin-top: 2px; }
    .head-pct {
      font-size: 11px; font-weight: 700; color: var(--t2);
      background: rgba(0,0,0,.05); padding: 1px 7px; border-radius: 999px;
      letter-spacing: -.1px;
    }

    /* 환자 프로필 (간략) */
    .profile {
      margin: 12px var(--page-pad) 0;
      padding: 12px 14px;
      background: var(--cg-card-bg);
      border: 0;
      border-radius: var(--cg-card-radius);
      box-shadow: var(--cg-card-shadow);
      position: relative; z-index: 1;
    }
    .pf-tags { display: flex; flex-wrap: wrap; gap: 5px; }
    .pf-tag {
      padding: 3px 8px;
      background: rgba(0,0,0,.04);
      border-radius: 999px;
      font-size: 11px; font-weight: 700; color: var(--t2);
      letter-spacing: -.2px;
    }
    .pf-tag.warn { background: var(--warn-soft); color: var(--palette-amber-700); }
    .pf-alert {
      display: flex; align-items: flex-start; gap: 6px;
      margin-top: 8px;
      font-size: 12px; font-weight: 700; color: var(--palette-amber-700);
      line-height: 1.4;
    }
    .pf-alert iconify-icon { font-size: 14px; flex-shrink: 0; margin-top: 1px; }

    /* 시간대 · 보호자앱 .pt-item 톤 (translucent) */
    .seg {
      margin: 14px var(--page-pad) 0;
      display: flex; gap: 4px; padding: 4px;
      background: rgba(255,255,255,.55);
      border: .5px solid rgba(255,255,255,.6);
      border-radius: 12px;
      box-shadow: 0 1px 0 rgba(255,255,255,.7) inset;
      position: relative; z-index: 1;
    }
    .seg-btn {
      flex: 1; height: 36px; border: 0; font-family: inherit;
      font-size: 13px; font-weight: 700; color: var(--t2);
      background: transparent; border-radius: 9px;
      cursor: pointer; transition: background .18s, color .18s;
    }
    .seg-btn.active {
      background: rgba(255,255,255,.92); color: var(--accent-strong);
      box-shadow: 0 1px 4px rgba(0,0,0,.06);
    }

    /* 진행 바 (얇게) */
    .pd-bar-wrap {
      margin: 12px var(--page-pad) 0;
      display: flex; align-items: center; gap: 10px;
      position: relative; z-index: 1;
    }
    .pd-bar { flex: 1; height: 4px; background: rgba(0,0,0,.06); border-radius: 999px; overflow: hidden; }
    .pd-bar > span {
      display: block; height: 100%;
      width: var(--bar-w, 0%);
      background: var(--accent);
      border-radius: 999px;
    }
    .pd-ratio { font-size: 12px; font-weight: 700; color: var(--t1); letter-spacing: -.2px; }
    .pd-ratio .u { color: var(--t3); font-weight: 700; }

    /* 2×4 그리드 */
    .grid8 {
      margin: 12px var(--page-pad) 0;
      display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
      position: relative; z-index: 1;
    }
    .g-card {
      position: relative;
      padding: 12px 12px 11px;
      background: var(--cg-card-bg);
      border: 0;
      border-radius: var(--cg-card-radius);
      cursor: pointer; transition: transform .1s;
      font-family: inherit; text-align: left;
      box-shadow: var(--cg-card-shadow);
      min-height: 108px;
      display: flex; flex-direction: column;
    }
    .g-card:active { transform: scale(.98); }
    .g-head {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 6px;
    }
    .g-ic {
      width: 28px; height: 28px; border-radius: 8px;
      background: rgba(0,0,0,.04);
      display: inline-flex; align-items: center; justify-content: center;
    }
    .g-ic iconify-icon { font-size: 16px; color: var(--t2); }
    .g-state {
      font-size: 10px; font-weight: 700; color: var(--t3);
      letter-spacing: .3px; text-transform: uppercase;
    }
    .g-card.done .g-ic { background: var(--color-accent-soft); }
    .g-card.done .g-ic iconify-icon { color: var(--accent-strong); }
    .g-card.done .g-state { color: var(--accent-strong); }
    .g-card.now .g-ic { background: var(--color-warning-soft); }
    .g-card.now .g-ic iconify-icon { color: var(--palette-amber-700); }
    .g-card.now .g-state { color: var(--palette-amber-700); }
    /* v3.2.8: now 강조는 token-based outline */
    .g-card.now {
      box-shadow: var(--cg-card-shadow), 0 0 0 1.5px var(--palette-amber-300);
    }
    .g-card.skip { opacity: .6; }
    .g-t {
      font-size: 14px; font-weight: 700; color: var(--t1);
      letter-spacing: -.2px; line-height: 1.25;
    }
    .g-v {
      margin-top: 4px;
      font-size: 13px; font-weight: 700; color: var(--t1);
      letter-spacing: -.2px; line-height: 1.3;
      flex: 1;
    }
    .g-card.idle .g-v { color: var(--t3); font-weight: 500; }
    .g-prev {
      margin-top: 6px;
      font-size: 10px; font-weight: 600; color: var(--t3);
      line-height: 1.3;
    }

    /* ============================================================
       L3 · 스텝퍼 (선택적)
       ============================================================ */
    .stepper {
      position: fixed; inset: 0; z-index: 200;
      background: var(--clinical-canvas);
      display: none; flex-direction: column;
    }
    .stepper.show { display: flex; }
    .stepper .bg2 {
      position: absolute; inset: 0; z-index: 0; pointer-events: none;
      background: var(--clinical-linear-canvas);
    }
    .st-header {
      position: relative; z-index: 2;
      padding: calc(var(--safe-t) + 4px) 20px 14px;
      background: transparent; /* v3.2.5: 흰 그라데이션 제거 — .bg 그린이 그대로 비치게 */
      backdrop-filter: blur(10px) saturate(140%);
      -webkit-backdrop-filter: blur(10px) saturate(140%);
    }
    .st-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
    .st-ctx { flex: 1; min-width: 0; text-align: center; }
    .st-ctx-top { font-size: 13px; font-weight: 700; color: var(--t2); letter-spacing: -.2px; }
    .st-ctx-top b { color: var(--t1); font-weight: 700; }
    .st-ctx-sub { font-size: 12px; font-weight: 600; color: var(--t3); margin-top: 1px; }
    .dots { display: flex; gap: 4px; justify-content: center; margin-bottom: 8px; }
    .dot { width: 22px; height: 3px; border-radius: 999px; background: rgba(0,0,0,.08); transition: background .25s; }
    .dot.done { background: var(--accent); }
    .dot.now  { background: var(--accent-strong); }
    .st-progress { height: 4px; background: rgba(var(--brand-green-500-rgb), .14); border-radius: 999px; overflow: hidden; }
    .st-progress > span {
      display: block; height: 100%;
      width: var(--bar-w, 0%);
      background: var(--accent);
      border-radius: 999px; transition: width .4s cubic-bezier(.4,0,.2,1);
    }
    .st-body { flex: 1; overflow-y: auto; padding: 20px 20px 24px; -webkit-overflow-scrolling: touch; position: relative; z-index: 1; }
    .step { display: none; animation: haru-fade-in-up var(--duration-slow, 350ms) var(--easing-standard) both; }
    .step.active { display: block; }
    .step-head { margin-bottom: 20px; }
    .step-kicker { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--accent-strong); letter-spacing: .4px; text-transform: uppercase; }
    .step-kicker iconify-icon { font-size: 13px; }
    .step-title { margin: 6px 0 0; font-size: 22px; font-weight: 700; color: var(--t1); letter-spacing: -.5px; line-height: 1.2; }
    .step-hint { margin: 4px 0 0; font-size: 13px; font-weight: 500; color: var(--t2); line-height: 1.45; }
    .sec { margin-top: 18px; }
    .sec-l { font-size: 12px; font-weight: 700; color: var(--t2); letter-spacing: .3px; margin-bottom: 8px; }
    .v-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .v-field { padding: 14px 14px 13px; background: rgba(255,255,255,.82); border: .5px solid rgba(255,255,255,.9); border-radius: 14px; box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 2px 8px rgba(0,0,0,.03); cursor: pointer; transition: transform .1s; font-family: inherit; text-align: left; }
    .v-field:active { transform: scale(.99); }
    .v-field.full { grid-column: 1 / -1; }
    .v-field-l { font-size: 11px; font-weight: 700; color: var(--t3); letter-spacing: .3px; text-transform: uppercase; }
    .v-field-v { margin-top: 6px; font-size: 22px; font-weight: 700; color: var(--t1); letter-spacing: -.5px; line-height: 1; }
    .v-field-v .u { font-size: 12px; font-weight: 600; color: var(--t3); margin-left: 3px; }
    .v-field.warn .v-field-v { color: var(--palette-amber-700); }
    .opts { display: grid; grid-template-columns: repeat(var(--opts-cols, 3), 1fr); gap: 6px; }
    .opt { padding: 11px 6px; background: rgba(255,255,255,.82); border: 1px solid transparent; border-radius: 12px; font-family: inherit; font-size: 14px; font-weight: 700; color: var(--t2); letter-spacing: -.2px; cursor: pointer; transition: all .15s; }
    .opt:active { transform: scale(.97); }
    .opt.on { background: var(--accent-soft); color: var(--accent-strong); border-color: rgba(var(--brand-green-500-rgb), .3); }
    .chks { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .chk { display: flex; align-items: center; gap: 10px; padding: 13px 12px; background: rgba(255,255,255,.82); border: 1px solid transparent; border-radius: 12px; font-family: inherit; cursor: pointer; transition: all .15s; text-align: left; }
    .chk:active { transform: scale(.99); }
    .chk-dot { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid rgba(0,0,0,.18); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all .15s; }
    .chk-dot iconify-icon { font-size: 13px; color: var(--palette-white); opacity: 0; }
    .chk.on { background: var(--accent-soft); border-color: rgba(var(--brand-green-500-rgb), .3); }
    .chk.on .chk-dot { background: var(--accent); border-color: var(--accent); }
    .chk.on .chk-dot iconify-icon { opacity: 1; }
    .chk-t { font-size: 14px; font-weight: 700; color: var(--t1); letter-spacing: -.2px; }
    .chk.on .chk-t { color: var(--accent-strong); }
    .tx { width: 100%; min-height: 100px; padding: 13px 14px; background: rgba(255,255,255,.82); border: 1px solid transparent; border-radius: 14px; font-family: inherit; font-size: 14px; line-height: 1.5; color: var(--t1); resize: none; outline: none; transition: border-color .15s, background .15s; }
    .tx:focus { border-color: rgba(var(--brand-green-500-rgb), .4); background: rgba(255,255,255,.95); }
    .st-foot { flex-shrink: 0; padding: 12px 20px calc(var(--safe-b) + 14px); background: rgba(255,255,255,.82); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: .5px solid rgba(0,0,0,.05); display: flex; gap: 10px; position: relative; z-index: 2; }
    .btn-prev { flex: 0 0 96px; background: rgba(0,0,0,.05); color: var(--t2); }
    .btn-prev:disabled { opacity: .4; cursor: default; }
    .btn-next, .btn-done { flex: 1; background: var(--accent); color: var(--palette-white); box-shadow: 0 3px 10px rgba(var(--brand-green-500-rgb), .22); }

    /* ============================================================
       바텀시트 (빠른 기록 / 음성 결과)
       ============================================================ */
    .bs {
      position: fixed; inset: 0; z-index: 250;
      background: rgba(0,0,0,.4);
      display: none; align-items: flex-end; justify-content: center;
      opacity: 0; transition: opacity .22s;
    }
    .bs.show { display: flex; opacity: 1; }
    /* 바텀시트 · 보호자앱 .sheet 글래스 톤 */
    .bs-sheet {
      width: 100%; max-width: 430px;
      background: rgba(250,252,251,.92);
      backdrop-filter: blur(32px) saturate(150%) brightness(1.02);
      -webkit-backdrop-filter: blur(32px) saturate(150%) brightness(1.02);
      border-top: .5px solid rgba(255,255,255,.88);
      border-radius: 22px 22px 0 0;
      padding: 18px var(--page-pad) calc(var(--safe-b) + 18px);
      transform: translateY(100%);
      transition: transform .28s cubic-bezier(.22,.61,.36,1);
      max-height: 82vh; overflow-y: auto;
      box-shadow: 0 -6px 32px rgba(0,0,0,.08), 0 -1px 0 rgba(255,255,255,.6);
    }
    .bs.show .bs-sheet { transform: translateY(0); }
    .bs-grab {
      width: 40px; height: 4px; border-radius: 999px;
      background: rgba(0,0,0,.14); margin: 0 auto 14px;
    }
    .bs-head {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: 14px;
    }
    .bs-t { font-size: 18px; font-weight: 700; color: var(--t1); letter-spacing: -.4px; line-height: 1.2; }
    .bs-s { font-size: 12px; font-weight: 600; color: var(--t2); margin-top: 2px; }
    .bs-close {
      width: 34px; height: 34px; border-radius: 50%;
      background: rgba(0,0,0,.05); border: 0;
      display: inline-flex; align-items: center; justify-content: center;
      cursor: pointer; font-family: inherit;
    }
    .bs-close iconify-icon { font-size: 16px; color: var(--t2); }

    /* 환자 셀렉터 */
    .bs-pt {
      display: flex; gap: 6px; overflow-x: auto;
      margin: 0 calc(-1 * var(--page-pad)) 14px;
      padding: 0 var(--page-pad);
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
    }
    .bs-pt::-webkit-scrollbar { display: none; }
    .bs-pt-c {
      flex-shrink: 0; display: inline-flex; align-items: center; gap: 7px;
      padding: 6px 11px 6px 6px;
      background: rgba(0,0,0,.04);
      border: 1px solid transparent; border-radius: 999px;
      cursor: pointer; font-family: inherit;
      transition: all .15s;
    }
    .bs-pt-c:active { transform: scale(.98); }
    .bs-pt-nm { font-size: 13px; font-weight: 700; color: var(--t1); letter-spacing: -.2px; }
    .bs-pt-rm { font-size: 10px; font-weight: 700; color: var(--t3); margin-left: 2px; }
    .bs-pt-c.on {
      background: var(--accent-soft);
      border-color: rgba(var(--brand-green-500-rgb), .3);
    }
    .bs-pt-c.on .bs-pt-nm { color: var(--accent-strong); }
    .bs-pt-c.on .av { background: var(--accent); color: var(--palette-white); }

    /* 바이탈 필드 (바텀시트 내부) */
    .bs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .bs-f {
      padding: 13px 13px 12px;
      background: rgba(0,0,0,.03);
      border: 1px solid transparent; border-radius: 12px;
      cursor: pointer; text-align: left; font-family: inherit;
      transition: all .15s;
    }
    .bs-f:active { transform: scale(.98); }
    .bs-f.on { background: var(--accent-soft); border-color: rgba(var(--brand-green-500-rgb), .3); }
    .bs-f.full { grid-column: 1 / -1; }
    .bs-f-l { font-size: 11px; font-weight: 700; color: var(--t3); letter-spacing: .2px; text-transform: uppercase; }
    .bs-f-v { margin-top: 5px; font-size: 20px; font-weight: 700; color: var(--t1); letter-spacing: -.4px; line-height: 1; }
    .bs-f-v .u { font-size: 11px; font-weight: 600; color: var(--t3); margin-left: 2px; }
    .bs-f-prev { margin-top: 4px; font-size: 10px; font-weight: 600; color: var(--t3); }

    .bs-foot {
      display: flex; gap: 8px; margin-top: 16px;
    }
    .bs-btn {
      flex: 1; height: 52px; border-radius: 14px; border: 0;
      font-family: inherit; font-size: 15px; font-weight: 700;
      letter-spacing: -.2px;
      display: inline-flex; align-items: center; justify-content: center; gap: 5px;
      cursor: pointer; transition: transform .1s;
    }
    .bs-btn:active { transform: scale(.97); }
    .bs-btn.ghost { background: rgba(0,0,0,.05); color: var(--t2); flex: 0 0 auto; padding: 0 18px; }
    .bs-btn.primary {
      background: var(--accent);
      color: var(--palette-white); box-shadow: 0 3px 10px rgba(var(--brand-green-500-rgb), .22);
    }
    .bs-btn iconify-icon { font-size: 17px; }

    /* 음성 결과 프리뷰 */
    .voice-prev {
      padding: 14px;
      background: rgba(var(--brand-green-500-rgb), .08);
      border-radius: 14px;
      border: .5px solid rgba(var(--brand-green-500-rgb), .2);
      margin-bottom: 14px;
    }
    .voice-prev-l { font-size: 11px; font-weight: 700; color: var(--accent-strong); letter-spacing: .3px; text-transform: uppercase; }
    .voice-prev-q { margin-top: 6px; font-size: 14px; font-weight: 700; color: var(--t1); line-height: 1.45; }
    .voice-prev-q::before { content: '"'; color: var(--t3); }
    .voice-prev-q::after { content: '"'; color: var(--t3); }

    /* ============ 탭바 + SOS ============ */
    /* v3.2.7: .bottom-bar / .tabbar / .tab 로컬 정의 제거 — caregiver.css가 SoT (4-b 섹션) */

    /* Toast */
/* 등장 */
    @keyframes haru-fade-in-up {
      from { opacity: 0; transform: translateY(8px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .now-card, .pt-toggle-row, .pt-list, .quick-head, .quick,
    .profile, .seg, .pd-bar-wrap, .grid8 { animation: haru-fade-in-up var(--duration-slow, 350ms) var(--easing-standard) both; }

    /* Inline 대체 (audit 정책: inline 0) */
    .sec-l--gap-b   { margin-bottom: 8px; }
    .sec-l--gap-tb  { margin-top: 14px; margin-bottom: 8px; }
    .bs-f--warn { background: var(--color-warning-soft); }
    .bs-f--warn .bs-f-l,
    .bs-f--warn .bs-f-v { color: var(--palette-amber-700); }
    .kp-btn { flex: 1; }
    .kp-btn--cancel { background: var(--palette-gray-100); color: var(--color-text-secondary); }