@font-face { font-family: "Instrument Serif"; src: url("/fonts/InstrumentSerif_400Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("/fonts/Manrope_500Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("/fonts/Manrope_700Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Manrope"; src: url("/fonts/Manrope_800ExtraBold.ttf") format("truetype"); font-weight: 800; font-display: swap; }
:root {
  color-scheme: light;
  --bg: #FBF6F2; --surface: #F5EBE6; --edge: #E3CFC7;
  --text: #3B2A28; --prose: #6B5852; --muted: #8B7570; --inverse: #FFF8F5;
  --accent: #A6484E; --accent-deep: #8C3A3F; --plum: #5B2A3D;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font: 500 17px/1.6 "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: var(--accent-deep); text-underline-offset: 3px; }
.wrap { max-width: 60rem; margin: 0 auto; padding: 0 1.5rem; }
.top { border-bottom: 1px solid var(--edge); }
.top-row { display: flex; align-items: center; justify-content: space-between; min-height: 4.5rem; }
.wordmark { font: 400 2.1rem/1 "Instrument Serif", Georgia, serif; color: var(--text); text-decoration: none; }
nav a { font-weight: 700; text-decoration: none; }
h1 { font: 400 clamp(2.6rem, 7vw, 4.4rem)/1.05 "Instrument Serif", Georgia, serif; margin: 3.5rem 0 1.25rem; max-width: 14em; }
h2 { font-weight: 800; font-size: 1.05rem; letter-spacing: 0.02em; margin: 2.25rem 0 0.5rem; }
p, li { color: var(--prose); }
.lede { font-size: 1.2rem; max-width: 36em; }
.soon, .age { font-weight: 700; color: var(--text); }
.age { color: var(--muted); font-size: 0.95rem; }
.stores { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.button { display: inline-block; padding: 0.8rem 1.3rem; color: var(--inverse); text-decoration: none; font-weight: 800; background: linear-gradient(135deg, var(--accent-deep), var(--plum)); border-radius: 14px; }
.rule { height: 4px; margin: 3rem 0 0.5rem; background: linear-gradient(90deg, #D1A85E, #A6484E 55%, #5B2A3D); }
.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 0 2.5rem; padding-bottom: 3rem; }
.rarities { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rarities li { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.3rem 0.7rem; background: var(--surface); border: 1px solid var(--edge); color: var(--text); font-weight: 700; font-size: 0.9rem; }
.dot { width: 0.6rem; height: 0.6rem; border-radius: 50%; display: inline-block; }
.dot.common { background: #D9A0AC; } .dot.rare { background: #8CA9C4; } .dot.splendid { background: #A98CC4; }
.dot.marvelous { background: #A6484E; } .dot.art { background: #D1A85E; }
.prose { max-width: 40rem; padding-bottom: 3rem; }
.prose ul { padding-left: 1.2rem; }
.prose li { margin: 0.4rem 0; }
.prose strong { color: var(--text); }
.foot { border-top: 1px solid var(--edge); padding: 1.5rem 0 2.5rem; font-size: 0.9rem; }
.foot p { margin: 0.35rem 0; color: var(--muted); }
.foot .links a { font-weight: 700; }