/* Circle of Insight - coi-slate-masthead-cap-dated-notes-stream-and-month-ladder-2006 */
:root{
  --canvas:#e7e4dc; --paper:#ffffff; --ink:#26282b; --ink-2:#3d4147;
  --slate:#2f5d74; --slate-deep:#234659; --rule:#ddd8cd; --edge:#ccc7bb;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; padding:32px 16px 48px; background:var(--canvas); color:var(--ink);
  font:16px/1.62 Verdana, Geneva, "DejaVu Sans", sans-serif;
}
img,svg{max-width:100%;}
a{color:var(--slate); text-decoration:underline;}
a:hover{color:var(--slate-deep);}
a:focus-visible{outline:2px solid var(--slate-deep); outline-offset:2px;}

.shell{
  max-width:860px; margin:0 auto; background:var(--paper); border:1px solid var(--edge);
  padding:0 24px 24px; display:grid; grid-template-columns:1fr 262px; column-gap:28px;
  align-items:start;
}
.shell > *{min-width:0;}

/* 1. masthead cap and page tabs */
.masthead{
  grid-column:1 / 3; margin:0 -24px 0; padding:0;
}
.cap{
  position:relative; height:200px; border-radius:6px 6px 0 0; overflow:hidden;
  background:var(--slate); display:flex; flex-direction:column; justify-content:flex-end;
  padding:0 26px 22px;
}
.cap-art{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.cap-text{position:relative;}
.sitename{
  margin:0; font-family:Georgia,"Times New Roman",serif; font-weight:normal; font-size:34px;
  line-height:1.15; letter-spacing:.02em; color:#ffffff;
}
.sitename a{color:#ffffff; text-decoration:none;}
.tagline{margin:6px 0 0; font-size:13px; color:#d7e4eb; letter-spacing:.04em;}
.tabs{
  margin:0; padding:10px 26px 0; border-bottom:1px solid var(--rule);
}
.tabs ul{list-style:none; margin:0; padding:0 0 8px;}
.tabs li{display:inline; margin-right:18px; font-size:13px; letter-spacing:.05em;}
.tabs a{text-decoration:none;}
.tabs a:hover,.tabs [aria-current="page"]{text-decoration:underline;}
.tabs [aria-current="page"]{color:var(--ink); font-weight:bold;}

/* stream */
.stream{grid-column:1; grid-row:2; padding-top:26px;}
.stream-older{grid-column:1; grid-row:3;}
.entry{padding-bottom:24px; margin-bottom:24px; border-bottom:1px solid var(--rule);}
.entry:last-child{border-bottom:0;}
.dateline{
  margin:0 0 6px; font-size:11px; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-2);
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.ringbullet{flex:0 0 auto;}
.entry h2, .entry-title{
  margin:0 0 10px; font-family:Georgia,"Times New Roman",serif; font-weight:normal;
  font-size:26px; line-height:1.25;
}
.entry h2 a{text-decoration:none;}
.entry h2 a:hover{text-decoration:underline;}
.entry p{margin:0 0 14px; max-width:66ch;}
.permalink{margin:0; font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-2);}
.stream-foot{margin:4px 0 0; font-size:13px;}

figure{margin:0 0 18px;}
figure img{display:block; width:100%; height:auto; border:1px solid var(--edge);}
figcaption{margin-top:6px; font-size:12px; color:var(--ink-2); line-height:1.5;}

/* rail */
.rail{grid-column:2; grid-row:2; padding-top:26px;}
.rail-2{grid-column:2; grid-row:3;}
.widget{margin-bottom:26px;}
.widget h2{
  margin:0 0 8px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink);
  border-bottom:1px solid var(--rule); padding-bottom:5px; font-weight:bold;
  font-family:Verdana, Geneva, sans-serif;
}
.widget p{margin:0; font-size:13px; line-height:1.6; color:var(--ink-2);}
.widget ul{list-style:none; margin:0; padding:0;}
.widget li{font-size:13px; padding:4px 0; border-bottom:1px solid #f0ece3;}
.widget li:last-child{border-bottom:0;}
.month-ladder li{display:flex; justify-content:space-between; gap:10px;}
.month-ladder .count{color:var(--ink-2); font-size:11px;}
.reading li{color:var(--ink-2);}

/* page bodies */
.page{grid-column:1; grid-row:2 / span 2; padding-top:26px;}
.page h1, .stream h1{
  margin:0 0 12px; font-family:Georgia,"Times New Roman",serif; font-weight:normal;
  font-size:30px; line-height:1.22;
}
.page h2{
  margin:26px 0 10px; font-family:Georgia,"Times New Roman",serif; font-weight:normal; font-size:20px;
}
.page p, .page li{max-width:66ch;}
.page p{margin:0 0 14px;}
.reading-column{max-width:660px;}
.index-group{margin-bottom:28px;}
.index-group h2{
  margin:0 0 8px; font-family:Georgia,"Times New Roman",serif; font-weight:normal; font-size:20px;
  border-bottom:1px solid var(--rule); padding-bottom:6px;
}
.index-list{list-style:none; margin:0; padding:0;}
.index-list li{padding:7px 0; border-bottom:1px solid #f4f1ea;}
.index-list .when{
  display:block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-2);
}
.entry-nav{
  margin-top:28px; padding-top:14px; border-top:1px solid var(--rule); font-size:13px;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.entry-nav span{display:block;}

.foot{
  grid-column:1 / 3; margin-top:32px; padding-top:14px; border-top:1px solid var(--rule);
  font-size:12px; color:var(--ink-2); display:flex; justify-content:space-between;
  gap:16px; flex-wrap:wrap;
}
.foot ul{list-style:none; margin:0; padding:0;}
.foot li{display:inline; margin-left:14px;}

@media (max-width:980px){
  body{padding:16px 10px 32px;}
}
@media (max-width:760px){
  body{padding:0 0 28px; background:var(--paper);}
  .shell{
    grid-template-columns:1fr; max-width:none; border:0; padding:0 16px 16px; row-gap:0;
  }
  .masthead{margin:0 -16px;}
  .cap{height:132px; border-radius:0; padding:0 16px 14px;}
  .cap-art{object-fit:fill;}
  .sitename{font-size:25px;}
  .tabs{padding:10px 16px 0;}
  .tabs li{display:inline-block; margin:0 16px 6px 0;}
  .stream, .stream-older, .rail, .rail-2, .page{grid-column:1; grid-row:auto;}
  .rail, .rail-2{padding-top:8px; border-top:1px solid var(--rule);}
  .entry h2, .entry-title{font-size:22px;}
  .page h1, .stream h1{font-size:25px;}
  .month-ladder li{display:inline-block; margin:0 14px 4px 0; border-bottom:0;}
  .month-ladder .count{margin-left:5px;}
  .foot{grid-column:1;}
}