[hidden] { display: none !important; }
.workspace { scroll-margin-top: 4.25rem; }
.workspace + .workspace:not([hidden]) { border-top: 1px solid var(--line); }
.workspace-grid { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.4fr); grid-template-areas: "intro intro" "tools example"; gap: 1.75rem clamp(2rem, 4.3vw, 4.4rem); align-items: start; }
.workspace-intro, .professional-intro { grid-area: intro; }
.workspace h2:focus:not(:focus-visible) { outline: none; }
.role-summary { font-size: 1.02rem; color: var(--muted); max-width: 88ch; margin-top: .65rem; }
.workspace-tools { grid-area: tools; border-right: 1px solid var(--line); padding-right: clamp(1.4rem, 2.7vw, 2.75rem); }
.workspace-tools > h3, .professional-tools > h3 { font-size: 1.24rem; font-weight: 600; margin-bottom: .9rem; }
.tool-list, .tool-list dd { margin: 0; }
.tool-list > div { border-top: 1px solid var(--line); padding-block: .88rem; }
.tool-list dt { font-family: var(--heading); font-size: 1rem; font-weight: 600; }
.tool-list dd { color: var(--muted); margin-top: .3rem; line-height: 1.56; font-size: .94rem; }
.role-demo { display: inline-block; padding-block: .65rem; margin-top: .25rem; }
.preview { grid-area: example; min-width: 0; }
.preview > h3 { color: var(--deep); font-size: clamp(1.55rem, 2.2vw, 2.2rem); margin: .5rem 0 .7rem; }
.preview-intro, .topic-panel > p { color: var(--muted); margin: 0 0 1rem; }
.choice-label { display: block; color: var(--deep); font-size: .92rem; font-weight: 650; margin-bottom: .4rem; }
select, textarea { display: block; width: 100%; font: inherit; color: var(--ink); background: white; border: 1px solid #80949c; border-radius: 0; }
select { min-height: 2.8rem; padding: .5rem .7rem; }
.example-output { margin-top: 1.1rem; border-top: 1px solid var(--line); padding: 1rem 0 0; }
.example-output h4, .example-output h5 { margin: 0 0 .6rem; font: 600 1.12rem/1.35 var(--heading); color: var(--ink); }
.example-output p + p { margin-top: .7rem; }
.agenda { margin: 0; padding: 0; list-style: none; }
.agenda li { display: grid; grid-template-columns: 3.7rem 1fr; gap: .5rem; padding-block: .55rem; border-top: 1px solid var(--line); }
.agenda time { font-weight: 650; color: var(--blue); font-variant-numeric: tabular-nums; }
.professional-grid { grid-template-areas: "intro" "example" "tools"; grid-template-columns: minmax(0,1fr); }
.professional-preview { display: grid; grid-template-columns: minmax(13.5rem, .72fr) minmax(0, 1.65fr); align-items: start; gap: clamp(1.5rem, 3.8vw, 4rem); }
.topic-picker, .preference-options { min-width: 0; margin: 0; padding: 0; border: 0; }
.topic-picker { padding-right: clamp(1rem, 2.6vw, 2.5rem); border-right: 1px solid var(--line); }
.topic-picker legend, .preference-options legend { font: 600 1rem/1.45 var(--heading); margin: 0 0 .7rem; padding: 0; color: var(--deep); }
.topic-options { border-top: 1px solid var(--line); }
.topic-options label { position: relative; display: flex; align-items: center; padding: .74rem .85rem; min-height: 2.8rem; border-bottom: 1px solid var(--line); border-left: 3px solid transparent; font-size: .94rem; font-weight: 550; line-height: 1.35; color: var(--ink); cursor: pointer; }
.topic-options label:hover { background: #f4f8f8; }
.topic-options label:has(:checked) { border-left-color: var(--teal); background: var(--teal-wash); color: var(--deep); font-weight: 700; }
.topic-options label:has(:checked)::after { content: ""; width: .42em; height: .42em; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); margin-left: auto; flex: none; }
.topic-options label:has(:focus-visible) { outline: 2px solid var(--deep); outline-offset: -2px; }
.topic-options input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.topic-detail { grid-column: 2; min-width: 0; }
.topic-picker[hidden] ~ .topic-detail { grid-column: 1/-1; }
.topic-panel:not([hidden]) + .topic-panel:not([hidden]) { margin-top: 1.5rem; }
.topic-panel > h4 { font-size: clamp(1.45rem, 2.15vw, 2.2rem); letter-spacing: -.035em; line-height: 1.18; margin-bottom: .65rem; color: var(--deep); }
.sample-wording { padding: .9rem 1.1rem; background: var(--teal-wash); }
.professional-tools { grid-area: tools; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.professional-tools .tool-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; }
.draft-label { margin-top: .9rem; }
textarea { min-height: 7rem; resize: vertical; padding: .7rem; line-height: 1.55; }
.preference-note ul { margin: 0; padding-left: 1.2rem; }
.preference-note li + li { margin-top: .45rem; }
.preference-note .empty-pref { list-style: none; margin-left: -1.2rem; }
@media (max-width: 52rem) {
  .workspace-grid { grid-template-columns: minmax(0,1fr); grid-template-areas: "intro" "example" "tools"; gap: 1.4rem; }
  .workspace-tools { border: 0; padding: 1.2rem 0 0; border-top: 1px solid var(--line); }
  .professional-preview { grid-template-columns: minmax(0,1fr); gap: 1.35rem; }
  .topic-picker { padding: 0; border: 0; }
  .topic-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topic-detail { grid-column: 1; }
}
@media (max-width: 36rem) {
  .professional-tools .tool-list { grid-template-columns: 1fr; }
  .topic-options label { padding: .6rem .45rem; font-size: .86rem; }
}
