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

:root {--bg-2:    #f3f7f4; --edge:    #e3ebe6; --head:    #15201b; --rad-l: 16px; --sh-m: 0 7px 24px rgba(15, 40, 28, .08); --text-2:  #6b766f; --brand-l: #e7f5ee; --rad-m: 10px; --rad-s: 6px; --bg:      #ffffff; --max: 1120px; --edge-2:  #edf2ef; --sh-s: 0 1px 2px rgba(15, 40, 28, .06); --brand-d: #0f6f48; --sh-l: 0 18px 48px rgba(15, 40, 28, .12); --ff:   system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; --ff-h: Georgia, "Iowan Old Style", "Times New Roman", "Noto Serif", serif; --text:    #37433d; --brand:   #16915e; --bg-3:    #f1f6f3; --tr: .25s cubic-bezier(.4, 0, .2, 1); --ff-m: ui-monospace, "SFMono-Regular", Consolas, Menlo, monospace;}
html, body, p, ul, ol, li, figure, blockquote, h1, h2, h3, h4 {padding:0; margin:0;}*, *::before, *::after{box-sizing: border-box;}html{-moz-text-size-adjust:100%;-moz-osx-font-smoothing:grayscale; height:100%; scroll-behavior: smooth; -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased;}
.sort-foot {font-weight:bold; margin-bottom:42px; transition:transform 0.3s ease-in-out; width:fit-content; align-items:flex-start; color:currentColor}


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

body {line-height:1.7; font-family: var(--ff); background: var(--bg); color: var(--text); min-height:100%; overflow-x: hidden; font-size:18px;}a{transition: color var(--tr); color: var(--brand); text-decoration:none;}
a:hover {color: var(--brand-d);}
button {page-break-inside:auto; cursor: pointer; font-family:inherit; border:0; background:none;}
::selection {color: var(--head); background: var(--brand-l);}

:focus-visible {border-radius:6px; outline: 2px solid var(--brand); outline-offset:2px;}
::-webkit-scrollbar {width:12px;}
.post--even {flex:1; overflow:visible; text-align:center; min-height:100vh}

.snackbar-tertiary + .list-slot {justify-content:flex-end; position:absolute; min-height:100vh; margin-left:auto; transition:transform 0.25s ease-in-out; flex-wrap:wrap}

#toolbar-block {transition:opacity 0.15s; margin-right:10px; padding-right:10px; min-height:100vh; display:table}

::-webkit-scrollbar-track {background: var(--bg-2);}
::-webkit-scrollbar-thumb {background-color:#b3decc; border-radius:7px;}::-webkit-scrollbar-thumb:hover{background:#98a7ac;}

.h-center {padding-inline:22px; width:100%; margin-inline:auto; max-width: var(--max);}

.border-16 {width:1px; overflow: hidden; padding:0; white-space: nowrap; margin:-1px; position: absolute; border:0em; height:1px; clip:rect(0,0,0,0);}

/* ---- real headings: ONLY the article uses them --------------- */
h1, h2, h3, h4 {font-family: var(--ff-h);}
h1 {break-inside:auto; font-size: clamp(1.85rem, 1.25rem + 2.4vw, 2.55rem); mix-blend-mode:normal; letter-spacing:-.11.95em;}

/* ---- real headings: ONLY the article uses them --------------- */
h1, h2, h3, h4 {line-height:1.25; font-weight:bold; color: var(--head);}

/* ---- span labels styled to look like section titles --------- */
.tracking-full {font-weight:700; font-family: var(--ff); color: var(--head); margin-bottom:12px; font-size:1.12rem; display: block; line-height:1.3;}
.align-0 {font-size:1.01rem; margin-bottom:12px; mix-blend-mode:normal; break-inside:auto;}/* ---- progress rail ------------------------------------------ */
.slider:not(.noop10){inset:0 auto auto 0; transition:width 0.057s linear; background: linear-gradient(90deg, var(--brand), #4fd39c); height:1px; position: fixed; width:0; z-index: 1200;}

/* ---- masthead (slim, content sits right under it) ----------- */
.c-panel-expand {top:0; background:rgba(250, 255, 255, 0.96); -webkit-backdrop-filter:blur(10px); position: sticky; z-index: 1000; border-bottom: 1px solid var(--edge-2); transition: box-shadow var(--tr); backdrop-filter:blur(10px);}
.shadow-auto {tab-size:4;}
.c-panel-expand.el-block {box-shadow:0 2px 14px rgba(13, 28, 44, 0.01); backface-visibility:visible;}
.shadow-auto {height:56px; gap:22px; font-variant-ligatures:normal; align-items: center; display: flex;}*.slider-line-left{align-items: center; display: inline-flex;}
.slider-line-left img {height:33px; isolation:auto; width:auto;}

.order-end {gap:12px; font-variant-caps:normal; display: flex; align-items: center; margin-left:auto; page-break-inside:auto;}
.opacity-auto {align-items: center; display: flex; list-style: none; gap:1px;}
.app-timeline {display: block; font-size:.8.96rem; padding-top:4px;padding-right:14px;padding-bottom:4px;padding-left:14px; color: var(--text); border-radius: var(--rad-s); transition: background var(--tr), color var(--tr); font-weight:500;}
.app-timeline:hover {color: var(--brand); background: var(--brand-l);}html .p-6{gap:11px; align-items: center; display: flex;}
.tracking-center {padding:4px 3px; color: var(--head); font-size:.9.03rem; font-weight:600;}
.tracking-center:hover {color: var(--brand);}.pb-sm:not(.empty71){flex-direction: column; display: none; padding-top:6px;padding-right:6px;padding-bottom:6px;padding-left:6px; gap:5px; margin-left:auto;}.pb-sm span{background: var(--head); height:2px; transition: transform var(--tr), opacity var(--tr); width:24px; display: block; border-radius:2px;}.x.pb-sm span:nth-child(1){transform: translateY(7px) rotate(45deg); orphans:2;}
.pb-sm.x span:nth-child(2) {perspective:none; opacity:0; transform-style:flat;}
.pb-sm.x span:nth-child(3) {transform: translateY(-7px) rotate(-45deg);}

@media (max-width: 820px) {body .pb-sm{display: flex;}
  .order-end {padding:16px 18px 25px; flex-direction: column; inset:55px 0 auto 0; opacity:0; background: var(--bg); border-bottom: 1px solid var(--edge); position: absolute;}
  .order-end {transform: translateY(-12px); transition: transform var(--tr), opacity var(--tr); align-items: stretch; pointer-events: none; gap:15px; box-shadow: var(--sh-l);}
  .order-end.open {mix-blend-mode:normal; transform: none; shape-margin:0; pointer-events: auto; opacity:1;}
  .opacity-auto {flex-direction: column; align-items: stretch;}
  .p-6 {border-top: 1px solid var(--edge); padding-top:14px; justify-content: flex-start;}
}

/* ---- content shell ------------------------------------------ */
.d-center {padding:36px 0 74px;}body .gap-5{max-width:763px; width:100%; margin-inline:auto;}

/* ---- article (the only real content) ------------------------ */
.row-md {border: 1px solid var(--edge-2); background: var(--bg); box-shadow: var(--sh-s); border-radius: var(--rad-l); padding:46px;}
.review__bar {border-radius:50%; min-height:100vh; cursor:default; position:sticky}

@media (max-width: 620px) { .row-md {padding:28px 16px; border-radius: var(--rad-m);} }

.clear-full {margin-bottom:24px;}
.opacity-2xl {margin-bottom:19px;}
.media-time:not(:last-child) {height:100%; position:sticky; font-weight:600}

.pt-md {color: var(--text-2); flex-wrap: wrap; align-items: center; gap:16px; font-size:.81.97rem; display: flex;}
.c-grid-toggle {display: inline-flex; gap:6px; align-items: center;}.c-grid-toggle svg{opacity:0.58; flex: none;}

/* table of contents (collapsible, inside article) */
.pt-start {margin-bottom:32px;}
.pb-lg {border-radius: var(--rad-m); background: var(--bg-2); padding:14px 22px; border: 1px solid var(--edge);}
.w-6 {justify-content: space-between; align-items: center; display: flex; margin-bottom:8px;}.tracking-half ol{counter-reset: t; list-style: none;}
.gap-24 {color: var(--brand); font-size:.8.01rem;}
#avatar-zone {flex-wrap:nowrap; width:100%}

.tracking-half li {break-inside:auto; margin-bottom:10px; counter-increment: t;}
.spinner-overlay {color:inherit; padding-right:0.5rem; flex:1 1 0%; opacity:1; transition:color 0.4s; position:relative}
.tracking-half li::before{content: counter(t) ". "; color: var(--brand); font-weight:600;}
.tracking-half a {font-size:.8.93rem; color: var(--text);}
.tracking-half a:hover {font-variant-caps:normal; color: var(--brand);}/* article body — real H2/H3 live here */
:where(.h-lg){color: var(--text);}/* article body — real H2/H3 live here */
:where(.h-lg){font-size:1.14rem; line-height:1.82;}html .h-lg > * + *{margin-top:1.17em;}.h-lg h2{margin-top:1.86em; font-size: clamp(1.45rem, 1.1rem + 1.3vw, 1.75rem);}
.h-lg h3 {font-size:1.36rem; margin-top:1.45em;}
.h-lg p {margin:0 0 1.2em;}
.h-lg ul, .h-lg ol {margin:0 0 1.21em; padding-left:1.42em;}
.h-lg li {margin-bottom:.44.97em;}.h-lg a{text-decoration-color:rgba(28, 161, 109, 0.5); text-decoration:underline; text-underline-offset:2px;}.h-lg a:hover{text-decoration-color: var(--brand); text-decoration-skip-ink:auto; page-break-inside:auto;}
.h-lg img {font-synthesis:weight style small-caps;}
.h-lg img {border-radius: var(--rad-m); word-spacing:normal; margin:1.47em 0;}
.h-lg blockquote {border-left: 4px solid var(--brand); color: var(--head); border-radius: 0 var(--rad-s) var(--rad-s) 0; font-style:italic; margin:1.51em 0; padding:1.08em 1.32em; font-family: var(--ff-h); background: var(--brand-l);}
.h-lg pre {font-size:.87.95rem; color:#efffdb; overflow-x: auto; padding:1.08em 1.34em; font-family: var(--ff-m); margin:1.45em 0;}
.h-lg pre {border-radius: var(--rad-m); background:hsl(333, 30.1%, 12%);}
.h-lg code {font-size:.8.99em; color:#086e54; border-radius:3px; font-variant-caps:normal; background: var(--bg-2); page-break-inside:auto; font-family: var(--ff-m); padding:2px 2px;}.h-lg pre code{color:inherit; text-rendering:auto; background:none; padding:0;}
.h-lg table {width:100%;}
.h-lg table {border-collapse:collapse; font-size:.94.92rem; margin:1.43em 0;}
.h-lg th, .h-lg td {text-align: left; padding:9px 12px; border: 1px solid var(--edge);}

/* share */
.tracking-md {flex-wrap: wrap; gap:10px; border-top: 1px solid var(--edge-2); padding-top:22px; align-items: center; margin-top:32px; display: flex;}
.h-lg th {font-family: var(--ff); font-weight:600; background: var(--bg-2); color: var(--head);}
.c-banner-date {font-weight:600; color: var(--head); font-size:.85.95rem;}*.h-xs{gap:5px; display: flex;}
.bg-end {justify-content: center; background: var(--bg-2); display: inline-flex; border: 1px solid var(--edge); align-items: center; width:35px; border-radius:6px; color: var(--text-2); transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr), box-shadow var(--tr); height:40px;}
.bg-end:hover {border-color: var(--brand); box-shadow:0 2px 12px rgba(31, 137, 93, 0.32); color:#f2faff; background: var(--brand); transform: translateY(-2px);}/* ---- comments (directly under article) ---------------------- */
.border-1{padding:31px; margin-top:26px; border-radius: var(--rad-l); background: var(--bg); box-shadow: var(--sh-s); border: 1px solid var(--edge-2);}/* ---- forms & controls --------------------------------------- */
.ui-comment{margin-top:5px;}.tracking-auto{display: grid; margin-bottom:11px; gap:19px; grid-template-columns: 1fr 1fr;}
.number-tooltip {margin-bottom:13px;}
.skeleton-action:hover {justify-content:center; margin-top:1.25rem; transition:color 0.35s; position:static; display:inline-flex; gap:1.5rem}

@media (max-width: 560px) { .tracking-auto {grid-template-columns: 1fr;} }body .overflow-lg{width:100%; font-size:.92.08rem; color: var(--text); background: var(--bg); transition: border-color var(--tr), box-shadow var(--tr); border: 1px solid var(--edge); font:inherit; padding:15px 18px; border-radius: var(--rad-m);}
#card-cell {color:#e07b2c; margin-top:0}

.overflow-lg::placeholder {color:hsl(87, 16.3%, 69.4%);}html .overflow-lg:focus{outline:none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-l);}

.featureIcon {border-radius: var(--rad-m); font-size:.91.92rem; gap:4px; transition: transform var(--tr), background var(--tr), color var(--tr), box-shadow var(--tr), border-color var(--tr); font-weight:600; justify-content: center; align-items: center; white-space: nowrap; font:inherit; padding:13px 26px; display: inline-flex;}
.my-2 {resize: vertical; line-height:1.6; min-height:127px;}
.clear-8 {color:#effbff; box-shadow:0 0px 10px rgba(28, 147, 87, 0.26); background: var(--brand);}
.clear-8:hover {background: var(--brand-d); box-shadow:0 2px 24px rgba(20, 134, 80, 0.31); color:#ffffed; transform: translateY(-1px);}
.grid-half {border: 1.5px solid var(--brand); background:transparent; padding-top:7px;padding-right:14px;padding-bottom:7px;padding-left:14px; color: var(--brand);}
.grid-half:hover {color:#fffcf4; isolation:auto; orphans:2; background: var(--brand);}
.bg-6 {border: 1px solid var(--edge); word-spacing:normal; color: var(--text); background: var(--bg-2);}body .bg-6:hover{background: var(--edge-2); color: var(--head);}.float-inline{flex: none;}.float-inline{width:44px; padding:0;}.h-xl:not(.unused56){width:100%;}

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

.row-auto {border: 1px solid var(--edge); align-items: start; padding-top:31px;padding-right:31px;padding-bottom:31px;padding-left:31px; margin-bottom:38px; gap:33px; border-radius: var(--rad-l); box-shadow: var(--sh-s); display: grid; background: var(--bg); grid-template-columns: 1fr 1.25fr;}
@media (max-width: 720px) { .row-auto {gap:19px; grid-template-columns: 1fr;} }
.mx-end {color: var(--text-2); font-size:.8.97rem; mix-blend-mode:normal;}

.z-16 {gap:23px; display: grid; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));}
.gap-3 {hyphens:manual; shape-margin:0; margin-bottom:14px; font-size:.85.01rem; color: var(--text-2);}
.pl-3 {padding:24px; box-shadow: var(--sh-s); background: var(--bg); border-radius: var(--rad-l); border: 1px solid var(--edge);}

.m-xl {display: flex; gap:10px;}body .m-xl .overflow-lg{flex: 1;}.flex-screen{list-style: none;}
.flex-screen li a {transition: color var(--tr), padding-left var(--tr); border-bottom: 1px solid var(--edge-2); font-size:.87.97rem; display: block; color: var(--text); widows:2; padding:7px 0;}
.flex-screen li:last-child a {border-bottom:none;}
.flex-screen li a:hover {color: var(--brand); padding-left:6px;}

/* ---- footer ------------------------------------------------- */
.bg-1 {background: var(--bg-3); border-top: 1px solid var(--edge);}
.ml-24 {padding:50px 0 33px;}
.p-auto {gap:36px; grid-template-columns: 1.6fr 1fr 1fr; display: grid;}
@media (max-width: 760px) { .p-auto {page-break-inside:auto; grid-template-columns: 1fr 1fr; widows:2; gap:29px;} }
@media (max-width: 480px) {.p-auto{grid-template-columns: 1fr;} }

.header--even img {margin-bottom:16px; height:30px; width:auto;}.row-xl:not(.nil53){margin-bottom:18px; max-width:318px; font-size:.81.96rem; color: var(--text-2);}
.link-spinner {list-style: none;}html .link-spinner li{margin-bottom:8px;}
.link-spinner a {font-size:.86.97rem; color: var(--text-2);}
.link-spinner a:hover {color: var(--brand);}.spinner--medium{padding:22px 0; border-top: 1px solid var(--edge); text-align: center;}
.spinner--medium p {font-size:.8.04rem; color: var(--text-2);}

/* ---- reworked social icons (square tiles, monoline glyphs) --- */
.modal__icon--odd {gap:8px; list-style: none; display: flex;}
.modal__icon--odd a {color: var(--text-2); background: var(--bg-2); border-radius: var(--rad-m); width:41px;}
.modal__icon--odd a {transition: transform var(--tr), background var(--tr), color var(--tr), border-color var(--tr); display: inline-flex; align-items: center; border: 1px solid var(--edge); justify-content: center; height:34px;}
.modal__icon--odd a:hover {transform: translateY(-3px); background: var(--brand); color:#fafaff; border-color: var(--brand); mix-blend-mode:normal;}

/* ---- back to top -------------------------------------------- */
.bg-block {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), color var(--tr); opacity:0; bottom:29px; justify-content: center; display: flex; color: var(--head); position: fixed; width:48px; border: 1px solid var(--edge); box-shadow: var(--sh-m); align-items: center; right:25px; background: var(--bg); z-index: 900; height:41px; visibility: hidden; transform: translateY(10px);}
.modal__icon--odd svg {height:14px; width:17px;}
.bg-block.show {opacity:1; visibility: visible; transform: none;}
.menu-preview:first-child {display:flex; line-height:1; max-width:1360px}

.bg-block:hover {transform: translateY(-2px); border-color: var(--brand);}

/* ---- cookie ------------------------------------------------- */
.m-start {transition:transform 0.433s ease; right:0; position: fixed; bottom:0; z-index: 1100; background: var(--head); transform: translateY(100%); left:0; padding:18px 0; color:rgba(255, 255, 242, 0.83);}
.bg-block:hover {background: var(--brand); color:#ffffff;}.show.m-start{transform: none;}
.widget-area:not(:last-child) {gap:0.875rem; transition:color 0.15s; display:flex}

.float-full {display: flex; font-variant-ligatures:normal; justify-content: space-between; gap:20px; align-items: center;}
.m-start p {font-size:.84.92rem; line-height:1.5;}
.snackbar-thumb.table-even {flex-wrap:nowrap; padding-top:10px; display:inline-flex; text-transform:lowercase; gap:48px}

.m-start a {color:#7ccfa7;}*.m-start .featureIcon{flex: none;}
@media (max-width: 600px) { .float-full {text-align: center; flex-direction: column;} }

/* ---- :target auth modals (markup lives at end of body) ------ */
.app-nav {display: flex; position: fixed; visibility: hidden; opacity:0; justify-content: center; inset:0; padding:19px; z-index: 1300; transition:opacity 0.251s ease, visibility 0.237s ease; align-items: center;}
.app-nav:target {visibility: visible; opacity:1;}
.mr-xs {inset:0; background:rgba(2, 44, 10, 0.63); backdrop-filter:blur(2px); text-decoration-skip-ink:auto; position: absolute; -webkit-backdrop-filter:blur(2px);}
.py-auto {width:100%; box-shadow: var(--sh-l); position: relative; background: var(--bg); padding-top:31px;padding-right:31px;padding-bottom:31px;padding-left:31px; transition:transform 0.232s ease; transform: translateY(14px) scale(.98); max-width:409px; border-radius: var(--rad-l);}
.app-nav:target .py-auto {transform: none;}body .module--full{right:11px; display: flex; align-items: center; width:31px; color: var(--text-2); border-radius:10px; top:15px; font-size:16px; height:34px; position: absolute; justify-content: center; line-height:1; transition: background var(--tr), color var(--tr);}
.position-none {color: var(--text-2); margin-bottom:19px; font-size:.85.03rem;}.module--full:hover{background: var(--bg-2); color: var(--head);}.px-md{font-size:.84.98rem; text-align: center; margin-top:18px; color: var(--text-2);}

/* ---- reveal ------------------------------------------------- */
.flex-xl {transform: translateY(22px); transition:opacity 0.516s ease, transform 0.511s ease; opacity:0;}
.flex-xl.in {transform: none; opacity:1;}
@media (min-width: 1440px) and (max-width: 1819px) {
  .sort-foot {text-transform:lowercase; padding-top:1.125rem; border:1px solid #7bde2f; transition:opacity 0.3s; font-size:20px}
  .snackbar-tertiary + .list-slot {color:currentColor; display:grid; position:relative; height:31px; text-transform:uppercase; width:100%}
  .post--even {align-items:stretch; transition:all 0.2s ease}
}



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

@media print {
  .c-panel-expand, .slider, .tracking-md, .border-1, .search-title, .bg-block, .m-start, .app-nav, .pb-sm {hyphens:manual; print-color-adjust:economy; display: none !important;}
  .gap-5 {max-width:100%;}
  .row-md {border:0 none; box-shadow:none; padding:0;}
  body {font-size:12pt;}
}