.achievements-page { max-width: 1240px; margin: 0 auto; }
.achievement-heading { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; margin-bottom: 1.5rem; }
.achievement-heading .eyebrow { margin-top: 1rem; }
.achievement-overview { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr) max-content; align-items: center; gap: 1.25rem; padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: 1rem; background: linear-gradient(110deg, color-mix(in srgb, var(--accent-soft) 40%, var(--surface)), var(--surface) 65%); box-shadow: inset 0 1px 0 var(--header-highlight); }
.achievement-metric { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: .75rem; min-width: 0; }
.achievement-metric-earned { border-left: 1px solid var(--border); padding-left: 1.25rem; }
.achievement-summary-art { display: grid; place-items: center; width: 120px; height: 120px; flex-shrink: 0; }
.achievement-summary-art img { display: block; width: 100%; height: 100%; object-fit: contain; }
.achievement-summary-symbol { display: grid; place-items: center; width: 96px; height: 96px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border)); border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-size: 2rem; }
.achievement-summary-currency { font-size: 1.25rem; font-weight: 800; }
.achievement-summary { display: grid; align-content: center; gap: .25rem; min-width: 0; font-variant-numeric: tabular-nums; }
.achievement-summary-label { font-size: .875rem; line-height: 1.35; }
.achievement-summary > strong { font-size: 1.5rem; font-weight: 800; letter-spacing: -.04em; line-height: 1.15; overflow-wrap: anywhere; }
.achievement-summary small { color: var(--text-muted); font-size: .9rem; font-weight: 650; letter-spacing: 0; }
.achievement-summary .achievement-earned-value { color: var(--accent); }
.achievement-overview .achievement-summary label { margin-top: .25rem; font-size: .8125rem; font-weight: 500; line-height: 1.3; }
.achievement-history { display: grid; grid-template-columns: 18px max-content 12px; align-items: center; gap: .5rem; box-sizing: border-box; width: max-content; max-width: 100%; min-height: 42px; padding: .45rem .6rem; border: 1px solid var(--border); border-radius: .85rem; background: var(--surface-hover); color: var(--text); font-size: .75rem; font-weight: 550; line-height: 1.35; transition: background .15s, border-color .15s; }
.achievement-history > svg:first-child { width: 18px; height: 18px; color: var(--text-muted); }
.achievement-history-chevron { width: 12px; height: 12px; }
.achievement-history span { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.achievement-history:hover { background: var(--accent-soft); border-color: var(--accent); }
.achievements-page progress { display: block; width: 100%; height: 9px; border: 0; border-radius: 8px; background: var(--surface-hover); overflow: hidden; accent-color: var(--accent); }
.achievements-page progress::-webkit-progress-bar { background: var(--surface-hover); border-radius: 8px; }
.achievements-page progress::-webkit-progress-value { background: var(--accent); border-radius: 8px; }
.achievements-page progress::-moz-progress-bar { background: var(--accent); border-radius: 8px; }
.achievement-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.75rem 0; }
.achievement-filters a { padding: .55rem .9rem; border-radius: 2rem; border: 1px solid var(--border); background: var(--surface); font-size: .875rem; font-weight: 600; }
.achievement-filters a[aria-current], .achievement-filters a:hover { color: var(--accent); background: var(--accent-soft); border-color: var(--accent); }
.achievement-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.achievement-card { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; padding: .75rem; min-width: 0; text-align: center; background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--accent) 7%, transparent), transparent 38%), var(--surface); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.achievement-card.is-completed { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.achievement-card-top { display: flex; justify-content: center; margin: .125rem 0 .625rem; }
.achievement-card .achievement-icon { width: 136px; height: auto; aspect-ratio: 1; max-width: 100%; border-radius: 2rem; font-size: 5.25rem; }
.achievement-icon { width: 64px; height: 64px; flex-shrink: 0; display: inline-grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-size: 2.25rem; border-radius: 1rem; overflow: hidden; }
.achievement-icon img { width: 100%; height: 100%; object-fit: contain; }
.achievement-category { font-size: .875rem; color: var(--text-muted); text-align: right; }
.achievement-card h2 { margin: 0 0 .375rem; font-size: 1.125rem; line-height: 1.35; overflow-wrap: anywhere; }
.achievement-description { margin: 0; font-size: .8125rem; line-height: 1.45; color: var(--text-muted); white-space: pre-line; overflow-wrap: anywhere; }
.achievement-reward { margin: .625rem 0; color: var(--accent); font-size: 1.375rem; font-weight: 750; line-height: 1.2; }
.achievement-reward span { font-size: 1rem; font-weight: 500; }
.achievement-progress-label { display: flex; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; font-size: .875rem; }
.achievement-card-status { display: grid; gap: .5rem; margin-top: .75rem; align-content: start; }
.achievement-card.is-completed .achievement-card-status { margin-top: auto; }
.achievement-card-status form { margin: 0; position: relative; z-index: 3; }
.achievement-card-link { color: inherit; text-decoration: none; }
.achievement-card-link::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.achievement-card:has(.achievement-card-link:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
.achievement-status-received { display: grid; place-items: center; min-height: 40px; border-radius: .8rem; background: var(--accent-soft); }
.achievement-card-status .button { display: flex; justify-content: center; align-items: center; width: 100%; min-height: 40px; margin: 0; padding: .5rem; font-size: .8125rem; }
.achievement-status { color: var(--accent); font-size: .875rem; font-weight: 650; }
.achievement-card-status time, .achievement-card-status small { font-size: .8125rem; }
.achievement-notice { background: var(--accent-soft); color: var(--accent); padding: 1rem; border-radius: .8rem; }
.achievement-notice.is-error { background: var(--danger-soft); color: var(--danger); }
.achievement-empty { grid-column: 1 / -1; text-align: center; padding: 2.5rem; }
.achievement-admin-filters, .achievement-actions, .achievement-order { display: flex; flex-wrap: wrap; align-items: end; gap: .65rem; }
.achievement-admin-filters { margin: 1.5rem 0; }
.achievements-page label { display: grid; gap: .4rem; font-size: .875rem; font-weight: 600; }
.achievements-page input:not([type=checkbox]), .achievements-page select, .achievements-page textarea { min-width: 0; width: 100%; padding: .7rem .8rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--surface); color: var(--text); font: inherit; }
.achievements-page input[type=checkbox] { accent-color: var(--accent); width: 18px; height: 18px; flex-shrink: 0; }
.achievements-page textarea { resize: vertical; }
.achievements-admin { max-width: none; }
.achievement-table-wrap { overflow-x: auto; padding: 0; }
.achievement-table { width: 100%; min-width: 820px; border-collapse: collapse; font-size: .875rem; overflow-wrap: normal; word-break: normal; }
.achievement-table th, .achievement-table td { padding: .75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); }
.achievement-table th { white-space: nowrap; color: var(--text-muted); background: var(--surface-hover); }
.achievement-table td:first-child { width: 23%; min-width: 170px; overflow-wrap: anywhere; }
.achievement-table td:nth-child(2) { width: 25%; min-width: 180px; }
.achievement-table td:nth-child(3) { width: 17%; min-width: 130px; overflow-wrap: anywhere; }
.achievement-table td:nth-child(4) { min-width: 105px; white-space: nowrap; }
.achievement-table td:nth-child(5) { width: 80px; }
.achievement-table td:last-child { width: 140px; }
.achievement-order-value { font-variant-numeric: tabular-nums; }
.achievement-table td small { display: block; color: var(--text-muted); margin: .35rem 0; }
.achievement-edit-link, .achievement-edit-link:visited, .achievement-edit-link:hover, .achievement-edit-link:focus { color: #000; font-weight: 700; }
.achievement-table .achievement-status.is-disabled { color: var(--danger); }
.achievement-table .achievement-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 104px; min-width: 104px; gap: .3rem; }
.achievement-table .achievement-actions form { margin: 0; }
.achievement-table .achievement-actions .button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 32px; padding: .3rem .5rem; border-radius: .5rem; font-size: .75rem; line-height: 1.3; text-align: center; white-space: nowrap; }
.achievement-table .achievement-actions details { min-width: 0; }
.achievement-table .achievement-actions summary { list-style: none; }
.achievement-table .achievement-actions summary::-webkit-details-marker { display: none; }
.achievement-table .achievement-actions details p { margin: .5rem 0; font-size: .8125rem; line-height: 1.4; }
.achievement-order { flex-wrap: nowrap; min-width: 145px; }
.achievement-actions summary { padding: .65rem 0; cursor: pointer; color: var(--danger); }
.achievement-danger { color: var(--danger) !important; }
.achievement-editor { max-width: 780px; }
.achievement-form { display: grid; gap: 1.25rem; margin-top: 1.25rem; }
.achievement-form-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.achievement-form fieldset { margin: 0; padding: 1rem; border: 1px solid var(--border); border-radius: .75rem; }
.achievement-form legend { padding: 0 .5rem; font-weight: 650; }
.achievement-role-list { display: flex; flex-wrap: wrap; gap: .65rem 1.25rem; }
.achievement-role-list label, .achievements-page .achievement-checkbox { display: flex; align-items: center; gap: .5rem; font-weight: 500; }
.achievement-field-help { margin: -.5rem 0 0; font-size: .875rem; color: var(--text-muted); }
fieldset .achievement-field-help { margin: 1rem 0; }
.achievement-existing-icon { display: flex; align-items: center; gap: 1rem; }
.achievement-existing-icon img { object-fit: contain; border-radius: .5rem; }
.achievement-category-form { margin-top: 1.5rem; }
.achievement-category-form > summary { cursor: pointer; font-weight: 650; }
@media(max-width: 1000px) { .achievement-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 640px) { .achievement-heading { align-items: flex-start; flex-direction: column; } .achievement-grid, .achievement-form-columns { grid-template-columns: 1fr; } .achievement-admin-filters label { width: 100%; } }

/* Карточки подстраиваются под ширину центральной колонки профиля. */
.profile-achievements { max-width: none; margin-top: 1.25rem; padding: clamp(1.35rem, 3vw, 2.25rem); border: 1px solid var(--border); border-radius: 1.35rem; background: var(--surface); box-shadow: 0 10px 30px var(--shadow); container-type: inline-size; }
.profile-achievements .achievement-heading .eyebrow { margin-top: 0; }
.profile-achievements .achievement-heading h2 { margin: .35rem 0 0; font-size: clamp(1.45rem, 2.5vw, 1.9rem); }
.profile-achievements .achievement-card { box-shadow: none; }
.profile-achievements .achievement-grid { grid-template-columns: repeat(auto-fill, minmax(0, min(100%, 220px))); gap: .75rem; align-items: stretch; }
@container (max-width: 960px) {
  .achievement-overview { grid-template-columns: minmax(0, 300px) minmax(0, 1fr) max-content; gap: .75rem; padding: .75rem .9rem; }
  .achievement-metric { grid-template-columns: 104px minmax(0, 1fr); gap: .5rem; }
  .achievement-summary-art { width: 104px; height: 104px; }
  .achievement-summary-symbol { width: 84px; height: 84px; }
  .achievement-metric-earned { padding-left: .85rem; }
}
@container (max-width: 760px) {
  .achievement-overview { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: .75rem; }
  .achievement-history { grid-column: 1 / -1; justify-self: end; width: auto; grid-template-columns: 18px max-content 12px; min-height: 34px; }
  .achievement-history br { display: none; }
  .profile-achievements .achievement-heading { flex-wrap: wrap; }
}
@container (max-width: 480px) {
  .achievement-overview { grid-template-columns: minmax(0, 1fr); }
  .achievement-metric { grid-template-columns: 88px minmax(0, 1fr); gap: .75rem; }
  .achievement-summary-art { width: 88px; height: 88px; }
  .achievement-metric-earned { border-left: 0; border-top: 1px solid var(--border); padding: .7rem 0 0; }
  .achievement-summary > strong { font-size: 1.4rem; }
}
.achievement-overview progress { max-width: 180px; height: 6px; margin-top: .1rem; }

.achievement-claim-error { color: var(--danger); font-size: .8125rem; line-height: 1.4; }

/* Такой же световой перелив, как у карточек прогнозов. */
.achievement-card::before { position: absolute; z-index: 2; top: -28%; left: -48%; width: 32%; height: 156%; content: ''; pointer-events: none; opacity: 0; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 8%, transparent), rgba(255, 255, 255, .28), color-mix(in srgb, var(--accent) 8%, transparent), transparent); filter: blur(1.2px); transform: skewX(-20deg) translateX(0); }
@keyframes achievement-card-sheen { 0% { opacity: 0; transform: skewX(-20deg) translateX(0); } 20% { opacity: .52; } 100% { opacity: 0; transform: skewX(-20deg) translateX(470%); } }
@media (hover: hover) {
  .achievement-card:hover::before { animation: achievement-card-sheen .96s ease-out; }
  .profile-achievements .achievement-card:hover { transform: translateY(-2px) scale(1.012); border-color: color-mix(in srgb, var(--accent) 48%, var(--border)); box-shadow: 0 6px 16px var(--shadow); }
}
@media (prefers-reduced-motion: reduce) {
  .achievement-card { transition: none; }
  .achievement-card::before { display: none; animation: none; }
  .profile-achievements .achievement-card:hover { transform: none; }
}

/* Поля админки сохраняют рамки и фокус, как настройки игр. */
.achievements-page :is(input:not([type=hidden]):not([type=checkbox]):not([type=file]), select, textarea) { min-height: 46px; border: 1px solid var(--border); background: var(--surface-hover); }
.achievements-page :is(input:not([type=hidden]):not([type=checkbox]):not([type=file]), select, textarea):hover { border-color: var(--text-muted); }
.achievements-page :is(input:not([type=hidden]):not([type=checkbox]):not([type=file]), select, textarea):focus { border-color: var(--accent); outline: 2px solid var(--accent); outline-offset: 2px; }
.achievement-icon-editor { display: grid; gap: .85rem; }
.achievement-icon-editor [hidden] { display: none !important; }
.achievement-icon-editor img { object-fit: contain; border: 1px solid var(--border); border-radius: .75rem; background: var(--surface-hover); }
.achievement-icon-buttons { display: flex; flex-wrap: wrap; gap: .65rem; }
.achievement-icon-editor .achievement-field-help { margin: 0; }