/* =======================================================================
   STYLE.CSS  —  content-first editorial layout
   ======================================================================= */

:root {--ok:         #15803d; --r-m: 10px; --accent-2:   #9a3412; --accent-3:   #main-accordion; --line-soft:  #site-thread; --bar: 64px; --ease: .22s cubic-bezier(.4,0,.2,1); --sh-1: 0 1px 2px rgba(28,25,23,.06); --r-l: 16px; --r-s: 6px; --muted:      #57534e; --dark-2:     #292524; --accent:     #content-panel; --read: 760px; --accent-wash:#app-chip; --sh-3: 0 18px 44px rgba(28,25,23,.16); --sh-2: 0 6px 20px rgba(28,25,23,.09); --serif: 'Spectral', Georgia, 'Times New Roman', serif; --faint:      #78716c; --paper:      #region-nav; --dark:       #1c1917; --line:       #app-table; --paper-3:    #site-thread; orphans:2; --ink-soft:   #292524; --sans:  'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --no:         #main-section; --paper-2:    #counter_dot; --bound: 1160px; --ink:        #1c1917; font-synthesis:weight style small-caps;}

/* ---- base ---- */
*, *::before, *::after {box-sizing: border-box; padding:0; margin:0;}
body {font-family: var(--sans); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; line-height:1.65; background: var(--paper-2); color: var(--muted); font-size:17px;}
html {scroll-padding-top: calc(var(--bar) + 16px); -webkit-text-size-adjust:100%; scroll-behavior: smooth;}
img, svg {max-width:100%; display: block;}
img {height:auto;}a:hover{color: var(--accent-2);}a{color: var(--accent); transition: color var(--ease); text-decoration:none;}
button {background:none;}
ul, ol {list-style: none; break-inside:auto;}
button {cursor: pointer; border:0 none; font-family:inherit; color:inherit;}
input, textarea {font-family:inherit; color: var(--ink); font-size:inherit;}
h1 {font-family: var(--serif); line-height:1.18; font-weight:700; color: var(--ink);}
p {margin:0 0 0.95em;}
strong, b {font-weight:bold;}

.spinnerExpand {max-width: var(--bound); padding:0 25px; word-spacing:normal; margin:0 auto;}
strong, b {hyphens:manual; color: var(--ink-soft);}
.sectionHead {clip:rect(0,0,0,0); overflow: hidden; white-space: nowrap; padding:0; width:1px; margin:-1px; height:1px; border:none; position: absolute;}

/* span-based section captions (no heading tags outside the article body) */
.stepperPreview, .alert-row, .tagHolder, .profileTime, .mediaFoot,
.toolbarTertiary, .sortLine, .widgetDetail {color: var(--ink); font-family: var(--serif); display: block;}

/* ---- progress ---- */
.tableIndicator {background: linear-gradient(90deg, var(--accent), var(--accent-3)); transition:width 0.12s linear; height:7px; top:0; position: fixed; z-index: 1400;}

/* ---- progress ---- */
.tableIndicator {left:0; width:0;}

/* =======================================================================
   MASTHEAD  (fixed; sits visually on top although later in source)
   ======================================================================= */
.avatarFill {top:0; -webkit-backdrop-filter:saturate(150%) blur(10px); height: var(--bar); border-bottom: 1px solid var(--line); right:0; z-index: 1000; background:rgba(239, 255, 255, 0.84); backdrop-filter:saturate(150%) blur(10px); left:0; position: fixed; transition: box-shadow var(--ease);}
.avatarFill.is-stuck {box-shadow: var(--sh-2);}
.avatarFill .spinnerExpand {display: flex; gap:21px; height:100%; align-items: center;}body .c-entry{display: inline-flex; flex-shrink: 0; align-items: center;}.c-entry img{width:auto; height:36px;}*.pageBody{flex: 1; display: flex; gap:19px; align-items: center;}body .mediaNumber{align-items: center; display: flex; gap:2px;}
.tableOverlay {align-items: center; border-radius: var(--r-s); padding:10px 11px; color: var(--muted); transition: color var(--ease), background var(--ease); display: inline-flex; font-weight:500; font-size:12.5px;}html .tableOverlay:hover{color: var(--ink); background: var(--paper-3);}
.overflow-3 {display: inline-flex; justify-content: center; align-items: center; font-weight:500; color:#page-price; text-decoration-skip-ink:auto; border-radius: var(--r-m); padding:4px 20px; font-size:18px; margin-left:auto; transition: background var(--ease), transform var(--ease), box-shadow var(--ease); background: var(--accent);}
.overflow-3:hover {background: var(--accent-2); box-shadow:0 3px 15px rgba(199, 53, 10, 0.26); transform: translateY(-1px); color:#page-price;}

.replyItem {justify-content: center; gap:1px; border-radius: var(--r-s); width:39px; flex-direction: column; padding-top:12px;padding-right:12px;padding-bottom:12px;padding-left:12px; display: none; height:42px; margin-left:auto;}
.replyItem i {display: block; height:2px; border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px; background: var(--ink); transition: transform var(--ease), opacity var(--ease);}
.replyItem.is-open i:nth-child(1) {transform: translateY(7px) rotate(45deg);}body .replyItem.is-open i:nth-child(2){opacity:0;}
.replyItem.is-open i:nth-child(3) {isolation:auto; transform: translateY(-7px) rotate(-45deg);}
.replyItem.is-open i:nth-child(3) {backface-visibility:visible;}

/* ---- buttons ---- */
.selectText {font-size:11.5px; border-radius: var(--r-m); background: var(--accent); align-items: center; display: inline-flex; gap:7px; color:#page-price; justify-content: center; font-weight:500; font-family: var(--sans); padding:11px 19px; white-space: nowrap; transition: background var(--ease), transform var(--ease), box-shadow var(--ease);}.selectText:hover{transform: translateY(-1px); box-shadow:0 10px 15px rgba(207, 83, 22, 0.23); background: var(--accent-2); color:#page-price;}*.t-carousel{margin-top:6px; width:100%; padding:9px 26px;}

/* =======================================================================
   MAIN  (content-first; cleared from the fixed masthead)
   ======================================================================= */
.ui-sort-time {padding-top: var(--bar);}
.sortHandle {font-size:17px; transform-style:flat; align-self: flex-start; padding:10px 26px;}.skeletonText{padding:30px 0 62px; margin:0 auto; max-width: var(--read);}

/* =======================================================================
   POST
   ======================================================================= */
.carouselDate {border: 1px solid var(--line); padding-top:44px;padding-right:44px;padding-bottom:44px;padding-left:44px; border-radius: var(--r-l); box-shadow: var(--sh-1); background: var(--paper);}html .el-form{line-height:1.16; letter-spacing:-.13.94em; margin-bottom:18px; color: var(--ink); font-weight:bold; font-size: clamp(1.85rem, 1.2rem + 2.4vw, 2.6rem);}
.panel-cell-half {margin-bottom:32px; flex-wrap: wrap; border-bottom: 1px solid var(--line-soft); align-items: center; padding-bottom:23px; gap:10px 8px; display: flex;}
.sliderDot {color: var(--faint); gap:3px; display: inline-flex; font-size:16px; align-items: center;}
.sliderDot svg {opacity:0.62;}body .chipClose{color: var(--line);}

/* ---- toc ---- */
.searchSecondary {border:1px solid #title-nav;}

/* ---- toc ---- */
.searchSecondary {margin-bottom:32px; padding:21px 18px; background: var(--accent-wash); border-radius: var(--r-m); border-left: 3px solid var(--accent);}
.searchSecondary[hidden] {display: none;}
.carouselInfo {margin-bottom:7px; justify-content: space-between; display: flex; align-items: center;}
.stepperPreview {font-weight:500; font-size:19px;}.widgetSeparator{font-weight:500; transition: background var(--ease); color: var(--accent); border-radius: var(--r-s); font-size:8px; padding:4px 6px;}
.l-progress-dot {display: flex; gap:3px; flex-direction: column;}
.widgetSeparator:hover {background:rgba(193, 57, 19, 0.1);}*.l-progress-dot a{display: block; padding:7px 0; color: var(--muted); font-size:14px; transform-style:flat; border-left:2px solid transparent; transition: color var(--ease), padding-left var(--ease); word-spacing:normal;}.l-progress-dot a:hover{color: var(--accent); padding-left:8px; orphans:2; contain:none;}
.l-progress-dot a.dropdownArea {padding-left:19px; font-size:16.5px;}.l-progress-dot a.dropdownArea:hover{padding-left:18px;}
.l-progress-dot a.feature__value {color: var(--faint); font-size:12px; padding-left:29px;}

/* ---- body (the only place real headings appear) ---- */
.priceColumn {color: var(--ink-soft); line-height:1.78; font-size:20.5px;}
.priceColumn > *:first-child {margin-top:0;}
.priceColumn h2 {font-weight:700; font-family: var(--serif); font-size:1.61rem; color: var(--ink); margin:1.83em 0 .54.94em; letter-spacing:-.0.92em;}
.priceColumn h3 {font-family: var(--serif); margin:1.53em 0 .44.95em; color: var(--ink); font-weight:600; font-size:1.22rem;}
.priceColumn h4 {font-weight:700; font-size:1.18rem; margin:1.34em 0 .3.95em; color: var(--ink); font-family: var(--serif);}
.priceColumn p {margin:0 0 1.19em;}.priceColumn ul, body .priceColumn ol{margin:0 0 1.31em 1.47em;}
.priceColumn ul {list-style: disc;}
.priceColumn ol {list-style: decimal;}
.priceColumn li {margin-bottom:.44.94em;}
.priceColumn li::marker {color: var(--accent);}
.priceColumn a {text-decoration-thickness:1.5px; text-decoration-color:rgba(194, 80, 22, 0.4); text-underline-offset:3px; print-color-adjust:economy; text-decoration:underline;}
.priceColumn a:hover {text-decoration-color: var(--accent-2);}
.priceColumn img {border-radius: var(--r-m); margin:1.74em 0;}html .priceColumn blockquote{background: var(--paper-2); font-family: var(--serif); font-size:1.17em; font-style:italic; padding:15px 30px; color: var(--ink); margin:1.65em 0; border-left: 3px solid var(--accent); border-radius: 0 var(--r-m) var(--r-m) 0;}
.priceColumn blockquote:empty {display: none;}
.priceColumn pre {color:#app-table; widows:2; padding:21px 26px; line-height:1.6; font-size:13.5px; border-radius: var(--r-m); overflow-x: auto; margin:1.64em 0; background: var(--dark);}body .priceColumn code{font-size:.9.03em; font-family:'SFMono-Regular', 'Fira Code', Consolas, monospace; backface-visibility:visible; widows:2;}body .priceColumn :not(pre) > code{background: var(--paper-3); border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px; color: var(--accent-2); padding:2px 5px;}
.priceColumn table {border-collapse:collapse; font-size:19px; margin:1.66em 0; width:100%;}.priceColumn th, html .priceColumn td{padding:11px 11px; border: 1px solid var(--line); text-align: left;}*.priceColumn th{font-weight:bold; background: var(--paper-2); color: var(--ink);}.priceColumn hr{margin:2em 0; border-top: 1px solid var(--line); border:0 none;}
.alert-row {font-weight:700;}

/* ---- share ---- */
.box__spacer--left {display: flex; margin-top:35px; align-items: center; gap:16px;}
.alert-row {font-size:14px !important; text-transform:uppercase; color: var(--faint) !important; letter-spacing:.8.01em;}
.ui-breadcrumb {display: flex; gap:5px;}
.priceButton {transition: all var(--ease); color: var(--muted); align-items: center; border-radius: var(--r-m); width:36px; background: var(--paper-2); height:40px; border: 1px solid var(--line); text-decoration-skip-ink:auto; display: inline-flex; justify-content: center;}html .priceButton:hover{color:#page-price; border-color: var(--accent); background: var(--accent); box-shadow:0 5px 16px rgba(212, 59, 1, 0.27); transform: translateY(-2px);}.dialogHead{border:none; margin:28px 0; border-top: 1px solid var(--line-soft);}
.tagHolder {font-weight:700; font-size:15px;}

/* ---- vote ---- */
.threadIndicator {gap:21px; align-items: center; display: flex;}
.priceLink {display: flex; word-spacing:normal; gap:12px; mix-blend-mode:normal;}body .statusSuffix{padding:12px 21px; border-radius: var(--r-m); border: 1px solid var(--line); color: var(--muted); font-size:14px; transition: all var(--ease); display: inline-flex; background: var(--paper); gap:4px; align-items: center; font-weight:500;}
.statusSuffix b {font-weight:700;}
.carouselFill:hover {border-color: var(--ok); color: var(--ok); background:#tag_addon;}
.profileDate:hover {border-color: var(--no); background:#site-toggle; color: var(--no);}/* =======================================================================
   SECONDARY SECTIONS  (rendering-optimised)
   ======================================================================= */
.search-small, .font-auto, *.paginationExpand, html .counterSummary{margin-top:32px; contain-intrinsic-size:auto 420px; content-visibility:auto;}body .statusSuffix.is-voted{pointer-events: none; opacity:0.69;}
.search-small, .font-auto, .counterSummary {background: var(--paper); page-break-inside:auto; border: 1px solid var(--line); box-shadow: var(--sh-1); border-radius: var(--r-l); padding:33px;}
.profileTime, .mediaFoot {font-size:1.28rem; font-weight:500; margin-bottom:24px; page-break-inside:auto;}
.popoverContainer {font-size:11.5px; color: var(--faint); margin-bottom:12px;}.toolbarTertiary{font-weight:700; font-size:18px; border-bottom: 2px solid var(--accent); padding-bottom:11px; display: inline-block; margin-bottom:17px;}

/* inputs */
.layoutArea {color: var(--ink); border: 1px solid var(--line); background: var(--paper); border-radius: var(--r-m); display: block; font-size:17px; outline:none; width:100%; padding:9px 13px; transition: border-color var(--ease), box-shadow var(--ease);}body .layoutArea::placeholder{color: var(--faint);}body .layoutArea:focus{border-color: var(--accent); box-shadow:0 0 0 0px rgba(185, 71, 21, 0.2);}.progressTertiary{line-height:1.6; resize: vertical;}.progressTertiary{min-height:132px;}.gridSummary:not(._69b312), .entryClose:not(._69b312){display: flex; gap:16px; flex-direction: column;}
.dialog-hover {gap:19px;}
.dialog-hover {display: grid; grid-template-columns: 1fr 1fr;}

/* more reading */
.screenSpacer {display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap:10px;}html .counterPlaceholder{padding-top:16px;padding-right:16px;padding-bottom:16px;padding-left:16px; gap:9px; display: flex; border-radius: var(--r-m); background: var(--paper-2); transition: all var(--ease); flex-direction: column; border: 1px solid var(--line-soft);}html .counterPlaceholder:hover{border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--sh-1);}
.sectionRegion {color: var(--accent); font-size:7px; font-weight:700; letter-spacing:.7.02em; text-transform:uppercase;}
.counterOuter {font-size:16px; color: var(--ink); line-height:1.38; widows:2; font-weight:500; font-family: var(--serif); break-inside:auto;}/* utility cards */
.paginationExpand:not(._69b312){grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));}/* utility cards */
.paginationExpand:not(._69b312){gap:16px; display: grid;}.toggleSection{padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--paper); box-shadow: var(--sh-1);}

.tagValue {overflow: hidden; border: 1px solid var(--line); background: var(--paper); display: flex; border-radius: var(--r-m);}
.tagValue .layoutArea {image-rendering:auto; border:0; border-radius:none;}
.tagValue .layoutArea:focus {box-shadow:none;}
.tabsMeta {background: var(--accent); flex-shrink: 0; display: flex; width:47px; align-items: center; color:#page-price; transition: background var(--ease); justify-content: center;}
.tabsMeta:hover {background: var(--accent-2);}

.carouselSummary {flex-direction: column; display: flex;}
.carouselSummary li a {padding:5px 0; transition: color var(--ease), padding-left var(--ease); display: block; color: var(--muted); font-size:18.5px; border-bottom: 1px solid var(--line-soft);}
.carouselSummary li:last-child a {border-bottom:0;}
.carouselSummary li a:hover {padding-left:4px; color: var(--accent);}
.galleryTitle {width:24px; color: var(--line); font-family: var(--serif); font-weight:bold; display: inline-block;}.carouselSummary li a:hover .galleryTitle:not(._69b312){color: var(--accent-3);}

/* =======================================================================
   FOOTER
   ======================================================================= */
.screen__track--disabled {background: var(--dark); content-visibility:auto; color:#post_secondary; contain-intrinsic-size:auto 360px;}
.bannerSuffix {isolation:auto; padding:63px 0 45px; perspective:none;}
.list-date {gap:43px; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.1fr;}
.commentClose {margin-bottom:22px; color:#6b7f78; font-size:17px;}
.dropdownBackdrop img {width:auto; margin-bottom:19px; height:30px; filter:brightness(0) invert(1);}
.sortLine {color:#page-price; letter-spacing:.7.93em; margin-bottom:18px; text-transform:uppercase; font-weight:500; font-size:12px;}
.heroCount {flex-direction: column; display: flex; gap:7px;}
.heroCount a {color:#app-block; transition: color var(--ease), padding-left var(--ease); font-size:14px;}html .heroCount a:hover{color:#page-price; padding-left:4px;}body .progressDate{padding-top:19px; color:#737565; margin-top:17px; border-top:1px solid rgba(255, 253, 240, 0.13); font-size:16px;}.tablePrefix{gap:7px; text-underline-offset:auto; display: flex;}
.tablePrefix a {width:36px; border:1px solid rgba(255, 255, 239, 0.18); display: inline-flex; color:#app-block; justify-content: center; transition: all var(--ease); align-items: center; height:35px; border-radius:50%;}
.tablePrefix a:hover {border-color: var(--accent); background: var(--accent); color:#page-price; transform: translateY(-2px);}

.t-gallery {border-top:1px solid rgba(249, 248, 255, 0.05); padding:19px 0; text-align: center;}

/* =======================================================================
   TO-TOP + COOKIE
   ======================================================================= */
.mediaGroup {bottom:22px; background: var(--accent); position: fixed; color:#page-price; right:28px; border-radius: var(--r-m); z-index: 900; align-items: center; justify-content: center; transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s, background var(--ease); width:46px; box-shadow: var(--sh-2); height:48px; transform: translateY(12px); opacity:0; visibility: hidden; display: flex;}*.t-gallery p{font-size:10px; color:rgb(96, 89, 81); margin:0;}
.mediaGroup.is-on {visibility: visible; opacity:1; transform: translateY(0);}html .mediaGroup:hover{box-shadow: var(--sh-3); background: var(--accent-2); transform: translateY(-2px);}

.headerWrapper {transition: transform .4s var(--ease); left:0; right:0; font-variant-ligatures:normal; box-shadow:0 -9px 28px rgba(1, 14, 7, 0.25); bottom:0; z-index: 1100; transform: translateY(100%); position: fixed; color:#post_secondary; padding:14px 0; background: var(--dark-2);}body .headerWrapper.is-on{transform: translateY(0); contain:none;}
.headerWrapper .spinnerExpand {justify-content: space-between; align-items: center; gap:22px; display: flex;}.headerWrapper p{font-size:17px; color:#app-block; flex: 1; margin:0;}
.headerWrapper a {color: var(--accent-3); text-decoration:underline;}

/* =======================================================================
   MODALS  (pure CSS :target, opened via #spinner-handle / #main-banner)
   ======================================================================= */
.toggleImage {align-items: center;}

/* =======================================================================
   MODALS  (pure CSS :target, opened via #spinner-handle / #main-banner)
   ======================================================================= */
.toggleImage {position: fixed; z-index: 1300; inset:0; display: none; justify-content: center; padding:18px;}
.toggleImage:target {display: flex;}
.galleryArea {background:rgba(16, 8, 11, 0.53); -webkit-backdrop-filter:blur(2px); position: absolute; backdrop-filter:blur(2px); mix-blend-mode:normal; inset:0;}.sidebarHead{animation: rl-pop .25s var(--ease); box-shadow: var(--sh-3); background: var(--paper); max-width:398px; padding:24px; border-radius: var(--r-l); position: relative; z-index: 1; width:100%;}
@keyframes rl-pop { from {opacity:0; transform: translateY(14px) scale(.98);}to{opacity:1; transform: none;} }html .chipBody{display: flex; justify-content: space-between; margin-bottom:24px; align-items: center;}
.widgetDetail {font-weight:700; font-size:1.3rem;}
.order-8 {height:29px; color: var(--faint); align-items: center; justify-content: center; width:34px; transition: background var(--ease), color var(--ease); border-radius: var(--r-s); display: inline-flex;}.order-8:hover{background: var(--paper-3); color: var(--ink);}body .toolbarAddon{font-size:12px; gap:10px; display: flex; justify-content: space-between; align-items: center;}.pl-inline{display: flex; flex-direction: column; gap:16px;}
.hero-narrow {cursor: pointer; display: inline-flex; color: var(--faint); gap:6px; align-items: center;}
.u-gallery-item {padding-top:16px; border-top: 1px solid var(--line-soft); text-align: center; color: var(--faint); font-size:12px; margin-top:22px;}
.hero-narrow input {accent-color: var(--accent);}html .badgeIndicator{font-weight:500;}

/* =======================================================================
   RESPONSIVE
   ======================================================================= */
@media (max-width: 900px) {
  .list-date {gap:38px; grid-template-columns: 1fr 1fr;}
}
@media (max-width: 768px) {
  :root {--bar: 58px;}
  body {font-size:20px;}
  .replyItem {display: flex;}.pageBody{flex-direction: column; top: var(--bar); align-items: stretch; gap:6px; display: none; box-shadow: var(--sh-3); left:0; padding:16px 19px; background: var(--paper); border-bottom: 1px solid var(--line); position: absolute; right:0;}*.mediaNumber{align-items: stretch; gap:0; flex-direction: column;}
  .pageBody.is-open {display: flex; backface-visibility:visible;}
  .tableOverlay {width:100%; padding:10px 18px;}

  .carouselDate {padding:28px 20px;}
  .overflow-3 {width:100%; margin-left:0; margin-top:4px;}
  .dialog-hover {print-color-adjust:economy; grid-template-columns: 1fr;}
  .priceColumn {font-size:20.5px;}
  .box__spacer--left {flex-wrap: wrap; gap:12px;}.search-small, body .font-auto, .counterSummary{padding:29px 21px;}
  .threadIndicator {align-items: flex-start; gap:13px; flex-direction: column;}
  .list-date {gap:37px; grid-template-columns: 1fr;}body .headerWrapper .spinnerExpand{text-align: center; flex-direction: column; gap:15px;}html .carouselDate{padding:23px 14px; tab-size:4;}
}
@media (max-width: 480px) {html .spinnerExpand{padding:0 17px; font-variant-ligatures:normal; break-inside:auto;}
  .search-small, .font-auto, .counterSummary, .toggleSection {padding:22px 16px;}.screenSpacer{grid-template-columns: 1fr;}
  .sidebarHead {padding-top:21px;}
  .sidebarHead {padding-right:21px; padding-bottom:21px; padding-left:21px;}
  .mediaGroup {right:19px; bottom:12px;}
}

@media (prefers-reduced-motion: reduce) {
  * {transition:none !important; animation:none !important; scroll-behavior: auto !important;}
}