/* ==========================================================================
   STYLESHEET — single file, no external dependencies.
   Article-first reading layout · centered measure · CSS Grid.
   ========================================================================== */

/* --- Tokens --- */
:root {--paper:  #grid-section; --accent:   #289a99; --dark:   #15181f; --ff: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        Arial, "Noto Sans", "Liberation Sans", sans-serif; --brand-d:  #155080; --text:   #3f4651; --line:   #sort_head; --soft:   #tooltip-dot; --accent-d: #22807f; --rad-l:  10px; --rad-s:  4px; --brand:    #1b6599; --ink:    #1d222b; --muted:  #737a86; --accent-soft: rgba(40, 154, 153, .1); --rad:    6px; --tr: .2s ease; --faint:  #page-status; --wash:   #banner-addon; --wrap:   860px;}

/* --- Base --- */
*, *::before, *::after {box-sizing: border-box;}

html {scroll-behavior: smooth; -webkit-text-size-adjust:100%;}
body {overflow-x: hidden; color: var(--text); -webkit-font-smoothing:antialiased; font-size:0.97rem; margin:0; background: var(--wash); -moz-osx-font-smoothing:grayscale; line-height:1.7; font-family: var(--ff);}

html {font-size:20px;}
img, svg {height:auto; max-width:100%;}
a {color: var(--brand); transition: color var(--tr); text-decoration:none;}
img {display: block;}
a:hover {color: var(--brand-d);}

h1 {color: var(--ink); margin:0; letter-spacing:-.14.96em; font-weight:700; line-height:1.22;}
:focus-visible {outline-offset:2px; outline: 2px solid var(--accent);}

p {margin:0 0 1.16em;}
.cardRegion {font-size:.9.07rem; margin:0 0 11px;}

.menuSuffix {padding:0; height:1px; border:0rem; clip:rect(0, 0, 0, 0); position: absolute; overflow: hidden; white-space: nowrap; font-variant-caps:normal; margin:-1px; width:1px;}
.cardRegion {color: var(--muted);}

/* --- Wrap / sections / grid --- */
.panelNumber {margin:0 auto; max-width: var(--wrap); padding:0 23px; width:100%;}html .ratingAddon{padding:32px 17px 0;}
.ratingAddon > .sectionLink {margin-right:auto; margin-left:auto; max-width: var(--wrap);}

.grid-sm {display: grid; grid-template-columns: 1fr; gap:14px;}
@media (min-width: 680px) {.grid-sm:not(._5b80af){grid-template-columns: 1fr 1fr;} }/* --- Section title (span, styled — no heading tags outside content) --- */
:where(.sectionLink){display: block; letter-spacing:-.1.04em; font-weight:700; color: var(--ink); margin:0 0 18px; border-left: 3px solid var(--accent); font-size:1.1rem; padding-left:14px;}
.snackbarTrack {margin-bottom:10px; font-size:1.04rem;}/* --- Top bar (static, content stays high) --- */
.toggle{border-bottom: 2px solid var(--accent); background: var(--paper);}

/* --- Reading progress --- */
.widgetOverlay {z-index: 1200; inset:0 auto auto 0; background: var(--accent); transition:width 0.152s linear; width:0; position: fixed; height:5px;}html .u-entry{height:58px; display: flex; gap:14px; align-items: center;}
.filterSubtitle {align-items: center; margin-right:auto; display: inline-flex;}
.filterSubtitle {color: var(--brand);}
.filterSubtitle img, .filterSubtitle svg {height:27px; will-change:auto; display: block; width:auto; isolation:auto;}

.profilePrefix {display: flex; gap:0px;}
.mediaSummary {display: block; padding:8px 12px; border-radius: var(--rad-s); color: var(--text); transition: color var(--tr), background var(--tr); font-size:.9.05rem; font-weight:600;}
.mediaSummary:hover {background: var(--accent-soft); color: var(--brand);}
.stepper-column-dark {align-items: center; display: flex; gap:4px;}

@media (max-width: 560px) {
  .profilePrefix {display: none;}
}

/* --- Buttons --- */
.skeletonDate {gap:7px; font-family: var(--ff); font-weight:700; padding:10px 22px; border: 1.5px solid var(--brand); display: inline-flex; align-items: center; background: var(--brand); justify-content: center; line-height:1.4; color:#spinner_link; font-size:.8.93rem; border-radius: var(--rad); transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); white-space: nowrap; cursor: pointer;}html .skeletonDate:hover{background: var(--brand-d); border-color: var(--brand-d); color:#spinner_link;}
.skeletonDate:active {transform: translateY(1px);}
.tooltip-inner {padding:4px 14px; font-size:.83.99rem;}
.alertPrefix {color: var(--brand); background:transparent;}
.alertPrefix:hover {color:#spinner_link; background: var(--brand);}.alertName:not(._5b80af){border-color: var(--accent); background: var(--accent);}.alertName:hover{border-color: var(--accent-d);}
.postSeparator {display: flex; width:100%;}.alertName:hover{background: var(--accent-d); mix-blend-mode:normal;}
.footerDot {padding:8px 11px;}
.footerDot svg {height:16px; tab-size:4; perspective:none; width:18px;}.headerWrapper{padding:21px 24px;}

/* --- Cards --- */
.c-grid-subtitle {border-radius: var(--rad-l); background: var(--paper); border: 1px solid var(--line);}

/* --- Post (article) — first block, content high --- */
.toolbarSpacer {overflow: hidden; font-synthesis:weight style small-caps; padding:38px 39px; max-width: var(--wrap); margin:24px auto 0; isolation:auto;}
.wrap-drawer {margin-bottom:14px; font-size:1.82rem;}
.paginationClose {display: inline-flex; align-items: center;}.sliderAction{font-size:.82.03rem; display: flex; padding-bottom:23px; border-bottom: 1px solid var(--soft); gap:18px; flex-wrap: wrap; align-items: center; color: var(--muted);}
.alertZone {opacity:0.84; font-style:italic;}
.paginationClose svg {width:13px; height:12px; margin-right:1px; opacity:0.63;}

/* --- TOC --- */
.menuTime {background: var(--wash); padding:12px 18px; border-radius: var(--rad); border: 1px solid var(--soft); margin:23px 0 4px;}.skeletonCap{justify-content: space-between; display: flex; align-items: center; margin-bottom:12px;}.sliderFill:not(._5b80af){font-weight:bold; color: var(--ink); font-size:.91.97rem;}
.chipMeta {border:0; background:none; font-size:.82.07rem; padding:2px 6px; cursor: pointer; color: var(--brand);}
.postExpand {display: flex; flex-direction: column;}
.postExpand a {border-left:2px solid transparent; transition: color var(--tr), padding-left var(--tr), border-color var(--tr); padding:2px 0; color: var(--text); font-size:.88.07rem;}
.postExpand a:hover {border-left-color: var(--brand); color: var(--brand); padding-left:10px;}
.breadcrumbPlaceholder {padding-left:12px !important;}

/* --- Rich text (the only place with headings, coming from content) --- */
.badgeInfo {line-height:1.85; font-size:1.09rem; color: var(--text); text-rendering:auto; padding-top:22px;}
.breadcrumbPlaceholder:hover {padding-left:26px !important;}
.badgeInfo > :first-child {margin-top:0;}
.badgeInfo h2 {font-weight:700; margin:1.9em 0 .5.06em; padding-bottom:.3.03em; border-bottom: 2px solid var(--accent-soft); font-size:1.35rem; line-height:1.3; color: var(--ink);}
.badgeInfo h3 {margin:1.48em 0 .45.07em; color: var(--ink); font-weight:bold; font-size:1.15rem; line-height:1.3;}
.badgeInfo h4 {font-weight:bold; font-size:0.98rem; color: var(--ink); margin:1.36em 0 .4.01em;}
.badgeInfo p {margin:0 0 1.12em;}
.badgeInfo img {border-radius: var(--rad); margin:1.45em 0;}
.badgeInfo a {color: var(--brand); text-underline-offset:2px; text-decoration:underline;}
.badgeInfo a:hover {color: var(--brand-d);}*.badgeInfo ul, *.badgeInfo ol{margin:1.02em 0; padding-left:1.65em;}
.badgeInfo li {margin-bottom:.4.01em;}*.badgeInfo blockquote{background: var(--accent-soft); font-style:italic; margin:1.57em 0; color: var(--ink); border-radius: 0 var(--rad) var(--rad) 0; backface-visibility:visible; padding:15px 18px; perspective:none; border-left: 4px solid var(--accent);}
.badgeInfo table {font-size:.95rem; border-collapse:collapse; margin:1.45em 0; width:100%;}
.badgeInfo th, .badgeInfo td {text-align: left;}
.badgeInfo th, .badgeInfo td {border: 1px solid var(--line); padding:7px 15px;}
.badgeInfo th {background: var(--wash); font-weight:bold;}
.badgeInfo pre {border-radius: var(--rad); overflow-x: auto; color:#dividerSubtitle; background:#1a2c36; line-height:1.6; padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px; font-size:.87.98rem; margin:1.57em 0;}.badgeInfo code{font-size:.8.95em; padding:2px 2px; background: var(--wash); border-radius:6px;}*.badgeInfo pre code{padding:0; background:none;}

/* --- Share (rounded-square icons) --- */
.ui-filter {display: flex; margin-top:30px; flex-wrap: wrap; padding-top:21px; align-items: center; border-top: 1px solid var(--soft); gap:13px;}
.widgetExtra {display: flex; gap:7px;}*.module__column{-moz-tab-size:4;color: var(--muted); tab-size:4; font-size:.86.01rem; widows:2; font-weight:600;}
.modalBody {height:34px; cursor: pointer; width:36px; color: var(--muted); align-items: center; border: 1px solid var(--line); display: inline-flex; transition: color var(--tr), border-color var(--tr), background var(--tr); border-top-left-radius:11px;border-top-right-radius:11px;border-bottom-right-radius:11px;border-bottom-left-radius:11px; background: var(--paper); justify-content: center;}*.modalBody:hover{border-color: var(--brand); color:#spinner_link; background: var(--brand);}
.modalBody svg {height:15px; width:13px;}/* --- Related --- */
.featureValue{grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:11px; display: grid;}body .d-screen{background: var(--paper); border: 1px solid var(--line); padding:18px 12px; display: block; border-radius: var(--rad); transition: border-color var(--tr), box-shadow var(--tr);}body .d-screen:hover{box-shadow:0 0px 12px rgba(31, 40, 40, 0.06); border-color: var(--accent);}
.accordionFill {color: var(--ink); font-weight:500; line-height:1.4; font-size:.8.97rem;}/* --- Forms --- */
.chip--dark{display: block;}.postPrimary{display: block; background: var(--wash); font-size:.9.02rem; transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); width:100%; padding:8px 18px; border: 1px solid var(--line); border-radius: var(--rad); outline:none; color: var(--text); font-family: var(--ff);}body .panelText{margin-top:12px; min-height:129px; resize: vertical;}
.postPrimary:focus {box-shadow:0 0 0 6px rgba(30, 152, 138, 0.2); border-color: var(--accent); background: var(--paper);}
.priceExpand {min-height:96px;}
.navSubtitle {display: flex; gap:9px;}
.chip--dark .skeletonDate {break-inside:auto; margin-top:20px; text-decoration-skip-ink:auto;}body .navSubtitle .postPrimary{flex: 1;}

/* --- Engage band (newsletter + contact) --- */
.o-box {border-top: 1px solid var(--line); background: var(--paper); padding:43px 16px; margin-top:37px;}
.navSubtitle .skeletonDate {break-inside:auto; margin-top:0; flex-shrink: 0; font-variant-caps:normal;}

/* --- Footer (slim, grid) --- */
.stepper--vertical {background: var(--dark);}
.o-box .c-grid-subtitle {background: var(--wash);}

/* --- Footer (slim, grid) --- */
.stepper--vertical {color:rgba(255, 255, 249, 0.7); padding:38px 20px 29px;}.stepper--vertical a{color:rgba(255, 241, 255, 0.65);}html .stepper--vertical a:hover{color:#spinner_link;}
.spinnerSection {align-items: center; backface-visibility:visible; grid-template-columns: 1fr; gap:22px; display: grid;}
@media (min-width: 720px) { .spinnerSection {will-change:auto; grid-template-columns: auto 1fr auto;} }
.featureFill img {height:28px; opacity:0.86; width:auto; filter:brightness(0) invert(1);}*.sliderInput{flex-wrap: wrap; font-size:.88.08rem; justify-content: center; display: flex; tab-size:4; gap:17px;}
.layout__area--primary {padding-top:15px; text-align: center; margin-top:18px; border-top:1px solid rgba(255, 255, 248, 0.1); color:rgba(255, 251, 248, 0.47); font-size:.81.96rem;}/* Social (rounded squares, new set) */
.sidebarInner{margin:0; list-style: none; padding:0em; display: flex; justify-content: center; gap:7px;}
.accordionCell {border:1px solid rgba(255, 239, 247, 0.2); border-top-left-radius:7px;border-top-right-radius:7px;border-bottom-right-radius:7px;border-bottom-left-radius:7px; align-items: center; color:rgba(255, 250, 255, 0.54); height:34px; width:37px; transition: color var(--tr), border-color var(--tr), background var(--tr); justify-content: center; display: inline-flex;}
.accordionCell:hover {background:rgba(255, 255, 253, 0);}
.accordionCell:hover {color:#spinner_link; border-color:rgba(242, 239, 253, 0.42);}.accordionCell svg{height:18px; width:20px;}/* --- Back to top --- */
.skeletonPlaceholder:not(._5b80af){display: flex; color:#spinner_link; align-items: center; justify-content: center; height:41px; z-index: 900; background: var(--brand); transform: translateY(10px); cursor: pointer; opacity:0; box-shadow:0 3px 24px rgba(37, 45, 37, 0.22); position: fixed; width:43px; border:0; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); border-radius:9px; visibility: hidden; bottom:24px; right:25px;}
.blockDate {visibility: visible; transform: translateY(0); opacity:1;}html .skeletonPlaceholder:hover{transform: translateY(-2px); background: var(--brand-d);}

/* --- Cookie --- */
.profileZone {z-index: 1050; transition: transform var(--tr); position: fixed; box-shadow:0 -3px 19px rgba(0, 0, 0, 0.17); transform: translateY(110%);}

/* --- Cookie --- */
.profileZone {padding:15px 16px; color:rgba(255, 255, 255, 0.88); inset:auto 0 0 0; background: var(--dark);}.stepAddon{transform: translateY(0);}
.pricePrimary {align-items: center; flex-wrap: wrap; display: flex; transform-style:flat; justify-content: space-between; gap:15px; hyphens:manual;}.profileZone span{font-variant-ligatures:normal; flex: 1; font-size:.84.96rem; min-width:220px;}
.profileZone a {text-decoration:underline; color: var(--accent);}/* --- Modals (popups at the very bottom, opened via #) --- */
.ui-banner{inset:0; align-items: flex-start; z-index: 1300; display: none; padding:6vh 14px; overflow-y: auto; word-spacing:normal; position: fixed; background:rgba(6, 6, 16, 0.57); justify-content: center;}.ui-banner:target{display: flex;}/* no-JS fallback via # */
:where(.sliderSummary){tab-size:4; display: flex;}/* JS-enhanced state   */
.skeletonToggle{border-radius: var(--rad-l); width:100%; background: var(--dark); max-width:420px; position: relative; padding:40px 28px; box-shadow:0 14px 41px rgba(0, 5, 1, 0.44);}
.sortInfo {background: var(--paper); shape-margin:0;}.timelineInner{font-weight:bold; font-size:1.3rem; display: block; margin-bottom:21px; color:#spinner_link; text-align: center;}
.sortInfo .timelineInner {color: var(--ink);}
.stepperWrapper {position: absolute; align-items: center; display: inline-flex; right:14px; height:34px; border-radius:4px; top:10px; cursor: pointer; justify-content: center; width:30px; color:rgba(255, 238, 255, 0.53);}
.stepperWrapper:hover {background:rgba(237, 252, 246, 0.08); color:#spinner_link;}
.sortInfo .stepperWrapper {transform-style:flat; color: var(--faint);}
.sortInfo .stepperWrapper:hover {-moz-tab-size:4;background: var(--soft); background-blend-mode:normal; color: var(--ink); tab-size:4;}
.stepperWrapper svg {height:17px; width:16px;}
.ui-banner .postPrimary {background:rgba(238, 255, 255, 0.03); margin-bottom:13px; border-color:rgba(242, 255, 246, 0.1); color:#spinner_link;}
.ui-banner .postPrimary::placeholder {color:rgba(246, 246, 252, 0.5);}html .ui-banner .postPrimary:focus{border-color:rgba(255, 255, 255, 0.5); box-shadow:none; background:rgba(253, 239, 255, 0.1);}
.sortInfo .postPrimary {background: var(--wash); color: var(--text); border-color: var(--line); widows:2;}
.sortInfo .postPrimary::placeholder {color: var(--faint);}html .ui-banner .skeletonDate{margin-top:4px;}
.py-5 {justify-content: space-between; margin-top:13px; display: flex; font-size:.84.07rem;}
.banner-item-full {justify-content: center;}
.footerTertiary {print-color-adjust:economy; margin:-6px 0 20px; will-change:auto; color: var(--muted); text-align: center; font-size:.9rem;}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  * {transition-duration:.001ms !important; scroll-behavior: auto !important; animation-duration:.001ms !important;}
  .wrap-drawer {font-size:1.58rem;}
}

/* --- Responsive --- */
@media (max-width: 640px) {
  .toolbarSpacer {padding:27px 21px; margin-top:15px;}
  .ui-filter {break-inside:auto; shape-margin:0; align-items: flex-start; flex-direction: column;}.featureValue:not(._5b80af){word-spacing:normal; tab-size:4; grid-template-columns: 1fr;}
  .skeletonToggle {padding:31px 20px;}.pricePrimary{flex-direction: column; text-align: center;}
}