:root{
--paper:#f9f8f1;
--soft:#eae4dd;
--ink:#1c1c1c;
--red:#e03745;
--muted:#68665f;
--rule:#d2cfc4;
font-family:Arial,Helvetica,sans-serif;
color:var(--ink);
background:var(--paper);
font-synthesis:none;
scroll-behavior:smooth;
scroll-padding-top:24px}
*{
box-sizing:border-box}
body{
margin:0}
a{
color:inherit}
button{
font:inherit;
color:inherit}
a,button{
-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{
outline:2px solid var(--red);
outline-offset:5px}
.page{
width:min(1120px,100%);
margin:0 auto;
padding:0 48px}
.header{
height:105px;
display:flex;
align-items:center;
justify-content:space-between;
gap:30px;
border-bottom:1px solid var(--ink);
position:relative}
.header:after{
content:'';
position:absolute;
bottom:-5px;
width:100%;
border-bottom:1px solid var(--rule)}
.wordmark{
width:248px;
height:38px;
display:block;
position:relative;
overflow:hidden;
flex-shrink:0}
.wordmark img{
position:absolute;
width:298px;
height:auto;
left:-23px;
top:-38px}
.header-note{
font:0.6875rem 'Courier New',monospace;
letter-spacing:.06em;
display:flex;
align-items:center;
gap:9px}
.red-dot{
display:inline-block;
width:6px;
height:6px;
background:var(--red);
border-radius:50%;
flex-shrink:0}
.intro{
padding:48px 0 39px;
display:flex;
justify-content:space-between;
align-items:center;
gap:35px}
.intro-copy{
max-width:700px}
.eyebrow,.small-label{
font:0.6875rem 'Courier New',monospace;
letter-spacing:.07em;
color:var(--muted)}
.eyebrow{
margin:0 0 20px}
h1{
font:normal 3.5625rem/1.04 Georgia,'Times New Roman',serif;
letter-spacing:-0.14375rem;
margin:0}
h1 em{
font-weight:400}
.title-dot{
color:var(--red)}
.subtitle{
font-size:1.0625rem;
margin:23px 0 10px;
line-height:1.5}
.intro-description{
font-size:0.875rem;
line-height:1.7;
color:var(--muted);
margin:0;
max-width:525px}
.archive-seal{
width:174px;
height:174px;
flex-shrink:0;
border:1px solid var(--rule);
outline:1px solid var(--rule);
outline-offset:-7px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
transform:rotate(7deg);
position:relative;
margin-right:10px;
background:var(--soft)}
.archive-seal:before,.archive-seal:after{
content:'+';
font:0.9375rem 'Courier New',monospace;
position:absolute;
color:var(--muted)}
.archive-seal:before{
top:6px;
left:8px}
.archive-seal:after{
bottom:6px;
right:8px}
.seal-top,.seal-bottom{
font:0.5625rem 'Courier New',monospace;
letter-spacing:.045em}
.symbol{
width:100px;
height:72px;
position:relative;
overflow:hidden;
margin:13px 0}
.symbol img{
position:absolute;
width:166px;
height:auto;
left:-33px;
top:-21px}
.collection-heading{
border-top:1px solid var(--ink);
border-bottom:1px solid var(--rule);
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
padding:16px 0;
margin-bottom:22px}
.collection-heading h2{
font-size:0.875rem;
font-weight:400;
margin:0}
.resource-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:18px}
.resource-card{
padding:24px 25px 21px;
display:flex;
flex-direction:column;
border:1px solid #cbc7bb;
background:#f9f8f1;
box-shadow:2px 2px 0 #eae4dd;
position:relative;
transition:border-color .2s,box-shadow .2s}
.resource-card:before{
content:'';
width:4px;
height:4px;
position:absolute;
top:-1px;
left:-1px;
border-top:1px solid var(--ink);
border-left:1px solid var(--ink)}
.resource-card:hover{
border-color:#8e897b;
box-shadow:3px 3px 0 var(--soft)}
.resource-meta{
display:flex;
align-items:center;
gap:12px;
margin-bottom:18px}
.entry-number{
font:0.6875rem 'Courier New',monospace;
line-height:25px;
width:27px;
text-align:center;
border:1px solid var(--rule);
background:#eae4dd70;
color:var(--muted)}
.resource-type{
font:0.625rem 'Courier New',monospace;
letter-spacing:.055em;
text-transform:uppercase;
color:#b72b36}
.resource-content h2{
font:normal 1.625rem/1.18 Georgia,serif;
letter-spacing:-0.040625rem;
margin:0 0 11px}
.resource-description{
font-size:0.875rem;
line-height:1.65;
color:var(--muted);
margin:0 0 23px}
.resource-action{
margin-top:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px}
.resource-link{
font-size:0.8125rem;
display:inline-flex;
align-items:center;
gap:25px;
text-decoration:none;
border:0;
border-bottom:1px solid var(--ink);
padding:0 0 5px;
background:none;
line-height:1.3}
.resource-link:hover{
color:#b72b36;
border-color:var(--red)}
.resource-link .arrow{
font-size:1.1875rem;
line-height:1}
.resource-link:disabled{
color:#8a877f;
border-color:var(--rule);
cursor:not-allowed}
.resource-link:disabled .arrow{
opacity:.4}
.pending-note{
font:0.625rem 'Courier New',monospace;
line-height:1.4;
color:var(--muted);
max-width:65px;
text-align:right}
.resource-card:last-child:nth-child(odd){
grid-column:1/-1;
display:grid;
grid-template-columns:1fr auto;
column-gap:40px}
.resource-card:last-child:nth-child(odd) .resource-meta{
grid-column:1/-1}
.resource-card:last-child:nth-child(odd) .resource-description{
margin-bottom:0;
max-width:650px}
.resource-card:last-child:nth-child(odd) .resource-action{
align-self:end;
white-space:nowrap}
.resource-image{
max-width:100%;
height:140px;
object-fit:cover;
display:block;
margin-bottom:16px}
.collection-note{
font-size:0.75rem;
line-height:1.6;
color:var(--muted);
margin:24px 0 41px;
display:flex;
gap:10px}
.collection-note>span{
color:var(--red);
font-size:1.125rem;
line-height:1}
footer{
padding:24px 0 30px;
border-top:1px solid var(--ink);
display:flex;
justify-content:space-between;
align-items:center;
gap:20px;
font-size:0.75rem}
footer p{
margin:0;
line-height:1.6}
footer p>span{
color:var(--muted);
margin-left:5px}
footer a{
text-decoration:none;
display:flex;
align-items:center;
gap:18px}
footer a:hover{
color:#b72b36}
footer a>span[aria-hidden]{
font-size:1.125rem}
.skip-link{
position:absolute;
top:-100px;
left:20px;
background:var(--ink);
color:white;
padding:12px;
z-index:5}
.skip-link:focus{
top:16px}
.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}
@media(max-width:900px){
.page{
padding:0 32px}
h1{
font-size:3.0625rem}
.archive-seal{
width:140px;
height:155px;
margin-right:2px}
.seal-top,.seal-bottom{
font-size:0.5rem}
.resource-card{
padding:21px}
.resource-content h2{
font-size:1.5rem}
.resource-action{
gap:8px}
.resource-link{
gap:14px}
.resource-card:last-child:nth-child(odd){
column-gap:28px}
}
@media(max-width:650px){
.page{
padding:0 21px}
.header{
height:84px;
gap:15px}
.wordmark{
width:204px;
height:33px}
.wordmark img{
width:245px;
left:-19px;
top:-31px}
.header-note{
font-size:0.5625rem;
max-width:86px;
line-height:1.4;
letter-spacing:0}
.header-note .red-dot{
display:none}
.intro{
padding:35px 0 29px;
display:block}
.eyebrow{
font-size:0.5625rem;
margin-bottom:18px}
h1{
font-size:clamp(2.1875rem,8.7vw,3.3125rem);
letter-spacing:-0.09375rem;
line-height:1.08}
.archive-seal{
display:none}
.subtitle{
font-size:1rem;
margin:21px 0 10px}
.intro-description{
font-size:0.875rem;
line-height:1.65;
max-width:430px}
.collection-heading{
padding:15px 0;
margin-bottom:18px}
.collection-heading h2{
font-size:0.8125rem}
.small-label{
font-size:0.625rem}
.resource-grid{
grid-template-columns:1fr;
gap:15px}
.resource-card{
padding:21px 22px}
.resource-meta{
margin-bottom:16px}
.resource-content h2{
font-size:1.625rem}
.resource-description{
font-size:0.875rem;
margin-bottom:22px}
.resource-link{
font-size:0.8125rem;
gap:25px}
.pending-note{
font-size:0.625rem;
max-width:100px}
.resource-card:last-child:nth-child(odd){
display:flex;
grid-column:auto}
.resource-card:last-child:nth-child(odd) .resource-description{
margin-bottom:22px}
.resource-card:last-child:nth-child(odd) .resource-action{
align-self:auto}
.collection-note{
margin:24px 0 31px;
font-size:0.75rem;
max-width:300px}
footer{
align-items:flex-start;
font-size:0.6875rem;
gap:14px;
padding:23px 0 28px}
footer p>span{
display:block;
margin-left:0}
footer a{
gap:10px;
line-height:1.7}
}
@media(prefers-reduced-motion:reduce){
*{
scroll-behavior:auto!important;
transition:none!important}
}
/* Keep reading text and touch targets comfortable at every viewport. */
.resource-description{
font-size:1rem;
line-height:1.6}
.resource-link{
font-size:0.875rem;
min-height:34px}
.intro-description{
font-size:1rem}
.resource-type{
font-size:0.75rem}
.collection-heading h2{
font-size:0.875rem}
footer{
margin-top:36px}
.seal-top,.seal-bottom{
font-size:0.625rem}
@media(max-width:650px){
.intro-description,.resource-description{
font-size:1rem}
.resource-link{
min-height:40px}
.resource-type{
font-size:0.75rem}
.resource-content h2{
font-size:1.5625rem}
footer{
margin-top:28px}
}
/* Responsive safeguards: intrinsic content can wrap, and links are easy to tap. */
html {
 -webkit-text-size-adjust: 100%;
 text-size-adjust: 100%;
 }
.page {
 padding-left: max(21px, env(safe-area-inset-left));
 padding-right: max(21px, env(safe-area-inset-right));
 }
.header {
 height: auto;
 min-height: 105px;
 padding: 22px 0;
 flex-wrap: wrap;
 }
.header-note {
 line-height: 1.5;
 }
.intro-copy, .resource-card, .resource-content, .resource-action {
 min-width: 0;
 }
h1, h2, p, .resource-link, .header-note {
 overflow-wrap: anywhere;
 }
.resource-action {
 flex-wrap: wrap;
 }
.resource-link {
 min-height: 44px;
 max-width: 100%;
 }
.resource-link .arrow {
 flex-shrink: 0;
 }
.resource-card:last-child:nth-child(odd) {
 grid-template-columns: minmax(0, 1fr) minmax(0, auto);
 }
.resource-card:last-child:nth-child(odd) .resource-action {
 white-space: normal;
 }
footer {
 flex-wrap: wrap;
 }
footer a {
 min-height: 44px;
 max-width: 100%;
 }
@media (min-width: 651px) {
  .page {
 padding-left: max(32px, env(safe-area-inset-left));
 padding-right: max(32px, env(safe-area-inset-right));
 }
}
@media (min-width: 901px) {
  .page {
 padding-left: max(48px, env(safe-area-inset-left));
 padding-right: max(48px, env(safe-area-inset-right));
 }
}
@media (max-width: 650px) {
  .header {
 min-height: 84px;
 padding: 20px 0;
 }
  .resource-card:last-child:nth-child(odd) {
 display: flex;
 }
}
@media (max-width: 360px) {
  .header {
 gap: 10px;
 }
  .header-note {
 max-width: none;
 }
}
@media (hover: none) {
  .resource-card:hover {
 border-color: #cbc7bb;
 box-shadow: 2px 2px 0 var(--soft);
 }
}
/* Let larger text use one column instead of squeezing into narrow cards. */
.resource-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}
@media (max-width: 800px) {
  .resource-card:last-child:nth-child(odd) { display: flex; }
  .resource-card:last-child:nth-child(odd) .resource-description { margin-bottom: 23px; }
  .resource-card:last-child:nth-child(odd) .resource-action { align-self: auto; }
}

/* Decorative stamp stays proportional to the unchanged logo asset. */
.seal-top, .seal-bottom { font-size: 10px; }
.entry-number { width: auto; min-width: 2.45em; line-height: 2.27; }
