.achievement-nav-symbol svg { width:19px; height:19px; display:block; }
.achievements-hero { position:relative; isolation:isolate; overflow:hidden; padding:62px 24px 45px; text-align:center; border-bottom:1px solid var(--line); background:radial-gradient(ellipse at 50% -10%,color-mix(in srgb,var(--gold) 16%,transparent),transparent 65%); }
.achievements-hero::before { content:""; position:absolute; z-index:-1; top:-185px; left:calc(50% - 270px); width:540px; height:540px; border:1px solid color-mix(in srgb,var(--gold) 11%,transparent); border-radius:50%; box-shadow:0 0 0 65px color-mix(in srgb,var(--gold) 3%,transparent),0 0 0 130px color-mix(in srgb,var(--gold) 2%,transparent); pointer-events:none; }
.achievement-hero-emblem { width:98px; height:98px; margin:0 auto 30px; padding:25px; border:1px solid color-mix(in srgb,var(--gold) 50%,transparent); border-radius:50%; color:var(--gold-light); background:color-mix(in srgb,var(--gold) 7%,transparent); box-shadow:0 0 45px color-mix(in srgb,var(--gold) 9%,transparent),inset 0 0 25px color-mix(in srgb,var(--gold) 8%,transparent); }
.achievement-hero-emblem svg { width:100%; height:100%; }
.achievements-hero h1 { font:clamp(34px,5vw,64px)/1.15 var(--serif); font-weight:400; margin:16px 0 22px; }
.achievements-hero > p:not(.eyebrow) { font:19px/1.8 var(--serif); color:var(--muted); }
.achievement-hero-caption { display:block; color:var(--gold); font:10px/1.8 var(--sans); letter-spacing:.18em; margin:24px 0; }
.achievement-content { max-width:1300px; margin:auto; padding:32px 34px 70px; }
.achievement-tabs { display:flex; justify-content:center; gap:28px; border-bottom:1px solid var(--line); }
.achievement-tabs a { display:flex; gap:18px; padding:17px 12px; color:var(--muted); text-decoration:none; font:19px/1.5 var(--serif); border-bottom:2px solid transparent; }
.achievement-tabs a[aria-current=page] { color:var(--gold-light); border-color:var(--gold); }
.achievement-tabs a:hover { color:var(--gold-light); }
.achievement-tabs span { color:var(--gold); }
.achievement-filters { display:flex; flex-wrap:wrap; gap:16px; align-items:end; margin:28px 0; }
.achievement-filters label { display:block; flex:1 1 220px; font:11px/1.6 var(--sans); color:var(--muted); }
.achievement-filters select { display:block; width:100%; margin-top:8px; padding:12px; background:var(--panel); color:var(--panel-text); border:1px solid var(--line); border-radius:4px; font:14px/1.5 var(--sans); }
.achievement-progress { display:grid; grid-template-columns:1fr 1.8fr; gap:35px; padding:28px 32px; margin:30px 0; border:1px solid var(--line); border-radius:4px; background:linear-gradient(100deg,color-mix(in srgb,var(--gold) 5%,transparent),transparent); }
.achievement-progress .eyebrow { margin-top:0; }
.achievement-progress strong { font:44px/1.2 var(--serif); color:var(--gold-light); font-weight:400; }
.achievement-progress strong span { font-size:25px; color:var(--muted); }
.achievement-progress p:not(.eyebrow) { margin-bottom:0; color:var(--muted); font:12px/1.6 var(--sans); }
.achievement-progress-track { align-self:center; color:var(--gold-light); font:12px/1.8 var(--sans); }
.achievement-progress-bar { height:7px; overflow:hidden; margin:14px 0 12px; background:color-mix(in srgb,var(--gold) 10%,transparent); border-radius:20px; }
.achievement-progress-bar i { display:block; height:100%; background:linear-gradient(90deg,var(--gold),var(--gold-light)); border-radius:20px; }
.achievement-progress-track small { color:var(--muted); font-size:11px; }
.achievement-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.achievement-card { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; padding:20px 24px 0; border:1px solid var(--line); border-radius:5px; overflow:hidden; background:var(--panel); color:var(--panel-text); transition:transform .2s,border-color .2s,box-shadow .2s; }
.achievement-card.is-earned { border-color:color-mix(in srgb,var(--panel-gold) 45%,transparent); background:radial-gradient(ellipse at 50% 20%,color-mix(in srgb,var(--panel-gold) 10%,var(--panel)),var(--panel) 70%); }
.achievement-card.is-earned::after { content:""; position:absolute; top:0; left:22%; right:22%; height:1px; background:var(--panel-gold-light); box-shadow:0 0 17px var(--panel-gold); }
.achievement-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--panel-gold) 65%,transparent); box-shadow:0 12px 35px #00000020; }
.achievement-card-top { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; margin-bottom:26px; text-align:start; font:9px/1.7 var(--sans); letter-spacing:.06em; color:var(--panel-muted); }
.achievement-campaign { overflow-wrap:anywhere; }
.achievement-state { flex-shrink:0; font-size:8px; letter-spacing:.1em; }
.is-earned .achievement-state { color:var(--panel-gold-light); }
.achievement-emblem { display:grid; place-items:center; width:100px; height:100px; padding:24px; margin:0 0 25px; border:1px solid var(--line); border-radius:24px; color:var(--panel-muted); background:color-mix(in srgb,var(--panel-muted) 5%,transparent); transform:rotate(-3deg); }
.achievement-emblem svg { width:100%; height:100%; transform:rotate(3deg); }
.achievement-emblem:has(img) { padding:0; overflow:hidden; }
.achievement-emblem img { width:100%; height:100%; object-fit:cover; transform:rotate(3deg) scale(1.07); }
.is-earned .achievement-emblem { color:var(--panel-gold-light); border-color:color-mix(in srgb,var(--panel-gold) 55%,transparent); background:linear-gradient(135deg,color-mix(in srgb,var(--panel-gold) 16%,transparent),transparent); box-shadow:0 4px 24px color-mix(in srgb,var(--panel-gold) 8%,transparent); }
.is-locked .achievement-emblem img { filter:grayscale(1); opacity:.55; }
.is-secret .achievement-emblem { border-style:dashed; }
.achievement-card h2 { margin:0 0 13px; font:25px/1.3 var(--serif); font-weight:400; overflow-wrap:anywhere; }
.is-earned h2 { color:var(--panel-gold-light); }
.achievement-description { margin:0 0 27px; font:14px/1.8 var(--serif); white-space:pre-wrap; overflow-wrap:anywhere; color:var(--panel-muted); }
.achievement-recipients, .achievement-waiting { align-self:stretch; margin:auto -24px 0; padding:15px 22px; border-top:1px solid var(--line); background:color-mix(in srgb,var(--panel-gold) 3%,transparent); font:11px/1.7 var(--sans); color:var(--panel-muted); }
.achievement-recipients > div { display:flex; justify-content:space-between; align-items:baseline; gap:14px; text-align:start; padding:3px 0; }
.achievement-recipients a, .achievement-recipients strong { color:var(--panel-gold-light); font-weight:400; overflow-wrap:anywhere; }
.achievement-recipients time { flex-shrink:0; font-size:10px; }
.achievement-empty { padding:64px 22px; text-align:center; border:1px dashed var(--line); margin-top:24px; }
.achievement-empty > span { color:var(--gold); font:45px var(--serif); }
.achievement-empty h2 { font:30px/1.4 var(--serif); font-weight:400; }
.achievement-empty p { max-width:500px; margin:0 auto 26px; font:16px/1.8 var(--serif); color:var(--muted); }
.character-trophies { margin:40px 0; padding:30px 0; border-top:1px solid var(--line); }
.achievement-showcase .achievement-card h2 { font-size:22px; }
.achievement-manager-list { display:grid; gap:16px; }
.achievement-manager-list > article { display:flex; gap:24px; align-items:center; }
.achievement-manager-list > article > div:nth-child(2) { flex:1; min-width:0; }
.achievement-manager-icon { flex:0 0 48px; width:48px; height:48px; color:var(--panel-gold); }
.achievement-manager-icon svg { width:48px; height:48px; }
.achievement-edit-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:24px; align-items:start; }
.achievement-edit-layout .appearance-section { margin-top:0; margin-bottom:24px; }
.achievement-image-preview { object-fit:cover; border-radius:16px; border:1px solid var(--line); margin-bottom:20px; }
.achievement-grant-row { display:flex; gap:20px; justify-content:space-between; align-items:center; padding:15px 0; border-top:1px solid var(--line); }
.achievement-grant-row .field-help { margin:4px 0 0; }
@media(min-width:1700px) { .achievement-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:1100px) { .achievement-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .achievement-edit-layout { grid-template-columns:1fr; } }
@media(max-width:600px) { .achievements-hero { padding:36px 18px; } .achievement-content { padding:24px 16px 45px; } .achievement-tabs { gap:8px; } .achievement-tabs a { font-size:17px; gap:12px; } .achievement-progress { grid-template-columns:1fr; gap:22px; padding:24px; } .achievement-grid { grid-template-columns:1fr; } .achievement-manager-list > article { flex-wrap:wrap; gap:16px; } .achievement-manager-list > article > a { margin-inline-start:64px; } }
@media(prefers-reduced-motion:reduce) { .achievement-card { transition:none; } .achievement-card:hover { transform:none; } }