/* Wander — like a travel notebook: kraft paper, deep teal ink, sunset-orange
   stamp accents, dashed postcard edges. Two motifs only (postcard dash +
   stamp accent) — warm and characterful, never overloaded. */
body[data-theme="wander"] {
    --font-size-base: 20px;
    --tap: 48px;

    --font-display: Georgia, "Times New Roman", serif;
    --paper: #f4eddc;
    --paper-raised: #fffaf0;
    --ink: #22322f;
    --muted-ink: #4a5a56;
    --line: #cbb98f;
    --accent: #8f3c11;
    --accent-ink: #fffaf0;
    --accent-soft: #efe3c9;
    --danger: #8a2f1c;
    --danger-soft: #f6e3d9;
    --ok: #2c6e49;
    --ok-soft: #e4efdd;

    /* the "stamp" accent: decorative edges only (text always sits on
       --accent or --ink, both >= 7:1 on the papers) */
    --stamp: #c2571a;
    --radius: 8px;
    --shadow: 2px 3px 0 rgba(74, 90, 86, 0.12);
}

/* Warm display type */
body[data-theme="wander"] h1,
body[data-theme="wander"] h2,
body[data-theme="wander"] h3,
body[data-theme="wander"] .item-title,
body[data-theme="wander"] .site-name {
    font-family: var(--font-display);
}

/* Motif 1 — postcard dash */
body[data-theme="wander"] .card,
body[data-theme="wander"] .plain-list > li,
body[data-theme="wander"] .comment {
    border: 2px dashed var(--stamp);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    background: var(--paper-raised);
}

/* Motif 2 — the stamp edge under the header */
body[data-theme="wander"] .site-header {
    background: var(--paper-raised);
    border-bottom: 4px solid var(--stamp);
}
body[data-theme="wander"] .site-nav {
    border-bottom: 1px dashed var(--line);
}
body[data-theme="wander"] .btn--primary {
    background: var(--accent);
    border-color: var(--accent);
}

/* A whisper of ruled paper in post bodies (the notebook hint — kept faint
   so long text stays perfectly readable). */
body[data-theme="wander"] .post-body {
    background-image: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent calc(var(--fs-body) * 1.65 - 1px),
        rgba(15, 76, 74, 0.10) calc(var(--fs-body) * 1.65 - 1px),
        rgba(15, 76, 74, 0.10) calc(var(--fs-body) * 1.65)
    );
}