.app-shell { max-width: 430px; margin: 0 auto; }

    /* 미확인 요약 — count 기준 통일: 항상 "전체 미확인" 만 노출 */
    .summary-bar {
      display: flex; align-items: center; gap: var(--space-3);
      padding: var(--space-4) var(--space-5);
      background: var(--color-accent-soft);
      border-radius: var(--radius-card);
      cursor: pointer;
      text-decoration: none; color: inherit;
    }
    .summary-bar__dot {
      width: 8px; height: 8px; border-radius: var(--radius-pill);
      background: var(--color-accent);
      flex-shrink: 0;
      animation: haru-pulse 2s ease-in-out infinite;
    }
    .summary-bar__text { font-size: var(--text-callout); font-weight: var(--weight-semibold); flex: 1; line-height: 1.4; }
    .summary-bar__text b { color: var(--color-accent); }
    .summary-bar iconify-icon { color: var(--color-text-tertiary); font-size: var(--size-icon-sm); }

    /* 필터 칩 row */
    .filter-row {
      display: flex; gap: var(--space-2);
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      padding-right: var(--space-5);
      mask-image: linear-gradient(90deg, black 88%, transparent 100%);
      -webkit-mask-image: linear-gradient(90deg, black 88%, transparent 100%);
    }

    /* 섹션 라벨 */
    .sec-label {
      display: flex; align-items: center; gap: var(--space-3);
      padding: var(--space-3) var(--space-1) var(--space-2);
      cursor: pointer;
    }
    .sec-label__text {
      font-size: var(--text-mini); font-weight: var(--weight-bold);
      color: var(--color-text-secondary); letter-spacing: 0.2px;
    }
    .sec-label__count {
      font-size: var(--text-mini); font-weight: var(--weight-bold);
      color: var(--color-accent);
      background: var(--color-accent-soft);
      padding: 2px 9px; border-radius: var(--radius-pill);
    }
    .sec-label__chevron {
      margin-left: auto; color: var(--color-text-tertiary);
      transition: transform var(--motion-transition) var(--easing-standard);
    }
    .sec-label.is-collapsed .sec-label__chevron { transform: rotate(-90deg); }

    .msg-list {
      display: flex; flex-direction: column; gap: var(--space-2);
      overflow: hidden;
      transition: max-height var(--motion-transition) var(--easing-standard),
                  opacity var(--motion-micro) var(--easing-standard);
    }
    .msg-list.is-collapsed { max-height: 0 !important; opacity: 0; }

    /* 메시지 카드 — 일반 / 업무성 차등 */
    .msg-item {
      display: flex; align-items: center; gap: var(--space-4);
      padding: var(--space-4) var(--space-5);
      background: var(--color-bg-surface);
      border: 1px solid var(--color-border-subtle);
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-1);
      text-decoration: none; color: inherit;
      transition: var(--motion-micro) var(--easing-standard);
    }
    .msg-item:active { transform: scale(0.98); }
    .msg-item.is-unread { border-color: rgba(var(--color-accent-rgb), 0.18); }

    .av {
      width: 44px; height: 44px; border-radius: var(--radius-pill);
      display: flex; align-items: center; justify-content: center;
      font-weight: var(--weight-bold); color: var(--color-accent-on);
      flex-shrink: 0; position: relative; overflow: hidden;
    }
    .av img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
    .av--nurse  { background: var(--brand-blue-500); }
    .av--family { background: var(--brand-orange-400); }
    .av--doctor { background: var(--brand-green-500); }
    .av--system {
      background: var(--color-bg-canvas); color: var(--color-text-secondary);
      border: 1px solid var(--color-border-subtle);
    }
    /* 의미별 컬러 변형 — soft 배경 + 진한 아이콘 색 */
    .av--system.is-care     { background: var(--color-danger-soft);  color: var(--color-danger);      border-color: transparent; }
    .av--system.is-med      { background: var(--color-success-soft); color: var(--brand-green-700);   border-color: transparent; }
    .av--system.is-food     { background: var(--color-warning-soft); color: var(--palette-amber-700); border-color: transparent; }
    .av--system.is-schedule { background: var(--color-info-soft);    color: var(--color-info);        border-color: transparent; }
    .av--system.is-billing  { background: rgba(139,92,246,.10);      color: var(--avatar-manager);                  border-color: transparent; }
    .av--online::after {
      content: ''; position: absolute; bottom: 1px; right: 1px;
      width: 11px; height: 11px; border-radius: var(--radius-pill);
      background: var(--color-success);
      border: 2.5px solid var(--color-bg-surface);
    }

    .msg-body { flex: 1; min-width: 0; }
    .msg-name-row { display: flex; align-items: center; gap: var(--space-2); margin-bottom: 2px; }
    .msg-name { font-size: var(--text-callout); font-weight: var(--weight-bold); white-space: nowrap; }
    .msg-preview {
      font-size: var(--text-caption); color: var(--color-text-secondary);
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .msg-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
    .msg-time { font-size: var(--text-mini); color: var(--color-text-tertiary); font-weight: var(--weight-medium); }
    .msg-badge {
      background: var(--color-accent); color: var(--color-accent-on);
      font-size: 11px; font-weight: var(--weight-bold);
      border-radius: var(--radius-pill);
      padding: 1px 7px; min-width: 20px; text-align: center; line-height: 18px;
    }

    /* 카테고리 라벨 — Soft-fill pill (옵션 2: 디자인 시스템 기본 .badge) */
    .msg-name-row .badge {
      height: 16px;
      padding: 0 7px;
      border-radius: 999px;
      font-size: 10.5px; font-weight: 700;
      line-height: 1;
      display: inline-flex; align-items: center;
      letter-spacing: 0;
      text-transform: none;
    }
    .msg-name-row .badge--info    { background: var(--color-accent-soft);  color: var(--color-accent);  }
    .msg-name-row .badge--success { background: var(--color-success-soft); color: var(--color-success); }
    .msg-name-row .badge--warning { background: var(--color-warning-soft); color: var(--palette-amber-700); }
    .msg-name-row .badge--critical{ background: var(--color-danger-soft);  color: var(--color-danger);  }

    /* msg-cta는 system/components.css?v=20260523e 표준 사용 (v3.2.14) */

    .stack { padding-top: var(--space-5); }

    /* 진입 애니메이션 — 섹션 라벨 + 메시지 아이템 스태거 */
    .sec-label {
      animation: haru-fade-in-up var(--motion-enter) var(--easing-standard) both;
      animation-delay: 150ms;
    }
    .msg-item {
      animation: haru-fade-in-up var(--motion-enter) var(--easing-standard) both;
    }
    .msg-list > .msg-item:nth-child(1) { animation-delay: 200ms; }
    .msg-list > .msg-item:nth-child(2) { animation-delay: 260ms; }
    .msg-list > .msg-item:nth-child(3) { animation-delay: 320ms; }
    .msg-list > .msg-item:nth-child(4) { animation-delay: 380ms; }
    .msg-list > .msg-item:nth-child(5) { animation-delay: 440ms; }
    .msg-list > .msg-item:nth-child(n+6) { animation-delay: 500ms; }
    @media (prefers-reduced-motion: reduce) {
      .sec-label, .msg-item { animation: none !important; }
    }