body:not(.auth-locked) #work-order-mobile-sheet #work-order-form {
  & [hidden] { display: none !important; }
  & .wo-progress { display: none; }
  &.wo-guided {
    & .report-form-topline { display: block; padding-block: 12px; }
    & .report-form-topline > div { display: none; }
    & #work-order-form-context { display: block; max-width: 760px; margin: 0 auto 12px; font-size: 13px; }
    & .wo-progress {
      display: flex;
      gap: 24px;
      list-style: none;
      padding: 0;
      margin: 0 auto;
      max-width: 760px;
      color: #60727c;
      font-size: 14px;
    }
    & .wo-progress li { display: flex; align-items: center; gap: 8px; }
    & .wo-progress span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #cad9de; border-radius: 50%; flex-shrink: 0; }
    & .wo-progress [aria-current] { color: #076e7a; font-weight: 700; }
    & .wo-progress [aria-current] span { background: #087f8c; border-color: #087f8c; color: #fff; }
    & .wo-progress .is-complete span { background: #e9f6f1; border-color: #9bcebc; color: #206b51; }
    & > .work-order-form-grid { display: block; padding-top: 24px !important; }
    & .work-order-form-column { display: none !important; }
    & .wo-step { width: 100%; max-width: 760px; margin-inline: auto; }
    & .wo-step h3 { margin: 0 0 24px; font-size: 24px; line-height: 1.3; }
    & .wo-step h3:focus { outline: none; }
    & .wo-step-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; min-width: 0; }
    & .wo-step-fields > * { grid-area: auto !important; order: 0; }
    & .work-order-form-section-heading, & .work-order-link-section-header { display: none; }
    & .work-order-form-section { display: grid; gap: 16px; }
    & .work-order-form-section-location .field-helper { display: none; }
    & .wo-step label { font-size: 14px; }
    & .wo-step input, & .wo-step select { min-height: 46px; }
    & .wo-step textarea { min-height: 116px; }
    & .work-order-form-section-crew { gap: 10px; }
    & .work-order-form-section-crew::before { content: 'Assigned crew (optional)'; font-size: 16px; font-weight: 600; }
    & .work-order-crew-picker:has(.empty-state) { display: none; }
    & .work-order-form-section-crew:has(.empty-state)::after { content: 'Unassigned'; grid-row: 2; color: #60727c; }
    & .work-order-crew-help { margin: 0; }
    & .work-order-photo-field-header { display: none; }
    & .work-order-form-section-media::before { content: 'Photos (optional)'; font-size: 16px; font-weight: 600; }
    & .work-order-photo-controls { order: 1; }
    & .work-order-photo-preview { order: 2; }
    & #clear-work-order-photo { order: 3; }
    & .wo-additional { border-top: 1px solid #dce6ea; padding-top: 18px; }
    & .wo-step-fields > .wo-additional { order: 10; }
    & .wo-additional summary { cursor: pointer; font-size: 15px; font-weight: 600; }
    & .wo-additional summary span { color: #60727c; font-weight: 400; margin-left: 8px; }
    & .wo-additional[open] .work-order-form-section-links { padding-top: 18px; }
    & .wo-review { margin: 0; }
    & .wo-review > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid #e2e9ec; }
    & .wo-review dt { color: #60727c; font-size: 14px; }
    & .wo-review dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
    & .wo-step-error { color: #a93028; background: #fff3f0; padding: 12px; border-left: 3px solid #bc4338; }
    & [aria-invalid=true] { border-color: #bc4338; }
    & .form-actions { flex-wrap: nowrap; }
    & #work-order-cancel { margin-right: auto; }
    & #wo-step-next { background: #087f8c; color: #fff; border: 1px solid #087f8c; box-shadow: none; }
    & #wo-step-next:hover { background: #066b76; }
  }
}
@media (max-width: 600px) {
  body:not(.auth-locked) #work-order-mobile-sheet #work-order-form.wo-guided {
    & .wo-progress { gap: 12px; justify-content: space-between; font-size: 12px; }
    & .wo-progress li { gap: 5px; }
    & .wo-progress span { width: 24px; height: 24px; }
    & .wo-step h3 { font-size: 22px; margin-bottom: 18px; }
    & .wo-review > div { grid-template-columns: minmax(0, 1fr); gap: 6px; }
    & .form-actions button { flex: 0 0 auto !important; width: auto !important; min-width: 0 !important; padding-inline: 10px; font-size: 13px; }
    & .form-actions #work-order-cancel { padding-inline: 0; }
  }
}
