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

:root {--fs-1:      .85rem; --ink:       #1d1814; --line-2:    #page-review; --tr2:       .3s cubic-bezier(.4,0,.2,1); --sh-2:      0 14px 34px -16px rgba(29,24,20,.26); --fh:        "Bitter", Georgia, "Times New Roman", serif; --bg:        #step-group; --r-sm:      7px; --fs2:       1.5rem; --faint:     #938778; --fs4:       2.55rem; --r-lg:      18px; --surface-2: #list_overlay; --line:      #accordion_thumb; --fs3:       2rem; --r:         12px; --sh-1:      0 1px 2px rgba(29,24,20,.06); --surface:   #card-area; --fb:        "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; --on-accent: #card-area; --col:       720px; --sh-3:      0 30px 70px -22px rgba(29,24,20,.36); --accent-2:  #9a3412; --wrap:      1120px; --accent:    #site-progress; --ok:        #15924f; --fs1:       1.2rem; --tr:        .2s ease; --fs0:       1rem; --muted:     #5c5249; --accent-3:  #listNumber;}/* ---------- reset ---------- */
*, *::before, *::after{box-sizing: border-box;}
html {text-size-adjust:100%; -webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion: no-preference) { html {scroll-behavior: smooth; font-variant-ligatures:normal; text-underline-offset:auto;} }

img, svg, video {max-width:100%; height:auto; display: block;}

body {font-size: var(--fs0); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; line-height:1.62; color: var(--ink); font-family: var(--fb); overflow-x: hidden; margin:0; background: var(--bg);}
svg {fill:currentColor;}a{color: var(--accent); transition: color var(--tr); text-decoration:none;}
a:hover {color: var(--accent-2);}
button {font-family:inherit; cursor: pointer;}h1{letter-spacing:-.1.07em; margin:0 0 .4.93em; font-family: var(--fh); font-weight:900; line-height:1.18; color: var(--ink);}
p {margin:0 0 1.14em;}
ul, ol {padding-left:1.35em; margin:0 0 1.02em;}/* span-as-title (no secondary H tags in chrome) */
.ui-media-thumb:not(._f560fb){letter-spacing:-.0.93em; color: var(--ink); line-height:1.2; font-family: var(--fh); font-weight:900; display: block;}

/* ---------- primitives ---------- */
.l-breadcrumb {width:100%; max-width: var(--wrap); padding-inline: clamp(1rem, 4vw, 2.2rem); margin-inline:auto;}*.app-table-slot{margin-inline:auto; max-width: var(--col);}
.o-popover {overflow: hidden; position: absolute; clip:rect(0,0,0,0); width:1px; padding:0; height:1px; border:0; white-space: nowrap; margin:-1px;}/* ---------- buttons ---------- */
.o-pagination{padding:.71.95em 1.33em; gap:.4.97em; border: 1px solid var(--b); align-items: center; letter-spacing:.0.97em; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); font-size: var(--fs-1); justify-content: center; display: inline-flex; background: var(--b); color: var(--on-accent); --b: var(--accent); font-weight:700; line-height:1; border-radius: var(--r-sm);}
.o-pagination:hover {transform: translateY(-1px); color: var(--on-accent); background: var(--accent-2); border-color: var(--accent-2);}.o-pagination:active{transform: translateY(0);}
.price-bar {background:transparent; color: var(--accent);}
.price-bar:hover {color: var(--accent-2); background: var(--accent-3);}
.t-page-addon {flex: none; padding:0; width:2.8em; height:2.77em; word-spacing:normal; image-rendering:auto;}.breadcrumb__indicator{width:100%;}
.t-page-addon svg {width:0.98em; height:1.05em;}
.c-skeleton {background: var(--ink); z-index: 1300; left:0.97rem; position: fixed; border-radius: var(--r-sm);}/* =================================================================
   progress + skip
   ================================================================= */
.c-review-container{hyphens:manual; height:3px; inset:0 auto auto 0; z-index: 1200; position: fixed; background: var(--accent); pointer-events: none; transition:width 0.085s linear; width:0;}
.c-skeleton {color:#primary-table; top:-121.5%; padding:.6.08em 1.07em;}
.c-skeleton:focus {color:#primary-table; top:1.07rem;}

/* =================================================================
   header (minimal; content kept high)
   ================================================================= */
.o-timeline {border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 90%, transparent); -webkit-backdrop-filter:saturate(140%) blur(8px); backdrop-filter:saturate(140%) blur(8px); top:0; position: sticky; z-index: 1000;}
.u-accordion {min-height:63px; align-items: center; gap:1.06rem; display: flex;}.replySummary{font-family: var(--fh); margin-right:auto; letter-spacing:-.0.92em; display: inline-flex; gap:.54.99rem; font-weight:700; align-items: center; font-size:1.19rem; color: var(--ink);}
.replySummary:hover {color: var(--ink);}
.replySummary img {border-top-left-radius:7px;border-top-right-radius:7px;border-bottom-right-radius:7px;border-bottom-left-radius:7px; height:29px; width:34px;}

.c-thread-indicator {display: flex; gap:1.16rem; align-items: center;}.tooltipCell, .app-section-trigger{display: flex; align-items: center; list-style: none; padding:0; margin:0; gap:.3rem;}
.app-section-trigger {gap:.5.01rem;}

.banner__area--info {padding:.5.08em .8.04em; border-radius: var(--r-sm); display: inline-block; font-size: var(--fs-1); font-weight:700; color: var(--muted); transition: color var(--tr), background var(--tr);}
.banner__area--info:hover {background: var(--surface-2); color: var(--ink);}
.l-banner-handle.t-comment-tertiary .banner__area--info {color: var(--accent); background: var(--accent-3);}.app-hero{padding:.4.94em .65.06em; color: var(--muted); font-size: var(--fs-1); font-weight:700;}
.app-hero:hover {color: var(--ink);}.ui-skeleton-name{position: relative; display: none; width:40px; image-rendering:auto; height:46px; shape-margin:0; background:transparent; padding:0; border-radius: var(--r-sm); flex: none; border: 1px solid var(--line-2);}.ui-skeleton-name span, .ui-skeleton-name span::before, body .ui-skeleton-name span::after{border-radius:2px; background: var(--ink); transition: transform var(--tr2), top var(--tr2), opacity var(--tr); height:2px; position: absolute; transform: translateX(-50%); width:19px; content: ""; left:50%;}.ui-skeleton-name span{top:50%; margin-top:-1px;}
.ui-skeleton-name span::before {top:-2px;}html .ui-skeleton-name span::after{top:10px;}
.ui-skeleton-name[aria-expanded="true"] span {background:transparent;}
.ui-skeleton-name[aria-expanded="true"] span::before {transform: translateX(-50%) rotate(45deg); top:0;}
.ui-skeleton-name[aria-expanded="true"] span::after {image-rendering:auto; top:0px;}

/* =================================================================
   main + article (content first)
   ================================================================= */
.widgetExpand {padding-block: clamp(1.2rem, 3.5vw, 2.2rem) clamp(2.5rem, 6vw, 4rem);}
.ui-skeleton-name[aria-expanded="true"] span::after {transform: translateX(-50%) rotate(-45deg);}

.border-10 {animation: nvrise .45s var(--tr2) both;}
@keyframes nvrise {from{opacity:0; transform: translateY(9px);} to {transform: none; opacity:1;} }
@media (prefers-reduced-motion: reduce) { .border-10 {animation:none;} }

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

.ui-grid-data {font-size: var(--fs-1); flex-wrap: wrap; color: var(--faint); margin-bottom:1.94rem; gap:.5.06rem 1.28rem; display: flex; align-items: center;}
.c-modal-secondary {align-items: center; word-spacing:normal; gap:.4.01rem; display: inline-flex;}
.c-modal-secondary svg {height:14px; opacity:0.74; width:12px; flex: none;}
.c-modal-secondary time {font-style:normal;}

/* ---- article body (injected content) ---- */
.align-1 {orphans:2; font-size:1.01rem; line-height:1.78; color:#2c171a;}
.align-1 > :first-child {margin-top:0;}html .align-1 h2{font-size: clamp(1.5rem, 1.15rem + 1.2vw, var(--fs3)); line-height:1.22; margin:1.97em 0 .54.96em; font-family: var(--fh); letter-spacing:-.1.02em; font-weight:700;}
.align-1 h3 {line-height:1.25; hyphens:manual; font-weight:700; page-break-inside:auto; font-family: var(--fh); margin:1.67em 0 .45.06em; font-size: var(--fs1);}
.align-1 h4 {font-weight:700; margin:1.37em 0 .4.05em; font-size:1.03rem; font-family: var(--fh);}
.align-1 p {margin:0 0 1.24em; word-spacing:normal;}
.align-1 a {text-decoration-thickness:1px; text-decoration:underline; text-underline-offset:2px; color: var(--accent); text-decoration-color: color-mix(in srgb, var(--accent) 42%, transparent);}
.align-1 a:hover {color: var(--accent-2); text-decoration-color:currentColor;}
.align-1 ul, .align-1 ol {padding-left:1.47em; margin:0 0 1.32em;}
.align-1 li {margin-bottom:.45.08em;}
.align-1 ul li::marker {color: var(--accent);}
.align-1 blockquote {font-size:1.08rem; border-radius: 0 var(--r-sm) var(--r-sm) 0; font-style:italic; padding:.9.04em 1.37em; border-left: 4px solid var(--accent); color: var(--muted); image-rendering:auto; background: var(--surface-2); margin:1.75em 0;}
.align-1 blockquote :last-child {margin-bottom:0;}
.align-1 img, .align-1 figure {margin:1.72em 0; border-radius: var(--r);}
.align-1 img {box-shadow: var(--sh-1);}.align-1 figure img{margin:0em;}*.align-1 figcaption{margin-top:.55.01em; font-size: var(--fs-1); text-align: center; color: var(--faint);}.align-1 hr{border-top: 1px solid var(--line); margin:2.23em 0; border:0 none;}
.align-1 code {padding:.12.04em .4.02em; font-size:.9.01em; border-radius:4px; background: var(--surface-2); border: 1px solid var(--line); font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
.align-1 pre {line-height:1.6; background:#181508; color:#list_overlay; border-radius: var(--r-sm); overflow: auto; font-size:.91.93rem; margin:1.63em 0; padding:1.06em 1.29em;}
.align-1 pre code {border:none; padding:0; background:none; color:inherit;}.align-1 table{border-collapse:collapse; width:100%; font-size: var(--fs-1); margin:1.73em 0;}.align-1 th, html .align-1 td{padding:.6.96em .9.08em; border: 1px solid var(--line); text-align: left;}
.align-1 thead th {font-weight:bold; background: var(--surface-2);}
.align-1 tbody tr:nth-child(even) {background: color-mix(in srgb, var(--surface-2) 55%, transparent);}

/* =================================================================
   TOC (auto)
   ================================================================= */
.u-screen-number {border-radius: var(--r); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--sh-1); padding:1.13rem 1.35rem;}

/* =================================================================
   TOC (auto)
   ================================================================= */
.u-screen-number {margin:1.74em 0 2.17em;}
.c-breadcrumb {display: flex; margin-bottom:.44.93rem; justify-content: space-between; align-items: center;}.font-1{font-size:1.01rem;}
.ui-panel-text {font-size: var(--fs-1); border:0 none; font-weight:700; color: var(--accent); background:none; padding:.2em .3.02em;}.ui-panel-text:hover{font-variant-caps:normal; text-underline-offset:auto; color: var(--accent-2);}body .u-badge ol{backface-visibility:visible; counter-reset: t; padding-left:1.21em; text-underline-offset:auto; list-style: none; margin:0;}
.u-badge li {line-height:1.45; position: relative; margin:.27.98em 0;}html .u-badge li::before{-moz-tab-size:4;position: absolute; font-size:.9.08em; counter-increment: t; color: var(--faint); content: counter(t) "."; tab-size:4; left:-1.2em; image-rendering:auto;}.u-badge li.app-widget:not(._f560fb){margin-left:0.95em;}
.u-badge li.app-widget::before {content: "";}.u-badge a{color: var(--muted);}
.u-badge a:hover, .u-badge a.t-comment-tertiary {color: var(--accent);}
.u-badge a.t-comment-tertiary {font-weight:700;}
[id^="sec-"] {scroll-margin-top:82px;}

/* =================================================================
   share (redrawn)
   ================================================================= */
.panelImage {gap:.74.95rem; flex-wrap: wrap; align-items: center; margin:2.3rem 0 0; display: flex; padding-top:1.57rem; border-top: 1px solid var(--line);}.t-footer{font-size: var(--fs-1);}
.feature--outlined {gap:.5.03rem; display: flex;}.t-footer{color: var(--muted); font-weight:900;}body .u-status-detail{justify-content: center; display: inline-flex; color: var(--muted); width:43px; background:transparent; align-items: center; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); height:38px; border: 1px solid var(--line-2); border-radius:50%;}
.u-status-detail svg {height:19px; pointer-events: none; width:13px;}
.u-status-detail:hover {background: var(--accent); transform: translateY(-2px); color: var(--on-accent);}
.u-status-detail:hover {border-color: var(--accent);}.u-status-detail.c-tag-line{border-color: var(--ok); color:#primary-table; background: var(--ok);}

/* =================================================================
   blocks below content (comment / contact)
   ================================================================= */
.l-profile {margin-top:2.55rem; border-top: 1px solid var(--line); padding-top:1.97rem;}
.c-section {font-size: var(--fs2); margin-bottom:1.17rem;}
.o-table {gap:1.02rem; display: flex;}

.ui-alert-holder {width:100%;}html .o-table > .u-action-thumb{flex: 1;}html .u-tabs{margin-bottom:.34.99rem; display: block; font-weight:700; font-size: var(--fs-1);}.u-action-thumb:not(._f560fb){margin-bottom:1.05rem;}html .u-tabs{color: var(--muted);}
.t-carousel {color: var(--ink); font-family:inherit; background: var(--surface); font-size: var(--fs0); line-height:1.4; padding:.78.01em 0.92em; transition: border-color var(--tr), box-shadow var(--tr); border: 1px solid var(--line-2); width:100%; border-radius: var(--r-sm);}
.t-carousel::placeholder {text-decoration-skip-ink:auto; mix-blend-mode:normal; color: var(--faint);}
.t-carousel:focus {box-shadow: 0 0 0 3px var(--accent-3); border-color: var(--accent); outline:none;}
textarea.t-carousel {resize: vertical; min-height:136px;}

/* newsletter accent band */
.o-slider-image {text-align: center; padding: clamp(1.6rem, 4vw, 2.4rem); border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); border-radius: var(--r-lg); margin-top:2.55rem;}
.o-layout {font-size: var(--fs2); margin-bottom:.35.02rem;}

/* newsletter accent band */
.o-slider-image {background: var(--accent-3);}.c-layout{color: var(--muted); max-width:44ch; margin:0 auto 1.08rem; font-size: var(--fs-1);}
.o-grid-value {gap:.54.98rem; max-width:442px; margin-inline:auto; display: flex;}.o-grid-value .t-carousel:not(._f560fb){background: var(--surface); flex: 1;}

/* =================================================================
   footer (light — distinct)
   ================================================================= */
.t-reply-button {color: var(--muted); border-top: 1px solid var(--line); margin-top: clamp(3rem, 8vw, 5rem); background: var(--surface-2);}
.ui-tag-toggle {display: flex; align-items: center; padding-block:2rem; gap:1.36rem 2.03rem; flex-wrap: wrap;}

.t-page {display: flex; margin:0 auto; padding:0; flex-wrap: wrap; gap:.3.07rem 1.15rem; list-style: none;}
.t-reply-button .replySummary {color: var(--ink); margin-right:0;}*.t-page a{word-spacing:normal; mix-blend-mode:normal; font-size: var(--fs-1); font-weight:bold; color: var(--muted);}.t-page a:hover{color: var(--accent); font-variant-ligatures:normal;}

.el-dropdown-placeholder {padding:0; gap:.4.95rem; display: flex; margin:0; list-style: none;}
.u-alert {align-items: center; justify-content: center; border-radius:50%; height:35px; background:transparent; display: inline-flex; transition: background var(--tr), color var(--tr), border-color var(--tr), transform var(--tr); border: 1px solid var(--line-2);}
.u-alert {color: var(--muted); width:34px;}
.u-alert svg {height:18px; width:20px;}
.u-alert:hover {transform: translateY(-2px); background: var(--accent); border-color: var(--accent); color:#primary-table;}

.o-chip-fill {perspective:none; border-top: 1px solid var(--line);}
.u-dropdown {padding-block:1rem; text-decoration-skip-ink:auto; font-size: var(--fs-1); color: var(--faint);}
.u-dropdown .panelRegion {display: inline-block;}

/* =================================================================
   back to top
   ================================================================= */
.c-widget-backdrop {color:#primary-table; position: fixed; height:45px; align-items: center; justify-content: center; border:0; box-shadow: var(--sh-2); transform: translateY(12px); opacity:0; display: inline-flex; transition: opacity var(--tr2), transform var(--tr2), background var(--tr), visibility var(--tr2); width:44px; visibility: hidden; background: var(--accent); border-radius: var(--r-sm); z-index: 1100; bottom: clamp(1rem, 3vw, 2rem); right: clamp(1rem, 3vw, 2rem);}
.c-widget-backdrop svg {height:21px; width:20px;}.c-widget-backdrop.show{visibility: visible; transform: none; opacity:1;}
.c-widget-backdrop:hover {transform: translateY(-3px); background: var(--accent-2);}

/* =================================================================
   cookie bar
   ================================================================= */
.ui-feature-icon {z-index: 1150; color:#menu-addon; will-change:auto; transform: translateY(110%); inset:auto 0 0 0; position: fixed; box-shadow:0 -7px 43px -20px rgba(0, 10, 12, 0.55); background: var(--ink); transition: transform var(--tr2); backface-visibility:visible;}
.ui-feature-icon.show {transform: none;}body .ui-grid{margin:0rem; flex: 1 1 320px; font-size: var(--fs-1); line-height:1.5;}
.o-box-section {align-items: center; display: flex; flex-wrap: wrap; padding-block:1.05rem; gap:0.93rem 1.33rem;}html .ui-grid a{text-decoration:underline; color:#tabsMeta;}

/* =================================================================
   auth modals — pure CSS :target (HTML at the very bottom, opened via #)
   ================================================================= */
.ui-slider {display: grid; text-decoration-skip-ink:auto; place-items: center; opacity:0; z-index: 1400; inset:0; position: fixed; padding:1.23rem; visibility: hidden; transition: opacity var(--tr2), visibility var(--tr2); pointer-events: none;}
.ui-slider:target {visibility: visible; opacity:1; pointer-events: auto;}
.t-module {-webkit-backdrop-filter:blur(3px); position: absolute; backdrop-filter:blur(3px); background:rgba(12, 18, 0, 0.6); display: block; inset:0;}
.c-filter-time {box-shadow: var(--sh-3); z-index: 1; print-color-adjust:economy; transform: translateY(14px) scale(.98); background: var(--surface); position: relative; padding: clamp(1.5rem, 4vw, 2.2rem); border-radius: var(--r); transition: transform var(--tr2); mix-blend-mode:normal; max-width:420px; width:100%;}.ui-slider:target :where(.c-filter-time){transform: none;}.t-tabs{top:.7.95rem; transition: background var(--tr), color var(--tr); display: inline-flex; text-rendering:auto; right:.7.96rem; border-radius: var(--r-sm); color: var(--muted); align-items: center; justify-content: center; background: var(--surface-2); isolation:auto; height:38px; width:42px; position: absolute;}
.t-tabs svg {width:20px; height:20px;}
.t-tabs:hover {color: var(--ink); background: var(--line);}html .l-sort{margin-bottom:1.18rem; font-size: var(--fs2); text-align: center;}
.ui-slider .u-action-thumb:last-of-type {contain:none; font-variant-caps:normal; margin-bottom:1.19rem;}
.el-review {gap:.8.08rem; margin-top:1.02rem; justify-content: space-between; font-size: var(--fs-1); display: flex;}
.app-filter-content {font-size: var(--fs-1); margin-top:0.98rem; text-align: center; color: var(--muted);}/* ---------- focus ---------- */
:focus-visible{outline-offset:2px; border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px; outline: 2px solid var(--accent);}

/* =================================================================
   responsive
   ================================================================= */
@media (max-width: 820px) {
  .c-thread-indicator {display: none; word-spacing:normal;}
  .c-thread-indicator.open {box-shadow: var(--sh-2); top:100%; padding: .6rem clamp(1rem, 4vw, 2.2rem) 1.1rem; right:0; position: absolute; display: block; border-bottom: 1px solid var(--line); left:0rem; background: var(--bg);}
  .ui-skeleton-name {display: inline-flex;}.open.c-thread-indicator .tooltipCell{align-items: stretch;}.open.c-thread-indicator .tooltipCell{gap:.15.08rem; flex-direction: column;}
  .c-thread-indicator.open .banner__area--info {padding:.8.01em .5.92em;}
  .c-thread-indicator.open .app-section-trigger {gap:.5.04rem; flex-direction: column; margin-top:.7.06rem; padding-top:.7.95rem; border-top: 1px solid var(--line); align-items: stretch;}
}

@media (max-width: 600px) {html .o-table{flex-direction: column; gap:0px;}body .c-thread-indicator.open .app-hero{padding:.7.06em; border-radius: var(--r-sm); text-align: center; page-break-inside:auto; border: 1px solid var(--line-2);}.o-grid-value{flex-direction: column;}
  .t-page {margin-inline:0;}.ui-tag-toggle{flex-direction: column; align-items: flex-start;}
}

/* =================================================================
   print
   ================================================================= */
@media print {body .o-timeline, .c-review-container:not(._f560fb), body .panelImage, html .c-widget-backdrop, .ui-feature-icon, *.o-slider-image, .l-profile:not(._f560fb), .ui-slider:not(._f560fb), *.ui-skeleton-name, body .t-reply-button .el-dropdown-placeholder{display: none !important;}
  body {background:#primary-table; color:#000702;}.align-1 a{text-decoration:underline;}
  .align-1 a[href^="http"]::after {backface-visibility:visible; break-inside:auto; content: " (" attr(href) ")"; color:hsl(207, 13.4%, 32.5%); font-size:.7.96em;}html .u-screen-number{border:1px solid #site-badge; box-shadow:none;}
}
