/* CSS for UI elements (a.k.a. chrome) */

html {
    scrollbar-color: var(--scrollbar) var(--bg);
}
#searchresults a,
.content a:link,
a:visited,
a > .hljs {
    color: var(--links);
}

/*
    body-container is necessary because mobile browsers don't seem to like
    overflow-x on the body tag when there is a <meta name="viewport"> tag.
*/
#body-container {
    /*
        This is used when the sidebar pushes the body content off the side of
        the screen on small screens. Without it, dragging on mobile Safari
        will want to reposition the viewport in a weird way.
    */
    overflow-x: clip;
}

/* Menu Bar */

/* BARTLEY: the mdbook controls remain a 50px row; the shared publisher
   lockup adds a second row while --menu-bar-height stays the total height
   used by sticky offsets, anchors, search popups, and page TOCs. */
:root {
    --bartley-menu-controls-height: 30px;
    --bartley-lockup-row-height: 34px;
    --menu-bar-height: calc(var(--bartley-menu-controls-height) + var(--bartley-lockup-row-height));
}

#menu-bar,
#menu-bar-hover-placeholder {
    z-index: 101;
    margin: auto calc(0px - var(--page-padding));
}
#menu-bar {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: var(--bg);
    border-block-end-color: var(--theme-popup-border);
    border-block-end-width: 1px;
    border-block-end-style: solid;
}
.menu-controls-row {
    display: flex;
    align-items: stretch;
    width: 100%;
    min-height: var(--bartley-menu-controls-height);
}
#menu-bar.sticky,
#menu-bar-hover-placeholder:hover + #menu-bar,
#menu-bar:hover,
html.sidebar-visible #menu-bar {
    position: -webkit-sticky;
    position: sticky;
    top: 0 !important;
}
#menu-bar-hover-placeholder {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    height: var(--menu-bar-height);
}
#menu-bar.bordered {
    border-block-end-color: var(--table-border-color);
}
.bartley-dark #menu-bar {
    border-block-end-color: var(--sidebar-non-existant);
}
#menu-bar i, #menu-bar .icon-button {
    position: relative;
    padding: 0 8px;
    z-index: 10;
    line-height: var(--bartley-menu-controls-height);
    cursor: pointer;
    transition: color 0.5s;
}
@media only screen and (max-width: 420px) {
    #menu-bar i, #menu-bar .icon-button {
        padding: 0 5px;
    }
}

.icon-button {
    border: none;
    background: none;
    padding: 0;
    color: inherit;
}
.icon-button i {
    margin: 0;
}

.right-buttons {
    display: flex;
    margin: 0 15px;
}
.right-buttons a {
    text-decoration: none;
}

.left-buttons {
    display: flex;
    margin: 0 5px;
}
html:not(.js) .left-buttons button {
    display: none;
}

.menu-title {
    display: inline-block;
    font-weight: 200;
    font-size: 2.4rem;
    line-height: var(--bartley-menu-controls-height);
    text-align: center;
    margin: 0;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.menu-title {
    cursor: pointer;
}

/* BARTLEY: compact Bartley Editions lockup row shared by every book. */
.bartley-lockup-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: var(--bartley-lockup-row-height);
    min-height: var(--bartley-lockup-row-height);
    box-sizing: border-box;
    padding-inline-start: 13px;
}
.bartley-lockup {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    height: 24px;
    color: var(--fg);
    text-decoration: none;
    transition: opacity 150ms ease-out;
}
.bartley-lockup:hover {
    color: var(--fg);
    opacity: 0.78;
    text-decoration: none;
}
.bartley-lockup-mark {
    display: block;
    width: auto;
    height: 24px;
    flex: 0 0 auto;
}
.bartley-lockup-logotype {
    display: block;
    font-family: "Cinzel", "Trajan Pro", "Cormorant SC", "Optima", Georgia, serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.14em;
    color: currentColor;
    white-space: nowrap;
}

/* BARTLEY: labs indicator — revealed by the inline head script in index.hbs
   when the per-book head.hbs canonical URL contains /labs/. Hidden by default
   for standalone books. Visual mirrors web/styles.css .gallery-card-badge so
   the same stamp the reader sees on bartleyeditions.com/labs/ rides on every
   labs-book page. Imprint+paper colors are theme-independent on purpose. */
.bartley-labs-indicator {
    display: none;
    margin-inline-start: auto;
    margin-inline-end: 13px;
    /* Asymmetric vertical padding nudges the small-caps glyphs to the
       optical center of the box. With smcp + no descenders, the visible
       mass otherwise sits ~1px above geometric center. */
    padding: 6px 10px 4px;
    background: #6e1f1f;
    color: #f5ede0;
    font-family: "Newsreader", Georgia, "Times New Roman", serif;
    font-weight: 500;
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    text-decoration: none;
    font-feature-settings: "smcp", "kern";
    font-variation-settings: "opsz" 14;
    white-space: nowrap;
    flex: 0 0 auto;
    transition: opacity 150ms ease-out;
}
html.bartley-labs .bartley-labs-indicator {
    display: inline-flex;
    align-items: center;
}
.bartley-labs-indicator:visited {
    color: #f5ede0;
}
.bartley-labs-indicator:hover {
    color: #f5ede0;
    text-decoration: none;
    opacity: 0.78;
}

/* BARTLEY: vertical publisher lockup used on colophon pages. The mark is
   loaded as a CSS background so the path resolves relative to this stylesheet
   (theme/css/chrome.css → ../favicon.svg) regardless of where the page
   itself ends up in the post-flatten URL hierarchy. */
.bartley-publisher-lockup {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9em;
    margin: 2rem auto 2.5rem;
    color: var(--fg);
    text-decoration: none;
    transition: opacity 150ms ease-out;
}
.bartley-publisher-lockup:hover,
.bartley-publisher-lockup:visited {
    color: var(--fg);
    text-decoration: none;
}
.bartley-publisher-lockup:hover {
    opacity: 0.78;
}
.bartley-publisher-mark {
    display: block;
    width: clamp(48px, 10.5vw, 82px);
    aspect-ratio: 1989 / 2681;
    background-image: url("../favicon.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.bartley-publisher-name {
    display: block;
    font-family: "Cinzel", "Trajan Pro", "Cormorant SC", "Optima", Georgia, serif;
    font-weight: 400;
    font-size: clamp(1rem, 2.6vw, 1.35rem);
    line-height: 1;
    letter-spacing: 0.18em;
    color: currentColor;
    white-space: nowrap;
}

.menu-bar,
.menu-bar:visited,
.nav-chapters,
.nav-chapters:visited,
.mobile-nav-chapters,
.mobile-nav-chapters:visited,
.menu-bar .icon-button,
.menu-bar a i {
    color: var(--icons);
}

.menu-bar i:hover,
.menu-bar .icon-button:hover,
.nav-chapters:hover,
.mobile-nav-chapters i:hover {
    color: var(--icons-hover);
}

/* Nav Icons */

.nav-chapters {
    font-size: 2.5em;
    text-align: center;
    text-decoration: none;

    position: fixed;
    top: 0;
    bottom: 0;
    margin: 0;
    max-width: 150px;
    min-width: 90px;

    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;

    transition: color 0.5s, background-color 0.5s;
}

.nav-chapters:hover {
    text-decoration: none;
    background-color: var(--theme-hover);
    transition: background-color 0.15s, color 0.15s;
}

.nav-wrapper {
    margin-block-start: 50px;
    display: none;
}

.mobile-nav-chapters {
    font-size: 2.5em;
    text-align: center;
    text-decoration: none;
    width: 90px;
    border-radius: 5px;
    background-color: var(--sidebar-bg);
}

/* Only Firefox supports flow-relative values */
.previous { float: left; }
[dir=rtl] .previous { float: right; }

/* Only Firefox supports flow-relative values */
.next {
    float: right;
    right: var(--page-padding);
}
[dir=rtl] .next {
    float: left;
    right: unset;
    left: var(--page-padding);
}

/* Use the correct buttons for RTL layouts*/
[dir=rtl] .previous i.fa-angle-left:before {content:"\f105";}
[dir=rtl] .next i.fa-angle-right:before { content:"\f104"; }

@media only screen and (max-width: 1080px) {
    .nav-wide-wrapper { display: none; }
    .nav-wrapper { display: block; }
}

/* sidebar-visible */
@media only screen and (max-width: 1380px) {
    #sidebar-toggle-anchor:checked ~ .page-wrapper .nav-wide-wrapper { display: none; }
    #sidebar-toggle-anchor:checked ~ .page-wrapper .nav-wrapper { display: block; }
}

/* Inline code */

:not(pre) > .hljs {
    display: inline;
    padding: 0.1em 0.3em;
    border-radius: 3px;
}

:not(pre):not(a) > .hljs {
    color: var(--inline-code-color);
    overflow-x: initial;
}

a:hover > .hljs {
    text-decoration: underline;
}

pre {
    position: relative;
}
pre > .buttons {
    position: absolute;
    z-index: 100;
    right: 0px;
    top: 2px;
    margin: 0px;
    padding: 2px 0px;

    color: var(--sidebar-fg);
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.1s linear, opacity 0.1s linear;
}
pre:hover > .buttons {
    visibility: visible;
    opacity: 1
}
pre > .buttons :hover {
    color: var(--sidebar-active);
    border-color: var(--icons-hover);
    background-color: var(--theme-hover);
}
pre > .buttons i {
    margin-inline-start: 8px;
}
pre > .buttons button {
    cursor: inherit;
    margin: 0px 5px;
    padding: 4px 4px 3px 5px;
    font-size: 23px;

    border-style: solid;
    border-width: 1px;
    border-radius: 4px;
    border-color: var(--icons);
    background-color: var(--theme-popup-bg);
    transition: 100ms;
    transition-property: color,border-color,background-color;
    color: var(--icons);
}

pre > .buttons button.clip-button {
    padding: 2px 4px 0px 6px;
}
pre > .buttons button.clip-button::before {
    /* clipboard image from octicons (https://github.com/primer/octicons/tree/v2.0.0) MIT license
     */
    content: url('data:image/svg+xml,<svg width="21" height="20" viewBox="0 0 24 25" \
xmlns="http://www.w3.org/2000/svg" aria-label="Copy to clipboard">\
<path d="M18 20h2v3c0 1-1 2-2 2H2c-.998 0-2-1-2-2V5c0-.911.755-1.667 1.667-1.667h5A3.323 3.323 0 \
0110 0a3.323 3.323 0 013.333 3.333h5C19.245 3.333 20 4.09 20 5v8.333h-2V9H2v14h16v-3zM3 \
7h14c0-.911-.793-1.667-1.75-1.667H13.5c-.957 0-1.75-.755-1.75-1.666C11.75 2.755 10.957 2 10 \
2s-1.75.755-1.75 1.667c0 .911-.793 1.666-1.75 1.666H4.75C3.793 5.333 3 6.09 3 7z"/>\
<path d="M4 19h6v2H4zM12 11H4v2h8zM4 17h4v-2H4zM15 15v-3l-4.5 4.5L15 21v-3l8.027-.032L23 15z"/>\
</svg>');
    filter: var(--copy-button-filter);
}
pre > .buttons button.clip-button:hover::before {
    filter: var(--copy-button-filter-hover);
}

@media (pointer: coarse) {
    pre > .buttons button {
        /* On mobile, make it easier to tap buttons. */
        padding: 0.3rem 1rem;
    }

    .sidebar-resize-indicator {
        /* Hide resize indicator on devices with limited accuracy */
        display: none;
    }
}
pre > code {
    display: block;
    padding: 1rem;
}

/* FIXME: ACE editors overlap their buttons because ACE does absolute
   positioning within the code block which breaks padding. The only solution I
   can think of is to move the padding to the outer pre tag (or insert a div
   wrapper), but that would require fixing a whole bunch of CSS rules.
*/
.hljs.ace_editor {
  padding: 0rem 0rem;
}

pre > .result {
    margin-block-start: 10px;
}

/* Search */

#searchresults a {
    text-decoration: none;
}

mark {
    border-radius: 2px;
    padding-block-start: 0;
    padding-block-end: 1px;
    padding-inline-start: 3px;
    padding-inline-end: 3px;
    margin-block-start: 0;
    margin-block-end: -1px;
    margin-inline-start: -3px;
    margin-inline-end: -3px;
    background-color: var(--search-mark-bg);
    transition: background-color 300ms linear;
    cursor: pointer;
}

mark.fade-out {
    background-color: rgba(0,0,0,0) !important;
    cursor: auto;
}

.searchbar-outer {
    margin-inline-start: auto;
    margin-inline-end: auto;
    max-width: var(--content-max-width);
}

#searchbar {
    width: 100%;
    margin-block-start: 5px;
    margin-block-end: 0;
    margin-inline-start: auto;
    margin-inline-end: auto;
    padding: 10px 16px;
    transition: box-shadow 300ms ease-in-out;
    border: 1px solid var(--searchbar-border-color);
    border-radius: 3px;
    background-color: var(--searchbar-bg);
    color: var(--searchbar-fg);
}
#searchbar:focus,
#searchbar.active {
    box-shadow: 0 0 3px var(--searchbar-shadow-color);
}

.searchresults-header {
    font-weight: bold;
    font-size: 1em;
    padding-block-start: 18px;
    padding-block-end: 0;
    padding-inline-start: 5px;
    padding-inline-end: 0;
    color: var(--searchresults-header-fg);
}

.searchresults-outer {
    margin-inline-start: auto;
    margin-inline-end: auto;
    max-width: var(--content-max-width);
    border-block-end: 1px dashed var(--searchresults-border-color);
}

ul#searchresults {
    list-style: none;
    padding-inline-start: 20px;
}
ul#searchresults li {
    margin: 10px 0px;
    padding: 2px;
    border-radius: 2px;
}
ul#searchresults li.focus {
    background-color: var(--searchresults-li-bg);
}
ul#searchresults span.teaser {
    display: block;
    clear: both;
    margin-block-start: 5px;
    margin-block-end: 0;
    margin-inline-start: 20px;
    margin-inline-end: 0;
    font-size: 0.8em;
}
ul#searchresults span.teaser em {
    font-weight: bold;
    font-style: normal;
}

/* Sidebar */

.sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: var(--sidebar-width);
    font-size: 0.875em;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    background-color: var(--sidebar-bg);
    color: var(--sidebar-fg);
}
.sidebar-iframe-inner {
    --padding: 10px;

    background-color: var(--sidebar-bg);
    padding: var(--padding);
    margin: 0;
    font-size: 1.4rem;
    color: var(--sidebar-fg);
    min-height: calc(100vh - var(--padding) * 2);
}
.sidebar-iframe-outer {
    border: none;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
[dir=rtl] .sidebar { left: unset; right: 0; }
.sidebar-resizing {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
html:not(.sidebar-resizing) .sidebar {
    transition: transform 0.3s; /* Animation: slide away */
}
.sidebar code {
    line-height: 2em;
}
.sidebar .sidebar-scrollbox {
    overflow-y: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 10px 10px;
}
.sidebar .sidebar-resize-handle {
    position: absolute;
    cursor: col-resize;
    width: 0;
    right: calc(var(--sidebar-resize-indicator-width) * -1);
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
}

.sidebar-resize-handle .sidebar-resize-indicator {
    width: 100%;
    height: 16px;
    color: var(--icons);
    margin-inline-start: var(--sidebar-resize-indicator-space);
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.sidebar-resize-handle .sidebar-resize-indicator::before {
    content: "";
    width: 2px;
    height: 12px;
    border-left: dotted 2px currentColor;
}
.sidebar-resize-handle .sidebar-resize-indicator::after {
    content: "";
    width: 2px;
    height: 16px;
    border-left: dotted 2px currentColor;
}

[dir=rtl] .sidebar .sidebar-resize-handle {
    left: calc(var(--sidebar-resize-indicator-width) * -1);
    right: unset;
}
.js .sidebar .sidebar-resize-handle {
    cursor: col-resize;
    width: calc(var(--sidebar-resize-indicator-width) - var(--sidebar-resize-indicator-space));
}
/* sidebar-hidden */
#sidebar-toggle-anchor:not(:checked) ~ .sidebar {
    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
    z-index: -1;
}
[dir=rtl] #sidebar-toggle-anchor:not(:checked) ~ .sidebar {
    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
}
.sidebar::-webkit-scrollbar {
    background: var(--sidebar-bg);
}
.sidebar::-webkit-scrollbar-thumb {
    background: var(--scrollbar);
}

/* sidebar-visible */
#sidebar-toggle-anchor:checked ~ .page-wrapper {
    transform: translateX(calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width)));
}
[dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
    transform: translateX(calc(0px - var(--sidebar-width) - var(--sidebar-resize-indicator-width)));
}
@media only screen and (min-width: 620px) {
    #sidebar-toggle-anchor:checked ~ .page-wrapper {
        transform: none;
        margin-inline-start: calc(var(--sidebar-width) + var(--sidebar-resize-indicator-width));
    }
    [dir=rtl] #sidebar-toggle-anchor:checked ~ .page-wrapper {
        transform: none;
    }
}

.chapter {
    list-style: none outside none;
    padding-inline-start: 0;
    line-height: 2.2em;
}

.chapter ol {
    width: 100%;
}

.chapter li {
    display: flex;
    color: var(--sidebar-non-existant);
}
.chapter li a {
    display: block;
    padding: 0;
    text-decoration: none;
    color: var(--sidebar-fg);
}

.chapter li a:hover {
    color: var(--sidebar-active);
}

.chapter li a.active {
    color: var(--sidebar-active);
}

.chapter li > a.toggle {
    cursor: pointer;
    display: block;
    margin-inline-start: auto;
    padding: 0 10px;
    user-select: none;
    opacity: 0.68;
}

.chapter li > a.toggle div {
    transition: transform 0.5s;
}

/* collapse the section */
.chapter li:not(.expanded) + li > ol {
    display: none;
}

.chapter li.chapter-item {
    line-height: 1.5em;
    margin-block-start: 0.6em;
}

.chapter li.expanded > a.toggle div {
    transform: rotate(90deg);
}

.spacer {
    width: 100%;
    height: 3px;
    margin: 5px 0px;
}
.chapter .spacer {
    background-color: var(--sidebar-spacer);
}

@media (-moz-touch-enabled: 1), (pointer: coarse) {
    .chapter li a { padding: 5px 0; }
    .spacer { margin: 10px 0; }
}

.section {
    list-style: none outside none;
    padding-inline-start: 20px;
    line-height: 1.9em;
}

/* Theme Menu Popup */

.theme-popup {
    position: absolute;
    left: 10px;
    top: var(--menu-bar-height);
    z-index: 1000;
    border-radius: 4px;
    font-size: 0.7em;
    color: var(--fg);
    background: var(--theme-popup-bg);
    border: 1px solid var(--theme-popup-border);
    margin: 0;
    padding: 0;
    list-style: none;
    display: none;
    /* Don't let the children's background extend past the rounded corners. */
    overflow: hidden;
}
[dir=rtl] .theme-popup { left: unset;  right: 10px; }
.theme-popup .default {
    color: var(--icons);
}
.theme-popup .theme {
    width: 100%;
    border: 0;
    margin: 0;
    padding: 2px 20px;
    line-height: 25px;
    white-space: nowrap;
    text-align: start;
    cursor: pointer;
    color: inherit;
    background: inherit;
    font-size: inherit;
}
.theme-popup .theme:hover {
    background-color: var(--theme-hover);
}

.theme-selected::before {
    display: inline-block;
    content: "✓";
    margin-inline-start: -14px;
    width: 14px;
}

/* The container for the help popup that covers the whole window. */
#mdbook-help-container {
    /* Position and size for the whole window. */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* This uses flex layout (which is set in book.js), and centers the popup
       in the window.*/
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    /* Dim out the book while the popup is visible. */
    background: var(--overlay-bg);
}

/* The popup help box. */
#mdbook-help-popup {
    box-shadow: 0 4px 24px rgba(0,0,0,0.15);
    min-width: 300px;
    max-width: 500px;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--bg);
    color: var(--fg);
    border-width: 1px;
    border-color: var(--theme-popup-border);
    border-style: solid;
    border-radius: 8px;
    padding: 10px;
}

.mdbook-help-title {
    text-align: center;
    /* mdbook's margin for h2 is way too large. */
    margin: 10px;
}

/* ============================================================================
   BARTLEY: house-theme treatments — scoped to .bartley-light and .bartley-dark
   so the five stock themes (Light, Rust, Coal, Navy, Ayu) remain pristine.
   Mirrors web/styles.css editorial idiom: hairlines, gold-bordered blockquotes,
   imprint-coloured links with thin underlines, Cinzel running head.
   ============================================================================ */

/* Heading hierarchy — Newsreader weight contrast, opsz axis tuned per level
   (matches the platform site's editorial rhythm). */
.bartley-light .content h1, .bartley-dark .content h1,
.bartley-light .content h2, .bartley-dark .content h2,
.bartley-light .content h3, .bartley-dark .content h3,
.bartley-light .content h4, .bartley-dark .content h4,
.bartley-light .content h5, .bartley-dark .content h5,
.bartley-light .content h6, .bartley-dark .content h6 {
    font-family: "Newsreader", "Source Serif Pro", Georgia, "Times New Roman", serif;
}
.bartley-light .content h1, .bartley-dark .content h1 {
    font-weight: 300;
    font-variation-settings: "opsz" 60;
    letter-spacing: 0.005em;
}
.bartley-light .content h2, .bartley-dark .content h2 {
    font-weight: 300;
    font-variation-settings: "opsz" 36;
    letter-spacing: 0.005em;
}
.bartley-light .content h3, .bartley-dark .content h3 {
    font-weight: 400;
    font-variation-settings: "opsz" 24;
}
.bartley-light .content h4, .bartley-dark .content h4 {
    font-weight: 500;
    font-variation-settings: "opsz" 20;
    font-style: italic;
}
.bartley-light .content h5, .bartley-dark .content h5 {
    font-weight: 500;
    font-variation-settings: "opsz" 18;
    font-style: italic;
}
.bartley-light .content h6, .bartley-dark .content h6 {
    font-weight: 500;
    font-variation-settings: "opsz" 16;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-size: 0.85em;
}

/* Cinzel running head in the menu-bar — every Bartley book gets a small
   logotype-flavoured book title as a constant brand cue. */
.bartley-light .menu-title,
.bartley-dark .menu-title {
    font-family: "Cinzel", "Trajan Pro", "Cormorant SC", "Optima", Georgia, serif;
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

/* Hairline rules — replace mdbook's default heavier borders with 0.5px
   warm-tan dividers, mirroring the platform site's `0.5px solid var(--rule)`. */
.bartley-light .menu-bar,
.bartley-dark .menu-bar {
    border-bottom: 0.5px solid var(--theme-popup-border);
}
.bartley-light .content hr,
.bartley-dark .content hr {
    border: none;
    border-top: 0.5px solid var(--table-border-color);
    margin: 2em 0;
}
.bartley-light .content table,
.bartley-dark .content table {
    border: 0.5px solid var(--table-border-color);
}
.bartley-light .content table th,
.bartley-dark .content table th,
.bartley-light .content table td,
.bartley-dark .content table td {
    border: none;
    border-bottom: 0.5px solid var(--table-border-color);
}
.bartley-light .nav-wrapper,
.bartley-dark .nav-wrapper,
.bartley-light .nav-wide-wrapper,
.bartley-dark .nav-wide-wrapper {
    border-top: 0.5px solid var(--table-border-color);
}

/* Blockquote — gold left border is the only place gold appears in body content,
   echoing brand-standards.md "monogram is gold; nothing else". */
.bartley-light .content blockquote,
.bartley-dark .content blockquote {
    border: none;
    border-left: 4px solid var(--quote-border);
    background: var(--quote-bg);
    padding: 0.6em 1.2em;
    margin: 1.4em 0;
}

/* Links inside content — imprint colour, 0.5px underline with offset,
   smooth fade to fg on hover. Sidebar links keep their own (unstyled) treatment. */
.bartley-light .content a:link,
.bartley-light .content a:visited,
.bartley-dark .content a:link,
.bartley-dark .content a:visited {
    color: var(--links);
    text-decoration: underline;
    text-decoration-thickness: 0.5px;
    text-underline-offset: 3px;
    transition: color 120ms ease-out;
}
.bartley-light .content a:hover,
.bartley-dark .content a:hover {
    color: var(--fg);
}

/* Selection — imprint bg / paper fg in light; gold-lifted bg / ink fg in dark. */
.bartley-light ::selection {
    background: #6e1f1f;        /* imprint */
    color: #f5ede0;             /* paper */
}
.bartley-dark ::selection {
    background: #d6b370;        /* gold-lifted */
    color: #1a1612;             /* ink */
}

/* Divider element between Auto/Bartley pair and the stock themes
   in the theme picker popup. */
.theme-popup .theme-divider {
    height: 0.5px;
    background: var(--theme-popup-border);
    margin: 0.4em 0;
    list-style: none;
    padding: 0;
}

/* Print: don't waste toner on dark-theme code blocks. mdbook's stock
   print.css resets bg/fg to white/black for prose, but pre/code keep
   the live theme palette. Force them flat for print. */
@media print {
    .bartley-light pre, .bartley-dark pre,
    .bartley-light code, .bartley-dark code {
        background: white !important;
        color: black !important;
        border: 0.5px solid #999 !important;
    }
}