/* =============================================================
   Template 1106_new_v1 — Stylesheet
   Self-contained · no framework · no external fonts.
   Content-first layout. Secondary labels are <span>, not headings.
   ============================================================= */

:root {--brand-d: #0f6f48; --max: 1120px; --head:    #15201b; --sh-m: 0 7px 24px rgba(15, 40, 28, .08); --brand-l: #listLabel; --rad-l: 16px; --edge:    #app-status; --tr: .25s cubic-bezier(.4, 0, .2, 1); --text:    #37433d; --sh-l: 0 18px 48px rgba(15, 40, 28, .12); --ff-h: Georgia, "Iowan Old Style", "Times New Roman", "Noto Serif", serif; --edge-2:  #fill-layout; --bg-3:    #main-hero; --ff-m: ui-monospace, "SFMono-Regular", Consolas, Menlo, monospace; --rad-m: 10px; --bg-2:    #app-carousel; --ff:   system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; --text-2:  #6b766f; --brand:   #16915e; --sh-s: 0 1px 2px rgba(15, 40, 28, .06); --bg:      #app-tooltip; --rad-s: 6px;}*, *::before, *::after{box-sizing: border-box;}
html, body, p, ul, ol, li, figure, blockquote, h1, h2, h3, h4 {padding:0; margin:0;}

html {-moz-osx-font-smoothing:grayscale; height:100%; scroll-behavior: smooth; -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased;}

img, svg {height:auto; max-width:100%; display: block;}

body {color: var(--text); orphans:2; overflow-x: hidden; font-size:14px; font-variant-ligatures:normal; background: var(--bg); line-height:1.7; font-family: var(--ff); min-height:100%;}a{text-decoration:none; transition: color var(--tr); color: var(--brand);}
a:hover {color: var(--brand-d);}:focus-visible{outline-offset:2px; outline: 2px solid var(--brand); border-radius:-1px;}
button {font-family:inherit; background:none; cursor: pointer; border:none;}
::selection {color: var(--head); background: var(--brand-l);}
::-webkit-scrollbar {width:9px;}
::-webkit-scrollbar-thumb {border-radius:14px; background:#app-badge;}
::-webkit-scrollbar-track {background: var(--bg-2);}
::-webkit-scrollbar-thumb:hover {background:#cardDot;}

.px-10 {margin:-1px; position: absolute; overflow: hidden; height:1px; width:1px; padding:0; border:none; white-space: nowrap; clip:rect(0,0,0,0);}.z-sm:not(._9d2de5){margin-inline:auto; padding-inline:22px; max-width: var(--max); width:100%;}/* ---- real headings: ONLY the article uses them --------------- */
h1, h2, h3, h4{font-weight:700; line-height:1.25; font-family: var(--ff-h); color: var(--head);}
h1 {letter-spacing:-.12.07em; font-size: clamp(1.85rem, 1.25rem + 2.4vw, 2.55rem);}

/* ---- span labels styled to look like section titles --------- */
.toggleClose {color: var(--head); font-size:1.21rem; font-family: var(--ff); display: block; line-height:1.3; font-weight:bold; margin-bottom:15px;}
.snackbar-subtitle-muted {font-size:0.97rem; margin-bottom:8px;}/* ---- progress rail ------------------------------------------ */
.mediaSlot{width:0; inset:0 auto auto 0; height:7px; z-index: 1200; background: linear-gradient(90deg, var(--brand), #4fd39c); transition:width 0.055s linear; position: fixed;}/* ---- masthead (slim, content sits right under it) ----------- */
.commentSection{backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition: box-shadow var(--tr); border-bottom: 1px solid var(--edge-2); z-index: 1000;}/* ---- masthead (slim, content sits right under it) ----------- */
.commentSection{position: sticky; top:0; background:rgba(255, 244, 255, 1);}*.visible-center{align-items: center; display: flex; gap:21px; height:60px;}
.commentSection.tableTime {box-shadow:0 2px 15px rgba(12, 56, 46, 0.07);}

.mt-20 {display: inline-flex; align-items: center;}
.mt-20 img {width:auto; height:28px; backface-visibility:visible;}
.price__input--odd {list-style: none; align-items: center; gap:0px; display: flex;}

.headerAction {margin-left:auto; display: flex; gap:19px; align-items: center;}.pageImage{display: block; font-size:.9.07rem; padding:9px 11px; color: var(--text); border-radius: var(--rad-s); font-weight:medium; transition: background var(--tr), color var(--tr);}

.toolbarContent {gap:7px; display: flex; align-items: center;}
.pageImage:hover {background: var(--brand-l); color: var(--brand);}
.sectionAction {font-weight:700; color: var(--head); font-size:.8.96rem;}
.sectionAction {padding:8px 7px;}.sectionAction:hover{color: var(--brand); font-variant-caps:normal;}

.popoverRow {margin-left:auto;}

.popoverRow {display: none; flex-direction: column; padding:6px; gap:2px; background-blend-mode:normal;}html .popoverRow span{height:2px; background: var(--head); display: block; transition: transform var(--tr), opacity var(--tr); width:24px; border-radius:2px;}
.popoverRow.x span:nth-child(1) {transform: translateY(7px) rotate(45deg);}
.popoverRow.x span:nth-child(2) {shape-margin:0; opacity:0; orphans:2;}
.popoverRow.x span:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}

@media (max-width: 820px) {
  .popoverRow {display: flex;}body .headerAction{padding:20px 18px 23px; box-shadow: var(--sh-l); inset:58px 0 auto 0; opacity:0; border-bottom: 1px solid var(--edge); flex-direction: column; align-items: stretch; pointer-events: none; transform: translateY(-12px); transition: transform var(--tr), opacity var(--tr); background: var(--bg); position: absolute; gap:18px;}
  .headerAction.open {opacity:1; pointer-events: auto; transform: none;}
  .price__input--odd {align-items: stretch; flex-direction: column;}
  .toolbarContent {justify-content: flex-start; padding-top:10px; border-top: 1px solid var(--edge);}
}
.timelineCap {contain:none; width:100%; max-width:762px; margin-inline:auto;}/* ---- content shell ------------------------------------------ */
.screenAction{padding:42px 0 68px;}

/* ---- article (the only real content) ------------------------ */
.el-hero {box-shadow: var(--sh-s); border-radius: var(--rad-l); padding:48px; border: 1px solid var(--edge-2); background: var(--bg);}
@media (max-width: 620px) { .el-hero {border-radius: var(--rad-m); padding:26px 24px;} }

.postPlaceholder {margin-bottom:30px;}
.moduleImage {margin-bottom:17px;}
.modalRegion {flex-wrap: wrap; gap:19px; align-items: center; font-size:.82.04rem; color: var(--text-2); display: flex;}
.c-grid-close {gap:9px; display: inline-flex; align-items: center;}.c-grid-close svg{flex: none; opacity:0.54;}
.viewOuter {padding:22px 19px; border-radius: var(--rad-m); background: var(--bg-2); border: 1px solid var(--edge);}

/* table of contents (collapsible, inside article) */
.sliderBody {margin-bottom:30px;}html .mediaCap{align-items: center; justify-content: space-between; display: flex; margin-bottom:7px;}
.profileNumber {transform-style:flat;}
.profileNumber {text-decoration-skip-ink:auto; font-size:.8.06rem; color: var(--brand);}
.box-number ol {backface-visibility:visible; counter-reset: t;}
.box-number ol {list-style: none;}
.box-number li {margin-bottom:9px; counter-increment: t;}
.box-number li::before {content: counter(t) ". "; font-synthesis:weight style small-caps; font-weight:700; font-variant-caps:normal; color: var(--brand);}
.box-number a {color: var(--text); font-size:.9.03rem; orphans:2;}
.box-number a:hover {color: var(--brand);}

/* article body — real H2/H3 live here */
.c-stepper-outer {text-rendering:auto; color: var(--text); font-size:1.13rem; line-height:1.82; break-inside:auto;}
.c-stepper-outer > * + * {margin-top:1.08em;}
.c-stepper-outer h2 {margin-top:1.96em; font-size: clamp(1.45rem, 1.1rem + 1.3vw, 1.75rem);}
.c-stepper-outer h3 {margin-top:1.58em; backface-visibility:visible; font-size:1.25rem; hyphens:manual;}
.c-stepper-outer p {margin:0 0 1.21em;}
.c-stepper-outer ul, .c-stepper-outer ol {margin:0 0 1.1em; padding-left:1.51em;}
.c-stepper-outer li {margin-bottom:.44.94em;}
.c-stepper-outer a {text-underline-offset:2px; text-decoration-color:rgba(10, 129, 103, 0.42); text-rendering:auto; isolation:auto; text-decoration:underline;}
.c-stepper-outer a:hover {text-decoration-color: var(--brand);}
.c-stepper-outer img {border-radius: var(--rad-m); isolation:auto; text-underline-offset:auto; margin:1.42em 0;}
.c-stepper-outer blockquote {font-family: var(--ff-h); background: var(--brand-l);}
.c-stepper-outer blockquote {color: var(--head); font-style:italic; padding:1.05em 1.33em; border-radius: 0 var(--rad-s) var(--rad-s) 0; margin:1.48em 0; border-left: 4px solid var(--brand);}
.c-stepper-outer pre {border-radius: var(--rad-m); padding:1.23em 1.23em; font-size:.87.97rem; overflow-x: auto; font-family: var(--ff-m); background:#0f141d; margin:1.5em 0; color:#main-footer; image-rendering:auto;}
.c-stepper-outer code {font-variant-ligatures:normal; padding:2px 3px; background: var(--bg-2); font-family: var(--ff-m); font-size:.9.08em; border-radius:1px; color:#07604d; text-underline-offset:auto;}
.c-stepper-outer pre code {background:none; color:inherit; padding:0;}*.c-stepper-outer table{width:100%; border-collapse:collapse; margin:1.51em 0; font-size:.95.07rem;}.c-stepper-outer th, .c-stepper-outer td{padding:8px 18px; text-align: left;}.c-stepper-outer th, .c-stepper-outer td{border: 1px solid var(--edge);}

/* share */
.dropdownHolder {border-top: 1px solid var(--edge-2); flex-wrap: wrap; align-items: center; display: flex; padding-top:22px; margin-top:29px; gap:15px;}
.c-stepper-outer th {background: var(--bg-2); font-family: var(--ff); font-weight:700; color: var(--head);}
.clear-start {font-size:.85.98rem; color: var(--head); font-weight:500;}html .l-block{gap:11px; display: flex;}
.counterName {height:39px; color: var(--text-2); border: 1px solid var(--edge); background: var(--bg-2); justify-content: center; display: inline-flex; width:39px; border-radius:11px; transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr), box-shadow var(--tr); align-items: center;}/* ---- comments (directly under article) ---------------------- */
.dropdownPrimary:not(._9d2de5){margin-top:26px; padding-top:33px;padding-right:33px;padding-bottom:33px;padding-left:33px; border: 1px solid var(--edge-2); box-shadow: var(--sh-s); background: var(--bg); border-radius: var(--rad-l);}
.counterName:hover {border-color: var(--brand); background: var(--brand); box-shadow:0 7px 13px rgba(35, 154, 111, 0.37); transform: translateY(-2px); color:#modal_addon;}

/* ---- forms & controls --------------------------------------- */
.sectionIcon {margin-top:5px;}
.reviewTime {gap:19px; grid-template-columns: 1fr 1fr; margin-bottom:13px; display: grid;}
.cardPlaceholder {margin-bottom:11px;}
@media (max-width: 560px) { .reviewTime {grid-template-columns: 1fr;} }.actionExpand{color: var(--text); shape-margin:0; width:100%; padding:15px 14px; border-radius: var(--rad-m); background: var(--bg); transition: border-color var(--tr), box-shadow var(--tr); border: 1px solid var(--edge); font:inherit; font-size:.91.97rem;}*.actionExpand::placeholder{color:#count-panel;}
.actionExpand:focus {outline:none; box-shadow: 0 0 0 3px var(--brand-l); border-color: var(--brand);}
.badgeClose {resize: vertical; min-height:130px; line-height:1.6;}

.postSeparator {display: inline-flex; font-size:.91.96rem; padding:10px 20px; justify-content: center; border-radius: var(--rad-m); font-weight:600; gap:10px; white-space: nowrap; transition: transform var(--tr), background var(--tr), color var(--tr), box-shadow var(--tr), border-color var(--tr); align-items: center; font:inherit;}.filterRegion{background: var(--brand); box-shadow:0 2px 15px rgba(24, 127, 86, 0.21); color:#modal_addon;}
.filterRegion:hover {transform: translateY(-1px); background: var(--brand-d);}
.dialogItem {color: var(--brand); border: 1.5px solid var(--brand); padding:12px 18px; background:transparent;}
.filterRegion:hover {box-shadow:0 2px 18px rgba(19, 130, 94, 0.31); color:#modal_addon;}
.dialogItem:hover {color:#modal_addon; background: var(--brand);}
.entryColumn {border: 1px solid var(--edge); font-variant-caps:normal; color: var(--text); text-underline-offset:auto; background: var(--bg-2);}
.entryColumn:hover {color: var(--head); background: var(--edge-2);}
.o-snackbar-track {width:100%;}
.widgetCap {padding:0; width:44px; text-underline-offset:auto; flex: none;}

.nav__area {margin-bottom:30px; box-shadow: var(--sh-s); grid-template-columns: 1fr 1.25fr; display: grid; border: 1px solid var(--edge); background: var(--bg); gap:32px; align-items: start; border-radius: var(--rad-l); padding-top:38px;padding-right:38px;padding-bottom:38px;padding-left:38px;}

/* ---- extras zone (everything else, pushed below content) ---- */
.priceInner {padding:59px 0; border-top: 1px solid var(--edge); background: var(--bg-2);}
@media (max-width: 720px) { .nav__area {grid-template-columns: 1fr; gap:23px;} }

.dividerFill {grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)); display: grid; gap:21px;}
.headerCell {color: var(--text-2); font-size:.8.94rem;}body .boxLabel{margin-bottom:13px; font-size:.85.08rem; color: var(--text-2); break-inside:auto;}
.sort {border: 1px solid var(--edge); box-shadow: var(--sh-s); background: var(--bg); backface-visibility:visible; padding:25px; border-radius: var(--rad-l);}

.media__slot {display: flex; gap:8px;}body .media__slot .actionExpand{flex: 1;}

.block--small {list-style: none; contain:none;}
.block--small li a {border-bottom: 1px solid var(--edge-2); transition: color var(--tr), padding-left var(--tr); font-size:.87.92rem; display: block; color: var(--text); padding:8px 0;}
.block--small li:last-child a {border-bottom:0 none;}
.block--small li a:hover {padding-left:3px; page-break-inside:auto; color: var(--brand); tab-size:4;}/* ---- footer ------------------------------------------------- */
.navPrimary{font-variant-ligatures:normal; background: var(--bg-3); border-top: 1px solid var(--edge);}
.dividerSection {padding:52px 0 40px;}
.heroRow {display: grid; grid-template-columns: 1.6fr 1fr 1fr;}
.heroRow {gap:34px;}
@media (max-width: 760px) { .heroRow {grid-template-columns: 1fr 1fr; gap:27px;} }
@media (max-width: 480px) { .heroRow {grid-template-columns: 1fr;} }

.sortSeparator img {margin-bottom:11px;}body .toggle-sticky{margin-bottom:19px; max-width:323px; font-size:.82.07rem; color: var(--text-2);}

.sortSeparator img {height:33px; width:auto;}body .layoutSlot{list-style: none;}*.layoutSlot li{margin-bottom:8px;}.layoutSlot a{font-size:.87rem; color: var(--text-2);}
.dividerTitle {border-top: 1px solid var(--edge); padding:16px 0; text-align: center;}
.layoutSlot a:hover {color: var(--brand); tab-size:4; text-rendering:auto;}/* ---- reworked social icons (square tiles, monoline glyphs) --- */
.viewLine{list-style: none; display: flex; gap:10px;}
.dividerTitle p {font-size:.8.08rem; color: var(--text-2);}.viewLine a{justify-content: center; color: var(--text-2); border-radius: var(--rad-m); height:42px; display: inline-flex; transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr); border: 1px solid var(--edge); align-items: center; background: var(--bg-2); width:42px;}
.viewLine a:hover {color:#modal_addon; transform: translateY(-3px); background: var(--brand); border-color: var(--brand);}
.viewLine svg {height:16px; width:19px;}

/* ---- back to top -------------------------------------------- */
.header-prefix {position: fixed; justify-content: center; opacity:0; width:42px; box-shadow: var(--sh-m); display: flex; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr), color var(--tr); z-index: 900; border-radius:8px; height:44px; color: var(--head); align-items: center; bottom:32px; visibility: hidden; transform: translateY(10px); background: var(--bg); border: 1px solid var(--edge); right:24px;}body .header-prefix.show{opacity:1;}body .header-prefix.show{transform: none; transform-style:flat; visibility: visible;}
.header-prefix:hover {transform: translateY(-2px); color:#modal_addon; background: var(--brand); border-color: var(--brand);}/* ---- cookie ------------------------------------------------- */
.sidebar--focused{background: var(--head); padding:15px 0; right:0; transform: translateY(100%); transition:transform 0.397s ease; color:rgba(255, 255, 255, 0.89); left:0; position: fixed; z-index: 1100; bottom:0;}.sidebar--focused.show{background-blend-mode:normal; will-change:auto; transform: none;}
.paginationRegion {display: flex; justify-content: space-between; gap:17px; align-items: center;}
.sidebar--focused p {font-size:.84.93rem; line-height:1.5;}.sidebar--focused a{color:#77d89c;}
.sidebar--focused .postSeparator {flex: none;}
@media (max-width: 600px) { .paginationRegion {flex-direction: column; text-align: center;} }

/* ---- :target auth modals (markup lives at end of body) ------ */
.el-module {opacity:0; padding:24px; z-index: 1300; visibility: hidden; display: flex; align-items: center; justify-content: center; inset:0; position: fixed; transition:opacity 0.198s ease, visibility 0.262s ease;}
.el-module:target {visibility: visible; opacity:1;}
.heroExpand {backdrop-filter:blur(2px); inset:0; -webkit-backdrop-filter:blur(2px); background:rgba(0, 22, 24, 0.6); position: absolute;}
.bannerData {background: var(--bg); max-width:413px; box-shadow: var(--sh-l); padding-top:37px;padding-right:37px;padding-bottom:37px;padding-left:37px; border-radius: var(--rad-l); transform: translateY(14px) scale(.98); transition:transform 0.225s ease; position: relative; width:100%;}body .sectionButton{transition: background var(--tr), color var(--tr); height:37px; color: var(--text-2); justify-content: center; border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px; right:16px; width:31px; line-height:1; display: flex; font-size:17px; position: absolute; top:10px; align-items: center;}
.el-module:target .bannerData {transform: none;}body .sectionButton:hover{font-synthesis:weight style small-caps; background: var(--bg-2); color: var(--head);}
.gridPrimary {print-color-adjust:economy; font-variant-caps:normal; margin-bottom:14px; color: var(--text-2); font-size:.84.96rem;}html .priceBackdrop{color: var(--text-2); text-align: center; font-size:.84.93rem; margin-top:14px;}/* ---- reveal ------------------------------------------------- */
.viewData{transition:opacity 0.572s ease, transform 0.593s ease; transform: translateY(22px); shape-margin:0; opacity:0;}
.viewData.in {transform: none; opacity:1;}

@media (prefers-reduced-motion: reduce) {*, *::before, *::after{scroll-behavior: auto !important; animation:none !important; transition:none !important;}
  .viewData {transform: none; opacity:1;}
}

@media print {
  .commentSection, .mediaSlot, .dropdownHolder, .dropdownPrimary, .priceInner, .header-prefix, .sidebar--focused, .el-module, .popoverRow {display: none !important;}html .timelineCap{max-width:100%;}.el-hero:not(._9d2de5){box-shadow:none; border:0rem; padding:0;}
  body {font-size:12pt;}
}
