/* ==========================================================
     MONSOON JOURNAL — dark green, lamp-lit, post-rain.
     Warmth appears only as LIGHT (lamp, gold sparks), never as
     a surface. Every photograph is Raj's own.
     ========================================================== */
  :root{
    --g0:#010503;   /* deepest, top of the gradient   */
    --g1:#040D08;   /* forest                          */
    --g2:#08150D;   /* mid                             */
    --g3:#0C1E13;   /* lifted, near the lamp           */
    --lamp:#F6E8BA; /* lamplight, champagne — never brown */
    --lamp-hi:#F7E2B4;
    --silver:#D3E3DC;
    --fern:#84B36C;
    --text:#E7F0E4;
    --muted:#94A895;
    --rule:rgba(132,179,108,.22);
  }
  *{box-sizing:border-box}
  body{
    margin:0; color:var(--text);
    background:linear-gradient(180deg,var(--g0) 0%,var(--g1) 26%,var(--g2) 62%,var(--g3) 100%);
    background-attachment:fixed;
    font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
    font-size:17.5px; line-height:1.7; -webkit-font-smoothing:antialiased;
  }
  body::after{ /* damp grain */
    content:""; position:fixed; inset:0; pointer-events:none; z-index:80; opacity:.04;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='150' height='150'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/></filter><rect width='150' height='150' filter='url(%23n)'/></svg>");
  }
  .rh-wrap{max-width:1120px; margin:0 auto; padding:0 28px}
  h1,h2,h3{margin:0; font-weight:400; text-wrap:balance}
  p{margin:0}
  .rh-hand{font-family:"Bradley Hand","Noteworthy","Segoe Script","Brush Script MT",cursive}
  .rh-lbl{font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:10.5px; letter-spacing:.17em; text-transform:uppercase; color:var(--muted)}
  a{color:var(--fern); text-decoration:none}
  :focus-visible{outline:1px solid #5FD79A; outline-offset:3px}

  /* ---------------- nav ---------------- */
  .rh-nav{position:absolute; top:0; left:0; right:0; z-index:20; height:64px; display:flex; align-items:center}
  .rh-nav .in{max-width:1120px; margin:0 auto; padding:0 28px; width:100%; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap}
  .rh-brand{font-size:30px; letter-spacing:-.015em; color:#F1F7EE; display:flex; align-items:center; gap:12px;
    filter:drop-shadow(0 0 18px rgba(120,210,130,.38)) drop-shadow(0 1px 3px rgba(0,0,0,.7))}
  .rh-brand .rh-mark{flex:0 0 auto; display:block}
  @media (prefers-reduced-motion:no-preference){
    .rh-brand .rh-mark .drop{animation:dropfall 5.5s ease-in-out infinite}
    @keyframes dropfall{0%,62%{opacity:0; transform:translateY(-2px)}72%{opacity:1}100%{opacity:0; transform:translateY(5px)}}
  }
  /* moving gradient text — gold sweeping through silver */
  .rh-grad{
    background-image:linear-gradient(102deg,
      #17532F 0%,  #237A46 7%,  #35A45E 14%, #57C46E 21%, #8FDA6A 28%,
      #C8EE7C 34%, #F4FBD2 38%, #A9E8A2 44%, #55C79A 51%, #2FA9A9 59%,
      #3FB878 68%, #74C851 78%, #9BB93F 86%, #3E7A3C 94%, #17532F 100%);
    background-size:420% 100%;
    -webkit-background-clip:text; background-clip:text;
    color:transparent; -webkit-text-fill-color:transparent;
  }
  @media (prefers-reduced-motion:no-preference){
    .rh-grad{animation:shimmer 20s linear infinite}
    @keyframes shimmer{from{background-position:0% 0} to{background-position:420% 0}}
  }
  .rh-nav ul{display:flex; gap:20px; list-style:none; margin:0; padding:0; flex-wrap:wrap}
  .rh-nav ul a{font-family:ui-monospace,Menlo,monospace; font-size:10.5px; letter-spacing:.15em; text-transform:uppercase; color:#9FB3A2; padding-bottom:3px; position:relative}
  .rh-nav ul a::after{content:""; position:absolute; left:0; bottom:0; height:1px; width:0; background:#5FD79A; transition:width .16s ease}
  .rh-nav ul a:hover{color:var(--text)} .rh-nav ul a:hover::after{width:100%}
  .rh-nav ul a.open{color:#B4F5D6} .rh-nav ul a.open::after{width:100%}

  /* ---------------- country navigator ---------------- */
  .rh-panel{
    position:absolute; top:70px; left:28px; right:28px; z-index:30;
    background:rgba(14,26,19,.52);
    backdrop-filter:blur(26px) saturate(1.5);
    -webkit-backdrop-filter:blur(26px) saturate(1.5);
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    box-shadow:0 1px 0 rgba(255,255,255,.10) inset, 0 30px 70px rgba(0,0,0,.55);
    max-height:0; overflow:hidden; opacity:0; pointer-events:none;
    transition:max-height .40s cubic-bezier(.3,.85,.35,1), opacity .28s ease;
  }
  .rh-panel.on{max-height:540px; opacity:1; pointer-events:auto}
  .rh-panel::before{ /* the LED strip, drifting */
    content:""; position:absolute; top:0; left:0; right:0; height:1.5px; border-radius:18px 18px 0 0;
    background:linear-gradient(90deg,
      rgba(108,224,160,0) 0%, rgba(108,224,160,0) 22%,
      rgba(214,255,232,.98) 42%, rgba(108,224,160,.80) 52%,
      rgba(108,224,160,0) 74%, rgba(108,224,160,0) 100%);
    background-size:260% 100%;
  }
  @media (prefers-reduced-motion:no-preference){
    .rh-panel::before{animation:led 7s linear infinite}
    @keyframes led{from{background-position:170% 0} to{background-position:-90% 0}}
  }
  .rh-panel .in{max-width:1120px; margin:0 auto; padding:26px 28px 30px}
  .rh-panel .hd{display:flex; justify-content:space-between; align-items:baseline; gap:14px; flex-wrap:wrap}
  .rh-panel .hd .t{font-size:24px; color:#F1F7EE}
  .rh-cgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); gap:2px 26px; margin-top:18px}
  .rh-cty{display:flex; align-items:baseline; gap:10px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.07); cursor:pointer}
  .rh-cty .nm{flex:1 1 auto; font-size:16px; color:#DCE8D9; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .rh-cty .bar{flex:0 0 46px; height:2px; background:rgba(255,255,255,.10); position:relative; border-radius:2px}
  .rh-cty .bar i{position:absolute; left:0; top:0; bottom:0; background:#5FD79A; box-shadow:0 0 9px rgba(95,215,154,.6); border-radius:2px}
  .rh-cty .n{flex:0 0 auto; font-family:ui-monospace,Menlo,monospace; font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums}
  .rh-cty:hover .nm{color:#FFF} .rh-cty:hover .bar i{background:#B4F5D6}
  .rh-cty.unfinished .nm{color:#B4F5D6}
  .rh-cty.unfinished .n::after{content:" ·  prologue only"; color:var(--muted); font-size:10px}

  /* ================= THE HERO ================= */
  .rh-hero{position:relative; min-height:min(96vh,880px); display:flex; align-items:center; overflow:hidden}
  #rh-sky{position:absolute; inset:0; width:100%; height:100%; display:block}
  .rh-hero .rh-veil{
    position:absolute; inset:0; pointer-events:none;
    background:
      radial-gradient(58% 44% at 50% 8%, rgba(6,15,10,.66) 0%, rgba(6,15,10,0) 62%),
      linear-gradient(180deg, rgba(6,15,10,.55) 0%, rgba(6,15,10,0) 24%, rgba(6,15,10,.10) 68%, rgba(25,51,34,.34) 100%);
  }
  .hero-in{position:relative; z-index:5; width:100%; padding:120px 0 84px}
  .rh-hero .rh-col{max-width:min(100%,600px)}
  @media(min-width:1000px){.rh-hero .rh-col{max-width:54%}}
  .rh-hero .rh-kicker{color:#7FDCA8; opacity:.95}
  .rh-hero h1{
    animation-duration:28s !important;
    margin-top:22px; font-size:clamp(38px,5.8vw,72px); line-height:1.03; letter-spacing:-.026em;
    max-width:15ch;
    filter:drop-shadow(0 2px 30px rgba(4,12,8,.9)) drop-shadow(0 0 56px rgba(110,215,140,.34));
  }
  .rh-hero h1 em{font-style:italic}
  .rh-hero .rh-sub{
    margin-top:24px; max-width:46ch; font-size:19px; line-height:1.62; color:#C6D6C6;
    text-shadow:0 1px 24px rgba(4,12,8,.7);
  }
  .rh-hero .rh-signature{margin-top:26px; font-size:21px; color:#A8EFC8; opacity:.92}
  .rh-hero .rh-stats{
    margin-top:34px; display:flex; gap:30px; flex-wrap:wrap; max-width:640px;
  }
  .rh-hero .rh-stats div b{display:block; font-family:ui-monospace,Menlo,monospace; font-size:21px; color:#6FE3A4;
    font-weight:400; font-variant-numeric:tabular-nums; line-height:1.3}
  .rh-hero .rh-stats div span{font-family:ui-monospace,Menlo,monospace; font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--muted)}
  .rh-cue{margin-top:40px; display:inline-flex; align-items:center; gap:11px; color:#7FDCA8; font-size:14px}
  @media (prefers-reduced-motion:no-preference){
    .rh-cue svg{animation:nud 2.8s ease-in-out infinite}
    @keyframes nud{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
  }

  /* ================= JOURNAL ================= */
  .rh-journal{position:relative; z-index:2; padding:20px 0 60px}
  .rh-sect{margin-top:66px}
  .rh-sect .row{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap}
  .rh-sect .t{font-size:clamp(28px,3.6vw,40px); display:inline-block; color:#F1F7EE;
    transform:rotate(var(--tilt,-1deg)) translateY(var(--nudge,0px)); letter-spacing:var(--track,0)}
  .rh-sect .c{font-family:ui-monospace,Menlo,monospace; font-size:10.5px; letter-spacing:.12em; color:var(--muted); text-transform:uppercase}
  .rh-squig{display:block; color:var(--fern); margin-top:4px; opacity:.8}
  .rh-note{display:flex; gap:11px; align-items:flex-start; margin-top:14px; color:#A9BDA9; font-size:16px}
  .rh-note svg{flex:0 0 auto; color:var(--fern); margin-top:3px}

  .rh-taped{display:grid; grid-template-columns:repeat(auto-fill,minmax(196px,1fr)); gap:34px 26px; margin-top:30px}
  .rh-tp{
    position:relative; background:#F4F7F0; padding:9px 9px 0; border-radius:1px;
    box-shadow:0 2px 5px rgba(0,0,0,.42), 0 18px 40px rgba(0,0,0,.44);
    transition:transform .34s cubic-bezier(.2,.7,.3,1), box-shadow .34s ease;
  }
  .rh-tp:nth-child(4n+1){transform:rotate(-1.4deg)}
  .rh-tp:nth-child(4n+2){transform:rotate(.9deg)}
  .rh-tp:nth-child(4n+3){transform:rotate(-.5deg)}
  .rh-tp:nth-child(4n){transform:rotate(1.2deg)}
  .rh-tp::before{ /* silver tape catching lamp light */
    content:""; position:absolute; top:-10px; left:50%; width:66px; height:20px;
    transform:translateX(-50%) rotate(-3deg);
    background:linear-gradient(180deg, rgba(211,227,220,.34), rgba(211,227,220,.16));
    border-left:1px solid rgba(150,225,185,.30); border-right:1px solid rgba(150,225,185,.30);
  }
  .rh-tp img{display:block; width:100%; height:126px; object-fit:cover; border-radius:1px; filter:saturate(1.02)}
  .rh-tp .c{padding:9px 3px 12px}
  .rh-tp .c .ti{font-size:15px; line-height:1.3; color:#16281D}
  .rh-tp .c .dt{font-family:ui-monospace,Menlo,monospace; font-size:9px; letter-spacing:.08em; color:#61735F; margin-top:5px; text-transform:uppercase}
  .rh-tp:hover{transform:rotate(0) translateY(-7px); box-shadow:0 3px 8px rgba(0,0,0,.45), 0 30px 62px rgba(0,0,0,.55), 0 0 44px rgba(95,215,154,.16)}

  /* ---------------- wanderer ---------------- */
  .rh-wanderer{margin-top:74px; border-top:1px solid var(--rule); padding-top:30px; display:grid;
    grid-template-columns:auto 1fr; gap:22px; align-items:start}
  @media(max-width:640px){.rh-wanderer{grid-template-columns:1fr}}
  .rh-wanderer .av{
    width:78px; height:78px; border-radius:50%;
    background:radial-gradient(circle at 34% 30%, #A8C98C, #2C5238 72%);
    box-shadow:0 0 0 1px rgba(95,215,154,.28), 0 0 34px rgba(95,215,154,.18);
  }
  .rh-wanderer h3{font-size:26px; color:#F1F7EE}
  .rh-wanderer .who{font-family:ui-monospace,Menlo,monospace; font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:#7FDCA8; margin-top:7px}
  .rh-wanderer p{margin-top:12px; max-width:58ch; color:#B7C9B6; font-size:16.5px}

  /* ---------------- notes ---------------- */
  .rh-notes{margin-top:74px; border-top:1px solid var(--rule); padding:34px 0 90px}
  .rh-qs{display:grid; gap:13px; margin-top:20px; padding:0; list-style:none}
  .rh-qs li{display:flex; gap:12px; align-items:flex-start; color:#BACCB9; font-size:16.5px}
  .rh-qs li::before{content:""; flex:0 0 auto; width:6px; height:6px; margin-top:11px; border-radius:50%;
    background:#5FD79A; box-shadow:0 0 12px rgba(95,215,154,.8)}
  .rh-foot{margin-top:34px; font-family:ui-monospace,Menlo,monospace; font-size:11px; color:var(--muted); line-height:1.9}

/* ==========================================================
   Blocksy overrides — the front page is ours alone.
   Blocksy renders its own header and wraps everything in
   #main-container, which carries a white background that
   washed out the whole scene.
   ========================================================== */
body.home{
  background:linear-gradient(180deg,var(--g0) 0%,var(--g1) 26%,var(--g2) 62%,var(--g3) 100%) !important;
  background-attachment:fixed !important;
  color:var(--text);
}
body.home #header,
body.home .ct-header,
body.home .ct-panel.ct-header,
body.home #offcanvas{ display:none !important; }

body.home #main-container,
body.home #main,
body.home .site-main,
body.home .ct-container,
body.home .ct-container-full{
  max-width:none !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  grid-template-columns:1fr !important;
  display:block !important;
}
body.home article,
body.home .entry-content,
body.home .page-title,
body.home .ct-page-title{ background:transparent !important; margin:0 !important; padding:0 !important; }
body.home .ct-page-title, body.home .entry-header{ display:none !important; }

/* the footer keeps Blocksy's styling but must not sit on white */
body.home footer.ct-footer{ background:var(--g3) !important; }
body.home footer.ct-footer *{ color:var(--muted) !important; }

/* our hero owns the full viewport width */
body.home .rh-hero{ width:100%; }


/* the hero must own a real height before the canvas measures it */
body.home .rh-hero{
  min-height:min(96vh,880px);
  height:min(96vh,880px);
}
body.home .rh-hero > canvas{ width:100%; height:100%; display:block; }


/* ==========================================================
   INNER PAGES — posts, pages, archives.
   Same world as the hero: dark, damp, green. Reading first.
   ========================================================== */
body:not(.home){
  background:linear-gradient(180deg,var(--g0) 0%,var(--g1) 30%,var(--g2) 70%,var(--g3) 100%) !important;
  background-attachment:fixed !important;
  color:var(--text) !important;
}
body:not(.home) #header,
body:not(.home) .ct-header,
body:not(.home) .ct-panel.ct-header,
body:not(.home) #offcanvas,
body:not(.home) .ct-page-title{ display:none !important; }

body:not(.home) #main-container,
body:not(.home) #main,
body:not(.home) .site-main,
body:not(.home) .ct-container{
  background:transparent !important;
  max-width:none !important; width:100% !important;
  padding:0 !important; margin:0 !important;
  display:block !important; grid-template-columns:1fr !important;
}
body:not(.home) [class*="ct-sidebar"], body:not(.home) aside.ct-sidebar{ display:none !important; }

/* the compact masthead */
.rh-bar{
  position:sticky; top:0; z-index:50;
  background:rgba(4,12,8,.72);
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.rh-bar .in{
  max-width:1120px; margin:0 auto; padding:12px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.rh-bar .rh-brand{ font-size:22px; gap:9px; text-decoration:none }
.rh-bar nav{ display:flex; gap:19px; flex-wrap:wrap }
.rh-bar nav a{
  font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:10.5px; letter-spacing:.15em;
  text-transform:uppercase; color:#9FB3A2; text-decoration:none; padding-bottom:3px; position:relative;
}
.rh-bar nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:#5FD79A;transition:width .16s ease}
.rh-bar nav a:hover{ color:var(--text) } .rh-bar nav a:hover::after{ width:100% }

/* the reading column */
body:not(.home) article,
body:not(.home) .entry-content,
body:not(.home) .page-content{
  background:transparent !important; border:0 !important;
}
body:not(.home) .entry-content,
body:not(.home) .page-content{
  max-width:66ch; margin:0 auto !important; padding:0 28px 90px !important;
  font-size:18.5px; line-height:1.78; color:#CFDCCD;
}
body:not(.home) .entry-content > *{ margin-top:1.25em }
body:not(.home) h1.entry-title, body:not(.home) .entry-title{
  max-width:16ch; margin:64px auto 6px !important; padding:0 28px;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  font-weight:400; font-size:clamp(32px,4.6vw,52px); line-height:1.1; letter-spacing:-.02em;
  color:#F1F7EE;
}
body:not(.home) .entry-meta, body:not(.home) .ct-meta{
  max-width:66ch; margin:0 auto 30px !important; padding:0 28px;
  font-family:ui-monospace,Menlo,monospace; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted) !important;
}
body:not(.home) .entry-content a{ color:#8FE3BC; text-decoration:underline; text-underline-offset:3px }
body:not(.home) .entry-content h2,
body:not(.home) .entry-content h3{
  font-family:"Iowan Old Style",Palatino,Georgia,serif; font-weight:400; color:#EAF3E7;
  margin-top:1.9em; line-height:1.25;
}
body:not(.home) .entry-content h2{ font-size:29px } body:not(.home) .entry-content h3{ font-size:23px }
body:not(.home) .entry-content img,
body:not(.home) .entry-content iframe{
  max-width:100%; height:auto; border-radius:2px;
  background:#F4F7F0; padding:9px;
  box-shadow:0 2px 6px rgba(0,0,0,.45), 0 20px 44px rgba(0,0,0,.42);
}
body:not(.home) .entry-content blockquote{
  border-left:2px solid #5FD79A; padding-left:20px; margin-left:0; color:#B9CDB8; font-style:italic;
}
body:not(.home) .entry-content code, body:not(.home) .entry-content pre{
  background:rgba(255,255,255,.05); color:#CFE9D6; border-radius:3px;
}

/* comments — 94 real ones, and they deserve better than an afterthought */
body:not(.home) #comments, body:not(.home) .comments-area{
  max-width:66ch; margin:0 auto !important; padding:0 28px 100px !important;
  border-top:1px solid var(--rule);
}
body:not(.home) .comments-title, body:not(.home) #reply-title{
  font-family:"Bradley Hand","Noteworthy","Segoe Script",cursive;
  font-size:30px; color:#F1F7EE; margin:44px 0 20px;
}
body:not(.home) .comment-list{ list-style:none; padding:0; margin:0; display:grid; gap:22px }
body:not(.home) .comment-body, body:not(.home) .comment{
  background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07);
  border-radius:3px; padding:16px 18px; color:#C4D5C3;
}
body:not(.home) .comment-author, body:not(.home) .fn{ color:#DCEBD9; font-style:normal; font-weight:400 }
body:not(.home) .comment-meta, body:not(.home) .comment-metadata a{
  font-family:ui-monospace,Menlo,monospace; font-size:10px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--muted) !important; text-decoration:none;
}
body:not(.home) .comment-form input[type=text],
body:not(.home) .comment-form input[type=email],
body:not(.home) .comment-form input[type=url],
body:not(.home) .comment-form textarea{
  width:100%; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  color:var(--text); border-radius:3px; padding:11px 13px; font-family:inherit; font-size:16px;
}
body:not(.home) .comment-form .submit, body:not(.home) .comment-form input[type=submit]{
  background:#2FA96F; border:0; color:#04160C; padding:11px 22px; border-radius:100px;
  font-family:ui-monospace,Menlo,monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; cursor:pointer;
}
body:not(.home) .comment-form .submit:hover{ background:#5FD79A }

/* footer stays out of the way */
body:not(.home) footer.ct-footer{ background:var(--g0) !important; border-top:1px solid var(--rule) }
body:not(.home) footer.ct-footer *{ color:var(--muted) !important }


/* ==========================================================
   Drive Blocksy from OUR palette.
   Blocksy colours everything through CSS variables, so setting
   these once fixes every heading, link and body copy site-wide
   instead of chasing individual selectors — which is what left
   post titles dark-navy on near-black.
   ========================================================== */
:root, body, body.home, body:not(.home){
  --theme-text-color:#CFDCCD;
  --theme-headings-color:#F1F7EE;
  --theme-heading-color:#F1F7EE;
  --theme-heading-1-color:#F1F7EE;
  --theme-heading-2-color:#EAF3E7;
  --theme-heading-3-color:#E4EEE1;
  --theme-heading-4-color:#DCE8D9;
  --theme-heading-5-color:#D6E3D3;
  --theme-heading-6-color:#D0DECD;
  --theme-link-initial-color:#8FE3BC;
  --theme-link-hover-color:#C6F5DC;
  --theme-link-active-color:#C6F5DC;
  --theme-border-color:rgba(255,255,255,.10);
  --theme-selection-background-color:#2FA96F;
  --theme-selection-text-color:#04160C;
  --theme-palette-color-1:#8FE3BC;
  --theme-palette-color-2:#5FD79A;
  --theme-palette-color-4:#F1F7EE;
  --theme-palette-color-6:#0A1710;
  --theme-form-field-background-initial-color:rgba(255,255,255,.05);
  --theme-form-field-border-initial-color:rgba(255,255,255,.14);
  --theme-form-text-initial-color:#CFDCCD;
  --theme-button-background-initial-color:#2FA96F;
  --theme-button-background-hover-color:#5FD79A;
  --theme-content-background-color:transparent;
}

/* belt and braces for the specific things that were unreadable */
body:not(.home) h1, body:not(.home) h2, body:not(.home) h3,
body:not(.home) .entry-title, body:not(.home) .entry-title a,
body:not(.home) .page-title, body:not(.home) .ct-block-title{
  color:#F1F7EE !important;
}
body:not(.home) .entry-title a:hover{ color:#C6F5DC !important; }
body:not(.home) p, body:not(.home) li, body:not(.home) td{ color:#CFDCCD; }
body:not(.home) .archive-description, body:not(.home) .taxonomy-description,
body:not(.home) .term-description{ color:#A8BCA6 !important; }



/* ==========================================================
   READING MODE — the notebook comes indoors.
   The hero is always night. Posts, pages and archives can
   switch to damp paper for long reading. Toggle lives in the
   masthead and remembers itself.
   ========================================================== */
.rh-toggle{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  background:transparent; border:1px solid rgba(255,255,255,.16);
  border-radius:100px; padding:5px 12px; color:#9FB3A2;
  font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:10px;
  letter-spacing:.14em; text-transform:uppercase;
  transition:color .2s ease, border-color .2s ease, background .2s ease;
}
.rh-toggle:hover{ color:#EAF3E7; border-color:rgba(95,215,154,.5) }
.rh-toggle svg{ display:block }

html[data-rh-read="light"] body:not(.home){
  --paper-r:#EEF2E8; --ink-r:#16281D; --muted-r:#5D6E62; --rule-r:#CBD7C9; --link-r:#276B47;
  background:linear-gradient(180deg,#F3F6EE 0%, var(--paper-r) 40%, #E6ECE0 100%) !important;
  color:var(--ink-r) !important;

  --theme-text-color:#243528;
  --theme-headings-color:#12241A;
  --theme-heading-color:#12241A;
  --theme-heading-1-color:#12241A;
  --theme-heading-2-color:#172C20;
  --theme-heading-3-color:#1B3125;
  --theme-heading-4-color:#20372A;
  --theme-heading-5-color:#243B2E;
  --theme-heading-6-color:#284032;
  --theme-link-initial-color:#276B47;
  --theme-link-hover-color:#12492D;
  --theme-border-color:rgba(20,40,28,.14);
  --theme-form-field-background-initial-color:#FFFFFF;
  --theme-form-field-border-initial-color:rgba(20,40,28,.20);
  --theme-form-text-initial-color:#243528;
}
html[data-rh-read="light"] .rh-bar{
  background:rgba(240,244,234,.82);
  border-bottom:1px solid var(--rule-r);
}
html[data-rh-read="light"] .rh-bar nav a{ color:#4C6154 }
html[data-rh-read="light"] .rh-bar nav a:hover{ color:#12241A }
html[data-rh-read="light"] .rh-toggle{ color:#4C6154; border-color:rgba(20,40,28,.22) }
html[data-rh-read="light"] .rh-toggle:hover{ color:#12241A; border-color:#276B47 }
html[data-rh-read="light"] .rh-bar .rh-brand{ filter:none }
html[data-rh-read="light"] .rh-bar .rh-grad{
  background-image:linear-gradient(102deg,#1B5C36 0%,#2E8B52 22%,#4C9E5F 40%,#1F7A4C 60%,#2E8B52 80%,#1B5C36 100%);
}
html[data-rh-read="light"] body:not(.home) h1,
html[data-rh-read="light"] body:not(.home) h2,
html[data-rh-read="light"] body:not(.home) h3,
html[data-rh-read="light"] body:not(.home) .entry-title,
html[data-rh-read="light"] body:not(.home) .entry-title a,
html[data-rh-read="light"] body:not(.home) .page-title{ color:#12241A !important }
html[data-rh-read="light"] body:not(.home) p,
html[data-rh-read="light"] body:not(.home) li,
html[data-rh-read="light"] body:not(.home) td,
html[data-rh-read="light"] body:not(.home) .entry-content{ color:#243528 !important }
html[data-rh-read="light"] body:not(.home) .entry-meta,
html[data-rh-read="light"] body:not(.home) .ct-meta,
html[data-rh-read="light"] body:not(.home) .archive-description,
html[data-rh-read="light"] body:not(.home) .term-description{ color:#5D6E62 !important }
html[data-rh-read="light"] body:not(.home) .entry-content a{ color:#276B47 }
html[data-rh-read="light"] body:not(.home) .entry-content img{
  background:#FFFFFF; box-shadow:0 1px 3px rgba(20,40,28,.12), 0 12px 28px rgba(20,40,28,.10);
}
html[data-rh-read="light"] body:not(.home) .entry-content blockquote{ border-left-color:#3E9A6A; color:#3A4E42 }
/* cards, comments and forms on paper */
html[data-rh-read="light"] body.archive .entry-card,
html[data-rh-read="light"] body.blog .entry-card,
html[data-rh-read="light"] body:not(.home) .comment-body,
html[data-rh-read="light"] body:not(.home) .comment{
  background:#FFFFFF !important; border-color:rgba(20,40,28,.12) !important; color:#243528 !important;
}
html[data-rh-read="light"] body:not(.home) .comment-author,
html[data-rh-read="light"] body:not(.home) .fn{ color:#12241A }
html[data-rh-read="light"] body:not(.home) .comments-title,
html[data-rh-read="light"] body:not(.home) #reply-title{ color:#12241A }
html[data-rh-read="light"] body:not(.home) .comment-form input,
html[data-rh-read="light"] body:not(.home) .comment-form textarea{
  background:#FFFFFF; border-color:rgba(20,40,28,.20); color:#243528;
}
html[data-rh-read="light"] body:not(.home) footer.ct-footer{
  background:#E4EADD !important; border-top:1px solid var(--rule-r);
}
html[data-rh-read="light"] body:not(.home) footer.ct-footer *{ color:#5D6E62 !important }


/* ==========================================================
   ARCHIVE — a list, not a grid. One entry per row: the
   photograph on the left, the writing on the right, separated
   by a hairline. Reads like an index of a life rather than a
   shop window.
   ========================================================== */
body.archive .ct-container, body.search .ct-container, body.blog .ct-container{
  max-width:940px !important; margin:0 auto !important; padding:0 28px 96px !important;
}
body.archive .entries, body.search .entries, body.blog .entries{
  display:block !important; grid-template-columns:none !important; gap:0 !important;
}
body.archive .entry-card, body.search .entry-card, body.blog .entry-card{
  display:grid !important;
  grid-template-columns:250px 1fr !important;
  gap:0 30px !important; align-items:start !important;
  background:transparent !important; border:0 !important;
  border-bottom:1px solid rgba(255,255,255,.09) !important;
  border-radius:0 !important; overflow:visible !important;
  padding:30px 0 !important; margin:0 !important;
  transition:background .3s ease;
}
body.archive .entry-card:hover{ background:rgba(255,255,255,.022) !important }
body.archive .entry-card:last-child{ border-bottom:0 !important }

/* the photograph, left column, all rows the same shape */
body.archive .entry-card .ct-media-container,
body.blog .entry-card .ct-media-container,
body.search .entry-card .ct-media-container{
  grid-row:1 / span 5 !important; grid-column:1 !important;
  margin:0 !important; border-radius:2px !important; overflow:hidden !important;
  aspect-ratio:4/3 !important; align-self:start !important;
}
body.archive .entry-card .ct-media-container img,
body.blog .entry-card .ct-media-container img{
  width:100% !important; height:100% !important; object-fit:cover !important;
  border-radius:2px !important; box-shadow:none !important; padding:0 !important;
  background:none !important; display:block !important;
  transition:transform .6s cubic-bezier(.2,.7,.3,1), filter .4s ease;
  filter:saturate(.95);
}
body.archive .entry-card:hover .ct-media-container img{ transform:scale(1.045); filter:saturate(1.06) }

/* the writing, right column */
body.archive .entry-card > *:not(.ct-media-container),
body.blog .entry-card > *:not(.ct-media-container){
  grid-column:2 !important; padding:0 !important; margin:0 !important; max-width:min(64ch,100%) !important;
}
body.archive .entry-card .entry-meta:first-of-type,
body.blog .entry-card .entry-meta:first-of-type{
  font-family:ui-monospace,"SF Mono",Menlo,monospace !important;
  font-size:9.5px !important; letter-spacing:.14em !important; text-transform:uppercase !important;
  color:#7FBF96 !important; line-height:1.5 !important;
}
body.archive .entry-card .entry-meta:first-of-type a{ color:#7FBF96 !important; text-decoration:none }
body.archive .entry-card .entry-title, body.blog .entry-card .entry-title{
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif !important;
  font-size:clamp(23px,2.6vw,30px) !important; line-height:1.18 !important;
  letter-spacing:-.012em !important; margin:9px 0 0 !important;
}
body.archive .entry-card .entry-title a{ color:#F1F7EE !important; text-decoration:none }
body.archive .entry-card:hover .entry-title a{ color:#C6F5DC !important }
body.archive .entry-card .entry-excerpt, body.blog .entry-card .entry-excerpt{
  margin-top:11px !important; color:#A9BDA7 !important;
  font-size:16px !important; line-height:1.66 !important;
}
body.archive .entry-card .entry-meta:last-of-type,
body.blog .entry-card .entry-meta:last-of-type{
  margin-top:13px !important;
  font-family:ui-monospace,Menlo,monospace !important; font-size:9.5px !important;
  letter-spacing:.12em !important; text-transform:uppercase !important; color:#7E9284 !important;
}
body.archive .entry-card .entry-meta:last-of-type a{ color:#7E9284 !important; text-decoration:none }
body.archive .entry-card .ct-media-container-static{ display:none !important }

@media(max-width:720px){
  body.archive .entry-card, body.blog .entry-card{ grid-template-columns:1fr !important; gap:14px 0 !important }
  body.archive .entry-card > *:not(.ct-media-container){ grid-column:1 !important }
  body.archive .entry-card .ct-media-container{ grid-row:auto !important; grid-column:1 !important; aspect-ratio:16/10 !important }
}

body.archive .page-title, body.search .page-title, body.blog .page-title{
  font-family:"Bradley Hand","Noteworthy","Segoe Script",cursive !important;
  font-size:clamp(30px,4vw,44px) !important; color:#F1F7EE !important;
  margin:52px auto 2px !important; max-width:940px !important; padding:0 28px !important;
}
body.archive .ct-page-title, body.search .ct-page-title{ display:block !important; background:transparent !important; padding:0 !important }
body.archive .archive-description, body.archive .term-description{
  max-width:940px !important; margin:0 auto 10px !important; padding:0 28px !important;
  color:#93A891 !important; font-size:16px !important;
}

/* ==========================================================
   SINGLE POST HEADER — Blocksy puts the title and every meta
   element loose inside .hero-section, which is why it sat
   ragged and half-indented.
   ========================================================== */
body.single .hero-section{
  max-width:66ch !important; margin:0 auto !important;
  padding:56px 28px 0 !important; text-align:left !important;
  background:transparent !important; display:block !important;
}
body.single .hero-section .entry-header{ display:block !important; text-align:left !important }
body.single .hero-section .page-title{
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif !important;
  font-weight:400 !important; font-size:clamp(30px,4.4vw,50px) !important;
  line-height:1.1 !important; letter-spacing:-.02em !important;
  color:#F1F7EE !important; margin:0 0 16px !important; padding:0 !important;
  max-width:20ch !important; text-align:left !important;
}
/* the meta row: one tidy line, avatar small, everything left */
body.single .hero-section .entry-meta{
  display:flex !important; flex-wrap:wrap !important; align-items:center !important;
  gap:9px !important; margin:0 0 6px !important; padding:0 !important;
  justify-content:flex-start !important; text-align:left !important;
  font-family:ui-monospace,"SF Mono",Menlo,monospace !important;
  font-size:10px !important; letter-spacing:.14em !important; text-transform:uppercase !important;
  color:#8CA391 !important;
}
body.single .hero-section .entry-meta a{ color:#8FD9AE !important; text-decoration:none }
body.single .hero-section .entry-meta a:hover{ color:#C6F5DC !important }
body.single .hero-section .ct-media-container-static,
body.single .hero-section .ct-media-container-static img{
  width:22px !important; height:22px !important; border-radius:50% !important;
  margin:0 !important; padding:0 !important; box-shadow:none !important; background:none !important;
  flex:0 0 auto !important;
}
/* a hairline closing the header off from the writing */
body.single .hero-section::after{
  content:""; display:block; height:1px; margin:26px 0 0;
  background:linear-gradient(90deg, rgba(132,179,108,.34), rgba(132,179,108,0));
}
html[data-rh-read="light"] body.single .hero-section .page-title{ color:#12241A !important }
html[data-rh-read="light"] body.single .hero-section .entry-meta{ color:#5D6E62 !important }
html[data-rh-read="light"] body.single .hero-section .entry-meta a{ color:#276B47 !important }
html[data-rh-read="light"] body.archive .entry-card .entry-title a{ color:#12241A !important }
html[data-rh-read="light"] body.archive .entry-card .entry-excerpt{ color:#42564A !important }
html[data-rh-read="light"] body.archive .entry-card .entry-meta:first-of-type,
html[data-rh-read="light"] body.archive .entry-card .entry-meta:first-of-type a{ color:#2E7A50 !important }
html[data-rh-read="light"] body.archive .page-title{ color:#12241A !important }


/* the author avatar was touching the name */
body.single .hero-section .ct-media-container-static{ margin-right:5px !important }
body.single .hero-section .entry-meta{ gap:11px !important }
body.single .hero-section .entry-meta > *{ margin:0 !important }
body.single .hero-section .ct-meta-element-author{ margin-left:2px !important }

/* archive list on paper */
html[data-rh-read="light"] body.archive .entry-card{ border-bottom-color:rgba(20,40,28,.14) !important }
html[data-rh-read="light"] body.archive .entry-card:hover{ background:rgba(20,40,28,.03) !important }
html[data-rh-read="light"] body.archive .entry-card .entry-title a{ color:#12241A !important }
html[data-rh-read="light"] body.archive .entry-card:hover .entry-title a{ color:#276B47 !important }
html[data-rh-read="light"] body.archive .entry-card .entry-excerpt{ color:#42564A !important }
html[data-rh-read="light"] body.archive .entry-card .entry-meta:first-of-type,
html[data-rh-read="light"] body.archive .entry-card .entry-meta:first-of-type a{ color:#2E7A50 !important }
html[data-rh-read="light"] body.archive .entry-card .entry-meta:last-of-type,
html[data-rh-read="light"] body.archive .entry-card .entry-meta:last-of-type a{ color:#5D6E62 !important }


/* rh-hero-sizing-hard — the canvas must have a real box before it measures.
   Percentages fail if an ancestor has no height, so the hero is pinned to
   the viewport and the canvas to the hero, in absolute terms. */
body.home .rh-hero{
  position:relative !important;
  min-height:min(96vh,880px) !important;
  height:min(96vh,880px) !important;
  display:flex !important; align-items:center !important;
  overflow:hidden !important;
}
body.home .rh-hero > #rh-sky{
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important; display:block !important;
}


/* ==========================================================
   Blocksy bleeds card images deliberately:
     .boundless-image { width: calc(100% + 30px*2); margin-inline: -30px }
   and absolutely positions card media in some layouts. In a
   two-column list that made the photograph spill 60px into the
   text and cover the first characters of every title.
   ========================================================== */
body.archive .entry-card .ct-media-container,
body.blog .entry-card .ct-media-container,
body.search .entry-card .ct-media-container,
body.archive .entry-card .ct-media-container.boundless-image,
body.blog .entry-card .ct-media-container.boundless-image{
  position:relative !important;
  inset:auto !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  margin-inline:0 !important;
  margin-block:0 !important;
  --card-inner-spacing:0px !important;
  box-shadow:none !important;
}
/* and the writing must be free to shrink inside its column */
body.archive .entry-card > *:not(.ct-media-container),
body.blog .entry-card > *:not(.ct-media-container),
body.search .entry-card > *:not(.ct-media-container){
  min-width:0 !important;
  position:relative !important;
  z-index:1 !important;
}
body.archive .entry-card, body.blog .entry-card, body.search .entry-card{
  position:relative !important;
  --card-inner-spacing:0px !important;
}


/* rh-no-h-scroll — nothing may push the page sideways.
   A 64ch column is ~600px, which overflowed a 390px phone. */
html, body{ max-width:100% !important; overflow-x:hidden !important; }
body.archive .entry-card > *:not(.ct-media-container),
body.blog .entry-card > *:not(.ct-media-container),
body.search .entry-card > *:not(.ct-media-container){ max-width:min(64ch,100%) !important; }
body:not(.home) .entry-content, body:not(.home) .page-content{ max-width:min(66ch,100%) !important; }
body:not(.home) .entry-title, body:not(.home) .page-title,
body.single .hero-section .page-title{ max-width:min(20ch,100%) !important; }
body:not(.home) img, body:not(.home) iframe, body:not(.home) video,
body:not(.home) table{ max-width:100% !important; }
body:not(.home) pre{ max-width:100% !important; overflow-x:auto !important; }

@media (max-width:760px){
  .rh-bar .in{ padding:10px 16px !important; gap:10px !important; }
  .rh-bar .rh-brand{ font-size:19px !important }
  .rh-bar nav{ gap:12px 13px !important }
  .rh-bar nav a{ font-size:9.5px !important; letter-spacing:.11em !important }
  .rh-toggle{ padding:4px 10px !important; font-size:9px !important }

  body.archive .ct-container, body.search .ct-container, body.blog .ct-container{ padding:0 18px 64px !important; }
  body.archive .page-title, body.search .page-title{ padding:0 18px !important; margin-top:34px !important; }
  body.archive .archive-description{ padding:0 18px !important }
  body.archive .entry-card, body.blog .entry-card{
    display:flex !important; flex-direction:column !important; gap:11px !important; padding:22px 0 !important;
  }
  body.archive .entry-card .ct-media-container,
  body.blog .entry-card .ct-media-container{ order:-1 !important; aspect-ratio:16/10 !important }
  body.archive .entry-card .entry-title{ font-size:22px !important; margin:0 !important }
  body.archive .entry-card .entry-excerpt{ font-size:15px !important; margin:0 !important }

  body:not(.home) .entry-content, body:not(.home) .page-content{ padding:0 18px 64px !important }
  body:not(.home) .entry-title, body:not(.home) .page-title{ padding:0 18px !important }
  body.single .hero-section{ padding:34px 18px 0 !important }
  body:not(.home) #comments, body:not(.home) .comments-area{ padding:0 18px 70px !important }

  body.home .rh-hero{ height:min(88vh,660px) !important; min-height:min(88vh,660px) !important }
  body.home .rh-hero .rh-col{ max-width:100% !important }
  body.home .rh-hero .hero-in{ padding:92px 18px 56px !important }
  body.home .rh-nav .in{ padding:0 16px !important }
  body.home .rh-nav ul{ display:none !important }
  body.home .rh-panel{ left:12px !important; right:12px !important }
  body.home .rh-stats{ gap:18px !important }
  .rh-journal .rh-taped{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)) !important; gap:24px 14px !important }
}


/* rh-nav-shrink — a flex item will not shrink below its content by default,
   so the masthead nav was forcing the whole page wider than the phone and
   everything else got clipped. */
.rh-bar .in{ flex-wrap:wrap !important; min-width:0 !important; }
.rh-bar nav{ flex:1 1 auto !important; min-width:0 !important; flex-wrap:wrap !important; }
.rh-bar .rh-brand{ flex:0 0 auto !important; min-width:0 !important; }
@media (max-width:760px){
  .rh-bar .in{ justify-content:flex-start !important; row-gap:8px !important }
  .rh-bar nav{ order:3 !important; width:100% !important; gap:10px 14px !important }
  .rh-toggle{ order:2 !important; margin-left:auto !important }
}
/* and belt-and-braces: nothing in the page may exceed the viewport */
body:not(.home) *{ max-width:100% }
body:not(.home) .rh-bar, body:not(.home) #main-container{ overflow-x:clip }


/* rh-nav-scroll — on a phone the link row scrolls inside its own strip
   instead of stretching the document. Fixed width on the strip is what
   stops a long nav from setting the page width. */
@media (max-width:760px){
  .rh-bar .in{
    display:flex !important; flex-wrap:wrap !important;
    align-items:center !important; justify-content:space-between !important;
    padding:10px 16px !important; gap:8px !important;
  }
  .rh-bar .rh-brand{ display:inline-flex !important; flex:0 1 auto !important }
  .rh-toggle{ float:none !important; flex:0 0 auto !important; margin:0 !important }
  .rh-bar nav{
    display:flex !important; flex-wrap:nowrap !important;
    width:100% !important; max-width:100% !important;
    overflow-x:auto !important; overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
    margin-top:9px !important; padding-bottom:2px !important;
    gap:16px !important; clear:both !important;
  }
  .rh-bar nav::-webkit-scrollbar{ display:none !important }
  .rh-bar nav a{ white-space:nowrap !important; flex:0 0 auto !important }
}
/* nothing anywhere may set the document wider than the screen */
html{ overflow-x:hidden !important }
body{ overflow-x:hidden !important; width:100% !important; max-width:100vw !important }


/* rh-bar-final — one authoritative definition of the small-screen masthead.
   Several earlier media blocks were contradicting each other and pushing the
   toggle outside the viewport. This is the last word. */
@media (max-width:760px){
  .rh-bar .in{
    display:flex !important; flex-wrap:wrap !important;
    align-items:center !important; justify-content:space-between !important;
    gap:8px !important; padding:10px 16px !important;
    width:100% !important; max-width:100% !important; box-sizing:border-box !important;
  }
  .rh-bar .rh-brand{ order:1 !important; flex:0 1 auto !important; min-width:0 !important; margin:0 !important }
  .rh-toggle{
    order:2 !important; flex:0 0 auto !important; float:none !important;
    margin:0 !important; max-width:40% !important;
  }
  .rh-bar nav{
    order:3 !important; flex:1 1 100% !important;
    width:100% !important; max-width:100% !important; box-sizing:border-box !important;
    overflow-x:auto !important; flex-wrap:nowrap !important;
    margin:6px 0 0 !important; padding:0 0 2px !important; gap:15px !important;
  }
}


/* rh-lightbox-styles — the photograph viewer, on paper and at night */
body.rh-lb-on{ overflow:hidden !important }
.rh-lb{
  position:fixed; inset:0; z-index:9999;
  display:none; align-items:center; justify-content:center;
  background:rgba(3,10,7,.94);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  opacity:0; transition:opacity .22s ease;
}
.rh-lb.on{ display:flex; opacity:1 }
.rh-lb-fig{ margin:0; max-width:94vw; max-height:92vh; display:flex; flex-direction:column; align-items:center; gap:14px }
.rh-lb img{
  max-width:94vw; max-height:82vh; width:auto; height:auto; display:block;
  background:#F4F7F0; padding:8px; border-radius:2px;
  box-shadow:0 4px 12px rgba(0,0,0,.5), 0 30px 70px rgba(0,0,0,.6);
  opacity:0; transition:opacity .25s ease;
}
.rh-lb figcaption{
  display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  font-size:16px; color:#DCE8D9; max-width:70ch; padding:0 16px;
}
.rh-lb figcaption .c{ font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:10px; letter-spacing:.16em; color:#8CA391 }
.rh-lb button{
  position:absolute; background:rgba(255,255,255,.07); color:#EAF3E7;
  border:1px solid rgba(255,255,255,.16); border-radius:100px; cursor:pointer;
  display:grid; place-items:center; line-height:1;
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.rh-lb button:hover{ background:rgba(95,215,154,.22); border-color:rgba(95,215,154,.55) }
.rh-lb button:focus-visible{ outline:2px solid #5FD79A; outline-offset:3px }
.rh-lb-x{ top:18px; right:18px; width:42px; height:42px; font-size:17px }
.rh-lb-p, .rh-lb-n{ top:50%; transform:translateY(-50%); width:50px; height:50px; font-size:27px; padding-bottom:4px }
.rh-lb-p{ left:18px } .rh-lb-n{ right:18px }
.rh-lb-p:hover, .rh-lb-n:hover{ transform:translateY(-50%) scale(1.06) }
.rh-lb-spin{
  position:absolute; width:26px; height:26px; border-radius:50%;
  border:2px solid rgba(150,214,178,.25); border-top-color:#8FE3BC;
  animation:rhspin .8s linear infinite; display:none;
}
@keyframes rhspin{ to{ transform:rotate(360deg) } }
@media (prefers-reduced-motion:reduce){
  .rh-lb, .rh-lb img{ transition:none !important }
  .rh-lb-spin{ animation:none !important }
}
@media (max-width:760px){
  .rh-lb-p, .rh-lb-n{ width:42px; height:42px; font-size:22px }
  .rh-lb-p{ left:8px } .rh-lb-n{ right:8px }
  .rh-lb img{ max-height:72vh; padding:5px }
  .rh-lb figcaption{ font-size:14.5px }
}
html[data-rh-read="light"] .rh-lb{ background:rgba(228,236,222,.96) }
html[data-rh-read="light"] .rh-lb figcaption{ color:#1B3125 }
html[data-rh-read="light"] .rh-lb figcaption .c{ color:#5D6E62 }
html[data-rh-read="light"] .rh-lb button{ background:rgba(20,40,28,.06); color:#12241A; border-color:rgba(20,40,28,.20) }
html[data-rh-read="light"] .rh-lb img{ background:#fff; box-shadow:0 4px 14px rgba(20,40,28,.18), 0 26px 60px rgba(20,40,28,.20) }


/* rh-a11y — keyboard users must always be able to see where they are */
.rh-skip{
  position:absolute; left:-9999px; top:0; z-index:10000;
  background:#0B1A12; color:#C6F5DC; padding:12px 20px;
  font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:12px;
  letter-spacing:.12em; text-transform:uppercase; text-decoration:none;
  border:1px solid #5FD79A; border-radius:0 0 4px 0;
}
.rh-skip:focus{ left:0; top:0 }

a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible{
  outline:2px solid #5FD79A !important;
  outline-offset:3px !important;
  border-radius:2px;
}
html[data-rh-read="light"] a:focus-visible,
html[data-rh-read="light"] button:focus-visible,
html[data-rh-read="light"] input:focus-visible,
html[data-rh-read="light"] textarea:focus-visible{ outline-color:#1F7A4C !important }
html[data-rh-read="light"] .rh-skip{ background:#EEF2E8; color:#12241A; border-color:#1F7A4C }

/* the archive list rows are links — make the whole row show focus */
body.archive .entry-card a:focus-visible{ outline-offset:4px }

/* honour a preference for less movement across the whole site */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
}


/* rh-qa-fixes — caught in the QA sweep */
/* 1. the hero text lost its horizontal padding on small screens */
@media (max-width:760px){
  body.home .rh-hero .hero-in{ padding-left:18px !important; padding-right:18px !important }
  body.home .rh-stats{ row-gap:12px !important }
  body.home .rh-cue{ margin-top:26px !important }
}
/* 2. the logo's moon is near-white and vanished on paper */
html[data-rh-read="light"] .rh-mark path[fill="#EAFBF2"],
html[data-rh-read="light"] .rh-mark path[fill="#BFF3D8"]{ fill:#2E7A50 !important }
html[data-rh-read="light"] .rh-mark circle[stroke="rgba(255,255,255,.30)"]{ stroke:rgba(20,40,28,.30) !important }
html[data-rh-read="light"] .rh-mark path[stroke="rgba(255,255,255,.34)"]{ stroke:rgba(20,40,28,.34) !important }
html[data-rh-read="light"] .rh-mark circle[stroke="rgba(95,215,154,.55)"]{ stroke:rgba(31,122,76,.55) !important }
html[data-rh-read="light"] .rh-mark path[stroke="#5FD79A"]{ stroke:#1F7A4C !important }


/* rh-wrap-mobile — every wrapped section keeps its gutters on a phone */
@media (max-width:760px){
  .rh-wrap{ padding-left:18px !important; padding-right:18px !important }
  .rh-journal .rh-sect{ margin-top:40px !important }
  .rh-journal .rh-sect .t{ font-size:clamp(26px,7vw,34px) !important }
  .rh-wanderer{ margin-top:48px !important; gap:16px !important }
  .rh-wanderer .av{ width:58px !important; height:58px !important }
  .rh-hero .rh-stats div b{ font-size:18px !important }
  .rh-hero h1{ font-size:clamp(30px,8.4vw,44px) !important }
}


/* rh-caption-case — the shelf captions were inheriting an uppercase transform */
.rh-tp .c .ti{
  text-transform:none !important;
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif !important;
  letter-spacing:normal !important;
  font-size:15px !important; line-height:1.32 !important; color:#16281D !important;
}
.rh-journal .rh-sect .t{ text-transform:none !important }