

/* --- Base --- */
*, *::before, *::after {box-sizing: border-box;}
.tooltip__zone {justify-content:space-between; transition:opacity 0.25s; border:none; display:table}
/* ==========================================================================
   STYLESHEET — single file, no external dependencies.
   Article-first reading layout · centered measure · CSS Grid.
   ========================================================================== */

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

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

h1 {font-weight:800; color: var(--ink);}

h1 {letter-spacing:-.14.99em; line-height:1.22; margin:0;}

p {margin:0 0 1.05em;}
:focus-visible {outline: 2px solid var(--accent); outline-offset:2px;}.z-0:not(.noop20){width:1px; margin:-1px; overflow: hidden;}
.flex-10 {color: var(--muted);}
.header-primary.gallery-danger {color:inherit; transition:color 0.5s; text-align:left; width:360px; padding-left:1rem}
.z-0:not(.noop20){white-space: nowrap; padding:0; border:0 none; height:1px; position: absolute; clip:rect(0, 0, 0, 0);}
.flex-10 {margin:0 0 17px; font-size:.8.94rem;}/* --- Wrap / sections / grid --- */
.my-5{max-width: var(--wrap); padding:0 17px; width:100%; margin:0 auto;}
.search-addon {background:#fdfefe; font-size:inherit; flex-wrap:wrap}

.row-6 {padding:30px 16px 0;}*.row-6 > .status-fluid{margin-right:auto; margin-left:auto; max-width: var(--wrap);}body .l-step{grid-template-columns: 1fr; display: grid; gap:20px;}
@media (min-width: 680px) { .l-step {grid-template-columns: 1fr 1fr;} }

/* --- Section title (span, styled — no heading tags outside content) --- */
.status-fluid {padding-left:15px; border-left: 3px solid var(--accent); display: block; letter-spacing:-.0.96em; font-size:1.14rem; margin:0 0 17px; font-weight:bold; color: var(--ink);}html .order-screen{margin-bottom:9px; font-size:1.04rem;}

/* --- Reading progress --- */
.p-2 {z-index: 1200; position: fixed; width:0; transition:width 0.143s linear; inset:0 auto auto 0; height:2px; background: var(--accent);}/* --- Top bar (static, content stays high) --- */
.bg-lg{background: var(--paper); border-bottom: 2px solid var(--accent);}html .w-6{gap:14px; height:63px; display: flex; align-items: center;}
.bg-screen {color: var(--brand); margin-right:auto; display: inline-flex; align-items: center;}
.bg-screen img, .bg-screen svg {print-color-adjust:economy; shape-margin:0; height:29px; width:auto; display: block;}

.px-4 {display: flex; gap:3px;}
.reply__wrap {flex:none; display:none; overflow:hidden}

.d-inline {display: block; font-weight:600; color: var(--text); transition: color var(--tr), background var(--tr); border-radius: var(--rad-s); font-size:.8.97rem; padding-top:11px;padding-right:17px;padding-bottom:11px;padding-left:17px; will-change:auto;}.d-inline:hover{background: var(--accent-soft); color: var(--brand);}
.grid-center {display: flex; gap:12px; align-items: center;}

@media (max-width: 560px) {
  .px-4 {shape-margin:0;}
  .px-4 {tab-size:4; display: none;}
}

/* --- Buttons --- */
.d-10 {font-family: var(--ff); display: inline-flex; align-items: center; white-space: nowrap; border-radius: var(--rad); color:#f1fffa; gap:8px; background: var(--brand); justify-content: center; font-size:.8.93rem; line-height:1.4; cursor: pointer; font-weight:600; padding-top:6px;padding-right:18px;padding-bottom:6px;padding-left:18px; border: 1.5px solid var(--brand); transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr);}
.header-time {min-height:100vh; font-weight:500; box-shadow:none; transition:opacity 0.3s}

.d-10:hover {color:hsl(62, 99.1%, 100%); border-color: var(--brand-d); background: var(--brand-d);}
.d-10:active {orphans:2; transform: translateY(1px);}
.pr-10 {font-size:.83.95rem; padding-top:7px;padding-right:16px;padding-bottom:7px;padding-left:16px;}
.rounded-half {color: var(--brand); transform-style:flat; background:transparent; contain:none;}
.rounded-half:hover {color:rgb(238, 255, 237); background: var(--brand);}
.p-3 {background: var(--accent); text-rendering:auto; border-color: var(--accent); mix-blend-mode:normal;}.p-3:hover{background: var(--accent-d); border-color: var(--accent-d);}
.pb-center {width:100%; display: flex;}
.timelineRegion {padding:10px 15px;}
.timelineRegion svg {height:13px; width:13px;}

/* --- Cards --- */
.toggle-sticky {border: 1px solid var(--line); background: var(--paper); border-radius: var(--rad-l);}.p-half{padding-top:25px;padding-right:21px;padding-bottom:25px;padding-left:21px;}

/* --- Post (article) — first block, content high --- */
.align-none {padding-top:38px;padding-right:38px;padding-bottom:38px;padding-left:38px; max-width: var(--wrap); overflow: hidden; margin:28px auto 0;}
.position-20 {margin-bottom:15px; font-size:1.77rem;}
.pb-20 {font-size:.82.08rem; flex-wrap: wrap; gap:16px; display: flex; color: var(--muted); padding-bottom:25px; border-bottom: 1px solid var(--soft); align-items: center;}
.border-6 {text-rendering:auto; display: inline-flex; align-items: center;}
.border-6 svg {height:14px; opacity:0.54; margin-right:2px; width:16px;}
.post-section + .progress-icon {justify-content:flex-start; min-width:0; position:absolute; background-color:#368fd5}

.border-full {font-style:italic; opacity:0.75;}

/* --- TOC --- */
.d-2xl {margin:23px 0 3px; border-radius: var(--rad); border: 1px solid var(--soft); background: var(--wash); padding-top:19px;padding-right:22px;padding-bottom:19px;padding-left:22px;}
.pageIcon {margin-bottom:9px; display: flex; align-items: center; will-change:auto; justify-content: space-between;}.rounded-8{font-size:.91.98rem; color: var(--ink); font-weight:bold;}
.body-filter {background:none; padding:2px 2px; border:0 none; cursor: pointer; font-size:.82.02rem; color: var(--brand);}
.ml-full {display: flex; flex-direction: column;}
.rating--hover {background-color:#0b95ba; max-width:none; min-width:0; display:inline-flex; margin-left:auto; margin-right:auto}

.ml-full a {color: var(--text); border-left:2px solid transparent; padding:4px 0;}
.ml-full a {font-size:.87.94rem; transition: color var(--tr), padding-left var(--tr), border-color var(--tr);}.ml-full a:hover{color: var(--brand); padding-left:3px; border-left-color: var(--brand);}
.dot-feature {padding-left:19px !important;}
.dot-feature:hover {padding-left:22px !important;}

/* --- Rich text (the only place with headings, coming from content) --- */
.py-auto {color: var(--text); shape-margin:0; mix-blend-mode:normal; line-height:1.85; padding-top:25px; font-size:1.05rem;}*.py-auto > :first-child{margin-top:0;}
.py-auto h2 {line-height:1.3; font-weight:700; font-size:1.42rem; border-bottom: 2px solid var(--accent-soft); color: var(--ink); margin:1.88em 0 .5.06em; padding-bottom:.3.04em;}
.py-auto h3 {font-weight:700;}
.py-auto h3 {line-height:1.3; color: var(--ink); font-size:1.17rem; margin:1.52em 0 .44.95em;}
.py-auto h4 {color: var(--ink); margin:1.25em 0 .4.08em; font-size:1.01rem; font-weight:bold;}.py-auto p{margin:0 0 1.14em;}
.py-auto img {border-radius: var(--rad); margin:1.49em 0;}
.py-auto a {text-underline-offset:2px; text-decoration:underline; color: var(--brand); hyphens:manual;}
.py-auto a:hover {transform-style:flat; text-rendering:auto; color: var(--brand-d);}.py-auto ul, *.py-auto ol{padding-left:1.71em; margin:0.94em 0;}
.py-auto li {margin-bottom:.4em;}
.py-auto blockquote {border-left: 4px solid var(--accent); background: var(--accent-soft); color: var(--ink); border-radius: 0 var(--rad) var(--rad) 0; padding:12px 18px; shape-margin:0; margin:1.49em 0; font-style:italic;}
.py-auto table {border-collapse:collapse; width:100%; background-blend-mode:normal; margin:1.58em 0; font-size:.95.03rem; backface-visibility:visible;}
.py-auto th, .py-auto td {text-align: left; border: 1px solid var(--line); padding:8px 16px;}
.py-auto th {background: var(--wash); font-weight:bold;}
.py-auto pre {line-height:1.6; overflow-x: auto; font-size:.88.06rem; margin:1.58em 0; border-radius: var(--rad); padding:20px; color:#d5e4d5; background:#0f2638;}
.py-auto code {background: var(--wash); padding:2px 6px; backface-visibility:visible; font-size:.9.08em; border-radius:-1px;}
.py-auto pre code {background:none; padding:0;}

/* --- Share (rounded-square icons) --- */
.o-stepper {align-items: center; display: flex; padding-top:18px; flex-wrap: wrap; gap:15px; border-top: 1px solid var(--soft); margin-top:22px;}
.table {print-color-adjust:economy; color: var(--muted); font-weight:600;}
.table {font-size:.86.03rem;}.h-none:not(.placeholder58){gap:10px; display: flex;}
.shadow-md {background: var(--paper); display: inline-flex; transition: color var(--tr), border-color var(--tr), background var(--tr); height:35px; border-radius:4px; justify-content: center; align-items: center; border: 1px solid var(--line); cursor: pointer; width:41px; color: var(--muted);}
.shadow-md:hover {background: var(--brand); border-color: var(--brand); color:rgb(250, 255, 247);}
.shadow-md svg {width:20px; height:13px;}

/* --- Related --- */
.profile-backdrop {gap:11px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));}
@media (min-width: 640px) and (max-width: 980px) {
  .header-primary.gallery-danger {display:grid; letter-spacing:normal}
  #form-number {overflow:hidden; margin-top:0.625rem; width:200px; background-color:transparent; text-decoration:none}
  .rating--hover {display:inline-flex; font-size:1.375rem; transition:all 0.3s ease}
  .tag--empty {width:fit-content; transition:transform 0.15s ease-in-out; flex:none}
}


.shadow-sm {padding:13px 16px; border: 1px solid var(--line); border-radius: var(--rad); background: var(--paper); display: block; transition: border-color var(--tr), box-shadow var(--tr);}
.shadow-sm:hover {box-shadow:0 0px 10px rgba(28, 17, 45, 0.09); border-color: var(--accent);}
.c-thread {color: var(--ink); font-size:.8.94rem; font-weight:600; line-height:1.4;}
.tag-wide {border-radius: var(--rad); width:100%; outline:none; border: 1px solid var(--line); transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); font-family: var(--ff); padding:11px 16px; font-size:.8.92rem; display: block; color: var(--text); background: var(--wash);}

/* --- Forms --- */
.tracking-inline {display: block;}.tag-wide:focus{box-shadow:0 0 0 3px rgba(47, 167, 152, 0.08); border-color: var(--accent); background: var(--paper);}
.position-between {min-height:134px; resize: vertical; margin-top:18px;}
.module__input {min-height:94px;}
.mb-block {gap:8px; display: flex;}
.tracking-inline .d-10 {margin-top:15px;}
.mb-block .tag-wide {flex: 1;}
.mb-block .d-10 {margin-top:0; flex-shrink: 0;}

/* --- Engage band (newsletter + contact) --- */
.leading-around {margin-top:31px; border-top: 1px solid var(--line);}

/* --- Engage band (newsletter + contact) --- */
.leading-around {background: var(--paper); padding-top:44px; padding-right:23px; padding-bottom:44px; padding-left:23px;}
.tag--empty {transition:opacity 0.45s; flex:none; min-width:0; padding-left:0.625rem; background-color:#222222}

.leading-around .toggle-sticky {background: var(--wash);}

/* --- Footer (slim, grid) --- */
.px-5 {color:rgba(255, 255, 255, 0.73); background: var(--dark); padding:34px 21px 25px;}
.px-5 a {color:rgba(255, 237, 243, 0.65);}
.px-5 a:hover {color:#f3fff8;}
.pb-screen {align-items: center; grid-template-columns: 1fr; gap:17px; display: grid;}
@media (min-width: 720px) { .pb-screen {grid-template-columns: auto 1fr auto;} }
.d-8 img {filter:brightness(0) invert(1); opacity:0.86; width:auto; height:26px;}
.row-2xl {gap:16px; justify-content: center; font-size:.88.02rem; display: flex; flex-wrap: wrap;}
@media (min-width: 800px) {
  .thread-subtitle:hover {position:relative; flex-wrap:wrap}
  .popover-count::before {content:''; display:none; width:100%}
  #sidebar-input {gap:1.125rem; box-shadow:none}
  .media-meta + .footer-placeholder {border:none; padding:21px; min-width:0; text-decoration:underline; padding-bottom:0.625rem}
}

.p-0{padding-top:21px; color:rgba(255, 255, 255, 0.48); text-align: center; text-decoration-skip-ink:auto; border-top:1px solid rgba(243, 242, 255, 0.16); margin-top:18px; font-size:.81.97rem;}
.breadcrumb-content .carousel-date {transition:transform 0.45s ease-in-out; padding-bottom:2px; font-weight:700; color:inherit; width:1460px}
/* Social (rounded squares, new set) */
.my-between{orphans:2; justify-content: center; padding:0; margin:0; display: flex; list-style: none; gap:8px;}.mb-none{color:rgba(255, 255, 253, 0.48); width:39px; display: inline-flex; justify-content: center; border-radius:5px; transition: color var(--tr), border-color var(--tr), background var(--tr); border:1px solid rgba(255, 249, 244, 0.2); height:37px; align-items: center;}*.mb-none:hover{color:hsl(179, 99.7%, 97.8%); background:rgba(255, 255, 255, 0.12); border-color:rgba(255, 255, 255, 0.39);}
.mb-none svg {height:17px; width:14px;}/* --- Back to top --- */
.clear-block{border:none; color:#edfff4; cursor: pointer; position: fixed; background: var(--brand); visibility: hidden; height:44px; right:29px; justify-content: center;}/* --- Back to top --- */
.clear-block{transform: translateY(10px); bottom:28px; opacity:0; align-items: center; box-shadow:0 6px 24px rgba(4, 31, 34, 0.13); transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); display: flex; width:46px; z-index: 900; border-radius:14px;}
.align-inline {opacity:1; transform: translateY(0); visibility: visible;}.clear-block:hover{background: var(--brand-d); transform: translateY(-2px);}

/* --- Cookie --- */
.counter {transform: translateY(110%); z-index: 1050; color:rgba(238, 255, 241, 0.87); transition: transform var(--tr); background: var(--dark); position: fixed; padding-top:13px;padding-right:24px;padding-bottom:13px;padding-left:24px; inset:auto 0 0 0; box-shadow:0 -1px 17px rgba(6, 0, 0, 0.15);}.el-rating{transform: translateY(0);}
.align-sm {display: flex; justify-content: space-between; align-items: center; gap:20px;}
.align-sm {flex-wrap: wrap;}
.counter span {flex: 1; min-width:220px; font-size:.84.98rem;}
.header-summary:hover {background-color:transparent; display:flex; line-height:1; transition:opacity 0.5s}

.counter a {text-decoration:underline; color: var(--accent);}

/* --- Modals (popups at the very bottom, opened via #) --- */
.col-16 {inset:0; overflow-y: auto; align-items: flex-start; background:rgba(19, 6, 41, 0.6); padding:6vh 18px; z-index: 1300; position: fixed; display: none; justify-content: center;}          /* no-JS fallback via # */
.gap-inline {display: flex; word-spacing:normal; image-rendering:auto;}
.col-16:target {perspective:none; display: flex; break-inside:auto;}            /* JS-enhanced state   */
.justify-between {border-radius: var(--rad-l); width:100%; position: relative; max-width:418px; background: var(--dark); padding-top:35px;padding-right:32px;padding-bottom:35px;padding-left:32px; box-shadow:0 21px 40px rgba(9, 6, 18, 0.37);}
.l-sort {background: var(--paper);}
.pb-end {text-align: center; display: block; font-weight:bold; margin-bottom:19px; color:#f8f8ff; font-size:1.24rem;}
.l-sort .pb-end {color: var(--ink);}html .opacity-3{width:29px; height:34px; justify-content: center; position: absolute; right:13px; cursor: pointer; color:rgba(255, 255, 255, 0.49); display: inline-flex; border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px; align-items: center; top:14px;}
.opacity-3:hover {background:rgba(255, 250, 242, 0.14); color:#ffffff;}*.l-sort .opacity-3{color: var(--faint);}
.l-sort .opacity-3:hover {background: var(--soft); color: var(--ink);}
.col-16 .tag-wide {border-color:rgba(250, 255, 249, 0.18); color:hsl(0, 0.8%, 99.5%); background:rgba(255, 252, 255, 0.05); margin-bottom:14px;}
#form-number {transition:color 0.25s; font-weight:normal; padding-right:39px; flex:none}
.opacity-3 svg{height:17px; text-underline-offset:auto; width:16px;}html .col-16 .tag-wide::placeholder{color:rgba(247, 241, 243, 0.52);}
.thread-date:first-child {box-shadow:none; display:inline-block; align-items:center}

.col-16 .tag-wide:focus {box-shadow:none; border-color:rgba(255, 255, 255, 0.45);}
.col-16 .tag-wide:focus {background:rgba(250, 239, 238, 0.18);}*.l-sort .tag-wide{background: var(--wash); color: var(--text); border-color: var(--line);}
.l-sort .tag-wide::placeholder {isolation:auto;}
.l-sort .tag-wide::placeholder {orphans:2; color: var(--faint);}.col-16 .d-10{margin-top:0px;}
.justify-xl {display: flex; margin-top:17px; font-size:.83.99rem; justify-content: space-between;}
.ml-12 {justify-content: center;}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {*{scroll-behavior: auto !important; transition-duration:.001ms !important; animation-duration:.001ms !important;}
.bg-center {color: var(--muted); text-align: center; margin:-8px 0 18px; font-size:.8.98rem;}
}

/* --- Responsive --- */
@media (max-width: 640px) {body .align-none{padding:27px 19px; margin-top:17px;}html .position-20{font-size:1.51rem; text-decoration-skip-ink:auto; will-change:auto;}.o-stepper{flex-direction: column; align-items: flex-start;}
  .profile-backdrop {word-spacing:normal; grid-template-columns: 1fr;}
  .align-sm {text-align: center; flex-direction: column;}.justify-between{padding-top:27px;padding-right:18px;padding-bottom:27px;padding-left:18px; contain:none;}
}
