#household-panel { padding:clamp(20px,3vw,40px); border-radius:22px; }
#household-panel h2 { font-size:clamp(28px,3vw,38px); letter-spacing:-.035em; margin:0 0 8px; }
#household-panel > label { display:inline-flex; flex-direction:column; gap:6px; margin:16px 16px 16px 0; font-size:12px; }
#household-panel > .button { margin:6px; }
#household-panel .hh-nav { display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid #8883; padding:0 0 14px; margin:12px 0 28px; }
#household-panel .hh-nav button { border:0; border-radius:9px; padding:12px 20px; background:transparent; }
#household-panel button[aria-pressed=true] { background:#b69a6326; color:inherit; box-shadow:inset 0 0 0 1px #b69a6370; }
#household-panel .hh-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin:24px 0; }
#household-panel .hh-metric { display:flex; flex-direction:column; gap:12px; border-left:2px solid #b69a6370; padding-left:18px; min-width:0; }
#household-panel .hh-metric span { font-size:12px; opacity:.75; }
#household-panel .hh-metric strong { font-size:clamp(20px,2.3vw,30px); font-weight:550; letter-spacing:-.03em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
#household-panel .hh-summary { border:1px solid #8883; box-shadow:0 8px 30px #00000008; padding:24px; border-radius:16px; }
#household-panel details { border:1px solid #8883; border-radius:12px; padding:16px 20px; margin:16px 0; }
#household-panel summary { cursor:pointer; font-weight:550; }
#household-panel .device-form { padding-top:20px; gap:16px; }
#household-panel .hh-views { display:flex; gap:6px; margin:16px 0; }
#household-panel .hh-table-wrap { overflow-x:auto; border:1px solid #8883; border-radius:14px; }
#household-panel .hh-table { width:100%; border-collapse:collapse; font-size:14px; }
#household-panel .hh-table caption { text-align:left; padding:20px; font-weight:550; }
#household-panel .hh-table th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.07em; opacity:.75; background:#8881; }
#household-panel .hh-table :is(th,td) { padding:15px 18px; border-bottom:1px solid #8882; }
#household-panel .hh-table td:nth-child(2) { font-weight:550; min-width:180px; overflow-wrap:anywhere; max-width:320px; }
#household-panel .hh-table :is(th,td):nth-child(5) { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
#household-panel .hh-table td:first-child { white-space:nowrap; }
#household-panel .hh-empty { padding:40px 20px; text-align:center; opacity:.7; }
#household-panel [hidden] { display:none!important; }
#household-panel button:focus-visible, #household-panel summary:focus-visible { outline:2px solid #b69a63; outline-offset:4px; }
@media(max-width:700px) { #household-panel .hh-metrics {grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px} #household-panel .hh-summary {padding:18px} #household-panel .hh-nav button {padding:12px} #household-panel input {font-size:16px} }
@media(hover:hover) { #household-panel .hh-table tbody tr:hover {background:#b69a630a} }
#household-panel .hh-months td { min-width:0; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
#household-panel .hh-months tbody th { text-transform:none; letter-spacing:normal; opacity:1; }
#household-panel .hh-months tr[aria-current] { background:#b69a6314; }
#household-panel .hh-months button { min-height:44px; }
#household-panel .hh-section { min-width:0; }
@media(max-width:700px) { #household-panel .hh-months :is(th,td) {padding:10px} }

#household-panel .hh-toolbar {display:flex;flex-wrap:wrap;align-items:end;gap:10px;margin:16px 0;}
#household-panel .hh-toolbar > label {display:grid;gap:6px;font-size:12px;}
#household-panel .hh-toolbar details {margin:0;padding:10px;border:0;}
#household-panel > .status:empty {display:none;}
@media(max-width:700px) {
  #household-panel .hh-nav {flex-wrap:nowrap;overflow-x:auto;gap:4px;margin-bottom:18px;}
  #household-panel .hh-nav button {flex-shrink:0;min-height:44px;}
  #household-panel .hh-toolbar {align-items:center;}
  #household-panel .hh-toolbar > label {flex:1;}
}
#household-panel .hh-receipts { display:grid; gap:10px; margin-bottom:26px; }
#household-panel .hh-receipt { display:grid; gap:6px; padding:14px 16px; }
#household-panel .hh-receipt-head { display:flex; align-items:center; gap:10px; }
#household-panel .hh-receipt-head strong { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#household-panel .hh-receipt-amount { font-weight:700; font-variant-numeric:tabular-nums; }
#household-panel .hh-receipt p { margin:0; }
#household-panel .hh-receipt button { justify-self:start; }
