

/* ---- base ---- */
*, *::before, *::after {box-sizing: border-box; padding:0; margin:0;}/* =======================================================================
   STYLE.CSS  —  content-first editorial layout
   ======================================================================= */

:root {--sh-1: 0 1px 2px rgba(28,25,23,.06); --accent:     #site-stepper; --line-soft:  #counter-close; --line:       #pagePlaceholder; --sh-2: 0 6px 20px rgba(28,25,23,.09); --faint:      #78716c; --sh-3: 0 18px 44px rgba(28,25,23,.16); --serif: 'Spectral', Georgia, 'Times New Roman', serif; --ease: .22s cubic-bezier(.4,0,.2,1); --ink:        #1c1917; --accent-2:   #9a3412; --paper-2:    #box-area; --sans:  'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --accent-3:   #site-dialog; --r-s: 6px; --bar: 64px; --bound: 1160px; --no:         #site-slider; --dark-2:     #292524; --r-l: 16px; --r-m: 10px; --read: 760px; --ink-soft:   #292524; --accent-wash:#module-section; --paper:      #alert_detail; --ok:         #15803d; --muted:      #57534e; --dark:       #1c1917; --paper-3:    #counter-close;}
html {-webkit-text-size-adjust:100%; scroll-behavior: smooth;}
html {scroll-padding-top: calc(var(--bar) + 16px);}body{color: var(--muted); font-family: var(--sans); -moz-osx-font-smoothing:grayscale; font-variant-ligatures:normal; font-size:20px; background: var(--paper-2); text-decoration-skip-ink:auto; line-height:1.65; -webkit-font-smoothing:antialiased;}
img, svg {max-width:100%; display: block;}a{color: var(--accent); transition: color var(--ease); text-decoration:none;}
img {height:auto;}
a:hover {color: var(--accent-2);}ul, ol{list-style: none; text-underline-offset:auto;}
input, textarea {font-family:inherit; color: var(--ink); font-size:inherit;}button{border:0 none; color:inherit; font-family:inherit; cursor: pointer; background:none; will-change:auto;}
h1 {font-family: var(--serif);}
h1 {line-height:1.18; font-weight:700; color: var(--ink);}
p {margin:0 0 0.98em;}
strong, b {font-weight:bold; color: var(--ink-soft);}

.nav-prefix {max-width: var(--bound); padding:0 21px;}

.nav-prefix {margin:0 auto;}/* span-based section captions (no heading tags outside the article body) */
.fill-footer, html .text-card, .selectOuter, .c-price-backdrop:not(._5e4ba8), .dialog-backdrop, .c-section-link, .stepper-overlay-fixed:not(._5e4ba8), .toolbar-thumb-full{color: var(--ink); font-family: var(--serif); font-synthesis:weight style small-caps; display: block;}
.feature__section--small {padding:0; margin:-1px; border:0 none; white-space: nowrap; clip:rect(0,0,0,0); width:1px; position: absolute; overflow: hidden; height:1px;}

/* ---- progress ---- */
.primary-skeleton {z-index: 1400; height:5px; left:0;}

/* =======================================================================
   MASTHEAD  (fixed; sits visually on top although later in source)
   ======================================================================= */
.post-close {left:0; height: var(--bar); -webkit-backdrop-filter:saturate(150%) blur(10px); border-bottom: 1px solid var(--line); top:0; background:rgba(255, 255, 255, 0.84); backdrop-filter:saturate(150%) blur(10px); right:0; transition: box-shadow var(--ease); z-index: 1000; position: fixed;}

/* ---- progress ---- */
.primary-skeleton {width:0; transition:width 0.119s linear; background: linear-gradient(90deg, var(--accent), var(--accent-3)); top:0; position: fixed;}
.post-close.is-stuck {box-shadow: var(--sh-2);}
.block-danger {orphans:2; flex-shrink: 0; display: inline-flex; align-items: center;}
.post-close .nav-prefix {height:100%; word-spacing:normal; display: flex; gap:20px; align-items: center;}
.block-danger img {width:auto; height:31px;}

.select-primary {gap:14px; align-items: center; flex: 1;}

.select-primary {display: flex;}
.post-image {display: flex; gap:2px; align-items: center;}body .menu-date-pressed{transition: color var(--ease), background var(--ease); font-size:18.5px; padding:8px 14px; font-weight:medium; border-radius: var(--r-s); align-items: center; display: inline-flex; color: var(--muted);}
.menu-date-pressed:hover {color: var(--ink); background: var(--paper-3);}body .list-dot{transition: background var(--ease), transform var(--ease), box-shadow var(--ease); justify-content: center; border-radius: var(--r-m); display: inline-flex; padding:6px 22px; color:#time-post; font-size:12px; align-items: center; background: var(--accent); margin-left:auto; font-weight:500;}

.table-image {padding:4px; width:39px; display: none; height:42px; border-radius: var(--r-s);}
.list-dot:hover {color:#time-post; transform: translateY(-1px); box-shadow:0 6px 20px rgba(195, 60, 2, 0.24); background: var(--accent-2);}

.table-image {margin-left:auto; flex-direction: column; gap:9px; justify-content: center;}
.table-image i {display: block; border-radius:2px; transition: transform var(--ease), opacity var(--ease); background: var(--ink); height:2px;}
.table-image.is-open i:nth-child(1) {image-rendering:auto; text-underline-offset:auto; transform: translateY(7px) rotate(45deg);}
.table-image.is-open i:nth-child(2) {opacity:0;}
.table-image.is-open i:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}

/* ---- buttons ---- */
.layout-spacer {transition: background var(--ease), transform var(--ease), box-shadow var(--ease); font-size:18.5px; border-radius: var(--r-m); font-family: var(--sans); background: var(--accent); display: inline-flex; font-weight:500; align-items: center; justify-content: center; white-space: nowrap; gap:4px; color:#time-post; padding:12px 24px;}
.media-action {padding:13px 26px; margin-top:5px; width:100%;}
.layout-spacer:hover {backface-visibility:visible; transform: translateY(-1px); color:#time-post; print-color-adjust:economy; background: var(--accent-2); box-shadow:0 2px 13px rgba(210, 54, 0, 0.24);}body .sidebar-zone{align-self: flex-start; font-size:18px; padding:12px 32px;}

/* =======================================================================
   MAIN  (content-first; cleared from the fixed masthead)
   ======================================================================= */
.separator-snackbar {padding-top: var(--bar);}
.timeline-extra-selected {padding:29px 0 64px; font-variant-caps:normal; max-width: var(--read); margin:0 auto;}

/* =======================================================================
   POST
   ======================================================================= */
.ui-section {padding-top:43px;padding-right:43px;padding-bottom:43px;padding-left:43px; print-color-adjust:economy; border: 1px solid var(--line); background: var(--paper); box-shadow: var(--sh-1); text-underline-offset:auto; border-radius: var(--r-l);}*.u-modal{line-height:1.16; color: var(--ink); letter-spacing:-.13.93em; font-size: clamp(1.85rem, 1.2rem + 2.4vw, 2.6rem); margin-bottom:19px; font-weight:700;}
.area-search {display: flex; padding-bottom:25px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap;}
.accordionExpand {display: inline-flex; font-size:15px; gap:8px; color: var(--faint); align-items: center;}
.area-search {gap:8px 8px; align-items: center; margin-bottom:26px;}
.progress-row {color: var(--line);}
.accordionExpand svg {opacity:0.72;}/* ---- toc ---- */
:where(.reply-block){margin-bottom:36px; border-radius: var(--r-m); padding:18px 23px; background: var(--accent-wash); border-left: 3px solid var(--accent); border:1px solid #addon-reply;}
.position-1 {margin-bottom:11px; display: flex; justify-content: space-between; align-items: center;}.reply-block[hidden]{display: none; widows:2;}
.fill-footer {font-size:16px; font-weight:500;}
.toggle-snackbar {transition: background var(--ease); font-weight:medium; color: var(--accent); padding:5px 12px; font-size:11px; border-radius: var(--r-s);}
.toggle-snackbar:hover {background:rgba(212, 50, 6, 0.16);}
.t-chip {display: flex;}
.t-chip {flex-direction: column; gap:3px;}
.t-chip a {font-size:10px; padding:7px 0; color: var(--muted); border-left:2px solid transparent; display: block; transition: color var(--ease), padding-left var(--ease);}
.t-chip a:hover {color: var(--accent); padding-left:10px;}
.t-chip a.page-focused {font-size:14.5px; padding-left:16px;}
.t-chip a.page-focused:hover {padding-left:21px;}
.t-chip a.wrapper-gallery {padding-left:27px; backface-visibility:visible; font-variant-caps:normal; font-size:13px; color: var(--faint);}

/* ---- body (the only place real headings appear) ---- */
.list-row-default {line-height:1.78; font-size:18.5px; color: var(--ink-soft);}
.list-row-default > *:first-child {margin-top:0;}
.list-row-default h2 {color: var(--ink); font-weight:600; font-family: var(--serif); letter-spacing:-.0.96em; font-size:1.51rem; margin:1.94em 0 .54.99em;}
.list-row-default h3 {margin:1.42em 0 .44.94em; font-size:1.26rem; color: var(--ink); font-family: var(--serif); font-weight:500;}
.list-row-default h4 {text-rendering:auto; font-family: var(--serif); font-size:1.05rem; font-weight:700; hyphens:manual; color: var(--ink); margin:1.36em 0 .3.99em;}
.list-row-default p {margin:0 0 1.31em;}body .list-row-default ul, .list-row-default ol{margin:0 0 1.35em 1.33em;}
.list-row-default ul {list-style: disc;}.list-row-default ol{list-style: decimal;}
.list-row-default li {margin-bottom:.45.01em;}html .list-row-default li::marker{will-change:auto; color: var(--accent); print-color-adjust:economy;}
.list-row-default a {text-decoration:underline;}
.list-row-default a {text-underline-offset:3px; text-decoration-color:rgba(208, 83, 0, 0.42); text-decoration-thickness:1.5px;}
.list-row-default a:hover {text-decoration-color: var(--accent-2);}
.list-row-default img {border-radius: var(--r-m); margin:1.68em 0;}.list-row-default blockquote{background: var(--paper-2); font-family: var(--serif); color: var(--ink); padding:12px 27px; margin:1.63em 0; font-size:1.17em; border-radius: 0 var(--r-m) var(--r-m) 0; font-style:italic; border-left: 3px solid var(--accent);}.list-row-default blockquote:empty{display: none;}body .list-row-default pre{background: var(--dark); margin:1.76em 0; line-height:1.6; font-size:18.5px; overflow-x: auto; border-radius: var(--r-m); color:#pagePlaceholder; padding:18px 19px;}
.list-row-default code {font-size:.9.07em; font-family:'SFMono-Regular', 'Fira Code', Consolas, monospace;}
.list-row-default :not(pre) > code {background: var(--paper-3); padding:2px 3px; color: var(--accent-2); border-radius:3px;}
.list-row-default table {margin:1.7em 0; width:100%; border-collapse:collapse; font-size:15px;}
.list-row-default th, .list-row-default td {border: 1px solid var(--line); text-align: left; padding:13px 14px;}
.list-row-default th {background: var(--paper-2); font-weight:bold; color: var(--ink);}
.list-row-default hr {-webkit-hyphens:manual;-ms-hyphens:manual;margin:2.06em 0; backface-visibility:visible; border:none; hyphens:manual; border-top: 1px solid var(--line);}
.text-card {letter-spacing:.7.95em; color: var(--faint) !important; text-transform:uppercase; font-size:10px !important; font-weight:bold;}

/* ---- share ---- */
.info-counter {margin-top:33px; display: flex; gap:11px; align-items: center;}
.rating-button-rounded {display: flex; gap:12px;}
.media {color: var(--muted); background: var(--paper-2); align-items: center; transition: all var(--ease); border-radius: var(--r-m); height:41px; justify-content: center; display: inline-flex; width:40px; border: 1px solid var(--line);}
.media:hover {border-color: var(--accent); transform: translateY(-2px); background: var(--accent); box-shadow:0 2px 14px rgba(176, 49, 13, 0.19); color:#time-post;}.footer-highlight{margin:27px 0; border-top: 1px solid var(--line-soft); border:none;}.selectOuter{font-size:13px; font-weight:500;}/* ---- vote ---- */
.l-snackbar{display: flex; align-items: center; gap:20px;}
.row-0 {gap:11px; display: flex;}.footer-summary-danger{display: inline-flex; font-weight:medium; font-variant-caps:normal; gap:9px; align-items: center; shape-margin:0; color: var(--muted); background: var(--paper); padding:12px 18px; font-size:12px; border: 1px solid var(--line); border-radius: var(--r-m); transition: all var(--ease);}
.footer-summary-danger b {font-weight:700;}.c-post-number:hover{perspective:none; font-variant-ligatures:normal; color: var(--ok); border-color: var(--ok); background:#card_name;}
.step-cap:hover {color: var(--no); border-color: var(--no);}
.step-cap:hover {background:#page-popover;}
.footer-summary-danger.is-voted {opacity:0.62; pointer-events: none;}/* =======================================================================
   SECONDARY SECTIONS  (rendering-optimised)
   ======================================================================= */
.select-vertical, .c-menu-trigger, .screen-count-even:not(._5e4ba8), .sort-overlay:not(._5e4ba8){contain-intrinsic-size:auto 420px; margin-top:35px; text-decoration-skip-ink:auto; font-variant-ligatures:normal; content-visibility:auto;}
.select-vertical, .c-menu-trigger, .sort-overlay {box-shadow: var(--sh-1); border: 1px solid var(--line); background: var(--paper); border-radius: var(--r-l); padding-top:36px; padding-right:36px; padding-bottom:36px;}
.select-vertical, .c-menu-trigger, .sort-overlay {padding-left:36px;}
.c-price-backdrop, .dialog-backdrop {font-weight:700; font-size:1.37rem; margin-bottom:22px;}
.c-section-link {display: inline-block; font-weight:600; padding-bottom:6px; border-bottom: 2px solid var(--accent); font-size:16px; margin-bottom:14px;}

/* inputs */
.sidebar-wrapper-secondary {border-radius: var(--r-m); width:100%; transition: border-color var(--ease), box-shadow var(--ease); background: var(--paper); border: 1px solid var(--line); display: block; color: var(--ink); outline:none; font-size:17px; padding:9px 11px;}
.c-sort-group {color: var(--faint); margin-bottom:19px; font-size:12.5px;}
.sidebar-wrapper-secondary::placeholder {color: var(--faint);}
.hero-foot {min-height:128px; resize: vertical; font-variant-caps:normal; line-height:1.6;}
.sidebar-wrapper-secondary:focus {border-color: var(--accent); box-shadow:0 0 0 3px rgba(193, 61, 22, 0.17); text-rendering:auto; page-break-inside:auto;}
.c-toggle-block {grid-template-columns: 1fr 1fr; gap:20px; display: grid;}.c-slider-expand, *.order-none{gap:14px; flex-direction: column; display: flex;}

/* more reading */
.gallery-highlight {grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); display: grid; gap:15px;}.module-medium{background: var(--paper-2); display: flex; border: 1px solid var(--line-soft); transition: all var(--ease); padding-top:18px;padding-right:18px;padding-bottom:18px;padding-left:18px; flex-direction: column; gap:8px; border-radius: var(--r-m);}*.module-medium:hover{border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--sh-1);}*.panel-preview{text-transform:uppercase; font-size:10px; font-weight:bold; color: var(--accent); letter-spacing:.6.97em;}/* utility cards */
.screen-count-even{grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); display: grid; gap:17px;}
.c-toggle-number {font-weight:600; line-height:1.38; font-size:19px; color: var(--ink); font-family: var(--serif);}
.c-list-text {background: var(--paper); box-shadow: var(--sh-1); padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px; border: 1px solid var(--line); border-radius: var(--r-l);}

.c-rating-secondary {display: flex; overflow: hidden; mix-blend-mode:normal; border: 1px solid var(--line); border-radius: var(--r-m); background: var(--paper);}
.c-rating-secondary .sidebar-wrapper-secondary {border-radius:0; border:0 none;}.c-rating-secondary .sidebar-wrapper-secondary:focus{box-shadow:none;}
.track-counter {color:#time-post; align-items: center; background: var(--accent); display: flex; transition: background var(--ease); width:45px; flex-shrink: 0; justify-content: center;}
.track-counter:hover {background: var(--accent-2);}

.tabs-slot-active {flex-direction: column; display: flex;}
.tabs-slot-active li a {color: var(--muted); word-spacing:normal; border-bottom: 1px solid var(--line-soft); page-break-inside:auto; transition: color var(--ease), padding-left var(--ease); display: block; font-size:13.5px; padding:13px 0;}
.tabs-slot-active li:last-child a {border-bottom:0 none;}.widget-alt{backface-visibility:visible; display: inline-block; font-family: var(--serif); font-weight:700; width:22px; color: var(--line);}
.tabs-slot-active li a:hover {color: var(--accent); padding-left:2px;}body .tabs-slot-active li a:hover .widget-alt{color: var(--accent-3);}/* =======================================================================
   FOOTER
   ======================================================================= */
.c-action-primary{content-visibility:auto; contain-intrinsic-size:auto 360px; background: var(--dark); color:#app-avatar;}
.c-module-suffix {padding:62px 0 38px;}.avatar-body:not(._5e4ba8){display: grid; gap:42px; grid-template-columns: 1.6fr 1fr 1fr 1.1fr;}
.subtitle-breadcrumb img {width:auto; height:33px; filter:brightness(0) invert(1); margin-bottom:20px;}
.toggle-suffix-expanded {margin-bottom:18px; color:#6f6b76; font-size:13px;}.stepper-overlay-fixed{font-size:15px; color:#time-post; text-transform:uppercase; font-weight:500; margin-bottom:17px; letter-spacing:.8.05em;}
.skeleton-label-odd {gap:6px; flex-direction: column; display: flex;}
.skeleton-label-odd a {transition: color var(--ease), padding-left var(--ease); color:#group-accordion; print-color-adjust:economy; font-size:18px;}*.float-end{color:#84785a; padding-top:11px; font-size:12px; margin-top:17px; border-top:1px solid rgba(255, 255, 255, 0.13);}.skeleton-label-odd a:hover{padding-left:1px; color:#time-post;}

.list-odd {print-color-adjust:economy; display: flex; text-underline-offset:auto; gap:12px;}
.list-odd a {color:#group-accordion; print-color-adjust:economy; display: inline-flex; width:34px;}
.list-odd a {-webkit-hyphens:manual;-ms-hyphens:manual;hyphens:manual; justify-content: center; border:1px solid rgba(255, 255, 246, 0.11); align-items: center; border-radius:50%; height:42px; transition: all var(--ease);}body .list-odd a:hover{color:#time-post; background: var(--accent); border-color: var(--accent); transform: translateY(-2px);}

.c-filter-content {text-align: center; border-top:1px solid rgba(255, 253, 239, 0.07); padding:17px 0;}.c-filter-content p{margin:0; font-size:14px; color:rgb(62, 100, 72);}

/* =======================================================================
   TO-TOP + COOKIE
   ======================================================================= */
.slot-chip {transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s, background var(--ease); align-items: center; opacity:0; height:42px; right:27px; bottom:26px; border-radius: var(--r-m); justify-content: center; position: fixed; box-shadow: var(--sh-2); color:#time-post; transform: translateY(12px); visibility: hidden; background: var(--accent); width:44px; z-index: 900; display: flex;}
.slot-chip.is-on {page-break-inside:auto; transform: translateY(0); visibility: visible; opacity:1;}
.slot-chip:hover {background: var(--accent-2); transform: translateY(-2px); box-shadow: var(--sh-3);}*.nav-flat{z-index: 1100; padding:13px 0; transform: translateY(100%); right:0; position: fixed; box-shadow:0 -9px 25px rgba(14, 0, 2, 0.2); transition: transform .4s var(--ease); bottom:0; left:0; background: var(--dark-2); color:#app-avatar;}
.nav-flat.is-on {transform: translateY(0);}
.nav-flat .nav-prefix {-moz-tab-size:4;gap:20px; justify-content: space-between; display: flex; tab-size:4; align-items: center; text-decoration-skip-ink:auto;}.nav-flat p{color:#group-accordion; font-size:9px; flex: 1; shape-margin:0; margin:0;}
.nav-flat a {color: var(--accent-3); text-decoration:underline;}/* =======================================================================
   MODALS  (pure CSS :target, opened via #page-counter / #main-pagination)
   ======================================================================= */
.badge-bottom{inset:0; align-items: center; display: none; position: fixed; z-index: 1300; padding:22px; justify-content: center;}body .modal-expand{background:rgba(45, 21, 13, 0.53); position: absolute; -webkit-backdrop-filter:blur(2px); inset:0; backdrop-filter:blur(2px);}
.badge-bottom:target {display: flex;}body .carousel-block-medium{border-radius: var(--r-l); padding:32px; max-width:398px; position: relative; z-index: 1; box-shadow: var(--sh-3); animation: rl-pop .25s var(--ease); background: var(--paper); width:100%;}
@keyframes rl-pop { from {hyphens:manual; opacity:0; transform: translateY(14px) scale(.98);} to {transform: none; opacity:1;} }
.toolbar-thumb-full {font-weight:700; font-size:1.33rem;}
.section-indicator {margin-bottom:22px; mix-blend-mode:normal; justify-content: space-between; display: flex; align-items: center;}*.spinner-wrap{width:36px; border-radius: var(--r-s); height:36px; color: var(--faint); display: inline-flex; align-items: center; transition: background var(--ease), color var(--ease); justify-content: center;}
.card-cap {gap:17px; display: flex; flex-direction: column;}
.spinner-wrap:hover {background: var(--paper-3); color: var(--ink);}.grid-suffix-muted:not(._5e4ba8){display: flex; align-items: center; justify-content: space-between; gap:14px; font-size:16px;}.summary-search{color: var(--faint); display: inline-flex; cursor: pointer; align-items: center; gap:6px;}
.summary-search input {accent-color: var(--accent);}
.grid-input-empty {color: var(--faint); text-align: center; border-top: 1px solid var(--line-soft); margin-top:22px; font-size:11px; padding-top:19px;}
.c-badge-trigger {font-weight:600;}

/* =======================================================================
   RESPONSIVE
   ======================================================================= */
@media (max-width: 900px) {*.avatar-body{gap:36px; grid-template-columns: 1fr 1fr; transform-style:flat;}
}
@media (max-width: 768px) {
  :root {text-decoration-skip-ink:auto; --bar: 58px;}
  .table-image {display: flex;}body{font-size:19px;}.select-primary:not(._5e4ba8){display: none; left:0rem; gap:5px; border-bottom: 1px solid var(--line); right:0; box-shadow: var(--sh-3); position: absolute; flex-direction: column; top: var(--bar); align-items: stretch; padding:16px 26px; background: var(--paper);}
  .select-primary.is-open {display: flex;}html .post-image{align-items: stretch; flex-direction: column; gap:0;}
  .menu-date-pressed {width:100%; padding:10px 14px;}
  .list-dot {margin-top:11px; width:100%; margin-left:0;}body .ui-section{image-rendering:auto; padding:25px 19px;}
  .list-row-default {font-size:20.5px;}
  .info-counter {flex-wrap: wrap; mix-blend-mode:normal; gap:12px; widows:2;}
  .c-toggle-block {grid-template-columns: 1fr;}.l-snackbar{gap:10px;}.l-snackbar{flex-direction: column; align-items: flex-start;}
  .select-vertical, .c-menu-trigger, .sort-overlay {padding:25px 24px;}.avatar-body{mix-blend-mode:normal; grid-template-columns: 1fr; gap:37px;}
  .nav-flat .nav-prefix {text-align: center; flex-direction: column;}
  .nav-flat .nav-prefix {gap:12px;}
}
@media (max-width: 480px) {
  .nav-prefix {padding:0 18px;}
  .ui-section {padding:20px 20px;}.select-vertical:not(._5e4ba8), .c-menu-trigger, .sort-overlay:not(._5e4ba8), body .c-list-text{padding:17px 14px;}*.gallery-highlight{grid-template-columns: 1fr;}.carousel-block-medium:not(._5e4ba8){padding:20px;}
  .slot-chip {bottom:12px; right:19px;}
}

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