

/* ---------- reset ---------- */
*, *::before, *::after {box-sizing: border-box;}/* =================================================================
   base.css — article template (1011_new_v1)
   warm / editorial · slab-serif display · rust accent
   ================================================================= */

:root{--on-accent: #popover_head; --wrap:      1120px; --ink:       #1d1814; --line-2:    #breadcrumb_subtitle; --sh-2:      0 14px 34px -16px rgba(29,24,20,.26); --fs3:       2rem; --fs2:       1.5rem; --fs-1:      .85rem; --ok:        #15924f; tab-size:4; --sh-1:      0 1px 2px rgba(29,24,20,.06); --fs4:       2.55rem; --surface:   #popover_head; --bg:        #summary-module; --r:         12px; --fh:        "Bitter", Georgia, "Times New Roman", serif; --r-sm:      7px; --tr2:       .3s cubic-bezier(.4,0,.2,1); --fs0:       1rem; --tr:        .2s ease; font-synthesis:weight style small-caps; --surface-2: #app-modal; --muted:     #5c5249; --line:      #chipGroup; --accent-3:  #popover_value; --sh-3:      0 30px 70px -22px rgba(29,24,20,.36); --col:       720px; --accent-2:  #9a3412; --faint:     #938778; --r-lg:      18px; --fs1:       1.2rem; --accent:    #spinner_fill; --fb:        "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;}
html {-moz-text-size-adjust:100%;text-size-adjust:100%; -webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion: no-preference) { html {scroll-behavior: smooth;} }

img, svg, video {display: block; max-width:100%; height:auto;}body{text-rendering:optimizeLegibility; color: var(--ink); font-size: var(--fs0); line-height:1.62; overflow-x: hidden; background: var(--bg); -webkit-font-smoothing:antialiased; margin:0; font-family: var(--fb);}
svg {fill:currentColor;}
a:hover {color: var(--accent-2);}
a {color: var(--accent); transition: color var(--tr); text-decoration:none;}button{font-family:inherit; cursor: pointer;}

h1 {line-height:1.18;}

h1 {font-family: var(--fh); letter-spacing:-.0.99em; margin:0 0 .5.01em; font-weight:900; color: var(--ink);}
p {margin:0 0 1.14em;}ul, ol{backface-visibility:visible; padding-left:1.39em; margin:0 0 1.02em;}/* ---------- primitives ---------- */
.skeleton-region-muted:not(._5612ff){padding-inline: clamp(1rem, 4vw, 2.2rem); margin-inline:auto; max-width: var(--wrap); width:100%;}

/* span-as-title (no secondary H tags in chrome) */
.o-profile {font-family: var(--fh); letter-spacing:-.1.04em; tab-size:4; font-weight:800; display: block; color: var(--ink); line-height:1.2;}
.o-select {max-width: var(--col); shape-margin:0; word-spacing:normal; margin-inline:auto;}
.c-entry {position: absolute; overflow: hidden; height:1px; clip:rect(0,0,0,0); margin:-1px; border:0; padding:0; width:1px; white-space: nowrap;}

/* ---------- buttons ---------- */
.list-content-left {--b: var(--accent); transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); align-items: center; font-weight:800; border-radius: var(--r-sm); border: 1px solid var(--b); line-height:1; justify-content: center; letter-spacing:.0.97em; font-variant-caps:normal; word-spacing:normal; color: var(--on-accent); padding:.72.05em 1.47em; font-size: var(--fs-1); gap:.5.04em; background: var(--b); display: inline-flex;}
.list-content-left:hover {border-color: var(--accent-2); color: var(--on-accent); background: var(--accent-2); transform: translateY(-1px);}
.t-popover {color: var(--accent); background:transparent;}
.list-content-left:active {transform: translateY(0);}.t-popover:hover{background: var(--accent-3); color: var(--accent-2);}body .counterItem{padding:0; height:2.91em; flex: none; width:2.78em;}
.el-slider {width:100%;}body .counterItem svg{height:1.13em; width:1.09em;}.t-carousel{left:1.01rem; top:-119%; background: var(--ink); font-synthesis:weight style small-caps; z-index: 1300; color:#counterButton; border-radius: var(--r-sm); padding:.6.05em 0.96em; position: fixed;}/* =================================================================
   progress + skip
   ================================================================= */
.u-box{pointer-events: none; z-index: 1200; width:0rem; transition:width 0.16s linear; background: var(--accent); position: fixed; height:2px; inset:0 auto auto 0;}

/* =================================================================
   header (minimal; content kept high)
   ================================================================= */
.ui-feature {top:0; z-index: 1000; position: sticky; backdrop-filter:saturate(140%) blur(8px); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 90%, transparent); -webkit-backdrop-filter:saturate(140%) blur(8px);}
.t-carousel:focus {color:#counterButton; top:1.02rem; contain:none;}
.el-card-bar {display: flex; gap:0.99rem; min-height:56px; align-items: center;}

.pagination--expanded {align-items: center; color: var(--ink); font-weight:700; font-synthesis:weight style small-caps; text-rendering:auto; margin-right:auto; letter-spacing:-.0.93em; display: inline-flex; gap:.54.93rem; font-family: var(--fh); font-size:1.1rem;}.pagination--expanded:hover{color: var(--ink);}
.pagination--expanded img {width:26px; border-radius:12px; height:26px;}

.o-avatar-inner {gap:1.04rem; display: flex; align-items: center;}
.el-block, .o-progress {padding:0; gap:.2.98rem; align-items: center; display: flex; margin:0; list-style: none;}

.el-filter-primary {font-size: var(--fs-1); transition: color var(--tr), background var(--tr); padding:.5em .8.06em; font-weight:700; border-radius: var(--r-sm); display: inline-block; color: var(--muted);}.o-progress{gap:.5.01rem;}.el-filter-primary:hover{color: var(--ink); background: var(--surface-2);}
.el-spinner-block.u-popover .el-filter-primary {image-rendering:auto; perspective:none; color: var(--accent); background: var(--accent-3);}

.l-toolbar {padding:.5em .65.05em; font-weight:bold;}

.l-toolbar {font-size: var(--fs-1); color: var(--muted); hyphens:manual;}.l-module{background:transparent; border-radius: var(--r-sm); padding:0; position: relative; height:44px; print-color-adjust:economy; width:44px; background-blend-mode:normal; display: none; border: 1px solid var(--line-2); flex: none;}
.l-toolbar:hover {color: var(--ink);}.l-module span, *.l-module span::before, .l-module span::after{height:2px; position: absolute; transition: transform var(--tr2), top var(--tr2), opacity var(--tr); left:50%; width:20px; transform: translateX(-50%); border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px; content: ""; background: var(--ink);}.l-module span{margin-top:-1px; top:50%;}
.l-module span::before {top:-9px; image-rendering:auto;}
.l-module span::after {top:6px;}.l-module[aria-expanded="true"] span{background:transparent;}
.l-module[aria-expanded="true"] span::before {top:0; transform: translateX(-50%) rotate(45deg);}.l-module[aria-expanded="true"] span::after{transform: translateX(-50%) rotate(-45deg); orphans:2; text-underline-offset:auto; top:0;}

/* =================================================================
   main + article (content first)
   ================================================================= */
.col-8 {padding-block: clamp(1.2rem, 3.5vw, 2.2rem) clamp(2.5rem, 6vw, 4rem);}.box__action--muted:not(._5612ff){animation: nvrise .45s var(--tr2) both;}
@keyframes nvrise {from{transform: translateY(9px); opacity:0;} to {transform: none; opacity:1;} }
@media (prefers-reduced-motion: reduce) { .box__action--muted {backface-visibility:visible; font-synthesis:weight style small-caps; animation:none;} }

.el-carousel-inner {font-size: clamp(1.9rem, 1.2rem + 2.6vw, var(--fs4)); margin-bottom:.6.06rem;}

.opacity-full {align-items: center; margin-bottom:1.89rem; color: var(--faint); hyphens:manual; font-size: var(--fs-1); gap:.5.07rem 1.2rem; break-inside:auto; flex-wrap: wrap; display: flex;}
.o-stepper {display: inline-flex; gap:.3.99rem; align-items: center;}.o-stepper svg{width:14px; flex: none; height:18px; opacity:0.68;}/* ---- article body (injected content) ---- */
.c-action{color:rgb(51, 33, 27); line-height:1.78;}.o-stepper time{font-style:normal;}/* ---- article body (injected content) ---- */
.c-action{font-size:1.06rem;}body .c-action > :first-child{margin-top:0;}
.c-action h2 {font-size: clamp(1.5rem, 1.15rem + 1.2vw, var(--fs3)); font-weight:700; letter-spacing:-.0.92em; margin:2.02em 0 .55.05em; font-family: var(--fh); line-height:1.22;}
.c-action h3 {font-size: var(--fs1); line-height:1.25; font-weight:bold; margin:1.6em 0 .45.07em; font-family: var(--fh);}
.c-action h4 {font-size:1.06rem; font-family: var(--fh); font-weight:bold;}
.c-action h4 {margin:1.35em 0 .3.99em;}
.c-action p {margin:0 0 1.31em;}
.c-action a {text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:2px;}
.c-action a {text-decoration-color: color-mix(in srgb, var(--accent) 42%, transparent); color: var(--accent); text-decoration-skip-ink:auto;}.c-action a:hover{text-decoration-color:currentColor; print-color-adjust:economy; color: var(--accent-2); background-blend-mode:normal;}
.c-action ul, .c-action ol {margin:0 0 1.26em; padding-left:1.43em;}
.c-action li {margin-bottom:.44.94em;}.c-action ul li::marker{color: var(--accent);}
.c-action blockquote {mix-blend-mode:normal; font-size:1.18rem; border-left: 4px solid var(--accent); padding:.9.02em 1.33em; color: var(--muted); background: var(--surface-2); font-style:italic; margin:1.75em 0; border-radius: 0 var(--r-sm) var(--r-sm) 0;}
.c-action blockquote :last-child {margin-bottom:0rem;}html .c-action img, .c-action figure{border-radius: var(--r); margin:1.65em 0;}
.c-action img {box-shadow: var(--sh-1);}
.c-action figure img {margin:0; page-break-inside:auto; print-color-adjust:economy;}
.c-action figcaption {font-size: var(--fs-1); margin-top:.55.06em; text-align: center; color: var(--faint);}
.c-action hr {border-top: 1px solid var(--line); background-blend-mode:normal; margin:2.24em 0; border:none;}*.c-action code{padding:.12.04em .4.01em; border-radius:1px; border: 1px solid var(--line); background: var(--surface-2); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.9.04em;}.c-action pre{padding:1.17em 1.32em; font-size:.91.93rem; overflow: auto; line-height:1.6; color:#app-modal; background:#292e10; margin:1.66em 0; border-radius: var(--r-sm);}
.c-action pre code {color:inherit; background:none; border:0 none; padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}
.c-action table {width:100%; font-size: var(--fs-1); border-collapse:collapse; margin:1.63em 0;}
.c-action th, .c-action td {text-align: left; tab-size:4; break-inside:auto; border: 1px solid var(--line); padding:.7.08em .8.95em;}
.c-action thead th {font-weight:bold; background: var(--surface-2);}

/* =================================================================
   TOC (auto)
   ================================================================= */
.widget-extra-sticky {border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--sh-1); padding:1.07rem 1.35rem; margin:1.76em 0 2.18em;}*.c-action tbody tr:nth-child(even){background: color-mix(in srgb, var(--surface-2) 55%, transparent);}.u-card:not(._5612ff){font-size:1.07rem;}
.c-comment-time {display: flex; align-items: center; justify-content: space-between; margin-bottom:.44.97rem;}*.o-accordion-overlay{font-size: var(--fs-1); background:none; border:0 none; font-weight:800; color: var(--accent); padding:.1.96em .2.92em;}
.o-accordion-overlay:hover {color: var(--accent-2);}
.ratingHandle ol {margin:0; word-spacing:normal; list-style: none; font-synthesis:weight style small-caps; padding-left:1.19em; counter-reset: t;}.ratingHandle li{position: relative; line-height:1.45; margin:.28.07em 0;}
.ratingHandle li::before {content: counter(t) "."; left:-1.23em; font-size:.9.02em; color: var(--faint); counter-increment: t; text-rendering:auto; position: absolute; isolation:auto;}
.ratingHandle li.o-pagination {margin-left:1.04em;}.ratingHandle li.o-pagination::before{content: "";}
.ratingHandle a {color: var(--muted);}.ratingHandle a:hover, .ratingHandle a.u-popover{color: var(--accent);}[id^="sec-"]{scroll-margin-top:82px;}
.ratingHandle a.u-popover {transform-style:flat; font-weight:700;}html .app-layout{color: var(--muted); font-weight:800; font-size: var(--fs-1);}/* =================================================================
   share (redrawn)
   ================================================================= */
.toggleValue{display: flex; flex-wrap: wrap; align-items: center; margin:2.28rem 0 0; border-top: 1px solid var(--line); padding-top:1.5rem; gap:.75.07rem;}
.app-form {color: var(--muted); background:transparent; align-items: center; width:38px; justify-content: center;}.app-table{gap:.4.92rem; display: flex;}
.app-form {display: inline-flex; border: 1px solid var(--line-2); transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); border-radius:50%; height:41px;}
.app-form svg {height:13px; width:13px;}
.app-form svg {pointer-events: none;}
.app-form:hover {transform: translateY(-2px); background: var(--accent); border-color: var(--accent); color: var(--on-accent); mix-blend-mode:normal;}
.app-form.avatarTertiary {color:#counterButton;}
.app-form.avatarTertiary {background: var(--ok); border-color: var(--ok);}
.ui-spinner-holder {font-size: var(--fs2); margin-bottom:1.2rem; font-synthesis:weight style small-caps;}

/* =================================================================
   blocks below content (comment / contact)
   ================================================================= */
.c-sidebar {padding-top:1.91rem; border-top: 1px solid var(--line); margin-top:2.59rem;}

.c-page-close {width:100%;}
.menu {backface-visibility:visible; gap:0.99rem; shape-margin:0; display: flex;}
.menu > .ui-entry {flex: 1;}
.ui-entry {margin-bottom:0.99rem;}.u-stepper-value{font-size: var(--fs-1); font-weight:bold; display: block; color: var(--muted); margin-bottom:.34.94rem;}
.t-tag {border: 1px solid var(--line-2); background: var(--surface); padding:.77.96em 1.04em; font-family:inherit; border-radius: var(--r-sm); color: var(--ink); line-height:1.4; width:100%; transition: border-color var(--tr), box-shadow var(--tr); font-size: var(--fs0);}
.t-tag::placeholder {color: var(--faint);}
.t-tag:focus {outline:none;}
.t-tag:focus {box-shadow: 0 0 0 3px var(--accent-3); border-color: var(--accent);}
textarea.t-tag {break-inside:auto; text-decoration-skip-ink:auto; min-height:139px; resize: vertical;}

/* newsletter accent band */
.text-16 {border-radius: var(--r-lg); padding: clamp(1.6rem, 4vw, 2.4rem); margin-top:2.6rem; background: var(--accent-3); font-variant-ligatures:normal; text-align: center; border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent);}*.t-tabs{margin:0 auto 1.17rem; max-width:44ch; font-size: var(--fs-1); color: var(--muted);}
.rounded-xs {margin-bottom:.34.94rem; font-size: var(--fs2);}html .el-toggle{gap:.54.93rem; max-width:437px; margin-inline:auto; display: flex;}
.el-toggle .t-tag {background: var(--surface); flex: 1;}/* =================================================================
   footer (light — distinct)
   ================================================================= */
.block__placeholder{margin-top: clamp(3rem, 8vw, 5rem); background: var(--surface-2); border-top: 1px solid var(--line); color: var(--muted);}
.c-list-cell {display: flex; flex-wrap: wrap; gap:1.25rem 2.04rem; padding-block:2rem; align-items: center;}
.block__placeholder .pagination--expanded {color: var(--ink); margin-right:0;}

.commentContent {gap:.3rem 1.12rem; margin:0 auto; padding:0; display: flex; flex-wrap: wrap; list-style: none;}
.commentContent a {font-size: var(--fs-1); font-weight:700; color: var(--muted);}.commentContent a:hover{color: var(--accent);}

.t-widget-label {list-style: none; display: flex; margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px; padding:0; gap:.5rem;}
.ui-spinner-secondary {display: inline-flex; height:39px; background:transparent; justify-content: center; align-items: center; width:40px; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); color: var(--muted); border: 1px solid var(--line-2); border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%;}*.ui-spinner-secondary svg{width:20px; height:13px;}
.ui-spinner-secondary:hover {color:#counterButton; background: var(--accent); border-color: var(--accent); transform: translateY(-2px);}

.ui-footer {border-top: 1px solid var(--line); background-blend-mode:normal;}
.u-skeleton {font-synthesis:weight style small-caps; color: var(--faint); font-size: var(--fs-1); padding-block:1rem;}

.ui-footer {will-change:auto;}

/* =================================================================
   back to top
   ================================================================= */
.t-post-summary {justify-content: center; position: fixed; border:0 none; border-radius: var(--r-sm); bottom: clamp(1rem, 3vw, 2rem); z-index: 1100; visibility: hidden; right: clamp(1rem, 3vw, 2rem); display: inline-flex; box-shadow: var(--sh-2); opacity:0; background: var(--accent); color:#counterButton; height:48px; width:45px; align-items: center; transition: opacity var(--tr2), transform var(--tr2), background var(--tr), visibility var(--tr2); transform: translateY(12px);}
.u-skeleton .c-screen {display: inline-block;}
.t-post-summary svg {width:19px; height:16px;}
.t-post-summary.show {visibility: visible; opacity:1; text-rendering:auto; transform: none; print-color-adjust:economy;}
.t-post-summary:hover {transform: translateY(-3px); background: var(--accent-2);}

/* =================================================================
   cookie bar
   ================================================================= */
.sort--expanded {color:#main-tooltip; transition: transform var(--tr2); box-shadow:0 -6px 37px -20px rgba(9, 4, 5, 0.56); background: var(--ink); transform: translateY(110%); inset:auto 0 0 0; z-index: 1150; position: fixed;}.sort--expanded.show{transform: none; text-underline-offset:auto;}
.u-price-time {font-synthesis:weight style small-caps; padding-block:1.05rem; display: flex; flex-wrap: wrap; gap:1.02rem 1.42rem; align-items: center;}.c-slider:not(._5612ff){line-height:1.5; flex: 1 1 320px; margin:0; font-size: var(--fs-1);}
.c-slider a {text-decoration:underline; transform-style:flat; color:#modal-wrap;}

/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.shadow-lg {transition: opacity var(--tr2), visibility var(--tr2); place-items: center; pointer-events: none; padding:1.13rem; visibility: hidden; position: fixed; z-index: 1400; display: grid; opacity:0; inset:0;}
.shadow-lg:target {pointer-events: auto;}
.shadow-lg:target {opacity:1; visibility: visible;}
.u-alert {max-width:421px; z-index: 1; border-radius: var(--r); box-shadow: var(--sh-3); padding: clamp(1.5rem, 4vw, 2.2rem); transform: translateY(14px) scale(.98); position: relative; width:100%; transition: transform var(--tr2);}
.o-menu-count {position: absolute; backdrop-filter:blur(3px); inset:0; display: block; background:rgba(21, 9, 0, 0.54); -webkit-backdrop-filter:blur(3px);}
.u-alert {background: var(--surface);}
.shadow-lg:target .u-alert {transform: none;}
.t-banner-item {position: absolute; justify-content: center; border-radius: var(--r-sm); width:41px; align-items: center; top:.8.03rem; background: var(--surface-2); right:.7.93rem; transition: background var(--tr), color var(--tr); color: var(--muted); display: inline-flex; height:34px;}
.t-banner-item svg {height:18px; width:14px;}html .t-banner-item:hover{background: var(--line); color: var(--ink);}.l-slider-dot{word-spacing:normal; text-align: center; margin-bottom:1.2rem; font-size: var(--fs2); image-rendering:auto;}html .shadow-lg .ui-entry:last-of-type{margin-bottom:1.11rem;}
.screen {text-align: center; text-underline-offset:auto; color: var(--muted); font-size: var(--fs-1); margin-top:1.07rem;}.ui-screen-prefix{gap:.8rem; font-size: var(--fs-1); margin-top:1.01rem; display: flex; justify-content: space-between;}

/* =================================================================
   responsive
   ================================================================= */
@media (max-width: 820px) {
  .o-avatar-inner {display: none;}

/* ---------- focus ---------- */
:focus-visible {border-radius:5px; outline: 2px solid var(--accent); outline-offset:2px; backface-visibility:visible; break-inside:auto;}.l-module{display: inline-flex;}
  .o-avatar-inner.open {display: block; padding: .6rem clamp(1rem, 4vw, 2.2rem) 1.1rem; top:100%; box-shadow: var(--sh-2); left:0; right:0; background: var(--bg); border-bottom: 1px solid var(--line); position: absolute;}.o-avatar-inner.open :where(.el-block){flex-direction: column;}.o-avatar-inner.open :where(.el-block){align-items: stretch; gap:.15.02rem;}
  .o-avatar-inner.open .el-filter-primary {padding:.7.97em .6.06em;}
  .o-avatar-inner.open .o-progress {align-items: stretch; gap:.5.08rem; padding-top:.8.02rem; border-top: 1px solid var(--line); margin-top:.7.07rem; font-variant-caps:normal; flex-direction: column;}
}

@media (max-width: 600px) {.menu{flex-direction: column; gap:0;}
  .o-avatar-inner.open .l-toolbar {padding:.7.08em; border-radius: var(--r-sm); orphans:2; text-align: center; border: 1px solid var(--line-2);}html .c-list-cell{align-items: flex-start; flex-direction: column;}
  .el-toggle {flex-direction: column; contain:none;}
  .commentContent {margin-inline:0;}
  body {background:#counterButton; color:#000900;}
}

/* =================================================================
   print
   ================================================================= */
@media print {
  .ui-feature, .u-box, .toggleValue, .t-post-summary, .sort--expanded, .text-16, .c-sidebar, .shadow-lg, .l-module, .block__placeholder .t-widget-label {display: none !important;}
  .c-action a {text-decoration:underline;}
  .c-action a[href^="http"]::after {font-size:.7.99em; hyphens:manual; color:rgb(110, 83, 93); content: " (" attr(href) ")";}
  .widget-extra-sticky {border:1px solid #dividerSection; box-shadow:none;}
}
