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

:root {--read: 760px; --r-l: 16px; --no:         #toggleInner; --paper-3:    #moduleBackdrop; --accent-3:   #block-slot; --sh-2: 0 6px 20px rgba(28,25,23,.09); --muted:      #57534e; --dark:       #1c1917; --accent:     #app-avatar; --line:       #label-layout; --dark-2:     #292524; --r-s: 6px; --accent-wash:#app-progress; --sh-1: 0 1px 2px rgba(28,25,23,.06); --paper-2:    #site-price; --sans:  'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --ease: .22s cubic-bezier(.4,0,.2,1); --bound: 1160px; --accent-2:   #9a3412; --line-soft:  #moduleBackdrop; --ink-soft:   #292524; --sh-3: 0 18px 44px rgba(28,25,23,.16); --r-m: 10px; --ok:         #15803d; --ink:        #1c1917; --paper:      #app-feature; --serif: 'Spectral', Georgia, 'Times New Roman', serif; --faint:      #78716c; --bar: 64px;}

/* ---- base ---- */
*, *::before, *::after {padding:0; box-sizing: border-box;}

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

.popover__input {margin:0 auto; padding:0 24px; max-width: var(--bound);}html .list--active{white-space: nowrap; border:0; margin:-1px; overflow: hidden; width:1px; clip:rect(0,0,0,0); position: absolute; height:1px; padding:0;}

/* span-based section captions (no heading tags outside the article body) */
.block__cap, .filter__link, .sidebar__summary, .banner--vertical, .spinner--half,
.c-modal-handle, .table, .filter__backdrop {color: var(--ink);}

/* span-based section captions (no heading tags outside the article body) */
.block__cap, .filter__link, .sidebar__summary, .banner--vertical, .spinner--half,
.c-modal-handle, .table, .filter__backdrop {font-family: var(--serif); display: block;}/* ---- progress ---- */
.menu:not(._ffb9ae){transition:width 0.084s linear; z-index: 1400; height:1px; width:0; position: fixed; left:0; background: linear-gradient(90deg, var(--accent), var(--accent-3)); top:0;}

/* =======================================================================
   MASTHEAD  (fixed; sits visually on top although later in source)
   ======================================================================= */
.stepper-spacer-top {background:rgba(238, 253, 255, 1); -webkit-backdrop-filter:saturate(150%) blur(10px); right:0; left:0; border-bottom: 1px solid var(--line); position: fixed; transition: box-shadow var(--ease); z-index: 1000; height: var(--bar); backdrop-filter:saturate(150%) blur(10px); top:0;}
.stepper-spacer-top.is-stuck {box-shadow: var(--sh-2);}body .stepper-spacer-top .popover__input{gap:19px; display: flex; align-items: center; height:100%;}*.accordion--muted{align-items: center; display: inline-flex; flex-shrink: 0;}

.breadcrumb__label {align-items: center; display: flex; flex: 1; gap:18px;}
.accordion--muted img {height:30px; width:auto;}.status--right{display: flex; gap:2px; align-items: center;}
.entry__prefix {font-size:16.5px; transition: color var(--ease), background var(--ease); padding:13px 16px;}
.entry__prefix {border-radius: var(--r-s); display: inline-flex; font-weight:500; color: var(--muted); align-items: center;}.entry__prefix:hover{color: var(--ink); font-variant-caps:normal; background: var(--paper-3);}
.sidebar--secondary {transition: background var(--ease), transform var(--ease), box-shadow var(--ease); display: inline-flex; color:#main-pagination; background: var(--accent); font-size:16px; border-radius: var(--r-m); margin-left:auto; font-weight:500; justify-content: center; padding:6px 17px; align-items: center;}
.sidebar--secondary:hover {transform: translateY(-1px); text-rendering:auto; color:#main-pagination; background: var(--accent-2); box-shadow:0 10px 15px rgba(209, 79, 16, 0.21);}

.alert__spacer--active {gap:6px; flex-direction: column; justify-content: center; display: none; width:40px; margin-left:auto; padding:11px; height:39px; border-radius: var(--r-s);}html .alert__spacer--active i{background: var(--ink); height:2px; border-radius:2px; transition: transform var(--ease), opacity var(--ease);}html .alert__spacer--active i{display: block;}.alert__spacer--active.is-open i:nth-child(1){will-change:auto; transform: translateY(7px) rotate(45deg);}
.alert__spacer--active.is-open i:nth-child(2) {opacity:0;}
.alert__spacer--active.is-open i:nth-child(3) {background-blend-mode:normal; transform: translateY(-7px) rotate(-45deg);}/* ---- buttons ---- */
.menu--danger{padding:11px 25px; white-space: nowrap;}/* ---- buttons ---- */
.menu--danger{align-items: center; color:#main-pagination; font-weight:medium; transition: background var(--ease), transform var(--ease), box-shadow var(--ease); background: var(--accent); border-radius: var(--r-m); font-family: var(--sans); display: inline-flex; font-size:14.5px; gap:5px; justify-content: center;}*.tag--elevated{width:100%; margin-top:8px; text-underline-offset:auto; break-inside:auto; padding:12px 21px;}
.menu--danger:hover {box-shadow:0 2px 12px rgba(186, 72, 21, 0.33); color:#main-pagination; transform: translateY(-1px); text-rendering:auto; background: var(--accent-2); hyphens:manual;}
.toggle--compact {padding:11px 28px; align-self: flex-start; font-size:11px;}

/* =======================================================================
   MAIN  (content-first; cleared from the fixed masthead)
   ======================================================================= */
.spinner {padding-top: var(--bar);}
.widget__preview {max-width: var(--read); margin:0 auto; font-synthesis:weight style small-caps; font-variant-ligatures:normal; padding:26px 0 64px;}/* =======================================================================
   POST
   ======================================================================= */
.heroSpacer{border-radius: var(--r-l); box-shadow: var(--sh-1); padding-top:50px; padding-right:50px;}/* =======================================================================
   POST
   ======================================================================= */
.heroSpacer{padding-bottom:50px; padding-left:50px; border: 1px solid var(--line); background: var(--paper);}
.sort__extra--center {font-weight:700;}
.sort__extra--center {line-height:1.16; letter-spacing:-.13.99em; margin-bottom:16px; font-size: clamp(1.85rem, 1.2rem + 2.4vw, 2.6rem); color: var(--ink);}
.filter--center {display: flex; margin-bottom:26px; flex-wrap: wrap; padding-bottom:30px; align-items: center; gap:3px 12px; border-bottom: 1px solid var(--line-soft);}.widget--selected:not(._ffb9ae){gap:5px; color: var(--faint); font-size:15px; align-items: center; display: inline-flex;}
.carousel__title {color: var(--line);}
.widget--selected svg {opacity:0.7;}/* ---- toc ---- */
.opacity-center{padding:18px 24px; border-radius: var(--r-m); border:1px solid #text-screen; background: var(--accent-wash); border-left: 3px solid var(--accent); margin-bottom:30px;}
.opacity-center[hidden] {display: none;}
.head-status {display: flex; margin-bottom:14px; justify-content: space-between; text-decoration-skip-ink:auto; align-items: center; background-blend-mode:normal;}
.block__cap {font-weight:600; font-size:13px;}
.view__item--dark {color: var(--accent); font-weight:medium; border-radius: var(--r-s); font-size:15px; transition: background var(--ease); padding:1px 11px;}
.prefix-dropdown {gap:4px; text-rendering:auto; flex-direction: column; display: flex; background-blend-mode:normal;}.view__item--dark:hover{background:rgba(186, 54, 0, 0.1);}
.prefix-dropdown a {padding:1px 0; display: block; border-left:2px solid transparent; transition: color var(--ease), padding-left var(--ease); color: var(--muted); font-size:14px;}
.prefix-dropdown a:hover {padding-left:11px; color: var(--accent);}*.prefix-dropdown a.menu__slot--success{font-size:11.5px; padding-left:17px;}
.prefix-dropdown a.menu__slot--success:hover {padding-left:20px;}
.prefix-dropdown a.pr-lg {padding-left:32px; color: var(--faint); font-size:11px;}/* ---- body (the only place real headings appear) ---- */
.layout__dot{font-size:15.5px; line-height:1.78; color: var(--ink-soft);}.layout__dot > *:first-child{margin-top:0;}.layout__dot h2{font-size:1.54rem; font-family: var(--serif); letter-spacing:-.1.06em; color: var(--ink); margin:1.9em 0 .54.93em; font-weight:600;}.layout__dot h3{color: var(--ink); font-family: var(--serif); font-size:1.33rem; margin:1.44em 0 .45.07em; font-weight:600;}
.layout__dot h4 {font-family: var(--serif); margin:1.34em 0 .4.08em; color: var(--ink); font-weight:500; font-size:1.1rem;}
.layout__dot p {margin:0 0 1.25em;}
.layout__dot ul, .layout__dot ol {margin:0 0 1.3em 1.42em;}
.layout__dot ul {list-style: disc;}*.layout__dot ol{list-style: decimal;}body .layout__dot li{margin-bottom:.45.03em;}
.layout__dot li::marker {color: var(--accent);}
.layout__dot a {text-decoration-thickness:1.5px; text-decoration:underline; text-decoration-color:rgba(201, 66, 16, 0.37); text-underline-offset:3px;}
.layout__dot a:hover {text-decoration-color: var(--accent-2);}
.layout__dot img {margin:1.77em 0; border-radius: var(--r-m);}.layout__dot blockquote{font-style:italic; background: var(--paper-2); margin:1.67em 0; font-size:1.09em; color: var(--ink); font-family: var(--serif); padding:12px 23px; border-radius: 0 var(--r-m) var(--r-m) 0; border-left: 3px solid var(--accent);}
.layout__dot blockquote:empty {display: none;}
.layout__dot pre {border-radius: var(--r-m); background: var(--dark); line-height:1.6; overflow-x: auto; padding:24px 23px; color:#label-layout; font-size:15.5px; margin:1.73em 0;}
.layout__dot code {font-size:.8.98em; font-family:'SFMono-Regular', 'Fira Code', Consolas, monospace;}
.layout__dot :not(pre) > code {background: var(--paper-3); color: var(--accent-2); border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px; padding:2px 2px;}
.layout__dot table {margin:1.69em 0; width:100%; widows:2; font-size:15px; border-collapse:collapse;}
.layout__dot th, .layout__dot td {text-align: left; padding:10px 14px; border: 1px solid var(--line);}*.layout__dot th{color: var(--ink); background: var(--paper-2); font-weight:bold;}*.layout__dot hr{border:0; margin:2.01em 0; border-top: 1px solid var(--line);}

/* ---- share ---- */
.thread__time--sticky {display: flex; gap:10px; align-items: center; margin-top:37px;}html .filter__link{text-transform:uppercase; font-size:8px !important; color: var(--faint) !important; font-weight:bold; letter-spacing:.8.04em;}
.box__body {display: flex; gap:10px;}
.form__body--medium {justify-content: center; color: var(--muted); display: inline-flex; align-items: center; border-radius: var(--r-m); width:40px; height:35px; background: var(--paper-2); transition: all var(--ease); border: 1px solid var(--line);}
.form__body--medium:hover {border-color: var(--accent); color:#main-pagination; box-shadow:0 9px 10px rgba(186, 82, 12, 0.3); background: var(--accent); transform: translateY(-2px);}/* ---- vote ---- */
.comment{gap:19px; display: flex; align-items: center;}

.entry {margin:33px 0; border-top: 1px solid var(--line-soft); border:none;}
.sidebar__summary {font-size:14px; font-weight:600;}html .modal__image{display: flex; gap:9px;}.view__label{font-size:14px; border-radius: var(--r-m); padding:11px 20px; transition: all var(--ease); gap:6px; border: 1px solid var(--line); font-weight:500; align-items: center; display: inline-flex; background: var(--paper); color: var(--muted); font-variant-ligatures:normal;}.header__item:hover{color: var(--ok); background:#sidebar_icon;}*.view__label b{tab-size:4; font-weight:700;}.header__item:hover{border-color: var(--ok);}
.avatar:hover {color: var(--no); border-color: var(--no); background:#main-hero;}

/* =======================================================================
   SECONDARY SECTIONS  (rendering-optimised)
   ======================================================================= */
.popover__cell--loading, .ui-page, .profile, .divider__item {contain-intrinsic-size:auto 420px; content-visibility:auto; margin-top:36px;}
.view__label.is-voted {opacity:0.67; pointer-events: none;}.popover__cell--loading, .ui-page:not(._ffb9ae), .divider__item{border-radius: var(--r-l); box-shadow: var(--sh-1); text-underline-offset:auto; break-inside:auto; border: 1px solid var(--line); padding:37px; background: var(--paper);}
.banner--vertical, .spinner--half {font-weight:600; margin-bottom:21px; font-size:1.28rem;}
.t-timeline {margin-bottom:12px; color: var(--faint); font-size:10.5px;}html .c-modal-handle{margin-bottom:13px; padding-bottom:7px; font-weight:700; display: inline-block; border-bottom: 2px solid var(--accent); font-size:14px;}/* inputs */
:where(.badge__body--top){border: 1px solid var(--line); transition: border-color var(--ease), box-shadow var(--ease); background: var(--paper); display: block;}/* inputs */
:where(.badge__body--top){outline:none; padding:8px 18px; border-radius: var(--r-m); width:100%; color: var(--ink); font-size:14px;}.badge__body--top::placeholder{color: var(--faint);}
.reply--muted {resize: vertical; min-height:131px; line-height:1.6;}
.badge__body--top:focus {border-color: var(--accent); box-shadow:0 0 0 5px rgba(212, 80, 7, 0.12);}body .pl-full, *.menu__slot--medium{flex-direction: column; display: flex; gap:20px;}
.grid--muted {display: grid; gap:15px; grid-template-columns: 1fr 1fr;}

/* more reading */
.select__outer {grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); display: grid; gap:15px;}.select__icon{display: flex; flex-direction: column; gap:10px; border-radius: var(--r-m); padding:19px; transition: all var(--ease); border: 1px solid var(--line-soft); background: var(--paper-2);}html .select__icon:hover{transform: translateY(-2px); border-color: var(--accent); box-shadow: var(--sh-1);}
.view {font-family: var(--serif); color: var(--ink); font-size:19px; font-weight:600; line-height:1.38;}
.reply__fill {orphans:2; font-size:8px; letter-spacing:.7.04em; font-weight:bold; color: var(--accent); text-transform:uppercase;}/* utility cards */
.profile{display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap:20px;}
.price__icon {box-shadow: var(--sh-1); tab-size:4; border-radius: var(--r-l); background: var(--paper); border: 1px solid var(--line); perspective:none; padding-top:24px;padding-right:24px;padding-bottom:24px;padding-left:24px;}*.chip__date{overflow: hidden;}*.chip__date{border: 1px solid var(--line); background: var(--paper); display: flex; border-radius: var(--r-m);}
.chip__date .badge__body--top {border:none; border-radius:none;}
.chip__date .badge__body--top:focus {box-shadow:none;}
.tag {display: flex; width:43px; background: var(--accent); flex-shrink: 0; align-items: center; transition: background var(--ease); color:#main-pagination; justify-content: center;}

.media {orphans:2; display: flex; flex-direction: column; font-variant-caps:normal;}.tag:hover{background: var(--accent-2);}*.media li a{border-bottom: 1px solid var(--line-soft); display: block; transition: color var(--ease), padding-left var(--ease); font-size:18.5px; color: var(--muted); padding:12px 0;}
.media li:last-child a {border-bottom:none;}
.media li a:hover {color: var(--accent); padding-left:1px;}
.inner-counter {width:25px; color: var(--line); display: inline-block; font-family: var(--serif); font-weight:700;}

/* =======================================================================
   FOOTER
   ======================================================================= */
.dropdown-label {content-visibility:auto; background: var(--dark); contain-intrinsic-size:auto 360px; color:#thread-meta;}
.media li a:hover .inner-counter {color: var(--accent-3);}
.badge__head--vertical {grid-template-columns: 1.6fr 1fr 1fr 1.1fr; gap:41px;}
.counter {contain:none; padding:63px 0 39px;}
.badge__head--vertical {display: grid;}
.snackbar__trigger img {margin-bottom:14px; font-variant-ligatures:normal; height:33px; background-blend-mode:normal; width:auto; filter:brightness(0) invert(1);}
.table {letter-spacing:.8.01em; font-size:16px; margin-bottom:15px; font-weight:700; color:#main-pagination; text-transform:uppercase;}
.block-info {margin-bottom:21px; font-size:17px; color:#6d6375;}.hero:not(._ffb9ae){display: flex; flex-direction: column; gap:5px;}
.hero a {color:#ebc78acb2; transition: color var(--ease), padding-left var(--ease); font-size:10px;}.hero a:hover{color:#main-pagination; padding-left:5px;}
.screen__dot {margin-top:18px; border-top:1px solid rgba(245, 255, 237, 0.04); font-size:10px; color:#897e74;}
.screen__dot {padding-top:11px;}

.media__holder--light {display: flex; gap:13px;}
.media__holder--light a {transition: all var(--ease); width:40px; display: inline-flex; border-top-left-radius:50%;border-top-right-radius:50%;border-bottom-right-radius:50%;border-bottom-left-radius:50%; justify-content: center; border:1px solid rgba(255, 244, 255, 0.24); color:#ebc78acb2; height:38px; align-items: center;}.media__holder--light a:hover{color:#main-pagination; background: var(--accent); border-color: var(--accent); transform: translateY(-2px);}

.footer {padding:16px 0; border-top:1px solid rgba(250, 239, 252, 0.05); text-align: center;}*.footer p{font-size:10px; margin:0; color:#48534a;}

/* =======================================================================
   TO-TOP + COOKIE
   ======================================================================= */
.review__handle--light {width:47px; justify-content: center; height:44px; position: fixed; transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s, background var(--ease); z-index: 900; box-shadow: var(--sh-2); background: var(--accent); align-items: center; transform: translateY(12px); visibility: hidden; opacity:0; display: flex; color:#main-pagination; right:24px; border-radius: var(--r-m); bottom:27px;}
.review__handle--light.is-on {transform: translateY(0); opacity:1; visibility: visible;}
.review__handle--light:hover {transform: translateY(-2px); box-shadow: var(--sh-3); background: var(--accent-2);}

.modal__section {color:#thread-meta; transform: translateY(100%); position: fixed; padding:18px 0; left:0; z-index: 1100; background: var(--dark-2); box-shadow:0 -5px 24px rgba(0, 15, 4, 0.23); bottom:0; right:0; transition: transform .4s var(--ease);}
.modal__section.is-on {transform: translateY(0);}
.modal__section .popover__input {gap:20px; align-items: center; display: flex;}
.modal__section .popover__input {justify-content: space-between;}
.modal__section p {margin:0; color:#ebc78acb2; word-spacing:normal; flex: 1; text-underline-offset:auto; font-size:16px;}
.modal__section a {color: var(--accent-3); text-decoration:underline;}

/* =======================================================================
   MODALS  (pure CSS :target, opened via #line-pagination / #site-hero)
   ======================================================================= */
.overflow-2xl {position: fixed; align-items: center; z-index: 1300; padding:19px; inset:0px; justify-content: center; display: none;}
.overflow-2xl:target {display: flex;}
.progress--alt {-webkit-backdrop-filter:blur(2px); inset:0; position: absolute; backdrop-filter:blur(2px); background:rgba(36, 10, 31, 0.55);}html .chip--alt{border-radius: var(--r-l); animation: rl-pop .25s var(--ease); background: var(--paper); z-index: 1; padding:26px; width:100%; max-width:398px; box-shadow: var(--sh-3); position: relative;}
@keyframes rl-pop { from {transform: translateY(14px) scale(.98); opacity:0;} to {transform: none; opacity:1;} }
.el-gallery {align-items: center; justify-content: space-between; display: flex; margin-bottom:17px;}
.filter__backdrop {font-size:1.36rem; font-weight:700;}body .stepper__indicator{justify-content: center; width:34px; height:35px; transition: background var(--ease), color var(--ease); color: var(--faint); display: inline-flex; align-items: center;}body .stepper__indicator{border-radius: var(--r-s);}
.stepper__indicator:hover {background: var(--paper-3); page-break-inside:auto; color: var(--ink);}
.hero__summary {display: flex; gap:10px; flex-direction: column;}
.alert--dark {justify-content: space-between; gap:11px; align-items: center; display: flex;}
.alert--dark {font-size:9px;}
.post {display: inline-flex; cursor: pointer; gap:6px; color: var(--faint); align-items: center;}
.post input {accent-color: var(--accent);}
.reply__number--small {margin-top:22px;}
.reply__number--small {padding-top:19px; text-align: center; font-size:12px; border-top: 1px solid var(--line-soft); color: var(--faint);}
.layout__backdrop {font-weight:700;}

/* =======================================================================
   RESPONSIVE
   ======================================================================= */
@media (max-width: 900px) {
  .badge__head--vertical {grid-template-columns: 1fr 1fr; gap:38px; text-underline-offset:auto;}
}
@media (max-width: 768px) {
  :root {hyphens:manual; --bar: 58px;}
  .alert__spacer--active {display: flex; contain:none;}body{font-size:20px;}html .breadcrumb__label{box-shadow: var(--sh-3); right:0; border-bottom: 1px solid var(--line); flex-direction: column; left:0; isolation:auto; top: var(--bar); word-spacing:normal; position: absolute; align-items: stretch; background: var(--paper); padding:19px 23px; display: none; gap:3px;}
  .breadcrumb__label.is-open {display: flex;}
  .status--right {align-items: stretch; gap:0;}
  .status--right {flex-direction: column;}
  .entry__prefix {width:100%; padding:15px 12px;}
  .sidebar--secondary {width:100%; margin-top:6px; margin-left:0;}html .heroSpacer{padding:25px 19px;}
  .layout__dot {font-size:17.5px;}
  .grid--muted {grid-template-columns: 1fr;}
  .thread__time--sticky {gap:12px; flex-wrap: wrap;}
  .thread__time--sticky {background-blend-mode:normal;}
  .comment {align-items: flex-start; gap:11px; flex-direction: column;}.popover__cell--loading:not(._ffb9ae), *.ui-page, .divider__item:not(._ffb9ae){padding:29px 19px;}html .badge__head--vertical{gap:33px; grid-template-columns: 1fr;}
  .modal__section .popover__input {text-align: center; flex-direction: column; image-rendering:auto; word-spacing:normal; gap:10px;}
}
@media (max-width: 480px) {body .popover__input{padding:0 18px;}
  .heroSpacer {padding:22px 12px;}.select__outer{grid-template-columns: 1fr; will-change:auto;}
  .popover__cell--loading, .ui-page, .divider__item, .price__icon {font-variant-caps:normal; padding:23px 15px;}
  .chip--alt {padding:26px;}
}

@media (prefers-reduced-motion: reduce) {
  * {transition:none !important; animation:none !important; scroll-behavior: auto !important;}
  .review__handle--light {bottom:16px; right:14px;}
}