#mha-familienkarte .mha-treasure-people { display:flex; flex-wrap:nowrap; align-items:stretch; gap:clamp(12px,2vw,32px); overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; margin:4px 0 0; padding:10px 4px 18px; }
#mha-familienkarte .mha-treasure-person { flex:1 0 150px; max-width:235px; display:flex; flex-direction:column; gap:0; border:0; border-radius:0; background:transparent; padding:0 8px 12px; position:relative; scroll-snap-align:center; }
#mha-familienkarte .mha-treasure-person[aria-pressed='true'] { background:radial-gradient(ellipse at 50% 60%,#fff9de80,transparent 70%); border:0; }
#mha-familienkarte .mha-treasure-person:focus-visible { outline:2px solid #34564c; outline-offset:-2px; border-radius:16px; }
#mha-familienkarte .mha-treasure-initial { width:60px; height:60px; font-size:38px; border:1px solid #7e7255; background:#f4e5c6; overflow:hidden; box-shadow:0 0 0 3px #f0e5cb,0 0 0 4px #a8987355; }
#mha-familienkarte .mha-treasure-initial img { width:100%; height:100%; object-fit:cover; }
#mha-familienkarte .mha-treasure-person-name { font:500 30px/1.15 var(--mha-hand); margin:9px 0 0; overflow-wrap:anywhere; }
#mha-familienkarte .mha-treasure-glass { width:100%; max-width:165px; height:auto; margin:0 auto -3px; filter:drop-shadow(1px 3px 2px #65513c12); }
#mha-familienkarte .mha-treasure-total { justify-content:center; gap:6px; margin:0; }
#mha-familienkarte .mha-treasure-total strong { font:500 36px/1.1 var(--mha-hand); letter-spacing:0; }
#mha-familienkarte .mha-treasure-total>span { font-size:23px; }
#mha-familienkarte .mha-treasure-selection { font:12px/1.4 'Manrope',sans-serif; color:#6e6859; margin:5px 0 0; padding:3px 0 8px; }
#mha-familienkarte .mha-treasure-person[aria-pressed='true'] .mha-treasure-selection { color:#34564c; background:var(--mha-ink-line) bottom center/100% 3px no-repeat; font-weight:600; }
#mha-familienkarte .mha-treasure-balance { padding:12px 0 24px; justify-content:space-between; }
#mha-familienkarte .mha-treasure-balance>div { flex:1; }
#mha-familienkarte .mha-gem { display:inline-grid; place-items:center; color:#578f81; font-size:29px; line-height:1; text-shadow:1px 2px #254c42; }
#mha-familienkarte .mha-treasure-options { border:0; padding:12px 0; display:flex; flex-wrap:wrap; gap:16px; }
#mha-familienkarte .mha-treasure-options legend { font:500 26px var(--mha-hand); }
#mha-familienkarte .mha-treasure-options label { display:flex; align-items:center; gap:12px; min-height:64px; padding:10px 18px; border:1px solid #a28d6f; border-radius:23px 17px 20px 15px; cursor:pointer; }
#mha-familienkarte .mha-treasure-options label:has(:checked) { outline:2px solid #34564c; outline-offset:3px; }
#mha-familienkarte .mha-treasure-options input { accent-color:#34564c; }
@media(max-width:600px) {
  #mha-familienkarte .mha-treasure-people { gap:8px; }
  #mha-familienkarte .mha-treasure-person { flex:0 0 136px; padding:0 4px 10px; }
  #mha-familienkarte .mha-treasure-initial { width:50px; height:50px; }
  #mha-familienkarte .mha-treasure-person-name { font-size:27px; }
  #mha-familienkarte .mha-treasure-balance { gap:12px; }
}