.achievement-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.achievement-filters [aria-pressed="true"] { background: var(--brand); color: white; border-color: var(--brand); }
.achievement-group { border-bottom: 1px solid var(--line); padding: 14px 0; }
.achievement-group summary { cursor: pointer; font-weight: 700; min-height: 44px; padding: 10px 0; }
.achievement-group summary span { float: right; color: var(--muted); font-size: 12px; }
.achievement-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px 0; }
.achievement-card { display: flex; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; min-width: 0; }
.achievement-card > div { min-width: 0; flex: 1; }
.achievement-mark { display: grid; place-items: center; align-self: flex-start; flex: 0 0 40px; height: 40px; border-radius: 50%; background: #F2F4F8; color: #58637A; font-size: 22px; }
.achievement-card.is-unlocked .achievement-mark { background: #FFF1C9; color: #6D4C08; }
.achievement-card h3 { font-size: 15px; margin: 0 0 5px; }
.achievement-card p, .achievement-card small { color: var(--muted); font-size: 12px; }
.achievement-card progress { display: block; width: 100%; height: 6px; margin-top: 10px; accent-color: var(--brand); }
@media (max-width: 700px) { .achievement-grid { grid-template-columns: minmax(0, 1fr); } }
.achievement-series-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.achievement-series { display: block; padding: 20px; background: #fff; }
.series-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.achievement-series .series-heading > div { min-width: 0; }
.achievement-medal { display: grid; place-items: center; flex: 0 0 58px; height: 58px; border-radius: 50%; border: 3px double var(--metal-edge,#aeb6c4); background: linear-gradient(135deg,var(--metal-light,#fff),var(--metal,#edf0f5)); color: var(--metal-ink,#48566e); font-size: 30px; }
.tier-label { display: block; font-size: 12px; font-weight: 700; color: var(--metal-ink,#48566e); margin-bottom: 4px; }
.tier-bronze { --metal:#ebc0a1; --metal-light:#fff1e3; --metal-edge:#b87643; --metal-ink:#86502c; }
.tier-silver { --metal:#d8e0e8; --metal-light:#fff; --metal-edge:#8b9bad; --metal-ink:#4e6076; }
.tier-gold { --metal:#f5d778; --metal-light:#fff8d9; --metal-edge:#b89535; --metal-ink:#7a5d15; }
.tier-platinum { --metal:#bfe7e4; --metal-light:#f4fffd; --metal-edge:#669f9b; --metal-ink:#346f6a; }
.tier-diamond { --metal:#c9ddff; --metal-light:#f3f8ff; --metal-edge:#7298d9; --metal-ink:#355f9d; }
.tier-master { --metal:#dfd3f3; --metal-light:#faf6ff; --metal-edge:#9b7dc3; --metal-ink:#6a4a94; }
.tier-path { display:flex; flex-wrap:wrap; gap:6px; margin:12px 0; }
.tier-path span { font-size:11px; padding:3px 7px; border:1px solid var(--line); border-radius:20px; color:var(--muted); }
.tier-path .earned { background:#eef3ff; border-color:#b8c9f8; color:#2348d8; }
.tier-details { margin-top:14px; border-top:1px solid var(--line); padding-top:8px; }
.tier-details summary { cursor:pointer; color:var(--brand); font-size:12px; padding:8px 0; }
.tier-details ol { padding-left:20px; }
.tier-details li { margin:10px 0; }
.tier-details li span, .tier-details li small { display:block; }
@media(max-width:700px) { .achievement-series-grid { grid-template-columns:minmax(0,1fr); } }