:root {
    --bg: #F8F6F3;
    --text: #1a1a1a;
    --text-muted: #555555;
    --font-display: 'Cinzel', serif;
    --font-body: 'Inter', sans-serif;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.75;
}
.reading { max-width: 46rem; margin: 0 auto; padding: 0 24px; }
a { color: inherit; text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid var(--text); outline-offset: 5px; }
header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid #E5E0DA;
    padding: 32px 0;
    margin-bottom: 48px;
    font-size: 12px;
}
.logo {
    font-family: var(--font-display);
    font-size: 1.25rem;
    letter-spacing: 0.3em;
    text-decoration: none;
}
.logo-meaning { font-size: 0.65rem; letter-spacing: 0.15em; display: inline-block; }
h1 {
    font-family: var(--font-display);
    font-size: clamp(24px, 4.5vw, 32px);
    letter-spacing: 0.05em;
    font-weight: 500;
    line-height: 1.4;
    margin: 0 0 22px;
    text-wrap: balance;
}
h2 { font-size: 19px; font-weight: 500; margin: 0 0 12px; }
p { margin: 0 0 1.2em; }
.intro { margin-bottom: 38px; max-width: 36rem; }
section { margin-bottom: 38px; }
ul { list-style: none; margin: 0; padding: 0; }
li { margin-bottom: 9px; }
li a { display: inline-block; padding: 3px 0; }
.back { font-size: 14px; margin: 32px 0; }
.label { color: var(--text-muted); font-size: 13px; margin-bottom: 12px; }
.prose { font-size: 18px; line-height: 1.85; }
footer {
    border-top: 1px solid #E5E0DA;
    color: var(--text-muted);
    font-size: 12px;
    margin-top: 52px;
    padding: 22px 0 40px;
}
.skip { position: absolute; top: 0; transform: translateY(-150%); padding: 8px; background: var(--bg); }
.skip:focus { transform: none; }
@media (max-width: 480px) {
    header { align-items: flex-start; gap: 12px; flex-direction: column; margin-bottom: 36px; }
}
@media print {
    header, .back, .skip { display: none; }
    .reading { max-width: none; padding: 0; }
}
