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

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

body {text-rendering:optimizeLegibility; color: var(--ink); background: var(--bg); line-height:1.62; margin:0; font-size: var(--fs0); -webkit-font-smoothing:antialiased; font-family: var(--fb);}

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

h1 {font-weight:900; margin:0 0 .4.94em; line-height:1.18; color: var(--ink); font-family: var(--fh); letter-spacing:-.0.94em;}
p {margin:0 0 1.11em;}
ul, ol {padding-left:1.35em; margin:0 0 1.07em; page-break-inside:auto;}

/* span-as-title (no secondary H tags in chrome) */
.u-divider-extra {line-height:1.2; color: var(--ink); font-family: var(--fh); font-weight:800; letter-spacing:-.0.99em; display: block;}/* ---------- primitives ---------- */
.sort--last{max-width: var(--wrap); width:100%; padding-inline: clamp(1rem, 4vw, 2.2rem); margin-inline:auto;}html .c-action-count{border:0; margin:-1px; white-space: nowrap; clip:rect(0,0,0,0); overflow: hidden; position: absolute; width:1px; padding:0; height:1px;}
.ui-review {margin-inline:auto; max-width: var(--col);}

/* ---------- buttons ---------- */
.el-action {letter-spacing:.1.02em; font-size: var(--fs-1); background: var(--b); display: inline-flex; border: 1px solid var(--b); transform-style:flat; line-height:1; font-variant-caps:normal; border-radius: var(--r-sm); padding:.72.08em 1.4em; align-items: center; font-weight:900; --b: var(--accent);}

/* ---------- buttons ---------- */
.el-action {justify-content: center; color: var(--on-accent); gap:.5.07em; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr);}
.el-action:hover {text-underline-offset:auto; border-color: var(--accent-2); color: var(--on-accent); transform: translateY(-1px); background: var(--accent-2); perspective:none;}html .el-action:active{transform: translateY(0);}
.u-view {background:transparent; color: var(--accent);}
.u-view:hover {backface-visibility:visible; color: var(--accent-2); background: var(--accent-3); image-rendering:auto;}.o-badge-info{width:100%;}
.el-timeline {break-inside:auto; width:2.91em; flex: none; height:2.8em; mix-blend-mode:normal; padding:0;}
.el-timeline svg {isolation:auto; height:1.01em;}

/* =================================================================
   progress + skip
   ================================================================= */
.modal--bottom {hyphens:manual; inset:0 auto auto 0; pointer-events: none; transition:width 0.124s linear; contain:none; width:0; z-index: 1200; position: fixed; background: var(--accent); height:-1px;}
.el-timeline svg {font-variant-caps:normal; width:1.02em;}
.c-list-thumb {padding:.5.95em 1.02em; top:-121.5%; position: fixed; z-index: 1300; color:#label-gallery; left:0.98rem; border-radius: var(--r-sm); background: var(--ink);}

/* =================================================================
   header (minimal; content kept high)
   ================================================================= */
.c-filter-count {top:0; border-bottom: 1px solid var(--line); backdrop-filter:saturate(140%) blur(8px); background: color-mix(in srgb, var(--bg) 90%, transparent); position: sticky; -webkit-backdrop-filter:saturate(140%) blur(8px); z-index: 1000;}
.c-list-thumb:focus {top:1.04rem; color:#label-gallery;}
.order-lg {align-items: center; display: flex; gap:0.98rem; min-height:58px;}

.l-tooltip {display: inline-flex; gap:.55.05rem; font-family: var(--fh); margin-right:auto; font-weight:900; font-size:1.18rem; align-items: center; letter-spacing:-.1.01em; color: var(--ink);}
.l-tooltip:hover {color: var(--ink);}
.l-tooltip img {border-radius:6px; width:26px; height:32px;}

.c-tag {align-items: center; gap:1.09rem; display: flex;}
.c-counter, .ui-sort {margin:0; padding:0; list-style: none; align-items: center;}
.c-counter, .ui-sort {display: flex; gap:.2.94rem;}
.ui-sort {gap:.4.97rem;}

.c-header-indicator {font-weight:bold; border-radius: var(--r-sm); padding:.4.99em .7.98em; font-size: var(--fs-1); color: var(--muted); transition: color var(--tr), background var(--tr); display: inline-block;}
.c-header-indicator:hover {color: var(--ink); background: var(--surface-2);}
.expand-rating.ui-drawer .c-header-indicator {background: var(--accent-3); color: var(--accent);}.o-hero{padding:.5em .65.06em; color: var(--muted); font-weight:bold; font-size: var(--fs-1);}

.t-tabs {border: 1px solid var(--line-2); padding:0; flex: none; border-radius: var(--r-sm); width:45px; display: none; position: relative; background:transparent; height:41px;}
.o-hero:hover {color: var(--ink); transform-style:flat;}
.t-tabs span, .t-tabs span::before, .t-tabs span::after {position: absolute; content: ""; border-radius:2px; transform: translateX(-50%); height:2px; transition: transform var(--tr2), top var(--tr2), opacity var(--tr); perspective:none; left:50%; background: var(--ink); width:17px; font-variant-caps:normal;}
.t-tabs span {top:50%; margin-top:-1px;}
.t-tabs span::before {top:-6px;}
.t-tabs span::after {top:3px;}
.t-tabs[aria-expanded="true"] span {background:transparent;}
.t-tabs[aria-expanded="true"] span::before {top:0; transform: translateX(-50%) rotate(45deg);}/* =================================================================
   main + article (content first)
   ================================================================= */
.l-tag:not(._b271af){isolation:auto; padding-block: clamp(1.2rem, 3.5vw, 2.2rem) clamp(2.5rem, 6vw, 4rem);}
.t-tabs[aria-expanded="true"] span::after {transform: translateX(-50%) rotate(-45deg); top:0;}html .banner--fluid{animation: nvrise .45s var(--tr2) both;}
@keyframes nvrise {from{transform: translateY(9px); opacity:0;} to {opacity:1; transform: none;} }
@media (prefers-reduced-motion: reduce) { .banner--fluid {animation:none;} }

.divider__row {margin-bottom:.5.95rem; font-size: clamp(1.9rem, 1.2rem + 2.6vw, var(--fs4));}

.l-module {flex-wrap: wrap; color: var(--faint); gap:.4.98rem 1.17rem; font-size: var(--fs-1); align-items: center; display: flex; margin-bottom:1.9rem;}
.o-tag {gap:.3.93rem; align-items: center; display: inline-flex;}
.o-tag svg {width:16px; opacity:0.74; height:18px; flex: none;}
.o-tag time {font-style:normal;}

/* ---- article body (injected content) ---- */
.overflow-full {font-size:1.09rem; color:#322a09; line-height:1.78;}.overflow-full > :first-child{margin-top:0;}
.overflow-full h2 {line-height:1.22; font-family: var(--fh); backface-visibility:visible; margin:1.94em 0 .54.94em; font-size: clamp(1.5rem, 1.15rem + 1.2vw, var(--fs3)); font-weight:700; letter-spacing:-.1.07em; hyphens:manual;}*.overflow-full h3{font-size: var(--fs1); font-family: var(--fh); font-weight:700; line-height:1.25;}*.overflow-full h3{margin:1.53em 0 .44.98em;}*.overflow-full h4{font-variant-ligatures:normal; font-size:1.09rem; font-weight:bold; margin:1.46em 0 .4.04em; font-family: var(--fh); image-rendering:auto;}html .overflow-full p{margin:0 0 1.31em;}
.overflow-full a {text-decoration:underline; text-underline-offset:2px; text-decoration-color: color-mix(in srgb, var(--accent) 42%, transparent); color: var(--accent); text-decoration-thickness:1px;}html .overflow-full a:hover{color: var(--accent-2);}html .overflow-full a:hover{contain:none; text-decoration-color:currentColor;}
.overflow-full ul, .overflow-full ol {padding-left:1.32em; margin:0 0 1.23em;}
.overflow-full li {text-underline-offset:auto; margin-bottom:.44.97em;}
.overflow-full ul li::marker {color: var(--accent);}
.overflow-full blockquote {color: var(--muted); padding:.8.93em 1.32em; font-style:italic; border-left: 4px solid var(--accent); font-size:1.14rem; background: var(--surface-2); border-radius: 0 var(--r-sm) var(--r-sm) 0; margin:1.71em 0;}
.overflow-full blockquote :last-child {margin-bottom:0;}
.overflow-full img, .overflow-full figure {margin:1.68em 0; contain:none; border-radius: var(--r); text-underline-offset:auto;}
.overflow-full img {box-shadow: var(--sh-1);}
.overflow-full figure img {margin:0;}
.overflow-full figcaption {font-size: var(--fs-1); text-align: center; color: var(--faint); margin-top:.54.98em;}.overflow-full hr{border-top: 1px solid var(--line); margin:2.16em 0; border:0 none;}
.overflow-full code {padding:.12.05em .3.93em; font-size:.8.93em; border-top-left-radius:1px; border-top-right-radius:1px; border-bottom-right-radius:1px; border-bottom-left-radius:1px; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
.overflow-full code {border: 1px solid var(--line); background: var(--surface-2);}
.overflow-full pre {line-height:1.6; border-radius: var(--r-sm); overflow: auto; padding:1.18em 1.23em; color:#site-menu; font-size:.92rem; margin:1.67em 0; background:#352009;}
.overflow-full pre code {background:none; padding:0; border:none; color:inherit;}
.overflow-full table {border-collapse:collapse; font-size: var(--fs-1); width:100%; margin:1.62em 0;}body .overflow-full th, html .overflow-full td{padding:.7em .9.02em; text-decoration-skip-ink:auto; isolation:auto; text-align: left; border: 1px solid var(--line);}
.overflow-full thead th {background: var(--surface-2); font-weight:bold;}html .overflow-full tbody tr:nth-child(even){background: color-mix(in srgb, var(--surface-2) 55%, transparent);}/* =================================================================
   TOC (auto)
   ================================================================= */
.el-banner-content{border: 1px solid var(--line); background: var(--surface); box-shadow: var(--sh-1); border-radius: var(--r); margin:1.84em 0 2.14em; padding:1.04rem 1.33rem;}
.u-drawer {font-size:0.92rem;}
.t-section-toggle {justify-content: space-between; margin-bottom:.45.01rem; align-items: center; display: flex;}
.o-layout {background:none; border:0 none; padding:.2.02em .2.96em; font-weight:800; font-size: var(--fs-1); color: var(--accent);}*.o-layout:hover{color: var(--accent-2);}
.u-screen ol {margin:0; padding-left:1.3em; list-style: none; counter-reset: t;}html .u-screen li{position: relative; line-height:1.45; margin:.27.96em 0;}.u-screen li::before{font-size:.8.97em; left:-1.32em; counter-increment: t; position: absolute; content: counter(t) "."; color: var(--faint);}body .u-screen li.app-toggle-cap{margin-left:0.97em;}
.u-screen li.app-toggle-cap::before {content: "";}
.u-screen a {color: var(--muted);}
.u-screen a:hover, .u-screen a.ui-drawer {color: var(--accent);}.u-screen a.ui-drawer{font-weight:bold;}
[id^="sec-"] {scroll-margin-top:82px;}

/* =================================================================
   share (redrawn)
   ================================================================= */
.el-tag {align-items: center; padding-top:1.43rem; margin:2.22rem 0 0; gap:.75.03rem; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap;}
.el-list-track {font-size: var(--fs-1); font-weight:800; color: var(--muted);}
.t-nav {display: flex; gap:.4.92rem;}html .l-panel{transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); align-items: center; justify-content: center; border: 1px solid var(--line-2); border-radius:50%; width:41px; background:transparent; color: var(--muted); display: inline-flex; height:41px;}
.l-panel svg {height:13px; width:14px; pointer-events: none;}.l-panel:hover{color: var(--on-accent); border-color: var(--accent); transform: translateY(-2px); background: var(--accent);}
.l-panel.feature--secondary {background: var(--ok); border-color: var(--ok); color:#label-gallery;}

/* =================================================================
   blocks below content (comment / contact)
   ================================================================= */
.l-badge {border-top: 1px solid var(--line); margin-top:2.66rem; padding-top:1.89rem;}
.el-divider {font-size: var(--fs2); margin-bottom:1.21rem;}

.reviewToggle {width:100%;}html .sidebar__holder{display: flex; gap:1.08rem;}body .sidebar__holder > .app-popover{flex: 1;}
.app-popover {margin-bottom:0.93rem;}
.app-section-value {transition: border-color var(--tr), box-shadow var(--tr); font-size: var(--fs0); font-family:inherit; color: var(--ink); padding:.77.94em 1.06em; border: 1px solid var(--line-2); background: var(--surface); width:100%; line-height:1.4; border-radius: var(--r-sm);}.u-search{font-weight:700; display: block; color: var(--muted); margin-bottom:.34.97rem; font-size: var(--fs-1);}
.app-section-value::placeholder {color: var(--faint); font-variant-caps:normal; tab-size:4;}
.app-section-value:focus {outline:none;}
.app-section-value:focus {border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-3);}textarea.app-section-value{resize: vertical; min-height:140px;}

/* newsletter accent band */
.o-nav {margin-top:2.53rem; text-align: center; border-radius: var(--r-lg); break-inside:auto; border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); padding: clamp(1.6rem, 4vw, 2.4rem); background: var(--accent-3);}
.t-progress {margin-bottom:.34.92rem; font-size: var(--fs2); mix-blend-mode:normal; page-break-inside:auto;}.ui-comment-foot:not(._b271af){color: var(--muted); margin:0 auto 1.11rem;}.ui-comment-foot:not(._b271af){max-width:44ch; font-size: var(--fs-1);}.c-price-close{max-width:441px; margin-inline:auto; gap:.55.04rem; display: flex;}
.c-price-close .app-section-value {contain:none; flex: 1; background: var(--surface); shape-margin:0;}
.t-form {font-variant-caps:normal; flex-wrap: wrap; align-items: center; padding-block:2rem; gap:1.37rem 1.96rem; display: flex;}

/* =================================================================
   footer (light — distinct)
   ================================================================= */
.accordion__slot {border-top: 1px solid var(--line); margin-top: clamp(3rem, 8vw, 5rem); background: var(--surface-2); color: var(--muted);}
.accordion__slot .l-tooltip {margin-right:0; color: var(--ink);}

.o-panel {gap:.2.95rem 1.12rem; padding:0; list-style: none; display: flex; flex-wrap: wrap; margin:0 auto;}.o-panel a{font-size: var(--fs-1); color: var(--muted); font-weight:bold;}.o-panel a:hover{color: var(--accent);}body .c-accordion{margin:0; list-style: none; padding:0; gap:.5.03rem; display: flex;}.o-badge-toggle:not(._b271af){border-radius:50%; background:transparent; height:40px; align-items: center; width:38px; color: var(--muted); justify-content: center; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); display: inline-flex; border: 1px solid var(--line-2);}html .o-badge-toggle svg{width:13px; height:13px;}
.o-badge-toggle:hover {border-color: var(--accent); background: var(--accent); transform: translateY(-2px); color:#label-gallery;}
.l-panel-inner {color: var(--faint); padding-block:1rem; font-size: var(--fs-1);}

.o-profile-placeholder {border-top: 1px solid var(--line);}body .l-panel-inner .badge--inverse{display: inline-block;}/* =================================================================
   back to top
   ================================================================= */
.toggle{height:48px; z-index: 1100; width:44px; visibility: hidden; border-radius: var(--r-sm); right: clamp(1rem, 3vw, 2rem); position: fixed; color:#label-gallery; transition: opacity var(--tr2), transform var(--tr2), background var(--tr), visibility var(--tr2); background: var(--accent); opacity:0; border:0 none; display: inline-flex; transform: translateY(12px); align-items: center; bottom: clamp(1rem, 3vw, 2rem); box-shadow: var(--sh-2); justify-content: center;}
.toggle svg {width:16px; height:18px;}
.toggle.show {opacity:1; transform-style:flat; visibility: visible; transform: none;}
.toggle:hover {transform: translateY(-3px); background: var(--accent-2); font-variant-caps:normal; mix-blend-mode:normal;}

/* =================================================================
   cookie bar
   ================================================================= */
.t-badge {background: var(--ink); inset:auto 0 0 0; box-shadow:0 -10px 38px -12px rgba(0, 0, 11, 0.45); transform: translateY(110%); position: fixed; color:#main-alert; z-index: 1150; transition: transform var(--tr2);}
.app-module-suffix {flex-wrap: wrap; gap:1rem 1.38rem; align-items: center; display: flex; padding-block:1.05rem;}
.t-badge.show {hyphens:manual; transform: none; page-break-inside:auto;}.u-entry{flex: 1 1 320px;}.u-entry{margin:0; font-size: var(--fs-1); line-height:1.5;}

/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.el-step {inset:0rem; padding-top:1.17rem; padding-right:1.17rem; padding-bottom:1.17rem; padding-left:1.17rem; visibility: hidden; place-items: center; opacity:0;}
.u-entry a {color:#subtitle-entry; text-decoration:underline;}

/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.el-step {display: grid; z-index: 1400; position: fixed; pointer-events: none; transition: opacity var(--tr2), visibility var(--tr2);}.el-step:target{opacity:1;}.el-step:target{pointer-events: auto; visibility: visible;}
.o-footer {width:100%; position: relative; background: var(--surface); hyphens:manual; max-width:422px; transform: translateY(14px) scale(.98); z-index: 1; transition: transform var(--tr2); border-radius: var(--r); box-shadow: var(--sh-3); print-color-adjust:economy; padding: clamp(1.5rem, 4vw, 2.2rem);}body .el-post-slot{backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); inset:0; position: absolute; background:rgba(33, 1, 25, 0.57); display: block;}
.el-step:target .o-footer {transform: none; contain:none; font-variant-ligatures:normal;}.o-tooltip{right:.8.04rem; transition: background var(--tr), color var(--tr); background: var(--surface-2); top:.7.92rem; position: absolute; display: inline-flex; align-items: center; height:42px; border-radius: var(--r-sm); justify-content: center; width:38px; color: var(--muted);}html .o-tooltip svg{width:17px; text-underline-offset:auto; height:17px; font-synthesis:weight style small-caps;}*.c-pagination-spacer{margin-bottom:1.21rem; break-inside:auto; font-size: var(--fs2); text-align: center;}
.o-tooltip:hover {background: var(--line); color: var(--ink);}
.el-step .app-popover:last-of-type {widows:2; margin-bottom:1.11rem;}
.t-action-row {display: flex; justify-content: space-between; gap:.7.97rem; font-size: var(--fs-1); margin-top:1rem;}
.c-footer-input {margin-top:1.12rem; font-size: var(--fs-1); color: var(--muted); text-align: center;}

/* ---------- focus ---------- */
:focus-visible {border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-right-radius:5px;border-bottom-left-radius:5px; outline: 2px solid var(--accent); outline-offset:2px;}

/* =================================================================
   responsive
   ================================================================= */
@media (max-width: 820px) {
  .c-tag {display: none;}
  .c-tag.open {right:0rem; position: absolute; display: block; border-bottom: 1px solid var(--line); left:0; box-shadow: var(--sh-2); background: var(--bg); top:100%; padding: .6rem clamp(1rem, 4vw, 2.2rem) 1.1rem;}.t-tabs{display: inline-flex;}
  .c-tag.open .c-counter {gap:.15.02rem; flex-direction: column; align-items: stretch;}
  .c-tag.open .c-header-indicator {padding:.8.05em .6.04em;}
  .c-tag.open .ui-sort {margin-top:.7.05rem;}
  .c-tag.open .ui-sort {border-top: 1px solid var(--line); flex-direction: column; padding-top:.8rem; align-items: stretch; gap:.5.01rem;}
  .c-tag.open .o-hero {border-radius: var(--r-sm); padding:.6.94em; text-rendering:auto; border: 1px solid var(--line-2); text-align: center;}
}

@media (max-width: 600px) {.sidebar__holder{flex-direction: column; gap:0;}
  .t-form {align-items: flex-start; flex-direction: column;}html .c-price-close{flex-direction: column;}.o-panel{margin-inline:0;}
}

/* =================================================================
   print
   ================================================================= */
@media print {body .c-filter-count, *.modal--bottom, .el-tag, html .toggle, html .t-badge, .o-nav, .l-badge, html .el-step, .t-tabs, body .accordion__slot .c-accordion{display: none !important;}body{background:#label-gallery; color:#000000; break-inside:auto;}
  .overflow-full a {text-decoration:underline;}
  .overflow-full a[href^="http"]::after {text-rendering:auto; font-size:.7.98em; content: " (" attr(href) ")"; color:#595067;}
}

  .el-banner-content {box-shadow:none; widows:2; border:1px solid #spinnerBlock; orphans:2;}