/* Knowledge follows the store's paper, ink and type. Dense facts stay close to their label. */
.knowledge-heading,.my-plants>.page-heading{max-inline-size:48rem}
.knowledge-search{display:flex;flex-wrap:wrap;align-items:end;gap:1rem;margin-block:2rem 3rem}
.knowledge-search label{flex:1 1 14rem;display:grid;gap:.4rem}
.knowledge-guide-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:0 3rem}
.knowledge-guide-list article{padding-block:1.6rem;border-block-start:1px solid var(--line);min-inline-size:0}
.knowledge-guide-list h3{font-size:clamp(1.35rem,2.4vw,1.8rem);line-height:1.25;margin-block:0 .75rem;text-wrap:balance}
.knowledge-guide-list h3 a{text-decoration:none}
.knowledge-guide-list p{max-inline-size:58ch;line-height:1.65}
.knowledge-guides{margin-block:3rem}
.knowledge-inclusion{font-size:.95rem;max-inline-size:48ch}
.knowledge-product{display:flex;flex-wrap:wrap;gap:clamp(2rem,5vw,5rem);margin-block:4rem;padding-block:2rem;border-block:1px solid var(--line)}
.knowledge-product-main{flex:2 1 28rem;min-inline-size:0}
.knowledge-product-specs{flex:1 1 17rem;min-inline-size:0}
.knowledge-product h2{margin-block-start:0}
.knowledge-product h3{margin-block:1.75rem .5rem}
.knowledge-facts{margin:1rem 0}
.knowledge-facts>div{display:grid;grid-template-columns:minmax(6.5rem,1fr) minmax(0,2fr);gap:1rem;padding-block:.8rem;border-block-end:1px solid var(--line)}
.knowledge-facts dt{font-weight:650}.knowledge-facts dd{margin:0;overflow-wrap:anywhere;line-height:1.6}
.knowledge-evidence,.knowledge-sources{font-size:.9rem;margin-block:1.4rem}
.knowledge-evidence dd{margin:0 0 1rem}.knowledge-evidence dd>p{margin-block:.35rem}
.knowledge-evidence dt{font-weight:650}.knowledge-evidence .knowledge-sources{margin-block:.5rem}
.knowledge-sources a{overflow-wrap:anywhere}
.knowledge-article{max-inline-size:48rem;margin-inline:auto;padding-block:clamp(1rem,4vw,3rem)}
.knowledge-article h1{font-size:clamp(2.2rem,5vw,3.75rem);line-height:1.1;text-wrap:balance}
.knowledge-standfirst{font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.6}
.knowledge-prose{font-size:1.1rem;line-height:1.8;margin-block:2.5rem}
.knowledge-prose h2{font-size:clamp(1.5rem,3vw,2rem);margin-block:2rem .6rem;line-height:1.2}
.knowledge-prose li+li{margin-block-start:.65rem}
.my-plants{max-inline-size:65rem;margin-inline:auto;overflow-wrap:anywhere}
.my-plants [hidden]{display:none!important}
.my-plants input,.my-plants select,.my-plants textarea,.knowledge-search input,.knowledge-search select{inline-size:100%;max-inline-size:100%;min-inline-size:0}
.plant-form-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:1rem;margin-block:1.25rem}
.plant-form-fields label{display:grid;gap:.35rem}.plant-form-wide{grid-column:1/-1}
.plant-form-fields p{align-self:center;margin:0}
.plant-editor{padding-block:1.25rem;border-block:1px solid var(--line);margin-block:1.5rem}
.plant-record{padding-block:1.75rem;border-block-end:1px solid var(--line)}
.plant-record header{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 1.5rem}
.plant-record h3{font-size:1.8rem;margin:0}.plant-record header p{margin:0}
.plant-record details{margin-block:1rem}.plant-record details form{padding-block:1rem}
.plant-record .knowledge-guides{margin-block:1rem}.plant-record .knowledge-guide-list h3{font-size:1.3rem}
.plant-care-log{padding-inline-start:1.5rem}.plant-care-log li{padding-block:.5rem}.plant-care-log p{margin-block:.3rem}
.plant-delete,.plant-delete-all{font-size:.9rem}.plant-delete-all{margin-block:2rem}
.plant-import{padding:1.25rem;border:1px solid var(--line);margin-block:1.25rem}
.plant-empty{padding-block:2rem}
.knowledge-product:empty{display:none}
@media(hover:hover) and (pointer:fine){.knowledge-guide-list h3 a:hover{text-decoration:underline;text-underline-offset:.15em}}
.my-plants button:active{transform:translateY(1px)}
.my-plants :is(button,input,textarea,select,a,summary):focus-visible,.knowledge-search :is(button,input,select):focus-visible,.knowledge-article a:focus-visible,.knowledge-guide-list a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}

.my-plants button.text-link{border:0;padding:0;background:transparent;color:inherit;text-decoration:underline;text-underline-offset:.2em}
