/* KnowTheYard v22 stylesheet: the one owner of base type, containers, band padding and rhythm, surfaces, seams and patterns.
   Loaded after style.css (templates/layout/header.php). Tokens live in tokens.css (--kty-s-*, --kty-band-y, seam heights, widths).
   Rules for this file (docs/goals/kty-design-v22/notes/T002-slice-plan.md): no important flags, no position selectors,
   no raw spacing outside the --kty-s-* scale, no hand-written SVG (seams and patterns are the traced files in /assets/images/v22/).
   Legacy .x10 pages (home and the hubs) and new .v22 pages share the same surface block, scoped as :is(.x10,.v22).
   Pages declare surfaces through HubV10::surf() (surf--*); HubV10 also assigns seam--* and seam-to--* so nothing here reads position. */

/* ---- 1. Base type and containers (new v22 pages only; legacy pages keep style.css) ---- */
.v22{font-family:var(--kty-font-body);font-size:var(--kty-body);line-height:var(--kty-body-lh);color:var(--kty-ink-2)}
.v22 :is(h1,h2,h3){margin:0;font-family:var(--kty-font-display);color:var(--kty-ink);text-wrap:balance}
.v22 h1{font-size:var(--kty-h1);line-height:1.1;letter-spacing:-.02em;font-weight:700}
.v22 h2{font-size:var(--kty-h2);line-height:1.15;letter-spacing:-.015em;font-weight:700}
.v22 h3{font-size:var(--kty-h3);line-height:1.25;font-weight:600}
.v22 :is(p,ul,ol,dl,figure){margin:0}
.v22 .lead{font-size:var(--kty-lead);line-height:var(--kty-body-lh)}
.v22 :is(small,.small){font-size:var(--kty-small)}
.v22 img{border-radius:var(--kty-radius)}
.v-wrap{box-sizing:border-box;width:100%;max-width:calc(var(--kty-w-hub) + 2 * var(--kty-gutter));margin-inline:auto;padding-inline:var(--kty-gutter)}
.v-wrap--brand{max-width:calc(var(--kty-w-brand) + 2 * var(--kty-gutter))}
.v-wrap--read{max-width:calc(var(--kty-w-read) + 2 * var(--kty-gutter))}

/* ---- 2. Band rhythm: one padding for every band, and the gaps inside it ----
   .home-cred-band used to be a 24px slim override (style.css v21); it is a normal band now, no band is slimmer than the scale. */
:is(.x10,.v22) :is(.x-sec,.band,.v-band,.home-cred-band):not(.hub-hero){padding-block:var(--kty-band-y)}
:is(.x10,.v22) section:not(.x-hero)>:is(.container,.v-wrap)>*{margin-block:0}
:is(.x10,.v22) section:not(.x-hero)>:is(.container,.v-wrap)>*+*{margin-top:var(--kty-block-gap)}
:is(.x10,.v22) section:not(.x-hero)>:is(.container,.v-wrap)>.x-hd+*{margin-top:var(--kty-head-gap)}
:is(.x10,.v22) section:not(.x-hero)>:is(.container,.v-wrap)>.kty-ico--sec+*{margin-top:var(--kty-s-3)}
:is(.x10,.v22) section:not(.x-hero)>:is(.container,.v-wrap)>.eyebrow+*{margin-top:var(--kty-s-2)}
:is(.x10,.v22) :is(.x-grid,.hub-catalog-grid){row-gap:var(--kty-grid-gap);column-gap:var(--kty-grid-gap)}
/* Grids stay at 3 columns or fewer: Template::gridCols returns 2 or 3 only. */
:is(.x10,.v22) .x-stats{gap:var(--kty-s-2)}
:is(.x10,.v22) .x-subrows{column-gap:var(--kty-s-6)}
:is(.x10,.v22) .x-strip>*+*{margin-top:var(--kty-s-6)}
@media (max-width:760px){:is(.x10,.v22) .x-hero__g{row-gap:var(--kty-s-9)}:is(.x10,.v22) .x-hero__g>*{margin-block:0}}

/* ---- 3. Surfaces: white, tint, sage, sun, forest, leaf (rust is not a v22 fill; home.php still names it until T022, so it paints as leaf) ----
   A template names the surface; this block is the only place a fill, its pattern and its local ink tokens are defined.
   Doubling .surf in the selector (.surf.surf--x) keeps these fills ahead of the older .x-tint, .x-dark and .band-* backgrounds. */
:is(.x10,.v22) .surf{position:relative;isolation:isolate}
:is(.x10,.v22) .surf.surf--white{background-color:var(--kty-bg-white);background-image:none}
:is(.x10,.v22) .surf.surf--tint{background-color:var(--kty-bg-tint);background-image:none}
:is(.x10,.v22) .surf.surf--sage{background-color:var(--kty-bg-sage);background-image:none;--kty-mute:#3B4A3C;--kty-accent:#7E3215;--kty-line:#B5CBAE;--pat-ink:var(--kty-pat-sage);--pat-shape:url(/assets/images/v22/pat-sprout.svg);--pat-w:240px;--pat-h:240px}
:is(.x10,.v22) .surf.surf--sun{background-color:var(--kty-bg-sun);background-image:none;--kty-mute:#3D2F1A;--kty-accent:#6E2A10;--kty-line:#D99A2B;--pat-ink:var(--kty-pat-sun);--pat-shape:url(/assets/images/v22/pat-beds.svg);--pat-w:220px;--pat-h:186px}
:is(.x10,.v22) .surf.surf--forest{background-color:var(--kty-bg-dark);background-image:none;--kty-accent:#F2B544;--pat-ink:var(--kty-pat-forest);--pat-shape:url(/assets/images/v22/pat-grid.svg);--pat-w:92px;--pat-h:92px}
:is(.x10,.v22) :is(.surf.surf--leaf,.surf.surf--rust){background-color:var(--kty-bg-leaf);background-image:none;--kty-accent:#FFD27A;--pat-ink:var(--kty-pat-leaf);--pat-shape:url(/assets/images/v22/pat-grass.svg);--pat-w:235px;--pat-h:235px}
:is(.x10,.v22) :is(.surf.surf--forest,.surf.surf--leaf,.surf.surf--rust){color:var(--kty-ink-on-dark);--kty-mute:#E4EFE1;--kty-line:rgba(255,255,255,.22)}
/* Pattern: the traced tile as a mask over a surface-tinted colour (about 1.11:1), behind the content (z-index -1 inside the .surf stacking context). */
:is(.x10,.v22) :is(.surf.surf--sage,.surf.surf--sun,.surf.surf--forest,.surf.surf--leaf,.surf.surf--rust)::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--pat-ink);-webkit-mask:var(--pat-shape) 0 0/var(--pat-w) var(--pat-h) repeat;mask:var(--pat-shape) 0 0/var(--pat-w) var(--pat-h) repeat}
/* Ink per surface. Cards, checklists, callouts, tables and buttons keep their own white ground and ink. */
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) :is(h2,h3,p,li,span,strong,label,a,summary,.x-row,.step-num,.cred-item):not(:is(.x-card,.card,.ky-fcard,.x-check,.x-pair,.x-callout,table,.btn,.editorial-step,.x-sunny) *){color:var(--kty-ink-on-dark)}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) :is(.x-no,.kicker,.eyebrow):not(:is(.x-card,.card,.x-check,.x-callout,.editorial-step) *){color:var(--kty-accent)}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) b:not(:is(.x-card,.card,.x-check,.x-callout,table) *){color:var(--kty-accent)}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) .x-rule{background:rgba(255,255,255,.45);border-color:rgba(255,255,255,.45)}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) :is(.x-hd__row,.band-head) h2::after{background:var(--kty-accent)}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) :is(.btn-ghost,.btn--ghost,.x-more){color:#fff;border-color:#fff;background:transparent}
:is(.x10,.v22) :is(.surf--forest,.surf--leaf,.surf--rust) :is(.card,.x-card){border-color:transparent}
:is(.x10,.v22) .surf--sun :is(h2,h3,p,li,span,strong,small,a,.cred-item):not(:is(table,.btn,.x-card,.card,.x-sunny) *){color:#2A2016}
:is(.x10,.v22) :is(.surf--sun,.surf--sage) :is(.x-hd__row,.band-head) h2::after{background:var(--kty-bg-dark)}
:is(.x10,.v22) .surf--sun .x-rule{background:var(--kty-ink)}
:is(.x10,.v22) .surf--sun :is(.btn-ghost,.btn--ghost,.x-more){color:var(--kty-ink);border-color:var(--kty-ink);background:rgba(255,255,255,.35)}
:is(.x10,.v22) .surf--sage :is(.btn-ghost,.btn--ghost){color:var(--kty-dark);border-color:var(--kty-dark);background:rgba(255,255,255,.5)}
:is(.x10,.v22) .surf--sage :is(p,li):not(:is(.x-card,.card) *){color:var(--kty-ink)}
:is(.x10,.v22) .surf--sun svg:not(.btn *){color:#6E2A10}
:is(.x10,.v22) .surf--leaf .x-list>li :is(h3,span,p,.x-row){color:var(--kty-ink)}
/* Two bands that both declare a surface never carry the older hairline between them. */
:is(.x10,.v22) .surf.surf+.surf{border-top:0}

/* ---- 4. Seams: the lower band's colour rises into the upper band along a traced silhouette ----
   HubV10 puts seam, seam--<shape> and seam-to--<lower surface> on the upper band; the shape is drawn inside that band,
   whose padding-bottom is band-y plus the seam height, so text never touches the seam. */
:is(.x10,.v22) .seam--hills{--seam-shape:url(/assets/images/v22/seam-hills.svg);--seam-h:var(--kty-seam-h)}
:is(.x10,.v22) .seam--hills-hand{--seam-shape:url(/assets/images/v22/seam-hills-hand.svg);--seam-h:var(--kty-seam-h)}
:is(.x10,.v22) .seam--soil{--seam-shape:url(/assets/images/v22/seam-soil.svg);--seam-h:var(--kty-seam-h)}
:is(.x10,.v22) .seam--scallop{--seam-shape:url(/assets/images/v22/seam-scallop.svg);--seam-h:var(--kty-seam-h-scallop)}
:is(.x10,.v22) .seam--scallop-hand{--seam-shape:url(/assets/images/v22/seam-scallop-hand.svg);--seam-h:var(--kty-seam-h-scallop)}
:is(.x10,.v22) .seam--grass{--seam-shape:url(/assets/images/v22/seam-grass.svg);--seam-h:var(--kty-seam-h-grass)}
:is(.x10,.v22) .seam-to--white{--seam-fill:var(--kty-bg-white)}
:is(.x10,.v22) .seam-to--tint{--seam-fill:var(--kty-bg-tint)}
:is(.x10,.v22) .seam-to--sage{--seam-fill:var(--kty-bg-sage)}
:is(.x10,.v22) .seam-to--sun{--seam-fill:var(--kty-bg-sun)}
:is(.x10,.v22) .seam-to--forest{--seam-fill:var(--kty-bg-dark)}
:is(.x10,.v22) :is(.seam-to--leaf,.seam-to--rust){--seam-fill:var(--kty-bg-leaf)}
:is(.x10,.v22) .surf.seam{padding-bottom:calc(var(--kty-band-y) + var(--seam-h))}
:is(.x10,.v22) .surf.seam::after{content:"";position:absolute;left:0;right:0;bottom:0;height:var(--seam-h);pointer-events:none;background:var(--seam-fill);-webkit-mask:var(--seam-shape) center bottom/100% 100% no-repeat;mask:var(--seam-shape) center bottom/100% 100% no-repeat}
/* T012: a row with no photo is a text row (HubV10::row adds x-row--text): no empty thumbnail column. */
:is(.x10,.v22) .x-row--text{grid-template-columns:minmax(0,1fr) var(--kty-s-6)}
/* T012: plain helper line with one link (HubV10::tip). Sunny no longer speaks tips. */
:is(.x10,.v22) .x-note{display:flex;flex-wrap:wrap;align-items:center;gap:var(--kty-s-2) var(--kty-s-4);max-width:var(--kty-w-read)}
:is(.x10,.v22) .x-note p{margin:0}
:is(.x10,.v22) .x-note a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
/* T012: `.x10 .card-grid` forces three tracks; a cols-2 grid (gridCols returns 2 for 2, 4, 8, 10 cards) must keep its two. */
:is(.x10,.v22) .card-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---- 5. Header, brand lockup and footer (T013, comp: docs/design/v22/comps/hub-vegetables.png) ----
   White 80px bar (64px under 901px) with a hairline; mark 44px + live-text wordmark on the left, centred sentence-case primary
   links with a 3px rust bar under the active one, search button and the solid forest Plant Finder button on the right.
   The Plants mega menu rules stay in style.css (section 17). The footer is a forest surface with the traced dot-and-dash grid. */
:root{--nav-h:var(--kty-s-11)}
@media (min-width:901px){:root{--nav-h:var(--kty-s-12)}}
.site-header{position:sticky;top:0;z-index:40;height:var(--nav-h);background:var(--kty-paper);border-bottom:var(--kty-rule) solid var(--kty-line)}
/* Header and footer share the band container (one token pair), so the logo's left edge is the band content's left edge. */
.site-header .container,.site-footer .container{max-width:calc(var(--kty-w-hub) + 2 * var(--kty-gutter));padding-inline:var(--kty-gutter)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);height:var(--nav-h)}
.brand-lockup{display:inline-flex;align-items:center;gap:var(--kty-s-3);flex:0 0 auto;color:var(--kty-bg-dark)}
.brand-lockup:hover{text-decoration:none}
.brand-lockup__mark{display:block;width:44px;height:44px;flex:none}
.brand-lockup__word{font-family:var(--kty-font-display);font-size:1.5rem;font-weight:600;line-height:1;letter-spacing:-.01em;white-space:nowrap;color:var(--kty-bg-dark)}
.brand-lockup__the{color:var(--kty-bg-leaf)}
@media (min-width:901px){.brand-lockup__word{font-size:1.75rem}}
.nav-links{display:flex;align-items:center;gap:var(--kty-s-8);margin:0;padding:0;list-style:none}
.nav-links>li>a,.nav-group-toggle{position:relative;display:inline-flex;align-items:center;gap:var(--kty-s-1);padding:var(--kty-s-6) 0;border:0;background:transparent;color:var(--kty-ink);font-family:var(--kty-font-body);font-size:1rem;font-weight:500;line-height:1.4;white-space:nowrap;cursor:pointer}
.nav-group-toggle>i{font-size:.8rem;transition:transform .18s ease}
.nav-group-toggle[aria-expanded="true"]>i{transform:rotate(180deg)}
.nav-links>li>a:hover,.nav-group-toggle:hover{color:var(--kty-bg-leaf);text-decoration:none}
.nav-links>li>a.active,.nav-group.is-active .nav-group-toggle{font-weight:600}
.nav-links>li>a::after,.nav-group-toggle::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--kty-accent);transform:scaleX(0);transform-origin:left;transition:transform .18s ease}
.nav-links>li>a.active::after,.nav-group.is-active .nav-group-toggle::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:var(--kty-s-3)}
.nav-search{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-paper);color:var(--kty-ink);font-size:1.25rem}
.nav-search:hover{background:var(--kty-bg-tint);color:var(--kty-ink);text-decoration:none}
.nav-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--kty-s-5);border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;white-space:nowrap}
.nav-cta:hover{border-color:var(--kty-bg-leaf);background:var(--kty-bg-leaf);color:var(--kty-ink-on-dark);text-decoration:none}
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:0;background:none;color:var(--kty-ink);font-size:1.6rem;cursor:pointer}
.mega-menu__sub{display:block;margin-bottom:var(--kty-s-1);color:var(--kty-mute);font-size:var(--kty-small);font-weight:400}
@media (min-width:901px){
  .nav-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
  .site-nav{display:contents}
  .nav-inner>.brand-lockup{grid-column:1;justify-self:start}
  .nav-links{grid-column:2}
  .nav-actions{grid-column:3;justify-self:end}
}
@media (max-width:900px){
  .nav-toggle{display:inline-flex}
  .site-nav{position:absolute;top:100%;left:0;right:0;z-index:41;display:none;flex-direction:column;align-items:flex-start;gap:var(--kty-s-4);max-height:calc(100vh - var(--nav-h));overflow-y:auto;padding:var(--kty-s-4) var(--kty-gutter) var(--kty-s-6);background:var(--kty-paper);border-bottom:var(--kty-rule) solid var(--kty-line)}
  .site-nav.open{display:flex}
  .nav-links{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .nav-links>li{width:100%}
  .nav-links>li>a,.nav-group-toggle{width:100%;justify-content:space-between;padding:var(--kty-s-3) 0}
  .nav-links>li>a::after,.nav-group-toggle::after{right:auto;width:var(--kty-s-6)}
}

/* Footer: forest ground, the traced dot-and-dash grid as a whisper (same pattern rule as the forest surface), brand left, link columns right. */
.site-footer{position:relative;isolation:isolate;padding:var(--kty-band-y) 0 var(--kty-s-8);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark)}
.site-footer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--kty-pat-forest);-webkit-mask:url(/assets/images/v22/pat-grid.svg) 0 0/92px 92px repeat;mask:url(/assets/images/v22/pat-grid.svg) 0 0/92px 92px repeat}
.footer-grid{display:grid;grid-template-columns:minmax(0,2fr) repeat(5,minmax(0,1fr));gap:var(--kty-s-8) var(--kty-s-6)}
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:var(--kty-s-4)}
.brand-lockup--footer .brand-lockup__mark{width:48px;height:48px}
.brand-lockup--footer .brand-lockup__word{color:var(--kty-ink-on-dark)}
.brand-lockup--footer .brand-lockup__the{color:var(--kty-bg-sage)}
.footer-brand p{max-width:30ch;margin:0;color:var(--kty-ink-on-dark);font-size:var(--kty-small);line-height:1.5}
.footer-col h2{margin:0 0 var(--kty-s-3);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none}
.footer-col ul{margin:0;padding:0;list-style:none}
.footer-col a{display:inline-block;padding:var(--kty-s-1) 0;color:var(--kty-bg-sage);font-size:var(--kty-small);line-height:1.4}
.footer-col a:hover{color:var(--kty-ink-on-dark);text-decoration:underline}
.footer-bottom{margin-top:var(--kty-s-10);padding-top:var(--kty-s-6);border-top:var(--kty-rule) solid var(--kty-hair-dark)}
.footer-bottom p{margin:0;color:var(--kty-bg-sage);font-size:var(--kty-small)}
@media (max-width:900px){
  .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footer-brand{grid-column:1/-1}
}
@media (max-width:560px){.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- 6. Shared v22 components: photo card and text row (templates/partials/card.php, link-row.php) ----
   One white face, one hairline, radius 10, one tight shadow; the whole card or row is the link; no kickers, pills or side bars. */
.v-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink)}
.v-card:hover{border-color:var(--kty-line-strong);box-shadow:var(--kty-shadow-card);text-decoration:none}
.v-card__media{display:block;aspect-ratio:var(--kty-ratio-card);overflow:hidden;background:var(--kty-bg-tint)}
.v-card__media img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.v-card__body{display:flex;flex:1;align-items:flex-start;justify-content:space-between;gap:var(--kty-s-3);padding:var(--kty-s-4)}
.v22 .v-card__title{margin:0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.25;color:var(--kty-ink);text-wrap:balance}
.v-card__body>i{flex:none;margin-top:var(--kty-s-1);margin-left:calc(var(--kty-s-2) * -1);color:var(--kty-accent);font-size:1rem}
.v-row{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);min-height:var(--kty-s-11);padding-block:var(--kty-row-pad);border-bottom:var(--kty-rule) solid var(--kty-hair);color:var(--kty-ink)}
.v-row:hover{text-decoration:none}
.v-row:hover .v-row__title{text-decoration:underline}
.v-row__body{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--kty-s-1) var(--kty-s-4);min-width:0}
.v22 .v-row__title{margin:0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3;color:var(--kty-ink)}
.v-row__meta{font-size:var(--kty-small);color:var(--kty-mute)}
.v-row>i{flex:none;color:var(--kty-accent);font-size:1rem}

/* ---- 7. Guide article (T015). Comp: docs/design/v22/comps/article-top.png, article-bottom.png ----
   Head band (sage, hills seam), one 760px white reading column, related band (sage, grass seam into the forest footer).
   Rules: no divider between H2s, exactly one ornament (before the FAQ), no side bars, no pills, tables scroll inside their card. */
.v22--article .art-hero.x-hero.surf{padding-block-start:var(--kty-s-8)}
.v22--article .art-hero.x-hero.surf:not(.seam){padding-block-end:var(--kty-s-8)}
.v22--article .art-hero.x-hero.surf.seam{padding-block-end:calc(var(--kty-s-8) + var(--seam-h))}
.v22--article .art-head>*{margin-block:0}
.v22--article .art-head>*+*{margin-top:var(--kty-s-5)}
.v22--article .art-lead{font-size:var(--kty-lead);color:var(--kty-ink)}
.v22--article .art-lead>*{margin-block:0}
.v22--article .art-lead>*+*{margin-top:var(--kty-s-3)}
.v22--article .art-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--kty-s-1) var(--kty-s-4);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--article .art-meta p{margin:0;color:inherit}
@media (min-width:641px){.v22--article .art-hero.x-hero.surf{padding-block-start:var(--kty-s-9)}.v22--article .art-hero.x-hero.surf:not(.seam){padding-block-end:var(--kty-s-9)}.v22--article .art-hero.x-hero.surf.seam{padding-block-end:calc(var(--kty-s-9) + var(--seam-h))}}

/* The column's vertical rhythm is declared once, after the block rules below (section 7, flow). */
.v22--article .art-col{min-width:0}
/* T028 reading family (guide article, plant profile, problem, comparison, purpose, tool page, search, sitemap): one 900 container
   for every band, text left-aligned at its left edge, and the 760 reading column starts at that same edge (never centred inside it). */
:is(.v22--article,.v22--read) .v-wrap{max-width:calc(var(--kty-w-brand) + 2 * var(--kty-gutter))}
.v22--article .art-col{max-width:var(--kty-w-read)}
.v22--article .art-related .art-col{max-width:none}
.v22--article .art-head{max-width:var(--kty-w-brand)}
.v22--article .art-content{overflow-wrap:break-word}
.v22--article .art-sec{scroll-margin-top:calc(var(--nav-h) + var(--kty-s-4))}
.v22--article h3 a{color:inherit}
.v22--article :is(.art-free,.art-run,.art-intro,.art-faq__a,.art-sources,.art-note,.checklist,.art-card,.callout) a:not(.btn){color:var(--kty-accent);text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.15em}
.v22--article .art-free p,.v22--article .art-run p{max-width:none;font-size:inherit;line-height:inherit;color:inherit}
.v22--article :is(.art-free,.art-run) strong{font-weight:700;color:var(--kty-ink)}
.v22--article mark.highlight{padding:0 var(--kty-s-1);border-radius:var(--kty-s-1);background:var(--kty-hl);color:inherit;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* Cards in the column: answer card, contents card, note, tables, checklists, callouts share one face. */
.v22--article .art-card,.v22--article .art-toc,.v22--article .table-wrap,.v22--article .checklist,.v22--article .callout,.v22--article .data-panel--framed,.v22--article .principle-grid,.v22--article .ky-versus,.v22--article .proscons{border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--article .art-card{padding:var(--kty-card-pad)}
.v22--article .art-card__title{margin:0;font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600;line-height:1.25;color:var(--kty-ink)}

/* Answer card: three or four rows, each led by a round leaf-green check. */
.v22--article .art-glance-list{margin:0}
.v22--article .art-glance-list>div{display:grid;grid-template-columns:var(--kty-s-6) minmax(0,1fr);gap:0 var(--kty-s-3);padding-block:var(--kty-s-3);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .art-glance-list>div::before,.v22--article .checklist li::before{content:"\e182";display:grid;place-items:center;grid-row:1/3;grid-column:1;width:var(--kty-s-6);height:var(--kty-s-6);border-radius:50%;background:var(--kty-bg-leaf);color:#fff;font-family:"Phosphor";font-size:.875rem;line-height:1;font-weight:400;position:static}
.v22--article .art-glance-list dt{grid-column:2;margin:0;font-weight:700;color:var(--kty-ink)}
.v22--article .art-glance-list dd{grid-column:2;margin:0;color:var(--kty-ink-2)}
@media (min-width:641px){
  .v22--article .art-glance-list>div{grid-template-columns:var(--kty-s-6) minmax(9rem,13rem) minmax(0,1fr);column-gap:var(--kty-s-4)}
  .v22--article .art-glance-list dt{grid-row:1}
  .v22--article .art-glance-list dd{grid-column:3;grid-row:1}
  .v22--article .art-glance-list>div::before{grid-row:1}
}

/* Hero photo: full column width, shown whole at its own ratio (never cropped by CSS). */
.v22--article .art-photo img{display:block;width:100%;height:auto;border-radius:var(--kty-radius)}

/* Contents card: forest header bar, hairline rows, the rest folded under one quiet link. */
.v22--article .art-toc{overflow:hidden}
.v22--article .art-toc__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);padding:var(--kty-s-4) var(--kty-card-pad);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark)}
.v22--article .art-toc__bar p{margin:0;color:inherit}
.v22--article .art-toc__title{font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600;line-height:1.25}
.v22--article .art-toc__count{display:inline-flex;align-items:center;gap:var(--kty-s-2);font-size:var(--kty-small);font-weight:600}
.v22--article .art-toc__list{margin:0;padding:0 var(--kty-card-pad);list-style:none}
.v22--article .art-toc__list li{margin:0;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .art-toc__list a{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);padding-block:var(--kty-s-3);color:var(--kty-ink)}
.v22--article .art-toc__list a:hover{color:var(--kty-accent);text-decoration:none}
.v22--article .art-toc__list i{flex:none;color:var(--kty-mute);font-size:.875rem}
.v22--article .art-toc__more summary{display:block;padding:var(--kty-s-3) var(--kty-card-pad);border-top:var(--kty-rule) solid var(--kty-hair);color:var(--kty-accent);font-size:var(--kty-small);font-weight:600;cursor:pointer;list-style:none}
.v22--article .art-toc__more summary::-webkit-details-marker{display:none}
.v22--article .art-toc__more summary:hover{text-decoration:underline}

/* Reader-feedback note: one quiet card, its heading smaller than a section heading. */
.v22--article .btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kty-s-9);padding:0 var(--kty-s-6);border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;line-height:1.2;text-transform:none;letter-spacing:0;text-decoration:none}
.v22--article .btn:hover{border-color:var(--kty-bg-leaf);background:var(--kty-bg-leaf);color:var(--kty-ink-on-dark);text-decoration:none}
.v22--article .art-note h2{font-size:var(--kty-h3);line-height:1.25}

/* Body blocks. Template::richBody emits these class names; they are restyled here for the article only. */
.v22--article .callout{margin:0;padding:var(--kty-card-pad)}
.v22--article .callout>strong{display:block;margin:0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--article .callout>strong i{display:none}
.v22--article .callout>strong+*{margin-top:var(--kty-s-3)}
.v22--article .callout>p+p{margin-top:var(--kty-s-3)}
.v22--article .callout ul{margin:0;padding-left:var(--kty-s-6)}
.v22--article .callout li{margin:0;color:var(--kty-ink-2)}
.v22--article .callout li+li{margin-top:var(--kty-s-2)}
.v22--article .callout li::marker{color:var(--kty-bg-leaf)}
.v22--article .content-list{margin:0;padding:0;list-style:none;border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--article .content-list li{margin:0;padding:var(--kty-s-3) 0;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .content-list li::before{content:none}
.v22--article .checklist{margin:0;padding:var(--kty-s-2) var(--kty-card-pad);list-style:none}
.v22--article .checklist li{display:flow-root;margin:0;padding:var(--kty-s-3) 0 var(--kty-s-3) calc(var(--kty-s-6) + var(--kty-s-3))}
.v22--article .checklist li+li{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .checklist li::before{float:left;margin:0 var(--kty-s-3) 0 calc(-1 * (var(--kty-s-6) + var(--kty-s-3)))}
.v22--article .process-steps{margin:0;padding:0;list-style:none;counter-reset:step}
.v22--article .process-steps>li{display:block;margin:0;padding:var(--kty-s-4) 0 var(--kty-s-4) var(--kty-s-10);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .process-steps>li::before{top:var(--kty-s-4);width:var(--kty-s-8);height:var(--kty-s-8);background:var(--kty-bg-leaf);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600}
.v22--article .process-steps>li strong{display:block;font-family:var(--kty-font-display);font-size:var(--kty-lead);color:var(--kty-ink)}
.v22--article .principle-grid{display:block;margin:0;padding:0 var(--kty-card-pad)}
.v22--article .principle{display:grid;grid-template-columns:var(--kty-s-8) minmax(0,1fr);column-gap:var(--kty-s-4);margin:0;padding:var(--kty-s-5) 0;border:0;border-radius:0;background:none}
.v22--article .principle+.principle{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .principle .n{grid-row:1/3;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;letter-spacing:0;color:var(--kty-bg-leaf)}
.v22--article .principle h3{grid-column:2;font-size:var(--kty-lead)}
.v22--article .principle p{grid-column:2;font-size:inherit;color:var(--kty-ink-2)}
.v22--article .keyvalue{margin:0;padding:0;border:0;background:none}
.v22--article .keyvalue>div{display:grid;grid-template-columns:minmax(8rem,30%) minmax(0,1fr);gap:var(--kty-s-1) var(--kty-s-4);padding:var(--kty-s-3) 0;border:0}
.v22--article .keyvalue>div+div{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .keyvalue dt{padding:0;font-family:var(--kty-font-body);font-size:inherit;font-weight:700;letter-spacing:0;text-transform:none;color:var(--kty-ink)}
.v22--article .keyvalue dd{margin:0;color:var(--kty-ink-2)}
.v22--article [data-ky-block="keyfacts"]{padding:var(--kty-s-2) var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--article .data-panel{margin:0}
.v22--article .data-panel--framed{max-width:none;margin:0;padding:var(--kty-card-pad)}
.v22--article .data-panel__title{margin:0 0 var(--kty-s-3);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;letter-spacing:0;text-transform:none;color:var(--kty-ink)}
.v22--article .table-wrap{margin:0;overflow-x:auto}
.v22--article .data-panel--table{max-width:none;margin:0}
.v22--article .data-table{width:100%;min-width:30rem;border-collapse:collapse;font-size:var(--kty-small)}
.v22--article table.data-table :is(th,td){padding:var(--kty-s-3) var(--kty-s-4);border:0;border-top:var(--kty-rule) solid var(--kty-hair);text-align:left;vertical-align:top;color:var(--kty-ink-2)}
.v22--article table.data-table thead th{border-top:0;background:var(--kty-bg-tint);font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:700;letter-spacing:0;text-transform:none;color:var(--kty-ink)}
.v22--article table.data-table tbody th{background:none;font-family:var(--kty-font-body);font-weight:700;color:var(--kty-ink)}
.v22--article .article-image{max-width:100%;margin:0}
.v22--article .article-image img{display:block;width:100%;height:auto;object-fit:contain;border-radius:var(--kty-radius);background:none}
.v22--article .figure--split{max-width:100%;gap:var(--kty-s-6)}

/* Cross links between sections are plain hairline rows. */
.v22--article .art-col>.v-row{border-top:var(--kty-rule) solid var(--kty-hair)}

/* One ornament, before the FAQ: the traced sprout-on-a-rule, in leaf green. */
.v22--article .art-orn{display:block;width:min(100%,calc(var(--kty-s-13) * 3));height:var(--kty-s-8);margin-inline:auto;background:var(--kty-bg-leaf);-webkit-mask:url(/assets/images/v22/orn-sprout-rule.svg) center/contain no-repeat;mask:url(/assets/images/v22/orn-sprout-rule.svg) center/contain no-repeat}

/* FAQ: hairline accordion, a Fraunces question with a thin plus or minus at the right. */
.v22--article .art-faq__items{border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--article .art-faq__items details{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .art-faq__items summary{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);padding-block:var(--kty-row-pad);cursor:pointer;list-style:none}
.v22--article .art-faq__items summary::-webkit-details-marker{display:none}
.v22--article .art-faq__q{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3;color:var(--kty-ink)}
.v22--article .art-faq__items summary i{flex:none;color:var(--kty-bg-dark);font-size:1.125rem}
.v22--article .art-faq__items details[open] summary i::before{content:"\e32a"}
.v22--article .art-faq__a{padding-bottom:var(--kty-row-pad)}
.v22--article .art-faq__a>*{margin:0}
.v22--article .art-faq__a>*+*{margin-top:var(--kty-s-3)}

/* Sources: small, quiet, numbered. */
.v22--article .art-sources h2{font-size:var(--kty-h3);line-height:1.25}
.v22--article .art-sources ol{padding-left:var(--kty-s-6);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--article .art-sources li{margin:0}
.v22--article .art-sources li+li{margin-top:var(--kty-s-3)}

/* Back link: a quiet text link with a chevron. */
.v22--article .art-back a{display:inline-flex;align-items:center;gap:var(--kty-s-2);min-height:44px;color:var(--kty-accent);font-weight:600;text-decoration:underline;text-underline-offset:.15em}
.v22--article .art-back i{font-size:.875rem}

/* Flow: every gap in the column. Declared after the component rules so their margin resets cannot undo it. */
.v22--article .art-col>*{margin-block:0}
.v22--article .art-col>*+*{margin-top:var(--kty-block-gap)}
.v22--article .art-sec>*,.v22--article .art-free>*,.v22--article .art-run>*{margin-block:0}
.v22--article .art-sec>*+*{margin-top:var(--kty-s-6)}
.v22--article .art-free>*+*{margin-top:var(--kty-s-5)}
.v22--article .art-run>*+*{margin-top:var(--kty-s-6)}
.v22--article .art-sec h3{margin-top:var(--kty-s-7)}
.v22--article .art-sec h3+*{margin-top:var(--kty-s-3)}
.v22--article .art-col>*+.art-sec,.v22--article .art-col>*+.at-a-glance{margin-top:var(--kty-flow-h2)}
.v22--article .art-col>.v-row,.v22--article .art-col>.art-back{margin-top:var(--kty-flow-h2)}
.v22--article .art-col>.art-orn{margin-top:var(--kty-flow-h2)}
.v22--article .art-col>.art-orn+.art-sec{margin-top:var(--kty-s-8)}
.v22--article .principle-grid .principle h3{margin:0}
.v22--article .principle-grid .principle p{margin-top:var(--kty-s-2)}
.v22--article .art-related__grid{margin-top:var(--kty-head-gap)}
.v22--article .art-related__rows{margin-top:var(--kty-head-gap)}
.v22--article .art-related .art-back{margin-top:var(--kty-s-6)}
.v22--article .art-related__grid+.art-related__rows{margin-top:var(--kty-s-7)}
.v22--article .art-card__title+*{margin-top:var(--kty-s-3)}
.v22--article .art-note>*+*{margin-top:var(--kty-s-3)}
.v22--article .art-note .btn{margin-top:var(--kty-s-4)}

/* Related band: sage with the grass pattern; three photo cards a row at most. */
:is(.x10,.v22) .surf.surf--sage.pat-grass{--pat-shape:url(/assets/images/v22/pat-grass.svg);--pat-w:235px;--pat-h:235px}
.v22--article .art-related__grid{display:grid;gap:var(--kty-grid-gap)}
.v22--article .art-related__grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.v22--article .art-related__grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v22--article .art-related__rows .v-row{border-bottom-color:var(--kty-line)}
@media (max-width:640px){
  .v22--article .art-related__grid.cols-2,.v22--article .art-related__grid.cols-3{grid-template-columns:minmax(0,1fr)}
}

/* T015 fix pass: breadcrumb inside the head band, softer head pattern, tables on phones, balanced headings. */
.v22--article .art-hero.surf.surf--sage{--pat-ink:var(--kty-pat-sage-soft)}
.v22--article .art-head .breadcrumb{margin:0;border:0;background:none;font-size:var(--kty-small)}
.v22--article .art-head .breadcrumb ol{margin:0;padding:0;color:var(--kty-mute)}
.v22--article .art-head .breadcrumb a{color:var(--kty-mute)}
.v22--article .art-head .breadcrumb a:hover{color:var(--kty-accent)}
.v22--article .art-head .breadcrumb [aria-current="page"]{color:var(--kty-ink);font-weight:600}
.v22--article .art-head .breadcrumb .sep{color:var(--kty-mute)}
.v22--article .art-head>.breadcrumb+h1{margin-top:var(--kty-s-4)}
.v22--article p{text-wrap:pretty}
@media (max-width:640px){
  .v22--article .data-table{min-width:0}
  .v22--article table.data-table :is(th,td){padding:var(--kty-s-2) var(--kty-s-3)}
}

/* ---- 8. Plant hubs (T019). Comp: docs/design/v22/comps/hub-vegetables.png ----
   White head band (breadcrumb, H1, one line, two buttons, the cover photo shown whole), then one idea per band, each a heading above ONE visual:
   link rows on sage, three plant cards on white, the at-a-glance table on a white card on forest, one guide card, a hairline accordion on sun,
   related hubs as text links with the closed "About this list" row. No side panel anywhere. Rules: no important flags, no position selectors. */
.v22--hub .btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kty-s-9);padding:0 var(--kty-s-6);border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;line-height:1.2;text-transform:none;letter-spacing:0;text-decoration:none}
.v22--hub .btn:hover{border-color:var(--kty-bg-leaf);background:var(--kty-bg-leaf);color:var(--kty-ink-on-dark);text-decoration:none}
.v22--hub .btn.btn--ghost{background:var(--kty-paper);color:var(--kty-bg-dark)}
.v22--hub .btn.btn--ghost:hover{background:var(--kty-bg-tint);border-color:var(--kty-bg-dark);color:var(--kty-bg-dark)}
.v22--hub .btn:focus-visible,.v22--hub a:focus-visible,.v22--hub summary:focus-visible,.v22--hub .v-toggle:focus-visible{outline:3px solid var(--kty-accent);outline-offset:2px}

/* Head band: heroes are exempt from the band padding, so the head carries its own: a small top, and at least the band token below the cover photo (plus the seam height when a seam follows). */
.v22--hub .v-head.surf{padding-block-start:var(--kty-s-4);padding-block-end:var(--kty-band-y)}
.v22--hub .v-head.surf.seam{padding-block-end:calc(var(--kty-band-y) + var(--seam-h))}
@media (min-width:641px){.v22--hub .v-head.surf{padding-block-start:var(--kty-s-6)}}
.v22--hub .v-head__in{max-width:var(--kty-w-brand)}
.v22--hub .v-head__in>*{margin-block:0}
.v22--hub .v-head__in>*+*{margin-top:var(--kty-s-4)}
.v22--hub .v-head__in>.breadcrumb+h1{margin-top:var(--kty-s-3)}
.v22--hub .v-head__in>.v-acts{margin-top:var(--kty-s-6)}
.v22--hub .plant-directory-hero__title{max-width:none}
.v22--hub .plant-directory-hero .lead{max-width:var(--kty-w-read);color:var(--kty-ink-2)}
.v22--hub .v-acts{display:flex;flex-wrap:wrap;gap:var(--kty-s-4)}
.v22--hub .v-head__in .breadcrumb{margin:0;border:0;background:none;font-size:var(--kty-small)}
.v22--hub .v-head__in .breadcrumb ol{margin:0;padding:0;color:var(--kty-mute)}
.v22--hub .v-head__in .breadcrumb a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-mute)}
.v22--hub .v-head__in .breadcrumb a:hover{color:var(--kty-accent)}
.v22--hub .v-head__in .breadcrumb [aria-current="page"]{color:var(--kty-ink);font-weight:600}
.v22--hub .v-head__in .breadcrumb .sep{color:var(--kty-mute)}
/* Cover photo: full content width at its own ratio, never cropped by CSS. */
.v22--hub .v-cover{margin:var(--kty-s-8) 0 0}
.v22--hub .v-cover .card-media{display:block;aspect-ratio:auto;border:0;border-radius:var(--kty-radius);background:none;overflow:hidden}
.v22--hub .v-cover .card-media img{display:block;width:100%;height:auto;object-fit:fill;border-radius:var(--kty-radius)}

/* Band headings: the heading sits above its one visual with the head gap; the match count under Browse is a quiet line. */
.v22--hub .v-band:not(.x-hero)>.v-wrap>h2+*{margin-top:var(--kty-head-gap)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>h2+.v-count{margin-top:var(--kty-s-3)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-count+*{margin-top:var(--kty-head-gap)}
/* Intro line under a band heading: plain sentence-case muted body text, never a small label (no uppercase, no letter-spacing) */
.v22--hub .v-count{max-width:var(--kty-w-read);font-size:var(--kty-body);line-height:var(--kty-body-lh);color:var(--kty-mute)}

/* Link rows on a band: hairlines between the rows, darker than the page hairline so they read on sage. */
.v22--hub .v-rows{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .surf--sage .v-rows{border-top-color:var(--kty-mute)}
.v22--hub .surf--sage .v-row{border-bottom-color:var(--kty-mute)}

/* Plant cards (featured row and browse grid): photo flush on top, name, scientific name, light and water meters, one quiet zone line. */
.v22--hub .v-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap)}
.v22--hub .v-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.v22--hub .v-grid>.v-row{grid-column:1/-1}
@media (max-width:1023px){.v22--hub .v-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
.v22--hub .v-grid.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1023px){.v22--hub .v-grid.cols-5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.v22--hub .v-grid,.v22--hub .v-grid.cols-2,.v22--hub .v-grid.cols-3{grid-template-columns:minmax(0,1fr)}}
.v22--hub .v-pcard{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink)}
.v22--hub .v-pcard:hover,.v22--hub .v-pcard:focus-within{border-color:var(--kty-line-strong);box-shadow:var(--kty-shadow-card)}
.v22--hub .v-pcard__media .card-media{aspect-ratio:var(--kty-ratio-card);border:0;border-radius:0;background:var(--kty-bg-tint)}
.v22--hub .v-pcard__media .card-media img{border-radius:0}
.v22--hub .v-pcard__body{display:flex;flex:1;flex-direction:column;gap:var(--kty-s-3);padding:var(--kty-card-pad)}
.v22--hub .v-pcard__title{font-size:var(--kty-lead);line-height:1.25}
.v22--hub .v-pcard__title{margin-bottom:calc(var(--kty-s-2) * -1)}
.v22--hub .v-pcard__title a{display:flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-ink);text-decoration:none}
.v22--hub .v-pcard__title a::after{content:"";position:absolute;inset:0}
.v22--hub .v-pcard__title a:hover{text-decoration:underline}
.v22--hub .v-pcard__sci{font-size:var(--kty-small);font-style:italic;color:var(--kty-mute)}
.v22--hub .v-meters{display:grid;gap:var(--kty-s-2);margin:0;padding:0;list-style:none}
.v22--hub .v-meter{display:grid;grid-template-columns:var(--kty-s-5) calc(var(--kty-s-11) + var(--kty-s-4)) minmax(0,1fr);align-items:center;gap:var(--kty-s-3);margin:0}
.v22--hub .v-meter>i{font-size:1.25rem;color:#B8780A}
.v22--hub .v-meter>i.ph-drop{color:#2F6F95}
.v22--hub .v-meter__bar{display:flex;gap:var(--kty-s-1)}
.v22--hub .v-meter__step{flex:1;height:var(--kty-s-2);border-radius:2px;background:var(--kty-hair)}
.v22--hub .v-meter__step.is-on{background:var(--kty-bg-leaf)}
.v22--hub .v-meter__t{font-size:var(--kty-small);color:var(--kty-ink-2)}
.v22--hub .v-pcard__quiet{margin-top:auto;padding-top:var(--kty-s-3);border-top:var(--kty-rule) solid var(--kty-hair);font-size:var(--kty-small);color:var(--kty-mute)}
/* Quiet line under the featured row: the stats and the link to the full list. Resets the older sidebar-stat panel look. */
.v22--hub .database-stats.v-note{display:block;padding:0;border:0;background:none;font-size:var(--kty-small);color:var(--kty-mute);overflow:visible}
.v22--hub .v-note .hub-explore{display:inline;padding:0;border:0;background:none;overflow:visible}
.v22--hub .v-note .hub-explore>a{display:inline-flex;align-items:center;gap:var(--kty-s-1);min-height:var(--kty-s-9);padding:0;border:0;background:none;color:var(--kty-accent);font-size:var(--kty-small);font-weight:600}
.v22--hub .v-note .hub-explore>a:hover{background:none;text-decoration:underline}

/* Browse: the search and filter card, the grid, the page links. The disclosure stays open on desktop and folds on phones (app.js). */
.v22--hub .hub-filter-disclosure{border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--hub .hub-filter-disclosure>summary{min-height:var(--kty-s-9);padding:var(--kty-s-3) var(--kty-card-pad);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;letter-spacing:0;text-transform:none;color:var(--kty-ink);cursor:pointer}
.v22--hub .hub-filter-bar{gap:var(--kty-s-4);padding:var(--kty-card-pad)}
@media (min-width:901px){.v22--hub .hub-filter-bar{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) auto}}
.v22--hub .hub-filter-bar__field{gap:var(--kty-s-2)}
.v22--hub .hub-filter-bar__field>span{font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:600;letter-spacing:0;text-transform:none;color:var(--kty-ink-2)}
.v22--hub .hub-filter-bar__field :is(input,select){min-height:var(--kty-s-9);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-radius);background:var(--kty-paper);font-family:var(--kty-font-body);font-size:1rem;color:var(--kty-ink)}
.v22--hub .hub-filter-bar__actions{align-items:center;gap:var(--kty-s-4)}
.v22--hub .hub-filter-bar__actions a{color:var(--kty-accent);font-weight:600;text-decoration:underline}
.v22--hub .hub-filter-note{padding:0 var(--kty-card-pad) var(--kty-card-pad);font-size:var(--kty-small);line-height:1.5;color:var(--kty-mute)}
/* The long helper paragraph under a filter form sits in a small closed disclosure. */
.v22--hub .hub-filter-help{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .hub-filter-help>summary{display:flex;align-items:center;min-height:var(--kty-s-9);padding:0 var(--kty-card-pad);font-size:var(--kty-small);font-weight:600;color:var(--kty-accent);cursor:pointer}
.v22--hub .hub-filter-help>summary:hover{text-decoration:underline}
.v22--hub .hub-filter-help>.hub-filter-note{padding-top:var(--kty-s-2)}
.v22--hub .hub-catalog__note{max-width:var(--kty-w-read);margin:0;font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .hub-active-filters{gap:var(--kty-s-3)}
.v22--hub .hub-active-filters>span{font-size:var(--kty-small);font-weight:600;color:var(--kty-ink-2)}
.v22--hub .hub-active-filter{min-height:var(--kty-s-9);padding:0 var(--kty-s-4);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-radius);background:var(--kty-paper);font-size:var(--kty-small);color:var(--kty-ink)}
.v22--hub .hub-active-filters>a:not(.hub-active-filter){color:var(--kty-accent);font-weight:600;text-decoration:underline}
.v22--hub .hub-pagination{margin-top:var(--kty-s-8);gap:var(--kty-s-2)}
.v22--hub :is(.hub-pagination__page,.hub-pagination__control){min-width:var(--kty-s-9);min-height:var(--kty-s-9);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-radius);background:var(--kty-paper);color:var(--kty-ink);font-size:var(--kty-small)}
.v22--hub .hub-pagination__page.is-current{border-color:var(--kty-bg-dark);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark)}
.v22--hub .v-wrap>.hub-show-more{display:flex;width:fit-content;margin:var(--kty-s-8) auto 0}
.v22--hub .hub-empty-state{border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper)}

/* At a glance: ONE table on a white card (works on any band surface because the card carries its own ink). */
:is(.x10,.v22) .v-glance .v-tablecard{overflow-x:auto;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2);--kty-mute:#5A5047;--kty-line:#DCE5DA;--kty-accent:#9A3F1C}
:is(.x10,.v22) .v-table{width:100%;border-collapse:collapse;font-size:var(--kty-small);line-height:1.5}
:is(.x10,.v22) .v-table :is(th,td){padding:var(--kty-s-4) var(--kty-s-5);border:0;border-top:var(--kty-rule) solid var(--kty-hair);text-align:left;vertical-align:top;color:var(--kty-ink-2)}
:is(.x10,.v22) .v-table thead th{padding-block:var(--kty-s-1);border-top:0;background:var(--kty-bg-tint);font-weight:700;color:var(--kty-ink)}
:is(.x10,.v22) .v-table thead button{white-space:nowrap;min-height:var(--kty-s-9);font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:700;color:var(--kty-ink)}
:is(.x10,.v22) .v-table thead button:focus-visible{outline:3px solid var(--kty-accent);outline-offset:2px}
:is(.x10,.v22) .v-table tr.hub-group th{padding-block:var(--kty-s-3);background:var(--kty-bg-tint);font-weight:700;color:var(--kty-ink)}
:is(.x10,.v22) .v-table .hub-group__n{font-weight:400;color:var(--kty-mute);opacity:1}
:is(.x10,.v22) .v-table td.v-table__name{min-width:15rem}
:is(.x10,.v22) .v-table td[data-label="Updated"]{white-space:nowrap}
:is(.x10,.v22) .v-table__name a{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;line-height:1.25;color:var(--kty-ink);text-decoration:none}
:is(.x10,.v22) .v-table__name a:hover{text-decoration:underline}
:is(.x10,.v22) .v-table__name :is(em,.v-table__tags){display:block;margin-top:var(--kty-s-1);font-size:var(--kty-small);color:var(--kty-mute)}
:is(.x10,.v22) .v-table tr[hidden]{display:none}
:is(.x10,.v22) .v-table .hub-pet{display:inline-flex;align-items:flex-start;gap:var(--kty-s-2);color:var(--kty-ink-2)}
:is(.x10,.v22) .v-table .hub-pet>i{flex:none;margin-top:2px;font-size:1rem}
:is(.x10,.v22) .v-table .hub-pet--documented_toxic{color:#8A2414}
:is(.x10,.v22) .v-table .hub-pet--source_listed_non_toxic{color:#1E5A2B}
:is(.x10,.v22) .v-band.v-glance>.v-wrap>.v-toggle{margin-top:var(--kty-s-4)}
:is(.x10,.v22) .v-toggle{display:inline-flex;align-items:center;min-height:var(--kty-s-9);padding:0;border:0;background:none;color:var(--kty-ink);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;text-decoration:underline;text-underline-offset:.15em;cursor:pointer}
:is(.x10,.v22) .surf--forest .v-toggle{color:var(--kty-ink-on-dark)}
@media (max-width:900px){
  :is(.x10,.v22) .v-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :is(.x10,.v22) .v-table :is(table,tbody,tr,th,td){display:block}
  :is(.x10,.v22) .v-table tr{padding:var(--kty-s-4) var(--kty-s-5);border-top:var(--kty-rule) solid var(--kty-hair)}
  :is(.x10,.v22) .v-table :is(th,td){padding:var(--kty-s-1) 0;border:0}
  :is(.x10,.v22) .v-table tr.hub-group{padding-block:var(--kty-s-3);background:var(--kty-bg-tint)}
  :is(.x10,.v22) .v-table td{display:grid;grid-template-columns:minmax(0,6rem) minmax(0,1fr);gap:var(--kty-s-3)}
  :is(.x10,.v22) .v-table td::before{content:attr(data-label);font-weight:700;color:var(--kty-mute)}
  :is(.x10,.v22) .v-table td.v-table__name{display:block;min-width:0;padding-bottom:var(--kty-s-2)}
  :is(.x10,.v22) .v-table td.v-table__name::before{content:none}
  :is(.x10,.v22) .v-table td:empty{display:none}
  :is(.x10,.v22) .v-table tr[hidden]{display:none}
}

/* Turn a choice into a plan: ONE large guide card, photo on the left half, title, a muted line and the button on the right. */
.v22--hub .v-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--hub .v-feature--text{grid-template-columns:minmax(0,1fr)}
.v22--hub .v-feature__media .card-media{aspect-ratio:var(--kty-ratio-card);border:0;border-radius:0;background:var(--kty-bg-tint)}
.v22--hub .v-feature__media .card-media img{border-radius:0}
.v22--hub .v-feature__body{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:var(--kty-s-4);padding:var(--kty-s-9)}
.v22--hub .v-feature__body>*{margin-block:0}
.v22--hub .v-feature__title a{color:var(--kty-ink);text-decoration:none}
.v22--hub .v-feature__title a:hover{text-decoration:underline}
.v22--hub .v-feature__meta{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-feature__body .btn{margin-top:var(--kty-s-2)}
.v22--hub .v-more a{display:inline-flex;align-items:center;gap:var(--kty-s-2);min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600}
.v22--hub .v-more a:hover{text-decoration:underline}
.v22--hub .v-more i{font-size:.875rem}
@media (max-width:760px){
  .v22--hub .v-feature{grid-template-columns:minmax(0,1fr)}
  .v22--hub .v-feature__body{padding:var(--kty-s-6)}
}

/* Signature band (light groups, season groups or a height chart): headings above the photo circles or bars; all text kept. */
.v22--hub .v-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:var(--kty-grid-gap)}
.v22--hub .v-group>*{margin-block:0}
.v22--hub .v-group>*+*{margin-top:var(--kty-s-2)}
.v22--hub .v-group>ul{margin-top:var(--kty-s-5);padding:0;list-style:none}
.v22--hub .v-group>ul>li+li{margin-top:var(--kty-s-3)}
.v22--hub .v-group__n{font-size:var(--kty-small)}
.v22--hub .v-group li a{display:flex;align-items:center;gap:var(--kty-s-4);min-height:var(--kty-s-11);color:var(--kty-ink);font-weight:600}
.v22--hub .v-group li a:hover{text-decoration:underline}
.v22--hub .v-circle{flex:none;display:block;width:var(--kty-s-11);height:var(--kty-s-11);overflow:hidden;border-radius:50%;background:var(--kty-bg-tint)}
.v22--hub .v-circle .card-media{width:100%;height:100%;aspect-ratio:1;border:0;border-radius:0;background:none}
.v22--hub .v-circle img{border-radius:0}
.v22--hub .v-bars{display:grid;gap:var(--kty-s-4);margin:0;padding:0;list-style:none}
.v22--hub .v-bars li{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr) minmax(0,12rem);align-items:center;gap:var(--kty-s-4);margin:0}
.v22--hub .v-bars a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);font-weight:600;color:var(--kty-ink)}
.v22--hub .v-bars__track{display:block;height:var(--kty-s-3);border-radius:var(--kty-radius);background:var(--kty-bg-white);overflow:hidden}
.v22--hub .v-bars__fill{display:block;height:100%;border-radius:var(--kty-radius);background:var(--kty-bg-dark)}
.v22--hub .v-bars__v{font-size:var(--kty-small)}
.v22--hub .v-src{font-size:var(--kty-small)}
@media (max-width:640px){
  .v22--hub .v-bars li{grid-template-columns:minmax(0,1fr) auto}
  .v22--hub .v-bars__track{grid-column:1/-1;grid-row:2}
}

/* Common questions: hairline accordion between ink rules, a Fraunces question and a thin plus (minus when open); every row closed. */
.v22--hub .v-acc{border-bottom:var(--kty-rule) solid var(--kty-ink)}
.v22--hub .v-acc details{border-top:var(--kty-rule) solid var(--kty-ink)}
.v22--hub .v-acc summary{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);min-height:var(--kty-s-11);padding-block:var(--kty-row-pad);cursor:pointer;list-style:none}
.v22--hub .v-acc summary::-webkit-details-marker{display:none}
.v22--hub .v-acc__q{font-size:var(--kty-lead);font-weight:600;line-height:1.3}
.v22--hub .v-acc summary>i{flex:none;font-size:1.125rem;color:var(--kty-ink)}
.v22--hub .v-acc details[open] summary>i::before{content:"\e32a"}
.v22--hub .v-acc__a{padding-bottom:var(--kty-row-pad)}
.v22--hub .v-acc__a>*{margin-block:0}
.v22--hub .v-acc__a>*+*{margin-top:var(--kty-s-3)}
.v22--hub .v-acc__a a:not(.v-row){text-decoration:underline;text-underline-offset:.15em}

/* Related hubs: a smaller heading, plain rust text links with chevrons, then the closed About row. The About row is also used under the
   at-a-glance table by hubs that do not move it (guide hubs), so it takes its colours from the band. */
.v22--hub .v-related__h{font-size:var(--kty-h3)}
.v22--hub .v-links{display:flex;flex-wrap:wrap;gap:var(--kty-s-2) var(--kty-s-8)}
.v22--hub .v-links a{display:inline-flex;align-items:center;gap:var(--kty-s-2);min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600}
.v22--hub .v-links a:hover{text-decoration:underline}
.v22--hub .v-links h3{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit}
.v22--hub .v-links i{font-size:.875rem}
:is(.x10,.v22) .v-about{border-top:var(--kty-rule) solid var(--kty-line);border-bottom:var(--kty-rule) solid var(--kty-line)}
:is(.x10,.v22) .v-about summary{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);min-height:var(--kty-s-11);padding-block:var(--kty-row-pad);cursor:pointer;list-style:none}
:is(.x10,.v22) .v-about summary::-webkit-details-marker{display:none}
:is(.x10,.v22) .v-about__t{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3}
:is(.x10,.v22) .v-about summary>i{flex:none;font-size:1.125rem}
:is(.x10,.v22) .v-about[open] summary>i::before{content:"\e32a"}
:is(.x10,.v22) .v-about__body{max-width:var(--kty-w-read);padding-bottom:var(--kty-s-6)}
:is(.x10,.v22) .v-about__body>p{margin:0}
:is(.x10,.v22) .v-about__body>p+p{margin-top:var(--kty-s-4)}
:is(.x10,.v22) .v-about__body>.database-stats{display:block;padding:0;border:0;background:none;font-size:var(--kty-small);color:inherit}
:is(.x10,.v22) .v-band>.v-wrap>.v-about{margin-top:var(--kty-s-9)}

/* ---- 9. Guide, compare and problem hubs, purpose pages and collections (T020) ----
   Same hub system as section 8 (root .v22.v22--hub): head band, then one idea per band, each a heading above ONE visual. The shared pieces below are
   link rows on any surface, topic accordions, pair cards (two photos with a "vs" disc on the gap), diagnostic cards, step cards, a notice card. */
.v22--hub .v-head__in .lead{max-width:var(--kty-w-read);color:var(--kty-ink-2)}
.v22--hub .v-head__in .x-updated{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-tip{display:flex;flex-wrap:wrap;align-items:center;column-gap:var(--kty-s-3);max-width:var(--kty-w-read);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-tip a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600;text-decoration:underline;text-underline-offset:.15em}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-tip+*{margin-top:var(--kty-block-gap)}
.v22--hub .v-lead{max-width:var(--kty-w-read)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>h2+.v-lead{margin-top:var(--kty-s-3)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-lead+*{margin-top:var(--kty-head-gap)}

/* Rows on a forest band: light hairlines, the row text takes the band's own light ink. */
.v22--hub .surf--forest .v-rows{border-top-color:var(--kty-line)}
.v22--hub .surf--forest .v-row{border-bottom-color:var(--kty-line)}
.v22--hub .surf--forest .v-row__meta{color:var(--kty-mute)}
.v22--hub .v-row__title a{color:inherit}
.v22--hub .v-rows--2{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--kty-s-9)}
@media (min-width:901px){.v22--hub .v-rows--2{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Topic accordion (guide topics, orientation groups): the same hairline accordion as Common questions, with a short text and link rows inside. */
.v22--hub .v-acc summary>.v-acc__q{flex:1}
.v22--hub .v-acc__n{flex:none;font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-acc__a .v-rows{margin-top:var(--kty-s-4)}
.v22--hub .v-acc__a .v-row{min-height:var(--kty-s-9)}
.v22--hub .v-start{max-width:var(--kty-w-read)}
.v22--hub .v-start>*{margin-block:0}
.v22--hub .v-start>*+*{margin-top:var(--kty-s-3)}
.v22--hub .v-acc+.v-start{margin-top:var(--kty-head-gap)}
.v22--hub .v-start .v-row{min-height:var(--kty-s-9)}
.v22--hub .v-about__t{margin:0}
.v22--hub .v-about__body ul{margin:0;padding-left:var(--kty-s-6)}
.v22--hub .v-about__body li+li{margin-top:var(--kty-s-2)}
.v22--hub .v-about__body li a{color:var(--kty-accent);font-weight:600;text-decoration:underline;text-underline-offset:.15em}
.v22--hub .surf--forest .v-about__body a{color:var(--kty-ink-on-dark)}
.v22--hub .v-band>.v-wrap>.v-links{margin-top:var(--kty-s-6)}

/* Photo cards that carry one more quiet line (the most likely cause on a problem card). */
.v22--hub .v-card__text{display:flex;flex-direction:column;gap:var(--kty-s-2);min-width:0}
.v22--hub .v-card__note{font-size:var(--kty-small);line-height:1.5;color:var(--kty-ink-2)}
.v22--hub .v-card__note b{font-weight:700;color:var(--kty-ink)}
.v22--hub .v-row .v-card__note{display:block}

/* Pair card (compare): two real photos with a "vs" disc in the gap between them, the pair title under them. The disc never touches a photo. */
.v22--hub .v-pair{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink)}
.v22--hub .v-pair:hover{border-color:var(--kty-line-strong);box-shadow:var(--kty-shadow-card);text-decoration:none}
.v22--hub .v-pair__photos{display:grid;grid-template-columns:minmax(0,1fr) var(--kty-s-9) minmax(0,1fr);align-items:center;padding:var(--kty-card-pad) var(--kty-card-pad) 0}
.v22--hub .v-pair__photos--one{grid-template-columns:minmax(0,1fr)}
.v22--hub .v-pair__side{display:block;height:calc(var(--kty-s-13) * 2);overflow:hidden;border-radius:var(--kty-radius);background:var(--kty-bg-tint)}
.v22--hub .v-pair__side img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.v22--hub .v-vs{display:grid;place-items:center;justify-self:center;width:var(--kty-s-8);height:var(--kty-s-8);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:700;line-height:1}
.v22--hub .v-pair__body{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--kty-s-3);padding:var(--kty-card-pad)}
.v22--hub .v-pair__title{font-size:var(--kty-lead);line-height:1.25}
.v22--hub .v-pair__body>i{flex:none;margin-top:var(--kty-s-1);color:var(--kty-accent);font-size:1rem}

/* Step cards (problem triage): an example photo, a title and one line, in a 3-column grid. */
.v22--hub .v-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap)}
@media (max-width:900px){.v22--hub .v-steps{grid-template-columns:minmax(0,1fr)}}
.v22--hub .v-step{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--hub .v-step__media .card-media{aspect-ratio:var(--kty-ratio-card);border:0;border-radius:0;background:var(--kty-bg-tint)}
.v22--hub .v-step__media .card-media img{border-radius:0}
.v22--hub .v-step__body{display:flex;flex-direction:column;gap:var(--kty-s-2);padding:var(--kty-card-pad)}
.v22--hub .v-step__body>*{margin-block:0}

/* A plain notice: one hairline card, no side bar, no icon tile. */
.v22--hub .v-notice{padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);color:var(--kty-ink-2)}
.v22--hub .v-notice>*{margin-block:0}
.v22--hub .v-notice>*+*{margin-top:var(--kty-s-2)}
.v22--hub .v-notice strong{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-steps+.v-notice,.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-notice+.v-about{margin-top:var(--kty-s-8)}

/* Table on a hub that is not a plant hub: the first cell is a row header. */
:is(.x10,.v22) .v-table tbody th.v-table__name{min-width:15rem;text-align:left}
.v22--hub .v-table tbody th.v-table__name a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;color:var(--kty-ink)}
.v22--hub .v-glance>.v-wrap>.v-src{margin-top:var(--kty-s-4);color:var(--kty-mute)}
.v22--hub .surf--forest .v-glance>.v-wrap>.v-src,.v22--hub .v-glance.surf--forest>.v-wrap>.v-src{color:var(--kty-mute)}
:is(.x10,.v22) .v-band.v-glance>.v-wrap>.v-about{margin-top:var(--kty-s-8)}

@media (min-width:901px){.v22--hub .hub-filter-bar--wide{grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr)) auto}}

/* Purpose pages reuse the article frame (section 7). Their extras: the recommended-plants count line and the sibling label, which is a plain paragraph on pages without an FAQ. */
.v22--article .art-sec__count{margin-top:var(--kty-s-2);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--article .art-sec>.art-sec__count+*{margin-top:var(--kty-s-5)}
.v22--article p.art-related__h{font-family:var(--kty-font-display);font-size:var(--kty-h2);font-weight:700;line-height:1.15;letter-spacing:-.015em;color:var(--kty-ink);text-wrap:balance}
.v22--article .art-plant-rows{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .purpose-image-card-grid{margin-top:var(--kty-s-6)}
.v22--article .purpose-image-card-grid:not(.plant-profile-card-grid){grid-template-columns:minmax(0,1fr)}

/* Hub bits (T020): plain rows that are not links (the step and decision rows), the label above the related topics, the segment decision band. */
.v22--hub .v-row--plain{border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-row--plain:hover .v-row__title{text-decoration:none}
.v22--hub .surf--sage .v-row--plain{border-bottom-color:var(--kty-mute)}
.v22--hub .v-links__h{font-family:var(--kty-font-body);font-size:inherit;font-weight:400;line-height:inherit;color:var(--kty-mute)}
.v22--hub .segment-decision-path .v-row{align-items:flex-start;padding-block:var(--kty-s-5)}
.v22--hub span.v-acc__q{font-family:var(--kty-font-display);color:var(--kty-ink)}

/* One quiet fact under the head buttons (the segment's guide count): label, then the number. */
.v22--hub .v-facts{display:flex;flex-wrap:wrap;gap:var(--kty-s-1) var(--kty-s-6);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-facts>div{display:flex;gap:var(--kty-s-2)}
.v22--hub .v-facts dd{margin:0;font-weight:600;color:var(--kty-ink-2)}

/* Article blocks ky_versus and ky_emergency (moved from style.css; specificity raised only where a generic article rule competes) */
.ky-versus{margin:var(--flow-figure,2rem) 0;border:var(--kty-border) solid var(--kty-line-strong);border-radius:var(--kty-r-lg);background:var(--kty-surface-card);box-shadow:var(--kty-shadow-card);overflow:hidden}
.ky-versus__title{margin:0;padding:var(--sp-3) var(--sp-4);background:var(--kty-bg-dark);color:#fff;font-family:var(--kty-font-display);font-size:1.15rem;font-weight:600}
.ky-versus__g{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:stretch;background:linear-gradient(var(--kty-line-strong),var(--kty-line-strong)) center/1px 100% no-repeat,linear-gradient(90deg,var(--kty-bg-tint) 50%,var(--kty-bg-white) 50%)}
.ky-versus .ky-versus__col{padding:var(--sp-4) var(--sp-4) var(--sp-5);background:none}
.ky-versus .ky-versus__name{display:flex;align-items:center;gap:var(--sp-2);margin:0 0 var(--sp-3);padding-bottom:var(--sp-2);border-bottom:3px solid #F2B544;font-family:var(--kty-font-display);font-size:1.15rem}
.ky-versus__col--a .ky-versus__name::before,.ky-versus__col--b .ky-versus__name::before{content:"A";display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--kty-bg-dark);color:#fff;font:700 .75rem var(--kty-font-body)}
.ky-versus__col--b .ky-versus__name::before{content:"B"}
.ky-versus .ky-versus__col ul{margin:0;padding-left:0;list-style:none}
.ky-versus__col li{position:relative;margin:0 0 var(--sp-2);padding-left:1.4rem;line-height:1.5;color:var(--kty-ink-2)}
.ky-versus__col li::before{content:"";position:absolute;left:.2rem;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--kty-accent)}
.ky-versus__col p{color:var(--kty-ink-2)}
.ky-versus .ky-versus__vs{align-self:center;justify-self:center;display:grid;place-items:center;width:44px;height:44px;margin:0;position:relative;z-index:1;border-radius:50%;background:#F2B544;color:var(--kty-bg-dark);font-weight:700;font-size:.875rem;text-transform:uppercase;box-shadow:0 0 0 4px var(--kty-surface-card)}
.ky-versus .ky-versus__verdict{margin:0;padding:var(--sp-3) var(--sp-4);border-top:var(--kty-border) solid var(--kty-line);background:#FFF4D9;color:var(--kty-ink)}
@media (max-width:640px){
.ky-versus .ky-versus__g{grid-template-columns:1fr;background:none}
.ky-versus .ky-versus__col{padding:var(--sp-3) var(--sp-4)}
.ky-versus .ky-versus__col--a{background:var(--kty-bg-tint)}
.ky-versus .ky-versus__col--b{background:var(--kty-bg-white)}
.ky-versus .ky-versus__vs{width:100%;height:44px;border-radius:0;box-shadow:none;font-size:0;background:linear-gradient(var(--kty-bg-tint) 50%,var(--kty-bg-white) 50%)}
.ky-versus__vs::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--kty-line-strong)}
.ky-versus__vs::after{content:"vs";position:relative;display:grid;place-items:center;width:44px;height:44px;margin:0 auto;border-radius:50%;background:#F2B544;color:var(--kty-bg-dark);font:700 .875rem var(--kty-font-body);text-transform:uppercase}
}
.ky-emergency{margin:var(--flow-figure,2rem) 0;padding:var(--sp-4);border-radius:var(--kty-r-md);background:#7A1E10;color:#fff;border-left:6px solid #F2B544}
.ky-emergency__title{display:flex;gap:var(--sp-2);align-items:center;font-family:var(--kty-font-display);font-size:1.2rem;font-weight:700;color:#fff}
.ky-emergency p{color:#fff}.ky-emergency a:not(.ky-emergency__call){color:#fff;text-decoration:underline}
.ky-emergency__call{display:inline-flex;align-items:center;gap:var(--sp-2);min-height:48px;padding:0 var(--sp-4);margin-top:var(--sp-2);border-radius:var(--kty-r-pill);background:#fff;color:#7A1E10;font-weight:700;text-decoration:none}
.ky-emergency__call:focus-visible{outline:3px solid #F2B544;outline-offset:2px}
.ky-emergency p.ky-emergency__note{color:#F6E3DF;margin-top:var(--sp-3)}

/* ---- 10. Brand, trust, team and legal pages (T021). Comp: tmp/design-v22/comps/about.png ----
   Centred masthead band (breadcrumb, H1, one line; about adds ONE cartoon strip at 12:5), then one idea per band, each a heading above ONE visual built from the
   page's own statements: step strip, two stacked groups, limit rows, author card, link rows, source ladder. The full statement of about, methodology and
   editorial policy sits in one closed disclosure. Legal pages stay calm: tint masthead, one white band, a 760 column, no pattern behind prose.
   Rules: no important flags, no position selectors; spacing only from the --kty-s-* scale. */
.v22--brand .btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kty-s-9);padding:0 var(--kty-s-6);border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;line-height:1.2;text-decoration:none}
.v22--brand .btn:hover{border-color:var(--kty-bg-leaf);background:var(--kty-bg-leaf);color:var(--kty-ink-on-dark);text-decoration:none}
.v22--brand .btn.btn--ghost{background:var(--kty-paper);color:var(--kty-bg-dark)}
.v22--brand .btn.btn--ghost:hover{background:var(--kty-bg-tint);border-color:var(--kty-bg-dark);color:var(--kty-bg-dark)}
.v22--brand a:focus-visible,.v22--brand summary:focus-visible{outline:3px solid var(--kty-accent);outline-offset:2px}

/* Masthead: centred, the heading gap and a generous bottom (band token plus the seam). */
.v22--brand .b-head.surf{padding-block-start:var(--kty-s-4);padding-block-end:var(--kty-band-y)}
.v22--brand .b-head.surf.seam{padding-block-end:calc(var(--kty-band-y) + var(--seam-h))}
@media (min-width:641px){.v22--brand .b-head.surf{padding-block-start:var(--kty-s-6)}}
.v22--brand .b-head__in{display:flex;flex-direction:column;align-items:center;text-align:center}
.v22--brand .b-head__in>*{margin-block:0}
.v22--brand .b-head__in>*+*{margin-top:var(--kty-s-5)}
.v22--brand .b-head__in>.breadcrumb+*{margin-top:var(--kty-s-3)}
.v22--brand .b-head__in .lead{max-width:var(--kty-w-read);color:var(--kty-ink-2)}
.v22--brand .b-head__in .breadcrumb{margin:0;border:0;background:none;font-size:var(--kty-small)}
.v22--brand .b-head__in .breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;margin:0;padding:0;list-style:none;color:var(--kty-mute)}
.v22--brand .b-head__in .breadcrumb a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-mute)}
.v22--brand .b-head__in .breadcrumb a:hover{color:var(--kty-accent)}
.v22--brand .b-head__in .breadcrumb [aria-current="page"]{color:var(--kty-ink);font-weight:600}
.v22--brand .b-head__in .breadcrumb .sep{color:var(--kty-mute)}
.v22--brand .b-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--kty-s-1) var(--kty-s-6);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--brand .b-meta>div{display:flex;gap:var(--kty-s-2)}
.v22--brand .b-meta dd{margin:0;font-weight:600;color:var(--kty-ink-2)}
.v22--brand .b-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--kty-s-4)}
.v22--brand .b-head__in>.b-acts{margin-top:var(--kty-s-6)}
.v22--brand .b-avatar{display:block;width:var(--kty-s-13);height:var(--kty-s-13);border-radius:50%;object-fit:cover}
/* The one illustration strip (about only): the brand card art shown at 12:5, 900 wide, no caption. */
.v22--brand .b-strip{width:100%;max-width:var(--kty-w-brand)}
.v22--brand .b-head__in>.b-strip{margin-top:var(--kty-s-8)}
.v22--brand .b-strip img{display:block;width:100%;height:auto;border-radius:var(--kty-radius)}

/* Bands: a centred heading above its one visual; prose bands (b-read) keep a left heading on the 760 column. */
.v22--brand .b-band>.v-wrap>h2{text-align:center}
.v22--brand .b-band.b-read>.v-wrap>h2{text-align:left}
.v22--brand .b-band:not(.x-hero)>.v-wrap>h2+*{margin-top:var(--kty-head-gap)}
.v22--brand .b-band.b-read:not(.x-hero)>.v-wrap>h2+*{margin-top:var(--kty-s-5)}
.v22--brand .b-band.b-read:not(.x-hero)>.v-wrap>*+*{margin-top:var(--kty-s-5)}
.v22--brand .b-band:not(.x-hero)>.v-wrap>.brand-summary+*{margin-top:var(--kty-block-gap)}
.v22--brand .b-band>.v-wrap>.brand-summary{max-width:var(--kty-w-read);margin-inline:auto;text-align:center}
.v22--brand .b-band.b-read:not(.x-hero)>.v-wrap>:is(.brand-key-points,.brand-definition-grid,.brand-route-grid,.brand-contrast,.brand-process,.brand-checklist,.table-wrap,.brand-disclosure-panel,.b-toc,.brand-contact-path__action){margin-top:var(--kty-s-6)}
.v22--brand .b-band:not(.x-hero)>.v-wrap>.b-full{margin-top:var(--kty-s-8)}
.v22--brand .b-lede,.v22--brand .b-after{max-width:var(--kty-w-read);margin-inline:auto;text-align:center}
.v22--brand .b-lede{font-size:var(--kty-lead);line-height:1.5}
.v22--brand :is(.b-lede,.b-after,.b-prose,.b-card,.b-author,.b-read) a:not(.btn,.brand-contact-path__action,.v-row){color:var(--kty-accent);text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.15em}
.v22--brand .surf--forest :is(.b-lede,.b-after,.b-read) a:not(.btn){color:var(--kty-ink-on-dark)}

/* Step strip: numbered circles on one forest line, a Fraunces label under each. Stacks with a vertical line under 641px. */
.v22--brand .b-steps{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--kty-s-6);margin:0;padding:0;list-style:none;counter-reset:b-step}
.v22--brand .b-steps::before{content:"";position:absolute;top:calc(var(--kty-s-8) / 2 - 1px);left:12.5%;right:12.5%;height:2px;background:var(--kty-bg-dark)}
.v22--brand .b-steps>li{display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-3);margin:0;text-align:center;counter-increment:b-step}
.v22--brand .b-steps>li::before{content:counter(b-step);position:relative;z-index:1;display:grid;place-items:center;width:var(--kty-s-8);height:var(--kty-s-8);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-weight:700;line-height:1}
.v22--brand .b-steps h3{font-size:var(--kty-lead);line-height:1.25;text-wrap:balance}
.v22--brand .b-steps__t>*{margin-block:0}
.v22--brand .b-steps__t>*+*{margin-top:var(--kty-s-2)}
.v22--brand .surf--forest .b-steps::before{background:var(--kty-bg-sun)}
.v22--brand .surf--forest .b-steps>li::before{background:var(--kty-bg-sun);color:var(--kty-ink)}
@media (max-width:640px){
  .v22--brand .b-steps{grid-auto-flow:row;grid-auto-columns:minmax(0,1fr);gap:var(--kty-s-5)}
  .v22--brand .b-steps::before{top:var(--kty-s-4);bottom:var(--kty-s-4);left:calc(var(--kty-s-8) / 2 - 1px);right:auto;width:2px;height:auto}
  .v22--brand .b-steps>li{flex-direction:row;align-items:center;gap:var(--kty-s-4);text-align:left}
}

/* Groups on one white card, hairline between (evidence, who decides, the byline facts). */
.v22--brand .b-card{max-width:var(--kty-w-read);margin-inline:auto;padding-inline:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .b-card__g{padding-block:var(--kty-card-pad)}
.v22--brand .b-card__g+.b-card__g{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .b-card__g>*{margin-block:0}
.v22--brand .b-card__g>*+*{margin-top:var(--kty-s-2)}
.v22--brand .b-card :is(h3,dt){font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.25;color:var(--kty-ink)}
.v22--brand .b-card p{color:var(--kty-ink-2)}
.v22--brand .b-facts{margin:0}
.v22--brand .b-facts dd{margin:0;color:var(--kty-ink-2)}

/* Limit rows on forest: a sun circle with a dark mark, light hairlines. */
.v22--brand .b-limits{max-width:var(--kty-w-read);margin-inline:auto;padding:0;list-style:none;border-bottom:var(--kty-rule) solid var(--kty-line)}
.v22--brand .b-limits>li{display:flex;align-items:center;gap:var(--kty-s-4);margin:0;padding-block:var(--kty-row-pad);border-top:var(--kty-rule) solid var(--kty-line)}
.v22--brand .b-limits__i{flex:none;display:grid;place-items:center;width:var(--kty-s-7);height:var(--kty-s-7);border-radius:50%;background:var(--kty-bg-sun);color:var(--kty-ink)}
.v22--brand .b-limits__i i{font-size:1.125rem}

/* Author card: a round notebook mark, the pen name, the sources line, the contact line. */
.v22--brand .b-author{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--kty-s-5);align-items:start;max-width:var(--kty-w-read);margin-inline:auto;padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .b-author__mark{display:grid;place-items:center;width:var(--kty-s-12);height:var(--kty-s-12);border-radius:50%;background:var(--kty-bg-sage);color:var(--kty-bg-dark);font-size:2.25rem}
.v22--brand .b-author__text>*{margin-block:0}
.v22--brand .b-author__text>*+*{margin-top:var(--kty-s-2)}
.v22--brand .b-author__name{font-size:var(--kty-lead);color:var(--kty-ink)}
.v22--brand .b-author__name strong{font-family:var(--kty-font-display);font-weight:600}
@media (max-width:640px){.v22--brand .b-author{grid-template-columns:minmax(0,1fr)}.v22--brand .b-author__mark{width:var(--kty-s-11);height:var(--kty-s-11);font-size:1.75rem}}

/* Link rows on a band: two columns from 901px, a hairline over every row and under the list. */
.v22--brand .b-rows{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--kty-s-9);border-bottom:var(--kty-rule) solid var(--kty-mute)}
.v22--brand .b-rows>.v-row{border-top:var(--kty-rule) solid var(--kty-mute);border-bottom:0}
@media (min-width:901px){.v22--brand .b-rows{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Source ladder (methodology): name left, what it is best used for right, hairline rows. */
.v22--brand .b-ladder{border-bottom:var(--kty-rule) solid var(--kty-mute)}
.v22--brand .b-ladder__row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--kty-s-2) var(--kty-s-6);padding-block:var(--kty-row-pad);border-top:var(--kty-rule) solid var(--kty-mute)}
.v22--brand .b-ladder__row>*{margin-block:0}
.v22--brand .b-ladder h3{font-size:var(--kty-lead);line-height:1.3}
@media (max-width:640px){.v22--brand .b-ladder__row{grid-template-columns:minmax(0,1fr)}}

/* Pairs (page checks, review labels): a two-column grid of hairline cards, or text on a hairline on forest. */
.v22--brand .b-pairs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-grid-gap)}
.v22--brand .b-pairs__item{padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .b-pairs__item>*{margin-block:0}
.v22--brand .b-pairs__item>*+*{margin-top:var(--kty-s-2)}
.v22--brand .b-pairs h3{font-size:var(--kty-lead);line-height:1.25;color:var(--kty-ink)}
.v22--brand .b-pairs p{color:var(--kty-ink-2)}
.v22--brand .surf--forest .b-pairs__item{padding:var(--kty-s-5) 0 0;border:0;border-top:var(--kty-rule) solid var(--kty-line);border-radius:0;background:none;box-shadow:none}
@media (max-width:640px){.v22--brand .b-pairs{grid-template-columns:minmax(0,1fr)}}

/* The one closed disclosure: a hairline row with a Fraunces title and a thin plus; open, the unchanged statement sits on a white card. */
.v22--brand .b-full{border-top:var(--kty-rule) solid var(--kty-mute);border-bottom:var(--kty-rule) solid var(--kty-mute)}
.v22--brand .b-full>summary,.v22--brand .b-toc>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);min-height:var(--kty-s-11);padding-block:var(--kty-row-pad);cursor:pointer;list-style:none}
.v22--brand .b-full>summary::-webkit-details-marker,.v22--brand .b-toc>summary::-webkit-details-marker{display:none}
.v22--brand .b-full__t{font-size:var(--kty-lead);line-height:1.3}
.v22--brand .b-full>summary>i,.v22--brand .b-toc>summary>i{flex:none;font-size:1.125rem;color:var(--kty-ink)}
.v22--brand .b-full[open]>summary>i::before,.v22--brand .b-toc[open]>summary>i::before{content:"\e32a"}
.v22--brand .b-full__body{margin-block:var(--kty-s-2) var(--kty-s-7);padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);color:var(--kty-ink-2)}
@media (min-width:641px){.v22--brand .b-full__body{padding:var(--kty-s-8) max(var(--kty-s-8),calc((100% - var(--kty-w-read)) / 2))}}
/* Contents list: a closed white card; every section link is kept. */
.v22--brand .b-toc{border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink)}
.v22--brand .b-toc>summary{padding-inline:var(--kty-card-pad)}
.v22--brand .b-toc__t{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3;color:var(--kty-ink)}
.v22--brand .b-toc>ol{margin:0;padding:0 var(--kty-card-pad) var(--kty-s-3);list-style:none}
.v22--brand .b-toc>ol>li{margin:0;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .b-toc>ol a{display:flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-ink);text-decoration:none}
.v22--brand .b-toc>ol a:hover{color:var(--kty-accent);text-decoration:underline}

/* Long text (the full statements and the legal pages): one flow, generous gaps, label-sized section headings. */
.v22--brand .b-prose{font-size:var(--kty-body);line-height:var(--kty-body-lh);color:var(--kty-ink-2);overflow-wrap:break-word}
.v22--brand .b-prose>*{margin-block:0}
.v22--brand .b-prose>*+*{margin-top:var(--kty-s-6)}
.v22--brand .b-prose>.brand-section+.brand-section,.v22--brand .b-prose>.brand-section+.brand-disclosure-panel{margin-top:var(--kty-flow-h2)}
.v22--brand .b-prose .brand-section{scroll-margin-top:calc(var(--nav-h) + var(--kty-s-4))}
.v22--brand .b-prose .brand-section>*{margin-block:0}
.v22--brand .b-prose .brand-section>*+*{margin-top:var(--kty-s-4)}
.v22--brand .b-prose .brand-section>h2+*{margin-top:var(--kty-s-5)}
.v22--brand .b-prose .brand-section>:is(.brand-key-points,.brand-definition-grid,.brand-route-grid,.brand-contrast,.brand-process,.brand-checklist,.table-wrap,.brand-disclosure-panel){margin-top:var(--kty-s-6)}
.v22--brand .b-prose h2{font-size:var(--kty-h3);line-height:1.25;letter-spacing:0;color:var(--kty-ink)}
.v22--brand .b-prose h3{font-size:var(--kty-lead);line-height:1.3;color:var(--kty-ink)}
.v22--brand .b-prose strong{font-weight:700;color:var(--kty-ink)}
.v22--brand .b-prose ul:not(.brand-checklist){padding-left:var(--kty-s-6)}
.v22--brand .b-prose li+li{margin-top:var(--kty-s-2)}
.v22--brand .brand-summary{font-size:var(--kty-lead);line-height:1.5;color:var(--kty-ink)}
.v22--brand .brand-summary>*{margin:0}
.v22--brand .brand-summary strong{font-weight:700}

/* Blocks inside the statements and on the contact page: two-column hairline cards, numbered steps, check lists, two groups, a table card, a plain notice. */
.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-grid-gap);margin:0}
.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid)>*{display:block;min-width:0;padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .brand-route-grid>a:hover{border-color:var(--kty-line-strong);box-shadow:var(--kty-shadow-card);text-decoration:none}
.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid)>*>*{margin-block:0}
.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid)>*>*+*{margin-top:var(--kty-s-2)}
.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid) h3{font-size:var(--kty-lead);line-height:1.25;color:var(--kty-ink)}
.v22--brand :is(.brand-key-points,.brand-route-grid) i{display:block;color:var(--kty-bg-leaf);font-size:1.5rem}
.v22--brand .brand-key-points>*>.brand-contact-path__action{margin-top:var(--kty-s-4)}
@media (max-width:640px){.v22--brand :is(.brand-key-points,.brand-definition-grid,.brand-route-grid){grid-template-columns:minmax(0,1fr)}}
.v22--brand .brand-process{margin:0;padding:0;list-style:none;border-bottom:var(--kty-rule) solid var(--kty-hair);counter-reset:b-proc}
.v22--brand .brand-process>li{position:relative;margin:0;padding:var(--kty-s-4) 0 var(--kty-s-4) calc(var(--kty-s-7) + var(--kty-s-4));border-top:var(--kty-rule) solid var(--kty-hair);counter-increment:b-proc}
.v22--brand .brand-process>li::before{content:counter(b-proc);position:absolute;left:0;top:var(--kty-s-4);display:grid;place-items:center;width:var(--kty-s-7);height:var(--kty-s-7);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-size:var(--kty-small);font-weight:700;line-height:1}
.v22--brand .brand-process li+li{margin-top:0}
.v22--brand .brand-checklist{margin:0;padding:0;list-style:none;border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .brand-checklist>li{position:relative;margin:0;padding:var(--kty-s-3) 0 var(--kty-s-3) calc(var(--kty-s-6) + var(--kty-s-3));border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .brand-checklist>li::before{content:"\e182";position:absolute;left:0;top:var(--kty-s-3);display:grid;place-items:center;width:var(--kty-s-6);height:var(--kty-s-6);border-radius:50%;background:var(--kty-bg-leaf);color:#fff;font-family:"Phosphor";font-size:.875rem;font-weight:400;line-height:1}
.v22--brand .brand-checklist li+li{margin-top:0}
.v22--brand .brand-contrast{display:grid;grid-template-columns:minmax(0,1fr);margin:0;padding-inline:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .brand-contrast>*{padding-block:var(--kty-card-pad)}
.v22--brand .brand-contrast>*+*{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .brand-contrast>*>*{margin-block:0}
.v22--brand .brand-contrast>*>*+*{margin-top:var(--kty-s-2)}
.v22--brand .brand-contrast h3{font-size:var(--kty-lead);color:var(--kty-ink)}
.v22--brand .table-wrap{overflow-x:auto;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .brand-evidence-table{width:100%;margin:0;border-collapse:collapse;font-size:var(--kty-small);line-height:1.5}
.v22--brand .brand-evidence-table :is(th,td){padding:var(--kty-s-3) var(--kty-s-4);text-align:left;vertical-align:top}
.v22--brand .brand-evidence-table tbody :is(th,td){border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--brand .brand-evidence-table thead th{background:var(--kty-bg-tint);font-weight:700;color:var(--kty-ink)}
.v22--brand .brand-disclosure-panel{padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--brand .brand-disclosure-panel strong{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--brand .brand-contact-path__action{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kty-s-9);padding:0 var(--kty-s-5);border:var(--kty-rule) solid var(--kty-bg-dark);border-radius:var(--kty-radius);background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-weight:600;text-decoration:none}
.v22--brand .brand-contact-path__action:hover{border-color:var(--kty-bg-leaf);background:var(--kty-bg-leaf);color:var(--kty-ink-on-dark);text-decoration:none}

/* ---- 11. Tools, calendar, zone, safety, search, 404 and sitemap pages (T023). Roots .v22.v22--hub plus a page modifier (--tools, --zones, --safety, --search, --notfound, --sitemap) ----
   Same hub system as sections 8 and 9: head band, then one idea per band, a heading above ONE visual. The calculator is one white card with its result inside it
   and a three-step strip under it (comp: tmp/design-v22/comps/tool.png). Rules: no important flags, no position selectors, spacing only from the --kty-s-* scale. */
.v22--hub .v-link{display:inline-flex;align-items:center;gap:var(--kty-s-2);min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600;text-decoration:underline;text-underline-offset:.15em}
.v22--hub .v-link i{font-size:.875rem}
.v22--hub .v-fine{max-width:var(--kty-w-read);font-size:var(--kty-small);line-height:1.5;color:var(--kty-mute)}
.v22--hub :is(.v-fine,.v-prose,.v-bullets,.v-sitelist,.v-numbered) a,.v22--hub .v-head__in>p a{color:var(--kty-accent);text-decoration:underline;text-underline-offset:.15em}
.v22--hub .v-head__in>p a{font-weight:600}
.v22--hub .v-prose{max-width:var(--kty-w-read)}
.v22--hub .v-prose>*{margin-block:0}
.v22--hub .v-prose>*+*{margin-top:var(--kty-s-4)}
.v22--hub .v-prose>h3+*{margin-top:var(--kty-s-2)}
.v22--hub .v-prose>*+h3{margin-top:var(--kty-s-6)}
.v22--hub .v-bullets{margin:0;padding-left:var(--kty-s-6);max-width:var(--kty-w-read)}
.v22--hub .v-bullets li{margin:0}
.v22--hub .v-bullets li+li{margin-top:var(--kty-s-3)}
.v22--hub .v-bullets li::marker{color:var(--kty-bg-leaf)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-prose+.v-count{margin-top:var(--kty-s-8)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-count+:is(.v-rows,.v-bullets,.v-steplist,.v-numbered,.v-pairs){margin-top:var(--kty-s-3)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-rows+:is(.v-rows,.v-count,.v-start),.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-bullets+.v-count{margin-top:var(--kty-s-8)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-count+.v-grid{margin-top:var(--kty-s-3)}
.v22--hub .v-row__go{flex-basis:100%;font-size:var(--kty-small);font-weight:600;color:var(--kty-accent)}
.v22--hub .v-kv{display:grid;gap:var(--kty-s-3)}
.v22--hub .v-kv>div{display:grid;gap:var(--kty-s-1)}
.v22--hub .v-kv dt{font-size:var(--kty-small);font-weight:700;color:var(--kty-ink)}
.v22--hub .v-kv dd{margin:0}
.v22--hub .v-notice>.v-kv,.v22--hub .v-notice>.v-link{margin-top:var(--kty-s-4)}
.v22--hub .v-facts dt{font-weight:600;color:var(--kty-ink-2)}
.v22--hub .v-head__in>:is(.v-acts,.lead)+.v-facts{margin-top:var(--kty-s-6)}
.v22--hub .v-head__in>.v-acts+.v-acts{margin-top:var(--kty-s-4)}

/* Numbered lists: the zone season plan (strong title, one line) and the safety steps (h3, one line). The number is a round leaf-green disc. */
.v22--hub :is(.v-numbered,.v-steplist){margin:0;padding:0;list-style:none;counter-reset:vstep;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub :is(.v-numbered,.v-steplist)>li{display:flow-root;margin:0;padding:var(--kty-row-pad) 0 var(--kty-row-pad) var(--kty-s-10);border-bottom:var(--kty-rule) solid var(--kty-hair);counter-increment:vstep}
.v22--hub :is(.v-numbered,.v-steplist)>li::before{content:counter(vstep);float:left;display:grid;place-items:center;width:var(--kty-s-8);height:var(--kty-s-8);margin-left:calc(var(--kty-s-10) * -1);border-radius:50%;background:var(--kty-bg-leaf);color:#fff;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600}
.v22--hub .v-numbered strong{display:block;font-family:var(--kty-font-display);font-size:var(--kty-lead);color:var(--kty-ink)}
.v22--hub .v-steplist li h3{font-size:var(--kty-lead)}
.v22--hub .v-steplist li p{margin-top:var(--kty-s-1)}
.v22--hub .surf--sage :is(.v-numbered,.v-steplist){border-top-color:var(--kty-mute)}
.v22--hub .surf--sage :is(.v-numbered,.v-steplist)>li{border-bottom-color:var(--kty-mute)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-steplist+.v-notice{margin-top:var(--kty-s-8)}

/* Photo grids with three columns from 641px (zone plants, safety lists, region plants); a phone gets one column. */
.v22--hub .v-grid.v-grid--tri{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.v22--hub .v-grid.v-grid--tri{grid-template-columns:minmax(0,1fr)}}
.v22--hub .v-card__sci{display:block;font-size:var(--kty-small);font-style:italic;color:var(--kty-mute)}
.v22--hub .v-figure{max-width:var(--kty-w-read)}
.v22--hub .v-figure img{display:block;width:100%;height:auto}

/* Data tables on a white card; they scroll inside the card and wrap their cells on a phone. */
.v22--hub .table-wrap{overflow-x:auto;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--hub .brand-evidence-table{width:100%;margin:0;border-collapse:collapse;font-size:var(--kty-small);line-height:1.5}
.v22--hub .brand-evidence-table :is(th,td){padding:var(--kty-s-3) var(--kty-s-4);text-align:left;vertical-align:top}
.v22--hub .brand-evidence-table tbody :is(th,td){border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .brand-evidence-table thead th{background:var(--kty-bg-tint);font-weight:700;color:var(--kty-ink)}
.v22--hub .brand-evidence-table a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600;text-decoration:underline}
@media (max-width:640px){.v22--hub .brand-evidence-table :is(th,td){padding:var(--kty-s-2) var(--kty-s-3)}}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.table-wrap+.v-tgroups{margin-top:var(--kty-s-9)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.table-wrap+.v-fine{margin-top:var(--kty-s-4)}

/* Groups of plants by type (calendar and zone pages): a Fraunces heading with the count, then the links or cards. */
.v22--hub .v-tgroups{display:grid;gap:var(--kty-s-8)}
.v22--hub .v-tgroup{padding-top:var(--kty-s-5);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-tgroup>*{margin-block:0}
.v22--hub .v-tgroup>*+*{margin-top:var(--kty-s-4)}
.v22--hub .v-tgroup>h3+.v-grid{margin-top:var(--kty-s-6)}
.v22--hub .v-tgroup h3 a{color:inherit;text-decoration:underline;text-decoration-thickness:.06em;text-underline-offset:.15em}
.v22--hub .v-tgroup__n{font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:600;color:var(--kty-mute)}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-figure+.v-tgroups,.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-tgroups+.v-acts{margin-top:var(--kty-s-8)}

/* Zone chooser: one labelled select plus a button, the same face as the calendar chooser. */
.v22--hub .v-zonefilter{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--kty-s-4)}
.v22--hub .v-zonefilter .tool-field{flex:1 1 calc(var(--kty-s-13) * 3);max-width:calc(var(--kty-s-13) * 4)}
.v22--hub .v-zonefilter .btn{flex:none}
@media (max-width:640px){.v22--hub .v-zonefilter .tool-field{max-width:none}}

/* Region blocks: a hairline, the name, the range, the description, four climate facts, lists, three plant cards. */
.v22--hub .v-regions{display:grid;gap:var(--kty-s-9)}
.v22--hub .v-region{padding-top:var(--kty-s-6);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-region>*{margin-block:0}
.v22--hub .v-region>*+*{margin-top:var(--kty-s-4)}
.v22--hub .v-region>h4{margin-top:var(--kty-s-7);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--hub .v-region>h4+*{margin-top:var(--kty-s-3)}
.v22--hub .v-region header>*{margin-block:0}
.v22--hub .v-region__r{margin-top:var(--kty-s-1);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .v-region>.v-links{margin-top:var(--kty-s-6)}
.v22--hub .v-clim{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--kty-s-3) var(--kty-s-6)}
.v22--hub .v-clim>div{display:grid;gap:var(--kty-s-1)}
.v22--hub .v-clim dt{font-size:var(--kty-small);font-weight:700;color:var(--kty-ink)}
.v22--hub .v-clim dd{margin:0}
@media (min-width:641px){.v22--hub .v-clim{grid-template-columns:repeat(2,minmax(0,1fr))}}
.v22--hub .v-links a:not([href]){color:var(--kty-mute)}

/* Safety record pairs and the sitemap lists. */
.v22--hub .v-pairs{display:grid;gap:var(--kty-s-8)}
.v22--hub .v-pairset>*{margin-block:0}
.v22--hub .v-pairset>*+*{margin-top:var(--kty-s-3)}
.v22--hub .v-pairset__t{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--hub .v-sitegroup>h2{font-size:var(--kty-h3);line-height:1.25}
.v22--hub .v-sitegroup>h2+*{margin-top:var(--kty-s-3)}
.v22--hub .v-sitegroup+.v-sitegroup{margin-top:var(--kty-s-9)}
.v22--hub .v-sitelist{margin:0;padding:0;list-style:none;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-sitelist li{margin:0;border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-sitelist a{display:flex;align-items:center;min-height:var(--kty-s-9);padding-block:var(--kty-s-1);text-decoration:none}
.v22--hub .v-sitelist a:hover{text-decoration:underline}

/* Search box (search page and 404), Sunny on the empty result and the 404 only. */
.v22--hub .v-search{display:flex;flex-wrap:wrap;gap:var(--kty-s-3);max-width:var(--kty-w-read)}
.v22--hub .v-search input[type="search"]{flex:1 1 calc(var(--kty-s-13) * 4);min-width:0;min-height:var(--kty-s-9);padding:0 var(--kty-s-4);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-radius);background:var(--kty-paper);font-family:var(--kty-font-body);font-size:1rem;color:var(--kty-ink)}
.v22--hub .v-search .btn{flex:none}
.v22--hub .v-head__in>.v-search{margin-top:var(--kty-s-6)}
.v22--hub .v-sunny{display:block;width:var(--kty-s-13);max-width:100%;height:auto;border-radius:0}
.v22--hub .v-sunny-note{display:flex;flex-wrap:wrap;align-items:center;gap:var(--kty-s-6);max-width:var(--kty-w-read)}
.v22--hub .v-sunny-note p{flex:1 1 var(--kty-s-13)}
.v22--hub .v-notfound{display:grid;gap:var(--kty-s-5);justify-items:start}
.v22--hub .v-notfound>*{margin:0}
.v22--hub .v-notfound>h2{margin-top:var(--kty-s-7)}
.v22--hub .v-notfound>.v-rows,.v22--hub .v-notfound>.v-search{width:100%}
.v22--hub .v-head.v-head--lone.surf{padding-block-start:var(--kty-band-y)}

/* Forms on a white card: the calculator, the zone form and the calendar chooser share one face. */
.v22--hub :is(.tool-card,.tool-calculator){padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink-2)}
.v22--hub :is(.tool-card,.tool-calculator)>*{margin-block:0}
.v22--hub :is(.tool-card,.tool-calculator)>*+*{margin-top:var(--kty-s-4)}
.v22--hub .tool-card__t{font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600;line-height:1.25;color:var(--kty-ink)}
.v22--hub .tool-card>.tool-card__t+.tool-card__s{margin-top:var(--kty-s-1)}
.v22--hub :is(.tool-card__s,.tool-calculator__hint){font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .tool-calculator__promise{color:var(--kty-ink-2)}
.v22--hub .tool-calculator>h2+.tool-calculator__promise{margin-top:var(--kty-s-3)}
.v22--hub .tool-calculator>.tool-calculator__promise+.tool-calculator__hint{margin-top:var(--kty-s-1)}
.v22--hub .tool-calculator>.tool-calculator__hint+.tool-form-grid{margin-top:var(--kty-s-6)}
.v22--hub .tool-form-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--kty-s-5) var(--kty-s-6)}
@media (min-width:641px){.v22--hub .tool-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.v22--hub .tool-field{display:flex;flex-direction:column;gap:var(--kty-s-2);min-width:0}
.v22--hub .tool-field>span{font-size:var(--kty-small);font-weight:600;color:var(--kty-ink)}
.v22--hub .tool-field :is(input,select){width:100%;min-height:var(--kty-s-9);padding:0 var(--kty-s-4);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-radius);background:var(--kty-paper);font-family:var(--kty-font-body);font-size:1rem;color:var(--kty-ink)}
.v22--hub .calendar-control select{appearance:none;-webkit-appearance:none;padding-right:var(--kty-s-9);background-image:linear-gradient(45deg,transparent 50%,var(--kty-ink) 50%),linear-gradient(135deg,var(--kty-ink) 50%,transparent 50%);background-position:calc(100% - var(--kty-s-5)) 55%,calc(100% - var(--kty-s-4)) 55%;background-size:var(--kty-s-1) var(--kty-s-1);background-repeat:no-repeat}
.v22--hub .tool-field :is(input,select):focus-visible{outline:3px solid var(--kty-accent);outline-offset:2px}
.v22--hub .tool-field small{font-size:var(--kty-small);line-height:1.5;color:var(--kty-mute)}
.v22--hub .tool-field small[data-field-error]{color:var(--kty-accent)}
.v22--hub .tool-field small[data-field-error]:empty{display:none}
.v22--hub .tool-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--kty-s-4)}
.v22--hub .tool-actions button[type="reset"]{min-height:var(--kty-s-9);padding:0 var(--kty-s-4);border:0;background:none;color:var(--kty-accent);font-family:var(--kty-font-body);font-size:1rem;font-weight:600;text-decoration:underline;text-underline-offset:.15em;cursor:pointer}
.v22--hub .tool-card>.tool-form-grid+.tool-actions,.v22--hub .tool-card>.tool-actions{margin-top:var(--kty-s-6)}
.v22--hub .tool-form-grid>.tool-actions{margin-top:var(--kty-s-2)}
.v22--hub .tool-calculator>.tool-result{margin-top:var(--kty-s-6);padding-top:var(--kty-s-6);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .tool-calculator .tool-result>*{margin-block:0}
.v22--hub .tool-calculator .tool-result>*+*{margin-top:var(--kty-s-2)}
.v22--hub .tool-result__label{display:block;font-size:var(--kty-small);font-weight:600;color:var(--kty-mute)}
.v22--hub .tool-result__value{display:block;font-family:var(--kty-font-display);font-size:var(--kty-h2);font-weight:700;line-height:1.15;letter-spacing:-.015em;color:var(--kty-ink);text-wrap:balance}
.v22--hub .tool-result__detail,.v22--hub .tool-result__extras{color:var(--kty-ink-2)}
.v22--hub .tool-result__extras:empty{display:none}
.v22--hub .tool-calculator .tool-result>.tool-result__decides{margin-top:var(--kty-s-4);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .tool-result__decides span{font-weight:700;color:var(--kty-ink-2)}

/* Step strip: three numbered discs on one thin forest line (a column on a phone). */
.v22--hub .tool-steps{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--kty-s-6);margin:0;padding:0;list-style:none}
.v22--hub .tool-steps li{display:grid;justify-items:center;gap:var(--kty-s-2);margin:0;text-align:center}
.v22--hub .tool-steps__n{display:grid;place-items:center;width:var(--kty-s-9);height:var(--kty-s-9);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600}
.v22--hub .tool-steps__t{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink)}
.v22--hub .tool-steps__s{font-size:var(--kty-small);color:var(--kty-mute)}
@media (min-width:641px){
  .v22--hub .tool-steps{position:relative;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--kty-s-6)}
  .v22--hub .tool-steps::before{content:"";position:absolute;left:calc(100% / 6);right:calc(100% / 6);top:calc(var(--kty-s-9) / 2);height:2px;background:var(--kty-bg-dark)}
  .v22--hub .tool-steps__n{position:relative;z-index:1}
}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.tool-calculator+.tool-steps{margin-top:var(--kty-s-9)}

/* Tool hub and tool page pieces. */
.v22--hub .tool-featured{max-width:var(--kty-w-read)}
.v22--hub .tool-lane-section>*{margin-block:0}
.v22--hub .tool-lane-section>*+*{margin-top:var(--kty-s-4)}
.v22--hub .tool-lane-section>.v-lead+.v-count{margin-top:var(--kty-s-2)}
.v22--hub .tool-lane-section>.v-count+.tool-card-grid{margin-top:var(--kty-s-3)}
.v22--hub .tool-lane-section+.tool-lane-section{margin-top:var(--kty-s-9)}
.v22--hub .tool-howsteps{margin:0;padding-left:var(--kty-s-6)}
.v22--hub .tool-howsteps li{margin:0}
.v22--hub .tool-howsteps li+li{margin-top:var(--kty-s-4)}
.v22--hub .tool-howsteps li::marker{font-weight:700;color:var(--kty-bg-leaf)}
.v22--hub .tool-howsteps strong{color:var(--kty-ink)}
.v22--hub .tool-howsteps+.v-prose{margin-top:var(--kty-s-6)}
.v22--hub .tool-sources{margin:0;padding-left:var(--kty-s-6);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--hub .tool-sources li{margin:0}
.v22--hub .tool-sources li+li{margin-top:var(--kty-s-2)}
.v22--hub .tool-sources a{color:var(--kty-accent);text-decoration:underline;text-underline-offset:.15em}
.v22--hub .tool-next .v-row__title{font-size:var(--kty-lead)}
.v22--hub .tool-risk{max-width:var(--kty-w-read)}
.v22--hub .calendar-month-nav{margin-top:0}
.v22--hub .tool-lanes{margin-top:var(--kty-head-gap)}
.v22--hub .tool-card-grid{display:block}
.v22--hub .v-rows+.zone-temperature-scale{margin-top:var(--kty-s-8)}
.v22--hub :is(.tool-card,.tool-calculator,.tool-steps){max-width:var(--kty-w-brand)}
.v22--hub .v-notfound>.v-search{width:100%}
.v22--hub :is(.v-bullets,.tool-sources) a,.v22--hub .v-tgroup h3 a{display:inline-flex;align-items:center;min-height:var(--kty-s-9)}
/* flex drops the space between the link and the text after it ("Flowers" + " for Zone 7"), so the gap restores it */
.v22--hub .v-tgroup h3{display:flex;align-items:center;flex-wrap:wrap;column-gap:.3em}

/* ---- 12. Plant profile, plant problem and comparison pages (T016). Comps: tmp/design-v22/comps/profile.png, problem.png, compare.png ----
   They reuse the article system of section 7 (roots carry v22--article plus v22--typed and one of v22--profile, v22--problem, v22--compare):
   head band with the trail inside and centred text, one 760 reading column, hairline accordion with one ornament, related band. */
.v22--typed .art-lead{max-width:var(--kty-w-read)}
.v22--article h4{margin:0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3;color:var(--kty-ink)}
.v22--article .art-faq__items summary h3{margin:0}
.v22--article .art-rows{border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--article .v-card__text{display:flex;flex-direction:column;gap:var(--kty-s-2);min-width:0}
.v22--article .v-card__note{font-size:var(--kty-small);line-height:1.5;color:var(--kty-ink-2)}
.v22--article .at-a-glance>*{margin-block:0}
.v22--article .at-a-glance>*+*{margin-top:var(--kty-s-6)}
.v22--article .at-a-glance .section-heading{display:block}
.v22--article .data-table td.is-highlighted{background:var(--kty-bg-tint);color:var(--kty-ink);font-weight:600}
.v22--article .empty-note{color:var(--kty-mute)}
.v22--article .in-content-image{margin:0}

/* Head bands: the pattern stays in the far side margins (outside the 1120 content), a different traced tile per page type. */
.v22--profile .art-hero.surf.surf--sage{--pat-shape:url(/assets/images/v22/pat-veins.svg);--pat-w:245px;--pat-h:215px}
.v22--problem .art-hero.surf.surf--sage{--pat-shape:url(/assets/images/v22/pat-seed.svg);--pat-w:240px;--pat-h:240px}

/* Plant profile: botanical line, facts line, hero photo, care snapshot card. */
.v22--profile .art-head>.botanical-line{margin-top:var(--kty-s-3);display:flex;flex-wrap:wrap;gap:var(--kty-s-1) var(--kty-s-3);font-size:var(--kty-lead);font-style:italic;color:var(--kty-mute)}
.v22--profile .botanical-line span::before{content:"\00b7";margin-right:var(--kty-s-3)}
.v22--profile .prof-facts{display:flex;flex-wrap:wrap;gap:var(--kty-s-2) var(--kty-s-3);padding:0;list-style:none;font-size:var(--kty-small);color:var(--kty-ink)}
.v22--profile .prof-facts li{display:inline-flex;align-items:center;gap:var(--kty-s-2);margin:0}
.v22--profile .prof-facts li+li::before{content:"\00b7";margin-right:var(--kty-s-3);color:var(--kty-mute)}
.v22--profile .prof-facts__warn i{color:var(--kty-accent);font-size:1.125rem}
/* Hero photo height is capped by its layout width (same 900px as the head column), never by cropping: a 3:2 photo stays <= 600px tall at 1440 */
.v22--profile .prof-photo{max-width:var(--kty-w-brand);margin:var(--kty-s-9) 0 0}
.v22--profile .prof-snap{padding:0;overflow:hidden}
.v22--profile .prof-snap .art-card__title{padding:var(--kty-card-pad)}
.v22--profile .prof-snap__grid{display:grid;grid-template-columns:minmax(0,1fr);margin:0 calc(var(--kty-rule) * -1) calc(var(--kty-rule) * -1) 0;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--profile .prof-snap__cell{display:grid;grid-template-columns:var(--kty-s-8) minmax(0,1fr);align-content:start;column-gap:var(--kty-s-3);row-gap:var(--kty-s-1);padding:var(--kty-s-5) var(--kty-card-pad);border-right:var(--kty-rule) solid var(--kty-hair);border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--profile .prof-snap__cell i{grid-row:1/3;color:var(--kty-bg-leaf);font-size:1.75rem;line-height:1}
.v22--profile .prof-snap__cell dt{margin:0;font-size:var(--kty-small);color:var(--kty-mute)}
.v22--profile .prof-snap__cell dd{margin:0;color:var(--kty-ink);font-weight:500}
.v22--profile .art-content>.v-wrap>.prof-snap+.art-col{margin-top:var(--kty-s-9)}
@media (min-width:561px){.v22--profile .prof-snap__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:801px){.v22--profile .prof-snap__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Plant problem: quick-diagnosis card, causes, numbered recovery steps. */
.v22--problem .art-col>:is(.art-photo,.art-toc){margin-top:var(--kty-s-8)}
.v22--problem .prob-diag>*{margin-block:0}
.v22--problem .prob-diag>*+*{margin-top:var(--kty-s-3)}
.v22--problem .prob-diag .art-card__title{font-size:var(--kty-h2)}
.v22--problem .prob-diag__lead{font-size:var(--kty-lead);font-weight:700;color:var(--kty-ink)}
.v22--problem .prob-diag__body>*{margin-block:0}
.v22--problem .prob-diag__body>*+*{margin-top:var(--kty-s-3)}
.v22--problem .prob-cause>*{margin-block:0}
.v22--problem .prob-cause>*+*{margin-top:var(--kty-s-5)}
.v22--problem .prob-cause>h3{margin-top:0}
.v22--problem .prob-cause>h3+*{margin-top:var(--kty-s-2)}
.v22--problem .art-sec>.prob-cause+.prob-cause{margin-top:var(--kty-s-10)}
.v22--problem .prob-cause__meta{display:flex;flex-wrap:wrap;gap:var(--kty-s-1) var(--kty-s-3);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--problem .prob-cause__meta span+span::before{content:"\00b7";margin-right:var(--kty-s-3)}
.v22--problem .prob-cause__meta+*{margin-top:var(--kty-s-4)}
.v22--problem .prob-cause__group h4+*{margin-top:var(--kty-s-3)}
.v22--problem .prob-cause>.prob-cause__group{margin-top:var(--kty-s-6)}
.v22--problem .prob-steps{padding:0;list-style:none;counter-reset:prob-step}
.v22--problem .prob-step{display:grid;grid-template-columns:var(--kty-s-8) minmax(0,1fr);column-gap:var(--kty-s-4);counter-increment:prob-step}
.v22--problem .prob-step::before{content:counter(prob-step);display:grid;place-items:center;width:var(--kty-s-8);height:var(--kty-s-8);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1}
.v22--problem .art-sec .prob-step+.prob-step{margin-top:var(--kty-s-6)}
.v22--problem .prob-step>div>*{margin-block:0}
.v22--problem .prob-step>div>*+*{margin-top:var(--kty-s-2)}
.v22--problem .art-sec .prob-step h3{margin-top:var(--kty-s-1);font-size:var(--kty-lead);line-height:1.3}
.v22--problem .prob-step__label{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--problem .prob-step>div>.art-free{margin-top:var(--kty-s-3)}
.v22--problem .prob-prevention{margin-top:var(--kty-flow-h2)}

/* Comparison: the pair of photo cards with the "vs" badge in the gap, the specifications band, cases, cost, sustainability. */
.v22--compare .cmp-pair{display:grid;grid-template-columns:minmax(0,1fr);row-gap:var(--kty-s-2);align-items:stretch;margin-top:var(--kty-s-9)}
.v22--compare .cmp-side{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--compare .cmp-side__media{aspect-ratio:var(--kty-ratio-card);overflow:hidden;background:var(--kty-bg-tint)}
.v22--compare .cmp-side__media img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.v22--compare .cmp-side__body{padding:var(--kty-card-pad)}
.v22--compare .cmp-side__body>*{margin-block:0}
.v22--compare .cmp-side__body>*+*{margin-top:var(--kty-s-2)}
.v22--compare .cmp-side__title{font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600;line-height:1.25;color:var(--kty-ink)}
.v22--compare .cmp-side__sci{color:var(--kty-mute)}
.v22--compare .cmp-side__tags{margin:0;padding:0;list-style:none;color:var(--kty-ink-2)}
.v22--compare .cmp-side__tags li{margin:0}
.v22--compare .cmp-vs{display:grid;place-items:center;justify-self:center;align-self:center;width:var(--kty-s-8);height:var(--kty-s-8);border-radius:50%;background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-display);font-size:var(--kty-small);font-weight:700;line-height:1}
@media (min-width:641px){.v22--compare .cmp-pair{grid-template-columns:minmax(0,1fr) var(--kty-s-9) minmax(0,1fr);row-gap:0}}
.v22--compare .cmp-intro{max-width:var(--kty-w-read);margin:var(--kty-s-9) 0 0}
.v22--compare .cmp-specs__head>*{margin-block:0}
.v22--compare .cmp-specs__head>*+*{margin-top:var(--kty-s-3)}
.v22--compare .cmp-lead{font-size:var(--kty-lead);line-height:var(--kty-body-lh)}
.v22--compare .cmp-specs>.v-wrap>.cmp-specs__head+.cmp-specs__table{margin-top:var(--kty-head-gap)}
.v22--compare .art-sec>.cmp-lead{margin-top:var(--kty-s-3);color:var(--kty-mute)}
.v22--compare .cmp-cases{border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--compare .art-sec>.cmp-lead+.cmp-cases{margin-top:var(--kty-s-6)}
.v22--compare .cmp-case{padding-block:var(--kty-s-6);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--compare .cmp-case>*{margin-block:0}
.v22--compare .cmp-case>*+*{margin-top:var(--kty-s-2)}
.v22--compare .art-sec .cmp-case>h3{margin-top:0}
.v22--compare .cmp-case__fit,.v22--compare .cmp-case__sub{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--compare .cmp-case>.art-free{margin-top:var(--kty-s-3)}
.v22--compare .cmp-card>*{margin-block:0}
.v22--compare .cmp-card>*+*{margin-top:var(--kty-s-3)}
.v22--compare .art-sec .cmp-card>h3{margin-top:0}
.v22--compare .cmp-list{padding-left:var(--kty-s-6)}
.v22--compare .cmp-list li{margin:0}
.v22--compare .cmp-list li+li{margin-top:var(--kty-s-2)}
.v22--compare .cmp-list li::marker{color:var(--kty-bg-leaf)}
.v22--compare .cmp-stat>*{margin-block:0}
.v22--compare .cmp-stat>*+*{margin-top:var(--kty-s-2)}
.v22--compare .cmp-stat+.cmp-stat{margin-top:var(--kty-s-5);padding-top:var(--kty-s-5);border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--compare .cmp-stat__value{font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600;color:var(--kty-ink)}
.v22--compare .cmp-stat__label{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--article .art-col>*+.art-rows{margin-top:var(--kty-flow-h2)}

/* Block grids that Template::renderBlock emits (season cards, pest cards, content grid): hairline cards, two or three columns, no top or side bars. */
.v22--article :is(.seasonal-grid,.pest-grid,.content-grid){display:grid;grid-template-columns:minmax(0,1fr);gap:var(--kty-grid-gap)}
.v22--article :is(.season-card,.pest-card,.content-grid__card){display:block;margin:0;padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22)}
.v22--article .content-grid__card>i{margin:0;color:var(--kty-bg-leaf);font-size:1.5rem;line-height:1}
.v22--article .season-card>div>strong,.v22--article .pest-card__label{display:block;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--kty-ink)}
.v22--article :is(.season-card,.pest-card) p{margin:var(--kty-s-2) 0 0;font-size:var(--kty-small);line-height:1.5;color:var(--kty-ink-2)}
.v22--article .content-grid__card h3{margin:var(--kty-s-2) 0 0;font-size:var(--kty-lead)}
.v22--article .content-grid__card ul{margin:var(--kty-s-2) 0 0;padding-left:var(--kty-s-6);font-size:var(--kty-small);line-height:1.5;color:var(--kty-ink-2)}
@media (min-width:641px){
  .v22--article :is(.seasonal-grid,.pest-grid,.content-grid.cols-2){grid-template-columns:repeat(2,minmax(0,1fr))}
  .v22--article .content-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .v22--article .pest-grid.pest-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.v22--typed .art-head h1{overflow-wrap:break-word;hyphens:auto}
@media (max-width:640px){.v22--profile .prof-facts{flex-direction:column;align-items:flex-start}.v22--profile .prof-facts li+li::before{content:none}}
.v22--article .art-head .breadcrumb a{display:inline-flex;align-items:center;min-height:var(--kty-s-9)}
.v22--article .art-sources a{display:block;padding-block:var(--kty-s-3)}
.v22--article .art-sources li+li{margin-top:0}
.v22--article .checklist li>p{margin:0}

/* Tables with a link and a count (zone plants): natural widths, held to the reading column, cells centered on one line. */
.v22--hub .table-wrap--counts{width:fit-content;max-width:min(100%,var(--kty-w-read))}
.v22--hub .brand-evidence-table--counts{width:auto;min-width:calc(var(--kty-s-13) * 3)}
.v22--hub .brand-evidence-table--counts :is(th,td){vertical-align:middle}
.v22--hub .brand-evidence-table--counts :is(th,td)+:is(th,td){padding-left:var(--kty-s-9);text-align:right;font-variant-numeric:tabular-nums}
.v22--hub .v-band:not(.x-hero)>.v-wrap>.v-rows+nav{margin-top:var(--kty-s-8)}

/* Compare specifications on a phone: the feature name on its own line, then each plant's value under its name. */
@media (max-width:480px){
  .v22--compare .cmp-specs__table .data-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .v22--compare .cmp-specs__table .data-table :is(tbody,tr,th,td){display:block}
  .v22--compare .cmp-specs__table .data-table tbody th{padding-bottom:var(--kty-s-1);border-top:var(--kty-rule) solid var(--kty-hair);color:var(--kty-ink)}
  .v22--compare .cmp-specs__table .data-table tbody td{border-top:0;padding-block:var(--kty-s-1)}
  .v22--compare .cmp-specs__table .data-table tbody tr{padding-bottom:var(--kty-s-3)}
  .v22--compare .cmp-specs__table .data-table td::before{content:attr(data-label);display:block;font-size:var(--kty-small);font-weight:700;color:var(--kty-mute)}
}

/* ---- 13. Home (T022, relaid 2026-11-08). Root .v22.v22--hub.v22--home ----
   H1 across the top, then a split hero (copy + search + three numbers beside a photo that bleeds to the window edge), then one idea per band, each a heading
   above ONE visual and no two alike: photo bento on sage, sideways round-photo row, photo + numbered steps on forest, magazine lead + rows, pair cards,
   checklist + photo on forest, round-thumb problem rows on sage, tool cards on sun, accountability rows, one closing question. Short copy: no lead line under
   most headings. Fills and seams come from HubV10::surfaces in templates/home.php. Rules: no important flags, no position selectors. */
.v22--home .homepage-hero .v-head__in{max-width:var(--kty-w-brand)}
.v22--home .v-search{width:100%}
@media (max-width:640px){.v22--home .v-search .btn{flex:1 1 100%}}
.v22--home .v-popular{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--kty-s-5);font-size:var(--kty-small);color:var(--kty-mute)}
.v22--home .v-popular a{display:inline-flex;align-items:center;min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600;text-decoration:underline;text-underline-offset:.15em}
.v22--home .v-head .v-wrap>.v-cover{margin-top:var(--kty-head-gap)}
.v22--home .v-cover img{display:block;width:100%;height:auto}
.v22--home .v-cred{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-6);margin:var(--kty-s-9) 0 0;padding:var(--kty-s-6) 0 0;border-top:var(--kty-rule) solid var(--kty-hair);list-style:none}
.v22--home .v-cred li{display:flex;flex-direction:column;gap:var(--kty-s-1)}
.v22--home .v-cred strong{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.25;color:var(--kty-ink)}
.v22--home .v-cred span{font-size:var(--kty-small);line-height:1.5;color:var(--kty-mute)}
.v22--home .v-head .x-updated{margin:var(--kty-s-6) 0 0;font-size:var(--kty-small);color:var(--kty-mute)}
@media (max-width:767px){.v22--home .v-cred{grid-template-columns:minmax(0,1fr)}}

/* Band heading, one quiet line, then the visual. */
.v22--home .v-band:not(.x-hero)>.v-wrap>h2+.v-lead{margin-top:var(--kty-s-3)}
.v22--home .v-band:not(.x-hero)>.v-wrap>.v-lead+*{margin-top:var(--kty-head-gap)}
.v22--home .v-link{display:flex;width:fit-content}
.v22--home .surf--forest .btn.btn--ghost{background:transparent;border-color:#fff;color:#fff}
.v22--home .surf--forest .btn.btn--ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}
@media (max-width:640px){.v22--home .v-grid.v-grid--duo{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-s-3)}}

/* Closing question: left-aligned like every hub band. */
.v22--home .home-ask .v-lead{max-width:var(--kty-w-read)}

/* Tool cards on the sun band: a leaf-green icon over the title, on white. */
.v22--home .v-toolcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap)}
.v22--home .v-tool{display:flex;flex-direction:column;align-items:flex-start;gap:var(--kty-s-3);min-width:0;padding:var(--kty-card-pad);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:var(--kty-shadow-v22);color:var(--kty-ink)}
.v22--home .v-tool:hover{border-color:var(--kty-line-strong);box-shadow:var(--kty-shadow-card);text-decoration:none}
.v22--home .v-tool>i{font-size:2rem;line-height:1;color:var(--kty-bg-leaf)}
.v22--home .v-tool__t{font-size:var(--kty-lead);line-height:1.25}
@media (max-width:640px){.v22--home .v-toolcards{grid-template-columns:minmax(0,1fr)}}
/* Phones: two-column photo cards are ~170 px wide; a lead-size serif title splits two-word plant names one word per line. */
@media (max-width:560px){.v22 .v-card__title{font-size:1rem}}

/* Breadcrumb home link: flex links drop the space between the house icon and "Home", so the icon carries its own gap (every template that prints the trail). */
.breadcrumb a>.ph-house{margin-right:.35em;font-size:1.05em;line-height:1}

/* Home relaid to the owner's reference comps (docs/design/v22/comps/home-ref-top.webp, home-ref-bottom.webp), owner ruling 2026-11-08.
   Home-only exceptions to section 8 are listed in DESIGN_SPEC section 8 and declared on the root (data-gate-exempt) for visual_gate. */
.v22--home{--kty-band-y:var(--kty-s-10);--home-amber:#A0551A;--home-amber-deep:#874714;--home-cream:#F6F4EC}
.v22--home .home-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--kty-s-2);min-height:var(--kty-s-9);padding:0 var(--kty-s-6);border:0;border-radius:var(--kty-r-sm);background:var(--home-amber);color:#fff;font-family:var(--kty-font-body);font-size:1rem;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;text-decoration:none}
.v22--home .home-btn:hover{background:var(--home-amber-deep);color:#fff;text-decoration:none}
.v22--home .home-btn--sm{min-height:var(--kty-s-9);padding:0 var(--kty-s-5);font-size:var(--kty-small)}
.v22--home .home-more{display:inline-flex;align-items:center;gap:var(--kty-s-2);min-height:var(--kty-s-9);color:var(--kty-accent);font-weight:600;text-decoration:none;white-space:nowrap}
.v22--home .home-more:hover{text-decoration:none;opacity:.8}
.v22.v22--home .surf--forest .home-more{color:var(--kty-bg-sun)}
.v22--home .v-band h2::after,.v22--home .home-hero h1::after{content:"";display:block;width:56px;height:4px;margin-top:var(--kty-s-3);border-radius:var(--kty-s-1);background:var(--home-amber)}
.v22--home .surf--forest h2::after{background:var(--kty-bg-sun)}
.v22--home .home-ask h2::after{margin-inline:auto}
.v22--home .home-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--kty-s-4) var(--kty-s-8);margin-bottom:var(--kty-s-6)}
.v22--home .home-head>h2{margin:0}
.v22--home .home-head>p{flex:1 1 20rem;max-width:46ch;margin:0;color:var(--kty-mute)}
.v22--home .home-head>h2+p{text-align:right;margin-left:auto}
.v22--home .home-head>p+.home-more{flex:none}

/* Hero: copy left; the photo runs to the window's right edge with the search card floating over its top-left corner. The sage wave below cuts the photo. */
.v22--home .homepage-hero{overflow-x:clip}
.v22--home .homepage-hero.surf.seam{padding-bottom:var(--seam-h)}
.v22--home .home-hero{position:relative;display:grid;grid-template-columns:minmax(0,10fr) minmax(0,14fr);gap:var(--kty-s-6);align-items:center}
.v22--home .home-hero__copy{padding-block:var(--kty-s-7) var(--kty-s-9)}
.v22--home .home-hero__copy>*{margin:0}
.v22--home .home-hero__copy>*+*{margin-top:var(--kty-s-6)}
.v22--home .home-hero__copy h1{font-size:clamp(2.375rem,1.4rem + 2.4vw,3.5rem);line-height:1.04;letter-spacing:-.01em}
.v22--home .home-hero__copy .lead{max-width:36ch;color:var(--kty-ink-2)}
.v22--home .home-hero__copy .home-btn{margin-top:var(--kty-s-7)}
.v22--home .home-hero__media{position:relative;align-self:stretch;min-height:clamp(430px,31vw,600px);margin-bottom:calc(-1 * var(--seam-h));margin-top:calc(-1 * var(--kty-s-6));margin-right:calc(-1 * max(var(--kty-gutter), (100vw - var(--kty-w-hub)) / 2))}
.v22--home .home-hero__media>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:0;clip-path:polygon(100% 0,100% 100%,2.0% 100%,3.2% 96%,4.4% 92%,5.3% 88%,6.0% 84%,6.3% 80%,6.3% 76%,6.1% 72%,5.8% 68%,5.4% 64%,5.1% 60%,5.0% 56%,5.1% 52%,5.6% 48%,6.3% 44%,7.3% 40%,8.5% 36%,9.8% 32%,11.0% 28%,12.1% 24%,12.9% 20%,13.4% 16%,13.7% 12%,13.6% 8%,13.4% 4%,13.0% 0%)}
.v22--home .home-find{position:absolute;top:50%;right:var(--kty-gutter);width:min(30rem,42%);transform:translateY(-50%);padding:var(--kty-s-6);border-radius:var(--kty-r-lg);background:#fff;box-shadow:var(--kty-shadow-lift)}
.v22--home .home-find>*{margin:0}
.v22--home .home-find__t{font-family:var(--kty-font-display);font-size:1.5rem;font-weight:700;line-height:1.2;color:var(--kty-ink)}
.v22--home .home-find__form{display:flex;align-items:center;gap:var(--kty-s-2);margin-top:var(--kty-s-4);padding:var(--kty-s-1) var(--kty-s-1) var(--kty-s-1) var(--kty-s-4);border:var(--kty-rule) solid var(--kty-line-strong);border-radius:var(--kty-r-sm)}
.v22--home .home-find__form>i{flex:none;color:var(--kty-mute)}
@media (max-width:400px){.v22--home .home-find__form>i{display:none}}
.v22--home .home-find__form input{flex:1 1 0;min-width:0;min-height:var(--kty-s-9);border:0;background:transparent;font-family:var(--kty-font-body);font-size:1rem;color:var(--kty-ink);outline-offset:4px}
.v22--home .home-find__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-3);margin:var(--kty-s-5) 0 0;padding:var(--kty-s-4) 0 0;border-top:var(--kty-rule) solid var(--kty-hair);list-style:none}
.v22--home .home-find__stats li{display:flex;align-items:center;gap:var(--kty-s-2);margin:0;font-size:.8125rem;line-height:1.3;color:var(--kty-mute)}
.v22--home .home-find__stats i{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--kty-bg-tint);color:var(--kty-bg-leaf);font-size:1.15rem}
.v22--home .home-find__stats strong{display:block;font-family:var(--kty-font-display);font-size:1.125rem;color:var(--kty-ink)}
@media (max-width:900px){
  .v22--home .home-hero{grid-template-columns:minmax(0,1fr);gap:0}
  .v22--home .home-hero__copy{padding-block:var(--kty-s-4) var(--kty-s-8)}
  .v22--home .home-hero__media{min-height:0;margin:0 calc(-1 * var(--kty-gutter))}
  .v22--home .home-hero__media>img{position:static;height:auto;min-height:0;aspect-ratio:3 / 2;border-radius:0;clip-path:none}
  .v22--home .home-find{position:relative;top:auto;right:auto;width:auto;margin:var(--kty-s-6) 0 var(--kty-s-8);transform:none}
}
@media (max-width:480px){.v22--home .home-find__stats{grid-template-columns:minmax(0,1fr)}}

/* Category bento: 4 columns, one tall tile and one wide tile, white labels on a dark fade at the bottom of each photo. */
.v22--home .home-bento{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));grid-auto-rows:190px;grid-auto-flow:dense;gap:var(--kty-s-5);margin:0;padding:0;list-style:none}
.v22--home .home-bento>.home-bento__cell{display:flex;grid-column:span 6;min-width:0;margin:0}
.v22--home .home-bento>.is-tall{grid-row:span 2}
.v22--home .home-bento>.home-bento__cell.is-wide{grid-column:span 9}
.v22--home .home-bento__tile{position:relative;display:flex;flex:1;min-width:0;overflow:hidden;border-radius:var(--kty-radius);box-shadow:var(--kty-shadow-card);background:var(--kty-bg-dark)}
.v22--home .home-bento__tile>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.v22--home .home-bento__tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(12,26,16,.78),rgba(12,26,16,0) 58%)}
.v22--home .home-bento__tile:hover>img{transform:scale(1.05)}
.v22--home .home-bento__tile:hover{text-decoration:none}
.v22--home .home-bento__t{position:absolute;left:var(--kty-s-5);right:var(--kty-s-5);bottom:var(--kty-s-4);z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--kty-s-1)}
.v22.v22--home .home-bento__name{margin:0;font-size:clamp(1.25rem,1rem + .8vw,1.75rem);line-height:1.15;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.v22.v22--home .home-bento__n{flex:none;font-size:var(--kty-small);color:#fff}
@media (max-width:1023px){.v22--home .home-bento{grid-auto-rows:190px;gap:var(--kty-s-4)}}
@media (max-width:640px){.v22--home .home-bento__tile::after{background:linear-gradient(to top,rgba(12,26,16,.86),rgba(12,26,16,0) 74%)}}
@media (max-width:640px){.v22--home .home-bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:160px;gap:var(--kty-s-3)}.v22--home .home-bento>.home-bento__cell,.v22--home .home-bento>.home-bento__cell.is-wide{grid-column:span 1}.v22--home .home-bento>.home-bento__cell.is-wide-phone{grid-column:span 2}.v22--home .home-bento__t{flex-direction:column;gap:0;left:var(--kty-s-3);bottom:var(--kty-s-3)}}

/* Featured plants: six cards in one row, a round photo, the name, one short line. No scrolling. */
.v22--home .home-plants{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--kty-s-4);margin:0;padding:0;list-style:none}
.v22--home .home-plants>li{display:flex;min-width:0;margin:0}
.v22--home .home-plant{display:flex;flex:1;flex-direction:column;align-items:center;gap:var(--kty-s-2);min-width:0;padding:var(--kty-s-5) var(--kty-s-3);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--home-cream);color:var(--kty-ink);text-align:center}
.v22--home .home-plant:hover{box-shadow:var(--kty-shadow-card);text-decoration:none}
.v22--home .home-plant__img{display:block;width:min(120px,100%);aspect-ratio:1;margin-bottom:var(--kty-s-2);overflow:hidden;border-radius:50%;background:#fff}
.v22--home .home-plant__img img{display:block;width:100%;height:100%;object-fit:cover}
.v22--home .home-plant__name{margin:0;font-size:1.125rem;line-height:1.25;text-wrap:balance}
.v22--home .home-plant__line{font-size:.875rem;line-height:1.45;color:var(--kty-mute);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1023px){.v22--home .home-plants{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.v22--home .home-plants{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-s-3)}}

/* Process (forest): photo left, heading, one line and three numbered steps right. */
.v22--home .home-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--kty-s-10);align-items:center}
.v22--home .home-split__media img{display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;border-radius:var(--kty-r-lg)}
.v22--home .home-split__body>*{margin:0}
.v22--home .home-split__body>*+*{margin-top:var(--kty-s-6)}
.v22.v22--home .home-split__lead{color:var(--kty-mute)}
.v22--home .home-steps{padding:0;list-style:none;counter-reset:hstep}
.v22--home .home-steps>li{display:grid;grid-template-columns:var(--kty-s-9) minmax(0,1fr);column-gap:var(--kty-s-5);margin:0;padding:var(--kty-s-3) 0;counter-increment:hstep}
.v22--home .home-steps>li::before{content:counter(hstep);grid-row:span 2;display:grid;place-items:center;width:var(--kty-s-9);height:var(--kty-s-9);border-radius:50%;background:#fff;color:var(--kty-bg-dark);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;line-height:1}
.v22--home .home-steps strong{font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3}
.v22.v22--home .home-steps>li>span{font-size:var(--kty-small);color:var(--kty-mute)}
@media (max-width:900px){.v22--home .home-split{grid-template-columns:minmax(0,1fr);gap:var(--kty-s-8)}}

/* Practical guides: magazine lead story left, three labelled rows right, a hairline between. */
.v22--home .home-mag{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.v22--home .home-mag__lead{display:flex;flex-direction:column;gap:var(--kty-s-3);padding-right:var(--kty-s-9);border-right:var(--kty-rule) solid var(--kty-hair);color:var(--kty-ink)}
.v22--home .home-mag__lead:hover{text-decoration:none}
.v22--home .home-mag__lead:hover .home-mag__title{text-decoration:underline}
.v22--home .home-mag__img{position:relative;display:block;aspect-ratio:21 / 9;margin-bottom:var(--kty-s-2);overflow:hidden;border-radius:var(--kty-radius)}
.v22--home .home-mag__img img{display:block;width:100%;height:100%;object-fit:cover}
.v22--home .home-chip{position:absolute;top:var(--kty-s-4);left:var(--kty-s-4);padding:var(--kty-s-1) var(--kty-s-3);border-radius:var(--kty-r-sm);background:#fff;color:var(--kty-ink);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.v22--home .home-mag__title{margin:0;font-size:clamp(1.5rem,1.2rem + 1vw,2rem);line-height:1.15}
.v22--home .home-mag__line{color:var(--kty-mute)}
.v22--home .home-mag__go{display:inline-flex;align-items:center;gap:var(--kty-s-2);color:var(--kty-accent);font-weight:600;text-decoration:none}
.v22--home .home-mag__list{margin:0;padding:0 0 0 var(--kty-s-9);list-style:none}
.v22--home .home-mag__list>li{margin:0;border-bottom:var(--kty-rule) solid var(--kty-hair)}
.v22--home .home-mag__row{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);padding:var(--kty-s-6) 0;color:var(--kty-ink)}
.v22--home .home-mag__row:hover{text-decoration:none}
.v22--home .home-mag__row:hover .home-mag__rowt{text-decoration:underline}
.v22--home .home-mag__row>i{flex:none;color:var(--home-amber);font-size:1.25rem}
.v22--home .home-label{display:block;margin-bottom:var(--kty-s-1);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--kty-mute)}
.v22--home .home-mag__rowt{display:block;font-family:var(--kty-font-display);font-size:1.25rem;font-weight:600;line-height:1.25}
@media (max-width:900px){.v22--home .home-mag{grid-template-columns:minmax(0,1fr)}.v22--home .home-mag__lead{padding:0;border:0}.v22--home .home-mag__list{margin-top:var(--kty-s-6);padding:0}}

/* Latest guides: four cards, photo, date, title. */
.v22--home .home-latest{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kty-s-6);margin:0;padding:0;list-style:none}
.v22--home .home-latest>li{display:flex;min-width:0;margin:0}
.v22--home .home-latest__card{display:flex;flex:1;flex-direction:column;gap:var(--kty-s-2);color:var(--kty-ink)}
.v22--home .home-latest__card:hover{text-decoration:none}
.v22--home .home-latest__card:hover .home-latest__t{text-decoration:underline}
.v22--home .home-latest__img{display:block;aspect-ratio:16 / 10;margin-bottom:var(--kty-s-2);overflow:hidden;border-radius:var(--kty-radius)}
.v22--home .home-latest__img img{display:block;width:100%;height:100%;object-fit:cover}
.v22--home .home-latest__date{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--kty-mute)}
.v22--home .home-latest__t{margin:0;font-size:1.1875rem;line-height:1.3}
@media (max-width:1023px){.v22--home .home-latest{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.v22--home .home-latest{grid-template-columns:minmax(0,1fr)}}

/* Comparisons: two wide cards, the two photos split on a diagonal with a VS disc, the title and a short line beside them. */
.v22--home .home-vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-s-6);margin:0;padding:0;list-style:none}
.v22--home .home-vs>li{display:flex;min-width:0;margin:0}
.v22--home .home-vs__card{display:grid;flex:1;grid-template-columns:minmax(0,11fr) minmax(0,9fr);min-height:230px;overflow:hidden;border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--home-cream);color:var(--kty-ink)}
.v22--home .home-vs__card:hover{box-shadow:var(--kty-shadow-card);text-decoration:none}
.v22--home .home-vs__pic{position:relative;display:block;overflow:hidden;background:#fff}
.v22--home .home-vs__pic>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v22--home .home-vs__a{clip-path:polygon(0 0,55% 0,44% 100%,0 100%)}
.v22--home .home-vs__b{clip-path:polygon(57% 0,100% 0,100% 100%,46% 100%)}
.v22--home .home-vs__badge{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:52px;height:52px;border:3px solid var(--kty-paper);border-radius:50%;background:var(--kty-bg-dark);color:#fff;font-size:.875rem;font-weight:700;transform:translate(-50%,-50%)}
.v22--home .home-vs__body{display:flex;flex-direction:column;gap:var(--kty-s-3);padding:var(--kty-s-6)}
.v22--home .home-vs__t{margin:0;font-size:1.375rem;line-height:1.2;text-wrap:balance}
.v22--home .home-vs__line{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--home .home-vs__go{display:inline-flex;align-items:center;gap:var(--kty-s-2);margin-top:auto;color:var(--kty-accent);font-weight:600}
@media (max-width:1023px){.v22--home .home-vs{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.v22--home .home-vs__card{grid-template-columns:minmax(0,1fr)}.v22--home .home-vs__pic{min-height:200px}}

/* Season band: the photo fills the band; the heading sits on its dark lower-left fade, the checklist on a dark glass panel at the right. */
.v22--home .home-photoband{min-height:440px}
.v22--home .home-photoband__bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.v22--home .home-photoband__bg img{display:block;width:100%;height:100%;object-fit:cover}
.v22--home .home-photoband__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,24,14,.6) 0%,rgba(10,24,14,.18) 55%,rgba(10,24,14,.06) 100%),linear-gradient(to top,rgba(10,24,14,.55),rgba(10,24,14,0) 50%),linear-gradient(to bottom,var(--kty-bg-dark),rgba(30,53,36,0) 18%)}
.v22--home .home-photoband__in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--kty-s-9);align-items:end;padding-top:var(--kty-s-12)}
.v22--home .home-photoband__copy{align-self:end}
.v22--home .home-glass{align-self:start}
.v22--home .home-photoband__copy>*{margin:0}
.v22--home .home-photoband__copy>*+*{margin-top:var(--kty-s-4)}
.v22--home .home-photoband__copy h2{font-size:clamp(2rem,1.3rem + 2.4vw,3.25rem);line-height:1.08;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.v22--home .home-photoband__copy p{max-width:40ch;font-size:var(--kty-lead)}
.v22--home .home-glass{margin:0;padding:var(--kty-s-2) var(--kty-s-6);border:var(--kty-rule) solid rgba(255,255,255,.28);border-radius:var(--kty-r-lg);background:rgba(14,30,20,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);list-style:none}
.v22--home .home-glass>li{display:flex;align-items:flex-start;gap:var(--kty-s-3);margin:0;padding:var(--kty-s-4) 0;border-bottom:var(--kty-rule) solid rgba(255,255,255,.2);line-height:1.45}
.v22--home .home-glass>li>i{flex:none;font-size:1.25rem;line-height:1.45}
@media (max-width:900px){.v22--home .home-photoband__in{grid-template-columns:minmax(0,1fr);gap:var(--kty-s-7);padding-top:var(--kty-s-10)}}

/* Problems (sage): a big heading column left, rows with a round photo, title and one line right. */
.v22--home .home-probwrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--kty-s-10);align-items:start}
.v22--home .home-probwrap__head>*{margin:0}
.v22--home .home-probwrap__head>*+*{margin-top:var(--kty-s-5)}
.v22--home .home-probwrap__head h2{font-size:clamp(2rem,1.5rem + 1.6vw,2.75rem);line-height:1.08}
.v22--home .home-probs{margin:0;padding:0;list-style:none}
.v22--home .home-probs>li{margin:0;border-bottom:var(--kty-rule) solid rgba(59,74,60,.35)}
.v22--home .home-prob{display:flex;align-items:center;gap:var(--kty-s-5);padding:var(--kty-s-4) 0;color:var(--kty-ink)}
.v22--home .home-prob:hover{text-decoration:none}
.v22--home .home-prob:hover .home-prob__t{text-decoration:underline}
.v22--home .home-prob__img{display:block;flex:none;width:56px;height:56px;overflow:hidden;border-radius:50%;background:#fff}
.v22--home .home-prob__img img{display:block;width:100%;height:100%;object-fit:cover}
.v22--home .home-prob__text{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}
.v22--home .home-prob__t{margin:0;font-size:1.1875rem;line-height:1.3}
.v22--home .home-prob__line{font-size:var(--kty-small);line-height:1.45;color:var(--kty-mute)}
.v22--home .home-prob>i{flex:none;color:var(--kty-accent)}
@media (max-width:900px){.v22--home .home-probwrap{grid-template-columns:minmax(0,1fr);gap:var(--kty-s-6)}}

/* Tools: three cards, a big icon in a sage disc, title, one line, an amber button. */
.v22--home .home-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-6);margin:0;padding:0;list-style:none}
.v22--home .home-tool{display:flex;align-items:flex-start;gap:var(--kty-s-5);margin:0;padding:var(--kty-s-6);border:var(--kty-rule) solid var(--kty-hair);border-radius:var(--kty-radius);background:var(--home-cream)}
.v22--home .home-tool__icon{display:grid;place-items:center;flex:none;width:72px;height:72px;border-radius:50%;background:var(--kty-bg-sage);color:var(--kty-bg-leaf);font-size:2.25rem}
.v22--home .home-tool__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--kty-s-2);min-width:0}
.v22--home .home-tool__t{margin:0;font-size:1.25rem;line-height:1.25}
.v22--home .home-tool__line{font-size:var(--kty-small);color:var(--kty-mute)}
.v22--home .home-tool .home-btn{margin-top:var(--kty-s-2)}
@media (max-width:1023px){.v22--home .home-tools{grid-template-columns:minmax(0,1fr)}}

/* Closing question: centred over a faded garden photo. */
.v22--home .home-ask__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%);mask-image:linear-gradient(to bottom,transparent,#000 22%)}
.v22--home .home-ask__bg img{display:block;width:100%;height:100%;object-fit:cover;border-radius:0}
.v22--home .home-ask__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 62% 90% at 50% 50%,rgba(255,255,255,.96) 45%,rgba(255,255,255,.35) 100%)}
.v22--home .home-ask__in{display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-4);text-align:center}
.v22.v22--home .v-band>.home-ask__in>*{margin:0}
.v22--home .home-ask__in p{color:var(--kty-ink-2)}
.v22--home .home-ask__in .home-btn{margin-top:var(--kty-s-3)}
.v22--home .home-keep{white-space:nowrap}
@media (max-width:640px){.v22--home .home-head>h2+p{text-align:left;margin-left:0}}

/* Raised surfaces on home (tokens.css, from Tossless and KnowDogHub): dark outline, solid lip inside it, no blurred shadow. The lip is painted in bottom padding so a photo never covers it. */
:is(.nav-cta,.nav-search){border:var(--kty-outline);padding-bottom:var(--kty-lip-small);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.nav-cta{box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-forest)}
.nav-search{box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color)}
:is(.nav-cta,.nav-search):hover{transform:translateY(1px)}
.v22--home :is(.home-plant,.home-tool,.home-vs__card,.home-latest__card,.home-mag__lead,.home-find){border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.v22--home :is(.home-vs__card,.home-latest__card,.home-mag__lead){overflow:hidden;padding-bottom:var(--kty-lip)}
.v22--home :is(.home-plant,.home-vs__card,.home-latest__card,.home-mag__lead):hover{box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-color);transform:translateY(var(--kty-press));text-decoration:none}
.v22--home .home-plant{padding:var(--kty-s-5) var(--kty-s-3) calc(var(--kty-s-5) + var(--kty-lip))}
.v22--home .home-tool{padding:var(--kty-s-6) var(--kty-s-6) calc(var(--kty-s-6) + var(--kty-lip))}
.v22--home .home-find{padding:var(--kty-s-6) var(--kty-s-6) calc(var(--kty-s-6) + var(--kty-lip))}
.v22--home .home-find__form{border:var(--kty-outline);border-radius:var(--kty-radius);padding:var(--kty-s-1) var(--kty-s-1) calc(var(--kty-s-1) + var(--kty-lip-small)) var(--kty-s-4);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color)}
.v22--home .home-btn{min-height:var(--kty-btn-h);padding:0 var(--kty-s-7) var(--kty-lip);border:var(--kty-outline);border-radius:var(--kty-radius);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-amber);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.v22--home .home-btn:hover,.v22--home .home-btn:active{background:var(--home-amber);box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-amber);transform:translateY(var(--kty-press))}
.v22--home .home-btn--sm{min-height:var(--kty-btn-h-sm);padding:0 var(--kty-s-5) var(--kty-lip-small);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-amber)}
.v22--home .home-find__form .home-btn{min-height:var(--kty-s-9);padding:0 var(--kty-s-5) var(--kty-lip-small);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-amber)}
.v22--home .home-chip{border:var(--kty-outline)}

/* Category tiles: the tile's own ground is the lip; the photo stops above it. */
.v22--home .home-bento__tile{border:var(--kty-outline);background:var(--kty-lip-color);box-shadow:none;transition:transform var(--kty-tap-ms)}
.v22--home .home-bento__tile>img,.v22--home .home-bento__tile::after{inset:0 0 var(--kty-lip) 0;height:calc(100% - var(--kty-lip))}
.v22--home .home-bento__t{bottom:calc(var(--kty-s-4) + var(--kty-lip))}
.v22--home .home-bento__tile:hover{transform:translateY(var(--kty-press))}

/* Guides and latest: the photo sits flush on top of the card, the words have their own padding. */
.v22--home .home-mag{gap:var(--kty-s-9)}
.v22--home .home-mag__lead{gap:var(--kty-s-2);padding-right:0}
.v22--home .home-mag__img{margin:0;border-radius:0}
.v22--home .home-mag__title{padding:var(--kty-s-4) var(--kty-s-6) 0}
.v22--home .home-mag__line{padding-inline:var(--kty-s-6)}
.v22--home .home-mag__go{padding:0 var(--kty-s-6) var(--kty-s-5)}
.v22--home .home-mag__list{padding-left:0}
.v22--home .home-latest__card{gap:0}
.v22--home .home-latest__img{margin:0;border-radius:0}
.v22--home .home-latest__date{padding:var(--kty-s-4) var(--kty-s-5) var(--kty-s-1)}
.v22--home .home-latest__t{padding:0 var(--kty-s-5) var(--kty-s-5)}
@media (max-width:900px){.v22--home .home-mag{gap:0}}

/* Featured plants: one row moved by two round buttons, dots under it, no visible scrollbar. */
.v22--home .home-car{position:relative}
.v22--home .home-plants{display:flex;gap:var(--kty-s-4);padding-block:var(--kty-s-1);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.v22--home .home-plants::-webkit-scrollbar{display:none}
.v22--home .home-plants>li{flex:0 0 calc((100% - 5 * var(--kty-s-4)) / 6);scroll-snap-align:start}
.v22--home .home-car__btn{position:absolute;top:calc(50% - var(--kty-s-7));z-index:1;display:none;place-items:center;width:var(--kty-icon-btn);height:var(--kty-icon-btn);padding:0 0 var(--kty-lip-small);border:var(--kty-outline);border-radius:50%;background:var(--kty-paper);color:var(--kty-bg-dark);font-size:1.25rem;line-height:1;cursor:pointer;box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.v22--home .home-car.is-ready .home-car__btn{display:grid}
.v22--home .home-car.is-static .home-car__btn{display:none}
.v22--home .home-car__btn--prev{left:calc(-1 * min(var(--kty-s-6),var(--kty-gutter)))}
.v22--home .home-car__btn--next{right:calc(-1 * min(var(--kty-s-6),var(--kty-gutter)))}
.v22--home .home-car__btn:hover:not(:disabled){box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-color);transform:translateY(var(--kty-lip-press))}
.v22--home .home-car__btn:disabled{border-color:var(--kty-line-strong);color:var(--kty-line-strong);cursor:default}
.v22--home .home-car__dots{display:flex;justify-content:center;gap:var(--kty-s-2);margin-top:var(--kty-s-5)}
.v22--home .home-car__dots span{width:var(--kty-s-3);height:var(--kty-s-3);border-radius:50%;background:var(--kty-line-strong)}
.v22--home .home-car__dots span.is-on{background:var(--home-amber)}
@media (max-width:1023px){.v22--home .home-plants>li{flex-basis:calc((100% - 2 * var(--kty-s-4)) / 3)}}
@media (max-width:560px){.v22--home .home-plants>li{flex-basis:calc((100% - var(--kty-s-4)) / 2)}.v22--home .home-car__btn--prev{left:calc(-1 * var(--kty-s-3))}.v22--home .home-car__btn--next{right:calc(-1 * var(--kty-s-3))}}

/* Hub pages (owner 2026-11-08: stacked heroes, layouts varied by each page's goal, card and button shapes from Tossless and KnowDogHub). Section 8 rules stay: headings above their visual, no text on photos. */
.v22--hub :is(.v-card,.v-pair,.v-feature,.v-step,.v-need){border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.v22--hub :is(.v-card,.v-pair,.v-step){padding-bottom:var(--kty-lip)}
.v22--hub :is(.v-card,.v-pair,.v-need):hover{box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-color);transform:translateY(var(--kty-press));text-decoration:none}
.v22--hub .btn:not(.btn--ghost){border:var(--kty-outline);padding-bottom:var(--kty-lip-small);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-forest);transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
.v22--hub .btn:not(.btn--ghost):hover{box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-forest);transform:translateY(var(--kty-lip-press))}
.v22--hub .surf--white .btn--ghost,.v22--hub .surf--tint .btn--ghost{border:var(--kty-outline);padding-bottom:var(--kty-lip-small);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color)}

/* Centred stack */
.v22--hub .v-head--center .v-head__in{max-width:var(--kty-w-brand);margin-inline:auto;text-align:center}
.v22--hub .v-head--center .breadcrumb ol,.v22--hub .v-head--center .v-acts{justify-content:center}

/* Plant hub hero: the cover whole at the left, two more plants stacked at the right. */
.v22--hub .v-mosaic{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--kty-s-4);margin-top:var(--kty-s-8)}
.v22--hub .v-mosaic>.v-cover{margin:0}
.v22--hub .v-mosaic__col{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:var(--kty-s-4);min-height:0}
.v22--hub .v-mosaic__side{position:relative;display:block;min-height:0;overflow:hidden;border-radius:var(--kty-radius);background:var(--kty-bg-tint)}
.v22--hub .v-mosaic__side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.v22--hub .v-mosaic__side:hover img{transform:scale(1.04)}
@media (max-width:640px){.v22--hub .v-mosaic{grid-template-columns:minmax(0,1fr);gap:var(--kty-s-3)}.v22--hub .v-mosaic__col{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:var(--kty-s-3)}.v22--hub .v-mosaic__side{aspect-ratio:3 / 2}}

/* Guides hub hero: three real guides in a row under the centred words. */
.v22--hub .v-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-4);margin-top:var(--kty-s-8)}
.v22--hub .v-strip>a{display:block;aspect-ratio:3 / 2;overflow:hidden;border-radius:var(--kty-radius);background:var(--kty-bg-tint)}
.v22--hub .v-strip img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.v22--hub .v-strip a:hover img{transform:scale(1.04)}
@media (max-width:640px){.v22--hub .v-strip{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.v22--hub .v-strip>a.v-strip__third{display:none}}

/* Topic hub hero: one wide shallow photo. */
.v22--hub .v-banner{margin-top:var(--kty-s-8);aspect-ratio:21 / 8;overflow:hidden;border-radius:var(--kty-radius);background:var(--kty-bg-tint)}
.v22--hub .v-banner img{display:block;width:100%;height:100%;object-fit:cover}
.v22--hub .v-banner--low img{object-position:50% 100%}
@media (max-width:640px){.v22--hub .v-banner{aspect-ratio:3 / 2}}

/* Compare hub hero: one large pair. */
.v22--hub .v-pair--hero{max-width:var(--kty-w-brand);margin:var(--kty-s-8) auto 0}
.v22--hub .v-pair--hero .v-pair__side{height:clamp(180px,26vw,340px)}
.v22--hub .v-pair--hero .v-pair__title{font-family:var(--kty-font-display);font-size:var(--kty-h3);font-weight:600}

/* Problems hub hero: six symptoms as round photos. */
.v22--hub .v-symptoms{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--kty-s-5);margin:var(--kty-s-8) 0 0;padding:0;list-style:none}
.v22--hub .v-symptoms>li{min-width:0;margin:0}
.v22--hub .v-symptoms a{display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-3);color:var(--kty-ink);text-align:center}
.v22--hub .v-symptoms a:hover{text-decoration:none}
.v22--hub .v-symptoms a:hover .v-symptoms__t{text-decoration:underline}
.v22--hub .v-symptoms__img{display:block;width:min(136px,100%);aspect-ratio:1;overflow:hidden;border:var(--kty-outline);border-radius:50%;background:var(--kty-bg-tint)}
.v22--hub .v-symptoms__img img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.v22--hub .v-symptoms__t{font-family:var(--kty-font-display);font-size:var(--kty-body);font-weight:600;line-height:1.25}
@media (max-width:900px){.v22--hub .v-symptoms{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Choice tiles: purposes and guide topics. */
.v22--hub .v-needs{display:grid;gap:var(--kty-s-4)}
.v22--hub .v-needs.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v22--hub .v-needs.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.v22--hub .v-need{display:flex;align-items:center;justify-content:space-between;gap:var(--kty-s-4);min-width:0;padding:var(--kty-s-5) var(--kty-s-5) calc(var(--kty-s-5) + var(--kty-lip));color:var(--kty-ink)}
.v22--hub .v-need>i{flex:none;color:var(--kty-bg-leaf);font-size:1.25rem}
.v22--hub .v-need__t{margin:0;font-size:var(--kty-lead);line-height:1.25}
.v22--hub .v-need--icon{justify-content:flex-start;align-items:flex-start}
.v22--hub .v-need__icon{display:grid;place-items:center;flex:none;width:var(--kty-s-9);height:var(--kty-s-9);border-radius:50%;background:var(--kty-bg-sage);color:var(--kty-bg-leaf);font-size:1.5rem}
.v22--hub .v-need__text{display:flex;flex-direction:column;gap:var(--kty-s-1);min-width:0}
.v22--hub .v-need__meta{font-size:var(--kty-small);line-height:1.45;color:var(--kty-mute)}
@media (max-width:900px){.v22--hub .v-needs.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.v22--hub .v-needs.cols-3,.v22--hub .v-needs.cols-2{grid-template-columns:minmax(0,1fr)}}

/* Learning path: three numbered stops on one line. */
.v22--hub .v-path{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-6);margin:0;padding:0;list-style:none;counter-reset:vpath}
.v22--hub .v-path>li{margin:0;counter-increment:vpath}
.v22--hub .v-path>li>a{display:flex;flex-direction:column;gap:var(--kty-s-1);color:var(--kty-ink)}
.v22--hub .v-path>li>a::before{content:counter(vpath);display:grid;place-items:center;width:var(--kty-s-9);height:var(--kty-s-9);margin-bottom:var(--kty-s-3);border:var(--kty-outline);border-radius:50%;background:var(--kty-paper);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;line-height:1}
.v22--hub .v-path__t{margin:0;font-size:var(--kty-h3);line-height:1.2}
.v22--hub .v-path__meta{font-size:var(--kty-small)}
@media (max-width:640px){.v22--hub .v-path{grid-template-columns:minmax(0,1fr)}}
.v22--hub .v-pair__title{text-wrap:balance}
.v22--hub .v-pair__body{gap:var(--kty-s-2);padding-inline:var(--kty-s-4)}

/* Diagrams (src/SiteFacts.php): every value comes from the database, in plain HTML. Shared by hubs and brand pages. */
.d-w-5{width:5%}.d-w-10{width:10%}.d-w-15{width:15%}.d-w-20{width:20%}.d-w-25{width:25%}.d-w-30{width:30%}.d-w-35{width:35%}.d-w-40{width:40%}.d-w-45{width:45%}.d-w-50{width:50%}.d-w-55{width:55%}.d-w-60{width:60%}.d-w-65{width:65%}.d-w-70{width:70%}.d-w-75{width:75%}.d-w-80{width:80%}.d-w-85{width:85%}.d-w-90{width:90%}.d-w-95{width:95%}.d-w-100{width:100%}
:is(.v22--hub,.v22--brand) .d-subhead{margin:var(--kty-s-8) 0 var(--kty-s-4);font-size:var(--kty-h3);line-height:1.25}
:is(.v22--hub,.v22--brand) .d-after{margin-top:var(--kty-s-6)}
:is(.v22--hub,.v22--brand) .d-bars{display:grid;gap:var(--kty-s-3);margin:0;padding:0;list-style:none}
:is(.v22--hub,.v22--brand) .d-bars>li{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr) minmax(0,5.5rem);align-items:center;gap:var(--kty-s-4);margin:0}
:is(.v22--hub,.v22--brand) .d-bars a,:is(.v22--hub,.v22--brand) .d-bars__l{font-weight:600;color:var(--kty-ink);overflow-wrap:anywhere}
:is(.v22--hub,.v22--brand) .d-bars a{display:inline-flex;align-items:center;min-height:var(--kty-s-9)}
:is(.v22--hub,.v22--brand) .d-bars__track{display:block;height:var(--kty-s-5);overflow:hidden;border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper)}
:is(.v22--hub,.v22--brand) .d-bars__fill{display:block;height:100%;background:var(--kty-bg-leaf)}
:is(.v22--hub,.v22--brand) .d-bars__v{font-size:var(--kty-small);font-weight:600;text-align:right}
@media (max-width:640px){:is(.v22--hub,.v22--brand) .d-bars>li{grid-template-columns:minmax(0,1fr) auto;gap:var(--kty-s-1) var(--kty-s-3)}:is(.v22--hub,.v22--brand) .d-bars__track{grid-column:1/-1;grid-row:2}}
:is(.v22--hub,.v22--brand) .d-stack{display:flex;height:var(--kty-s-8);overflow:hidden;border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper)}
:is(.v22--hub,.v22--brand) .d-stack__p{display:block;flex:1 1 auto;height:100%}
:is(.v22--hub,.v22--brand) .d-tone-1{background:var(--kty-bg-leaf)}
:is(.v22--hub,.v22--brand) .d-tone-2{background:var(--kty-bg-sun)}
:is(.v22--hub,.v22--brand) .d-tone-3{background:var(--kty-bg-dark)}
:is(.v22--hub,.v22--brand) .d-tone-4{background:var(--kty-line-strong)}
:is(.v22--hub,.v22--brand) .d-legend{display:flex;flex-wrap:wrap;gap:var(--kty-s-2) var(--kty-s-7);margin:var(--kty-s-4) 0 0;padding:0;list-style:none}
:is(.v22--hub,.v22--brand) .d-legend>li{display:flex;align-items:center;gap:var(--kty-s-2);margin:0;font-size:var(--kty-small)}
:is(.v22--hub,.v22--brand) .d-dot{flex:none;width:var(--kty-s-4);height:var(--kty-s-4);border:var(--kty-outline);border-radius:50%}
:is(.v22--hub,.v22--brand) .d-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-4);margin:0;padding:0;list-style:none}
:is(.v22--hub,.v22--brand) .d-stats>li{display:flex;flex-direction:column;gap:var(--kty-s-1);margin:0;padding:var(--kty-s-5) var(--kty-s-5) calc(var(--kty-s-5) + var(--kty-lip));border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color)}
:is(.v22--hub,.v22--brand) .d-stats strong{font-family:var(--kty-font-display);font-size:var(--kty-h2);font-weight:700;line-height:1.05;color:var(--kty-ink)}
:is(.v22--hub,.v22--brand) .d-stats span{font-size:var(--kty-small);color:var(--kty-mute)}
@media (max-width:560px){:is(.v22--hub,.v22--brand) .d-stats{grid-template-columns:minmax(0,1fr)}}

/* Flow: numbered discs joined by arrows; a column with downward arrows on small screens. */
:is(.v22--hub,.v22--brand) .d-flow{display:grid;gap:var(--kty-s-7);margin:0;padding:0;list-style:none}
:is(.v22--hub,.v22--brand) .d-flow--2{grid-template-columns:repeat(2,minmax(0,1fr))}
:is(.v22--hub,.v22--brand) .d-flow--3{grid-template-columns:repeat(3,minmax(0,1fr))}
:is(.v22--hub,.v22--brand) .d-flow--4{grid-template-columns:repeat(4,minmax(0,1fr))}
:is(.v22--hub,.v22--brand) .d-flow--5{grid-template-columns:repeat(5,minmax(0,1fr))}
:is(.v22--hub,.v22--brand) .d-flow--6{grid-template-columns:repeat(6,minmax(0,1fr))}
:is(.v22--hub,.v22--brand) .d-flow__i{position:relative;display:flex;flex-direction:column;gap:var(--kty-s-3);min-width:0;margin:0}
:is(.v22--hub,.v22--brand) .d-flow__c{display:grid;place-items:center;width:var(--kty-s-9);height:var(--kty-s-9);border:var(--kty-outline);border-radius:50%;background:var(--kty-bg-sun);color:var(--kty-bg-dark);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;line-height:1}
:is(.v22--hub,.v22--brand) .d-flow__i::after{content:"";position:absolute;top:calc(var(--kty-s-9) / 2 - 1px);left:calc(var(--kty-s-9) + var(--kty-s-2));right:calc(-1 * var(--kty-s-5));height:2px;background:var(--kty-bg-dark)}
:is(.v22--hub,.v22--brand) .d-flow__i.is-last::after,:is(.v22--hub,.v22--brand) .d-flow__i.is-row-end::after{display:none}
:is(.v22--hub,.v22--brand) .d-flow__n{display:flex;flex:1;flex-direction:column;gap:var(--kty-s-1);min-width:0;padding:var(--kty-s-4) var(--kty-s-4) calc(var(--kty-s-4) + var(--kty-lip));border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color);color:var(--kty-ink)}
:is(.v22--hub,.v22--brand) a.d-flow__n{transition:transform var(--kty-tap-ms),box-shadow var(--kty-tap-ms)}
:is(.v22--hub,.v22--brand) a.d-flow__n:hover{box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-color);transform:translateY(var(--kty-press));text-decoration:none}
:is(.v22--hub,.v22--brand) .d-flow__t{margin:0;font-size:var(--kty-lead);line-height:1.25;color:var(--kty-ink)}
.v22 :is(.v22--hub,.v22--brand) .d-flow__x,:is(.v22--hub,.v22--brand) .d-flow__x{font-size:var(--kty-small);line-height:1.45;color:var(--kty-ink-2)}
.v22.v22--hub .surf--forest .d-flow__n{border-color:var(--kty-hair-dark);background:transparent;box-shadow:none;padding-bottom:var(--kty-s-4)}
.v22.v22--hub .surf--forest .d-flow__x{color:var(--kty-mute)}
.v22.v22--hub .surf--forest .d-flow__t{color:var(--kty-ink-on-dark)}
.v22.v22--hub .surf--forest .d-flow__i::after{background:var(--kty-bg-sun)}
@media (max-width:900px){
  :is(.v22--hub,.v22--brand) :is(.d-flow--2,.d-flow--3,.d-flow--4,.d-flow--5,.d-flow--6){grid-template-columns:minmax(0,1fr);gap:var(--kty-s-6)}
  :is(.v22--hub,.v22--brand) .d-flow__i{flex-direction:row;align-items:flex-start}
  :is(.v22--hub,.v22--brand) .d-flow__c{flex:none}
  :is(.v22--hub,.v22--brand) .d-flow__i::after,:is(.v22--hub,.v22--brand) .d-flow__i.is-row-end::after{display:block;top:var(--kty-s-10);left:calc(var(--kty-s-9) / 2 - 1px);right:auto;bottom:calc(-1 * var(--kty-s-6));width:2px;height:auto}
  :is(.v22--hub,.v22--brand) .d-flow__i.is-last::after{display:none}
}

/* Tables that turn into labelled blocks on a phone: never a sideways scroll. */
.v22--hub :is(.d-matrix,.d-versus){width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper)}
.v22--hub :is(.d-matrix,.d-versus) :is(th,td){padding:var(--kty-s-4);border-bottom:var(--kty-rule) solid var(--kty-hair);text-align:left;vertical-align:top;color:var(--kty-ink)}
.v22--hub :is(.d-matrix,.d-versus) thead :is(th,td){background:var(--kty-bg-dark);color:var(--kty-ink-on-dark);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600}
.v22--hub :is(.d-matrix,.d-versus) tbody th{width:18%;font-family:var(--kty-font-display);font-weight:600}
.v22--hub .d-matrix__n{display:block;font-family:var(--kty-font-display);font-size:var(--kty-h2);line-height:1}
.v22--hub .d-matrix ul{margin:var(--kty-s-2) 0 0;padding:0;list-style:none}
.v22--hub .d-matrix li{margin:0;font-size:var(--kty-small);line-height:1.5}
.v22--hub .d-matrix__none{font-size:var(--kty-small);color:var(--kty-mute)}
@media (max-width:767px){
  .v22--hub :is(.d-matrix,.d-versus),.v22--hub :is(.d-matrix,.d-versus) :is(tbody,tr,th,td){display:block;width:auto}
  .v22--hub :is(.d-matrix,.d-versus) thead{display:none}
  .v22--hub :is(.d-matrix,.d-versus) tbody th{background:var(--kty-bg-tint)}
  .v22--hub :is(.d-matrix,.d-versus) tbody td::before{content:attr(data-col);display:block;margin-bottom:var(--kty-s-1);font-size:var(--kty-small);font-weight:700}
}

/* A year of yard work: four seasons, the current one marked. */
.v22--hub .d-year{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kty-s-4)}
.v22--hub .d-year__s{min-width:0;padding:var(--kty-s-5) var(--kty-s-5) calc(var(--kty-s-5) + var(--kty-lip));border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color)}
.v22--hub .d-year__s.is-now{background:var(--kty-bg-sage)}
.v22--hub .d-year__t{display:flex;align-items:center;justify-content:space-between;margin:0 0 var(--kty-s-3);font-size:var(--kty-h3)}
.v22--hub .d-year__t span{padding:0 var(--kty-s-2);border:var(--kty-outline);border-radius:var(--kty-r-sm);background:var(--kty-paper);font-family:var(--kty-font-body);font-size:var(--kty-small);font-weight:700}
.v22--hub .d-year ul{display:grid;gap:var(--kty-s-3);margin:0;padding:0;list-style:none}
.v22--hub .d-year li{margin:0;font-size:var(--kty-small);line-height:1.45;color:var(--kty-ink)}
@media (max-width:1023px){.v22--hub .d-year{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.v22--hub .d-year{grid-template-columns:minmax(0,1fr)}}

/* Brand pages share the raised card shape. */
.v22--brand :is(.b-card,.b-author){border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-paper);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color);padding-bottom:calc(var(--kty-s-5) + var(--kty-lip))}
.v22.v22--hub .surf--forest .d-flow__c{color:var(--kty-bg-dark)}
:is(.v22--hub,.v22--brand) .d-tone-5{background:var(--kty-accent)}


/* Editorial story card: photo on one side, the page's own words, its care facts and one button on the other. */
.v22--hub .v-feature--story{overflow:hidden}
.v22--hub .v-feature__sci{margin:0;font-style:italic;color:var(--kty-mute)}
.v22--hub .v-feature__line{margin:0;line-height:1.6;color:var(--kty-ink-2)}
.v22--hub .v-feature__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-s-3) var(--kty-s-5);margin:0;padding:var(--kty-s-4) 0 0;border-top:var(--kty-rule) solid var(--kty-hair)}
.v22--hub .v-feature__stats>div{min-width:0}
.v22--hub .v-feature__stats dt{font-size:var(--kty-small);font-weight:700;color:var(--kty-ink)}
.v22--hub .v-feature__stats dd{margin:0;font-size:var(--kty-small);line-height:1.45;color:var(--kty-mute)}
.v22--hub .v-feature--story .v-feature__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--kty-s-3)}
.v22--hub .d-story{max-width:var(--kty-w-read);margin:0 0 var(--kty-s-6);line-height:1.6}
.v22--hub .d-gap{margin-bottom:var(--kty-s-8)}
@media (max-width:560px){.v22--hub .v-feature__stats{grid-template-columns:minmax(0,1fr)}}

/* Season cards: a photo on top, the tasks under it. */
.v22--hub .d-year__s{overflow:hidden;padding:0 0 var(--kty-lip)}
.v22--hub .d-year__img{display:block;width:100%;height:auto;aspect-ratio:3 / 2;object-fit:cover;border-radius:0}
.v22--hub .d-year__b{padding:var(--kty-s-5)}

/* Brand section photo: full column width, above the card it belongs to. */
.v22--brand .b-photo{margin:0 0 var(--kty-s-6)}
.v22--brand .b-photo img{display:block;width:100%;height:auto;aspect-ratio:21 / 9;object-fit:cover;border-radius:var(--kty-radius)}
.v22--hub .v-feature__title a{display:inline-flex;align-items:center;min-height:var(--kty-s-9)}
.v22--brand .b-head__in>.b-photo--head{width:100%;max-width:var(--kty-w-read);margin:var(--kty-s-8) 0 0}
.v22--brand .b-photo--whole img{aspect-ratio:auto}

/* ---- v23 hubs (owner 2026-11-11, comps chosen from docs/design/v23/): a hub root carrying .v23 is centred, warm and built from five bands
   (white, sun, white, forest, white). The pattern runs the full width of the band behind the content. Every component below is one idea, one row. ---- */
.v23{--kty-outline:var(--kty-outline-w) solid var(--kty-ink);--kty-lip-color:var(--kty-lip-warm)}
.v23 .v-head .v-head__in{max-width:var(--kty-w-brand);margin-inline:auto;text-align:center}
.v23 .v-head .breadcrumb ol,.v23 .v-head .v-acts{justify-content:center}
.v23 .v-head .v-head__in .lead{margin-inline:auto}
.v23 .v-band>.v-wrap>:is(h2,.v-lead,.v-count,.v-tip,.v-more,.v-src),.v23 .v-sub>h2,.v23 .v-sub>.v-more{margin-inline:auto;text-align:center}
.v23 .v-band>.v-wrap>:is(.v-rows,.v-acc,.v-about,.v-notice),.v23 .v-sub>:is(.v-about,.v-notice){max-width:var(--kty-w-read);margin-inline:auto}
.v23 .v-band>.v-wrap>*+h2{margin-top:var(--kty-s-12)}
.v23 .v-sub{margin-top:var(--kty-s-11)}
.v23 .v-sub>h2+*{margin-top:var(--kty-head-gap)}
.v23 .v-sub>*+.v-notice,.v23 .v-sub>*+.v-about{margin-top:var(--kty-s-8)}
.v23 .btn:not(.btn--ghost){border-color:var(--kty-bg-rust);background:var(--kty-bg-rust);color:#fff}
.v23 .btn:not(.btn--ghost):hover{border-color:var(--kty-rust-deep);background:var(--kty-rust-deep);color:#fff}
.v23 .btn.btn--ghost{border-color:var(--kty-ink);color:var(--kty-ink)}
.v23 .btn.btn--ghost:hover{border-color:var(--kty-ink);background:var(--kty-gold-tint);color:var(--kty-ink)}
.v23 .surf--forest .v-acc,.v23 .surf--forest .v-acc details{border-color:var(--kty-line)}
.v23 .surf--forest .v-acc summary>i{color:var(--kty-ink-on-dark)}
.v23 .surf--forest .v-acc__a a{color:var(--kty-gold)}
.v23 .v-band.surf--forest .v-acc--cards details :is(summary,h3,p,li,span,strong,a){color:var(--kty-ink)}
.v23 .surf--forest .v-acc--cards summary>i{color:var(--kty-ink)}
.v23 .v-band.surf--forest .v-acc--cards details .v-acc__a a{color:var(--kty-bg-rust)}
.v23 .v-band.surf--forest .v-notice :is(strong,p){color:var(--kty-ink)}
.v23 .surf--sun .hub-pagination__page.is-current{color:var(--kty-ink-on-dark)}
.v23 .d-matrix a{display:inline-flex;align-items:center;min-height:var(--kty-s-9)}
.v23 .surf--forest .v-figs a{display:inline-flex;align-items:center;justify-content:center;min-height:var(--kty-s-9)}
.v23 .v-circles>li.v-circles__row,.v23 .v-circles[class*="cols-"]>li.v-circles__row{flex:0 0 100%;max-width:var(--kty-w-read)}
.v23 .hub-filter-disclosure{max-width:var(--kty-w-brand);margin-inline:auto;border:0;background:none;box-shadow:none}
@media (min-width:901px){.v23 .hub-filter-disclosure>summary{display:none}}
.v23 .hub-filter-bar{padding:0}
.v23 .hub-filter-help{border-top:0;text-align:center}
.v23 .hub-filter-help>summary{justify-content:center}
.v23 .hub-catalog__note{margin-inline:auto;text-align:center}
.v23 .hub-filter-disclosure+:is(.v-circles,.v-grid,.v-rows,.v-feature,.hub-active-filters){margin-top:var(--kty-s-8)}
.v23 .v-band>.v-wrap>*+.v-about{margin-top:var(--kty-s-9)}
.v23 .v-band>.v-wrap>.v-glance{margin-top:var(--kty-s-12)}
.v23 .v-wrap>.v-glance>h2{text-align:center}
.v23 .v-wrap>.v-glance>h2+*{margin-top:var(--kty-head-gap)}
.v23 .v-wrap>.v-glance>.v-about{max-width:var(--kty-w-read);margin-inline:auto}
.v23 .v-band>.v-wrap>.v-feature{max-width:var(--kty-w-brand);margin-inline:auto}
.v23 .v-band>.v-wrap>.v-feature .v-feature__body{align-items:center;padding:var(--kty-s-7);text-align:center}
.v23 .v-band>.v-wrap>.v-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap);margin-top:var(--kty-head-gap)}
.v23 .v-band>.v-wrap>.v-links a{justify-content:center;padding:var(--kty-s-6) var(--kty-s-4);border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-bg-white);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color);color:var(--kty-ink);text-align:center}
.v23 .v-iconrow--cards>li{padding:var(--kty-s-7) var(--kty-s-5);border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-bg-white);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color)}
.v23 .v-iconrow--cards .v-iconrow__i{width:var(--kty-s-11);height:var(--kty-s-11)}

/* One photo with its title beneath, no card (the entry points under a hub title). */
.v23 .v-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kty-grid-gap)}
.v23 .v-photos.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v23 .v-photo{display:block;color:inherit;text-align:center;text-decoration:none}
.v23 .v-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:var(--kty-outline);border-radius:var(--kty-radius)}
.v23 .v-photo__t{margin:var(--kty-s-3) 0 0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3}
.v23 .v-photo:hover .v-photo__t{text-decoration:underline;text-underline-offset:.15em}

/* Round photos with a name and one short line, centred so a short last row stays balanced. */
.v23 .v-circles{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--kty-s-8) var(--kty-grid-gap);margin:0;padding:0;list-style:none}
.v23 .v-circles>li{flex:0 0 calc((100% - 3 * var(--kty-grid-gap)) / 4);min-width:0}
.v23 .v-circles.cols-3>li{flex-basis:calc((100% - 2 * var(--kty-grid-gap)) / 3)}
.v23 .v-circles.cols-5>li{flex-basis:calc((100% - 4 * var(--kty-grid-gap)) / 5)}
.v23 .v-circles.cols-6>li{flex-basis:calc((100% - 5 * var(--kty-grid-gap)) / 6)}
.v23 .v-circles a{display:flex;flex-direction:column;align-items:center;color:inherit;text-align:center;text-decoration:none}
.v23 .v-circles img{display:block;width:100%;max-width:var(--kty-orb);height:auto;aspect-ratio:1;object-fit:cover;border:var(--kty-s-1) solid var(--kty-bg-white);border-radius:50%}
.v23 .v-circles.cols-5 img,.v23 .v-circles.cols-6 img{max-width:var(--kty-orb-sm)}
.v23 .v-circles__t{max-width:100%;margin:var(--kty-s-3) 0 0;overflow-wrap:anywhere;text-wrap:balance;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.25}
.v23 .v-circles__n{margin-top:var(--kty-s-1);font-size:var(--kty-small);line-height:1.35}
.v23 .v-circles a:hover .v-circles__t{text-decoration:underline;text-underline-offset:.15em}

/* A row of photos standing on one line, taller for a bigger value. */
.v23 .v-rise{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--kty-s-5);margin:0;padding:0;list-style:none}
.v23 .v-rise>li{display:flex;flex-direction:column;justify-content:flex-end}
.v23 .v-rise a{display:block;color:inherit;text-align:center;text-decoration:none}
.v23 .v-rise__img{display:block;height:var(--rise);overflow:hidden;border:var(--kty-outline);border-radius:var(--kty-radius)}
.v23 .v-rise__img img{display:block;width:100%;height:100%;object-fit:cover}
.v23 .v-rise__t{display:block;margin-top:var(--kty-s-3);font-family:var(--kty-font-display);font-weight:600;line-height:1.25}
.v23 .v-rise__v{display:block;margin-top:var(--kty-s-1);font-size:var(--kty-small);line-height:1.35}
.v23 .v-rise a:hover .v-rise__t{text-decoration:underline;text-underline-offset:.15em}

/* Headline figures on the forest band: an icon, a gold figure, one label. */
.v23 .v-figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kty-s-8) var(--kty-grid-gap);margin:0;padding:0;list-style:none;text-align:center}
.v23 .v-figs__i{display:inline-flex;align-items:center;justify-content:center;width:var(--kty-s-11);height:var(--kty-s-11);border-radius:50%;background:var(--kty-gold-tint);font-size:1.625rem}
.v23 .surf--forest .v-figs .v-figs__i{color:var(--kty-ink)}
.v23 .surf--forest .v-figs .v-figs__n{display:block;margin-top:var(--kty-s-3);color:var(--kty-gold);font-family:var(--kty-font-display);font-size:var(--kty-h2);font-weight:700;line-height:1.15}
.v23 .surf--forest .v-figs .v-figs__l,.v23 .surf--forest .v-figs a{display:block;margin-top:var(--kty-s-1);color:var(--kty-ink-on-dark)}
.v23 .surf--forest .v-figs .v-figs__n--long{font-size:var(--kty-lead);line-height:1.3}
.v23 .v-figs.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v23 .surf--forest .v-figs+.v-notice{margin-top:var(--kty-s-9)}
.v23 .v-pairset{text-align:center}
.v23 .v-pairset .v-fine{margin-inline:auto}
.v23 .v-pairs{grid-template-columns:repeat(auto-fit,minmax(calc(var(--kty-s-13) * 3),1fr))}
.v23 .v-pairset .v-circles>li{flex-basis:calc((100% - var(--kty-grid-gap)) / 2)}
.v23 :is(.v-sub,.v-band>.v-wrap)>.tool-card{max-width:var(--kty-w-brand);margin-inline:auto}
.v23 .v-zonefilter{justify-content:center}
.v23 .v-head>.v-wrap>.v-sub>.v-notice{max-width:var(--kty-w-read);margin-inline:auto}
.v23 .v-band>.v-wrap>.v-sub{margin-top:0}
.v23 .v-band>.v-wrap>.v-sub+h2{margin-top:var(--kty-s-12)}
.v23 .v-start{max-width:var(--kty-w-read);margin-inline:auto}
.v23 .v-start>h3{text-align:center}
.v23 .v-band>.v-wrap>.v-links>.v-links__h{grid-column:1/-1;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;color:var(--kty-ink);text-align:center}
.v23 .v-circles img,.v23 .v-photo img{background:var(--kty-gold-tint);color:transparent}
.v23 .v-circles__row .v-row{min-height:var(--kty-s-10);padding-block:var(--kty-s-2)}
.v23 .surf--forest .v-figs .v-figs__n--mid{font-size:var(--kty-h3)}
.v23 .v-tiles.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:var(--kty-w-brand);margin-inline:auto}
.v23 .v-figs__s{display:block;margin-top:var(--kty-s-1);font-size:var(--kty-small)}
.v23 .surf--forest .v-figs a:hover{text-decoration:underline;text-underline-offset:.15em}
.v23 .v-figs+.v-about{margin-top:var(--kty-s-9)}
.v23 .v-fold .v-tablecard{margin-top:var(--kty-s-4)}

/* An icon or a number in a pale gold circle over one short title. */
.v23 .v-iconrow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-8) var(--kty-grid-gap);margin:0;padding:0;list-style:none;text-align:center}
.v23 .v-iconrow__i{display:inline-flex;align-items:center;justify-content:center;width:var(--kty-icon-circle);height:var(--kty-icon-circle);border-radius:50%;background:var(--kty-gold-tint);color:var(--kty-ink);font-family:var(--kty-font-display);font-size:1.625rem;font-weight:700}
.v23 .v-iconrow__t{margin:var(--kty-s-3) 0 0;font-size:var(--kty-lead);font-weight:600;line-height:1.3}
.v23 .v-iconrow__x{max-width:32ch;margin:var(--kty-s-1) auto 0;font-size:var(--kty-small);line-height:1.4}

/* Equal outlined link cards: an icon in a pale gold circle over a short title. */
.v23 .v-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap)}
.v23 .v-tile{display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-3);padding:var(--kty-s-7) var(--kty-s-5);border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-bg-white);box-shadow:inset 0 calc(-1 * var(--kty-lip)) 0 var(--kty-lip-color);color:var(--kty-ink);text-align:center;text-decoration:none}
.v23 .v-tile:hover{box-shadow:inset 0 calc(-1 * var(--kty-lip-press)) 0 var(--kty-lip-color);text-decoration:none}
.v23 .v-tile__i{display:inline-flex;align-items:center;justify-content:center;width:var(--kty-icon-circle);height:var(--kty-icon-circle);border-radius:50%;background:var(--kty-gold-tint);font-size:1.625rem}
.v23 .v-tile__t{margin:0;font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:600;line-height:1.3}
.v23 .v-tile__m{font-size:var(--kty-small);line-height:1.35}

/* Numbered path: outlined cards in one row, a chevron between them. */
.v23 .v-path{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--kty-s-7);margin:0;padding:0;list-style:none}
.v23 .v-path>li{position:relative}
.v23 .v-path>li+li::before{content:"\203A";position:absolute;top:50%;left:calc(-1 * var(--kty-s-5));color:var(--kty-ink);font-size:1.5rem;line-height:0}
.v23 .v-path .v-tile{height:100%;padding-inline:var(--kty-s-3)}

/* Outlined question rows. */
.v23 .v-acc.v-acc--cards{display:grid;gap:var(--kty-s-3);border:0}
.v23 .v-acc--cards details{padding-inline:var(--kty-s-5);border:var(--kty-outline);border-radius:var(--kty-radius);background:var(--kty-bg-white);box-shadow:inset 0 calc(-1 * var(--kty-lip-small)) 0 var(--kty-lip-color)}
.v23 .v-acc--cards summary{flex-wrap:wrap;min-height:var(--kty-s-10);padding-block:var(--kty-s-3)}
.v23 .v-acc--cards .v-acc__n{flex:1 1 100%;order:3;min-width:0;margin-top:calc(-1 * var(--kty-s-2))}

/* The 13 USDA zones as one cold-to-hot strip. */
.v23 .v-zones{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:var(--kty-s-1);margin:0;padding:0;list-style:none}
.v23 .v-zones :is(a,span){display:flex;align-items:center;justify-content:center;min-height:var(--kty-s-11);border-radius:var(--kty-radius);font-family:var(--kty-font-display);font-size:var(--kty-lead);font-weight:700;text-decoration:none}
.v23 .v-zones [data-z="1"]{background:var(--kty-zone-1);color:#fff}
.v23 .v-zones [data-z="2"]{background:var(--kty-zone-2);color:#fff}
.v23 .v-zones [data-z="3"]{background:var(--kty-zone-3);color:#fff}
.v23 .v-zones [data-z="4"]{background:var(--kty-zone-4);color:var(--kty-ink)}
.v23 .v-zones [data-z="5"]{background:var(--kty-zone-5);color:var(--kty-ink)}
.v23 .v-zones [data-z="6"]{background:var(--kty-zone-6);color:var(--kty-ink)}
.v23 .v-zones [data-z="7"]{background:var(--kty-zone-7);color:var(--kty-ink)}
.v23 .v-zones [data-z="8"]{background:var(--kty-zone-8);color:var(--kty-ink)}
.v23 .v-zones [data-z="9"]{background:var(--kty-zone-9);color:var(--kty-ink)}
.v23 .v-zones [data-z="10"]{background:var(--kty-zone-10);color:var(--kty-ink)}
.v23 .v-zones [data-z="11"]{background:var(--kty-zone-11);color:var(--kty-ink)}
.v23 .v-zones [data-z="12"]{background:var(--kty-zone-12);color:#fff}
.v23 .v-zones [data-z="13"]{background:var(--kty-zone-13);color:#fff}
.v23 .v-zones a:hover{outline:var(--kty-outline);outline-offset:1px}
.v23 .v-zones__ends{display:flex;justify-content:space-between;gap:var(--kty-s-5);margin:var(--kty-s-3) 0 0;font-size:var(--kty-small)}

@media (max-width:1023px){
  .v23 .v-circles>li,.v23 .v-circles.cols-5>li,.v23 .v-circles.cols-6>li{flex-basis:calc((100% - 2 * var(--kty-grid-gap)) / 3)}
  .v23 .v-figs,.v23 .v-figs.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v23 .v-rise{grid-template-columns:repeat(3,minmax(0,1fr))}
  .v23 .v-path{grid-template-columns:repeat(3,minmax(0,1fr))}
  .v23 .v-zones{grid-template-columns:repeat(7,minmax(0,1fr))}
}
@media (max-width:640px){
  .v23 .v-figs.cols-3{grid-template-columns:minmax(0,1fr)}
  .v23 .v-rise{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v23 .v-rise__img{height:var(--kty-s-13)}
  .v23 .v-photos,.v23 .v-photos.cols-3,.v23 .v-iconrow,.v23 .v-tiles,.v23 .v-tiles.cols-2,.v23 .v-band>.v-wrap>.v-links{grid-template-columns:minmax(0,1fr)}
  .v23 .v-circles>li,.v23 .v-circles.cols-3>li,.v23 .v-circles.cols-5>li,.v23 .v-circles.cols-6>li{flex-basis:calc((100% - var(--kty-grid-gap)) / 2)}
  .v23 .v-path{grid-template-columns:minmax(0,1fr)}
  .v23 .v-path>li+li::before{content:none}
  .v23 .v-rise{gap:var(--kty-s-3)}
}

/* v23 brand block: closes the last white band of every hub. Sizes follow docs/design/v23/brand-approved.webp, scaled to the site column. */
.v23 .v-band>.v-wrap>.v-brand{margin-top:var(--kty-s-12)}
.v23 .v-brand{text-align:center}
.v23 .v-brand__sunny{display:block;width:var(--kty-brand-sunny);height:auto;margin-inline:auto}
.v23 .v-brand>h2{margin:var(--kty-s-3) 0 var(--kty-head-gap);font-size:var(--kty-brand-head);font-weight:800;line-height:1.15}
.v23 .v-brand .v-iconrow{gap:var(--kty-s-6)}
.v23 .v-brand .v-iconrow--cards>li{padding:var(--kty-s-6);border:var(--kty-brand-outline) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);box-shadow:none}
.v23 .v-brand .v-iconrow__i{width:var(--kty-s-12);height:var(--kty-s-12);background:var(--kty-brand-circle);font-size:var(--kty-brand-glyph)}
.v23 .v-brand .v-iconrow__i>i{-webkit-text-stroke:var(--kty-brand-glyph-stroke) currentColor}
.v23 .v-brand .v-iconrow__t{margin-top:var(--kty-s-3);font-size:var(--kty-brand-title);font-weight:800;line-height:1.2}
.v23 .v-brand .v-iconrow__i+.v-iconrow__t{margin-top:var(--kty-s-4)}
.v23 .v-brand .v-iconrow__x{max-width:none;margin-top:var(--kty-s-3);font-size:var(--kty-brand-copy);line-height:1.3;color:var(--kty-ink);text-wrap:balance}
.v23 .v-brand__who{display:grid;grid-template-columns:var(--kty-brand-photo) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:var(--kty-s-6);margin:var(--kty-head-gap) 0 0;text-align:left}
.v23 .v-brand__photo{grid-column:1;grid-row:1/3;width:var(--kty-brand-photo);height:var(--kty-brand-photo);border:var(--kty-brand-outline) solid var(--kty-ink);border-radius:50%;object-fit:cover}
.v23 .v-brand__who p{grid-column:2;grid-row:1;margin:0;font-size:var(--kty-brand-copy);line-height:1.3;color:var(--kty-ink)}
.v23 .v-brand__acts{grid-column:1/-1;grid-row:2;align-self:center;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-4)}
.v23 .v-brand__acts .btn{min-width:var(--kty-brand-btn);min-height:var(--kty-s-9);border:0;border-radius:var(--kty-r-sm);box-shadow:none;font-size:var(--kty-brand-title-sm);font-weight:600}
.v23 .v-brand__link{display:inline-flex;align-items:center;min-height:var(--kty-s-9);margin-top:calc(var(--kty-s-3) * -1);color:var(--kty-ink);font-size:var(--kty-brand-link);font-weight:400;text-decoration:underline;text-underline-offset:.15em}
@media (max-width:640px){
  .v23 .v-brand__who{display:flex;flex-direction:column;align-items:center;gap:var(--kty-s-6);text-align:center}
  .v23 .v-brand__acts{margin-top:0}
}
/* Brand evidence tables fit a phone: tighter cells and words may wrap, so the three columns never run past the card edge. */
@media (max-width:640px){.v22--brand .brand-evidence-table :is(th,td){padding:var(--kty-s-2) var(--kty-s-3);overflow-wrap:anywhere}}

/* v23 five hubs (owner 2026-11-11, comps docs/design/v23/{compare,tools,calendar,safety,topic}-approved.webp). One block per new component. */
.v23 .v-head .v-head__in>h1+:is(.v-find,.v-shot,.v-chooser){margin-top:var(--kty-s-6)}
/* Search box with the button joined to its right edge. */
.v23 .v-find{display:flex;flex-flow:row nowrap;align-items:stretch;max-width:34rem;margin-inline:auto;border:var(--kty-outline-w) solid var(--kty-ink);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);overflow:hidden}
.v23 .v-find>i{align-self:center;margin-left:var(--kty-s-4);font-size:1.5rem;color:var(--kty-ink)}
.v23 .v-find input[type="search"]{flex:1 1 auto;width:auto;min-width:0;min-height:var(--kty-s-10);margin:0;padding:0 var(--kty-s-3);border:0;border-radius:0;background:none;box-shadow:none;font-size:var(--kty-lead);color:var(--kty-ink)}
.v23 .v-find input::placeholder{color:var(--kty-ink-2);opacity:1}
.v23 .v-find input[type="search"]:focus{outline:none}
.v23 .v-find:focus-within{outline:3px solid var(--kty-accent);outline-offset:2px}
.v23 .v-find button{flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--kty-s-12);border:0;background:var(--kty-bg-rust);color:#fff;font-size:1.5rem;cursor:pointer}
.v23 .v-find button:hover{background:var(--kty-rust-deep)}
/* Two overlapping round plant photos with a "vs" disc, the pair name below. */
.v23 .v-duo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-s-8) var(--kty-grid-gap);margin:0;padding:0;list-style:none}
.v23 .v-duo a{display:flex;flex-direction:column;align-items:center;color:var(--kty-ink);text-align:center;text-decoration:none}
.v23 .v-duo__pair{position:relative;display:flex;justify-content:center}
.v23 .v-duo__pair img{width:var(--kty-vs-photo);height:var(--kty-vs-photo);border:var(--kty-s-1) solid var(--kty-bg-white);border-radius:50%;object-fit:cover;background:var(--kty-gold-tint)}
.v23 .v-duo__pair img+.v-duo__b+img{margin-left:calc(var(--kty-vs-overlap) * -1)}
.v23 .v-duo__b{position:absolute;top:50%;left:50%;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--kty-gold-tint);font-family:var(--kty-font-body);font-size:.9375rem;font-weight:800;text-transform:uppercase;transform:translate(-50%,-50%)}
.v23 .v-duo__t{margin:var(--kty-s-4) 0 0;font-size:var(--kty-h3);font-weight:700;line-height:1.25;text-wrap:balance}
.v23 .v-duo a:hover .v-duo__t{text-decoration:underline;text-underline-offset:.15em}
/* Outlined link rows: two small round photos, the name, a rust chevron. */
.v23 .v-pairrows{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--kty-s-4);max-width:var(--kty-w-pairrow);margin:0 auto;padding:0;list-style:none}
.v23 .v-pairrow{display:flex;align-items:center;gap:var(--kty-s-6);min-height:var(--kty-s-12);padding:var(--kty-s-2) var(--kty-s-7);border:var(--kty-brand-outline) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);color:var(--kty-ink);text-decoration:none}
.v23 .v-pairrow:hover{border-bottom-width:calc(var(--kty-lip-brand) - var(--kty-lip-press));transform:translateY(var(--kty-lip-press))}
.v23 .v-pairrow__th{display:flex;flex:none;gap:var(--kty-s-2)}
.v23 .v-pairrow__th img{width:var(--kty-pairrow-thumb);height:var(--kty-pairrow-thumb);border-radius:50%;object-fit:cover;background:var(--kty-gold-tint)}
.v23 .v-pairrow__t{flex:1;margin:0;font-family:var(--kty-font-body);font-size:1.5rem;font-weight:700;line-height:1.25;text-wrap:pretty}
.v23 .v-pairrow>i{flex:none;font-size:1.75rem;color:var(--kty-bg-rust);-webkit-text-stroke:1.5px currentColor}
.v23 .v-pairrows+.pagination{margin-top:var(--kty-s-8)}
/* Icon discs with a label only, on the forest band. */
.v23 .v-iconrow.v-iconrow--bare{max-width:var(--kty-w-iconrow);margin-inline:auto}
.v23 .v-iconrow--bare .v-iconrow__i{width:var(--kty-s-12);height:var(--kty-s-12);background:var(--kty-gold);font-size:2.5rem}
.v23 .v-iconrow--bare .v-iconrow__i>i{-webkit-text-stroke:var(--kty-brand-glyph-stroke) currentColor}
.v23 .v-iconrow--bare .v-iconrow__t{margin-top:var(--kty-s-4);font-family:var(--kty-font-body);font-size:var(--kty-lead);font-weight:600}
.v23 .v-iconrow--bare.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.v23 .surf--forest .v-iconrow--bare .v-iconrow__t{color:var(--kty-ink-on-dark)}
/* Wide outlined photo banner. */
.v23 .v-shot{max-width:var(--kty-w-banner);margin:0 auto}
.v23 .v-shot img{display:block;width:100%;height:auto;aspect-ratio:8/3;object-fit:cover;border:var(--kty-outline-w) solid var(--kty-ink);border-radius:var(--kty-r-lg);background:var(--kty-gold-tint)}
.v23 .v-shot--wide{max-width:var(--kty-w-brand)}
.v23 .v-head .v-head__in>.v-shot+.v-shot__t{max-width:var(--kty-w-banner);margin:var(--kty-s-5) auto 0;font-size:var(--kty-h3);font-weight:700;line-height:1.25;text-wrap:balance}
.v23 .v-shot__t a{color:var(--kty-ink);text-decoration:none}
.v23 .v-shot__t a:hover{text-decoration:underline;text-underline-offset:.15em}
.v23 .v-head .v-head__in>.v-shot__t+.v-acts{margin-top:var(--kty-s-5)}
.v23 .v-shot+.v-acts,.v23 .v-frost+.v-acts{justify-content:center;margin-top:var(--kty-s-5)}
/* Round photos with an icon badge on the lower edge; sans labels. */
.v23 .v-circles__ph{position:relative;display:block;width:100%;max-width:var(--kty-orb)}
.v23 .v-circles__ph>img{max-width:none}
.v23 .v-circles__b{position:absolute;left:50%;bottom:calc(var(--kty-s-6) * -1);display:inline-flex;align-items:center;justify-content:center;width:var(--kty-s-11);height:var(--kty-s-11);border:var(--kty-outline-w) solid var(--kty-ink);border-radius:50%;background:var(--kty-gold-tint);color:var(--kty-ink);font-size:1.75rem;transform:translateX(-50%)}
.v23 .v-circles__ph+.v-circles__t{margin-top:var(--kty-s-8)}
.v23 .v-circles--sans .v-circles__t{font-family:var(--kty-font-body);font-weight:700;text-wrap:pretty}
.v23 .v-circles--sans .v-circles__n{font-size:var(--kty-body)}
.v23 .v-circles--caption .v-circles__t{font-family:var(--kty-font-body);font-size:var(--kty-body);font-weight:600;line-height:1.35;text-wrap:pretty}
.v23 .v-circles--ink img{border-color:var(--kty-ink);border-width:var(--kty-brand-outline)}
/* Four round photos joined by one line through their centers. */
.v23 .v-circles--line{position:relative;isolation:isolate}
.v23 .v-circles--line::before{content:"";position:absolute;top:calc(var(--kty-orb) / 2);left:12.5%;right:12.5%;z-index:-1;height:var(--kty-outline-w);background:var(--kty-ink)}
/* The frost-window strip: a calendar page over a garden photo. */
.v23 .v-frost{position:relative;max-width:var(--kty-w-banner);margin:0 auto;border:var(--kty-outline-w) solid var(--kty-ink);border-radius:var(--kty-r-lg);overflow:hidden}
.v23 .v-frost>img{display:block;width:100%;height:auto;aspect-ratio:8/3;object-fit:cover}
.v23 .v-frost__cal{position:absolute;inset:14% 12%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--kty-s-4);padding:var(--kty-s-7) var(--kty-s-5) var(--kty-s-5);border-radius:var(--kty-r-sm);background:#FFF8E8 radial-gradient(circle at 50% 50%,var(--kty-rust-deep) 0 3px,transparent 4px) 0 var(--kty-s-2)/var(--kty-s-6) var(--kty-s-4) repeat-x;box-shadow:0 2px 0 var(--kty-lip-warm)}
.v23 .v-frost__l{max-width:6rem;font-family:var(--kty-font-body);font-size:var(--kty-body);font-weight:700;line-height:1.2;color:var(--kty-ink);text-align:center}
.v23 .v-frost__grid{position:relative;height:100%;min-height:var(--kty-s-12);border:1px solid var(--kty-hair);background:linear-gradient(var(--kty-bg-sage),var(--kty-bg-sage)) 0 50%/100% 34% no-repeat,repeating-linear-gradient(90deg,var(--kty-hair) 0 1px,transparent 1px calc(100% / 13)),repeating-linear-gradient(0deg,var(--kty-hair) 0 1px,transparent 1px calc(100% / 3))}
.v23 .v-frost__grid::before,.v23 .v-frost__grid::after{content:"";position:absolute;top:50%;width:var(--kty-s-4);height:var(--kty-s-4);border-radius:50%;background:var(--kty-bg-leaf);transform:translateY(-50%)}
.v23 .v-frost__grid::before{left:calc(var(--kty-s-2) * -1)}
.v23 .v-frost__grid::after{right:calc(var(--kty-s-2) * -1)}
/* Numbered gold discs joined by one line, captions under them (forest band). */
.v23 .v-numline{position:relative;display:grid;gap:var(--kty-grid-gap);margin:0;padding:0;list-style:none;text-align:center;isolation:isolate}
.v23 .v-numline.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v23 .v-numline.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.v23 .v-numline::before{content:"";position:absolute;top:calc(var(--kty-s-11) / 2 - 1.5px);left:12.5%;right:12.5%;z-index:-1;height:3px;background:var(--kty-gold)}
.v23 .v-numline.cols-3::before{left:16.7%;right:16.7%}
.v23 .v-numline__n{display:inline-flex;align-items:center;justify-content:center;width:var(--kty-s-11);height:var(--kty-s-11);border-radius:50%;background:var(--kty-gold);color:var(--kty-ink);font-family:var(--kty-font-display);font-size:1.75rem;font-weight:800}
.v23 .v-numline__t{display:block;max-width:16rem;margin:var(--kty-s-4) auto 0;font-size:var(--kty-lead);line-height:1.35;text-wrap:balance}
.v23 .surf--forest .v-numline__t{color:var(--kty-ink-on-dark)}
.v23 .v-band.surf--forest .v-numline__n{color:var(--kty-ink)}
/* Outlined job cards: an icon disc at the left and one label. */
.v23 .v-jobs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap);margin:0;padding:0;list-style:none}
.v23 .v-jobs.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:var(--kty-w-brand);margin-inline:auto}
.v23 .v-job{display:flex;align-items:center;gap:var(--kty-s-5);height:100%;min-height:var(--kty-s-13);padding:var(--kty-s-3) var(--kty-s-6);border:var(--kty-brand-outline) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);color:var(--kty-ink);text-decoration:none}
.v23 .v-job:hover{border-bottom-width:calc(var(--kty-lip-brand) - var(--kty-lip-press));transform:translateY(var(--kty-lip-press))}
.v23 .v-job__i{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--kty-s-12);height:var(--kty-s-12);border-radius:50%;background:var(--kty-brand-circle);font-size:2rem}
.v23 .v-job__t{font-family:var(--kty-font-body);font-size:var(--kty-lead);font-weight:700;line-height:1.3}
.v23 .v-jobs+.v-acc{margin-top:var(--kty-s-8)}
/* Outlined cards with a round photo and an icon badge (safety audiences). */
.v23 .v-pcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kty-grid-gap);max-width:var(--kty-w-brand);margin:0 auto;padding:0;list-style:none}
.v23 .v-pcards>li{display:flex;flex-direction:column;align-items:center;padding:var(--kty-s-7) var(--kty-s-5) var(--kty-s-6);border:var(--kty-outline-w) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);text-align:center}
.v23 .v-pcards__ph{position:relative;display:block}
.v23 .v-pcards__ph>img{display:block;width:var(--kty-s-13);height:var(--kty-s-13);border-radius:50%;object-fit:cover;background:var(--kty-gold-tint)}
.v23 .v-pcards__b{position:absolute;left:50%;bottom:calc(var(--kty-s-5) * -1);display:inline-flex;align-items:center;justify-content:center;width:var(--kty-s-9);height:var(--kty-s-9);border-radius:50%;background:var(--kty-brand-circle);color:var(--kty-ink);font-size:1.5rem;transform:translateX(-50%)}
.v23 .v-pcards__t{margin:var(--kty-s-8) 0 0;font-family:var(--kty-font-body);font-size:var(--kty-h3);font-weight:700;line-height:1.25}
.v23 .v-pcards__x{margin:var(--kty-s-1) 0 0;font-size:var(--kty-small);line-height:1.4}
.v23 .v-pcards+.v-more{margin-top:var(--kty-s-7)}
/* The emergency card: icon disc, a divider, numbered steps. */
.v23 .v-sos{display:flex;align-items:center;gap:var(--kty-s-7);max-width:var(--kty-w-read);margin:0 auto;padding:var(--kty-s-6) var(--kty-s-8);border:var(--kty-outline-w) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-r-lg);background:var(--kty-bg-white);color:var(--kty-ink)}
.v23 .v-sos__i{display:inline-flex;flex:none;align-items:center;justify-content:center;width:var(--kty-s-13);height:var(--kty-s-13);border-radius:50%;background:var(--kty-brand-circle);font-size:3rem}
.v23 .v-sos{align-items:stretch}
.v23 .v-sos__i{align-self:center}
.v23 .v-sos__rule{flex:none;width:var(--kty-outline-w);background:var(--kty-ink)}
.v23 .v-sos__l{flex:1;align-self:center;margin:0;padding:var(--kty-s-1) 0;list-style:none;counter-reset:sos}
.v23 .v-sos__l>li{position:relative;padding-left:var(--kty-s-8);counter-increment:sos}
.v23 .v-sos__l>li+li{margin-top:var(--kty-s-3)}
.v23 .v-sos__l>li::before{content:counter(sos);position:absolute;left:0;top:-.1em;color:var(--kty-lip-amber);font-family:var(--kty-font-display);font-size:1.75rem;font-weight:800;line-height:1}
.v23 .v-band.surf--forest .v-sos :is(strong,span){display:block;color:var(--kty-ink)}
.v23 .v-sos__l strong{font-family:var(--kty-font-body);font-size:var(--kty-lead);line-height:1.3}
.v23 .v-sos__l span{margin-top:var(--kty-s-1);font-size:var(--kty-small);line-height:1.4}
.v23 .v-sos+.v-notice{max-width:var(--kty-w-read);margin:var(--kty-s-6) auto 0}
/* Calendar chooser: one outlined bar, two selects and the button. */
.v23 .v-chooser{display:flex;align-items:center;justify-content:center;gap:var(--kty-s-5);max-width:var(--kty-w-brand);margin-inline:auto;padding:var(--kty-s-4) var(--kty-s-5);border:var(--kty-brand-outline) solid var(--kty-ink);border-bottom-width:var(--kty-lip-brand);border-radius:var(--kty-radius);background:var(--kty-bg-white)}
.v23 .v-chooser select{min-width:13rem;min-height:var(--kty-s-10);padding:0 var(--kty-s-4);border:var(--kty-outline-w) solid var(--kty-ink);border-radius:var(--kty-r-sm);background-color:var(--kty-bg-white);font-size:var(--kty-body);color:var(--kty-ink)}
.v23 .v-chooser .btn{min-height:var(--kty-s-10)}
.v23 .v-acts--center{justify-content:center}
.v23 .v-band>.v-wrap>h2+.v-acts--center{margin-top:var(--kty-s-6)}
@media (max-width:1023px){
  .v23 .v-duo,.v23 .v-pcards{grid-template-columns:minmax(0,1fr)}
  .v23 .v-iconrow--bare.cols-4,.v23 .v-numline.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v23 .v-numline::before{content:none}
}
@media (max-width:767px){
  .v23 .v-jobs,.v23 .v-jobs.cols-2,.v23 .v-numline.cols-3{grid-template-columns:minmax(0,1fr)}
  .v23 .v-circles--line::before{content:none}
  .v23 .v-frost__cal{inset:8% 5%;padding:var(--kty-s-6) var(--kty-s-3) var(--kty-s-3);gap:var(--kty-s-2)}
  .v23 .v-frost__l{max-width:4.5rem;font-size:var(--kty-small)}
  .v23 .v-sos{flex-direction:column;align-items:stretch;padding:var(--kty-s-6)}
  .v23 .v-sos__i{align-self:center}
  .v23 .v-sos__rule{width:auto;height:var(--kty-outline-w)}
  .v23 .v-sos__l{padding:0}
  .v23 .v-chooser{flex-direction:column;align-items:stretch}
  .v23 .v-chooser select{min-width:0;width:100%}
  .v23 .v-pairrow{padding-inline:var(--kty-s-4);gap:var(--kty-s-4)}
  .v23 .v-pairrow__th img{width:var(--kty-s-10);height:var(--kty-s-10)}
  .v23 .v-pairrow__t{font-size:var(--kty-lead)}
  .v23 .v-pairrow__t{font-size:var(--kty-body)}
  .v23 .v-pairrow>i{display:none}
  .v23 .v-pairrow{flex-wrap:wrap;row-gap:var(--kty-s-2);padding-block:var(--kty-s-4)}
  .v23 .v-pairrow__t{flex-basis:100%}
  .v23 .v-circles--sans .v-circles__t{font-size:1rem}
  .v23 .v-circles.v-circles--caption>li{flex-basis:100%}
  .v23 .v-circles--caption a{flex-direction:row;gap:var(--kty-s-4);text-align:left}
  .v23 .v-circles--caption img{flex:none;width:var(--kty-s-12);height:var(--kty-s-12)}
  .v23 .v-circles--caption .v-circles__t{margin:0;text-wrap:balance}
}