.handout-body { background: #f5f8f7; }
.handout-nav { border-bottom-color: var(--line); }
.handout-actions { align-items: center; display: flex; gap: 1rem; }
.handout-actions a { color: var(--muted); font-size: .9rem; text-decoration: none; }
.print-button, .clear-button {
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-weight: 750;
}
.print-button { background: var(--teal); color: var(--white); padding: .65rem 1rem; }
.clear-button { background: transparent; color: var(--teal); padding: .5rem .8rem; }
.handout { margin: 0 auto; max-width: 1180px; padding: 2.5rem 1.25rem 5rem; }
.handout-hero {
  align-items: center;
  background: var(--dark);
  border-radius: 1.5rem 1.5rem 0 0;
  display: grid;
  gap: 3rem;
  grid-template-columns: 1.5fr .5fr;
  min-height: 460px;
  overflow: hidden;
  padding: 4.5rem;
  position: relative;
}
.handout-hero::before {
  background: var(--teal-bright);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: .5rem;
}
.handout-hero .eyebrow { color: #9ee6dd; }
.handout-hero h1 {
  color: var(--white);
  font-size: clamp(2.8rem, 6vw, 5.25rem);
  max-width: 820px;
}
.handout-hero p { color: #c9f4ee; font-size: 1.2rem; max-width: 650px; }
.hero-stamp {
  aspect-ratio: 1;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(201,244,238,.3);
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  transform: rotate(-5deg);
}
.hero-stamp span { color: #c9f4ee; display: block; font-size: 1.05rem; font-weight: 800; line-height: 1.7; }
.handout-section {
  background: var(--white);
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 2rem;
  grid-template-columns: 70px 1fr;
  padding: 4.5rem;
}
.section-number { color: var(--teal-bright); font-size: 1.2rem; font-weight: 900; letter-spacing: .08em; padding-top: .2rem; }
.handout-section h2, .experiment-workbook h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
.section-lede { font-size: 1.1rem; max-width: 720px; }
.help-grid { display: grid; gap: .8rem; grid-template-columns: repeat(5, 1fr); margin-top: 2rem; }
.help-card {
  background: var(--mint);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  min-height: 190px;
  padding: 1.25rem;
  position: relative;
}
.help-card input { position: absolute; right: 1rem; top: 1rem; }
.help-icon { align-items: center; background: var(--white); color: var(--teal); display: flex; font-size: 1.2rem; font-weight: 900; height: 2.8rem; justify-content: center; width: 2.8rem; }
.help-card strong, .help-card small { display: block; }
.help-card strong { color: var(--dark); margin-bottom: .4rem; }
.help-card small { color: var(--muted); line-height: 1.4; }
.framework-section { background: #eff8f6; }
.framework-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin-top: 2.5rem; }
.framework-grid article { background: var(--white); border-top: 4px solid var(--teal-bright); box-shadow: var(--shadow); padding: 1.5rem; }
.framework-letter { align-items: center; background: var(--dark); border-radius: 50%; color: var(--white); display: flex; font-size: .9rem; font-weight: 900; height: 2.4rem; justify-content: center; width: 2.4rem; }
.framework-grid h3 { color: var(--teal); font-size: 1.25rem; margin-top: 1rem; }
.framework-grid textarea, .workbook-fields textarea, .workbook-fields input, .event-pick input {
  background: #f8fbfa;
  border: 1px solid var(--line);
  border-radius: .45rem;
  color: var(--ink);
  font: inherit;
  outline: none;
  padding: .9rem;
  resize: vertical;
  width: 100%;
}
.framework-grid textarea { min-height: 110px; }
textarea:focus, .workbook-fields input:focus, .event-pick input:focus { border-color: var(--teal-bright); box-shadow: 0 0 0 3px rgba(21,163,163,.12); }
.events-section .events-grid { margin-top: 2rem; }
.event-pick { display: block; margin-top: 2rem; max-width: 520px; }
.event-pick > span { color: var(--dark); display: block; font-weight: 800; margin-bottom: .45rem; }
.example-prompt { background: var(--dark); border-radius: .8rem; color: var(--white); margin-top: 2rem; padding: 2rem; }
.example-prompt p { color: #dff7f3; margin: 0; padding: .8rem 0; }
.example-prompt p + p { border-top: 1px solid rgba(201,244,238,.2); }
.example-prompt strong { color: #9ee6dd; display: inline-block; min-width: 105px; }
.tip { align-items: flex-start; display: flex; gap: 1rem; margin-top: 1.4rem; }
.tip span { background: var(--teal-bright); border-radius: 999px; color: var(--white); font-size: .75rem; font-weight: 900; padding: .25rem .7rem; text-transform: uppercase; }
.surface-map { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin-top: 2rem; }
.surface-map article { align-items: center; border: 1px solid var(--line); display: flex; gap: 1.2rem; padding: 1.4rem; }
.surface-map p { margin-bottom: 0; }
.map-icon { align-items: center; background: var(--mint); color: var(--teal); display: flex; flex: 0 0 3rem; font-weight: 900; height: 3rem; justify-content: center; }
.conversation-section { background: #f9fbfa; }
.conversation-path { counter-reset: none; display: grid; gap: 0; list-style: none; margin: 2rem 0 0; padding: 0; }
.conversation-path li { align-items: flex-start; border-bottom: 1px solid var(--line); display: flex; gap: 1.25rem; padding: 1.15rem 0; }
.conversation-path li > span { align-items: center; background: var(--mint); border-radius: 50%; color: var(--teal); display: flex; flex: 0 0 2.25rem; font-weight: 900; height: 2.25rem; justify-content: center; }
.conversation-path p { margin: .2rem 0 0; }
.verify-section { background: var(--dark); border-bottom: 0; color: var(--white); }
.verify-section .eyebrow { color: #9ee6dd; }
.verify-section h2 { color: var(--white); }
.verify-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); margin-top: 2rem; }
.verify-grid label { background: rgba(255,255,255,.07); cursor: pointer; display: flex; gap: .8rem; padding: 1.25rem; }
.verify-grid input { margin-top: .25rem; }
.verify-grid strong { color: #9ee6dd; display: block; margin-bottom: .25rem; }
.evidence-note { color: #c9f4ee; font-weight: 750; margin-top: 2rem; }
.experiment-workbook {
  background: var(--mint);
  border-radius: 0 0 1.5rem 1.5rem;
  padding: 4.5rem 7rem;
  text-align: center;
}
.experiment-workbook > p { font-size: 1.1rem; margin: 0 auto 2rem; max-width: 680px; }
.workbook-fields { background: var(--white); box-shadow: var(--shadow); display: grid; gap: 1rem; margin: 2.5rem auto; max-width: 820px; padding: 2rem; text-align: left; }
.workbook-fields label > span { color: var(--dark); display: block; font-weight: 800; margin-bottom: .45rem; }
.workbook-fields textarea { min-height: 90px; }
.commitment { align-items: center; display: flex; justify-content: center; gap: 1rem; }
.commitment label { color: var(--dark); font-weight: 750; }

@media (max-width: 850px) {
  .handout-hero { grid-template-columns: 1fr; padding: 3rem 2rem; }
  .hero-stamp { display: none; }
  .handout-section { grid-template-columns: 1fr; padding: 3rem 2rem; }
  .section-number { border-bottom: 1px solid var(--line); padding-bottom: .75rem; }
  .help-grid { grid-template-columns: repeat(2, 1fr); }
  .experiment-workbook { padding: 3rem 2rem; }
}
@media (max-width: 600px) {
  .handout-actions a { display: none; }
  .print-button { font-size: .8rem; }
  .framework-grid, .surface-map, .verify-grid, .help-grid, .events-grid { grid-template-columns: 1fr; }
  .commitment { align-items: flex-start; flex-direction: column; }
}
@media print {
  @page { margin: .45in; size: letter; }
  body { background: var(--white); font-size: 9.5pt; }
  .site-header, .handout-footer, .clear-button { display: none !important; }
  .handout { max-width: none; padding: 0; }
  .handout-hero { border-radius: 0; min-height: auto; padding: .4in; }
  .handout-hero h1 { font-size: 27pt; }
  .handout-hero p { font-size: 11pt; }
  .hero-stamp { max-width: 1.4in; }
  .handout-section { break-inside: avoid; grid-template-columns: .35in 1fr; padding: .28in .35in; }
  .handout-section h2, .experiment-workbook h2 { font-size: 19pt; margin-bottom: .12in; }
  .help-grid { grid-template-columns: repeat(5, 1fr); margin-top: .15in; }
  .help-card { min-height: 1.1in; padding: .1in; }
  .help-icon { height: .3in; width: .3in; }
  .framework-grid { gap: .1in; margin-top: .15in; }
  .framework-grid article { box-shadow: none; padding: .12in; }
  .framework-grid textarea { min-height: .55in; }
  .example-prompt { padding: .18in; }
  .surface-map, .verify-grid { gap: .1in; margin-top: .15in; }
  .conversation-path li { padding: .07in 0; }
  .experiment-workbook { border-radius: 0; break-before: page; padding: .4in; }
  .workbook-fields { box-shadow: none; margin: .2in auto; padding: .15in; }
  .workbook-fields textarea { min-height: .55in; }
  .events-section { break-before: page; }
  .events-grid { gap: .1in; margin-top: .15in; }
  .event-card { box-shadow: none; padding: .12in; }
  .event-card h3 { font-size: 11pt; margin: .06in 0 .04in; }
  .event-pick input { min-height: .3in; }
}