:root {
    --gold: #c9a961;
    --gold-dim: rgba(201, 169, 97, 0.4);
}

html, body {
    background:
        radial-gradient(ellipse at top, #1f1810 0%, transparent 60%),
        radial-gradient(ellipse at bottom, #130f08 0%, transparent 70%),
        #0a0a0a;
    color: #f0e8d0;
}

.site-header h1 {
    font-family: "Noto Serif JP", serif;
    font-weight: 500;
    color: #f5ecc8;
    display: inline-block;
    position: relative;
    padding-bottom: 0.35rem;
}

.site-header h1::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2.8rem;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

.site-header .subtitle {
    font-family: "Noto Serif JP", serif;
    color: var(--gold);
    opacity: 0.75;
    font-size: 0.7rem;
    margin-top: 0.45rem;
    letter-spacing: 0.2em;
}

.book .page { background: #faf7ef; }

.ctrl-btn {
    color: var(--gold);
    border: 1px solid var(--gold-dim);
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.1em;
    background: rgba(201, 169, 97, 0.04);
}

.ctrl-btn:hover {
    background: rgba(201, 169, 97, 0.13);
    border-color: var(--gold);
    color: #f5ecc8;
}

.page-indicator {
    color: var(--gold);
    font-family: "Noto Serif JP", serif;
    letter-spacing: 0.08em;
}

.site-footer {
    color: rgba(240, 232, 208, 0.4);
    font-family: "Noto Serif JP", serif;
}