/* Nostromo · poems.rcreitc.com
   Overcast greys, a typewriter face for catalogue details, a book serif for the verse. */
:root{
  --ground:#D9DDDB; --paper:#F4F5F3; --card:#FCFCFA; --ink:#1F2423; --ink-2:#3B4442; --muted:#4A5452;
  --rule:#A63D33; --lines:#D2DCE7; --edge:#B9C0BD; --link:#2F5544; --link-h:#1F3B2F; --guide:#C9D8CE; --guide-ink:#1F3B2F;
  --serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
  --type:'Courier Prime', 'Courier New', monospace;
  color-scheme: light;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--ground);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}
a{color:var(--link)} a:hover{color:var(--link-h)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--link);outline-offset:3px}
.page{min-height:100%}

/* catalogue */
.cat{background:var(--ground)}
.wrap{max-width:1120px;margin:0 auto;padding:88px max(20px,env(safe-area-inset-right)) 96px max(20px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:56px}
.cat-head{display:flex;flex-direction:column;gap:14px;max-width:640px}
.eyebrow{font-family:var(--type);font-size:14px;letter-spacing:.08em;color:var(--muted)}
h1{margin:0;font-weight:400;text-wrap:balance}
.cat-head h1{font-size:clamp(56px,10vw,88px);line-height:.95;letter-spacing:-.02em}
.lede{margin:0;font-size:21px;line-height:1.5;color:var(--ink-2)}
.drawer{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:32px 28px}
.card,.guide{position:relative;display:flex;flex-direction:column;min-height:212px;border-radius:3px;font-family:var(--type)}
.card{padding:14px 24px 34px;text-decoration:none;color:var(--ink);font-size:15px;line-height:26px;
  background:linear-gradient(var(--rule),var(--rule)) 0 66px/100% 1.5px no-repeat,
    repeating-linear-gradient(to bottom,transparent 0,transparent 25px,var(--lines) 25px,var(--lines) 26px) 0 66px/100% 100% no-repeat,var(--card);
  box-shadow:0 1px 0 rgba(30,36,35,.12),0 2px 6px rgba(30,36,35,.06);transition:transform .18s ease,box-shadow .18s ease}
.card:hover{color:var(--ink);transform:translateY(-4px);box-shadow:0 10px 22px rgba(30,36,35,.16),0 1px 0 rgba(30,36,35,.08)}
.card-call{display:flex;justify-content:space-between;height:52px;font-size:13px;color:var(--muted)}
.card-head{font-weight:700}
.card-l2{color:var(--ink-2)}
.card-info{font-size:13px;color:var(--muted)}
.hole{position:absolute;bottom:10px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--ground);box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.guide{background:var(--guide);color:var(--guide-ink);padding:22px 24px 30px;gap:6px;box-shadow:0 1px 0 rgba(30,36,35,.12);margin-top:16px}
.guide-tab{position:absolute;top:-16px;left:24px;width:132px;height:18px;background:var(--guide);border-radius:4px 4px 0 0}
.guide-k{font-size:13px;letter-spacing:.1em}
.guide-t{font-size:26px;font-weight:700;letter-spacing:.04em}
.guide-n{font-size:15px}
.guide-f{margin-top:auto;font-size:13px}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;border-top:1px solid var(--edge);font-family:var(--type);font-size:13px;letter-spacing:.04em;color:var(--muted)}

/* poem page */
.poem-page{background:var(--paper)}
.bar{background:var(--ground);border-bottom:1px solid #C3CAC7}
.bar-in{max-width:1120px;margin:0 auto;padding:16px max(20px,env(safe-area-inset-right)) 16px max(20px,env(safe-area-inset-left));display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-family:var(--type);font-size:14px;letter-spacing:.04em}
.bar-in a,.pager a{text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.call{color:var(--muted)}
.sheet{max-width:36rem;margin:0 auto;padding:80px max(20px,env(safe-area-inset-right)) 64px max(20px,env(safe-area-inset-left));box-sizing:content-box}
.poem-head{display:flex;flex-direction:column;gap:10px;margin-bottom:40px}
.poem-head h1{font-size:clamp(34px,6vw,46px);line-height:1.1;letter-spacing:-.01em}
.subtitle{margin:0;font-size:20px;font-style:italic;color:var(--ink-2)}
.byline{font-family:var(--type);font-size:14px;letter-spacing:.1em;color:var(--muted)}
.verse span{display:block;padding-left:2em;text-indent:-2em}
.epigraph{margin:0 0 44px;padding:0 0 0 1.4em;border-left:1px solid var(--edge);font-size:16.5px;line-height:1.6;color:var(--ink-2)}
.poem{display:flex;flex-direction:column;gap:1.55em;font-size:20px;line-height:1.62}
.poem p{margin:0}
.poem-foot{margin-top:72px;display:flex;flex-direction:column;gap:28px}
.label{align-self:flex-start;border:1px solid var(--edge);background:var(--card);padding:12px 16px;font-family:var(--type);font-size:13px;line-height:1.6;color:var(--ink-2)}
.pager{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:18px;border-top:1px solid #C9CFCC;font-family:var(--type);font-size:14px}
@media (max-width:520px){.poem{font-size:18px}.sheet{padding-top:48px}.wrap{padding-top:56px;gap:40px}}
@media (prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}

/* A–Z jump row and letter guide cards (shown when the drawer holds more than a dozen poems) */
.az{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px;font-family:var(--type);font-size:15px}
.az a,.az span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:44px;border-radius:3px}
.az a{background:var(--card);text-decoration:none;font-weight:700;box-shadow:0 1px 0 rgba(30,36,35,.12)}
.az a:hover{background:var(--guide)}
.az span{color:#8C9693}
.guide-letter{scroll-margin-top:28px;justify-content:center;min-height:212px}
.guide-letter .guide-t{font-size:64px;line-height:1;font-weight:700;letter-spacing:0}
.guide-letter .guide-n{font-size:14px}
