/* =====================================================
   THE REDAN — Yardage Book theme (yardagebook.css)
   Palette/chrome ported from yardage-book-renderer's book_template.html.
   Kept as its own --yb-* token set, distinct from theme.css's --cb-*
   "Caddie Book" tokens (close but not identical hex values).
   ===================================================== */

:root {
    --paper: #F7F5EE;
    --page: #FDFCF8;
    --ink: #242A21;
    --faint: #9A968A;
    --fairway: #DCEBC5;
    --roughlt: #A8C296;
    --greenfill: #A3CF8F;
    --bunker: #EBDFC6;
    --water: #C3DBE9;
    --fromtee: #1E7A33;
    --carry: #8A5A00;
    --elev: #C03B2B;
    --measure: #0E5AA7;
    --rule: #D8D4C4;
    --cartpath: #C8C4B0;
    --pathfill: #D4D0BC;
    --treefill: #7AAE6E;
    --treestroke: #5A8A4A;
    --driving_range: #DCE8C0;
    --ob: #F5EFE0;
    --ctxfill: #E7E5DB;
    --ctxstroke: #CDCABA;
    --pagebg: #FDFCF8;
    --yb-paper: #F7F5EE;
    --yb-page: #FDFCF8;
    --yb-ink: #242A21;
    --yb-faint: #9A968A;
    --yb-fairway: #DCEBC5;
    --yb-rough: #A8C296;
    --yb-green: #A3CF8F;
    --yb-bunker: #EBDFC6;
    --yb-water: #C3DBE9;
    --yb-fromtee: #1E7A33;
    --yb-elev: #C03B2B;
    --yb-rule: #D8D4C4;
    --yb-ctxfill: #E7E5DB;
    --yb-ctxstroke: #CDCABA;
    --yb-fairway-stroke: #a8a48e;
    --yb-rough-stroke: #cbd1b6;
    --yb-green-stroke: #5e7a52;
}

.yb-pagecard {
    background: var(--yb-page);
    border: 1px solid var(--yb-rule);
    border-radius: 4px;
    box-shadow: 0 1px 0 var(--yb-rule);
    position: relative;
    overflow: hidden;
}

.yb-cap {
    position: absolute; top: 8px; left: 12px; z-index: 5;
    font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
    color: var(--yb-faint);
    font-family: 'Oswald', system-ui, sans-serif;
    pointer-events: none;
}

.yb-stamp {
    position: absolute; top: 8px; right: 12px; z-index: 5;
    font-size: 10px; letter-spacing: .2em;
    color: var(--yb-elev);
    border: 1.5px solid var(--yb-elev);
    padding: 2px 7px;
    border-radius: 3px;
    transform: rotate(3deg);
    opacity: .75;
    font-family: 'Oswald', system-ui, sans-serif;
    pointer-events: none;
    background: var(--yb-page);
}

.yb-tee-pill-row {
    display: flex;
    gap: 6px;
    margin-bottom: 0.6rem;
}
.yb-tee-pill {
    font-family: 'Oswald', system-ui, sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 5px 14px;
    border-radius: 14px;
    cursor: pointer;
    background: var(--yb-page);
    transition: background 0.15s, color 0.15s;
}
.yb-tee-pill[data-color="blue"]  { border: 1.5px solid #2244CC; color: #2244CC; }
.yb-tee-pill[data-color="blue"].active  { background: #2244CC; color: #fff; }
.yb-tee-pill[data-color="white"] { border: 1.5px solid #AAAAAA; color: #666; }
.yb-tee-pill[data-color="white"].active { background: #DDDDDD; color: #333; }
.yb-tee-pill[data-color="red"]   { border: 1.5px solid #CC2222; color: #CC2222; }
.yb-tee-pill[data-color="red"].active   { background: #CC2222; color: #fff; }

.yb-view-toggle-row {
    display: flex;
    gap: 6px;
    margin-bottom: 0.6rem;
}
.yb-view-toggle {
    font-family: 'Oswald', system-ui, sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 6px 16px;
    border-radius: 8px;
    cursor: pointer;
    border: 1.5px solid var(--yb-ink);
    background: var(--yb-page);
    color: var(--yb-ink);
}
.yb-view-toggle.active {
    background: var(--yb-ink);
    color: var(--yb-page);
}