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

:root {--brand-l: #e7f5ee; --edge-2:  #edf2ef; --text-2:  #6b766f; --sh-s: 0 1px 2px rgba(15, 40, 28, .06); --brand-d: #0f6f48; --sh-m: 0 7px 24px rgba(15, 40, 28, .08); --ff-m: ui-monospace, "SFMono-Regular", Consolas, Menlo, monospace; --bg-3:    #f1f6f3; --bg:      #ffffff; --rad-m: 10px; --edge:    #e3ebe6; --ff:   system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; --max: 1120px; --rad-l: 16px; --rad-s: 6px; --bg-2:    #f3f7f4; --head:    #15201b; --sh-l: 0 18px 48px rgba(15, 40, 28, .12); --text:    #37433d; --brand:   #16915e; --ff-h: Georgia, "Iowan Old Style", "Times New Roman", "Noto Serif", serif; --tr: .25s cubic-bezier(.4, 0, .2, 1);}

*, *::before, *::after {contain:none; box-sizing: border-box;}
html, body, p, ul, ol, li, figure, blockquote, h1, h2, h3, h4 {padding:0; margin:0;}body{overflow-x: hidden; min-height:100%; color: var(--text); font-size:12px;}

html {-webkit-font-smoothing:antialiased; height:100%; -webkit-text-size-adjust:100%; scroll-behavior: smooth; -moz-osx-font-smoothing:grayscale;}body{font-family: var(--ff); background: var(--bg); line-height:1.7;}

img, svg {max-width:100%; display: block; height:auto;}
a {color: var(--brand); transition: color var(--tr); text-decoration:none;}
a:hover {color: var(--brand-d);}
button {background:none; border:none; cursor: pointer; font-family:inherit;}

:focus-visible {border-radius:6px; outline: 2px solid var(--brand); outline-offset:2px;}::-webkit-scrollbar{width:12px;}
::selection {background: var(--brand-l); color: var(--head);}
::-webkit-scrollbar-track {background: var(--bg-2);}
::-webkit-scrollbar-thumb {background-color:#babebe; border-top-left-radius:7px;border-top-right-radius:7px;border-bottom-right-radius:7px;border-bottom-left-radius:7px;}

.o-header {border:none; padding:0; clip:rect(0,0,0,0); position: absolute; overflow: hidden; background-blend-mode:normal; height:1px; width:1px; margin:-1px; white-space: nowrap;}
::-webkit-scrollbar-thumb:hover {background:#a6abb0;}.viewContent{margin-inline:auto; padding-inline:22px; width:100%; max-width: var(--max);}
h1 {font-size: clamp(1.85rem, 1.25rem + 2.4vw, 2.55rem); letter-spacing:-.11.98em;}
.rating-group + .breadcrumb-dot {font-size:1.125rem; overflow:hidden}


/* ---- real headings: ONLY the article uses them --------------- */
h1, h2, h3, h4 {font-family: var(--ff-h); line-height:1.25; font-weight:bold; color: var(--head);}
.paginationSummary {margin-bottom:15px; font-size:0.94rem;}
.comment__fill {border-radius:46px; width:700px; justify-content:space-between}
/* ---- span labels styled to look like section titles --------- */
.viewColumn{color: var(--head); font-size:1.26rem; margin-bottom:17px; display: block; font-family: var(--ff); line-height:1.3; font-weight:bold;}

/* ---- masthead (slim, content sits right under it) ----------- */
.screenPrefix {backdrop-filter:blur(10px); z-index: 1000; border-bottom: 1px solid var(--edge-2); transition: box-shadow var(--tr); background:rgba(255, 255, 247, 0.9); position: sticky; -webkit-backdrop-filter:blur(10px);}

/* ---- progress rail ------------------------------------------ */
.stepNumber {background: linear-gradient(90deg, var(--brand), #4fd39c); position: fixed; width:0; transition:width 0.127s linear; height:1px; z-index: 1200; inset:0 auto auto 0;}

/* ---- masthead (slim, content sits right under it) ----------- */
.screenPrefix {top:0;}
.screenPrefix.layoutIndicator {print-color-adjust:economy; box-shadow:0 2px 16px rgba(11, 49, 23, 0.09);}body .bannerItem{display: flex; gap:18px; font-variant-ligatures:normal; align-items: center; height:54px;}
.screenPrefix.layoutIndicator {word-spacing:normal;}body .bannerItem{page-break-inside:auto;}.visible-3{image-rendering:auto;}.visible-3{display: inline-flex; align-items: center;}

.stepTertiary {display: flex; align-items: center; margin-left:auto; gap:17px; font-variant-caps:normal; backface-visibility:visible;}body .visible-3 img{height:34px; width:auto;}.blockTitle{list-style: none; gap:7px; display: flex; align-items: center;}body .menuClose{display: block; border-radius: var(--rad-s); color: var(--text); font-size:.8.94rem; text-underline-offset:auto; font-weight:500; transition: background var(--tr), color var(--tr); padding-top:5px;padding-right:13px;padding-bottom:5px;padding-left:13px;}.menuClose:hover{widows:2; background: var(--brand-l); color: var(--brand);}

.carouselSlot {display: flex; align-items: center; gap:11px; will-change:auto;}
.panel__zone {overflow:hidden; transition:opacity 0.4s; padding:0.25rem; position:relative}
.dropdownCount:not(.void17){color: var(--head); font-weight:600; font-size:.8.98rem; padding:7px 6px;}
.dropdownCount:hover {color: var(--brand);}

.viewRow {gap:1px; padding:7px; margin-left:auto; display: none; flex-direction: column;}
.viewRow span {border-top-left-radius:2px; border-top-right-radius:2px; border-bottom-right-radius:2px; border-bottom-left-radius:2px; background: var(--head); transition: transform var(--tr), opacity var(--tr); display: block; height:2px;}
.viewRow span {width:20px;}
.viewRow.x span:nth-child(1) {transform: translateY(7px) rotate(45deg);}
.viewRow.x span:nth-child(2) {opacity:0;}
.viewRow.x span:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}

@media (max-width: 820px) {*.viewRow{display: flex;}
  .stepTertiary {transform: translateY(-12px); background: var(--bg); box-shadow: var(--sh-l); opacity:0; position: absolute; border-bottom: 1px solid var(--edge); flex-direction: column; padding:14px 25px 24px; align-items: stretch; pointer-events: none; inset:62px 0 auto 0; gap:13px; transition: transform var(--tr), opacity var(--tr);}
  .stepTertiary.open {opacity:1; transform: none; pointer-events: auto;}.blockTitle{flex-direction: column; align-items: stretch;}
  .carouselSlot {padding-top:10px; border-top: 1px solid var(--edge); justify-content: flex-start;}
}/* ---- content shell ------------------------------------------ */
.t-footer{padding:44px 0 68px;}/* ---- article (the only real content) ------------------------ */
.align-4{border: 1px solid var(--edge-2); box-shadow: var(--sh-s);}body .breadcrumb__toggle--compact{margin-inline:auto; max-width:760px; width:100%;}/* ---- article (the only real content) ------------------------ */
.align-4{padding-top:40px; padding-right:40px; padding-bottom:40px; padding-left:40px; background: var(--bg); border-radius: var(--rad-l);}
@media (max-width: 620px) { .align-4 {padding:24px 16px; border-radius: var(--rad-m);} }*.ratingLine{margin-bottom:29px;}*.sidebar{margin-bottom:19px;}
.moduleLabel {font-size:.82.03rem; flex-wrap: wrap; align-items: center;}
.moduleLabel {gap:17px; display: flex; color: var(--text-2);}
.status {gap:6px; align-items: center; display: inline-flex;}
.status svg {flex: none; opacity:0.54;}

/* table of contents (collapsible, inside article) */
.dialogWrapper {margin-bottom:24px;}
.modal--small {background: var(--bg-2); border-radius: var(--rad-m); padding:22px 24px; border: 1px solid var(--edge);}
.o-drawer {align-items: center; display: flex; margin-bottom:9px; justify-content: space-between;}
.avatar-area {gap:2.5rem; position:static; font-size:1.75rem}
html .pageZone ol{counter-reset: t; list-style: none;}
.font-inline {font-size:.8rem; color: var(--brand);}
.pageZone li {margin-bottom:11px; counter-increment: t;}
.pageZone li::before {font-weight:600; content: counter(t) ". "; color: var(--brand);}
.pageZone a {font-size:.9.05rem; tab-size:4; font-synthesis:weight style small-caps; color: var(--text);}.pageZone a:hover{color: var(--brand);}

/* article body — real H2/H3 live here */
.breadcrumbContent {color: var(--text); line-height:1.82; font-size:1.09rem;}
.breadcrumbContent > * + * {margin-top:1.11em;}
.breadcrumbContent h2 {font-size: clamp(1.45rem, 1.1rem + 1.3vw, 1.75rem); margin-top:1.88em;}
.breadcrumbContent h3 {margin-top:1.58em; font-size:1.38rem;}
.breadcrumbContent h3 {backface-visibility:visible;}html .breadcrumbContent p{margin:0 0 1.23em;}
.breadcrumbContent ul, .breadcrumbContent ol {margin:0 0 1.1em; padding-left:1.46em;}
.breadcrumbContent li {margin-bottom:.44.96em;}
.breadcrumbContent a {text-decoration-color:rgba(13, 150, 110, 0.46); text-decoration:underline; text-underline-offset:2px;}
.breadcrumbContent a:hover {text-decoration-color: var(--brand);}
.breadcrumbContent img {margin:1.49em 0; border-radius: var(--rad-m); print-color-adjust:economy; isolation:auto;}
.breadcrumbContent blockquote {background: var(--brand-l); color: var(--head);}
.breadcrumbContent blockquote {font-family: var(--ff-h); border-left: 4px solid var(--brand); padding:1.08em 1.3em; border-radius: 0 var(--rad-s) var(--rad-s) 0; font-style:italic; margin:1.42em 0;}*.breadcrumbContent pre{overflow-x: auto; margin:1.58em 0; font-family: var(--ff-m); border-radius: var(--rad-m); font-size:.88.05rem; padding:1.21em 1.35em; background:#07351e; color:#eee4f6;}
.breadcrumbContent code {border-radius:3px; background: var(--bg-2); font-size:.9em; font-family: var(--ff-m); color:#115a4a; padding-top:2px;padding-right:6px;padding-bottom:2px;padding-left:6px;}
.comment-overlay.skeleton-success {letter-spacing:0.15em; text-decoration:none; margin-bottom:4px; align-items:flex-end}

@media (min-width: 1280px) and (max-width: 1493px) {
  .hero-toggle:not(:last-child) {border-radius:50%; max-width:100%; text-decoration:underline; justify-content:center; padding-left:24px; cursor:default}
  .comment-overlay.skeleton-success {border-radius:36px; padding-bottom:1rem; min-height:100vh; transition:all 0.2s ease; box-shadow:0 7px 7px rgba(0,0,0,0.58)}
}


.breadcrumbContent pre code {color:inherit; background:none; padding:0;}html .breadcrumbContent table{width:100%; border-collapse:collapse; margin:1.44em 0; font-size:.95.03rem;}html .breadcrumbContent th, .breadcrumbContent td{padding:15px 15px; text-align: left; border: 1px solid var(--edge);}
.breadcrumbContent th {font-weight:600; font-family: var(--ff); color: var(--head); background: var(--bg-2);}
.panelArea {font-weight:600; shape-margin:0; font-size:.86.05rem; color: var(--head);}

/* share */
.menuIndicator {margin-top:26px; align-items: center; border-top: 1px solid var(--edge-2); gap:13px; padding-top:23px; display: flex; flex-wrap: wrap;}
.priceTrack {gap:9px; display: flex;}
.heroTrack {height:38px; background: var(--bg-2); align-items: center; justify-content: center; transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr), box-shadow var(--tr); color: var(--text-2); width:37px; border-radius:11px; display: inline-flex; border: 1px solid var(--edge);}
.heroTrack:hover {border-color: var(--brand); box-shadow:0 5px 18px rgba(25, 154, 104, 0.26); text-rendering:auto; transform: translateY(-2px); color:#ffffff; perspective:none; background: var(--brand);}

/* ---- comments (directly under article) ---------------------- */
.profileText {box-shadow: var(--sh-s); padding:31px; margin-top:25px; border-radius: var(--rad-l); border: 1px solid var(--edge-2); background: var(--bg);}
#thread-cell {margin-top:auto; transition:transform 0.25s ease-in-out; font-size:31px; background:#5327d7; width:100%}


/* ---- forms & controls --------------------------------------- */
.layoutAddon {margin-top:5px;}
.footerNumber {margin-bottom:16px;}
.stepperSuffix {margin-bottom:14px; grid-template-columns: 1fr 1fr; gap:16px; display: grid;}
@media (max-width: 560px) { .stepperSuffix {grid-template-columns: 1fr;} }body .screenContainer{border: 1px solid var(--edge); background: var(--bg); font:inherit; color: var(--text); padding:16px 15px; font-size:.91.98rem; width:100%; transition: border-color var(--tr), box-shadow var(--tr); border-radius: var(--rad-m);}html .screenContainer::placeholder{color:#a1afa4;}.screenContainer:focus{backface-visibility:visible; border-color: var(--brand); outline:none; image-rendering:auto;}.screenContainer:focus{box-shadow: 0 0 0 3px var(--brand-l);}*.t-dropdown{min-height:127px; line-height:1.6; resize: vertical;}
.ratingSection {background: var(--brand); box-shadow:0 0px 12px rgba(35, 160, 86, 0.29); color:#fffbff;}

.sortOverlay {font-weight:600; transition: transform var(--tr), background var(--tr), color var(--tr), box-shadow var(--tr), border-color var(--tr); display: inline-flex; white-space: nowrap; border-radius: var(--rad-m); padding:7px 20px; gap:6px; justify-content: center; font:inherit; align-items: center; font-size:.92.03rem;}*.ratingSection:hover{background: var(--brand-d); transform: translateY(-1px); color:rgb(249, 255, 251); box-shadow:0 8px 21px rgba(38, 132, 99, 0.28);}
.commentHolder {border: 1.5px solid var(--brand); padding:9px 17px; background:transparent; color: var(--brand);}
@media (min-width: 1024px) and (max-width: 1412px) {
  #sort-fill {height:100%; flex-wrap:wrap; padding-left:0.5rem; transition:transform 0.15s ease-in-out; align-items:stretch; position:relative}
  .action-tertiary.gallery-top {transition:transform 0.15s ease-in-out; margin-left:auto}
  .drawer-close .sidebar-expand {justify-content:flex-start; display:inline; padding-top:5px; width:auto; min-height:100vh; border-radius:26px}
}


.commentHolder:hover {background: var(--brand); color:#fcfff0;}.popoverIndicator{color: var(--text); border: 1px solid var(--edge); background: var(--bg-2);}
.popoverIndicator:hover {color: var(--head); background: var(--edge-2);}.tabsSuffix{width:42px; flex: none; padding:0;}
.menuOverlay {width:100%;}

/* ---- extras zone (everything else, pushed below content) ---- */
.sidebarIndicator {padding:59px 0; border-top: 1px solid var(--edge); background: var(--bg-2);}

.text-16 {text-decoration-skip-ink:auto; page-break-inside:auto; display: grid; box-shadow: var(--sh-s); grid-template-columns: 1fr 1.25fr; background: var(--bg); padding-top:31px;padding-right:31px;padding-bottom:31px;padding-left:31px; border: 1px solid var(--edge); border-radius: var(--rad-l); gap:31px; margin-bottom:35px; align-items: start;}
.section-cell:hover {min-width:4px; letter-spacing:0.075em; align-items:center; text-decoration:none}

@media (max-width: 720px) { .text-16 {grid-template-columns: 1fr; gap:25px;} }.galleryDetail:not(.dummy64){color: var(--text-2); font-size:.9.06rem;}

.commentSummary {display: grid; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)); gap:18px;}
.screenSeparator {background: var(--bg); box-shadow: var(--sh-s); padding-top:24px;padding-right:24px;padding-bottom:24px;padding-left:24px; border-radius: var(--rad-l); border: 1px solid var(--edge);}
.spinner-action .tag-detail {text-align:right; opacity:0.50}

.o-nav {margin-bottom:17px; font-size:.85.07rem; color: var(--text-2);}

.formLabel {gap:5px; transform-style:flat; display: flex;}
.formLabel .screenContainer {flex: 1;}

.accordionInner {list-style: none;}
.accordionInner li a {font-size:.88.06rem; display: block; color: var(--text); border-bottom: 1px solid var(--edge-2); transition: color var(--tr), padding-left var(--tr); padding:9px 0;}
.accordionInner li:last-child a {word-spacing:normal; border-bottom:none; isolation:auto;}

/* ---- footer ------------------------------------------------- */
.viewAction {background: var(--bg-3); border-top: 1px solid var(--edge);}
.accordionInner li a:hover {padding-left:5px; color: var(--brand);}
.layoutTrack {padding:54px 0 34px; widows:2; isolation:auto;}.page:not(.void82){grid-template-columns: 1.6fr 1fr 1fr; display: grid; gap:34px;}
@media (max-width: 760px) { .page {gap:23px; grid-template-columns: 1fr 1fr;} }
.timeline-detail::before {content:''; transition:opacity 0.3s; text-transform:lowercase; overflow:visible; align-items:flex-start; display:inline-flex}

@media (max-width: 480px) {.page{font-variant-ligatures:normal; grid-template-columns: 1fr;} }.table__placeholder img{width:auto; margin-bottom:11px; image-rendering:auto; height:30px;}html .u-hero-preview{max-width:317px; color: var(--text-2); margin-bottom:17px;}html .u-hero-preview{font-size:.81.92rem;}html .replyInfo{-webkit-hyphens:manual;-ms-hyphens:manual;hyphens:manual; list-style: none; background-blend-mode:normal;}.replyInfo li{margin-bottom:10px;}body .replyInfo a{text-underline-offset:auto; font-size:.86.97rem; contain:none; color: var(--text-2);}
.u-slider {text-align: center; border-top: 1px solid var(--edge); padding:15px 0; isolation:auto;}
.hero-toggle:not(:last-child) {font-weight:400; position:sticky; max-width:none; color:currentColor; margin:0}
.replyInfo a:hover{color: var(--brand);}
.table-body:hover {gap:0.375rem; border:0; height:30px; position:relative}

.u-slider p {font-size:.7.94rem; print-color-adjust:economy; color: var(--text-2); contain:none;}

/* ---- reworked social icons (square tiles, monoline glyphs) --- */
.breadcrumbZone {list-style: none; gap:9px; display: flex;}
.breadcrumbZone a {height:42px; border-radius: var(--rad-m); border: 1px solid var(--edge); transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr); color: var(--text-2); background: var(--bg-2); display: inline-flex; width:41px; justify-content: center; align-items: center;}
.breadcrumbZone a:hover {color:hsl(14, 19.2%, 95.1%); border-color: var(--brand); transform: translateY(-3px); background: var(--brand);}
.breadcrumbZone svg {width:15px; height:22px;}
.block--pressed {margin-bottom:0; display:grid; transition:opacity 0.15s; flex:1 1 0%; max-width:100%}
/* ---- back to top -------------------------------------------- */
.sidebarWrapper:not(.placeholder70){border: 1px solid var(--edge); opacity:0; color: var(--head); background: var(--bg); border-radius:11px; bottom:27px; align-items: center; transform: translateY(10px); display: flex; position: fixed; z-index: 900; visibility: hidden; width:48px; right:32px; height:43px; transition: opacity var(--tr), visibility var(--tr), transform var(--tr), background var(--tr), color var(--tr); box-shadow: var(--sh-m); justify-content: center;}
.sidebarWrapper.show {opacity:1; visibility: visible; transform: none;}/* ---- cookie ------------------------------------------------- */
.box--even{padding:17px 0; z-index: 1100; background: var(--head); right:0; color:rgba(255, 248, 255, 0.94); transform: translateY(100%); bottom:0; position: fixed; transition:transform 0.363s ease; left:0;}
.sidebarWrapper:hover {background: var(--brand); color:#f2ffed; transform: translateY(-2px); border-color: var(--brand);}
.box--even.show {orphans:2; transform: none;}.h-2{transform-style:flat; gap:17px; align-items: center; display: flex; justify-content: space-between;}body .box--even p{line-height:1.5; font-size:.84.96rem;}.box--even a{color:#69cfbe;}
.box--even .sortOverlay {flex: none;}
@media (max-width: 600px) { .h-2 {flex-direction: column; text-align: center;} }

/* ---- :target auth modals (markup lives at end of body) ------ */
.trigger-avatar {align-items: center; transition:opacity 0.257s ease, visibility 0.284s ease; justify-content: center; padding:21px; opacity:0; display: flex; z-index: 1300; position: fixed; visibility: hidden; inset:0;}
.trigger-avatar:target {isolation:auto; visibility: visible; opacity:1; tab-size:4;}
.skeleton-overlay-highlight {inset:0; -webkit-backdrop-filter:blur(2px); background:rgba(22, 24, 8, 0.47); position: absolute; backdrop-filter:blur(2px);}
.footerItem {box-shadow: var(--sh-l); position: relative; width:100%; transform: translateY(14px) scale(.98); background: var(--bg); padding:31px; transition:transform 0.196s ease; max-width:406px; border-radius: var(--rad-l);}
.trigger-avatar:target .footerItem {transform: none;}
.l-layout-dot {font-size:18px; top:16px; position: absolute; display: flex; justify-content: center; color: var(--text-2); align-items: center; border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-right-radius:5px;border-bottom-left-radius:5px; line-height:1; width:34px; right:14px; height:35px; transition: background var(--tr), color var(--tr);}.screenInput{color: var(--text-2); font-size:.84.99rem; margin-bottom:15px;}body .l-layout-dot:hover{background: var(--bg-2); color: var(--head);}

/* ---- reveal ------------------------------------------------- */
.sidebarInput {transition:opacity 0.546s ease, transform 0.551s ease; transform: translateY(22px); opacity:0;}
.popoverDetail {margin-top:18px; text-align: center; font-size:.85.05rem; color: var(--text-2);}
.sidebarInput.in {transform: none; opacity:1;}

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

@media print {
  .screenPrefix, .stepNumber, .menuIndicator, .profileText, .sidebarIndicator, .sidebarWrapper, .box--even, .trigger-avatar, .viewRow {background-blend-mode:normal; perspective:none; display: none !important;}
  .breadcrumb__toggle--compact {max-width:100%;}
  .align-4 {padding:0; border:0 none;}
  .align-4 {box-shadow:none;}
  body {font-size:12pt;}
}

.pagination-secondary::before {content:''; font-size:1.25rem; position:absolute; margin-top:0.75rem; font-weight:normal}
