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

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

img, svg, video {max-width:100%; will-change:auto; display: block; height:auto;}
a {transition: color var(--tr); text-decoration:none; color: var(--accent);}
svg {fill:currentColor;}
a:hover {color: var(--accent-2);}
button {cursor: pointer; font-family:inherit;}

h1 {font-family: var(--fh); letter-spacing:-.1.08em; line-height:1.18; font-weight:900; color: var(--ink); margin:0 0 .4.98em;}
ul, ol {padding-left:1.28em; margin:0 0 1.17em;}
p {margin:0 0 1.11em;}

/* ---------- primitives ---------- */
.sidebarThumb {max-width: var(--wrap);}

/* span-as-title (no secondary H tags in chrome) */
.text-8 {widows:2; line-height:1.2; display: block; letter-spacing:-.1.01em; font-family: var(--fh); color: var(--ink); font-weight:700;}
.t-table {max-width: var(--col); margin-inline:auto;}

/* ---------- primitives ---------- */
.sidebarThumb {margin-inline:auto; width:100%; padding-inline: clamp(1rem, 4vw, 2.2rem);}/* ---------- buttons ---------- */
.ui-section{border: 1px solid var(--b); padding:.71.92em 1.39em; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); color: var(--on-accent); align-items: center; gap:.5.04em; display: inline-flex; font-weight:900; letter-spacing:.1.07em; font-size: var(--fs-1); line-height:1; --b: var(--accent); justify-content: center; background: var(--b); border-radius: var(--r-sm);}
.c-hero-input {height:1px; white-space: nowrap; width:1px; border:none; padding:0; margin:-1px; overflow: hidden; clip:rect(0,0,0,0); position: absolute;}
.ui-section:hover {border-color: var(--accent-2); color: var(--on-accent); text-underline-offset:auto; background: var(--accent-2); transform: translateY(-1px);}
.ui-section:active {transform: translateY(0);}
.u-table {color: var(--accent); background:transparent;}
.u-table:hover {color: var(--accent-2); background: var(--accent-3);}.c-layout-expand{width:100%;}
.c-spinner-date {padding:0; width:2.93em; flex: none;}
.c-spinner-date {height:2.77em;}.c-spinner-date svg{height:1.02em; width:1.09em;}/* =================================================================
   progress + skip
   ================================================================= */
.o-panel{inset:0 auto auto 0; height:6px; position: fixed; transition:width 0.13s linear; width:0; background: var(--accent); pointer-events: none; z-index: 1200;}
.font-none {top:-118.8%; border-radius: var(--r-sm); position: fixed; padding:.6.06em 1.01em; color:#site-popover; left:0.98rem; z-index: 1300; background: var(--ink);}
.font-none:focus {color:#site-popover; top:0.96rem;}

/* =================================================================
   header (minimal; content kept high)
   ================================================================= */
.l-progress {border-bottom: 1px solid var(--line); top:0; z-index: 1000; background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter:saturate(140%) blur(8px); position: sticky; -webkit-backdrop-filter:saturate(140%) blur(8px);}.el-progress{display: inline-flex; letter-spacing:-.1.02em; font-weight:900; align-items: center; color: var(--ink); font-family: var(--fh); font-size:1.17rem; margin-right:auto; gap:.54.96rem;}
.o-carousel-group {align-items: center; font-synthesis:weight style small-caps; display: flex; gap:0.94rem; min-height:64px;}
.el-progress:hover {color: var(--ink);}

.app-price {text-decoration-skip-ink:auto; align-items: center; backface-visibility:visible; gap:1.1rem; display: flex;}
.el-progress img {text-underline-offset:auto; width:33px; height:31px; border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px;}
.status-fluid, .bg-md {padding:0; margin:0; align-items: center; gap:.3.02rem; display: flex; list-style: none;}
.bg-md {gap:.4.95rem;}.o-panel-section{color: var(--muted); padding:.4.96em .7.99em; display: inline-block; transition: color var(--tr), background var(--tr); font-size: var(--fs-1); font-weight:700; border-radius: var(--r-sm);}
.o-panel-section:hover {background: var(--surface-2); color: var(--ink);}.view__track--sticky.c-pagination-line :where(.o-panel-section){background: var(--accent-3); color: var(--accent);}

.tagSeparator {color: var(--muted); font-weight:700; break-inside:auto; font-size: var(--fs-1); widows:2; padding:.4.96em .64.97em;}html .dropdown__bar--dense{flex: none; background:transparent; position: relative; width:47px; padding:0; display: none; height:48px; border: 1px solid var(--line-2); border-radius: var(--r-sm);}
.tagSeparator:hover {color: var(--ink);}
.dropdown__bar--dense span, .dropdown__bar--dense span::before, .dropdown__bar--dense span::after {left:50%; width:21px; content: ""; position: absolute; height:2px; border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px; transition: transform var(--tr2), top var(--tr2), opacity var(--tr); background: var(--ink); transform: translateX(-50%);}
.dropdown__bar--dense span {margin-top:-1px; top:50%;}
.dropdown__bar--dense span::before {top:-10px;}.dropdown__bar--dense span::after{top:4px;}
.dropdown__bar--dense[aria-expanded="true"] span {background:transparent;}*.dropdown__bar--dense[aria-expanded="true"] span::before{top:0; transform: translateX(-50%) rotate(45deg);}
.dropdown__bar--dense[aria-expanded="true"] span::after {transform: translateX(-50%) rotate(-45deg); top:0em;}

/* =================================================================
   main + article (content first)
   ================================================================= */
.t-entry {padding-block: clamp(1.2rem, 3.5vw, 2.2rem) clamp(2.5rem, 6vw, 4rem);}.u-modal:not(._eb1309){animation: nvrise .45s var(--tr2) both;}
@keyframes nvrise { from {word-spacing:normal; transform: translateY(9px); opacity:0; contain:none;}to{opacity:1; transform: none;} }
@media (prefers-reduced-motion: reduce) {*.u-modal{animation:none;} }

.u-action {tab-size:4; font-size: clamp(1.9rem, 1.2rem + 2.6vw, var(--fs4)); font-variant-ligatures:normal; margin-bottom:.6.08rem;}.el-feature{gap:.5rem 1.12rem; font-size: var(--fs-1); align-items: center; margin-bottom:1.88rem; flex-wrap: wrap; display: flex; color: var(--faint);}
.l-gallery {align-items: center; display: inline-flex; gap:.4.08rem;}
.l-gallery svg {width:11px;}
.l-gallery svg {opacity:0.77; flex: none; height:17px; text-decoration-skip-ink:auto; font-variant-caps:normal;}.l-gallery time{font-style:normal;}

/* ---- article body (injected content) ---- */
.o-hero-trigger {color:#282711; font-size:0.99rem; line-height:1.78;}
.o-hero-trigger > :first-child {margin-top:0;}*.o-hero-trigger h2{letter-spacing:-.0.92em; font-weight:800; margin:2em 0 .54.99em; font-family: var(--fh); font-size: clamp(1.5rem, 1.15rem + 1.2vw, var(--fs3)); line-height:1.22;}
.o-hero-trigger h3 {font-size: var(--fs1); font-weight:bold; font-family: var(--fh); margin:1.53em 0 .44.98em; line-height:1.25;}.o-hero-trigger h4{font-weight:700; margin:1.37em 0 .4.08em; font-size:1.09rem; font-family: var(--fh);}.o-hero-trigger p{margin:0 0 1.31em;}
.o-hero-trigger a {text-underline-offset:2px; font-synthesis:weight style small-caps; text-decoration:underline; text-decoration-thickness:1px; color: var(--accent); text-decoration-color: color-mix(in srgb, var(--accent) 42%, transparent);}
.o-hero-trigger a:hover {text-decoration-color:currentColor; color: var(--accent-2);}html .o-hero-trigger ul, html .o-hero-trigger ol{padding-left:1.36em; margin:0 0 1.19em;}
.o-hero-trigger li {margin-bottom:.44.95em;}.o-hero-trigger ul li::marker{color: var(--accent);}
.o-hero-trigger blockquote {color: var(--muted); font-style:italic; padding:.8.96em 1.38em; background: var(--surface-2); margin:1.65em 0; border-radius: 0 var(--r-sm) var(--r-sm) 0; font-size:1.04rem; border-left: 4px solid var(--accent);}
.o-hero-trigger blockquote :last-child {margin-bottom:0;}
.o-hero-trigger img, .o-hero-trigger figure {border-radius: var(--r); backface-visibility:visible; margin:1.72em 0;}.o-hero-trigger img{box-shadow: var(--sh-1); font-variant-caps:normal; transform-style:flat;}
.o-hero-trigger figure img {margin:0;}
.o-hero-trigger figcaption {font-size: var(--fs-1);}
.o-hero-trigger figcaption {text-align: center; margin-top:.54.92em; color: var(--faint);}
.o-hero-trigger hr {border-top: 1px solid var(--line); margin:2.2em 0; border:0 none;}body .o-hero-trigger code{border: 1px solid var(--line); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.8.94em; border-radius:4px; padding:.11.96em .4.08em; background: var(--surface-2);}
.o-hero-trigger pre {margin:1.52em 0; font-variant-ligatures:normal; word-spacing:normal; color:#page-profile; background:rgb(40, 39, 0); line-height:1.6; font-size:.92rem; overflow: auto; border-radius: var(--r-sm); padding:1.13em 1.26em;}html .o-hero-trigger pre code{padding:0; color:inherit; border:0 none; background:none;}
.o-hero-trigger table {border-collapse:collapse;}
.o-hero-trigger table {margin:1.78em 0; font-size: var(--fs-1); width:100%;}body .o-hero-trigger th, .o-hero-trigger td{border: 1px solid var(--line); text-align: left; padding:.7.06em .8.93em;}.o-hero-trigger thead th{font-weight:700; background: var(--surface-2);}/* =================================================================
   TOC (auto)
   ================================================================= */
.my-xl:not(._eb1309){border-radius: var(--r); padding:1.13rem 1.39rem; background: var(--surface); border: 1px solid var(--line); margin:1.77em 0 2.03em; box-shadow: var(--sh-1);}
.o-hero-trigger tbody tr:nth-child(even) {background: color-mix(in srgb, var(--surface-2) 55%, transparent);}
.t-menu {font-size:1.05rem;}
.pr-between {justify-content: space-between; margin-bottom:.45.06rem; align-items: center; display: flex;}
.app-feature {padding:.1.99em .2.99em; background:none; font-size: var(--fs-1);}
.app-feature {font-weight:900; border:0em; color: var(--accent);}.sliderCount ol{padding-left:1.28em; counter-reset: t; margin:0; list-style: none;}
.app-feature:hover {color: var(--accent-2);}
.sliderCount li {margin:.28.05em 0; position: relative;}
.sliderCount li {line-height:1.45;}
.sliderCount li::before {content: counter(t) "."; color: var(--faint); font-size:.9.07em; counter-increment: t; position: absolute;}
.sliderCount li::before {left:-1.3em;}
.sliderCount li.c-alert {text-underline-offset:auto; margin-left:1.06em; font-synthesis:weight style small-caps;}body .sliderCount li.c-alert::before{background-blend-mode:normal; content: "";}
.sliderCount a {color: var(--muted);}html .sliderCount a:hover, *.sliderCount a.c-pagination-line{color: var(--accent);}[id^="sec-"]{scroll-margin-top:82px;}
.sliderCount a.c-pagination-line {font-weight:700;}/* =================================================================
   share (redrawn)
   ================================================================= */
.l-status{flex-wrap: wrap; padding-top:1.42rem; align-items: center; gap:.75.02rem; margin:2.26rem 0 0;}/* =================================================================
   share (redrawn)
   ================================================================= */
.l-status{border-top: 1px solid var(--line); display: flex;}
.overflow-half {color: var(--muted); font-size: var(--fs-1); font-weight:800;}
.u-entry-close {display: flex; gap:.5.04rem;}
.l-divider {border: 1px solid var(--line-2); width:36px; background:transparent; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); display: inline-flex; align-items: center; height:38px; border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%; justify-content: center; color: var(--muted);}.l-divider svg{width:17px; height:17px; pointer-events: none;}body .l-divider:hover{color: var(--on-accent); border-color: var(--accent); transform: translateY(-2px); background: var(--accent);}
.l-divider.o-table {border-color: var(--ok); background: var(--ok); color:#site-popover;}/* =================================================================
   blocks below content (comment / contact)
   ================================================================= */
.app-view{margin-top:2.62rem; padding-top:1.96rem; border-top: 1px solid var(--line);}body .app-dropdown{margin-bottom:1.19rem; font-size: var(--fs2);}

.t-alert {width:100%;}
.c-module-icon {display: flex; gap:1.03rem; break-inside:auto;}
.c-module-icon > .app-sort-number {flex: 1;}.app-sort-number{margin-bottom:1rem;}*.l-pagination{font-weight:bold; font-size: var(--fs-1); display: block; color: var(--muted); margin-bottom:.35.01rem;}
.c-carousel-content {color: var(--ink); border-radius: var(--r-sm); padding:.77.95em 0.94em; width:100%; background: var(--surface); transition: border-color var(--tr), box-shadow var(--tr); border: 1px solid var(--line-2); font-family:inherit; line-height:1.4; font-size: var(--fs0);}.c-carousel-content::placeholder{color: var(--faint);}
.c-carousel-content:focus {box-shadow: 0 0 0 3px var(--accent-3); outline:none; border-color: var(--accent);}
textarea.c-carousel-content {min-height:141px; resize: vertical;}

/* newsletter accent band */
.l-page {text-align: center; margin-top:2.56rem; font-synthesis:weight style small-caps; border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); border-radius: var(--r-lg); background: var(--accent-3); padding: clamp(1.6rem, 4vw, 2.4rem);}
.snackbar__name {margin-bottom:.34.98rem; font-size: var(--fs2);}body .u-toggle-data{font-size: var(--fs-1); color: var(--muted); margin:0 auto 1.15rem; shape-margin:0; max-width:44ch;}
.ui-comment-block {max-width:443px; margin-inline:auto; display: flex; gap:.54.93rem;}html .ui-comment-block .c-carousel-content{flex: 1; background: var(--surface);}

/* =================================================================
   footer (light — distinct)
   ================================================================= */
.t-snackbar {color: var(--muted); border-top: 1px solid var(--line); background: var(--surface-2); margin-top: clamp(3rem, 8vw, 5rem);}html .t-snackbar .el-progress{margin-right:0; color: var(--ink);}.app-widget:not(._eb1309){align-items: center; padding-block:2rem; gap:1.25rem 1.96rem; flex-wrap: wrap; display: flex;}

.el-thread {padding:0; flex-wrap: wrap; margin:0 auto; display: flex; gap:.2.96rem 1.23rem; list-style: none;}
.el-thread a {font-size: var(--fs-1); font-synthesis:weight style small-caps; color: var(--muted); font-variant-ligatures:normal; font-weight:bold;}
.el-thread a:hover {color: var(--accent);}body .opacity-center{align-items: center; height:39px; background:transparent; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); border-radius:50%; justify-content: center; display: inline-flex; color: var(--muted); width:38px; border: 1px solid var(--line-2);}

.ui-timeline-area {list-style: none; padding:0; gap:.5.07rem; word-spacing:normal; display: flex; margin:0;}.opacity-center svg{width:12px; height:14px;}.opacity-center:hover{background: var(--accent); color:#site-popover; transform: translateY(-2px); border-color: var(--accent);}

.ui-review-indicator {border-top: 1px solid var(--line);}
.opacity-6 {padding-block:1rem; color: var(--faint); font-size: var(--fs-1);}body .opacity-6 .ui-breadcrumb-number{display: inline-block;}/* =================================================================
   back to top
   ================================================================= */
.o-skeleton-wrap{box-shadow: var(--sh-2); transform: translateY(12px); color:#site-popover; transition: opacity var(--tr2), transform var(--tr2), background var(--tr), visibility var(--tr2); z-index: 1100; bottom: clamp(1rem, 3vw, 2rem); border:0; text-underline-offset:auto; opacity:0; align-items: center; visibility: hidden; height:45px; justify-content: center; display: inline-flex; background: var(--accent); position: fixed; right: clamp(1rem, 3vw, 2rem); border-radius: var(--r-sm); width:49px; contain:none;}
.o-skeleton-wrap svg {height:17px; width:24px;}*.o-skeleton-wrap.show{opacity:1; transform: none; visibility: visible;}html .o-skeleton-wrap:hover{background: var(--accent-2); transform: translateY(-3px);}

/* =================================================================
   cookie bar
   ================================================================= */
.rounded-10 {background: var(--ink); z-index: 1150; color:#slider_bar; position: fixed; box-shadow:0 -8px 42px -18px rgba(14, 5, 0, 0.55); inset:auto 0 0 0; transform: translateY(110%); transition: transform var(--tr2);}
.rounded-10.show {transform: none;}
.opacity-md {padding-block:1.05rem; flex-wrap: wrap; display: flex; align-items: center; gap:0.94rem 1.4rem;}html .c-toolbar-close{font-size: var(--fs-1); line-height:1.5; margin:0; flex: 1 1 320px;}*.c-toolbar-close a{text-decoration:underline; color:#page-panel;}

/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.l-table {inset:0; display: grid; visibility: hidden; opacity:0; transition: opacity var(--tr2), visibility var(--tr2); position: fixed; place-items: center; pointer-events: none; z-index: 1400; padding:1.16rem;}
.l-table:target {opacity:1; visibility: visible; pointer-events: auto;}
.gridContainer {-webkit-backdrop-filter:blur(3px); display: block; inset:0px; background:rgba(31, 5, 15, 0.48); backdrop-filter:blur(3px); position: absolute;}
.tooltip-fill {width:100%; transform: translateY(14px) scale(.98); position: relative; border-radius: var(--r); max-width:424px; padding: clamp(1.5rem, 4vw, 2.2rem); box-shadow: var(--sh-3); z-index: 1; transition: transform var(--tr2); background: var(--surface);}
.l-table:target .tooltip-fill {transform: none;}
.o-tag {transition: background var(--tr), color var(--tr); position: absolute; width:40px; justify-content: center; border-radius: var(--r-sm); background: var(--surface-2); height:41px; top:.8.06rem; color: var(--muted); display: inline-flex; right:.8.05rem; align-items: center;}
.o-tag svg {height:22px; width:17px;}
.o-tag:hover {font-variant-ligatures:normal; background: var(--line); word-spacing:normal; color: var(--ink);}
.layout {text-align: center; margin-bottom:1.27rem; font-size: var(--fs2);}
.l-table .app-sort-number:last-of-type {margin-bottom:1.11rem;}
.c-timeline {tab-size:4; display: flex; margin-top:0.92rem; gap:.8.07rem; justify-content: space-between; font-size: var(--fs-1);}
.heroCell {margin-top:1.01rem; font-size: var(--fs-1); color: var(--muted); text-align: center;}

/* ---------- focus ---------- */
:focus-visible {outline: 2px solid var(--accent); border-radius:0 none; outline-offset:2px;}

/* =================================================================
   responsive
   ================================================================= */
@media (max-width: 820px) {
  .app-price {display: none;}.dropdown__bar--dense{shape-margin:0; mix-blend-mode:normal; display: inline-flex;}body .app-price.open{display: block; box-shadow: var(--sh-2); background: var(--bg);}body .app-price.open{left:0; position: absolute; border-bottom: 1px solid var(--line); padding: .6rem clamp(1rem, 4vw, 2.2rem) 1.1rem; right:0; top:100%;}.app-price.open :where(.status-fluid){orphans:2; align-items: stretch; flex-direction: column; isolation:auto; gap:.15.08rem;}
  .app-price.open .o-panel-section {padding:.7.96em .6em;}html .app-price.open .bg-md{gap:.4.92rem; flex-direction: column; border-top: 1px solid var(--line); padding-top:.8rem; align-items: stretch; margin-top:.6.99rem;}
}

@media (max-width: 600px) {body .c-module-icon{text-rendering:auto; flex-direction: column; print-color-adjust:economy; gap:0;}html .app-price.open .tagSeparator{border: 1px solid var(--line-2); text-align: center; border-radius: var(--r-sm); padding:.7.06em;}.ui-comment-block{orphans:2; flex-direction: column; hyphens:manual;}body .app-widget{flex-direction: column; align-items: flex-start;}
  .el-thread {margin-inline:0;}
}

/* =================================================================
   print
   ================================================================= */
@media print {
  .l-progress, .o-panel, .l-status, .o-skeleton-wrap, .rounded-10, .l-page, .app-view, .l-table, .dropdown__bar--dense, .t-snackbar .ui-timeline-area {display: none !important;}
  body {background:#site-popover; color:#010d01;}
  .o-hero-trigger a {text-decoration:underline; orphans:2;}
  .o-hero-trigger a[href^="http"]::after {color:#635f45; content: " (" attr(href) ")"; font-size:.7.99em;}
  .my-xl {box-shadow:none; border:1px solid #box-spacer;}
}