/* ===== rip.hibariya.org readability polish =====
   Auto-loaded after the indigo theme's style.css (see layouts/partials/head.html).
   Same fonts and navy accent as the theme; refined type scale, measure, rhythm,
   and calmer link / metadata / blockquote / code styling. CSS only. */

/* -- Base: measure, size, rhythm -- */
body {
  color: #2f2f2f;
  line-height: 1.75;
}
@media only screen and (min-width: 768px) {
  body {
    font-size: 1.2em;        /* ~19px; theme had 1.3em */
    max-width: 700px;        /* 660px measure + 20px padding each side; theme had 800px */
    padding: 0 20px;
  }
}
@media only screen and (max-width: 768px) {
  body {
    font-size: 1em;
    max-width: 90%;          /* keep the theme's side gutters on small screens */
  }
}
@media only screen and (max-width: 414px) {
  body {
    font-size: 1.05em;       /* fixes the theme's inverted mobile sizes (1.2em > tablet's 1em) */
    max-width: 90%;
  }
}
section.content {
  line-height: 1.75;
  overflow-wrap: break-word;  /* long URLs in lists no longer overflow on phones */
}
p,
li {
  text-wrap: pretty;
}
section.content p {
  margin: 0 0 1.4em 0;
}
section.content ul,
section.content ol {
  margin: 0 0 1.4em 0;
  padding-left: 1.3em;
}
section.content li {
  margin-bottom: 0.4em;
}

/* -- Hide the floating site logo (carried over from custom-4.css) -- */
#sitelogo {
  display: none;
}

/* -- Links: color shift + underline instead of navy inversion -- */
a {
  color: #00416a;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
a:visited {
  color: #00416a;            /* one link color; theme used #316586 */
}
a:hover {
  background-color: transparent;
  color: #0a6ba8;
}
a:focus-visible {
  outline: 2px solid #00416a;
  outline-offset: 2px;
}

/* -- Top nav -- */
div#page-nav,
#pagination {
  letter-spacing: 0.08em;
}
div.page-nav-item > a:hover {
  background-color: transparent;
  color: #0a6ba8;
  text-decoration: underline;
}

/* -- Site header (home) -- */
div#site-header {
  border-top: 4px solid #2f2f2f;
  border-bottom: 1px solid #cfd6da;
  padding: 0.4em 0 0.5em 0;
  margin-bottom: 2.5em;
}
div#site-header > h1 {
  font-size: 1.8em;
  line-height: 1.15;
  margin-top: 0.8em;
}
div#site-header > p {
  color: #5c6670;
  font-size: 0.9em;
}

/* -- Post list -- */
article {
  margin-bottom: 2.6em;      /* whitespace separates posts */
}
/* Date above title (CSS-only reorder; the theme's li.html renders title first) */
article > header:has(> h2.list-title) {
  display: flex;
  flex-direction: column;
}
article > header:has(> h2.list-title) > h2.list-title {
  order: 2;
}
article > header:has(> h2.list-title) > p.list-post-date {
  order: 1;
}
p.list-post-date {
  color: #5c6670;
  font-size: 0.65em;
  letter-spacing: 0.1em;
  margin: 0 0 0.4em 0;
}
h2.list-title {
  font-size: 1.2em;
  line-height: 1.3;
  margin: 0 0 0.4em 0;
  padding-top: 0;
}
h2.list-title > a,
h2.list-title > a:visited {
  color: #00416a;
  text-decoration: none;
}
h2.list-title > a:hover {
  background-color: transparent;
  color: #0a6ba8;
  text-decoration: underline;
  text-underline-offset: 3px;
}
article:not(.h-entry) > div {
  color: #3f4750;
  font-size: 0.92em;
  line-height: 1.65;
}
article > p:has(> a.read-more) {
  margin: 0.5em 0 0 0;
}
a.read-more {
  font-size: 0.65em;
  letter-spacing: 0.06em;
  text-decoration: none;
}
a.read-more:hover {
  background-color: transparent;
  color: #0a6ba8;
  text-decoration: underline;
}

/* -- Pagination -- */
div.pagination-item:hover {
  background-color: transparent;
}
div.pagination-item > a:hover {
  color: #0a6ba8;
  text-decoration: underline;
}
div.pagination-item-spacer {
  color: #9aa4ac;
}

/* -- Post page header -- */
h1.post-title {
  border-top: 4px solid #2f2f2f;
  font-size: 1.9em;
  line-height: 1.2;
  margin-top: 1em;
  padding-top: 0.6em;
  text-wrap: pretty;
}
p.post-date {
  background-color: transparent;
  color: #5c6670;
  font-size: 0.7em;
  margin: 0 0 0.8em 0;
  padding: 0;
  text-transform: none;
}
a.p-author {
  color: #5c6670;
}
a.p-author:hover {
  background-color: transparent;
  color: #00416a;
}

/* -- Tags: quieter chips -- */
a.post-tag {
  background-color: #e7edf0;
  border: none;
  border-radius: 3px;
  color: #00416a;
  letter-spacing: 0.06em;
  padding: 0.2em 0.6em;
}
a.post-tag:hover {
  background-color: #dee5e9;
  color: #00416a;
}

/* -- Blockquote: thin rule + italic, no fill -- */
blockquote {
  background-color: transparent;
  border-left: 3px solid #00416a;
  color: #40515e;
  font-size: 1.05em;
  font-style: italic;
  line-height: 1.6;
  margin: 2em 0;
  padding: 0 0 0 1em;
  width: auto;
}
blockquote p:last-child {
  margin-bottom: 0;
}

/* -- Code -- */
:not(pre) > code {
  background-color: #e7edf0;
  border-radius: 3px;
  color: #123a52;
  font-size: 0.82em;
  padding: 0.15em 0.35em;
}
pre {
  background-color: #0d2f43;
  border: none;
  border-radius: 6px;
  color: #d9e4ea;
  font-size: 0.78em;
  line-height: 1.6;
  padding: 0.95em 1.05em;
}
pre > code {
  font-size: inherit;        /* theme's desktop `code { font-size: 0.9em }` would compound */
  padding: 0;
}

/* -- Rules & article nav -- */
hr.post-underline {
  border-top: 1px solid #cfd6da;
  width: 100%;
}
nav#article-skip {
  border-top: 1px solid #cfd6da;
  letter-spacing: 0.08em;
  padding-top: 0.5em;
}
.top {
  border-left: none;
  border-right: none;
}
div.next > a:hover,
div.prev > a:hover,
div.top > a:hover {
  background-color: transparent;
  color: #0a6ba8;
  text-decoration: underline;
}

/* -- Footer bio card: open layout instead of shadowed box -- */
div.h-card {
  align-items: start;
  border-radius: 0;
  border-top: 1px solid #cfd6da;
  box-shadow: none;
  column-gap: 20px;
  display: grid;
  grid-template-columns: 64px 1fr;
  margin: 4em auto 0 auto;
  min-height: 0;
  padding: 1.6em 0 0 0;
  width: 100%;
}
img.u-photo {
  border-radius: 50%;
  grid-row: 1 / span 2;
  height: 64px;
  margin: 0;
  width: 64px;
}
.card-content {
  display: block;
  margin-left: 0;
}
.card-name {
  font-size: 1em;
  padding-top: 0;
}
.card-name a,
.card-name a:visited {
  color: #2f2f2f;
  text-decoration: none;
}
.card-name a:hover {
  background-color: transparent;
  color: #00416a;
}
.card-subhead {
  color: #5c6670;
  font-family: "Charter", Times, "Times New Roman", serif;
  font-size: 0.85em;
  line-height: 1.5;
  margin: 0.2em 0 0 0;
  text-transform: none;
}
p.p-note {
  color: #5c6670;
  font-size: 0.85em;
  grid-column: 2;
  line-height: 1.5;
  margin: 0.2em 0 0 0;
}
aside#social {
  border-top: none;
}
.copyright {
  color: #9aa4ac;
  font-size: 0.65em;
  margin: 2em 0 3em 0;
  text-align: right;
}

/* ===== Syntax highlighting =====
   Hugo renders highlighted blocks with classes (markup.highlight.noClasses = false).
   Palette: `hugo gen chromastyles --style=github-dark`; every token color clears
   4.5:1 contrast on the #0d2f43 code background. Background/base text overridden
   below to the design tokens. */
/* Generated using: hugo gen chromastyles --style=github-dark */

/* Background */ .bg { color:#e6edf3;background-color:#0d1117; }
/* PreWrapper */ .chroma { color:#e6edf3;background-color:#0d1117; }
/* Other */ .chroma .x {  }
/* Error */ .chroma .err { color:#f85149 }
/* CodeLine */ .chroma .cl {  }
/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
/* LineHighlight */ .chroma .hl { background-color:#6e7681 }
/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#737679 }
/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#6e7681 }
/* Line */ .chroma .line { display:flex; }
/* Keyword */ .chroma .k { color:#ff7b72 }
/* KeywordConstant */ .chroma .kc { color:#79c0ff }
/* KeywordDeclaration */ .chroma .kd { color:#ff7b72 }
/* KeywordNamespace */ .chroma .kn { color:#ff7b72 }
/* KeywordPseudo */ .chroma .kp { color:#79c0ff }
/* KeywordReserved */ .chroma .kr { color:#ff7b72 }
/* KeywordType */ .chroma .kt { color:#ff7b72 }
/* Name */ .chroma .n {  }
/* NameAttribute */ .chroma .na {  }
/* NameClass */ .chroma .nc { color:#f0883e;font-weight:bold }
/* NameConstant */ .chroma .no { color:#79c0ff;font-weight:bold }
/* NameDecorator */ .chroma .nd { color:#d2a8ff;font-weight:bold }
/* NameEntity */ .chroma .ni { color:#ffa657 }
/* NameException */ .chroma .ne { color:#f0883e;font-weight:bold }
/* NameLabel */ .chroma .nl { color:#79c0ff;font-weight:bold }
/* NameNamespace */ .chroma .nn { color:#ff7b72 }
/* NameOther */ .chroma .nx {  }
/* NameProperty */ .chroma .py { color:#79c0ff }
/* NameTag */ .chroma .nt { color:#7ee787 }
/* NameBuiltin */ .chroma .nb {  }
/* NameBuiltinPseudo */ .chroma .bp {  }
/* NameVariable */ .chroma .nv { color:#79c0ff }
/* NameVariableClass */ .chroma .vc { color:#79c0ff }
/* NameVariableGlobal */ .chroma .vg { color:#79c0ff }
/* NameVariableInstance */ .chroma .vi { color:#79c0ff }
/* NameVariableMagic */ .chroma .vm { color:#79c0ff }
/* NameFunction */ .chroma .nf { color:#d2a8ff;font-weight:bold }
/* NameFunctionMagic */ .chroma .fm { color:#d2a8ff;font-weight:bold }
/* Literal */ .chroma .l { color:#a5d6ff }
/* LiteralDate */ .chroma .ld { color:#79c0ff }
/* LiteralString */ .chroma .s { color:#a5d6ff }
/* LiteralStringAffix */ .chroma .sa { color:#79c0ff }
/* LiteralStringBacktick */ .chroma .sb { color:#a5d6ff }
/* LiteralStringChar */ .chroma .sc { color:#a5d6ff }
/* LiteralStringDelimiter */ .chroma .dl { color:#79c0ff }
/* LiteralStringDoc */ .chroma .sd { color:#a5d6ff }
/* LiteralStringDouble */ .chroma .s2 { color:#a5d6ff }
/* LiteralStringEscape */ .chroma .se { color:#79c0ff }
/* LiteralStringHeredoc */ .chroma .sh { color:#79c0ff }
/* LiteralStringInterpol */ .chroma .si { color:#a5d6ff }
/* LiteralStringOther */ .chroma .sx { color:#a5d6ff }
/* LiteralStringRegex */ .chroma .sr { color:#79c0ff }
/* LiteralStringSingle */ .chroma .s1 { color:#a5d6ff }
/* LiteralStringSymbol */ .chroma .ss { color:#a5d6ff }
/* LiteralNumber */ .chroma .m { color:#a5d6ff }
/* LiteralNumberBin */ .chroma .mb { color:#a5d6ff }
/* LiteralNumberFloat */ .chroma .mf { color:#a5d6ff }
/* LiteralNumberHex */ .chroma .mh { color:#a5d6ff }
/* LiteralNumberInteger */ .chroma .mi { color:#a5d6ff }
/* LiteralNumberIntegerLong */ .chroma .il { color:#a5d6ff }
/* LiteralNumberOct */ .chroma .mo { color:#a5d6ff }
/* Operator */ .chroma .o { color:#ff7b72;font-weight:bold }
/* OperatorWord */ .chroma .ow { color:#ff7b72;font-weight:bold }
/* Punctuation */ .chroma .p {  }
/* Comment */ .chroma .c { color:#8b949e;font-style:italic }
/* CommentHashbang */ .chroma .ch { color:#8b949e;font-style:italic }
/* CommentMultiline */ .chroma .cm { color:#8b949e;font-style:italic }
/* CommentSingle */ .chroma .c1 { color:#8b949e;font-style:italic }
/* CommentSpecial */ .chroma .cs { color:#8b949e;font-weight:bold;font-style:italic }
/* CommentPreproc */ .chroma .cp { color:#8b949e;font-weight:bold;font-style:italic }
/* CommentPreprocFile */ .chroma .cpf { color:#8b949e;font-weight:bold;font-style:italic }
/* Generic */ .chroma .g {  }
/* GenericDeleted */ .chroma .gd { color:#ffa198;background-color:#490202 }
/* GenericEmph */ .chroma .ge { font-style:italic }
/* GenericError */ .chroma .gr { color:#ffa198 }
/* GenericHeading */ .chroma .gh { color:#79c0ff;font-weight:bold }
/* GenericInserted */ .chroma .gi { color:#56d364;background-color:#0f5323 }
/* GenericOutput */ .chroma .go { color:#8b949e }
/* GenericPrompt */ .chroma .gp { color:#8b949e }
/* GenericStrong */ .chroma .gs { font-weight:bold }
/* GenericSubheading */ .chroma .gu { color:#79c0ff }
/* GenericTraceback */ .chroma .gt { color:#ff7b72 }
/* GenericUnderline */ .chroma .gl { text-decoration:underline }
/* TextWhitespace */ .chroma .w { color:#6e7681 }

/* Chroma wrapper: use the design's code colors, not github-dark's */
.bg,
.chroma {
  background-color: #0d2f43;
  color: #d9e4ea;
}
