/* Lakesidefm - blogger-minima journal. Single stylesheet, no webfonts, no script. */
:root{
  --canvas:#e9e6df; --page:#fffdf8; --ink:#23211d; --muted:#6b6459;
  --accent:#7a4a1f; --rule:#c4bdb0;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; padding:26px 16px 34px;
  background:var(--canvas); color:var(--ink);
  font:16px/1.7 Georgia,"Times New Roman",Times,serif;
}
.page{width:min(780px,100%);margin-inline:auto;background:var(--page);padding:28px 30px 40px}
a{color:var(--accent)}
a:focus-visible,.skip:focus{outline:2px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:inline-block;margin-bottom:12px}

/* masthead */
.masthead h1,.masthead .sitetitle{
  margin:0;font-size:40px;line-height:1.15;font-weight:700;letter-spacing:.01em
}
.masthead .sitetitle a{color:var(--ink);text-decoration:none}
.masthead .tagline{margin:8px 0 0;color:var(--muted);font-size:15px;font-style:italic}
.mastrule{border:0;border-top:1px dotted var(--rule);margin:16px 0 10px}
.pagelinks{font:12px/1.9 Arial,Helvetica,"Liberation Sans",sans-serif;letter-spacing:.06em;
  text-transform:uppercase;padding-bottom:14px;border-bottom:1px dotted var(--rule);margin-bottom:26px}
.pagelinks a{margin-right:16px;text-decoration:none}
.pagelinks a:hover{text-decoration:underline}
.pagelinks a[aria-current="page"]{color:var(--ink);border-bottom:1px solid var(--ink)}

/* journal grid */
.journal{display:grid;grid-template-columns:minmax(0,68fr) minmax(0,32fr);column-gap:34px}
.stream{min-width:0}

/* date group heading - distinctive motif */
.datehead{
  font:12px/1 Arial,Helvetica,"Liberation Sans",sans-serif;text-transform:uppercase;
  letter-spacing:.16em;color:var(--muted);margin:0 0 18px;padding-bottom:7px;
  border-bottom:2px solid var(--accent)
}

/* posts */
.post{padding:0 0 22px;margin:0 0 22px;border-bottom:1px dotted var(--rule)}
.post:last-child{border-bottom:0}
.post h2,.post h1{margin:0 0 6px;font-size:26px;line-height:1.25;font-weight:700}
.post h2 a{color:var(--ink);text-decoration:none}
.post h2 a:hover{text-decoration:underline}
.postmeta{font:12px/1.6 Arial,Helvetica,"Liberation Sans",sans-serif;color:var(--muted);margin:0 0 12px}
.postmeta a{color:var(--muted)}
.post p{margin:0 0 12px;max-width:66ch}
.permalink{font:12px/1.6 Arial,Helvetica,"Liberation Sans",sans-serif;color:var(--muted);margin:12px 0 0}

/* rail */
.rail{min-width:0}
.widget{margin:0 0 24px;padding-top:10px;border-top:1px dotted var(--rule)}
.widget:first-child{border-top:0;padding-top:0}
.widget h2{margin:0 0 10px;font:11px/1 Arial,Helvetica,"Liberation Sans",sans-serif;
  text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-weight:700}
.widget ul{list-style:none;margin:0;padding:0;font-size:14px}
.widget li{margin:0 0 7px}
.profile p{margin:0 0 6px;font-size:14px;line-height:1.55}
.profile .pname{font-weight:700}

/* lists / prevnext / footer */
.notelist{list-style:none;margin:0;padding:0}
.notelist li{padding:0 0 14px;margin:0 0 14px;border-bottom:1px dotted var(--rule)}
.notelist li:last-child{border-bottom:0}
.notelist .t{font-size:20px;line-height:1.3}
.notelist .t a{color:var(--ink);text-decoration:none}
.notelist .t a:hover{text-decoration:underline}
.prevnext{margin:22px 0 0;padding-top:14px;border-top:1px dotted var(--rule);
  font:12px/1.8 Arial,Helvetica,"Liberation Sans",sans-serif}
.prevnext span{display:block}
.colophon{margin-top:34px;padding-top:14px;border-top:1px dotted var(--rule);
  font:12px/1.8 Arial,Helvetica,"Liberation Sans",sans-serif;color:var(--muted)}
.colophon a{color:var(--muted)}
.colophon .links{margin:6px 0 0}
.colophon .links a{margin-right:14px}
.page-body h2{font-size:19px;margin:26px 0 8px}
.page-body p{max-width:66ch;margin:0 0 12px}

@media (max-width:860px){body{padding:16px 10px 26px}.page{padding:24px 22px 32px}}
@media (max-width:700px){
  body{padding:0}
  .page{padding:22px 18px 30px;width:100%}
  .journal{display:block}
  .rail{margin-top:30px;padding-top:6px;border-top:1px dotted var(--rule)}
  .masthead h1,.masthead .sitetitle{font-size:30px}
  .post h2,.post h1{font-size:22px}
}
@media (max-width:420px){
  .pagelinks a{margin-right:12px}
  .postmeta .sep{display:none}
  .postmeta .lbl{display:block}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
