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

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

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

html {-webkit-text-size-adjust:100%; scroll-behavior: smooth; font-size:18px;}
body {overflow-x: hidden; background: var(--wash); color: var(--text); font-family: var(--ff); margin:0; -moz-osx-font-smoothing:grayscale; font-size:1.03rem; -webkit-font-smoothing:antialiased; line-height:1.7;}
.search-addon:not(:last-child) {opacity:0.17; transition:transform 0.45s ease-in-out; text-decoration:none}

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

h1 {font-weight:800; margin:0;}

h1 {color: var(--ink); letter-spacing:-.15.04em; line-height:1.22;}

p {margin:0 0 1.17em;}
:focus-visible {outline: 2px solid var(--accent); outline-offset:2px; tab-size:4;}

.gridSeparator {border:none; width:1px; height:1px; margin:-1px; clip:rect(0, 0, 0, 0); overflow: hidden;}

.gridSeparator {white-space: nowrap; padding:0; position: absolute;}body .snackbarAddon{font-size:.8.95rem; color: var(--muted); margin:0 0 13px;}
.statusHolder {padding:29px 17px 0;}

/* --- Wrap / sections / grid --- */
.pr-end {print-color-adjust:economy; padding:0 20px; margin:0 auto; font-synthesis:weight style small-caps; max-width: var(--wrap); width:100%;}
.statusHolder > .tagThumb {margin-right:auto; margin-left:auto; max-width: var(--wrap);}

.tableSuffix {grid-template-columns: 1fr; gap:13px;}

.tableSuffix {display: grid;}
@media (min-width: 680px) {html .tableSuffix{image-rendering:auto; grid-template-columns: 1fr 1fr;} }

/* --- Section title (span, styled — no heading tags outside content) --- */
.tagThumb {display: block; margin:0 0 15px; font-weight:bold; color: var(--ink); font-size:1.24rem; letter-spacing:-.0.92em; border-left: 3px solid var(--accent); padding-left:11px;}

/* --- Reading progress --- */
.badgeInfo {position: fixed; width:0; background: var(--accent); inset:0 auto auto 0; transition:width 0.097s linear; widows:2; z-index: 1200; height:3px;}
.toggleCount {font-size:0.95rem; margin-bottom:7px;}

/* --- Top bar (static, content stays high) --- */
.alert-time-loading {border-bottom: 2px solid var(--accent); background: var(--paper); word-spacing:normal;}
.t-footer-extra {height:57px; align-items: center; gap:18px;}
.divider-time {position:static; height:auto; justify-content:space-around}

@media (min-width: 960px) {
  .review-expand > zone {gap:0.375rem; padding-top:23px; text-align:justify; position:absolute; padding-bottom:20px}
  .layout-icon + .dialog-overlay {transition:all 0.45s ease; overflow:auto; position:relative; flex:1; letter-spacing:0.1em; text-transform:lowercase}
}


.t-footer-extra {display: flex;}
.alert__preview {align-items: center; margin-right:auto; display: inline-flex; color: var(--brand);}
.progress-date + .tooltip-dot {max-width:320px; position:absolute; transition:all 0.3s ease; margin-left:46px}


.toolbarSlot {display: flex; gap:7px;}
.alert__preview img, .alert__preview svg {display: block; height:27px; width:auto;}
.layoutAddon {transition: color var(--tr), background var(--tr); display: block; color: var(--text); border-radius: var(--rad-s); font-weight:600; padding:8px 9px; font-size:.8.94rem;}.drawerOverlay{align-items: center; display: flex; gap:4px;}html .layoutAddon:hover{background: var(--accent-soft); color: var(--brand);}

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

/* --- Buttons --- */
.dividerDetail {font-size:.8.99rem; padding-top:11px;padding-right:22px;padding-bottom:11px;padding-left:22px; color:#fdf8ff; border-radius: var(--rad); transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); align-items: center; display: inline-flex; white-space: nowrap; background: var(--brand); gap:11px; border: 1.5px solid var(--brand); font-family: var(--ff); font-weight:600; break-inside:auto; cursor: pointer; justify-content: center; line-height:1.4; orphans:2;}.dividerDetail:hover{background: var(--brand-d); border-color: var(--brand-d); color:#f2fff1;}
.layout-icon + .dialog-overlay {margin-left:14px; margin-top:28px; text-decoration:underline; text-transform:lowercase}

.reviewDetail {font-size:.83.94rem; padding:3px 14px;}
.dividerDetail:active {transform: translateY(1px);}html .el-action-trigger{color: var(--brand); background:transparent;}
.el-action-trigger:hover {color:#f0fffe; background: var(--brand);}
.replyLine {border-color: var(--accent); background: var(--accent); font-variant-ligatures:normal;}
.replyLine:hover {background: var(--accent-d); border-color: var(--accent-d);}
.chip__cap--danger {padding:10px 10px;}*.dividerSpacer{perspective:none; display: flex; width:100%;}
.chip__cap--danger svg {width:17px; isolation:auto; height:18px;}

/* --- Cards --- */
.breadcrumbMeta {background: var(--paper); border: 1px solid var(--line); border-radius: var(--rad-l);}
.footerHandle {padding-top:21px;padding-right:27px;padding-bottom:21px;padding-left:27px;}

/* --- Post (article) — first block, content high --- */
.moduleExpand {margin:30px auto 0;}

/* --- Post (article) — first block, content high --- */
.moduleExpand {transform-style:flat; text-decoration-skip-ink:auto; overflow: hidden; max-width: var(--wrap); padding:31px 39px;}
.accordionRegion {font-size:1.79rem; margin-bottom:15px;}*.stepThumb{align-items: center; display: inline-flex;}
.menu__holder--loading {padding-bottom:22px; flex-wrap: wrap; display: flex; align-items: center; color: var(--muted); contain:none; border-bottom: 1px solid var(--soft); gap:10px; text-underline-offset:auto; font-size:.82.02rem;}
.stepThumb svg {margin-right:3px; width:16px; opacity:0.6; height:11px;}
.postOuter {font-style:italic; opacity:0.77;}
.leading-auto {isolation:auto; margin-bottom:12px; justify-content: space-between; align-items: center; display: flex;}

/* --- TOC --- */
.popoverWrapper {padding-top:17px;padding-right:19px;padding-bottom:17px;padding-left:19px; border: 1px solid var(--soft); background: var(--wash); border-radius: var(--rad); margin:22px 0 3px;}
.popoverRegion {color: var(--ink); font-weight:bold; page-break-inside:auto; background-blend-mode:normal; font-size:.92.08rem;}.table-item-flat{color: var(--brand); cursor: pointer; font-size:.82.08rem; border:0; padding-top:2px;padding-right:3px;padding-bottom:2px;padding-left:3px; background:none;}
.modulePlaceholder {flex-direction: column; display: flex;}
.modulePlaceholder a {transition: color var(--tr), padding-left var(--tr), border-color var(--tr); font-size:.88.05rem; padding:3px 0; color: var(--text); border-left:2px solid transparent;}*.modulePlaceholder a:hover{color: var(--brand); border-left-color: var(--brand); padding-left:7px;}
.review-expand > zone {transition:opacity 0.4s; background-color:transparent; gap:0.625rem; min-height:100vh; display:grid}

.action__outer--bottom {padding-left:15px !important;}
.action__outer--bottom:hover {padding-left:21px !important;}/* --- Rich text (the only place with headings, coming from content) --- */
.tabsInner{padding-top:21px; line-height:1.85; isolation:auto; font-size:1.03rem; color: var(--text);}
.tabsInner > :first-child {margin-top:0;}.tabsInner h2{font-size:1.39rem; padding-bottom:.2.99em; margin:1.88em 0 .4.99em; border-bottom: 2px solid var(--accent-soft); line-height:1.3; font-weight:bold; color: var(--ink);}.tabsInner h3{margin:1.46em 0 .45.04em; color: var(--ink); font-size:1.2rem;}
.page-title:hover {display:block; align-items:baseline; transition:opacity 0.35s; letter-spacing:normal; cursor:default}
.tabsInner h3{font-weight:bold; line-height:1.3;}
.tabsInner h4 {color: var(--ink); font-size:1.04rem; font-weight:700; margin:1.32em 0 .4em;}
.table-overlay:first-child {flex-wrap:nowrap; border:1px solid #8df801; background-color:transparent}

.tabsInner p {margin:0 0 1.22em;}.tabsInner img{margin:1.48em 0; border-radius: var(--rad);}.tabsInner a{color: var(--brand); text-decoration:underline; text-underline-offset:2px;}
.tabsInner a:hover {color: var(--brand-d);}
.tabsInner ul, .tabsInner ol {text-underline-offset:auto; margin:0.95em 0; page-break-inside:auto; padding-left:1.62em;}html .tabsInner li{margin-bottom:.4.01em;}
.tabsInner blockquote {border-radius: 0 var(--rad) var(--rad) 0; background: var(--accent-soft); border-left: 4px solid var(--accent); padding:12px 21px; color: var(--ink); font-style:italic; margin:1.53em 0;}
.tabsInner table {border-collapse:collapse; width:100%; font-size:.94.98rem; margin:1.57em 0;}
.tabsInner th, .tabsInner td {text-align: left; padding:7px 12px; border: 1px solid var(--line);}
.tabsInner th {background: var(--wash); font-weight:bold;}body .tabsInner pre{font-size:.87.99rem; margin:1.51em 0; color:#c4dade; line-height:1.6; overflow-x: auto; border-radius: var(--rad); padding:14px; background-color:#0f211c;}.tabsInner code{padding:2px 3px; border-radius:1px; background: var(--wash); font-size:.8.93em;}
.tabsInner pre code {background:none; padding:0;}

/* --- Share (rounded-square icons) --- */
.commentOverlay {border-top: 1px solid var(--soft); align-items: center; flex-wrap: wrap; display: flex; gap:16px; padding-top:20px; margin-top:22px;}
.badge-number {font-weight:400; transition:all 0.4s ease}

.statusImage {font-size:.85.97rem; color: var(--muted);}
.statusImage {font-weight:600;}.info-section{gap:4px; display: flex;}
#dialog-summary {line-height:1.625; padding-right:1.5rem; letter-spacing:0.1em; margin-right:auto}

.threadContainer {cursor: pointer; border-radius:9px; align-items: center; height:36px; transition: color var(--tr), border-color var(--tr), background var(--tr); color: var(--muted); background: var(--paper); justify-content: center; width:42px; display: inline-flex; border: 1px solid var(--line);}
.threadContainer:hover {-moz-tab-size:4;color:#fffdff; tab-size:4; background: var(--brand); border-color: var(--brand);}
.threadContainer svg {width:14px; widows:2; height:17px; break-inside:auto;}

/* --- Related --- */
.spinnerBackdrop {grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:14px; display: grid; image-rendering:auto;}
.tooltipCount {display: block; transition: border-color var(--tr), box-shadow var(--tr);}
.tooltipCount {border: 1px solid var(--line); padding:13px 14px; font-variant-ligatures:normal; border-radius: var(--rad); background: var(--paper); background-blend-mode:normal;}
.tooltipCount:hover {box-shadow:0 8px 13px rgba(9, 45, 40, 0.04); border-color: var(--accent);}body .c-dialog-placeholder{color: var(--ink); line-height:1.4; font-size:.8.92rem; font-weight:600;}

/* --- Forms --- */
.pagePrefix {display: block;}
.tooltipArea {display: block; color: var(--text);}
.tooltipArea {border-radius: var(--rad); width:100%; contain:none; transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); padding:9px 13px; border: 1px solid var(--line); background: var(--wash); font-size:.9.04rem; text-decoration-skip-ink:auto; outline:none; font-family: var(--ff);}
.tooltipArea:focus {background: var(--paper); box-shadow:0 0 0 7px rgba(37, 147, 165, 0.2); border-color: var(--accent);}
.c-price {min-height:99px;}.row-8{min-height:130px; margin-top:10px; resize: vertical;}
.pagePrefix .dividerDetail {margin-top:14px;}
.view__info--odd {gap:6px; display: flex;}
.view__info--odd .tooltipArea {flex: 1;}
.view__info--odd .dividerDetail {flex-shrink: 0; margin-top:0;}/* --- Engage band (newsletter + contact) --- */
.count-page{margin-top:32px; background: var(--paper); border-top: 1px solid var(--line); padding-top:37px;padding-right:21px;padding-bottom:37px;padding-left:21px;}

/* --- Footer (slim, grid) --- */
.ratingContainer {background: var(--dark); isolation:auto; color:rgba(255, 250, 237, 0.59); padding:31px 16px 30px; text-rendering:auto;}
.count-page .breadcrumbMeta {background: var(--wash);}
.ratingContainer a {color:rgba(255, 255, 255, 0.62);}
.ratingContainer a:hover {color:#fff7ff;}
.avatarThumb {display: grid; align-items: center; grid-template-columns: 1fr; gap:24px;}
@media (min-width: 720px) {.avatarThumb{grid-template-columns: auto 1fr auto;} }.listSpacer img{height:26px; opacity:0.89; filter:brightness(0) invert(1); width:auto;}.boxDate{text-align: center; border-top:1px solid rgba(243, 241, 255, 0.17); margin-top:23px; padding-top:21px; color:rgba(248, 255, 251, 0.54); font-size:.81.92rem;}*.border-lg{flex-wrap: wrap; font-size:.88.06rem; justify-content: center; gap:13px; display: flex;}
.cardIndicator {transition: color var(--tr), border-color var(--tr), background var(--tr); align-items: center; border:1px solid rgba(255, 255, 242, 0.11); display: inline-flex; border-radius:11px; width:33px; color:rgba(245, 255, 255, 0.47); height:39px; justify-content: center;}/* Social (rounded squares, new set) */
.expand-divider{display: flex; padding:0; justify-content: center; will-change:auto; margin:0; list-style: none; gap:7px;}
.cardIndicator:hover {background:rgba(244, 255, 255, 0.03); color:#fff1f1; border-color:rgba(255, 251, 255, 0.34); text-rendering:auto; break-inside:auto;}
.cardIndicator svg {height:15px; width:18px;}/* --- Back to top --- */
.chipPrimary{height:40px; right:26px; position: fixed; opacity:0; background-blend-mode:normal; bottom:30px; visibility: hidden; display: flex;}
#block-text {background-color:#d4d8e2; position:absolute; width:fit-content; transition:all 0.15s ease; border-radius:50%}
/* --- Back to top --- */
.chipPrimary{justify-content: center; border-radius:12px; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); color:rgb(255, 237, 242); background: var(--brand); box-shadow:0 5px 16px rgba(36, 12, 50, 0.25); transform: translateY(10px); align-items: center; z-index: 900; border:0 none; width:40px; cursor: pointer;}
.galleryClose {opacity:1; transform: translateY(0); visibility: visible;}
.chipPrimary:hover {background: var(--brand-d); transform: translateY(-2px);}
.profilePlaceholder {transform: translateY(0);}/* --- Cookie --- */
.bannerButton{color:rgba(244, 255, 251, 0.77); background: var(--dark); transform: translateY(110%); box-shadow:0 -5px 18px rgba(0, 0, 13, 0.12); position: fixed; z-index: 1050; transition: transform var(--tr); padding-top:16px;padding-right:21px;padding-bottom:16px;padding-left:21px; inset:auto 0 0 0;}.timelineTrigger{justify-content: space-between; gap:19px; flex-wrap: wrap; align-items: center; font-synthesis:weight style small-caps; display: flex;}
.bannerButton span {min-width:218px; font-size:.85.08rem; flex: 1;}
.bannerButton a {text-decoration:underline; word-spacing:normal; color: var(--accent);}

/* --- Modals (popups at the very bottom, opened via #) --- */
.tooltipLine {display: none; z-index: 1300; padding:6vh 20px; contain:none; align-items: flex-start; justify-content: center; inset:0; position: fixed; overflow-y: auto; background:rgba(33, 20, 34, 0.62);}*.tooltipLine:target{display: flex;}          /* no-JS fallback via # */
.threadWrapper {display: flex;}            /* JS-enhanced state   */
.tabsFoot {position: relative; box-shadow:0 21px 42px rgba(10, 0, 0, 0.37); width:100%; background: var(--dark); max-width:417px;}            /* JS-enhanced state   */
.tabsFoot {border-radius: var(--rad-l); padding:35px 26px;}
.headerRow {background: var(--paper); break-inside:auto; contain:none;}
.filterWrap {font-weight:bold; margin-bottom:18px; font-size:1.29rem; display: block; text-align: center; color:#fbffff;}
.headerRow .filterWrap {color: var(--ink);}
.commentSummary {width:33px; display: inline-flex; justify-content: center; top:14px; color:rgba(255, 255, 255, 0.53); right:16px; cursor: pointer; position: absolute; height:32px; align-items: center; border-radius:6px;}.commentSummary:hover{background:rgba(255, 255, 241, 0.16); color:hsl(27, 85.9%, 97%);}
.headerRow .commentSummary {color: var(--faint);}
.headerRow .commentSummary:hover {color: var(--ink); background: var(--soft);}
.commentSummary svg {width:15px; height:16px;}
.tooltipLine .tooltipArea {isolation:auto; border-color:rgba(255, 255, 255, 0.17); background:rgba(255, 254, 245, 0.09); margin-bottom:9px; color:#ffffff;}
.tooltipLine .tooltipArea::placeholder {color:rgba(255, 255, 255, 0.47); contain:none;}
.reply-secondary {min-width:0; padding-right:3rem}

.tooltipLine .tooltipArea:focus {background:rgba(238, 237, 243, 0.09); border-color:rgba(249, 243, 255, 0.38); will-change:auto; box-shadow:none; text-decoration-skip-ink:auto;}
.menu-item:not(:last-child) {letter-spacing:normal; padding-top:0.25rem; flex:1; display:inline-block; min-width:43px}

.headerRow .tooltipArea {border-color: var(--line); background: var(--wash); color: var(--text);}
.headerRow .tooltipArea::placeholder {color: var(--faint);}
.tooltipLine .dividerDetail {margin-top:3px;}
.c-layout-body {font-size:.84.01rem;}
.c-layout-body {margin-top:14px; display: flex; justify-content: space-between;}
.layoutArea {justify-content: center;}
.toggleNumber {text-align: center; font-size:.9.06rem; margin:-10px 0 20px; color: var(--muted);}

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

/* --- Responsive --- */
@media (max-width: 640px) {.moduleExpand{will-change:auto; padding-top:20px;padding-right:24px;padding-bottom:20px;padding-left:24px; margin-top:21px; break-inside:auto;}body .accordionRegion{font-size:1.43rem;}
  .commentOverlay {flex-direction: column; align-items: flex-start;}
  .spinnerBackdrop {grid-template-columns: 1fr;}
  .tabsFoot {padding:29px 25px;}
  .timelineTrigger {flex-direction: column; text-align: center;}
}