/* wyrd.dev — a plain paper in the home's type (site98, revision 2): the First Edition license.
   Fonts self-hosted (OFL 1.1); no script on this page. */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/cormorant-garamond-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/cormorant-garamond-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); }
:root { --void: #050505; --bone: #D8D4C8; --bone-dim: rgba(216, 212, 200, 0.74); --bone-quiet: rgba(216, 212, 200, 0.62);
  --bone-faint: rgba(216, 212, 200, 0.16); --amber: #F5A623; --amber-faint: rgba(245, 166, 35, 0.34); --teal: #1ECBE1;
  --serif: "Cormorant Garamond", Garamond, Georgia, serif; --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --gutter: clamp(16px, 5vw, 72px); color-scheme: dark; }
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--void); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--void); color: var(--bone); font-family: var(--serif); font-size: 20px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--amber); text-decoration: none; border-bottom: 1px solid var(--amber-faint); }
a:hover, a:focus-visible { border-bottom-color: var(--amber); }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 4px; } /* the First Edition's license: the album's ground, no teal */
.caps { font-family: var(--sans); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; }
.paper-top { padding: 18px var(--gutter); }
.mark { display: inline-flex; align-items: center; gap: 12px; border: 0; color: var(--amber); font-family: var(--serif); font-size: 21px; letter-spacing: 0.42em; }
.mark .emblem { width: auto; height: 30px; }
.paper { max-width: 40rem; margin: 0 auto; padding: 24px var(--gutter) 64px; }
h1 { font-weight: 400; font-size: clamp(32px, 5vw, 48px); line-height: 1.08; margin: 0 0 18px; }
h1 em { color: var(--amber); }
h2 { font-family: var(--sans); font-weight: 500; font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--bone-dim); margin: 34px 0 8px; }
p, li { color: var(--bone); }
.lede { color: var(--bone-dim); font-style: italic; }
.alpha { list-style: lower-alpha; padding-left: 1.4em; }
.alpha li { margin: 0 0 8px; }
.back { margin-top: 40px; }
.paper-foot { padding: 30px var(--gutter) 46px; display: grid; gap: 12px; justify-items: center; font-family: var(--sans); font-size: 12.5px; color: var(--bone-quiet); border-top: 1px solid var(--bone-faint); }
.paper-foot nav { display: flex; flex-wrap: wrap; gap: 6px 18px; justify-content: center; }
.paper-foot a { color: var(--bone-dim); border-bottom-color: transparent; padding: 10px 0; }
@media (max-width: 600px) { body { font-size: 18px; } }
