/* Illustrations support the adjacent text. They do not show live plant readings. */
#ai-assistant .ai-graphic {
  display:block;
  inline-size:5rem;
  block-size:3.15rem;
  margin:0 0 .75rem;
  overflow:visible;
  color:#abe1db;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#ai-assistant .ai-graphic .figure-guide {
  stroke:#83abae;
  stroke-width:1.4;
  stroke-dasharray:2 5;
}
#ai-assistant .ai-graphic .figure-accent { fill:#ffb684; stroke:#ffb684; }
#ai-assistant .ai-graphic .figure-thumb { fill:#183239; }
#ai-assistant .ai-graphic .figure-frame { stroke:#83abae; stroke-width:1.6; }
#ai-assistant .ai-directions {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  list-style:none;
  padding:0;
  margin-block:1rem 0;
  gap:clamp(.9rem,2.2vw,1.6rem);
}
#ai-assistant .ai-directions > .ai-direction {
  min-inline-size:0;
  margin:0;
  padding-block-start:.95rem;
  border-block-start:1px solid #6b8c8d;
}
#ai-assistant .ai-direction .ai-graphic-label { margin:0; font-size:1.04rem; line-height:1.36; color:#f2f8f7; }
#ai-assistant .ai-direction p,
#ai-assistant .ai-direction dd { margin:.4rem 0 0; font-size:.98rem; line-height:1.5; color:#dce9e9; }
#ai-assistant .ai-direction * { overflow-wrap:break-word; }
@media(max-width:740px) {
  #ai-assistant .ai-directions {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:.9rem;
  }
  #ai-assistant .ai-direction {
    display:grid;
    grid-template-columns:3.45rem minmax(0,1fr);
    column-gap:.85rem;
    align-items:start;
  }
  #ai-assistant .ai-direction .ai-graphic {
    grid-area:1/1/span 2/2;
    inline-size:3.45rem;
    block-size:2.2rem;
    margin:.15rem 0 0;
  }
  #ai-assistant .ai-direction .ai-graphic-label { grid-area:1/2/2/3; }
  #ai-assistant .ai-direction .ai-graphic-copy { grid-area:2/2/3/3; }
}