/* 우리집 초이스: 건강/습관 (habit.js). 장부 톤: 흰 바탕, 제목 아래 2px 검은 선, 1px 행 선, 얇은 테두리, 선택은 검은 채움. 토큰만 씀 */
.hb,.hb-sheet{word-break:keep-all;overflow-wrap:break-word}
.hb-sub{margin:-6px 0 0;font-size:13px;color:var(--ink-3);display:flex;align-items:center;gap:6px}
.hb-sub i{width:8px;height:8px;border-radius:999px;flex:none}
.hb-body{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.hb-c1,.hb-c2{display:flex;flex-direction:column;gap:22px;min-width:0}
@media (min-width:1100px){.hb-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}}
.hb-sec{display:flex;flex-direction:column;gap:0;min-width:0}
.hb-sec .bc-h b{display:inline-flex;align-items:baseline;gap:8px}
.hb-cnt{font-size:13px;font-weight:700;color:var(--ink-2)}
.hb-sec .bc-h>span b{color:var(--ink);font-weight:900;font-size:13px}
.hb-done{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:800;color:var(--ink)!important}

/* 주간 띠 */
.hb-wk{display:grid;grid-template-columns:28px repeat(7,minmax(0,1fr)) 28px;align-items:center;gap:2px;border:1px solid var(--line);border-radius:14px;padding:6px 4px;background:var(--surface)}
.hb-wn{width:28px;height:28px;border:0;background:none;color:var(--ink-3);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}
.hb-wd{display:flex;flex-direction:column;align-items:center;gap:1px;border:0;background:none;font:inherit;color:var(--ink);padding:6px 0 4px;border-radius:10px;cursor:pointer;min-width:0}
.hb-wd small{font-size:11px;color:var(--ink-3)}
.hb-wd small.red{color:#D93B30}.hb-wd small.blue{color:#2F5BFF}
.hb-wd b{font-size:15px;font-weight:800;line-height:20px}
.hb-wd.fut b{color:var(--ink-3);font-weight:600}
.hb-wd.today b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.hb-wd[aria-pressed="true"]{background:var(--ink);color:var(--surface)}
.hb-wd[aria-pressed="true"] small,.hb-wd[aria-pressed="true"] b{color:var(--surface)}
.hb-mk{height:14px;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.hb-wd[aria-pressed="true"] .hb-mk{color:var(--surface)}
.hb-dot{display:block;width:4px;height:4px;border-radius:999px;background:var(--ink-4)}

/* 목표 한 줄 */
.hb-list{display:flex;flex-direction:column}
.hb-row{display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 0;border-bottom:1px solid var(--line-2)}
.hb-ck{flex:none;width:28px;height:28px;border-radius:8px;border:1.5px solid #C9CED6;background:var(--surface);color:var(--surface);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}
.hb-row.ok .hb-ck{background:var(--ink);border-color:var(--ink)}
.hb-ck:disabled{cursor:default}
.hb-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hb-t b{font-size:15px;font-weight:700;line-height:1.35}
.hb-t small{font-size:12.5px;color:var(--ink-3)}
.hb-t small em{font-style:normal;font-weight:800;color:var(--ink)}
.hb-row.ok .hb-t small{color:var(--ink-2)}
.hb-num{flex:none;display:flex;align-items:center;gap:4px}
.hb-sb{width:30px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--surface);font:inherit;font-size:17px;font-weight:700;color:var(--ink);padding:0;cursor:pointer}
.hb-sb:disabled{color:var(--ink-4);cursor:default}
.hb-in{display:flex;align-items:center;height:34px;border-radius:9px;background:var(--surface-2);padding:0 8px 0 4px;gap:2px}
.hb-in input{width:44px!important;height:32px!important;border:0!important;background:none!important;padding:0 2px!important;font:inherit;font-size:15px!important;font-weight:800;text-align:right;color:var(--ink);box-shadow:none!important;border-radius:0!important}
.hb-in input:focus{outline:none}
.hb-in:focus-within{box-shadow:inset 0 0 0 1px var(--ink)}
.hb-in span{font-size:12px;color:var(--ink-3);white-space:nowrap}
.hb-rest{margin:8px 0 0;font-size:12.5px;color:var(--ink-3)}
.hb-note{margin:8px 0 0;font-size:12px;color:var(--ink-3);line-height:1.5}

/* 통계 3칸 */
.hb-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.hb-stats>div{display:flex;flex-direction:column;gap:2px;padding:12px 12px;min-width:0}
.hb-stats>div+div{border-left:1px solid var(--line-2)}
.hb-stats span{font-size:12px;color:var(--ink-2);font-weight:700}
.hb-stats b{font-size:22px;font-weight:900;letter-spacing:-.02em;line-height:1.25}
.hb-stats small{font-size:11.5px;color:var(--ink-3);line-height:1.4}

/* 이번 주 표 */
.hb-tw{overflow-x:auto}
.hb-tbl{width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px}
.hb-tbl th,.hb-tbl td{border-bottom:1px solid var(--line-2);height:38px;text-align:center;padding:0}
.hb-tbl thead th{font-size:11.5px;font-weight:600;color:var(--ink-3);height:44px}
.hb-tbl thead th button{border:0;background:none;font:inherit;color:inherit;display:flex;flex-direction:column;align-items:center;width:100%;padding:4px 0;cursor:pointer;line-height:1.25}
.hb-tbl thead th small{font-size:12.5px;font-weight:800;color:var(--ink)}
.hb-tbl tbody th{text-align:left;font-size:13px;font-weight:700;width:34%;padding-right:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb-tbl td .ico{display:inline-block;vertical-align:middle;color:var(--ink)}
.hb-tbl td .hb-dot{display:inline-block;vertical-align:middle}
.hb-tbl .sel{background:var(--surface-2)}
.hb-tbl tr.hb-all th,.hb-tbl tr.hb-all td{border-bottom:0;border-top:1px solid var(--ink);font-weight:900}
.hb-leg{margin:8px 0 0;font-size:12px;color:var(--ink-3)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 이번 달 작은 달력 */
.hb-mn{display:inline-flex;align-items:center;gap:2px}
.hb-mn .tnum{margin-right:6px;font-size:12.5px;color:var(--ink-3)}
.hb-mn .ibtn{width:28px;height:28px;border:1px solid var(--line);border-radius:8px;background:var(--surface);display:flex;align-items:center;justify-content:center;padding:0}
.hb-cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));row-gap:2px;padding-top:6px}
.hb-cw{font-size:11.5px;color:var(--ink-3);text-align:center;padding:4px 0}
.hb-cw.red{color:#D93B30}.hb-cw.blue{color:#2F5BFF}
.hb-cd{display:flex;flex-direction:column;align-items:center;gap:0;border:0;background:none;font:inherit;color:var(--ink);padding:4px 0 2px;border-radius:10px;cursor:pointer;min-width:0}
.hb-cd span{font-size:13px;line-height:20px;font-weight:600}
.hb-cd i{height:13px;display:flex;align-items:center;color:var(--ink)}
.hb-cd.fut span{color:var(--ink-4)}
.hb-cd.today span{font-weight:900;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:2px}
.hb-cd.sel{background:var(--ink)}
.hb-cd.sel span,.hb-cd.sel i{color:var(--surface)}

/* 목표 관리 */
.hb-g .t small{white-space:normal}
.hb-g:disabled{cursor:default;color:var(--ink)}
.hb-arc .hb-g .t{color:var(--ink-3)}

/* 빈 상태와 예시 */
.hb-ex{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:6px 0 10px}
.hb-ex.sh{justify-content:flex-start;margin:0 0 8px}

/* 시트 */
.hb-tg{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.hb-tg input{width:96px!important;flex:none!important;height:40px!important}
.hb-tg input.hb-unit{width:64px!important}
.hb-tg span{font-size:14px;color:var(--ink-2)}
.hb-tg small{font-size:12.5px;color:var(--ink-3)}
.hb-q,.hb-days{flex:1 1 100%;padding-left:84px}
.hb-days .bw-c{min-width:38px;justify-content:center}
.hb-fix,.hb-who{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;flex-wrap:wrap}
.hb-fix small,.hb-who small{font-size:12px;font-weight:400;color:var(--ink-3)}
.hb-who i{width:8px;height:8px;border-radius:999px}
@media (max-width:420px){.hb-q,.hb-days{padding-left:0}}

/* 버틀러 요약 홈 한 줄 */
.hb-line{min-height:44px!important}
.hb-line .bhm-tm{font-size:12px;font-weight:700;color:var(--ink-2)}
.hb-line .ico{color:var(--ink-3);flex:none}
.hb-line .hb-done .ico{color:var(--ink)}

/* 캘린더 날짜 옆 체크 (butler.js BCalScr). 휴대폰은 칸 오른쪽 위, PC는 칸 오른쪽 위에 조금 크게 */
.bc-cell{position:relative}
.bc-hk{position:absolute;top:5px;right:3px;width:12px;height:12px;display:flex;align-items:center;justify-content:center;color:var(--ink);pointer-events:none}
.bc-hk .ico{width:12px;height:12px}
.bc-cell.past .bc-hk{opacity:.85}
@media (min-width:1100px){
  .bc-hk{top:8px;right:6px;width:13px;height:13px}
  .bc-hk .ico{width:13px;height:13px}
  /* 공휴일 이름이 있는 날은 이름을 조금 당겨 체크와 겹치지 않게 */
  .bc-hl.hk{padding-left:30px;font-size:10.5px;letter-spacing:-.05em;max-width:calc(100% - 22px)}
}
.hb-tbl thead th:first-child{width:30%}
.hb-sec .bc-h+.bc-list{margin-top:0}
