/* ============================================================
   DATASMITH Pet — Premium Minimalism 오버레이 (v2.29.0)
   unify.css / mobile-drawer.css 뒤에서 로드됩니다.
   폰트·데이터·기능 그대로, 터치·간격·상태·모션만 통일합니다.
   ============================================================ */
:root{--ds-lav:#6E58B8;--ds-lav-soft:#C3B4F2}

/* ---------- 버튼: 한 손 조작 터치 영역 48px ---------- */
.btn{min-height:48px;border-radius:var(--ds-r-md,12px);transition:filter var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1)),transform var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1)),opacity var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.btn:active{transform:scale(.98);filter:brightness(.94)}
.btn:disabled{opacity:.5;transform:none}
.btn-sm{min-height:42px;border-radius:10px}
.btn-block{width:100%}

/* ---------- 입력: 16px·46px (모바일 자동 확대 방지·터치 안정) ---------- */
.input,.select{min-height:var(--ds-input-h,46px);font-size:var(--ds-input-font,16px);border-radius:10px;transition:border-color var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1)),box-shadow var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.input:focus,.select:focus{outline:none;box-shadow:0 0 0 3px rgba(110,88,184,.22);border-color:var(--ds-lav)}
textarea.input{min-height:120px;line-height:1.7}
.field label{letter-spacing:.02em}

/* ---------- 카드 ---------- */
.card{border-radius:var(--ds-r-lg,16px);box-shadow:0 1px 2px rgba(20,16,40,.06),0 8px 24px rgba(20,16,40,.06);transition:box-shadow var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.card-head{letter-spacing:-.01em}

/* ---------- 칩 · 스위치: 라벤더 포인트 ---------- */
.chip{min-height:40px;border-radius:var(--ds-r-pill,999px);transition:background-color var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1)),border-color var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.chip.on{border-color:var(--ds-lav);box-shadow:inset 0 0 0 1px var(--ds-lav)}
.switch{transition:background-color var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.switch.on{box-shadow:0 0 0 2px rgba(110,88,184,.28)}
.nav-item.on{box-shadow:inset 3px 0 0 var(--ds-lav)}

/* ---------- 모달 사방 여백 (v2.30.4) — 상하좌우 적당한 공간 확보 ---------- */
.modal,.modal.wide{width:calc(100vw - 32px);max-height:calc(100dvh - 48px);border-radius:16px}
.modal.wide{width:calc(100vw - 32px)}
/* 모바일에서도 중앙 부동 카드 유지 — 하단 고정 규칙(위치+transform 무력화)을 여백 있는 중앙 정렬로 복원 */
@media (max-width:767px){
  .modal,.modal.wide{left:50%;right:auto;top:50%;bottom:auto;margin:0;transform:translate(-50%,-50%)}
  .modal.on,.modal.on.wide{transform:translate(-50%,-50%) scale(1)}
}
@media (min-width:768px){
  .modal{width:min(560px,calc(100vw - 64px))}
  .modal.wide{width:min(720px,calc(100vw - 64px))}
  .modal,.modal.wide{max-height:calc(100vh - 64px)}
}
.icon-btn{border-radius:10px}
.icon-btn:active{transform:scale(.94)}

/* ---------- 플로팅 버튼 · 기타 ---------- */
.fab{border-radius:var(--ds-r-pill,999px);box-shadow:0 10px 28px rgba(20,16,40,.22);transition:transform var(--ds-dur,.22s) var(--ds-ease,cubic-bezier(.25,.6,.25,1))}
.fab:active{transform:scale(.94)}
.avatar-stack .a{border-radius:var(--ds-r-pill,999px)}

/* ---------- 모바일 보강 ---------- */
@media (max-width:767px){
  .grid2{gap:10px}
  .card-pad{padding:14px 16px}
  .m-body{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
}

/* 기록 추가 메뉴 모달 — 표준 폭에서 2열 구성 정돈 (v2.32.0) */
.modal .quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.modal .quick-grid .qbtn:last-child:nth-child(odd){grid-column:1/-1}

/* 모달 여백 최종 보장 — 어떤 규칙과 충돌해도 유지 (v2.33.0) */
html .modal,html .modal.wide{max-height:calc(100dvh - 48px)!important;height:auto!important}
@media (max-width:767px){
  html .modal,html .modal.wide{left:50%!important;right:auto!important;top:50%!important;bottom:auto!important;margin:0!important;transform:translate(-50%,-50%)!important}
}

/* 상단바 우측 정렬 — 로고 왼쪽, 버튼群 오른쪽 (v2.33.0) */
.topbar .tb-right{margin-left:auto}
@media (max-width:767px){ .topbar .tb-btn{display:inline-flex} .topbar .tb-right .tb-btn[style*="pointer-events"], .topbar .tb-right span.tb-btn{display:none} }