@font-face { font-family: "Newsreader"; src: url("fonts/Newsreader-Variable.ttf") format("truetype");
  font-weight: 200 800; font-display: swap; }
:root { --bg:#F3EEE4; --card:#FFFCF5; --sunk:#E9E2D4; --ink:#1B1C30; --ink2:#46475A; --ink3:#6A665F;
  --line:rgba(27,28,48,.11); --sig:#C23B1A; --night:#1B1D35; --onNight:#F4ECDD; --brass:#93702C; color-scheme:light; }
@media (prefers-color-scheme: dark) { :root { --bg:#0A0D18; --card:#141A2B; --sunk:#1D2438; --ink:#F4ECDD;
  --ink2:#C0B8A8; --ink3:#9C9586; --line:rgba(244,236,221,.11); --sig:#FF7B54; --night:#121A33; --brass:#DDB66E;
  color-scheme:dark; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink);
  font: 17px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
main { max-width: 720px; margin: 0 auto; padding: 32px 20px 64px; }
header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 40px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none;
  font-family: "Newsreader", Georgia, serif; font-size: 24px; font-weight: 500; }
.brand img { width: 40px; height: 40px; border-radius: 9px; }
nav { display: flex; gap: 18px; font-size: 15px; font-weight: 600; flex-wrap: wrap; }
nav a { color: var(--ink2); text-decoration: none; padding: 10px 0; }
nav a[aria-current="page"] { color: var(--sig); }
.over { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--sig); }
h1 { font-family: "Newsreader", Georgia, serif; font-weight: 500; font-size: clamp(36px, 7vw, 48px);
  line-height: 1.05; letter-spacing: -.02em; margin: 8px 0 14px; text-wrap: balance; }
h2 { font-family: "Newsreader", Georgia, serif; font-weight: 500; font-size: 24px; margin: 34px 0 8px; }
p, li { color: var(--ink2); max-width: 65ch; }
.muted { color: var(--ink3); font-size: 15px; }
a { color: var(--sig); }
.card { background: var(--card); border-radius: 24px; padding: 20px 22px; margin: 22px 0; box-shadow: 0 1px 0 var(--line); }
.night { background: var(--night); color: var(--onNight); border-radius: 24px; padding: 22px; margin: 22px 0; }
.night .over { color: #DDB66E; } .night p { color: rgba(244,236,221,.85); }
.mail { font-family: "Newsreader", Georgia, serif; font-size: 26px; color: var(--onNight); word-break: break-all; }
details { background: var(--card); border-radius: 18px; padding: 14px 18px; margin: 10px 0; box-shadow: 0 1px 0 var(--line); }
summary { cursor: pointer; font-weight: 600; color: var(--ink); min-height: 28px; }
details p { margin: 10px 0 2px; }
footer { margin-top: 56px; display: flex; gap: 18px; flex-wrap: wrap; font-size: 14px; color: var(--ink3); }
footer a { color: var(--ink3); }
