:root{--paper:#f4f0e7;--ink:#302c27;--muted:#776d61;--accent:#795039;--line:#d8cfc0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.6 Arial,sans-serif}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b77740;outline-offset:4px}header{max-width:1400px;margin:auto;padding:26px 5%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}a{color:inherit}.brand{text-decoration:none;font-family:Georgia,serif;font-size:25px;letter-spacing:-1px}.brand span{font-size:15px}.brand small{font:10px Arial;letter-spacing:2px;margin-left:14px}nav{display:flex;gap:30px;font-size:12px}nav a{text-decoration:none}nav button{border:0;background:none;padding:0;color:inherit}.hero{max-width:1280px;margin:auto;padding:70px 5% 54px;position:relative;border-bottom:1px solid var(--line)}.eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--accent);font-weight:bold}h1{font:normal clamp(45px,6vw,80px)/1.05 Georgia,serif;letter-spacing:-3px;margin:25px 0}h1 em{font-weight:normal;color:var(--accent)}.hero p{max-width:480px;font-size:16px;color:var(--muted);margin-bottom:25px}.surprise{padding:13px 20px;background:var(--ink);color:#fff;border:0;border-radius:2px;text-align:left}.surprise span{display:block;font-size:10px;color:#d3c6b6;margin-left:22px}.hero-note{position:absolute;right:5%;bottom:55px;font-size:9px;letter-spacing:2px;color:var(--muted);writing-mode:vertical-rl}.explorer{max-width:1280px;margin:auto;padding:46px 5% 70px}.section-top{display:flex;justify-content:space-between;align-items:center;gap:25px}h2{font:normal 27px Georgia,serif;margin:8px 0}.search{border-bottom:1px solid var(--muted);display:flex;align-items:center;gap:12px;width:260px}.search span{font-size:28px}.search input{width:100%;border:0;background:none;padding:10px 0;outline:none;font-size:13px}.timeline{padding:28px 0;border-bottom:1px solid var(--line)}.year-nav{display:flex;align-items:center;gap:20px}.year-nav button{border:1px solid var(--line);background:none;border-radius:50%;width:36px;height:36px}.year-nav button:disabled{opacity:.35}.year-nav #all{border-radius:2px;width:auto;height:auto;padding:6px 12px;margin-left:auto;font-size:12px}.year-nav label span{font-size:9px;letter-spacing:1.4px;display:block;color:var(--muted)}select{background:transparent;border:0;color:var(--ink);font:28px Georgia;min-width:112px}input[type=range]{width:100%;accent-color:var(--accent);margin:23px 0 5px}.ticks{display:flex;justify-content:space-between;font:12px Georgia;color:var(--muted)}.available{display:flex;gap:6px;flex-wrap:wrap;margin-top:20px}.available button{border:0;background:#e8e1d5;padding:3px 9px;font-size:11px;color:var(--muted)}.available button.selected{background:var(--accent);color:white}.results-header{display:flex;justify-content:space-between;align-items:center;margin:32px 0 20px}.results-header span{font-size:11px;color:var(--muted)}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 24px}.portrait{width:100%;height:255px;object-fit:cover;object-position:50% 25%;filter:grayscale(1) sepia(.18);background:#e2dacd;display:block}.image-wrap{position:relative}.year-tag{position:absolute;bottom:10px;left:10px;background:var(--paper);font:11px Georgia;padding:3px 8px}.card h3{font:normal 21px Georgia;margin:16px 0 3px}.card .life{color:var(--muted);font-size:11px;letter-spacing:1px}.card p{font-size:12px;color:var(--muted);margin:8px 0;min-height:38px}.card .play{display:flex;gap:8px;align-items:center;border:1px solid var(--line);background:transparent;width:100%;padding:9px 11px;text-align:left;font-size:12px}.card .play.active{background:var(--ink);color:white}.card audio{width:100%;height:34px;margin-top:8px}.details{background:none;border:0;border-bottom:1px solid var(--line);color:var(--muted);font-size:10px;padding:0;margin-top:9px}.empty{text-align:center;padding:60px 20px}.empty h3{font:26px Georgia}.empty button{background:var(--ink);color:white;border:0;padding:10px 20px}.archive-note{max-width:1152px;margin:0 auto 50px;padding:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:25px;align-items:center}.archive-note>span{font-size:35px;color:var(--accent)}.archive-note h3{font:22px Georgia;margin:0}.archive-note p{font-size:12px;color:var(--muted);max-width:570px}.archive-note a{font-size:11px;white-space:nowrap;margin-left:auto}footer{text-align:center;padding:40px;border-top:1px solid var(--line)}footer p,footer small{color:var(--muted);font-size:11px}dialog{border:1px solid var(--line);background:var(--paper);color:var(--ink);max-width:600px;width:90%;padding:35px}dialog::backdrop{background:#211a15aa}.close{float:right;border:0;background:none;font-size:25px}dialog h2{margin-top:15px}dialog p{font-size:13px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:10px 18px;display:none;font-size:12px;max-width:90%;z-index:5}@media(min-width:1250px){.gallery{grid-template-columns:repeat(5,1fr)}.portrait{height:230px}}@media(max-width:800px){.gallery{grid-template-columns:repeat(3,1fr)}.portrait{height:225px}.hero-note{display:none}.brand small{display:none}.archive-note{margin:0 5% 30px}.archive-note a{white-space:normal}}@media(max-width:580px){header{padding:20px 6%}nav{gap:15px;font-size:10px}.hero{padding:45px 6%}h1{letter-spacing:-2px}.section-top{align-items:stretch;flex-direction:column}.search{width:100%}.explorer{padding:32px 6%}.gallery{grid-template-columns:repeat(2,1fr);gap:28px 16px}.portrait{height:210px}.card h3{font-size:19px}.results-header h2{font-size:23px}.archive-note{align-items:flex-start;flex-wrap:wrap}.archive-note a{margin-left:60px}.year-nav{gap:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hero-portraits{position:absolute;right:10%;top:70px;width:340px;height:350px}.hero-portraits img{position:absolute;width:170px;height:240px;object-fit:cover;filter:grayscale(1) sepia(.25);border:8px solid #eee7da;box-shadow:0 5px 18px #302c2722}.hero-portraits img:nth-child(1){left:0;top:60px;transform:rotate(-9deg)}.hero-portraits img:nth-child(2){left:145px;top:10px;transform:rotate(7deg)}.hero-portraits img:nth-child(3){left:105px;top:120px;transform:rotate(-2deg);width:145px;height:200px}@media(max-width:1000px){.hero-portraits{right:7%;width:260px}.hero-portraits img{width:140px;height:205px}.hero-portraits img:nth-child(2){left:100px}.hero-portraits img:nth-child(3){left:60px;width:120px;height:165px}.hero p{max-width:410px}}@media(max-width:800px){.hero-portraits{display:none}}

.recording-title{font:italic 12px/1.4 Georgia,serif;margin:8px 0 12px;min-height:32px;color:var(--accent)}

.recorded-date{font-size:11px;color:var(--muted);margin:0 0 12px;line-height:1.5}.recorded-date time{color:var(--ink)}

header{flex-wrap:wrap;gap:14px}@media(max-width:580px){header .brand{font-size:21px;letter-spacing:-.5px}}

dialog{max-height:85dvh;overflow:auto}#game-audio{width:100%;margin:12px 0}.game-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.game-options button{border:1px solid var(--line);background:transparent;padding:12px;color:var(--ink);text-align:left}.game-options button:hover:not(:disabled){background:#e8e1d5}.game-options button:disabled{opacity:.55;cursor:default}.game-options button.correct-answer{opacity:1;border-color:var(--accent);background:#e7decd}.game-portrait{width:100px;height:125px;object-fit:cover;filter:grayscale(1) sepia(.18);float:right;margin:0 0 14px 16px}#game-result h3{font:24px Georgia}#game-result p{font-size:13px}#game-next{margin-top:20px}@media(max-width:420px){.game-options{grid-template-columns:1fr}}

.game-countdown{font:italic 20px Georgia;color:var(--accent);margin:12px 0 25px}

/* Keep the actions aligned across each gallery row, including expanded audio. */
.card{display:flex;flex-direction:column;min-width:0}.card-summary{min-width:0}.card-actions{margin-top:auto;min-width:0}.card .play{min-height:52px;line-height:1.35;text-decoration:none;color:var(--ink);justify-content:flex-start}.card .play.active{color:white}.card .portrait-unavailable{object-fit:contain;object-position:center;background:#e2dacd}.card .details{min-height:44px;text-align:left;line-height:1.4}.card audio[hidden]{display:none}
@supports(grid-template-rows:subgrid){.card{display:grid;grid-template-rows:subgrid;grid-row:span 2;row-gap:0}.card-actions{margin-top:0}}
.available{gap:8px}.available button{min-width:48px;min-height:44px;padding:8px 10px;font-size:12px}.year-nav button{width:44px;height:44px}.year-nav #all{min-height:44px;padding:8px 14px}.surprise:disabled{cursor:wait;opacity:.65}
.document-page{max-width:800px;margin:auto;padding:45px 6% 65px}.document-page h1{font-size:clamp(36px,6vw,55px);letter-spacing:-1.5px}.document-page h2{margin-top:32px}.document-page p,.document-page li{font-size:15px}.document-page .back-link{display:inline-block;margin-top:24px;padding:12px 18px;background:var(--ink);color:white;text-decoration:none}.document-page .updated{font-size:12px;color:var(--muted)}

/* Comfortable navigation targets and legible portrait captions. */
header .brand,header nav a,header nav button,footer a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:10px 12px;line-height:1.4}header .brand{justify-content:flex-start;padding-left:0}header nav{flex-wrap:wrap;gap:6px 14px}footer a{vertical-align:middle}.card .life{font-size:12px;line-height:1.5}.card p{font-size:13px;line-height:1.5}.recording-title{font-size:13px;line-height:1.5}.recorded-date{font-size:12px;line-height:1.5}.year-tag{font-size:12px;line-height:1.4;max-width:calc(100% - 20px)}.card .details{font-size:12px}
@media(max-width:580px){header nav{gap:4px 8px;font-size:12px}header{gap:8px}footer{padding:30px 6%}footer p{line-height:1.6}}