/* Ravenline's pages: the app's own look, a parchment leaf on a dark night. */
@font-face { font-family: 'Alegreya'; src: url(fonts/Alegreya.ttf) format('truetype'); font-weight: 400 900; font-display: swap; }
@font-face { font-family: 'Alegreya'; src: url(fonts/Alegreya-Italic.ttf) format('truetype'); font-weight: 400 900; font-style: italic; font-display: swap; }
@font-face { font-family: 'Alegreya SC'; src: url(fonts/AlegreyaSC-Medium.ttf) format('truetype'); font-weight: 400 600; font-display: swap; }

:root {
  --night: #17131c;
  --ink: #2e2118;
  --dim: #6b5644;
  --wine: #8a2434;
  --line: #b89a74;
}

* { box-sizing: border-box; }

html { background: var(--night); }

body {
  margin: 0;
  min-height: 100vh;
  padding: 28px 16px 48px;
  font: 18px/1.6 'Alegreya', Georgia, serif;
  color: var(--ink);
  background: radial-gradient(ellipse at top, #2a2033 0%, var(--night) 60%);
}

header { text-align: center; margin-bottom: 18px; }
header a { display: inline-block; }
header img { width: min(440px, 86vw); height: auto; }

main {
  max-width: 760px;
  margin: 0 auto;
  padding: 40px clamp(22px, 6vw, 64px) 44px;
  background: #e9dcc0 url(img/parchment.jpg) center / cover;
  border-radius: 6px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.55), inset 0 0 70px rgba(90, 60, 30, 0.35);
}

h1, h2 { font-family: 'Alegreya SC', 'Alegreya', Georgia, serif; font-weight: 500; line-height: 1.2; }
h1 { font-size: 34px; margin: 0 0 6px; text-align: center; }
h2 { font-size: 23px; margin: 34px 0 8px; padding-bottom: 4px; border-bottom: 1px solid var(--line); }
p, ul { margin: 0 0 14px; }
ul { padding-left: 24px; }
li { margin: 4px 0; }
a { color: var(--wine); }
.lead { text-align: center; font-size: 20px; font-style: italic; color: var(--dim); margin-bottom: 26px; }
.date { text-align: center; color: var(--dim); margin-bottom: 26px; }
.seal { display: block; width: 96px; height: 96px; margin: 30px auto 0; }
code { font-size: 16px; background: rgba(120, 90, 50, 0.15); padding: 1px 5px; border-radius: 3px; }

nav { text-align: center; margin: 22px auto 0; font-family: 'Alegreya SC', 'Alegreya', Georgia, serif; font-size: 17px; }
nav a { color: #e6bd76; margin: 0 12px; text-decoration: none; }
nav a:hover { text-decoration: underline; }
footer { text-align: center; color: #8f8199; font-size: 15px; margin-top: 10px; }