/* 지첩함 종류 막대·버튼 색·광택·백업 알림 — 2026-10-31 구조 정리로 index.html <style> 1218~1264줄에서 옮김. 파일 번호 순서대로 읽어야 함(뒤 규칙이 앞 규칙을 덮음) */
/* ★ 종류별 보기 = 한 덩어리 선택 막대 (2026-10-16 사용자 결정 안 B): 옅은 회색 막대 안에서 고른 칸만 채움, 칸은 막대 폭을 똑같이 나눠 넓게
   고른 칸 색: 지첩함 = 따뜻한 회색(--pick, [백업파일 만들기]와 같음) / 1:1 감정 = 1:1 황금색 */
.saved-filters{flex:1;min-width:0;display:flex;flex-wrap:nowrap;gap:2px;padding:3px;margin:0 26px 0 0;border-radius:999px;background:rgba(0,0,0,.055);box-sizing:border-box}
.saved-filters .chat-pill{flex:1 1 0;min-width:0;text-align:center;white-space:nowrap;padding:8px 10px;border:0;border-radius:999px;font-size:.82rem;line-height:normal;color:var(--muted);background:transparent;transition:background-color .18s ease,color .18s ease,box-shadow .18s ease}
.saved-filters .chat-pill:not(:disabled):not([aria-pressed="true"]){color:var(--ink)}
@media (hover:hover){.saved-filters .chat-pill:not(:disabled):not([aria-pressed="true"]):hover{background:rgba(255,255,255,.7)}}
.saved-filters .chat-pill:disabled{opacity:.4}
#home-saved-filters .chat-pill[aria-pressed="true"]{font-weight:600;color:var(--vault-pick-ink)}
#counsel #cb-filters .chat-pill[aria-pressed="true"]{border-color:transparent;font-weight:600}
@media (max-width:599px){
  .saved-filters{gap:1px;padding:3px;margin-right:16px;overflow-x:auto;scrollbar-width:none}
  .saved-filters .chat-pill{flex:1 1 0;padding:8px 4px;font-size:.78rem} /* 2026-10-23: 위아래 8px로 통일 (폰 글자는 백업 버튼 폰 크기와 같은 0.78rem) */
  #counsel #cb-filters{flex:0 0 auto;width:calc((100% - 26px) * 4 / 5 + 9px)} /* 1:1 = 지첩함 칸 4개 폭 (2026-11-05 저녁 유료 오늘 운세 칸 다시 넣음 — 칸 n개 = n×칸 + (n−1)×틈 1px + 안쪽 여백 6px) */
}
/* 1:1 감정은 칸 4개(전체·운세·사주·테마 — 2026-11-05 저녁 유료 오늘 운세 칸 다시 넣음) — 칸 하나의 폭을 지첩함(칸 5개)과 같게, 그래서 막대 전체는 짧음 (2026-10-16 사용자 결정)
   칸 n개 = n×칸 + (n−1)×틈 2px + 안쪽 여백 6px (칸 3개였을 때 +10px) */
@media (min-width:600px){ #counsel #cb-filters{flex:0 0 auto;width:calc((100% - 40px) * 4 / 5 + 12px)} }
/* ★ 지첩함 버튼 색 (2026-10-16 사용자 결정): 고른 종류 칸·[백업파일 만들기]·백업 창 버튼을 한 색으로, 입력 화면의 --pick(#a7a199)보다 짙게 — 바꿀 땐 여기 한 곳만 */
:root{--vault-pick:#7b746a;--vault-pick-ink:#fff}

#home-backup .backup-btn.is-primary{background:var(--vault-pick);border-color:var(--vault-pick);color:var(--vault-pick-ink)}
#home-backup .backup-btn{border-color:var(--vault-pick)}
#home-backup-ov .bk-card .share-actions .is-primary{background:var(--vault-pick);color:var(--vault-pick-ink)}
#home-backup-ov .bk-card .share-actions button{border-radius:999px} /* 2026-10-22 사용자 결정: 백업 창 버튼도 알약 모양 (궁합 템플릿 "버튼 모양은 알약") — 공유 이미지 창은 Ⓑ 때 */
/* ★ 광택 효과 (2026-10-16 사용자 결정): 주메뉴 [~ 보기] 버튼과 같은 효과(위 밝게→아래 짙게 + 윗가장자리 빛 + 그림자)
   지첩함 = 회갈색(--vault-pick), 1:1 감정 = 황금색(--counsel-*) — 위 고른 칸과 아래 버튼 */
:root{--vault-top:#a49d93;--vault-bot:#59534a}
#home-saved-filters .chat-pill[aria-pressed="true"]{background:linear-gradient(180deg,var(--vault-top) 0%,var(--vault-pick) 55%,var(--vault-bot) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 5px rgba(60,50,30,.22)}
#home-backup .backup-btn.is-primary,#home-backup-ov .bk-card .share-actions .is-primary{background:linear-gradient(180deg,var(--vault-top) 0%,var(--vault-pick) 55%,var(--vault-bot) 100%);border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 10px rgba(60,50,30,.18)}
@media (hover:hover){#home-backup .backup-btn.is-primary:hover{background:linear-gradient(180deg,var(--vault-top) 0%,var(--vault-pick) 55%,var(--vault-bot) 100%);filter:brightness(1.05)}}
#counsel #cb-filters .chat-pill[aria-pressed="true"]{background:linear-gradient(180deg,var(--counsel-top) 0%,var(--counsel-main) 55%,var(--counsel-bot) 100%);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 5px rgba(60,50,30,.22)}
#counsel #counsel-save,#counsel #counsel-new{background:linear-gradient(180deg,var(--counsel-top) 0%,var(--counsel-main) 55%,var(--counsel-bot) 100%);color:#fff;font-weight:600;border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 10px rgba(60,50,30,.18)}
#counsel #counsel-save:disabled,#counsel #counsel-new:disabled{opacity:.4;box-shadow:none;cursor:default}
/* 2026-10-23 사용자 결정 안 B: 1:1 하단 버튼도 백업 버튼처럼 "채움 + 테두리" 짝 — [지첩함에 저장] 파랑 광택 채움 / [새 상담] 파랑 테두리, 크기 0.82rem · 위아래 8px */
#counsel .counsel-actions .chat-pill{font-size:.82rem;line-height:normal;font-weight:600;padding:8px 14px}
#counsel #counsel-new{background:var(--surface);color:var(--counsel-main);border:1px solid var(--counsel-main);box-shadow:none}
@media (hover:hover){#counsel #counsel-new:not(:disabled):hover{background:var(--counsel-bubble-bg)}}
@media (max-width:420px){#counsel .counsel-actions .chat-pill{font-size:.78rem;padding:8px 12px}}
/* 2026-10-23: 광택(그라데이션) 버튼 윗가장자리 짙은 줄 없앰 — 투명 테두리 자리에 그라데이션 끝 색이 되풀이되어 찍히던 것 (그라데이션을 테두리 바깥 끝부터 칠함) */
button,.chat-pill,.submit-btn,.chat-send,.backup-btn,.share-btn{background-origin:border-box !important}
/* ★ 백업 알림 (2026-10-22 사용자 결정 A+B, 팝업 없음)
   A 지첩함 백업 줄 "· 백업 안 한 항목 N개" — 알릴 때(3개 이상 또는 7일)만 분홍(--mark)·굵게
   B 저장 완료 안내 아래 한 줄 "백업하지 않은 항목이 N개예요. 백업하기 ›" */
.backup-count{white-space:nowrap}
.backup-count.is-alert{color:var(--mark,#e0729a);font-weight:700}
.bk-nudge{display:block;margin-top:8px;font-size:.84rem;line-height:1.5;color:var(--muted)}
.load-card:not(.is-done) .bk-nudge{display:none}
#counsel .chat-bubble .bk-nudge{margin-top:4px;font-size:.82rem}
