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

/* --- Tokens --- */
:root {--ink:    #1d222b; --line:   #card-date; --soft:   #search_detail; --muted:  #737a86; --rad-s:  4px; --brand:    #1b6599; --rad-l:  10px; --accent-d: #22807f; --accent:   #289a99; --dark:   #15181f; --tr: .2s ease; --faint:  #prefix-entry; --text:   #3f4651; --wrap:   860px; --brand-d:  #155080; --accent-soft: rgba(40, 154, 153, .1); --wash:   #site-banner; --rad:    6px; --ff: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        Arial, "Noto Sans", "Liberation Sans", sans-serif; --paper:  #page_zone;}/* --- Base --- */
*, *::before, *::after{box-sizing: border-box;}

html {-webkit-text-size-adjust:100%; font-size:13px; scroll-behavior: smooth;}
body {color: var(--text); background: var(--wash); line-height:1.7; -webkit-font-smoothing:antialiased; margin:0; font-family: var(--ff); font-size:1.03rem; overflow-x: hidden; -moz-osx-font-smoothing:grayscale;}
img, svg {max-width:100%; height:auto;}img{display: block; print-color-adjust:economy;}
a {text-decoration:none; color: var(--brand); transition: color var(--tr);}
a:hover {color: var(--brand-d);}

h1 {font-weight:700; line-height:1.22; margin:0rem; color: var(--ink); letter-spacing:-.15em;}
:focus-visible {font-synthesis:weight style small-caps; outline: 2px solid var(--accent); orphans:2; outline-offset:2px;}

p {margin:0 0 1.15em; print-color-adjust:economy;}*.el-pagination{width:1px; position: absolute; clip:rect(0, 0, 0, 0); white-space: nowrap; padding:0; border:0 none; overflow: hidden; height:1px; margin:-1px;}
.timelineExtra {font-size:.8.95rem; color: var(--muted); margin:0 0 16px;}/* --- Wrap / sections / grid --- */
.postOverlay{width:100%; max-width: var(--wrap); margin:0 auto; padding:0 19px;}
.bannerInfo {padding:26px 23px 0;}
.bannerInfo > .carouselDetail {max-width: var(--wrap); margin-right:auto; margin-left:auto;}body .commentValue{grid-template-columns: 1fr; display: grid; gap:19px;}
@media (min-width: 680px) {.commentValue:not(._100d64){grid-template-columns: 1fr 1fr;} }
.entryAddon {font-size:0.97rem; margin-bottom:14px;}/* --- Section title (span, styled — no heading tags outside content) --- */
.carouselDetail{border-left: 3px solid var(--accent); font-weight:700; letter-spacing:-.0.97em; display: block; color: var(--ink); padding-left:9px; margin:0 0 12px; font-size:1.16rem;}

/* --- Top bar (static, content stays high) --- */
.dropdownOuter {border-bottom: 2px solid var(--accent); background: var(--paper);}/* --- Reading progress --- */
.entryNumber{width:0; position: fixed; height:3px; inset:0 auto auto 0; z-index: 1200; background: var(--accent); transition:width 0.118s linear;}
.popoverOverlay {display: flex;}
.popoverOverlay {height:60px; align-items: center; gap:17px;}
.navOverlay {align-items: center; display: inline-flex; word-spacing:normal; margin-right:auto; color: var(--brand);}
.navOverlay img, .navOverlay svg {height:27px;}
.navOverlay img, .navOverlay svg {display: block; width:auto;}

.sidebarPreview {gap:5px; display: flex;}
.moduleItem {font-weight:600; color: var(--text); border-radius: var(--rad-s); padding:12px 16px; display: block; transition: color var(--tr), background var(--tr); font-size:.8.93rem;}
.moduleItem:hover {color: var(--brand); background: var(--accent-soft);}
.navItem {image-rendering:auto;}
.navItem {display: flex; gap:4px; align-items: center;}

@media (max-width: 560px) {
  .sidebarPreview {display: none;}
}/* --- Buttons --- */
.screenSlot{justify-content: center; background-blend-mode:normal; color:#tag-icon; padding:13px 17px; cursor: pointer; white-space: nowrap; border: 1.5px solid var(--brand); font-size:.9.01rem; background: var(--brand); gap:10px; display: inline-flex; font-family: var(--ff); align-items: center; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); line-height:1.4; border-radius: var(--rad); font-weight:500;}
.screenSlot:hover {color:#tag-icon;}
.screenSlot:hover {border-color: var(--brand-d); background: var(--brand-d);}
.screenSlot:active {transform: translateY(1px);}
.sortExpand {widows:2; padding:6px 16px; font-size:.83.99rem;}
.widgetPreview {color: var(--brand); background:transparent;}
.widgetPreview:hover {color:#tag-icon; font-variant-ligatures:normal; background: var(--brand);}*.replyIcon{background: var(--accent); border-color: var(--accent);}
.replyIcon:hover {border-color: var(--accent-d); background: var(--accent-d);}
.alertSubtitle {display: flex; width:100%;}
.rating__meta--dark {print-color-adjust:economy; text-rendering:auto; padding:12px 12px;}
.rating__meta--dark svg {width:20px; height:13px;}

/* --- Cards --- */
.sortSuffix {background: var(--paper); border-radius: var(--rad-l); border: 1px solid var(--line);}
.featureBody {padding:20px 25px;}/* --- Post (article) — first block, content high --- */
.postZone{margin:27px auto 0; max-width: var(--wrap); padding:32px 42px; overflow: hidden;}
.chipSuffix {padding-bottom:19px; border-bottom: 1px solid var(--soft); flex-wrap: wrap; align-items: center; color: var(--muted); font-size:.81.93rem; display: flex; gap:12px;}
.menuRegion {margin-bottom:16px; font-size:1.87rem;}
.snackbarTime {display: inline-flex; align-items: center;}
.snackbarTime svg {margin-right:9px; height:11px; opacity:0.48; width:12px;}

/* --- TOC --- */
.toggleBackdrop {border-radius: var(--rad); border: 1px solid var(--soft); padding:20px 24px; margin:27px 0 8px; background: var(--wash);}
.drawerThumb {font-style:italic; opacity:0.82;}
.bannerNumber {display: flex; align-items: center; justify-content: space-between; margin-bottom:10px;}
.avatar {color: var(--ink); font-size:.91.95rem; font-weight:700;}
.navPlaceholder {flex-direction: column; display: flex;}
.view--elevated {padding:2px 10px; border:0 none; color: var(--brand); background:none; font-size:.81.98rem; cursor: pointer;}.navPlaceholder a{transition: color var(--tr), padding-left var(--tr), border-color var(--tr); color: var(--text); border-left:2px solid transparent; padding:3px 0; font-size:.87.98rem; will-change:auto;}
.navPlaceholder a:hover {border-left-color: var(--brand); color: var(--brand); padding-left:9px;}
.chipBlock {padding-left:16px !important;}
.chipBlock:hover {padding-left:26px !important;}

/* --- Rich text (the only place with headings, coming from content) --- */
.blockBar {line-height:1.85; font-size:1.09rem; padding-top:26px; color: var(--text);}
.blockBar > :first-child {margin-top:0; page-break-inside:auto; tab-size:4;}*.blockBar h2{font-size:1.44rem; page-break-inside:auto; line-height:1.3; margin:1.98em 0 .4.96em; font-weight:700; color: var(--ink); padding-bottom:.2.96em; border-bottom: 2px solid var(--accent-soft);}
.blockBar h3 {line-height:1.3; font-weight:bold; color: var(--ink); font-size:1.22rem; margin:1.55em 0 .44.97em;}html .blockBar h4{font-weight:bold; font-size:1.12rem; color: var(--ink); margin:1.33em 0 .4.01em;}*.blockBar p{margin:0 0 1.07em;}
.blockBar img {margin:1.55em 0; widows:2; transform-style:flat; border-radius: var(--rad);}
.blockBar a {text-underline-offset:2px; text-decoration:underline; backface-visibility:visible; font-synthesis:weight style small-caps; color: var(--brand);}
.blockBar a:hover {color: var(--brand-d);}body .blockBar ul, body .blockBar ol{page-break-inside:auto; padding-left:1.74em; margin:0.96em 0;}body .blockBar li{margin-bottom:.4.03em;}*.blockBar blockquote{border-radius: 0 var(--rad) var(--rad) 0; background: var(--accent-soft); margin:1.53em 0; color: var(--ink); padding:18px 21px; border-left: 4px solid var(--accent); font-style:italic;}
.blockBar table {margin:1.46em 0; width:100%; border-collapse:collapse; font-size:.94.99rem;}
.blockBar th, .blockBar td {padding:10px 17px;}
.blockBar th, .blockBar td {text-align: left; border: 1px solid var(--line);}
.blockBar th {background: var(--wash); font-weight:bold;}
.blockBar pre {background:hsl(306, 25.3%, 10%); margin:1.47em 0; padding-top:15px;padding-right:15px;padding-bottom:15px;padding-left:15px; page-break-inside:auto; overflow-x: auto; line-height:1.6; color:#main-action; font-size:.87.92rem; border-radius: var(--rad); image-rendering:auto;}.blockBar code{border-radius:none; background: var(--wash); font-size:.8.95em; padding:2px 5px;}*.blockBar pre code{padding:0em; background:none; print-color-adjust:economy; text-underline-offset:auto;}

/* --- Share (rounded-square icons) --- */
.blockValue {margin-top:25px; padding-top:26px; display: flex; border-top: 1px solid var(--soft); flex-wrap: wrap; gap:13px; align-items: center;}.navArea{font-size:.86.03rem; color: var(--muted); widows:2; font-weight:600;}
.boxSection {border-radius:8px; cursor: pointer; width:34px; transition: color var(--tr), border-color var(--tr), background var(--tr); justify-content: center; height:37px; background: var(--paper); border: 1px solid var(--line);}
.w-center {display: flex; gap:10px;}
.boxSection {align-items: center; color: var(--muted); display: inline-flex;}
.boxSection:hover {background: var(--brand); border-color: var(--brand); color:#tag-icon;}

/* --- Related --- */
.breadcrumbAction {gap:16px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); display: grid;}
.boxSection svg {width:17px; height:18px;}*.modalRow{border: 1px solid var(--line); border-radius: var(--rad); display: block; padding:12px 18px; transition: border-color var(--tr), box-shadow var(--tr); background: var(--paper);}
.modalRow:hover {border-color: var(--accent); box-shadow:0 4px 12px rgba(27, 16, 64, 0.09);}body .stepperButton{color: var(--ink); font-size:.8.93rem; line-height:1.4; font-weight:600;}body .gridSuffix{border-radius: var(--rad); display: block; outline:none; color: var(--text); padding:9px 16px; width:100%; font-family: var(--ff); background: var(--wash); border: 1px solid var(--line); transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); font-size:.9.02rem;}

/* --- Forms --- */
.selectPreview {display: block;}
.postTime {margin-top:18px;}
.gridSuffix:focus {border-color: var(--accent); box-shadow:0 0 0 6px rgba(36, 162, 154, 0.14); background: var(--paper);}
.postTime {min-height:132px; resize: vertical;}
.selectPreview .screenSlot {margin-top:14px;}body .menuFoot{min-height:100px;}
.t-select {display: flex; gap:7px;}
.t-select .gridSuffix {flex: 1; text-underline-offset:auto;}.t-select .screenSlot:not(._100d64){flex-shrink: 0; margin-top:0;}/* --- Engage band (newsletter + contact) --- */
:where(.sectionGroup){border-top: 1px solid var(--line); padding:41px 20px; background: var(--paper); margin-top:32px;}
.sectionGroup .sortSuffix {background: var(--wash);}/* --- Footer (slim, grid) --- */
.post-extra{color:rgba(251, 238, 255, 0.58); background: var(--dark); padding:32px 23px 25px;}
.post-extra a {color:rgba(247, 255, 247, 0.62);}*.selectThumb{grid-template-columns: 1fr; align-items: center; display: grid; gap:16px;}
.post-extra a:hover {color:#tag-icon;}
@media (min-width: 720px) { .selectThumb {grid-template-columns: auto 1fr auto;} }body .accordionOuter img{height:26px; opacity:0.82; width:auto;}body .accordionOuter img{filter:brightness(0) invert(1);}.text-block{justify-content: center; display: flex; font-size:.88.08rem; gap:17px; flex-wrap: wrap; orphans:2;}
.c-status {padding-top:14px; font-size:.82.02rem; border-top:1px solid rgba(239, 255, 242, 0.07); margin-top:20px; color:rgba(248, 255, 255, 0.52); text-align: center;}

/* Social (rounded squares, new set) */
.profileInner {padding:0; justify-content: center; margin:0;}

/* Social (rounded squares, new set) */
.profileInner {gap:12px; display: flex; list-style: none;}html .cardSection{border:1px solid rgba(255, 243, 255, 0.11); border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px; height:38px; justify-content: center; display: inline-flex; align-items: center; transition: color var(--tr), border-color var(--tr), background var(--tr); width:33px; color:rgba(242, 237, 252, 0.49);}
.cardSection:hover {border-color:rgba(248, 252, 255, 0.39); color:#tag-icon; background:rgba(255, 255, 255, 0.13);}
.cardSection svg {width:18px; height:18px;}

/* --- Back to top --- */
.paginationSpacer {position: fixed; box-shadow:0 7px 19px rgba(13, 28, 36, 0.16); transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); border:0 none; tab-size:4; opacity:0; visibility: hidden; border-radius:12px; height:44px; transform: translateY(10px); bottom:29px; display: flex; background: var(--brand); width:40px; cursor: pointer; right:25px; z-index: 900; align-items: center; backface-visibility:visible; color:#tag-icon; justify-content: center;}html .postSection{visibility: visible; transform: translateY(0); opacity:1;}html .paginationSpacer:hover{transform: translateY(-2px); background: var(--brand-d); shape-margin:0;}

/* --- Cookie --- */
.tabsBar {background: var(--dark); transition: transform var(--tr); position: fixed; transform: translateY(110%); z-index: 1050; padding:18px 22px; inset:auto 0 0 0; box-shadow:0 -7px 21px rgba(0, 12, 0, 0.2); color:rgba(255, 248, 255, 0.77);}
.layoutTrack {transform: translateY(0);}*.counter--secondary{gap:16px; flex-wrap: wrap; display: flex; align-items: center; justify-content: space-between;}
.tabsBar span {font-size:.85.02rem; flex: 1; min-width:221px;}
.tabsBar a {text-decoration:underline; color: var(--accent);}

/* --- Modals (popups at the very bottom, opened via #) --- */
.snackbarNumber {align-items: flex-start; inset:0px; background:rgba(0, 21, 16, 0.61); display: none; overflow-y: auto; z-index: 1300; position: fixed; padding:6vh 20px; justify-content: center;}
.snackbarNumber:target {display: flex;}/* no-JS fallback via # */
.paginationSubtitle{print-color-adjust:economy; display: flex;}/* JS-enhanced state   */
.actionText{mix-blend-mode:normal; border-radius: var(--rad-l); padding:35px 33px; position: relative; max-width:417px; background: var(--dark); will-change:auto; width:100%; box-shadow:0 20px 42px rgba(15, 0, 0, 0.44);}
.galleryMeta {background: var(--paper);}
.priceFill {margin-bottom:22px; display: block; font-size:1.26rem; text-align: center; color:#tag-icon; widows:2;}
.priceFill {font-weight:bold;}
.galleryMeta .priceFill {color: var(--ink);}
.menuBody {border-radius:7px; cursor: pointer; height:31px; color:rgba(237, 255, 255, 0.47); width:30px; display: inline-flex; align-items: center; justify-content: center; right:9px; position: absolute; top:12px;}
.menuBody:hover {background:rgba(255, 255, 255, 0.07); color:#tag-icon;}
.galleryMeta .menuBody {color: var(--faint);}
.galleryMeta .menuBody:hover {background: var(--soft); color: var(--ink);}
.menuBody svg {width:16px; height:21px;}.snackbarNumber .gridSuffix:not(._100d64){background:rgba(255, 240, 250, 0.01); margin-bottom:10px; color:#tag-icon; border-color:rgba(255, 238, 245, 0.26);}
.snackbarNumber .gridSuffix::placeholder {color:rgba(250, 246, 248, 0.56); text-underline-offset:auto;}
.snackbarNumber .gridSuffix:focus {box-shadow:none; background:rgba(255, 254, 255, 0.07);}
.snackbarNumber .gridSuffix:focus {border-color:rgba(248, 239, 255, 0.43);}
.galleryMeta .gridSuffix {color: var(--text); background: var(--wash); border-color: var(--line);}.galleryMeta .gridSuffix::placeholder{color: var(--faint);}
.snackbarNumber .screenSlot {margin-top:3px;}.t-dialog:not(._100d64){font-size:.83.95rem; margin-top:12px; justify-content: space-between; display: flex;}
.screenOverlay {justify-content: center;}
.profileDot {margin:-5px 0 17px; text-align: center; font-size:.9.04rem; color: var(--muted);}
}

/* --- Responsive --- */
@media (max-width: 640px) {
  .postZone {padding:25px 19px; margin-top:14px;}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  * {transition-duration:.001ms !important; scroll-behavior: auto !important; animation-duration:.001ms !important;}body .menuRegion{font-size:1.46rem;}
  .breadcrumbAction {grid-template-columns: 1fr;}
  .blockValue {font-variant-ligatures:normal; flex-direction: column; align-items: flex-start;}.counter--secondary:not(._100d64){flex-direction: column; text-align: center; image-rendering:auto;}.actionText{orphans:2; padding:32px 25px; mix-blend-mode:normal;}
}