/* 우리 아이 수첩 /mypet (pet.css·apt.css 위에 얹음) */
.mypet-page .pt-main { padding-bottom: calc(5rem + var(--safe-b)); }
.mypet-page .pt-foot { padding-bottom: calc(5rem + var(--safe-b)); }
.mp-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; justify-content: center; background: rgba(255,255,255,.97); border-top: 1px solid var(--line); padding-bottom: var(--safe-b); box-shadow: 0 -4px 16px rgba(19,42,56,.06); }
.mp-nav a { flex: 1; max-width: 8rem; height: 3.75rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .125rem; color: var(--muted); text-decoration: none; font-size: .75rem; font-weight: 650; min-width: 0; }
.mp-nav a i { font-style: normal; font-size: 1.25rem; line-height: 1; filter: grayscale(.6); }
.mp-nav a.on { color: var(--navy); font-weight: 800; }
.mp-nav a.on i { filter: none; }
.mp-switch { display: flex; gap: .375rem; overflow-x: auto; scrollbar-width: none; }
.mp-switch button { flex: none; border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: .5rem .875rem; font-weight: 700; color: var(--muted); }
.mp-switch button.on { background: var(--navy); color: #fff; border-color: var(--navy); }
.mp-pet { display: flex; gap: .875rem; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 1rem; padding: .875rem; box-shadow: var(--shadow); }
.mp-pet h1 { margin: 0; font-size: 1.5rem; color: var(--navy); }
.mp-pet p { margin: .125rem 0 0; color: var(--muted); }
.mp-pet small { color: var(--muted); font-size: .75rem; }
.mp-pet > div { flex: 1; min-width: 0; }
.mp-edit { color: var(--navy-2); font-weight: 700; text-decoration: none; font-size: .875rem; }
.mp-ph { flex: none; width: 4.5rem; height: 4.5rem; border-radius: 50%; overflow: hidden; background: var(--soft); display: flex; align-items: center; justify-content: center; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line); text-decoration: none; padding: 0; }
.mp-ph span { font-size: 2.25rem; }
.mp-ph img { width: 100%; height: 100%; object-fit: cover; }
.mp-ph.big { width: 7rem; height: 7rem; margin: 0 auto; }
.mp-claim { display: flex; justify-content: space-between; align-items: center; gap: .75rem; background: #fbf1dc; border: 1px solid #ecd9a8; border-radius: 1rem; padding: .875rem 1rem; text-decoration: none; color: #6b4e10; }
.mp-claim small { display: block; font-size: .8125rem; }
.mp-claim b { font-size: 1.5rem; color: var(--navy); }
.mp-claim em { font-style: normal; font-weight: 800; color: var(--navy); white-space: nowrap; }
.mp-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .375rem; }
.mp-quick a { display: flex; flex-direction: column; align-items: center; gap: .25rem; background: #fff; border: 1px solid var(--line); border-radius: .875rem; padding: .75rem .25rem; text-decoration: none; color: var(--navy); font-weight: 700; font-size: .8125rem; text-align: center; }
.mp-quick a i { font-style: normal; font-size: 1.5rem; line-height: 1; }
.mp-ev { list-style: none; margin: 0; padding: 0; display: grid; gap: .375rem; }
.mp-ev li { display: flex; justify-content: space-between; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid var(--line); }
.mp-ev b, .mp-dd { color: var(--navy); }
.mp-ev b.late { color: var(--danger); }
.mp-amt { color: var(--navy); }
.pt-tiles b.sm { font-size: 1.25rem; }
.pt-tiles b a { font-size: .9375rem; }
.mp-pick { display: grid; gap: .375rem; }
.mp-pick label { display: flex; align-items: center; gap: .625rem; border: 1px solid var(--line); border-radius: .75rem; padding: .625rem .75rem; background: #fff; }
.mp-pick input { width: 1.25rem; height: 1.25rem; accent-color: var(--navy); flex: none; }
.mp-pick span { flex: 1; min-width: 0; }
.mp-pick b { display: block; color: var(--navy); }
.mp-pick small { color: var(--muted); font-size: .8125rem; }
.mp-pick em { font-style: normal; font-weight: 800; color: var(--navy); white-space: nowrap; }
.mp-tips { margin: 0; padding-left: 1.125rem; display: grid; gap: .375rem; font-size: .9375rem; }
.mp-evc.done { opacity: .6; }
.mp-evc .ap-meta { gap: .375rem; }
.mp-evc .btn { width: auto; }
.mp-evc .lnk { background: none; border: 0; color: var(--muted); font-size: .75rem; text-decoration: underline; padding: 0; }
.ap-thumbs button { cursor: zoom-in; }