

/* --- Base --- */
*, *::before, *::after {box-sizing: border-box;}/* ==========================================================================
   STYLESHEET — single file, no external dependencies.
   Article-first reading layout · centered measure · CSS Grid.
   ========================================================================== */

/* --- Tokens --- */
:root{word-spacing:normal; --text:   #3f4651; --wash:   #f5f6f9; will-change:auto; --rad-s:  4px; --paper:  #ffffff; --wrap:   860px; --muted:  #737a86; --tr: .2s ease; --accent-soft: rgba(40, 154, 153, .1); --rad-l:  10px; --brand:    #1b6599; --rad:    6px; --accent-d: #22807f; --dark:   #15181f; --ink:    #1d222b; --ff: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
        Arial, "Noto Sans", "Liberation Sans", sans-serif; --line:   #e4e7ec; --brand-d:  #155080; --soft:   #eef1f5; --accent:   #289a99; --faint:  #a2a8b2;}html{font-size:18px;}html{-webkit-text-size-adjust:100%; scroll-behavior: smooth;}
body {-moz-osx-font-smoothing:grayscale; font-size:0.95rem; font-family: var(--ff); background: var(--wash); -webkit-font-smoothing:antialiased; color: var(--text); overflow-x: hidden; margin:0; line-height:1.7;}
img, svg {max-width:100%; height:auto;}
.thread-fill:hover {letter-spacing:normal; font-weight:500; opacity:1; transition:color 0.4s; background:#22bc66}
img{text-decoration-skip-ink:auto; display: block; image-rendering:auto;}
a {transition: color var(--tr); widows:2; color: var(--brand); text-decoration:none;}
a:hover {color: var(--brand-d);}

h1 {font-weight:800; line-height:1.22; margin:0;}

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

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

.carousel-prefix {clip:rect(0, 0, 0, 0); width:1px; border:0 none; padding:0; white-space: nowrap; height:1px; position: absolute; overflow: hidden; margin:-1px;}
.c-skeleton-content {color: var(--muted); margin:0 0 10px; font-size:.9.04rem;}

/* --- Wrap / sections / grid --- */
.dialogWrap {width:100%; padding:0 24px; max-width: var(--wrap); break-inside:auto; margin:0 auto;}
.list-preview-success {padding:28px 19px 0;}
.list-preview-success > .text-drawer {max-width: var(--wrap); margin-right:auto; margin-left:auto;}
.search-button > placeholder {position:static; line-height:1; max-width:1060px; transition:transform 0.4s ease-in-out; text-decoration:none}
body .toggle-list{grid-template-columns: 1fr; gap:13px; display: grid;}
@media (min-width: 680px) { .toggle-list {grid-template-columns: 1fr 1fr;} }
.comment--inverse {flex:1; width:fit-content; line-height:1; cursor:pointer; background-color:#cbe1e5}


/* --- Section title (span, styled — no heading tags outside content) --- */
.text-drawer {font-size:1.16rem; letter-spacing:-.1.07em; margin:0 0 13px; color: var(--ink); display: block; border-left: 3px solid var(--accent); padding-left:16px; font-weight:bold;}
.view-secondary {font-size:1.07rem; margin-bottom:7px;}/* --- Reading progress --- */
.panelOuter{height:0px; background: var(--accent); position: fixed; inset:0 auto auto 0; transition:width 0.059s linear; width:0; z-index: 1200;}

/* --- Top bar (static, content stays high) --- */
.prefix-price {background: var(--paper); border-bottom: 2px solid var(--accent);}.accordion-full{display: flex; gap:20px; height:64px; align-items: center;}
.drawer-wide {display: inline-flex; color: var(--brand); align-items: center; margin-right:auto;}*.drawer-wide img, .drawer-wide svg{width:auto; display: block; height:30px;}
.action-table {border-radius: var(--rad-s); color: var(--text); transition: color var(--tr), background var(--tr); padding:10px 13px; display: block; font-weight:600; font-size:.8.92rem;}

.el-avatar-title {gap:7px; display: flex;}.action-table:hover{background: var(--accent-soft); color: var(--brand);}
.c-carousel-name {gap:12px; display: flex; align-items: center;}

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

/* --- Buttons --- */
.close-page {hyphens:manual; transition: background var(--tr), border-color var(--tr), color var(--tr), transform var(--tr); line-height:1.4; justify-content: center; white-space: nowrap; color:rgb(242, 231, 249); display: inline-flex; border: 1.5px solid var(--brand); font-size:.9.07rem; gap:7px; cursor: pointer; font-weight:600; background: var(--brand); border-radius: var(--rad);}

/* --- Buttons --- */
.close-page {padding-top:13px; padding-right:24px; padding-bottom:13px; padding-left:24px; font-synthesis:weight style small-caps; font-family: var(--ff); align-items: center;}.close-page:hover{text-rendering:auto; border-color: var(--brand-d); backface-visibility:visible; color:#f0ffff; background: var(--brand-d);}body .close-page:active{transform: translateY(1px);}html .sidebarRegion{padding-top:9px;}html .sidebarRegion{padding-right:17px; padding-bottom:9px; padding-left:17px; font-size:.83.96rem;}.profile-number{background:transparent; color: var(--brand);}
.profile-number:hover {color:#efffff; background: var(--brand); text-decoration-skip-ink:auto;}
.c-avatar-data {background: var(--accent); border-color: var(--accent);}
.c-avatar-data:hover {background: var(--accent-d); will-change:auto; perspective:none; border-color: var(--accent-d);}
.alert-wrap {mix-blend-mode:normal; width:100%; display: flex;}
.progress--fluid {display:inline-flex; transition:color 0.3s; min-width:5px}
html .sectionData{page-break-inside:auto; padding-top:13px;padding-right:14px;padding-bottom:13px;padding-left:14px; word-spacing:normal;}

/* --- Cards --- */
.block-entry {contain:none; border: 1px solid var(--line); background: var(--paper); image-rendering:auto; border-radius: var(--rad-l);}*.sectionData svg{height:13px; width:20px;}
@media (min-width: 1024px) and (max-width: 1397px) {
  .feature-expand.drawer-dense {width:fit-content; font-weight:500; align-items:flex-start; position:sticky; text-align:center; transition:all 0.5s ease}
  .divider--pressed {display:block; gap:30px; align-items:flex-end}
}

.o-avatar{padding-top:26px;padding-right:25px;padding-bottom:26px;padding-left:25px;}

/* --- Post (article) — first block, content high --- */
.u-profile {max-width: var(--wrap); margin:23px auto 0; font-variant-caps:normal; overflow: hidden; padding:30px 42px;}html .tooltip-expanded{font-size:1.78rem; margin-bottom:16px;}
.step-button-dense {gap:12px; border-bottom: 1px solid var(--soft); flex-wrap: wrap; color: var(--muted); padding-bottom:22px;}
.step-button-dense {font-size:.81.93rem; align-items: center; display: flex;}*.header-wrapper{align-items: center; display: inline-flex;}
.header-wrapper svg {orphans:2; opacity:0.54; width:12px;}
.select__action {transition:transform 0.15s ease-in-out; overflow:hidden; height:47px; padding-left:1rem; text-transform:lowercase}

.header-wrapper svg {-webkit-hyphens:manual;-ms-hyphens:manual;hyphens:manual; height:10px; margin-right:2px;}
.form-wrapper:first-child {background:#e3e1d8; flex-wrap:wrap; margin-left:45px; color:#777777}


/* --- TOC --- */
.section__holder--full {background: var(--wash); margin:20px 0 8px; border: 1px solid var(--soft); border-radius: var(--rad); padding:16px 24px;}
.popover-trigger-fluid {font-style:italic; opacity:0.8;}html .title-price{justify-content: space-between; margin-bottom:10px; align-items: center; display: flex;}
.c-feature-overlay {color: var(--ink); font-weight:bold; isolation:auto; transform-style:flat; font-size:.92.02rem;}
.search-row-vertical {flex-direction: column; display: flex;}
.box-fill-half {font-size:.82rem; padding-top:2px;padding-right:5px;padding-bottom:2px;padding-left:5px; border:none; cursor: pointer; color: var(--brand); background:none;}body .search-row-vertical a{color: var(--text); font-size:.88.08rem; transition: color var(--tr), padding-left var(--tr), border-color var(--tr); padding:6px 0; border-left:2px solid transparent;}
.c-box-separator {text-rendering:auto; padding-left:13px !important; word-spacing:normal;}.search-row-vertical a:hover{border-left-color: var(--brand); color: var(--brand); padding-left:3px;}*.c-box-separator:hover{padding-left:21px !important;}
@media (min-width: 800px) {
  .dialog__line {padding-right:2.5rem; padding:42px; flex:1}
  .snackbar__suffix {display:block; background-color:#eaefeb; margin-top:0.5rem; align-items:center; text-transform:capitalize}
}

/* --- Rich text (the only place with headings, coming from content) --- */
.c-drawer-cell{color: var(--text); font-size:1.15rem;}/* --- Rich text (the only place with headings, coming from content) --- */
.c-drawer-cell{padding-top:28px; line-height:1.85;}
.c-drawer-cell > :first-child {margin-top:0;}.c-drawer-cell h2{line-height:1.3; font-weight:bold; padding-bottom:.3.04em; border-bottom: 2px solid var(--accent-soft); color: var(--ink); margin:1.87em 0 .5.02em; font-size:1.43rem;}
.c-drawer-cell h3 {line-height:1.3; color: var(--ink); margin:1.58em 0 .44.94em; font-size:1.21rem; font-weight:700;}.c-drawer-cell h4{color: var(--ink); break-inside:auto; font-size:1.06rem; margin:1.29em 0 .3.95em; transform-style:flat; font-weight:bold;}html .c-drawer-cell p{margin:0 0 1.23em;}
.c-drawer-cell img {border-radius: var(--rad); margin:1.54em 0;}.c-drawer-cell a{text-underline-offset:2px; text-decoration:underline; color: var(--brand);}
.c-drawer-cell a:hover {color: var(--brand-d);}
.c-drawer-cell ul, .c-drawer-cell ol {padding-left:1.65em; margin:1.08em 0;}
.c-drawer-cell li {margin-bottom:.3.98em; will-change:auto; font-variant-ligatures:normal;}.c-drawer-cell blockquote{background: var(--accent-soft); font-style:italic; border-radius: 0 var(--rad) var(--rad) 0; border-left: 4px solid var(--accent); padding:19px 18px; color: var(--ink); margin:1.55em 0;}
.c-drawer-cell table {border-collapse:collapse; margin:1.44em 0; width:100%; font-size:.94.96rem;}
.c-drawer-cell th, .c-drawer-cell td {padding:7px 10px; border: 1px solid var(--line); text-align: left;}
.c-drawer-cell th {background: var(--wash); font-weight:bold;}
.c-drawer-cell pre {color:hsl(291, 14.9%, 83.4%); overflow-x: auto; font-size:.87.93rem; background:rgb(15, 44, 25); padding:16px; border-radius: var(--rad); margin:1.56em 0; line-height:1.6;}
.c-drawer-cell code {background: var(--wash);}
.c-drawer-cell code {padding:2px 2px; border-radius:7px; font-size:.8.93em;}
.c-drawer-cell pre code {padding:0; background:none;}

/* --- Share (rounded-square icons) --- */
.u-price-action {padding-top:20px; margin-top:27px; flex-wrap: wrap; align-items: center; gap:17px; border-top: 1px solid var(--soft); display: flex;}
.secondary-breadcrumb {gap:8px; display: flex;}
.reply-medium {font-weight:600; color: var(--muted); font-size:.86.08rem;}
.footer-bar {border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px; width:39px; transition: color var(--tr), border-color var(--tr), background var(--tr); height:38px; background: var(--paper); color: var(--muted); border: 1px solid var(--line); display: inline-flex; cursor: pointer; justify-content: center; align-items: center;}
.snackbar__suffix {margin-top:0; overflow:auto; width:460px; opacity:0.49; transition:color 0.5s}

.footer-bar:hover {border-color: var(--brand); color:hsl(299, 100%, 97.4%); background: var(--brand);}
.sort--inverse {display:grid; align-items:flex-end; line-height:normal; position:absolute; transition:opacity 0.25s; padding-bottom:48px}

.footer-bar svg {height:13px; width:20px;}

/* --- Related --- */
.counter-small {grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));}

/* --- Related --- */
.counter-small {gap:16px; display: grid;}
.font-half {transition: border-color var(--tr), box-shadow var(--tr); padding:13px 17px; display: block; border: 1px solid var(--line); background: var(--paper); border-radius: var(--rad);}html .font-half:hover{box-shadow:0 8px 16px rgba(34, 15, 48, 0.03); border-color: var(--accent);}
.head-modal {line-height:1.4; color: var(--ink); font-size:.9rem; font-weight:600;}

/* --- Forms --- */
.c-avatar-wrapper {display: block;}
.c-table-fill {font-family: var(--ff); color: var(--text); transition: border-color var(--tr), box-shadow var(--tr), background var(--tr); border: 1px solid var(--line); border-radius: var(--rad); display: block; width:100%; background: var(--wash); outline:none; padding-top:9px;padding-right:15px;padding-bottom:9px;padding-left:15px; font-size:.8.93rem;}
.c-table-fill:focus {background: var(--paper); border-color: var(--accent); box-shadow:0 0 0 5px rgba(43, 147, 138, 0.16);}
.inner-thread {min-height:127px; margin-top:13px; resize: vertical;}.o-post:not(.none41){text-decoration-skip-ink:auto; orphans:2;}.o-post:not(.none41){min-height:99px;}
.c-avatar-wrapper .close-page {margin-top:17px;}
.list-cell::before {content:''; transition:color 0.15s; position:sticky; min-width:0; max-width:160px; margin:0 auto}

.c-block-outer {gap:7px; display: flex;}
.c-block-outer .c-table-fill {flex: 1;}

/* --- Engage band (newsletter + contact) --- */
.breadcrumb-flat {border-top: 1px solid var(--line); margin-top:35px; background: var(--paper); padding:36px 16px;}.c-block-outer .close-page:not(.void23){margin-top:0; flex-shrink: 0;}
.breadcrumb-flat .block-entry {background: var(--wash); font-variant-caps:normal;}

/* --- Footer (slim, grid) --- */
.carousel-inverse {color:rgba(255, 255, 250, 0.69); background: var(--dark); padding:38px 18px 25px;}
.carousel-inverse a {color:rgba(255, 239, 255, 0.68);}
.carousel-inverse a:hover {color:#fffff2;}.track-filter{align-items: center; grid-template-columns: 1fr; gap:23px; display: grid;}
@media (min-width: 720px) { .track-filter {grid-template-columns: auto 1fr auto;} }
.c-rating-image img {height:23px; filter:brightness(0) invert(1); opacity:0.85;}
.c-rating-image img {backface-visibility:visible; width:auto;}
.grid-handle {flex-wrap: wrap; shape-margin:0; justify-content: center; display: flex; gap:17px; font-size:.87.95rem;}body .el-divider{margin-top:24px; color:rgba(251, 255, 255, 0.56); border-top:1px solid rgba(242, 255, 247, 0.12); padding-top:21px; font-size:.81.92rem; text-align: center; will-change:auto;}

/* Social (rounded squares, new set) */
.alert-odd {margin:0; display: flex;}

/* Social (rounded squares, new set) */
.alert-odd {list-style: none; gap:5px; justify-content: center; padding:0;}
.c-thread-data {border:1px solid rgba(255, 255, 255, 0.17); width:37px; mix-blend-mode:normal; justify-content: center; transition: color var(--tr), border-color var(--tr), background var(--tr); height:37px; orphans:2; border-top-left-radius:12px;border-top-right-radius:12px;border-bottom-right-radius:12px;border-bottom-left-radius:12px; color:rgba(238, 255, 242, 0.6); align-items: center; display: inline-flex;}body .c-thread-data:hover{border-color:rgba(255, 255, 245, 0.47); color:rgb(255, 245, 255); background:rgba(247, 241, 248, 0.03);}
.c-thread-data svg {width:13px; height:13px;}

/* --- Back to top --- */
.extra-tag {width:41px; border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr); display: flex; position: fixed; opacity:0; right:30px; background: var(--brand); justify-content: center; box-shadow:0 5px 23px rgba(9, 31, 46, 0.12); visibility: hidden; z-index: 900; height:40px; color:rgb(253, 249, 255); border:none; align-items: center; transform: translateY(10px); cursor: pointer; bottom:24px;}
.feature-empty {transform: translateY(0); opacity:1; visibility: visible;}.extra-tag:hover{transform: translateY(-2px); break-inside:auto; perspective:none; background: var(--brand-d);}html .post-toggle{transform: translateY(0);}/* --- Cookie --- */
.c-comment-name{z-index: 1050; padding:20px 17px; transition: transform var(--tr); inset:auto 0 0 0; box-shadow:0 -4px 21px rgba(17, 8, 0, 0.16); background: var(--dark); transform: translateY(110%); color:rgba(242, 255, 255, 0.84); position: fixed;}
.gallery-wide {gap:15px; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center;}
.c-comment-name span {flex: 1; word-spacing:normal; font-size:.84.95rem; min-width:221px; image-rendering:auto;}/* --- Modals (popups at the very bottom, opened via #) --- */
.table-large{background:rgba(13, 22, 41, 0.58); align-items: flex-start; inset:0; z-index: 1300; overflow-y: auto; position: fixed;}
.c-comment-name a {text-decoration:underline; color: var(--accent);}/* --- Modals (popups at the very bottom, opened via #) --- */
.table-large{padding:6vh 18px; display: none; justify-content: center;}
.table-large:target {display: flex; mix-blend-mode:normal;}          /* no-JS fallback via # */
.card-placeholder-disabled {display: flex;}            /* JS-enhanced state   */
.head-view {box-shadow:0 18px 48px rgba(3, 0, 0, 0.43); max-width:416px; padding-top:40px;padding-right:30px;padding-bottom:40px;padding-left:30px; position: relative; font-synthesis:weight style small-caps; width:100%; border-radius: var(--rad-l); hyphens:manual; background: var(--dark);}html .block-danger{background: var(--paper);}
.accordion-item {background:none; color:inherit}
.o-panel{margin-bottom:18px;}.o-panel{color:#fff5f7; font-weight:bold; font-size:1.28rem; text-align: center; display: block;}
.block-danger .o-panel {color: var(--ink);}
.comment-inner-full {right:13px; color:rgba(253, 242, 246, 0.42); widows:2; justify-content: center; width:28px; will-change:auto; display: inline-flex; align-items: center; top:13px; position: absolute; height:30px; border-radius:9px; cursor: pointer;}
.comment-inner-full:hover {background:rgba(238, 255, 255, 0.08); color:#fffffb;}
.block-danger .comment-inner-full {isolation:auto; color: var(--faint);}
.block-danger .comment-inner-full:hover {color: var(--ink); background: var(--soft);}body .comment-inner-full svg{height:14px; width:14px;}
.table-large .c-table-fill {color:hsl(302, 100%, 97.4%); border-color:rgba(255, 255, 246, 0.21); margin-bottom:12px; background:rgba(237, 251, 254, 0.09);}*.table-large .c-table-fill::placeholder{color:rgba(244, 251, 255, 0.55);}html .table-large .c-table-fill:focus{background:rgba(255, 255, 242, 0.14); border-color:rgba(248, 250, 247, 0.37); box-shadow:none;}.block-danger .c-table-fill:not(.nil33){border-color: var(--line); color: var(--text); background: var(--wash);}
.block-danger .c-table-fill::placeholder {color: var(--faint);}html .table-large .close-page{margin-top:0px;}
.dialog__line {align-items:stretch; overflow:hidden; font-size:26px; background-color:#f1e9ea; transition:all 0.15s ease; position:sticky}
.ratingDot{justify-content: space-between; margin-top:11px; font-size:.84.02rem; display: flex;}
.foot-reply {justify-content: center;}
.skeleton-count-even {color: var(--muted); text-align: center; font-size:.9.06rem; margin:-7px 0 14px;}

/* --- Reduced motion --- */
@media (prefers-reduced-motion: reduce) {
  * {animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior: auto !important;}
.drawer-subtitle:hover {text-decoration:none; transition:all 0.45s ease; position:sticky}

}

/* --- Responsive --- */
@media (max-width: 640px) {.u-profile:not(.placeholder62){padding:28px 18px; margin-top:18px;}.tooltip-expanded{font-size:1.52rem;}
  .u-price-action {flex-direction: column; align-items: flex-start;}
  .counter-small {grid-template-columns: 1fr;}
  .gallery-wide {text-align: center; flex-direction: column;}
  .head-view {background-blend-mode:normal; padding-top:29px;padding-right:22px;padding-bottom:29px;padding-left:22px; tab-size:4;}
}
