/* Shared discovery link and notifications; the collection itself is page-scoped. */
.portfolio-brand { display: flex; align-items: center; gap: clamp(.75rem, 2vw, 1.5rem); }
.header-achievements { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .65rem 0; border-bottom: 2px solid transparent; color: inherit; font: 500 .9375rem/1.5 'DM Sans', Arial, sans-serif; text-decoration: none; white-space: nowrap; }
.header-achievements svg { width: 21px; height: 21px; color: var(--active-color, #b93825); }
.header-achievement-count { font-size: .6875rem; opacity: .65; font-variant-numeric: tabular-nums; }
.header-achievements:hover, .header-achievements[aria-current] { border-bottom-color: var(--active-color, var(--green, #397959)); }
.header-achievements:focus-visible { outline: 3px solid var(--active-color, var(--green, #397959)); outline-offset: 4px; }
@media (min-width: 641px) {
  .portfolio-header .portfolio-header-inner.has-achievements { grid-template-columns: auto minmax(0, 1fr); column-gap: clamp(1rem, 3vw, 3rem); }
  .portfolio-header .portfolio-brand .portfolio-logo { width: clamp(34px, 4vw, 54px); flex: none; }
}
.achievement-badge { display: grid; place-items: center; flex: none; width: 72px; height: 72px; border: 2px solid #947b5b; color: #877358; background: #dac49f; box-shadow: inset 0 0 0 4px #ead7b4; }
.achievement-badge svg { width: 44px; height: 44px; }
.achievement-badge.earned { border-color: #f0b344; color: #ffce72; background: #2e241c; box-shadow: inset 0 0 0 4px #493020, 0 0 0 1px #a75b27, 0 0 16px #f3ac4766, 0 0 32px #e47b2226; }
.achievement-toast { position: fixed; z-index: 9998; right: 24px; bottom: 24px; width: 350px; max-width: calc(100vw - 48px); display: flex; align-items: center; gap: 16px; padding: 20px 36px 20px 20px; border: 1px solid #9e6c3d; border-top: 4px solid #dc632d; background: #30251e; color: #f7e7c7; box-shadow: 5px 6px 0 #30272026; font: 13px/1.4 'DM Sans', Arial, sans-serif; animation: achievement-arrive .25s ease-out; }
.achievement-toast .achievement-badge { width: 52px; height: 52px; }
.achievement-toast .achievement-badge svg { width: 32px; height: 32px; }
.achievement-toast small { display: block; color: #eab368; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.achievement-toast strong { display: block; margin-block: 4px 7px; font-size: 19px; }
.achievement-toast a { color: #f7e7c7; font-size: 11px; text-underline-offset: 3px; }
.achievement-toast > button { position: absolute; top: 4px; right: 4px; width: 32px; height: 32px; border: 0; background: none; color: #e9d4b5; font-size: 22px; cursor: pointer; }
.achievement-toast :focus-visible { outline: 2px solid #f0b344; outline-offset: 3px; }
@keyframes achievement-arrive { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }

.achievements-page { --paper: #f4e5c6; --ink: #38291f; --body-background: #ead2a5; --body-color: var(--ink); --active-color: #b64125; --line: #66402b4d; min-height: 100svh; background-image: radial-gradient(#62432618 .6px, transparent .9px); background-size: 4px 4px; }
.achievements-page .nav-dropdown { background: #f4e5c6; }
.achievements-page .portfolio-nav .nav-dropdown a:is(:hover, :focus-visible, [aria-current]) { background: #b64125; color: #fff0cf; }
.achievements-main { padding-block: clamp(2rem, 4vw, 3.5rem) 3rem; }
.achievement-collection { border: 1px solid #66402b; background: #f4e5c6; box-shadow: 7px 8px 0 #5b38201c; }
.achievement-masthead { padding: clamp(1.5rem, 3vw, 2.75rem); background: #b84528; color: #fff0cf; position: relative; }
.achievement-edition { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; font-size: .6875rem; letter-spacing: .14em; font-weight: 700; }
.achievement-edition span:last-child { border: 1px solid #fff0cf88; padding: .3rem .6rem; letter-spacing: .07em; }
.achievement-masthead h1 { font-family: 'Archivo Black', 'Arial Black', Arial, sans-serif; font-size: clamp(2.75rem, 5.8vw, 5.25rem); font-weight: 900; letter-spacing: -.065em; line-height: 1; margin-bottom: .7rem; }
.achievement-masthead > p { font-size: .9375rem; color: #ffe2bc; }
.achievement-summary { margin-top: 1.8rem; padding: 1.2rem 1.4rem; background: #472c20; border: 1px solid #f5c77966; }
.achievement-summary-copy { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; font-size: .8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: .045em; }
#achievement-percent { color: #ffd27d; font-variant-numeric: tabular-nums; }
.achievement-progress { height: 8px; background: #f7e7c72b; }
.achievement-progress > span { display: block; height: 100%; width: 0; background: #edb44d; transition: width .25s ease; }
.achievement-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem clamp(1.25rem, 3vw, 2.75rem); border-bottom: 1px solid #66402b55; }
.achievement-filters { display: flex; gap: .4rem; }
.achievement-filters button { display: inline-flex; align-items: center; gap: .5rem; border: 1px solid transparent; padding: .65rem .8rem; min-height: 44px; background: transparent; color: #654b38; font: 600 .75rem/1.4 'DM Sans', Arial, sans-serif; cursor: pointer; }
.achievement-filters button[aria-pressed='true'] { border-color: #b84528; color: #a7351c; background: #d45c2820; }
.achievement-filters button:hover { border-color: #b8452877; }
.achievement-filters button span { font-size: .625rem; font-variant-numeric: tabular-nums; }
.achievement-search { display: flex; align-items: center; gap: .65rem; }
.achievement-search svg { width: 17px; height: 17px; flex: none; }
.achievement-search input { min-width: 0; width: 180px; border: 0; border-bottom: 1px solid #7d5e42; border-radius: 0; padding: .65rem .1rem; color: #38291f; background: transparent; font: .8125rem 'DM Sans', Arial, sans-serif; }
.achievement-search input::placeholder { color: #7c634b; opacity: 1; }
.achievement-list { padding: clamp(1.25rem, 2vw, 1.75rem); margin: 0; list-style: none; display: grid; gap: .7rem; }
.achievement-row { display: grid; grid-template-columns: 72px minmax(0, 1fr) 112px; align-items: center; gap: 1.5rem; padding: 1.35rem 1.5rem; min-height: 120px; color: #756148; background: #e5d0ab; border: 1px solid #a3876066; border-left: 4px solid #a3876088; }
.achievement-row.is-earned { color: #fff0cf; background: #352920; border-color: #89532d; border-left-color: #e6a147; }
.achievement-copy h2 { font: 700 clamp(1.125rem, 1.9vw, 1.5rem)/1.2 'DM Sans', Arial, sans-serif; letter-spacing: -.035em; margin: 0 0 .4rem; color: #5c4935; }
.is-earned .achievement-copy h2 { color: #fff0cf; }
.achievement-copy p { font-size: .8125rem; line-height: 1.6; margin: 0; }
.is-earned .achievement-copy p { color: #d5c0a0; }
.achievement-copy .achievement-rarity { margin-top: .3rem; color: #7c684f; font-size: .75rem; }
.is-earned .achievement-copy .achievement-rarity { color: #bba886; }
.achievement-status { display: flex; flex-direction: column; gap: .45rem; text-align: right; font-size: .6875rem; font-weight: 600; letter-spacing: .03em; font-variant-numeric: tabular-nums; }
.achievement-earned-label { color: #f6c66c; }
.achievement-earned-label span { margin-right: .3rem; }
.achievement-status meter { width: 100%; height: 5px; appearance: none; border: none; border-radius: 0; background: #b6a08066; }
.achievement-status meter::-webkit-meter-bar { background: #b6a08066; border: none; border-radius: 0; height: 5px; }
.achievement-status meter::-webkit-meter-optimum-value { background: #ae6a35; }
.achievement-status meter::-moz-meter-bar { background: #ae6a35; }
.achievement-empty { padding: 1rem 2rem 2rem; text-align: center; font-size: .875rem; color: #756148; }
.achievement-endnote { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .25rem 1.75rem 1.5rem; color: #80654a; font-size: .6875rem; }
.achievements-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 2rem; font-size: .6875rem; color: #70513a; }
.achievements-stripes { height: 24px; background: linear-gradient(#b84528 0 33.333%, #dc632d 33.333% 66.666%, #d9a12e 66.666%); }
.achievement-mobile-notice { display: none; }
@media (min-width: 641px) and (max-width: 800px) {
  .achievement-row { gap: 1rem; padding-inline: 1rem; grid-template-columns: 64px minmax(0, 1fr) 96px; }
  .achievement-row .achievement-badge { width: 64px; height: 64px; }
  .achievement-search input { width: 155px; }
  .header-achievements { gap: .35rem; font-size: .75rem; }
}
@media (max-width: 640px) {
  .header-achievements, .achievement-toast, .achievement-collection, .achievements-footer, .achievements-stripes { display: none !important; }
  .achievement-mobile-notice { display: block; margin-block: 2rem; padding: 2rem 1.5rem; border: 1px solid #66402b; background: #f4e5c6; }
  .achievement-mobile-notice h1 { font: 900 2rem/1.1 'Archivo Black', Arial, sans-serif; letter-spacing: -.055em; margin-bottom: 1rem; }
  .achievement-mobile-notice p { font-size: .9375rem; margin-bottom: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) { .achievement-toast { animation: none; } .achievement-progress > span { transition: none; } }
