/*
:Author: David Goodger (goodger@python.org)
:Id: $Id: html4css1.css 7952 2016-07-26 18:15:59Z milde $
:Copyright: This stylesheet has been placed in the public domain.

Default cascading style sheet for the HTML output of Docutils.

See http://docutils.sf.net/docs/howto/html-stylesheets.html for how to
customize this style sheet.
*/

/* used to remove borders from tables and images */
.borderless, table.borderless td, table.borderless th {
  border: 0 }

table.borderless td, table.borderless th {
  /* Override padding for "table.docutils td" with "! important".
     The right padding separates the table cells. */
  padding: 0 0.5em 0 0 ! important }

.first {
  /* Override more specific margin styles with "! important". */
  margin-top: 0 ! important }

.last, .with-subtitle {
  margin-bottom: 0 ! important }

.hidden {
  display: none }

.subscript {
  vertical-align: sub;
  font-size: smaller }

.superscript {
  vertical-align: super;
  font-size: smaller }

a.toc-backref {
  text-decoration: none ;
  color: black }

blockquote.epigraph {
  margin: 2em 5em ; }

dl.docutils dd {
  margin-bottom: 0.5em }

object[type="image/svg+xml"], object[type="application/x-shockwave-flash"] {
  overflow: hidden;
}

/* Uncomment (and remove this text!) to get bold-faced definition list terms
dl.docutils dt {
  font-weight: bold }
*/

div.abstract {
  margin: 2em 5em }

div.abstract p.topic-title {
  font-weight: bold ;
  text-align: center }

div.admonition, div.attention, div.caution, div.danger, div.error,
div.hint, div.important, div.note, div.tip, div.warning {
  margin: 2em ;
  border: medium outset ;
  padding: 1em }

div.admonition p.admonition-title, div.hint p.admonition-title,
div.important p.admonition-title, div.note p.admonition-title,
div.tip p.admonition-title {
  font-weight: bold ;
  font-family: sans-serif }

div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title, .code .error {
  color: red ;
  font-weight: bold ;
  font-family: sans-serif }

/* Uncomment (and remove this text!) to get reduced vertical space in
   compound paragraphs.
div.compound .compound-first, div.compound .compound-middle {
  margin-bottom: 0.5em }

div.compound .compound-last, div.compound .compound-middle {
  margin-top: 0.5em }
*/

div.dedication {
  margin: 2em 5em ;
  text-align: center ;
  font-style: italic }

div.dedication p.topic-title {
  font-weight: bold ;
  font-style: normal }

div.figure {
  margin-left: 2em ;
  margin-right: 2em }

div.footer, div.header {
  clear: both;
  font-size: smaller }

div.line-block {
  display: block ;
  margin-top: 1em ;
  margin-bottom: 1em }

div.line-block div.line-block {
  margin-top: 0 ;
  margin-bottom: 0 ;
  margin-left: 1.5em }

div.sidebar {
  margin: 0 0 0.5em 1em ;
  border: medium outset ;
  padding: 1em ;
  background-color: #ffffee ;
  width: 40% ;
  float: right ;
  clear: right }

div.sidebar p.rubric {
  font-family: sans-serif ;
  font-size: medium }

div.system-messages {
  margin: 5em }

div.system-messages h1 {
  color: red }

div.system-message {
  border: medium outset ;
  padding: 1em }

div.system-message p.system-message-title {
  color: red ;
  font-weight: bold }

div.topic {
  margin: 2em }

h1.section-subtitle, h2.section-subtitle, h3.section-subtitle,
h4.section-subtitle, h5.section-subtitle, h6.section-subtitle {
  margin-top: 0.4em }

h1.title {
  text-align: center }

h2.subtitle {
  text-align: center }

hr.docutils {
  width: 75% }

img.align-left, .figure.align-left, object.align-left, table.align-left {
  clear: left ;
  float: left ;
  margin-right: 1em }

img.align-right, .figure.align-right, object.align-right, table.align-right {
  clear: right ;
  float: right ;
  margin-left: 1em }

img.align-center, .figure.align-center, object.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

table.align-center {
  margin-left: auto;
  margin-right: auto;
}

.align-left {
  text-align: left }

.align-center {
  clear: both ;
  text-align: center }

.align-right {
  text-align: right }

/* reset inner alignment in figures */
div.align-right {
  text-align: inherit }

/* div.align-center * { */
/*   text-align: left } */

.align-top    {
  vertical-align: top }

.align-middle {
  vertical-align: middle }

.align-bottom {
  vertical-align: bottom }

ol.simple, ul.simple {
  margin-bottom: 1em }

ol.arabic {
  list-style: decimal }

ol.loweralpha {
  list-style: lower-alpha }

ol.upperalpha {
  list-style: upper-alpha }

ol.lowerroman {
  list-style: lower-roman }

ol.upperroman {
  list-style: upper-roman }

p.attribution {
  text-align: right ;
  margin-left: 50% }

p.caption {
  font-style: italic }

p.credits {
  font-style: italic ;
  font-size: smaller }

p.label {
  white-space: nowrap }

p.rubric {
  font-weight: bold ;
  font-size: larger ;
  color: maroon ;
  text-align: center }

p.sidebar-title {
  font-family: sans-serif ;
  font-weight: bold ;
  font-size: larger }

p.sidebar-subtitle {
  font-family: sans-serif ;
  font-weight: bold }

p.topic-title {
  font-weight: bold }

pre.address {
  margin-bottom: 0 ;
  margin-top: 0 ;
  font: inherit }

pre.literal-block, pre.doctest-block, pre.math, pre.code {
  margin-left: 2em ;
  margin-right: 2em }

pre.code .ln { color: grey; } /* line numbers */
pre.code, code { background-color: #eeeeee }
pre.code .comment, code .comment { color: #5C6576 }
pre.code .keyword, code .keyword { color: #3B0D06; font-weight: bold }
pre.code .literal.string, code .literal.string { color: #0C5404 }
pre.code .name.builtin, code .name.builtin { color: #352B84 }
pre.code .deleted, code .deleted { background-color: #DEB0A1}
pre.code .inserted, code .inserted { background-color: #A3D289}

span.classifier {
  font-family: sans-serif ;
  font-style: oblique }

span.classifier-delimiter {
  font-family: sans-serif ;
  font-weight: bold }

span.interpreted {
  font-family: sans-serif }

span.option {
  white-space: nowrap }

span.pre {
  white-space: pre }

span.problematic {
  color: red }

span.section-subtitle {
  /* font-size relative to parent (h1..h6 element) */
  font-size: 80% }

table.citation {
  border-left: solid 1px gray;
  margin-left: 1px }

table.docinfo {
  margin: 2em 4em }

table.docutils {
  margin-top: 0.5em ;
  margin-bottom: 0.5em }

table.footnote {
  border-left: solid 1px black;
  margin-left: 1px }

table.docutils td, table.docutils th,
table.docinfo td, table.docinfo th {
  padding-left: 0.5em ;
  padding-right: 0.5em ;
  vertical-align: top }

table.docutils th.field-name, table.docinfo th.docinfo-name {
  font-weight: bold ;
  text-align: left ;
  white-space: nowrap ;
  padding-left: 0 }

/* "booktabs" style (no vertical lines) */
table.docutils.booktabs {
  border: 0px;
  border-top: 2px solid;
  border-bottom: 2px solid;
  border-collapse: collapse;
}
table.docutils.booktabs * {
  border: 0px;
}
table.docutils.booktabs th {
  border-bottom: thin solid;
  text-align: left;
}

h1 tt.docutils, h2 tt.docutils, h3 tt.docutils,
h4 tt.docutils, h5 tt.docutils, h6 tt.docutils {
  font-size: 100% }

ul.auto-toc {
  list-style-type: none }

div.admonition, div.attention, div.caution, div.danger, div.error,
div.hint, div.important, div.note, div.tip, div.warning, div.sidebar {
/* stolen from Boostrap 3 (.panel .panel-default) */
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
  padding: 0 15px 15px 15px;
}

div.attention, div.caution, div.danger, div.error, div.warning {
  /* stolen from Boostrap 3 (.panel .panel-danger) */
  border-color: #EBCCD1;
}

div.admonition p.admonition-title, div.hint p.admonition-title,
div.important p.admonition-title, div.note p.admonition-title,
div.tip p.admonition-title, div.sidebar p.sidebar-title,
div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title {
/* stolen from Boostrap 3 (.panel .panel-default .panel-heading) */
  font-size: 16px;
  color: #333;
  background-color: #F5F5F5;
  padding: 10px 15px;
  margin-left: -15px;
  margin-right: -15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #333;
  background-color: #F5F5F5;
  border-color: #DDD;
}

div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title {
  /* stolen from Boostrap 3 (.panel .panel-danger) */
  color: #A94442;
  background-color: #F2DEDE;
  border-color: #EBCCD1;
}

/* code.css file generated by Nikola */
pre.code .hll { background-color: #ffffcc }
pre.code  { background: #f8f8f8; }
pre.code .c { color: #408080; font-style: italic } /* Comment */
pre.code .err { border: 1px solid #FF0000 } /* Error */
pre.code .k { color: #008000; font-weight: bold } /* Keyword */
pre.code .o { color: #666666 } /* Operator */
pre.code .ch { color: #408080; font-style: italic } /* Comment.Hashbang */
pre.code .cm { color: #408080; font-style: italic } /* Comment.Multiline */
pre.code .cp { color: #BC7A00 } /* Comment.Preproc */
pre.code .cpf { color: #408080; font-style: italic } /* Comment.PreprocFile */
pre.code .c1 { color: #408080; font-style: italic } /* Comment.Single */
pre.code .cs { color: #408080; font-style: italic } /* Comment.Special */
pre.code .gd { color: #A00000 } /* Generic.Deleted */
pre.code .ge { font-style: italic } /* Generic.Emph */
pre.code .gr { color: #FF0000 } /* Generic.Error */
pre.code .gh { color: #000080; font-weight: bold } /* Generic.Heading */
pre.code .gi { color: #00A000 } /* Generic.Inserted */
pre.code .go { color: #888888 } /* Generic.Output */
pre.code .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
pre.code .gs { font-weight: bold } /* Generic.Strong */
pre.code .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
pre.code .gt { color: #0044DD } /* Generic.Traceback */
pre.code .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
pre.code .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
pre.code .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
pre.code .kp { color: #008000 } /* Keyword.Pseudo */
pre.code .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
pre.code .kt { color: #B00040 } /* Keyword.Type */
pre.code .m { color: #666666 } /* Literal.Number */
pre.code .s { color: #BA2121 } /* Literal.String */
pre.code .na { color: #7D9029 } /* Name.Attribute */
pre.code .nb { color: #008000 } /* Name.Builtin */
pre.code .nc { color: #0000FF; font-weight: bold } /* Name.Class */
pre.code .no { color: #880000 } /* Name.Constant */
pre.code .nd { color: #AA22FF } /* Name.Decorator */
pre.code .ni { color: #999999; font-weight: bold } /* Name.Entity */
pre.code .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
pre.code .nf { color: #0000FF } /* Name.Function */
pre.code .nl { color: #A0A000 } /* Name.Label */
pre.code .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
pre.code .nt { color: #008000; font-weight: bold } /* Name.Tag */
pre.code .nv { color: #19177C } /* Name.Variable */
pre.code .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
pre.code .w { color: #bbbbbb } /* Text.Whitespace */
pre.code .mb { color: #666666 } /* Literal.Number.Bin */
pre.code .mf { color: #666666 } /* Literal.Number.Float */
pre.code .mh { color: #666666 } /* Literal.Number.Hex */
pre.code .mi { color: #666666 } /* Literal.Number.Integer */
pre.code .mo { color: #666666 } /* Literal.Number.Oct */
pre.code .sb { color: #BA2121 } /* Literal.String.Backtick */
pre.code .sc { color: #BA2121 } /* Literal.String.Char */
pre.code .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
pre.code .s2 { color: #BA2121 } /* Literal.String.Double */
pre.code .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
pre.code .sh { color: #BA2121 } /* Literal.String.Heredoc */
pre.code .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
pre.code .sx { color: #008000 } /* Literal.String.Other */
pre.code .sr { color: #BB6688 } /* Literal.String.Regex */
pre.code .s1 { color: #BA2121 } /* Literal.String.Single */
pre.code .ss { color: #19177C } /* Literal.String.Symbol */
pre.code .bp { color: #008000 } /* Name.Builtin.Pseudo */
pre.code .vc { color: #19177C } /* Name.Variable.Class */
pre.code .vg { color: #19177C } /* Name.Variable.Global */
pre.code .vi { color: #19177C } /* Name.Variable.Instance */
pre.code .il { color: #666666 } /* Literal.Number.Integer.Long */
table.codetable { width: 100%;} td.linenos {text-align: right; width: 4em;}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-top:20px;background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:#fff;}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(images/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}

#container {
    width: 960px;
    margin: 0 auto;
}

#contentcolumn {
    max-width: 760px;
}
#q {
    width: 150px;
}

img {
    max-width: 90%;
}

.postbox {
    border-bottom: 2px solid darkgrey;
    margin-bottom: 12px;
}

.titlebox {
    text-align: right;
}

#addthisbox {margin-bottom: 12px;}

td.label {
    /* Issue #290 */
    background-color: inherit;
}

.footnote-reference {
    /* Issue 290 */
    vertical-align: super;
    font-size: xx-small;
}


.caption {
    /* Issue 292 */
    text-align: center;
    padding-top: 1em;
}

div.figure > img,
div.figure > a > img {
    /* Issue 292 */
    display: block;
    margin-left: auto;
    margin-right: auto;
}

blockquote p, blockquote {
  font-size: 17.5px;
  font-weight: 300;
  line-height: 1.25;
}

ul.bricks > li {
    display: inline;
    background-color: lightblue;
    padding: 8px;
    border-radius: 5px;
    line-height: 3;
    white-space:nowrap;
    margin: 3px;
}

.at300b, .stMainServices, .stButton, .stButton_gradient {
    box-sizing: content-box;
}

pre, pre code {
    white-space: pre;
    word-wrap: normal;
    overflow: auto;
}

article.post-micro {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 1.5em;
}

.image-block {
    display: inline-block;
}

.flowr_row {
    width: 100%;
}

.tags {
    padding-left: 0;
    margin-left: -5px;
    list-style: none;
    text-align: center;

}

.tags > li {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #999;
    border-radius: 10px;
}

.tags > li a {
    color: #fff;
}

.metadata p:before,
.postlist .listdate:after,
.translationslist p:before {
    content: " — ";
}

.metadata p:first-of-type:before,
.translationslist p:first-of-type:before {
    content: "";
}

.metadata p,
.translationslist p {
    display: inline;
}

.posttranslations h3, .translationslist h3 {
    display: inline;
    font-size: 1em;
    font-weight: bold;
}

.posttranslations h3:last-child, .translationslist h3:last-child {
    display: none;
}

.entry-content {
    margin-top: 1em;
}

.navbar-brand {
    padding: 0 15px;
}

.navbar-brand #blog-title {
    padding: 15px 0;
    display: inline-block;
}

.navbar-brand #logo {
    max-width: 100%;
}

.navbar-brand>img {
    display: inline;
}

.row {
    margin: 0;
}

/* for alignment with Bootstrap's .entry-content styling */
.entry-summary {
    margin-top: 1em;
}

/* Custom page footer */
#footer {
    padding-top: 19px;
    color: #777;
    border-top: 1px solid #e5e5e5;
}

.codetable {
    table-layout: fixed;
}

.codetable pre {
    overflow-x: scroll;
}

/* hat tip bootstrap/html5 boilerplate */
@media print {
    *, *:before, *:after {
        font-family: Garamond, Junicode, serif;
    }

    body {
        font-size: 12pt;
    }

    article .entry-title a[href]:after,
    article .metadata a[href]:after,
    article .tags a[href]:after {
        content: "";
    }

    article .metadata .sourceline {
        display: none;
    }

    article .metadata .linkline a[href]:after {
        content: " (" attr(href) ")";
    }

    .navbar {
        display: none;
    }
}

/*
 * custom.css — 流浪的小张 personal theme overrides
 * Loaded after the theme's own stylesheet via EXTRA_HEAD_DATA in conf.py.
 *
 * Direction: stay close to the plain, content-first structure of
 * danluu.com/jvns.ca (no colored navbar block, no card boxes), but with
 * two things borrowed from joshwcomeau.com's more personal feel —
 * (1) more generous spacing/breathing room, (2) small personality
 * touches (bolder accent color on titles/hover, a small hiking-themed
 * divider mark, a warmer pull-quote) — without illustration or motion.
 *
 * IMPORTANT — why every font-size below is in px, not rem:
 * the theme's own base stylesheet sets `html { font-size: 62.5% }`
 * (i.e. 1rem = 10px here, not the usual 16px), a classic old trick so
 * *its own* CSS can write "1.6rem" to mean 16px. Any rem value written
 * here without knowing that comes out 62.5% smaller than intended —
 * that's exactly what caused the previous "every module is a
 * different, inconsistent scale" bug. Using px everywhere sidesteps
 * that theme quirk entirely. line-height/letter-spacing stay unitless
 * or em, since those are relative to the element's own (correct) font
 * size, not the root, so they're unaffected by this quirk.
 */

:root {
  --brand-green: #33513f;
  --brand-green-dark: #223a2c;
  --brand-sand: #b5673e;
  --brand-sand-dark: #96502e;
  --page-bg: #faf7f2;
  --text-main: #2b2b28;
  --text-muted: #767569;
  --border-soft: #e7e2d8;
  --quote-bg: #f6f1e9;
  --measure: 680px;
}

html, body {
  background: var(--page-bg);
  color: var(--text-main);
}

body {
  font-family: -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.75;
  font-size: 16px;
}

a {
  color: var(--brand-sand-dark);
  text-decoration: underline;
  text-decoration-color: var(--border-soft);
  text-underline-offset: 2px;
}
a:hover,
a:focus {
  color: var(--brand-green);
  text-decoration-color: currentColor;
}

/* ---------- Navbar: plain text header, no color block ---------- */
.navbar.navbar-inverse {
  background: var(--page-bg);
  border: none;
  border-bottom: 1px solid var(--border-soft);
  box-shadow: none;
  margin-bottom: 48px;
}
.navbar.navbar-inverse .navbar-brand,
.navbar.navbar-inverse #blog-title {
  color: var(--text-main);
  font-weight: 700;
  font-size: 18px;
}
.navbar.navbar-inverse .nav > li > a {
  color: var(--text-muted);
  text-decoration: none;
  font-size: 15px;
}
.navbar.navbar-inverse .nav > li > a:hover,
.navbar.navbar-inverse .nav > li > a:focus {
  color: var(--brand-sand-dark);
  background: none;
}
.navbar-toggle .icon-bar {
  background-color: var(--text-main);
}

/* ---------- Reading column, with more room to breathe ---------- */
.container {
  max-width: 860px;
}

article.h-entry {
  max-width: var(--measure);
  margin: 0 auto 64px;
  padding: 0;
}

article.h-entry header {
  margin-bottom: 32px;
}

/* ---------- Homepage: excerpt + sidebar layout ---------- */
/* Only the homepage/index listing uses templates/index.tmpl with a
   two-column row; single post pages keep the centered narrow column
   above untouched. Widen the container and let articles fill their
   (wider) column instead of the fixed --measure. */
.container:has(.row) {
  max-width: 1080px;
}
.row .col-md-8 article.h-entry {
  max-width: none;
  margin: 0 0 56px;
}
.row .col-md-8 article.h-entry + article.h-entry {
  padding-top: 48px;
}
/* "Read more" link that Nikola appends to teasers */
.p-summary.entry-summary p.more a {
  font-size: 15px;
  font-weight: 600;
}

.site-sidebar {
  padding-top: 4px;
}
.sidebar-block {
  margin-bottom: 36px;
}
.sidebar-block h3 {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--brand-sand-dark);
  margin-bottom: 16px;
}
.sidebar-postlist,
.sidebar-taglist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sidebar-postlist li {
  margin-bottom: 14px;
}
.sidebar-postlist a,
.sidebar-taglist a {
  display: block;
  color: var(--text-main);
  text-decoration: none;
  font-size: 16px;
  line-height: 1.4;
}
.sidebar-postlist a:hover,
.sidebar-taglist a:hover {
  color: var(--brand-sand-dark);
}
.sidebar-postlist time {
  display: block;
  color: var(--text-muted);
  font-size: 14px;
  margin-top: 3px;
}
.sidebar-taglist li {
  margin-bottom: 12px;
}
.sidebar-more a {
  font-size: 14px;
  color: var(--text-muted);
  text-decoration: underline;
}

@media (max-width: 991px) {
  .site-sidebar {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid var(--border-soft);
  }
}

/* A small personal touch instead of a generic title: a thin
   hiking-themed rule under the title, in the accent color, rather
   than a plain hairline. */
article.h-entry .entry-title {
  font-size: 26px;
  line-height: 1.3;
  margin-bottom: 14px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
article.h-entry .entry-title a {
  color: var(--text-main);
  text-decoration: none;
}
article.h-entry .entry-title a:hover {
  color: var(--brand-green);
}
article.h-entry header::after {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  margin-top: 18px;
  background: var(--brand-sand);
  border-radius: 2px;
}

.metadata {
  color: var(--text-muted);
  font-size: 14px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.metadata a {
  color: var(--text-muted);
  text-decoration: none;
}

/* Post body: single-post pages render .e-content.entry-content;
   the homepage/teaser view renders .p-summary.entry-summary instead —
   both need the same rules or the teaser view silently falls back to
   the theme's unstyled (and much larger) defaults. */
.e-content.entry-content,
.p-summary.entry-summary {
  font-size: 16px;
}
.e-content.entry-content p,
.p-summary.entry-summary p {
  margin-bottom: 1.4em;
}
.e-content.entry-content h1,
.p-summary.entry-summary h1 { font-size: 24px; }
.e-content.entry-content h2,
.p-summary.entry-summary h2 { font-size: 22px; }
.e-content.entry-content h3,
.p-summary.entry-summary h3 { font-size: 19px; }
.e-content.entry-content h4,
.p-summary.entry-summary h4 { font-size: 18px; }
.e-content.entry-content h1,
.e-content.entry-content h2,
.e-content.entry-content h3,
.e-content.entry-content h4,
.p-summary.entry-summary h1,
.p-summary.entry-summary h2,
.p-summary.entry-summary h3,
.p-summary.entry-summary h4 {
  color: var(--brand-green-dark);
  margin-top: 2em;
  margin-bottom: 0.7em;
  font-weight: 700;
  line-height: 1.4;
}

/* Warmer pull-quote treatment — a bit of color back, for personality,
   distinguishing "quoted source material" from your own writing.
   Font-size is set explicitly because the theme's own blockquote
   default (17.5px, fixed) ignores our 16px baseline otherwise. */
.e-content.entry-content blockquote,
.p-summary.entry-summary blockquote {
  border-left: 3px solid var(--brand-sand);
  background: var(--quote-bg);
  padding: 14px 20px;
  margin: 1.8em 0;
  color: var(--text-main);
  border-radius: 0 8px 8px 0;
  font-size: 16px;
}
.e-content.entry-content blockquote p,
.p-summary.entry-summary blockquote p {
  font-size: inherit;
}

/* ---------- Media & tables always fit the column ---------- */
.e-content.entry-content img,
.e-content.entry-content video,
.e-content.entry-content iframe,
.p-summary.entry-summary img,
.p-summary.entry-summary video,
.p-summary.entry-summary iframe {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
.e-content.entry-content table,
.p-summary.entry-summary table {
  max-width: 100%;
  display: block;
  overflow-x: auto;
}

/* Divider between posts on listing pages: a little hiking-trail mark
   (⛺) instead of a plain line — the one playful detail on the page. */
article.h-entry + article.h-entry {
  position: relative;
  padding-top: 56px;
}
article.h-entry + article.h-entry::before {
  content: "⛺";
  position: absolute;
  top: 8px;
  left: 0;
  font-size: 16px;
  opacity: 0.6;
}

/* ---------- Footer ---------- */
#footer {
  color: var(--text-muted);
  border-top: 1px solid var(--border-soft);
  padding: 24px 0;
  margin-top: 56px;
  font-size: 13px;
  text-align: center;
}
#footer a {
  color: var(--text-muted);
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  .container {
    padding-left: 18px;
    padding-right: 18px;
  }
  article.h-entry {
    margin: 0 auto 40px;
  }
  article.h-entry .entry-title {
    font-size: 22px;
  }
  .navbar.navbar-inverse {
    margin-bottom: 32px;
  }
  .navbar.navbar-inverse .nav > li > a {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}