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

/* --- Tokens --- */
:root{--accent:   #289a99; --muted:  #737a86; --line:   #e4e7ec; --wrap:   860px; --rad-s:  4px; --ff: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        Arial, "Noto Sans", "Liberation Sans", sans-serif; --accent-soft: rgba(40, 154, 153, .1); --brand:    #1b6599; --faint:  #a2a8b2; --accent-d: #22807f; --dark:   #15181f; --ink:    #1d222b; --rad-l:  10px; --soft:   #eef1f5; --brand-d:  #155080; --paper:  #ffffff; --wash:   #f5f6f9; --rad:    6px; --tr: .2s ease; --text:   #3f4651;}/* --- Base --- */
*, *::before, *::after{box-sizing: border-box;}html{text-rendering:auto; -webkit-text-size-adjust:100%; print-color-adjust:economy; font-size:19px; scroll-behavior: smooth;}body{background: var(--wash); -moz-osx-font-smoothing:grayscale; font-family: var(--ff); color: var(--text); margin:0; line-height:1.7; -webkit-font-smoothing:antialiased; font-size:1.02rem; overflow-x: hidden;}
img, svg {max-width:100%; font-variant-ligatures:normal;}
img, svg {height:auto;}img{display: block;}
a {transition: color var(--tr); color: var(--brand); text-decoration:none;}a:hover{color: var(--brand-d);}h1{line-height:1.22; font-weight:800; letter-spacing:-.15.07em; color: var(--ink); margin:0;}
.profile-action:first-child {position:sticky; gap:1.125rem; color:#555555}


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

.ui-card {width:1px; white-space: nowrap; overflow: hidden;}

.ui-card {position: absolute; padding:0; clip:rect(0, 0, 0, 0); margin:-1px; border:0 none; height:1px;}
.screenRow {color: var(--muted); margin:0 0 12px; font-size:.8.93rem;}

/* --- Wrap / sections / grid --- */
.menuPrimary {margin:0 auto; width:100%; padding:0 19px; max-width: var(--wrap);}
.hero__data--sticky {padding:34px 22px 0;}.hero__data--sticky > :where(.dividerNumber){margin-left:auto; max-width: var(--wrap); margin-right:auto;}

.tabsPrefix {gap:17px; grid-template-columns: 1fr; widows:2; contain:none; display: grid;}
@media (min-width: 680px) { .tabsPrefix {grid-template-columns: 1fr 1fr;} }
@media (min-width: 768px) and (max-width: 1140px) {
  .progress__info {font-size:inherit; background-color:#aaaaaa; transition:opacity 0.2s; position:static}
  .media-action:not(:last-child) {border-radius:50%; align-items:stretch; margin-right:0; justify-content:flex-end; flex:none; border:none}
}



/* --- Section title (span, styled — no heading tags outside content) --- */
.dividerNumber {letter-spacing:-.1.03em; margin:0 0 17px; font-size:1.15rem; display: block; border-left: 3px solid var(--accent); padding-left:10px; color: var(--ink); font-weight:700;}

/* --- Reading progress --- */
.text-1 {position: fixed; background: var(--accent); z-index: 1200; width:0; transition:width 0.126s linear; height:7px; text-rendering:auto; inset:0 auto auto 0;}
.tabsInner {margin-bottom:11px; font-size:0.94rem;}
.footer-group:first-child {gap:8px; margin-bottom:0; max-width:100%}


/* --- Top bar (static, content stays high) --- */
.timelineInfo {border-bottom: 2px solid var(--accent); background: var(--paper); page-break-inside:auto;}*.screenBody{align-items: center; display: flex; height:61px; gap:13px;}
.extra-module {display: inline-flex; align-items: center; margin-right:auto; color: var(--brand);}.extra-module img, .extra-module svg{height:32px; width:auto;}.extra-module img, .extra-module svg{display: block;}

.headerImage {image-rendering:auto; gap:8px; display: flex;}.progressSeparator{font-weight:600; padding:4px 12px; transition: color var(--tr), background var(--tr); border-radius: var(--rad-s); display: block; font-size:.9.07rem; color: var(--text);}
.progressSeparator:hover {background: var(--accent-soft); color: var(--brand); tab-size:4;}
.progress__info {text-transform:capitalize; margin-top:0.5rem; align-items:flex-start}
.drawerToggle:not(.unused76){align-items: center; display: flex; gap:11px;}.drawerToggle:not(.unused76){isolation:auto; font-variant-ligatures:normal;}

@media (max-width: 560px) {
  .headerImage {display: none;}
}/* --- Buttons --- */
:where(.l-grid-area){padding:14px 17px; border: 1.5px solid var(--brand); border-radius: var(--rad); font-size:.8.96rem; line-height:1.4; justify-content: center; gap:10px; display: inline-flex; align-items: center; font-weight:600; font-family: var(--ff); white-space: nowrap; color:hsl(328, 47.6%, 95.7%); background: var(--brand); cursor: pointer; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr);}
.l-grid-area:hover {border-color: var(--brand-d); background: var(--brand-d); color:#ffffff;}.bannerTrigger{font-size:.83.96rem; padding-top:7px;padding-right:14px;padding-bottom:7px;padding-left:14px; will-change:auto; font-variant-ligatures:normal;}
@media (max-width: 800px) {
  .filter-line:not(:last-child) {margin-top:auto; transition:transform 0.45s ease-in-out; padding:17px; min-width:0; background-color:transparent; margin-bottom:7px}
  .sidebar-link::before {content:''; flex-wrap:wrap; height:13px; margin:auto; max-width:760px; flex:1}
  .footer__extra {align-items:stretch; max-width:100%; color:currentColor; transition:transform 0.45s ease-in-out; text-align:justify; display:table}
  .status__body {display:table; flex:1}
}

html .l-grid-area:active{transform: translateY(1px);}
.reviewSuffix {background:transparent; color: var(--brand);}
.rating-separator::before {content:''; transition:all 0.4s ease; display:block; background-color:transparent; position:sticky}

.reviewSuffix:hover {background: var(--brand); color:#ffeff7;}
.toolbar-placeholder {border-color: var(--accent); background: var(--accent);}
.toolbar-placeholder:hover {border-color: var(--accent-d); background: var(--accent-d);}
.panelAction {display: flex; width:100%;}
.el-dialog {padding:13px 16px;}
.el-dialog svg {width:15px; height:16px;}

/* --- Cards --- */
.tag-horizontal {border: 1px solid var(--line); border-radius: var(--rad-l);}

/* --- Cards --- */
.tag-horizontal {background: var(--paper);}
.toggleDetail {padding:18px 20px;}/* --- Post (article) — first block, content high --- */
.galleryAction{max-width: var(--wrap); overflow: hidden; padding:37px 34px; margin:26px auto 0;}
.counterOuter {font-synthesis:weight style small-caps; margin-bottom:15px; font-size:1.79rem;}
.stepperInner {display: flex; align-items: center; border-bottom: 1px solid var(--soft); flex-wrap: wrap; padding-bottom:22px; font-size:.82.04rem; gap:11px; color: var(--muted);}.sectionTrigger:not(.unused35){display: inline-flex; align-items: center;}
.sectionTrigger svg {margin-right:9px; height:13px; width:12px; opacity:0.48;}
.profileContainer {font-style:italic; font-variant-ligatures:normal; opacity:0.84;}
.avatarNumber {margin-bottom:7px; display: flex; align-items: center; justify-content: space-between;}/* --- TOC --- */
.mediaTitle{border: 1px solid var(--soft); text-decoration-skip-ink:auto; padding-top:13px;padding-right:22px;padding-bottom:13px;padding-left:22px; margin:21px 0 2px; background: var(--wash); border-radius: var(--rad);}body .actionZone{break-inside:auto; font-weight:bold; color: var(--ink); font-size:.91.97rem;}
.mx-1 {border:0 none; color: var(--brand); padding:2px 9px; background:none; cursor: pointer; font-size:.81.94rem;}
.ui-dropdown-region {flex-direction: column; break-inside:auto; display: flex; text-decoration-skip-ink:auto;}
.ui-dropdown-region a {transition: color var(--tr), padding-left var(--tr), border-color var(--tr); border-left:2px solid transparent; font-size:.87.97rem; color: var(--text); padding:7px 0;}
.ui-dropdown-region a:hover {border-left-color: var(--brand); padding-left:6px; color: var(--brand);}
.boxFoot {padding-left:14px !important;}
.boxFoot:hover {padding-left:24px !important;}

/* --- Rich text (the only place with headings, coming from content) --- */
.carousel-input-sparse {color: var(--text); font-size:1.03rem; line-height:1.85; padding-top:25px;}
.carousel-input-sparse > :first-child {widows:2; print-color-adjust:economy; margin-top:0;}
.media-action:not(:last-child) {min-width:40px; text-transform:capitalize}

.carousel-input-sparse h2 {line-height:1.3; margin:1.85em 0 .4.99em; padding-bottom:.3.01em; font-weight:bold; color: var(--ink); font-size:1.38rem; border-bottom: 2px solid var(--accent-soft);}
.carousel-input-sparse h3 {line-height:1.3; font-weight:700; color: var(--ink); margin:1.42em 0 .44.97em; font-size:1.2rem;}html .carousel-input-sparse h4{color: var(--ink); font-weight:700; font-size:1.13rem; margin:1.29em 0 .4.07em;}
.carousel-input-sparse p {margin:0 0 1.09em;}.carousel-input-sparse img{border-radius: var(--rad); margin:1.43em 0;}
.carousel-input-sparse a {color: var(--brand); text-underline-offset:2px; text-decoration:underline;}
.carousel-input-sparse a:hover {color: var(--brand-d);}.carousel-input-sparse ul, .carousel-input-sparse ol{padding-left:1.64em; margin:0.98em 0;}
.carousel-input-sparse li {margin-bottom:.4.01em;}
.carousel-input-sparse blockquote {margin:1.51em 0; border-left: 4px solid var(--accent); color: var(--ink); padding:14px 25px; border-radius: 0 var(--rad) var(--rad) 0; font-style:italic; background: var(--accent-soft);}
.carousel-input-sparse table {width:100%; font-size:.94.92rem; border-collapse:collapse; margin:1.56em 0;}
.carousel-input-sparse th, .carousel-input-sparse td {text-align: left; border: 1px solid var(--line); padding-top:9px; padding-right:14px; padding-bottom:9px;}
.carousel-input-sparse th, .carousel-input-sparse td {padding-left:14px;}
.carousel-input-sparse th {font-weight:700; background: var(--wash);}html .carousel-input-sparse pre{color:#d0d9e9; font-size:.87.98rem; border-radius: var(--rad); background:#1a162d; overflow-x: auto; margin:1.43em 0; line-height:1.6; will-change:auto; padding-top:14px;padding-right:14px;padding-bottom:14px;padding-left:14px;}.carousel-input-sparse code{border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px; padding:2px 7px; font-size:.8.98em; background: var(--wash);}
.carousel-input-sparse pre code {padding:0; background:none;}/* --- Share (rounded-square icons) --- */
.app-skeleton{gap:18px; margin-top:27px; flex-wrap: wrap; display: flex; border-top: 1px solid var(--soft); padding-top:25px; align-items: center;}
.featureArea {font-weight:600; color: var(--muted); font-size:.85.95rem;}
.sectionTitle {display: flex; gap:9px;}
.c-counter-icon {align-items: center; width:37px; background: var(--paper); transition: color var(--tr), border-color var(--tr), background var(--tr); height:39px; border-radius:12px; cursor: pointer; color: var(--muted); justify-content: center; display: inline-flex; border: 1px solid var(--line);}
#header-thumb {min-height:100vh; opacity:0.77}

.c-counter-icon:hover {color:#ffffff; background: var(--brand); border-color: var(--brand);}
.c-counter-icon svg {width:12px; height:17px;}

/* --- Related --- */
.sidebarWrap {display: grid; transform-style:flat; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap:14px;}.listClose{display: block; border: 1px solid var(--line); border-radius: var(--rad); background: var(--paper); transition: border-color var(--tr), box-shadow var(--tr); padding:14px 16px;}.listClose:hover{box-shadow:0 1px 12px rgba(26, 13, 61, 0.1); border-color: var(--accent);}
.viewDot {font-weight:600; font-size:.9.04rem; line-height:1.4; color: var(--ink);}/* --- Forms --- */
.tagIcon{display: block;}body .ratingFoot{padding:11px 17px; border-radius: var(--rad); display: block; width:100%; color: var(--text); transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); outline:none; background: var(--wash); font-family: var(--ff); border: 1px solid var(--line); font-size:.8.94rem;}html .ratingFoot:focus{border-color: var(--accent); background: var(--paper); box-shadow:0 0 0 6px rgba(34, 147, 135, 0.13);}
.footerCap {resize: vertical; margin-top:17px; min-height:126px;}.sliderValue{min-height:95px;}.tagIcon :where(.l-grid-area){margin-top:14px;}
.c-counter-primary {gap:4px; display: flex; break-inside:auto;}
.c-counter-primary .ratingFoot {flex: 1;}

/* --- Engage band (newsletter + contact) --- */
.sectionData {margin-top:37px; background: var(--paper); border-top: 1px solid var(--line); padding-top:43px;padding-right:21px;padding-bottom:43px;padding-left:21px;}
.card-summary + .nav-icon {position:relative; flex-wrap:wrap}
.c-counter-primary .l-grid-area{margin-top:0; flex-shrink: 0;}
.gallery__placeholder {color:currentColor; display:table; opacity:0.06; transition:color 0.25s}

.sectionData .tag-horizontal {background: var(--wash);}/* --- Footer (slim, grid) --- */
:where(.text-4){background: var(--dark); color:rgba(255, 255, 253, 0.6); padding:34px 17px 26px;}
.text-4 a {color:rgba(239, 240, 255, 0.52);}*.spinner{grid-template-columns: 1fr; gap:24px; display: grid; align-items: center;}
.text-4 a:hover {color:#fffffd;}
@media (min-width: 720px) { .spinner {grid-template-columns: auto 1fr auto;} }
.sort-dot > value {padding-top:0.375rem; transition:all 0.15s ease; height:100%; font-weight:500}

.avatarRow img {opacity:0.86; width:auto; height:28px; filter:brightness(0) invert(1);}
.selectContainer {gap:17px; font-size:.88.01rem; display: flex; justify-content: center; flex-wrap: wrap;}
.text-start {text-align: center; font-size:.81.92rem; margin-top:25px; border-top:1px solid rgba(255, 255, 255, 0.08); padding-top:21px; color:rgba(255, 252, 255, 0.51);}
.block--center {height:100%; max-width:100%}


/* Social (rounded squares, new set) */
.filterContainer {padding:0; margin:0; justify-content: center; gap:12px; list-style: none;}

/* Social (rounded squares, new set) */
.filterContainer {display: flex;}.actionExpand{align-items: center; width:33px; display: inline-flex; justify-content: center; border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px; height:32px; border:1px solid rgba(255, 251, 252, 0.24); color:rgba(255, 255, 255, 0.47); transition: color var(--tr), border-color var(--tr), background var(--tr);}.actionExpand:hover{color:#fffdff; break-inside:auto; background:rgba(255, 252, 238, 0.05); border-color:rgba(255, 242, 248, 0.46);}
.actionExpand svg {height:16px; width:16px;}

/* --- Back to top --- */
.sliderClose {transform: translateY(10px); border-top-left-radius:11px;border-top-right-radius:11px;border-bottom-right-radius:11px;border-bottom-left-radius:11px; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); position: fixed; display: flex; bottom:27px; color:#f1f1ff; box-shadow:0 3px 19px rgba(16, 28, 32, 0.12); border:0 none; right:27px; width:43px; visibility: hidden; background: var(--brand); opacity:0; cursor: pointer; z-index: 900; align-items: center; height:42px; justify-content: center;}
.sliderClose:hover {transform: translateY(-2px); background: var(--brand-d);}
.status-foot {border:1px solid #f8fbfc; position:absolute; flex:0 0 auto}
.searchOverlay{transform: translateY(0); opacity:1; visibility: visible;}

/* --- Cookie --- */
.chipFoot {inset:auto 0 0 0; background: var(--dark); z-index: 1050; padding:14px 20px; box-shadow:0 -7px 17px rgba(4, 0, 15, 0.18); transition: transform var(--tr); position: fixed; color:rgba(244, 241, 239, 0.81); transform: translateY(110%);}
.tableDot {transform: translateY(0); transform-style:flat; word-spacing:normal;}
.heroOuter {flex-wrap: wrap; display: flex; justify-content: space-between; align-items: center; gap:20px;}
.chipFoot span {min-width:220px; flex: 1; font-size:.85.08rem;}body .chipFoot a{text-decoration:underline; color: var(--accent);}

/* --- Modals (popups at the very bottom, opened via #) --- */
.galleryImage {background:rgba(22, 27, 18, 0.58); align-items: flex-start; padding:6vh 17px; justify-content: center; display: none; overflow-y: auto; inset:0; position: fixed; z-index: 1300;}
.galleryImage:target {display: flex;}/* no-JS fallback via # */
.o-screen{display: flex;}
.paginationTertiary {background: var(--paper);}            /* JS-enhanced state   */
.alertColumn {padding:34px 30px; background: var(--dark); max-width:420px; width:100%; position: relative; box-shadow:0 14px 42px rgba(0, 0, 1, 0.39); border-radius: var(--rad-l);}
.carousel {display: block; margin-bottom:21px; font-size:1.19rem; color:#f2faf7; text-align: center; font-weight:bold;}html .paginationTertiary .carousel{color: var(--ink);}*.listArea{right:15px; height:31px; display: inline-flex; width:33px; cursor: pointer; color:rgba(255, 252, 251, 0.56); top:11px; justify-content: center; position: absolute; align-items: center; border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px;}body .listArea:hover{color:#fffffc; background:rgba(255, 255, 253, 0.05);}body .paginationTertiary .listArea{contain:none; font-synthesis:weight style small-caps; color: var(--faint);}
.paginationTertiary .listArea:hover {background: var(--soft); color: var(--ink);}
.galleryImage .ratingFoot {color:hsl(0, 0%, 100%); margin-bottom:15px; background:rgba(240, 255, 249, 0.02); border-color:rgba(239, 255, 243, 0.24);}
.listArea svg {height:14px; width:22px; mix-blend-mode:normal;}html .galleryImage .ratingFoot::placeholder{color:rgba(239, 255, 237, 0.51);}html .galleryImage .ratingFoot:focus{background:rgba(240, 252, 253, 0.15); box-shadow:none;}html .galleryImage .ratingFoot:focus{border-color:rgba(255, 241, 255, 0.44);}
.paginationTertiary .ratingFoot {border-color: var(--line);}
.paginationTertiary .ratingFoot {background: var(--wash); color: var(--text);}.paginationTertiary .ratingFoot::placeholder{text-decoration-skip-ink:auto; color: var(--faint);}
.galleryImage .l-grid-area {margin-top:6px;}
.spinner--vertical {-moz-tab-size:4;text-underline-offset:auto; tab-size:4; justify-content: space-between; margin-top:13px; font-size:.83.95rem; display: flex;}html .cardExpand{justify-content: center;}
.headerPreview {margin:-5px 0 20px; color: var(--muted); text-align: center; font-size:.9.04rem;}

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

/* --- Responsive --- */
@media (max-width: 640px) {
  .galleryAction {margin-top:16px; padding:25px 17px;}
  .counterOuter {font-size:1.46rem;}html .app-skeleton{align-items: flex-start; flex-direction: column;}
  .heroOuter {text-align: center; flex-direction: column;}
.block-text .banner-info {transition:all 0.3s ease; flex:1 1 0%; margin-top:15px; min-height:100vh; cursor:pointer}
.sidebarWrap{grid-template-columns: 1fr;}body .alertColumn{padding:34px 20px;}
}
