/* Build 554: usability improvements, retaining the archive artwork and case order. */
[hidden] { display:none !important; }
button:focus-visible, a:focus-visible, input:focus-visible { outline:3px solid #173d65; outline-offset:4px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:8px; left:8px; z-index:999999; transform:translateY(-180%); padding:12px 18px; background:#fff; color:#173d65; border-radius:8px; }
.skip-link:focus { transform:none; }
.hero { width:100%; }
.archive-tools { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; margin:10px 0 12px; }
.tool-button,.shortlist-save { min-height:44px; padding:9px 14px; border:1px solid #9e8a70; border-radius:12px; background:#fffdf8; color:#3e342a; font:inherit; font-size:14px; font-weight:750; cursor:pointer; }
.tool-button[aria-pressed=true],.shortlist-save[aria-pressed=true] { color:#fff; background:#173d65; border-color:#173d65; }
.tool-button:disabled { opacity:.55; cursor:default; }
.shortlist-save { margin:10px 0 2px; text-align:left; }
.shortlist-status { margin:0 0 12px; text-align:center; font-size:14px; color:#5d5145; }
.results-summary { white-space:normal; line-height:1.4; }
.empty { padding:28px 12px; font-size:18px; }
.empty p { margin:0 0 16px; }
.case-heading { margin:0; display:flex; flex:1; min-width:0; font:inherit; }
.title-shell[inert] { visibility:hidden; }
.case.open .title-shell { visibility:visible; }
.details[hidden] { display:none; }
.movie-wrap.details-open .details { max-height:none; display:flex; flex-direction:column; overflow:visible; }
.detail-overview { order:0; }
.details-poster-wrap { order:1; margin:16px 0; align-self:center; }
.detail-secondary { order:2; }
.detail-title { line-height:1.3; }
.detail-line { overflow-wrap:anywhere; }
.details-poster-image { width:100%; height:auto; }
.detail-location-label,.location-line { color:#5f5143; }
.case .case-button { color:#fff; }
.green .case-button { background:linear-gradient(90deg,#41653c,#4d7547 50%,#41653c); }
.gray .case-button { background:linear-gradient(90deg,#5c5c5c,#666 50%,#5c5c5c); }
.case[data-color=yellow] .case-group-tab { color:#5c4700; }
.case[data-color=yellow] .case-group-tab.active { color:#fff; }
.case-random-inline { min-height:44px; color:#443526 !important; }
.case-group-count { opacity:1; }
@media(min-width:761px) {
 .movie-wrap.details-open .details { display:grid; grid-template-columns:260px minmax(0,1fr); gap:0 28px; padding:22px; align-items:start; }
 .details-poster-wrap { grid-column:1; grid-row:1 / 3; margin:0; align-self:start; }
 .details-poster-frame { width:260px; }
 .detail-overview { grid-column:2; grid-row:1; }
 .detail-secondary { grid-column:2; grid-row:2; }
}
@media(max-width:760px) {
 .movie-wrap.details-open .details { margin-left:10px; padding:14px; }
 .filter-button { min-height:44px; font-size:13px; }
 .global-random-button { min-height:44px; font-size:13px; }
 #search { min-height:48px; padding-right:54px; }
 #clear { width:44px; height:44px; right:3px; font-size:24px; }
 .case-title { font-size:14px; line-height:1.25; }
 .case-meta { font-size:13px; }
 .case-button { min-height:58px; }
 .case-group-name { font-size:14px; }
 .case-group-count { font-size:12px; }
 .filter-row { gap:6px; }
 .results-summary { font-size:13px; }
 .archive-tools { gap:6px; }
 .tool-button { font-size:13px; padding:9px 10px; }
 .details { scroll-margin-top:64px; }
 .movie { scroll-margin-top:64px; }
}
@media(max-width:360px) { .filter-row { grid-template-columns:repeat(2,minmax(0,1fr)); } .case-title { font-size:13px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; } }

.hero .tribute-trigger:focus-visible { outline:3px solid #fff; outline-offset:4px; box-shadow:0 0 0 7px #173d65; }
.red .case-button { background:linear-gradient(90deg,#b63128,#b93930 50%,#b63128); }

/* Consistent archive controls: matching dimensions, typography, and spacing. */
.filter-row,.archive-tools { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; width:100%; margin-left:auto; margin-right:auto; }
.controls { margin-bottom:12px; }
.archive-tools { margin-top:0; margin-bottom:12px; }
.filter-row .filter-button,.archive-tools > button {
 flex:0 0 204px; width:204px; min-width:0; height:52px; min-height:52px;
 display:flex; align-items:center; justify-content:center; gap:8px;
 padding:8px 10px; border:2px solid #d2c5b4; border-radius:16px;
 font-family:inherit; font-size:14px; font-weight:900; line-height:1.2;
 letter-spacing:.03em; text-transform:uppercase; white-space:normal;
}
.archive-tools > .global-random-button { border-color:#173d65; }
.tool-button,.shortlist-save,.case-group-tab,.artwork-credits-link { text-transform:uppercase; }
@media(max-width:900px) {
 .filter-row,.archive-tools { max-width:636px; gap:10px; }
 .filter-row .filter-button,.archive-tools > button { flex-basis:calc((100% - 30px)/4); width:calc((100% - 30px)/4); font-size:12px; }
}
@media(max-width:600px) {
 .filter-row,.archive-tools { max-width:420px; gap:8px; }
 .filter-row .filter-button,.archive-tools > button { flex-basis:calc((100% - 8px)/2); width:calc((100% - 8px)/2); height:48px; min-height:48px; font-size:12px; border-radius:13px; }
 .controls { margin-bottom:8px; }
 .archive-tools { margin-bottom:10px; }
}

/* Build 555: two library actions above a centered random-movie button. */
.archive-tools { display:grid; grid-template-columns:repeat(2,minmax(0,204px)); max-width:420px; gap:12px; }
.archive-tools > button { width:100%; }
.archive-tools > .global-random-button { grid-column:1 / -1; justify-self:center; width:calc((100% - 12px)/2); }
@media(max-width:600px) {
 .archive-tools { gap:8px; }
 .archive-tools > .global-random-button { width:calc((100% - 8px)/2); }
}
