.prize-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 1rem; align-items: end; padding: 1.25rem; background: var(--paper-2); border: 1px solid var(--rule-soft); border-radius: 4px; }
.prize-filters label { display: block; margin-bottom: .35rem; }
.prize-filters input, .prize-filters select { width: 100%; min-width: 0; }
.prize-accordion { margin: 1rem 0 3rem; }
.prize-disclosure { border: 1px solid var(--rule-soft); background: var(--paper-3); margin-bottom: .8rem; border-radius: 4px; }
.prize-disclosure summary { padding: 1.2rem 1.4rem; cursor: pointer; font-size: 1.3rem; line-height: 1.5; overflow-wrap: anywhere; }
.prize-disclosure summary::marker { color: var(--link); }
.prize-disclosure summary:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
.prize-disclosure[open] summary { border-bottom: 1px solid var(--rule-soft); }
.prize-disclosure-body { padding: .3rem 1.4rem 1rem; }
@media (max-width: 480px) { .prize-filters { grid-template-columns: 1fr; } .prize-disclosure summary { font-size: 1.15rem; padding: 1rem; } }

/* ---- the authors of a year (or every winner), as a row of portraits or a fanned hand of cards (js/portrait-hand.js) */
.hand { --cw: 104px; margin: .4rem auto 2rem; }
.hand-cards { display: flex; justify-content: center; gap: 12px; position: relative; }
.hand-cards + .hand-cards { margin-top: 1rem; }   /* more than 30: a line under a line */
.hand-card {
  position: relative; display: flex; flex-direction: column; width: var(--cw); padding: 0; cursor: pointer;
  border: 3px solid var(--frame, var(--wood-3)); border-radius: 5px; background: var(--paper-3); color: var(--ink);
  box-shadow: 0 2px 6px rgba(23, 13, 7, .25); font: inherit; text-align: center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.hand-face { display: block; position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 2px 2px 0 0; background: var(--wood-1); }
.hand-face img, .hand-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.hand-initials { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-display); font-size: 2rem; color: var(--brass-2); background: linear-gradient(160deg, var(--wood-3), var(--wood-1)); }
.hand-name { display: block; padding: .25rem .2rem .3rem; font-size: .82rem; line-height: 1.15; min-height: 2.3em; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hand-card:hover, .hand-card:focus-visible { transform: translateY(-6px); box-shadow: 0 8px 16px rgba(23, 13, 7, .35); z-index: 60; }
.hand-card:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* The frame says how far they got: gilt for the winners, brass for the stage before, wood for the rest. */
.hand-rank-0 { --frame: var(--gilt); }
.hand-rank-1 { --frame: #9a8f7e; }
.hand-rank-2 { --frame: var(--wood-3); }
.hand-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem 1.2rem; margin: .9rem 0 0; font-size: .9rem; color: var(--ink-soft); }
.hand-key::before { content: ""; display: inline-block; width: .8rem; height: .8rem; margin-right: .4rem; vertical-align: -.05rem; border: 3px solid var(--frame); border-radius: 2px; }

/* Too many to fit across: dealt as a hand - each card placed (--x), turned (--r) and dropped (--y) by the script. */
.hand-cards.is-fanned { display: block; height: calc(var(--cw) * 1.45 + 34px); }
.hand-cards.is-fanned .hand-card { position: absolute; top: 14px; left: var(--x, 0); transform-origin: 50% 110%; transform: translateY(var(--y, 0)) rotate(var(--r, 0)); }
/* In the hand, the script lifts the card the pointer is over (.is-up); hovering a sliver does nothing by itself. */
.hand-cards.is-fanned { touch-action: pan-y; }
.hand-cards.is-fanned .hand-card:hover { transform: translateY(var(--y, 0)) rotate(var(--r, 0)); box-shadow: 0 2px 6px rgba(23, 13, 7, .25); z-index: auto; }
.hand-cards.is-fanned .hand-card.is-up, .hand-cards.is-fanned .hand-card:focus-visible { transform: translateY(calc(var(--y, 0px) - 26px)) rotate(var(--r, 0)) scale(1.08); box-shadow: 0 8px 16px rgba(23, 13, 7, .35); z-index: 60; }

/* One portrait in full */
.hand-dlg { width: min(30rem, calc(100vw - 1.5rem)); }
.hand-full { display: grid; gap: 1rem; justify-items: center; text-align: center; }
.hand-portrait { display: block; position: relative; width: min(16rem, 70vw); aspect-ratio: 1; overflow: hidden; border: 5px solid var(--frame); border-radius: 6px; background: var(--wood-1); box-shadow: var(--shadow-2); }
.hand-portrait .hand-initials { font-size: 4.5rem; }
.hand-about { display: grid; gap: .3rem; }
.hand-about h2 { margin: 0; }
.hand-about p { margin: 0; }
.hand-works { font-style: italic; }
.hand-credit { font-size: .8rem; color: var(--ink-faint); }
.hand-nav { justify-content: center; align-items: center; gap: .6rem; }

@media (prefers-reduced-motion: reduce) { .hand-card { transition: none; } }