/* Approved natural garden journal direction. */
:root{--paper:#faf9f5;--surface:#fdfcf8;--green:#264c37;--green-dark:#173e2b;--accent:#a74c2b;--line:#dce0d5}
body.hybrid{font-family:'Segoe UI',Arial,sans-serif;color:var(--green-dark);background:#edf2e9}
.hybrid main{max-width:1440px;padding-inline:40px}
.hybrid .siteheader{max-width:1520px;margin:auto;padding:22px 40px;gap:20px}
.hybrid .brand-wordmark{width:235px;height:auto}.hybrid .brand small{font-size:12px;letter-spacing:0}
.hybrid .primarynav a{font-size:14px;font-weight:400;padding:10px 8px}
.hybrid h1,.hybrid h2,.hybrid h3{letter-spacing:-.025em;font-weight:400}
.journal-opening{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:42px;margin-top:26px;align-items:stretch}
.hybrid .garden-hero{background:none;height:auto;margin:0;overflow:visible;isolation:auto}
.garden-hero:after{display:none}.hybrid .hero-copy{padding:0;max-width:none}
.hybrid .hero-copy h1{font-size:clamp(38px,4.3vw,64px);line-height:1.08;color:var(--green-dark);letter-spacing:-.03em;margin:0 0 16px}
.hybrid .hero-copy>p{color:var(--green);font-size:18px;line-height:1.5;max-width:none;margin:0 0 26px}
.hybrid .hero-photo{display:block;position:static;width:100%;height:480px;object-fit:cover;object-position:center;border-radius:3px}
.hybrid .home-plants{padding:12px 0 0;min-width:0;display:flex;flex-direction:column}
.hybrid .home-plants .section-heading h2{font:600 27px/1.2 'Segoe UI',Arial,sans-serif;letter-spacing:-.02em;margin-bottom:0}
.hybrid #heroLocation{display:flex;gap:10px;align-items:center;text-align:left;background:transparent;border:0;padding:8px 0;color:var(--green);font-size:14px;flex-wrap:wrap}
#heroLocation .hero-location-action{font-size:14px;text-decoration:underline}
.hybrid .home-plants>p{font-size:14px;line-height:1.5;margin:4px 0 15px}
.hybrid .home-category-controls{display:flex;gap:10px;margin:0 0 8px;flex-wrap:wrap}
.hybrid .home-category-controls>div{flex:1 1 145px}.hybrid .home-category-controls select{font-size:16px;min-height:44px;border:1px solid var(--line);border-radius:3px;padding:10px;background:#fff}
.hybrid .home-plant-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));column-gap:24px;row-gap:4px}
.hybrid .home-plant a{display:grid;grid-template-columns:100px minmax(0,1fr);grid-template-rows:auto auto;text-align:left;column-gap:18px;align-content:center;padding:9px 0;border:0;min-height:102px}
.hybrid .home-plant img{grid-row:1/3;width:100px;height:96px;aspect-ratio:auto;margin:0;object-fit:contain;align-self:center}
.hybrid .home-plant strong{align-self:end;font:600 19px/1.25 'Segoe UI',Arial,sans-serif;margin:0 0 5px}
.hybrid .home-plant span{font-size:14px;line-height:1.4;align-self:start}
#heroCalendar{display:inline-block;margin-top:16px;font-size:16px;text-underline-offset:5px}
#homeZoneComparison{margin:24px 0;font-size:14px}#homeZoneComparison summary{padding:12px 0}#homeZoneWindows .zone-showcase{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.hybrid .home-jobs{padding:42px 0 20px}.hybrid .home-jobs .section-heading h2{font-size:32px}.hybrid .home-jobs>p{margin-bottom:24px}
.hybrid .home-job-grid{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);gap:20px 38px}
.hybrid .home-job-grid .visual-job{background:none;border:0;border-radius:0;overflow:visible}
.hybrid .home-job-grid .visual-job a{padding:0;display:block}
.hybrid .home-job-grid .visual-job:first-child{grid-row:1/3}
.hybrid .home-job-grid .visual-job:first-child a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:24px;align-content:start}
.hybrid .home-job-grid .visual-job:first-child img{grid-column:2;grid-row:1/5;width:100%;height:245px;object-fit:cover;margin:0;border-radius:3px}
.hybrid .home-job-grid .visual-job:not(:first-child) img{display:none}
.hybrid .home-job-grid .visual-job h3{font-size:23px;line-height:1.2;margin:8px 0 12px}
.hybrid .home-job-grid .visual-job:first-child h3{font-size:34px}
.hybrid .home-job-grid .visual-job p{font-size:16px;line-height:1.55;display:block;margin:0}
.hybrid .home-job-grid .eyebrow{font-size:14px;color:var(--accent);letter-spacing:0}
.hybrid .garden-invitation{background:none;border:0;padding:20px 0;margin:15px 0}.hybrid .garden-invitation strong{font-size:24px}
/* Articles keep the original instructions, with preparation beside the image. */
.hybrid .howto-article{max-width:1180px;margin-inline:auto}
.hybrid .howto-article-heading{background:transparent;color:var(--green-dark);padding:12px 0 25px;margin:0;border:0;display:block}
.hybrid .howto-article-heading h1{color:var(--green-dark);font-size:clamp(38px,4.8vw,66px);line-height:1.08;margin:8px 0 16px}
.hybrid .howto-article-heading .profilelead{color:var(--green);font-size:21px;max-width:850px}
.hybrid .howto-article-heading .eyebrow{color:var(--accent);font-size:14px}
.guide-preparation{display:block;margin:8px 0 30px}.guide-preparation.has-image{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(230px,1fr);gap:32px;align-items:start}
.guide-preparation>img{display:block;width:100%;height:440px;object-fit:cover;border-radius:5px}.guide-preparation>img.botanical{object-fit:contain}
.guide-preparation-notes{display:grid;gap:28px}.guide-preparation:not(.has-image) .guide-preparation-notes{grid-template-columns:1fr 1fr;gap:45px}
.hybrid .howto-article .guide-preparation section{padding:0;display:block;margin:0}
.hybrid .howto-article .guide-preparation h2{font-size:27px;line-height:1.15;margin:0 0 14px}
.hybrid .guide-preparation ul{padding-left:20px}.hybrid .guide-preparation p,.hybrid .guide-preparation li{font-size:16px;line-height:1.55}
.hybrid .howto-article>section{display:block;padding:24px 0}
.hybrid .howto-article>section>h2{font-size:34px;margin:0 0 20px}
.hybrid .howto-article .guide-method>h2{border:0;padding:0;background:none;color:var(--green-dark)}
.hybrid .howto-steps li,.hybrid .howto-steps li:nth-child(even){background:none;border:0;padding:0 0 22px;min-height:0;font-size:18px;max-width:850px}
.hybrid .howto-steps li:before{display:none}.hybrid .howto-steps .method-lead{margin-bottom:5px}
.hybrid .howto-article>.guide-success,.hybrid .howto-article>.guide-mistakes{background:none;padding:22px 0;margin:0;border:0}
.hybrid .howto-article>.guide-mistakes h2{color:var(--accent)}
.hybrid .howto-article>.guide-related{border:0;margin-top:15px}
.hybrid .moisture-decision{background:none;border:0}.hybrid .moisture-decision dl{display:grid;gap:20px;margin:22px 0}.hybrid .moisture-decision dl>div{background:none;padding:0;border:0;display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px}.hybrid .moisture-decision dt{font:28px Georgia,serif;color:var(--accent)}.hybrid .moisture-decision dl>div:nth-child(2) dt{color:var(--green)}.hybrid .moisture-decision dd{margin:0;font-size:18px;line-height:1.5}
@media(max-width:1100px){.hybrid .siteheader{padding-inline:24px;gap:12px}.hybrid .brand-wordmark{width:200px}.journal-opening{gap:28px;grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}.hybrid .hero-photo{height:450px}.hybrid main{padding-inline:24px}.hybrid .home-job-grid .visual-job:first-child a{display:block}.hybrid .home-job-grid .visual-job:first-child img{margin-bottom:18px;height:220px}.guide-preparation.has-image{grid-template-columns:minmax(0,1.8fr) minmax(210px,1fr)}}
@media(max-width:760px){.hybrid main{padding-inline:20px}.journal-opening{display:flex;flex-direction:column;gap:26px;margin-top:22px}.hybrid .garden-hero,.hybrid .home-plants{width:100%}.hybrid .hero-copy h1{font-size:42px}.hybrid .hero-copy>p{font-size:17px;margin-bottom:20px}.hybrid .hero-photo{height:260px}.hybrid .home-plants{padding:0}.hybrid .home-plants .section-heading h2{font-size:27px}.hybrid .home-plant a{grid-template-columns:90px minmax(0,1fr);min-height:94px}.hybrid .home-plant img{width:90px;height:85px}.hybrid .home-jobs{padding-top:30px}.hybrid .home-jobs .section-heading h2{font-size:30px}.hybrid .home-job-grid{grid-template-columns:1fr;gap:26px}.hybrid .home-job-grid .visual-job:first-child{grid-row:auto}.hybrid .home-job-grid .visual-job:first-child h3{font-size:30px}.guide-preparation.has-image{grid-template-columns:1fr;gap:24px}.guide-preparation>img{height:280px}.guide-preparation-notes,.guide-preparation:not(.has-image) .guide-preparation-notes{grid-template-columns:1fr;gap:24px}.hybrid .howto-article-heading h1{font-size:42px}.hybrid .howto-article-heading .profilelead{font-size:19px}.hybrid .moisture-decision dl>div{display:block}.hybrid .moisture-decision dt{margin-bottom:8px}#homeZoneWindows .zone-showcase{grid-template-columns:1fr}.hybrid .garden-invitation{gap:14px}.hybrid .garden-invitation img{width:60px}.hybrid .siteheader{padding:14px 18px}.hybrid .brand-wordmark{width:190px}}

.hybrid .howto-article .guide-preparation section{border:0}

/* A rotating lead alongside the complete set of current seasonal jobs. */
.home-feature-layout{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);gap:38px;align-items:start}
.feature-lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:26px;align-items:start}
.feature-photo{grid-column:2;grid-row:1;display:block}.feature-photo img{display:block;width:100%;height:280px;object-fit:cover;border-radius:3px}
.feature-copy{grid-column:1;grid-row:1}.feature-label{font-size:14px;color:var(--accent);margin:0 0 12px}
.hybrid .feature-copy h3{font-size:32px;line-height:1.15;margin:0 0 14px}.feature-copy h3 a{color:inherit;text-decoration:none}.feature-copy h3 a:hover{text-decoration:underline}
.feature-copy>p:not(.feature-label){font-size:16px;line-height:1.55;margin:0 0 16px}.feature-when strong{display:block;margin-bottom:4px;font-weight:600}.feature-read{font-size:16px;text-underline-offset:4px}
.feature-jobs{display:grid;gap:24px}.feature-jobs article>a{color:inherit;text-decoration:none}.hybrid .feature-jobs h3{font:600 19px/1.3 'Segoe UI',Arial,sans-serif;margin:0 0 9px}.feature-jobs a:hover h3{text-decoration:underline}.feature-jobs p{font-size:16px;line-height:1.5;margin:0}.feature-jobs .feature-condition{font-size:14px;color:var(--muted);margin-top:8px}
@media(max-width:1100px){.feature-lead{display:flex;flex-direction:column;gap:20px}.feature-photo{width:100%}.feature-photo img{height:240px}}
@media(max-width:760px){.home-feature-layout{grid-template-columns:1fr;gap:30px}.hybrid .feature-copy h3{font-size:30px}.feature-jobs{gap:24px}}

/* Keep the signature together and centre calendar marks under their months. */
.hybrid .brand{align-items:flex-start;gap:0}
.brand-picture{display:block;width:100%}
.hybrid .brand .brand-vector{display:block;width:285px;max-width:100%;height:auto}
@media(max-width:1150px){.hybrid .brand .brand-vector{width:245px}}
@media(max-width:600px){.hybrid .brand .brand-vector{width:190px}}
.personal-row:not(.personal-heading)>span{width:28px;height:28px;justify-self:center}
.personal-heading>span{width:100%;max-height:none;justify-self:stretch}

.year-start-toggle{display:flex;flex-wrap:wrap;gap:0;margin:16px 0 14px}
.year-start-toggle button{font-size:14px;border-radius:0;background:transparent;border-color:var(--line);padding:7px 12px}
.year-start-toggle button:first-child{border-radius:5px 0 0 5px}
.year-start-toggle button:last-child{border-radius:0 5px 5px 0}
.year-start-toggle button[aria-pressed="true"]{background:var(--green);color:white;border-color:var(--green)}
.personal-row:not(.personal-heading)>.month-slot{width:100%;height:28px;aspect-ratio:auto;background:transparent;position:relative}
.month-mark{display:block;width:28px;height:28px;margin:auto;border-radius:3px;background:#edf0ea}
.month-mark.core{background:var(--green)}.month-mark.shoulder{background:var(--ochre-soft);border:1px dashed var(--ochre)}
.personal-row .year-boundary{position:relative}
.personal-row .year-boundary:before{content:"";position:absolute;left:0;top:-8px;bottom:-8px;border-left:1px solid #9aaa9b}

/* Plant profiles: keep the botanical opening, bring practical guidance closer. */
/* My Garden: clear editorial hierarchy and space around the calendar key. */
.hybrid #gardenCalendarPanel .legend{margin-bottom:20px;row-gap:8px}
.hybrid #gardenCalendarPanel .personal-heading{padding-block:14px}
.hybrid #gardenHowto .garden-help{background:transparent;border:0;border-top:2px solid var(--green);border-radius:0;padding:30px 0;margin:40px 0}
.garden-help-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px 28px;flex-wrap:wrap}
.hybrid .garden-help-heading h2{font-size:38px;line-height:1.12;margin:0}
.garden-help-season{font-size:16px;color:var(--muted);margin:0}
.hybrid .garden-help-intro{font-size:17px;line-height:1.6;max-width:68ch;margin:16px 0 28px}
.hybrid #gardenHowto .care-card{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr);gap:32px;margin:0;padding:26px 0;border-color:var(--line)}
.hybrid #gardenHowto h3{font-size:27px;line-height:1.2;margin:0}
.garden-job-copy{max-width:68ch;min-width:0}
.hybrid .garden-job-copy p{font-size:17px;line-height:1.65;margin:0 0 12px}
.hybrid .garden-job-copy .garden-job-condition{font-size:16px;color:var(--muted)}
.hybrid #gardenHowto .job-help{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-top:8px}
.hybrid #gardenHowto .howto-link{font-size:16px;font-weight:500;padding:9px 0;text-decoration-thickness:1px}
.garden-plant-help{border-top:1px solid var(--line);padding-top:26px;margin-top:4px}
.hybrid .garden-plant-help h3{margin-bottom:14px}
.garden-plant-help .general-techniques{margin:16px 0}
@media(max-width:760px){
  .hybrid #gardenHowto .care-card{grid-template-columns:1fr;gap:14px;padding:24px 0}
  .hybrid .garden-help-heading h2{font-size:32px}
  .hybrid #gardenHowto h3{font-size:25px}
}

.hybrid main>#profileView{padding-top:16px}
.hybrid #profileView .profileback{margin:0 0 12px}
.hybrid #profileView .profilehero{min-height:0;padding:0 24px 24px;gap:48px}
.hybrid #profileView .profilehero img{height:330px;width:100%;justify-self:center}
.hybrid #profileView .profilebody{margin-top:28px}
@media(max-width:900px){
  .hybrid #profileView .profilehero{padding-inline:0;gap:24px}
  .hybrid #profileView .profilehero img{height:280px}
}
@media(max-width:600px){
  .hybrid main>#profileView{padding-top:10px}
  .hybrid #profileView .profileback{margin-bottom:8px}
  .hybrid #profileView .profilehero{gap:12px;padding-bottom:20px}
  .hybrid #profileView .profilehero img{height:210px}
  .hybrid #profileView .profilehero h1{font-size:clamp(38px,10vw,58px);overflow-wrap:anywhere}
  .hybrid #profileView .profilelead{margin:12px 0 18px}
  .hybrid #profileView .profilebody{margin-top:22px}
}

/* Account forms share the site's existing garden palette and mobile spacing. */
.password-field{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.password-field input{flex:1;min-width:160px}
.password-field button{white-space:nowrap}
.account-page .account-form{max-width:480px}
.account-page p{max-width:620px}
.account-page .account-form .muted{margin:0 0 12px;font-size:.9rem}
.hybrid .primarynav .nav-create-account{border:1px solid currentColor;border-radius:5px;padding:8px 10px}
.account-form button:disabled{opacity:.65;cursor:wait}
[data-garden-save-status]{font-size:.9rem}


/* My Garden colour hierarchy — warmer neutrals, sage structure and restrained clay accents. */
.hybrid #gardenView{position:relative;isolation:isolate;padding-top:34px}
.hybrid #gardenView::before{
  content:"";
  position:absolute;
  z-index:0;
  top:0;
  left:-40px;
  right:-40px;
  height:100%;
  background:#edf2e9;
  pointer-events:none;
}
.hybrid #gardenView::after{
  content:"";
  position:absolute;
  z-index:0;
  right:-34px;
  top:-48px;
  width:330px;
  height:280px;
  background:url("../cutouts/basil.webp") center/contain no-repeat;
  opacity:.12;
  filter:saturate(.72);
  pointer-events:none;
}
.hybrid #gardenView>*{position:relative;z-index:1}
.hybrid #gardenView>h1{margin-top:0;margin-bottom:16px}
.hybrid #gardenView>h1+p{max-width:760px;font-size:18px;line-height:1.55;color:#35483f}
.hybrid #gardenView>h1+p+.muted{max-width:760px;margin-bottom:30px;font-size:15px;color:#68716b}
.hybrid #gardenView>.garden-browse{
  margin:0 0 28px;
  border:1px solid #d5ded1;
  border-radius:7px;
  background:#edf2eb;
}
.hybrid #gardenView>.garden-browse>summary{
  padding:15px 18px;
  color:var(--green-dark);
  font-weight:650;
}
.hybrid #gardenView>.garden-browse[open]>summary{border-bottom:1px solid #d5ded1}
.hybrid #gardenView>.garden-browse .gardenpicker{
  margin:0;
  padding:18px;
  border:0;
  border-radius:0 0 7px 7px;
  background:#f8faf6;
}
.hybrid #myGardenCount{margin:24px 0 30px;color:#3f4943;font-size:16px}
.hybrid #gardenCalendarPanel{color:#3f4943}
.hybrid #gardenCalendarPanel .garden-calendar-head{
  align-items:end;
  padding-top:23px;
  border-top:1px solid var(--line);
}
.hybrid #gardenCalendarPanel .garden-calendar-head h2{color:var(--green-dark)}
.hybrid #gardenCalendarPanel .garden-calendar-head>p{color:#68716b;font-weight:600}
.hybrid #gardenCalendarPanel .eyebrow{color:#78817b}
.hybrid #gardenCalendarPanel .year-start-toggle button:not([aria-pressed="true"]){
  background:#f7f5ef;
  border-color:#d7dbd1;
  color:#34463e;
}
.hybrid #gardenCalendarPanel .year-start-toggle button[aria-pressed="true"]{
  background:var(--green);
  border-color:var(--green);
  color:#fff;
}
.hybrid #gardenCalendarPanel .legend{gap:24px;color:#46514b}
.hybrid #gardenCalendarPanel .legend span:last-child:before{
  background:#f7e7de;
  border-color:var(--accent);
}
.hybrid #gardenCalendarPanel .personal-year{border-color:#d5dcd2;background:#fffdf9}
.hybrid #gardenCalendarPanel .personal-heading{background:#e8efe6;color:#30483d}
.hybrid #gardenCalendarPanel .personal-row:not(.personal-heading):nth-child(odd){background:#fffdf9}
.hybrid #gardenCalendarPanel .personal-row:not(.personal-heading):nth-child(even){background:#faf8f2}
.hybrid #gardenCalendarPanel .month-mark:not(.core):not(.shoulder){background:#eceeea}
.hybrid #gardenCalendarPanel .month-mark.shoulder{background:#f7e7de;border-color:var(--accent)}
.hybrid #gardenCalendarPanel .calendar-scroll-hint{color:#737b76}
.hybrid #gardenHowto .garden-help{border-top-color:var(--accent)}
.hybrid #gardenHowto .garden-help-season,
.hybrid #gardenHowto .garden-job-copy .garden-job-condition{color:#68716b}
.hybrid #gardenHowto .howto-link{color:var(--accent)}
@media(max-width:760px){
  .hybrid #gardenView{padding-top:22px}
  .hybrid #gardenView::before{left:-20px;right:-20px;height:100%}
  .hybrid #gardenView::after{right:-72px;top:-30px;width:240px;height:210px;opacity:.09}
  .hybrid #gardenView>h1+p{max-width:78%;font-size:17px}
  .hybrid #gardenView>.garden-browse{margin-bottom:22px}
  .hybrid #gardenCalendarPanel .garden-calendar-head{padding-top:18px}
  .hybrid #gardenCalendarPanel .legend{gap:12px 18px}
}


/* Header location control: compact trigger keeps account navigation and location tools in balance. */
.hybrid .header-location-control{flex:0 0 170px;max-width:170px;margin-left:auto}
.hybrid .header-find-zone{
  width:100%;
  min-height:48px;
  display:grid;
  gap:2px;
  align-content:center;
  justify-items:start;
  padding:8px 11px;
  background:transparent;
  color:var(--green-dark);
  border:1px solid #b9c4b8;
  border-radius:7px;
  text-align:left;
}
.hybrid .header-find-zone strong{font-size:14px;line-height:1.2}
.hybrid .header-find-zone span{font-size:11px;line-height:1.2;color:var(--muted);font-weight:400}
.hybrid .header-find-zone:hover{background:#f1f4ed}
.hybrid #headerLocation{width:100%;max-width:170px}
@media(min-width:1401px){
  .hybrid .siteheader{
    display:grid;
    grid-template-columns:minmax(245px,285px) minmax(0,1fr) 170px;
    align-items:center;
    column-gap:24px;
  }
  .hybrid .primarynav{margin:0;justify-self:center;min-width:0}
  .hybrid .header-location-control{margin:0;justify-self:end}
}
@media(max-width:900px){
  .hybrid .header-location-control{flex-basis:170px;max-width:170px}
}
@media(max-width:600px){
  .hybrid .header-location-control{order:4;flex:1 0 100%;max-width:none;margin:8px 0 0}
  .hybrid .header-find-zone{max-width:220px}
}

/* Account settings save state should be visible beside the action that caused it. */
.hybrid .settings-save-status{
  min-height:1.5em;
  margin:10px 0 0;
  color:#66716a;
  font-size:14px;
  font-weight:600;
}
.hybrid #settingsSaveButton[data-saved="true"]{
  background:#edf2eb;
  border-color:#adc0b0;
  color:var(--green-dark);
}


/* Account page — calmer, clearer, and consistent with The Garden Hand. */
.hybrid .account-page{
  max-width:920px;
  margin:36px auto 64px;
  padding:42px 46px 46px;
  background:var(--surface);
  border:1px solid #d7dfd5;
  border-radius:12px;
  box-shadow:none;
}
.hybrid .account-page>.eyebrow{
  margin-bottom:10px;
  color:#6d7e73;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:none;
}
.hybrid #accountTitle{
  max-width:760px;
  margin:0 0 16px;
  font-size:clamp(42px,5vw,60px);
  line-height:1.03;
  letter-spacing:-.035em;
}
.hybrid #accountIntro{
  margin:0 0 22px;
  color:#44574e;
  font-size:18px;
  line-height:1.55;
}
.hybrid #accountStatus{
  max-width:none;
  margin:0 0 28px;
  padding:12px 14px;
  border-left:3px solid #9eb8a3;
  background:#eef3ec;
  color:#405249;
  font-size:15px;
}
.hybrid #accountStatus:empty{display:none}
.hybrid #accountSignedIn{
  display:grid;
  grid-template-columns:minmax(220px,280px) minmax(0,1fr);
  column-gap:44px;
  align-items:start;
}
.hybrid .account-identity{
  grid-column:1;
  grid-row:1 / 4;
  padding:24px;
  background:#edf2eb;
  border-top:3px solid var(--green);
}
.hybrid .account-greeting{
  margin:0 0 22px;
  font:30px/1.1 Georgia,serif;
  color:var(--green-dark);
}
.hybrid .account-email-label{
  margin:0 0 4px;
  color:#728078;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.hybrid .account-email{
  margin:0 0 24px;
  color:#34473e;
  font-size:15px;
  overflow-wrap:anywhere;
}
.hybrid .account-garden-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 16px;
  text-decoration:none;
}
.hybrid .account-settings-heading{
  grid-column:2;
  margin:0 0 8px;
}
.hybrid .account-settings-heading h2{
  margin:0 0 8px;
  font-size:30px;
  line-height:1.15;
}
.hybrid .account-settings-heading p{
  margin:0;
  color:#627067;
  font-size:15px;
  line-height:1.55;
}
.hybrid #settingsForm{
  grid-column:2;
  max-width:none;
  margin:18px 0 0;
  gap:11px;
}
.hybrid .account-page .account-form{
  max-width:600px;
}
.hybrid .account-page .account-form>label:not(.consent-row){
  margin-top:3px;
  color:#344c40;
}
.hybrid .account-page .account-form input:not([type=checkbox]){
  min-height:48px;
  background:#fffefb;
  border-color:#8fa396;
}
.hybrid .consent-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:12px;
  align-items:start;
  margin:10px 0 8px;
  padding:16px;
  background:#f3f6f0;
  border:1px solid #d9e2d7;
  border-radius:7px;
  color:#34473e;
  cursor:pointer;
}
.hybrid .consent-row input[type="checkbox"]{
  width:20px;
  min-width:20px;
  height:20px;
  min-height:20px;
  margin:2px 0 0;
  padding:0;
  accent-color:var(--green);
  box-shadow:none;
}
.hybrid .consent-row span{display:grid;gap:4px}
.hybrid .consent-row strong{
  font-size:16px;
  line-height:1.3;
  color:var(--green-dark);
}
.hybrid .consent-row small{
  display:block;
  color:#627067;
  font-size:14px;
  font-weight:400;
  line-height:1.5;
}
.hybrid .account-page .primarybutton{
  background:var(--green);
  border-color:var(--green);
  color:white;
  border-radius:5px;
}
.hybrid .account-page .primarybutton:hover{
  background:var(--green-dark);
  border-color:var(--green-dark);
}
.hybrid .account-page .settings-save-status{
  min-height:1.4em;
  margin:2px 0 0;
  color:#5f6e65;
  font-size:14px;
  font-weight:600;
}
.hybrid .account-page #settingsSaveButton[data-saved="true"]{
  background:#e7efe6;
  border-color:#a8bca9;
  color:var(--green-dark);
}
.hybrid .account-security{
  grid-column:2;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
  margin-top:26px;
  padding-top:20px;
  border-top:1px solid var(--line);
  font-size:14px;
}
.hybrid .account-security .textbutton{
  min-height:0;
  padding:0;
  color:#5d6d64;
  text-decoration:underline;
  text-underline-offset:3px;
}
.hybrid #createAccountPanel .consent-row{max-width:600px}
@media(max-width:760px){
  .hybrid .account-page{
    margin:22px auto 40px;
    padding:28px 24px 32px;
  }
  .hybrid #accountTitle{font-size:clamp(38px,10vw,50px)}
  .hybrid #accountSignedIn{display:block}
  .hybrid .account-identity{margin:0 0 30px}
  .hybrid .account-settings-heading{margin-top:0}
  .hybrid #settingsForm{margin-top:16px}
  .hybrid .account-security{margin-top:24px}
}


/* Header QA: keep navigation state in the core Garden Hand green. */
.hybrid .primarynav a[aria-current="page"]{border-bottom-color:var(--green)}

/* Keep plant-page actions consistent with the approved Garden Hand controls. */
.hybrid #profileAdd{background:var(--green);border-color:var(--green);color:#fff}
.hybrid #profileAdd:hover{background:var(--green-dark);border-color:var(--green-dark)}

/* Keep help discoverable and respect the reader's motion preference. */
.hybrid .footer-support{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:20px}
.hybrid .footer-support a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
.hybrid .menu-toggle{min-width:44px;min-height:44px}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Keep deletion feedback prominent and adjacent to the action it explains. */
.hybrid #deleteAccountStatus:not(:empty){display:block;width:100%;box-sizing:border-box;margin:12px 0 4px;padding:14px 16px;border:1px solid #b98562;border-left:4px solid #8b451f;border-radius:6px;background:#fff3e8;color:#653216;font-size:16px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.hybrid #deleteAccountStatus:empty{display:none}


/* Owner review: clearer hierarchy, calmer typography and less green saturation. */
:root{
  --ink:#3f4944;
  --ink-soft:#68716b;
  --warm-panel:#f5f1e8;
  --sage-panel:#edf2eb;
}
body.hybrid{color:var(--ink)}
.hybrid main h1{color:var(--green-dark)}
.hybrid main h2,.hybrid main h3{color:var(--ink)}
.hybrid .muted{color:var(--ink-soft)}
.hybrid label{color:#3e4b45}

/* Serif remains for page-level editorial titles; interface and section headings use the UI face. */
.hybrid #profileView h2,
.hybrid #profileView h3,
.hybrid .garden-calendar-head h2,
.hybrid .garden-help-heading h2,
.hybrid #gardenHowto h3,
.hybrid .account-settings-heading h2,
.hybrid .reconcile h2,
.hybrid .home-jobs .section-heading h2{
  font-family:'Segoe UI',Arial,sans-serif;
  font-weight:600;
  letter-spacing:-.02em;
}
.hybrid #profileView .windowlabel{
  font-family:'Segoe UI',Arial,sans-serif;
  font-weight:600;
  color:var(--ink);
}
.hybrid #profileView .profilelead{color:#53615a}
.hybrid #profileView .timingpanel{
  background:var(--warm-panel);
  border-top-color:#aebcaf;
}
.hybrid #profileView .profile-howto{
  background:#f7f3ea;
}
.hybrid #profileView .growingguide p,
.hybrid #profileView .timingpanel p{color:var(--ink)}
.hybrid .maintenance{background:#f3f1e9}

/* Garden reconciliation is a blocking decision, so show it before routine account settings. */
.hybrid .garden-choice{
  margin:8px 0 30px;
  padding:24px 26px;
  border:1px solid #ddd6c8;
  border-left:4px solid var(--green);
  border-radius:8px;
  background:#f7f3ea;
}
.hybrid .garden-choice h2{
  margin:0 0 10px;
  font-size:28px;
  line-height:1.15;
}
.hybrid .garden-choice>p{margin:0 0 18px;color:#56615b}
.hybrid .garden-choice fieldset{
  margin:16px 0;
  border:1px solid #d7ddd4;
  border-radius:7px;
  background:#fffefb;
}
.hybrid .garden-choice legend{font-weight:600;color:var(--ink)}
.hybrid .garden-choice .reconcile-actions{gap:10px 12px}
.hybrid .garden-choice .reconcile-actions button:not(.primarybutton){
  background:#fffefb;
  border-color:#c4ccc4;
  color:var(--ink);
}
.hybrid .account-page.needs-garden-choice #accountSignedIn{display:none!important}
.hybrid .account-page.needs-garden-choice #accountStatus{
  margin-bottom:14px;
  background:#f2f3ef;
  border-left-color:#a8b2aa;
  color:#56615b;
}

@media(max-width:760px){
  .hybrid .garden-choice{padding:20px 18px}
  .hybrid .garden-choice h2{font-size:25px}
}

/* Route headings receive focus for screen-reader navigation, without a control outline. */
.hybrid main h1[tabindex="-1"]:focus{outline:none}

/* Use the compact header before the full navigation runs out of room. */
@media(max-width:1400px){
  .hybrid .siteheader{display:flex;flex-wrap:wrap}
  .hybrid .menu-toggle{display:block;background:transparent;border:0;font-size:24px;flex-shrink:0}
  .hybrid .primarynav{display:none;order:5;flex:0 0 100%;min-width:0;margin:0}
  .hybrid.nav-open .primarynav{display:flex}

  .hybrid .primarynav{
    flex-direction:column;
    flex-wrap:nowrap;
    align-items:stretch;
    width:100%;
    gap:4px;
    padding:12px 0 0;
    border-top:1px solid var(--line);
    background:transparent;
  }
  .hybrid .primarynav a{
    display:flex;
    align-items:center;
    min-height:44px;
    padding:12px 14px;
    white-space:normal;
    border:0;
    border-radius:5px;
  }
  .hybrid .primarynav a[aria-current="page"]{
    background:#e8efe6;
    border:0;
    font-weight:600;
  }
  .hybrid .primarynav .nav-create-account{margin-top:4px;padding:12px 14px}
}

/* Account entry for My Garden uses the same simple actions on every screen. */
.hybrid .garden-account-gate{max-width:680px;padding:26px;background:#edf2eb;border-color:#d5ded1}
.hybrid .garden-account-gate h2{margin-top:0;font:600 27px/1.2 'Segoe UI',Arial,sans-serif}
.garden-account-actions{display:flex;align-items:center;gap:24px;margin:22px 0}
.garden-account-actions a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:600px){
 .garden-account-actions{align-items:stretch;flex-direction:column;gap:8px}
 .garden-account-actions a{justify-content:center}
 .hybrid .garden-account-gate{padding:22px 18px}
}

/* Introduce My Garden alongside the homepage's opening gardening content. */
.hybrid .home-garden-invitation{display:grid;grid-template-columns:70px minmax(0,1fr);align-items:center;gap:18px;margin:0 0 24px;padding:20px 22px;background:#edf2eb;border:1px solid #d5ded1;border-radius:6px}
.home-garden-invitation>img{width:70px;height:88px;object-fit:contain}
.hybrid .home-garden-invitation h2{font:600 25px/1.2 'Segoe UI',Arial,sans-serif;letter-spacing:-.02em;margin:0 0 9px}
.hybrid .home-garden-invitation p{font-size:16px;line-height:1.5;color:#46564d;margin:0}
.home-garden-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin-top:14px}
.home-garden-actions a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;text-underline-offset:4px}
.hybrid #homeGardenAction{background:var(--green);color:#fff;padding:10px 15px;border-radius:5px;text-decoration:none;line-height:1.4}
.hybrid #homeGardenAction:hover{background:var(--green-dark)}
.hybrid .garden-hero .hero-photo{height:360px}
@media(max-width:760px){
 .hybrid .home-garden-invitation{grid-template-columns:minmax(0,1fr);padding:18px;margin-bottom:20px}
 .home-garden-invitation>img{display:none}
 .hybrid .home-garden-invitation h2{font-size:24px}
 .hybrid .garden-hero .hero-photo{height:220px}
}


/* Balance the featured plants against the hero on desktop and Chromebook widths. */
@media(min-width:761px){
  .hybrid .home-plant-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:18px;
    row-gap:8px;
    flex:1;
    min-height:0;
    align-content:space-evenly;
  }
  .hybrid .home-plant a{grid-template-columns:72px minmax(0,1fr);column-gap:12px;min-height:96px;padding:8px 0}
  .hybrid .home-plant img{width:72px;height:78px}
  .hybrid .home-plant strong{font-size:17px;margin-bottom:4px}
  .hybrid .home-plant span{font-size:13px;line-height:1.38}
  .hybrid #heroCalendar{align-self:flex-start;margin-top:10px;margin-bottom:4px}
}

/* Homepage usability improvements: richer plant cards and useful onward paths. */
.hybrid .home-plant span{color:#526159}
.hybrid .home-explore{padding:44px 0 56px;border-top:1px solid var(--line)}
.hybrid .home-explore .section-heading{margin-bottom:20px}
.hybrid .home-explore .section-heading h2{font-size:32px}
.home-explore-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.home-explore-grid a{display:flex;flex-direction:column;gap:9px;min-height:150px;padding:22px 24px;background:#f5f7f1;border:1px solid #d7dfd2;border-radius:6px;color:var(--green-dark);text-decoration:none}
.home-explore-grid a:hover{background:#edf2e9}
.home-explore-grid strong{font:600 21px/1.25 'Segoe UI',Arial,sans-serif}
.home-explore-grid span{font-size:15px;line-height:1.5;color:#526159}
@media(max-width:900px){.home-explore-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.hybrid .home-explore{padding:34px 0 42px}.home-explore-grid{grid-template-columns:1fr;gap:12px}.home-explore-grid a{min-height:0;padding:19px 20px}}


/* Header menu should sit directly on the site background. */
.hybrid .primarynav{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}


/* Garden Hand social links. */
.hybrid .footer-social{margin-top:14px}
.hybrid .footer-social>span{display:block;color:var(--ink);font-size:13px;font-weight:600}
.hybrid .footer-social-links{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:5px}
.hybrid .footer-social-links a{display:inline-flex;align-items:center;min-height:32px;color:var(--green);text-underline-offset:3px}
.hybrid .footer-social-links a:hover{color:var(--green-dark)}