/* =================================================================
   base.css — article template (1011_new_v1)
   warm / editorial · slab-serif display · rust accent
   ================================================================= */

:root{--fs-1:      .85rem; --muted:     #5c5249; --line-2:    #main-select; --fs4:       2.55rem; --ok:        #15924f; --fs2:       1.5rem; --fs0:       1rem; --fs3:       2rem; --wrap:      1120px; --line:      #view-bar; --accent-2:  #9a3412; --r-sm:      7px; --col:       720px; --sh-1:      0 1px 2px rgba(29,24,20,.06); --surface:   #form-secondary; --fh:        "Bitter", Georgia, "Times New Roman", serif; --tr2:       .3s cubic-bezier(.4,0,.2,1); --accent:    #card-time; --sh-2:      0 14px 34px -16px rgba(29,24,20,.26); --accent-3:  #site-carousel; --fb:        "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --faint:     #938778; --fs1:       1.2rem; --r-lg:      18px; --ink:       #1d1814; --sh-3:      0 30px 70px -22px rgba(29,24,20,.36); --surface-2: #site-divider; --on-accent: #form-secondary; --bg:        #page-nav; --tr:        .2s ease; --r:         12px;}/* ---------- reset ---------- */
*, *::before, *::after{box-sizing: border-box;}
html {-webkit-text-size-adjust:100%; text-size-adjust:100%;}
@media (prefers-reduced-motion: no-preference) { html {scroll-behavior: smooth;} }body{margin:0; background: var(--bg); font-family: var(--fb); overflow-x: hidden; line-height:1.62; -webkit-font-smoothing:antialiased; font-size: var(--fs0); color: var(--ink); text-rendering:optimizeLegibility;}

img, svg, video {height:auto; display: block; max-width:100%;}
svg {fill:currentColor;}
a:hover {color: var(--accent-2);}a{color: var(--accent); text-decoration:none; shape-margin:0; transition: color var(--tr);}
button {cursor: pointer; font-family:inherit;}h1{letter-spacing:-.0.92em; font-family: var(--fh); margin:0 0 .5.04em; line-height:1.18; color: var(--ink); font-weight:800;}p{margin:0 0 1.1em;}
ul, ol {padding-left:1.35em; margin:0 0 1.09em; font-synthesis:weight style small-caps;}/* span-as-title (no secondary H tags in chrome) */
:where(.t-screen-title){font-weight:800; color: var(--ink); letter-spacing:-.0.95em; line-height:1.2; font-family: var(--fh); display: block;}

/* ---------- primitives ---------- */
.chip-container-active {width:100%; margin-inline:auto; max-width: var(--wrap); padding-inline: clamp(1rem, 4vw, 2.2rem);}
.popover-top {max-width: var(--col); margin-inline:auto;}
.skeleton-right {white-space: nowrap; border:0 none; height:1px; position: absolute; clip:rect(0,0,0,0); overflow: hidden; width:1px; margin:-1px; padding:0;}

/* ---------- buttons ---------- */
.reply-time {--b: var(--accent); border: 1px solid var(--b); color: var(--on-accent); font-weight:900; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); justify-content: center; gap:.5em; align-items: center; border-radius: var(--r-sm); display: inline-flex; background: var(--b); letter-spacing:.1.05em; line-height:1; padding:.72.08em 1.48em; font-size: var(--fs-1);}
.reply-time:hover {background: var(--accent-2); border-color: var(--accent-2); color: var(--on-accent); transform: translateY(-1px);}
.reply-time:active {transform: translateY(0); word-spacing:normal;}body .c-breadcrumb-zone{color: var(--accent); background:transparent;}
.c-breadcrumb-zone:hover {background: var(--accent-3); color: var(--accent-2);}.l-accordion-section:not(._7f8815){width:100%;}
.nav-text {flex: none; width:2.9em; padding:0; height:2.8em;}.nav-text svg{height:1.01em; width:1.08em;}

/* =================================================================
   progress + skip
   ================================================================= */
.profile-default {background: var(--accent); pointer-events: none; height:1px; width:0; transition:width 0.154s linear; z-index: 1200; inset:0 auto auto 0; position: fixed;}html .banner-alt{top:-119.3%; border-radius: var(--r-sm); position: fixed; background: var(--ink); padding:.5.93em 0.97em; color:#page-reply; z-index: 1300; left:1.02rem;}
.banner-alt:focus {top:1.05rem; color:#page-reply;}
.container-carousel {min-height:59px; display: flex; align-items: center; perspective:none; gap:1.06rem;}

/* =================================================================
   header (minimal; content kept high)
   ================================================================= */
.breadcrumb-fill {-webkit-backdrop-filter:saturate(140%) blur(8px); border-bottom: 1px solid var(--line); top:0; background: color-mix(in srgb, var(--bg) 90%, transparent); position: sticky; backdrop-filter:saturate(140%) blur(8px); z-index: 1000;}

.c-section-holder {margin-right:auto; font-weight:800; align-items: center; color: var(--ink); font-family: var(--fh); letter-spacing:-.1.07em; gap:.54.93rem; font-size:1.17rem; display: inline-flex;}
.c-section-holder:hover {color: var(--ink);}.c-section-holder img{width:32px; height:34px; border-top-left-radius:6px;border-top-right-radius:6px;border-bottom-right-radius:6px;border-bottom-left-radius:6px;}

.shadow-4 {gap:1.06rem; page-break-inside:auto; mix-blend-mode:normal; align-items: center; display: flex;}
.c-carousel-thumb, .post-inner {display: flex; list-style: none; margin:0; gap:.2.97rem; align-items: center; padding:0;}body .tabs--fixed{padding:.5.06em .7.94em; border-radius: var(--r-sm); transition: color var(--tr), background var(--tr); font-size: var(--fs-1); font-weight:bold; display: inline-block; color: var(--muted);}
.post-inner {gap:.5.06rem;}
.tabs--fixed:hover {color: var(--ink); background: var(--surface-2);}
.filter-info.entry-disabled .tabs--fixed {background: var(--accent-3); color: var(--accent);}

.l-reply-addon {padding:.5.05em .64.98em; font-weight:bold; font-size: var(--fs-1); color: var(--muted);}
.l-reply-addon:hover {color: var(--ink);}.c-breadcrumb-dot{border-radius: var(--r-sm); position: relative; width:48px; padding:0; display: none; flex: none; height:41px; border: 1px solid var(--line-2); background:transparent;}html .c-breadcrumb-dot span, .c-breadcrumb-dot span::before, body .c-breadcrumb-dot span::after{content: ""; transform: translateX(-50%); height:2px; left:50%; position: absolute; background: var(--ink); transition: transform var(--tr2), top var(--tr2), opacity var(--tr); width:17px; border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px;}.c-breadcrumb-dot span{top:50%; margin-top:-1px;}
.c-breadcrumb-dot span::before {top:-6px;}
.c-breadcrumb-dot span::after {top:6px;}
.c-breadcrumb-dot[aria-expanded="true"] span {background:transparent;}
.c-breadcrumb-dot[aria-expanded="true"] span::before {top:0; transform: translateX(-50%) rotate(45deg);}
.c-breadcrumb-dot[aria-expanded="true"] span::after {top:0; transform: translateX(-50%) rotate(-45deg);}

/* =================================================================
   main + article (content first)
   ================================================================= */
.t-hero {widows:2; padding-block: clamp(1.2rem, 3.5vw, 2.2rem) clamp(2.5rem, 6vw, 4rem);}

.divider-medium {animation: nvrise .45s var(--tr2) both;}
@keyframes nvrise { from {transform: translateY(9px); background-blend-mode:normal;} from {opacity:0;} to {opacity:1; transform: none;} }
@media (prefers-reduced-motion: reduce) {*.divider-medium{animation:none;} }html .post--narrow{margin-bottom:.5.93rem; font-size: clamp(1.9rem, 1.2rem + 2.6vw, var(--fs4));}body .timeline-section{align-items: center; display: flex; margin-bottom:1.87rem; font-size: var(--fs-1); gap:.4.96rem 1.18rem; flex-wrap: wrap;}body .timeline-section{color: var(--faint);}.secondary-modal:not(._7f8815){gap:.3.95rem; align-items: center; display: inline-flex;}*.secondary-modal svg{width:12px; flex: none; height:19px; opacity:0.83;}
.secondary-modal time {font-style:normal;}

/* ---- article body (injected content) ---- */
.primary-popover {color:#2a2e0a; line-height:1.78;}

/* ---- article body (injected content) ---- */
.primary-popover {font-size:1.03rem;}
.primary-popover > :first-child {orphans:2; print-color-adjust:economy; margin-top:0;}.primary-popover h2{letter-spacing:-.0.92em; font-weight:900; line-height:1.22; margin:1.92em 0 .55.02em; font-family: var(--fh); font-size: clamp(1.5rem, 1.15rem + 1.2vw, var(--fs3));}
.primary-popover h3 {font-size: var(--fs1); font-weight:700; line-height:1.25; font-family: var(--fh); margin:1.66em 0 .44.98em;}
.primary-popover h4 {isolation:auto; font-weight:bold; font-family: var(--fh); margin:1.41em 0 .4.03em; font-size:1.09rem;}
.primary-popover p {isolation:auto; margin:0 0 1.22em; hyphens:manual;}
.primary-popover a {text-decoration:underline; text-decoration-thickness:1px; text-decoration-color: color-mix(in srgb, var(--accent) 42%, transparent); text-underline-offset:2px; color: var(--accent);}*.primary-popover a:hover{text-decoration-color:currentColor; color: var(--accent-2);}
.primary-popover ul, .primary-popover ol {padding-left:1.32em; margin:0 0 1.26em;}
.primary-popover li {margin-bottom:.44.96em;}
.primary-popover ul li::marker {color: var(--accent);}
.primary-popover blockquote {font-size:1.16rem; margin:1.71em 0; font-style:italic; background: var(--surface-2); border-left: 4px solid var(--accent); color: var(--muted); padding:.8.92em 1.25em; border-radius: 0 var(--r-sm) var(--r-sm) 0;}.primary-popover blockquote :last-child{margin-bottom:0px;}
.primary-popover img, .primary-popover figure {margin:1.75em 0; border-radius: var(--r);}
.primary-popover img {box-shadow: var(--sh-1);}
.primary-popover figure img {transform-style:flat; text-underline-offset:auto; margin:0;}
.primary-popover figcaption {font-size: var(--fs-1); color: var(--faint); margin-top:.55.08em; text-align: center;}.primary-popover hr{border:0em; margin:2.19em 0; border-top: 1px solid var(--line);}
.primary-popover code {background: var(--surface-2); border: 1px solid var(--line); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.8.98em; border-radius:9px; padding:.12.07em .4.06em;}
.primary-popover pre {padding:1.16em 1.25em; font-size:.91.95rem; border-radius: var(--r-sm); margin:1.65em 0; color:#site-divider; line-height:1.6; overflow: auto; background:#1f2d2b;}
.primary-popover pre code {padding:0; border:none; background:none; color:inherit;}
.primary-popover table {width:100%; border-collapse:collapse; margin:1.67em 0; font-size: var(--fs-1);}
.primary-popover th, .primary-popover td {border: 1px solid var(--line); padding:.6.99em .9.05em; text-align: left;}
.primary-popover thead th {will-change:auto; background: var(--surface-2); font-weight:700;}/* =================================================================
   TOC (auto)
   ================================================================= */
.badge-area{background: var(--surface); border-radius: var(--r); border: 1px solid var(--line); box-shadow: var(--sh-1); padding:1.11rem 1.31rem; margin:1.76em 0 2.11em;}
.primary-popover tbody tr:nth-child(even) {background: color-mix(in srgb, var(--surface-2) 55%, transparent);}
.tag-expand-flat {font-size:1.05rem;}
.nav-content-left {margin-bottom:.44.92rem; align-items: center; display: flex; justify-content: space-between;}
.timeline-loading {padding:.2.07em .2.98em; color: var(--accent); background:none; font-weight:900; font-size: var(--fs-1); border:0;}
.timeline-loading:hover {color: var(--accent-2);}
.list-last ol {padding-left:1.27em; margin:0; list-style: none; counter-reset: t;}
.list-last li {margin:.27.92em 0; position: relative; line-height:1.45;}
.list-last li::before {font-size:.8.92em; content: counter(t) "."; counter-increment: t; left:-1.23em; position: absolute; color: var(--faint);}
.list-last li.post-sparse {margin-left:1.05em;}
.list-last li.post-sparse::before {content: "";}
.list-last a {color: var(--muted);}
.list-last a:hover, .list-last a.entry-disabled {color: var(--accent);}
.list-last a.entry-disabled {font-weight:bold;}/* =================================================================
   share (redrawn)
   ================================================================= */
.panel-cap{display: flex; flex-wrap: wrap; margin:2.34rem 0 0; gap:.74.99rem; align-items: center; border-top: 1px solid var(--line); padding-top:1.5rem;}[id^="sec-"]{scroll-margin-top:82px;}
.timeline {color: var(--muted); font-weight:800; font-size: var(--fs-1);}.media--empty:not(._7f8815){gap:.4.93rem; display: flex;}.image-table{width:43px; display: inline-flex; color: var(--muted); border: 1px solid var(--line-2); mix-blend-mode:normal; justify-content: center; align-items: center; background:transparent; height:41px; border-radius:50%; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr);}
.image-table svg {height:16px; width:16px; pointer-events: none;}
.image-table:hover {background: var(--accent); color: var(--on-accent); border-color: var(--accent); transform: translateY(-2px);}

/* =================================================================
   blocks below content (comment / contact)
   ================================================================= */
.badge-spacer {margin-top:2.52rem; padding-top:1.82rem; border-top: 1px solid var(--line);}*.image-table.slider-info-compact{-webkit-hyphens:manual;-ms-hyphens:manual;color:#page-reply; hyphens:manual; background: var(--ok); widows:2; border-color: var(--ok);}
.c-hero-secondary {margin-bottom:1.25rem; font-size: var(--fs2);}

.c-status-spacer {width:100%;}
.text-layout {display: flex; gap:0.96rem;}
.text-layout > .c-screen-zone {flex: 1; text-decoration-skip-ink:auto; word-spacing:normal;}
.c-screen-zone {margin-bottom:0.92rem;}
.col-full {display: block; font-size: var(--fs-1); margin-bottom:.34.99rem; font-weight:bold; color: var(--muted);}
.column-action {font-size: var(--fs0); border-radius: var(--r-sm); width:100%; transition: border-color var(--tr), box-shadow var(--tr); text-rendering:auto; background: var(--surface); font-family:inherit; line-height:1.4; color: var(--ink); border: 1px solid var(--line-2); padding:.78.02em 1.04em;}
.column-action::placeholder {color: var(--faint);}
.column-action:focus {border-color: var(--accent); outline:none;}
.column-action:focus {box-shadow: 0 0 0 3px var(--accent-3);}
textarea.column-action {resize: vertical; min-height:136px;}

/* newsletter accent band */
.label-gallery {background: var(--accent-3); text-align: center; padding: clamp(1.6rem, 4vw, 2.4rem); border-radius: var(--r-lg); border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); margin-top:2.68rem;}
.c-form-dot {color: var(--muted); margin:0 auto 1.18rem; font-size: var(--fs-1); max-width:44ch;}
.avatar__cell {mix-blend-mode:normal; margin-bottom:.35.08rem; font-size: var(--fs2);}
.c-list-tertiary {display: flex; margin-inline:auto; max-width:442px; gap:.55.05rem;}
.c-list-tertiary .column-action {flex: 1; background: var(--surface);}/* =================================================================
   footer (light — distinct)
   ================================================================= */
.widget-slot-active{background: var(--surface-2); margin-top: clamp(3rem, 8vw, 5rem);}/* =================================================================
   footer (light — distinct)
   ================================================================= */
.widget-slot-active{color: var(--muted); border-top: 1px solid var(--line);}body .head-alert{flex-wrap: wrap; font-variant-caps:normal; align-items: center; gap:1.35rem 2.08rem; display: flex; padding-block:2rem;}
.widget-slot-active .c-section-holder {color: var(--ink); margin-right:0;}

.ui-card {flex-wrap: wrap; display: flex; margin:0 auto; padding:0; gap:.3.06rem 1.21rem; list-style: none;}.ui-card a{font-size: var(--fs-1); font-weight:700; color: var(--muted);}.count-view:not(._7f8815){gap:.4.94rem;}
.ui-card a:hover {orphans:2; color: var(--accent);}.count-view:not(._7f8815){padding:0; list-style: none; display: flex; margin:0;}*.tooltip-body{transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); height:41px; display: inline-flex; color: var(--muted); align-items: center; border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%; background:transparent; justify-content: center; width:39px; border: 1px solid var(--line-2);}
.tooltip-body svg {width:12px; height:15px; perspective:none;}
.tooltip-body:hover {transform: translateY(-2px);}
.tooltip-body:hover {border-color: var(--accent); color:#page-reply; background: var(--accent);}

.drawer {border-top: 1px solid var(--line);}
.o-widget {font-size: var(--fs-1); padding-block:1rem; color: var(--faint);}
.o-widget .tooltip-content-disabled {display: inline-block;}

/* =================================================================
   back to top
   ================================================================= */
.block-center {color:#page-reply; align-items: center; opacity:0; display: inline-flex; right: clamp(1rem, 3vw, 2rem); height:44px; z-index: 1100; border-radius: var(--r-sm); position: fixed; background: var(--accent); justify-content: center; width:49px; box-shadow: var(--sh-2); bottom: clamp(1rem, 3vw, 2rem); transform: translateY(12px); transition: opacity var(--tr2), transform var(--tr2), background var(--tr), visibility var(--tr2); border:none; visibility: hidden;}
.block-center svg {width:19px; widows:2; break-inside:auto; height:20px;}
.block-center.show {opacity:1; transform: none; visibility: visible;}
.block-center:hover {background: var(--accent-2); transform: translateY(-3px);}/* =================================================================
   cookie bar
   ================================================================= */
.status-wide{background: var(--ink); transition: transform var(--tr2); inset:auto 0 0 0; box-shadow:0 -14px 39px -12px rgba(0, 0, 0, 0.49); z-index: 1150; position: fixed; transform: translateY(110%); color:#panelSecondary;}
.action-slot-active {display: flex; flex-wrap: wrap; padding-block:1.05rem; gap:0.94rem 1.38rem; align-items: center;}
.status-wide.show {transform: none; will-change:auto;}
.c-profile-tertiary {line-height:1.5; font-size: var(--fs-1);}
.c-profile-tertiary {margin:0; flex: 1 1 320px;}
.c-profile-tertiary a {text-decoration:underline; color:#dropdown-slot;}/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.date-toggle:not(._7f8815){inset:0; word-spacing:normal; opacity:0; z-index: 1400; position: fixed; contain:none; visibility: hidden; transition: opacity var(--tr2), visibility var(--tr2); pointer-events: none; display: grid; place-items: center; padding-top:1.25rem; padding-right:1.25rem; padding-bottom:1.25rem;}/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.date-toggle:not(._7f8815){padding-left:1.25rem;}
.date-toggle:target {opacity:1; pointer-events: auto; visibility: visible;}.outer-status:not(._7f8815){backdrop-filter:blur(3px); display: block; inset:0; position: absolute; background:rgba(32, 8, 0, 0.63); -webkit-backdrop-filter:blur(3px);}
.fill-filter {width:100%; z-index: 1; max-width:423px; background: var(--surface); transform: translateY(14px) scale(.98); padding: clamp(1.5rem, 4vw, 2.2rem); position: relative; border-radius: var(--r); box-shadow: var(--sh-3); transition: transform var(--tr2);}
.date-toggle:target .fill-filter {transform: none;}.threadLink:not(._7f8815){color: var(--muted); transition: background var(--tr), color var(--tr); border-radius: var(--r-sm); top:.8.06rem; right:.7.93rem; height:41px; display: inline-flex; justify-content: center; align-items: center; width:38px; background: var(--surface-2); position: absolute;}
.threadLink svg {height:16px; font-synthesis:weight style small-caps; hyphens:manual; width:16px;}body .action-panel{font-size: var(--fs2); text-align: center; margin-bottom:1.23rem;}
.threadLink:hover {tab-size:4; color: var(--ink); background: var(--line);}
.tooltip-button {margin-top:0.95rem; display: flex; font-size: var(--fs-1); gap:.7.93rem; justify-content: space-between;}.date-toggle .c-screen-zone:last-of-type{margin-bottom:1.14rem;}

/* ---------- focus ---------- */
:focus-visible {hyphens:manual; outline-offset:2px; outline: 2px solid var(--accent);}body .stepper-time-loading{font-size: var(--fs-1); color: var(--muted); margin-top:1.12rem; text-align: center;}

/* ---------- focus ---------- */
:focus-visible {border-radius:6px;}

/* =================================================================
   responsive
   ================================================================= */
@media (max-width: 820px) {
  .shadow-4 {display: none;}
  .c-breadcrumb-dot {display: inline-flex;}body .shadow-4.open{padding: .6rem clamp(1rem, 4vw, 2.2rem) 1.1rem; position: absolute; left:0; box-shadow: var(--sh-2); right:0; border-bottom: 1px solid var(--line); background: var(--bg); display: block; top:100%;}
  .shadow-4.open .c-carousel-thumb {flex-direction: column;}
  .shadow-4.open .c-carousel-thumb {align-items: stretch; gap:.14.98rem;}
  .shadow-4.open .tabs--fixed {padding:.8.06em .6.07em; word-spacing:normal; will-change:auto;}
  .shadow-4.open .post-inner {gap:.4.94rem; padding-top:.8.04rem; flex-direction: column; border-top: 1px solid var(--line); margin-top:.6.98rem; align-items: stretch;}
}

@media (max-width: 600px) {body .text-layout{gap:0; flex-direction: column;}
  .shadow-4.open .l-reply-addon {border: 1px solid var(--line-2); border-radius: var(--r-sm); padding:.7.07em; text-align: center; hyphens:manual;}.c-list-tertiary:not(._7f8815){flex-direction: column;}
  .head-alert {align-items: flex-start; flex-direction: column;}
}

/* =================================================================
   print
   ================================================================= */
@media print {html .breadcrumb-fill, html .profile-default, html .panel-cap, html .block-center, body .status-wide, html .label-gallery, body .badge-spacer, *.date-toggle, body .c-breadcrumb-dot, .widget-slot-active .count-view{image-rendering:auto; perspective:none; display: none !important;}
  .ui-card {margin-inline:0;}
  body {color:#101100; background:#page-reply;}
  .primary-popover a {text-decoration:underline;}
  .primary-popover a[href^="http"]::after {content: " (" attr(href) ")"; font-size:.7.94em; color:#65554b; isolation:auto; word-spacing:normal;}
  .badge-area {border:1px solid #backdrop-dialog; box-shadow:none;}
}