.ha-stats { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 4px 0 10px; }
.ha-jump { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px 10px; margin: 10px 0; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
.ha-jump__a { flex: none; display: inline-flex; align-items: center; min-height: 64px; padding: 8px 16px; border-radius: 999px; border: 3px solid #a0703f; background: #fffaf0; font-weight: 900; color: #2b1d12; text-decoration: none; scroll-snap-align: start; }
.ha-group { scroll-margin-top: 10px; }
.ha-group__h { margin: 0 0 4px; color: #c43d2c; font-size: 24px; }
.ha-group__blurb { margin: 0 0 12px; }
.ha-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; }
.ha-card { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 6px 10px; min-height: 64px; border-radius: 18px; border: 3px dashed #c9b48e; background: #fffdf7; text-decoration: none; color: #2b1d12; text-align: center; }
.ha-card.is-got { border: 3px solid #e2a400; background: linear-gradient(180deg, #fff6d2, #fffdf7); box-shadow: 0 4px 0 rgba(226,164,0,.35); }
.ha-card .ha-img--96 { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 2px 0 rgba(0,0,0,.15); }
.ha-card__name { font-weight: 900; font-size: 16px; line-height: 1.15; }
.ha-card__state { font-size: 13px; font-weight: 700; color: #6b5a44; }
.ha-card.is-got .ha-card__state { color: #8a5d00; }
.ha-hero { display: grid; gap: 14px; align-items: center; }
@media (min-width: 700px) { .ha-hero { grid-template-columns: minmax(220px, 300px) 1fr; } }
.ha-hero__art { position: relative; display: flex; justify-content: center; }
.ha-hero__art .ha-img--256, .ha-hero__art .ha-img--full { width: 100%; max-width: 300px; height: auto; border-radius: 22px; border: 5px solid #fff; box-shadow: 0 6px 0 rgba(0,0,0,.12); background: #fffdf5; }
.ha-hero.is-got .ha-hero__art img { border-color: #f1c232; }
.ha-sticker { position: absolute; top: -10px; right: 6px; font-size: 44px; filter: drop-shadow(0 2px 0 rgba(0,0,0,.2)); }
.ha-group-lab { margin: 0; font-weight: 900; color: #7a5a2a; text-transform: uppercase; letter-spacing: .5px; font-size: 14px; }
.ha-state { font-weight: 900; margin: 6px 0; }
.ha-state[data-state=got] { color: #8a5d00; }
.ha-personality { font-size: 20px; line-height: 1.4; margin: 6px 0; }
.ha-saying { font-size: 20px; font-style: italic; font-weight: 700; color: #c43d2c; margin: 6px 0; }
.ha-facts p { margin: 4px 0; font-size: 17px; }
.ha-friends { margin: 0; padding-left: 22px; font-size: 18px; line-height: 1.45; }
.ha-friends li { margin: 4px 0; }
.ha-play { display: flex; flex-wrap: wrap; gap: 10px; }
.ha-playbtn { min-height: 64px; }
.ha-nav { flex-wrap: wrap; }
.ha-nav .lf-btn { min-height: 64px; }
.ha-badge { background: #fff1c2; border: 3px solid #e2a400; border-radius: 16px; padding: 10px 14px; font-weight: 900; text-align: center; }
.ha-page a:not(.lf-btn):not(.ha-card):not(.ha-jump__a) { display: inline-block; min-height: 64px; line-height: 64px; }