/* ipassas notes: archive list with partly blacked-out titles, and the article. */

h1.hd{font-size:clamp(52px,9vw,160px);line-height:.84;letter-spacing:-.045em}

/* ---------- list (archive, More notes, search results) ---------- */
.nl{list-style:none;border-top:1px solid var(--ink)}
.nl li[hidden]{display:none}
.nl a{display:grid;grid-template-columns:120px minmax(0,1fr);gap:6px 16px;padding:16px 0 18px;border-bottom:1px solid var(--ink);align-items:baseline}
.nl .nb{display:flex;flex-direction:column;gap:8px;min-width:0}
.nl .nt{font-size:clamp(22px,2.8vw,44px);line-height:1.06;letter-spacing:-.02em;font-weight:400}
.nl .x{background:var(--ink);color:transparent;transition:background-color .05s,color .05s}
.nl a:hover .x,.nl a:focus-visible .x,.nl a.open .x{background:transparent;color:inherit}
.nl a:hover .nt,.nl a:focus-visible .nt,.nl a.open .nt{color:var(--blue)}
.nl .ex{max-width:66ch}
.ntools{display:flex;justify-content:space-between;align-items:end;gap:16px 32px;flex-wrap:wrap}
.search{display:flex;align-items:center;gap:10px;border-bottom:2px solid var(--ink);min-width:min(100%,360px)}
.search input{font:inherit;font-size:20px;color:inherit;background:none;border:0;padding:8px 0;width:100%;outline:none}
.search input::placeholder{color:var(--ink);opacity:.45}
.search:focus-within{border-color:var(--blue)}
.more{align-self:flex-start;font-size:17px;line-height:1;padding:9px 12px 8px;background:var(--ink);color:var(--paper)}
.more:hover,.more:focus-visible{background:var(--blue);color:#FFFAFA}
.more[aria-busy="true"]{opacity:.5;pointer-events:none}
.empty{font-size:clamp(22px,2.4vw,34px)}

/* ---------- article ---------- */
.prog{position:fixed;left:0;right:0;top:60px;height:3px;z-index:49;background:var(--blue);transform-origin:0 50%;transform:scaleX(0)}
.crumb a,.ameta a.by{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.crumb a:hover,.ameta a.by:hover{background:var(--ink);color:var(--paper);text-decoration:none}
.art-h{display:flex;flex-direction:column;gap:22px}
.art-h h1{font-size:clamp(40px,6.4vw,112px);line-height:1;letter-spacing:-.04em;max-width:20ch;font-weight:400}
.ameta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
.share{font:inherit;font-size:15px;line-height:1;padding:7px 10px 6px;background:var(--ink);color:var(--paper);border:0;cursor:pointer}
.share:hover,.share:focus-visible{background:var(--blue);color:#FFFAFA}
/* the featured image: a black band under the title, the whole picture, never cropped */
.art-hero{margin:40px 0 0;background:var(--ink)}
.art-hero img{display:block;width:100%;height:clamp(280px,62vh,680px);object-fit:contain}
.art-hero figcaption{background:var(--paper);padding-top:8px}
/* text at a reading measure, contents beside it */
.art-grid{display:grid;grid-template-columns:minmax(0,66ch) minmax(200px,300px);justify-content:space-between;gap:32px 64px;align-items:start;margin-top:56px}
.toc{position:sticky;top:84px;border-top:2px solid var(--ink);padding-top:10px;max-height:calc(100vh - 110px);overflow-y:auto}
.toc[hidden]{display:none}
.art-grid:has(> .toc[hidden]){grid-template-columns:minmax(0,66ch)}
.toc ol{list-style:none;margin:10px 0 0;padding:0}
.toc a{display:block;padding:8px 0;border-bottom:1px solid var(--ink);font-size:15px;line-height:1.3}
.toc a:hover,.toc a:focus-visible{color:var(--blue)}
.toc a.on{background:var(--ink);color:var(--paper);padding-left:8px}
.prose h2,.prose.shift h3{scroll-margin-top:84px}

/* prose: core blocks */
.prose{font-size:clamp(18px,1.25vw,21px);line-height:1.6;min-width:0}
.prose > * + *{margin-top:1.05em}
.prose h2{font-size:clamp(28px,2.6vw,42px);line-height:1.08;letter-spacing:-.025em;margin-top:1.7em;font-weight:400}
.prose h3{font-size:clamp(22px,1.8vw,28px);line-height:1.15;letter-spacing:-.015em;margin-top:1.4em;font-weight:400}
.prose h4{font-size:1em;line-height:1.3;margin-top:1.2em;font-weight:400;text-transform:uppercase;letter-spacing:.06em}
/* older notes use h3 for sections and h4 for sub-sections: show them one step up, keep the markup */
.prose.shift h3{font-size:clamp(28px,2.6vw,42px);line-height:1.08;letter-spacing:-.025em;margin-top:1.7em}
.prose.shift h4{font-size:clamp(22px,1.8vw,28px);line-height:1.15;letter-spacing:-.015em;margin-top:1.4em;text-transform:none}
.prose strong,.prose b{font-weight:400;background:var(--ink);color:var(--paper);padding:0 .12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.prose em{font-style:italic}
.prose ul,.prose ol{padding-left:1.3em}
.prose li + li{margin-top:.45em}
.prose li::marker{color:var(--blue)}
.prose ul{list-style:square}
.prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose a:hover{background:var(--blue);color:#FFFAFA;text-decoration:none}
.prose blockquote,.prose .wp-block-quote{font-size:1.35em;line-height:1.3;padding-left:.8em;box-shadow:inset 6px 0 0 var(--blue);margin-left:0}
.prose blockquote cite{display:block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;font-style:normal;margin-top:.6em}
.prose .wp-block-pullquote{border:0;padding:0;text-align:left}
.prose code,.prose kbd{background:var(--ink);color:var(--paper);padding:0 .25em;font-size:.9em}
.prose pre{background:var(--ink);color:var(--paper);padding:16px;overflow-x:auto;font-size:15px;line-height:1.5}
.prose pre code{padding:0;background:none}
/* tables: a ruled grid, black header band, plain text inside (no redaction bars) */
.prose .wp-block-table{overflow-x:auto;margin-top:1.6em}
.prose table{border-collapse:collapse;width:100%;font-size:clamp(15px,1vw,17px);line-height:1.45;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);font-variant-numeric:tabular-nums}
.prose > table{margin-top:1.6em}
.prose .wp-block-table table{margin:0}
.prose th,.prose td{text-align:left;vertical-align:top;padding:12px 14px;border:0;border-bottom:1px solid var(--ink)}
.prose th + th,.prose td + td{border-left:1px solid var(--ink)}
.prose thead th,.prose thead td,.prose table tr:first-child > th{background:var(--ink);color:var(--paper);font-size:12px;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;font-weight:400;vertical-align:bottom;border-bottom:0}
.prose thead th + th,.prose thead td + td,.prose table tr:first-child > th + th{border-left-color:var(--paper)}
.prose tbody th{font-weight:400}
.prose td:first-child{font-size:13px;line-height:1.35;letter-spacing:.06em;text-transform:uppercase}
.prose table strong,.prose table b{background:none;color:inherit;padding:0;font-weight:400}
.prose table p{margin:0}
.prose table p + p{margin-top:.5em}
.prose tbody tr:last-child td{border-bottom:0}
.prose tbody tr:hover td{background:var(--ink);color:var(--paper)}
.prose tbody tr:hover td + td{border-left-color:var(--paper)}
.prose .wp-block-table figcaption{margin-top:8px}
.prose img,.prose video{display:block;max-width:100%;height:auto}
.prose figure{margin:1.6em 0 0}
.prose figcaption{font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin-top:8px}
.prose hr{border:0;height:6px;background:var(--ink);width:30%}
.prose .alignwide,.prose .alignfull{max-width:100%}
.prose iframe{max-width:100%}
.prose .wp-block-button__link,.prose .wp-element-button{display:inline-block;background:var(--ink);color:var(--paper);padding:10px 14px 9px;text-decoration:none;border-radius:0}
.prose .wp-block-button__link:hover{background:var(--blue);color:#FFFAFA}
.pages{margin-top:2em;display:flex;gap:18px}

.byline{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:center;border-top:1px solid var(--ink);padding-top:18px;margin-top:48px;max-width:66ch}
.byline img{width:72px;height:72px;object-fit:cover;display:block;background:var(--ink)}
.byline a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.byline a:hover{background:var(--blue);color:#FFFAFA;text-decoration:none}
.pn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin-top:40px}
.pn a,.pn span.none{display:flex;flex-direction:column;gap:8px;padding:16px 0 18px}
.pn a b{font-weight:400;font-size:clamp(20px,2vw,30px);line-height:1.1;letter-spacing:-.015em}
.pn a:hover b,.pn a:focus-visible b{color:var(--blue)}
.pn .next{text-align:right;align-items:flex-end}

/* comments */
.cmts{display:flex;flex-direction:column;gap:18px;margin-top:40px;max-width:66ch}
.cmt-list,.cmt-list .children{list-style:none}
.cmt-list .children{padding-left:24px}
.cmt-list li{border-top:1px solid var(--ink);padding:14px 0}
.cmt-list .comment-meta{font-size:12px;letter-spacing:.09em;text-transform:uppercase;display:flex;gap:12px;flex-wrap:wrap}
.cmt-list .comment-meta a{text-decoration:none}
.cmt-list .comment-content{margin-top:8px}
.cmt-list .reply a{font-size:12px;letter-spacing:.09em;text-transform:uppercase;text-decoration:underline}
.comment-respond{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--ink);padding-top:14px}
.comment-form{display:flex;flex-direction:column;gap:14px}
.comment-form label{display:block;font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:4px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{font:inherit;font-size:18px;color:inherit;background:none;border:0;border-bottom:2px solid var(--ink);width:100%;padding:8px 0;border-radius:0}
.comment-form textarea{min-height:140px;resize:vertical}
.comment-form input:focus,.comment-form textarea:focus{outline:none;border-color:var(--blue)}
.comment-form .form-submit{margin:0}

@media (max-width:820px){
  .prose > table{display:block;overflow-x:auto}
  .prose th,.prose td{min-width:9em}
  .nl a{grid-template-columns:1fr}
  .prog{top:54px}
  .art-grid{grid-template-columns:1fr;margin-top:36px}
  .toc{display:none}
  .art-hero{margin-top:28px}
  .art-hero img{height:auto;max-height:70vh}
  .pn{grid-template-columns:1fr}
  .pn .next{text-align:left;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .nl .x{transition:none}
}