/* Writing help is optional; labels, examples and existing validation stay intact. */
.staff-field-heading { display:flex; align-items:center; gap:7px; min-width:0; }
.staff-field-heading > label { margin:0; min-width:0; }
.staff-field-help { position:relative; flex:none; margin:0; }
.staff-field-help > summary {
  display:grid; place-items:center; width:24px; height:24px; padding:0;
  border:1px solid var(--ui-border, var(--line, #dbe3e8)); border-radius:50%;
  background:transparent; color:var(--muted, #66748b); font-size:12px; line-height:1;
  font-weight:600; cursor:pointer; list-style:none;
}
.staff-field-help > summary::-webkit-details-marker,
.staff-dialog-guide > summary::-webkit-details-marker,
.staff-readiness > summary::-webkit-details-marker { display:none; }
.staff-field-help[open] > summary,
.staff-field-help > summary:hover { color:var(--cyan-dark, #087b90); border-color:#12a5bc; }
.staff-field-help-body {
  position:absolute; z-index:12; inset-block-start:calc(100% + 7px); inset-inline-end:0;
  width:min(340px, calc(100vw - 56px)); padding:14px 16px;
  border:1px solid var(--ui-border, var(--line, #dbe3e8)); border-radius:12px;
  background:var(--surface, #fff); box-shadow:0 8px 24px #102b4614;
  color:var(--muted, #66748b); overflow-wrap:anywhere;
  max-block-size:min(440px, calc(100dvh - 64px)); overflow-y:auto; overscroll-behavior:contain;
}
.staff-field-help-copy { margin:0; font-size:13px; line-height:1.85; }
.staff-field-heading > .staff-field-help { margin-inline-start:auto; }
.staff-example { margin-block-start:8px; padding:0; border:0; background:transparent; }
.staff-example > summary { color:var(--cyan-dark, #087b90); font-size:13px; font-weight:500; cursor:pointer; padding-block:3px; }
.staff-example[open] { padding:12px 14px; border-inline-start:2px solid #12a5bc66; }
.staff-example-title { display:block; margin-block-start:4px; font-size:13px; line-height:1.8; color:var(--text, #263141); }
.staff-example-note { margin:5px 0; color:var(--muted, #66748b); font-size:12px; line-height:1.8; }
.staff-example-copy { white-space:pre-line; font-size:13px; line-height:1.85; margin:7px 0 10px; }
.staff-example-status:empty { display:none; }
.staff-field-help-body .staff-example { border-block-start:1px solid var(--ui-border, var(--line, #dbe3e8)); padding-block-start:8px; }
.staff-field-help-body .staff-outline-button { font-size:12px; min-height:34px; white-space:normal; text-align:start; }
.staff-dialog-guide,
.staff-readiness { margin:0 0 14px; padding:0; border:0; background:transparent; min-width:0; }
.staff-dialog-guide > summary,
.staff-readiness > summary {
  width:fit-content; max-width:100%; padding:4px 0; color:var(--muted, #66748b);
  font-size:13px; line-height:1.8; font-weight:500; list-style:none; cursor:pointer;
}
.staff-dialog-guide > summary::before,
.staff-readiness > summary::before { content:"+"; display:inline-block; margin-inline-end:7px; color:var(--cyan-dark, #087b90); }
.staff-dialog-guide[open] > summary::before,
.staff-readiness[open] > summary::before { content:"−"; }
.staff-dialog-guide .sheet-copy { margin:8px 0 0; padding:10px 12px; border-inline-start:2px solid #12a5bc55; }
.staff-dialog-guide .sheet-copy strong { display:block; font-size:13px; line-height:1.8; font-weight:500; }
.staff-dialog-guide .sheet-copy p { margin:4px 0 0; max-width:68ch; font-size:13px; line-height:1.9; color:var(--muted, #66748b); }
.staff-readiness { margin-block:12px; }
.staff-readiness > .help { font-size:13px; line-height:1.8; margin:8px 0; }
.staff-readiness-list { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 18px; padding:0; margin:10px 0; }
.staff-readiness-list > li { display:flex; align-items:center; gap:7px; font-size:13px; line-height:1.7; min-width:0; }
.staff-readiness-indicator { color:var(--muted, #66748b); flex:none; }
.staff-readiness-list > li[data-covered="true"] .staff-readiness-indicator { color:var(--success, #17856b); }
.staff-readiness-status { margin-inline-start:auto; font-size:12px; white-space:nowrap; color:var(--muted, #66748b); }
.staff-readiness-feedback { margin-block:10px; }
.staff-readiness .staff-details-button { min-height:34px; font-size:12px; }
:is(.staff-example, .staff-field-help, .staff-dialog-guide, .staff-readiness) > summary:focus-visible {
  outline:2px solid #12a5bc; outline-offset:4px; border-radius:4px;
}
@media (max-width:600px) {
  .staff-field-help > summary { width:30px; height:30px; }
  .staff-readiness-list { grid-template-columns:minmax(0,1fr); }
  .staff-outline-button { max-width:100%; white-space:normal; text-align:start; }
}
@media (prefers-reduced-motion:reduce) { .staff-readiness { scroll-behavior:auto; } }