/* Alfred's Commentary on the Human Condition — 2008 "Koi" aesthetic, rebuilt 2026 */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:#dbe4e3;
  font-family:"Lucida Grande","Lucida Sans Unicode",Lucida,Verdana,Arial,sans-serif;
  color:#3f3f3f;
}
.bg-lilies{position:fixed;top:0;left:0;width:300px;max-width:28vw;z-index:0;pointer-events:none;opacity:.95}
.frame{position:relative;z-index:1;max-width:980px;margin:0 auto 60px;background:#e9e9e6;padding:12px 12px 46px;box-shadow:0 1px 14px rgba(60,70,70,.14)}
.card{background:#fff;position:relative;padding-bottom:34px}
.koi{position:absolute;top:-14px;right:-46px;width:330px;pointer-events:none}
header.site{padding:74px 44px 0;position:relative}
header.site h1{margin:0;font-size:20px;font-weight:normal;letter-spacing:.33em;text-transform:uppercase;color:#6e675f}
header.site h1 a{color:#6e675f;text-decoration:none}
header.site .tagline{margin:6px 0 0;font-size:12px;color:#7b7268}
nav.top{margin-top:20px;padding:12px 44px;border-top:1px solid #e5e5e2;border-bottom:1px solid #e5e5e2;font-size:12px}
nav.top a{color:#555;text-decoration:none;margin-right:22px}
nav.top a:hover{color:#ee5c25}
main{display:flex;padding:34px 44px 0}
.posts{flex:1;min-width:0;padding-right:44px}
.sidebar{width:185px;flex-shrink:0}
.sidebar h3{font-size:14px;font-weight:normal;color:#555;margin:4px 0 8px;border-bottom:1px solid #a9a9a4;padding-bottom:6px}
.sidebar ul{list-style:none;margin:0;padding:0}
.sidebar li{margin:0 0 7px}
.sidebar a{color:#ee5c25;text-decoration:none;font-size:12px;line-height:1.5}
.sidebar a:hover{text-decoration:underline}
.sidebar a.here{background:#ececec;color:#555;padding:1px 4px}
.datebar{background:#ececec;color:#444;font-size:11.5px;padding:5px 9px;margin:30px 0 4px}
article.post{margin-bottom:8px}
article.post:first-of-type .datebar{margin-top:0}
.post h2{color:#6ea3a3;font-weight:normal;font-size:17px;margin:16px 0 0;padding-bottom:7px;border-bottom:1px solid #e3e3e3;line-height:1.35}
.post .when{font-size:11px;color:#e58044;margin:7px 0 12px}
.post-body{font-size:12.5px;line-height:1.75;color:#3f3f3f}
.post-body p{margin:.85em 0}
.post-body ol,.post-body ul{margin:.85em 0;padding-left:26px}
.post-body li{margin:.35em 0}
.post-body blockquote{margin:.9em 0 .9em 16px;padding-left:14px;border-left:2px solid #ddd;color:#555}
a{color:#ee5c25;text-decoration:none}
a:hover{text-decoration:underline}
.retired{color:#9a938b;font-style:italic;border-bottom:1px dotted #c5beb5;cursor:help}
.meta{font-size:11px;color:#999;border-top:1px solid #eee;margin-top:14px;padding-top:6px}
.meta b{color:#ee5c25;font-weight:normal}
img.postimg{max-width:100%;border:1px solid #ddd;background:#fafafa;padding:6px}
.imgframe{border:1px solid #d8d8d3;background:#fafaf8;padding:10px;text-align:center}
.imgframe .missing{display:block;border:2px dashed #c9c9c2;color:#9a938b;font-size:11.5px;font-style:italic;padding:44px 14px}
.pagination{margin:38px 0 6px;font-size:12px;color:#777}
.pagination a{background:#ececec;color:#ee5c25;padding:2px 8px;margin:0 2px;text-decoration:none}
.pagination a:hover{background:#e0e0dc}
.pagination .cur{background:#ee7733;color:#fff;padding:2px 8px;margin:0 2px}
footer.quote{margin:30px 44px 0;border-top:1px solid #c9c9c4;padding-top:12px;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#555;line-height:1.7}
/* pages */
.pagebody{font-size:12.5px;line-height:1.8}
.pagebody h2{color:#6ea3a3;font-weight:normal;font-size:17px;border-bottom:1px solid #e3e3e3;padding-bottom:7px;margin-top:0}
.pagebody h3{color:#6ea3a3;font-weight:normal;font-size:14px;margin:22px 0 6px}
.linklist{list-style:none;margin:.4em 0;padding:0}
.linklist li{margin:0 0 14px;padding-left:14px;border-left:2px solid #eee}
.linklist .note{display:block;color:#777;font-size:11.5px}
/* books */
.book{display:flex;gap:14px;margin:0 0 22px}
.book img{width:56px;height:auto;align-self:flex-start;border:1px solid #ddd;padding:3px;background:#fff}
.book h3{margin:0 0 2px}
.book .by{font-size:11.5px;color:#888;margin:0 0 5px}
/* photos */
.photogrid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.photo{background:#fff;border:1px solid #d8d8d3;padding:10px 10px 8px;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.photo img{width:100%;display:block}
.photo .cap{font-size:11px;color:#888;margin-top:7px;text-align:center}
/* composer */
.composer label{display:block;font-size:12px;color:#555;margin:14px 0 4px}
.composer input[type=text],.composer textarea{width:100%;font:12.5px/1.6 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#3f3f3f;border:1px solid #c9c9c2;padding:7px;background:#fdfdfc}
.composer textarea{min-height:170px}
.composer button{margin-top:16px;margin-right:8px;font:12px "Lucida Grande",Verdana,sans-serif;background:#ee7733;color:#fff;border:0;padding:8px 16px;cursor:pointer}
.composer button:hover{background:#e2572b}
.composer .out{margin-top:18px}
.composer .hint{background:#f4f7f7;border:1px solid #dfe6e6;padding:12px 14px;font-size:11.5px;color:#556;line-height:1.7}
@media(max-width:760px){
  .bg-lilies{opacity:.35}
  .frame{margin:0;padding:6px 6px 30px}
  header.site{padding:56px 20px 0}
  nav.top{padding:12px 20px}
  main{flex-direction:column;padding:26px 20px 0}
  .posts{padding-right:0}
  .sidebar{width:auto;margin-top:26px}
  .koi{width:210px;right:-8px;top:-6px}
  footer.quote{margin:26px 20px 0}
  .photogrid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:no-preference){
  .koi{transition:transform .6s ease}
}